/* BAFOS Design Tokens - Generated from tokens.json */
:root, [data-theme="light"] {
  --surface-0: #f7f6f2;
  --surface-1: #ffffff;
  --surface-2: #eceef3;
  --line: #dadee7;
  --line-strong: #bdc3d1;
  --ink: #0f1420;
  --ink-hover: #252c3d;
  --ink-muted: #566079;
  --ink-faint: #747e96;
  --control-border: var(--ink-faint);
  --ignition: #eb4a14;
  --ignition-hover: #ff5f2b;
  --ignition-text: #b7360b;
  --ignition-tint: #fde9e1;
  --on-ignition: #0f1420;
  --circuit: #2450d6;
  --circuit-tint: #e4eafd;
  --focus-ring: var(--circuit);
  --on-track: #0f7a4b;
  --on-track-tint: #ddf3e8;
  --at-risk: #8a5a00;
  --at-risk-tint: #fbefcf;
  --stalled: #b4233a;
  --stalled-tint: #fbe0e4;
  --brand-ink: #0f1420;
  --brand-paper: #f7f6f2;
  --brand-ignition: #eb4a14;
  --chart-1: #2450d6;
  --chart-2: #eb4a14;
  --chart-3: #0e8f83;
  --chart-4: #7a4fd8;
  --chart-5: #566079;
  --shadow-sm: 0 1px 2px rgba(15,20,32,0.08);
  --shadow-md: 0 4px 16px rgba(15,20,32,0.10);
  --shadow-lg: 0 16px 40px rgba(15,20,32,0.16);
}

[data-theme="dark"] {
  --surface-0: #0f1420;
  --surface-1: #171d2b;
  --surface-2: #1f2636;
  --line: #2c344a;
  --line-strong: #46506a;
  --ink: #f7f6f2;
  --ink-hover: #dadee7;
  --ink-muted: #a3acc2;
  --ink-faint: #747e96;
  --control-border: var(--ink-faint);
  --ignition: #ff6a33;
  --ignition-hover: #ff8557;
  --ignition-text: #ff8a5c;
  --ignition-tint: #3a1d14;
  --on-ignition: #0f1420;
  --circuit: #7c9cff;
  --circuit-tint: #1b2547;
  --focus-ring: var(--circuit);
  --on-track: #3dd68c;
  --on-track-tint: #12301f;
  --at-risk: #f2b53b;
  --at-risk-tint: #3a2b0a;
  --stalled: #ff6f85;
  --stalled-tint: #3d161e;
  --brand-ink: #0f1420;
  --brand-paper: #f7f6f2;
  --brand-ignition: #eb4a14;
  --chart-1: #7c9cff;
  --chart-2: #ff6a33;
  --chart-3: #3ccfc0;
  --chart-4: #a98bff;
  --chart-5: #a3acc2;
  --shadow-sm: 0 1px 2px rgba(0,0,0,0.5);
  --shadow-md: 0 4px 16px rgba(0,0,0,0.5);
  --shadow-lg: 0 16px 40px rgba(0,0,0,0.6);
}

:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 20px;
  --radius-pill: 999px;
  --control-sm: 32px;
  --control-md: 40px;
  --control-lg: 48px;
  --sidebar-width: 248px;
  --container-max: 1200px;
  --font-display: "Space Grotesk", "Inter", system-ui, sans-serif;
  --font-ui: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;
}