/* =================================================================
   Detonative Labs — design tokens
   Source: Detonative Labs design system (tokens.json, Nov 2026),
   locked from the app redesign. Shared by detonative.com and the app.
   Light theme only.
   ================================================================= */

:root {
  /* Surfaces */
  --surface-page: #F5F5F2;
  --surface-card: #FFFFFF;
  --surface-sunken: #F7F7F4;
  --surface-row-hover: #F8F8F5;
  --surface-hover: #F1F1EE;
  --surface-active: #ECECE8;
  --surface-muted: #EFEFEC;
  --surface-footer: #FAFAF8;

  /* Lines */
  --border-subtle: #EEEEEA;
  --border-divider: #E8E8E4;
  --border-default: #E3E3DE;
  --border-strong: #D6D6D0;
  --line-muted: #C4C4BE;
  --dot-grid: #DEDED8;

  /* Text */
  --ink: #17171A;
  --ink-strong: #0A0A0C;
  --text-secondary: #3A3A40;
  --text-muted: #5C5C66;
  --text-subtle: #6B6B75;
  --text-disabled: #8E8E96; /* placeholders, dashes, the "labs" half of the wordmark only */

  /* Action / live */
  --accent: #C93516;     /* Flame */
  --on-accent: #FFFFFF;

  /* Outcomes */
  --supported: #2F6FDB;  /* Win (not falsified) */
  --supported-text: #2A62C4;
  --supported-surface: #F2F6FE;
  --supported-footer: #EAF0FB;
  --supported-border: #C7D5EE;
  --supported-rule: #D3DEF2;
  --supported-track: #E1E8F5;
  --supported-band: rgba(47, 111, 219, 0.16);
  --falsified: #A05E00;  /* Loss (falsified) */
  --control-series: #A3A39D;

  /* Stages */
  --stage-draft: #8E8E96;
  --stage-review: var(--falsified);
  --stage-approved: var(--supported);
  --stage-running: var(--accent);
  --stage-concluded: var(--ink);

  /* Projects */
  --project-1: #2F6FDB;
  --project-2: #7B5CE0;
  --project-3: #A05E00;

  /* Type */
  --font-sans: Inter, ui-sans-serif, system-ui, sans-serif;
  --font-display: "Space Grotesk", ui-sans-serif, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, monospace;

  /* Spacing */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 28px;
  --space-8: 32px;
  --space-9: 36px;
  --space-16: 64px;

  /* Radius */
  --radius-xs: 5px;
  --radius-sm: 8px;
  --radius-md: 10px;
  --radius-lg: 12px;
  --radius-xl: 14px;
  --radius-2xl: 16px;
  --radius-pill: 999px;

  /* Shadow — the only one; the system otherwise uses borders */
  --shadow-raised: 0 1px 2px rgba(20, 20, 20, 0.12);

  /* Layout */
  --sidebar-width: 248px;
  --topbar-height: 56px;
  --content-max: 1240px;
  --dot-pitch: 22px;
  --control-height: 40px;

  /* Motion */
  --dur: 0.15s;
  --easing: ease;
}