/* Drift — design tokens v1.0 */
@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;700&display=swap');

:root {
  /* Dark (primary) surfaces */
  --midnight: #0B0F14;     /* canvas */
  --carbon:   #12171E;     /* surface */
  --carbon-2: #171D26;     /* raised surface */
  --carbon-3: #1E2530;
  --slate:    #232B35;     /* hairline */
  --ink:      #ECEFF3;
  --muted:    #7C8896;
  --faint:    #495464;

  /* Brand accents */
  --signal:   #C9F25D;     /* primary action / live signal — energetic */
  --signal-deep:#9BC22E;   /* light-theme signal */
  --drift:    #F2A03D;     /* drift / deviation from baseline */
  --drift-deep:#C2701A;

  /* Status meters (drift band) */
  --hold:  #5BE3B0;        /* on baseline */
  --watch: #F2C94C;        /* drifting */
  --break: #F2685C;        /* disengaging */

  /* Light surfaces (store assets / docs) */
  --l-canvas: #F4F6F3;
  --l-ink:    #0B0F14;

  --font: 'Space Grotesk', system-ui, sans-serif;
  --mono: 'JetBrains Mono', ui-monospace, monospace;

  --r-sm: 8px; --r-md: 14px; --r-lg: 20px; --r-xl: 28px;
}

.drift-dark {
  --canvas: var(--midnight); --surface: var(--carbon); --surface-2: var(--carbon-2);
  --line: var(--slate); --text: var(--ink); --primary: var(--signal);
  background: var(--canvas); color: var(--text);
}
.drift-light {
  --canvas: var(--l-canvas); --surface: #FFFFFF; --surface-2: #ECEFE9;
  --line: #DDE1DB; --text: var(--l-ink); --primary: var(--signal-deep); --muted: #5E6A5A;
  background: var(--canvas); color: var(--text);
}
* { box-sizing: border-box; }
