/* CVs sheet (2026-11-06, round 135): the variants' own values, on top of the product's stylesheet (assets/product.css,
   captured from /resumes). Everything here is prefixed `cv-`; the page chrome (rail, top bar, ground, heading, Add CV)
   is the product's own markup and classes. Numbers are the product's language: the hairline 15% → 50% on hover, cards
   36 on the ground and 28 inside a card, Sora 600 for titles, Figtree 16/24 for text, plates 48 / r14 with a 24 glyph. */
:root {
  --cv-ink: #0F131A; --cv-muted: #0F131A9E; --cv-muted-strong: #0F131AC9; --cv-line: #0F131A26; --cv-line-hover: #0F131A80;
  --cv-divider: #E8ECF0; --cv-danger: #B3261E; --cv-warning: #B4690E; --cv-success: #157F41;
  --cv-blue-bg: #EDF2FD; --cv-blue: #5A88EF; --cv-violet-bg: #F2ECFD; --cv-violet: #936BF0; --cv-green-bg: #E3FCEE; --cv-green: #10A44E;
}

/* The content under the heading: 16 on a phone, 32 from 640 (the page's `mt-4 sm:mt-8`). */
.cv-body { margin-top: 16px; }
@media (min-width: 640px) { .cv-body { margin-top: 32px; } }

