/* ---------------------------------------------------------------
   Charte Mespoulede — jetons de référence
   COPIE DE TRAVAIL de identite/tokens.css, adaptée au thème :
   seuls les chemins des polices changent (../fonts/ au lieu de ./).
   Source unique : identite/tokens.css. Toute modification part
   de là, puis on régénère cette copie. Ne jamais recopier une
   couleur ou une police en dur ailleurs dans le thème.
   --------------------------------------------------------------- */

@font-face{
  font-family:'Fraunces';
  src:url('../fonts/Fraunces-Variable.woff2') format('woff2');
  font-weight:300 900;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:'Satoshi';
  src:url('../fonts/Satoshi-Variable.woff2') format('woff2');
  font-weight:300 900;
  font-style:normal;
  font-display:swap;
}

:root{
  /* --- couleurs de marque, invariables --- */
  --navy:#1C1678;      /* bleu nuit foncé  */
  --magenta:#BB2649;   /* vive magenta     */
  --snow:#FEFEFE;      /* blanc neige      */
  --ink-fixed:#16123a; /* encre sur aplat blanc, invariable en thème sombre */

  /* --- surfaces et texte, thème clair --- */
  --paper:#FEFEFE;
  --surface:#ffffff;
  --surface-2:#f2f1f9;
  --surface-3:#e9e7f6;
  --ink:#16123a;
  --ink-soft:#4f4a75;
  --ink-faint:#7d789f;
  --line:#e2e0f0;
  --line-2:#cdc9e4;

  /* --- rôles --- */
  --brand:var(--navy);
  --accent:var(--magenta);
  --accent-soft:#f6e3e9;     /* fond des pastilles, dérivé du magenta */
  --accent-strong:#9e1c3d;   /* magenta assombri : survol des boutons */
  --block:var(--navy);       /* aplats pleins : héros, pied de page */
  --on-block:var(--snow);
  --on-block-soft:#c3bff0;

  /* --- typographie --- */
  --display:'Fraunces',Georgia,'Times New Roman',serif;
  --display-weight:500;        /* titres sur fond clair */
  --display-weight-block:600;  /* titres sur aplat bleu nuit */
  --body:'Satoshi',ui-sans-serif,system-ui,-apple-system,sans-serif;
  --mono:ui-monospace,SFMono-Regular,Menlo,monospace;

  /* --- rythme --- */
  --gut:clamp(18px,4vw,44px);
  --radius:2px;
}

@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --paper:#09071e;
    --surface:#120e30;
    --surface-2:#191340;
    --surface-3:#221a52;
    --ink:#efedfc;
    --ink-soft:#b3aed6;
    --ink-faint:#8883af;
    --line:#282060;
    --line-2:#3a3080;
    --brand:#9a92ff;
    --accent:#ff6289;
    --accent-soft:#3a1730;
    --accent-strong:#ff87a5;
    --block:#160f52;
    --on-block-soft:#b0aae8;
    --display-weight:600;
  }
}
:root[data-theme="dark"]{
  --paper:#09071e;
  --surface:#120e30;
  --surface-2:#191340;
  --surface-3:#221a52;
  --ink:#efedfc;
  --ink-soft:#b3aed6;
  --ink-faint:#8883af;
  --line:#282060;
  --line-2:#3a3080;
  --brand:#9a92ff;
  --accent:#ff6289;
  --accent-soft:#3a1730;
  --accent-strong:#ff87a5;
  --block:#160f52;
  --on-block-soft:#b0aae8;
  --display-weight:600;
}

/* Fraunces remplace Melodrama dans les titres depuis le 15/09/2026 :
   l'œil de Melodrama se refermait en blanc sur le bleu nuit, le « e »
   en particulier. Le logotype, lui, reste dessiné en Melodrama — c'est
   un tracé vectoriel, il ne dépend d'aucune police installée.

   Le fichier est sous-ensemblé au français et ses axes décoratifs sont
   figés (opsz en réglage affichage, SOFT et WONK à zéro) : les lettres
   fantaisistes de WONK nuiraient à la lisibilité recherchée. Seule la
   graisse reste variable, d'où les deux jetons ci-dessus.

   Melodrama restant plus contrastée, les valeurs 500 / 600 conviennent
   toujours : en dessous de 500, les titres blancs maigrissent. */