/* tokens.css — the single source of truth for design tokens shared across the
   Elysium front end. No selectors other than :root here; every other stylesheet
   consumes these variables and never redefines a colour, duration or easing.
   (Breakpoints are documented here for reference; CSS media queries cannot read
   custom properties, so the pixel values are repeated literally in layout CSS.
   Keep them in sync with --bp-* below.) */
:root{
  /* palette */
  --bg:#0f0e0c; --bg-2:#141310; --panel:#16140f;
  --ink:#ede7da; --ink-soft:#b3aa98; --ink-dim:#7d7464;
  --gold:#c9a558; --gold-soft:#d9bd7e;
  --line:rgba(201,165,88,.18); --line-soft:rgba(237,231,218,.08);
  --green:#6fae74; --red:#c97a6a;

  /* typography */
  --serif:'Fraunces',Georgia,serif;
  --sans:'Outfit',-apple-system,sans-serif;

  /* spacing scale */
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:20px;
  --sp-6:24px; --sp-8:32px; --sp-10:40px; --sp-14:56px;

  /* radii + control sizes + container */
  --radius:4px; --radius-sm:3px; --radius-lg:6px;
  --ctrl-h:40px; --nav-h:38px; --icon-btn:34px;
  --container:1120px; --nav-btn-w:124px;

  /* elevation + z-index scale */
  --shadow-1:0 8px 24px rgba(0,0,0,.4);
  --z-nav:100; --z-menu:200; --z-modal:300; --z-modal-2:320; --z-toast:400; --z-top:80;

  /* motion — the shared language (mirrors the index page) */
  --ease:cubic-bezier(.4,0,.2,1);
  --dur-fast:.18s; --dur:.25s; --dur-slow:.6s;
  --reveal-shift:24px; --stagger:100ms;

  /* breakpoints (reference only — repeated literally in media queries) */
  --bp-sm:600px; --bp-mob:760px; --bp-wrap:820px;
}