/* Токены 0002 `13_rev2_design_system.md` §2; значения — из `:root` эталона `visualization.html` (Р26), владелец — F1a.
   `--accent-tint` светлой темы — #EAF7F8 (осветлён до 4,5:1 по §2; в таблице §2 осталось #E0F3F4 = 4,31:1 — F1a-HALT-1).
   Тема: светлая по умолчанию; тёмная — по `prefers-color-scheme` или `data-theme="dark"` — переопределяет только шкалу,
   акцент, статусы и тени. Шрифты не встраиваются (D30). Высоты контролов — по классам окна (§1). */
:root {
  --g0: #FFFFFF; --g1: #F5F6F8; --g2: #EEF0F3; --g3: #E3E6EA; --g4: #CDD2D8; --g5: #AEB5BE;
  --g6: #7F8A97; --g7: #5B6673; --g8: #3A434D; --g9: #1F252C; --g10: #0B0F14;
  --bg: var(--g1); --surface: var(--g0); --surface-2: var(--g2); --surface-3: var(--g3);
  --ink: var(--g10); --ink-2: var(--g7); --ink-3: #626D79;
  --rule: var(--g3); --rule-2: var(--g4); --rule-soft: #EBEEF1;
  --accent: #0E7C86; --accent-strong: #0A6169; --accent-tint: #EAF7F8; --accent-soft: #F1FAFA; --on-accent: #FFFFFF;
  --spend: #8E3F2C; --spend-tint: #F6E6E1;
  --ok: #1E7F4F; --ok-tint: #E7F7ED; --warn: #8F5600; --warn-tint: #FBEFD2; --err: #C2261E; --err-tint: #FBE1DF;
  --claude: #C15F3C; --codex: #0F766E;
  --r-ctl: 8px; --r-card: 12px; --r-sheet: 16px; --r-chip: 999px;
  --ctl: 36px; --ctl-sm: 30px; --tap: 44px;
  --shadow-1: 0 1px 2px rgba(11,15,20,.06); --shadow-2: 0 8px 24px rgba(11,15,20,.12); --shadow-3: 0 20px 60px rgba(11,15,20,.22);
  --dur: 160ms; --ease: cubic-bezier(.2,.7,.2,1);
  --sans: Inter, -apple-system, "SF Pro Text", "Segoe UI Variable Text", "Segoe UI", Roboto, system-ui, "Helvetica Neue", Arial, sans-serif;
  --mono: ui-monospace, "SF Mono", "Cascadia Mono", "JetBrains Mono", Consolas, "Liberation Mono", monospace;
  --fs: 14px;
  --safe-b: env(safe-area-inset-bottom, 0px);
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --g0: #14171B; --g1: #0B0D10; --g2: #1B1F25; --g3: #232830; --g4: #2E353E; --g5: #465060;
    --g6: #7F8A97; --g7: #A3ACB8; --g8: #C4CBD3; --g9: #DDE1E6; --g10: #EEF1F4;
    --ink-3: var(--g6); --rule-soft: #1F242B;
    --accent: #4FC3CB; --accent-strong: #7BD6DC; --accent-tint: #0F2F33; --accent-soft: #0F2226; --on-accent: #06191B;
    --spend: #E08A6F; --spend-tint: #33201A;
    --ok: #5DCB8C; --ok-tint: #123222; --warn: #E6B54A; --warn-tint: #2E2610; --err: #F4857C; --err-tint: #3A1B19;
    --claude: #E8916E; --codex: #4FD1C5;
    --shadow-1: 0 1px 2px rgba(0,0,0,.4); --shadow-2: 0 10px 30px rgba(0,0,0,.5); --shadow-3: 0 24px 70px rgba(0,0,0,.65);
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --g0: #14171B; --g1: #0B0D10; --g2: #1B1F25; --g3: #232830; --g4: #2E353E; --g5: #465060;
  --g6: #7F8A97; --g7: #A3ACB8; --g8: #C4CBD3; --g9: #DDE1E6; --g10: #EEF1F4;
  --ink-3: var(--g6); --rule-soft: #1F242B;
  --accent: #4FC3CB; --accent-strong: #7BD6DC; --accent-tint: #0F2F33; --accent-soft: #0F2226; --on-accent: #06191B;
  --spend: #E08A6F; --spend-tint: #33201A;
  --ok: #5DCB8C; --ok-tint: #123222; --warn: #E6B54A; --warn-tint: #2E2610; --err: #F4857C; --err-tint: #3A1B19;
  --claude: #E8916E; --codex: #4FD1C5;
  --shadow-1: 0 1px 2px rgba(0,0,0,.4); --shadow-2: 0 10px 30px rgba(0,0,0,.5); --shadow-3: 0 24px 70px rgba(0,0,0,.65);
  color-scheme: dark;
}
/* medium 600–1023: 40 / 34; compact < 600: 44 / 40, базовый шрифт 15 (§1) */
@media (max-width: 1023.98px) { :root { --ctl: 40px; --ctl-sm: 34px; } }
@media (max-width: 599.98px) { :root { --ctl: 44px; --ctl-sm: 40px; --fs: 15px; } }
@media (prefers-reduced-motion: reduce) { :root { --dur: 0.01ms; } }