/* Design tokens (BUILD-SPEC §6.1). Dark only. Owned by the UI foundation: areas never edit this. */
:root{
  color-scheme:dark;
  --bg:#0C0E14; --surface:#10131B; --panel:#141824; --raised:#1A1F2D; --raised-2:#212739; --canvas:#0B0D13;
  --line:#242A3A; --line-2:#30374A;
  --text:#ECEFF5; --text-2:#B4BBCB; --muted:#7D869B; --faint:#5A6276; /* --faint: decoration only, fails AA */
  --lime:#C7FF4D; --lime-ink:#141A05; --lime-soft:rgba(199,255,77,.12); --lime-line:rgba(199,255,77,.35);
  --violet:#8B5CF6; --violet-soft:rgba(139,92,246,.16); --violet-text:#B9A0FF; --violet-line:rgba(139,92,246,.4);
  --warn:#F5B544; --warn-soft:rgba(245,181,68,.12); --warn-ink:#2A1C02; --warn-line:rgba(245,181,68,.35);
  --fail:#FF6B6B; --fail-soft:rgba(255,107,107,.12); --fail-line:rgba(255,107,107,.35);
  --pass:#7FE0A0; --pass-soft:rgba(127,224,160,.10); --pass-line:rgba(127,224,160,.3);
  --overlay:rgba(12,14,20,.78); --overlay-line:rgba(255,255,255,.08); --scrim:rgba(6,8,12,.66);
  --thumb-cool:radial-gradient(120% 90% at 50% 30%,#2A2F3E 0%,#171B26 70%);
  --thumb-warm:radial-gradient(120% 90% at 50% 25%,#3A2E24 0%,#191612 75%);
  --stage-warm:radial-gradient(110% 100% at 50% 25%,#3A2E24 0%,#15120F 80%);
  --viewer-bg:radial-gradient(70% 70% at 50% 40%,#1E2333 0%,#0B0D13 100%);
  --planned-stripes:repeating-linear-gradient(135deg,#141824 0 10px,#161B28 10px 20px);
  --head:"Space Grotesk",sans-serif; --ui:"Inter",system-ui,sans-serif; --mono:"JetBrains Mono",ui-monospace,monospace;
  --radius-xs:4px; --radius-badge:5px; --radius-seg:6px; --radius-sm:7px; --radius-ctl:8px; --radius-box:9px;
  --radius:10px; --radius-pop:11px; --radius-panel:12px; --radius-lg:14px; --radius-dialog:16px; --radius-pill:999px;
  --sp-1:2px; --sp-2:4px; --sp-3:6px; --sp-4:8px; --sp-5:10px; --sp-6:12px; --sp-7:14px; --sp-8:16px; --sp-9:20px; --sp-10:24px; --sp-11:28px; --sp-12:32px; --sp-13:40px; --sp-14:56px;
  --topbar-h:56px; --rail-w:232px; --inspector-w:344px; --queue-w:350px; --side-w:316px; --history-w:470px; --page-max:1120px;
  --ctl-h:32px; --ctl-h-sm:27px; --ctl-h-lg:40px; --input-h:36px; --disabled-opacity:.45;
  --shadow-pop:0 18px 40px -16px rgba(0,0,0,.8); --shadow-menu:0 24px 50px -18px rgba(0,0,0,.85);
  --shadow-dialog:0 30px 80px -20px rgba(0,0,0,.8),0 0 0 1px rgba(199,255,77,.06);
  --ring-sel:0 0 0 1px var(--lime); --glow-sel:0 0 0 1px var(--lime),0 10px 30px -12px rgba(199,255,77,.35);
  --ring-current:0 0 0 4px var(--lime-soft);
  --ease:cubic-bezier(.2,.7,.2,1); --t-fast:120ms; --t-med:160ms;
  --gutter:16px;
}
html,body{background:var(--surface);color:var(--text);font:13px/1.45 var(--ui);-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{font-family:var(--head);font-weight:600;letter-spacing:-.01em}
:focus-visible{outline:2px solid var(--lime);outline-offset:2px}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}