/* ==========================================================================
   anTee Up — High-Fidelity Design Tokens
   Mirrors lib/core/theme/app_colors.dart + DESIGN.md §3–§6.
   The live app ships the DARK EDITORIAL surface across every screen, so the
   editorial palette is primary here. Light/app tokens are retained for the
   logo splash and any future light-surface work.
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;0,800;1,400;1,500;1,600;1,700&family=DM+Sans:ital,opsz,wght@0,9..40,300;0,9..40,400;0,9..40,500;0,9..40,600;0,9..40,700;1,9..40,300;1,9..40,400&family=Open+Sans:ital,wght@0,400;0,600;0,700;1,400&display=swap');

:root {
  /* ── Editorial palette (dark) — primary ─────────────────────────────── */
  --web-bg:            #091910; /* body background (deep forest) */
  --web-bg2:           #0E2219; /* section variant 1 */
  --web-bg3:           #1B3A2D; /* section variant 2 */
  --web-bg-mid:        #244D3C; /* card surfaces on dark */
  --web-bg-light:      #2E6449; /* subtle inset variant */
  --gold:              #C9A84C; /* champagne — eyebrows, accents, CTAs */
  --gold-light:        #E2C47A; /* hover */
  --gold-dark:         #A8862A; /* pressed */
  --text:              #F0EBE0; /* primary text on dark */
  --text-secondary:    #9DB5A8; /* body / secondary */
  --text-muted:        #4E6A5C; /* muted meta */
  --live:              #5BE584; /* live / positive money on dark */
  --negative:          #F0805F; /* negative money on dark */

  /* surface tints derived from white/gold alpha (atoms layer) */
  --card-bg:           rgba(255,255,255,0.04);
  --card-bg-soft:      rgba(255,255,255,0.03);
  --card-border:       rgba(201,168,76,0.18);  /* gold @ 0.18 */
  --card-border-soft:  rgba(201,168,76,0.12);
  --glass-bg:          rgba(255,255,255,0.06);
  --glass-border:      rgba(201,168,76,0.20);
  --gold-045:          rgba(201,168,76,0.45);
  --gold-014:          rgba(201,168,76,0.14);
  --hairline:          rgba(201,168,76,0.12);
  --white-018:         rgba(255,255,255,0.18);

  /* ── App palette (light) — logo/splash + legacy ─────────────────────── */
  --primary:           #1B4D3E;
  --primary-container: #2D6A5A;
  --primary-deep:      #1B3A2D;
  --accent:            #E67E22; /* logo + tee glyph ONLY */
  --secondary:         #27AE60;
  --bg:                #F6F5F0;
  --surface:           #FFFFFF;
  --accent-light:      #D8F3DC;
  --divider:           #E8E4DD;
  --on-surface:        #1A1A1A;
  --on-surface-var:    #5C5C5C;
  --neutral:           #78858F;
  --win:               #2D6A4F;
  --loss:              #C0392B;
  --gold-trophy:       #D4A94B;
  --silver:            #9AADBD;
  --bronze:            #C08B5C;

  /* ── Typography ─────────────────────────────────────────────────────── */
  --font-display: 'Playfair Display', Georgia, 'Times New Roman', serif;
  --font-body:    'DM Sans', system-ui, -apple-system, sans-serif;
  --font-app:     'Open Sans', system-ui, -apple-system, sans-serif;

  /* ── Spacing & shape (§5) ───────────────────────────────────────────── */
  --page-px:      22px;  /* editorial page horizontal padding */
  --section-gap:  28px;
  --inner-gap:    14px;
  --card-radius:  18px;
  --pill-radius:  100px;
  --input-radius: 13px;
  --btn-h:        48px;

  /* device target (§10): iPhone 14 class */
  --device-w: 402px;
  --device-h: 874px;
}