/* Hollowmarch design tokens — single source of truth for the website.
   Derived from the game's identity: docs/image-prompts.md art direction
   (charcoal/ash/cold-steel + ember/blood/arcane accents) and the in-game
   type pairing (Metamorphous display / EB Garamond body, both SIL OFL,
   self-hosted — never a font CDN). The site deliberately commits to a
   single dark theme: Hollowmarch's world has no light mode. */

:root {
  /* ---- ground: stone ---- */
  --stone-950: #101214; /* page */
  --stone-900: #16181b; /* panel */
  --stone-800: #212327; /* raised surface */
  --stone-700: #34373c; /* hairlines, borders */
  --stone-600: #4a4e54; /* disabled, deep muted */

  /* ---- ink: ash ---- */
  --ash-400: #8b9199;   /* muted text (AA on stone-950) */
  --ash-300: #b7bcc2;   /* secondary text */
  --ash-100: #e7e8ea;   /* primary text */

  /* ---- fire: ember / blood ---- */
  --ember-500: #d9631f; /* the accent. CTAs, the one bold thing per view */
  --ember-400: #ea8a44; /* hover, soft glow */
  --ember-300: #f4ac72; /* gradient tips, glow text */
  --blood-600: #7a2620; /* danger, destructive actions */
  --blood-400: #c86f60; /* danger hover / error text on dark (5.3:1 on stone-950, AA) */

  /* ---- rune: arcane ---- */
  --arcane-400: #52b8ac; /* links, focus rings, rune details — sparingly */
  --arcane-300: #8fd6cc;

  /* ---- semantic ---- */
  --bg: var(--stone-950);
  --surface: var(--stone-900);
  --surface-raised: var(--stone-800);
  --line: var(--stone-700);
  --ink: var(--ash-100);
  --ink-soft: var(--ash-300);
  --ink-muted: var(--ash-400);
  --accent: var(--ember-500);
  --accent-hover: var(--ember-400);
  --accent-ink: #1a0d05;      /* text on ember fills */
  --danger: var(--blood-600);
  --danger-ink: var(--blood-400);
  --link: var(--arcane-400);
  --focus: var(--arcane-400);

  /* ---- type ---- */
  --font-display: 'Metamorphous', 'Palatino', serif;
  --font-body: 'EB Garamond', 'Georgia', serif;
  --leading-body: 1.65;
  --leading-tight: 1.15;
  --track-label: 0.22em;      /* letterspaced uppercase labels */
  --track-wordmark: 0.09em;

  /* type scale — 1.25 ratio on a 1.125rem body */
  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1.125rem;
  --text-md: 1.375rem;
  --text-lg: 1.75rem;
  --text-xl: 2.25rem;
  --text-2xl: 3rem;
  --text-hero: clamp(1.7rem, 7vw, 4.25rem); /* sized so HOLLOWMARCH (a wide word in a wide face) fits a 360px viewport with air on both sides */

  /* ---- space (8px base) ---- */
  --sp-1: 0.25rem;
  --sp-2: 0.5rem;
  --sp-3: 0.75rem;
  --sp-4: 1rem;
  --sp-5: 1.5rem;
  --sp-6: 2rem;
  --sp-7: 3rem;
  --sp-8: 4rem;
  --sp-9: 6rem;

  /* ---- shape: stone is sharp ---- */
  --radius: 0;            /* squared. The game UI rounds; the site is carved. */
  --radius-soft: 2px;     /* inputs only, to keep strokes crisp on low-dpi */

  /* ---- depth & glow ---- */
  --shadow-plate: 0 24px 60px -24px rgba(0, 0, 0, 0.7);
  --glow-ember: 0 0 28px rgba(217, 99, 31, 0.25);
  --glow-focus: 0 0 0 3px rgba(82, 184, 172, 0.25);

  /* ---- layout ---- */
  --measure: 66ch;        /* prose width */
  --page-max: 72rem;
  --nav-h: 4rem;
}