/* ─────────────────────────────────────────────────────────────────
   tokens.css
   Extracted from kurtezy-v2.html on 2026-04-19 (Item 7 of audit
   2026-04-19 — see docs/PLAYING-CARD-UNIFICATION-2026-04-19.md).
   Loaded from kurtezy-v2.html via <link rel="stylesheet">.
   ───────────────────────────────────────────────────────────────── */

/* ════════════════════════════════════════════════════════════════
   KURTEZY v7 — SPA Shell + Taxonomy + Persistent Player
   Compatible: WooCommerce REST API, React Three Fiber
   ════════════════════════════════════════════════════════════════ */

/* ═══ FONTS (embarquées, identiques à objects.press) ═══ */
/* Fonts — Fontshare CDN (Ben 2026-04-18 WEB-KIT):
   Clash Display (400,500,600) + Satoshi (400,500,700). Loaded via
   <link rel="preconnect"> + <link rel="stylesheet"> injected in the
   document head (outside this <style>). Previous base64 @font-face
   blocks (~600KB inlined) replaced with the CDN pair — same rendering,
   cached across visits. See frontend/KURTEZY-WEB-KIT-BRIEF.md. */

:root {
  --bg:      #E8EBF2;
  --bg-lt:   #EEF2F7;
  --bg-wh:   #F7F9FC;
  --text:    #101828;
  --muted:   #667085;
  --border:  #D3DAE6;

  /* Ben 2026-04-18: "bleu plus clair et électrique, pas de jaune YYD". Shifted
     from deep navy (#1B3F7A) to electric blue so playhead + accents stand out. */
  --v:       #3566E0;
  --v-rgb:   53,102,224;
  --v-dk:    #0E1A36;
  --v-mid:   #7C9DE8;
  --v-mid-rgb: 124,157,232;
  --v-pale:  #DCE5F8;
  --v-glow:  rgba(53,102,224,0.22);

  --ff-h: 'Clash Display', 'Helvetica Neue', Arial, sans-serif;
  /* Ben 2026-04-18 WEB-KIT: ABC Whyte replaced by Satoshi (Fontshare, free,
     humanist metrics nearly identical to Whyte to the naked eye). Original
     Whyte requires a €180 Dinamo licence — not acceptable for web-wide CSS. */
  --ff-b: 'Satoshi', 'Inter', -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Arial, sans-serif;
  --ease: cubic-bezier(.23,1,.32,1);

  --topbar-h:  30px;
  --header-h:  86px;
  --weeknav-h: 44px;
  --player-h:  68px;
  --shell-h:   130px;

  --sh1: 0 1px 3px rgba(0,0,0,.06);
  --sh2: 0 2px 12px rgba(0,0,0,.09);
  --sh3: 0 8px 32px rgba(0,0,0,.14);
}

*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
* { font-family:var(--ff-b); }
html,body { height:100%; overflow:hidden; }
body { background:var(--bg); color:var(--text); -webkit-font-smoothing:antialiased; }
button { border:none; background:none; cursor:pointer; }