/* tokens.css -- the only place raw values are allowed (frontend-ux role).
   "Keycap & Switch" palette, from docs/00-PROJECT-BRIEF.md §5. */

:root {
  /* Keycap & Switch palette */
  --housing: #10141a;   /* case interior, page ground */
  --plate: #1b222c;     /* raised surfaces, cards */
  --plate-hi: #232c38;
  --legend: #efeae0;    /* doubleshot ivory -- all primary text */
  --muted: #7a8697;     /* untyped text, labels */
  --hit: #f2b33d;       /* amber: correct, caret, primary action */
  --miss: #ff5a4e;      /* error only -- never decorative */
  --pace: #5ee0c0;      /* mint: pace line, consistency, focus ring */

  /* type -- fonts are not yet vendored (stage 0); stacks fall back to
     system fonts so there is zero network request either way. Frontend-UX
     role vendors the real .woff2 files under public/assets/fonts/ in a
     later stage. */
  --f-display: "Martian Mono", ui-monospace, "SFMono-Regular", monospace;
  --f-body: "Public Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --f-mono: "JetBrains Mono", ui-monospace, "SFMono-Regular", monospace;

  --t-xs: 0.75rem;
  --t-sm: 0.875rem;
  --t-md: 1rem;
  --t-lg: 1.25rem;
  --t-xl: 1.75rem;
  --t-2xl: 2.5rem;
  --t-hero: clamp(2.5rem, 6vw, 4rem);

  /* space: 4px base */
  --s-1: 0.25rem;
  --s-2: 0.5rem;
  --s-3: 0.75rem;
  --s-4: 1rem;
  --s-6: 1.5rem;
  --s-8: 2rem;
  --s-12: 3rem;
  --s-16: 4rem;

  --r-sm: 4px;
  --r-md: 8px;
  --r-lg: 14px;

  --e-1: 0 1px 0 rgb(0 0 0 / 0.4), 0 2px 6px rgb(0 0 0 / 0.25);
  --e-key: inset 0 -2px 0 rgb(0 0 0 / 0.35), 0 2px 0 var(--plate-hi);

  --dur-fast: 90ms;
  --dur: 160ms;
  --ease: cubic-bezier(0.2, 0.8, 0.2, 1);
}

/* Arcade-only creature palette.
   Deliberately SCOPED to the game stage rather than :root, so no UI component
   can reach a --z-* value: these are the only warm/organic colours in the app
   and they would look wrong on anything that isn't a zombie. Read once at
   mount by readTheme('.arcade-stage'); only public/assets/js/modes/** may use
   them.

   Blood has its own tokens and never reuses --miss. --miss means "you made an
   error" everywhere else, on a screen that grades the student on accuracy --
   if zombies bled it, "error" and "zombie" would be the same signal.

   Silhouette rule: any layer that touches the outer outline must hold up
   against --housing. --z-cloth, --z-cloth-dk and --z-blood do not, so they
   are interior-only (the shirt is inset, one leg is left bare). */
.arcade-stage {
  --z-flesh: #7e9b55;      /* sickly green, lit side */
  --z-flesh-dk: #4a5f33;   /* shadow side, far limbs */
  --z-flesh-sick: #9aae6b; /* jaundiced: jaw, hands, brutes */
  --z-cloth: #39434f;      /* torn work shirt and trousers */
  --z-cloth-dk: #232a34;   /* cloth shadow, interior only */
  --z-blood: #8e1f1a;      /* dried: wounds, soak, kill debris */
  --z-blood-lt: #c0392b;   /* fresher, small accents only */
  --z-bone: #e8e0cc;       /* exposed bone, teeth, rim light */
}

/* Teacher switch: drops the wound/bone/drip layers and mutes the blood tones.
   The default is the full look. Set data-gore="low" on .arcade-stage. */
.arcade-stage[data-gore="low"] {
  --z-blood: #3f3a3a;
  --z-blood-lt: #4d4442;
}

/* Wild West Shootout. Same arrangement as --z-*: scoped to the stage, read
   once at mount, used only by public/assets/js/modes/**.

   This is the warmest palette in the app by a distance, which is the point --
   a sunset street has to feel like a different place from the zombie night,
   and neither may leak into the UI. */
.arcade-stage {
  --w-sky-hi: #f2b96a;     /* horizon glow */
  --w-sky-lo: #d9612f;     /* zenith, deep sunset */
  --w-sun: #ffe9b0;
  --w-mesa-far: #96604f;
  --w-mesa-near: #6f4137;
  --w-town: #33262a;       /* building silhouettes */
  --w-town-hi: #55403a;
  --w-window: #ffcf7a;     /* the only lit points in the skyline */
  --w-ground: #c8975a;
  --w-ground-dk: #8f6835;
  --w-dust: #e6c793;
  --w-leather: #7b4a2a;
  --w-leather-dk: #52301b;
  --w-coat: #6a4b34;
  --w-coat-dk: #4a3324;
  --w-trouser: #5d6470;
  --w-trouser-dk: #414751;
  --w-boot: #4a3428;
  --w-boot-dk: #33241b;
  --w-vest: #4a3324;
  --w-hat: #43301f;
  --w-hat-band: #2b1f14;
  --w-bandana: #c2483a;
  --w-skin: #e0ae84;
  --w-skin-dk: #b8845e;
  --w-metal: #c9ced6;
  --w-grip: #7b4a2a;
  --w-shirt-p: #3f7fa8;    /* you -- cool, so you never read as the rival */
  --w-shirt-r: #b8453a;    /* the rival */
  --w-weed: #8a6a3c;
}