/* Design tokens. Colour: mirrors docs/brand/BRAND.md §3 exactly; no other token holds a
   colour (app/test/brand.test.js). Radius, spacing, size and motion: what each is for is
   in app/UI.md › Tokens. */
:root {
  --bg: #0E0F11;
  --surface: #1A1C20;
  --line: #2F3238;
  --text: #F4F4F0;
  --muted: #A0A3A8;
  --accent: #B8F13A;
  --on-accent: #0E0F11;
  --finisher: #FF6B2C;
  --rest: #2EC4B6;
  --paused: #8A8D93;
  --done: #3DDC84;
  --danger: #FF4D4D;

  /* radius */
  --r-card: 12px;
  --r-pill: 999px;
  --r-sheet: 20px;
  /* spacing */
  --s-1: 4px;
  --s-2: 8px;
  --s-3: 12px;
  --s-4: 16px;
  --s-5: 24px;
  --s-6: 32px;
  /* sizes */
  --tap: 44px;
  --btn: 52px;
  --row: 56px;
  /* motion */
  --t-toast: 250ms;
  --t-sheet: 280ms;
}