/* Tycoon Picks — Design Tokens
   Source of truth. Every value here is implementation-ready.
   ========================================================= */

:root {
  /* ---------- Surfaces ---------- */
  --bg:          #07070F;   /* Page base */
  --s0:          #08080F;   /* Alt band — deepest */
  --s0b:         #09090F;   /* Alt band — deep */
  --s0c:         #0C0C14;   /* Alt band — elevated base */
  --s1:          #111119;   /* Cards, footer */
  --s2:          #1A1A26;   /* Badges, secondary chrome */
  --s3:          #22223A;   /* Tertiary surface */

  /* ---------- Gold (primary) ---------- */
  --gold-d:      #7A6010;
  --gold:        #C9A227;
  --gold-l:      #E8C547;
  --gold-grad:   linear-gradient(135deg, #7A6010 0%, #C9A227 40%, #E8C547 60%, #C9A227 100%);

  /* ---------- Gold tints (borders / glows) ---------- */
  --g-08:        rgba(201,162,39,0.08);
  --g-15:        rgba(201,162,39,0.15);
  --g-25:        rgba(201,162,39,0.25);
  --g-35:        rgba(201,162,39,0.35);
  --g-40:        rgba(201,162,39,0.40);
  --g-60:        rgba(201,162,39,0.60);

  /* ---------- Violet (secondary accent) ---------- */
  --violet:      #7B3FE4;
  --violet-dim:  rgba(123,63,228,0.15);

  /* ---------- Text ---------- */
  --txt:         #F0EDE8;   /* Primary — warm off-white */
  --muted:       #8891A4;   /* Body/secondary — cool gray */
  --fine:        #555566;   /* Tertiary / fine print */

  /* ---------- Semantic ---------- */
  --ok:          #22C55E;
  --err:         #EF4444;
  --err-soft:    #FF6B6B;

  /* ---------- Type families ---------- */
  --ff-display:  "Bebas Neue", "Arial Narrow", sans-serif;
  --ff-serif:    "Playfair Display", "Didot", "GT Super", Georgia, serif;
  --ff-ui:       "Oswald", "Arial Narrow", sans-serif;
  --ff-body:     "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --ff-mono:     "JetBrains Mono", "SF Mono", ui-monospace, monospace;
  --ff-email:    Arial, Helvetica, sans-serif;

  /* ---------- Spacing scale (4px base) ---------- */
  --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-12: 48px;
  --sp-16: 64px;
  --sp-20: 80px;
  --sp-24: 96px;

  /* ---------- Radii ---------- */
  --r-sm: 4px;    /* Buttons, inputs */
  --r-md: 8px;    /* Cards */
  --r-lg: 20px;   /* Pills, badges */
  --r-full: 999px;

  /* ---------- Shadows ---------- */
  --sh-card:     0 1px 2px rgba(0,0,0,0.6), 0 4px 16px rgba(0,0,0,0.4);
  --sh-card-hv:  0 1px 2px rgba(0,0,0,0.6), 0 12px 32px rgba(0,0,0,0.55), 0 0 40px rgba(201,162,39,0.06);
  --sh-gold:     0 2px 8px rgba(201,162,39,0.30), 0 8px 24px rgba(201,162,39,0.12);
  --sh-gold-hv:  0 4px 14px rgba(201,162,39,0.42), 0 14px 40px rgba(201,162,39,0.22);

  /* ---------- Motion ---------- */
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --ease-smooth: cubic-bezier(0.25, 1, 0.5, 1);
  --dur-micro: 0.18s;
  --dur-enter: 0.6s;

  /* ---------- Layout ---------- */
  --container: 1240px;
  --gutter:    24px;
  --nav-h:     68px;
}
