/* Design tokens — single source of truth for the whole project.
   Type hues are mirrored in src/core/types.js (keep the two in sync). */

:root {
  /* ---- Surfaces: a dark, warm-lit stage ---- */
  --bg-0: #0b0a10;
  --bg-1: #14121c;
  --bg-2: #1d1a28;
  --bg-3: #272235;
  --bg-inset: #0e0d14;

  /* ---- Ink ---- */
  --ink-0: #f6f2ea;
  --ink-1: #cdc5bb;
  --ink-2: #948b83;
  --ink-3: #5f5850;

  /* ---- Brass / accent ---- */
  --brass-0: #f0c987;
  --brass-1: #d4a656;
  --brass-2: #a37c36;
  --brass-3: #6b4f21;

  /* ---- Semantic ---- */
  --ok: #6fce8f;
  --warn: #e8b45a;
  --bad: #e3675f;
  --info: #6fa8dc;

  /* ---- Player identity ---- */
  --you: #6fc5e0;
  --foe: #e0736f;

  /* ---- Elemental type hues ---- */
  --t-air:     #b8d8e8;
  --t-psychic: #c98fe0;
  --t-dead:    #8a8f7a;
  --t-fire:    #f0733f;
  --t-water:   #4a9fe0;
  --t-light:   #f5e07a;
  --t-ground:  #c19a6b;
  --t-rune:    #9b8ee8;
  --t-nature:  #6fbf5f;
  --t-ice:     #8fe0e0;
  --t-metal:   #a8b0b8;
  --t-none:    #8f8a84;

  /* ---- Geometry ---- */
  --r-sm: 4px;
  --r-md: 8px;
  --r-lg: 14px;
  --r-xl: 22px;
  --r-pill: 999px;

  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 24px;
  --sp-6: 32px;
  --sp-7: 48px;

  /* ---- Elevation ---- */
  --sh-1: 0 1px 2px rgba(0,0,0,.4);
  --sh-2: 0 4px 10px rgba(0,0,0,.45);
  --sh-3: 0 10px 28px rgba(0,0,0,.55);
  --sh-card: 0 6px 18px rgba(0,0,0,.55), 0 1px 0 rgba(255,255,255,.06) inset;
  --sh-lift: 0 18px 40px rgba(0,0,0,.6);

  /* ---- Motion: one scale, so FX can be toned down globally ---- */
  --fx: 1;                       /* settings multiplier, 0 disables */
  --t-fast: calc(120ms * var(--fx));
  --t-med:  calc(240ms * var(--fx));
  --t-slow: calc(420ms * var(--fx));
  --ease-out: cubic-bezier(.22,.8,.3,1);
  --ease-in-out: cubic-bezier(.6,0,.3,1);
  --ease-snap: cubic-bezier(.2,1.4,.4,1);

  /* ---- Card geometry (mirrors render/layout.js) ---- */
  --card-w: 500;
  --card-h: 700;
  --card-ratio: .714286;

  /* ---- Typography ---- */
  --font-ui: "Segoe UI", system-ui, -apple-system, sans-serif;
  --font-card: "Trebuchet MS", "Segoe UI", system-ui, sans-serif;
  --font-num: "Segoe UI Semibold", "Segoe UI", system-ui, sans-serif;
}

@media (prefers-reduced-motion: reduce) {
  :root { --fx: 0.001; }
}