/* public/tokens.css
   The design tokens, on their own so more than one stylesheet can use them.

   They used to live at the top of style.css, which also sets `overflow: hidden`
   and `user-select: none` on body for the game canvas — rules that make a text
   page unreadable and unselectable. The content pages need the palette without
   the playfield's behaviour, so the palette moved here and both stylesheets
   load it. There is still exactly one definition of every token. */

:root {
    --ink: #f2f2f2;
    --bg: #0b0e13;
    --card: rgba(255, 255, 255, 0.06);
    --card-border: rgba(255, 255, 255, 0.12);
    --accent: #29d3a0;

    /* `--foreground` and `--font-display` were referenced in six rules without
       ever being declared. An undefined custom property makes the whole
       declaration invalid at computed-value time, so those rules were silently
       falling back to `inherit` — right by luck, wrong the moment anything
       around them changed. Declared here as the aliases they were meant to be. */
    --foreground: var(--ink);
    --font-display: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto,
        Helvetica, Arial, sans-serif;

    /* A dialog is not a card. `.card` is a 6%-white wash meant to sit on the
       page background; used as a modal surface it hid nothing, and the menu
       underneath — title, colour swatches, every button — read straight through
       the map picker. A dialog needs an opaque surface of its own. */
    --dialog: #141922;
    --dialog-border: rgba(255, 255, 255, 0.16);
    --scrim: rgba(4, 6, 10, 0.72);

    --muted: rgba(242, 242, 242, 0.62);
    --accent-dim: rgba(41, 211, 160, 0.16);
    --danger: #ff5a5a;
    --warn: #ffcc00;
    --surface-2: rgba(255, 255, 255, 0.03);

    --radius: 14px;
    --radius-sm: 10px;
    --shadow: 0 8px 32px rgba(0, 0, 0, 0.45);
}