/* Handle — generated from tokens.json */
:root, [data-theme="light"] {
  --gray-0: #ffffff;
  --gray-50: #fafafa;
  --gray-75: #f7f7f7;
  --gray-100: #f2f2f2;
  --gray-150: #ededed;
  --gray-200: #e8e8e8;
  --gray-300: #d6d6d6;
  --gray-400: #a3a3a3;
  --gray-500: #8f8f8f;
  --gray-600: #6b6b6b;
  --gray-700: #404040;
  --gray-750: #383838;
  --gray-800: #2e2e2e;
  --gray-850: #242424;
  --gray-900: #1f1f1f;
  --gray-925: #171717;
  --gray-950: #101010;
  --gray-1000: #0a0a0a;
  --white: #ffffff;
  --black: #000000;
  --paper: #f5f5f3;
  --canvas: var(--gray-75);
  --canvas-alt: var(--gray-100);
  --surface: var(--gray-0);
  --surface-raised: var(--gray-50);
  --control: var(--gray-150);
  --control-hover: var(--gray-200);
  --track: var(--gray-200);
  --line: var(--gray-200);
  --line-strong: var(--gray-300);
  --control-line: var(--gray-500);
  --ink: var(--gray-1000);
  --ink-2: var(--gray-700);
  --ink-muted: var(--gray-600);
  --primary: var(--gray-1000);
  --primary-hover: var(--gray-700);
  --on-primary: var(--gray-0);
  --inverse: var(--gray-1000);
  --on-inverse-muted: #b3b3b3;
  --link: var(--gray-1000);
  --link-hover: var(--gray-600);
  --focus: var(--gray-1000);
  --selected: var(--gray-100);
  --highlight: var(--gray-150);
  --evidence: var(--gray-50);
  --evidence-mark: var(--gray-200);
  --scrim: rgba(10,10,10,0.4);
  --ok: #1c6644;
  --ok-soft: #e6f2ea;
  --warn: #855000;
  --warn-soft: #f8eedb;
  --bad: #a1302a;
  --bad-soft: #f8e4e1;
  --info: #22568a;
  --info-soft: #e4ecf5;
  --escalation: #4f3d86;
  --escalation-soft: #ece8f6;
  --shadow-sm: 0 0 4px rgba(179,179,179,0.07), 0 3px 6px -1px rgba(179,179,179,0.22);
  --shadow-md: 0 4px 16px rgba(0,0,0,0.12);
  --shadow-overlay: 0 24px 64px rgba(0,0,0,0.18);
}
[data-theme="dark"] {
  --canvas: var(--gray-925);
  --canvas-alt: var(--gray-950);
  --surface: var(--gray-900);
  --surface-raised: var(--gray-850);
  --control: var(--gray-850);
  --control-hover: var(--gray-750);
  --track: var(--gray-950);
  --line: var(--gray-800);
  --line-strong: var(--gray-750);
  --control-line: #6f6f6f;
  --ink: var(--paper);
  --ink-2: #d4d4d2;
  --ink-muted: var(--gray-400);
  --primary: var(--paper);
  --primary-hover: var(--gray-300);
  --on-primary: var(--gray-925);
  --inverse: var(--paper);
  --on-inverse-muted: #5c5c5c;
  --link: var(--paper);
  --link-hover: var(--gray-400);
  --focus: var(--paper);
  --selected: var(--gray-850);
  --highlight: var(--gray-800);
  --evidence: var(--gray-950);
  --evidence-mark: var(--gray-750);
  --scrim: rgba(0,0,0,0.6);
  --ok: #8fd4ad;
  --ok-soft: rgba(143,212,173,0.12);
  --warn: #f0cf8e;
  --warn-soft: rgba(240,207,142,0.12);
  --bad: #f2ada6;
  --bad-soft: rgba(242,173,166,0.12);
  --info: #a9cbee;
  --info-soft: rgba(169,203,238,0.12);
  --escalation: #cbbef2;
  --escalation-soft: rgba(203,190,242,0.12);
  --shadow-sm: 0 0 0 1px rgba(255,255,255,0.04), 0 3px 6px -1px rgba(0,0,0,0.4);
  --shadow-md: 0 4px 16px rgba(0,0,0,0.5);
  --shadow-overlay: 0 24px 64px rgba(0,0,0,0.6);
}
:root {
  --space-2: 2px;
  --space-4: 4px;
  --space-8: 8px;
  --space-12: 12px;
  --space-16: 16px;
  --space-20: 20px;
  --space-24: 24px;
  --space-32: 32px;
  --space-40: 40px;
  --space-48: 48px;
  --space-64: 64px;
  --space-96: 96px;
  --space-192: 192px;
  --radius-xs: 6px;
  --radius-sm: 10px;
  --radius-md: 14px;
  --radius-lg: 20px;
  --radius-xl: 28px;
  --radius-pill: 999px;
  --size-control-sm: 32px;
  --size-control: 40px;
  --size-control-lg: 48px;
  --size-rail: 248px;
  --size-content: 1200px;
  --z-skip: 10;
  --z-dialog: 20;
  --z-toast: 1000;
  --font-sans: 'Instrument Sans', -apple-system, system-ui, 'Segoe UI', sans-serif;
  --font-serif: 'Instrument Serif', Georgia, serif;
  --font-mono: 'IBM Plex Mono', ui-monospace, Menlo, monospace;
}
.display-xl { font-family: var(--font-sans); font-size: 80px; line-height: 1.0; font-weight: 500; letter-spacing: -0.04em; }
.display { font-family: var(--font-sans); font-size: 56px; line-height: 1.07; font-weight: 500; letter-spacing: -0.035em; }
.display-sm { font-family: var(--font-sans); font-size: 48px; line-height: 1.17; font-weight: 500; letter-spacing: -0.025em; }
.figure { font-family: var(--font-sans); font-size: 40px; line-height: 1.1; font-weight: 500; letter-spacing: -0.03em; }
.title-1 { font-family: var(--font-sans); font-size: 32px; line-height: 1.25; font-weight: 500; letter-spacing: -0.02em; }
.title-2 { font-family: var(--font-sans); font-size: 24px; line-height: 1.33; font-weight: 500; letter-spacing: -0.015em; }
.title-3 { font-family: var(--font-sans); font-size: 18px; line-height: 1.44; font-weight: 500; letter-spacing: -0.01em; }
.lead { font-family: var(--font-sans); font-size: 20px; line-height: 1.6; font-weight: 400; letter-spacing: -0.005em; }
.body-lg { font-family: var(--font-sans); font-size: 16px; line-height: 1.5; font-weight: 400; letter-spacing: 0em; }
.body { font-family: var(--font-sans); font-size: 14px; line-height: 1.43; font-weight: 400; letter-spacing: 0em; }
.label { font-family: var(--font-sans); font-size: 14px; line-height: 1.43; font-weight: 500; letter-spacing: 0em; }
.small { font-family: var(--font-sans); font-size: 13px; line-height: 1.38; font-weight: 400; letter-spacing: 0em; }
.caption { font-family: var(--font-sans); font-size: 12px; line-height: 1.33; font-weight: 500; letter-spacing: 0.005em; }
.wordmark { font-family: var(--font-sans); font-size: 22px; line-height: 1.0; font-weight: 600; letter-spacing: -0.03em; }
.accent { font-family: var(--font-serif); font-size: 80px; line-height: 1.0; font-weight: 400; letter-spacing: -0.02em; font-style: italic; }
.quote { font-family: var(--font-serif); font-size: 20px; line-height: 1.4; font-weight: 400; font-style: italic; }
.code { font-family: var(--font-mono); font-size: 12.5px; line-height: 1.6; font-weight: 400; }
.ref { font-family: var(--font-mono); font-size: 12px; line-height: 1.5; font-weight: 500; }
@font-face { font-family: 'Instrument Sans'; src: url('fonts/InstrumentSans-Variable.woff2') format('woff2'); font-weight: 400 700; font-style: normal; font-display: swap; }
@font-face { font-family: 'Instrument Sans'; src: url('fonts/InstrumentSans-Italic-Variable.woff2') format('woff2'); font-weight: 400 700; font-style: italic; font-display: swap; }
@font-face { font-family: 'Instrument Serif'; src: url('fonts/InstrumentSerif-Regular.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: 'Instrument Serif'; src: url('fonts/InstrumentSerif-Italic.woff2') format('woff2'); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: 'IBM Plex Mono'; src: url('fonts/IBMPlexMono-Regular.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: 'IBM Plex Mono'; src: url('fonts/IBMPlexMono-Medium.woff2') format('woff2'); font-weight: 500; font-style: normal; font-display: swap; }
