/* Zeynep's Magic Pets — one design system for every page.

   Loaded FIRST on every page (home, story, games). The story's style.css
   loads after this and re-declares a few of the same variable names with its
   own meanings (notably --ink is dark text there, light text here) — that is
   deliberate: the story page wins for itself, everything else reads these. */

/* Baloo 2, self-hosted (see /fonts/OFL.txt). Variable weight 400-800.
   Two subsets: latin covers öüç, latin-ext covers ğışİŞĞ — both needed for
   Turkish names. font-display swap: system font is the loading state. */
@font-face {
  font-family: "Baloo 2";
  src: url("/fonts/Baloo2-Variable-latin.woff2") format("woff2");
  font-weight: 400 800;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6,
    U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122,
    U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Baloo 2";
  src: url("/fonts/Baloo2-Variable-latin-ext.woff2") format("woff2");
  font-weight: 400 800;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7,
    U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F,
    U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F,
    U+A720-A7FF;
}

:root {
  /* Canonical plum/gold palette. */
  --plum-900: #150f26;
  --plum-800: #1b1430;
  --plum-700: #2a2047;
  --gold: #ffc247;
  --gold-deep: #e09a1c;
  --coral: #ff7a59;
  --paper: #fdf6e8;
  --stroke: rgba(255, 255, 255, 0.12);
  --radius: 18px;
  --shadow: 0 18px 45px rgba(0, 0, 0, 0.4);
  --font: "Baloo 2", "Comic Sans MS", "Chalkboard SE", "Segoe UI Rounded",
          system-ui, -apple-system, sans-serif;

  /* Aliases the game pages were written against, mapped onto the same
     palette so no game CSS needed renaming. */
  --bg1: var(--plum-900);
  --bg2: #241a45;
  --panel: #1e1638;
  --panel2: #251b48;
  --gold2: var(--gold-deep);
  --ink: #f1ecff;       /* light text on plum (story overrides for itself) */
  --dim: #a99bd6;
  --line: #3a2d63;
  --good: #4ade80;
  --warn: #ffa845;
  --bad: #ff6b6b;
}

/* The `hidden` attribute is only a UA `display:none`; any author display rule
   silently beats it. Settled globally — see the story stylesheet's history. */
[hidden] { display: none !important; }

/* A child double-tapping a button must never zoom the page: touch-action does not inherit, so set it on the interactive elements themselves. Canvases and D-pads set touch-action:none locally. */
button, a, input, select, label { touch-action: manipulation; }