/* Design tokens — Crimson & Gold on charcoal (cinematic chiaroscuro). */
:root {
  /* ---- Palette ---- */
  --crimson: #c8102e;
  --crimson-600: #a60d26;
  --crimson-700: #87091e;
  --crimson-300: #e63d55;
  --gold: #f2a900;
  --gold-300: #ffc94a;
  --gold-600: #c98c00;

  --ink: #14181f;        /* page background */
  --ink-900: #0e1116;    /* deepest wells */
  --surface: #1e242e;    /* cards */
  --surface-2: #262e3a;  /* raised / hover */
  --line: rgba(255, 255, 255, .08);
  --line-strong: rgba(255, 255, 255, .16);

  --paper: #f7f8fa;
  --text: #e8ebf0;
  --text-dim: #a7b0be;
  --text-faint: #6f7888;

  --success: #2fbf71;
  --warning: #f2a900;
  --danger: #e5484d;

  --on-crimson: #ffffff;
  --on-gold: #14181f;

  /* ---- Typography ---- */
  --font-display: "Archivo", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-body: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;

  /* major-third scale (1.25) */
  --fs-xs: .75rem;
  --fs-sm: .875rem;
  --fs-base: 1rem;
  --fs-md: 1.125rem;
  --fs-lg: 1.25rem;
  --fs-xl: 1.563rem;
  --fs-2xl: 1.953rem;
  --fs-3xl: 2.441rem;
  --fs-4xl: clamp(2.6rem, 5vw, 3.052rem);
  --fs-5xl: clamp(3rem, 7vw, 4.6rem);

  --lh-tight: 1.04;
  --lh-snug: 1.18;
  --lh: 1.6;
  --tracking-cap: .08em;

  /* ---- Spacing (8px grid, 4px half-step) ---- */
  --s-1: .25rem;
  --s-2: .5rem;
  --s-3: .75rem;
  --s-4: 1rem;
  --s-5: 1.5rem;
  --s-6: 2rem;
  --s-7: 3rem;
  --s-8: 4rem;
  --s-9: 6rem;
  --s-10: 8rem;

  /* ---- Radius ---- */
  --r-sm: 6px;
  --r: 10px;
  --r-lg: 16px;
  --r-pill: 999px;

  /* ---- Elevation (dark surfaces lean on glow, not heavy shadow) ---- */
  --sh-1: 0 1px 2px rgba(0, 0, 0, .4);
  --sh-2: 0 8px 24px rgba(0, 0, 0, .45);
  --sh-3: 0 24px 60px rgba(0, 0, 0, .55);
  --glow-crimson: 0 10px 40px rgba(200, 16, 46, .35);
  --glow-gold: 0 10px 40px rgba(242, 169, 0, .22);

  /* ---- Motion ---- */
  --dur-1: .15s;
  --dur-2: .25s;
  --dur-3: .45s;
  --dur-4: .6s;
  --ease: cubic-bezier(.4, 0, .2, 1);
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  --ease-back: cubic-bezier(.34, 1.56, .64, 1);

  /* ---- Layout ---- */
  --maxw: 1200px;
  --maxw-wide: 1400px;
  --header-h: 66px;
  --rgbar-h: 34px;
  --z-header: 50;
  --z-drawer: 80;
  --z-modal: 100;
}