/* ============================================================
   tokens.css -- Design tokens: color palette, fonts, shadows, radii, tint vars.
   Part of the split from the original single style.css.
   ============================================================ */

:root {
  /* Same yellow-wallpaper identity, deepened from flat mustard into a
     more deliberate antique gold, with cleaner/cooler paper tones so
     text has real contrast to sit on. */
  --wall-yellow: #cbab3f;
  --wall-yellow-dark: #97792a;
  --stain-brown: #74572c;
  --ink: #1c170e;
  --fluoro-white: #faf6e9;
  --glitch-pink: #ef2d76;
  --cursed-green: #2fe07f;
  --danger-red: #c81e3a;
  --bg-black: #0d0b06;
  --paper: #f5efdc;
  --border-soft: rgba(var(--shadow-rgb), 0.16);

  /* Size of one tile of the repeating body wallpaper photo
     (assets/images/wallpaper.jpg, base.css). "auto" uses the image's real
     pixel dimensions -- set an explicit size here (e.g. 400px 400px) to
     scale the tile up or down without touching base.css. */
  --wallpaper-tile-size: 200px 200px;

  /* JetBrains Mono still carries nav, labels, buttons, metadata, and
     classifications -- weight/size do the hierarchy work there, no second
     display face. Long-form article prose is the one deliberate exception
     (see --font-body below): readability wins over uniformity once you're
     reading paragraphs instead of scanning UI. */
  --font-term: 'JetBrains Mono', ui-monospace, 'SF Mono', 'Courier New', monospace;

  /* Long-form wiki article prose only -- nav/labels/buttons/classifications
     stay on --font-term. A monospace face is fine for short UI strings but
     tiring across paragraphs of running text, so long article bodies (see
     .md-content in wiki.css) get a proportional face instead. */
  --font-body: system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;

  /* Documented stacking scale -- values match what was already live
     (nothing here changes visual stacking order), just named so future
     additions have an obvious slot instead of picking an arbitrary number.
     Decorative/local ranges (-1, 2, 50, 60) are left as literals at their
     call sites since they're scoped within their own local context. */
  --z-nav: 500;
  --z-banner: 900;
  --z-scanlines: 998;
  --z-noise: 999;
  --z-modal: 1000;
  --z-modal-alt: 1001;
  --z-toast: 1002;

  /* Layered shadow system: a soft ambient shadow for real depth, plus the
     existing hard offset kept only where it earns its keep (primary
     buttons, cards) rather than applied uniformly everywhere. */
  --shadow-sm: 0 1px 3px rgba(var(--shadow-rgb), 0.10), 0 1px 2px rgba(var(--shadow-rgb), 0.08);
  --shadow-md: 0 6px 16px rgba(var(--shadow-rgb), 0.14), 0 2px 5px rgba(var(--shadow-rgb), 0.10);
  --shadow-lg: 0 14px 32px rgba(var(--shadow-rgb), 0.18), 0 4px 10px rgba(var(--shadow-rgb), 0.12);

  /* --radius-sm is used almost exclusively by interactive controls
     (buttons, inputs, chips) -- kept soft/rounded. --radius-md and
     --radius-lg are used almost exclusively by structural containers
     (cards, panels, the modal) -- kept sharp, per the "sharp structural,
     soft interactive" shape language. */
  --radius-sm: 9px;
  --radius-md: 4px;
  --radius-lg: 6px;

  /* Subtle surface tints (table stripes, hover backgrounds, tab bars)
     darken a light surface by default. In dark mode this flips to
     lighten instead -- a black tint on an already-near-black surface is
     invisible, which was the root of the dark-mode legibility bug. */
  --tint-rgb: 28, 23, 14;
  --shadow-rgb: 28, 23, 14;
}
