/* Dynasty Card Vault design tokens (from the Claude Design system). */
:root{
  /* Ink: near-black, faintly blue */
  --ink-0:#08090c;
  --ink-50:#0a0b0f;   /* page background */
  --ink-100:#0e0f14;  /* alt section / footer */
  --ink-150:#0f1219;  /* header */
  --ink-200:#11141b;  /* card / panel */
  --ink-300:#171b24;  /* raised row / spot tile */
  --ink-400:#1d212b;  /* hover raise */
  --ink-500:#26272c;  /* icon well */

  /* Lines */
  --line-1:rgba(255,255,255,0.06);
  --line-2:rgba(255,255,255,0.09);
  --line-3:rgba(255,255,255,0.16);

  /* Text */
  --paper:#ffffff;
  --fg-1:#f4f5f7;
  --fg-2:#9b9ea8;
  --fg-3:#6b6e78;
  --fg-4:#4a4d56;

  /* Gold: the single brand accent */
  --gold-100:#fff3cf;  /* prices, hover links */
  --gold-300:#e6c77d;
  --gold-400:#d9b45f;
  --gold-500:#c9a24b;
  --gold-600:#a9873c;
  --gold-700:#6e5a2e;  /* disabled / sold-out fill */
  --gold-ink:#141006;  /* text on gold */
  --gold-line:rgba(201,162,75,0.45);
  --gold-wash:rgba(201,162,75,0.12);
  --gold-gradient:linear-gradient(180deg,#fff3cf 0%,#e6c77d 40%,#c9a24b 70%,#f0d58e 100%);
  --hero-gradient:linear-gradient(180deg,#bcd6ff 0%,#4f86ff 28%,#1546d6 55%,#0a2a9c 75%,#3a78ff 100%);

  /* Status */
  --live:#e0485a;
  --live-text:#ff8a98;
  --live-wash:rgba(224,72,90,0.14);
  --live-line:rgba(224,72,90,0.5);

  /* Sport card-art hues */
  --sport-nba:#8a4a22;
  --sport-mlb:#1f3f72;
  --sport-nfl:#1d6a3e;
  --sport-nhl:#1f5a72;

  /* Semantic aliases */
  --surface-page:var(--ink-50);
  --surface-alt:var(--ink-100);
  --surface-header:rgba(15,18,25,0.92);
  --surface-card:var(--ink-200);
  --surface-card-head:rgba(255,255,255,0.02);
  --surface-raised:var(--ink-300);

  /* Type */
  --font-display:'Space Grotesk',ui-sans-serif,system-ui,sans-serif;
  --font-body:'Inter',ui-sans-serif,system-ui,sans-serif;
  --font-mono:'Space Mono',ui-monospace,monospace;
  --font-hero:'Cinzel',Georgia,serif;
  --tracking-eyebrow:0.28em;
  --tracking-label:0.16em;
  --type-body:400 15px/1.6 var(--font-body);
  --type-eyebrow:500 12px/1.2 var(--font-display);
  --type-label:500 11px/1.2 var(--font-display);

  /* Layout */
  --container:1232px;
  --gutter:24px;
  --grid-gap:18px;
  --radius-xs:4px;
  --radius-md:10px;
  --radius-lg:14px;
  --radius-xl:18px;
  --radius-pill:999px;

  /* Effects */
  --shadow-card:0 1px 0 rgba(255,255,255,0.03) inset,0 10px 30px rgba(0,0,0,0.35);
  --shadow-gold-glow:0 6px 22px rgba(201,162,75,0.28);
  --shadow-pop:0 20px 50px rgba(0,0,0,0.55);
  --ease-out:cubic-bezier(.2,.7,.2,1);
  --dur-fast:140ms;
  --dur-med:220ms;
}