/* ═══════════════════════════════════════════════════════════════════════
   TOKENS — SOURCE UNIQUE DE VÉRITÉ
   Chargé EN PREMIER (avant base / components / pages / premium).
   RÈGLE D'OR : tout token se modifie ICI, et nulle part ailleurs.
   base.css et premium.css n'ont plus de :root — ils consomment ces tokens.

   NB : les valeurs ci-dessous reproduisent EXACTEMENT le rendu effectif
   d'avant la centralisation (premium.css gagnait sur base.css). Aucun
   changement visuel n'est introduit par ce fichier.
   ═══════════════════════════════════════════════════════════════════════ */
:root{
  /* ───────── Surfaces & fond ───────── */
  --bg:      #05070c;
  --panel:   #0b121c;
  --panel2:  #0f1927;
  --border:  #203149;
  --border2: #2d4565;

  /* ───────── Texte ───────── */
  --text:   #eaf4ff;
  --muted:  #9cb3cf;
  --muted2: #7d96b6;   /* relevé de #6e87a7 → ~5:1 même sur carte translucide claire (AA) */

  /* ───────── Couleurs sémantiques ─────────
     --accent / --acc = BLEU : navigation, sélection, action primaire neutre
     --good = vert trading (gains/succès) · --bad = rouge trading (pertes)
     --warn = or/ambre (pending/avertissement) */
  --accent: #67b7ff;
  --acc:    #67b7ff;
  --good:   #65e39a;
  --bad:    #ff7474;
  --warn:   #ffce6e;

  /* Or (accent login / halo) — historiquement présents */
  --gold1: rgba(246,195,67,.95);
  --gold2: rgba(246,195,67,.35);
  --gold3: rgba(246,195,67,.18);

  /* ───────── Typographie ───────── */
  --font: "Space Grotesk", "Plus Jakarta Sans", "Avenir Next", "Segoe UI", sans-serif;
  --mono: "JetBrains Mono", "Cascadia Code", "SFMono-Regular", Consolas, monospace;

  /* ───────── Rayons ───────── */
  --radius-1: 14px;
  --radius-2: 18px;
  --radius-3: 24px;

  /* ───────── Espacement (échelle existante, conservée) ───────── */
  --sp-1: 6px;
  --sp-2: 10px;
  --sp-3: 14px;
  --sp-4: 18px;
  --sp-5: 24px;

  /* ───────── Verre / strokes blancs ───────── */
  --glass:  rgba(8,13,22,.70);
  --glass2: rgba(11,18,30,.76);
  --stroke:  rgba(255,255,255,.08);
  --stroke2: rgba(255,255,255,.12);

  /* ───────── Ombre ───────── */
  --shadow: 0 14px 40px rgba(0,0,0,.55);

  /* ───────── Tabbar (mobile) ───────── */
  --tabbar-safe: env(safe-area-inset-bottom);
  --tabbar-h: 148px;
  --tabbar-top: 72px;
  --tabbar-bottom: 54px;
  --tabbar-inner-bottom-gap: 16px;
  --tab-btn-h: 44px;

  /* ═════════════════════════════════════════════════════════════════════
     NOUVELLES ÉCHELLES (additives — pas encore consommées).
     Introduites pour les lots de refonte à venir ; n'altèrent pas le rendu
     tant qu'aucune règle ne les utilise.
     ═════════════════════════════════════════════════════════════════════ */

  /* État actif / sélection unifié (BLEU) — voir lot sémantique couleur */
  --state-active: var(--accent);

  /* Anneau de focus clavier unique */
  --ring: 0 0 0 3px rgba(103,183,255,.45);

  /* Échelle typographique */
  --fs-1: 11px;                       /* kicker / caption */
  --fs-2: 12px;
  --fs-3: 13px;
  --fs-body: 14px;                    /* corps */
  --fs-4: 14px;
  --fs-5: 16px;                       /* titres de carte */
  --fs-6: 20px;                       /* titres de section forts */
  --fs-7: clamp(24px, 3vw, 30px);     /* hero / H1 */

  /* Graisses (Space Grotesk chargé en 400/500/600/700 — pas de faux-gras) */
  --fw-regular:  500;
  --fw-medium:   600;
  --fw-semibold: 700;
  --fw-bold:     700;

  /* Hauteurs de ligne */
  --lh-tight: 1.1;
  --lh-snug:  1.25;
  --lh-body:  1.45;

  /* Espacement étendu (4px) — complète l'échelle existante */
  --sp-0: 0;
  --sp-6: 32px;
  --sp-7: 40px;

  /* Rayons étendus */
  --radius-xs:   10px;
  --radius-pill: 999px;

  /* Élévation (échelle) */
  --shadow-1: 0 6px 18px rgba(0,0,0,.35);
  --shadow-2: 0 14px 34px rgba(0,0,0,.42);
  --shadow-3: 0 22px 54px rgba(0,0,0,.55);
  --shadow-focus: var(--ring);

  /* Bordures translucides bleutées (remplace ~200 rgba(165,202,244,.x) à la main) */
  --stroke-1: rgba(165,202,244,.14);
  --stroke-2: rgba(165,202,244,.20);
  --stroke-3: rgba(165,202,244,.26);

  /* Marque verte réelle (rendu actuel des boutons trading/nav) */
  --brand-green: #7ee081;

  /* Motion */
  --dur-1: 120ms;
  --dur-2: 180ms;
  --dur-3: 280ms;
  --dur-4: 360ms;
  --ease-out:    cubic-bezier(.2,.7,.2,1);
  --ease-in-out: cubic-bezier(.65,0,.35,1);
  --ease-spring: cubic-bezier(.34,1.56,.64,1);
}