/* Design tokens for /play/. System font stacks only (no font downloads). HUD, menu and screen CSS belong to their own
   work packages (css/hud.css, css/menus.css ...) and build on these variables; nothing here styles a component. */
:root {
  color-scheme: dark;

  /* colour: matches the site shell (assets/site.css) */
  --bg: #04050a;
  --bg-2: #070a12;
  --ink: #e8ecf6;
  --ink-dim: #9aa4bd;                  /* PANELS only: over the 3D scene it measured 1.14-1.19:1 (evidence I3), see --ink-scene */
  --ink-faint: #6b7590;                /* panels only, like --ink-dim */
  /* TEXT OVER THE 3D SCENE (HUD, subtitles, hints, timers): the picture behind it can be anything from a dark floor to a white sky, so such text is --ink-scene on a --scrim
     (or the class .on-scene in base.css), never --ink-dim or --ink-faint. --ink-scene on --scrim over a WHITE pixel (the worst case) is about 6.9:1; the floor is 4.5:1 (WCAG AA) */
  --ink-scene: #f4f7fd;
  --scrim: rgba(4, 5, 10, 0.68);
  --line: rgba(232, 236, 246, 0.14);
  --line-strong: rgba(232, 236, 246, 0.28);
  --panel: rgba(6, 8, 14, 0.74);
  --panel-solid: #0a0e18;
  --accent: #7fd4ff;
  --warm: #ffb86b;
  --danger: #ff6b8a;
  --ok: #7ee2a8;
  /* provenance chips: fact / model / design (真 / 模 / 設) */
  --prov-fact: #7ee2a8;
  --prov-model: #7fd4ff;
  --prov-design: #ffb86b;

  /* type: system stacks, Traditional Chinese first, then Simplified, then Latin */
  --font-sans: system-ui, -apple-system, "Segoe UI", "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", "PingFang SC", "Noto Sans SC", "Microsoft YaHei", Roboto, sans-serif;
  --font-serif: "Songti TC", "Noto Serif TC", "PMingLiU", "Songti SC", "Noto Serif SC", serif;
  --font-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --text-scale: 1;                     /* settings access.textScale (HUD sets it on :root) */
  --fs-xs: calc(11px * var(--text-scale));
  --fs-sm: calc(13px * var(--text-scale));
  --fs-md: calc(15px * var(--text-scale));
  --fs-lg: calc(20px * var(--text-scale));
  --fs-xl: calc(32px * var(--text-scale));
  --fs-title: calc(clamp(34px, 7vw, 72px) * var(--text-scale));

  /* space and shape */
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 24px; --sp-6: 32px; --sp-7: 48px;
  --radius-sm: 6px; --radius: 12px; --radius-lg: 20px;

  /* safe areas (notches, home indicators); viewport-fit=cover is set in index.html */
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-right: env(safe-area-inset-right, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --safe-left: env(safe-area-inset-left, 0px);

  /* stacking: one scale for the whole game */
  --z-gl: 0;
  --z-hud: 10;
  --z-menus: 20;
  --z-toasts: 30;
  --z-debug: 40;
  --z-boot: 100;

  /* motion */
  --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  --dur-fast: 120ms;
  --dur: 240ms;
  --dur-slow: 480ms;
}

@media (prefers-reduced-motion: reduce) {
  :root { --dur-fast: 0ms; --dur: 0ms; --dur-slow: 0ms; }
}