/* tokens.css -- echelle de design GeoCleanAfrica (2026-07-28)
 *
 * Avant : 11 tailles de texte entre 8 et 16px et 10 rayons entre 1 et 12px,
 * repartis en valeurs litterales dans une dizaine de feuilles, sans rythme
 * commun. Ce fichier est la SEULE source de verite.
 *
 * Charge par geocleanafrica.html ET geo.admin.dashboard.html : plusieurs
 * feuilles (popup_responsive_fix.css, avatar3d) sont communes aux deux pages,
 * une definition locale au bundle dashboard aurait laisse les var() non
 * resolues cote admin.
 */
:root {
  /* Texte -- 3 crans, pas de 2px. Les tailles >= 18px sont des tailles
     d'AFFICHAGE (chiffres cles, titres de modale) : niveaux hierarchiques,
     volontairement hors echelle. */
  --fs-xs: 11px;   /* mentions, horodatages, badges */
  --fs-sm: 13px;   /* texte courant, libelles, items de liste */
  --fs-md: 15px;   /* emphase, titres de section */

  /* Rayons -- 2 crans. 10px est aussi le rayon unique de GTECH, la reference
     du comparatif design. Les pilules (>= 15px), les cercles (50%) et 0 sont
     des FORMES, pas des graduations : ils ne sont pas dans l'echelle. */
  --r-sm: 6px;     /* controles, champs, puces */
  --r-lg: 10px;    /* cartes, panneaux, popups */

  /* Alias historiques (professional.css definissait 7 crans) : ils convergent
     vers l'echelle ci-dessus, donc aucun consommateur existant ne casse. */
  --font-xs: var(--fs-xs);
  --font-sm: var(--fs-xs);
  --font-base: var(--fs-sm);
  --font-md: var(--fs-md);
  --font-lg: var(--fs-md);
}
