/* ============================================================
   Merci Meuf · tokens
   Le seul endroit où sont définies les couleurs, polices,
   arrondis et espacements du site. Chaque page charge ce fichier
   avant ses propres styles. Pour changer le look du site,
   on change les valeurs ici, pas dans les pages.
   Source : design system « Merci Meuf » v5.1 (23 oct. 2026)
   + choix des planches du 25 oct. 2026 (touches de citron, à confirmer).
   ============================================================ */

/* Playfair Display, Inter et IBM Plex Mono viennent de Google Fonts (balise <link> de chaque page). */

/* ---------- Thème clair (par défaut) ---------- */
:root{
  /* Fonds */
  --bg:#f0ede7;               /* crème : fond de page */
  --surface:#dfdbd2;          /* pierre : cartes, panneaux, pastilles */
  --surface-hover:#d6d1c6;    /* pierre au survol */
  --paper:#f8f3ef;            /* beige clair : encadrés, cartes de texte */
  --giant:#e6e2da;            /* forme géante ton sur ton sur pierre */

  /* Textes */
  --fg:#2b2b2b;               /* charbon : texte principal */
  --fg2:#3f3d39;
  --muted:#5f5c56;            /* gris : textes secondaires, jamais sous 14 px */

  /* Filets */
  --line:rgba(43,43,43,.18);
  --line-strong:rgba(43,43,43,.3);

  /* Blocs forts (cartes charbon, pied de page) : charbon dans les deux thèmes */
  --strong:#2b2b2b;
  --on-strong:#f0ede7;
  --on-strong-muted:#c9c4ba;
  --strong-line:rgba(240,237,231,.18);

  /* Couleurs fixes */
  --charcoal:#2b2b2b;
  --cream:#f0ede7;
  --stone:#dfdbd2;
  --offwhite:#fafaf8;

  /* Le citron : petites touches, sur charbon ou photo sombre (mot, point, symbole, survol des boutons crème, onde), et en surlignage sur fond clair */
  --lime:#f4feaf;
  /* Le bleu brume revient pour le labo seulement (icône d'appli, un mot) : choix du 28 oct. 2026 */
  --brume:#bbccd1;
  --accent:#f4feaf;
  --on-accent:#2b2b2b;
  /* Contour de focus (clavier) : charbon sur fond clair, citron sur charbon (règle du 30 oct. 2026) */
  --focus:#2b2b2b;

  /* Polices */
  --serif:"Playfair Display","Bodoni 72",Georgia,serif;                    /* titres, accroches, citations */
  --sans:Inter,system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;  /* texte, titres de section */
  --mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;                     /* étiquettes */
  --logo:"Playfair Display",Georgia,serif;                                 /* logo */
  --title:var(--serif);       /* ancien nom, gardé pour les pages pas encore refaites */
  --voice:var(--serif);       /* ancien nom, gardé pour les pages pas encore refaites */

  /* Arrondis */
  --radius-btn:8px;           /* boutons rectangle doux */
  --radius-sm:12px;           /* vignettes */
  --radius-md:18px;           /* cartes, photos */
  --radius-lg:40px;           /* grands panneaux */
  --radius-pill:999px;        /* menu, pastilles, filtres */

  /* Espacements */
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px;
  --space-5:24px; --space-6:40px; --space-7:64px; --space-8:120px;
  --gutter:max(16px,env(safe-area-inset-left,0px));
}

/* ---------- Thème sombre ----------
   Deux blocs identiques : le premier suit le réglage de l'appareil,
   le second s'applique quand la visiteuse choisit le sombre avec le bouton. */
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#2b2b2b; --surface:#363533; --surface-hover:#403e3b; --paper:#3a3937; --giant:#333230;
  --fg:#f0ede7; --fg2:#dcd8d0; --muted:#a9a59c; --focus:#f4feaf;
  --line:rgba(240,237,231,.16); --line-strong:rgba(240,237,231,.28);
  --strong:#1f1f1e; --on-strong:#f0ede7; --on-strong-muted:#a9a59c;
  color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#2b2b2b; --surface:#363533; --surface-hover:#403e3b; --paper:#3a3937; --giant:#333230;
  --fg:#f0ede7; --fg2:#dcd8d0; --muted:#a9a59c; --focus:#f4feaf;
  --line:rgba(240,237,231,.16); --line-strong:rgba(240,237,231,.28);
  --strong:#1f1f1e; --on-strong:#f0ede7; --on-strong-muted:#a9a59c;
  color-scheme:dark}