:root {
  --ink: #172b30;
  --muted: #586b70;
  --subtle: #77878a;
  --line: #dce4e3;
  --line-strong: #b9cbc7;
  --wash: #f5f8f7;
  --panel: #fff;
  --surface-soft: #edf4f1;
  --accent: #176b59;
  --accent-strong: #115447;
  --accent-wash: #e5f1ed;
  --amber: #80580b;
  --amber-wash: #fff7e6;
  --danger: #a54036;
  --success: #28715e;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --radius-sm: 6px;
  --radius: 8px;
  --nav-height: 64px;
  --content-max: 1360px;
  --layer-nav: 40;
  --layer-scrim: 60;
  --layer-dialog: 61;
  --layer-toast: 80;
}

html { background: var(--wash); scroll-padding-top: calc(var(--nav-height) + 16px); }
body { min-width: 0; background: var(--wash); color: var(--ink); font-size: 14px; line-height: 1.55; }
.sr-only { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; }
button, input, select, textarea { font: inherit; }
button, a, summary { touch-action: manipulation; }
button, summary { cursor: pointer; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible,
textarea:focus-visible, summary:focus-visible, [tabindex]:focus-visible {
  outline: 3px solid #277c69;
  outline-offset: 3px;
}
.skip-link { position: fixed; z-index: 100; top: 12px; left: 16px; transform: translateY(-220%); padding: 10px 14px; border: 1px solid var(--line-strong); border-radius: var(--radius-sm); background: var(--panel); }
.skip-link:focus { transform: translateY(0); }
.shell { display: block; min-height: 100dvh; }
.topbar { position: sticky; z-index: var(--layer-nav); top: 0; height: var(--nav-height); border-bottom: 1px solid var(--line); background: rgb(255 255 255 / .97); }
.topbar-inner { display: grid; grid-template-columns: 190px minmax(0, 1fr) 190px; align-items: center; width: 100%; max-width: var(--content-max); height: 100%; margin: auto; padding: 0 32px; }
.brand { display: flex; align-items: center; gap: 10px; padding: 0; border: 0; background: none; color: var(--ink); font: inherit; font-size: 16px; font-weight: 720; cursor: pointer; }
.brand:hover { color: var(--accent); }
.brand-mark { display: grid; flex: none; place-items: center; width: 30px; height: 30px; border-radius: 7px; background: var(--accent); color: #fff; font-size: 10px; letter-spacing: .04em; }
.journey-nav { display: flex; align-self: stretch; justify-content: center; gap: 26px; min-width: 0; }
.journey-nav .nav-item { position: relative; display: flex; align-items: center; width: auto; min-height: 44px; padding: 0; border: 0; border-radius: 0; background: transparent; color: #506267; font-weight: 560; white-space: nowrap; }
/* `hidden` has to actually hide. The rule above sets `display`, which outranks
   the UA stylesheet's `[hidden]{display:none}` -- so a release-gated control
   would stay on screen and in the accessibility tree while every script
   correctly believed it was hidden. Specificity here must match the rule it
   is correcting, so it is scoped the same way rather than using !important. */
.journey-nav .nav-item[hidden] { display: none; }
.journey-nav .nav-item:hover { background: transparent; color: var(--ink); }
.journey-nav .nav-item.active, .journey-nav .nav-item[aria-current="page"] { background: transparent; color: var(--ink); font-weight: 690; }
.journey-nav .nav-item.active::after, .journey-nav .nav-item[aria-current="page"]::after { position: absolute; right: 0; bottom: 0; left: 0; height: 2px; background: var(--accent); content: "" !important; }
.avatar-button.nav-item { display: grid; justify-self: end; place-items: center; width: 38px; height: 38px; min-height: 38px; padding: 0; border: 1px solid var(--line-strong); border-radius: 50%; background: var(--surface-soft); color: var(--accent-strong); font-size: 11px; font-weight: 750; }
.avatar-button.nav-item:hover { background: var(--accent-wash); }
.avatar-button.nav-item.active { background: var(--accent-wash); color: var(--accent-strong); }
.topbar-actions { position: relative; display: flex; justify-self: end; align-items: center; gap: 9px; }
.notification-button { position: relative; display: grid; place-items: center; width: 38px; height: 38px; border: 1px solid var(--line); border-radius: 50%; background: var(--panel); color: var(--accent); font-size: 20px; }
.notification-button strong { position: absolute; top: -5px; right: -5px; min-width: 18px; height: 18px; padding: 0 4px; border: 2px solid #fff; border-radius: 99px; background: var(--danger); color: #fff; font-size: 10px; line-height: 14px; }
.notification-center { position: absolute; z-index: 50; top: 48px; right: 0; width: min(390px, calc(100vw - 32px)); max-height: min(560px, calc(100dvh - var(--nav-height) - 24px)); overflow: auto; border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); box-shadow: 0 16px 42px rgb(23 43 48 / .17); }
.notification-center header { position: sticky; top: 0; display: flex; align-items: center; justify-content: space-between; padding: 12px 16px; border-bottom: 1px solid var(--line); background: var(--panel); }
.notification-item { display: grid; gap: 3px; width: 100%; padding: 14px 16px; border: 0; border-bottom: 1px solid var(--line); background: transparent; color: var(--ink); text-align: left; }
.notification-item:hover { background: var(--surface-soft); }
.notification-item span, .notification-item small { color: var(--muted); }
.main { width: 100%; min-width: 0; padding: 0; }
.page { width: 100%; max-width: var(--content-max); margin: auto; padding: 44px 32px 80px; }
.page > h1 { margin: 0; color: var(--ink); font-size: 32px; font-weight: 710; line-height: 1.15; letter-spacing: -.035em; }
.page > .subtitle { max-width: 72ch; margin: 8px 0 32px; color: var(--muted); font-size: 15px; }
.page > .eyebrow { display: none; }
.v3-eyebrow { margin: 0 0 6px; color: var(--accent); font-size: 11px; font-weight: 750; letter-spacing: .09em; text-transform: uppercase; }
.v3-muted, .v2-muted { color: var(--muted); }
.v3-caption { color: var(--muted); font-size: 12px; }
.v3-panel, .v2-card, .resume-panel, .tailor-panel { min-width: 0; margin: 0; padding: 22px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); box-shadow: none; overflow-wrap: anywhere; }
.v3-panel h2, .v3-panel h3 { margin-top: 0; }
.v3-section-head { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; margin-bottom: 14px; }
.v3-section-head h2 { margin: 0; font-size: 19px; letter-spacing: -.015em; }
.v3-section-head span { color: var(--muted); font-size: 12px; }
.v3-primary, .v2-primary, .action-enabled.v3-primary { min-height: 44px; padding: 10px 18px; border: 1px solid var(--accent); border-radius: var(--radius-sm); background: var(--accent); color: #fff; font-weight: 680; }
.v3-primary:hover, .v2-primary:hover { background: var(--accent-strong); }
.v3-secondary, .action-enabled { min-height: 44px; padding: 10px 15px; border: 1px solid var(--line-strong); border-radius: var(--radius-sm); background: var(--panel); color: var(--ink); font-weight: 620; }
.v3-secondary:hover, .action-enabled:hover { border-color: #7b9b94; background: var(--surface-soft); }
.v3-link, .v2-link { min-height: 44px; padding: 8px 2px; border: 0; background: transparent; color: var(--accent); font-weight: 650; text-decoration: none; }
.v3-overflow { position: relative; }
.v3-overflow > summary { display: grid; place-items: center; min-width: 44px; min-height: 44px; padding: 0 11px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--panel); font-size: 18px; font-weight: 760; list-style: none; }
.v3-overflow > summary::-webkit-details-marker { display: none; }
.v3-overflow[open] > .v3-menu { position: absolute; z-index: 5; right: 0; display: grid; width: min(250px, calc(100vw - 32px)); margin-top: 8px; padding: 6px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); box-shadow: 0 14px 34px rgb(23 43 48 / .14); }
.v3-menu button, .v3-menu a { display: block; width: 100%; min-height: 42px; padding: 9px 10px; border: 0; border-radius: 4px; background: transparent; color: var(--ink); text-align: left; text-decoration: none; }
.v3-menu button:hover, .v3-menu a:hover { background: var(--surface-soft); }

/* Dashboard */
.page-dashboard { padding-top: 28px; padding-bottom: 56px; }
.page-dashboard > h1 { font-size: 27px; }
.page-dashboard > .subtitle { margin: 5px 0 18px; font-size: 14px; }
.dash-goal { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px 20px; margin-bottom: 16px; padding: 13px 18px; }
.dash-goal-main { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 14px; min-width: 0; }
.dash-goal-main p { margin: 0; }
.dash-goal-eyebrow { margin: 0; }
.dash-goal-name { font-size: 16px; font-weight: 690; letter-spacing: -.012em; }
.dash-goal-meta { display: flex; flex-wrap: wrap; gap: 4px 6px; margin: 0; padding: 0; color: var(--subtle); font-size: 12px; list-style: none; }
.dash-goal-meta li { padding: 1px 8px; border: 1px solid var(--line); border-radius: 99px; background: var(--wash); white-space: nowrap; }
.dash-goal > .v3-secondary { min-height: 38px; padding: 8px 14px; }
/* Metric cards are entry points, so each one is a real button. The visual
   design is unchanged: the button is reset to the card it already looked like,
   and only hover and focus are added. Focus is the outline v2.css gives every
   control -- the same indicator as everywhere else, not a bespoke one. */
.metric-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin: 0 0 18px; padding: 0; list-style: none; }
.metric-grid > li { display: grid; min-width: 0; }
.metric-card { display: grid; align-content: start; justify-items: start; gap: 5px; width: 100%; min-width: 0; padding: 14px 18px 15px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); color: inherit; text-align: left; cursor: pointer; transition: border-color .12s ease, background-color .12s ease; }
.metric-card:hover { border-color: var(--accent); background: var(--accent-wash); }
.metric-label { color: var(--muted); font-size: 12px; font-weight: 650; letter-spacing: .015em; }
.metric-value { color: var(--ink); font-size: 32px; font-weight: 750; font-variant-numeric: tabular-nums; letter-spacing: -.02em; line-height: 1.08; }
.metric-caption { color: var(--subtle); font-size: 12px; }
.dash-panels { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 18px; align-items: start; margin-bottom: 18px; }
.dash-panels > section { min-width: 0; }
.dash-section { margin-bottom: 18px; }
.dash-section:last-child { margin-bottom: 0; }
.dash-module { padding: 0; overflow: hidden; }
.dash-module-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 50px; padding: 10px 20px; border-bottom: 1px solid var(--line); }
.dash-module-title { display: flex; align-items: baseline; flex-wrap: wrap; gap: 2px 10px; min-width: 0; }
.dash-module-head h2 { margin: 0; font-size: 15px; font-weight: 700; letter-spacing: -.005em; }
.dash-module-head .v3-link { min-height: 32px; padding: 4px 0; font-size: 13px; }
.dash-module-note { color: var(--subtle); font-size: 12px; }
.dash-module-body { min-width: 0; }
.dash-module-foot { display: block; margin: 0; padding: 11px 20px; border-top: 1px solid var(--line); background: var(--wash); }
.dash-module.is-emphasis .dash-module-head { border-bottom-color: var(--line-strong); background: var(--accent-wash); }
.dash-attention-count { padding: 3px 9px; border-radius: 99px; background: var(--surface-soft); color: var(--muted); font-size: 11px; font-weight: 680; white-space: nowrap; }
.dash-module.is-emphasis .dash-attention-count { background: var(--panel); color: var(--accent-strong); }
.progress-panel { padding: 18px 20px; }
.progress-panel.is-empty { padding: 0; }
.progress-visual { display: grid; grid-template-columns: 116px minmax(0, 1fr); align-items: center; gap: 20px; }
.progress-donut-wrap { position: relative; width: 116px; height: 116px; }
.progress-donut { display: block; width: 116px; height: 116px; }
.progress-donut circle { fill: none; stroke-width: 13; }
.donut-track { stroke: var(--surface-soft); }
.donut-segment { stroke: var(--stage); }
.progress-total { position: absolute; inset: 0; display: grid; align-content: center; justify-items: center; gap: 1px; margin: 0; text-align: center; }
.progress-total strong { font-size: 23px; font-weight: 750; font-variant-numeric: tabular-nums; letter-spacing: -.02em; }
.progress-total span { color: var(--muted); font-size: 11px; }
.progress-legend { display: grid; max-width: 420px; margin: 0; padding: 0; list-style: none; }
.progress-legend li { display: grid; grid-template-columns: 9px minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 6px 0; color: var(--muted); font-size: 13px; }
.progress-legend strong { color: var(--ink); font-size: 14px; font-weight: 700; font-variant-numeric: tabular-nums; }
.progress-dot { width: 9px; height: 9px; border-radius: 2px; background: var(--stage); }
.progress-panel .v3-caption { margin: 14px 0 0; }
.segment-preparing { --stage: #9db9b1; }
.segment-applied { --stage: #4f9b88; }
.segment-interviewing { --stage: var(--accent); }
.segment-offer { --stage: var(--amber); }
.segment-closed { --stage: #d2d8d8; }
.dash-table { padding: 0; }
.dash-head { display: grid; align-items: center; gap: 14px; padding: 9px 20px; border-bottom: 1px solid var(--line); background: var(--wash); color: var(--muted); font-size: 11px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
.dash-row { display: grid; align-items: center; gap: 14px; min-height: 56px; padding: 0 20px 0 0; border-bottom: 1px solid var(--line); }
.dash-row:last-child { border-bottom: 0; }
.dash-row:hover { background: #fafcfb; }
.dash-opportunity-head, .dash-opportunity-row { grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr) 122px 84px 116px; }
.dash-application-head, .dash-application-row { grid-template-columns: minmax(0, 1.6fr) 152px 104px 92px; }
.dash-row-open { display: grid; gap: 1px; min-width: 0; min-height: 56px; padding: 10px 0 10px 20px; border: 0; background: transparent; color: inherit; text-align: left; }
.dash-row-open strong { font-size: 14px; font-weight: 660; }
.dash-row-open span { color: var(--muted); font-size: 12px; }
.dash-row-open[disabled] { cursor: default; }
.dash-cell { min-width: 0; color: var(--muted); font-size: 13px; }
.dash-cell-value { display: block; min-width: 0; overflow-wrap: anywhere; }
.dash-cell-label { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; border: 0; clip: rect(0, 0, 0, 0); white-space: nowrap; }
.dash-cell-action { justify-self: end; }
.dash-row .lifecycle-status { width: 100%; min-height: 38px; padding: 5px 8px; font-size: 12px; }
.dash-row-action { min-height: 38px; padding: 8px 12px; border: 1px solid var(--line-strong); border-radius: var(--radius-sm); background: var(--panel); color: var(--ink); font-size: 12px; font-weight: 640; white-space: nowrap; }
.dash-row-action:hover { border-color: #7b9b94; background: var(--surface-soft); }
.dash-empty-action { display: flex; justify-content: center; padding: 0 22px 22px; }
.attention-panel { padding: 0; overflow: hidden; }
.attention-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 18px; width: 100%; min-height: 96px; padding: 0 14px 0 0; border: 0; border-bottom: 1px solid var(--line); background: transparent; text-align: left; }
.attention-row:last-child { border-bottom: 0; }
.attention-row:hover { background: #fafcfb; }
.attention-row h3 { margin: 2px 0 4px; font-size: 15px; }
.attention-row p { margin: 0; color: var(--muted); }
.attention-kind { color: var(--accent); font-size: 12px; font-weight: 720; }
.next-label { color: var(--accent); font-weight: 680; white-space: nowrap; }
.attention-open { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 18px; width: 100%; min-height: inherit; padding: 18px 22px; border: 0; background: transparent; color: inherit; text-align: left; }
.lifecycle-control { display: grid; gap: 4px; min-width: 116px; color: var(--muted); font-size: 10px; font-weight: 680; letter-spacing: .03em; text-transform: uppercase; }
.lifecycle-control select { width: 100%; min-height: 38px; padding: 6px 8px; font-size: 12px; text-transform: none; }
.detail-lifecycle { display: flex; align-items: end; justify-content: space-between; gap: 16px; margin: 16px 0; padding: 12px 14px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--surface-soft); color: var(--muted); font-size: 12px; }
.background-row-actions { display: flex; align-items: end; justify-content: space-between; gap: 16px; }
.warning-copy { margin-top: 8px !important; padding-left: 9px; border-left: 2px solid var(--amber); color: #6d4d0a !important; font-size: 12px; }
.background-list { padding: 0; overflow: hidden; }
.background-row { width: 100%; border: 0; border-bottom: 1px solid var(--line); background: transparent; text-align: left; }
.background-row:last-child { border-bottom: 0; }
.background-row > summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 68px; padding: 13px 18px; cursor: pointer; list-style: none; }
.background-row > summary::-webkit-details-marker { display: none; }
.background-row > summary:hover, .background-row > summary:focus-visible { background: var(--surface-soft); }
.background-row strong, .background-row small { display: block; }
.background-row small { margin-top: 3px; color: var(--muted); font-size: 12px; }
.background-status { max-width: 240px; text-align: right; }
.background-status strong { color: var(--accent-strong); font-size: 13px; }
.background-progress-detail { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 16px; padding: 0 18px 16px; }
.background-progress-detail ol { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 14px; margin: 0; padding: 0; list-style: none; }
.background-progress-detail li { display: flex; gap: 7px; color: var(--muted); font-size: 12px; }
.background-progress-detail li.is-complete { color: var(--success); }
.background-progress-detail li.is-active { color: var(--accent-strong); font-weight: 650; }

/* Apply and AI Apply job collections */
.apply-header-tools { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: start; gap: 18px; margin: -8px 0 20px; }
.apply-search { position: relative; display: block; max-width: 780px; }
.apply-search svg { position: absolute; top: 14px; left: 14px; color: var(--muted); pointer-events: none; }
/* The search field carries exactly ONE search affordance: the decorative,
   aria-hidden magnifier above.

   Two things had to be fixed for that to be true. First, the gutter it sits in
   was not being reserved: `.apply-search input` (0,1,1) loses to v2.css's
   `input:not([type="checkbox"]):not([type="hidden"])` (0,2,1), whose `padding`
   SHORTHAND reset padding-left to 12px -- so the icon was drawn on top of the
   placeholder and the typed text, which is what reads on screen as a second,
   malformed glyph. Matching that specificity with the type selector, in a
   sheet that loads later, is what makes 42px actually apply; it is not
   decoration. Second, `type="search"` is kept for its semantics but its native
   UA decorations are removed, because a browser that draws its own magnifier
   or clear control inside the field puts a real second glyph beside ours. */
.apply-search input[type="search"] { min-height: 46px; padding-left: 42px; appearance: none; -webkit-appearance: none; }
.apply-search input[type="search"]::-webkit-search-decoration,
.apply-search input[type="search"]::-webkit-search-results-decoration,
.apply-search input[type="search"]::-webkit-search-results-button,
.apply-search input[type="search"]::-webkit-search-cancel-button { appearance: none; -webkit-appearance: none; display: none; }
.scan-control { display: grid; justify-items: end; gap: 3px; }
.scan-control .v3-secondary { min-width: 130px; }
.search-goal-panel { margin: -8px 0 20px; padding: 18px; }
.search-goal-heading, .search-goal-actions { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.search-goal-heading h2 { margin: 0 0 4px; font-size: 18px; }
.search-goal-heading p, .goal-coverage { margin: 0; color: var(--muted); }
.goal-revision { white-space: nowrap; color: var(--muted); font-size: 12px; }
.search-goal-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); align-items: start; gap: 14px 16px; margin: 18px 0; }
.goal-field { min-width: 0; }
.search-goal-grid > label, .search-goal-grid fieldset { min-width: 0; }
.search-goal-grid label { display: grid; gap: 6px; color: var(--muted); font-size: 13px; }
.search-goal-grid input[type="text"], .search-goal-grid input:not([type]), .search-goal-grid select { width: 100%; min-height: 44px; }
.search-goal-grid fieldset { display: flex; flex-wrap: wrap; align-content: flex-start; gap: 8px 12px; margin: 0; padding: 0; border: 0; }
.search-goal-grid legend { width: 100%; margin-bottom: 6px; color: var(--muted); font-size: 13px; }
.search-goal-grid fieldset label { display: flex; align-items: center; min-height: 44px; color: var(--text); }
.search-goal-grid fieldset .wide { flex: 1 0 100%; }
.search-goal-actions { align-items: center; }
.search-goal-actions .scan-control { justify-items: end; }
.goal-coverage { margin-top: 12px; padding: 10px 12px; border: 1px solid var(--warning); border-radius: var(--radius-sm); }
.apply-viewbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin: 18px 0 14px; }
.segmented { display: flex; width: max-content; padding: 3px; border: 1px solid var(--line); border-radius: var(--radius); background: #edf2f0; }
.segmented button { min-height: 36px; padding: 7px 13px; border: 0; border-radius: 5px; background: transparent; color: var(--muted); }
.segmented button[aria-pressed="true"] { background: var(--panel); color: var(--ink); font-weight: 680; box-shadow: 0 1px 2px rgb(23 43 48 / .08); }
.apply-filters { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.filter-disclosure { position: relative; }
.filter-disclosure > summary { display: flex; align-items: center; min-height: 40px; padding: 7px 12px; border: 1px solid var(--line-strong); border-radius: var(--radius-sm); background: var(--panel); color: #43565a; list-style: none; }
.filter-disclosure > summary::-webkit-details-marker { display: none; }
.filter-popover { position: absolute; z-index: 5; left: 0; right: auto; display: grid; grid-template-columns: repeat(2, minmax(180px, 1fr)); gap: 14px; width: min(520px, calc(100vw - 32px)); margin-top: 8px; padding: 18px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); box-shadow: 0 14px 34px rgb(23 43 48 / .14); }
.filter-popover { max-height: min(420px, calc(100dvh - 140px)); overflow: auto; overscroll-behavior: contain; }
.filter-popover.popover-flipped { margin-top: 0; margin-bottom: 8px; }
.filter-popover label { display: grid; gap: 6px; font-weight: 620; }
.filter-popover-surface { border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); box-shadow: 0 14px 34px rgb(23 43 48 / .14); }

/* Multi-select */
.multi-select { position: relative; display: grid; gap: 4px; min-width: 0; }
.multi-select-title { color: var(--muted); font-size: 13px; }
.multi-select-toggle { display: flex; align-items: center; justify-content: space-between; gap: 8px; width: 100%; min-height: 44px; padding: 8px 12px; border: 1px solid #9aaeb0; border-radius: var(--control-radius); background: var(--panel); color: var(--ink); font: inherit; text-align: left; cursor: pointer; }
.multi-select-toggle:hover { border-color: var(--accent); }
.multi-select-value { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.multi-select-caret { flex: none; color: var(--muted); }
.multi-select-panel:not([hidden]) { display: grid; }
.multi-select-panel { position: absolute; z-index: 40; top: calc(100% + 6px); gap: 8px; width: min(320px, calc(100vw - 32px)); max-height: min(340px, calc(100dvh - 160px)); padding: 12px; overflow: hidden; }
.multi-select-panel.popover-flipped { top: auto; }
.multi-select-search input { width: 100%; min-height: 40px; }
.multi-select-options { display: grid; gap: 2px; overflow: auto; overscroll-behavior: contain; }
.multi-select-group { position: sticky; top: 0; margin: 6px 0 2px; padding: 4px 0; background: var(--panel); color: var(--muted); font-size: 11px; letter-spacing: .06em; text-transform: uppercase; }
.multi-select-option { display: flex; align-items: center; gap: 8px; min-height: 36px; padding: 2px 4px; border-radius: 6px; font-weight: 500; cursor: pointer; }
.multi-select-option:hover { background: var(--accent-wash); }
.multi-select-option input { flex: none; }
.multi-select-no-match { margin: 0; color: var(--muted); font-size: 13px; }
/* Selected-value chips.
   Three multi-selects sit side by side in the Search Goal card, and a customer
   who picks a few locations, every work style and every engagement type was
   given several stacked rows of chips per control -- the selection summary took
   more vertical space than the controls themselves.
   Compact, not smaller-to-the-point-of-unusable: the remove control keeps a
   full-size hit area through the ::after overlay below, so the target a finger
   or pointer meets is unchanged while the chip it sits in is ~40% shorter. */
.multi-select-chips { display: flex; flex-wrap: wrap; gap: 4px; margin: 0; padding: 0; list-style: none; }
.multi-select-chips li { display: inline-flex; align-items: center; gap: 1px; padding: 0 2px 0 8px; border: 1px solid var(--line); border-radius: 999px; background: var(--accent-wash); font-size: 11px; line-height: 1.45; }
/* `min-height: 0` is the point of this rule, not the width/height.
   v2.css gives every `button` a 44px min-height, so the chip's remove control
   was 44px tall and each chip row was 46px -- taller than the select it
   summarised, which is the whole reason the Search Goal card felt oversized.
   The 44px target is preserved here by the ::after overlay, not by the box. */
.multi-select-remove { position: relative; width: 18px; height: 18px; min-height: 0; padding: 0; border: 0; border-radius: 50%; background: none; color: var(--muted); font-size: 13px; line-height: 1; cursor: pointer; }
/* The rendered circle is 18px; the hit area is 28px. Compact presentation must
   not shrink what a pointer, a finger or a switch device has to hit. */
.multi-select-remove::after { content: ''; position: absolute; inset: -7px; border-radius: 50%; }
.multi-select-remove:hover { background: var(--panel); color: var(--ink); }
.multi-select-remove:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }

/* Current-run result scope. Historical inventory is one click away, always. */
.scan-scope { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; margin: 0 0 10px; }
.scan-scope-identity { display: grid; gap: 1px; min-width: 0; }
.scan-scope-name { display: flex; align-items: center; gap: 8px; margin: 0; font-weight: 640; font-size: 13px; }
.scan-scope-badge { padding: 1px 8px; border: 1px solid var(--line); border-radius: 999px; color: var(--muted); font-weight: 550; font-size: 11px; }
.scan-scope-context { margin: 0; color: var(--muted); font-size: 12px; }
.scan-scope-options { display: flex; flex-wrap: wrap; gap: 8px; }
.scan-scope-option { padding: 6px 14px; border: 1px solid var(--line); border-radius: 999px; background: var(--panel); color: var(--ink); font: inherit; font-size: 13px; cursor: pointer; }
.scan-scope-option[aria-pressed="true"] { border-color: var(--accent); background: var(--accent-wash); font-weight: 620; }
.scan-scope-note { flex: 1 1 100%; color: var(--muted); font-size: 12px; }
.scan-scope-unavailable { align-items: flex-start; padding: 12px 14px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--wash); }

/* Saved goals */
.search-goal-actions { flex-wrap: wrap; align-items: flex-end; }
.goal-save-group { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.saved-goals { position: relative; }
.saved-goals > summary { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 10px 16px; border-radius: var(--control-radius); list-style: none; }
.saved-goals > summary::-webkit-details-marker { display: none; }
.saved-goals-panel { position: absolute; z-index: 40; top: calc(100% + 6px); left: 0; display: grid; gap: 8px; width: min(320px, calc(100vw - 32px)); max-height: min(340px, calc(100dvh - 160px)); padding: 12px; overflow: auto; }
.saved-goals-title { margin: 0; color: var(--muted); font-size: 11px; letter-spacing: .06em; text-transform: uppercase; }
.saved-goals-list { display: grid; gap: 2px; margin: 0; padding: 0; list-style: none; }
.saved-goal-item { width: 100%; min-height: 40px; padding: 8px 10px; border: 0; border-radius: 6px; background: none; color: var(--ink); font: inherit; text-align: left; cursor: pointer; }
.saved-goal-item:hover { background: var(--accent-wash); }
.saved-goal-item.is-current { background: var(--accent-wash); font-weight: 650; }
.saved-goal-new { justify-self: start; }

/* Scan controls */
.scan-buttons { display: flex; align-items: center; gap: 8px; }
.scan-buttons button { min-height: 44px; }
#self-service-scan[aria-busy="true"] { display: inline-flex; align-items: center; gap: 8px; }
.scan-spinner { display: inline-block; width: 14px; height: 14px; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: scan-spin .8s linear infinite; }
@keyframes scan-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .scan-spinner { animation-duration: 2.4s; } }
/* A tailoring run in flight, and a result replayed after one finished while the
   customer was on another screen. Both reuse .resume-panel; only the heading
   row and the note need anything of their own. */
.tailor-running h3 { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
.tailor-running .v3-caption { margin: .35rem 0 0; max-width: 62ch; }
.tailor-resumed { margin: 0 0 .5rem; }

/* Notification drawer */
.notification-drawer:not([hidden]) { display: grid; align-content: start; gap: 0; }
/* A display rule on the drawer must never out-specify the hidden attribute. */
.notification-center[hidden], .multi-select-panel[hidden], .multi-select-option[hidden], .multi-select-group[hidden], .multi-select-no-match[hidden] { display: none; }
.notification-detail-list { display: grid; gap: 8px 14px; margin: 12px 16px; }
.notification-detail-list > div { display: grid; grid-template-columns: 148px minmax(0, 1fr); gap: 10px; }
.notification-detail-list dt { color: var(--muted); }
.notification-detail-list dd { margin: 0; overflow-wrap: anywhere; }
#notification-detail { padding: 14px 16px 18px; }
#notification-detail h3 { margin: 10px 0 4px; font-size: 16px; }
.notification-providers { margin-top: 12px; }
.notification-providers ul { margin: 8px 0 0; padding-left: 18px; color: var(--muted); font-size: 13px; }
.filter-popover .wide { grid-column: 1 / -1; }
.result-count { margin: 12px 0; color: var(--muted); font-size: 12px; }
.apply-results { max-width: 100%; overflow-x: auto; overflow-y: hidden; overscroll-behavior-inline: contain; padding: 0; }
.apply-job-head, .apply-job-main { display: grid; grid-template-columns: minmax(190px, 1.25fr) 84px minmax(140px, .8fr) 58px 92px 126px 112px; align-items: center; gap: 14px; }
.apply-job-head { grid-template-columns: 34px minmax(190px, 1.25fr) 84px minmax(140px, .8fr) 58px 92px 126px 112px; padding: 10px 18px; border-bottom: 1px solid var(--line); color: var(--muted); font-size: 10px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.apply-job-row { display: grid; grid-template-columns: 34px minmax(0, 1fr); align-items: center; gap: 0; width: 100%; min-height: 78px; padding: 0 18px; border-bottom: 1px solid var(--line); background: transparent; }
.self-service-job-head, .self-service-job-main { grid-template-columns: minmax(180px, 1.15fr) 78px minmax(126px, .75fr) 74px 132px 122px 104px minmax(130px, auto) 82px; }
.self-service-job-row { grid-template-columns: minmax(0, 1fr); }
.self-service-job-head, .self-service-job-row { min-width: 1088px; }
/* Goal Fit sits beside Compatibility, never inside it: the two answer
   different questions and must not read as one verdict. State is carried by
   the words, never by colour alone. */
.job-goal-fit { display: grid; gap: 2px; align-content: center; font-size: 12px; font-weight: 600; line-height: 1.25; }
.job-goal-fit small { color: var(--muted); font-size: 10px; font-weight: 500; line-height: 1.3; }
.job-goal-fit.state-match { color: #1c6b52; }
.job-goal-fit.state-partial { color: #7a5312; }
.job-goal-fit.state-mismatch { color: #8c3a30; }
.job-goal-fit.state-review, .job-goal-fit.state-unknown { color: var(--muted); }
/* "Not evaluated" is a state, not a bad score, and it must not look like one. */
.job-unscored { color: var(--muted); font-size: 11px; font-weight: 600; }
/* Application lifecycle: resume actions, manual apply, and the applied stamp.
   All three sit on the card itself rather than behind a menu, because they are
   the whole job of the Applications screen. */
.tracker-resume-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin: 8px 0 0; font-size: 12px; }
.tracker-resume-actions a, .tracker-resume-actions button { min-height: 32px; font-size: 12px; }
.tracker-resume-state { margin: 8px 0 0; color: var(--muted); font-size: 12px; }
.tracker-card-actions { display: flex; flex-wrap: wrap; align-items: end; gap: 12px; margin-top: 10px; }
.tracker-apply { min-height: 36px; padding: 6px 16px; }
/* "Applied" is a claim about something the user did, so it is stated in words
   with its date, never implied by styling alone. */
.tracker-applied { display: flex; align-items: baseline; gap: 8px; margin: 8px 0 0; font-size: 12px; }
.tracker-applied strong { color: #1c6b52; }
.tracker-applied span { color: var(--muted); }
.tailor-artifact-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--line); }
.tailor-applied { color: #1c6b52; font-size: 12px; font-weight: 600; }
.resume-compare-overlay { width: min(1100px, 100vw); }
.resume-compare-overlay .v2-comparison { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 16px; }
.resume-compare-overlay pre { max-height: 62vh; overflow: auto; padding: 14px; background: var(--wash); white-space: pre-wrap; overflow-wrap: anywhere; font-size: 12px; line-height: 1.5; }
.resume-compare-overlay h4 { margin: 0 0 8px; font-size: 13px; }
@media (max-width: 767px) { .resume-compare-overlay .v2-comparison { grid-template-columns: 1fr; } }
.apply-job-row:last-child { border-bottom: 0; }
.apply-job-row:hover { background: #fafcfb; }
.apply-job-main { width: 100%; min-height: 77px; padding: 12px 0; border: 0; background: transparent; color: var(--ink); text-align: left; }
.job-title-action { min-width: 0; min-height: 44px; padding: 4px 0; border: 0; background: transparent; color: var(--ink); text-align: left; }
.job-title-action:hover h3 { color: var(--accent); }
.job-select { display: grid; place-items: center; width: 34px; height: 44px; }
.job-select input { width: 17px; height: 17px; accent-color: var(--accent); }
.apply-job-row h3 { margin: 0 0 3px; font-size: 15px; }
.apply-job-row p { margin: 0; color: var(--muted); }
.apply-job-row .job-next { justify-self: end; min-height: 38px; padding: 7px 10px; border: 1px solid color-mix(in srgb, var(--accent) 30%, var(--border)); border-radius: var(--radius-sm); background: var(--surface); color: var(--accent); font: inherit; font-weight: 680; cursor: pointer; }
.apply-job-row .job-next:hover { background: var(--accent-soft); }
.apply-job-row .job-next:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }
.job-resume-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; min-width: 0; }
.job-resume-actions a, .job-resume-button { display: inline-flex; align-items: center; min-height: 38px; padding: 7px 8px; border: 0; border-radius: var(--radius-sm); background: transparent; color: var(--accent); font: inherit; font-size: 12px; font-weight: 680; line-height: 1.2; text-decoration: underline; text-underline-offset: 3px; }
.job-resume-button { cursor: pointer; }
.job-resume-button:hover, .job-resume-actions a:hover { background: var(--accent-wash); }
.job-resume-button:disabled { color: var(--muted); cursor: wait; text-decoration: none; }
.job-posted, .job-score, .lifecycle-status, .preparation-status { color: var(--muted); font-size: 12px; }
.lifecycle-status { width: 100%; min-height: 38px; padding: 6px 8px; }
.job-score { color: var(--accent); font-size: 16px; font-weight: 750; font-variant-numeric: tabular-nums; }
.preparation-status { font-weight: 680; }
.state-ready-for-review { color: var(--success); }
.state-needs-input, .state-needs-manual-action, .state-needs-confirmation, .state-failed { color: var(--amber); }
.prepare-selection { position: sticky; z-index: 4; top: calc(var(--nav-height) + 8px); display: flex; align-items: center; justify-content: flex-end; gap: 14px; margin: 12px 0; padding: 10px 12px; border: 1px solid var(--line); border-radius: var(--radius); background: rgb(255 255 255 / .98); }
.prepare-selection[hidden] { display: none; }
.auto-prepare-setting { display: grid; gap: 7px; margin-top: 20px; font-weight: 680; }
.apply-warning { display: block; margin-top: 6px; color: var(--amber); font-size: 11px; }
.pagination { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 16px; color: var(--muted); }
.pagination-actions { display: flex; gap: 8px; }

/* Guided Apply journey */
.apply-flow-page { max-width: 1120px; scroll-margin-top: calc(var(--nav-height) + var(--space-4)); }
.apply-flow-breadcrumb { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 24px; color: var(--muted); font-size: 13px; }
.apply-flow-breadcrumb .v3-link { min-height: 32px; padding: 0; }
.apply-flow-header { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 28px; }
.apply-flow-header h1 { max-width: 760px; margin: 0; font-size: 34px; line-height: 1.15; letter-spacing: -.035em; }
.apply-preparing-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(330px, .72fr); gap: 22px; align-items: start; }
.apply-focus-card { padding: 30px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); }
.apply-focus-card h2 { max-width: 650px; margin: 5px 0 12px; font-size: 24px; line-height: 1.28; letter-spacing: -.02em; }
.apply-focus-card > p:not(.v3-eyebrow) { max-width: 68ch; color: var(--muted); }
.preparing-orbit { position: relative; display: grid; place-items: center; width: 54px; height: 54px; margin-bottom: 26px; border: 1px solid var(--line); border-radius: 50%; background: var(--accent-wash); }
.preparing-orbit::before { width: 22px; height: 22px; border: 2px solid rgb(23 107 89 / .22); border-top-color: var(--accent); border-radius: 50%; content: ""; animation: apply-spin .9s linear infinite; }
.preparing-orbit span { position: absolute; width: 6px; height: 6px; border-radius: 50%; background: var(--accent); }
@keyframes apply-spin { to { transform: rotate(360deg); } }
.apply-progress { margin: 0; padding: 8px 24px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); list-style: none; }
.apply-progress li { position: relative; display: grid; grid-template-columns: 26px minmax(0, 1fr); gap: 11px; min-height: 56px; padding: 14px 0; color: var(--muted); }
.apply-progress li:not(:last-child)::after { position: absolute; top: 42px; bottom: -14px; left: 11px; width: 1px; background: var(--line); content: ""; }
.progress-marker { z-index: 1; display: grid; place-items: center; width: 24px; height: 24px; border: 1px solid var(--line-strong); border-radius: 50%; background: var(--panel); }
.progress-complete { color: var(--ink) !important; }
.progress-complete .progress-marker { border-color: var(--accent); background: var(--accent); }
.progress-complete .progress-marker::after { color: #fff; font-size: 13px; font-weight: 800; content: "✓"; }
.progress-active { color: var(--ink) !important; }
.progress-active .progress-marker { border: 2px solid rgb(23 107 89 / .25); border-top-color: var(--accent); animation: apply-spin .9s linear infinite; }
.progress-failed .progress-marker, .progress-attention .progress-marker { border-color: var(--amber); background: var(--amber-wash); }
.progress-failed .progress-marker::after, .progress-attention .progress-marker::after { color: var(--amber); font-weight: 800; content: "!"; }
.apply-progress strong, .apply-progress small { display: block; }
.apply-progress small { margin-top: 2px; color: var(--muted); font-size: 11px; }
.answer-tally { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; margin-top: 28px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--line); overflow: hidden; }
.answer-tally span { padding: 14px; background: var(--wash); color: var(--muted); font-size: 11px; text-transform: capitalize; }
.answer-tally strong { display: block; color: var(--ink); font-size: 19px; }
.review-card, .final-review, .outcome-card { max-width: 820px; margin: 0 auto; }
.flow-notice { margin: 18px 0; padding: 14px 16px; border-left: 3px solid var(--amber); background: var(--amber-wash); color: #624709; }
.flow-question-list { margin-top: 28px; }
.flow-question-list > h3 { margin-bottom: 12px; }
.flow-question { display: grid; gap: 8px; padding: 18px 0; border-top: 1px solid var(--line); }
.flow-question > label { color: var(--ink); font-weight: 680; }
.flow-question > small { color: var(--muted); }
.flow-question.manual { padding: 16px; border: 1px solid #efd49d; border-radius: var(--radius); background: var(--amber-wash); }
.flow-question.manual p { margin: 0; color: #624709; }
.generated-review { margin-top: 22px; border-top: 1px solid var(--line); }
.generated-review > summary { min-height: 52px; padding: 15px 0; color: var(--accent); font-weight: 680; }
.flow-primary-row { display: flex; justify-content: flex-end; margin-top: 26px; }
.flow-primary-row .v3-primary { min-width: 148px; }
.ready-heading { display: flex; align-items: center; gap: 15px; }
.ready-check { display: grid; flex: none; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--accent); color: #fff; font-size: 20px; font-weight: 800; }
.review-resume { display: grid; gap: 4px; margin: 26px 0; padding: 18px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface-soft); }
.review-resume h3 { margin: 0 0 7px; }
.review-resume span { color: var(--muted); }
.review-sections > h3 { margin-bottom: 8px; }
.review-sections details { border-top: 1px solid var(--line); }
.review-sections summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 54px; padding: 13px 0; }
.review-sections summary strong { color: var(--success); }
.review-answer { display: grid; grid-template-columns: minmax(160px, .7fr) minmax(0, 1.3fr); gap: 4px 18px; padding: 13px 0; }
.review-answer span { color: var(--muted); }
.review-answer small { grid-column: 2; color: var(--subtle); }
.final-safety-copy { margin-top: 24px; padding-top: 18px; border-top: 1px solid var(--line); font-size: 12px; }
.final-apply { min-width: 170px !important; }
.outcome-card { text-align: center; }
.outcome-card > p { margin-inline: auto; }
.outcome-icon { display: grid; place-items: center; width: 58px; height: 58px; margin: 0 auto 18px; border-radius: 50%; font-size: 24px; font-weight: 800; }
.outcome-icon.success { background: var(--accent-wash); color: var(--success); }
.outcome-icon.attention { background: var(--amber-wash); color: var(--amber); }
.technical-details { margin-top: 24px; text-align: left; }
.technical-details dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; margin: 12px 0 0; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--line); overflow: hidden; }
.technical-details dl div { min-width: 0; padding: 10px 12px; background: var(--wash); text-align: left; }
.technical-details dt { color: var(--muted); font-size: 11px; }
.technical-details dd { margin: 2px 0 0; overflow-wrap: anywhere; color: var(--ink); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px; }

/* Job detail and application flow */
.v2-backdrop { position: fixed; z-index: var(--layer-scrim); inset: 0; background: rgb(18 35 39 / .43); }
.detail { position: fixed; z-index: var(--layer-dialog); top: 0; right: 0; width: min(660px, 100%); height: 100dvh; padding: 0 36px 116px; overflow: auto; overscroll-behavior: contain; border: 0; background: var(--panel); box-shadow: -12px 0 36px rgb(23 43 48 / .14); }
.detail .close { position: sticky; z-index: 3; top: 0; float: none; display: grid; place-items: center; width: 44px; height: 44px; margin: 16px 0 18px auto; border: 1px solid var(--line); border-radius: var(--radius-sm); background: rgb(255 255 255 / .97); color: var(--ink); }
.detail > .eyebrow { display: block; margin: -52px 60px 28px 0; color: var(--muted); font-size: 12px; letter-spacing: 0; text-transform: none; }
.detail h2 { margin: 0 0 3px; font-size: 28px; line-height: 1.2; letter-spacing: -.025em; }
.detail > .subtitle { margin: 0 0 12px; color: var(--muted); font-size: 16px; }
.detail-meta { display: flex; flex-wrap: wrap; gap: 6px 16px; margin-bottom: 22px; color: var(--muted); font-size: 13px; }
.match-summary { display: flex; align-items: center; gap: 12px; padding: 16px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.match-number { color: var(--accent); font-size: 26px; font-weight: 770; }
.match-copy strong, .match-copy span { display: block; }
.match-copy span { color: var(--muted); font-size: 12px; }
.detail-signals { padding: 22px 0; border-bottom: 1px solid var(--line); }
.detail-signals h3 { margin: 0 0 10px; font-size: 17px; }
.signal-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 9px 16px; }
.fit-signal, .watch-signal { display: flex; gap: 9px; }
.fit-signal::before { color: var(--success); font-weight: 800; content: "✓"; }
.watch-signal::before { color: var(--amber); font-weight: 800; content: "△"; }
.role-summary { margin: 20px 0; color: #405357; }
.detail-primary-row { position: fixed; z-index: 2; right: 0; bottom: 0; display: flex; align-items: center; justify-content: flex-end; gap: 12px; width: min(660px, 100%); padding: 14px 28px; border-top: 1px solid var(--line); background: rgb(255 255 255 / .98); }
.detail-primary-row .v3-overflow { margin-right: auto; }
.detail > .v2-section-details { margin: 16px 0; }
.detail > .v2-section-details > summary { min-height: 44px; padding: 10px 0; color: var(--accent); font-weight: 650; }
.detail .liveness-result, .detail .resume-panel { margin: 12px 0; }
.journey-status { margin: 18px 0; padding: 18px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface-soft); }
.journey-status h3 { margin: 0 0 12px; font-size: 16px; }
.journey-checks { display: grid; gap: 8px; }
.journey-check { display: flex; gap: 9px; color: var(--muted); }
.journey-check.complete { color: var(--ink); }
.journey-check::before { color: var(--subtle); content: "○"; }
.journey-check.complete::before { color: var(--success); font-weight: 800; content: "✓"; }
.application-workspace { display: grid; gap: 14px; margin-top: 18px; }
.application-workspace .readiness-card { padding: 18px; border: 1px solid var(--line-strong); border-radius: var(--radius); background: var(--accent-wash); }
.application-workspace .workspace-group { margin: 0; padding: 16px; border: 1px solid var(--line); border-radius: var(--radius); }
.application-workspace .workspace-field { padding: 14px; border-left-width: 3px; background: var(--wash); }
.application-workspace .workspace-save { justify-self: start; }
.application-workspace .workspace-actions { display: grid; gap: 8px; }
.application-workspace .workspace-actions button { width: 100%; }
.application-workspace > .v2-section-details { border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); }
.application-workspace > .v2-section-details > summary { padding: 14px 16px; }

/* Applications */
.tracker-topline { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 20px; }
.tracker-stats { display: flex; flex-wrap: wrap; gap: 20px; color: var(--muted); }
.tracker-stats strong { color: var(--ink); font-size: 18px; }
.tracker-board { display: grid; grid-template-columns: repeat(5, minmax(220px, 1fr)); gap: 12px; overflow-x: auto; padding-bottom: 10px; }
.tracker-column { min-width: 220px; }
.tracker-column-head { display: flex; justify-content: space-between; gap: 10px; padding: 0 4px 9px; color: #47595d; font-weight: 680; }
.tracker-stack { display: grid; gap: 9px; }
.tracker-card { padding: 0; overflow: hidden; }
.tracker-open { display: block; width: 100%; min-height: 132px; padding: 16px; border: 0; background: transparent; text-align: left; }
.tracker-open:hover { background: #fafcfb; }
.tracker-open h3 { margin: 0 0 3px; font-size: 14px; }
.tracker-open p { margin: 0; color: var(--muted); font-size: 12px; }
.tracker-open .tracker-next { margin-top: 13px; padding-top: 11px; border-top: 1px solid var(--line); color: var(--accent); font-weight: 650; }
.tracker-update { border-top: 1px solid var(--line); }
.tracker-update > summary { min-height: 44px; padding: 11px 16px; color: var(--muted); font-size: 12px; list-style-position: inside; }
.tracker-update-form { display: grid; gap: 12px; padding: 0 16px 16px; }
.tracker-list { overflow: hidden; padding: 0; }
.tracker-list-head, .tracker-list-row { display: grid; grid-template-columns: 1fr 1.35fr 130px 130px 1.1fr 44px; align-items: center; gap: 16px; padding: 13px 18px; }
.tracker-list-head { border-bottom: 1px solid var(--line); color: var(--muted); font-size: 11px; letter-spacing: .04em; text-transform: uppercase; }
.tracker-list-row { border-bottom: 1px solid var(--line); }
.tracker-list-row:last-child { border-bottom: 0; }
.tracker-list-row > button { min-height: 44px; padding: 4px 0; border: 0; background: transparent; color: var(--ink); text-align: left; }
.tracker-list-row > button:hover { color: var(--accent); }
.tracker-list-row span { color: var(--muted); font-size: 13px; }
.tracker-list-update > summary { display: grid; place-items: center; width: 44px; height: 44px; list-style: none; }
.tracker-list-update > summary::-webkit-details-marker { display: none; }
.tracker-list-update[open] { grid-column: 1 / -1; }
.tracker-list-update .tracker-update-form { padding: 16px 0; }
.tracker-search { width: min(360px, 100%); }

/* Tailor Resume */
.tailor-stepper { display: grid; grid-template-columns: repeat(4, 1fr); margin: 0 0 26px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); overflow: hidden; }
.tailor-step { position: relative; display: grid; grid-template-columns: 30px minmax(0, 1fr); align-items: center; gap: 10px; min-height: 76px; padding: 14px 18px; border-right: 1px solid var(--line); color: var(--muted); }
.tailor-step:last-child { border-right: 0; }
.tailor-step-number { display: grid; place-items: center; width: 30px; height: 30px; border: 1px solid var(--line-strong); border-radius: 50%; background: var(--panel); font-weight: 720; }
.tailor-step strong, .tailor-step small { display: block; }
.tailor-step small { font-size: 11px; }
.tailor-step.active { background: var(--accent-wash); color: var(--ink); }
.tailor-step.active .tailor-step-number, .tailor-step.complete .tailor-step-number { border-color: var(--accent); background: var(--accent); color: #fff; }
.tailor-workflow { margin-bottom: 38px; }
.tailor-source-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.tailor-source-tabs button { min-height: 40px; padding: 7px 12px; }
.tailor-panel { margin-bottom: 16px; }
.tailor-panel h2 { margin: 0 0 6px; font-size: 18px; }
.tailor-panel p { color: var(--muted); }
.tailor-manual { border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); }
.tailor-manual > summary { min-height: 48px; padding: 13px 18px; color: var(--accent); font-weight: 680; }
.tailor-manual .tailor-panel { border: 0; }
.tailor-actions { display: flex; align-items: center; justify-content: flex-end; gap: 10px; margin-top: 16px; }
.tailored-library { margin-top: 18px; }
.tailored-search { display: block; width: min(460px, 100%); margin-bottom: 14px; }
.tailored-list { overflow: hidden; padding: 0; }
.tailored-head, .tailored-row { display: grid; grid-template-columns: 1fr 1.4fr 90px 110px 110px 28px; align-items: center; gap: 16px; padding: 13px 18px; }
.tailored-head { border-bottom: 1px solid var(--line); color: var(--muted); font-size: 11px; letter-spacing: .04em; text-transform: uppercase; }
.tailored-row { width: 100%; min-height: 68px; border: 0; border-bottom: 1px solid var(--line); background: transparent; text-align: left; }
.tailored-row:last-child { border-bottom: 0; }
.tailored-row:hover { background: #fafcfb; }
.tailored-row strong { font-size: 13px; }
.tailored-row span { color: var(--muted); font-size: 13px; }
.tailored-row .verified { color: var(--success); font-weight: 650; }
.resume-panel .v2-statline { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; margin: 18px 0; border: 1px solid var(--line); border-radius: var(--radius); background: var(--line); overflow: hidden; }
.resume-panel .v2-statline > div { padding: 14px; background: var(--panel); text-align: center; }
.resume-panel .v2-statline strong, .resume-panel .v2-statline span { display: block; }
.resume-panel .v2-statline strong { font-size: 17px; }
.resume-panel .v2-statline span { color: var(--muted); font-size: 11px; }

/* Profile */
.profile-overview { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 20px; margin-bottom: 16px; padding: 24px; }
.v2-avatar { display: grid; flex: none; place-items: center; width: 72px; height: 72px; border-radius: 50%; background: var(--accent-wash); color: var(--accent); font-size: 22px; font-weight: 720; object-fit: cover; }
.profile-overview h2 { margin: 0 0 3px; font-size: 23px; }
.profile-overview p { margin: 0; color: var(--muted); }
.profile-completeness { width: min(220px, 100%); height: 5px; margin: 9px 0 5px; border-radius: 99px; background: #dce6e3; overflow: hidden; }
.profile-completeness span { display: block; height: 100%; border-radius: inherit; background: var(--accent); }
.profile-readiness { margin-top: 10px !important; color: var(--ink) !important; }
.profile-fact-list { display: grid; gap: 12px; margin: 0; padding-left: 20px; }
.profile-review-details { margin-top: 8px; }
.profile-review-details > summary { color: var(--accent); cursor: pointer; font-size: 13px; }
.profile-review-details .profile-fact-list { gap: 9px; margin-top: 10px; font-size: 13px; }
.profile-chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 0; list-style: none; }
.profile-chips li { border: 1px solid var(--line); border-radius: 999px; padding: 2px 9px; background: var(--panel-muted, #f6f8f9); font-size: 12px; line-height: 1.6; }
.profile-conflicts { display: grid; gap: 12px; margin: 16px 0; padding: 16px; border: 1px solid var(--line); border-radius: var(--control-radius); }
.profile-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.profile-section { margin: 0; padding: 20px; }
.profile-section#profile-answers { grid-column: 1 / -1; }
.profile-section h2 { margin: 0 0 14px; font-size: 16px; }
.profile-definition { display: grid; grid-template-columns: 138px minmax(0, 1fr); gap: 9px 14px; margin: 0; }
.profile-definition dt { color: var(--muted); }
.profile-definition dd { margin: 0; overflow-wrap: anywhere; }
.profile-editor { margin: 16px 0; }
.profile-editor > summary { min-height: 48px; padding: 13px 18px; color: var(--accent); font-weight: 680; }
.profile-editor-body { display: grid; gap: 24px; padding: 4px 20px 20px; }
.profile-editor-body h3 { margin: 0 0 14px; font-size: 16px; }
.v2-form { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.v2-form .wide { grid-column: 1 / -1; }
.profile-save-row { display: flex; justify-content: flex-end; gap: 10px; }
.profile-photo-tools { border-top: 1px solid var(--line); padding-top: 18px; }
.profile-document-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.answer-library article { display: grid; grid-template-columns: minmax(120px, .7fr) minmax(180px, 1.4fr) minmax(170px, 1fr) auto; gap: 12px; align-items: center; padding: 14px 0; border-bottom: 1px solid var(--line); }
.answer-library article:last-child { border-bottom: 0; }
.answer-library article > div small, .answer-library article > div strong { display: block; }
.answer-library article > span, .answer-library article > small { margin: 0; }
.answer-library .v2-section-details { margin: 0; }
.v2-comparison { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.v2-comparison pre { max-height: 360px; overflow: auto; background: var(--wash); padding: 16px; }

.v3-empty { padding: 26px 22px; color: var(--muted); text-align: center; }
.toast { z-index: var(--layer-toast); }

@media (max-width: 1100px) {
  .topbar-inner { grid-template-columns: 150px minmax(0, 1fr) 100px; padding: 0 24px; }
  .journey-nav { gap: 18px; }
  .page { padding: 36px 24px 72px; }
  .dash-panels { grid-template-columns: 1fr; }
  .apply-job-main { grid-template-columns: minmax(170px, 1.2fr) 68px minmax(110px, .8fr) 46px 90px 100px 92px; }
  .apply-job-head { grid-template-columns: 34px minmax(170px, 1.2fr) 68px minmax(110px, .8fr) 46px 90px 100px 92px; }
  .self-service-job-head, .self-service-job-main { grid-template-columns: minmax(160px, 1.1fr) 64px minmax(100px, .75fr) 66px 120px 108px 92px minmax(120px, auto) 76px; }
  .profile-grid { grid-template-columns: 1fr; }
}

@media (min-width: 768px) and (max-width: 900px) {
  .search-goal-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .apply-job-main { grid-template-columns: minmax(160px, 1fr) 68px 46px 88px 96px 88px; }
  .apply-job-head { grid-template-columns: 34px minmax(160px, 1fr) 68px 46px 88px 96px 88px; }
  .self-service-job-head, .self-service-job-main { grid-template-columns: minmax(150px, 1fr) 64px 66px 114px 104px 88px minmax(120px, auto) 76px; }
  .self-service-job-head, .self-service-job-row { min-width: 856px; }
  .job-location, .apply-job-head:not(.self-service-job-head) span:nth-child(4), .self-service-job-head span:nth-child(3) { display: none; }
}

@media (min-width: 901px) and (max-width: 1100px) {
  .search-goal-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 900px) {
  .metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 1100px) and (min-width: 768px) {
  .progress-visual { grid-template-columns: 116px minmax(0, 1fr); }
}


@media (max-width: 767px) {
  .search-goal-grid { grid-template-columns: 1fr; }
  .search-goal-actions { align-items: stretch; flex-direction: column; }
  .search-goal-actions > button, .search-goal-actions .scan-control button { width: 100%; min-height: 44px; }
  .search-goal-actions .scan-control { justify-items: stretch; }
  :root { --nav-height: 112px; }
  .topbar { height: var(--nav-height); }
  .topbar-inner { grid-template-columns: 1fr auto; height: auto; padding: 12px 16px 0; }
  .brand { height: 40px; }
  .avatar-button.nav-item { grid-column: 2; grid-row: 1; }
  .topbar-actions { grid-column: 2; grid-row: 1; }
  .journey-nav { grid-column: 1 / -1; grid-row: 2; justify-content: flex-start; gap: 20px; height: 59px; overflow-x: auto; scrollbar-width: none; }
  .journey-nav::-webkit-scrollbar { display: none; }
  .journey-nav .nav-item { flex: none; font-size: 12px; }
  .page { padding: 28px 16px 64px; }
  .page > h1 { font-size: 28px; }
  .page > .subtitle { margin-bottom: 24px; font-size: 15px; }
  .metric-grid { grid-template-columns: 1fr; }
  .page-dashboard > .subtitle { margin-bottom: 16px; }
  .dash-goal { align-items: stretch; flex-direction: column; }
  .dash-goal > .v3-secondary { width: 100%; min-height: 44px; }
  .dash-goal-main { flex-direction: column; gap: 3px; }
  .progress-visual { grid-template-columns: 1fr; justify-items: center; gap: 16px; }
  .progress-legend { width: 100%; }
  .dash-module-head { flex-wrap: wrap; gap: 4px 12px; }
  .dash-head { display: none; }
  .dash-row, .dash-opportunity-row, .dash-application-row { grid-template-columns: 1fr; gap: 0; padding: 4px 16px 16px; }
  .dash-row-open { min-height: 0; padding: 14px 0 6px; }
  .dash-cell { display: grid; grid-template-columns: 92px minmax(0, 1fr); align-items: center; gap: 10px; padding: 6px 0; }
  .dash-cell-label { position: static; width: auto; height: auto; margin: 0; overflow: visible; clip: auto; color: var(--subtle); font-size: 11px; font-weight: 680; letter-spacing: .04em; text-transform: uppercase; white-space: normal; }
  .dash-cell-action { justify-self: stretch; }
  .dash-row-action { width: 100%; min-height: 44px; }
  .dash-row .lifecycle-status { min-height: 44px; }
  .background-row > summary { align-items: flex-start; flex-direction: column; gap: 7px; }
  .background-status { max-width: none; text-align: left; }
  .background-progress-detail { grid-template-columns: 1fr; }
  .background-progress-detail ol { grid-template-columns: 1fr; }
  .attention-row { grid-template-columns: 1fr; padding: 0; }
  .attention-open { grid-template-columns: 1fr; }
  .attention-row > .lifecycle-control { margin: 0 16px 16px; }
  .next-label { justify-self: start; }
  .apply-header-tools { grid-template-columns: 1fr; }
  .scan-control { justify-items: stretch; }
  .scan-control .v3-secondary { width: 100%; }
  .apply-viewbar { align-items: flex-start; flex-direction: column; }
  .segmented { width: 100%; }
  .segmented button { flex: 1; padding-inline: 8px; }
  .apply-filters { flex-wrap: nowrap; width: 100%; overflow-x: auto; padding: 2px; }
  .filter-popover { position: fixed; z-index: 55; top: 118px; right: 16px; left: 16px; grid-template-columns: 1fr; width: auto; max-height: calc(100dvh - 140px); overflow: auto; }
  .filter-popover .wide { grid-column: auto; }
  .multi-select-panel, .saved-goals-panel { width: min(320px, calc(100vw - 32px)); }
  .goal-save-group, .scan-buttons { width: 100%; }
  .goal-save-group > button, .saved-goals, .saved-goals > summary, .scan-buttons > button { flex: 1 1 auto; justify-content: center; }
  .apply-job-head { display: none; }
  .apply-job-row { grid-template-columns: 32px minmax(0, 1fr); padding: 0 14px; }
  .apply-job-main { grid-template-columns: minmax(0, 1fr) auto; gap: 7px 12px; padding: 15px 0; }
  .self-service-job-row { grid-template-columns: minmax(0, 1fr); }
  .self-service-job-head, .self-service-job-row { min-width: 0; }
  .self-service-results { overflow-x: hidden; }
  .self-service-job-main { grid-template-columns: minmax(0, 1fr) auto; }
  .self-service-job-main .job-title-action { grid-column: 1 / -1; grid-row: 1; }
  .self-service-job-main .job-posted { grid-column: 1; grid-row: 2; }
  .self-service-job-main .job-score { grid-column: 2; grid-row: 2; justify-self: end; }
  .self-service-job-main .job-compatibility { grid-column: 1 / -1; grid-row: 3; justify-self: start; }
  .self-service-job-main .job-location { grid-column: 1 / -1; grid-row: 4; }
  .self-service-job-main > .lifecycle-status { grid-column: 1 / -1; grid-row: 5; }
  .self-service-job-main .job-resume-actions, .self-service-job-main .job-resume-button { grid-column: 1; grid-row: 6; justify-self: start; }
  .self-service-job-main > .job-resume-button { min-height: 44px; }
  .self-service-job-main .job-resume-actions a, .self-service-job-main .job-resume-actions button { min-height: 44px; }
  .preparation-status { grid-column: 1; }
  .apply-job-main > .lifecycle-status { grid-column: 1 / -1; display: block; }
  .apply-job-row .job-next { grid-column: 2; grid-row: 4; justify-self: end; }
  .self-service-job-main .job-next { grid-column: 2; grid-row: 6; min-height: 44px; }
  .prepare-selection { align-items: stretch; flex-direction: column; }
  .prepare-selection .v3-primary { width: 100%; }
  .pagination { align-items: flex-start; flex-direction: column; }
  .apply-flow-header h1 { font-size: 28px; }
  .apply-flow-header { align-items: stretch; flex-direction: column; }
  .technical-details dl { grid-template-columns: 1fr; }
  .apply-preparing-grid { grid-template-columns: 1fr; }
  .apply-focus-card { padding: 22px 18px; }
  .answer-tally { grid-template-columns: 1fr 1fr; }
  .apply-progress { padding-inline: 18px; }
  .review-answer { grid-template-columns: 1fr; }
  .review-answer small { grid-column: auto; }
  .flow-primary-row .v3-primary { width: 100%; }
  .detail { padding: 0 20px 108px; }
  .detail h2 { font-size: 25px; }
  .detail-primary-row { padding: 12px 16px; }
  .signal-grid { grid-template-columns: 1fr; }
  .tracker-topline { align-items: flex-start; flex-direction: column; }
  .tracker-board { grid-template-columns: 1fr; margin-right: 0; padding-right: 0; overflow-x: visible; }
  .tracker-column { min-width: 0; }
  .tracker-list-head { display: none; }
  .tracker-list-row { grid-template-columns: minmax(0, 1fr) auto; padding: 15px; }
  .tracker-list-row > span { grid-column: 1 / -1; }
  .tracker-list-row > .lifecycle-status { grid-column: 1 / -1; display: block; }
  .tracker-list-update { grid-column: 2; grid-row: 2; }
  .tracker-search { width: 100%; }
  .detail-lifecycle, .background-row-actions { align-items: stretch; flex-direction: column; }
  .tailor-stepper { grid-template-columns: 1fr 1fr; }
  .tailor-step { min-height: 64px; padding: 11px 13px; border-bottom: 1px solid var(--line); }
  .tailor-step:nth-child(2) { border-right: 0; }
  .tailor-step:nth-child(3), .tailor-step:nth-child(4) { border-bottom: 0; }
  .tailored-head { display: none; }
  .tailored-row { grid-template-columns: minmax(0, 1fr) auto; padding: 16px; }
  .tailored-row > span:nth-child(2) { grid-column: 1 / -1; }
  .tailored-row > span:nth-child(4), .tailored-row > span:nth-child(5) { display: none; }
  .resume-panel .v2-statline { grid-template-columns: 1fr; }
  .profile-overview { grid-template-columns: auto minmax(0, 1fr); padding: 20px; }
  .profile-overview > .v3-primary { grid-column: 1 / -1; width: 100%; }
  .profile-definition { grid-template-columns: 1fr; }
  .profile-definition dd { margin-top: -6px; margin-bottom: 7px; }
  .v2-form, .v2-comparison { grid-template-columns: 1fr; }
  .v2-form .wide { grid-column: auto; }
  .answer-library article { grid-template-columns: 1fr; }
  input:not([type="checkbox"]), select, textarea { font-size: 16px; }
}

@media (max-width: 390px) {
  .journey-nav { gap: 10px; }
  .journey-nav .nav-item { font-size: 11px; }
  .tailor-step { grid-template-columns: 26px minmax(0, 1fr); }
  .tailor-step-number { width: 26px; height: 26px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .progress-active .progress-marker::after { color: var(--accent); font-weight: 800; content: "•"; }
}

/* Profile Compatibility (TASK-017) — a new concept beside the legacy Score
   column, never a restyling of it. Every state is legible without colour: the
   cell always spells its state out, and the tint below is a secondary cue. */
.job-compatibility { display: inline-flex; align-items: center; min-width: 0; padding: 3px 7px; border: 1px solid var(--line); border-radius: var(--radius-sm); color: var(--ink); font-size: 11px; font-weight: 640; line-height: 1.3; overflow-wrap: anywhere; }
.job-compatibility.state-evaluated { border-color: color-mix(in srgb, var(--accent) 38%, var(--line)); background: var(--accent-soft); }
.job-compatibility.state-partial, .job-compatibility.state-stale { border-style: dashed; }
.job-compatibility.state-not_evaluated, .job-compatibility.state-failed { color: var(--muted); }
.filter-note { margin: 4px 0 0; color: var(--muted); font-size: 11px; line-height: 1.5; }
/* Its own section, deliberately NOT `.liveness-result`: the detail overlay
   sweeps every `dl` and `.liveness-result` into a collapsed "Technical details"
   disclosure, and an explanation of the compatibility number is the opposite of
   a technical detail. */
.detail .compatibility-panel { margin: 12px 0; padding: 12px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--surface); }
.detail .compatibility-panel > strong { display: block; }
.detail .compatibility-panel ul { margin: 4px 0 8px; padding-left: 18px; }
.detail .compatibility-panel li { margin-bottom: 4px; }
.compatibility-panel .compatibility-note, .operational-panel .compatibility-note { margin: 4px 0 8px; color: var(--muted); font-size: 12px; }
/* Operational review: its own section, never nested inside the compatibility
   number or the Goal Fit verdict. Same reasoning as the compatibility panel --
   it must not be swept into the collapsed "Technical details" disclosure. */
.detail .operational-panel { margin: 12px 0; padding: 12px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--surface); }
.detail .operational-panel > strong { display: block; }
.detail .operational-panel ul { margin: 4px 0 0; padding-left: 18px; }
.detail .operational-panel li { margin-bottom: 4px; }
.detail .operational-panel .compatibility-evidence { display: block; color: var(--muted); font-size: 11px; }
/* Names the legacy 1-5 metric so its "Excellent Match" wording cannot be read
   as a Profile Compatibility band. */
.match-summary .match-scale { display: block; color: var(--muted); font-size: 11px; font-weight: 600; letter-spacing: .02em; text-transform: uppercase; }
.compatibility-panel .compatibility-evidence { color: var(--muted); font-size: 11px; }
.compatibility-panel .compatibility-strength { color: var(--muted); font-weight: 600; }

/* ---------------------------------------------------------------------------
   Beta feedback — the customer's own verdict on a job and on a tailored resume.

   Deliberately plain. These are the two controls private beta exists to
   collect, and a control that looks like a rating widget invites a rating; a
   pair of ordinary buttons invites an answer. Meaning is never carried by
   colour alone: the chosen option carries `aria-pressed`, a visible border and
   its own label, so the state survives a monochrome screen and a screen reader
   unchanged.
   --------------------------------------------------------------------------- */
.detail-feedback, .tailor-feedback { margin: 16px 0; padding: 14px 16px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--wash); }
.detail-feedback h3, .tailor-feedback h3 { margin: 0 0 10px; font-size: 14px; }
.feedback-options { display: flex; flex-wrap: wrap; gap: 8px; }
.feedback-option { min-height: 44px; padding: 10px 16px; border: 1px solid var(--line-strong); border-radius: var(--radius-sm); background: var(--panel); color: var(--ink); font-weight: 620; }
.feedback-option:hover { border-color: #7b9b94; background: var(--surface-soft); }
.feedback-option.is-chosen { border-color: var(--accent); background: var(--accent-wash); color: var(--accent-strong); }
.feedback-option.is-chosen::before { content: '✓ '; }
.feedback-reason { margin-top: 12px; }
.feedback-reason label { display: block; margin-bottom: 4px; font-weight: 620; font-size: 13px; }
.feedback-reason select { min-height: 44px; width: 100%; max-width: 420px; padding: 9px 10px; border: 1px solid var(--line-strong); border-radius: var(--radius-sm); background: var(--panel); color: var(--ink); }
.feedback-caption { margin: 10px 0 0; }

/* The recorded verdict where a posting is listed. It rides in the company line
   of the title cell, so it costs the nine-column grid nothing, and it is absent
   entirely when no verdict exists -- a neutral badge on an unanswered job would
   read as an answer. */
.job-verdict-chip { margin-left: 8px; padding: 1px 7px; border: 1px solid var(--line-strong); border-radius: 99px; font-size: 11px; font-weight: 650; white-space: nowrap; }
.job-verdict-chip.verdict-relevant { border-color: var(--accent); background: var(--accent-wash); color: var(--accent-strong); }
.job-verdict-chip.verdict-not_relevant { border-color: var(--line-strong); background: var(--wash); color: var(--muted); }

/* ---------------------------------------------------------------------------
   Start here — the first-run panel. It sits above the goal card, is rendered
   only while the workspace has produced nothing, and is an ordered list because
   the steps genuinely are ordered: each one is the next one's prerequisite.
   --------------------------------------------------------------------------- */
.dash-start { margin-bottom: 16px; padding: 16px 18px; }
.dash-start-head { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 12px; margin-bottom: 12px; }
.dash-start-head p { margin: 0; }
.dash-start-lede { font-size: 15px; font-weight: 660; letter-spacing: -.01em; }
.dash-start-steps { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; counter-reset: none; }
.dash-start-step { display: grid; grid-template-columns: 26px minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 10px 12px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--panel); }
.dash-start-step.is-next { border-color: var(--accent); background: var(--accent-wash); }
.dash-start-marker { display: grid; place-items: center; width: 26px; height: 26px; border: 1px solid var(--line-strong); border-radius: 99px; background: var(--panel); font-size: 12px; font-weight: 700; }
.dash-start-step.is-done .dash-start-marker { border-color: var(--accent); background: var(--accent-wash); color: var(--accent-strong); }
.dash-start-body { display: grid; gap: 2px; min-width: 0; }
.dash-start-body strong { font-size: 14px; }
.dash-start-foot { margin: 12px 0 0; }
@media (max-width: 560px) {
  .dash-start-step { grid-template-columns: 26px minmax(0, 1fr); }
  .dash-start-state { grid-column: 2; }
  .dash-start-state .v3-secondary { width: 100%; }
}

/* A tailoring run that failed. The v2 panel previously showed nothing at all,
   so the customer waited, then saw the same screen. A refused prerequisite is
   styled as guidance rather than as damage: it is the one failure here the
   customer can clear themselves, in a minute. */
.resume-failure { display: grid; gap: 6px; margin: 0 0 12px; padding: 12px 14px; border: 1px solid var(--danger); border-left-width: 3px; border-radius: var(--radius-sm); background: #fdf3f2; }
.resume-failure.is-prerequisite { border-color: var(--amber); background: var(--amber-wash); }
.resume-failure strong { font-size: 14px; }
.resume-failure span { color: var(--muted); font-size: 13px; }
.resume-failure ul { margin: 2px 0 0; padding-left: 18px; color: var(--muted); font-size: 12px; }
.resume-failure .v3-secondary { justify-self: start; margin-top: 4px; }

/* ---------------------------------------------------------------------------
   Beta Evidence (B02) — the two beta judgements, read back as counts.

   No chart and no colour-coded verdict. These are four numbers over a sample
   of a handful, and a bar or a red/green rate would lend them a confidence the
   sample cannot carry. A rate is shown only where there is a denominator to
   take it over; where there is none the section says so in a sentence, in the
   ordinary caption colour, because "nothing judged yet" is not a warning.
   --------------------------------------------------------------------------- */
.beta-evidence { display: grid; gap: 14px; }
.beta-evidence h3 { margin: 0 0 8px; font-size: 13px; letter-spacing: .01em; text-transform: uppercase; color: var(--muted); }
.beta-evidence-stats { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.beta-evidence-stat, .beta-evidence-activation, .beta-evidence-reasons { padding: 12px 14px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--wash); }
.beta-evidence-counts, .beta-evidence-signals { display: grid; gap: 4px; margin: 0; padding: 0; list-style: none; }
.beta-evidence-counts li, .beta-evidence-signals li { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.beta-evidence-counts span, .beta-evidence-signals span { color: var(--muted); }
.beta-evidence-counts strong, .beta-evidence-signals strong { font-variant-numeric: tabular-nums; }
.beta-evidence-rate { margin: 10px 0 0; font-size: 20px; font-weight: 700; letter-spacing: -.01em; font-variant-numeric: tabular-nums; }
.beta-evidence-empty { margin: 0; }
.beta-evidence-reasons ul { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.beta-evidence-reasons li { display: grid; gap: 1px; }
.beta-evidence-reason { font-weight: 620; }
.beta-evidence-caveat { margin: 0; }