/* ============================================================================
   SAFETY-CAM — design tokens (single source of truth)

   Canonical home:  public/tokens.css
   Mirrored byte-for-byte to dashboard/static/tokens.css via `npm run sync:tokens`
   so the Astro marketing/docs site AND the live bench dashboard share ONE visual
   language. Holds NO secrets — safe to serve publicly.

   Visual direction: "instrument panel" (A) with oscilloscope / datasheet accents
   (C). See prototypes/final/index.html for the realized reference.
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;700&display=swap');

:root {
  /* — Surfaces — */
  --bg: #0a0e13;
  --bg-raised: #121821;
  --bg-surface: #19212c;
  --border: #28323f;
  --border-hair: #1a212b;

  /* — Text — */
  --text: #c9d4e0;
  --text-muted: #7d8a99;
  --text-dim: #5a646f;
  --heading: #f0f5fb;

  /* — Brand / action — */
  --accent: #4c9aff;
  --accent-press: #2f7be0;

  /* — Signal palette: maps 1:1 to the graded speed scale + bench safety states.
       --signal-go is RATIONED — it means only "measured & passing". — */
  --signal-go: #3fb950;
  --signal-slow: #d29922;
  --signal-stop: #f85149;

  /* — Accents — */
  --vcsel: #b48cff;                 /* 940 nm projector motif (sparse) */
  --scope: #3dd7b0;                 /* phosphor green-cyan — scope + §-numbers ONLY */
  --scope-dim: #1c6b5e;
  --speed-grad: linear-gradient(90deg, #3fb950, #d29922, #f85149);

  /* — Type — */
  --mono: 'JetBrains Mono', 'SF Mono', 'Cascadia Code', 'Roboto Mono', ui-monospace,
    'Liberation Mono', Menlo, Consolas, monospace;
  --sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica,
    Arial, sans-serif;

  /* — Spacing (4px grid) — */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-24: 96px;

  /* — Geometry — */
  --maxw: 1200px;
  --maxw-prose: 920px;
  --radius: 8px;
  --radius-sm: 6px;
}