/* ============================================================
   GoPlay India — "Midnight Vault" (premium dark)
   tokens.css — palette, type scale, spacing, elevation, motion
   Single committed dark look: no light palette, no prefers-color-scheme
   swap. Every colour is defined once, here.
   ============================================================ */


:root {
  color-scheme: dark;

  /* ── Raw palette ──────────────────────────────────────────
     Cool near-black bases, warm metallic accents. The two
     "on" inks are what sits on top of a bright accent fill. */
  --void:      #07090C;
  --night:     #0B0D10;
  --night-2:   #0F1319;
  --slate:     #14181F;
  --slate-2:   #1B212A;
  --slate-3:   #232B36;

  --gold:      #D9B44A;
  --gold-hi:   #F0D083;
  --gold-lo:   #A9862C;
  --amber:     #E8A33D;
  --emerald:   #16C08A;
  --azure:     #6EA8FE;
  --ruby:      #F0533F;

  --mist:      #F3F5F8;
  --mist-2:    #A7B2C0;
  --mist-3:    #828FA0;

  /* ── Semantic surfaces / text ── */
  --bg:          var(--night);
  --bg-alt:      var(--night-2);
  --surface:     var(--slate);
  --surface-2:   var(--slate-2);
  --fg:          var(--mist);
  --fg-soft:     var(--mist-2);
  --fg-faint:    var(--mist-3);

  /* Hairlines rather than the old 2px ink borders */
  --line:        rgba(255, 255, 255, 0.10);
  --line-strong: rgba(255, 255, 255, 0.18);
  --line-soft:   rgba(255, 255, 255, 0.06);
  --shadow-col:  rgba(0, 0, 0, 0.72);

  /* Inverted surface: a deeper well than the page, used for bars
     and stat strips that should read as inset rather than raised. */
  --inv-bg:     var(--void);
  --inv-fg:     var(--mist);
  --inv-accent: var(--gold-hi);

  /* ── Semantic accents ── */
  --accent:        var(--gold);
  --accent-on:     var(--void);          /* text that sits on --accent */
  --accent-2:      var(--amber);
  --accent-2-on:   var(--void);
  --money:         var(--emerald);
  --money-on:      var(--void);
  --link:          var(--gold-hi);
  --focus:         var(--gold-hi);
  --danger:        var(--ruby);
  --info:          var(--azure);
  /* Legacy alias: older rules set `color: var(--paper)` on bright
     chips. In this palette those need dark ink, not light. */
  --paper:         var(--void);

  /* ── Gradients ── */
  --grad-gold:    linear-gradient(135deg, var(--gold-hi) 0%, var(--gold) 46%, var(--gold-lo) 100%);
  --grad-surface: linear-gradient(180deg, rgba(255,255,255,.045) 0%, rgba(255,255,255,0) 58%);
  --grad-panel:   linear-gradient(150deg, var(--slate-2) 0%, var(--slate) 55%, var(--night-2) 100%);
  --grad-sheen:   linear-gradient(90deg, transparent, rgba(255,255,255,.10), transparent);

  /* ── Type stacks ── */
  --font-display: "Sora", "Work Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-body:    "Work Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-mono:    "JetBrains Mono", ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;

  /* ── Fluid type scale ── */
  --t-xs:   0.76rem;
  --t-sm:   0.875rem;
  --t-base: 1.0625rem;                             /* 17px */
  --t-md:   clamp(1.06rem, 0.4vw + 0.98rem, 1.19rem);
  --t-lg:   clamp(1.19rem, 0.7vw + 1.05rem, 1.45rem);
  --t-h3:   clamp(1.2rem, 0.9vw + 1.02rem, 1.55rem);
  --t-h2:   clamp(1.7rem, 2.6vw + 1rem, 2.7rem);
  --t-h1:   clamp(2.3rem, 5.2vw, 4rem);
  --t-mega: clamp(4rem, 17vw, 11rem);

  --lh-tight: 1.1;
  --lh-snug:  1.3;
  --lh-body:  1.7;
  --measure:  70ch;

  /* ── Spacing scale ── */
  --s-1:  4px;
  --s-2:  8px;
  --s-3:  12px;
  --s-4:  16px;
  --s-5:  24px;
  --s-6:  32px;
  --s-7:  48px;
  --s-8:  64px;
  --s-9:  96px;
  --gutter:  clamp(18px, 4vw, 44px);
  --band:    clamp(56px, 7.5vw, 104px);
  --container: 1200px;

  /* ── Edges ── */
  --bw:        1px;
  --bw-thick:  2px;
  --r-0:       0px;
  --r-1:       14px;
  --r-2:       20px;
  --r-pill:    999px;
  --offset:    0px;                       /* legacy: no hard offset now */
  --offset-sm: 0px;

  /* ── Elevation ──
     The old --hard / --hard-sm names are kept so every existing rule
     keeps working; they now resolve to soft depth instead of a
     stamped ink offset. */
  --hard-sm:   0 2px 6px -2px rgba(0,0,0,.5),
               0 8px 22px -12px rgba(0,0,0,.7),
               inset 0 1px 0 rgba(255,255,255,.05);
  --hard:      0 4px 12px -4px rgba(0,0,0,.55),
               0 22px 48px -20px rgba(0,0,0,.8),
               inset 0 1px 0 rgba(255,255,255,.06);
  --hard-accent: 0 10px 34px -12px rgba(217,180,74,.55),
                 inset 0 1px 0 rgba(255,255,255,.14);
  --glow-gold:   0 0 0 1px rgba(217,180,74,.34),
                 0 10px 32px -8px rgba(217,180,74,.42);
  --glow-money:  0 0 0 1px rgba(22,192,138,.32),
                 0 10px 30px -10px rgba(22,192,138,.38);
  --ring:        0 0 0 1px var(--line-strong);

  /* ── Motion ── */
  --ease-out:  cubic-bezier(.22, 1, .36, 1);
  --ease-in:   cubic-bezier(.55, 0, 1, .45);
  --ease-spring: cubic-bezier(.34, 1.4, .64, 1);
  --d-fast:    160ms;
  --d-base:    260ms;
  --d-slow:    420ms;
  --d-ambient: 900ms;
  --tr-press: transform var(--d-fast) var(--ease-out), box-shadow var(--d-fast) var(--ease-out);
  --tr-lift:  transform var(--d-base) var(--ease-out), box-shadow var(--d-base) var(--ease-out),
              border-color var(--d-base) linear;
  --tr-tint:  background-color var(--d-fast) linear, color var(--d-fast) linear,
              border-color var(--d-fast) linear;

  /* ── z-index ladder ── */
  --z-ambient:   0;
  --z-raised:    1;
  --z-sticky:    20;
  --z-nav:       60;
  --z-drawer:    70;
  --z-bar:       80;
  --z-toast:     90;
  --z-modal:    100;
  --z-progress: 110;
}
