/* ============================================================
   TRIANGLE COIN OP — DESIGN TOKENS
   Source of truth for color, type, spacing, shadow.
   Extracted from Triangle Coin Op Brand Kit v1.0
   ============================================================ */

:root {
  /* ---------- Color: Darks ---------- */
  --void:          #0B0401;
  --mahogany:      #160804;
  --rosewood:      #2A1209;
  --tobacco:       #3A1A0E;

  /* ---------- Color: Copper ---------- */
  --rust:          #8B3E1A;
  --copper-mid:    #A85A2A;
  --copper:        #C07035;
  --copper-bright: #D48040;

  /* ---------- Color: Gold ---------- */
  --gold-dark:     #8B6E1A;
  --gold:          #C8A534;
  --gold-mid:      #DAB84A;
  --gold-light:    #EDCC74;
  --gold-pale:     #F5E2A0;

  /* ---------- Color: Steel (B2B) ---------- */
  --gunmetal:      #3A4E5A;
  --steel:         #546B7A;
  --steel-light:   #7A9BAD;
  --steel-pale:    #A8C2CC;

  /* ---------- Color: Patina ---------- */
  --patina-dark:   #2E4A40;
  --patina:        #4A7A68;
  --verdigris:     #6AAF95;

  /* ---------- Color: Text ---------- */
  --parchment-dk:  #C4A870;
  --parchment:     #DFC090;
  --cream:         #F0E2C0;
  --ivory:         #F8F0DC;
  --chrome:        #AAAAAA;

  /* ---------- Typography ---------- */
  --font-display:  'Cinzel Decorative', Georgia, serif;
  --font-heading:  'Cinzel', Georgia, serif;
  --font-body:     'Spectral', Georgia, serif;
  --font-mono:     'Courier New', monospace;

  --tracking-tight:  0.02em;
  --tracking-normal: 0.04em;
  --tracking-wide:   0.2em;
  --tracking-wider:  0.4em;
  --tracking-widest: 0.6em;

  /* ---------- Spacing ---------- */
  --space-xs:  4px;
  --space-sm:  8px;
  --space-md:  16px;
  --space-lg:  32px;
  --space-xl:  64px;
  --space-2xl: 128px;

  /* ---------- Radius ---------- */
  --radius-sm:   4px;
  --radius-md:   8px;
  --radius-lg:   16px;
  --radius-pill: 999px;

  /* ---------- Shadow ---------- */
  --shadow-copper: 0 2px 8px rgba(160,80,30,0.5), inset 0 1px 0 rgba(255,200,100,0.2);
  --shadow-gold:   0 4px 16px rgba(200,165,52,0.4), inset 0 1px 0 rgba(255,230,140,0.3);
  --shadow-deep:   0 8px 32px rgba(0,0,0,0.8);
  --shadow-steel:  0 2px 8px rgba(58,78,90,0.5), inset 0 1px 0 rgba(168,194,204,0.2);

  /* ---------- Layout ---------- */
  --container-max: 1280px;
  --header-height: 80px;
}