/* =============================================================================
   MAGNIFIHIRE — APPLICATION STYLESHEET

   LandedUp's rail-and-page app, drawn from the MagnifiHire mock-up: a cream page,
   white rounded cards in the palette's four tones, the wordmark with "Hire"
   highlighted, pill controls, bold headlines with one highlighted phrase.

   THE RULES (see DESIGN_SYSTEM.md)
   1. Data lives in cards: white, a soft cream frame, --r-card corners, no shadow.
      Text sections between cards are rules and space.
   2. No ornament: no rotated shapes, glows, gradients, blur or sparkle icons.
   3. More than one colour, but only the palette: indigo, teal, sky and navy, as
      card tones, avatars, bars and tags. Status colours are for status only.
   4. The sky highlighter (--mark) marks the phrase that matters, about once a view.
   5. One navy (sky in dark) call to action per view. Every other action is an
      outline pill.
   6. One face, Open Sans: bold for titles, light for large figures.
   7. Motion is a reveal, not a performance. Fully off under reduced motion.

   Every colour, radius and typeface comes from magnifihire-tokens.css. Do not
   hardcode a brand colour here: design-system.test.ts fails.
   Load order matters: the tokens file must come first.
   ========================================================================== */
*,*::before,*::after { box-sizing: border-box; margin: 0; padding: 0; }
  html, body { min-height:100vh; }
  html { overflow-x:clip; }  /* the closed slide panel sits off-canvas; it must not widen the page on a phone */
  body { font-family:var(--body); background:var(--bg); color:var(--text); font-size:14.5px; line-height:1.6; -webkit-font-smoothing:antialiased; }
  /* Film grain: a PNG, not an feTurbulence filter (far cheaper to composite). */
  body::before { content:''; position:fixed; inset:0; pointer-events:none; z-index:100; opacity:var(--grain); mix-blend-mode:var(--grain-blend); background:url(/grain.png); transform:translateZ(0); }
  @media print { body::before { display:none; } }

  h1,h2 { font-family:var(--display); color:var(--text); font-weight:700; letter-spacing:-.025em; line-height:1.08; text-wrap:balance; }
  h3,h4 { font-family:var(--display); color:var(--text); font-weight:600; letter-spacing:-.01em; text-wrap:balance; }
  /* The phrase that matters: bold, in the accent. */
  em { font-style:normal; font-weight:700; color:var(--accent); }
  button { font-family:inherit; cursor:pointer; border:none; background:none; color:inherit; }
  input,select,textarea { font-family:inherit; color:inherit; }
  a { color:inherit; text-decoration:none; }
  p { text-wrap:pretty; }
  ::placeholder { color:var(--ghost); }

  /* Thin, quiet scrollbars everywhere. */
  * { scrollbar-width:thin; scrollbar-color:var(--line2) transparent; }
  *::-webkit-scrollbar { width:6px; height:6px; }
  *::-webkit-scrollbar-thumb { background:var(--line2); border-radius:var(--r-bar); }

  :focus-visible { outline:2px solid var(--accent); outline-offset:3px; border-radius:var(--r-ctl); }

  /* The highlighter: the brand's one flourish. */
  .hl, mark { background:var(--mark); color:var(--mark-ink); padding:0 .16em; margin:0 -.04em; border-radius:var(--r-bar); -webkit-box-decoration-break:clone; box-decoration-break:clone; }
  em.hl { font-style:normal; font-weight:700; }

  /* WORDMARK. The supplied artwork (public/wordmark-light.png / wordmark-dark.png), sized in em so it follows each place's font size; the theme picks which file shows. */
  .wordmark { display:block; width:8.4em; height:auto; max-width:100%; }
  .wordmark-dark { display:none; }
  html[data-theme=dark] .wordmark-light { display:none; }
  html[data-theme=dark] .wordmark-dark { display:block; }

  /* A candidate's mark: a round portrait when there is a photo; otherwise their
     initials in a soft accent-tinted circle. One tone for everyone, no per-person colour. */
  .avatar { display:block; border-radius:50%; object-fit:cover; flex:none; background:var(--track); }
  .ini { display:inline-flex; align-items:center; justify-content:center; flex:none; border-radius:50%; background:var(--accent-soft); color:var(--accent); font-family:var(--body); font-weight:700; letter-spacing:.02em; line-height:1; user-select:none; }

  /* THE PHONE TOP BAR. On a desktop the brand lives in the rail. */
  .topbar { background:var(--bg); color:var(--text); padding:0 32px; border-bottom:1px solid var(--line); height:64px; display:none; align-items:center; gap:14px; position:sticky; top:0; z-index:50; }
  .brand-block { display:flex; align-items:center; gap:14px; flex:none; }
  .brand-mark { display:flex; align-items:center; font-family:var(--display); font-size:22px; font-weight:700; letter-spacing:-.02em; line-height:1; color:var(--text); }
  .brand-mark .hl { padding:3px 8px; margin:0 0 0 2px; border-radius:var(--r-ctl); }
  .topbar-right { display:flex; align-items:center; gap:12px; margin-left:auto; }
  .acct { display:none; }
  .key-chip { font-size:10.5px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
  .key-chip.ok { color:var(--ok-ink); }
  .key-chip.missing { color:var(--warn-ink); }
  .role-pill { display:inline-block; font-size:10px; font-weight:700; padding:3px 10px 2px; letter-spacing:.12em; text-transform:uppercase; background:var(--accent-soft); color:var(--accent); border:0; border-radius:var(--r-pill); margin-left:6px; }
  .signout { color:var(--muted); font-size:13.5px; font-weight:600; cursor:pointer; padding:0; border:0; line-height:1.2; transition:color .2s; }
  .signout:hover { color:var(--text); }
  .ask-magnifihire-btn { background:var(--cta); border:1.5px solid var(--cta); color:var(--cta-ink); border-radius:var(--r-pill); padding:8px 18px; font-size:13.5px; font-weight:700; cursor:pointer; white-space:nowrap; transition:background .2s; }
  .ask-magnifihire-btn:hover { background:var(--cta-hi); }

  /* ASK MAGNIFIHIRE: a floating pill, as the assistant is in the LandedUp app. */
  .ask-fab { position:fixed; right:24px; bottom:24px; z-index:60; display:inline-flex; align-items:center; padding:14px 26px; border-radius:var(--r-pill); background:var(--cta); color:var(--cta-ink); font-weight:700; font-size:14.5px; transition:background .2s,transform .25s var(--ease); }
  .ask-fab:hover { background:var(--cta-hi); transform:translateY(-2px); }
  body:has(#compare-tray) .ask-fab { bottom:92px; }

  /* THEME TOGGLE. Moon in light mode (go dark), sun in dark mode (go light). */
  .theme-toggle { width:38px; height:38px; border-radius:50%; border:1.5px solid var(--line2); display:inline-grid; place-items:center; color:var(--muted); background:var(--card); transition:color .2s,border-color .2s; flex:none; }
  .theme-toggle:hover { color:var(--text); border-color:var(--text); }
  .theme-toggle svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
  .theme-toggle .ic-sun { display:none; }
  html[data-theme=dark] .theme-toggle .ic-sun { display:block; }
  html[data-theme=dark] .theme-toggle .ic-moon { display:none; }

  /* LAYOUT: a full-height left rail and a main column, as in the LandedUp app. */
  .app-layout { display:grid; grid-template-columns:268px minmax(0,1fr); min-height:100vh; }
  .sidebar { display:flex; flex-direction:column; background:none; border-right:1px solid var(--line); padding:28px 14px 0; height:100vh; position:sticky; top:0; overflow-y:auto; }
  .main-pane { --mp-x:40px; --mp-y:34px; padding:var(--mp-y) var(--mp-x) 100px; max-width:1260px; width:100%; min-width:0; }

  /* RAIL */
  .nav-group { margin-bottom:2px; flex:none; }
  .rail-brand { padding:2px 12px 22px; flex:none; }
  .rail-brand .brand-mark { font-size:24px; }
  .rail-brand small { display:block; margin-top:8px; font-size:12px; font-weight:500; color:var(--dim); line-height:1.4; }
  .rail-foot { margin:auto -14px 0; position:sticky; bottom:0; z-index:2; padding:16px 26px 20px; border-top:1px solid var(--line); background:var(--bg); flex:none; }
  .rail-user { display:flex; align-items:center; flex-wrap:wrap; gap:6px 8px; font-size:13.5px; margin-bottom:12px; }
  .rail-user strong { font-weight:600; color:var(--text); }
  .rail-user .role-pill { margin-left:0; }
  .rail-actions { display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:10px; }
  .rail-actions .theme-toggle { width:34px; height:34px; }
  .rail-foot .fine { font-size:10.5px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--dim); }
  .nav-label { padding:22px 12px 8px 14px; font-size:10px; font-weight:700; text-transform:uppercase; color:var(--dim); letter-spacing:.17em; }
  .nav-item { display:flex; align-items:center; gap:12px; padding:8px 12px; font-size:13.5px; font-weight:500; color:var(--muted); background:none; border-radius:var(--r-tile); cursor:pointer; transition:color .2s,background .2s; min-height:40px; }
  .nav-item:hover { color:var(--text); background:var(--accent-soft); }
  .nav-item.active { color:var(--accent); background:var(--accent-soft); font-weight:700; }
  .nav-item .ic { width:19px; height:19px; flex:none; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; opacity:.65; }
  .nav-item.active .ic { opacity:1; }
  .nav-item:focus-visible { outline-offset:-3px; }
  .nav-divider { height:1px; background:var(--line); margin:14px 12px; }
  .count { margin-inline-start:auto; font-size:11px; font-weight:700; color:var(--tone-2); padding:1px 9px; border-radius:var(--r-pill); background:color-mix(in srgb,var(--tone-2) 14%,transparent); }
  html[data-theme=dark] .count { color:var(--accent-2); }
  .count.warn { color:var(--warn-ink); background:var(--warn-pale); }

  /* PAGE: a bold title; the phrase that matters carries the highlighter. */
  .page-header { padding-bottom:26px; margin-bottom:6px; position:relative; }
  .eyebrow { display:block; font-size:11px; font-weight:700; color:var(--accent); letter-spacing:.16em; text-transform:uppercase; margin-bottom:14px; }
  .h1-page { font-family:var(--display); font-weight:700; font-size:clamp(28px,3.4vw,42px); color:var(--text); margin-bottom:12px; line-height:1.08; letter-spacing:-.03em; text-wrap:balance; }
  .h1-sub { font-size:15px; color:var(--muted); line-height:1.65; max-width:64ch; }

  /* THE CARD: white on the cream page, a soft frame, rounded, no shadow. It
     lifts a little and the frame warms when you point at it. */
  .card { position:relative; background:var(--card); border:1px solid var(--card-line); border-radius:var(--r-card); padding:26px 28px; margin-bottom:16px; transition:transform .25s var(--ease),border-color .25s; }
  .card:hover { border-color:color-mix(in srgb,var(--accent) 35%,transparent); }
  .card-title { font-size:19px; font-weight:700; margin-bottom:4px; color:var(--text); letter-spacing:-.015em; }
  .card-sub { font-size:13px; color:var(--dim); margin-bottom:18px; line-height:1.55; max-width:66ch; }

  /* BUTTONS. Always a pill. Outline in the accent by default; the call to action
     (.btn-primary) is navy in light and sky in dark, one per view. */
  .btn { white-space:nowrap; display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:11px 24px; border-radius:var(--r-pill); font-size:14px; font-weight:700; letter-spacing:0; text-transform:none; cursor:pointer; border:1.5px solid var(--accent); background:transparent; color:var(--accent); transition:background .2s,color .2s,border-color .2s,transform .25s var(--ease); }
  .btn:hover { background:var(--accent-soft); transform:translateY(-1px); }
  .btn:active { transform:scale(.98); }
  .btn:disabled, .btn:disabled:hover { opacity:.4; cursor:not-allowed; background:transparent; transform:none; }
  .btn-primary { background:var(--cta); border-color:var(--cta); color:var(--cta-ink); }
  .btn-primary:hover { background:var(--cta-hi); border-color:var(--cta-hi); }
  .btn-primary:disabled, .btn-primary:disabled:hover { background:var(--cta); }
  /* One call to action per row: every primary after the first goes outline. */
  .btn-primary ~ .btn-primary { background:transparent; border-color:var(--accent); color:var(--accent); }
  .btn-primary ~ .btn-primary:hover { background:var(--accent-soft); }
  .btn-secondary { background:transparent; color:var(--text); border-color:var(--line2); }
  .btn-secondary:hover { border-color:var(--text); background:transparent; }
  .btn-gold { background:var(--accent-soft); color:var(--accent); border-color:transparent; }
  .btn-gold:hover { background:var(--accent-soft); border-color:var(--accent); }

  /* FORMS */
  .form-field { margin-bottom:14px; }
  .form-row { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
  .form-row .form-field { margin-bottom:14px; }
  .form-field label { display:block; font-size:10.5px; font-weight:700; color:var(--dim); margin-bottom:6px; letter-spacing:.13em; text-transform:uppercase; }
  .form-field input, .form-field select, .form-field textarea { width:100%; padding:11px 14px; border:1px solid var(--line2); border-radius:var(--r); font-size:14.5px; color:var(--text); background:var(--card); transition:border-color .2s; }
  .form-field input:focus, .form-field select:focus, .form-field textarea:focus { outline:none; border-color:var(--accent); }
  .form-field textarea { min-height:90px; resize:vertical; line-height:1.5; }
  select { appearance:none; padding-inline-end:36px; background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%); background-position:calc(100% - 20px) 52%,calc(100% - 15px) 52%; background-size:5px 5px; background-repeat:no-repeat; }
  input[type=checkbox], input[type=radio] { accent-color:var(--accent); }
  input[type=range] { accent-color:var(--accent); }

  /* STATS: four cards in the palette's four tones, as in the mock-up. */
  .stats-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-bottom:22px; }
  .stat-card { background:var(--card); color:var(--text); border:1px solid var(--card-line); border-radius:var(--r-card); padding:22px 24px; transition:transform .25s var(--ease); }
  .stat-card:nth-child(4n+1) { background:var(--tone-1); border-color:var(--tone-1); color:var(--tone-1-ink); }
  .stat-card:nth-child(4n+3) { background:var(--tone-2); border-color:var(--tone-2); color:var(--tone-2-ink); }
  .stat-card:nth-child(4n+4) { background:var(--tone-3); border-color:var(--tone-3); color:var(--tone-3-ink); }
  .stat-card:hover { transform:translateY(-2px); }
  .stat-label { font-size:10.5px; font-weight:700; text-transform:uppercase; color:inherit; opacity:.75; letter-spacing:.13em; margin-bottom:10px; }
  .stat-value { font-family:var(--display); font-size:clamp(34px,3.6vw,48px); font-weight:300; letter-spacing:-.03em; color:inherit; line-height:1; }
  .stat-trend { font-size:12.5px; color:inherit; opacity:.8; margin-top:8px; }

  /* MOTION: one curve, a reveal not a performance. */
  @keyframes riseIn { from { opacity:0; transform:translateY(12px); } to { opacity:1; transform:translateY(0); } }
  .view-anim > * { animation: riseIn .6s var(--ease) both; }
  .view-anim > *:nth-child(1) { animation-delay:0s; }
  .view-anim > *:nth-child(2) { animation-delay:.05s; }
  .view-anim > *:nth-child(3) { animation-delay:.1s; }
  .view-anim > *:nth-child(4) { animation-delay:.15s; }
  .view-anim > *:nth-child(5) { animation-delay:.2s; }
  .view-anim > *:nth-child(6) { animation-delay:.25s; }
  .view-anim > *:nth-child(n+7) { animation-delay:.3s; }
  @keyframes barGrow { from { width:0; } }
  .bar-fill { animation: barGrow .7s var(--ease) both; }
  @keyframes ringDraw { from { stroke-dashoffset: var(--circ); } }
  .gauge-arc { animation: ringDraw .9s var(--ease) both; }
  @keyframes radarGrow { from { opacity:0; transform:scale(.55); } to { opacity:1; transform:scale(1); } }
  .radar-poly { transform-origin:50% 50%; animation: radarGrow .7s var(--ease) both; }
  @media (prefers-reduced-motion: reduce) {
    *,*::before,*::after { animation:none !important; transition:none !important; scroll-behavior:auto !important; }
  }

  /* DEMO STRIP */
  .demo-strip { background:var(--card); color:var(--text); border-bottom:1px solid var(--card-line); padding:8px 32px; display:flex; align-items:center; gap:16px; min-height:42px; }
  .demo-strip-copy { min-width:0; flex:1; display:flex; align-items:center; gap:12px; font-size:12.5px; color:var(--muted); }
  .demo-strip-copy strong { color:var(--accent); letter-spacing:.14em; font-size:10.5px; white-space:nowrap; text-transform:uppercase; }
  .demo-strip-copy span { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .demo-steps { display:flex; gap:8px; }
  .demo-step { padding:5px 13px; border:1.5px solid var(--accent); border-radius:var(--r-pill); color:var(--accent); font-size:10.5px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; white-space:nowrap; transition:background .2s,color .2s; }
  .demo-step:hover { background:var(--accent-soft); }
  .demo-step.active { color:var(--accent-ink); background:var(--accent); }
  .demo-close { color:var(--dim); font-size:17px; padding:4px 7px; }
  .demo-close:hover { color:var(--text); }
  .mobile-nav { display:none; color:var(--text); border:1.5px solid var(--line2); border-radius:50%; width:38px; height:38px; font-size:17px; background:var(--card); }
  body.demo-on .app-layout { min-height:calc(100vh - 42px); }
  body.demo-on .sidebar { top:42px; height:calc(100vh - 42px); }

  /* BREAKPOINTS. Below 1100px the rail becomes a drawer behind the top bar. */
  @media (max-width:1180px) {
    .main-pane { --mp-x:28px; --mp-y:34px; padding:var(--mp-y) var(--mp-x) 100px; }
    .stats-grid { grid-template-columns:repeat(2,1fr); }
    .demo-strip { padding:8px 20px; }
    .demo-strip-copy span { display:none; }
  }
  @media (max-width:1100px) {
    .topbar { display:flex; padding:0 20px; }
    .mobile-nav { display:inline-flex; align-items:center; justify-content:center; }
    .app-layout { display:block; min-height:calc(100vh - 64px); }
    .sidebar { position:fixed; left:0; top:64px; width:min(84vw,310px); height:calc(100vh - 64px); z-index:70; transform:translateX(-105%); transition:transform .3s var(--ease); background:var(--bg); border-right:1px solid var(--line2); padding-top:14px; }
    .sidebar .rail-brand { display:none; }
    body.demo-on .sidebar { top:106px; height:calc(100vh - 106px); }
    .sidebar.mobile-open { transform:translateX(0); }
    .ask-fab { right:14px; bottom:14px; padding:12px 20px; }
  }
  @media (max-width:820px) {
    .main-pane { --mp-x:18px; --mp-y:26px; padding:var(--mp-y) var(--mp-x) 100px; }
    .form-row, .stats-grid { grid-template-columns:1fr; }
    .demo-strip { overflow-x:auto; }
    .demo-strip-copy { display:none; }
    .demo-steps { min-width:max-content; }
  }
  @media (max-width:560px) {
    .btn { white-space:normal; }
    /* Multi-column inline grids with fixed tracks cannot fit a phone: stack them two-up. Icon-led rows (a fixed leading track) keep their shape. */
    .row-grid, .ivlist-row, .recon-row, .wdg-dim-row, .wdg-calib-row, .wdg-arch-row, #main [style*="display:grid"][style*="grid-template-columns"][style*="px "]:not([style*="grid-template-columns:44px"]):not([style*="grid-template-columns:32px"]):not([style*="grid-template-columns:46px"]):not([style*="grid-template-columns:50px"]), #main div:has(> .stat-card) { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
    #main [style*="display:flex"][style*="justify-content:space-between"] { flex-wrap:wrap !important; gap:10px; }
    #main [style*="display:flex"][style*="gap"]:not([style*="overflow-x"]) { flex-wrap:wrap !important; }
    #main [style*="overflow-x:auto"] { max-width:100%; min-width:0; }
    #main .tic-results-header, .page-header [style*="display:flex"], .page-header [style*="display: flex"] { flex-wrap:wrap !important; gap:10px; }
    .topbar { padding:0 12px; }
    .brand-mark { font-size:19px; }
    .ask-magnifihire-btn { display:none; }
    .theme-toggle { width:44px; height:44px; }
    .mobile-nav { width:44px; height:44px; }
    .demo-strip { padding:7px 12px; }
    .card { padding:20px 18px; }
    /* Client portal: the desktop gutters (40/60px) leave ~220px of content at 320px; stat grids carry inline column counts, hence !important. */
    .client-topbar { padding:16px 16px; }
    .client-main { padding:28px 16px 90px; }
    .client-hero { padding:24px 20px; }
    .stats-grid { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
    .client-main select { max-width:100%; }
    /* Portal "decision at a glance" is a 5-column table; stack it, the header row is redundant once stacked. */
    .glance-head { display:none !important; }
    .glance-row { grid-template-columns:minmax(0,1fr) !important; gap:4px !important; }
    .portal-pad { padding:20px 16px !important; }
  }
  @media (max-width:360px) {
    .stats-grid, #main div:has(> .stat-card) { grid-template-columns:minmax(0,1fr) !important; }
  }

  /* SIGN-IN. LandedUp's layout: the headline on one side, the sign-in on the other. */
  .lg2 { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); grid-template-rows:auto 1fr auto; column-gap:72px; min-height:100vh; padding:0 clamp(24px,5vw,72px); max-width:1320px; margin:0 auto; }
  .lg2-top { grid-column:1 / -1; display:flex; justify-content:space-between; align-items:center; height:88px; }
  .lg2-side { align-self:center; padding:24px 0 48px; }
  .lg2-side .eyebrow { margin-bottom:24px; }
  .lg2-h { font-size:clamp(42px,5.8vw,84px); font-weight:700; line-height:1.04; letter-spacing:-.035em; max-width:12ch; margin-bottom:24px; }
  .lg2-lead { font-size:19px; color:var(--text2); max-width:48ch; line-height:1.65; margin-bottom:34px; }
  .lg2-points { grid-column:1; }
  .lg2-list { list-style:none; counter-reset:n; max-width:540px; }
  .lg2-list li { counter-increment:n; display:grid; grid-template-columns:34px minmax(0,1fr); gap:0 6px; padding:16px 0; border-top:1px solid var(--line); }
  .lg2-list li:last-child { border-bottom:1px solid var(--line); }
  .lg2-list li::before { content:counter(n,decimal-leading-zero); padding-top:3px; font-size:12px; font-weight:700; color:var(--tone-2); }
  html[data-theme=dark] .lg2-list li::before { color:var(--accent-2); }
  .lg2-list small { display:block; font-size:11px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; color:var(--dim); }
  .lg2-list p { grid-column:2; margin-top:4px; font-size:15px; line-height:1.55; color:var(--text2); }
  .lg2-sheet { grid-column:2; grid-row:2 / span 2; align-self:center; padding:24px 0 48px; }
  .lg2-sheet-inner { width:100%; max-width:460px; background:var(--card); border:1px solid var(--card-line); border-radius:var(--r-card); padding:32px 32px 28px; }
  .lg2-sheet-no { font-size:10.5px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--tone-2); margin-bottom:10px; }
  html[data-theme=dark] .lg2-sheet-no { color:var(--accent-2); }
  .lg2-sheet-title { font-size:clamp(26px,2.4vw,32px); font-weight:700; color:var(--text); margin:0 0 8px; line-height:1.1; letter-spacing:-.025em; }
  .lg2-sheet-note { font-size:15px; color:var(--muted); line-height:1.6; margin:0 0 24px; max-width:46ch; }
  .lg2-hint { font-size:13px; color:var(--dim); line-height:1.6; margin-top:8px; }
  .lg2-btn { width:100%; height:52px; background:var(--cta); border:1.5px solid var(--cta); border-radius:var(--r-pill); color:var(--cta-ink); font-family:var(--body); font-size:16px; font-weight:700; cursor:pointer; margin-top:10px; transition:background .2s; }
  .lg2-btn:hover { background:var(--cta-hi); border-color:var(--cta-hi); }
  .lg2-btn:disabled { opacity:.5; cursor:not-allowed; }
  .lg2-foot { grid-column:1 / -1; padding:24px 0 28px; font-size:10.5px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--dim); border-top:1px solid var(--line); }
  .landing-field { margin-bottom:16px; }
  .landing-field label { display:block; font-size:10.5px; font-weight:700; color:var(--dim); margin-bottom:6px; letter-spacing:.13em; text-transform:uppercase; }
  .landing-field input { width:100%; background:var(--bg); border:1px solid var(--line2); border-radius:var(--r); color:var(--text); font-family:var(--body); font-size:16px; padding:13px 16px; outline:none; transition:border-color .2s; caret-color:var(--accent); }
  .landing-field input::placeholder { color:var(--ghost); }
  .landing-field input:focus { border-color:var(--accent); }
  .landing-error { padding:12px 16px; margin-bottom:16px; font-size:14px; color:var(--risk-ink); background:var(--risk-pale); border-radius:var(--r); }
  /* the two entries: pill tabs, the active one filled, as in the mock-up */
  .landing-mode-switch { display:flex; gap:8px; margin-bottom:26px; }
  .landing-mode-btn { flex:1; padding:9px 0; border-radius:var(--r-pill); border:1.5px solid var(--accent); font-size:11px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--accent); background:transparent; cursor:pointer; transition:background .2s,color .2s; }
  .landing-mode-btn:hover { background:var(--accent-soft); }
  .landing-mode-btn.active { color:var(--accent-ink); background:var(--accent); }
  .lg2-sheet-inner.client-mode .lg2-sheet-no { color:var(--tone-2); }
  .lg2-sheet-inner.client-mode .landing-mode-btn { border-color:var(--tone-2); color:var(--tone-2); }
  .lg2-sheet-inner.client-mode .landing-mode-btn.active { background:var(--tone-2); color:var(--tone-2-ink); }
  .lg2-sheet-inner.client-mode .landing-field input:focus { border-color:var(--tone-2); }
  @media (max-width:900px) {
    .lg2 { grid-template-columns:1fr; column-gap:0; grid-template-rows:auto; }
    .lg2-side { padding:8px 0 20px; }
    .lg2-h { font-size:clamp(40px,11vw,60px); }
    .lg2-sheet { grid-column:1; grid-row:auto; padding:8px 0 28px; }
    .lg2-sheet-inner { padding:24px 20px; }
    .lg2-points { grid-column:1; padding-bottom:28px; }
  }

  /* CANDIDATE INTELLIGENCE */
  .active-filters-bar { display:flex; align-items:center; flex-wrap:wrap; gap:8px; padding:0 2px 16px; }
  .af-label { font-size:13px; color:var(--dim); margin-right:4px; }
  .af-chip { display:inline-flex; align-items:center; gap:6px; padding:5px 12px; background:var(--accent); color:var(--accent-ink); border:0; border-radius:var(--r-pill); font-size:13px; font-weight:600; cursor:pointer; font-family:inherit; }
  .af-chip .af-x { font-size:15px; line-height:1; opacity:.6; }
  .af-chip:hover .af-x { opacity:1; }
  .af-clear { font-size:13px; color:var(--accent); background:none; border:none; cursor:pointer; font-weight:600; margin-left:6px; font-family:inherit; }

  /* CANDIDATE INTELLIGENCE: one large search, then one menu per filter. A menu is
     a short list with its own search and a checkbox per option, so forty skills
     never sit on the page as forty pills. */
  .tic-bar { position:relative; z-index:30; margin:4px 0 20px; }
  .tic-search { position:relative; display:flex; align-items:center; margin-bottom:14px; }
  .tic-search-ic { position:absolute; left:22px; width:20px; height:20px; fill:none; stroke:var(--dim); stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; pointer-events:none; transition:stroke .2s; }
  .tic-search:focus-within .tic-search-ic { stroke:var(--accent); }
  .tic-search-input { width:100%; height:56px; padding:0 54px 0 56px; font-size:17px; color:var(--text); background:var(--card); border:1px solid var(--line2); border-radius:var(--r-pill); outline:none; transition:border-color .2s; }
  .tic-search-input::placeholder { color:var(--ghost); }
  .tic-search-input:hover { border-color:var(--dim); }
  .tic-search-input:focus { border-color:var(--accent); }
  .tic-search-clear { position:absolute; right:14px; width:32px; height:32px; border-radius:50%; font-size:22px; line-height:1; color:var(--dim); display:none; place-items:center; transition:background .2s,color .2s; }
  .tic-search-input:not(:placeholder-shown) ~ .tic-search-clear { display:grid; }
  .tic-search-clear:hover { color:var(--text); background:var(--accent-soft); }
  .tic-filterbar { display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
  .fmenu { position:relative; }
  .fm-btn { display:inline-flex; align-items:center; gap:8px; padding:9px 16px; border-radius:var(--r-pill); border:1px solid var(--line2); background:transparent; font-size:14px; font-weight:600; color:var(--text2); transition:border-color .2s,color .2s,background .2s; }
  .fm-btn:hover { border-color:var(--text); color:var(--text); }
  .fmenu.open .fm-btn { border-color:var(--accent); color:var(--accent); }
  .fm-btn.on { background:var(--accent-soft); border-color:transparent; color:var(--accent); }
  .fm-count { min-width:20px; height:20px; padding:0 6px; border-radius:var(--r-pill); background:var(--accent); color:var(--accent-ink); font-size:11px; font-weight:700; display:inline-grid; place-items:center; }
  .fm-caret { width:14px; height:14px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; opacity:.6; transition:transform .2s; }
  .fmenu.open .fm-caret { transform:rotate(180deg); }
  .fm-right { margin-left:auto; }
  .fm-panel { position:absolute; top:calc(100% + 8px); left:0; z-index:40; width:300px; padding:10px; background:var(--card); border:1px solid var(--line2); border-radius:var(--r-tile); }
  .fm-right .fm-panel { left:auto; right:0; }
  .fm-wide { width:340px; }
  .fm-q { width:100%; padding:10px 16px; margin-bottom:8px; font-size:14px; color:var(--text); background:var(--bg); border:1px solid var(--line2); border-radius:var(--r-pill); outline:none; transition:border-color .2s; }
  .fm-q:focus { border-color:var(--accent); }
  .fm-list { max-height:280px; overflow-y:auto; margin:0 -4px; padding:0 4px; }
  .fm-opt { display:flex; align-items:center; gap:10px; padding:8px; border-radius:var(--r-ctl); cursor:pointer; font-size:14px; color:var(--text2); }
  .fm-opt:hover { background:var(--accent-soft); }
  .fm-opt input { width:16px; height:16px; flex:none; margin:0; }
  .fm-name { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .fm-n { font-size:12px; color:var(--dim); font-variant-numeric:tabular-nums; }
  .fm-empty { padding:14px 8px; font-size:13.5px; color:var(--dim); }
  .fm-clear { display:block; width:100%; margin-top:8px; padding:10px 0 4px; border-top:1px solid var(--line); font-size:13px; font-weight:600; color:var(--accent); text-align:center; }
  .fm-saved { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:9px 8px; border-radius:var(--r-ctl); cursor:pointer; font-size:14px; color:var(--text2); }
  .fm-saved:hover { background:var(--accent-soft); }
  .fm-del { color:var(--dim); font-size:17px; line-height:1; padding:0 4px; }
  .fm-del:hover { color:var(--risk-ink); }
  .candidate-meta span + span::before { content:'\00B7'; margin:0 8px; color:var(--ghost); }
  .tag-more { font-size:12.5px; color:var(--dim); margin-left:2px; }
  .cr-bar { width:64px; height:5px; border-radius:var(--r-pill); background:var(--track); margin:9px 0 7px auto; overflow:hidden; }
  .cr-bar i { display:block; height:100%; background:var(--mark); border-radius:var(--r-pill); }
  .results-of { font-size:13px; color:var(--dim); margin-left:4px; }
  .sort-control { display:flex; align-items:center; gap:10px; font-size:13.5px; color:var(--dim); }
  .tic-note { margin-top:22px; font-size:12.5px; color:var(--dim); }
  @media (max-width:560px) {
    .fm-panel, .fm-wide { width:min(320px,calc(100vw - 36px)); }
    .fm-right { margin-left:0; }
    .tic-search-input { height:52px; font-size:16px; }
  }


  /* CANDIDATES, SHOWN TWO WAYS: a card grid (a person at a glance, the strongest
     match featured in indigo while searching) and a dense list. */
  .results-tools { display:flex; align-items:center; gap:14px; }
  .seg { display:inline-flex; padding:3px; border:1px solid var(--line2); border-radius:var(--r-pill); }
  .seg-btn { padding:6px 16px; border-radius:var(--r-pill); font-size:13px; font-weight:600; color:var(--muted); transition:background .2s,color .2s; }
  .seg-btn:hover { color:var(--text); }
  .seg-btn.on { background:var(--accent); color:var(--accent-ink); }
  .cand-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:14px; }
  .ccard { position:relative; display:flex; flex-direction:column; gap:12px; padding:20px 20px 18px; background:var(--card); border:1px solid var(--card-line); border-radius:var(--r-card); cursor:pointer; transition:transform .25s var(--ease),border-color .25s; }
  .ccard:hover { transform:translateY(-2px); border-color:color-mix(in srgb,var(--accent) 45%,transparent); }
  .ccard .cmp-check-wrap { position:absolute; top:16px; right:16px; }
  .ccard .cmp-check, .crow .cmp-check { width:16px; height:16px; opacity:.4; transition:opacity .2s; }
  .ccard:hover .cmp-check, .crow:hover .cmp-check, .cmp-check:checked { opacity:1; }
  .ccard-top { display:flex; flex-direction:column; align-items:flex-start; gap:12px; padding-right:26px; }
  .ccard-id { min-width:0; }
  .ccard-co { font-size:13.5px; color:var(--muted); }
  .ccard-foot { display:flex; align-items:flex-end; justify-content:space-between; gap:12px; margin-top:auto; padding-top:14px; border-top:1px solid var(--line); }
  .ccard-ind { font-size:13px; color:var(--dim); min-width:0; }
  .ccard-score { text-align:right; flex:none; }
  .ccard-score b, .crow-score b { font-family:var(--display); font-size:26px; font-weight:700; letter-spacing:-.03em; line-height:1; color:var(--text); }
  .ccard-score small, .crow-score small { font-size:.55em; font-weight:600; margin-left:1px; color:var(--dim); }
  .ccard .cr-bar { margin:7px 0 0 auto; }
  /* the featured card: the strongest match, in indigo, as in the mock-up */
  .ccard.feat { background:var(--tone-1); border-color:var(--tone-1); color:var(--tone-1-ink); }
  .ccard.feat .ini { color:var(--tone-3); background:color-mix(in srgb,var(--tone-3) 16%,transparent); }
  .ccard.feat .candidate-name, .ccard.feat .candidate-role, .ccard.feat .ccard-co, .ccard.feat .candidate-meta, .ccard.feat .ccard-ind, .ccard.feat .ccard-score b, .ccard.feat .ccard-score small, .ccard.feat .tag-more { color:inherit; }
  .ccard.feat .candidate-role, .ccard.feat .ccard-co, .ccard.feat .candidate-meta, .ccard.feat .ccard-ind { opacity:.82; }
  .ccard.feat .candidate-tags .tag { background:rgba(255,255,255,.16); color:var(--tone-1-ink); }
  .ccard.feat .ccard-foot { border-top-color:rgba(255,255,255,.22); }
  .ccard.feat .cr-bar { background:rgba(255,255,255,.25); }
  .ccard.feat .cr-bar i { background:var(--tone-3); }
  .ccard.feat .cmp-check { accent-color:var(--tone-3); }
  /* the list: one row per person, the same facts in columns */
  .ctable { background:var(--card); border:1px solid var(--card-line); border-radius:var(--r-card); overflow:hidden; }
  .crow { display:grid; grid-template-columns:34px minmax(230px,2.2fr) minmax(130px,1.2fr) 82px minmax(110px,1fr) minmax(150px,1.7fr) 96px; gap:14px; align-items:center; padding:12px 20px; border-top:1px solid var(--line); cursor:pointer; transition:background .15s; }
  .crow:hover { background:var(--accent-soft); }
  .crow-h { cursor:default; border-top:0; padding-top:14px; padding-bottom:10px; font-size:10.5px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; color:var(--dim); }
  .crow-h:hover { background:none; }
  .crow-who { display:flex; align-items:center; gap:12px; min-width:0; }
  .crow-who .ini, .crow-who .avatar { width:42px; }
  .crow-id { min-width:0; }
  .crow-id .candidate-name { font-size:15px; }
  .crow-sub, .crow-loc, .crow-exp, .crow-ind { font-size:13.5px; color:var(--muted); min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .crow-sub { white-space:normal; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
  .crow-skills { display:flex; gap:5px; flex-wrap:nowrap; overflow:hidden; align-items:center; }
  .crow-skills .tag { white-space:nowrap; font-size:12px; padding:2px 10px; }
  .crow-score { text-align:right; }
  .crow-score b { font-size:20px; }
  .crow .cr-bar { width:56px; margin:6px 0 0 auto; }
  .cand-more { display:flex; justify-content:center; padding:22px 0 4px; }
  .cand-left { margin-left:6px; font-weight:500; color:var(--dim); }
  .candidate-name .process-badge, .candidate-name span { vertical-align:middle; }
  @media (max-width:1100px) {
    .crow { grid-template-columns:34px minmax(0,2fr) minmax(0,1.2fr) 96px; }
    .crow-exp, .crow-ind, .crow-skills { display:none; }
    .crow-h span:nth-child(4), .crow-h span:nth-child(5), .crow-h span:nth-child(6) { display:none; }
  }
  @media (max-width:640px) {
    .cand-grid { grid-template-columns:1fr; }
    .crow { grid-template-columns:30px minmax(0,1fr) 80px; padding:12px 14px; gap:10px; }
    .crow-loc { display:none; }
    .crow-h span:nth-child(3) { display:none; }
    .results-tools { gap:8px; }
  }

  /* Toasts: the inverse of the page, a pill. */
  #toast-root { position:fixed; bottom:24px; left:50%; transform:translateX(-50%); z-index:400; display:flex; flex-direction:column; gap:8px; align-items:center; }
  .toast { display:flex; align-items:center; gap:14px; background:var(--text); color:var(--bg); padding:11px 20px; border-radius:var(--r-pill); font-size:13.5px; font-weight:500; animation:toast-in .3s var(--ease); }
  @keyframes toast-in { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:translateY(0); } }
  .toast-undo { background:none; border:none; color:var(--mark); font-weight:700; font-size:11px; letter-spacing:.13em; text-transform:uppercase; cursor:pointer; font-family:inherit; }
  html:not([data-theme=dark]) .toast-undo { color:var(--mark); }
  .toast-x { background:none; border:none; color:inherit; opacity:.6; font-size:15px; cursor:pointer; padding:0; }
  /* Saved searches */
  /* Compare tray */
  .cmp-check-wrap { display:flex; align-items:flex-start; padding-top:3px; }
  .cmp-check { width:16px; height:16px; cursor:pointer; accent-color:var(--accent); }
  #compare-tray { position:fixed; bottom:18px; left:50%; transform:translateX(-50%); width:min(920px,calc(100vw - 32px)); z-index:300; display:flex; align-items:center; gap:14px; padding:12px 18px; background:var(--card); border:1px solid var(--card-line); border-radius:var(--r-card); }
  .tray-names { display:flex; align-items:center; gap:14px; flex:1; flex-wrap:wrap; }
  .tray-item { display:flex; align-items:center; gap:8px; font-size:13px; padding:4px 6px 4px 6px; background:var(--accent-soft); color:var(--accent); border-radius:var(--r-pill); font-weight:600; }
  .tray-item button { background:none; border:none; color:var(--dim); cursor:pointer; font-size:13px; padding:0; }
  .tray-item button:hover { color:var(--text); }
  /* Command palette: a floating plane, hairline-edged. */
  #cmdk-overlay { position:fixed; inset:0; z-index:500; background:rgba(3,1,100,.28); display:flex; justify-content:center; align-items:flex-start; padding-top:12vh; }
  html[data-theme=dark] #cmdk-overlay { background:rgba(0,0,0,.5); }
  #cmdk { width:580px; max-width:92vw; background:var(--bg); border:1px solid var(--line2); border-radius:var(--r-card); overflow:hidden; }
  #cmdk input { width:100%; border:none; padding:18px 20px; font-size:17px; font-family:var(--display); font-weight:700; letter-spacing:-.015em; background:transparent; border-bottom:1px solid var(--line); border-radius:0; }
  #cmdk input:focus { outline:none; }
  #cmdk-results { max-height:52vh; overflow-y:auto; padding:6px 0; }
  .cmdk-group { font-size:10px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--dim); padding:12px 20px 4px; }
  .cmdk-item { display:flex; align-items:center; gap:11px; padding:9px 20px; font-size:14px; color:var(--text); cursor:pointer; border-inline-start:2px solid transparent; }
  .cmdk-item.active { background:none; border-color:var(--accent); color:var(--accent); }
  .cmdk-item .ck-sub { font-size:12px; color:var(--dim); margin-left:auto; }
  .cmdk-hint { padding:10px 20px; font-size:11px; color:var(--dim); border-top:1px solid var(--line); display:flex; gap:14px; }
  /* Candidate panel prev/next */
  .panel-nav { display:flex; align-items:center; gap:6px; }
  .panel-nav button { border:1.5px solid var(--line2); background:none; width:28px; height:28px; border-radius:50%; cursor:pointer; font-size:14px; color:var(--muted); line-height:1; }
  .panel-nav button:hover:not(:disabled) { border-color:var(--text); color:var(--text); }
  .panel-nav button:disabled { opacity:.35; cursor:default; }
  .panel-nav .pn-pos { font-size:11px; color:var(--dim); letter-spacing:.06em; white-space:nowrap; }
  /* Ask MagnifiHire */
  #aa-overlay { position:fixed; inset:0; z-index:450; background:rgba(3,1,100,.22); display:flex; justify-content:flex-end; }
  html[data-theme=dark] #aa-overlay { background:rgba(0,0,0,.45); }
  #aa-panel { width:430px; max-width:94vw; height:100%; background:var(--bg); display:flex; flex-direction:column; border-left:1px solid var(--line2); animation:aa-in .4s var(--ease); }
  @keyframes aa-in { from { transform:translateX(30px); opacity:0; } to { transform:translateX(0); opacity:1; } }
  .aa-head { display:flex; justify-content:space-between; align-items:flex-start; padding:22px 24px 16px; border-bottom:1px solid var(--line); background:none; color:var(--text); }
  .aa-title { font-family:var(--display); font-size:20px; font-weight:300; letter-spacing:-.025em; }
  .aa-spark { color:var(--accent); }
  .aa-sub { font-size:10.5px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; color:var(--dim); margin-top:6px; }
  .aa-close { background:none; border:none; color:var(--dim); font-size:22px; cursor:pointer; padding:0; line-height:1; }
  .aa-close:hover { color:var(--text); }
  #aa-thread { flex:1; overflow-y:auto; padding:20px 24px; display:flex; flex-direction:column; gap:18px; }
  .aa-msg { max-width:92%; padding:12px 16px; border-radius:var(--r-tile); font-size:14.5px; line-height:1.55; }
  .aa-user { align-self:flex-end; background:none; color:var(--text); font-family:var(--display); font-weight:700; letter-spacing:-.01em; text-align:right; }
  .aa-magnifihire { align-self:flex-start; position:relative; background:none; border:0; padding:2px 0 2px 18px; color:var(--text2); }
  .aa-magnifihire::before { content:''; position:absolute; inset-inline-start:0; top:3px; bottom:3px; width:3px; border-radius:var(--r-bar); background:var(--accent); }
  .aa-chips { display:flex; flex-wrap:wrap; gap:6px 14px; margin-top:8px; }
  .aa-chip { font-size:10.5px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; background:none; border:0; border-bottom:1.5px solid var(--line2); border-radius:0; padding:0 0 2px; color:var(--muted); }
  .aa-note { margin-top:8px; font-size:13px; color:var(--muted); font-style:normal; }
  .aa-results { margin-top:10px; border:0; border-top:1px solid var(--line); border-radius:0; background:none; }
  .aa-result { display:flex; align-items:center; gap:9px; padding:10px 0; cursor:pointer; border-bottom:1px solid var(--line); }
  .aa-result:last-of-type { border-bottom:none; }
  .aa-result:hover { color:var(--accent); }
  .aa-r-main { flex:1; min-width:0; }
  .aa-r-name { font-size:13.5px; font-weight:700; }
  .aa-r-sub { font-size:11.5px; color:var(--dim); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .aa-r-comp { font-size:11.5px; color:var(--muted); white-space:nowrap; }
  .aa-more { padding:8px 0; font-size:11.5px; color:var(--dim); background:none; }
  .aa-outreach { margin-top:10px; border:0; border-top:1px solid var(--line); border-radius:0; background:none; }
  .aa-o-text { padding:12px 0; font-size:15.5px; line-height:1.5; white-space:pre-wrap; color:var(--text2); }
  .aa-o-foot { display:flex; justify-content:space-between; align-items:center; padding:8px 0; border-top:1px solid var(--line); font-size:11.5px; color:var(--dim); }
  .aa-o-foot button { background:none; color:var(--accent); border:1.5px solid color-mix(in srgb,var(--accent) 50%,transparent); border-radius:var(--r-pill); padding:5px 14px; font-size:12px; font-weight:700; cursor:pointer; font-family:inherit; }
  .aa-empty { padding:8px 0; }
  .aa-empty-title { font-family:var(--display); font-weight:300; letter-spacing:-.02em; font-size:26px; margin-bottom:6px; }
  .aa-empty-sub { font-size:14px; color:var(--muted); margin-bottom:16px; line-height:1.5; }
  .aa-suggest { display:block; width:100%; text-align:left; background:none; border:0; border-top:1px solid var(--line); border-radius:0; padding:12px 0; font-size:14px; color:var(--text); cursor:pointer; font-family:inherit; transition:color .2s; }
  .aa-suggest:hover { color:var(--accent); }
  .aa-foot { display:flex; align-items:center; gap:8px; padding:14px 24px; border-top:1px solid var(--line); }
  .aa-foot input { flex:1; border:1px solid var(--line2); background:var(--surface); border-radius:var(--r-pill); padding:10px 16px; font-size:14px; font-family:inherit; }
  .aa-foot input:focus { outline:none; border-color:var(--accent); }
  .aa-mic, .aa-send { width:38px; height:38px; border-radius:50%; border:1.5px solid var(--line2); background:none; cursor:pointer; font-size:15px; line-height:1; color:var(--text); }
  .aa-send { background:var(--accent); color:var(--accent-ink); border-color:var(--accent); }
  .aa-mic.listening { border-color:var(--risk); color:var(--risk-ink); animation:aa-pulse 1.1s infinite; }
  @keyframes aa-pulse { 0%,100% { box-shadow:0 0 0 0 rgba(179,39,68,.35); } 50% { box-shadow:0 0 0 6px rgba(179,39,68,0); } }
  .aa-busy span { display:inline-block; width:6px; height:6px; margin-right:4px; border-radius:50%; background:var(--dim); animation:aa-blink 1.2s infinite; }
  .aa-busy span:nth-child(2) { animation-delay:.2s; }
  .aa-busy span:nth-child(3) { animation-delay:.4s; }
  @keyframes aa-blink { 0%,80%,100% { opacity:.25; } 40% { opacity:1; } }
  /* Interview Studio */
  #studio-overlay { position:fixed; inset:0; z-index:420; background:var(--bg); overflow-y:auto; }
  #studio-shell { max-width:1180px; margin:0 auto; padding:34px 30px 70px; }
  .st-head { display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:22px; }
  .st-eyebrow { font-size:10.5px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--accent); }
  .st-simbadge { color:var(--risk-ink); }
  .st-title { font-family:var(--display); font-weight:300; letter-spacing:-.02em; font-size:34px; margin-top:6px; }
  .st-sub { font-size:14px; color:var(--muted); margin-top:4px; }
  .st-grid { display:grid; grid-template-columns:1fr 330px; gap:48px; align-items:start; }
  @media (max-width:900px) { .st-grid { grid-template-columns:1fr; gap:28px; } }
  .st-left, .st-right { background:var(--card); border:1px solid var(--card-line); border-radius:var(--r-card); padding:20px; }
  /* The stage is a picture of another surface (a video feed): the one framed thing here. */
  .st-stage { background:var(--navy); border-radius:var(--r); min-height:260px; display:flex; align-items:center; justify-content:center; overflow:hidden; }
  .st-video { width:100%; max-height:340px; display:block; background:var(--navy); }
  .st-sim, .st-idle { text-align:center; color:#fff; padding:30px 20px; }
  .st-sim-name { font-size:16px; font-weight:700; margin-top:10px; }
  .st-sim-sub { font-size:10.5px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:rgba(255,255,255,.6); margin-top:4px; }
  .st-wave { display:flex; gap:5px; justify-content:center; margin-top:14px; height:22px; align-items:flex-end; }
  .st-wave span { width:4px; background:var(--sky); border-radius:var(--r-pill); animation:st-wave 1s infinite ease-in-out; }
  .st-wave span:nth-child(1){ animation-delay:0s; } .st-wave span:nth-child(2){ animation-delay:.15s; } .st-wave span:nth-child(3){ animation-delay:.3s; } .st-wave span:nth-child(4){ animation-delay:.45s; } .st-wave span:nth-child(5){ animation-delay:.6s; }
  @keyframes st-wave { 0%,100% { height:6px; } 50% { height:22px; } }
  .st-controls { display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin:14px 0; }
  .st-stop { background:var(--risk); border-color:var(--risk); color:#fff; }
  .st-clockwrap { margin-left:auto; font-family:var(--display); font-size:14px; color:var(--risk-ink); font-weight:700; letter-spacing:.04em; }
  .st-consent { background:var(--accent-soft); border:1px solid color-mix(in srgb,var(--accent) 22%,transparent); border-radius:var(--r-tile); padding:16px 20px; margin-bottom:16px; }
  .st-consent::before { content:''; position:absolute; inset-inline-start:0; top:3px; bottom:3px; width:3px; border-radius:var(--r-bar); background:var(--accent); }
  .st-consent-title { font-size:11px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; margin-bottom:6px; }
  .st-consent-body { font-size:14px; color:var(--text2); line-height:1.55; margin-bottom:10px; }
  .st-consent-row { display:block; font-size:13.5px; margin-bottom:10px; }
  .st-consent-row select { margin-left:6px; padding:5px 30px 5px 10px; border:1px solid var(--line2); background-color:var(--surface); border-radius:var(--r-ctl); font-family:inherit; }
  .st-note { font-size:11.5px; color:var(--dim); margin-top:8px; line-height:1.5; }
  .st-transcript-head { font-size:10.5px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--dim); margin:6px 0; display:flex; justify-content:space-between; }
  .st-transcript { max-height:320px; overflow-y:auto; border:0; border-top:1px solid var(--line); border-radius:0; }
  .st-seg { display:flex; gap:10px; padding:11px 0; border-bottom:1px solid var(--line); align-items:flex-start; }
  .st-seg:last-child { border-bottom:none; }
  .st-seg-i { background:none; }
  .st-t { border:0; border-bottom:1.5px solid var(--line2); background:none; border-radius:0; font-size:11px; padding:0 0 1px; cursor:pointer; color:var(--muted); white-space:nowrap; font-family:var(--body); font-variant-numeric:tabular-nums; }
  .st-t:disabled { cursor:default; opacity:.6; }
  .st-t:not(:disabled):hover { border-color:var(--accent); color:var(--accent); }
  .st-seg-main { flex:1; min-width:0; }
  .st-seg-text { font-size:13.5px; line-height:1.55; }
  .st-seg-dims { display:flex; flex-wrap:wrap; gap:4px 12px; margin-top:6px; }
  .st-dim { font-size:10px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; background:none; border:0; border-bottom:1.5px solid var(--line2); border-radius:0; padding:0 0 1px; color:var(--muted); }
  .st-add { border:1.5px solid var(--line2); background:none; border-radius:50%; width:24px; height:24px; cursor:pointer; color:var(--muted); font-size:14px; line-height:1; }
  .st-add:hover { border-color:var(--accent); color:var(--accent); }
  .st-interim-row { font-size:13.5px; color:var(--dim); font-style:normal; padding:8px 4px 0; min-height:20px; }
  .st-panel-title { font-size:10.5px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--dim); margin-bottom:10px; }
  .st-cov-row { display:flex; align-items:center; gap:10px; margin-bottom:9px; }
  .st-cov-name { width:128px; font-size:12px; color:var(--text); }
  .st-cov-track { flex:1; height:4px; background:var(--track); border-radius:var(--r-bar); overflow:hidden; }
  .st-cov-fill { height:100%; background:var(--accent); border-radius:var(--r-bar); transition:width .6s var(--ease); }
  .st-cov-n { width:16px; text-align:right; font-size:11px; color:var(--dim); font-family:var(--display); font-weight:700; font-variant-numeric:tabular-nums; }
  .st-suggest { background:var(--accent-soft); border:1px solid color-mix(in srgb,var(--accent) 22%,transparent); border-radius:var(--r-tile); padding:14px 16px; }
  .st-suggest::before { content:''; position:absolute; inset-inline-start:0; top:3px; bottom:3px; width:3px; border-radius:var(--r-bar); background:var(--accent-2); }
  .st-suggest-dim { font-size:10.5px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; color:var(--dim); margin-bottom:5px; }
  .st-suggest-q { font-size:14px; line-height:1.5; font-style:normal; }
  .st-feed-item { font-size:13px; line-height:1.5; padding:11px 0; border:0; border-top:1px solid var(--line); border-radius:0; background:none; }
  .st-feed-model { background:none; }
  .st-feed-flag { background:none; color:var(--risk-ink); }
  .st-feed-busy { font-style:normal; color:var(--dim); }
  .st-plan-probe { border:0; border-top:1px solid var(--line); border-radius:0; background:none; padding:0; }
  .st-plan-probe summary { cursor:pointer; font-size:13px; font-weight:600; padding:10px 0; list-style:none; }
  .st-plan-tick { display:inline-block; width:16px; color:var(--dim); }
  .st-plan-tick.done { color:var(--ok-ink); font-weight:700; }
  .st-plan-pri { font-size:9.5px; font-weight:700; letter-spacing:.13em; color:var(--risk-ink); border:0; border-bottom:1.5px solid var(--risk); border-radius:0; padding:0; margin-left:6px; text-transform:uppercase; }
  .st-plan-q { font-size:13px; font-style:normal; line-height:1.5; padding:3px 0 3px 16px; color:var(--text); }
  .st-plan-listen { font-size:12px; color:var(--muted); padding:4px 0 8px 16px; line-height:1.45; }
  .st-plan-flag { font-size:12px; color:var(--risk-ink); padding:0 0 8px 16px; line-height:1.45; }
  .st-co-row { display:flex; align-items:center; gap:10px; padding:10px 0; border-bottom:1px solid var(--line); }
  .st-co-row:last-child { border-bottom:none; }
  .st-sig { border:0; border-bottom:1.5px solid var(--line2); background:none; border-radius:0; font-size:10px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; padding:0 0 1px; cursor:pointer; font-family:inherit; color:var(--muted); white-space:nowrap; }
  .st-sig.active { color:var(--accent); border-color:var(--accent); }
  .st-sig:hover { border-color:var(--text); }
  .st-row2 { display:flex; align-items:center; gap:6px 14px; flex-wrap:wrap; margin:2px 0 8px; }
  .st-mini { font-size:10px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--dim); }
  .st-lang, .st-spk { border:0; border-bottom:1.5px solid var(--line2); background:none; border-radius:0; padding:0 0 2px; font-size:13px; font-weight:600; cursor:pointer; font-family:inherit; color:var(--text2); }
  .st-lang.active, .st-spk.active { color:var(--accent); border-color:var(--accent); background:none; }
  .st-spk-add { color:var(--muted); border-bottom-style:dashed; }
  .st-speakers { display:inline-flex; gap:5px 14px; flex-wrap:wrap; }
  .st-seg-actions { display:flex; flex-direction:column; gap:4px; align-items:flex-end; }
  .st-share { border:0; border-bottom:1.5px solid var(--line2); background:none; border-radius:0; font-size:9.5px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; padding:0 0 1px; cursor:pointer; color:var(--muted); font-family:inherit; }
  .st-share.active { color:var(--accent); border-color:var(--accent); background:none; }
  .st-share:hover { border-color:var(--text); }
  /* Comp advisor */
  .ca-chip { border:0; border-bottom:1.5px solid var(--line2); background:none; border-radius:0; padding:0 0 2px; font-size:13px; font-weight:600; cursor:pointer; font-family:inherit; color:var(--text2); }
  .ca-chip.active { color:var(--accent); border-color:var(--accent); background:none; }
  .ca-chip:disabled { opacity:.45; cursor:default; }
  .ca-strip { position:relative; height:4px; background:var(--track); border:0; border-radius:var(--r-pill); }
  .ca-band { position:absolute; top:0; bottom:0; background:var(--accent); opacity:.35; border-radius:var(--r-pill); }
  .ca-tick { position:absolute; top:-4px; bottom:-4px; width:2px; background:var(--muted); }
  .ca-offer { position:absolute; top:-6px; width:3px; height:18px; background:var(--accent); transform:translateX(-1px); }
  .ca-scale { display:flex; justify-content:space-between; font-size:11px; color:var(--dim); margin-top:10px; font-family:var(--body); font-variant-numeric:tabular-nums; }
  /* Candidate history */
  .ch-eng { padding:14px 16px; margin-bottom:10px; background:var(--card); border:1px solid var(--card-line); border-radius:var(--r-tile); }
  .ch-round { display:flex; align-items:center; gap:8px; border-top:1px solid var(--line); margin-top:8px; padding-top:8px; }
  .ch-badge { display:inline-block; font-size:9.5px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; border:0; border-bottom:1.5px solid var(--line2); border-radius:0; padding:0; color:var(--muted); background:none; }
  .tic-results { background:none; border:0; border-radius:0; }
  .tic-results-header { padding:0 2px 14px; display:flex; justify-content:space-between; align-items:center; }
  .results-count { font-size:14.5px; color:var(--muted); }
  .results-count strong { font-family:var(--display); font-weight:700; letter-spacing:-.02em; color:var(--text); font-size:22px; margin-right:2px; }
  .sort-control select { padding:7px 32px 7px 14px; border:1px solid var(--line2); border-radius:var(--r-pill); font-size:13.5px; background-color:transparent; color:var(--text2); }
  .candidate-name { font-family:var(--display); font-weight:700; letter-spacing:-.01em; color:var(--text); font-size:16.5px; line-height:1.3; }
  .candidate-role { color:var(--text2); font-size:14px; line-height:1.4; }
  .candidate-meta { display:flex; flex-wrap:wrap; font-size:13px; color:var(--dim); }
  .candidate-tags { display:flex; gap:6px; flex-wrap:wrap; align-items:center; }
  /* Tags: outline text, never filled. */
  .tag { display:inline-block; padding:3px 12px; border-radius:var(--r-pill); font-size:12.5px; font-weight:600; letter-spacing:0; text-transform:none; background:var(--accent-soft); color:var(--accent); border:0; }
  .tag.industry { background:none; color:var(--muted); border-bottom:1.5px solid var(--line2); }
  /* Tags rotate through the palette: indigo, teal, sky. */
  .candidate-tags .tag:nth-child(3n+2), .tag.industry { background:color-mix(in srgb,var(--tone-2) 14%,transparent); color:var(--tone-2); }
  .candidate-tags .tag:nth-child(3n+3) { background:color-mix(in srgb,var(--tone-3) 30%,transparent); color:var(--text); }
  html[data-theme=dark] .candidate-tags .tag:nth-child(3n+2), html[data-theme=dark] .tag.industry { color:var(--accent-2); }

  /* UPLOAD. The one framed element: a drop zone is a target, not a section. */
  .upload-zone { border:1.5px dashed var(--accent); border-radius:var(--r-card); padding:48px 24px; text-align:center; background:var(--accent-soft); transition:background .25s; cursor:pointer; }
  .upload-zone:hover, .upload-zone.dragover { border-color:var(--accent); background:var(--accent-soft); }
  .dash-tick { display:inline-flex; align-items:center; gap:8px; font-size:13px; margin-right:10px; }
  .dash-date { font-size:13px; padding:4px 8px; border:1px solid var(--line2); border-radius:var(--r); background:var(--card); color:var(--text); }
  .jd-status { margin-top:14px; font-size:13px; color:var(--muted); line-height:1.6; }
  .jd-status:empty { display:none; }
  .form-field input.jd-filled, .form-field select.jd-filled, .form-field textarea.jd-filled { background:var(--accent-soft); }
  .upload-zone h3 { font-size:20px; margin-bottom:8px; color:var(--text); }
  .upload-zone p { font-size:14px; color:var(--muted); font-style:normal; margin-bottom:16px; line-height:1.5; }
  .upload-progress-list { margin-top:18px; }
  .progress-item { padding:14px 18px; background:var(--card); border:1px solid var(--card-line); border-radius:var(--r-tile); margin-bottom:8px; display:grid; grid-template-columns:1fr auto; gap:14px; font-size:13.5px; align-items:center; }
  .progress-name { font-weight:600; color:var(--text); }
  .progress-detail { font-size:12px; color:var(--dim); margin-top:2px; }
  .progress-status { font-size:10px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; padding:0 0 2px; border-radius:0; background:none; border-bottom:1.5px solid var(--line2); }
  .progress-status.queued { color:var(--muted); }
  .progress-status.processing { color:var(--warn-ink); border-color:color-mix(in srgb,var(--warn) 45%,transparent); }
  .progress-status.done { color:var(--ok-ink); border-color:color-mix(in srgb,var(--ok) 45%,transparent); }
  .progress-status.error { color:var(--risk-ink); border-color:color-mix(in srgb,var(--risk) 45%,transparent); }
  .progress-status.duplicate { color:var(--warn-ink); border-color:color-mix(in srgb,var(--warn) 45%,transparent); }

  /* SLIDE PANEL: a floating plane. Same cream, a hairline edge, no dark header. */
  .panel-backdrop { position:fixed; inset:0; background:rgba(3,1,100,.28); z-index:90; display:none; }
  html[data-theme=dark] .panel-backdrop { background:rgba(0,0,0,.5); }
  .panel-backdrop.open { display:block; }
  .slide-panel { position:fixed; top:0; right:0; width:740px; max-width:92vw; height:100vh; background:var(--bg); border-left:1px solid var(--line2); border-radius:var(--r-card) 0 0 var(--r-card); overflow:hidden; z-index:100; transform:translateX(100%); transition:transform .45s var(--ease); display:flex; flex-direction:column; }
  .slide-panel.open { transform:translateX(0); }
  .panel-header { padding:26px 32px 20px; background:none; color:var(--text); border-bottom:1px solid var(--line); display:flex; justify-content:space-between; align-items:flex-start; }
  .panel-header h2 { color:var(--text); font-size:30px; margin-bottom:4px; }
  .panel-header .subtitle { color:var(--muted); font-size:14px; font-style:normal; }
  .panel-close { background:none; border:none; color:var(--dim); font-size:24px; cursor:pointer; padding:0; line-height:1; }
  .panel-close:hover { color:var(--text); }
  .panel-body { flex:1; overflow-y:auto; padding:26px 32px; }
  .panel-section { margin-bottom:12px; padding:20px 22px; background:var(--card); border:1px solid var(--card-line); border-radius:var(--r-tile); }
  .panel-section:last-child { margin-bottom:0; }
  .panel-section h4 { font-size:10.5px; font-weight:700; color:var(--dim); letter-spacing:.14em; margin-bottom:12px; text-transform:uppercase; font-family:var(--body); }
  .panel-section p, .panel-section li { font-size:14.5px; line-height:1.6; color:var(--text2); }
  .panel-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px 28px; }
  .panel-field-label { font-size:10.5px; color:var(--dim); font-weight:700; letter-spacing:.13em; text-transform:uppercase; margin-bottom:3px; }
  .panel-field-value { font-size:14.5px; color:var(--text); }
  .panel-experience { border-left:2px solid var(--line2); padding-left:16px; margin-bottom:16px; }
  .panel-experience-role { font-family:var(--display); font-weight:700; letter-spacing:-.01em; color:var(--text); font-size:15.5px; }
  .panel-experience-company { font-size:13.5px; color:var(--muted); margin:2px 0; }
  .panel-experience-dates { font-size:12px; color:var(--dim); font-style:normal; }

  /* CLIENT PORTAL */
  .client-shell { min-height:100vh; background:var(--bg); }
  [dir="rtl"] { font-family: 'Noto Naskh Arabic', 'Geeza Pro', 'Sakkal Majalla', 'Segoe UI', Tahoma, sans-serif; }
  [dir="rtl"] * { letter-spacing: 0 !important; }
  [dir="rtl"] .client-hero h1 { font-family: 'Noto Naskh Arabic', 'Geeza Pro', 'Sakkal Majalla', 'Segoe UI', Tahoma, serif; }
  [dir="rtl"] .osp-figure, [dir="rtl"] .stat-value { direction: ltr; unicode-bidi: embed; }
  .client-topbar { background:var(--bg); padding:20px 40px; border-bottom:1px solid var(--line); display:flex; justify-content:space-between; align-items:center; }
  .client-brand { display:flex; align-items:center; font-family:var(--display); font-size:20px; font-weight:300; color:var(--text); letter-spacing:-.02em; }
  .client-main { padding:44px 60px 90px; max-width:1200px; margin:0 auto; }
  .client-hero { background:var(--card); border:1px solid var(--card-line); border-radius:var(--r-card); padding:30px 34px; margin-bottom:16px; }
  .client-hero h1 { font-size:clamp(28px,3.4vw,42px); margin-bottom:8px; }

  /* UTILITIES */
  .spinner { display:inline-block; width:12px; height:12px; border:2px solid var(--line2); border-top-color:var(--accent); border-radius:50%; animation:spin .7s linear infinite; margin-right:6px; vertical-align:middle; }
  @keyframes spin { to { transform:rotate(360deg); } }
  .empty-state { text-align:center; padding:52px 24px; color:var(--muted); background:var(--card); border:1px solid var(--card-line); border-radius:var(--r-card); }
  .empty-state h3 { font-size:20px; margin-bottom:8px; color:var(--text); }
  .empty-state p { margin-bottom:18px; font-size:14.5px; font-style:normal; max-width:56ch; }
  .pill { display:inline-block; padding:0 0 2px; border-radius:0; font-size:10px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; background:none; border-bottom:1.5px solid var(--line2); color:var(--muted); }
  .pill-gold { color:var(--accent); border-color:color-mix(in srgb,var(--accent) 45%,transparent); }
  .pill-slate { color:var(--muted); }
  .pill-green { color:var(--ok-ink); border-color:color-mix(in srgb,var(--ok) 45%,transparent); }
  .pill-amber { color:var(--warn-ink); border-color:color-mix(in srgb,var(--warn) 45%,transparent); }
  /* Module screens (Hiring Risk, Benchmarking, Analytics) */
  .mod-bar { height:4px; background:var(--track); border-radius:var(--r-bar); overflow:hidden; width:100%; }
  .mod-bar-fill { height:100%; border-radius:var(--r-bar); transition:width .5s var(--ease); }
  .mod-tag { display:inline-block; font-size:10px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; padding:0 0 2px; border-radius:0; vertical-align:middle; background:none; border-bottom:1.5px solid var(--line2); }
  .mod-tag.live { color:var(--ok-ink); border-color:color-mix(in srgb,var(--ok) 45%,transparent); }
  .mod-tag.soon { color:var(--warn-ink); border-color:color-mix(in srgb,var(--warn) 45%,transparent); }
  .mod-th { font-size:10.5px; font-weight:700; color:var(--dim); letter-spacing:.14em; text-transform:uppercase; }
  .mod-roadmap { margin-top:20px; padding:18px 22px; background:var(--accent-soft); border:1px solid color-mix(in srgb,var(--accent) 22%,transparent); border-radius:var(--r-tile); }
  .mod-roadmap::before { content:''; position:absolute; inset-inline-start:0; top:3px; bottom:3px; width:3px; border-radius:var(--r-bar); background:var(--accent); }
  .mod-roadmap h4 { font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--dim); margin-bottom:10px; font-weight:700; font-family:var(--body); }
  .mod-roadmap ul { list-style:none; }
  .mod-roadmap li { font-size:14px; color:var(--text2); margin:6px 0; padding-left:18px; position:relative; line-height:1.5; }
  .mod-roadmap li::before { content:'\2192'; position:absolute; left:0; color:var(--accent-2); font-weight:700; }
  .mod-attrib { font-size:11px; color:var(--dim); font-weight:700; letter-spacing:.13em; text-transform:uppercase; margin-top:8px; }
  .disclosure { background:var(--accent-soft); border:1px solid color-mix(in srgb,var(--accent) 22%,transparent); border-radius:var(--r-tile); padding:14px 18px; font-size:14px; color:var(--text2); font-style:normal; line-height:1.55; margin:16px 0; }
  .disclosure::before { content:''; position:absolute; inset-inline-start:0; top:3px; bottom:3px; width:3px; border-radius:var(--r-bar); background:var(--accent-2); }

  /* INTERVIEW COPILOT */
  .stage-tabs { display:flex; gap:8px; margin-bottom:22px; flex-wrap:wrap; }
  .stage-tab { flex:1; min-width:130px; display:flex; flex-direction:column; gap:3px; padding:11px 18px; border-radius:var(--r-pill); cursor:pointer; background:transparent; border:1.5px solid var(--accent); text-align:left; color:var(--accent); transition:background .2s,color .2s; }
  .stage-tab:hover { background:none; }
  .stage-tab.active { background:var(--accent); color:var(--accent-ink); }
  .stage-tab.active .stage-tab-num { background:var(--accent); color:var(--accent-ink); }
  .stage-tab[disabled] { cursor:not-allowed; opacity:.45; }
  .stage-tab-row { display:flex; align-items:center; gap:9px; }
  .stage-tab-num { width:22px; height:22px; border-radius:50%; background:none; border:1.5px solid var(--line2); color:var(--muted); font-size:11px; font-weight:700; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
  .stage-tab.active .stage-tab-num { border-color:var(--accent); }
  .stage-tab-title { font-size:14px; font-weight:700; color:var(--text); }
  .stage-tab-meta { font-size:11.5px; color:var(--dim); padding-left:31px; }
  .stage-tab.active .stage-tab-meta { color:var(--accent); }

  .probe-card { background:var(--card); border:1px solid var(--card-line); border-radius:var(--r-card); padding:0; margin-bottom:14px; overflow:hidden; }
  .probe-card-head { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; padding:20px 0 12px; background:none; border-bottom:0; }
  .probe-dim { font-size:10.5px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--accent-2); }
  .probe-obj { font-family:var(--display); font-weight:700; letter-spacing:-.015em; font-size:19px; color:var(--text); line-height:1.3; margin-top:4px; }
  .probe-body { padding:0 0 22px; }
  .probe-q { font-size:15px; color:var(--text); line-height:1.55; padding:7px 0 7px 18px; border-left:2px solid var(--line2); margin-bottom:4px; }
  .probe-listen { position:relative; font-size:13.5px; color:var(--text2); line-height:1.5; background:none; border-radius:0; padding:2px 0 2px 18px; margin-top:12px; }
  .probe-listen::before { content:''; position:absolute; inset-inline-start:0; top:3px; bottom:3px; width:3px; border-radius:var(--r-bar); background:var(--ok); }
  .probe-flag { position:relative; font-size:13.5px; color:var(--text2); line-height:1.5; background:none; border-radius:0; padding:2px 0 2px 18px; margin-top:10px; }
  .probe-flag::before { content:''; position:absolute; inset-inline-start:0; top:3px; bottom:3px; width:3px; border-radius:var(--r-bar); background:var(--risk); }
  .priority-chip { display:inline-block; padding:0 0 2px; border-radius:0; font-size:10px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; white-space:nowrap; background:none; border-bottom:1.5px solid currentColor; }

  .signal-row { display:flex; gap:8px 18px; flex-wrap:wrap; margin-top:6px; }
  .signal-btn { padding:0 0 3px; border-radius:0; font-size:13px; font-weight:600; cursor:pointer; border:0; border-bottom:1.5px solid var(--line2); background:none; color:var(--muted); transition:color .2s,border-color .2s; display:inline-flex; align-items:center; gap:6px; }
  .signal-btn:hover { color:var(--text); border-color:var(--text); }
  .signal-btn.sel-confirms { background:none; border-color:var(--ok); color:var(--ok-ink); }
  .signal-btn.sel-partial  { background:none; border-color:var(--warn); color:var(--warn-ink); }
  .signal-btn.sel-concern  { background:none; border-color:var(--risk); color:var(--risk-ink); }
  .signal-btn.sel-unobserved { background:none; border-color:var(--ghost); color:var(--dim); }
  .signal-note { width:100%; margin-top:12px; padding:11px 14px; border:1px solid var(--line2); background:var(--surface); border-radius:var(--r); font-size:14px; color:var(--text); line-height:1.5; resize:vertical; min-height:58px; font-family:inherit; }
  .signal-note:focus { outline:none; border-color:var(--accent); }

  .conduct-progress { display:flex; align-items:center; gap:14px; padding:14px 20px; margin-bottom:14px; background:var(--card); border:1px solid var(--card-line); border-radius:var(--r-tile); }
  .progress-track { flex:1; height:4px; background:var(--track); border-radius:var(--r-bar); overflow:hidden; }
  .progress-fill { height:100%; background:var(--accent); border-radius:var(--r-bar); transition:width .5s var(--ease); }

  .reco-banner { display:flex; align-items:center; gap:18px; padding:20px 24px; margin-bottom:18px; border:1px solid; border-radius:var(--r-card); }
  .reco-badge { font-size:11px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; padding:0 0 3px; border-radius:0; white-space:nowrap; border-bottom:2px solid currentColor; }
  .recon-row { display:grid; grid-template-columns:150px 1fr 1fr 96px; gap:14px; padding:14px 0; border-bottom:1px solid var(--line); align-items:start; }
  .recon-row:last-child { border-bottom:none; }
  .recon-dim { font-size:11px; font-weight:700; color:var(--text); letter-spacing:.1em; text-transform:uppercase; }
  .recon-cell { font-size:13.5px; color:var(--text); line-height:1.5; }
  .recon-cell.osm { color:var(--muted); }
  .verdict-chip { display:inline-block; padding:0 0 2px; border-radius:0; font-size:10px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; border-bottom:1.5px solid currentColor; }
  .ivlist-row { display:grid; grid-template-columns:1fr 130px 150px 120px; gap:14px; padding:16px 22px; margin-bottom:10px; align-items:center; cursor:pointer; background:var(--card); border:1px solid var(--card-line); border-radius:var(--r-card); transition:transform .25s var(--ease),border-color .25s; }
  .ivlist-row:hover { color:var(--accent); }
  .ivlist-row:last-child { border-bottom:none; }
  .round-tab { padding:8px 18px; border-radius:var(--r-pill); font-size:13px; font-weight:700; cursor:pointer; border:1.5px solid var(--accent); color:var(--accent); background:transparent; margin-right:8px; }
  .round-tab.active { background:var(--accent); color:var(--accent-ink); }
  .round-tab:hover:not(.active) { color:var(--text); }
  /* Alignment signals */
  .scores-toolbar { display:flex; gap:14px; flex-wrap:wrap; align-items:flex-end; padding:18px 22px; margin-bottom:18px; background:var(--card); border:1px solid var(--card-line); border-radius:var(--r-card); }
  .scores-toolbar .form-field { margin-bottom:0; }
  .scores-toolbar select { min-width:240px; }
  .score-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(300px, 1fr)); gap:0 48px; margin-bottom:22px; }
  .score-card { background:var(--card); border:1px solid var(--card-line); border-radius:var(--r-card); padding:22px 24px; display:flex; flex-direction:column; transition:transform .25s var(--ease),border-color .25s; }
  .score-card-head { display:flex; justify-content:space-between; align-items:flex-start; gap:10px; margin-bottom:12px; }
  .score-name { font-size:11px; font-weight:700; letter-spacing:.14em; color:var(--dim); text-transform:uppercase; }
  .score-sub { font-size:11.5px; color:var(--dim); margin-top:2px; font-style:normal; letter-spacing:0; text-transform:none; font-weight:400; }
  .score-pct { font-family:var(--display); font-size:34px; font-weight:700; letter-spacing:-.02em; line-height:1; }
  .score-band-chip { display:inline-block; padding:0 0 2px; border-radius:0; font-size:10px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; white-space:nowrap; border-bottom:1.5px solid currentColor; background:none; }
  .score-meter { height:4px; background:var(--track); border-radius:var(--r-bar); overflow:hidden; margin:6px 0 12px; }
  .score-meter-fill { height:100%; border-radius:var(--r-bar); transition:width .4s var(--ease); }
  .score-headline { font-size:14.5px; color:var(--text); line-height:1.55; margin-bottom:10px; }
  .score-factors { border-top:1px solid var(--line); padding-top:10px; margin-top:auto; }
  .score-factor { display:flex; gap:8px; align-items:flex-start; font-size:13px; color:var(--muted); line-height:1.5; padding:3px 0; }
  .score-factor .dir { font-weight:700; flex-shrink:0; width:12px; text-align:center; }
  .score-factor .dir.up { color:var(--ok-ink); }
  .score-factor .dir.down { color:var(--risk-ink); }
  .score-factor .dir.neutral { color:var(--dim); }
  .score-empty-card { border:0; border-top:1px solid var(--line); border-radius:0; padding:24px 0; background:none; display:flex; flex-direction:column; justify-content:center; text-align:left; color:var(--muted); }
  /* Candidate graph. The canvas is a picture of the network: framed by a hairline only. */
  .graph-layout { display:grid; grid-template-columns:1fr 360px; gap:48px; align-items:start; }
  @media (max-width:1100px){ .graph-layout { grid-template-columns:1fr; gap:28px; } }
  .graph-canvas-card { background:var(--card); border:1px solid var(--card-line); border-radius:var(--r-card); padding:12px; overflow:hidden; }
  .graph-svg { width:100%; height:auto; display:block; }
  .graph-node { cursor:pointer; }
  .graph-node:hover { stroke:var(--text); stroke-width:2; }
  .graph-toolbar { display:flex; align-items:center; gap:16px; flex-wrap:wrap; padding:10px 0 4px; }
  .graph-search-wrap { position:relative; padding:10px 0 2px; }
  .graph-search-input { width:100%; padding:11px 14px 11px 38px; border:1px solid var(--line2); border-radius:var(--r-pill); font-size:14px; background:var(--surface) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='15' height='15' viewBox='0 0 24 24' fill='none' stroke='%236A6898' stroke-width='2'><circle cx='11' cy='11' r='7'/><path d='M21 21l-4.3-4.3'/></svg>") no-repeat 14px center; color:var(--text); }
  .graph-search-input:focus { outline:none; border-color:var(--accent); }
  .graph-search-results { display:none; position:absolute; left:0; right:0; top:56px; background:var(--bg); border:1px solid var(--line2); border-radius:var(--r); z-index:50; max-height:320px; overflow-y:auto; }
  .graph-search-result { display:flex; align-items:center; gap:11px; padding:11px 16px; cursor:pointer; border-bottom:1px solid var(--line); transition:background .15s; }
  .graph-search-result:last-child { border-bottom:none; }
  .graph-search-result:hover { background:var(--accent-soft); }
  .gsr-dot { width:10px; height:10px; border-radius:50%; flex-shrink:0; }
  .gsr-main { flex:1; min-width:0; }
  .gsr-name { font-size:14px; font-weight:600; color:var(--text); }
  .gsr-meta { font-size:12px; color:var(--dim); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .gsr-arch { font-size:10px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; color:var(--muted); flex-shrink:0; }
  .graph-search-empty { padding:14px 16px; font-size:13.5px; color:var(--dim); font-style:normal; }
  .graph-legend { display:flex; flex-wrap:wrap; gap:10px 18px; padding:10px 0 12px; }
  .graph-legend-item { display:flex; align-items:center; gap:6px; font-size:12.5px; color:var(--muted); }
  .graph-legend-dot { width:11px; height:11px; border-radius:50%; flex-shrink:0; }
  .nbr-row { padding:12px 0; border-bottom:1px solid var(--line); cursor:pointer; transition:color .2s; }
  .nbr-row:last-child { border-bottom:none; }
  .nbr-row:hover { background:none; color:var(--accent); }
  .nbr-bar { height:4px; background:var(--track); border-radius:var(--r-bar); overflow:hidden; margin:6px 0 8px; }
  .nbr-bar-fill { height:100%; border-radius:var(--r-bar); background:var(--accent); }
  .nbr-chip { display:inline-block; padding:0 0 1px; border-radius:0; font-size:10px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; margin:2px 12px 0 0; border-bottom:1.5px solid currentColor; }
  .bridge-grid { display:grid; gap:2px; }
  .bridge-cell { aspect-ratio:1; display:flex; align-items:center; justify-content:center; font-size:10px; border-radius:0; color:var(--text); }
  .bridge-axis { font-size:10px; color:var(--dim); display:flex; align-items:center; justify-content:center; text-align:center; letter-spacing:.06em; }
  /* Workforce Decision Graph calibration */
  .wdg-stats { display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:0; margin-bottom:18px; border-top:1px solid var(--line); }
  .wdg-dim-row { display:grid; grid-template-columns:160px 1fr 160px; gap:14px; align-items:center; padding:11px 0; border-bottom:1px solid var(--line); }
  .wdg-dim-row:last-child { border-bottom:none; }
  .wdg-calib-row { display:grid; grid-template-columns:130px 64px 1fr 52px; gap:12px; align-items:center; padding:11px 0; border-bottom:1px solid var(--line); }
  .wdg-calib-row:last-child { border-bottom:none; }
  .wdg-arch-row { display:grid; grid-template-columns:1fr 50px 84px 1fr 50px; gap:12px; align-items:center; padding:10px 0; border-bottom:1px solid var(--line); font-size:13.5px; }
  .wdg-arch-row:last-child { border-bottom:none; }
  .wdg-finding { background:var(--accent-soft); border:1px solid color-mix(in srgb,var(--accent) 22%,transparent); border-radius:var(--r-tile); padding:14px 18px; margin-bottom:10px; }
  .wdg-finding::before { content:''; position:absolute; inset-inline-start:0; top:3px; bottom:3px; width:3px; border-radius:var(--r-bar); background:var(--accent-2); }
  .wdg-finding h4 { font-size:15px; color:var(--text); margin-bottom:3px; }
  .wdg-finding p { font-size:13.5px; color:var(--muted); line-height:1.55; }
  .wdg-feed-row { display:grid; grid-template-columns:1fr auto; gap:12px; align-items:center; padding:12px 0; border-bottom:1px solid var(--line); }
  .wdg-feed-row:last-child { border-bottom:none; }
  .wdg-vchip { display:inline-block; padding:0 0 1px; border-radius:0; font-size:10px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; margin:1px 10px 0 0; border-bottom:1.5px solid currentColor; }
  .text-right { text-align:right; }
  .coming-soon { text-align:center; padding:60px 40px; background:var(--card); border:1px solid var(--card-line); border-radius:var(--r-card); }
  .coming-soon-mark { font-size:48px; font-weight:300; color:var(--accent); margin-bottom:14px; }
  .coming-soon h2 { font-size:28px; margin-bottom:10px; }
  .coming-soon p { font-size:15px; color:var(--muted); max-width:56ch; margin:0 0 8px; line-height:1.6; }
  .coming-soon .roadmap { position:relative; background:none; padding:2px 0 2px 20px; margin-top:20px; text-align:left; max-width:520px; font-size:14px; color:var(--text2); line-height:1.6; font-style:normal; }
  .coming-soon .roadmap::before { content:''; position:absolute; inset-inline-start:0; top:3px; bottom:3px; width:3px; border-radius:var(--r-bar); background:var(--accent); }

  /* TABLES. No zebra, no vertical rules, no header background. */
  table { width:100%; border-collapse:collapse; font-size:14.5px; }
  th { text-align:start; font-size:10.5px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--dim); padding:0 10px 10px 0; border-bottom:1px solid var(--line); }
  td { padding:13px 10px 13px 0; border-bottom:1px solid var(--line); vertical-align:top; }

  /* DARK-MODE REPAIR for inline styles in magnifihire.js that still hardcode a
     light surface. 27 sites use `background:white`; mapping them to the surface
     token here is cheaper and safer than editing a 16,000-line file. */
  [style*="background:white"], [style*="background: white"], [style*="background:#fff"], [style*="background: #fff"] { background:var(--surface) !important; }

  /* Confirm dialog (replaces native confirm()) */
  .cfm-overlay { position:fixed; inset:0; z-index:500; display:flex; align-items:center; justify-content:center; padding:16px; background:rgba(3,1,100,.45); }
  .cfm-box { width:min(460px,100%); max-height:calc(100dvh - 32px); overflow:auto; background:var(--card); color:var(--text); border:1px solid var(--card-line); border-radius:var(--r-card); padding:24px; box-shadow:0 20px 60px rgba(0,0,0,.3); }
  .cfm-msg { margin:0 0 20px; font-size:15px; line-height:1.55; white-space:pre-line; }
  .cfm-actions { display:flex; justify-content:flex-end; gap:10px; flex-wrap:wrap; }

  /* iOS Safari: 100vh includes the collapsing toolbar, so the sidebar's foot (sign out) and the slide panel's bottom sit under it. dvh tracks the visible area. */
  @supports (height:100dvh) {
    html, body { min-height:100dvh; }
    .app-layout, .client-shell { min-height:100dvh; }
    .slide-panel { height:100dvh; }
    @media (max-width:1100px) {
      .app-layout { min-height:calc(100dvh - 64px); }
      .sidebar { height:calc(100dvh - 64px); }
      body.demo-on .sidebar { height:calc(100dvh - 106px); }
    }
  }

  /* Skip link: off-screen until focused. Mobile nav scrim sits under the drawer (z 70) and over the page. */
  .skip-link { position:fixed; left:12px; top:-60px; z-index:600; padding:10px 16px; background:var(--accent); color:var(--accent-ink); border-radius:var(--r-ctl); font-weight:700; text-decoration:none; }
  .skip-link:focus { top:12px; }
  #main:focus { outline:none; }
  @media (max-width:1100px) {
    body.nav-open::after { content:''; position:fixed; inset:64px 0 0 0; z-index:65; background:rgba(3,1,100,.35); }
  }

  /* Touch targets: 44px minimum on phones and tablets (WCAG 2.5.5 / Apple HIG). */
  @media (max-width:820px), (pointer:coarse) {
    .btn, .fm-btn, .seg-btn, .signout, button.submit, .landing-field input { min-height:44px; }
    .mobile-nav, .theme-toggle { width:44px; height:44px; }
    .cmp-check, .ccard .cmp-check, .crow .cmp-check { width:24px; height:24px; }
    .ccard .cmp-check-wrap { top:12px; right:12px; }
    #main button, #main select, #main input[type=text], #main input[type=search] { min-height:44px; }
    #main input[type=range] { min-height:32px; }
  }

  /* ===== DASHBOARD: typographic, unboxed. Rules and whitespace group; no cards, no pills. ===== */
  .dash-mast { margin:calc(var(--mp-y) * -1) calc(var(--mp-x) * -1) 30px; padding:var(--mp-y) var(--mp-x) 10px; background:var(--mast-bg); color:var(--mast-ink); }
  .dash-mast .eyebrow { color:var(--mast-link); }
  .dash-mast .h1-sub { color:color-mix(in srgb,var(--mast-ink) 72%,transparent); }
  .dash-h1 { font-size:clamp(28px,3.4vw,42px); line-height:1.08; letter-spacing:-.03em; max-width:20ch; color:var(--mast-ink); }
  .dash-h1 em.hl { font-weight:800; }

  .dash-link { display:inline-flex; align-items:center; background:none; border:0; padding:0; font:inherit; font-size:13.5px; font-weight:700; color:var(--accent); cursor:pointer; white-space:nowrap; }
  .dash-link span { text-decoration:underline; text-decoration-thickness:1.5px; text-underline-offset:5px; text-decoration-color:color-mix(in srgb,var(--accent) 40%,transparent); transition:text-decoration-color .2s var(--ease); }
  .dash-link::after { content:'\2192'; display:inline-block; margin-left:7px; transition:transform .25s var(--ease); }
  .dash-link:hover span { text-decoration-color:var(--accent); }
  .dash-mast .dash-link { color:var(--mast-link); }
  .dash-mast .dash-link span { text-decoration-color:color-mix(in srgb,var(--mast-link) 45%,transparent); }
  .dash-mast .dash-link:hover span { text-decoration-color:var(--mast-link); }
  .dash-mark { display:block; line-height:0; }
  .dash-mast .ini { background:color-mix(in srgb,var(--mast-ink) 14%,transparent); color:var(--mast-link); }
  .dash-mast .ini-eng { background:none; box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--mast-link) 55%,transparent); }
  .dash-link:hover::after { transform:translateX(4px); }

  .dash-list { list-style:none; margin:24px 0 0; padding:0; border-top:1px solid color-mix(in srgb,var(--mast-ink) 28%,transparent); }
  .dash-item { display:grid; grid-template-columns:36px minmax(0,1fr) auto; align-items:center; gap:6px 16px; padding:14px 0; border-bottom:1px solid color-mix(in srgb,var(--mast-ink) 18%,transparent); }
  .dash-txt { font-size:15px; line-height:1.5; color:var(--mast-ink); text-wrap:pretty; }
  .dash-txt strong { font-weight:700; }

  .dash-figs { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:20px 24px; margin:0 0 40px; }
  .tone-a { --tc:var(--accent); } .tone-b { --tc:var(--accent-2); } .tone-flag { --tc:var(--red-deep); } .tone-quiet { --tc:var(--line2); }
  .dash-fig { padding:14px 0 2px; border-top:3px solid var(--tc); }
  .dash-fig .dash-num, .dash-trend-n { color:var(--tc); }
  .tone-quiet .dash-num, .tone-quiet .dash-trend-n { color:var(--ghost); }
  .dash-num { font-size:clamp(34px,3.6vw,48px); font-weight:300; letter-spacing:-.05em; line-height:.95; color:var(--text); font-variant-numeric:tabular-nums; }
  .dash-cap { margin-top:10px; font-size:10.5px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--text); }
  .dash-sub { margin-top:3px; font-size:12.5px; color:var(--dim); }

  .dash-ledger-line { margin:0; font-size:13.5px; line-height:2; color:var(--muted); }
  .dash-ledger-k { margin-right:18px; font-size:11px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--accent); }
  .dash-bit { display:inline-block; margin-right:20px; }
  .dash-bit b { color:var(--text); font-weight:700; font-variant-numeric:tabular-nums; }
  .dash-foot { margin:4px 0 0; max-width:82ch; font-size:12px; line-height:1.55; color:var(--dim); }

  .dash-sec { border-top:1px solid var(--line); padding-top:20px; margin-bottom:38px; }
  .dash-sec-head { display:flex; align-items:baseline; flex-wrap:wrap; gap:4px 18px; margin-bottom:6px; }
  .dash-sec-head h2 { font-size:19px; font-weight:700; letter-spacing:-.025em; }
  .dash-aside { font-size:13px; color:var(--dim); }
  .dash-links { display:flex; flex-wrap:wrap; gap:10px 32px; margin-top:16px; }
  .dash-empty { margin:14px 0 0; font-size:14px; color:var(--dim); }

  .dash-meta { margin-top:3px; font-size:12.5px; color:var(--dim); }

  .dash-flag { color:var(--red-deep); font-weight:700; }
  .dash-ok { color:var(--ok-ink); font-weight:700; }

  .dash-row { display:flex; justify-content:space-between; align-items:center; gap:16px; padding:15px 0; border-bottom:1px solid var(--line); }
  .dash-row:last-child { border-bottom:0; }
  .dash-row-t { font-size:14px; font-weight:700; color:var(--text); }
  .dash-row-r { font-size:13px; color:var(--muted); text-align:right; }
  .dash-row-r b { color:var(--text); }
  .dash-bits { display:flex; flex-wrap:wrap; gap:6px 26px; margin-top:14px; font-size:14px; color:var(--muted); }
  .dash-bits .dash-bit { margin:0; }

  .dash-trends { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px 26px; margin:18px 0 18px; }
  .dash-trend { padding-top:12px; border-top:3px solid var(--tc); color:var(--tc); }
  .dash-trend .dash-cap { margin-top:10px; color:var(--text); }
  .dash-trend-top { display:flex; justify-content:space-between; align-items:flex-end; gap:10px; }
  .dash-trend-n { font-size:clamp(28px,2.6vw,36px); font-weight:300; letter-spacing:-.04em; line-height:1; font-variant-numeric:tabular-nums; }
  .dash-spark { flex:none; max-width:50%; height:auto; }
  .dash-funnel { display:flex; flex-direction:column; gap:14px; margin-top:20px; }
  .dash-frow { display:grid; grid-template-columns:86px minmax(0,1fr) 28px; align-items:center; gap:12px; font-size:13px; color:var(--muted); }
  .dash-fbar { display:block; height:14px; }
  .dash-fbar i { display:block; height:100%; border-radius:var(--r-bar); transform-origin:left; }
  .dash-fbar .ft-a { background:var(--accent); } .dash-fbar .ft-b { background:var(--accent-2); } .dash-fbar .ft-c { background:var(--mark); } .dash-fbar .ft-d { background:var(--ok); }
  .dash-frow b { text-align:right; color:var(--text); font-variant-numeric:tabular-nums; }
  .dash-duo { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 56px; }
  .dash-bar { display:flex; gap:3px; height:10px; margin-top:18px; }
  .dash-bar i { border-radius:var(--r-bar); }
  .dash-keys { display:flex; flex-wrap:wrap; gap:8px 24px; margin-top:14px; }
  .dash-key { display:inline-flex; align-items:center; gap:8px; font-size:13.5px; color:var(--muted); }
  .dash-key i { width:9px; height:9px; border-radius:var(--r-bar); }
  .dash-key b { color:var(--text); }

  @media (prefers-reduced-motion:no-preference) {
    .dash-item { animation:dash-in .55s var(--ease) both; animation-delay:calc(var(--i,0) * 70ms + 80ms); }
    @keyframes dash-in { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:none; } }
    @keyframes dash-draw { from { transform:scaleX(0); } to { transform:scaleX(1); } }
  }

  @media (max-width:1000px) {
    .dash-duo { grid-template-columns:minmax(0,1fr); }
  }
  @media (max-width:820px) {
    .dash-figs { grid-template-columns:repeat(2,minmax(0,1fr)); }
  }
  @media (max-width:560px) {
    .dash-item { grid-template-columns:36px minmax(0,1fr); align-items:start; padding:14px 0; }
    .dash-item .dash-link { grid-column:2; justify-self:start; margin-top:4px; }
    .dash-row { flex-direction:column; align-items:flex-start; gap:4px; }
    .dash-row-r { text-align:left; }
  }
  @media (max-width:820px), (pointer:coarse) {
    .dash-item .dash-link, .dash-links .dash-link { min-height:44px; }
  }

  /* ===== PLATFORM GUIDE: the dashboard's language. Masthead, then each journey as a sticky coloured head beside a step timeline. ===== */
  .dash-link { text-decoration:none; }
  .dash-mast .dash-link { text-decoration:none; }
  .tone-d { --tc:var(--text); }
  .guide-j { display:grid; grid-template-columns:minmax(220px,300px) minmax(0,1fr); gap:0 64px; padding:30px 0 12px; border-top:1px solid var(--line); scroll-margin-top:24px; }
  .guide-j-head { position:sticky; top:28px; align-self:start; }
  .guide-j-no { font-family:var(--display); font-size:clamp(44px,5vw,64px); font-weight:300; letter-spacing:-.05em; line-height:.95; color:var(--tc); }
  .guide-j-head h2 { margin:14px 0 8px; font-size:22px; font-weight:700; letter-spacing:-.025em; line-height:1.15; }
  .guide-j-head p { margin:0; font-size:13.5px; line-height:1.6; color:var(--muted); }
  .guide-j-count { margin-top:14px; padding-top:10px; border-top:3px solid var(--tc); font-size:10.5px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--text); }
  .guide-steps { list-style:none; margin:0; padding:0; }
  .guide-step { position:relative; display:grid; grid-template-columns:38px minmax(0,1fr); gap:0 18px; padding-bottom:30px; }
  .guide-step::before { content:''; position:absolute; left:13px; top:30px; bottom:2px; width:2px; background:color-mix(in srgb,var(--tc) 28%,transparent); }
  .guide-step:last-child { padding-bottom:18px; }
  .guide-step:last-child::before { display:none; }
  .guide-dot { z-index:1; display:flex; align-items:center; justify-content:center; width:28px; height:28px; border-radius:50%; background:var(--bg); box-shadow:inset 0 0 0 2px var(--tc); color:var(--tc); font-size:12px; font-weight:800; font-variant-numeric:tabular-nums; }
  .guide-body h3 { margin:3px 0 6px; font-size:17px; font-weight:700; letter-spacing:-.02em; line-height:1.3; }
  .guide-body p { margin:0 0 10px; max-width:66ch; font-size:14px; line-height:1.7; color:var(--muted); text-wrap:pretty; }
  .guide-close { border-top:1px solid var(--line); padding-top:26px; margin:18px 0 40px; }
  .guide-close p { margin:10px 0 0; max-width:62ch; font-size:clamp(16px,1.5vw,19px); line-height:1.65; color:var(--text); text-wrap:pretty; }
  @media (prefers-reduced-motion:no-preference) {
    html { scroll-behavior:smooth; }
    .guide-step { animation:dash-in .55s var(--ease) both; }
  }
  @media (max-width:1000px) {
    .guide-j { grid-template-columns:minmax(0,1fr); gap:20px 0; }
    .guide-j-head { position:static; }
    .guide-j-head h2 { margin-top:8px; }
  }
  @media (max-width:560px) {
    .guide-step { grid-template-columns:30px minmax(0,1fr); gap:0 12px; }
    .guide-step::before { left:9px; }
    .guide-dot { width:22px; height:22px; font-size:11px; }
    .guide-step::before { top:24px; }
  }
  @media (max-width:1100px) {
    .guide-j { scroll-margin-top:84px; }
  }

  /* ===== ENGAGEMENTS: the same language. Actions sit in the masthead as text links; the configuration is a quiet two-column list. ===== */
  .mast-actions { display:flex; flex-wrap:wrap; gap:6px 30px; margin-top:20px; }
  .dash-back::after { content:'\2190'; margin:0 7px 0 0; order:-1; }
  .dash-back:hover::after { transform:translateX(-4px); }
  .dash-prose { margin:14px 0 0; max-width:70ch; font-size:15px; line-height:1.75; color:var(--text); text-wrap:pretty; }
  .dash-config { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 56px; margin-top:12px; }
  .dash-config > div { padding:13px 0; border-bottom:1px solid var(--line); }
  .dash-config .panel-field-label { margin-bottom:3px; font-size:10.5px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--dim); }
  .dash-config .panel-field-value { font-size:14.5px; color:var(--text); }
  @media (max-width:820px) {
    .dash-config { grid-template-columns:minmax(0,1fr); }
  }

  /* Engagement detail: the feature panels (pipeline, comp advisor, documents, criteria, shortlist...) keep their
     markup but lose the boxes: a card becomes a ruled section, a button becomes a tracked text link. */
  .eng-flat .card, .eng-flat .stat-card { background:none; border:0; border-radius:0; box-shadow:none; }
  .eng-flat .card { padding:26px 0 0; margin:0 0 40px; border-top:1px solid var(--line); }
  .eng-flat .card:hover { transform:none; }
  .eng-flat .card-title { font-size:19px; }
  .eng-flat .card-sub { margin-bottom:14px; }

  /* ===== PLAIN BUTTONS. Anyone should see what can be clicked: every action is a real button. =====
     Default = the main action (filled). Where several actions sit together they are outlined. */
  .dash-link { min-height:44px; padding:10px 24px; justify-content:center; border-radius:var(--r-pill); background:var(--cta); border:1.5px solid var(--cta); color:var(--cta-ink); font-size:14.5px; font-weight:700; text-decoration:none; transition:background .2s var(--ease), border-color .2s var(--ease), transform .15s var(--ease); }
  .dash-link span, .dash-mast .dash-link span, .dash-link:hover span, .dash-mast .dash-link:hover span { text-decoration:none; }
  .dash-link::after { content:none; }
  .dash-link:hover { background:var(--cta-hi); border-color:var(--cta-hi); color:var(--cta-ink); }
  .dash-link:active { transform:scale(.98); }
  .dash-back::after { content:'\2190'; margin:0 8px 0 0; order:-1; }
  .mast-actions .dash-link, .dash-links .dash-link, .guide-body .dash-link, .dash-ledger-line .dash-link { background:transparent; border-color:var(--line2); color:var(--text); }
  .mast-actions .dash-link:hover, .dash-links .dash-link:hover, .guide-body .dash-link:hover, .dash-ledger-line .dash-link:hover { background:var(--accent-soft); border-color:var(--accent); color:var(--text); }
  .dash-mast .dash-link { background:var(--mast-ink); border-color:var(--mast-ink); color:var(--mast-bg); }
  .dash-mast .dash-link:hover { background:#fff; border-color:#fff; color:var(--mast-bg); }
  .dash-mast .mast-actions .dash-link { background:transparent; border-color:color-mix(in srgb,var(--mast-ink) 50%,transparent); color:var(--mast-ink); }
  .dash-mast .mast-actions .dash-link:hover { background:color-mix(in srgb,var(--mast-ink) 14%,transparent); border-color:var(--mast-ink); color:var(--mast-ink); }
  .mast-actions { gap:10px 12px; }
  .dash-links { gap:10px 12px; }

  /* ===== ENGAGEMENTS LIST: one row per engagement, one plain sentence, one obvious button. ===== */
  .eng-head { display:flex; justify-content:space-between; align-items:flex-end; flex-wrap:wrap; gap:14px 20px; padding-bottom:6px; }
  .eng-lede { margin:6px 0 0; font-size:16px; color:var(--muted); }
  .eng-lede b { color:var(--text); }
  .eng-tabs { display:flex; flex-wrap:wrap; gap:8px; margin:16px 0 6px; }
  .eng-tab { min-height:44px; padding:8px 20px; border-radius:var(--r-pill); border:1.5px solid var(--line2); background:transparent; color:var(--text); font:inherit; font-size:14.5px; font-weight:600; cursor:pointer; transition:background .2s var(--ease), border-color .2s var(--ease); }
  .eng-tab:hover { border-color:var(--accent); }
  .eng-tab.on { background:var(--accent); border-color:var(--accent); color:var(--accent-ink); }
  .eng-list { margin-top:8px; }
  .eng-row { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:10px 24px; align-items:center; padding:22px 0; border-top:1px solid var(--line); }
  .eng-row:last-child { border-bottom:1px solid var(--line); }
  .eng-row-title { margin:0; font-size:19px; font-weight:700; letter-spacing:-.015em; line-height:1.25; }
  .eng-row-client { margin-top:3px; font-size:14px; color:var(--muted); }
  .eng-row-status { display:flex; align-items:flex-start; gap:10px; margin:12px 0 0; max-width:64ch; font-size:15px; line-height:1.5; color:var(--text); }
  .eng-dot { flex:none; width:11px; height:11px; margin-top:6px; border-radius:50%; background:var(--accent-2); }
  .eng-dot.eng-you { background:var(--red-deep); }
  .eng-dot.eng-ok, .eng-dot.eng-done { background:var(--ok); }
  .eng-dot.eng-wait { background:var(--accent-2); }
  .eng-steps { display:flex; gap:4px; max-width:360px; margin-top:12px; }
  .eng-steps i { flex:1; height:6px; border-radius:var(--r-bar); background:var(--line2); }
  .eng-steps i.on { background:var(--accent); }
  .eng-step-text { margin-top:6px; font-size:13px; color:var(--muted); }
  .dash-link.quiet { background:transparent; border-color:var(--line2); color:var(--text); }
  .dash-link.quiet:hover { background:var(--accent-soft); border-color:var(--accent); color:var(--text); }
  @media (max-width:560px) {
    .eng-row { grid-template-columns:minmax(0,1fr); }
    .eng-row .dash-link { justify-self:stretch; }
  }

  /* Plain lists and small status words used inside the working screens. */
  .plain-list { margin:6px 0 0; padding:0 0 0 20px; font-size:14.5px; line-height:1.65; color:var(--text); }
  .plain-list li { margin:0 0 4px; }
  .badge-plain { display:inline-block; margin-left:8px; padding:1px 9px; border-radius:var(--r-pill); font-size:11px; font-weight:700; letter-spacing:.02em; vertical-align:2px; }
  .badge-ok { background:color-mix(in srgb,var(--ok) 16%,transparent); color:var(--ok-ink); }
  .badge-top { background:var(--accent-soft); color:var(--accent); }

  /* ===== READABLE MINIMUM. Much of the working screens sets text at 8-11px inline. Nobody should have to squint:
     text is never smaller than 12px, and buttons are always a comfortable size. ===== */
  :is(#main, .slide-panel, [id$="-modal"], [id$="-overlay"]) :is([style*="font-size:7.5px"],[style*="font-size:8px"],[style*="font-size:8.5px"],[style*="font-size:9px"],[style*="font-size:9.5px"],[style*="font-size:10px"],[style*="font-size: 9px"],[style*="font-size: 10px"]) { font-size:12px !important; }
  :is(#main, .slide-panel, [id$="-modal"], [id$="-overlay"]) :is([style*="font-size:10.5px"],[style*="font-size:11px"],[style*="font-size: 11px"]) { font-size:12.5px !important; }
  :is(#main, .slide-panel, [id$="-modal"], [id$="-overlay"]) .btn[style*="font-size"] { font-size:13px !important; padding:8px 18px !important; min-height:40px; }

  /* Toolbars made of buttons wrap instead of running off the page. */
  :is(#main, .slide-panel, [id$="-modal"]) div[style*="display:flex"]:has(> .btn), :is(#main, .slide-panel) div[style*="display:flex"][style*="justify-content:space-between"] { flex-wrap:wrap; row-gap:10px; }

  .ccard-score-l { margin-left:6px; font-size:12px; font-weight:600; color:var(--dim); }
  .results-hint { margin-left:14px; font-size:13px; color:var(--dim); }