/* tokens.css — CSS design tokens for Free Browser Gaming.
 * GENERATED MIRROR of documentation/configuration.json -> brand.design_language.
 * configuration.json is THE single source of truth; this file is its CSS
 * projection (re-emitted by `studio.py scaffold` / `legal-pages` via
 * studio/common.py::design_tokens_css). Do NOT hand-edit hex values here —
 * change configuration.json and re-run the generator.
 *
 * Fonts (chairman 2026-06-18: ALL SYSTEM FONTS, ZERO webfont — dropped Lora/Poppins):
 *   --font-ui   = system Arial         -> the GAME canvas/UI
 *   --font-body = Trebuchet MS         -> website body/paragraph/card-desc/hero-sub
 *   --font-head = Verdana              -> website headings/wordmark/nav/tags
 * No Google Fonts link or preconnect anywhere; everything renders on first paint.
 */
:root {
  /* ── raw palette (named after configuration.json color names) ── */
  /* neutrals */
  --c-lotion: #faf9f5;  /* page background (lightest warm white) */
  --c-salt: #f0eee6;  /* surface / card background */
  --c-last-straw: #e3dacc;  /* border / divider / warm beige */
  --c-noir: #2c2b26;  /* secondary text + soft borders (warm dark gray) */
  --c-sooty: #141414;  /* PRIMARY text / body ink (near-black) */
  --c-chocolate-pretzel: #5f524c;  /* structure ink — game-canvas frame + empty-slot borders + placeholder A/K/suit icons (warm brown-gray; chairman 2026-06-18). On light tables this is the unified structure color; on dark custom tables the in-canvas slots adaptively flip to a light ink for legibility while the outer CSS frame stays this color. */
  --c-argent: #888888;  /* neutral mid-gray — available family color (chairman 2026-06-18). NOT YET APPLIED to any element; offered as a palette/CSS-var option (e.g. a candidate empty-slot ink the chairman is still evaluating). Available via tokens.css var --c-argent / semantic alias --neutral-gray. */
  /* brand */
  --c-peachy-feeling: #d97757;  /* PRIMARY brand / CTA (Anthropic clay-coral) */
  --c-mellow-marrow: #ebc9b7;  /* primary tint / hover wash */
  /* accents */
  --c-magic-carpet: #827dbd;  /* accent purple */
  --c-windstorm: #6a9bcc;  /* accent blue */
  --c-emerald-oasis: #629887;  /* accent green */
  --c-moss-gardens: #788c5d;  /* accent olive */
  /* tints */
  --c-peek-a-blue: #c7dedc;  /* soft cyan tint (category/label bg) */
  --c-aquatic-edge: #bcd1ca;  /* soft green tint */
  --c-dust-of-the-moon: #cacadb;  /* soft blue-gray tint */

  /* ── semantic aliases (use THESE in components, not raw --c-*) ── */
  --bg: var(--c-lotion, #faf9f5);            /* warm page bg — NEVER #fff */
  --surface: var(--c-salt, #f0eee6);           /* card / panel */
  --border: var(--c-last-straw, #e3dacc);  /* 1px borders/dividers */
  --border-cool: var(--c-dust-of-the-moon, #cacadb); /* alt cool border */
  --text: var(--c-sooty, #141414);            /* primary ink */
  --text-2: var(--c-noir, #2c2b26);            /* secondary text */
  --structure-ink: var(--c-chocolate-pretzel, #5f524c); /* game-canvas frame + empty-slot borders + placeholder icons (chairman 2026-06-18) */
  --neutral-gray: var(--c-argent, #888888); /* AVAILABLE family color, not yet applied to any element (chairman 2026-06-18) */
  --primary: var(--c-peachy-feeling, #d97757); /* brand / CTA */
  --primary-tint: var(--c-mellow-marrow, #ebc9b7); /* hover wash */
  --accent-purple: var(--c-magic-carpet, #827dbd);
  --accent-blue: var(--c-windstorm, #6a9bcc);
  --accent-green: var(--c-emerald-oasis, #629887);
  --accent-olive: var(--c-moss-gardens, #788c5d);
  --tint-cyan: var(--c-peek-a-blue, #c7dedc);
  --tint-green: var(--c-aquatic-edge, #bcd1ca);

  /* ── fonts (ALL web-safe system fonts, ZERO webfont) ── */
  /* in-game UI: system Arial stack (game canvas) */
  --font-ui: Arial, "Helvetica Neue", Helvetica, sans-serif;
  /* website body/paragraph/card-desc/hero-sub: Trebuchet MS (system) */
  --font-body: "Trebuchet MS", "Segoe UI", Tahoma, Arial, sans-serif;
  /* website headings/wordmark/nav/tags: Verdana (system) */
  --font-head: Verdana, Geneva, Tahoma, sans-serif;
  --font-mono: ui-monospace, "SF Mono", Menlo, monospace;

  /* ── css_principles tokens ── */
  --border-w: 1px;                 /* subtle 1px borders, NOT heavy drop-shadows */
  --radius: 12px;
  --lh-body: 1.65;                 /* body 1.6–1.7 for comfortable reading */
  --lh-ui: 1.4;
  --fw-light: 300;                 /* extreme-weight contrast: 300 light … */
  --fw-bold: 800;                  /* … vs 800 extra-bold (avoid muddy mid-weights) */
  --h1-tracking: -0.02em;          /* h1 letter-spacing */
  --shadow-soft: none;             /* design language: borders over shadows */
}
