/* HYPERCTRL Design Tokens v1.1
   One token set, two surfaces, three scopes:
   :root                = Bone (day, default)
   .graphite            = Graphite applied page-wide (night mode, class on <html>)
   .invert              = a Graphite block on a Bone page
   .graphite .invert    = a Bone block on a Graphite page (inversion flips with the mode)
   Source of truth: Design System v1 with the r2 day/night revision (2026-07-28). */

:root{
  --surface-0:#F1EEE7; --surface-1:#F9F7F2; --surface-2:#E9E5DB;
  --ink-1:#191713; --ink-2:#565248; --ink-3:#706B5F;
  --line-1:#DCD7CA; --line-2:#B9B2A0;
  --accent:#2733C4; --accent-text:#2733C4; --on-accent:#F4F2EA;
  --pos:#2E7053; --warn:#8F6415; --crit:#A03B30;
  --sans:'Hanken Grotesk', system-ui, -apple-system, 'Helvetica Neue', Arial, sans-serif;
  --mono:'IBM Plex Mono', ui-monospace, 'SF Mono', Menlo, Consolas, monospace;
  --t-micro:120ms; --t-std:200ms; --t-struct:320ms; --ease:cubic-bezier(.2,0,0,1);
  --max:1160px; --radius-interactive:2px;
}

.invert, .graphite{
  --surface-0:#101214; --surface-1:#17191C; --surface-2:#1E2125;
  --ink-1:#ECE9E1; --ink-2:#A29D91; --ink-3:#8C887F;
  --line-1:#2A2D31; --line-2:#41454B;
  --accent:#4650E8; --accent-text:#8A94FF; --on-accent:#FFFFFF;
  --pos:#6FBE99; --warn:#D2A458; --crit:#DB7B6E;
}

.graphite .invert{
  --surface-0:#F1EEE7; --surface-1:#F9F7F2; --surface-2:#E9E5DB;
  --ink-1:#191713; --ink-2:#565248; --ink-3:#706B5F;
  --line-1:#DCD7CA; --line-2:#B9B2A0;
  --accent:#2733C4; --accent-text:#2733C4; --on-accent:#F4F2EA;
  --pos:#2E7053; --warn:#8F6415; --crit:#A03B30;
}