/* Design tokens: colours, elevation, spacing, radius, motion, the zoom-corrected viewport units. Loaded in the order web/index.html lists them; the order is the cascade. */
/* SaaS dashboard theme — deep-navy sidebar / cool content / royal-blue primary. Premium token system (autoplan). */
:root {
  --navy:#1a2332; --navy-2:#233042; --navy-3:#2c3b50; --navy-line:rgba(255,255,255,.09);
  --navy-ink:#eaf3f3; --navy-muted:#8fa3ad;
  /* cool neutrals — no green cast */
  --bg:#f4f6fb; --panel:#ffffff; --ink:#1a2230; --muted:#5b6675; --faint:#687182;  /* was #8a94a6 — 3.06:1 on white, failed AA everywhere it was used */
  --line:#e5e9f2; --line-soft:#eef1f7; --line-strong:#d8deeb; --ai-user-bg:#f4f4f5;
  --accent:#3b5bdb; --accent2:#6182f0; --accent-press:#2f49b0; --accent-soft:#eef1fe; --accent-soft-2:#dce3fb; --accent-ring:rgba(59,91,219,.35);
  --grad:linear-gradient(135deg,#3b5bdb,#6182f0);
  --card-grad:linear-gradient(135deg,#1a2332,#233a7a,#3b5bdb);
  /* status — AA-contrast text on soft bg */
  --ok:#067647; --ok-soft:#ecfdf3; --ok-line:#abefc6;
  --warn:#92400e; --warn-soft:#fffaeb; --warn-line:#fedf89;
  --bad:#b42318; --bad-soft:#fef3f2; --bad-line:#fecdca;
  --neutral:#475467; --neutral-soft:#f2f4f7; --neutral-line:#d0d5dd;
  /* elevation — cool, layered (contact + ambient), never one blur */
  --sh:26 34 52;
  --e-1:0 1px 2px rgba(var(--sh)/.04), 0 1px 3px rgba(var(--sh)/.06);
  --e-2:0 2px 4px rgba(var(--sh)/.04), 0 6px 16px -6px rgba(var(--sh)/.10);
  --e-3:0 4px 8px rgba(var(--sh)/.05), 0 14px 34px -12px rgba(var(--sh)/.14);
  --e-4:0 8px 16px rgba(var(--sh)/.06), 0 28px 60px -16px rgba(var(--sh)/.22);
  --e-focus:0 0 0 3px var(--accent-ring);
  --e-accent:0 6px 18px -6px rgba(59,91,219,.45);
  /* spacing (4px base) + radius scale */
  --s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px; --s-5:20px; --s-6:24px; --s-8:32px; --s-10:40px;
  --r-sm:8px; --r-md:10px; --r-lg:14px; --r-xl:18px; --r-pill:999px;
  /* motion */
  --ease:cubic-bezier(.2,.8,.2,1); --t-fast:.12s; --t-med:.18s; --t-slow:.24s;
  --mono:'JetBrains Mono',ui-monospace,monospace; --radius:14px; --sidebar-w:236px;
  /* Document zoom, and the viewport units corrected for it. Chrome at 90% was the target: it looks
     right because browser zoom enlarges the CSS viewport as it shrinks the pixels, so 100vw still
     spans the window. CSS `zoom` does NOT do that half -- it scales the painting and leaves 100vw
     reporting the unscaled width -- so every viewport-relative length comes out 10% short and the
     content rail drifts off centre. --vw and --vh are 100/0.81, which is the half `zoom` leaves out.
     Change --zoom and these two together or the layout silently skews. */
  --zoom:.81; --vw:123.457vw; --vh:123.457vh;
  /* Aliases for tokens the code already references but nobody ever defined. Until now every var(--acc)
     rendered the FALLBACK, so the app shipped a second blue, a darker ink, and four near-identical greys
     (#f1f3f8 / #f4f6fb / #f6f7fb / #f7f9fc) depending on which line you happened to read. */
  --acc:var(--accent); --text:var(--ink); --panel2:var(--line-soft); --n-50:var(--line-soft);
  --font-display:'Sora',Inter,system-ui,sans-serif;
}