/* ==========================================================================
   BRAND TOKENS — USA Casino Game Agent (B2 identity, finalized 5 Oct 2026)
   Friend spec §4 color system + §11 reusable tokens.
   Import FIRST in every v2 page:  <link rel="stylesheet" href="/brand/brand-tokens.css?v=1">
   ========================================================================== */
:root {
  /* colors */
  --b-ink: #080B12;            /* page background – near black */
  --b-navy: #111827;           /* panels – dark navy */
  --b-navy-2: #0B1220;         /* deeper panel */
  --b-line: #1F2A44;           /* hairline borders */
  --b-gold: #D4AF37;           /* primary accent */
  --b-gold-hi: #F5C542;        /* highlight gold */
  --b-gold-lo: #B08A28;        /* gold shadow */
  --b-white: #F5F5F5;          /* text white */
  --b-mute: #94A3B8;           /* muted text */
  --b-inktxt-on-gold: #14120B; /* text on gold buttons */
  /* type scale */
  --b-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --b-h1: 800 clamp(28px, 4.8vw, 44px)/1.15 var(--b-font);
  --b-h2: 800 clamp(21px, 3.4vw, 30px)/1.25 var(--b-font);
  --b-body: 400 16px/1.6 var(--b-font);
  /* components */
  --b-radius: 14px;
  --b-card-pad: 18px;
  --b-gap: 16px;
}
body { background: var(--b-ink); color: var(--b-white); font: var(--b-body); -webkit-font-smoothing: antialiased; }
.b-card { background: var(--b-navy); border: 1px solid var(--b-line); border-radius: var(--b-radius); padding: var(--b-card-pad); }
.b-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  height: 44px; padding: 0 20px; border-radius: 11px;
  font: 700 14.5px var(--b-font); border: 1px solid transparent; cursor: pointer;
  transition: transform .12s ease, filter .15s ease; text-decoration: none;
}
.b-btn:active { transform: scale(.97); }
.b-btn-gold { background: linear-gradient(180deg, var(--b-gold-hi), var(--b-gold)); color: var(--b-inktxt-on-gold); }
.b-btn-gold:hover { filter: brightness(1.07); }
.b-btn-ghost { background: transparent; border-color: var(--b-line); color: var(--b-mute); }
.b-btn-ghost:hover { color: var(--b-white); border-color: #33456E; }
.b-badge { display: inline-block; padding: 4px 9px; border-radius: 7px; font: 800 10.5px var(--b-font); letter-spacing: .06em; background: linear-gradient(180deg, var(--b-gold-hi), var(--b-gold)); color: var(--b-inktxt-on-gold); }
.b-eyebrow { color: var(--b-gold); font: 700 12.5px var(--b-font); letter-spacing: .14em; text-transform: uppercase; }