/* Shared design tokens. Games override --accent and may override anything. */
:root {
  color-scheme: light dark;
  --bg: #f7f3ec;
  --surface: #fffdf9;
  --surface-2: #efe9df;
  --ink: #1f1b16;
  --ink-2: #6b6259;
  --line: #d9d1c4;
  --ok: #2e9e6b;
  --warn: #d9a521;
  --bad: #d64545;
  --info: #3b7dd8;
  --accent: #3b5bdb;
  --accent-ink: #ffffff;

  --font-display: "Fraunces", ui-serif, Georgia, serif;
  --font-ui: "Inter", ui-sans-serif, system-ui, sans-serif;

  --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px; --s-5: 24px; --s-6: 32px; --s-7: 48px; --s-8: 64px;
  --r-sm: 6px; --r-md: 12px; --r-lg: 20px; --r-pill: 999px;
  --shadow-1: 0 1px 2px rgb(31 27 22 / .08), 0 2px 6px rgb(31 27 22 / .06);
  --shadow-2: 0 1px 2px rgb(31 27 22 / .08), 0 8px 24px rgb(31 27 22 / .10);
  --shadow-3: 0 2px 4px rgb(31 27 22 / .10), 0 20px 48px rgb(31 27 22 / .16);

  --ease-out: cubic-bezier(.2,.8,.2,1);
  --ease-in: cubic-bezier(.4,0,1,1);
  --ease-spring: cubic-bezier(.34,1.56,.64,1);
  --t-fast: 120ms; --t-base: 220ms; --t-slow: 420ms;

  --gutter: 16px;
  --hud-h: 48px;
  --bp-md: 640px;
  --bp-lg: 960px;
}
:root:not([data-theme="light"]) { }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #16140f; --surface: #1f1c16; --surface-2: #2a261f;
    --ink: #f3eee6; --ink-2: #b3aa9d; --line: #3a352c;
    --ok: #3fbf85; --warn: #e8b93a; --bad: #e56060; --info: #5c97ea;
  }
}
:root[data-theme="dark"] {
  --bg: #16140f; --surface: #1f1c16; --surface-2: #2a261f;
  --ink: #f3eee6; --ink-2: #b3aa9d; --line: #3a352c;
  --ok: #3fbf85; --warn: #e8b93a; --bad: #e56060; --info: #5c97ea;
}
:root[data-colorblind="1"] { --ok: #e69f00; --warn: #56b4e9; --bad: #8f8f8f; }
:root[data-contrast="1"] { --line: color-mix(in oklab, var(--ink) 40%, transparent); --ink-2: var(--ink); }
@media (prefers-reduced-motion: reduce) { :root { --t-fast: 1ms; --t-base: 80ms; --t-slow: 120ms; } }
:root[data-motion="reduced"] { --t-fast: 1ms; --t-base: 80ms; --t-slow: 120ms; }