/**
 * AUTO-GENERATED by ops/frontend/scripts/generate-tokens.mjs — DO NOT EDIT.
 *
 * Source of truth: ops/frontend/src/constants/tokens.json
 * Doctrine:        docs/repo-memory/visual-identity-doctrine.md
 *
 * LINKED FROM press.html ONLY, which carries data-theme="dark" and reads
 * these vars for the brand swatches — so the public brand page cannot drift
 * from tokens.json the way its hand-kept palette did. The rest of the site
 * is still on landing.css / landing-shared.css: Phase 03.
 *
 * It carries the APP's values. Wiring it site-wide today would shift the
 * site's --accent from #E63946 to #E10E2F: a visible change, onto the weaker
 * of the two reds (4.06 vs 4.75 on the ground), which Phase 03 then changes
 * again. One deliberate visual change beats two.
 *
 * Phase 03: link this FIRST, before landing-shared.css, then delete the
 * colour declarations from the :root blocks in landing.css and
 * landing-shared.css so later sheets own layout and never colour.
 */

:root {
  --bg: #0B0B0D;
  --surface: #15151A;
  --surface-elevated: #1E1E24;
  --accent: #CEAB64;
  --accent-light: #D8BC83;
  --secondary: #FFB703;
  --text: #FFFFFF;
  --text-secondary: #BCB9B3;
  --text-muted: #9A968D;
  --border: #2E2C29;
  --border-strong: #726D65;
  --success: #2ECC71;
  --warning: #FFB703;
  --info: #3498DB;
}

@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) {
    --bg: #F7F7F2;
    --surface: #FFFFFF;
    --surface-elevated: #FFFDF8;
    --accent: #6D5422;
    --accent-light: #8C6C2C;
    --secondary: #855F00;
    --text: #111113;
    --text-secondary: #4A4A52;
    --text-muted: #67635B;
    --border: #DED9CC;
    --border-strong: #726D65;
    --success: #174F35;
    --warning: #5E3F08;
    --info: #133A53;
  }
}

:root[data-theme="light"] {
  --bg: #F7F7F2;
  --surface: #FFFFFF;
  --surface-elevated: #FFFDF8;
  --accent: #6D5422;
  --accent-light: #8C6C2C;
  --secondary: #855F00;
  --text: #111113;
  --text-secondary: #4A4A52;
  --text-muted: #67635B;
  --border: #DED9CC;
  --border-strong: #726D65;
  --success: #174F35;
  --warning: #5E3F08;
  --info: #133A53;
}

/* Subtree light. A page that is itself dark sometimes has to SHOW the light
   palette — the press page's swatch row is the case that forced this. Doing
   that by flipping :root repaints the page around the preview; scoping the
   same values to a class keeps the preview inside its own box. */
.theme-light {
  --bg: #F7F7F2;
  --surface: #FFFFFF;
  --surface-elevated: #FFFDF8;
  --accent: #6D5422;
  --accent-light: #8C6C2C;
  --secondary: #855F00;
  --text: #111113;
  --text-secondary: #4A4A52;
  --text-muted: #67635B;
  --border: #DED9CC;
  --border-strong: #726D65;
  --success: #174F35;
  --warning: #5E3F08;
  --info: #133A53;
}

/* ── Materials ───────────────────────────────────────────────────────
   Metal is a GRADIENT, not a colour (§5d). Collapsing the sweep to its
   midpoint is what made the accent read as flat brown — right hue, no
   luster — so anything filled in brand gold takes one of these, never
   var(--accent) on its own.

   --gold-metal        full sweep. Surfaces carrying NO text: rules,
                       borders, icon fills, badges, the active edge.
   --gold-metal-label  compressed to the light half, so an ink label
                       stays safe across every stop. Filled controls.

   Both are mode-independent: the material does not change with the
   ground it sits on. */
:root {
  --gold-metal: linear-gradient(135deg, #6D5422 0%, #C49A45 35%, #F2E2B8 50%, #CEAB64 65%, #8C6C2C 100%);
  --gold-metal-label: linear-gradient(135deg, #C49A45 0%, #DCC08A 35%, #F2E2B8 50%, #DCC08A 65%, #C49A45 100%);
}

/* ── Category identity ───────────────────────────────────────────────
   Same source as the app's mode registry, so a category is one colour
   across the site and the app. Replaces the hand-kept --cat-accent
   values in category.css, which had drifted from modes.ts.

   Five categories, three families: colour does NOT identify a category
   on its own here either. Keep the icon and the label doing that work. */
:root .cat-gist { --cat-accent: #CEAB64; --cat-wash: rgba(206, 171, 100, 0.14); }
:root .cat-circles { --cat-accent: #CEAB64; --cat-wash: rgba(206, 171, 100, 0.14); }
:root .cat-events { --cat-accent: #CEAB64; --cat-wash: rgba(206, 171, 100, 0.14); }
:root .cat-market { --cat-accent: #CEAB64; --cat-wash: rgba(206, 171, 100, 0.14); }
:root .cat-arcade { --cat-accent: #CEAB64; --cat-wash: rgba(206, 171, 100, 0.14); }
:root .cat-aura { --cat-accent: #CEAB64; --cat-wash: rgba(206, 171, 100, 0.14); }
:root[data-theme="light"] .cat-gist { --cat-accent: #8C6C2C; --cat-wash: rgba(140, 108, 44, 0.14); }
:root[data-theme="light"] .cat-circles { --cat-accent: #8C6C2C; --cat-wash: rgba(140, 108, 44, 0.14); }
:root[data-theme="light"] .cat-events { --cat-accent: #8C6C2C; --cat-wash: rgba(140, 108, 44, 0.14); }
:root[data-theme="light"] .cat-market { --cat-accent: #8C6C2C; --cat-wash: rgba(140, 108, 44, 0.14); }
:root[data-theme="light"] .cat-arcade { --cat-accent: #8C6C2C; --cat-wash: rgba(140, 108, 44, 0.14); }
:root[data-theme="light"] .cat-aura { --cat-accent: #8C6C2C; --cat-wash: rgba(140, 108, 44, 0.14); }
