/* Design tokens, shared by index.html and every static page (privacy.html, terms.html, ...). Edit them here only. */
/* ============================================================
   CHART ROOM. A printed atlas on a desk: warm paper, ink, deep ocean,
   one amber instrument accent. UI and map share this palette.
   Hex appears in this :root block and nowhere else.
   ============================================================ */
:root {
  --paper-100: #FBF7EC;      /* panels, inputs, HUD surfaces */
  --paper-200: #F4EEDF;      /* page background */
  --paper-300: #CFC6AE;      /* borders, dividers, graticule */
  --land: #EFE6D0;           /* map land */
  --ocean: #2B5F82;          /* map ocean */
  --ink: #14232E;            /* primary text, strokes, icons */
  --ink-2: #4A5A66;          /* secondary text */
  --ink-3: #58646D;          /* tertiary text */
  --accent: #FFB938;         /* amber FILL only: primary CTA, streak, target, score chip */
  --on-accent: #14232E;
  --correct: #1F7A55;        /* correct / safe: text and icons */
  --correct-fill: #2E9266;   /* correct map and row fill, always with ink stroke */
  --wrong: #C2362C;          /* wrong / hazard: text and icons */
  --wrong-fill: #D9453B;     /* wrong map fill, always with ink stroke */
  --dark-map: #0F1B25;       /* skin previews and the share-card banner */

  /* skin palettes. Hex lives here and nowhere else; SKINS_CONFIG refers to these by name. */
  --sk-saffron-1: #F29E1F; --sk-saffron-2: #FFE0A0;
  --sk-cobalt-1: #2457A6;  --sk-cobalt-2: #8CC4F5;
  --sk-neon-1: #19E6E6;    --sk-neon-2: #FF3FD8;   --sk-neon-3: #F4FCFF;
  --sk-spit-body: #7C8750; --sk-ember-1: #FF7A1A;  --sk-ember-2: #FFD84A; --sk-ember-3: #E5381F;
  --sk-stealth-1: #1B2A38; --sk-stealth-2: #6FD6C8; --sk-stealth-3: #A99BFF;

  --r-sm: 4px;               /* inputs, keycaps */
  --r-md: 10px;              /* panels */
  --r-pill: 999px;           /* chips and avatars only */

  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 24px; --sp-6: 32px; --sp-7: 48px; --sp-8: 64px;
  --touch: 44px;

  --elev: 0 1px 0 rgba(20,35,46,.12), 0 6px 16px -8px rgba(20,35,46,.25);   /* HUD and modals only */

  --font-display: "Bricolage Grotesque", "Arial Narrow", Arial, sans-serif;
  --font-body: "Figtree", "Helvetica Neue", Arial, sans-serif;
  --font-num: "JetBrains Mono", "Courier New", monospace;
  --fs-12: 12px; --fs-14: 14px; --fs-16: 16px; --fs-20: 20px; --fs-28: 28px; --fs-48: 48px;
  --lh-tight: 1.1; --lh-body: 1.5;

  --ease: cubic-bezier(0.23, 1, 0.32, 1);
  --t-press: 160ms;
  --t-fast: 160ms;
  --t-med: 240ms;
  --t-reward: 600ms;
}