/* ── Shared pieces ────────────────────────────────────────────────────────────────────────────── */
.cv-hair { border: 1px solid var(--cv-line); background-clip: padding-box; background-color: #fff; }
.cv-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; min-height: 24px; }
.cv-pct { font-size: 16px; line-height: 24px; font-weight: 600; }
.cv-pct.is-low { color: var(--cv-danger); } .cv-pct.is-mid { color: var(--cv-warning); } .cv-pct.is-high { color: var(--cv-success); }
.cv-pill { display: inline-flex; align-items: center; height: 28px; padding: 0 12px; border-radius: 9999px; font-size: 14px; line-height: 1; font-weight: 600; }
.cv-pill.is-tailored { background: #EEF1F5; color: var(--cv-ink); }
.cv-pill.is-reading { background: var(--cv-warning); color: #fff; }
.cv-pill.is-failed { background: var(--cv-danger); color: #fff; }
.cv-title { margin: 0; font-family: Sora, Figtree, sans-serif; font-weight: 600; color: var(--cv-ink); overflow-wrap: break-word; }
.cv-title a { color: inherit; text-decoration: none; }
.cv-upd { margin: 0; font-size: 16px; line-height: 24px; color: var(--cv-muted); }
.cv-note { margin: 0; font-size: 16px; line-height: 24px; color: var(--cv-muted); }
.cv-note.is-error { color: var(--cv-danger); }

/* Buttons: a circle with a glyph (--bs, --ig), or a pill with a glyph and a label. Delete in the danger red on the same
   grey line ("Yes, cancel" of the dialogs). Hover: the line 15% → 50%, mouse only. */
.cv-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--gap, 12px); }
.cv-ib { flex: none; display: inline-flex; align-items: center; justify-content: center; width: var(--bs); height: var(--bs); border-radius: 9999px; border: 1px solid var(--cv-line); background: #fff; color: var(--cv-ink); cursor: pointer; transition: border-color 150ms; }
.cv-ib > svg { width: var(--ig); height: var(--ig); }
.cv-pb { flex: none; display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: var(--bs); padding: 0 var(--px, 24px); border-radius: 9999px; border: 1px solid var(--cv-line); background: #fff; color: var(--cv-ink); font: 400 16px/1.1 Figtree, sans-serif; white-space: nowrap; cursor: pointer; transition: border-color 150ms; }
.cv-pb > svg { flex: none; width: var(--pg, 16px); height: var(--pg, 16px); }
.cv-ib.is-danger, .cv-pb.is-danger { color: var(--cv-danger); }
@media (hover: hover) { .cv-ib:hover, .cv-pb:hover, .cv-slot-btn.is-line:hover { border-color: var(--cv-line-hover); } }
/* Fixed stroke: the glyph drawn at any size with the set's own 1.5 line (the toggle "линия 1.5"). */
.stroke-fixed .cv-ib > svg * { vector-effect: non-scaling-stroke; stroke-width: 1.5px; }

/* ── A: one white plate, the cards in a column ────────────────────────────────────────────────── */
/* The plate is Settings' panel: 36, the hairline, 56 / 40 in from `lg` (24 at md). On a phone it runs to the screen's
   edges (a Settings section there is the whole white screen), its top corners 28, 16 in. */
.cv-a-plate { border-radius: 36px; padding: 16px; }
@media (max-width: 767.98px) { .cv-a-plate { margin: 0 calc(-1 * var(--page-x, 16px)); border-width: 1px 0 0; border-radius: 28px 28px 0 0; min-height: calc(100dvh - 180px); } }
@media (min-width: 768px) { .cv-a-plate { padding: 24px; } }
@media (min-width: 1024px) { .cv-a-plate { padding: 56px 40px; } }
.cv-a-col { max-width: 1100px; margin: 0 auto; display: flex; flex-direction: column; gap: 16px; }
@media (min-width: 768px) { .cv-a-col { gap: 24px; } }
.cv-a-card { border-radius: 28px; padding: 24px; display: grid; grid-template-columns: minmax(0, 1fr); row-gap: 24px; --bs: 48px; --ig: 24px; --gap: 12px; }
@media (min-width: 768px) {
  .cv-a-card { padding: 72px; grid-template-columns: minmax(0, 1fr) auto; column-gap: 48px; align-items: center; --bs: 64px; --ig: var(--a-ig, 48px); --gap: 16px; }
  .cv-a-card .cv-pb { --px: 28px; }
}
.cv-a-card .cv-title { margin-top: 8px; font-size: 20px; line-height: 28px; }
.cv-a-card .cv-upd { margin-top: 8px; }
.cv-a-card .cv-note { margin-top: 12px; max-width: 680px; }
@media (min-width: 768px) {
  .cv-a-card .cv-title { font-size: 28px; line-height: 36px; }
  .cv-a-card .cv-pill { height: 32px; padding: 0 14px; font-size: 16px; }
}

/* ── B and C: tiles ───────────────────────────────────────────────────────────────────────────── */
/* The tile is a Settings hub card grown into a document card: the plate 48 / r14 with its 24 glyph in the corner (the
   CV's origin: blue an upload, violet typed by hand, green a tailored copy), the state on the plate's line at the right,
   the title Sora 600 22 on 1.4 (20 / 28 below `lg`) 24 under the plate, "Updated" 6 under it, the buttons at the foot. */
.cv-tile { display: flex; flex-direction: column; min-width: 0; padding: 32px; border-radius: 28px; }
@media (min-width: 640px) { .cv-tile { padding: 48px; } }
.cv-tile-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.cv-plate48 { flex: none; display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: 14px; }
.cv-plate48 > svg { width: 24px; height: 24px; }
.cv-plate48.is-upload { background: var(--cv-blue-bg); color: var(--cv-blue); }
.cv-plate48.is-hand { background: var(--cv-violet-bg); color: var(--cv-violet); }
.cv-plate48.is-tailored { background: var(--cv-green-bg); color: var(--cv-green); }
.cv-tile-top .cv-meta { justify-content: flex-end; }
.cv-tile .cv-title { margin-top: 24px; font-size: 20px; line-height: 28px; }
@media (min-width: 1024px) { .cv-tile .cv-title { font-size: 22px; line-height: 1.4; } }
.cv-tile .cv-upd { margin-top: 6px; }
.cv-tile .cv-note { margin-top: 16px; }
.cv-tile-foot { margin-top: auto; padding-top: 32px; }
/* The preview of the CV's own content (B2, and B1 / C with "превью"): who, the summary in 3 lines, the latest job,
   the skills as chips — the fuller the CV, the more of it there is. 24 under the head, over the divider's line. */
.cv-prev { margin-top: 24px; padding-top: 24px; border-top: 1px solid var(--cv-divider); }
.cv-prev-who { margin: 0; font-size: 16px; line-height: 24px; font-weight: 600; color: var(--cv-ink); }
.cv-prev-role { margin: 0; font-size: 16px; line-height: 24px; color: var(--cv-muted-strong); }
.cv-prev-sum { margin: 12px 0 0; font-size: 16px; line-height: 24px; color: var(--cv-muted); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.cv-prev-latest { margin: 12px 0 0; font-size: 16px; line-height: 24px; color: var(--cv-muted-strong); }
.cv-chips { margin-top: 16px; display: flex; flex-wrap: wrap; gap: 8px; }
.cv-chip { display: inline-flex; align-items: center; height: 32px; padding: 0 12px; border-radius: 9999px; border: 1px solid var(--cv-line); font-size: 14px; line-height: 20px; color: var(--cv-muted-strong); }
.cv-prev-empty { margin: 0; font-size: 16px; line-height: 24px; color: var(--cv-muted); }

/* The button sets for the tiles (the toggle "кнопки"): circles 48 / 24 or 56 / 28, pills 46 or 40 with a 16 glyph. */
.btn-c48 .cv-tile { --bs: 48px; --ig: 24px; --gap: 12px; }
.btn-c56 .cv-tile { --bs: 56px; --ig: 28px; --gap: 12px; }
.btn-p46 .cv-tile { --bs: 46px; --gap: 12px; --px: 24px; }
.btn-p40 .cv-tile { --bs: 40px; --gap: 8px; --px: 16px; }
@media (max-width: 639.98px) { .cv-tile { --px: 16px; } }

/* B: the same plate and 1100 column as A, two tiles a row from 768 (24 apart), one below. */
.cv-b-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }
@media (min-width: 768px) { .cv-b-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; } }
.cv-b-grid.is-equal { grid-auto-rows: 1fr; }
.cv-mason { display: flex; gap: 24px; align-items: flex-start; }
.cv-mason > .cv-mcol { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; gap: 24px; }
@media (max-width: 767.98px) { .cv-mason { flex-direction: column; gap: 16px; } .cv-mason > .cv-mcol { width: 100%; gap: 16px; } }

/* C: no plate — each tile a card on the ground, the corner 30 (or the product's 36), 24 apart, the block 1488 at most
   (the container's own width). C3: three a row from 1280, two from 768; C2: two from 768. */
.cv-c-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }
@media (min-width: 768px) { .cv-c-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; } }
@media (min-width: 1280px) { .cv-c-grid.is-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.cv-c-grid .cv-tile { border-radius: var(--cr, 30px); }
/* The empty page: the places of the cards to come, outlined, no fill — the hairline, or a dashed 1.5 line at 25%. The
   first carries the two ways in (today's empty card); the others are the outline alone. As tall as a short tile. */
.cv-slot { min-height: 316px; border-radius: var(--cr, 30px); border: 1px solid var(--cv-line); display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 48px 32px; }
.slot-dashed .cv-slot { border: 1.5px dashed #0F131A40; }
@media (max-width: 767.98px) { .cv-slot:not(:first-child) { display: none; } .cv-slot { min-height: 0; padding: 40px 24px; } }
@media (min-width: 768px) and (max-width: 1279.98px) { .cv-c-grid.is-3 > .cv-slot:nth-child(3) { display: none; } }
.cv-slot-mark { display: inline-flex; align-items: center; justify-content: center; width: 64px; height: 64px; border-radius: 9999px; background: #2563EB26; color: #2563EB; }
.cv-slot-mark > svg { width: 32px; height: 32px; }
.cv-slot h2 { margin: 24px 0 0; font-family: Sora, Figtree, sans-serif; font-weight: 600; font-size: 22px; line-height: 1.4; color: var(--cv-ink); }
.cv-slot p { margin: 6px 0 0; font-size: 16px; line-height: 24px; color: var(--cv-muted); max-width: 320px; }
.cv-slot-btns { margin-top: 24px; display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; }
.cv-slot-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 46px; padding: 0 24px; border-radius: 9999px; font: 400 16px/1.1 Figtree, sans-serif; white-space: nowrap; cursor: pointer; }
.cv-slot-btn > svg { width: 16px; height: 16px; }
.cv-slot-btn.is-line { border: 1px solid var(--cv-line); background: transparent; color: var(--cv-ink); transition: border-color 150ms; }
.cv-slot-btn.is-ink { border: 0; background: var(--cv-ink); color: #fff; }

/* ── Г (D): mine ──────────────────────────────────────────────────────────────────────────────── */
/* The completeness map — Personalization's progress row (ui/progress-bar: 6 high, 6 apart, the answered green, the
   ink at 7% idle), one segment per group of `completenessOf`, done when the group is full; under it the groups as rows
   with the question marks' circle (filled green when full, the ink-25% outline when not). */
.cv-map { display: flex; gap: 6px; }
.cv-map > span { flex: 1 1 0; height: 6px; border-radius: 9999px; background: #0F131A12; }
.cv-map > span.is-done { background: var(--cv-green); }
.cv-parts { margin-top: 16px; }
.cv-part { display: flex; align-items: center; gap: 12px; padding: 12px 0; border-top: 1px solid var(--cv-divider); font-size: 16px; line-height: 24px; }
.cv-part:first-child { border-top: 0; }
.cv-part-mark { flex: none; width: 24px; height: 24px; color: #0F131A40; }
.cv-part-mark.is-done { color: var(--cv-green); }
.cv-part-mark.is-done svg path:first-child { fill: currentColor; }
.cv-part-mark.is-done svg path:last-child { stroke: #fff; }
.cv-part-mark > svg { width: 24px; height: 24px; }
.cv-part-name { flex: 1 1 auto; color: var(--cv-ink); }
.cv-part-state { color: var(--cv-muted); }
.cv-part-link { color: var(--cv-ink); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--cv-line-hover); }
.cv-big-pct { font-family: Sora, Figtree, sans-serif; font-weight: 600; font-size: 40px; line-height: 48px; }
.cv-big-pct + span { margin-left: 8px; font-size: 16px; line-height: 24px; color: var(--cv-muted); }
.cv-prime { --bs: 46px; --px: 24px; --pg: 16px; }
.cv-pb.is-ink { background: var(--cv-ink); border-color: var(--cv-ink); color: #fff; }

/* Г1 — a shelf of documents: each CV a page of itself (A4, 1 : 1.414) drawn at 600 wide and scaled to its tile.
   Round 137 (owner): the state rides ON the page's top edge as coloured index tabs, edge to edge — "% filled" in the
   badge plate of its band (the Liked green from 80, the Interview orange from 50, the Rejected red below; Reading… the
   orange, Failed the red), then Tailored in the neutral grey — 16 in from the page's corner (12 on a phone); the menu ⋮
   on the page's bottom-right corner, 8 from both edges (Applications' card button: 36, the hairline, nav.kebab 20); the
   caption 16 in (12); a pointer over the page darkens it to the Applications card's hover. 2 a row on a phone, 3 from
   768, 4 from 1280, 5 from 1668. */
.cv-d1-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 16px; }
@media (min-width: 768px) { .cv-d1-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px 24px; } }
@media (min-width: 1280px) { .cv-d1-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (min-width: 1668px) { .cv-d1-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
.cv-d1-item { --inset: 12px; --doc-r: 16px; min-width: 0; }
@media (min-width: 768px) { .cv-d1-item { --inset: 16px; --doc-r: 20px; } }
.cv-tabs { position: relative; z-index: 0; display: flex; height: 20px; padding-left: var(--inset); margin-bottom: -1px; }
@media (min-width: 768px) { .cv-tabs { height: 24px; } }
.cv-tab { display: inline-flex; align-items: center; height: 100%; padding: 0 8px; border-radius: 8px 8px 0 0; font-size: 12px; line-height: 1; font-weight: 600; white-space: nowrap; }
@media (min-width: 768px) { .cv-tab { padding: 0 12px; border-radius: 10px 10px 0 0; font-size: 14px; } }
.cv-tab.is-high { background: #E3FCEE; color: #157F41; }
.cv-tab.is-mid, .cv-tab.is-reading { background: #FCF1E3; color: #7F5115; }
.cv-tab.is-low, .cv-tab.is-failed { background: #FCE4E3; color: #B4251D; }
.cv-tab.is-tailored { background: #EEF0F3; color: #41464D; }
.cv-d1-page { position: relative; z-index: 1; }   /* round 139: the page's line over the tabs' foot */
.cv-doc { position: relative; display: block; aspect-ratio: 1 / 1.4142; border-radius: var(--doc-r, 20px); overflow: hidden; }
/* Round 140 (owner): the hover fills the page again — lighter than Applications' card (≈4% ink): the ink at --hva laid
   over the page's white (and over the ground for Add CV), over ⋮ too; the lines stay. The lines INSIDE a page (the
   empty CV's and the reading one's bars, the sections' rules) are the ink at an alpha too, so they darken with the
   fill instead of melting into it: the bars the product's ink-fill (7%), the rules 9%. */
/* Round 141 (owner): 2.5%, on the timing of Applications' card — `transition-colors duration-base ease-standard` and the
   product's "hover in, hover out": in on 220ms, out on 300, cubic-bezier(0.4, 0, 0.2, 1). Round 140's layer was a
   gradient, and a gradient does not transition — it switched at once; so the fill is the background colour now: the
   page's white with the ink at --hva laid over it, worked out in page.js as a plain rgb() (--hvc; 2.5% → 249 249.1
   249.3) — a plain rgb() so the browser blends it in sRGB as it does Applications' #F5F6F6 (to a color-mix() Chrome
   blends in OKLab); Add CV's the ink at --hva over the ground. */
.cv-d1-page > a.cv-doc { transition: background-color 300ms cubic-bezier(0.4, 0, 0.2, 1); }
@media (hover: hover) {
  .cv-d1-page:hover > a.cv-doc { transition-duration: 220ms; }
  .cv-d1-page:hover > a.cv-doc.cv-hair { background-color: var(--hvc, rgb(249, 249.1, 249.3)); }
  .cv-d1-page:hover > a.cv-doc.is-add { background-color: rgba(15, 19, 26, var(--hva, .025)); }
}
.cv-d1-page.is-hov > a.cv-doc.cv-hair { background-color: var(--hvc, rgb(249, 249.1, 249.3)); }
.cv-d1-page.is-hov > a.cv-doc.is-add { background-color: rgba(15, 19, 26, var(--hva, .025)); }
.cv-doc-in { position: absolute; left: 0; top: 0; width: 600px; height: 849px; transform-origin: 0 0; transform: scale(var(--s, 0.4)); padding: 64px 60px; color: var(--cv-ink); font-family: Figtree, sans-serif; }
.cv-doc-name { font: 600 36px/44px Sora, sans-serif; }
.cv-doc-role { margin-top: 6px; font-size: 20px; line-height: 28px; color: var(--cv-muted-strong); }
.cv-doc-contact { margin-top: 10px; font-size: 15px; line-height: 22px; color: var(--cv-muted); }
.cv-doc-h { margin-top: 36px; padding-bottom: 8px; border-bottom: 1px solid rgba(15, 19, 26, .09); font-size: 14px; line-height: 18px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--cv-muted); }
.cv-doc-p { margin-top: 12px; font-size: 16px; line-height: 24px; color: var(--cv-muted-strong); }
.cv-doc-bar { height: 16px; border-radius: 8px; background: rgba(15, 19, 26, .07); margin-top: 14px; }
.cv-doc-center { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 24px; gap: 8px; font-size: 14px; line-height: 20px; color: var(--cv-muted); }
.cv-doc-center > svg { width: 32px; height: 32px; color: var(--cv-danger); }
.cv-doc.is-add { display: flex; align-items: center; justify-content: center; border: 1.5px dashed #0F131A40; background: transparent; transition: border-color 150ms; }
@media (hover: hover) { .cv-doc.is-add:hover { border-color: var(--cv-line-hover); } }
.cv-doc.is-add:has(> .cv-dash) { border: 0; }
.cv-dash { position: absolute; inset: 0; width: 100%; height: 100%; color: #0F131A40; pointer-events: none; transition: color 150ms; }
.cv-doc.is-add .cv-plus { display: inline-flex; align-items: center; justify-content: center; width: 56px; height: 56px; border-radius: 9999px; background: var(--cv-ink); color: #fff; }
.cv-doc.is-add .cv-plus > svg { width: 24px; height: 24px; }
.cv-kebab { position: absolute; right: 8px; bottom: 8px; display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 9999px; border: 1px solid var(--cv-line); background: #fff; color: var(--cv-ink); cursor: pointer; transition: border-color 300ms cubic-bezier(0.4, 0, 0.2, 1); }
.cv-kebab > svg { width: 20px; height: 20px; }
@media (hover: hover) { .cv-kebab:hover { border-color: var(--cv-line-hover); transition-duration: 220ms; } }   /* round 141: Applications' button timing */
.cv-d1-cap { margin-top: 12px; padding-left: var(--inset); }
@media (min-width: 768px) { .cv-d1-cap { margin-top: 16px; } }
.cv-d1-cap .cv-title { font-size: 16px; line-height: 22px; }
@media (min-width: 768px) { .cv-d1-cap .cv-title { font-size: 18px; line-height: 24px; } }
.cv-d1-sub { margin: 4px 0 0; font-size: 14px; line-height: 20px; color: var(--cv-muted); }

/* Г2 — the main CV and its versions: the fullest of your own CVs (not a tailored copy) as a wide card — what it is and
   its buttons on the left, its completeness on the right (the map and the five groups, "Fill in" where one is short) —
   then "Tailored for jobs" and "Other CVs" as rows on one plate. */
.cv-d2-hero { border-radius: 36px; padding: 32px; display: grid; gap: 40px; }
@media (min-width: 768px) { .cv-d2-hero { padding: 48px; } }
@media (min-width: 1024px) { .cv-d2-hero { grid-template-columns: minmax(0, 1fr) minmax(0, 440px); column-gap: 64px; } }
.cv-d2-hero .cv-title { margin-top: 24px; font-size: 22px; line-height: 30px; }
@media (min-width: 768px) { .cv-d2-hero .cv-title { font-size: 28px; line-height: 36px; } }
.cv-d2-hero .cv-upd { margin-top: 8px; }
.cv-d2-hero .cv-actions { margin-top: 32px; }
.cv-d2-who { margin-top: 24px; }
.cv-d2-h { margin: 56px 0 0; font: 600 22px/1.4 Sora, sans-serif; color: var(--cv-ink); }
.cv-d2-sub { margin: 6px 0 0; font-size: 16px; line-height: 24px; color: var(--cv-muted); }
.cv-rows { margin-top: 24px; border-radius: 36px; padding: 8px 24px; }
@media (min-width: 768px) { .cv-rows { padding: 8px 48px; } }
.cv-row { display: grid; grid-template-columns: 48px minmax(0, 1fr); column-gap: 16px; row-gap: 16px; align-items: start; padding: 24px 0; border-top: 1px solid var(--cv-divider); --bs: 48px; --ig: 24px; --px: 20px; }
.cv-row:first-child { border-top: 0; }
.cv-row > .cv-actions { grid-column: 1 / -1; }
@media (min-width: 768px) { .cv-row { grid-template-columns: 48px minmax(0, 1fr) auto; } .cv-row > .cv-actions { grid-column: auto; align-self: center; } }
.cv-row .cv-title { font-size: 18px; line-height: 24px; }
.cv-row .cv-upd { margin-top: 2px; font-size: 14px; line-height: 20px; }
.cv-row .cv-note { margin-top: 6px; font-size: 14px; line-height: 20px; }

/* Г3 — as Settings: the CVs as the hub's cards on the left (28 in, the plate, the title Sora 600 22, its line 6 under,
   the arrow 28 in the corner; the open one outlined in ink), the open CV on the right panel — Settings' panel, its
   content 672 at most. On a phone the list alone (a CV is its own screen there, as a Settings section). */
.cv-d3 { display: flex; gap: 12px; align-items: flex-start; }
.cv-d3-nav { width: 100%; display: flex; flex-direction: column; gap: 10px; }
@media (min-width: 768px) { .cv-d3-nav { width: 320px; flex: none; gap: 12px; } }
@media (min-width: 1280px) { .cv-d3-nav { width: 448px; } }
.cv-d3-card { position: relative; display: block; padding: 27px; border-radius: 36px; text-decoration: none; color: inherit; }
.cv-d3-card.is-on { border-color: var(--cv-ink); }
@media (max-width: 767.98px) { .cv-d3-card.is-on { border-color: var(--cv-line); } }
.cv-d3-card .cv-title { margin-top: 36px; font-size: 20px; line-height: 28px; }
@media (min-width: 1024px) { .cv-d3-card .cv-title { font-size: 22px; line-height: 1.4; } }
.cv-d3-line { margin: 6px 0 0; font-size: 16px; line-height: 24px; color: var(--cv-muted); }
.cv-d3-line .cv-pct, .cv-d3-line .cv-pill { vertical-align: 1px; }
.cv-d3-arrow { position: absolute; top: 27px; right: 27px; width: 28px; height: 28px; color: var(--cv-muted); }
.cv-d3-arrow > svg { width: 28px; height: 28px; }
.cv-d3-panel { display: none; flex: 1 1 auto; min-width: 0; border-radius: 36px; padding: 24px; position: sticky; top: 24px; }
@media (min-width: 768px) { .cv-d3-panel { display: block; } }
@media (min-width: 1024px) { .cv-d3-panel { padding: 56px 40px; } }
.cv-d3-in { max-width: 672px; margin: 0 auto; }
.cv-d3-in .cv-title { margin-top: 24px; font-size: 28px; line-height: 36px; }
.cv-d3-in .cv-upd { margin-top: 8px; }
.cv-d3-in .cv-actions { margin-top: 32px; }
.cv-d3-h { margin: 48px 0 0; font: 600 20px/28px Sora, sans-serif; color: var(--cv-ink); }
.cv-d3-in .cv-map { margin-top: 16px; }

.cv-d3-in .cv-prev { margin-top: 16px; padding-top: 0; border-top: 0; }

/* Г1 · "Add CV" tile variants (owner, round 138): a) the plate bigger, in the lines' ink at a low alpha (--aa, 7% = the
   product's ink-fill, the progress track), the glyph black and bigger — 72 / 32, 88 / 40, 104 / 48; b) with "Add CV"
   (and its line) under the sign, as in draft 1. On a phone, as the rest of Г1 there (tabs ×0.86, caption ×0.89, corner
   ×0.8): the plates 56 / 26, 72 / 32, 84 / 38, the text 14 / 20 and 12 / 16, 10 under the sign. */
.cv-add-in { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 0 12px; }
.cv-doc.is-add .cv-plus.is-tint { background: rgba(15, 19, 26, var(--aa, .07)); color: var(--cv-ink); }
.cv-doc.is-add .cv-plus.p72 { width: 56px; height: 56px; } .cv-doc.is-add .cv-plus.p72 > svg { width: 26px; height: 26px; }
.cv-doc.is-add .cv-plus.p88 { width: 72px; height: 72px; } .cv-doc.is-add .cv-plus.p88 > svg { width: 32px; height: 32px; }
.cv-doc.is-add .cv-plus.p104 { width: 84px; height: 84px; } .cv-doc.is-add .cv-plus.p104 > svg { width: 38px; height: 38px; }
.cv-add-t { margin-top: 10px; font-size: 14px; line-height: 20px; font-weight: 600; color: var(--cv-ink); }
.cv-add-s { margin-top: 2px; font-size: 12px; line-height: 16px; color: var(--cv-muted); }
.cv-add-line { margin-top: 0; }
@media (min-width: 768px) {
  .cv-doc.is-add .cv-plus.p72 { width: 72px; height: 72px; } .cv-doc.is-add .cv-plus.p72 > svg { width: 32px; height: 32px; }
  .cv-doc.is-add .cv-plus.p88 { width: 88px; height: 88px; } .cv-doc.is-add .cv-plus.p88 > svg { width: 40px; height: 40px; }
  .cv-doc.is-add .cv-plus.p104 { width: 104px; height: 104px; } .cv-doc.is-add .cv-plus.p104 > svg { width: 48px; height: 48px; }
  .cv-add-in { padding: 0 16px; }
  .cv-add-t { margin-top: 12px; font-size: 16px; line-height: 24px; }
  .cv-add-s { margin-top: 4px; font-size: 14px; line-height: 20px; }
}

/* Round 139 (owner): the tab palettes to choose from (`tabc=`), all from the product's colours —
   t0  the badge plates, the badge text (what it is now: L 94);
   w1  the badge dots under white text — #10A44E / #C87A14 / #ED4E45, grey #657081 (white on them 3.3 / 3.2 / 3.6 / 5.0);
   w2  the status colours under white text — #157F41 / #B4690E / #B3261E, the neutral text #41464D (5.1 / 4.2 / 6.5 / 9.5);
   k1  the plates' recipe a step darker, L 82 (S 82), under the ink — #ABF7CC / #F7D6AB / #F7AFAB / #CCD0D7 (ink 15 / 13 / 10 / 12);
   k2  two steps, L 70 — #74F1AA / #F1BB74 / #F17A74 / #A9B1BC (ink 13 / 11 / 6.9 / 8.6). */
.tabs-w1 .cv-tab { color: #fff; } .tabs-w1 .cv-tab.is-high { background: #10A44E; } .tabs-w1 .cv-tab.is-mid, .tabs-w1 .cv-tab.is-reading { background: #C87A14; }
.tabs-w1 .cv-tab.is-low, .tabs-w1 .cv-tab.is-failed { background: #ED4E45; } .tabs-w1 .cv-tab.is-tailored { background: #657081; }
.tabs-w2 .cv-tab { color: #fff; } .tabs-w2 .cv-tab.is-high { background: #157F41; } .tabs-w2 .cv-tab.is-mid, .tabs-w2 .cv-tab.is-reading { background: #B4690E; }
.tabs-w2 .cv-tab.is-low, .tabs-w2 .cv-tab.is-failed { background: #B3261E; } .tabs-w2 .cv-tab.is-tailored { background: #41464D; }
.tabs-k1 .cv-tab { color: var(--cv-ink); } .tabs-k1 .cv-tab.is-high { background: #ABF7CC; } .tabs-k1 .cv-tab.is-mid, .tabs-k1 .cv-tab.is-reading { background: #F7D6AB; }
.tabs-k1 .cv-tab.is-low, .tabs-k1 .cv-tab.is-failed { background: #F7AFAB; } .tabs-k1 .cv-tab.is-tailored { background: #CCD0D7; }
.tabs-k2 .cv-tab { color: var(--cv-ink); } .tabs-k2 .cv-tab.is-high { background: #74F1AA; } .tabs-k2 .cv-tab.is-mid, .tabs-k2 .cv-tab.is-reading { background: #F1BB74; }
.tabs-k2 .cv-tab.is-low, .tabs-k2 .cv-tab.is-failed { background: #F17A74; } .tabs-k2 .cv-tab.is-tailored { background: #A9B1BC; }

/* Round 139 (owner): ⋮ bigger (`kb=`), 8 from the corner still. Desktop 40 / 20, 44 / 24, 48 / 24, 52 / 28, 56 / 28; on a
   phone Г1's ratio (≈0.86): 36 / 20, 40 / 20, 40 / 24, 44 / 24, 48 / 24. */
.kb-40 .cv-kebab { width: 36px; height: 36px; } .kb-40 .cv-kebab > svg { width: 20px; height: 20px; }
.kb-44 .cv-kebab { width: 40px; height: 40px; } .kb-44 .cv-kebab > svg { width: 20px; height: 20px; }
.kb-48 .cv-kebab { width: 40px; height: 40px; } .kb-48 .cv-kebab > svg { width: 24px; height: 24px; }
.kb-52 .cv-kebab { width: 44px; height: 44px; } .kb-52 .cv-kebab > svg { width: 24px; height: 24px; }
.kb-56 .cv-kebab { width: 48px; height: 48px; } .kb-56 .cv-kebab > svg { width: 24px; height: 24px; }
@media (min-width: 768px) {
  .kb-40 .cv-kebab { width: 40px; height: 40px; } .kb-40 .cv-kebab > svg { width: 20px; height: 20px; }
  .kb-44 .cv-kebab { width: 44px; height: 44px; } .kb-44 .cv-kebab > svg { width: 24px; height: 24px; }
  .kb-48 .cv-kebab { width: 48px; height: 48px; } .kb-48 .cv-kebab > svg { width: 24px; height: 24px; }
  .kb-52 .cv-kebab { width: 52px; height: 52px; } .kb-52 .cv-kebab > svg { width: 28px; height: 28px; }
  .kb-56 .cv-kebab { width: 56px; height: 56px; } .kb-56 .cv-kebab > svg { width: 28px; height: 28px; }
}

/* Round 140 (owner): "Add CV" 80 / 36 in the ink; on a phone in Г1's ratio there (the plate 72 / 88 = 0.82, the glyph
   0.8): 65.6 → 66, 28.8 → 28 (the grid of 4, of 2 where 4 misses by 1.5 or more). */
.cv-doc.is-add .cv-plus.p80 { width: 66px; height: 66px; } .cv-doc.is-add .cv-plus.p80 > svg { width: 28px; height: 28px; }
@media (min-width: 768px) { .cv-doc.is-add .cv-plus.p80 { width: 80px; height: 80px; } .cv-doc.is-add .cv-plus.p80 > svg { width: 36px; height: 36px; } }

/* Round 140 (owner): k1 with a calmer green — k1's green (#ABF7CC) was the brightest and most saturated of the four
   (OKLab L .915, C .096 against the orange's .893 / .067) — and the red a touch lighter (L 82 → 84, #F8B8B5). The greens,
   by the orange's chroma: k1a #B5E3C9 (C .060), k1b #B3E6C9 (.066 — the orange's), k1c #B0E8C8 (.072). The orange and
   the grey stay k1's. Ink on all of them 11–13.4. */
.tabs-k1a .cv-tab, .tabs-k1b .cv-tab, .tabs-k1c .cv-tab { color: var(--cv-ink); }
.tabs-k1a .cv-tab.is-high { background: #B5E3C9; } .tabs-k1b .cv-tab.is-high { background: #B3E6C9; } .tabs-k1c .cv-tab.is-high { background: #B0E8C8; }
:is(.tabs-k1a, .tabs-k1b, .tabs-k1c) .cv-tab.is-mid, :is(.tabs-k1a, .tabs-k1b, .tabs-k1c) .cv-tab.is-reading { background: #F7D6AB; }
:is(.tabs-k1a, .tabs-k1b, .tabs-k1c) .cv-tab.is-low, :is(.tabs-k1a, .tabs-k1b, .tabs-k1c) .cv-tab.is-failed { background: #F8B8B5; }
:is(.tabs-k1a, .tabs-k1b, .tabs-k1c) .cv-tab.is-tailored { background: #CCD0D7; }

/* Round 141 (owner): "Add CV" 72 / 32 in the ink (`add=e`, the default); on a phone in round 140's ratio (plate 0.82,
   glyph 0.8): 58.9 → 60, 25.6 → 26 (24 misses by 1.6, so the grid of 2). */
.cv-doc.is-add .cv-plus.pk72 { width: 60px; height: 60px; } .cv-doc.is-add .cv-plus.pk72 > svg { width: 26px; height: 26px; }
@media (min-width: 768px) { .cv-doc.is-add .cv-plus.pk72 { width: 72px; height: 72px; } .cv-doc.is-add .cv-plus.pk72 > svg { width: 32px; height: 32px; } }

/* Round 143 (owner). The pages' line: the product has none on the ground (2026-10-14's rule — every white card there),
   which the sheet now mirrors (`ln=none`, the default); `ln=hover` brings the sheet's line (the ink at 15%) in with the
   fill, on the fill's timing; `ln=always` is the sheet as it was. */
.cv-d1-page > a.cv-doc { transition: background-color 300ms cubic-bezier(0.4, 0, 0.2, 1), border-color 300ms cubic-bezier(0.4, 0, 0.2, 1); }
:is(.ln-none, .ln-hover) .cv-d1-page > a.cv-doc.cv-hair { border-color: transparent; }
@media (hover: hover) { .ln-hover .cv-d1-page:hover > a.cv-doc.cv-hair { border-color: var(--cv-line); } }
.ln-hover .cv-d1-page.is-hov > a.cv-doc.cv-hair { border-color: var(--cv-line); }
/* The free places: Add CV's outline alone, under an empty tab row like its own. Round 145 (owner): two rows of them at
   least at every width — past the second row's end they go: 2 a row on a phone (4 places), 3 from 768 (6), 4 from 1280
   (8), 5 from 1668 (10). */
.cv-doc.is-ghost { border: 0; background: transparent; }
@media (max-width: 767.98px) { .cv-ghost:nth-child(n+5) { display: none; } }
@media (min-width: 768px) and (max-width: 1279.98px) { .cv-ghost:nth-child(n+7) { display: none; } }
@media (min-width: 1280px) and (max-width: 1667.98px) { .cv-ghost:nth-child(n+9) { display: none; } }
@media (min-width: 1668px) { .cv-ghost:nth-child(n+11) { display: none; } }

/* Round 144 (owner): the free places' looks to choose from (`ghs=`). Theirs: pale — the dash at 12% (Add CV's is 25%);
   white — white at 30%, no outline. Mine: add — Add CV without its sign, a place you press (the chooser), with Add CV's
   hover (the ink at 2.5% over the ground, in 220 / out 300); well — a recess, the ink at 3% (the tracker's column wells
   are 4%); line — a thin solid line, the ink at 8%. */
.ghs-pale .cv-ghost .cv-dash { color: #0F131A1F; }
.ghs-white .cv-doc.is-ghost { background: rgba(255, 255, 255, 0.3); }
.ghs-well .cv-doc.is-ghost { background: rgba(15, 19, 26, 0.025); }   /* round 145 (owner): 3% → 2.5% */
.ghs-line .cv-doc.is-ghost { border: 1px solid rgba(15, 19, 26, 0.08); }
.ghs-add a.cv-doc.is-ghost { cursor: pointer; transition: background-color 300ms cubic-bezier(0.4, 0, 0.2, 1); }
@media (hover: hover) { .ghs-add .cv-d1-page:hover > a.cv-doc.is-ghost { background-color: rgba(15, 19, 26, var(--hva, .025)); transition-duration: 220ms; } }

/* Round 145 (owner): the hover as Settings' hub cards have it (Personalization, Edit Profile, Manage Subscriptions) —
   no fill, the line comes in, the ink at 50% (`border-subtle-hover`), on the same timing; while the pointer is on ⋮
   (whose own line comes in) the page's goes. `ln=ink&hv=0`. Mine: Add CV's dashes the same way, 25% → 50%. */
.ln-ink .cv-d1-page > a.cv-doc.cv-hair { border-color: transparent; }
@media (hover: hover) {
  .ln-ink .cv-d1-page:hover > a.cv-doc.cv-hair { border-color: var(--cv-line-hover); }
  .ln-ink .cv-d1-page:hover:has(.cv-kebab:hover) > a.cv-doc.cv-hair { border-color: transparent; }
  .ln-ink .cv-d1-page:hover > a.cv-doc.is-add .cv-dash { color: var(--cv-line-hover); transition-duration: 220ms; }
}
.ln-ink .cv-d1-page.is-hov > a.cv-doc.cv-hair { border-color: var(--cv-line-hover); }
.ln-ink .cv-dash { transition: color 300ms cubic-bezier(0.4, 0, 0.2, 1); }

/* Round 145 (owner): a page nothing was read from. The product's note (resumes.ejs `.cv-shelf-note`): phone gap 6,
   16 / 12 in, the glyph 28, the heading 14/20, the reason 12/16 clipped to 4; from 768 gap 8, 24 in, 32, 16/24, 14/20
   clipped to 6. The variants add: the link (14/20 600, the ink, underlined at 50%) — the cue that the page opens the
   dialog; a few words of what happened (the reason's size, unclipped); the fix as an ink pill (32 / 12px / 12 in on a
   phone, 36 / 14px / 16 in from 768). */
.cv-fail { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; padding: 16px 12px; text-align: center; }
.cv-fail > svg { width: 28px; height: 28px; color: var(--cv-danger); }
.cv-fail-h { font-size: 14px; line-height: 20px; font-weight: 600; color: var(--cv-ink); }
.cv-fail-b { font-size: 12px; line-height: 16px; color: var(--cv-muted); }
.cv-fail-b.is-clip { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; overflow: hidden; }
.cv-why { padding: 0; border: 0; background: none; font: 600 14px/20px Figtree, sans-serif; color: var(--cv-ink); text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--cv-line-hover); cursor: pointer; }
.cv-fix { display: inline-flex; align-items: center; height: 32px; padding: 0 12px; margin-top: 2px; border: 0; border-radius: 9999px; background: var(--cv-ink); color: #fff; font: 400 12px/1 Figtree, sans-serif; cursor: pointer; white-space: nowrap; }
@media (hover: hover) { .cv-why:hover { text-decoration-color: currentColor; } .cv-fix:hover { opacity: .9; } }
@media (min-width: 768px) {
  .cv-fail { gap: 8px; padding: 24px; }
  .cv-fail > svg { width: 32px; height: 32px; }
  .cv-fail-h { font-size: 16px; line-height: 24px; }
  .cv-fail-b { font-size: 14px; line-height: 20px; }
  .cv-fail-b.is-clip { -webkit-line-clamp: 6; }
  .cv-fix { height: 36px; padding: 0 16px; font-size: 14px; }
}

/* Round 146 (owner). The failed page's link, а) chosen: "See why" in the accent blue (#2563EB), no underline at rest — it
   comes with the pointer (fading in on the product's hover timing) — and an arrow 16 after it, 4 apart. */
.cv-why { display: inline-flex; align-items: center; gap: 4px; color: #2563EB; text-decoration-line: underline; text-decoration-color: transparent; text-underline-offset: 3px;
  transition: text-decoration-color 300ms cubic-bezier(0.4, 0, 0.2, 1); }
.cv-why > svg { width: 16px; height: 16px; flex: none; }
@media (hover: hover) {
  .cv-why:hover, a.cv-doc:hover .cv-why { text-decoration-color: currentColor; transition-duration: 220ms; }
}

/* Round 146 (owner): the hover д) after wearecollins.com's Press cards — the picture grows to 1.02 and a shadow comes in,
   800ms on their ease-out-expo, cubic-bezier(0.19, 1, 0.22, 1), both ways — with OUR shadow, the navigation islands'
   (`shadow.menu`: 0 8 32 ink-black 8% + 0 3 6 6%) in place of theirs. The tabs grow with their page (`.cv-lift`); no fill,
   no line (`ln=lift&hv=0`). Add CV: the same growth, its fill (2.5%) instead of a shadow round an empty outline — mine.
   е) mine: the same on the product's hover timing (in 220, out 300, cubic-bezier(0.4, 0, 0.2, 1)) — `ht=ours`. */
.cv-lift { transform-origin: 50% 50%; }
.ln-lift .cv-d1-item:not(.cv-ghost) .cv-lift { transition: scale 800ms cubic-bezier(0.19, 1, 0.22, 1), transform 150ms cubic-bezier(0.4, 0, 0.2, 1); }
.ln-lift .cv-d1-page > a.cv-doc { transition: box-shadow 800ms cubic-bezier(0.19, 1, 0.22, 1), background-color 800ms cubic-bezier(0.19, 1, 0.22, 1); }
.ln-lift .cv-d1-page > a.cv-doc.cv-hair { border-color: transparent; }
@media (hover: hover) {
  .ln-lift .cv-d1-item:not(.cv-ghost) .cv-lift:hover { scale: var(--lift, 1.02); }
  .ln-lift .cv-lift:hover > .cv-d1-page > a.cv-doc.cv-hair { box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.08), 0 3px 6px 0 rgba(0, 0, 0, 0.06); }
  .ln-lift .cv-lift:hover > .cv-d1-page > a.cv-doc.is-add { background-color: rgba(15, 19, 26, 0.025); }
  .ln-lift .cv-d1-page:hover > a.cv-doc { transition-duration: 800ms; }
}
.ln-lift.ht-ours .cv-d1-item:not(.cv-ghost) .cv-lift, .ln-lift.ht-ours .cv-d1-page > a.cv-doc { transition-duration: 300ms; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
@media (hover: hover) {
  .ln-lift.ht-ours .cv-d1-item:not(.cv-ghost) .cv-lift:hover, .ln-lift.ht-ours .cv-lift:hover > .cv-d1-page > a.cv-doc { transition-duration: 220ms; }
}

/* Round 154 (owner): the growth is a `scale` now (above; it was a transform) so the PRESS can be a transform on its own timing
   — the product's, 150ms standard, in and out. The CVs page has no press today; the one here is mine: the Settings cards'
   soft press (0.9875, 0.5 down — the shelf's pages are nearer their 448 than the job card's 940). It takes the page to the
   size that press gives at REST, not that times the growth: the press takes the growth off (`scale: 1`, on its 150) and
   puts the press on — seen from the grown page 0.9875 / 1.015 = 0.97291 — so the release has the whole way back to grow
   through (the press undone on 150, the growth back on its 800 expo). As the job cards (hover-lift.css). Only a press on
   the page itself (its link, the See why in it, Add CV) — not the ⋮ beside it, which is a button of its own. */
.ln-lift .cv-lift { --tap-scale: 0.9875; --tap-drop: 0.5px; }
.ln-lift .cv-d1-item:not(.cv-ghost) .cv-lift:has(> .cv-d1-page > .cv-doc:active) {
  scale: 1; transform: scale(var(--tap-scale)) translateY(var(--tap-drop)); transition-duration: 150ms; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

/* Round 147 (owner): "See why" 500, the chevron (arrow-right-01) 1 after the text, its middle on the middle of the capitals
   (as Apple's "Visit Apple Support ›"). Measured (tools/d1-r147-why.js): at 14/20 the baseline is 14 down, the capitals
   9.8 high (Figtree 0.7 em) — their middle 9.1 down, the 16 glyph's middle (the chevron is centred in its box) 10: up 1
   (0.9 in Chrome, 1.0 in WebKit; a whole pixel keeps it crisp). */
.cv-why { gap: 1px; font-weight: 500; }
/* Round 148 (owner): no — the middle of the LOWERCASE letters (the owner's example: Apple's › sits between the baseline and
   the x-height, "прописные" there meant the small letters). Figtree's x-height at 14 is 7 (0.5 em): the middle 10.5 down,
   the glyph's 10 — down 0.5 (a device pixel on a 2× screen). */
.cv-why > svg { position: relative; top: 0.5px; }

/* Round 147 (owner): the lift's growth to choose (`ls=` 1.02 / 1.015 / 1.01), and its shadow — ours (`shadow.menu`) or
   Collins's own (`sh=collins`): their --shadow-sm (0 21 13 black 6% + 0 9 9 10% + 0 2 5 11%) at the 0.5 opacity their
   hover takes it to — 3% / 5% / 5.5%. */
@media (hover: hover) {
  .ln-lift.sh-collins .cv-lift:hover > .cv-d1-page > a.cv-doc.cv-hair { box-shadow: 0 21px 13px 0 rgba(0, 0, 0, 0.03), 0 9px 9px 0 rgba(0, 0, 0, 0.05), 0 2px 5px 0 rgba(0, 0, 0, 0.055); }
}

/* Round 148 (owner): the growth 1.015; the shadow ours (`shadow.menu`: 0 8 32 black 8% + 0 3 6 6%), a touch lower and a
   touch softer / lighter — five steps to choose (`sh=s1…s5`):
   s1  0 10 32  7%  + 0 4 8   5%   (+2 down, −1% each)
   s2  0 12 32  7%  + 0 4 8   5%   (+4 down)
   s3  0 10 36  6.5% + 0 4 10 4.5% (+2 down, wider, −1.5%)
   s4  0 12 40  6%  + 0 5 10  4%   (+4 down, wider still, −2%)
   s5  0 14 40  6%  + 0 5 12  4%   (+6 down) */
@media (hover: hover) {
  .ln-lift.sh-s1 .cv-lift:hover > .cv-d1-page > a.cv-doc.cv-hair { box-shadow: 0 10px 32px 0 rgba(0, 0, 0, 0.07), 0 4px 8px 0 rgba(0, 0, 0, 0.05); }
  .ln-lift.sh-s2 .cv-lift:hover > .cv-d1-page > a.cv-doc.cv-hair { box-shadow: 0 12px 32px 0 rgba(0, 0, 0, 0.07), 0 4px 8px 0 rgba(0, 0, 0, 0.05); }
  .ln-lift.sh-s3 .cv-lift:hover > .cv-d1-page > a.cv-doc.cv-hair { box-shadow: 0 10px 36px 0 rgba(0, 0, 0, 0.065), 0 4px 10px 0 rgba(0, 0, 0, 0.045); }
  .ln-lift.sh-s4 .cv-lift:hover > .cv-d1-page > a.cv-doc.cv-hair { box-shadow: 0 12px 40px 0 rgba(0, 0, 0, 0.06), 0 5px 10px 0 rgba(0, 0, 0, 0.04); }
  .ln-lift.sh-s5 .cv-lift:hover > .cv-d1-page > a.cv-doc.cv-hair { box-shadow: 0 14px 40px 0 rgba(0, 0, 0, 0.06), 0 5px 12px 0 rgba(0, 0, 0, 0.04); }
}

/* Round 149 (owner): the chevron as heavy as the letters, and no gap. Figtree 500's stem (l, h measured at 1000px) is
   94–95 of 1000 — 1.32 at 14; the glyph's stroke 1.5 of its 24 grid draws 1.0 at 16, so 1.97 of 24 draws 1.32. */
.cv-why { gap: 0; }
.cv-why > svg path { stroke-width: 1.97; }

/* Round 149 (owner): two more — s2's offsets, lighter: s6 0 12 32 5% + 0 4 8 4%; s7 0 12 32 4% + 0 4 8 3%. */
@media (hover: hover) {
  .ln-lift.sh-s6 .cv-lift:hover > .cv-d1-page > a.cv-doc.cv-hair { box-shadow: 0 12px 32px 0 rgba(0, 0, 0, 0.05), 0 4px 8px 0 rgba(0, 0, 0, 0.04); }
  .ln-lift.sh-s7 .cv-lift:hover > .cv-d1-page > a.cv-doc.cv-hair { box-shadow: 0 12px 32px 0 rgba(0, 0, 0, 0.04), 0 4px 8px 0 rgba(0, 0, 0, 0.03); }
}

/* Round 150 (owner): s8 — 0 12 32 5% + 0 4 8 6% (s6's wide layer, a denser short one). */
@media (hover: hover) {
  .ln-lift.sh-s8 .cv-lift:hover > .cv-d1-page > a.cv-doc.cv-hair { box-shadow: 0 12px 32px 0 rgba(0, 0, 0, 0.05), 0 4px 8px 0 rgba(0, 0, 0, 0.06); }
}

/* Round 151 (owner): s9 — 0 14 32 5% + 0 6 8 4% (s6's alphas, both layers 2 lower). */
@media (hover: hover) {
  .ln-lift.sh-s9 .cv-lift:hover > .cv-d1-page > a.cv-doc.cv-hair { box-shadow: 0 14px 32px 0 rgba(0, 0, 0, 0.05), 0 6px 8px 0 rgba(0, 0, 0, 0.04); }
}

/* Round 158 (owner): the clicked CV page is the chosen one at once, as Settings' cards and the job cards (card-chosen.js
   there): on the click — a page that opens the CV; not Add CV and not a page nothing was read from, whose clicks open a
   dialog over this page — the page drops its growth and its shadow, so the release goes from the pressed size to rest on
   the press's 150 standard, not back to the growth while the next page loads. page.js sets `data-chosen-now`. */
.ln-lift .cv-d1-item:not(.cv-ghost) .cv-lift[data-chosen-now],
.ln-lift .cv-d1-item:not(.cv-ghost) .cv-lift[data-chosen-now]:hover { scale: 1; transition-duration: 150ms; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
.ln-lift .cv-lift[data-chosen-now] > .cv-d1-page > a.cv-doc.cv-hair,
.ln-lift .cv-lift[data-chosen-now]:hover > .cv-d1-page > a.cv-doc.cv-hair { box-shadow: none; transition-duration: 150ms; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }