  /* ══════════════════════════════════════════════════════════════════════
     Inter — self-hosted (A4). See ui/fonts/README.md for why this is vendored
     rather than linked from fonts.googleapis.com: that CDN sends the visitor's
     IP to Google on every page load, which is the pattern a German court found
     unlawful under the GDPR, and this app otherwise loads no third-party
     assets at all.

     One variable file per subset covers 100–900, so the whole weight range
     costs two requests. font-display:swap paints in the fallback immediately
     and swaps when the file lands — no invisible text.
     ══════════════════════════════════════════════════════════════════════ */
  @font-face{
    font-family:'Inter';
    font-style:normal;
    font-weight:100 900;
    font-display:swap;
    src:url('/ui/fonts/inter-latin.woff2?v=c7f84a98ab9d') format('woff2');
    unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,
                  U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,
                  U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
  }
  @font-face{
    font-family:'Inter';
    font-style:normal;
    font-weight:100 900;
    font-display:swap;
    src:url('/ui/fonts/inter-latin-ext.woff2?v=c7f84a98ab9d') format('woff2');
    unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,
                  U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,
                  U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
  }

  /* ══════════════════════════════════════════════════════════════════════
     DESIGN TOKENS — Playbook v3.0 Appendix A
     ──────────────────────────────────────────────────────────────────────
     Every colour, radius, shadow and font in the app resolves through this
     block. Two rules keep it that way:

       1. No literal colour outside :root and the two theme blocks below.
          A literal in a rule (or worse, inside a JS template string) cannot
          be re-themed, which is what made dark mode undeliverable before.
       2. The legacy names (--panel, --ink, --brand …) are the public API.
          935 call sites use them, so they are re-pointed here rather than
          renamed; the Appendix A names are added alongside as aliases.

     The theme resolves in three states, because the viewer has three:
     :root is the complete light set; the media query covers "system dark"
     (no attribute stamped); [data-theme] covers an explicit user choice and
     wins over the OS in both directions.
     ══════════════════════════════════════════════════════════════════════ */
  :root{
    /* — Identity —————————————————————————————————— */
    /* Appendix A specifies #6366F1→#8B5CF6. Measured against white text those
       are 4.47:1 and 4.23:1 — both fail WCAG AA, and every gradient surface in
       this app carries white text (nav pill, primary buttons, dashboard band,
       sign-in hero). Darkened to clear 5:1 with headroom; the difference is
       imperceptible side by side, the compliance difference is not. */
    --grad-from:#5D5FE1;
    --grad-to:#7E53DF;
    --gradient-brand:linear-gradient(135deg,var(--grad-from),var(--grad-to));
    --brand:#6D5AE6;              /* color.primary — flat accent */
    --brand-soft:#EEEBFD;         /* tinted surface behind the accent */
    --brand-ink:#4B3BB8;          /* accent text on a light surface */
    --violet:#7A51D8; --violet-soft:#F0EBFE;  /* #8B5CF6 was 3.63:1 on its own soft fill */
    --on-accent:#FFFFFF;          /* text on gradient / solid accent */
    /* Solid badge fills and the text that sits on them. Kept as a pair so the
       label follows the fill across themes — a semantic token alone flips
       brightness and takes the contrast with it. */
    --solid-brand:#4B3BB8; --on-solid:#FFFFFF;
    --solid-danger:#B5271B;

    /* — Surfaces ——————————————————————————————————— */
    --surface-page:#F5F6FB;       /* the page ground */
    --surface-sunk:#EFF1F8;       /* inset fills: search, table head, wells */
    --panel:#FFFFFF;              /* surface.card */
    --panel-soft:var(--surface-sunk);
    --panel-line:#E3E6EE;         /* border */
    --line:var(--panel-line);     /* was referenced 18× and never declared */

    /* The sidebar sits on a dark gradient in BOTH themes, so its text scale
       is independent of --ink and does not flip. */
    --bg:#1E1B3A; --bg2:#2A2352;
    --side-ink:#D7D5EC;
    --side-ink-soft:#A9A5CE;
    --side-ink-faint:#817DAA;

    /* — Text ———————————————————————————————————————— */
    --ink:#23263A;                /* text.default */
    --ink-soft:#4E5468;
    --ink-faint:#5F667A;          /* text.muted — A's #6B7185 is 4.30:1 on --surface-sunk */

    /* — Status (semantic only — never decorative) ————— */
    --green:#117C59; --green-soft:#E2F3EC;   /* success — 4.51:1 on its soft bg */
    --amber:#9D5E09; --amber-soft:#FBEEDA;   /* warning — A's #C2740B was 3.16:1 */
    --red:#E1483B;   --red-soft:#FCE7E5;     /* danger */
    --red-ink:#B5271B;            /* danger text — AA on --panel */
    --teal:#0B796E;  --teal-soft:#DEF3F0;    /* 3.67:1 → 4.58:1 */

    /* — Elevation & shape ——————————————————————————— */
    --radius-sm:10px;
    --radius:14px;
    --radius-lg:18px;
    --radius-pill:99px;
    --shadow:0 3px 7px rgba(42,42,90,.10);
    --shadow-raised:0 8px 16px rgba(42,42,90,.10);
    --shadow-pop:0 10px 30px rgba(42,42,90,.16);
    --focus-ring:0 0 0 3px rgba(109,90,230,.38);

    /* — Type ———————————————————————————————————————— */
    --font:'Inter',system-ui,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;

    /* — Motion —————————————————————————————————————— */
    --dur-fast:140ms;
    --dur-mid:200ms;
    --dur-reveal:520ms;
    --ease:cubic-bezier(.22,.61,.36,1);
  }

  /* System dark — no attribute stamped. Guarded so an explicit light choice
     still beats a dark OS. Only tokens are redefined; no component rules. */
  @media (prefers-color-scheme:dark){
    :root:not([data-theme="light"]){
      --brand:#8B7BFF; --brand-soft:#251F45; --brand-ink:#B9AEFF;
      --violet:#A78BFA; --violet-soft:#251F45;

      --surface-page:#0F1020;
      --surface-sunk:#20223A;
      --panel:#181A2C;
      --panel-line:#2A2C44;
      --bg:#141530; --bg2:#1C1B3E;

      --ink:#ECEDF6; --ink-soft:#C3C6DA; --ink-faint:#A6A9C4;

      --green:#3FBF93; --green-soft:#12312A;
      --amber:#E5A94F; --amber-soft:#372B17;
      --red:#F4796C;   --red-soft:#3A2020; --red-ink:#F9A79D;
      --teal:#3FBDB0;  --teal-soft:#123232;

      --solid-brand:#8B7BFF; --on-solid:#0F1020;
      --solid-danger:#F4796C;

      --shadow:0 3px 9px rgba(0,0,0,.42);
      --shadow-raised:0 8px 20px rgba(0,0,0,.48);
      --shadow-pop:0 12px 34px rgba(0,0,0,.55);
      --focus-ring:0 0 0 3px rgba(139,123,255,.48);
    }
  }

  /* Explicit choice — wins over the OS in both directions. */
  :root[data-theme="dark"]{
    --brand:#8B7BFF; --brand-soft:#251F45; --brand-ink:#B9AEFF;
    --violet:#A78BFA; --violet-soft:#251F45;

    --surface-page:#0F1020;
    --surface-sunk:#20223A;
    --panel:#181A2C;
    --panel-line:#2A2C44;
    --bg:#141530; --bg2:#1C1B3E;

    --ink:#ECEDF6; --ink-soft:#C3C6DA; --ink-faint:#A6A9C4;

    --green:#3FBF93; --green-soft:#12312A;
    --amber:#E5A94F; --amber-soft:#372B17;
    --red:#F4796C;   --red-soft:#3A2020; --red-ink:#F9A79D;
    --teal:#3FBDB0;  --teal-soft:#123232;

    --solid-brand:#8B7BFF; --on-solid:#0F1020;
    --solid-danger:#F4796C;

    --shadow:0 3px 9px rgba(0,0,0,.42);
    --shadow-raised:0 8px 20px rgba(0,0,0,.48);
    --shadow-pop:0 12px 34px rgba(0,0,0,.55);
    --focus-ring:0 0 0 3px rgba(139,123,255,.48);
  }

  *{box-sizing:border-box;margin:0;padding:0}
  body{font-family:var(--font);color:var(--ink);background:var(--surface-page);font-size:14px;line-height:1.5;font-variant-numeric:tabular-nums}
  a{color:inherit;text-decoration:none}

  /* A11y baseline (A10): one visible focus ring for everything keyboard
     reachable. Applied via :focus-visible so pointer users never see it. */
  :where(a,button,input,select,textarea,summary,[tabindex]):focus-visible{
    outline:2px solid var(--brand);
    outline-offset:2px;
    border-radius:4px;
  }

  /* Motion is opt-in per pattern, opt-out globally (A6/A10). Wired before
     any motion exists so nothing can ship without a fallback. */
  @media (prefers-reduced-motion:reduce){
    *,*::before,*::after{
      animation-duration:.01ms!important;
      animation-iteration-count:1!important;
      transition-duration:.01ms!important;
      scroll-behavior:auto!important;
    }
  }

  .app{display:grid;grid-template-columns:248px 1fr;min-height:100vh}

  /* ── Sidebar ── */
  .side{background:linear-gradient(180deg,var(--bg),var(--bg2));color:var(--side-ink);padding:18px 14px;position:sticky;top:0;height:100vh;overflow-y:auto;scrollbar-width:none;display:flex;flex-direction:column}
  .side::-webkit-scrollbar{display:none}
  .logo{display:flex;align-items:center;gap:10px;padding:6px 8px 18px;flex:none}
  .logo .mark{width:34px;height:34px;border-radius:var(--radius-sm);flex-shrink:0;background:linear-gradient(135deg,var(--brand),var(--teal));display:grid;place-items:center;font-weight:800;color:var(--on-accent);font-size:16px}
  .logo b{color:var(--on-accent);font-size:16px;letter-spacing:.2px;display:block}
  /* min-height reserves the line while /api/me is in flight, so filling in the
     client's name does not nudge the whole sidebar down. */
  .logo small{display:block;color:var(--side-ink-soft);font-size:10.5px;font-weight:600;letter-spacing:.6px;text-transform:uppercase;margin-top:1px;min-height:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:190px}
  .nav-group{margin:14px 6px 6px;font-size:10.5px;letter-spacing:.8px;text-transform:uppercase;color:var(--side-ink-faint);font-weight:700}
  .nav a{display:flex;align-items:center;gap:11px;padding:9px 11px;border-radius:var(--radius-sm);color:var(--side-ink);font-weight:500;cursor:pointer;margin-bottom:2px;transition:background .12s,color .12s}
  .nav a .ic{width:18px;text-align:center;opacity:.9;flex-shrink:0;display:flex;align-items:center;justify-content:center}
  .nav a:hover{background:rgba(255,255,255,.06);color:var(--on-accent)}
  .nav a.active{background:var(--brand);color:var(--on-accent);box-shadow:var(--shadow-raised)}
  .side .card{margin-top:18px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:var(--radius);padding:12px}
  .side .card b{color:var(--on-accent);font-size:12.5px}
  .side .card p{color:var(--side-ink-soft);font-size:11.5px;margin:6px 0 0;line-height:1.55}

  /* ── Main ── */
  .main{display:flex;flex-direction:column;min-width:0}
  .topbar{background:var(--panel);border-bottom:1px solid var(--panel-line);padding:12px 26px;display:flex;align-items:center;gap:16px;position:sticky;top:0;z-index:20}
  .crumb{font-size:12px;color:var(--ink-faint);font-weight:600}
  .crumb b{color:var(--ink)}
  .searchbar{flex:1;max-width:340px;display:flex;align-items:center;gap:8px;background:var(--panel-soft);border:1px solid var(--panel-line);border-radius:var(--radius-pill);padding:8px 14px;color:var(--ink-faint);font-size:13px}
  /* outline:0 here used to remove the only focus affordance in the topbar.
     Suppress it for pointer focus only; keyboard focus gets the ring. */
  .searchbar input{border:0;background:transparent;outline:none;width:100%;font-size:13px;color:var(--ink);font-family:var(--font)}
  .searchbar:focus-within{border-color:var(--brand);box-shadow:var(--focus-ring)}
  .searchbar input::placeholder{color:var(--ink-faint)}
  .avatar{width:34px;height:34px;border-radius:50%;flex-shrink:0;margin-left:auto;background:linear-gradient(135deg,var(--violet),var(--brand));color:var(--on-accent);display:grid;place-items:center;font-weight:700;font-size:13px}
  /* ── Language toggle ── */
  .lang-toggle{display:flex;align-items:center;margin-left:auto;background:var(--surface-sunk);border:1px solid var(--line);border-radius:var(--radius-pill);padding:2px;flex-shrink:0}
  .lang-toggle button{border:none;background:transparent;cursor:pointer;font-size:11px;font-weight:700;letter-spacing:.4px;padding:4px 10px;border-radius:var(--radius-pill);color:var(--ink-faint)}
  .lang-toggle button.active{background:var(--panel);color:var(--brand);box-shadow:var(--shadow)}
  /* ── Running-jobs chip (topbar, next to EN | NL) ── */
  /* The chip leads the right-hand group, so IT carries the auto margin that
     pushes that group across — but only while visible, or an idle chip would
     leave the language toggle stranded mid-bar. */
  .jobs{position:relative;flex-shrink:0;display:none}
  .jobs.show{display:block;margin-left:auto}
  .jobs.show + .lang-toggle{margin-left:10px}
  .jobs-btn{display:inline-flex;align-items:center;gap:7px;cursor:pointer;border:1px solid var(--line);background:var(--panel);border-radius:var(--radius-pill);padding:5px 11px 5px 9px;font-size:11.5px;font-weight:700;color:var(--ink-soft);font-family:var(--font)}
  .jobs-btn:hover{border-color:var(--brand);color:var(--brand)}
  .jobs.running .jobs-btn{border-color:var(--brand-soft);background:var(--brand-soft);color:var(--brand-ink)}
  .jobs.allDone .jobs-btn{border-color:var(--green-soft);background:var(--green-soft);color:var(--green)}
  .jobs.anyFailed .jobs-btn{border-color:var(--red-soft);background:var(--red-soft);color:var(--red-ink)}
  .jobs-btn .spinner{width:11px;height:11px;border-width:2px;border-color:var(--brand-soft);border-top-color:var(--brand)}
  .jobs-dd{display:none;position:absolute;left:0;top:38px;width:330px;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-pop);z-index:70;overflow:hidden}
  .jobs.open .jobs-dd{display:block}
  .jobs-dd-head{padding:11px 14px;font-size:12px;font-weight:800;border-bottom:1px solid var(--panel-line);color:var(--ink)}
  .jobs-row{display:flex;align-items:flex-start;gap:10px;padding:10px 14px;border-bottom:1px solid var(--panel-line);cursor:pointer}
  .jobs-row:last-child{border-bottom:none}
  .jobs-row:hover{background:var(--panel-soft)}
  .jobs-ic{width:24px;height:24px;border-radius:7px;background:var(--panel-soft);display:grid;place-items:center;font-size:12px;flex-shrink:0}
  .jobs-lbl{font-size:12px;font-weight:700;color:var(--ink);line-height:1.35}
  .jobs-sub{font-size:10.5px;color:var(--ink-faint);margin-top:2px;line-height:1.4}
  .jobs-time{margin-left:auto;font-size:10.5px;font-weight:700;color:var(--ink-faint);font-variant-numeric:tabular-nums;flex-shrink:0}
  .jobs-row.done .jobs-ic{background:var(--green-soft);color:var(--green)}
  .jobs-row.failed .jobs-ic{background:var(--red-soft);color:var(--red)}
  .jobs-empty{padding:20px 14px;text-align:center;font-size:12px;color:var(--ink-faint)}

  /* ── Notification bell ── */
  .bell{position:relative;margin-left:14px;flex-shrink:0;cursor:pointer;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;color:var(--ink-soft);border:1px solid var(--line);background:var(--panel)}
  .bell:hover{color:var(--brand);border-color:var(--brand)}
  .bell-badge{position:absolute;top:-4px;right:-4px;min-width:16px;height:16px;border-radius:var(--radius-pill);background:var(--red);color:var(--on-accent);font-size:9.5px;font-weight:800;display:none;place-items:center;padding:0 4px;line-height:1}
  .bell.has-unread .bell-badge{display:grid}
  .bell-dropdown{display:none;position:absolute;right:0;top:44px;width:340px;max-height:420px;overflow-y:auto;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-pop);z-index:70}
  .bell.open .bell-dropdown{display:block}
  .bell-dd-head{padding:12px 16px;font-size:12.5px;font-weight:800;border-bottom:1px solid var(--panel-line);position:sticky;top:0;background:var(--panel)}
  .bell-item{display:flex;gap:10px;padding:10px 16px;border-bottom:1px solid var(--panel-line);cursor:pointer;align-items:flex-start}
  .bell-item:hover{background:var(--surface-sunk)}
  .bell-item:last-child{border-bottom:none}
  .bell-ic{width:26px;height:26px;border-radius:var(--radius-sm);background:var(--brand-soft);display:grid;place-items:center;font-size:13px;flex-shrink:0}
  .bell-txt{font-size:12px;line-height:1.45;color:var(--ink)}
  .bell-txt b{font-weight:700}
  .bell-sub{font-size:10.5px;color:var(--ink-faint);margin-top:2px}
  .bell-empty{padding:26px 16px;text-align:center;color:var(--ink-faint);font-size:12.5px}
  /* Teams & Knowledge Base are team-admin only */
  body:not(.team-admin) #nav-team{display:none}
  body:not(.team-admin) #nav-knowledge-base{display:none}
  /* ── User menu (avatar dropdown) ── */
  .user-menu{position:relative;margin-left:14px;cursor:pointer}
  .user-menu .avatar{margin-left:0}
  .user-dropdown{display:none;position:absolute;right:0;top:42px;min-width:220px;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-sm);box-shadow:var(--shadow-raised);padding:12px 14px;z-index:60}
  .user-menu.open .user-dropdown{display:block}
  .user-dd-name{font-weight:700;font-size:13.5px}
  .user-dd-email{font-size:12px;color:var(--ink-soft);margin-top:2px;word-break:break-all}
  .user-dd-role{display:inline-block;margin-top:8px;font-size:10.5px;font-weight:700;letter-spacing:.4px;text-transform:uppercase;background:var(--brand-soft);color:var(--brand-ink);border-radius:var(--radius-pill);padding:3px 9px}
  .user-dd-signout{display:block;margin-top:12px;padding-top:10px;border-top:1px solid var(--line);font-size:12.5px;font-weight:600;color:var(--red-ink);text-decoration:none}
  .user-dd-signout:hover{text-decoration:underline}
  /* ── Role gating: elements marked data-need are hidden unless body has can-<role> ── */
  body:not(.can-contributor) [data-need="contributor"]{display:none!important}
  body:not(.can-bidmanager)  [data-need="bidmanager"]{display:none!important}
  body:not(.can-admin)       [data-need="admin"]{display:none!important}
  .content{padding:26px 26px 60px;max-width:1240px;width:100%;margin:0 auto}

  h1.page{font-size:22px;margin:0 0 3px;font-weight:800;letter-spacing:-.3px}
  .sub{color:var(--ink-soft);margin:0 0 20px;font-size:13.5px}

  /* ── Panels ── */
  .panel{background:var(--panel);border:1px solid var(--panel-line);border-radius:var(--radius);box-shadow:var(--shadow)}
  .sec-title{display:flex;align-items:center;gap:10px;margin:32px 0 10px}
  .sec-title h2{font-size:16px;margin:0;font-weight:800;letter-spacing:-.2px}
  .sec-title .line{flex:1;height:1px;background:var(--panel-line)}
  .sec-title .count{font-size:12px;color:var(--ink-faint);font-weight:600}

  /* ── Buttons ── */
  .btn{border:1px solid var(--panel-line);background:var(--panel);color:var(--ink);border-radius:var(--radius-sm);padding:8px 14px;font-weight:600;font-size:12.5px;cursor:pointer;display:inline-flex;align-items:center;gap:7px;font-family:var(--font);transition:background var(--dur-fast) var(--ease),border-color var(--dur-fast) var(--ease);white-space:nowrap}
  .btn:hover{border-color:var(--panel-line);background:var(--panel-soft)}
  /* Gradient is reserved for identity and the single primary action per view
     (playbook 5.2). `.cta` used to be a separate yellow; it is now an alias so
     the one caller (#extract-btn) needs no markup change. */
  .btn.primary,.btn.cta{background:var(--gradient-brand);border-color:transparent;color:var(--on-accent);box-shadow:var(--shadow)}
  .btn.primary:hover,.btn.cta:hover{filter:brightness(1.07);box-shadow:var(--shadow-raised)}
  .btn.primary:disabled,.btn.cta:disabled{background:var(--surface-sunk);border-color:var(--panel-line);color:var(--ink-faint);opacity:1;box-shadow:none;filter:none;cursor:not-allowed}
  .btn.ghost{background:transparent;border-color:transparent;color:var(--brand)}
  .btn.ghost:hover{background:var(--brand-soft);border-color:transparent}
  .btn-full{width:100%;justify-content:center}

  /* ── Mini-bar ── */
  .mini-bar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:14px}
  .sort-wrap{position:relative}
  .sort-dropdown{display:none;position:absolute;top:calc(100% + 6px);left:0;background:var(--panel);border:1px solid var(--panel-line);border-radius:var(--radius);box-shadow:var(--shadow);padding:5px;min-width:190px;z-index:50}
  .sort-dropdown.open{display:block}
  .sort-option{display:block;width:100%;padding:8px 12px;border-radius:var(--radius-sm);font-size:12.5px;cursor:pointer;color:var(--ink);text-align:left;background:none;border:none;font-family:var(--font);font-weight:500}
  .sort-option:hover{background:var(--panel-soft)}
  .sort-option.active{color:var(--brand-ink);font-weight:700;background:var(--brand-soft)}

  /* ── Tags ── */
  .tag{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:700;padding:3px 9px;border-radius:20px}
  .t-blue  {background:var(--brand-soft);color:var(--brand-ink)}
  .t-amber {background:var(--amber-soft);color:var(--amber)}
  .t-red   {background:var(--red-soft);color:var(--red)}
  .t-green {background:var(--green-soft);color:var(--green)}
  .t-teal  {background:var(--teal-soft);color:var(--teal)}
  .t-violet{background:var(--violet-soft);color:var(--violet)}
  .t-grey  {background:var(--surface-sunk);color:var(--ink-soft)}

  /* ── File icons ── */
  /* ── Knowledge Base rows ── */
  .kb-alert{background:var(--amber-soft);border:1px solid var(--amber);color:var(--amber);border-radius:var(--radius-sm);padding:9px 12px;margin:10px 14px;font-size:12.5px;font-weight:600}
  .kb-row{display:flex;align-items:flex-start;gap:12px;padding:12px 16px;border-bottom:1px solid var(--panel-line);flex-wrap:wrap}
  .kb-row:last-child{border-bottom:0}
  .kb-row-bad{background:var(--amber-soft)}
  .kb-main{flex:1;min-width:220px}
  .kb-name{font-size:13px;font-weight:700;color:var(--brand);cursor:pointer;word-break:break-word}
  .kb-name:hover{text-decoration:underline}
  .kb-meta{font-size:11.5px;color:var(--ink-soft);margin-top:3px;line-height:1.5}
  .kb-project{font-weight:700;color:var(--ink)}
  .kb-unnamed{color:var(--amber);font-weight:700}
  .kb-link{color:var(--green);font-weight:600}
  .kb-unlinked{color:var(--ink-faint);font-style:italic}
  .kb-warn{font-size:11.5px;color:var(--amber);background:var(--amber-soft);border-radius:7px;padding:6px 9px;margin-top:6px;line-height:1.45}
  .kb-parts{font-size:10.5px;color:var(--ink-faint);margin-top:5px;line-height:1.5}
  /* ── Past-project linking and comparison ── */
  /* .lp-* is the past-tender COMPARISON panel, which step 2 renders. The
     two-dropdown link form and its row (.lp-form/.lp-link/.lp-name/.lp-actions)
     went with the Knowledge Base screen that owned them. */
  .lp-meta{font-size:11px;color:var(--ink-faint)}
  .lp-panel{border:1px solid var(--panel-line);border-radius:var(--radius);margin-top:14px;overflow:hidden}
  .lp-head{padding:13px 16px;border-bottom:1px solid var(--panel-line);background:var(--panel-soft)}
  .lp-head-t{font-size:13.5px;font-weight:800;color:var(--ink)}
  .lp-headline{font-size:12.5px;color:var(--ink);line-height:1.65;margin-top:6px}
  .lp-headline li{margin-left:16px}
  .lp-sec{padding:12px 16px;border-top:1px solid var(--panel-line)}
  .lp-sec-t{font-size:11.5px;font-weight:800;text-transform:uppercase;letter-spacing:.4px;color:var(--ink-soft);margin-bottom:8px}
  .lp-facts{width:100%;border-collapse:collapse;font-size:12px}
  .lp-facts td{padding:5px 8px;border-bottom:1px solid var(--panel-line);vertical-align:top}
  .lp-facts td:first-child{font-weight:700;color:var(--ink-soft);white-space:nowrap;width:170px}
  .lp-verdict{font-size:10.5px;font-weight:800;padding:2px 8px;border-radius:20px;white-space:nowrap}
  .lp-v-same{background:var(--green-soft);color:var(--green)}
  .lp-v-changed{background:var(--amber-soft);color:var(--amber)}
  .lp-v-new{background:var(--brand-soft);color:var(--brand-ink)}
  .lp-v-gone{background:var(--red-soft);color:var(--red)}
  .lp-req{display:flex;gap:9px;padding:8px 0;border-bottom:1px dashed var(--panel-line);font-size:12px;line-height:1.5}
  .lp-req:last-child{border-bottom:none}
  .lp-req-past{color:var(--ink-faint);font-size:11px;margin-top:3px}
  .lp-docs{display:flex;flex-wrap:wrap;gap:6px}
  .lp-doc{font-size:11px;padding:3px 9px;border-radius:20px;background:var(--panel-soft);color:var(--ink-soft)}
  .lp-doc.only-past{background:var(--amber-soft);color:var(--amber)}
  .lp-more{font-size:11.5px;font-weight:700;color:var(--brand);cursor:pointer;margin-top:8px;display:inline-block}
  .lp-note{font-size:11.5px;color:var(--brand-ink);background:var(--brand-soft);border:1px solid var(--brand-soft);border-radius:var(--radius-sm);padding:8px 12px;margin-bottom:14px;line-height:1.5}

  /* ── The change brief ────────────────────────────────────────────────────
     Step 2's comparison is now a page of prose, not a diff. The type is sized
     for reading a paragraph rather than scanning a table, and the whole block
     is held to one A4's worth of width so the lines do not run long. */
  .cb-scale{font-size:11.5px;color:var(--ink-soft);margin-top:6px;line-height:1.6}
  .cb-same{font-size:12.5px;color:var(--ink-soft);line-height:1.6;padding:2px 0}
  .cb-facts{display:flex;flex-direction:column;gap:6px}
  .cb-fact{display:flex;gap:9px;align-items:baseline;font-size:12.5px;line-height:1.55}
  .cb-fact-b{min-width:0}
  .cb-was{color:var(--ink-faint);font-size:11.5px}

  .cb-verdict{font-size:13.5px;line-height:1.68;color:var(--ink);max-width:76ch;
    padding:11px 14px;margin-bottom:14px;background:var(--panel-soft);
    border-left:3px solid var(--brand);border-radius:0 var(--radius-sm) var(--radius-sm) 0}

  .cb-items{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:15px;max-width:80ch}
  .cb-item{padding-bottom:15px;border-bottom:1px solid var(--panel-line)}
  .cb-item:last-child{border-bottom:none;padding-bottom:0}
  .cb-item-h{display:flex;gap:9px;align-items:baseline;flex-wrap:wrap;margin-bottom:5px}
  .cb-item-t{font-size:13px;font-weight:750;color:var(--ink);line-height:1.45}
  .cb-item-d{font-size:12.5px;line-height:1.65;color:var(--ink-soft)}
  .cb-item-w{font-size:12px;line-height:1.6;color:var(--ink);margin-top:5px}
  .cb-item-w b{color:var(--ink-soft);font-weight:750}

  /* Effort, not severity. The reader is deciding who to put on this and for
     how long, so the chip answers that and nothing else. */
  .cb-eff{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.5px;
    padding:3px 9px;border-radius:20px;white-space:nowrap;flex-shrink:0}
  .cb-eff.major{background:var(--red-soft);color:var(--red)}
  .cb-eff.moderate{background:var(--amber-soft);color:var(--amber)}

  .cb-refs{display:flex;flex-wrap:wrap;gap:5px;margin-top:7px}
  .cb-ref{font-size:10.5px;font-family:var(--mono,ui-monospace,monospace);padding:2px 7px;
    border-radius:4px;background:var(--panel-soft);color:var(--ink-faint)}
  .cb-ref.unverified{background:var(--amber-soft);color:var(--amber);font-weight:700;
    font-family:inherit;cursor:help}

  .cb-aside{font-size:12px;line-height:1.6;color:var(--ink-soft);margin-top:15px;
    padding:9px 13px;background:var(--panel-soft);border-radius:var(--radius-sm);max-width:80ch}
  .cb-aside b{color:var(--ink)}

  .cb-foot{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;
    margin-top:16px;padding-top:11px;border-top:1px solid var(--panel-line);
    font-size:11px;color:var(--ink-faint)}
  .cb-foot-a{display:flex;gap:7px;flex-wrap:wrap}
  .cb-foot-a .btn{font-size:11.5px;padding:5px 12px}

  .cb-wait{display:flex;gap:12px;align-items:flex-start;padding:16px 2px}
  .cb-wait-t{font-size:12.5px;font-weight:750;color:var(--ink)}
  .cb-wait-s{font-size:11.5px;color:var(--ink-faint);line-height:1.6;margin-top:3px;max-width:62ch}
  .cb-spin{width:15px;height:15px;border-width:2px;border-color:var(--panel-line);
    border-top-color:var(--brand);margin-top:1px}
  .cb-empty{font-size:12.5px;color:var(--red);line-height:1.6;padding:14px 2px}

  /* One A4. The brief is written to that length, so it should also print to
     it — a bid manager takes this into the go/no-go meeting on paper. */
  @media print{
    .cb-foot-a,.cb-wait{display:none}
    .cb-item{break-inside:avoid}
    .cb-verdict{background:none;border-left:2px solid #000}
  }
  /* ── Company profile + suggested tenders ── */
  .sg-profile{border:1px solid var(--panel-line);border-radius:var(--radius-sm);padding:13px 15px;margin-bottom:14px;background:var(--panel-soft)}
  .sg-row{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap;margin-bottom:10px}
  .sg-row label{display:flex;flex-direction:column;gap:4px;font-size:11.5px;font-weight:700;color:var(--ink-soft);flex:1;min-width:220px}
  .sg-summary{font-size:12.5px;color:var(--ink);line-height:1.6;margin-bottom:8px}
  .sg-tags{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:6px}
  .sg-tag{font-size:11px;font-weight:600;padding:3px 9px;border-radius:20px;background:var(--panel);border:1px solid var(--panel-line);color:var(--ink-soft)}
  .sg-tag.cpv{background:var(--brand-soft);color:var(--brand-ink);border-color:var(--brand-soft);font-variant-numeric:tabular-nums}
  .sg-tag.excl{background:var(--red-soft);color:var(--red);border-color:var(--red-soft)}
  .sg-meta{font-size:10.5px;color:var(--ink-faint);line-height:1.5}
  .sg-card{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border:1px solid var(--panel-line);border-radius:var(--radius-sm);margin-bottom:9px}
  .sg-card.taken{opacity:.6}
  .sg-card.excluded{border-color:var(--amber-soft);background:var(--amber-soft)}
  .sg-score{flex-shrink:0;width:44px;height:44px;border-radius:var(--radius-sm);display:grid;place-items:center;font-size:14px;font-weight:800;background:var(--brand-soft);color:var(--brand-ink)}
  .sg-score.mid{background:var(--amber-soft);color:var(--amber)}
  .sg-score.low{background:var(--panel-soft);color:var(--ink-faint)}
  .sg-title{font-size:13px;font-weight:700;color:var(--ink);line-height:1.4}
  .sg-sub{font-size:11.5px;color:var(--ink-soft);margin-top:3px;line-height:1.5}
  .sg-why{font-size:11.5px;color:var(--green);background:var(--green-soft);border-radius:7px;padding:5px 9px;margin-top:6px;line-height:1.45}
  .sg-why.excl{color:var(--amber);background:var(--amber-soft)}
  .sg-card-actions{margin-left:auto;display:flex;flex-direction:column;gap:6px;flex-shrink:0}
  .kb-parts-bad{color:var(--amber);font-weight:600}
  .kb-actions{display:flex;align-items:center;gap:7px;flex-shrink:0}
  .kb-actions .btn{font-size:11.5px;padding:4px 10px}
  .kb-badge{font-size:10px;font-weight:800;padding:3px 8px;border-radius:20px;white-space:nowrap}
  .kb-badge-ok{background:var(--green-soft);color:var(--green)}
  .kb-badge-thin{background:var(--amber-soft);color:var(--amber)}
  .kb-badge-bad{background:var(--red-soft);color:var(--red-ink)}
  .kb-edit{flex-basis:100%;display:flex;gap:12px;flex-wrap:wrap;align-items:flex-end;background:var(--panel-soft);border-radius:var(--radius-sm);padding:12px 14px;margin-top:10px}
  .kb-edit label{display:flex;flex-direction:column;gap:4px;font-size:11px;font-weight:700;color:var(--ink-soft);flex:1;min-width:150px}
  .kb-in{font-family:inherit;font-size:12.5px;color:var(--ink);background:var(--panel);border:1.5px solid var(--panel-line);border-radius:var(--radius-sm);padding:7px 9px}
  .kb-in:focus{outline:none;border-color:var(--brand)}
  /* The tenders a historical document is linked to. A scrolling checklist
     rather than a <select multiple>, which on every platform hides how many
     are selected behind a two-row viewport you have to ctrl-click into. */
  .kb-linklist{
    max-height:132px;overflow-y:auto;margin-bottom:6px;
    border:1.5px solid var(--panel-line);border-radius:var(--radius-sm);background:var(--panel);
  }
  /* Scoped to .kb-linklist so it outranks `.kb-edit label`, which stacks the
     inline editor's fields in a column — these rows are a checkbox beside its
     label, not above it. */
  .kb-linklist .kb-linkrow{
    display:flex;flex-direction:row;align-items:center;gap:9px;padding:6px 10px;
    cursor:pointer;font-size:12.5px;font-weight:500;color:var(--ink);line-height:1.4;
    min-width:0;flex:none;
  }
  .kb-linklist .kb-linkrow:hover{background:var(--panel-soft)}
  .kb-linklist .kb-linkrow input{accent-color:var(--brand);width:14px;height:14px;flex-shrink:0;cursor:pointer}
  .kb-linklist .kb-linkrow span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .kb-linkempty{padding:12px 10px;font-size:12px;color:var(--ink-faint);text-align:center}

  /* ── What a re-run said about an answer that already existed ──
     Written by the gap analysis after a past tender is linked and its
     documents indexed. Coloured by severity so "better supported" reads as
     news and "contradicted" reads as work. */
  .rp-review{border-left:3px solid var(--panel-line);border-radius:var(--radius-sm);padding:10px 13px;background:var(--panel-soft)}
  .rp-review-reinforced{border-left-color:var(--green);background:var(--green-soft)}
  .rp-review-weakened{border-left-color:var(--amber);background:var(--amber-soft)}
  .rp-review-contradicted{border-left-color:var(--red);background:var(--red-soft)}
  .rp-review-head{font-size:12.5px;font-weight:800;color:var(--ink);margin-bottom:3px}
  .rp-review-body{font-size:12.5px;color:var(--ink);line-height:1.6}
  .rp-review-meta{font-size:11px;color:var(--ink-soft);margin-top:4px}
  .hiq-review{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;margin-top:8px}
  .hiq-review-why{font-size:11.5px;color:var(--ink-soft);line-height:1.5;flex:1;min-width:180px}
  .kb-linkcount{font-size:11px;font-weight:700;color:var(--brand)}
  .kb-edit-actions{display:flex;gap:7px}

  /* ── Commercial risk review ── */
  .pr-empty{background:var(--panel);border:1px dashed var(--panel-line);border-radius:var(--radius);padding:34px 22px;text-align:center;color:var(--ink-soft);font-size:13.5px}
  .pr-sec{background:var(--panel);border:1px solid var(--panel-line);border-radius:var(--radius);margin-bottom:16px;overflow:hidden}
  .pr-sec-head{display:flex;align-items:center;gap:12px;padding:13px 16px;border-bottom:1px solid var(--panel-line)}
  .pr-sec-title{font-size:13.5px;font-weight:800;color:var(--ink)}
  .pr-sec-sub{font-size:11.5px;color:var(--ink-soft);margin-top:2px}
  .pr-sec-n{margin-left:auto;font-size:12px;font-weight:800;color:var(--ink-soft);background:var(--panel-soft);border-radius:20px;padding:3px 11px}
  .pr-none{padding:14px 16px;font-size:12.5px;color:var(--ink-soft)}
  .pr-issue{padding:14px 16px;border-bottom:1px solid var(--panel-line)}
  .pr-issue:last-child{border-bottom:0}
  .pr-unverified{background:var(--amber-soft)}
  .pr-tag{font-size:10px;font-weight:800;padding:2px 8px;border-radius:20px}
  .pr-ok{background:var(--green-soft);color:var(--green)}
  .pr-warn{background:var(--amber-soft);color:var(--amber)}
  .pr-missing{background:var(--surface-sunk);color:var(--ink-faint)}
  .pr-quote{font-size:12px;font-style:italic;color:var(--ink-soft);background:var(--panel-soft);border-left:3px solid var(--panel-line);border-radius:0 7px 7px 0;padding:8px 11px;margin-bottom:8px;line-height:1.5}
  .pr-issue-body,.pr-impact{font-size:12.5px;color:var(--ink);line-height:1.6;margin-bottom:6px}
  .pr-interp{font-size:12.5px;color:var(--ink);line-height:1.6;margin-bottom:6px}
  .pr-interp ol{margin:3px 0 0 20px;padding:0}
  .pr-interp li{margin-bottom:2px}
  .pr-thin{font-size:11.5px;color:var(--amber);font-weight:600;margin-top:3px}
  .pr-ungrounded{font-size:11.5px;color:var(--amber);background:var(--amber-soft);border-radius:7px;padding:7px 9px;margin:6px 0;line-height:1.45}
  .pr-q{background:var(--brand-soft);border:1px solid var(--brand-soft);border-radius:var(--radius-sm);padding:10px 12px;margin-top:9px;font-size:12.5px;color:var(--ink);line-height:1.55}
  .pr-q-lbl{font-size:10px;font-weight:800;letter-spacing:.5px;text-transform:uppercase;color:var(--brand-ink);margin-bottom:4px}
  .pr-q-actions{display:flex;gap:7px;margin-top:9px}
  .pr-q-actions .btn{font-size:11.5px;padding:5px 11px}
  .pr-check{padding:4px 16px 14px}
  .pr-check-row{display:flex;align-items:center;gap:10px;padding:7px 0;border-bottom:1px dashed var(--panel-line);font-size:12.5px}
  .pr-check-row:last-child{border-bottom:0}
  .pr-check-label{font-weight:700;color:var(--ink);min-width:170px}
  .pr-check-note{color:var(--ink-soft);font-size:11.5px}

  /* ── Questions to the contracting authority ── */
  .q-dl{display:flex;align-items:flex-start;gap:14px;border-radius:var(--radius);padding:14px 16px;margin-bottom:16px;border:1px solid}
  .q-dl-ok{background:var(--brand-soft);border-color:var(--brand-soft)}
  .q-dl-soon{background:var(--amber-soft);border-color:var(--amber)}
  .q-dl-warn{background:var(--amber-soft);border-color:var(--amber)}
  .q-dl-passed{background:var(--red-soft);border-color:var(--red-soft)}
  .q-dl-none{background:var(--panel-soft);border-color:var(--panel-line)}
  .q-dl-t{font-size:13.5px;font-weight:800;color:var(--ink);display:flex;align-items:center;gap:6px;flex-wrap:wrap}
  .q-dl-s{font-size:12px;color:var(--ink-soft);margin-top:3px;line-height:1.5}
  .q-dl-warn-note{font-size:11.5px;color:var(--amber);background:rgba(255,255,255,.6);border-radius:7px;padding:7px 9px;margin-top:7px;line-height:1.5}
  .q-dl-edit{background:var(--panel);border-color:var(--panel-line)}
  .q-dl-input{margin-top:9px;font-family:inherit;font-size:13px;color:var(--ink);background:var(--panel);border:1.5px solid var(--panel-line);border-radius:var(--radius-sm);padding:8px 11px;max-width:220px}
  .q-dl-input:focus{outline:none;border-color:var(--brand)}
  .q-compose{background:var(--panel);border:1px solid var(--panel-line);border-radius:var(--radius);padding:14px 16px;margin-bottom:16px}
  .q-compose-lbl{font-size:10.5px;font-weight:800;color:var(--ink-faint);letter-spacing:.6px;text-transform:uppercase;margin-bottom:8px}
  .q-ta,.q-in{width:100%;font-family:inherit;font-size:13px;line-height:1.6;color:var(--ink);background:var(--panel);border:1.5px solid var(--panel-line);border-radius:var(--radius-sm);padding:10px 12px;resize:vertical}
  .q-in{margin-top:8px;font-size:12.5px}
  .q-ta:focus,.q-in:focus{outline:none;border-color:var(--brand)}
  .q-card{background:var(--panel);border:1px solid var(--panel-line);border-radius:var(--radius);padding:13px 16px;margin-bottom:10px}
  .q-card-head{display:flex;align-items:center;gap:8px;margin-bottom:7px}
  .q-seq{display:grid;place-items:center;width:22px;height:22px;border-radius:6px;background:var(--panel-soft);border:1px solid var(--panel-line);font-size:11px;font-weight:800;color:var(--ink-soft);flex-shrink:0}
  .q-tag{display:inline-block;font-size:10px;font-weight:800;padding:2px 8px;border-radius:20px}
  .q-origin{display:inline-flex;align-items:center;gap:3px;font-weight:700}
  .q-origin-ai{background:var(--brand-soft);color:var(--brand-ink)}
  .q-origin-manual{background:var(--panel-soft);color:var(--ink-soft)}
  .q-meta{font-size:11px;color:var(--ink-faint)}
  .q-text{font-size:13.5px;color:var(--ink);line-height:1.6}
  .q-context{font-size:11.5px;color:var(--ink-soft);margin-top:5px;padding-left:10px;border-left:2px solid var(--panel-line)}
  .q-answer{margin-top:9px;background:var(--green-soft);border:1px solid var(--green-soft);border-radius:var(--radius-sm);padding:9px 11px;font-size:12.5px;color:var(--green);line-height:1.55}
  .q-answer-lbl{font-size:10px;font-weight:800;letter-spacing:.5px;text-transform:uppercase;color:var(--green);margin-bottom:3px}
  .q-actions{display:flex;gap:7px;flex-wrap:wrap;margin-top:10px}
  .q-actions .btn{font-size:11.5px;padding:5px 11px}
  .q-empty{background:var(--panel);border:1px dashed var(--panel-line);border-radius:var(--radius);padding:32px 20px;text-align:center;color:var(--ink-soft);font-size:13px}

  /* Print-only document for sending the question set to a bid partner.
     Hidden on screen; @media print swaps it in for everything else. */
  .q-print{display:none}
  /* The DEFAULT printed page carries the margin, so it applies in every browser.
     It used to be the other way round — this rule was named and the proposal
     preview's bare `@page{margin:0}` further down the sheet won, printing the
     questions document edge-to-edge. Naming this one fixed it only where named
     pages are supported (Chrome; not Firefox, and only recently Safari), which
     left the same bug everywhere else. The preview keeps its zero margin
     through a named page instead — it draws its own 24mm paper padding, so
     where named pages are unsupported it simply prints with wider margins,
     which is cosmetic rather than broken. */
  @page{size:A4;margin:18mm 16mm}
  @media print{
    body.q-printing > *:not(#q-print){display:none!important}
    body.q-printing #q-print{display:block!important}
    body.q-printing{background:var(--panel)}
  }
  .q-print-doc{color:#000;font-size:11pt;line-height:1.45}
  .q-print-head{border-bottom:2px solid #000;padding-bottom:10px;margin-bottom:18px}
  .q-print-head h1{font-size:16pt;margin:0 0 8px}
  .q-print-meta{border-collapse:collapse;font-size:9.5pt}
  .q-print-meta td{padding:2px 0;vertical-align:top}
  .q-print-meta td:first-child{font-weight:700;padding-right:12px;white-space:nowrap}
  .q-print-q{margin-bottom:14px;padding-bottom:12px;border-bottom:1px solid var(--panel-line);page-break-inside:avoid}
  .q-print-q-head{font-size:8.5pt;text-transform:uppercase;letter-spacing:.4px;color:var(--ink-soft);margin-bottom:3px}
  .q-print-q-head span{margin-right:10px}
  .q-print-seq{font-weight:800;color:#000}
  .q-print-text{font-weight:600}
  .q-print-ctx,.q-print-answer,.q-print-pred{font-size:9.5pt;margin-top:4px}
  .q-print-ctx{color:var(--ink-soft)}
  .q-print-answer{border-left:3px solid #000;padding-left:8px}
  .q-print-pred{border-left:3px solid var(--ink-faint);padding-left:8px;color:var(--ink)}
  .q-print-foot{margin-top:16px;font-size:8.5pt;color:var(--ink-faint);border-top:1px solid var(--panel-line);padding-top:6px}

  /* AI prediction — visually distinct from .q-answer, which is the real reply */
  .q-pred{margin-top:9px;border-radius:var(--radius-sm);padding:9px 11px;border:1px dashed;font-size:12.5px;line-height:1.55}
  .q-pred-high{background:var(--brand-soft);border-color:var(--brand-soft);color:var(--ink)}
  .q-pred-med{background:var(--amber-soft);border-color:var(--amber);color:var(--ink)}
  .q-pred-low{background:var(--panel-soft);border-color:var(--panel-line);color:var(--ink-soft)}
  .q-pred-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:5px}
  .q-pred-lbl{font-size:10px;font-weight:800;letter-spacing:.5px;text-transform:uppercase;color:var(--brand-ink)}
  .q-pred-pct{font-size:12px;font-weight:800;color:var(--ink)}
  .q-pred-verdict{font-size:11px;color:var(--ink-soft)}
  .q-pred-answer{font-weight:600}
  .q-pred-reason{margin-top:4px;color:var(--ink-soft);font-size:12px}
  .q-pred-cite{margin-top:6px;font-size:11.5px;font-style:italic;color:var(--ink-soft);background:rgba(255,255,255,.65);border-radius:6px;padding:6px 8px}
  .q-pred-cite span{font-style:normal;font-weight:600;opacity:.75}
  .q-pred-capped{margin-top:6px;font-size:11px;color:var(--amber)}
  .q-pred-warn{margin-top:5px;font-size:11.5px;font-weight:700;color:var(--amber)}

  .q-handoff{margin-top:12px;padding-top:11px;border-top:1px solid var(--panel-line)}
  .q-handoff-t{font-size:12px;font-weight:800;color:var(--ink)}
  .q-handoff-s{font-size:11.5px;color:var(--ink-soft);line-height:1.5;margin-top:3px}

  .q-paste-sum{font-size:12px;color:var(--ink-soft);margin:10px 0 6px}
  .q-paste-row{display:flex;gap:9px;align-items:flex-start;padding:7px 9px;border-radius:var(--radius-sm);font-size:12.5px;line-height:1.5;color:var(--ink);cursor:pointer}
  .q-paste-row:hover{background:var(--panel-soft)}
  .q-paste-row input{margin-top:3px;flex-shrink:0}
  .q-paste-ctx{display:block;font-size:11px;font-weight:700;color:var(--ink-faint);text-transform:uppercase;letter-spacing:.4px}

  .q-dup{background:var(--amber-soft);border:1px solid var(--amber);border-radius:var(--radius-sm);padding:11px 13px;margin-top:11px}
  .q-dup-t{font-size:12.5px;font-weight:700;color:var(--amber);line-height:1.5}
  .q-dup-actions{display:flex;gap:7px;margin-top:9px;flex-wrap:wrap}
  .q-dup-actions .btn{font-size:11.5px;padding:5px 11px}
  .q-dup-row{border-top:1px dashed var(--amber);padding:8px 0 2px}
  .q-dup-new{font-size:12.5px;font-weight:600;color:var(--ink);line-height:1.5}
  .q-dup-old{font-size:11.5px;color:var(--amber);margin-top:3px;line-height:1.45}
  .q-dup-old a{color:var(--brand);font-weight:700;cursor:pointer;text-decoration:underline}
  .q-card-flash{animation:qflash 2.2s ease-out}
  @keyframes qflash{0%{background:var(--amber-soft);box-shadow:0 0 0 3px var(--amber)}100%{background:var(--panel);box-shadow:none}}

  /* AI question suggestions — reviewable, never auto-sent */
  .q-prop{background:var(--brand-soft);border:1px solid var(--brand-soft);border-radius:var(--radius);padding:12px 14px;margin-bottom:16px}
  .q-prop-head{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-bottom:9px}
  .q-prop-title{font-size:12.5px;font-weight:800;color:var(--brand-ink)}
  .q-prop-sub{font-size:11px;color:var(--grad-from)}
  .q-prop-empty{font-size:12.5px;color:var(--ink-soft);padding:6px 2px}
  .q-prop-card{background:var(--panel);border:1px solid var(--panel-line);border-radius:var(--radius-sm);padding:11px 13px;margin-bottom:9px}
  .q-prop-card:last-child{margin-bottom:0}
  .q-prop-card-head{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-bottom:6px}
  .q-prop-quote{font-size:12px;color:var(--ink-soft);font-style:italic;background:var(--panel-soft);border-radius:7px;padding:7px 10px;margin-top:7px;line-height:1.5}
  .q-prop-warn{font-size:11.5px;color:var(--amber);background:var(--amber-soft);border-radius:7px;padding:6px 9px;margin-top:7px;line-height:1.45}

  /* ── Q&A round: stale banner + impact report ── */
  .qa-stale{margin:14px;border:1px solid var(--amber);background:var(--amber-soft);border-radius:var(--radius-sm);padding:13px 14px;display:flex;gap:12px;align-items:center}
  .qa-stale-t{font-size:12.5px;font-weight:800;color:var(--amber)}
  .qa-stale-s{font-size:11.5px;color:var(--amber);line-height:1.45;margin-top:2px}
  .qa-rep{margin:14px;border:1px solid var(--panel-line);background:var(--panel);border-radius:var(--radius-sm);overflow:hidden}
  .qa-rep-head{padding:12px 14px;display:flex;align-items:center;gap:8px;cursor:pointer;user-select:none}
  .qa-rep-head:hover{background:var(--panel-soft)}
  .qa-rep.open .qa-rep-head{border-bottom:1px solid var(--panel-line)}
  .qa-rep-chev{flex-shrink:0;color:var(--ink-faint);transition:transform .18s}
  .qa-rep.open .qa-rep-chev{transform:rotate(90deg)}
  .qa-rep-sum{font-size:11.5px;color:var(--ink-soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .qa-rep-body{display:none}
  .qa-rep.open .qa-rep-body{display:block}
  .qa-rep-more{font-size:11.5px;font-weight:700;color:var(--brand);cursor:pointer;padding:6px 0 2px}
  .qa-rep-more:hover{text-decoration:underline}
  .qa-rep-title{font-size:12.5px;font-weight:800;color:var(--ink)}
  .qa-rep-when{font-size:11px;color:var(--ink-faint);margin-left:auto}
  .qa-rep-sec{padding:11px 14px;border-bottom:1px solid var(--panel-line)}
  .qa-rep-sec:last-child{border-bottom:0}
  .qa-rep-lbl{font-size:10.5px;font-weight:800;color:var(--ink-faint);letter-spacing:.6px;text-transform:uppercase;margin-bottom:6px}
  .qa-rep-li{font-size:12.5px;color:var(--ink);line-height:1.5;padding:4px 0 4px 14px;position:relative}
  .qa-rep-li:before{content:'';position:absolute;left:2px;top:11px;width:5px;height:5px;border-radius:50%;background:var(--ink-faint)}
  .qa-rep-li .d{display:block;font-size:11.5px;color:var(--ink-soft);margin-top:1px}
  .qa-rep-li.warn:before{background:var(--red)}
  .qa-rep-li.good:before{background:var(--green)}
  .qa-hi{display:inline-block;font-size:10px;font-weight:800;padding:1px 6px;border-radius:20px;background:var(--amber-soft);color:var(--amber);margin-left:6px}
  .qa-rep-none{padding:14px;font-size:12.5px;color:var(--ink-soft)}

  /* File-type badges are outlined, not filled: a column of saturated blocks in
     a long document list outshouts the filenames next to it. The hue carries
     the type via the border and the label instead. */
  .fi{width:38px;height:38px;border-radius:var(--radius-sm);display:grid;place-items:center;font-size:11px;font-weight:800;flex-shrink:0;background:transparent;border:1.5px solid currentColor;color:var(--ink-soft)}
  /* Each hue is darkened from its filled counterpart: as label text on white it
     has to carry the contrast the white-on-colour fill used to provide. */
  .fi.pdf{color:var(--red-ink)}.fi.doc,.fi.docx{color:var(--brand-ink)}.fi.xls,.fi.xlsx{color:var(--green)}.fi.zip{color:var(--violet)}.fi.other{color:var(--ink-soft)}

  /* ── Progress bar ── */
  .bar{height:5px;border-radius:4px;background:var(--surface-sunk);overflow:hidden;width:90px;flex-shrink:0}
  .bar i{display:block;height:100%;background:linear-gradient(90deg,var(--brand),var(--teal));border-radius:4px;transition:width .4s ease}

  /* ── Intake card ── */
  .intake-card{background:var(--panel);border:1px solid var(--panel-line);border-radius:var(--radius);box-shadow:var(--shadow);display:grid;grid-template-columns:1fr 1px 1fr;overflow:hidden;margin-bottom:20px}
  .intake-panel{padding:26px 28px}
  .intake-divider{background:var(--panel-line)}
  @media(max-width:720px){.intake-card{grid-template-columns:1fr}.intake-divider{height:1px}}
  .panel-head{display:flex;align-items:flex-start;gap:10px;margin-bottom:18px}
  .panel-icon{width:30px;height:30px;border-radius:var(--radius-sm);display:grid;place-items:center;flex-shrink:0}
  .panel-icon.blue{background:var(--brand-soft)}.panel-icon.teal{background:var(--teal-soft)}
  .panel-title{font-size:14px;font-weight:700;color:var(--ink);line-height:1.3}
  .panel-sub{font-size:12px;color:var(--ink-soft);margin-top:2px}
  .url-row{display:flex;gap:8px}
  .url-input{flex:1;height:38px;padding:0 12px;border:1px solid var(--panel-line);border-radius:var(--radius-sm);font-size:13px;font-family:var(--font);color:var(--ink);background:var(--panel-soft);outline:none;transition:border-color .15s,box-shadow .15s}
  .url-input::placeholder{color:var(--ink-faint)}
  .url-input:focus{border-color:var(--brand);box-shadow:var(--focus-ring);background:var(--panel)}
  .hint-text{font-size:11.5px;color:var(--ink-faint);margin-top:11px;line-height:1.6}
  .status{display:none;align-items:center;gap:10px;margin-top:12px;font-size:13px;padding:10px 14px;border-radius:var(--radius-sm)}
  .status.loading{display:flex;background:var(--brand-soft);color:var(--brand)}
  .status.ok{display:flex;background:var(--green-soft);color:var(--green)}
  .status.err{display:flex;background:var(--red-soft);color:var(--red)}
  .spinner{width:14px;height:14px;border:2px solid currentColor;border-top-color:transparent;border-radius:50%;animation:spin .7s linear infinite;flex-shrink:0}
  @keyframes spin{to{transform:rotate(360deg)}}
  @media(prefers-reduced-motion:reduce){.spinner{animation:none;opacity:.4}}
  .field{margin-bottom:12px}
  .field label{display:block;font-size:11px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;color:var(--ink-soft);margin-bottom:5px}
  .field input,.field textarea{width:100%;padding:8px 11px;border:1px solid var(--panel-line);border-radius:var(--radius-sm);font-size:13px;font-family:var(--font);color:var(--ink);background:var(--panel-soft);outline:none;transition:border-color .15s,box-shadow .15s}
  .field input:focus,.field textarea:focus{border-color:var(--brand);box-shadow:var(--focus-ring);background:var(--panel)}
  .field textarea{resize:vertical;min-height:66px}
  .field-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}

  /* ── Results card ── */
  .results-card{background:var(--panel);border:1px solid var(--panel-line);border-radius:var(--radius);box-shadow:var(--shadow);margin-bottom:20px;overflow:hidden}
  .results-head{padding:18px 22px 14px;border-bottom:1px solid var(--panel-line);display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
  .results-title{font-size:15px;font-weight:700;letter-spacing:-.2px}
  .results-meta{font-size:12px;color:var(--ink-soft);margin-top:3px;line-height:1.7}
  .badge{font-size:11px;font-weight:700;padding:3px 10px;border-radius:20px;flex-shrink:0;margin-top:3px}
  .badge-brand{background:var(--brand-soft);color:var(--brand-ink)}
  .badge-ok{background:var(--green-soft);color:var(--green)}
  .cpv-row{padding:9px 22px;background:var(--panel-soft);border-bottom:1px solid var(--panel-line);display:flex;gap:6px;flex-wrap:wrap}
  .cpv-chip{font-size:11px;font-weight:600;padding:2px 9px;border-radius:20px;background:var(--brand-soft);color:var(--brand-ink);font-variant-numeric:tabular-nums}
  .files-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr))}
  .file-card{display:flex;align-items:flex-start;gap:12px;padding:13px 18px;border-right:1px solid var(--panel-line);border-bottom:1px solid var(--panel-line);transition:background .1s}
  .file-card:hover{background:var(--panel-soft)}
  .file-info{min-width:0}
  .file-name{font-size:12.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .file-meta{font-size:11px;color:var(--ink-faint);margin-top:4px;display:flex;flex-wrap:wrap;gap:5px;align-items:center;font-variant-numeric:tabular-nums}
  .results-foot{padding:10px 22px;font-size:11px;color:var(--ink-faint);display:flex;align-items:center;gap:7px;border-top:1px solid var(--panel-line)}
  .dir-path{font-family:ui-monospace,'Cascadia Code','SF Mono',Consolas,monospace;font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

  /* ── History table ── */
  .history-card{background:var(--panel);border:1px solid var(--panel-line);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}
  .tbl-wrap{overflow-x:auto}
  table{width:100%;border-collapse:collapse;font-size:12.5px}
  th{text-align:left;color:var(--ink-soft);font-weight:700;font-size:11px;text-transform:uppercase;letter-spacing:.4px;padding:10px 14px;border-bottom:1px solid var(--panel-line)}
  td{padding:12px 14px;border-bottom:1px solid var(--panel-line);vertical-align:middle}
  tr:last-child td{border-bottom:0}
  tr.clickable{cursor:pointer}
  tr.clickable:hover td{background:var(--panel-soft)}
  tr.clickable:hover .open-hint{opacity:1}
  .open-hint{font-size:10.5px;color:var(--brand);font-weight:600;opacity:0;transition:opacity .15s;margin-left:6px}
  .td-title b{font-weight:700;display:block;line-height:1.35}
  .td-title .tid{font-size:11px;color:var(--ink-faint);margin-top:2px;font-family:ui-monospace,'SF Mono',Consolas,monospace}
  .td-title .tid a{color:var(--brand);text-decoration:none}
  .td-title .tid a:hover{text-decoration:underline}

  /* ── Analyse & Build lock ── */

  /* ── Documents & AI view ── */
  .docs-ai-layout{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:start}
  @media(max-width:860px){.docs-ai-layout{grid-template-columns:1fr}}
  .docs-panel,.findings-panel{background:var(--panel);border:1px solid var(--panel-line);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}
  .docs-panel-head{padding:16px 20px;border-bottom:1px solid var(--panel-line);display:flex;align-items:center;justify-content:space-between;gap:12px}
  .docs-panel-title{font-size:15px;font-weight:700;letter-spacing:-.2px}
  .file-item{display:flex;align-items:flex-start;gap:14px;padding:14px 20px;border-bottom:1px solid var(--panel-line);transition:background .1s}
  .file-item:last-child{border-bottom:none}
  .file-item:hover{background:var(--panel-soft)}
  .file-item-body{flex:1;min-width:0}
  .file-item-name{font-size:13px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .file-item-sub{font-size:11.5px;color:var(--ink-soft);margin-top:3px;line-height:1.5}
  .file-item-badge{flex-shrink:0;padding-top:2px}
  .badge-done{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:700;padding:4px 10px;border-radius:var(--radius-sm);background:var(--green-soft);color:var(--green)}
  .badge-analysing{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:700;padding:4px 10px;border-radius:var(--radius-sm);background:var(--amber-soft);color:var(--amber)}
  .badge-pending-file{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:700;padding:4px 10px;border-radius:var(--radius-sm);background:var(--surface-sunk);color:var(--ink-faint)}
  .findings-panel-head{padding:16px 20px;border-bottom:1px solid var(--panel-line)}
  .findings-panel-title{font-size:15px;font-weight:700;letter-spacing:-.2px}
  .finding-item{display:flex;align-items:flex-start;gap:14px;padding:14px 20px;border-bottom:1px solid var(--panel-line)}
  .finding-item:last-child{border-bottom:none}
  .finding-num{width:34px;height:34px;border-radius:50%;background:var(--brand-soft);color:var(--brand);font-weight:800;font-size:15px;display:grid;place-items:center;flex-shrink:0}
  .finding-num.dim{background:var(--surface-sunk);color:var(--ink-faint)}
  .finding-title{font-size:13.5px;font-weight:700;margin-bottom:3px}
  .finding-title.dim{color:var(--ink-soft)}
  .finding-sub{font-size:12px;color:var(--ink-soft);line-height:1.55}
  .finding-run-cta{padding:16px 20px 20px;border-top:1px solid var(--panel-line)}
  .empty-docs{padding:50px 20px;text-align:center;color:var(--ink-faint);font-size:13px}
  .empty-docs svg{margin:0 auto 12px;display:block;opacity:.35}

  /* Agent progress steps */
  /* No horizontal padding of its own — it inherits the gutter of whatever
     container it sits in, so the heading above it and the rows line up. */
  .agent-steps{padding:14px 0;display:flex;flex-direction:column;gap:0}
  .agent-step{display:flex;align-items:flex-start;gap:12px;padding:11px 0;border-bottom:1px solid var(--panel-line)}
  .agent-step:last-child{border-bottom:none}
  .step-indicator{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;flex-shrink:0;margin-top:1px;font-size:11px;font-weight:700;transition:background .3s,color .3s}
  .step-indicator.waiting{background:var(--surface-sunk);color:var(--ink-faint)}
  .step-indicator.running{background:var(--brand-soft);color:var(--brand)}
  .step-indicator.done{background:var(--green-soft);color:var(--green)}
  .step-label{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;margin-bottom:2px}
  .step-label.waiting{color:var(--ink-faint)}
  .step-label.running{color:var(--brand)}
  .step-label.done{color:var(--green)}
  .step-desc{font-size:12px;color:var(--ink-soft);line-height:1.5}

  /* AI result sections */
  .ai-result-section{padding:14px 20px;border-bottom:1px solid var(--panel-line)}
  .ai-result-section:last-child{border-bottom:none}
  .ai-agent-badge{display:inline-flex;align-items:center;gap:5px;font-size:10.5px;font-weight:700;padding:2px 9px;border-radius:20px;background:var(--violet-soft);color:var(--violet);margin-bottom:8px;letter-spacing:.2px}
  .ai-result-title{font-size:13.5px;font-weight:700;color:var(--ink);margin-bottom:6px}
  .ai-result-body{font-size:12.5px;color:var(--ink-soft);line-height:1.65}
  .fit-bar-wrap{display:flex;align-items:center;gap:10px;margin:8px 0}
  .fit-bar-track{flex:1;height:8px;border-radius:4px;background:var(--surface-sunk);overflow:hidden}
  .fit-bar-fill{height:100%;border-radius:4px;transition:width .6s ease}
  .fit-score-num{font-size:15px;font-weight:800;flex-shrink:0;font-variant-numeric:tabular-nums;min-width:42px}
  .req-pill{display:inline-flex;align-items:center;gap:4px;font-size:11.5px;font-weight:600;padding:3px 9px;border-radius:6px;margin:3px 4px 3px 0}
  .req-mandatory{background:var(--red-soft);color:var(--red)}
  .req-desirable{background:var(--teal-soft);color:var(--teal)}
  .req-list{margin-top:8px;display:flex;flex-direction:column;gap:6px;max-height:360px;overflow-y:auto;padding-right:4px;scrollbar-width:thin;scrollbar-color:var(--panel-line) transparent}
  .req-row{font-size:12px;color:var(--ink);background:var(--panel-soft);border-radius:var(--radius-sm);padding:8px 10px;line-height:1.5;border-left:3px solid transparent}
  .req-row.mandatory{border-left-color:var(--red)}
  .req-row.desirable{border-left-color:var(--teal)}
  .deadline-list{margin-top:6px;display:flex;flex-direction:column;gap:5px}
  /* Compliance Matrix ID cell tooltip */
  .req-id-cell{position:relative;display:inline-flex;align-items:center;gap:0;cursor:default}
  .req-id-label{font-size:12px;font-weight:700;color:var(--brand);white-space:nowrap}
  .req-id-tooltip{
    display:none;position:absolute;bottom:calc(100% + 6px);left:50%;transform:translateX(-50%);
    background:var(--ink);color:var(--on-accent);font-size:11px;font-weight:500;white-space:nowrap;
    padding:5px 10px;border-radius:7px;z-index:200;pointer-events:none;
    box-shadow:var(--shadow-raised);gap:6px;align-items:center;
  }
  .req-id-tooltip::after{content:'';position:absolute;top:100%;left:50%;transform:translateX(-50%);
    border:5px solid transparent;border-top-color:var(--ink)}
  .req-id-cell:hover .req-id-tooltip{display:flex;pointer-events:auto}
  .req-id-copy{background:rgba(255,255,255,.15);border:none;color:var(--on-accent);font-size:10px;padding:2px 7px;border-radius:4px;cursor:pointer;white-space:nowrap}
  .req-id-copy:hover{background:rgba(255,255,255,.3)}
  .deadline-row{display:flex;justify-content:space-between;align-items:baseline;font-size:12px;padding:5px 0;border-bottom:1px dashed var(--panel-line)}
  .deadline-row:last-child{border-bottom:none}
  .deadline-label{color:var(--ink-soft)}
  .deadline-date{font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums}
  .back-link{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--ink-soft);cursor:pointer;margin-bottom:18px;padding:4px 0;font-weight:600}
  .back-link:hover{color:var(--brand)}
  .meta-row{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:20px;align-items:center}
  .meta-chip{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;color:var(--ink-soft);font-weight:600}
  .meta-sep{color:var(--panel-line);font-size:14px}

  /* Spinner: hide when status is ok or error */
  .status.ok .spinner,.status.err .spinner{display:none}

  /* Auto-fetch divider row */
  .autofetch-row{display:flex;align-items:center;gap:12px;margin:14px 0 0}
  .autofetch-row .or-line{flex:1;height:1px;background:var(--panel-line)}
  .autofetch-row .or-text{font-size:11px;color:var(--ink-faint);font-weight:600;letter-spacing:.4px;text-transform:uppercase;white-space:nowrap}

  /* Ingestion progress banner */
  .ingest-banner{display:none;align-items:flex-start;gap:14px;border-radius:var(--radius);padding:16px 18px;margin-bottom:16px;border:1px solid}
  .ingest-banner.show{display:flex}
  .ingest-banner.processing{background:var(--brand-soft);border-color:var(--brand-soft)}
  .ingest-banner.done{background:var(--green-soft);border-color:var(--green-soft)}
  .ingest-banner.done .ingest-icon-wrap{background:var(--green-soft);color:var(--green)}
  .ingest-banner.processing .ingest-icon-wrap{background:var(--brand-soft);color:var(--brand-ink)}
  .ingest-icon-wrap{width:36px;height:36px;border-radius:var(--radius-sm);display:grid;place-items:center;flex-shrink:0}
  .ingest-body{flex:1;min-width:0}
  .ingest-title{font-size:13.5px;font-weight:700;margin-bottom:3px}
  .ingest-banner.processing .ingest-title{color:var(--brand-ink)}
  .ingest-banner.done .ingest-title{color:var(--green)}
  .ingest-sub{font-size:12px;line-height:1.6}
  .ingest-banner.processing .ingest-sub{color:var(--brand)}
  .ingest-banner.done .ingest-sub{color:var(--green)}
  .ingest-progress-row{display:flex;align-items:center;gap:10px;margin-top:10px}
  .ingest-bar-track{flex:1;height:6px;border-radius:4px;background:rgba(0,0,0,.08);overflow:hidden}
  .ingest-bar-fill{height:100%;border-radius:4px;transition:width .5s ease;background:linear-gradient(90deg,var(--brand),var(--teal))}
  .ingest-banner.done .ingest-bar-fill{background:var(--green)}
  .ingest-pct{font-size:11.5px;font-weight:700;font-variant-numeric:tabular-nums;flex-shrink:0;min-width:32px;text-align:right}
  .ingest-banner.processing .ingest-pct{color:var(--brand-ink)}
  .ingest-banner.done .ingest-pct{color:var(--green)}

  /* Modal */
  .modal-backdrop{position:fixed;inset:0;background:rgba(15,30,56,.45);display:flex;align-items:center;justify-content:center;z-index:200;backdrop-filter:blur(2px)}
  /* ── First-login tutorial (blocking modal tour) ── */
  .tour-overlay{position:fixed;inset:0;z-index:400;display:none;align-items:center;justify-content:center;background:rgba(15,30,56,.62);backdrop-filter:blur(3px)}
  .tour-overlay.open{display:flex}

  /* Blocking loader for slow navigations. Opening a tender reads its whole
     analysis payload, which can take several seconds — without feedback the
     click looks ignored and people click again, queueing another slow request. */
  .load-overlay{position:fixed;inset:0;z-index:380;display:none;align-items:center;justify-content:center;background:rgba(15,30,56,.34);backdrop-filter:blur(2px)}
  .load-overlay.open{display:flex}
  .load-card{display:flex;align-items:center;gap:13px;max-width:min(88vw,380px);padding:16px 22px;background:var(--panel);border:1px solid var(--panel-line);border-radius:var(--radius);box-shadow:var(--shadow-pop);font-size:13.5px;font-weight:600;color:var(--ink)}
  .load-card .spinner{width:18px;height:18px;border-width:2px;border-color:var(--panel-line);border-top-color:var(--brand)}
  /* Editable deadline cell in All Tenders */
  .td-deadline{font-size:12px;color:var(--ink-soft);white-space:nowrap;cursor:pointer}
  .td-deadline:hover{color:var(--brand)}
  .td-deadline-pen{margin-left:6px;opacity:0;font-size:10px;transition:opacity .15s}
  tr.clickable:hover .td-deadline-pen{opacity:.6}
  .td-deadline-edit{display:flex;align-items:center;gap:5px}
  .td-deadline-input{font-family:inherit;font-size:12px;color:var(--ink);background:var(--panel);border:1.5px solid var(--brand);border-radius:7px;padding:4px 7px}
  .td-deadline-input:focus{outline:none}
  .td-deadline-edit .btn{padding:3px 8px;font-size:11px;line-height:1.2}
  /* Which row is loading — the overlay says "something", the row says "this one" */
  tr.clickable.row-busy{cursor:progress}
  tr.clickable.row-busy td{background:var(--brand-soft)}
  tr.clickable.row-busy .open-hint{opacity:1}
  .tour-card{width:min(92vw,480px);background:var(--panel);border-radius:var(--radius-lg);box-shadow:var(--shadow-pop);overflow:hidden;animation:tour-in .22s ease}
  @keyframes tour-in{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:none}}
  .tour-head{background:linear-gradient(135deg,var(--brand-ink),var(--brand));color:var(--on-accent);padding:22px 24px}
  .tour-ic{font-size:30px;line-height:1;margin-bottom:10px}
  .tour-head h2{font-size:18px;font-weight:800;letter-spacing:-.2px;margin:0;text-wrap:balance}
  .tour-body{padding:20px 24px;font-size:14px;line-height:1.65;color:var(--ink-soft);min-height:88px}
  .tour-dots{display:flex;gap:6px;justify-content:center;padding:0 24px 4px;flex-wrap:wrap}
  .tour-dot{width:7px;height:7px;border-radius:50%;background:var(--panel-line);transition:background .2s}
  .tour-dot.on{background:var(--brand)}
  .tour-foot{display:flex;align-items:center;gap:10px;padding:16px 24px 22px}
  .tour-step-count{font-size:12px;color:var(--ink-faint);font-weight:600}
  .tour-foot .spacer{flex:1}
  .tour-btn{font-size:13px;font-weight:600;padding:9px 18px;border-radius:var(--radius-sm);cursor:pointer;border:1px solid var(--line);background:var(--panel);color:var(--ink)}
  .tour-btn:hover{background:var(--surface-sunk)}
  .tour-btn.primary{background:var(--brand);border-color:var(--brand);color:var(--on-accent)}
  .tour-btn.primary:hover{background:var(--brand-ink)}
  .tour-btn:disabled{opacity:.45;cursor:not-allowed}
  .tour-close{position:absolute;top:16px;right:18px;color:rgba(255,255,255,.85);background:none;border:none;font-size:22px;line-height:1;cursor:pointer}
  .tour-close:hover{color:var(--on-accent)}
  .modal-box{background:var(--panel);border-radius:var(--radius-lg);box-shadow:var(--shadow-pop);width:100%;max-width:460px;padding:28px;margin:16px}
  .modal-icon-row{display:flex;align-items:center;gap:12px;margin-bottom:16px}
  .modal-icon{width:40px;height:40px;border-radius:var(--radius-sm);background:var(--teal-soft);display:grid;place-items:center;flex-shrink:0}
  .modal-title{font-size:16px;font-weight:800;letter-spacing:-.2px;color:var(--ink)}
  .modal-sub{font-size:12.5px;color:var(--ink-soft);margin-top:3px}
  .modal-body{font-size:13px;color:var(--ink);line-height:1.7;margin-bottom:20px}
  .modal-body strong{color:var(--ink)}
  .modal-chips{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0 0}
  .modal-chip-kw{font-size:11.5px;font-weight:600;padding:3px 10px;border-radius:20px;background:var(--teal-soft);color:var(--teal)}
  .modal-chip-cpv{font-size:11.5px;font-weight:600;padding:3px 10px;border-radius:20px;background:var(--brand-soft);color:var(--brand-ink);font-variant-numeric:tabular-nums}
  .modal-foot{display:flex;gap:10px;justify-content:flex-end}
  /* ── Owner picker (multi-select over the organization's team) ── */
  .own-search{width:100%;border:1px solid var(--line);border-radius:var(--radius-sm);padding:9px 12px;font-size:13px;font-family:inherit;color:var(--ink);background:var(--panel);outline:none;margin-bottom:10px}
  .own-search:focus{border-color:var(--brand);box-shadow:var(--focus-ring)}
  .own-chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}
  .own-chip{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:700;padding:4px 8px 4px 4px;border-radius:20px;background:var(--brand-soft);color:var(--brand-ink)}
  .own-chip button{border:none;background:none;cursor:pointer;color:inherit;opacity:.65;font-size:13px;line-height:1;padding:0 2px}
  .own-chip button:hover{opacity:1}
  .own-list{max-height:260px;overflow-y:auto;border:1px solid var(--panel-line);border-radius:var(--radius-sm)}
  .own-row{display:flex;align-items:center;gap:10px;padding:9px 12px;cursor:pointer;border-bottom:1px solid var(--panel-line)}
  .own-row:last-child{border-bottom:none}
  .own-row:hover{background:var(--panel-soft)}
  .own-row.on{background:var(--brand-soft)}
  .own-row input{accent-color:var(--brand);width:15px;height:15px;flex-shrink:0;cursor:pointer}
  .own-av{width:28px;height:28px;border-radius:50%;background:var(--brand);color:var(--on-accent);font-size:11px;font-weight:800;display:grid;place-items:center;flex-shrink:0;letter-spacing:.2px}
  .own-name{font-size:13px;font-weight:600;color:var(--ink);line-height:1.3}
  .own-mail{font-size:11px;color:var(--ink-faint)}
  .own-role{margin-left:auto;font-size:10.5px;font-weight:700;color:var(--ink-faint);text-transform:uppercase;letter-spacing:.4px}
  .own-empty{padding:22px 12px;text-align:center;font-size:12.5px;color:var(--ink-faint)}
  /* Owner cell in the tenders table */
  .own-cell{display:flex;align-items:center;gap:4px;flex-wrap:wrap}
  .own-cell .own-av{width:24px;height:24px;font-size:10px}
  .own-more{font-size:11px;font-weight:700;color:var(--ink-soft)}
  .modal-warn{font-size:11.5px;color:var(--ink-soft);background:var(--panel-soft);border:1px solid var(--panel-line);border-radius:var(--radius-sm);padding:9px 12px;margin-bottom:18px;line-height:1.6}

  /* Delete button in table rows */
  .delete-btn{visibility:hidden;border:none;background:none;padding:5px 7px;border-radius:7px;cursor:pointer;color:var(--ink-faint);line-height:0;transition:background .1s,color .1s}
  tr.clickable:hover .delete-btn{visibility:visible}
  .delete-btn:hover{background:var(--red-soft);color:var(--red)}

  /* Toast */
  .toast{position:fixed;bottom:24px;right:24px;color:var(--on-accent);font-size:13px;font-weight:600;padding:12px 20px;border-radius:var(--radius-sm);box-shadow:var(--shadow-raised);transform:translateY(8px);opacity:0;transition:transform .25s,opacity .25s;pointer-events:none;z-index:100}
  .toast.show{transform:none;opacity:1}

  /* ── Analysis run progress ──
     Analysis can start from the workspace, Documents & AI or the compliance
     matrix, and gap analysis always follows it. The detailed agent steps render
     into the Documents & AI findings panel, which is off-screen for two of those
     three entry points — so this card reports both phases wherever the user is. */
  #run-progress{position:fixed;right:24px;bottom:84px;width:312px;background:var(--panel);border:1px solid var(--panel-line);border-radius:var(--radius);box-shadow:var(--shadow-pop);padding:14px 16px;z-index:120;display:none}
  #run-progress.show{display:block}
  .rp-head{display:flex;align-items:center;gap:9px;font-size:12.5px;font-weight:800;color:var(--ink);margin-bottom:6px}
  .rp-head .spinner{width:13px;height:13px;border-width:2px;flex-shrink:0;border-color:var(--panel-line);border-top-color:var(--brand)}
  .rp-close{margin-left:auto;border:none;background:none;cursor:pointer;color:var(--ink-faint);font-size:15px;line-height:1;padding:0 2px}
  .rp-close:hover{color:var(--ink)}
  .rp-phase{display:flex;align-items:flex-start;gap:9px;padding:5px 0}
  .rp-ic{width:18px;height:18px;border-radius:50%;display:grid;place-items:center;font-size:9.5px;font-weight:800;flex-shrink:0;background:var(--surface-sunk);color:var(--ink-faint);margin-top:1px}
  .rp-phase.running .rp-ic{background:var(--brand);color:var(--on-accent)}
  .rp-phase.done .rp-ic{background:var(--green);color:var(--on-accent)}
  .rp-phase.failed .rp-ic{background:var(--red);color:var(--on-accent)}
  .rp-label{font-size:12px;font-weight:700;color:var(--ink-faint)}
  .rp-phase.running .rp-label,.rp-phase.done .rp-label,.rp-phase.failed .rp-label{color:var(--ink)}
  .rp-sub{font-size:11px;color:var(--ink-faint);line-height:1.45;margin-top:1px}
  .rp-foot{font-size:11.5px;color:var(--ink-soft);margin-top:9px;border-top:1px solid var(--panel-line);padding-top:9px;line-height:1.5}
  .rp-foot.ok{color:var(--green)}
  .rp-foot.bad{color:var(--red)}
  .rp-link{color:var(--brand);font-weight:700;cursor:pointer}

  /* ── Published question round (Nota van Inlichtingen) ── */
  .aq-panel{border:1px solid var(--panel-line);border-radius:var(--radius);background:var(--panel);margin-bottom:18px;overflow:hidden}
  .aq-head{display:flex;align-items:center;gap:10px;padding:13px 16px;border-bottom:1px solid var(--panel-line);flex-wrap:wrap}
  .aq-title{font-size:13.5px;font-weight:800;color:var(--ink)}
  .aq-sub{font-size:11.5px;color:var(--ink-faint);line-height:1.5}
  .aq-actions{margin-left:auto;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
  .aq-search{border:1px solid var(--line);border-radius:var(--radius-sm);padding:6px 10px;font-size:12px;font-family:inherit;color:var(--ink);background:var(--panel);outline:none;min-width:180px}
  .aq-search:focus{border-color:var(--brand);box-shadow:var(--focus-ring)}
  .aq-round{border-bottom:1px solid var(--panel-line)}
  .aq-round:last-child{border-bottom:none}
  .aq-round-head{display:flex;align-items:center;gap:9px;padding:10px 16px;background:var(--panel-soft);cursor:pointer;user-select:none}
  .aq-round-t{font-size:12.5px;font-weight:800;color:var(--ink)}
  .aq-round-n{margin-left:auto;font-size:11px;font-weight:700;color:var(--ink-faint)}
  .aq-pair{padding:12px 16px;border-top:1px dashed var(--panel-line)}
  .aq-pair:first-child{border-top:none}
  .aq-q{font-size:12.5px;color:var(--ink);line-height:1.55;display:flex;gap:8px}
  .aq-num{flex-shrink:0;font-size:11px;font-weight:800;color:var(--ink-faint);min-width:26px;font-variant-numeric:tabular-nums}
  .aq-a{margin:7px 0 0 34px;padding:9px 12px;border-left:3px solid var(--brand);background:var(--brand-soft);border-radius:0 8px 8px 0;font-size:12.5px;color:var(--ink);line-height:1.55}
  .aq-a-lbl{font-size:10.5px;font-weight:800;text-transform:uppercase;letter-spacing:.4px;color:var(--brand-ink);display:block;margin-bottom:3px}
  .aq-meta{margin:6px 0 0 34px;display:flex;gap:7px;flex-wrap:wrap;align-items:center}
  .aq-tag{font-size:10.5px;font-weight:700;padding:2px 8px;border-radius:20px;background:var(--panel-soft);color:var(--ink-soft)}
  .aq-tag.ours{background:var(--green-soft);color:var(--green);cursor:pointer}
  .aq-link{font-size:11px;font-weight:700;color:var(--brand);cursor:pointer}
  .aq-empty{padding:22px 16px;text-align:center;font-size:12.5px;color:var(--ink-faint);line-height:1.6}
  .aq-stale{margin:0;padding:9px 16px;background:var(--amber-soft);border-bottom:1px solid var(--amber);font-size:11.5px;color:var(--amber)}

  /* ── Dashboard ─────────────────────────────────────────────────────────── */
  .kpi-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:22px}
  @media(max-width:940px){.kpi-grid{grid-template-columns:repeat(2,1fr)}}
  .kpi-card{background:var(--panel);border:1px solid var(--panel-line);border-radius:var(--radius);box-shadow:var(--shadow);padding:18px 20px}
  .kpi-label{font-size:10.5px;font-weight:700;color:var(--ink-faint);letter-spacing:.6px;text-transform:uppercase;margin-bottom:10px}
  .kpi-value{font-size:30px;font-weight:800;color:var(--ink);letter-spacing:-.5px;line-height:1;margin-bottom:8px;font-variant-numeric:tabular-nums}
  .kpi-trend{font-size:12px;font-weight:600;display:flex;align-items:center;gap:5px}
  .kpi-up{color:var(--green)}.kpi-down{color:var(--teal)}.kpi-neutral{color:var(--ink-soft)}

  /* ── Tender Workspace ──────────────────────────────────────────────────── */
  .ws-head{margin-bottom:20px}
  .ws-head h1{font-size:22px;font-weight:800;letter-spacing:-.3px;margin-bottom:5px;text-wrap:balance}
  .ws-head-sub{font-size:13px;color:var(--ink-soft);line-height:1.6}
  .ws-head-sub b{color:var(--ink);font-weight:600}
  .ws-kpi-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:20px}
  @media(max-width:900px){.ws-kpi-grid{grid-template-columns:repeat(2,1fr)}}
  .ws-kpi{background:var(--panel);border:1px solid var(--panel-line);border-radius:var(--radius);box-shadow:var(--shadow);padding:18px 20px}
  .ws-kpi-label{font-size:10.5px;font-weight:700;color:var(--ink-faint);letter-spacing:.6px;text-transform:uppercase;margin-bottom:10px}
  .ws-kpi-value{font-size:28px;font-weight:800;color:var(--ink);letter-spacing:-.5px;line-height:1;margin-bottom:7px;font-variant-numeric:tabular-nums}
  .ws-kpi-value.urgent{color:var(--red)}
  .ws-kpi-value.good{color:var(--green)}
  .ws-kpi-sub{font-size:12px;color:var(--ink-soft);line-height:1.4}
  .ws-kpi-sub strong{font-weight:700;color:var(--ink)}
  .ws-summary-card{background:var(--green-soft);border:1.5px solid var(--green-soft);border-radius:var(--radius);padding:22px 26px;margin-bottom:20px}
  .ws-sum-head{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;margin-bottom:16px}
  .ws-sum-title{font-size:15px;font-weight:800;color:var(--ink);display:flex;align-items:center;gap:8px}
  .ws-sum-lang{font-size:11px;font-weight:700;padding:3px 10px;border-radius:20px;background:var(--green-soft);color:var(--green)}
  .ws-sum-body{font-size:13.5px;color:var(--ink);line-height:1.75}
  .ws-sum-body b{font-weight:700}
  .ws-sum-section{margin-top:14px;padding-top:12px;border-top:1px solid var(--green-soft)}
  .ws-sum-section-lbl{font-size:12px;font-weight:700;color:var(--green);text-transform:uppercase;letter-spacing:.5px;margin-bottom:6px}
  .ws-verdict-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:14px;padding-top:12px;border-top:1px solid var(--green-soft)}
  .ws-verdict-lbl{font-size:12.5px;font-weight:700;color:var(--ink)}
  .ws-verdict-chip{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:700;padding:4px 12px;border-radius:20px;background:var(--green-soft);color:var(--green)}
  .ws-verdict-body{font-size:12.5px;color:var(--ink-soft);line-height:1.55;margin-top:4px}
  .ws-bottom{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:20px}
  @media(max-width:760px){.ws-bottom{grid-template-columns:1fr}}
  .ws-card{background:var(--panel);border:1px solid var(--panel-line);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}
  .ws-card-head{padding:13px 20px;border-bottom:1px solid var(--panel-line);display:flex;align-items:center;gap:8px}
  .ws-card-title{font-size:13.5px;font-weight:700;letter-spacing:-.1px}
  .ws-facts{width:100%;border-collapse:collapse}
  .ws-facts td{padding:9px 20px;font-size:12.5px;border-bottom:1px solid var(--panel-line);vertical-align:top;line-height:1.45}
  .ws-facts tr:last-child td{border-bottom:none}
  .ws-facts td:first-child{color:var(--ink-faint);width:44%;font-weight:500}
  .ws-facts td:last-child{color:var(--ink);font-weight:600}
  .ws-date-hl{background:var(--red-soft);color:var(--red);font-weight:700;padding:2px 9px;border-radius:6px;font-size:12px;display:inline-block}
  .ws-risk{display:flex;align-items:flex-start;gap:11px;padding:12px 20px;border-bottom:1px solid var(--panel-line)}
  .ws-risk:last-child{border-bottom:none}
  .ws-risk-badge{width:27px;height:27px;border-radius:7px;display:grid;place-items:center;flex-shrink:0;font-size:12px;font-weight:800}
  .ws-risk-badge.red{background:var(--red-soft);color:var(--red)}
  .ws-risk-badge.amber{background:var(--amber-soft);color:var(--amber)}
  .ws-risk-badge.blue{background:var(--brand-soft);color:var(--brand)}
  .ws-risk-title{font-size:12.5px;font-weight:700;color:var(--ink);line-height:1.4;margin-bottom:2px}
  .ws-risk-sub{font-size:11px;color:var(--ink-soft);line-height:1.4}
  .ws-actions{display:flex;gap:10px;flex-wrap:wrap;padding-bottom:30px}
  .ws-no-ai{background:var(--panel);border:1px solid var(--panel-line);border-radius:var(--radius);padding:30px 24px;text-align:center;margin-bottom:20px}
  .ws-no-ai p{color:var(--ink-soft);font-size:13.5px;margin-bottom:14px}
  /* Intake success notification */
  #intake-success-notif{display:flex;align-items:center;gap:16px;background:var(--green-soft);border:1.5px solid var(--green-soft);border-radius:var(--radius);padding:16px 20px;margin-top:20px;position:relative}
  .intake-notif-icon{width:38px;height:38px;border-radius:50%;background:var(--green-soft);color:var(--green);display:grid;place-items:center;flex-shrink:0}
  .intake-notif-body{flex:1;min-width:0}
  .intake-notif-title{font-size:14px;font-weight:700;color:var(--green)}
  .intake-notif-sub{font-size:12px;color:var(--ink-soft);margin-top:2px}
  .intake-notif-actions{display:flex;gap:8px;flex-shrink:0}
  .intake-notif-close{background:none;border:none;cursor:pointer;color:var(--ink-faint);padding:4px;border-radius:6px;display:grid;place-items:center;flex-shrink:0}
  .intake-notif-close:hover{background:rgba(0,0,0,.06);color:var(--ink)}
  /* Requirement detail side panel */
  .req-panel-overlay{position:fixed;inset:0;background:rgba(15,30,56,.32);z-index:200;opacity:0;pointer-events:none;transition:opacity .2s}
  .req-panel-overlay.open{opacity:1;pointer-events:all}
  /* A distinct edge, not just a shadow. Panel and page are both light
     surfaces, so with the page still visible beside it the form read as part
     of the document rather than as a sheet over it — and the page's own
     scrollbar, flush against this edge, looked like the panel's. */
  .req-panel{position:fixed;top:0;right:0;bottom:0;width:480px;max-width:96vw;background:var(--panel);border-left:1px solid var(--panel-line);box-shadow:-14px 0 48px rgba(0,0,0,.22);z-index:201;display:flex;flex-direction:column;transform:translateX(100%);transition:transform .22s cubic-bezier(.4,0,.2,1)}
  .req-panel.open{transform:none}
  .req-panel-head{display:flex;align-items:flex-start;gap:12px;padding:20px 22px 16px;border-bottom:1px solid var(--panel-line);flex-shrink:0;background:var(--panel)}
  .req-panel-head-text{flex:1;min-width:0}
  .req-panel-id{font-size:11px;font-weight:700;color:var(--ink-faint);letter-spacing:.6px;text-transform:uppercase;margin-bottom:4px}
  .req-panel-content{font-size:14px;font-weight:600;color:var(--ink);line-height:1.5}
  .req-panel-chips{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
  .req-panel-close{background:none;border:none;cursor:pointer;color:var(--ink-faint);padding:4px;border-radius:6px;display:grid;place-items:center;flex-shrink:0}
  .req-panel-close:hover{background:var(--panel-soft);color:var(--ink)}
  .req-panel-body{flex:1;overflow-y:auto;padding:20px 22px;background:var(--surface-page)}
  .req-panel-section{margin-bottom:20px}

  /* "From your own documents" — evidence the organisation already owns,
     offered on the requirement that needs it. The quote carries the row: a
     filename alone gives a reader no way to judge whether it answers this. */
  .rp-reuse{display:flex;gap:12px;align-items:flex-start;padding:11px 13px;margin-bottom:8px;
    background:var(--panel);border:1px solid var(--panel-line);border-radius:var(--radius-sm)}
  .rp-reuse-main{flex:1;min-width:0}
  .rp-reuse-title{font-size:12.5px;font-weight:700;color:var(--ink);word-break:break-word}
  .rp-reuse-from{font-size:11px;color:var(--ink-faint);margin-top:2px}
  .rp-reuse-quote{font-size:11.5px;color:var(--ink-soft);font-style:italic;line-height:1.5;margin-top:6px}
  .rp-reuse-act{flex:none;display:flex;align-items:center}
  .rp-reuse-btn{min-height:26px;padding:3px 11px;font-size:11.5px;font-weight:700;white-space:nowrap}
  .rp-reuse-linked{font-size:11px;font-weight:700;color:var(--green);white-space:nowrap}
  .rp-reuse-loading,.rp-reuse-empty{font-size:12px;color:var(--ink-faint);padding:4px 0}
  .req-panel-section-lbl{font-size:10.5px;font-weight:700;color:var(--ink-faint);letter-spacing:.6px;text-transform:uppercase;margin-bottom:8px}
  .req-panel-answer{font-size:13.5px;color:var(--ink);line-height:1.65;background:var(--panel-soft);border:1px solid var(--panel-line);border-radius:var(--radius-sm);padding:14px 16px;white-space:pre-wrap;word-break:break-word}
  .req-panel-answer.editing{display:none}
  .req-panel-textarea{width:100%;min-height:160px;font-size:13.5px;color:var(--ink);line-height:1.65;background:var(--panel);border:1.5px solid var(--brand);border-radius:var(--radius-sm);padding:12px 14px;resize:vertical;box-sizing:border-box;font-family:inherit;display:none}
  .req-panel-textarea.editing{display:block}
  .req-panel-foot{display:flex;gap:8px;padding:14px 22px;border-top:1px solid var(--panel-line);background:var(--panel);flex-shrink:0}
  /* Human Input view */
  .hi-card{background:var(--panel);border:1px solid var(--panel-line);border-radius:var(--radius);margin-bottom:14px;overflow:hidden}
  .hi-card-head{padding:16px 20px 12px;border-bottom:1px solid var(--panel-line)}
  .hi-card-req{font-size:13.5px;font-weight:600;color:var(--ink);line-height:1.5;margin-bottom:8px}
  .hi-card-prompt{font-size:12.5px;color:var(--brand);font-style:italic;display:flex;align-items:flex-start;gap:8px}
  .hi-card-body{padding:14px 20px}
  .hi-card-textarea{width:100%;min-height:100px;font-size:13px;line-height:1.6;color:var(--ink);border:1.5px solid var(--panel-line);border-radius:var(--radius-sm);padding:10px 12px;resize:vertical;box-sizing:border-box;font-family:inherit;transition:border-color .15s}
  .hi-card-textarea:focus{border-color:var(--brand);outline:none}
  .hi-card-foot{display:flex;align-items:center;gap:10px;margin-top:10px}
  .hi-card.submitted .hi-card-body{background:var(--green-soft)}
  .hi-empty{text-align:center;padding:50px 20px;color:var(--ink-faint)}
  .hi-empty svg{display:block;margin:0 auto 14px;opacity:.35}
  /* Human input request cards */
  .hiq-card{display:flex;gap:14px;background:var(--panel);border:1px solid var(--panel-line);border-radius:var(--radius);padding:18px 20px;margin-bottom:14px;align-items:flex-start;transition:outline-color .2s}
  .hiq-card.answered{border-color:var(--green-soft);background:var(--green-soft)}
  /* An answered card the last analysis disagreed with. It is still an answer,
     so it keeps the answered layout — but not the green, which would read as
     "done" directly under a header saying it needs re-checking. */
  .hiq-card.answered.review{border-color:var(--amber);background:var(--amber-soft)}
  .hiq-ic{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:15px;flex-shrink:0}
  .hiq-ic.open{background:var(--red-soft);color:var(--red-ink)}
  .hiq-ic.progress{background:var(--amber-soft);color:var(--amber)}
  .hiq-ic.answered{background:var(--green-soft);color:var(--green)}
  .hiq-main{flex:1;min-width:0}
  .hiq-q{font-size:15px;font-weight:700;color:var(--ink);line-height:1.45;margin-bottom:6px}
  .hiq-meta{font-size:12.5px;color:var(--ink-soft);line-height:1.55;margin-bottom:10px}
  .hiq-meta strong{color:var(--ink)}
  .hiq-chips{display:flex;gap:8px;flex-wrap:wrap}
  .hiq-chip{display:inline-flex;align-items:center;gap:5px;padding:3px 10px;border-radius:20px;font-size:11.5px;font-weight:700;white-space:nowrap}
  .hiq-btn-col{flex-shrink:0;padding-top:2px}
  .hiq-area{display:none;margin-top:14px;padding-top:14px;border-top:1px dashed var(--panel-line)}
  .hiq-area.open{display:block}
  .hiq-need{font-size:12.5px;font-style:italic;color:var(--brand);background:var(--brand-soft);border-left:3px solid var(--brand);border-radius:var(--radius-sm);padding:9px 12px;margin-bottom:10px;line-height:1.5}
  .hiq-answer-view{font-size:13px;color:var(--ink);line-height:1.6;background:var(--green-soft);border:1px solid var(--green-soft);border-radius:var(--radius-sm);padding:10px 14px;margin-bottom:10px;white-space:pre-wrap}
  /* Citation list — every generated line is source-linked */
  .rp-cite{display:flex;gap:10px;align-items:flex-start;padding:9px 12px;background:var(--panel-soft);border:1px solid var(--panel-line);border-radius:var(--radius-sm);margin-bottom:8px}
  .rp-cite:last-child{margin-bottom:0}
  .rp-cite-num{flex-shrink:0;width:18px;height:18px;border-radius:50%;background:var(--brand);color:var(--on-accent);font-size:10.5px;font-weight:800;display:flex;align-items:center;justify-content:center;margin-top:1px}
  .rp-cite-body{flex:1;min-width:0}
  .rp-cite-src{font-size:12px;font-weight:700;color:var(--ink);margin-bottom:2px;word-break:break-word}
  .rp-cite-quote{font-size:12px;color:var(--ink-soft);font-style:italic;line-height:1.5;word-break:break-word}
  /* Proposal drafting */
  .prop-grid{display:grid;grid-template-columns:300px minmax(0,1fr);gap:18px;align-items:start}
  @media (max-width:1100px){.prop-grid{grid-template-columns:1fr}}
  /* In-app document viewer (Documents & AI → uploaded documents) */
  .file-item.is-viewable{cursor:pointer}
  .file-item.is-viewable:focus-visible{outline:2px solid var(--brand);outline-offset:-2px}
  .file-item-open{flex-shrink:0;align-self:center;color:var(--ink-faint);opacity:0;transition:opacity .1s}
  .file-item.is-viewable:hover .file-item-open,
  .file-item.is-viewable:focus-visible .file-item-open{opacity:1}
  /* ── Preview of the submission package ──────────────────────────────────
     Two panes on purpose. The rail is the ZIP's manifest — the answer to "what
     are we actually sending" — and the stage is one file at a time. A single
     scrolling list of embedded documents would answer neither question. */
  .pkgv-overlay{display:none;position:fixed;inset:0;background:rgba(15,30,56,.6);z-index:365;padding:22px;overflow:hidden}
  .pkgv-shell{max-width:1340px;height:100%;margin:0 auto;display:flex;flex-direction:column}
  .pkgv-toolbar{display:flex;align-items:center;gap:10px;background:var(--panel);
    border:1px solid var(--panel-line);border-radius:var(--radius);padding:10px 14px;
    margin-bottom:12px;box-shadow:var(--shadow-raised);flex-shrink:0}
  .pkgv-toolbar-t{font-size:13px;font-weight:800;flex:1;min-width:0;color:var(--ink)}
  .pkgv-body{flex:1;min-height:0;display:flex;gap:12px}
  .pkgv-rail{width:330px;flex-shrink:0;overflow-y:auto;background:var(--panel);
    border:1px solid var(--panel-line);border-radius:var(--radius);padding:12px;
    box-shadow:var(--shadow-raised)}
  .pkgv-stage{flex:1;min-width:0;display:flex;flex-direction:column;overflow:hidden;
    background:var(--panel);border:1px solid var(--panel-line);border-radius:var(--radius);
    box-shadow:var(--shadow-raised)}

  /* What is required and will NOT be in the ZIP. First in the rail: it is the
     one thing the package itself cannot tell you, because a missing file is
     simply absent from it. */
  .pkgv-miss{background:var(--red-soft);border-radius:var(--radius-sm);padding:10px 12px;margin-bottom:14px}
  .pkgv-miss-t{font-size:11.5px;font-weight:800;color:var(--red);line-height:1.5;margin-bottom:5px}
  .pkgv-miss-r{font-size:11.5px;color:var(--red);line-height:1.6}
  .pkgv-miss-r span{font-size:10px;font-weight:800;opacity:.75}

  .pkgv-grp{margin-bottom:16px}
  .pkgv-grp-t{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.5px;
    color:var(--ink-faint);margin-bottom:7px}
  .pkgv-row{display:flex;gap:9px;align-items:flex-start;padding:8px 9px;border-radius:var(--radius-sm);
    cursor:pointer;border:1px solid transparent}
  .pkgv-row:hover{background:var(--surface-sunk)}
  .pkgv-row.active{background:var(--brand-soft);border-color:var(--brand)}
  .pkgv-ext{font-size:9px;font-weight:800;color:var(--on-accent);background:var(--brand);
    border-radius:4px;padding:3px 4px;min-width:32px;text-align:center;flex-shrink:0;margin-top:1px}
  .pkgv-row-b{min-width:0;display:flex;flex-direction:column;gap:1px}
  .pkgv-row-n{font-size:12px;font-weight:700;color:var(--ink);line-height:1.4;word-break:break-word}
  /* The name the authority will actually unpack. Monospace because it is a
     path, and it is regularly not the same as the label above it. */
  .pkgv-row-p{font-size:10.5px;font-family:var(--mono,ui-monospace,monospace);color:var(--ink-faint);
    line-height:1.45;word-break:break-all}
  .pkgv-row-m{font-size:10.5px;color:var(--ink-faint);line-height:1.45}

  .pkgv-naming{font-size:11px;line-height:1.6;color:var(--ink-soft);background:var(--panel-soft);
    border-radius:var(--radius-sm);padding:9px 11px;margin-top:6px}
  .pkgv-naming.warn{background:var(--amber-soft);color:var(--amber);margin-top:9px}
  .pkgv-naming b{color:var(--ink)}
  .pkgv-naming.warn b{color:inherit}

  .pkgv-head{padding:14px 18px;border-bottom:1px solid var(--panel-line);flex-shrink:0;background:var(--panel-soft)}
  .pkgv-head-n{font-size:14px;font-weight:800;color:var(--ink);line-height:1.4}
  .pkgv-head-p{font-size:11px;color:var(--ink-faint);margin-top:3px}
  .pkgv-head-p code{font-family:var(--mono,ui-monospace,monospace);font-size:10.5px}
  .pkgv-head-i{font-size:11.5px;color:var(--ink-soft);line-height:1.6;margin-top:6px;max-width:90ch}
  .pkgv-head-i b{color:var(--ink)}
  .pkgv-warn{font-size:11.5px;line-height:1.6;color:var(--amber);background:var(--amber-soft);
    border-radius:var(--radius-sm);padding:8px 11px;margin-top:8px;max-width:90ch}

  .pkgv-frame{flex:1;width:100%;border:0;min-height:0}
  .pkgv-img{flex:1;min-height:0;overflow:auto;display:flex;align-items:flex-start;
    justify-content:center;padding:18px;background:var(--surface-sunk)}
  .pkgv-img img{max-width:100%;height:auto;box-shadow:var(--shadow-raised)}
  .pkgv-state{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;
    padding:40px 24px;text-align:center;color:var(--ink-faint);font-size:13px;line-height:1.7}
  .pkgv-note{font-size:11.5px;line-height:1.6;color:var(--brand-ink);background:var(--brand-soft);
    padding:9px 18px;flex-shrink:0}
  .pkgv-text{flex:1;min-height:0;overflow:auto;padding:20px 24px;white-space:pre-wrap;
    font-size:12.5px;line-height:1.75;color:var(--ink);font-family:var(--mono,ui-monospace,monospace)}

  @media (max-width:1000px){
    .pkgv-body{flex-direction:column}
    .pkgv-rail{width:auto;max-height:38%}
  }

  .docv-overlay{display:none;position:fixed;inset:0;background:rgba(15,30,56,.55);z-index:360;padding:24px;overflow:hidden}
  .docv-shell{max-width:1100px;height:100%;margin:0 auto;display:flex;flex-direction:column}
  .docv-toolbar{display:flex;align-items:center;gap:10px;background:var(--panel);border:1px solid var(--panel-line);border-radius:var(--radius);padding:10px 14px;margin-bottom:12px;box-shadow:var(--shadow-raised);flex-shrink:0}
  .docv-title{font-size:13px;font-weight:800;flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .docv-meta{font-weight:500;color:var(--ink-faint)}
  .docv-stage{flex:1;min-height:0;background:var(--panel);border-radius:var(--radius);box-shadow:var(--shadow-pop);overflow:hidden;display:flex}
  .docv-stage iframe{width:100%;height:100%;border:0;display:block}
  .docv-stage img{margin:auto;max-width:100%;max-height:100%;object-fit:contain}
  .docv-text{width:100%;overflow:auto;padding:26px 30px;font-size:13px;line-height:1.75;color:var(--ink);white-space:pre-wrap;word-break:break-word;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
  .docv-note{display:flex;gap:9px;align-items:flex-start;background:var(--brand-soft);border-bottom:1px solid var(--panel-line);color:var(--brand-ink);font-size:11.5px;line-height:1.55;padding:9px 14px}
  .docv-state{margin:auto;text-align:center;color:var(--ink-faint);font-size:13px;padding:40px 20px}
  .preview-overlay{display:none;position:fixed;inset:0;background:rgba(15,30,56,.55);z-index:350;padding:24px;overflow:auto}
  .preview-shell{max-width:1040px;margin:0 auto}
  .preview-toolbar{position:sticky;top:0;z-index:2;display:flex;align-items:center;gap:10px;background:var(--panel);border:1px solid var(--panel-line);border-radius:var(--radius);padding:10px 14px;margin-bottom:14px;box-shadow:var(--shadow-raised)}
  .preview-toolbar-title{font-size:13px;font-weight:800;flex:1}
  .preview-paper{width:210mm;min-height:297mm;max-width:100%;box-sizing:border-box;margin:0 auto 30px;background:var(--panel);padding:24mm 22mm;box-shadow:var(--shadow-pop);color:var(--ink);font-family:Arial,sans-serif}
  .preview-cover{min-height:205mm;display:flex;flex-direction:column;justify-content:center;border-bottom:2px solid var(--ink-soft);margin-bottom:18mm;page-break-after:always}
  .preview-kicker{font-size:11px;text-transform:uppercase;letter-spacing:1.4px;color:var(--ink-soft);font-weight:700;margin-bottom:12px}
  .preview-title{font-size:30px;line-height:1.2;color:var(--ink);margin:0 0 12px}
  .preview-authority{font-size:16px;color:var(--ink-soft);margin-bottom:28px}
  .preview-meta{font-size:12px;line-height:1.8;color:var(--ink-soft)}
  .preview-section{margin:0 0 14mm;break-inside:avoid-page}
  .preview-section h2{font-size:20px;color:var(--ink);border-bottom:1px solid var(--panel-line);padding-bottom:7px;margin:0 0 12px}
  .preview-passage{margin:0 0 18px;break-inside:avoid-page}
  .preview-passage h3{font-size:13px;line-height:1.45;margin:0 0 7px;color:var(--ink-soft)}
  .preview-passage-text{font-size:12.5px;line-height:1.7;white-space:pre-wrap}
  .preview-placeholder{font-size:12px;line-height:1.6;padding:10px 12px;border-left:3px solid var(--amber);background:var(--amber-soft);color:var(--amber)}
  .preview-sources{font-size:10.5px;color:var(--ink-faint);margin-top:7px;padding-top:6px;border-top:1px solid var(--surface-sunk)}
  .preview-source{color:var(--brand-ink);text-decoration:underline;cursor:pointer}
  .preview-empty{font-size:12px;color:var(--ink-faint);font-style:italic}
  @media print{
    body.preview-printing > *:not(#proposal-preview-overlay){display:none!important}
    body.preview-printing #proposal-preview-overlay{display:block!important;position:static;background:var(--panel);padding:0;overflow:visible}
    body.preview-printing .preview-toolbar{display:none!important}
    body.preview-printing .preview-paper{box-shadow:none;margin:0;width:auto;max-width:none}
    /* Full bleed, because .preview-paper supplies its own 24mm/22mm padding.
       Named so it cannot override the default margin used by every other
       printable document in the app. */
    #proposal-preview-overlay{page:tiq-fullbleed}
  }
  @page tiq-fullbleed{size:A4;margin:0}
  .prop-main-card{background:var(--panel);border:1px solid var(--panel-line);border-radius:var(--radius);padding:18px 20px}
  .prop-chips{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:6px}
  .prop-actions{display:flex;gap:14px;justify-content:flex-end;margin-bottom:14px;font-size:12.5px;font-weight:700}
  .prop-actions a{color:var(--brand);cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:5px}
  .prop-actions a:hover{text-decoration:underline}
  .prop-passage{background:var(--panel);border:1px solid var(--panel-line);border-radius:var(--radius);padding:16px 18px;margin-bottom:14px;cursor:pointer;transition:background .15s,border-color .15s,box-shadow .15s}
  .prop-passage:active{background:var(--brand-soft)}
  .prop-passage.selected{border-color:var(--brand);background:var(--brand-soft);box-shadow:var(--focus-ring)}
  .prop-passage.selected.pop{animation:passage-pop .35s ease}
  @keyframes passage-pop{0%{background:var(--brand-soft);box-shadow:var(--focus-ring)}100%{background:var(--brand-soft);box-shadow:var(--focus-ring)}}
  .prop-passage.needs-input{border:1.5px solid var(--amber-soft);background:var(--amber-soft)}
  .prop-passage.blocked{border:1.5px solid var(--red-soft);background:var(--red-soft)}
  .prop-passage.needs-input.selected,.prop-passage.blocked.selected{border-color:var(--brand)}
  .prop-passage-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:9px}
  .prop-passage-title{font-size:14.5px;font-weight:800;color:var(--ink)}
  .prop-passage-body{font-size:13.5px;color:var(--ink);line-height:1.7;word-break:break-word}
  .prop-passage-body.pending-note{font-style:italic;color:var(--ink-soft)}
  .cite-mark{display:inline-flex;align-items:center;justify-content:center;background:var(--brand-soft);color:var(--brand-ink);font-size:10px;font-weight:800;border-radius:5px;padding:1px 5px;margin-left:4px;vertical-align:super;line-height:1.3;cursor:pointer;white-space:nowrap}
  .cite-mark:hover{background:var(--brand-soft)}
  .prop-rail-card{background:var(--panel);border:1px solid var(--panel-line);border-radius:var(--radius);padding:16px 18px;margin-bottom:16px}
  .prop-rail-title{font-size:13.5px;font-weight:800;color:var(--ink);margin-bottom:12px;display:flex;align-items:center;gap:7px}
  .prop-src{border:1px solid var(--panel-line);border-radius:var(--radius-sm);padding:10px 13px;margin-bottom:9px;transition:border-color .2s, box-shadow .2s}
  .prop-src.flash{border-color:var(--brand);box-shadow:var(--focus-ring)}
  .prop-src-name{font-size:12.5px;font-weight:700;color:var(--ink);margin-bottom:3px;word-break:break-word}
  .prop-src-sub{font-size:11.5px;color:var(--ink-faint);line-height:1.5;word-break:break-word}
  .prop-outline-item{display:flex;align-items:center;gap:8px;padding:8px 11px;border-radius:var(--radius-sm);font-size:13px;color:var(--ink-soft);cursor:pointer;margin-bottom:2px;transition:background .15s,transform .08s,box-shadow .15s;user-select:none}
  .prop-outline-item:hover{background:var(--panel-soft)}
  .prop-outline-item:active{transform:scale(.965);background:var(--brand-soft)}
  .prop-outline-item.current{background:var(--brand-soft);color:var(--brand);font-weight:700;border-left:3px solid var(--brand)}
  .prop-outline-item.just-clicked{animation:outline-pop .3s ease}
  @keyframes outline-pop{0%{background:var(--brand-soft);box-shadow:var(--focus-ring)}100%{background:var(--brand-soft);box-shadow:none}}
  .prop-outline-item .st{margin-left:auto;font-size:12px;flex-shrink:0}
  .prop-word-chip.over{background:var(--red-soft) !important;color:var(--red-ink) !important}
  .prop-word-chip.near{background:var(--amber-soft) !important;color:var(--amber) !important}
  .prop-cite-links{margin-top:10px;padding-top:10px;border-top:1px dashed var(--panel-line);display:flex;flex-direction:column;gap:6px}
  .prop-cite-link{display:inline-flex;align-items:flex-start;gap:7px;font-size:12px;color:var(--brand);cursor:pointer;font-weight:600;line-height:1.5}
  .prop-cite-link:hover span:first-of-type{text-decoration:underline}
  .prop-cite-link svg{flex-shrink:0;margin-top:2px}
  .prop-cite-ex{font-weight:400;color:var(--ink-faint);font-style:italic}
  .prop-passage.locked{opacity:.55;filter:grayscale(.35);pointer-events:none;user-select:none}
  .prop-move-sel{border:none;background:none;font-size:12px;font-weight:700;color:var(--brand);cursor:pointer;font-family:inherit;padding:0;max-width:110px}
  .prop-move-sel:focus{outline:none}
  .prop-outline-add{display:flex;align-items:center;gap:7px;padding:9px 11px;margin-top:6px;border:1.5px dashed var(--panel-line);border-radius:var(--radius-sm);font-size:12.5px;font-weight:700;color:var(--brand);cursor:pointer;justify-content:center;transition:border-color .15s,background .15s}
  .prop-outline-add:hover{border-color:var(--brand);background:var(--brand-soft)}
  .prop-outline-del{flex-shrink:0;display:none;color:var(--ink-faint);padding:2px;border-radius:5px;line-height:0}
  .prop-outline-item:hover .prop-outline-del{display:inline-flex}
  .prop-outline-del:hover{color:var(--red-ink);background:var(--red-soft)}
  .prop-sub-del{flex-shrink:0;color:var(--ink-faint);cursor:pointer;padding:3px;border-radius:6px;line-height:0;transition:color .12s,background .12s}
  .prop-sub-del:hover{color:var(--red-ink);background:var(--red-soft)}
  .prop-passage.excluded{background:var(--surface-sunk);border-color:var(--panel-line);opacity:.68}
  .prop-passage.excluded .prop-passage-title,.prop-passage.excluded .prop-passage-body{color:var(--ink-faint)}
  .prop-passage.excluded:hover{opacity:.82}
  .prop-sub-del.included-toggle{color:var(--ink-faint);background:var(--panel-line)}
  /* Workflow step bar */
  /* Chat with tender */
  .chat-panel-overlay{position:fixed;inset:0;background:rgba(15,30,56,.32);z-index:200;opacity:0;pointer-events:none;transition:opacity .2s}
  .chat-panel-overlay.open{opacity:1;pointer-events:all}
  .chat-panel{position:fixed;top:0;right:0;bottom:0;width:520px;max-width:96vw;background:var(--panel);box-shadow:-8px 0 40px rgba(0,0,0,.14);z-index:201;display:flex;flex-direction:column;transform:translateX(100%);transition:transform .22s cubic-bezier(.4,0,.2,1)}
  .chat-panel.open{transform:none}
  .chat-head{padding:18px 22px;border-bottom:1px solid var(--panel-line);display:flex;align-items:flex-start;gap:12px;flex-shrink:0}
  .chat-head-title{font-size:15px;font-weight:800;color:var(--ink)}
  .chat-head-sub{font-size:12px;color:var(--ink-faint);margin-top:3px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .chat-close{margin-left:auto;background:none;border:none;cursor:pointer;color:var(--ink-faint);font-size:20px;line-height:1;padding:2px;flex-shrink:0}
  .chat-msgs{flex:1;overflow-y:auto;padding:18px 22px;display:flex;flex-direction:column;gap:14px}
  .chat-bubble{max-width:88%;border-radius:var(--radius);padding:11px 15px;font-size:13.5px;line-height:1.6;word-break:break-word;white-space:pre-wrap}
  .chat-bubble.user{align-self:flex-end;background:var(--brand);color:var(--on-accent);border-bottom-right-radius:4px}
  .chat-bubble.assistant{align-self:flex-start;background:var(--panel-soft);border:1px solid var(--panel-line);color:var(--ink);border-bottom-left-radius:4px}
  .chat-meta{align-self:flex-start;max-width:88%;display:flex;flex-direction:column;gap:6px;margin-top:-6px}
  .chat-conf{display:inline-flex;align-items:center;gap:5px;padding:2px 9px;border-radius:20px;font-size:10.5px;font-weight:800;width:fit-content}
  .chat-cite{display:flex;gap:8px;align-items:flex-start;padding:7px 11px;background:var(--panel-soft);border:1px solid var(--panel-line);border-radius:var(--radius-sm);font-size:11.5px;line-height:1.5}
  .chat-cite a{color:var(--brand);font-weight:700;cursor:pointer;word-break:break-word}
  .chat-cite a:hover{text-decoration:underline}
  .chat-cite-q{color:var(--ink-faint);font-style:italic}
  /* Move to another tender without closing the panel — the chat is opened from
     the header now, so "which tender" is a thing you change mid-conversation. */
  .chat-switch{
    margin-top:6px;border:none;background:none;padding:0;cursor:pointer;font-family:inherit;
    font-size:11px;font-weight:700;color:var(--brand);text-align:left;
  }
  .chat-switch:hover{text-decoration:underline}
  /* Which of the four sources a citation came from. "The tender requires" and
     "we said this last time" are not the same claim, so they cannot look the
     same either. */
  .chat-cite-kind{
    display:inline-flex;align-items:center;flex-shrink:0;
    padding:1px 7px;border-radius:var(--radius-pill);
    font-size:9.5px;font-weight:800;letter-spacing:.3px;text-transform:uppercase;
  }
  .chat-cite-kind.k-tender{background:var(--brand-soft);color:var(--brand-ink)}
  .chat-cite-kind.k-human{background:var(--green-soft);color:var(--green)}
  .chat-cite-kind.k-past{background:var(--violet-soft);color:var(--violet)}
  .chat-cite-kind.k-ai{background:var(--amber-soft);color:var(--amber)}
  .chat-cite-origin{color:var(--ink-faint);font-weight:600}
  .chat-sources{
    display:flex;flex-wrap:wrap;gap:6px;align-items:center;
    font-size:10.5px;font-weight:700;color:var(--ink-faint);
  }
  /* Tender picker (header chat button). Above the chat panel, because it is
     also opened from inside it — "chat with a different tender" — and the
     shared .modal-backdrop layer sits below the panel. */
  #chat-picker{z-index:260}
  .tp-row{
    display:flex;align-items:center;gap:11px;width:100%;text-align:left;
    padding:10px 13px;cursor:pointer;border:none;border-bottom:1px solid var(--panel-line);
    background:none;font-family:inherit;
  }
  .tp-row:last-child{border-bottom:none}
  .tp-row:hover,.tp-row:focus-visible{background:var(--brand-soft)}
  .tp-row-main{min-width:0;flex:1}
  .tp-title{font-size:13px;font-weight:700;color:var(--ink);line-height:1.35;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .tp-meta{font-size:11px;color:var(--ink-faint);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .tp-count{flex-shrink:0;font-size:10.5px;font-weight:700;color:var(--ink-soft)}
  .chat-empty{margin:auto;text-align:center;color:var(--ink-faint);font-size:13px;line-height:1.7;padding:20px}
  .chat-input-row{padding:14px 18px;border-top:1px solid var(--panel-line);display:flex;gap:10px;align-items:flex-end;flex-shrink:0}
  .mention-dd{display:none;position:absolute;bottom:66px;left:18px;right:70px;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-sm);box-shadow:var(--shadow-raised);z-index:20;max-height:180px;overflow-y:auto}
  .mention-dd.open{display:block}
  .mention-item{padding:8px 14px;font-size:12.5px;cursor:pointer;display:flex;gap:8px;align-items:center}
  .mention-item:hover,.mention-item.sel{background:var(--brand-soft)}
  .mention-item b{color:var(--brand)}
  .mention-item small{color:var(--ink-faint)}
  .chat-author{font-size:10.5px;font-weight:700;color:var(--ink-faint);margin:2px 4px 3px auto;text-align:right}
  .chat-mention{background:var(--brand-soft);color:var(--brand-ink);border-radius:5px;padding:0 4px;font-weight:700}
  .chat-input{flex:1;min-height:44px;max-height:130px;resize:none;font-size:13.5px;line-height:1.5;color:var(--ink);border:1.5px solid var(--panel-line);border-radius:var(--radius-sm);padding:11px 14px;font-family:inherit;box-sizing:border-box}
  .chat-input:focus{border-color:var(--brand);outline:none}
  .chat-send{width:44px;height:44px;border-radius:var(--radius-sm);border:none;background:var(--brand);color:var(--on-accent);cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:opacity .15s}
  .chat-send:disabled{opacity:.5;cursor:not-allowed}
  /* Export & Submit */
  .exp-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:start}
  @media (max-width:1100px){.exp-grid{grid-template-columns:1fr}}
  .exp-card{background:var(--panel);border:1px solid var(--panel-line);border-radius:var(--radius);padding:20px 22px}
  .exp-card-title{font-size:15px;font-weight:800;color:var(--ink);padding-bottom:10px;border-bottom:1px solid var(--panel-line);margin-bottom:14px}
  .exp-gate{display:flex;gap:13px;align-items:flex-start;padding:12px 0;border-bottom:1px solid var(--panel-soft)}
  .exp-gate:last-child{border-bottom:none}
  .exp-gate-ic{width:38px;height:38px;border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:800;flex-shrink:0}
  .exp-gate-ic.done{background:var(--green);color:var(--on-accent)}
  .exp-gate-ic.pending{background:var(--amber);color:var(--on-accent)}
  .exp-gate-ic.blocked{background:var(--panel-line);color:var(--ink-faint)}
  .exp-gate-main{flex:1;min-width:0}
  .exp-gate-name{font-size:14px;font-weight:800;color:var(--ink)}
  .exp-gate-sub{font-size:12px;color:var(--ink-faint);margin-top:2px;line-height:1.5}
  .exp-gate-letter{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:7px;font-size:12px}
  .exp-gate-letter a{color:var(--brand);font-weight:700;cursor:pointer}
  .exp-gate-letter a:hover{text-decoration:underline}
  .exp-chip{padding:4px 12px;border-radius:20px;font-size:11.5px;font-weight:800;flex-shrink:0;cursor:pointer;user-select:none}
  .exp-chip.done{background:var(--green-soft);color:var(--green)}
  .exp-chip.pending{background:var(--amber-soft);color:var(--amber)}
  .exp-chip.blocked{background:var(--surface-sunk);color:var(--ink-faint);cursor:not-allowed}
  .exp-file{display:flex;gap:13px;align-items:center;padding:12px 0;border-bottom:1px solid var(--panel-soft)}
  .exp-file:last-child{border-bottom:none}
  /* The badge fill is a semantic token, which is dark in light mode and
     BRIGHT in dark mode — white on #3FBF93 is 2.31:1. color-contrast is not
     shipping yet, so the label colour follows the theme instead of the fill. */
  .exp-file-badge{width:42px;height:38px;border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;font-size:10.5px;font-weight:800;color:var(--on-accent);flex-shrink:0;letter-spacing:.4px}
  :root[data-theme="dark"] .exp-file-badge{color:var(--surface-page)}
  @media (prefers-color-scheme:dark){
    :root:not([data-theme="light"]) .exp-file-badge{color:var(--surface-page)}
  }
  .exp-file-main{flex:1;min-width:0}
  .exp-file-name{font-size:13.5px;font-weight:800;color:var(--ink)}
  .exp-file-sub{font-size:11.5px;color:var(--ink-faint);margin-top:2px;line-height:1.45}
  .exp-dl{width:36px;height:36px;border-radius:var(--radius-sm);border:1px solid var(--panel-line);background:var(--panel);display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--ink-soft);flex-shrink:0;transition:background .12s,color .12s}
  .exp-dl:hover{background:var(--panel-soft);color:var(--brand)}
  .exp-audit{display:flex;gap:12px;background:var(--brand-soft);border-left:4px solid var(--brand);border-radius:var(--radius-sm);padding:14px 18px;margin-top:18px;font-size:13px;color:var(--ink-soft);line-height:1.6}
  .prop-edit-link{margin-left:auto;font-size:12px;font-weight:700;color:var(--brand);cursor:pointer;white-space:nowrap}
  .prop-edit-link:hover{text-decoration:underline}
  .prop-edit-ta{width:100%;min-height:130px;font-size:13.5px;color:var(--ink);line-height:1.65;background:var(--panel);border:1.5px solid var(--brand);border-radius:var(--radius-sm);padding:12px 14px;resize:vertical;box-sizing:border-box;font-family:inherit}
  /* Compliance answer pre-load banner */
  .comp-load-banner{display:flex;align-items:center;gap:14px;background:var(--brand-soft);border:1px solid var(--brand-soft);border-radius:var(--radius-sm);padding:12px 18px;margin-bottom:16px;font-size:13px;color:var(--brand-ink);transition:opacity .3s}
  .comp-load-banner.done{background:var(--green-soft);border-color:var(--green-soft);color:var(--green)}
  .comp-load-banner .clb-bar-wrap{flex:1;height:5px;background:var(--brand-soft);border-radius:3px;overflow:hidden;min-width:80px;max-width:220px}
  .comp-load-banner.done .clb-bar-wrap{background:var(--green-soft)}
  .comp-load-banner .clb-bar{height:100%;background:var(--brand);border-radius:3px;transition:width .25s}
  .comp-load-banner.done .clb-bar{background:var(--green)}
  .pip-section{margin-bottom:22px}
  .pip-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
  .pip-header h2{font-size:16px;font-weight:800;letter-spacing:-.2px}
  .pip-scroll{overflow-x:auto;padding-bottom:6px}
  .pip-kanban{display:flex;gap:14px;min-width:max-content}
  .pip-col{min-width:190px;width:190px}
  .pip-col-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;padding:0 2px}
  .pip-col-name{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.8px;color:var(--ink-soft)}
  .pip-col-count{font-size:10.5px;font-weight:700;padding:2px 7px;border-radius:20px;background:var(--surface-sunk);color:var(--ink-soft);font-variant-numeric:tabular-nums}
  .pip-card{background:var(--panel);border:1px solid var(--panel-line);border-radius:var(--radius-sm);padding:12px 13px;margin-bottom:9px;box-shadow:var(--shadow);cursor:pointer;transition:box-shadow .12s,border-color .12s}
  .pip-card:hover{box-shadow:var(--shadow-raised);border-color:var(--panel-line)}
  .pip-card:last-child{margin-bottom:0}
  .pip-card-title{font-size:12px;font-weight:700;color:var(--ink);line-height:1.35;margin-bottom:3px;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .pip-card-auth{font-size:10.5px;color:var(--ink-soft);margin-bottom:7px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .pip-card-dl{font-size:10.5px;color:var(--ink-faint);display:flex;align-items:center;gap:4px;margin-bottom:8px}
  .pip-card-foot{display:flex;align-items:center;gap:8px}
  .pip-bar{flex:1;height:3px;border-radius:2px;background:var(--surface-sunk);overflow:hidden}
  .pip-bar i{display:block;height:100%;border-radius:2px}
  .pc-new{background:var(--ink-faint)}.pc-review{background:var(--brand)}.pc-missing{background:var(--amber)}.pc-drafting{background:var(--teal)}.pc-done{background:var(--green)}
  /* Submitted is not "more done than done" — it is out of our hands. Ink
     rather than a brighter green, so the last column reads as closed and does
     not compete with Beoordeling for the eye. */
  .pc-submitted{background:var(--ink)}
  .pip-chip{display:inline-flex;align-items:center;gap:4px;margin-top:6px;padding:2px 8px;
    border-radius:20px;font-size:9.5px;font-weight:700}
  .pip-chip.pip-chip-sent{background:var(--green-soft);color:var(--green)}
  .pip-chip.pip-chip-pkg{background:var(--surface-sunk);color:var(--ink-soft)}
  .pip-empty{border:1px dashed var(--panel-line);border-radius:var(--radius-sm);padding:16px 12px;text-align:center;font-size:11px;color:var(--ink-faint)}
  .dash-bottom{display:grid;grid-template-columns:1fr 1fr;gap:14px}
  @media(max-width:760px){.dash-bottom{grid-template-columns:1fr}}
  .dash-card{background:var(--panel);border:1px solid var(--panel-line);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}
  .dash-card-head{padding:13px 18px;border-bottom:1px solid var(--panel-line);display:flex;align-items:center;justify-content:space-between;gap:8px}
  .dash-card-title{font-size:13.5px;font-weight:700;letter-spacing:-.2px}
  .dl-item{display:flex;align-items:center;gap:12px;padding:11px 18px;border-bottom:1px solid var(--panel-line)}
  .dl-item:last-child{border-bottom:none}
  .dl-badge{width:36px;flex-shrink:0;text-align:center}
  .dl-badge-mo{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.4px;color:var(--on-solid);background:var(--solid-brand);border-radius:5px 5px 0 0;padding:2px 4px;display:block}
  .dl-badge-dy{font-size:15px;font-weight:800;color:var(--ink);background:var(--panel-soft);border:1px solid var(--panel-line);border-top:none;border-radius:0 0 5px 5px;display:block;line-height:1.4;font-variant-numeric:tabular-nums}
  .dl-body{flex:1;min-width:0}
  .dl-title{font-size:12px;font-weight:700;color:var(--ink);margin-bottom:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .dl-sub{font-size:10.5px;color:var(--ink-soft)}
  .dl-urg{flex-shrink:0;font-size:10px;font-weight:700;padding:3px 8px;border-radius:20px;white-space:nowrap}
  .urg-now{background:var(--red-soft);color:var(--red-ink)}.urg-soon{background:var(--amber-soft);color:var(--amber)}.urg-ok{background:var(--green-soft);color:var(--green)}
  .ai-item{display:flex;align-items:flex-start;gap:11px;padding:11px 18px;border-bottom:1px solid var(--panel-line)}
  .ai-item:last-child{border-bottom:none}
  .ai-ic{width:28px;height:28px;border-radius:7px;display:grid;place-items:center;flex-shrink:0}
  .ai-ic-violet{background:var(--violet-soft)}.ai-ic-blue{background:var(--brand-soft)}.ai-ic-teal{background:var(--teal-soft)}.ai-ic-amber{background:var(--amber-soft)}
  .ai-body{flex:1;min-width:0}
  .ai-label{font-size:12px;font-weight:600;color:var(--ink);line-height:1.4;margin-bottom:1px}
  .ai-time{font-size:10.5px;color:var(--ink-faint)}
  .ai-item-link{cursor:pointer;transition:background .1s}
  .ai-item-link:hover{background:var(--panel-soft)}
  .ai-item-link:hover .ai-label{color:var(--brand)}
  .ai-item-arrow{color:var(--ink-faint);flex-shrink:0;opacity:0;transition:opacity .15s}
  .ai-item-link:hover .ai-item-arrow{opacity:1}

  /* ══════════════════════════════════════════════════════════════════════
     SHARED COMPONENTS — Playbook Appendix B ("build once")
     ──────────────────────────────────────────────────────────────────────
     Compliance, All Tenders, Documents, Team and Knowledge Base each used to
     hand-roll a <table> with per-cell inline styles, so a column or density
     change had to be made five times. These classes are the one place that
     styling now lives; tiqTable() in app.js is the one place the markup does.
     ══════════════════════════════════════════════════════════════════════ */

  /* ── Data table ────────────────────────────────────────────────────── */
  /* The wrap owns BOTH axes, and that is deliberate.
     `overflow-x:auto` with `overflow-y:visible` is not a thing: per spec, when
     one axis is not `visible` the other computes to `auto`. So this element was
     already the scroll container — and a `position:sticky` header sticks to its
     scroll container, not the viewport. With no height bound the wrap grew to
     all 647 rows, so the "sticky" header stuck to a box whose top was far above
     the fold and scrolled away like any other row; the horizontal scrollbar sat
     at the bottom of those 647 rows, where nobody could reach it.
     Bounding the height fixes both at once: the header sticks to the top of the
     visible box and the horizontal scrollbar rides its bottom edge.
     --tiq-tbl-max is measured per table by tiqFitTables() — the wrap sits at a
     different height on every screen, and guessing is what puts the scrollbar
     back under the fold. The fallback only has to be sane before the first
     measurement lands. */
  .tiq-tbl-wrap{
    overflow:auto;
    max-height:var(--tiq-tbl-max, calc(100vh - 220px));
    border:1px solid var(--panel-line);border-radius:var(--radius);
    background:var(--panel);box-shadow:var(--shadow);
  }
  /* A short table must not become a short scroll box: with fewer rows than the
     bound, max-height never binds and this behaves exactly as it used to. */
  @media (max-height:520px){
    .tiq-tbl-wrap{max-height:none}
  }
  .tiq-tbl{width:100%;border-collapse:separate;border-spacing:0;font-size:13px;color:var(--ink)}
  .tiq-tbl caption{
    text-align:left;padding:14px 16px 0;font-size:12px;color:var(--ink-faint);
    caption-side:top;
  }
  /* Sticky header (C5). `separate` borders + box-shadow rather than
     border-bottom, because a border on a sticky th does not paint.
     This sticks against .tiq-tbl-wrap's scrollport, which is why that element
     is height-bounded — see the note there. */
  .tiq-tbl thead th{
    position:sticky;top:0;z-index:3;
    background:var(--surface-sunk);
    box-shadow:inset 0 -1px 0 var(--panel-line);
    text-align:left;font-size:10.5px;font-weight:700;letter-spacing:.06em;
    text-transform:uppercase;color:var(--ink-faint);
    padding:11px 14px;white-space:nowrap;
  }
  .tiq-tbl thead th.num{text-align:right}
  .tiq-tbl tbody td{
    padding:12px 14px;vertical-align:top;line-height:1.5;
    border-bottom:1px solid var(--panel-line);
  }
  .tiq-tbl tbody tr:last-child td{border-bottom:none}
  .tiq-tbl tbody tr:hover td{background:var(--surface-sunk)}
  .tiq-tbl tbody td.num{text-align:right;font-variant-numeric:tabular-nums}
  .tiq-tbl tbody td.nowrap{white-space:nowrap}
  .tiq-tbl .tiq-td-main{font-weight:600;color:var(--ink);display:block}
  .tiq-tbl .tiq-td-sub{display:block;margin-top:2px;font-size:12px;color:var(--ink-faint);line-height:1.45}
  .tiq-tbl tr.is-clickable{cursor:pointer}

  /* Sticky first column — pairs with horizontal scroll on narrow screens. */
  /* A filename has no spaces to break at, so this column's min-content width
     was simply the longest name in the list — 436px in the Documents panel —
     and narrowing the panel got none of it back. Pinned, wide is worse than
     wide: once this column plus the pinned action column exceeded the
     scrollport the two met in the middle, and the horizontal scrollbar went on
     moving while everything it could have revealed stayed behind them. Letting
     the name break is what makes the column shrinkable at all; the floor keeps
     it readable, and the preferred width lets it take the spare room when
     there is some. */
  .tiq-tbl .tiq-td-main,
  .tiq-tbl .tiq-td-sub{overflow-wrap:anywhere}
  .tiq-tbl.sticky-first thead th:first-child,
  .tiq-tbl.sticky-first tbody td:first-child{width:340px;min-width:220px}
  .tiq-tbl.sticky-first thead th:first-child{left:0;z-index:4}
  .tiq-tbl.sticky-first tbody td:first-child{position:sticky;left:0;z-index:2;background:var(--panel)}
  .tiq-tbl.sticky-first tbody tr:hover td:first-child{background:var(--surface-sunk)}

  /* Count of documents still waiting to be filed. Sits on the nav item so the
     queue is visible without opening it, and hides itself at zero — a badge
     that always reads 0 is furniture. */
  .nav-badge{
    margin-left:auto;padding:1px 7px;border-radius:999px;
    background:var(--amber);color:var(--on-accent);
    font-size:10px;font-weight:800;line-height:1.6;
  }

  /* The account control in a tender's subtitle: a value plus the way to fix
     it, inline, so correcting a wrong account never means leaving the screen
     where you noticed it. */
  .tiq-acc{display:inline-flex;align-items:center;gap:6px}
  .tiq-acc .tiq-acc-act{
    min-height:22px;padding:1px 8px;font-size:11px;font-weight:700;
    border-radius:999px;
  }

  /* An AI proposal, inline. Deliberately not styled as a status: it marks a
     value nobody has confirmed yet, so it must read as provisional. */
  .tiq-ai-chip{
    display:inline-block;margin-left:5px;padding:0 6px;border-radius:999px;
    background:var(--amber-soft);color:var(--amber);
    font-size:9.5px;font-weight:800;letter-spacing:.06em;vertical-align:1px;
    cursor:help;
  }

  /* Group header rows (Account → Tender → Document). A row of its own rather
     than an indent, so the account reads as the level above the tender it
     contains — and it sticks under the header while its group scrolls, so you
     never lose track of whose tenders you are looking at. */
  .tiq-tbl tr.tiq-tbl-group th{
    position:sticky;top:37px;z-index:3;
    background:var(--surface-sunk);
    box-shadow:inset 0 -1px 0 var(--panel-line);
    text-align:left;padding:9px 14px;
    font-size:11.5px;font-weight:800;color:var(--ink);
    letter-spacing:.02em;text-transform:none;
  }
  .tiq-tbl tr.tiq-tbl-group .tiq-tbl-group-count{
    margin-left:8px;padding:1px 7px;border-radius:999px;
    background:var(--panel);border:1px solid var(--panel-line);
    font-size:10.5px;font-weight:700;color:var(--ink-faint);
  }

  /* Sticky LAST column — for tables whose final column is the row's actions.
     Pinning only the first column was half a solution: on a narrow panel the
     table scrolls horizontally and the action button is pushed past the right
     edge, so the row is readable but nothing can be done to it. On the
     Documents & AI panel that meant Open/preview/download appeared to have
     vanished, with only a thin horizontal scrollbar under a long list to
     suggest otherwise. The left divider marks it as pinned rather than
     floating loose over the content it covers. */
  .tiq-tbl.sticky-last thead th:last-child{right:0;z-index:4}
  .tiq-tbl.sticky-last tbody td:last-child{
    position:sticky;right:0;z-index:2;background:var(--panel);
    box-shadow:inset 1px 0 0 var(--panel-line);
  }
  .tiq-tbl.sticky-last tbody tr:hover td:last-child{background:var(--surface-sunk)}
  /* An open row menu overflows its cell into the rows below, whose own sticky
     last cells sit at the same z-index and paint later — so they covered it.
     _tiqMoreLift() marks the owning cell while its menu is open. The cell is a
     stacking context, so this is also the only rank the menu inside it can
     have against the rest of the page: 60 clears the neighbouring cells (2),
     the sticky header (4) and the topbar (20) that an upward-flipped menu
     reaches, while staying under toasts (100) and modals (200). The cell's own
     box cannot escape the scrollport, so lifting it shows nothing new. */
  .tiq-tbl.sticky-last tbody td:last-child.tiq-cell-lift{z-index:60}

  /* Density modes (C5). Comfort is the default and needs no class. */
  .tiq-tbl.d-compact  tbody td{padding:6px 14px;font-size:12.5px}
  .tiq-tbl.d-compact  thead th{padding:7px 14px}
  .tiq-tbl.d-spacious tbody td{padding:18px 14px}
  .tiq-tbl.d-spacious thead th{padding:14px 14px}

  /* Severity rail (C4): a left edge on the row's first cell, so a knock-out
     reads before you have parsed a single word of the row. */
  .tiq-tbl tbody tr.rail-danger td:first-child{box-shadow:inset 3px 0 0 var(--red)}
  .tiq-tbl tbody tr.rail-warn   td:first-child{box-shadow:inset 3px 0 0 var(--amber)}
  .tiq-tbl tbody tr.rail-ok     td:first-child{box-shadow:inset 3px 0 0 var(--green)}
  .tiq-tbl tbody tr.rail-danger td{background:color-mix(in srgb,var(--red-soft) 34%,transparent)}

  .tiq-tbl-empty{padding:44px 20px;text-align:center;color:var(--ink-faint);font-size:13px}
  .tiq-tbl-empty b{display:block;font-size:15px;color:var(--ink);margin-bottom:6px;font-weight:700}

  /* ── Status pill ───────────────────────────────────────────────────── */
  /* Never colour-only (A10): every pill carries a dot AND a word. */
  .tiq-pill{
    display:inline-flex;align-items:center;gap:6px;
    padding:3px 10px 3px 8px;border-radius:var(--radius-pill);
    font-size:11.5px;font-weight:700;white-space:nowrap;
    background:var(--surface-sunk);color:var(--ink-soft);
  }
  .tiq-pill::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;flex:none}
  .tiq-pill.ok      {background:var(--green-soft); color:var(--green)}
  .tiq-pill.warn    {background:var(--amber-soft); color:var(--amber)}
  .tiq-pill.danger  {background:var(--red-soft);   color:var(--red-ink)}
  .tiq-pill.info    {background:var(--brand-soft); color:var(--brand-ink)}
  .tiq-pill.neutral {background:var(--surface-sunk);color:var(--ink-soft)}
  .tiq-pill.plain::before{display:none}

  /* ── Confidence bar (C3) ───────────────────────────────────────────── */
  /* Replaces a bare "85%". The band is semantic, the number stays for
     screen readers and for anyone who needs the exact value. */
  .tiq-conf{display:inline-flex;align-items:center;gap:8px;min-width:104px}
  .tiq-conf-track{
    flex:1;height:6px;min-width:48px;border-radius:var(--radius-pill);
    background:var(--surface-sunk);overflow:hidden;
  }
  /* display:block matters — the fill is a <span>, and height:100% on an
     inline box is ignored, which renders every bar as an empty track. */
  .tiq-conf-fill{display:block;height:100%;border-radius:inherit;background:var(--green);transition:width var(--dur-reveal) var(--ease)}
  .tiq-conf.mid  .tiq-conf-fill{background:var(--amber)}
  .tiq-conf.low  .tiq-conf-fill{background:var(--red)}
  .tiq-conf.none .tiq-conf-fill{background:var(--ink-faint)}
  .tiq-conf-val{font-size:11.5px;font-weight:700;color:var(--ink-soft);font-variant-numeric:tabular-nums;min-width:34px;text-align:right}

  /* ── Metric card (Appendix B — generalised from Tender Overview) ────── */
  .tiq-metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px}
  .tiq-metric{
    background:var(--panel);border:1px solid var(--panel-line);
    border-radius:var(--radius);padding:16px 18px;box-shadow:var(--shadow);
    display:flex;flex-direction:column;gap:4px;position:relative;overflow:hidden;
  }
  .tiq-metric-label{font-size:10.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--ink-faint)}
  .tiq-metric-value{font-size:28px;font-weight:800;line-height:1.1;color:var(--ink);font-variant-numeric:tabular-nums}
  .tiq-metric-value.accent{background:var(--gradient-brand);-webkit-background-clip:text;background-clip:text;color:transparent}
  .tiq-metric-value.ok{color:var(--green)} .tiq-metric-value.warn{color:var(--amber)} .tiq-metric-value.danger{color:var(--red-ink)}
  .tiq-metric-sub{font-size:11.5px;color:var(--ink-faint);line-height:1.45}
  .tiq-metric-flag{position:absolute;top:14px;right:14px;width:7px;height:7px;border-radius:50%;background:var(--brand)}

  /* ── Filter bar (C6) ───────────────────────────────────────────────── */
  /* ── Step 4 · full matrix: head space is rows you cannot read ──────────
     647 requirements behind four rows of chrome. The title and the actions
     share one line, the description is one line under it, and the filter bar
     tightens up — roughly 90px of the fold handed back to the table. */
  .comp-head{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px}
  .comp-head-t{margin:0;font-size:20px}
  .comp-head-acts{display:flex;gap:8px;flex-wrap:wrap}
  /* One line, and it truncates rather than wrapping into a second: this text is
     orientation for a first visit, not something read on every return. */
  .comp-head-s{margin:2px 0 10px;font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
  @media (max-width:900px){
    .comp-head-s{white-space:normal}
  }
  #view-compliance .tiq-filterbar{margin-bottom:10px}

  .tiq-filterbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:14px}
  .tiq-filter-input{
    flex:1;min-width:180px;max-width:320px;
    border:1px solid var(--panel-line);border-radius:var(--radius-sm);
    padding:8px 12px;font-size:13px;font-family:inherit;
    color:var(--ink);background:var(--panel);outline:none;
  }
  .tiq-filter-input:focus{border-color:var(--brand);box-shadow:var(--focus-ring)}
  /* A count that filters when you click it (B4) — not decoration. */
  .tiq-count{
    display:inline-flex;align-items:center;gap:6px;
    padding:5px 12px;border-radius:var(--radius-pill);
    font-size:12.5px;font-weight:700;cursor:pointer;
    border:1px solid transparent;font-family:inherit;
    background:var(--surface-sunk);color:var(--ink-soft);
    transition:border-color var(--dur-fast) var(--ease),background var(--dur-fast) var(--ease);
  }
  .tiq-count::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;flex:none}
  .tiq-count.plain::before{display:none}
  .tiq-count.ok{background:var(--green-soft);color:var(--green)}
  .tiq-count.warn{background:var(--amber-soft);color:var(--amber)}
  .tiq-count.danger{background:var(--red-soft);color:var(--red-ink)}
  .tiq-count.info{background:var(--brand-soft);color:var(--brand-ink)}
  .tiq-count:hover{border-color:currentColor}
  .tiq-count[aria-pressed="true"]{border-color:currentColor;box-shadow:var(--focus-ring)}
  .tiq-count .n{font-variant-numeric:tabular-nums}

  /* Segmented control — density switch, and any 2–4 way choice. */
  .tiq-seg{display:inline-flex;background:var(--surface-sunk);border:1px solid var(--panel-line);border-radius:var(--radius-pill);padding:2px}
  .tiq-seg button{
    border:none;background:transparent;cursor:pointer;font-family:inherit;
    font-size:11.5px;font-weight:700;padding:4px 11px;border-radius:var(--radius-pill);
    color:var(--ink-faint);
  }
  .tiq-seg button[aria-pressed="true"]{background:var(--panel);color:var(--brand-ink);box-shadow:var(--shadow)}

  /* ── Overflow menu (B5) — one primary, the rest under "More" ───────── */
  .tiq-more{position:relative;display:inline-block}
  /* Fixed rather than absolute. These menus live in tables that scroll inside
     a height-bounded box (.tiq-tbl-wrap), and an absolutely positioned menu
     opened on one of the last visible rows was cut off at that box's bottom
     edge — the rows it needed to overhang were outside the scrollport. Fixed
     leaves the scrollport behind; the price is that the position can no
     longer be inherited, so _tiqMorePlace() sets top/left on open and flips
     the menu above its trigger when there is no room below it. */
  .tiq-more-dd{
    display:none;position:fixed;min-width:210px;z-index:60;
    background:var(--panel);border:1px solid var(--panel-line);
    border-radius:var(--radius-sm);box-shadow:var(--shadow-pop);overflow:hidden;padding:4px;
  }
  .tiq-more.open .tiq-more-dd{display:block}
  .tiq-more-dd button{
    display:block;width:100%;text-align:left;border:none;background:transparent;
    cursor:pointer;font-family:inherit;font-size:12.5px;font-weight:600;color:var(--ink);
    padding:8px 10px;border-radius:6px;white-space:nowrap;
  }
  .tiq-more-dd button:hover{background:var(--surface-sunk)}
  .tiq-more-dd hr{border:none;border-top:1px solid var(--panel-line);margin:4px 0}

  /* ── Shimmer skeleton (E4) — replaces the blocking "Opening…" modal ── */
  .tiq-skel{background:var(--panel);border:1px solid var(--panel-line);border-radius:var(--radius);padding:18px;box-shadow:var(--shadow)}
  .tiq-skel-line{
    height:11px;border-radius:var(--radius-pill);margin-bottom:10px;
    background:linear-gradient(90deg,var(--surface-sunk) 25%,var(--panel-line) 37%,var(--surface-sunk) 63%);
    background-size:400% 100%;
    animation:tiq-shimmer 1.4s ease-in-out infinite;
  }
  .tiq-skel-line:last-child{margin-bottom:0}
  @keyframes tiq-shimmer{0%{background-position:100% 50%}100%{background-position:0 50%}}
  @media (prefers-reduced-motion:reduce){
    .tiq-skel-line{animation:none;background:var(--surface-sunk)}
  }

  /* Screen-reader-only text, for the parts of a status that are visual. */
  .tiq-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

  /* ── Focus ring, enforced (A10) ─────────────────────────────────────────
     Roughly a dozen rules across this file set `outline:none` on :focus, and
     several give nothing back. Specificity there ((0,2,0) for `.foo:focus`)
     beats any element-level rule we could add, so the keyboard affordance is
     asserted here instead. !important is deliberate and scoped to
     :focus-visible: pointer users still never see a ring, and no future rule
     can silently remove it again. */
  :focus-visible{
    outline:2px solid var(--brand)!important;
    outline-offset:2px!important;
  }

  /* ── Human Input grouping (D1 / mockup 6.6) ─────────────────────────── */
  .hi-group-head{
    display:flex;align-items:center;gap:9px;
    margin:22px 0 10px;padding-left:11px;
    border-left:3px solid var(--panel-line);
  }
  .hi-group-head:first-child{margin-top:4px}
  .hi-group-label{font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft)}
  .hi-group-n{
    font-size:11px;font-weight:800;color:var(--ink-faint);
    background:var(--surface-sunk);border-radius:var(--radius-pill);
    padding:1px 8px;font-variant-numeric:tabular-nums;
  }
  .hi-group-head.mine      {border-left-color:var(--red)}
  .hi-group-head.mine .hi-group-label{color:var(--red-ink)}
  .hi-group-head.unassigned{border-left-color:var(--amber)}
  .hi-group-head.others    {border-left-color:var(--brand)}
  .hi-group-head.done      {border-left-color:var(--green)}
  /* Answers the last analysis disagreed with — surprising, so it reads amber
     like Unassigned rather than green like a closed item. */
  .hi-group-head.review    {border-left-color:var(--amber)}
  .hi-group-head.review .hi-group-label{color:var(--amber)}

  .hiq-avatar{
    display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;
    background:var(--gradient-brand);color:var(--on-accent);
    font-size:9.5px;font-weight:800;letter-spacing:.02em;margin-right:2px;flex:none;
  }
  .hi-assign{display:inline-flex;align-items:center;gap:6px;margin-left:auto}
  .hi-assign-sel,.hi-assign-date{
    border:1px solid var(--panel-line);border-radius:var(--radius-sm);
    background:var(--panel);color:var(--ink);font-family:inherit;
    font-size:11.5px;padding:4px 7px;max-width:150px;
  }
  .hi-assign-sel:hover,.hi-assign-date:hover{border-color:var(--brand)}
  @media (max-width:720px){
    .hi-assign{margin-left:0;width:100%;margin-top:6px}
  }

  /* ── Compliance matrix cells (C1–C4) ────────────────────────────────── */
  .comp-req-id{font-family:inherit;font-size:12.5px;font-weight:800;letter-spacing:.02em;color:var(--brand-ink)}
  .comp-req-text{max-width:420px;white-space:normal}
  .comp-dupe{margin-top:4px;font-size:10.5px;font-weight:700;color:var(--amber)}
  .comp-none{color:var(--ink-faint);font-size:12px}
  .comp-validity{color:var(--amber);font-weight:700}
  .comp-src-loading{display:inline-flex;align-items:center;gap:5px;color:var(--ink-faint);font-size:12px}
  .comp-src-loading .spinner{width:10px;height:10px;border-width:1.5px;border-color:var(--panel-line);border-top-color:var(--ink-faint);flex-shrink:0}
  .comp-act{font-size:11.5px;padding:5px 12px}
  .tiq-tbl td .tiq-td-sub .tiq-pill{font-size:10.5px;padding:2px 8px 2px 6px}

  /* ── Non-blocking progress bar (E4) ─────────────────────────────────────
     Replaces the full-screen "Opening tender…" overlay, which sat at
     inset:0 / z-380 and swallowed every click underneath it. This sits above
     the app but is 3px tall and pointer-transparent, so the app stays usable
     while something loads. */
  #tiq-busy{
    position:fixed;top:0;left:0;right:0;height:3px;z-index:400;
    pointer-events:none;opacity:0;transition:opacity var(--dur-fast) var(--ease);
  }
  #tiq-busy.on{opacity:1}
  .tiq-busy-fill{
    display:block;height:100%;width:40%;border-radius:0 var(--radius-pill) var(--radius-pill) 0;
    background:var(--gradient-brand);
    animation:tiq-busy-slide 1.1s var(--ease) infinite;
  }
  @keyframes tiq-busy-slide{
    0%{transform:translateX(-100%)}
    100%{transform:translateX(350%)}
  }
  @media (prefers-reduced-motion:reduce){
    .tiq-busy-fill{animation:none;width:100%}
  }

  /* ══════════════════════════════════════════════════════════════════════
     SHELL — one navigation model (A1, B1, B2, A7, E3)
     ══════════════════════════════════════════════════════════════════════ */

  /* Atmospheric backdrop (A7), in approved zones only: the sidebar, the login
     hero and the dashboard band. Low-opacity radial mesh, never behind text
     that has to stay AA. */
  /* isolation only — NOT position. The sidebar is already `position:sticky`
     (see the Sidebar block above), and re-declaring position here silently
     overrode it: same specificity, later in the file, so the whole left menu
     scrolled away with the page. Sticky is itself a positioned value, so it
     already establishes the containing block .side-mesh needs for inset:0. */
  .side{isolation:isolate}
  .side-mesh{
    position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.55;
    background:
      radial-gradient(46% 30% at 18% 8%,  color-mix(in srgb,var(--grad-from) 55%,transparent), transparent 70%),
      radial-gradient(40% 26% at 92% 34%, color-mix(in srgb,var(--grad-to)   48%,transparent), transparent 72%),
      radial-gradient(52% 34% at 30% 96%, color-mix(in srgb,var(--grad-to)   34%,transparent), transparent 74%);
  }
  .nav{position:relative;display:flex;flex-direction:column;gap:2px;flex:none}
  .nav a{position:relative;overflow:hidden}
  /* The active pill carries the signature gradient (5.2). */
  .nav a.active{background:var(--gradient-brand);color:var(--on-accent);box-shadow:var(--shadow-raised)}

  /* Governance: a compact button in the sidebar foot, and a header badge (B1).
     The old panel was a 5-line card that ate a sixth of the sidebar. */
  .side-gov{
    display:flex;align-items:center;gap:9px;width:100%;flex:none;
    /* margin-top:auto only bites because .side is a flex column — without it
       the button stacked straight under the last nav link and read as a
       sixth menu item. */
    margin-top:auto;
    background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.10);
    border-radius:var(--radius-sm);padding:9px 11px;cursor:pointer;
    font-family:inherit;text-align:left;color:var(--side-ink);
  }
  .side-gov:hover{background:rgba(255,255,255,.11)}
  .side-gov b{display:block;font-size:12px;color:var(--on-accent);font-weight:700}
  .side-gov small{display:block;font-size:10.5px;color:var(--side-ink-soft);margin-top:1px}
  .side-gov-dot{
    width:7px;height:7px;border-radius:50%;flex:none;background:var(--green);
    box-shadow:0 0 0 3px color-mix(in srgb,var(--green) 26%,transparent);
  }
  /* Chat took Governance's place in the header (see intake.html). Same badge
     shape so the top bar keeps one rhythm, brand-coloured because this one is
     an action rather than a status. */
  .chat-badge{
    display:inline-flex;align-items:center;gap:6px;flex-shrink:0;cursor:pointer;
    border:1px solid var(--brand-soft);background:var(--brand-soft);color:var(--brand-ink);
    border-radius:var(--radius-pill);padding:5px 12px;
    font-family:inherit;font-size:11.5px;font-weight:700;
    transition:border-color .12s,color .12s;
  }
  .chat-badge:hover{border-color:var(--brand);color:var(--brand)}

  /* Breadcrumb carries the tender (B2). */
  .crumb{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--ink-faint);font-weight:600;min-width:0;flex-shrink:1;overflow:hidden}
  .crumb a{color:var(--ink-faint);white-space:nowrap}
  .crumb a:hover{color:var(--brand);text-decoration:underline}
  .crumb b{color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:32ch}
  .crumb-sep{color:var(--panel-line);flex:none}

  /* Glass top bar (A8) — translucent over the page, blurred, not opaque. */
  .topbar{
    background:color-mix(in srgb,var(--panel) 78%,transparent);
    backdrop-filter:saturate(1.6) blur(12px);
    -webkit-backdrop-filter:saturate(1.6) blur(12px);
  }
  /* The search field is a button now: it opens ⌘K rather than pretending to be
     an input that never had a handler. */
  .searchbar{
    flex:1;max-width:380px;min-width:150px;cursor:pointer;text-align:left;
    font-family:inherit;color:var(--ink-faint);
  }
  .searchbar:hover{border-color:var(--brand);color:var(--brand)}
  .searchbar-label{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .searchbar-kbd{
    font-family:inherit;font-size:10.5px;font-weight:700;letter-spacing:.03em;
    border:1px solid var(--panel-line);border-radius:5px;padding:1px 6px;
    background:var(--panel);color:var(--ink-faint);flex:none;
  }

  /* Theme switch (A3) — light / dark / follow the system. */
  .theme-toggle{display:flex;align-items:center;gap:2px;background:var(--surface-sunk);border:1px solid var(--panel-line);border-radius:var(--radius-pill);padding:2px;flex-shrink:0}
  .theme-toggle button{
    border:none;background:transparent;cursor:pointer;font-family:inherit;
    width:26px;height:22px;border-radius:var(--radius-pill);color:var(--ink-faint);
    display:grid;place-items:center;
  }
  .theme-toggle button[aria-pressed="true"]{background:var(--panel);color:var(--brand);box-shadow:var(--shadow)}

  /* ── Per-tender header + tabs ─────────────────────────────────────────── */
  .tender-head{
    padding:16px 26px 0;background:var(--panel);
    border-bottom:1px solid var(--panel-line);position:sticky;top:57px;z-index:15;
  }
  .tender-head[hidden]{display:none}
  .tender-head-row{display:flex;align-items:center;gap:11px;flex-wrap:wrap}
  .tender-title{font-size:19px;font-weight:800;letter-spacing:-.01em;color:var(--ink);margin:0;min-width:0}
  .tender-proc{
    font-size:10.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;
    background:var(--brand-soft);color:var(--brand-ink);
    border-radius:var(--radius-pill);padding:3px 10px;flex:none;
  }
  .tender-head-actions{margin-left:auto;display:flex;gap:8px;flex-wrap:wrap}
  .tender-sub{font-size:12px;color:var(--ink-faint);margin-top:4px;display:flex;flex-wrap:wrap;gap:7px;align-items:center}
  .tender-sub-sep{color:var(--panel-line)}
  .tender-sub .m{font-family:inherit;background:var(--surface-sunk);border-radius:4px;padding:1px 6px;font-size:11px}

  .tabbar{position:relative;display:flex;gap:2px;margin-top:12px;overflow-x:auto;scrollbar-width:none}
  .tabbar::-webkit-scrollbar{display:none}
  .tab{
    position:relative;border:none;background:transparent;cursor:pointer;
    font-family:inherit;font-size:13px;font-weight:600;color:var(--ink-faint);
    padding:9px 13px 11px;white-space:nowrap;border-radius:var(--radius-sm) var(--radius-sm) 0 0;
    display:inline-flex;align-items:center;gap:7px;
    transition:color var(--dur-fast) var(--ease);
  }
  .tab:hover{color:var(--ink)}
  .tab.active{color:var(--brand-ink);font-weight:700}
  .tab-badge{
    font-size:10px;font-weight:800;line-height:1;padding:2px 6px;
    border-radius:var(--radius-pill);background:var(--surface-sunk);color:var(--ink-soft);
    font-variant-numeric:tabular-nums;
  }
  .tab.active .tab-badge{background:var(--brand-soft);color:var(--brand-ink)}
  /* The sliding gradient underline (E3). Transform-only, so it never reflows. */
  .tab-ind{
    position:absolute;left:0;bottom:0;height:2.5px;width:0;opacity:0;
    border-radius:var(--radius-pill) var(--radius-pill) 0 0;
    background:var(--gradient-brand);
    transition:transform var(--dur-mid) var(--ease),width var(--dur-mid) var(--ease),opacity var(--dur-fast) var(--ease);
    pointer-events:none;
  }
  @media (prefers-reduced-motion:reduce){ .tab-ind{transition:none} }

  /* The same tab component used outside a tender header (Knowledge Base).
     The tender bar rides on `.tender-head`'s bottom border; standing on its
     own it has to draw that border itself, or the sliding indicator has no
     line to run along. */
  .tabbar-inline{border-bottom:1px solid var(--panel-line);margin:14px 0 18px}
  .tabbar-inline .tab{padding:8px 13px 10px}
  .tab-panel[hidden]{display:none}

  @media (max-width:900px){
    .tender-head{padding:12px 16px 0;top:53px}
    .searchbar-kbd{display:none}
  }

  /* ── The tender workflow: step rail + step body ────────────────────────
     Nested left rail rather than items in the global sidebar. The sidebar
     answers "which part of the product am I in", and a tender's steps are a
     different question with a different scope — collapsing them into one list
     is what produced the original 13-link sidebar competing with a stepper in
     the content area. Two rails, two scopes, each honest about what it
     controls. */
  .tender-shell{display:grid;grid-template-columns:232px minmax(0,1fr);gap:24px;align-items:start}

  .step-rail{position:sticky;top:126px;display:flex;flex-direction:column;gap:10px}
  .step-rail-title{
    font-size:10.5px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;
    color:var(--ink-faint);padding:0 4px;
  }
  .step-list{display:flex;flex-direction:column;gap:3px;position:relative}

  /* One step. The number is the anchor: it is the only element that never
     wraps, so the list stays scannable when the labels are Dutch and long. */
  .step-item{
    display:grid;grid-template-columns:26px minmax(0,1fr);gap:10px;align-items:start;
    border:1px solid transparent;background:transparent;cursor:pointer;
    font-family:inherit;text-align:left;padding:9px 11px;border-radius:var(--radius-sm);
    transition:background var(--dur-fast) var(--ease),border-color var(--dur-fast) var(--ease);
  }
  .step-item:hover{background:var(--panel-soft)}
  .step-item.active{background:var(--panel);border-color:var(--panel-line);box-shadow:var(--shadow)}
  .step-item:focus-visible{outline:none;box-shadow:var(--focus-ring)}
  .step-n{
    width:26px;height:26px;border-radius:50%;display:grid;place-items:center;flex:none;
    font-size:11.5px;font-weight:800;font-variant-numeric:tabular-nums;
    background:var(--surface-sunk);color:var(--ink-faint);
    border:1px solid var(--panel-line);
  }
  .step-item.active .step-n{background:var(--gradient-brand);color:var(--on-accent);border-color:transparent}
  /* "Done" is a claim about the work, not about where you clicked, so it is
     drawn even on a step you are not standing in. */
  .step-item.done .step-n{background:var(--green-soft);color:var(--green);border-color:transparent}
  .step-item.active.done .step-n{background:var(--gradient-brand);color:var(--on-accent)}
  .step-item.locked{cursor:default;opacity:.62}
  .step-item.locked:hover{background:transparent}
  /* NOT .step-label: that name is already the AI-analysis progress row's, and
     it carries text-transform:uppercase and letter-spacing. */
  .step-title{display:block;font-size:12.5px;font-weight:700;color:var(--ink-soft);line-height:1.3}
  .step-item.active .step-title{color:var(--ink)}
  .step-sub{display:block;font-size:10.5px;color:var(--ink-faint);line-height:1.4;margin-top:2px}
  .step-flags{display:flex;gap:4px;flex-wrap:wrap;margin-top:5px}
  .step-flag{
    font-size:9.5px;font-weight:800;letter-spacing:.02em;line-height:1;
    padding:3px 6px;border-radius:var(--radius-pill);
    background:var(--surface-sunk);color:var(--ink-soft);font-variant-numeric:tabular-nums;
  }
  .step-flag.warn{background:var(--amber-soft);color:var(--amber)}
  .step-flag.danger{background:var(--red-soft);color:var(--red-ink)}
  .step-flag.ok{background:var(--green-soft);color:var(--green)}
  .step-flag.info{background:var(--brand-soft);color:var(--brand-ink)}

  .step-rail-foot{
    border-top:1px solid var(--panel-line);padding-top:11px;margin-top:3px;
    font-size:11px;color:var(--ink-faint);line-height:1.5;
  }
  .step-rail-foot b{display:block;color:var(--ink);font-size:11.5px;margin-bottom:3px}

  .step-body{min-width:0}
  .step-head{margin-bottom:4px}
  .step-head-n{
    font-size:10.5px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;
    color:var(--brand-ink);margin-bottom:3px;
  }

  /* Back / continue. Names the next step rather than saying "Next": the point
     of a five-step flow is that you know what is coming. */
  .step-nav{display:flex;gap:10px;align-items:center;margin-top:28px;padding-top:18px;border-top:1px solid var(--panel-line)}
  .step-nav .spacer{flex:1}
  .step-nav-note{font-size:11.5px;color:var(--ink-faint);max-width:420px;line-height:1.45}

  /* Progress strip in the tender header — the one thing true on every step. */
  .tender-head-prog{display:flex;gap:7px;flex-wrap:wrap;align-items:center;margin:9px 0 12px;min-height:22px}

  @media (max-width:1000px){
    .tender-shell{grid-template-columns:minmax(0,1fr);gap:14px}
    .step-rail{position:static;top:auto}
    .step-list{flex-direction:row;overflow-x:auto;scrollbar-width:none;padding-bottom:2px}
    .step-list::-webkit-scrollbar{display:none}
    .step-item{grid-template-columns:22px minmax(0,1fr);min-width:180px;flex:none}
    .step-sub,.step-rail-foot{display:none}
  }

  /* ── Step 1 · Tender Issuer ────────────────────────────────────────────
     The suggestion list is the screen. Everything here exists to make one
     decision auditable: is this tender a re-run of that one. */
  .iss-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,360px);gap:18px;align-items:start}
  @media (max-width:1100px){ .iss-grid{grid-template-columns:minmax(0,1fr)} }

  .iss-card{background:var(--panel);border:1px solid var(--panel-line);border-radius:var(--radius);padding:16px 18px}
  .iss-card + .iss-card{margin-top:14px}
  .iss-card-t{font-size:13.5px;font-weight:800;color:var(--ink);margin-bottom:3px}
  .iss-card-s{font-size:12px;color:var(--ink-soft);line-height:1.55;margin-bottom:14px}

  .iss-who{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border-radius:var(--radius);background:var(--brand-soft);margin-bottom:16px}
  .iss-who-ic{width:34px;height:34px;border-radius:var(--radius-sm);flex:none;display:grid;place-items:center;background:var(--panel);font-size:16px}
  .iss-who-name{font-size:14px;font-weight:800;color:var(--brand-ink)}
  .iss-who-meta{font-size:11.5px;color:var(--ink-soft);margin-top:3px;line-height:1.5}

  .iss-sug{
    display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:start;
    padding:13px 14px;border:1px solid var(--panel-line);border-radius:var(--radius-sm);
    background:var(--panel);margin-bottom:9px;
  }
  .iss-sug.strong{border-color:color-mix(in srgb,var(--brand) 40%,var(--panel-line));background:var(--brand-soft)}
  .iss-sug-name{font-size:13px;font-weight:700;color:var(--ink);line-height:1.35}
  .iss-sug-why{margin:7px 0 0;padding:0;list-style:none;display:flex;flex-direction:column;gap:3px}
  .iss-sug-why li{font-size:11.5px;color:var(--ink-soft);line-height:1.45;padding-left:13px;position:relative}
  .iss-sug-why li::before{content:"\2713";position:absolute;left:0;color:var(--green);font-weight:800}
  .iss-sug-meta{font-size:11px;color:var(--ink-faint);margin-top:6px}
  .iss-sug-acts{display:flex;flex-direction:column;gap:6px;flex:none}
  .iss-strength{
    display:inline-block;font-size:9.5px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;
    padding:3px 8px;border-radius:var(--radius-pill);margin-bottom:6px;
  }
  .iss-strength.strong{background:var(--green-soft);color:var(--green)}
  .iss-strength.possible{background:var(--amber-soft);color:var(--amber)}
  .iss-strength.weak{background:var(--surface-sunk);color:var(--ink-faint)}

  .iss-linked{
    display:flex;gap:12px;align-items:flex-start;flex-wrap:wrap;
    padding:13px 14px;border:1px solid var(--green-soft);background:var(--green-soft);
    border-radius:var(--radius-sm);margin-bottom:9px;
  }
  .iss-linked-main{flex:1;min-width:200px}
  .iss-linked-name{font-size:13px;font-weight:800;color:var(--green)}
  .iss-linked-meta{font-size:11px;color:var(--ink-soft);margin-top:3px;line-height:1.5}
  .iss-linked-acts{display:flex;gap:6px;flex-wrap:wrap}

  /* ── Linked past-tender documents ──────────────────────────────────────
     Used in two places: step 1's linked card, and the Documents panel's own
     section. Same treatment in both, because it is the same claim — these are
     files this tender borrows, not files it holds. */
  .iss-files{display:flex;flex-direction:column;gap:4px;margin-top:9px}
  /* Four at rest; the rest revealed by .open. The list is rendered whole so
     the toggle has something to reveal — and so a file is always in the DOM
     for find-in-page even when collapsed. */
  .iss-files:not(.open) .iss-file:nth-of-type(n+5){display:none}
  .iss-file,.dl-file{
    display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;gap:9px;align-items:center;
    padding:6px 9px;border-radius:var(--radius-sm);background:var(--panel);
    border:1px solid var(--panel-line);cursor:pointer;text-decoration:none;
    transition:border-color var(--dur-fast) var(--ease);
  }
  .iss-file:hover,.dl-file:hover{border-color:var(--brand)}
  .iss-file.bad,.dl-file.bad{background:var(--amber-soft);border-color:var(--amber-soft)}
  .iss-file-ext,.dl-file-ext{
    font-size:9px;font-weight:800;letter-spacing:.03em;color:var(--ink-faint);
    background:var(--surface-sunk);border-radius:4px;padding:3px 5px;min-width:34px;text-align:center;
  }
  .iss-file-name,.dl-file-name{
    font-size:11.5px;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  }
  .iss-file-size,.dl-file-size{font-size:10.5px;color:var(--ink-faint);font-variant-numeric:tabular-nums}
  .iss-file-flag{
    font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;
    color:var(--amber);background:var(--panel);border-radius:var(--radius-pill);padding:2px 6px;
  }
  .iss-files-more{
    align-self:flex-start;border:none;background:transparent;cursor:pointer;font-family:inherit;
    font-size:11px;font-weight:700;color:var(--brand);padding:4px 0;
  }
  .iss-files-none{font-size:11px;color:var(--ink-faint);margin-top:8px;font-style:italic}
  .iss-files-warn{font-size:11px;color:var(--amber);margin-top:8px;line-height:1.45}

  /* The Documents panel's section wrapper. */
  .dl{margin:14px;border:1px solid var(--panel-line);border-radius:var(--radius);padding:14px 16px;background:var(--panel-soft)}
  .dl-head{display:flex;gap:12px;align-items:flex-start;flex-wrap:wrap;margin-bottom:12px}
  .dl-head-main{flex:1;min-width:220px}
  .dl-title{font-size:12.5px;font-weight:800;color:var(--ink)}
  .dl-sub{font-size:11px;color:var(--ink-soft);line-height:1.5;margin-top:3px}
  .dl-proj + .dl-proj{margin-top:12px;padding-top:12px;border-top:1px solid var(--panel-line)}
  .dl-proj-head{display:flex;align-items:baseline;gap:8px;margin-bottom:7px}
  .dl-proj-name{font-size:12px;font-weight:700;color:var(--brand-ink)}
  .dl-proj-n{font-size:10.5px;color:var(--ink-faint);margin-left:auto;font-variant-numeric:tabular-nums}
  .dl-files{display:flex;flex-direction:column;gap:4px}
  .dl-foot{
    font-size:10.5px;color:var(--ink-faint);line-height:1.5;
    margin-top:12px;padding-top:10px;border-top:1px solid var(--panel-line);
  }

  /* ── Step 4 · Requirements, grouped by what closing one costs ──────────
     Three groups, and the order is the argument: what needs writing, what
     needs only confirming, what is finished. A flat list sorted by status
     cannot express "these forty are one click each". */
  .rq-evidence{
    display:flex;gap:13px;align-items:center;flex-wrap:wrap;
    background:var(--brand-soft);border:1px solid color-mix(in srgb,var(--brand) 22%,var(--brand-soft));
    border-radius:var(--radius);padding:14px 16px;margin-bottom:16px;
  }
  .rq-ev-ic{font-size:22px;line-height:1;flex:none}
  .rq-ev-main{flex:1;min-width:260px}
  .rq-ev-title{font-size:12.5px;font-weight:800;color:var(--ink)}
  .rq-ev-sub{font-size:11.5px;color:var(--ink-soft);line-height:1.5;margin-top:3px}
  .rq-chips{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:16px}

  .rq-group{margin-bottom:22px}
  .rq-group-head{
    display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:var(--radius-sm);
    background:var(--surface-sunk);margin-bottom:10px;cursor:pointer;
  }
  .rq-group-head.needs{background:var(--red-soft)}
  .rq-group-head.quick{background:var(--amber-soft)}
  .rq-group-head.done{background:var(--green-soft)}
  .rq-group-caret{font-size:10px;color:var(--ink-faint);transition:transform var(--dur-fast) var(--ease);flex:none}
  .rq-group.collapsed .rq-group-caret{transform:rotate(-90deg)}
  .rq-group.collapsed .rq-group-body{display:none}
  .rq-group-t{font-size:12.5px;font-weight:800;color:var(--ink)}
  .rq-group-s{font-size:11px;color:var(--ink-soft);line-height:1.4}
  .rq-group-n{
    margin-left:auto;font-size:11px;font-weight:800;font-variant-numeric:tabular-nums;
    background:var(--panel);color:var(--ink-soft);border-radius:var(--radius-pill);padding:3px 9px;flex:none;
  }
  .rq-group-act{flex:none}

  /* A row in the "one click each" group. Deliberately a single line: the whole
     claim is that reading it is the work, and a card would imply otherwise. */
  .rq-quick{
    display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:11px;align-items:center;
    padding:9px 13px;border:1px solid var(--panel-line);border-radius:var(--radius-sm);
    background:var(--panel);margin-bottom:6px;
  }
  .rq-quick.done{background:var(--panel-soft);border-color:transparent}
  .rq-quick-kind{
    font-size:9.5px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;
    padding:3px 7px;border-radius:var(--radius-pill);flex:none;
    background:var(--amber-soft);color:var(--amber);
  }
  .rq-quick-kind.proc{background:var(--brand-soft);color:var(--brand-ink)}
  .rq-quick-kind.admin{background:var(--surface-sunk);color:var(--ink-faint)}
  .rq-quick-txt{font-size:12.5px;color:var(--ink);line-height:1.45;min-width:0}
  .rq-quick-txt b{font-weight:700}
  .rq-quick-id{font-size:10.5px;color:var(--ink-faint);font-variant-numeric:tabular-nums}
  .rq-quick-acts{display:flex;gap:6px;align-items:center;flex:none}

  /* "Showing 15 of 170" + the two ways to see more. Sits inside the group so
     it scrolls with it, and states the true total — a capped list that does
     not say it is capped is the same defect as a wrong count. */
  .rq-more{
    display:flex;align-items:center;gap:10px;flex-wrap:wrap;
    padding:11px 13px;margin-top:8px;border:1px dashed var(--panel-line);
    border-radius:var(--radius-sm);background:var(--panel-soft);
  }
  .rq-more-n{font-size:11.5px;font-weight:700;color:var(--ink-soft);flex:1;min-width:160px}
  .rq-more .btn{font-size:11.5px;padding:6px 12px}

  .rq-done-row{
    display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:11px;align-items:center;
    padding:8px 13px;border-bottom:1px solid var(--panel-line);font-size:12px;color:var(--ink-soft);
  }
  .rq-done-row:last-child{border-bottom:none}
  /* Closed on nothing, and mandatory. Not an error — the submission check is
     what actually stops it — but it should not sit here looking identical to a
     requirement somebody answered. */
  .rq-done-row.bare{background:var(--amber-soft);border-radius:var(--radius-sm);padding-left:9px;padding-right:9px}
  .rq-done-row.bare .rq-done-tick{color:var(--amber)}
  .rq-done-tick{color:var(--green);font-weight:800;flex:none}

  .rq-verify{
    border:1px solid var(--panel-line);border-radius:var(--radius);padding:14px 16px;
    background:var(--panel);margin-bottom:16px;
  }
  .rq-verify-t{font-size:12.5px;font-weight:800;color:var(--ink);margin-bottom:8px;display:flex;align-items:center;gap:8px}
  .rq-verify-row{display:flex;gap:9px;align-items:flex-start;font-size:11.5px;color:var(--ink-soft);line-height:1.5;padding:4px 0}
  .rq-verify-row .ic{flex:none;font-weight:800}
  .rq-verify-row.up .ic{color:var(--green)}
  .rq-verify-row.flag .ic{color:var(--red-ink)}
  .rq-verify-row b{color:var(--ink)}

  /* ── Step 5 · The annex pack and the pre-submission check ──────────────── */
  .anx{border:1px solid var(--panel-line);border-radius:var(--radius);background:var(--panel);padding:16px 18px;margin-bottom:16px}
  .anx-head{display:flex;gap:13px;align-items:flex-start;flex-wrap:wrap;margin-bottom:12px}
  .anx-head-main{flex:1;min-width:260px}
  .anx-title{font-size:13px;font-weight:800;color:var(--ink)}
  .anx-sub{font-size:11.5px;color:var(--ink-soft);line-height:1.55;margin-top:3px}
  .anx-row{
    display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:11px;align-items:center;
    padding:9px 0;border-top:1px solid var(--panel-line);
  }
  .anx-badge{
    width:34px;height:26px;border-radius:6px;display:grid;place-items:center;flex:none;
    font-size:9.5px;font-weight:800;color:var(--on-accent);letter-spacing:.02em;
  }
  .anx-name{font-size:12.5px;font-weight:600;color:var(--ink);word-break:break-word}
  .anx-meta{font-size:10.5px;color:var(--ink-faint);margin-top:2px}
  .anx-acts{display:flex;gap:9px;align-items:center;flex:none;font-size:11.5px;font-weight:700}
  .anx-acts a{color:var(--brand);cursor:pointer}
  .anx-acts a.danger{color:var(--red-ink)}
  .anx-empty{font-size:12px;color:var(--ink-faint);padding:10px 0;border-top:1px solid var(--panel-line)}

  /* ── Step 5 · document-by-document review ───────────────────────────────
     Built on the same card as the final control, because it is the same kind
     of statement about the package — but it says something the final control
     cannot: what is inside each file. The read/unread tick leads every row,
     since "which of these has actually been checked" is the question the
     screen exists to answer. */
  .pkr{border:1px solid var(--panel-line);border-radius:var(--radius);background:var(--panel);
    padding:16px 18px;margin-bottom:16px}
  .pkr.ready{border-color:var(--green);background:color-mix(in srgb,var(--green-soft) 26%,var(--panel))}
  .pkr-head{display:flex;gap:13px;align-items:flex-start}
  .pkr-ic{font-size:19px;line-height:1.2;flex-shrink:0}
  .pkr-head-main{min-width:0;flex:1}
  .pkr-title{font-size:14px;font-weight:800;color:var(--ink)}
  .pkr-sub{font-size:12px;color:var(--ink-soft);line-height:1.6;margin-top:3px;max-width:78ch}
  .pkr-head .btn{flex-shrink:0;white-space:nowrap}
  .pkr-empty{font-size:12.5px;color:var(--ink-soft);line-height:1.6;margin-top:14px;
    padding:13px 15px;background:var(--panel-soft);border-radius:var(--radius-sm);max-width:82ch}
  .pkr-sec-t{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.5px;
    color:var(--ink-soft);margin:18px 0 9px}

  /* Competences: the verdict pill first, so the column of them reads down. */
  .pkr-comps{display:flex;flex-direction:column;gap:9px}
  .pkr-comp{display:flex;gap:10px;align-items:flex-start;font-size:12.5px}
  .pkr-comp .tiq-pill{flex-shrink:0;margin-top:1px}
  .pkr-comp-b{min-width:0}
  .pkr-comp-n{font-weight:700;color:var(--ink);line-height:1.45}
  .pkr-comp-th{font-size:11.5px;color:var(--ink-faint);line-height:1.5;margin-top:2px}
  .pkr-comp-d{display:flex;flex-wrap:wrap;gap:5px;margin-top:5px}
  .pkr-comp-doc{font-size:11px;padding:2px 8px;border-radius:20px;
    background:var(--panel-soft);color:var(--ink-soft)}
  .pkr-comp-doc.untraced{background:var(--amber-soft);color:var(--amber);font-weight:700;cursor:help}
  .pkr-comp-none{font-size:11.5px;color:var(--red);font-weight:600}

  .pkr-note{font-size:12px;line-height:1.6;margin-top:13px;padding:10px 13px;
    border-radius:var(--radius-sm);background:var(--panel-soft);color:var(--ink-soft);max-width:82ch}
  .pkr-note.warn{background:var(--amber-soft);color:var(--amber)}
  .pkr-note.bad{background:var(--red-soft);color:var(--red)}
  .pkr-note b{color:inherit}

  /* One row per document. */
  .pkr-docs{display:flex;flex-direction:column;gap:8px}
  .pkr-doc{border:1px solid var(--panel-line);border-radius:var(--radius-sm);background:var(--panel-soft)}
  .pkr-doc.is-read{background:var(--panel)}
  .pkr-doc-h{display:flex;gap:10px;align-items:center;padding:10px 13px;flex-wrap:wrap}
  .pkr-doc-b{min-width:0;flex:1}
  .pkr-doc-n{font-size:12.5px;font-weight:700;color:var(--ink);word-break:break-word}
  .pkr-doc-m{font-size:11px;color:var(--ink-faint);line-height:1.5;margin-top:2px}
  .pkr-doc-a{display:flex;gap:6px;align-items:center;flex-wrap:wrap;flex-shrink:0}
  /* Read or not read, before any verdict. An empty circle is not a failure —
     it is work not done yet, and it must not read as a red mark. */
  .pkr-tick{width:19px;height:19px;border-radius:50%;display:flex;align-items:center;
    justify-content:center;font-size:11px;font-weight:800;flex-shrink:0}
  .pkr-tick.read{background:var(--green-soft);color:var(--green)}
  .pkr-tick.stale{background:var(--amber-soft);color:var(--amber)}
  .pkr-tick.unread{background:var(--surface-sunk);color:var(--ink-faint)}
  /* Checked, and not fine. Distinct from unread on purpose: the work was done,
     and the answer was that this file cannot do its job. */
  .pkr-tick.problem{background:var(--red-soft);color:var(--red)}

  /* The judgement. Prose first: it is what was asked for, and a table of
     coverage flags is not a judgement. */
  .pkr-doc-v{padding:0 13px 14px 42px;border-top:1px solid var(--panel-line);margin-top:-1px}
  .pkr-judge{font-size:13px;line-height:1.7;color:var(--ink);max-width:80ch;padding:12px 0 2px}
  .pkr-sub-t{font-size:10.5px;font-weight:800;text-transform:uppercase;letter-spacing:.5px;
    color:var(--ink-faint);margin:14px 0 7px}
  .pkr-find{display:flex;gap:9px;align-items:flex-start;padding:6px 0;font-size:12.5px}
  .pkr-find .tiq-pill{flex-shrink:0;margin-top:1px}
  .pkr-find-n{font-weight:700;color:var(--ink);line-height:1.45}
  .pkr-find-note{font-size:12px;color:var(--ink-soft);line-height:1.6;margin-top:2px;max-width:76ch}
  .pkr-quote{font-size:11.5px;color:var(--ink-soft);line-height:1.6;margin-top:5px;
    padding:6px 11px;border-left:2px solid var(--panel-line);background:var(--panel-soft);
    border-radius:0 var(--radius-sm) var(--radius-sm) 0;max-width:76ch;font-style:italic}
  .pkr-quote.untraced{border-left-color:var(--amber);background:var(--amber-soft);color:var(--amber)}
  .pkr-untraced-n{font-style:normal;font-weight:700;font-size:11px}
  .pkr-absent{display:flex;flex-wrap:wrap;gap:5px}
  .pkr-absent-n{font-size:11px;padding:2px 8px;border-radius:20px;background:var(--surface-sunk);
    color:var(--ink-faint);cursor:help}
  .pkr-concerns{margin:0;padding-left:18px;font-size:12.5px;line-height:1.65;color:var(--ink-soft);max-width:78ch}
  .pkr-concerns li{margin-bottom:3px}

  /* Suggested questions: the chat should not be an empty box at the one moment
     somebody is unsure what to ask. */
  .pkr-asks{display:flex;flex-wrap:wrap;gap:7px;margin-top:13px}
  .pkr-ask-q{font-size:11.5px;padding:7px 13px;border-radius:20px;cursor:pointer;
    border:1px solid var(--panel-line);background:var(--panel-soft);color:var(--ink-soft);
    text-align:left;line-height:1.45;max-width:100%}
  .pkr-ask-q:hover{border-color:var(--brand);color:var(--brand-ink);background:var(--brand-soft)}

  /* The chat drawer, when it is answering from the package rather than the
     tender. Same drawer, and the reader has to be able to tell. */
  .chat-panel.scope-package .chat-head{background:var(--brand-soft)}

  .sck{border:1px solid var(--panel-line);border-radius:var(--radius);background:var(--panel);padding:16px 18px;margin-bottom:16px}
  .sck.ready{border-color:color-mix(in srgb,var(--green) 38%,var(--panel-line))}
  .sck.blocked{border-color:color-mix(in srgb,var(--red) 34%,var(--panel-line))}
  .sck-head{display:flex;gap:13px;align-items:flex-start;flex-wrap:wrap}
  .sck-ic{width:34px;height:34px;border-radius:var(--radius-sm);flex:none;display:grid;place-items:center;background:var(--surface-sunk);font-size:16px}
  .sck-head-main{flex:1;min-width:240px}
  .sck-title{font-size:13px;font-weight:800;color:var(--ink)}
  .sck-sub{font-size:11.5px;color:var(--ink-soft);line-height:1.55;margin-top:3px}
  .sck-verdict{
    display:flex;gap:10px;align-items:center;margin-top:14px;padding:11px 13px;border-radius:var(--radius-sm);
    font-size:12.5px;font-weight:700;line-height:1.45;
  }
  .sck-verdict.ready{background:var(--green-soft);color:var(--green)}
  .sck-verdict.blocked{background:var(--red-soft);color:var(--red-ink)}
  .sck-verdict.stale{background:var(--amber-soft);color:var(--amber)}
  .sck-sec{margin-top:14px}
  .sck-sec-t{
    font-size:10.5px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;
    color:var(--ink-faint);margin-bottom:7px;
  }
  .sck-find{
    display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px;align-items:start;
    padding:8px 0;border-top:1px solid var(--panel-line);font-size:12px;line-height:1.5;color:var(--ink-soft);
  }
  .sck-find .ic{font-weight:800;flex:none}
  .sck-find.blocker .ic{color:var(--red-ink)}
  .sck-find.warning .ic{color:var(--amber)}
  .sck-find b{color:var(--ink);font-weight:700}
  .sck-find-src{font-size:10px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-faint);margin-left:6px}
  .sck-docs{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}
  .sck-doc{
    font-size:10.5px;font-weight:700;padding:4px 9px;border-radius:var(--radius-pill);
    background:var(--surface-sunk);color:var(--ink-soft);
  }
  .sck-doc.missing{background:var(--red-soft);color:var(--red-ink)}
  .sck-doc.ok{background:var(--green-soft);color:var(--green)}
  .sck-doc.review{background:var(--amber-soft);color:var(--amber)}

  /* ── Motion kit surfaces (A6/E5) ─────────────────────────────────────── */
  .topbar{transition:box-shadow var(--dur-mid) var(--ease),border-color var(--dur-mid) var(--ease)}
  .topbar.scrolled{box-shadow:var(--shadow);border-bottom-color:transparent}

  /* Spotlight / border-trail on an active card (E5). The glow is painted in a
     ::before so it never tints the card's own text. */
  .spotlight{position:relative;isolation:isolate}
  .spotlight::before{
    content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;
    opacity:0;transition:opacity var(--dur-mid) var(--ease);
    background:radial-gradient(220px circle at var(--spot-x,50%) var(--spot-y,50%),
      color-mix(in srgb,var(--brand) 15%,transparent), transparent 62%);
  }
  .spotlight:hover::before,.spotlight:focus-within::before{opacity:1}
  .spotlight:hover{border-color:color-mix(in srgb,var(--brand) 42%,var(--panel-line))}
  .btn.primary,.btn.cta{transition:transform var(--dur-fast) var(--ease),filter var(--dur-fast) var(--ease),box-shadow var(--dur-fast) var(--ease)}
  .btn.primary:active,.btn.cta:active{transform:scale(.97)!important}
  @media (prefers-reduced-motion:reduce){
    .spotlight::before{display:none}
    .btn.primary,.btn.cta{transform:none!important}
  }

  /* ── ⌘K command palette (A8) ─────────────────────────────────────────── */
  .cmdk{position:fixed;inset:0;z-index:420;display:flex;align-items:flex-start;justify-content:center;padding:12vh 20px 20px}
  .cmdk[hidden]{display:none}
  .cmdk-scrim{position:absolute;inset:0;background:color-mix(in srgb,var(--ink) 42%,transparent);backdrop-filter:blur(3px)}
  .cmdk-panel{
    position:relative;width:100%;max-width:620px;max-height:70vh;display:flex;flex-direction:column;
    background:var(--panel);border:1px solid var(--panel-line);border-radius:var(--radius-lg);
    box-shadow:var(--shadow-pop);overflow:hidden;
  }
  .cmdk-inputrow{display:flex;align-items:center;gap:10px;padding:14px 16px;border-bottom:1px solid var(--panel-line);color:var(--ink-faint)}
  .cmdk-inputrow input{
    flex:1;border:0;background:transparent;outline:none;
    font-family:inherit;font-size:15px;color:var(--ink);
  }
  .cmdk-inputrow input::placeholder{color:var(--ink-faint)}
  .cmdk-results{overflow-y:auto;padding:6px}
  .cmdk-group{font-size:10px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-faint);padding:10px 10px 5px}
  .cmdk-item{
    display:flex;align-items:center;gap:11px;width:100%;text-align:left;cursor:pointer;
    border:0;background:transparent;font-family:inherit;color:var(--ink);
    padding:9px 10px;border-radius:var(--radius-sm);
  }
  .cmdk-item[aria-selected="true"],.cmdk-item:hover{background:var(--brand-soft)}
  .cmdk-item[aria-selected="true"] .cmdk-title{color:var(--brand-ink)}
  .cmdk-ic{
    width:26px;height:26px;border-radius:7px;display:grid;place-items:center;flex:none;
    background:var(--surface-sunk);color:var(--ink-faint);
  }
  .cmdk-item[aria-selected="true"] .cmdk-ic{background:var(--gradient-brand);color:var(--on-accent)}
  .cmdk-body{min-width:0;flex:1}
  .cmdk-title{display:block;font-size:13.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .cmdk-sub{display:block;font-size:11.5px;color:var(--ink-faint);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:1px}
  .cmdk-empty{padding:34px 16px;text-align:center;color:var(--ink-faint);font-size:13px}
  .cmdk-foot{
    display:flex;gap:16px;padding:9px 16px;border-top:1px solid var(--panel-line);
    background:var(--surface-sunk);font-size:11px;color:var(--ink-faint);
  }
  .cmdk-foot span{display:inline-flex;align-items:center;gap:5px}
  .cmdk mark{background:color-mix(in srgb,var(--brand) 22%,transparent);color:inherit;border-radius:3px;padding:0 1px}
  @media (max-width:640px){ .cmdk-foot{display:none} .cmdk{padding-top:6vh} }

  /* ── Donut (D3) ──────────────────────────────────────────────────────── */
  .tiq-donut{position:relative;display:inline-grid;place-items:center;flex:none}
  .tiq-donut svg{display:block}
  .tiq-donut-track{stroke:var(--surface-sunk)}
  .tiq-donut-arc{transition:stroke-dasharray var(--dur-reveal) var(--ease)}
  .tiq-donut-arc.tone-ok{stroke:var(--green)}
  .tiq-donut-arc.tone-warn{stroke:var(--amber)}
  .tiq-donut-arc.tone-danger{stroke:var(--red)}
  .tiq-donut-arc.tone-info{stroke:var(--brand)}
  .tiq-donut-arc.tone-neutral{stroke:var(--panel-line)}
  .tiq-donut-centre{position:absolute;text-align:center;line-height:1.15}
  .tiq-donut-centre b{display:block;font-size:22px;font-weight:800;color:var(--ink);font-variant-numeric:tabular-nums}
  .tiq-donut-centre small{display:block;font-size:10.5px;color:var(--ink-faint);margin-top:2px}

  /* ── Insights ────────────────────────────────────────────────────────── */
  .ins-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:16px;margin-bottom:26px}
  .ins-card{background:var(--panel);border:1px solid var(--panel-line);border-radius:var(--radius);padding:18px 20px;box-shadow:var(--shadow)}
  .ins-h{font-size:14px;font-weight:800;color:var(--ink);margin:0 0 14px}
  .ins-h2{font-size:16px;font-weight:800;color:var(--ink);margin:30px 0 6px}
  .ins-note{font-size:12.5px;color:var(--ink-faint);margin:0 0 12px;max-width:70ch}
  .ins-empty{font-size:13px;color:var(--ink-faint);margin:0}
  .ins-bars{display:flex;flex-direction:column;gap:9px}
  .ins-bar-row{display:grid;grid-template-columns:104px 1fr 34px;align-items:center;gap:10px}
  .ins-bar-lbl{font-size:12px;font-weight:600;color:var(--ink-soft)}
  .ins-bar-track{height:9px;border-radius:var(--radius-pill);background:var(--surface-sunk);overflow:hidden}
  .ins-bar-fill{display:block;height:100%;border-radius:inherit;transition:width var(--dur-reveal) var(--ease)}
  .ins-bar-fill.tone-ok{background:var(--green)} .ins-bar-fill.tone-info{background:var(--brand)}
  .ins-bar-fill.tone-warn{background:var(--amber)} .ins-bar-fill.tone-danger{background:var(--red)}
  .ins-bar-fill.tone-neutral{background:var(--ink-faint)}
  .ins-bar-n{font-size:12.5px;font-weight:700;text-align:right;color:var(--ink);font-variant-numeric:tabular-nums}
  .ins-donut-row{display:flex;align-items:center;gap:22px;flex-wrap:wrap}
  .ins-legend{display:flex;flex-direction:column;gap:7px;min-width:180px;flex:1}
  .ins-legend-row{display:flex;align-items:center;gap:8px;font-size:12.5px}
  .ins-legend-lbl{flex:1;color:var(--ink-soft)}
  .ins-legend-n{font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums}
  .ins-dot{width:9px;height:9px;border-radius:3px;flex:none}
  .ins-dot.tone-ok{background:var(--green)} .ins-dot.tone-warn{background:var(--amber)}
  .ins-dot.tone-danger{background:var(--red)} .ins-dot.tone-neutral{background:var(--panel-line)}
  .ins-auth{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin-top:12px}
  .ins-auth-item{background:var(--panel);border:1px solid var(--panel-line);border-radius:var(--radius-sm);padding:13px 15px}
  .ins-auth-item b{display:block;font-size:13px;font-weight:700;color:var(--ink);line-height:1.35}
  .ins-auth-item span{display:block;font-size:11.5px;color:var(--ink-faint);margin-top:3px}

  /* ── Commercial risk (D2/D3) ─────────────────────────────────────────── */
  .pr-summary{
    display:flex;align-items:center;gap:24px;flex-wrap:wrap;
    background:var(--panel);border:1px solid var(--panel-line);border-radius:var(--radius);
    padding:18px 20px;box-shadow:var(--shadow);margin-bottom:20px;
  }
  .pr-summary-metrics{display:flex;gap:14px;flex-wrap:wrap;flex:1;min-width:260px}
  /* overflow:visible — the base .tiq-metric clips, and the sub-line here is
     a sentence ('reviewed 27-08 · 2 unverified'), not a two-word label. */
  .pr-summary-metrics .tiq-metric{box-shadow:none;border:none;background:transparent;padding:0;min-width:170px;overflow:visible}
  .pr-summary-metrics .tiq-metric-sub{white-space:normal}
  .pr-summary-donut{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
  .pr-legend{display:flex;flex-direction:column;gap:6px;align-items:flex-start}
  .pr-summary-actions{margin-left:auto}
  .pr-filter-note{font-size:12.5px;color:var(--ink-faint);margin-bottom:12px}

  /* Severity rail (D2): the level reads before a single word does. */
  .pr-issue{
    position:relative;background:var(--panel);border:1px solid var(--panel-line);
    border-left:4px solid var(--panel-line);border-radius:var(--radius);
    margin-bottom:12px;overflow:hidden;box-shadow:var(--shadow);
  }
  .pr-issue.rail-danger{border-left-color:var(--red)}
  .pr-issue.rail-warn{border-left-color:var(--amber)}
  .pr-issue.rail-info{border-left-color:var(--brand)}
  .pr-issue.rail-neutral{border-left-color:var(--panel-line)}
  .pr-issue-head{
    display:flex;align-items:center;gap:10px;width:100%;text-align:left;cursor:pointer;
    border:0;background:transparent;font-family:inherit;padding:13px 16px;color:var(--ink);
  }
  .pr-issue-head:hover{background:var(--surface-sunk)}
  .pr-headline{flex:1;min-width:0;font-size:13.5px;font-weight:700;line-height:1.45}
  .pr-chev{color:var(--ink-faint);flex:none;transition:transform var(--dur-fast) var(--ease)}
  .pr-issue-head[aria-expanded="true"] .pr-chev{transform:rotate(180deg)}

  /* The recommended question sits above the evidence — it is the only thing
     on the card anyone can act on. */
  .pr-ask{
    margin:0 16px 12px;padding:12px 14px;border-radius:var(--radius-sm);
    background:var(--brand-soft);border:1px solid color-mix(in srgb,var(--brand) 26%,transparent);
  }
  .pr-ask-label{font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--brand-ink)}
  .pr-ask-text{font-size:13px;line-height:1.6;color:var(--ink);margin-top:5px}
  .pr-ask-actions{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
  .pr-ask-actions .btn{font-size:12px;padding:6px 13px}

  .pr-figure{
    display:flex;align-items:baseline;gap:10px;margin:0 16px 12px;padding:10px 14px;
    background:var(--amber-soft);border-radius:var(--radius-sm);flex-wrap:wrap;
  }
  .pr-figure-label{font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--amber);flex:none}
  .pr-figure-text{font-size:13px;font-weight:600;color:var(--ink);line-height:1.5}

  .pr-issue-body{display:none;padding:0 16px 15px}
  .pr-issue-body.open{display:block}
  .pr-ref{font-size:11.5px;color:var(--ink-faint);margin-bottom:8px}
  @media (prefers-reduced-motion:reduce){ .pr-chev{transition:none} }

  /* One primary, its close helpers, then More (B5/D6). */
  .q-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:9px;align-items:center}

  /* ── Proposal: per-section status dots + provenance (D4) ─────────────── */
  .prop-dot{width:8px;height:8px;border-radius:50%;flex:none;margin-left:auto;display:inline-block}
  .prop-dot.tone-ok{background:var(--green)}
  .prop-dot.tone-warn{background:var(--amber)}
  .prop-dot.tone-danger{background:var(--red)}
  .prop-dot.tone-idle{background:var(--panel-line)}
  .prop-outline-n{font-size:11px;font-weight:700;color:var(--ink-faint);font-variant-numeric:tabular-nums;min-width:16px;text-align:right}

  .prop-prov{
    display:flex;align-items:flex-start;gap:10px;margin-bottom:14px;
    padding:12px 15px;border-radius:var(--radius-sm);font-size:12.5px;line-height:1.6;
  }
  .prop-prov.ok  {background:var(--green-soft);border:1px solid color-mix(in srgb,var(--green) 26%,transparent);color:var(--ink)}
  .prop-prov.warn{background:var(--amber-soft);border:1px solid color-mix(in srgb,var(--amber) 30%,transparent);color:var(--ink)}
  .prop-prov b{display:block;font-weight:700;margin-bottom:2px}
  .prop-prov .prop-prov-ic{flex:none;font-size:14px;line-height:1.2}
  .prop-prov-srcs{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}

  /* ── Export: one primary action + grouped package (D5) ───────────────── */
  .exp-submit{
    display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:18px;
    background:var(--panel);border:1px solid var(--panel-line);border-radius:var(--radius);
    padding:16px 20px;box-shadow:var(--shadow);
  }
  .exp-submit.ready{border-color:color-mix(in srgb,var(--green) 40%,transparent);background:var(--green-soft)}
  .exp-submit-main{flex:1;min-width:220px}
  .exp-submit-main b{display:block;font-size:15px;font-weight:800;color:var(--ink)}
  .exp-submit-main span{display:block;font-size:12.5px;color:var(--ink-soft);margin-top:3px;line-height:1.5}
  /* Unfolds under the submit block when somebody records a submission that
     happened outside TenderIQ. Sits directly beneath it, sharing its margin,
     so the two read as one control rather than a stray form. */
  .exp-sent-form{
    display:flex;align-items:flex-end;gap:12px;flex-wrap:wrap;margin:-8px 0 18px;
    background:var(--panel);border:1px solid var(--panel-line);border-radius:var(--radius);
    padding:14px 20px;box-shadow:var(--shadow);
  }
  .exp-sent-form label{
    display:flex;flex-direction:column;gap:5px;font-size:11px;font-weight:700;
    letter-spacing:.5px;text-transform:uppercase;color:var(--ink-soft);
  }
  .exp-sent-form input{
    font-family:inherit;font-size:12.5px;color:var(--ink);background:var(--panel);
    border:1px solid var(--panel-line);border-radius:var(--radius-sm);padding:7px 10px;min-width:150px;
  }
  .exp-group{display:flex;align-items:center;gap:9px;margin:18px 0 9px}
  .exp-group:first-child{margin-top:2px}
  .exp-group-lbl{font-size:10.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft)}

  /* ── Dashboard: gradient band + needs-you-now (B3) ───────────────────── */
  .dash-band{
    position:relative;isolation:isolate;overflow:hidden;
    display:flex;align-items:center;gap:20px;flex-wrap:wrap;
    background:var(--gradient-brand);color:var(--on-accent);
    border-radius:var(--radius-lg);padding:22px 26px;margin-bottom:20px;
    box-shadow:var(--shadow-raised);
  }
  .dash-band-mesh{
    position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.5;
    background:
      radial-gradient(40% 70% at 88% 12%, rgba(255,255,255,.30), transparent 70%),
      radial-gradient(34% 60% at 8% 96%,  rgba(255,255,255,.18), transparent 72%);
  }
  .dash-band-text{flex:1;min-width:220px}
  .dash-band h1{font-size:22px;font-weight:800;letter-spacing:-.015em;margin:0;color:var(--on-accent)}
  .dash-band p{font-size:13px;margin:5px 0 0;color:rgba(255,255,255,.88);line-height:1.5}
  /* Solid on the gradient rather than another gradient, so the label keeps a
     4.5:1 ratio against its own background (E7). */
  .dash-band-cta{
    background:var(--panel);color:var(--brand-ink);border-color:transparent;
    font-weight:700;flex:none;box-shadow:var(--shadow-raised);
  }
  .dash-band-cta:hover{background:var(--panel);filter:brightness(.97)}

  .dash-needs{
    background:var(--panel);border:1px solid var(--panel-line);border-radius:var(--radius);
    padding:16px 18px;margin-bottom:20px;box-shadow:var(--shadow);
  }
  .dash-needs-head{display:flex;align-items:center;gap:10px;margin-bottom:12px;flex-wrap:wrap}
  .dash-needs-head h2{font-size:14px;font-weight:800;color:var(--ink);margin:0}
  .dash-needs-list{display:flex;flex-direction:column;gap:8px}
  .dash-need{
    display:flex;align-items:center;gap:12px;width:100%;text-align:left;cursor:pointer;
    border:1px solid var(--panel-line);border-left:3px solid var(--red);
    border-radius:var(--radius-sm);background:var(--panel);
    padding:11px 14px;font-family:inherit;color:var(--ink);
  }
  .dash-need-main{flex:1;min-width:0}
  .dash-need-q{display:block;font-size:13px;font-weight:600;line-height:1.45;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .dash-need-sub{display:block;font-size:11.5px;color:var(--ink-faint);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  /* The empty case is a reassurance, not a void — it does not need the
     full 44px table-empty padding. */
  .dash-needs.empty .tiq-tbl-empty{padding:20px 16px}

  /* ── All Tenders: active-filter chips + deadline urgency (7.1) ───────── */
  .hist-chips{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:12px}
  .hist-chips:empty{display:none}
  .hist-chip{
    display:inline-flex;align-items:center;gap:7px;cursor:pointer;font-family:inherit;
    border:1px solid var(--brand);background:var(--brand-soft);color:var(--brand-ink);
    border-radius:var(--radius-pill);padding:4px 10px;font-size:11.5px;font-weight:700;
  }
  .hist-chip:hover{background:var(--panel)}
  .hist-chip span[aria-hidden]{font-size:14px;line-height:1;opacity:.7}
  .hist-dl{font-weight:600;font-variant-numeric:tabular-nums}
  .hist-dl.past{color:var(--red-ink)}
  .hist-dl.soon{color:var(--red-ink)}
  .hist-dl.near{color:var(--amber)}
  .ins-legend-note{
    display:flex;align-items:center;gap:8px;font-size:12.5px;
    margin-top:5px;padding-top:8px;border-top:1px solid var(--panel-line);
  }
  .ins-legend-note .ins-legend-lbl{color:var(--ink-faint)}

  /* ── Documents & AI table (7.3) ──────────────────────────────────────── */
  .doc-ext{
    display:inline-grid;place-items:center;width:38px;height:24px;border-radius:5px;
    font-size:9.5px;font-weight:800;letter-spacing:.03em;
  }
  .doc-zero{font-weight:800;color:var(--red-ink)}

  /* ── Legacy .tag classes on their soft fills ─────────────────────────────
     These predate the pill component and are still used on the workspace and
     dashboard. They inherit the corrected semantic tokens above, so they now
     clear AA without needing their own values. */
  .bell-badge{color:var(--on-solid);background:var(--solid-danger)}

  /* ── Form controls ──────────────────────────────────────────────────────
     `.form-input` was on the Knowledge Base, past-project and team fields but
     was never defined here, so every one of them fell back to a native OS
     widget — wrong font, wrong height, wrong border — sitting next to
     app-styled buttons. That is what made those pages read as a different
     product. The recipe is the one `.field input` and `.url-input` already use. */
  .form-input{
    width:100%;box-sizing:border-box;min-height:36px;padding:8px 11px;
    border:1px solid var(--panel-line);border-radius:var(--radius-sm);
    font-family:var(--font);font-size:13px;color:var(--ink);
    background-color:var(--panel-soft);
    outline:none;transition:border-color .15s,box-shadow .15s;
  }
  .form-input::placeholder{color:var(--ink-faint)}
  .form-input:focus{border-color:var(--brand);box-shadow:var(--focus-ring);background-color:var(--panel)}
  .form-input:disabled{background-color:var(--surface-sunk);color:var(--ink-faint);cursor:not-allowed}
  /* The KB inline editor drew its own 1.5px/12.5px control; same recipe now. */
  .kb-in{border-width:1px;font-size:13px;padding:8px 11px;min-height:36px;box-sizing:border-box}

  /* Native select chrome is drawn by the OS, so a dropdown never matched the
     inputs and buttons beside it. Suppressed, and replaced with a caret built
     from two gradients — it follows the theme tokens and needs no asset or
     wrapper element. Last in the file so it wins over each select's own
     `background` shorthand. `.prop-move-sel` is deliberately left out: it is
     borderless inline text, not a boxed field. */
  select.form-input,select.kb-in,.hi-assign-sel{
    -webkit-appearance:none;appearance:none;cursor:pointer;padding-right:30px;
    background-image:
      linear-gradient(45deg,transparent 50%,var(--ink-faint) 50%),
      linear-gradient(135deg,var(--ink-faint) 50%,transparent 50%);
    background-repeat:no-repeat;
    background-size:5px 5px,5px 5px;
    background-position:calc(100% - 16px) calc(50% - 1px),calc(100% - 12px) calc(50% - 1px);
  }
  /* Compact variant keeps its own caret inset. */
  .hi-assign-sel{
    padding-right:23px;
    background-position:calc(100% - 12px) calc(50% - 1px),calc(100% - 8px) calc(50% - 1px);
  }
  /* Once appearance is reset, Windows/Linux render the popup list unstyled. */
  .form-input option,.kb-in option,.hi-assign-sel option{background:var(--panel);color:var(--ink)}

  /* Field label and card heading, so pages stop hand-rolling both inline at
     slightly different sizes (14px here, 13.5px there). */
  .form-label{display:block;font-size:11.5px;font-weight:700;color:var(--ink-soft);margin-bottom:5px}
  .form-hint{font-size:11px;color:var(--ink-faint);line-height:1.45}
  .card-title{font-size:14px;font-weight:800;color:var(--ink);line-height:1.3}

  /* A row of fields and its action button share one baseline height. */
  .sg-row .btn{min-height:36px}
