/* SpinBoost — theme-tokens.css (Phase 2b : SOURCE UNIQUE DES COULEURS).
   Aucune couleur en dur ne doit vivre ailleurs que dans ce fichier.
   4 sections : rôles de charte · teintes · zones sombres · marques tierces.
   + remap des variables héritées (les theme-<famille>.css consomment ces tokens). */

:root{
  /* ============ 1. RÔLES DE CHARTE (thème clair) ============ */
  /* Fondations */
  --surface:#FCFAF3;      /* blanc cassé — fond principal */
  --surface-2:#F7F4EA;    /* sable — bandeaux / zones alternées */
  --surface-hi:#FFFFFF;   /* blanc pur — cartes */
  --line:#E8E3D6;         /* bordure */
  /* Encre / texte */
  --ink:#1A1A1A;
  --ink-soft:#43403A;
  --ink-pale:#6E6A5E;
  /* Accents par rôle */
  --action:#7C3AED;       /* violet — action / marque / chiffres */
  --action-deep:#6D28D9;
  --action-ink:#4C1D95;   /* violet foncé — donnée dessinée (barres, segments) */
  --reward:#E8477F;       /* framboise — récompenses / lots */
  --reward-deep:#C42D62;
  --valid:#2FC4AE;        /* menthe — validations / inclus (coches) */
  --step:#F2843F;         /* corail — étapes / sur-titres / chevrons */
  --step-deep:#B0521C;    /* corail foncé si texte < 14px */
  --sun:#F5C93E;          /* solaire — roue / badges / étoiles */
  --proof:#4FC96E;        /* vert frais — preuves / résultats chiffrés */
  /* Dégradés de marque (violet) et reflets */
  --grad:linear-gradient(135deg,#C4B5FD 0%,#8B5CF6 42%,#6D28D9 100%);
  --grad-metal:linear-gradient(150deg,#EDE9FE 0%,#A78BFA 30%,#6D28D9 70%,#4C1D95 100%);
  --violet-soft:#A78BFA;  /* reflet clair (pointeur roue, halos) */
  --violet-hi:#C4B5FD;
  --violet-mid:#8B5CF6;   /* violet intermédiaire (bordures/glows sombres hérités) */

  /* ============ 2. TEINTES PAR RÔLE (fonds/bordures translucides) ============ */
  --action-tint:rgba(124,58,237,.10);      /* puce/cellule accent */
  --action-tint-soft:rgba(124,58,237,.06); /* carte "feature" */
  --action-tint-strong:rgba(124,58,237,.16);/* ligne mise en avant */
  --action-line:rgba(124,58,237,.45);
  --action-line-soft:rgba(124,58,237,.30);
  --valid-tint:rgba(47,196,174,.14);
  --valid-line:rgba(47,196,174,.32);
  --proof-tint:rgba(79,201,110,.12);
  --proof-line:rgba(79,201,110,.32);
  --sun-tint:rgba(245,201,62,.28);
  --sun-line:rgba(245,201,62,.60);
  /* Variantes FONCÉES pour ACCENT EN TEXTE sur fond clair (≥4,5:1 sur blanc et blanc cassé).
     Règle : aplat/icône = teinte vive ; texte sur clair = variante foncée. */
  --valid-ink:#0F766E;    /* menthe foncée (texte) — 5.24 sur blanc cassé */
  --proof-ink:#1F7A3D;    /* vert frais foncé (texte) — 5.14 */
  --badge-ink:#B0521C;    /* solaire n'a pas de foncé crédible → corail foncé pour le texte — 4.94 */
  --on-action:#FFFFFF;    /* texte/glyphe sur violet plein */
  --on-proof:#04210f;     /* texte sur vert plein (éco-pill) */
  --on-sun:#3a2a00;       /* texte sur solaire plein */
  --shadow-card:rgba(26,26,26,.06);
  --shadow-card-lg:rgba(26,26,26,.20);

  /* ============ 3. ZONES SOMBRES (mockup, modale de jeu, footer) ============ */
  --dark-bg:#0A0816;      /* base sombre (dégradés produit) */
  --dark-bg-2:#100B22;
  --footer-bg:#070512;    /* footer de clôture */
  --dark-screen:#150e2c;  /* écran téléphone — stops de dégradé */
  --dark-screen-2:#0e0a22;
  --dark-screen-3:#1b1140;
  --grad-chassis:linear-gradient(135deg,#4C4C56 0%,#26262E 22%,#101014 54%,#1D1D25 78%,#3C3C46 100%); /* châssis titane du mockup */
  --chassis-island:#050506;            /* Dynamic Island */
  --chassis-island-ring:rgba(160,160,172,.30); /* liseré qui détache l'île de l'écran sombre */
  --grad-chassis-btn:linear-gradient(#42424C,#191920); /* tranche latérale */
  --chassis-edge:rgba(255,255,255,.08);
  --chassis-edge-hi:rgba(255,255,255,.14);
  --chassis-shade:rgba(0,0,0,.55);
  --dark-panel:#1c1340;   /* cartes/modales sombres — stops */
  --dark-panel-2:#0e0a20;
  --dark-panel-3:#241646;
  --dark-line:rgba(167,139,250,.16);   /* bordures internes sombres */
  --dark-line-2:rgba(196,181,253,.28);
  --on-dark:#FFFFFF;      /* texte clair sur sombre */
  --on-dark-soft:#cdd0e0;
  --on-dark-mut:#a9adc2;
  --on-dark-pale:#7f8398;
  --dark-fill:rgba(255,255,255,.05);   /* aplats translucides clairs sur sombre */
  --dark-fill-2:rgba(255,255,255,.10);
  --dark-fill-strong:rgba(255,255,255,.20);
  --shadow-black:#000;
  --scrim:rgba(6,4,14,.80);            /* voile de modale */
  --shadow-deep:rgba(0,0,0,.6);
  --dark-glow:rgba(139,92,246,.40);    /* halos violets internes (mockup, modale, roue) */
  --dark-glow-strong:rgba(139,92,246,.70);
  --dark-halo:rgba(167,139,250,.55);
  --dark-veil:rgba(10,8,22,.82);       /* voile/ombres sombres hérités (surchargés en clair) */

  /* ============ 4. MARQUES TIERCES (identité, jamais un rôle de charte) ============ */
  --brand-ig-a:#833AB4; --brand-ig-b:#FD1D1D; --brand-ig-c:#FCB045;  /* Instagram (sp-ic) */
  --brand-ig-x:#F58529; --brand-ig-y:#DD2A7B;                        /* Instagram (fchip) */
  --brand-fb:#1877F2;                                                /* Facebook */
  --brand-tiktok:#010101;                                            /* TikTok */
  --brand-wa:#25D366; --brand-wa-h:#1ebe5d;                          /* WhatsApp */
  --brand-google-star:#F5C93E;                                       /* étoiles = solaire (choix charte) */

  /* ============ 5. VARIABLES HÉRITÉES (valeurs SOMBRES, pour les zones sombres) ============ */
  /* Ces noms sont consommés par les règles de zones sombres (mockup, modale, footer)
     et par les règles de base ; les sections claires les surchargent via la couche claire.
     On NE les remappe PAS en clair, sinon le texte des zones sombres deviendrait invisible. */
  --accent:#8B5CF6; --accent-2:#6D28D9;
  --accent-soft:#A78BFA; --accent-hi:#C4B5FD;
  --bg:#0A0816; --bg-2:#100B22;
  --card:rgba(255,255,255,.04); --card-2:rgba(255,255,255,.06);
  --border:rgba(167,139,250,.16); --border-2:rgba(196,181,253,.28);
  --text:#FFFFFF; --muted:#B7AED2; --muted-2:#7C7299;
  --radius:24px;
  --font:"Plus Jakarta Sans", ui-sans-serif, system-ui, sans-serif;
}