/* ============================================================================ Factually Games — design tokens. THE single source of truth for the family palette. Linked by every page (hub, /factually, /evidently, and all content pages) so a colour is defined ONCE and the whole family moves together. Default = INK (dark) — this is what ships. paper / stone / midnight are INTERNAL dev-only schemes (toggled behind the games' ?dev=1 bar); they live here so the site switches from one place. Scheme wiring differs by page and both are covered: - content pages set data-scheme on -> :root[data-scheme=...] fires here - the games set data-scheme on -> each game keeps its own body[data-scheme=...] blocks for dev schemes; the DEFAULT ink look flows from the bare :root below via the games' aliased --p* tokens. Correctness palette (decided, "good as gold"): correct/success = --gold, wrong = --bad, everything else monochrome. No green anywhere — the legacy green/blue state tokens (--good/--accent/--over/--under) alias to gold so a stray reference can never reintroduce a colour. ============================================================================ */ :root{ --bg:#15171c; /* page background */ --card:#1c1f26; /* solid raised surface (menu cards, facts) */ --surface:rgba(255,255,255,.07); /* translucent chip / row overlay */ --text:#f4f6fa; /* primary text */ --muted:#8b93a0; /* secondary / label text */ --faint:#5b616e; /* tertiary / footnote text */ --line:rgba(255,255,255,.12); /* hairline / border */ --line2:rgba(255,255,255,.2); /* stronger border */ --gold:#ffc24b; /* brand accent = correct / success */ --gold-ink:#1a1206; /* text on a gold fill */ --bad:#ff5a4d; /* wrong / danger */ --good:var(--gold); /* correct = gold (never green) */ --accent:var(--gold); /* legacy alias -> gold */ --over:var(--gold); /* legacy alias -> gold */ --under:var(--gold); /* legacy alias -> gold */ --font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif; } :root[data-scheme="paper"]{ --bg:#f4f1ea; --card:#fbf9f3; --surface:rgba(0,0,0,.06); --text:#17181d; --muted:#6c6b63; --faint:#8a887f; --line:rgba(0,0,0,.14); --line2:rgba(0,0,0,.22); --gold:#c98a00; --gold-ink:#1a1206; --bad:#d63a51; } :root[data-scheme="stone"]{ --bg:#cec8bc; --card:#dcd7cc; --surface:rgba(0,0,0,.07); --text:#242019; --muted:#6b6454; --faint:#8a8474; --line:rgba(0,0,0,.16); --line2:rgba(0,0,0,.24); --gold:#9c6a12; --gold-ink:#efe9db; --bad:#c5384c; } :root[data-scheme="midnight"]{ --bg:#1a2130; --card:#232c3e; --surface:rgba(255,255,255,.07); --text:#eaf0f8; --muted:#9aa6bc; --faint:#6b7688; --line:rgba(255,255,255,.12); --line2:rgba(255,255,255,.2); --gold:#ffc24b; --gold-ink:#1a1206; --bad:#ff5a4d; }