/* tokens.css -- LES TOKENS DE L'APPLICATION PO DVOLU, VERSION B1 « CYAN DOUX ».
 *
 * Retour de Claude Design, 2026-09-25. Remplace la partie « tokens » de
 * l'ancien tokens.css (T-21). Les REGLES CSS vivent maintenant dans
 * composants.css : ce fichier-ci ne contient que les trois couches.
 *
 * Memes lois qu'avant, inchangees :
 *   couche 1  primitifs   -- seules valeurs litterales du projet. Aucun var().
 *   couche 2  semantiques -- que des var() vers la couche 1.
 *   couche 3  composants  -- que des var() vers la couche 2.
 *   regles    (composants.css) -- toute couleur = un var() de couche 2 ou 3.
 *
 * Memes annotations qu'avant, lues par outils/contraste.py :
 *   @decoratif <primitif>             jamais du cote texte d'une paire
 *   @paire <nom> : <texte> sur <fond> ratio WCAG calcule, >= 4,5:1
 *   @contexte <selecteur> : <fonds>   fonds d'une regle qui ne pose qu'une couleur
 *   @marque <nom> : <marque> sur <fond> marque non textuelle (focus, contour,
 *                                     voyant, icone), ratio >= 3:1 (G-61 t2)
 * Les ratios en commentaire sont calcules (script joint dans contrastes.md),
 * pas estimes.
 *
 * LOI 25 : aucune URL ici.
 * PAS DE MODE SOMBRE : aucun bloc prefers-color-scheme.
 */

/* @decoratif --dv-cyan-500 */
/* @decoratif --dv-cyan-150 */
/* @decoratif --dv-cyan-100 */
/* @decoratif --dv-bleu-300 */
/* @decoratif --dv-bleu-050 */
/* @decoratif --dv-gris-500 */
/* @decoratif --dv-gris-400 */
/* @decoratif --dv-gris-300 */
/* @decoratif --dv-gris-100 */
/* @decoratif --dv-gris-050 */
/* @decoratif --dv-vert-050 */
/* @decoratif --dv-rouge-050 */
/* @decoratif --dv-ambre-700 */
/* @decoratif --dv-ambre-050 */


/* ==========================================================================
 * @couche 1 -- PRIMITIFS
 * ========================================================================== */
:root {
  /* marque */
  --dv-bleu-700: #174576;   /* bleu fonce dvolu.com     9,77:1 sur blanc */
  --dv-bleu-680: #1D5288;   /* NOUVEAU survol de bande  blanc dessus 8,03:1 */
  --dv-bleu-640: #006AA6;   /* NOUVEAU liens            4,86:1 sur cyan-100 */
  --dv-bleu-600: #0074B4;   /* PMS 2945 C               5,05:1 sur blanc */
  --dv-bleu-300: #5B7FA6;   /* NOUVEAU separateur dans la bande */
  --dv-bleu-100: #D5E3EF;   /* NOUVEAU texte doux sur la bande  7,47:1 */
  --dv-bleu-050: #E8F2F9;
  --dv-cyan-500: #5BCACA;   /* PMS 325 C  1,95:1 -- DECORATIF */
  --dv-cyan-150: #C3DCDC;   /* NOUVEAU filet sous le bandeau de titre */
  --dv-cyan-100: #DEEEEE;
  --dv-encre-900: #121820;  /* 17,84:1 */
  --dv-gris-700: #3E4853;   /* NOUVEAU icones de controle  8,20:1 au pire */
  --dv-gris-600: #5B6672;   /* texte secondaire  4,90:1 au pire (cyan-100) */
  --dv-gris-500: #7F8C99;   /* NOUVEAU contour des champs  3,03:1 au pire */
  --dv-gris-400: #B9C4CF;   /* NOUVEAU bordure forte (boutons secondaires) */
  --dv-gris-300: #D7DDE3;
  --dv-gris-100: #EEF1F4;
  --dv-gris-050: #F7F9FA;
  --dv-blanc: #FFFFFF;

  /* etats (inchanges) */
  --dv-vert-600: #1E7A4C;
  --dv-vert-050: #E4F3EB;
  --dv-rouge-600: #B3261E;
  --dv-rouge-050: #FDECEB;
  --dv-ambre-800: #836619;  /* alerte en TEXTE */
  --dv-ambre-700: #8A6D1F;  /* alerte en filet ou voyant seulement */
  --dv-ambre-050: #FDF4E0;

  /* ombres (NOUVEAU : au survol seulement, jamais au repos) */
  --dv-ombre-bouton: 0 2px 8px rgba(23, 69, 118, 0.25);
  --dv-ombre-douce: 0 2px 6px rgba(18, 24, 32, 0.08);
  --dv-ombre-carte: 0 2px 10px rgba(18, 24, 32, 0.06);
  --dv-ombre-liste: 0 6px 18px rgba(18, 24, 32, 0.14);

  /* mesures */
  --dv-px-0: 0;
  --dv-px-1: 1px;           /* G-84 t5 (N-39) : le decalage du contour de focus */
  --dv-px-2: 2px;
  --dv-px-3: 3px;
  --dv-px-4: 4px;
  --dv-px-6: 6px;
  --dv-px-8: 8px;
  --dv-px-10: 10px;
  --dv-px-12: 12px;
  --dv-px-16: 16px;
  --dv-px-20: 20px;
  --dv-px-24: 24px;
  --dv-px-26: 26px;         /* une ligne Excel a 100 % */
  --dv-px-28: 28px;
  --dv-px-30: 30px;
  --dv-px-32: 32px;
  --dv-px-52: 52px;
  --dv-px-999: 999px;

  --dv-pt-10-5: 10.5px;
  --dv-pt-11: 11px;
  --dv-pt-12: 12px;
  --dv-pt-12-5: 12.5px;     /* la base des tableaux */
  --dv-pt-13: 13px;
  --dv-pt-13-5: 13.5px;
  --dv-pt-14: 14px;
  --dv-pt-16: 16px;
  --dv-pt-19: 19px;
  --dv-pt-22: 22px;

  --dv-graisse-400: 400;
  --dv-graisse-500: 500;
  --dv-graisse-600: 600;
  --dv-graisse-700: 700;

  /* mouvement (ELARGI au tour B1, voir LISEZ-MOI) */
  --dv-ms-60: 60ms;
  --dv-ms-120: 120ms;
  --dv-ms-140: 140ms;
  --dv-ms-160: 160ms;
  --dv-ms-180: 180ms;
  --dv-courbe-sortie: cubic-bezier(0.2, 0.7, 0.2, 1);
}


/* ==========================================================================
 * @couche 2 -- SEMANTIQUES
 * ========================================================================== */
:root {
  --fond: var(--dv-blanc);
  --fond-doux: var(--dv-gris-050);
  --fond-zebre: var(--dv-gris-050);
  --fond-survol: var(--dv-bleu-050);
  --fond-inactif: var(--dv-gris-100);
  --fond-tete: var(--dv-cyan-100);          /* NOUVEAU bandeau de titre */

  --bordure: var(--dv-gris-300);
  --bordure-fine: var(--dv-gris-100);
  --bordure-forte: var(--dv-gris-400);      /* NOUVEAU */
  --bordure-champ: var(--dv-gris-500);      /* NOUVEAU 3:1 */
  --bordure-controle: var(--dv-gris-600);   /* G-61 t3 : contour d'un controle, 5,85:1 sur blanc, 4,90:1 au pire */
  --bordure-tete: var(--dv-cyan-150);       /* NOUVEAU */

  --texte: var(--dv-encre-900);
  --texte-moyen: var(--dv-gris-700);        /* NOUVEAU */
  --texte-doux: var(--dv-gris-600);
  --texte-inverse: var(--dv-blanc);

  --primaire: var(--dv-bleu-600);
  --primaire-fonce: var(--dv-bleu-700);
  --lien: var(--dv-bleu-640);               /* NOUVEAU */
  --accent: var(--dv-cyan-500);             /* DECORATIF */
  --accent-doux: var(--dv-cyan-100);        /* DECORATIF */
  --focus: var(--dv-bleu-600);

  --bande: var(--dv-bleu-700);              /* NOUVEAU barre d'application */
  --bande-survol: var(--dv-bleu-680);
  --bande-doux: var(--dv-bleu-100);
  --bande-separateur: var(--dv-bleu-300);

  --succes: var(--dv-vert-600);
  --succes-fond: var(--dv-vert-050);
  --danger: var(--dv-rouge-600);
  --danger-fond: var(--dv-rouge-050);
  --alerte: var(--dv-ambre-700);
  --alerte-texte: var(--dv-ambre-800);
  --alerte-fond: var(--dv-ambre-050);

  --ombre-bouton: var(--dv-ombre-bouton);
  --ombre-douce: var(--dv-ombre-douce);
  --ombre-carte: var(--dv-ombre-carte);
  --ombre-liste: var(--dv-ombre-liste);

  --pas-0: var(--dv-px-0);
  --pas-0-5: var(--dv-px-1);
  --pas-1: var(--dv-px-2);
  --pas-2: var(--dv-px-4);
  --pas-2-5: var(--dv-px-6);
  --pas-3: var(--dv-px-8);
  --pas-3-5: var(--dv-px-10);
  --pas-4: var(--dv-px-12);
  --pas-5: var(--dv-px-16);
  --pas-gouttiere: var(--dv-px-20);
  --pas-6: var(--dv-px-24);

  --hauteur-ligne: var(--dv-px-26);
  --hauteur-champ-compact: var(--dv-px-28);
  --hauteur-champ: var(--dv-px-30);
  --hauteur-entete: var(--dv-px-30);
  --hauteur-bouton: var(--dv-px-32);
  --hauteur-bande: var(--dv-px-52);
  --filet-souligne: var(--dv-px-3);

  --rayon-0: var(--dv-px-0);
  --rayon-champ: var(--dv-px-4);
  --rayon-cadre: var(--dv-px-6);
  --rayon-pastille: var(--dv-px-999);

  --texte-etiquette: var(--dv-pt-10-5);     /* NOUVEAU libelle en majuscules */
  --texte-meta: var(--dv-pt-11);
  --texte-entete: var(--dv-pt-12);          /* NOUVEAU en-tete de grille */
  --texte-tableau: var(--dv-pt-12-5);
  --texte-formulaire: var(--dv-pt-13);      /* ECART : 14 -> 13, voir LISEZ-MOI */
  --texte-navigation: var(--dv-pt-13-5);    /* NOUVEAU */
  --texte-carte: var(--dv-pt-14);           /* NOUVEAU */
  --texte-section: var(--dv-pt-16);
  --texte-ecran: var(--dv-pt-19);
  --texte-montant: var(--dv-pt-22);         /* NOUVEAU */

  --graisse-normale: var(--dv-graisse-400);
  --graisse-moyenne: var(--dv-graisse-500);
  --graisse-appuyee: var(--dv-graisse-600);
  --graisse-forte: var(--dv-graisse-700);

  --duree-appui: var(--dv-ms-60);
  --duree-fondu: var(--dv-ms-120);          /* couleurs */
  --duree-liste: var(--dv-ms-140);
  --duree-ombre: var(--dv-ms-160);
  --duree-deplacement: var(--dv-ms-180);    /* maximum absolu */
  --courbe-sortie: var(--dv-courbe-sortie);
}


/* ==========================================================================
 * @couche 3 -- COMPOSANTS
 * Nommage <composant>-<role> : tout --x-texte* est mesure sur tout --x-fond*.
 * ========================================================================== */
:root {
  /* -- page -------------------------------------------------------------- */
  /* @paire page : --page-texte sur --page-fond */
  /* @paire page-doux : --page-texte sur --page-fond-doux */
  /* @paire page-secondaire : --page-texte-doux sur --page-fond */
  /* @paire page-secondaire-doux : --page-texte-doux sur --page-fond-doux */
  /* @paire page-lien : --page-texte-lien sur --page-fond */
  /* @paire page-lien-doux : --page-texte-lien sur --page-fond-doux */
  /* @paire page-erreur : --page-texte-erreur sur --page-fond */
  /* @paire page-erreur-doux : --page-texte-erreur sur --page-fond-doux */
  /* @paire page-succes : --page-texte-succes sur --page-fond */
  /* @paire page-succes-doux : --page-texte-succes sur --page-fond-doux */
  --page-fond: var(--fond);
  --page-fond-doux: var(--fond-doux);
  --page-texte: var(--texte);
  --page-texte-doux: var(--texte-doux);
  --page-texte-lien: var(--lien);
  --page-texte-lien-survol: var(--primaire-fonce);
  /* @paire page-lien-survol : --page-texte-lien-survol sur --page-fond */
  /* @paire page-lien-survol-doux : --page-texte-lien-survol sur --page-fond-doux */
  --page-texte-erreur: var(--danger);
  --page-texte-succes: var(--succes);

  /* -- barre d'application ----------------------------------------------- */
  /* @paire bande : --bande-texte sur --bande-fond */
  /* @paire bande-survol : --bande-texte sur --bande-fond-survol */
  /* @paire bande-doux : --bande-texte-doux sur --bande-fond */
  /* @paire bande-doux-survol : --bande-texte-doux sur --bande-fond-survol */
  --bande-fond: var(--bande);
  --bande-fond-survol: var(--bande-survol);
  --bande-texte: var(--texte-inverse);
  --bande-texte-doux: var(--bande-doux);
  --bande-filet: var(--accent);
  --bande-trait: var(--bande-separateur);
  --bande-anneau: var(--texte-inverse);     /* G-61 t2 : focus clavier dans la bande */

  /* @paire compteur : --compteur-texte sur --compteur-fond */
  --compteur-fond: var(--accent);
  --compteur-texte: var(--texte);

  /* -- bandeau de titre -------------------------------------------------- */
  /* @paire tete : --tete-texte sur --tete-fond */
  /* @paire tete-doux : --tete-texte-doux sur --tete-fond */
  /* @paire tete-lien : --tete-texte-lien sur --tete-fond */
  --tete-fond: var(--fond-tete);
  --tete-texte: var(--texte);
  --tete-texte-doux: var(--texte-doux);
  --tete-texte-lien: var(--lien);
  --tete-bordure: var(--bordure-tete);

  /* -- boutons ------------------------------------------------------------ */
  /* @paire bouton : --bouton-texte sur --bouton-fond */
  /* @paire bouton-survol : --bouton-texte sur --bouton-fond-survol */
  --bouton-fond: var(--primaire);
  --bouton-fond-survol: var(--primaire-fonce);
  --bouton-texte: var(--texte-inverse);
  --bouton-ombre: var(--ombre-bouton);
  /* @paire bouton2 : --bouton2-texte sur --bouton2-fond */
  /* @paire bouton2-survol : --bouton2-texte sur --bouton2-fond-survol */
  --bouton2-fond: var(--fond);
  --bouton2-fond-survol: var(--fond-survol);
  --bouton2-texte: var(--texte);
  --bouton2-bordure: var(--bordure-controle);  /* G-61 t3 : etait --bordure-forte, 1,77:1 */
  --bouton2-bordure-survol: var(--primaire);
  --bouton2-ombre: var(--ombre-douce);
  /* @paire bouton-danger : --bouton-danger-texte sur --bouton-danger-fond */
  /* @paire bouton-danger-survol : --bouton-danger-texte sur --bouton-danger-fond-survol */
  --bouton-danger-fond: var(--fond);
  --bouton-danger-fond-survol: var(--danger-fond);
  --bouton-danger-texte: var(--danger);
  /* @paire bouton-desactive : --bouton-desactive-texte sur --bouton-desactive-fond */
  --bouton-desactive-fond: var(--fond-inactif);
  --bouton-desactive-texte: var(--texte-doux);
  --bouton-desactive-bordure: var(--bordure);

  /* -- champs ------------------------------------------------------------- */
  /* @paire champ : --champ-texte sur --champ-fond */
  /* @paire champ-modifie : --champ-texte sur --champ-fond-modifie */
  /* @paire champ-inactif : --champ-texte sur --champ-fond-inactif */
  /* @paire champ-indication : --champ-texte-indication sur --champ-fond */
  /* @paire champ-indication-modifie : --champ-texte-indication sur --champ-fond-modifie */
  /* @paire champ-indication-inactif : --champ-texte-indication sur --champ-fond-inactif */
  --champ-fond: var(--fond);
  --champ-fond-modifie: var(--fond-survol);
  --champ-fond-inactif: var(--fond-inactif);
  --champ-texte: var(--texte);
  --champ-texte-indication: var(--texte-doux);
  --champ-bordure: var(--bordure-champ);
  --champ-bordure-survol: var(--primaire);
  --champ-bordure-erreur: var(--danger);
  --champ-anneau: var(--focus);

  /* @paire lecture : --lecture-texte sur --lecture-fond */
  --lecture-fond: var(--fond);
  --lecture-texte: var(--texte);
  --lecture-bordure: var(--bordure);

  /* -- selecteur avec recherche ------------------------------------------ */
  /* @paire selecteur : --selecteur-texte sur --selecteur-fond */
  /* @paire selecteur-rempli : --selecteur-texte sur --selecteur-fond-rempli */
  /* @paire selecteur-vide : --selecteur-texte-vide sur --selecteur-fond */
  /* @paire selecteur-vide-rempli : --selecteur-texte-vide sur --selecteur-fond-rempli */
  --selecteur-fond: var(--fond);
  --selecteur-fond-rempli: var(--fond-survol);
  --selecteur-texte: var(--texte);
  --selecteur-texte-vide: var(--texte-doux);
  --selecteur-icone: var(--texte-moyen);
  --selecteur-icone-fond-survol: var(--bordure);
  /* @paire liste : --liste-texte sur --liste-fond */
  /* @paire liste-actif : --liste-texte sur --liste-fond-actif */
  /* @paire liste-doux : --liste-texte-doux sur --liste-fond */
  /* @paire liste-doux-actif : --liste-texte-doux sur --liste-fond-actif */
  --liste-fond: var(--fond);
  --liste-fond-actif: var(--fond-survol);
  --liste-texte: var(--texte);
  --liste-texte-doux: var(--texte-doux);
  --liste-bordure: var(--bordure-forte);
  --liste-ombre: var(--ombre-liste);
  --liste-marque: var(--primaire);

  /* -- puces de filtre ---------------------------------------------------- */
  /* @paire puce : --puce-texte sur --puce-fond */
  /* @paire puce-survol : --puce-texte sur --puce-fond-survol */
  --puce-fond: var(--fond);
  --puce-fond-survol: var(--fond-survol);
  --puce-texte: var(--texte);
  --puce-bordure: var(--bordure-controle);  /* G-61 t3 : etait --bordure-forte, 1,77:1 */
  --puce-bordure-survol: var(--primaire-fonce);
  /* @paire puce-actif : --puce-actif-texte sur --puce-actif-fond */
  --puce-actif-fond: var(--primaire-fonce);
  --puce-actif-texte: var(--texte-inverse);

  /* -- segment (onglets secondaires) ------------------------------------- */
  /* @paire segment : --segment-texte sur --segment-fond */
  /* @paire segment-survol : --segment-texte sur --segment-fond-survol */
  --segment-fond: var(--fond);
  --segment-fond-survol: var(--fond-survol);
  --segment-texte: var(--texte);
  --segment-bordure: var(--bordure-controle);  /* G-61 t3 : etait --bordure-forte, 1,77:1 */
  --segment-separateur: var(--bordure-forte);  /* G-61 t3 : le filet ENTRE deux choix */
  /* @paire segment-actif : --segment-actif-texte sur --segment-actif-fond */
  --segment-actif-fond: var(--primaire-fonce);
  --segment-actif-texte: var(--texte-inverse);

  /* -- tableau (grille) ---------------------------------------------------- */
  /* @paire th : --th-texte sur --th-fond */
  --th-fond: var(--fond);
  --th-texte: var(--texte);
  --th-filet: var(--accent);                /* le cyan sous l'en-tete */
  /* @paire td : --td-texte sur --td-fond */
  /* @paire td-zebre : --td-texte sur --td-fond-zebre */
  /* @paire td-survol : --td-texte sur --td-fond-survol */
  /* @paire td-reste : --td-texte sur --td-fond-reste */
  /* @paire td-doux : --td-texte-doux sur --td-fond */
  /* @paire td-doux-zebre : --td-texte-doux sur --td-fond-zebre */
  /* @paire td-doux-survol : --td-texte-doux sur --td-fond-survol */
  /* @paire td-doux-reste : --td-texte-doux sur --td-fond-reste */
  /* @paire td-lien : --td-texte-lien sur --td-fond */
  /* @paire td-lien-zebre : --td-texte-lien sur --td-fond-zebre */
  /* @paire td-lien-survol : --td-texte-lien sur --td-fond-survol */
  /* @paire td-lien-reste : --td-texte-lien sur --td-fond-reste */
  --td-fond: var(--fond);
  --td-fond-zebre: var(--fond-zebre);
  --td-fond-survol: var(--fond-survol);
  --td-fond-reste: var(--alerte-fond);
  --td-texte: var(--texte);
  --td-texte-doux: var(--texte-doux);
  --td-texte-lien: var(--lien);
  --td-filet: var(--bordure-fine);
  --td-filet-actif: var(--accent);
  --td-hauteur: var(--hauteur-ligne);
  --td-remplissage: var(--pas-0) var(--pas-3);
  --tableau-bordure: var(--bordure);

  /* -- pastilles d'etat ---------------------------------------------------- */
  /* @paire pastille-ok : --pastille-ok-texte sur --pastille-ok-fond */
  /* @paire pastille-partiel : --pastille-partiel-texte sur --pastille-partiel-fond */
  /* @paire pastille-non : --pastille-non-texte sur --pastille-non-fond */
  /* @paire pastille-neutre : --pastille-neutre-texte sur --pastille-neutre-fond */
  /* @paire pastille-brouillon : --pastille-brouillon-texte sur --pastille-brouillon-fond */
  /* @paire pastille-ia : --pastille-ia-texte sur --pastille-ia-fond */
  --pastille-ok-fond: var(--succes-fond);
  --pastille-ok-texte: var(--texte);
  --pastille-ok-voyant: var(--succes);
  --pastille-partiel-fond: var(--alerte-fond);
  --pastille-partiel-texte: var(--texte);
  --pastille-partiel-voyant: var(--alerte);
  --pastille-non-fond: var(--danger-fond);
  --pastille-non-texte: var(--texte);
  --pastille-non-voyant: var(--danger);
  --pastille-neutre-fond: var(--fond-inactif);
  --pastille-neutre-texte: var(--texte-doux);
  --pastille-neutre-voyant: var(--texte-doux);
  --pastille-brouillon-fond: var(--fond);
  --pastille-brouillon-texte: var(--texte-doux);
  --pastille-brouillon-bordure: var(--texte-doux);
  --pastille-ia-fond: var(--accent-doux);
  --pastille-ia-texte: var(--texte);
  --pastille-ia-voyant: var(--primaire-fonce);

  /* @paire etiquette-agent : --etiquette-agent-texte sur --etiquette-agent-fond */
  /* @paire etiquette-rush : --etiquette-rush-texte sur --etiquette-rush-fond */
  --etiquette-agent-fond: var(--accent);
  --etiquette-agent-texte: var(--texte);
  --etiquette-rush-fond: var(--danger);
  --etiquette-rush-texte: var(--texte-inverse);

  /* -- avis ---------------------------------------------------------------- */
  /* @paire avis-succes : --avis-succes-texte sur --avis-succes-fond */
  /* @paire avis-refus : --avis-refus-texte sur --avis-refus-fond */
  /* @paire avis-refus-titre : --avis-refus-texte-titre sur --avis-refus-fond */
  /* @paire avis-alerte : --avis-alerte-texte sur --avis-alerte-fond */
  /* @paire avis-alerte-titre : --avis-alerte-texte-titre sur --avis-alerte-fond */
  /* @paire avis-alerte-doux : --avis-alerte-texte-doux sur --avis-alerte-fond */
  --avis-succes-fond: var(--succes-fond);
  --avis-succes-texte: var(--texte);
  --avis-succes-icone: var(--succes);
  --avis-refus-fond: var(--danger-fond);
  --avis-refus-texte: var(--texte);
  --avis-refus-texte-titre: var(--danger);
  --avis-refus-bordure: var(--danger);
  --avis-alerte-fond: var(--alerte-fond);
  --avis-alerte-texte: var(--texte);
  --avis-alerte-texte-titre: var(--alerte-texte);
  --avis-alerte-texte-doux: var(--texte-doux);
  --avis-alerte-bordure: var(--alerte);

  /* G-61 t2 : le lien « Rush a completer » du bandeau de titre a ses
     propres tokens. Il empruntait ceux du bouton secondaire et de l'avis
     de refus, et outils/contraste.py liait alors ces deux familles de
     fonds entre elles (une surface fantome). */
  /* @paire rush : --rush-texte sur --rush-fond */
  /* @paire rush-survol : --rush-texte sur --rush-fond-survol */
  /* @paire rush-titre : --rush-texte-titre sur --rush-fond */
  /* @paire rush-titre-survol : --rush-texte-titre sur --rush-fond-survol */
  --rush-fond: var(--fond);
  --rush-fond-survol: var(--danger-fond);
  --rush-texte: var(--texte);
  --rush-texte-titre: var(--danger);
  --rush-bordure: var(--danger);

  /* -- cartes, tuiles, bon ------------------------------------------------- */
  /* @paire carte : --carte-texte sur --carte-fond */
  /* @paire carte-doux : --carte-texte-doux sur --carte-fond */
  --carte-fond: var(--fond);
  --carte-texte: var(--texte);
  --carte-texte-doux: var(--texte-doux);
  --carte-bordure: var(--bordure);
  --carte-bordure-survol: var(--bordure-forte);
  --carte-ombre: var(--ombre-carte);
  --carte-filet: var(--bordure-fine);
  --connexion-filet: var(--accent);         /* G-61 t3 : le filet cyan de la carte de connexion */

  /* @paire tuile : --tuile-texte sur --tuile-fond */
  /* @paire tuile-etiquette : --tuile-texte-etiquette sur --tuile-fond */
  --tuile-fond: var(--fond);
  --tuile-texte: var(--texte);
  --tuile-texte-etiquette: var(--texte-doux);
  /* @paire tuile-total : --tuile-total-texte sur --tuile-total-fond */
  /* @paire tuile-total-etiquette : --tuile-total-texte-etiquette sur --tuile-total-fond */
  --tuile-total-fond: var(--primaire-fonce);
  --tuile-total-texte: var(--texte-inverse);
  --tuile-total-texte-etiquette: var(--bande-doux);

  /* @paire bon-imprime : --bon-imprime-texte sur --bon-imprime-fond */
  /* @paire bon-imprime-doux : --bon-imprime-texte-doux sur --bon-imprime-fond */
  /* @paire bon-imprime-libelle : --bon-imprime-texte-libelle sur --bon-imprime-fond */
  --bon-imprime-fond: var(--fond);
  --bon-imprime-texte: var(--texte);
  --bon-imprime-texte-doux: var(--texte-doux);
  --bon-imprime-texte-libelle: var(--primaire-fonce);
  /* @paire bon-interne : --bon-interne-texte sur --bon-interne-fond */
  /* @paire bon-interne-doux : --bon-interne-texte-doux sur --bon-interne-fond */
  --bon-interne-fond: var(--fond-inactif);
  --bon-interne-texte: var(--texte);
  --bon-interne-texte-doux: var(--texte-doux);
  --bon-bordure: var(--bordure);
  --bon-filet-interne: var(--bordure-forte);  /* G-61 t3 : etait --bouton2-bordure */

  /* -- contextes des regles qui ne posent qu'une couleur (composants.css) -- */
  /* @contexte a, h1, h2, .doux, .etiquette, .aide, .pied, .refus-champ, .resume__taux, .bon-libelle, .bon-libelle--interne : --page-fond, --page-fond-doux */
  /* @contexte .tete-ecran h1, .tete-ecran__sous-titre, .tete-ecran a, .fil : --tete-fond */
  /* @contexte .barre-app__titre : --bande-fond */
  /* @contexte .tableau td.doux, .tableau .doux, .tableau a, .lien-ligne, .suffixe : --td-fond, --td-fond-zebre, --td-fond-survol, --td-fond-reste */
  /* @contexte .selecteur__valeur--vide : --selecteur-fond, --selecteur-fond-rempli */
  /* @contexte .selecteur__pied : --liste-fond */
  /* @contexte .avis--refus .avis__titre : --avis-refus-fond */
  /* @contexte .avis--alerte .avis__titre, .avis--alerte .avis__doux : --avis-alerte-fond */
  /* @contexte .rush b : --rush-fond, --rush-fond-survol */
  /* @contexte .etat-vide span, .carte h2 .doux : --carte-fond */
  /* @contexte .tuile .etiquette : --tuile-fond */
  /* @contexte .tuile--total .etiquette : --tuile-total-fond */
  /* @contexte .bon__imprime .etiquette, .bon__imprime .doux, .bon__titre, .bon__adresse, .bon__taxes : --bon-imprime-fond */
  /* @contexte .bon__interne .etiquette, .bon__interne .doux : --bon-interne-fond */
  /* @contexte .connexion h1 : --carte-fond */
  /* G-61 t2 : contextes et paires RECLAMES par outils/contraste.py une
     fois composants.css lu (rien n'est suppose) : */
  /* @contexte .onglet : --bande-fond */
  /* @contexte .segment a : --segment-fond */
  /* @contexte .etat-vide, .carte h2 : --carte-fond */
  /* @paire bon-libelle-page : --bon-imprime-texte-libelle sur --page-fond */
  /* @paire bon-libelle-page-doux : --bon-imprime-texte-libelle sur --page-fond-doux */

  /* -- marques non textuelles, seuil 3:1 (G-61 t2, fautes_de_marque) ------ */
  /* @marque focus-page : --focus-couleur sur --page-fond */
  /* @marque focus-page-doux : --focus-couleur sur --page-fond-doux */
  /* @marque focus-tete : --focus-couleur sur --tete-fond */
  /* @marque focus-carte : --focus-couleur sur --carte-fond */
  /* @marque focus-bon-interne : --focus-couleur sur --bon-interne-fond */
  /* @marque focus-td : --focus-couleur sur --td-fond */
  /* @marque focus-td-zebre : --focus-couleur sur --td-fond-zebre */
  /* @marque focus-td-survol : --focus-couleur sur --td-fond-survol */
  /* @marque focus-td-reste : --focus-couleur sur --td-fond-reste */
  /* @marque focus-avis-alerte : --focus-couleur sur --avis-alerte-fond */
  /* @marque focus-avis-refus : --focus-couleur sur --avis-refus-fond */
  /* @marque focus-avis-succes : --focus-couleur sur --avis-succes-fond */
  /* @marque focus-bande : --bande-anneau sur --bande-fond */
  /* @marque focus-bande-survol : --bande-anneau sur --bande-fond-survol */
  /* @marque onglet-filet : --bande-filet sur --bande-fond */
  /* @marque onglet-filet-survol : --bande-filet sur --bande-fond-survol */
  /* @marque champ-anneau : --champ-anneau sur --champ-fond */
  /* @marque champ-anneau-doux : --champ-anneau sur --page-fond-doux */
  /* @marque champ-anneau-interne : --champ-anneau sur --bon-interne-fond */
  /* @marque champ-anneau-td : --champ-anneau sur --td-fond-survol */
  /* Le contour d'un champ, sur chaque surface ou un champ est pose.
     JAMAIS dans le bandeau de titre : 2,87:1 sur --tete-fond. */
  /* @marque champ-contour-page : --champ-bordure sur --page-fond */
  /* @marque champ-contour-page-doux : --champ-bordure sur --page-fond-doux */
  /* @marque champ-contour-carte : --champ-bordure sur --carte-fond */
  /* @marque champ-contour-bon-interne : --champ-bordure sur --bon-interne-fond */
  /* @marque champ-contour-td : --champ-bordure sur --td-fond */
  /* @marque champ-contour-td-zebre : --champ-bordure sur --td-fond-zebre */
  /* @marque champ-contour-td-survol : --champ-bordure sur --td-fond-survol */
  /* @marque champ-contour-td-reste : --champ-bordure sur --td-fond-reste */
  /* @marque selecteur-icone : --selecteur-icone sur --selecteur-fond */
  /* @marque selecteur-icone-rempli : --selecteur-icone sur --selecteur-fond-rempli */
  /* @marque selecteur-icone-survol : --selecteur-icone sur --selecteur-icone-fond-survol */
  /* @marque voyant-ok : --pastille-ok-voyant sur --pastille-ok-fond */
  /* @marque voyant-partiel : --pastille-partiel-voyant sur --pastille-partiel-fond */
  /* @marque voyant-non : --pastille-non-voyant sur --pastille-non-fond */
  /* @marque voyant-neutre : --pastille-neutre-voyant sur --pastille-neutre-fond */
  /* @marque voyant-ia : --pastille-ia-voyant sur --pastille-ia-fond */
  /* @marque icone-avis-succes : --avis-succes-icone sur --avis-succes-fond */
  /* @marque icone-etat-vide : --carte-texte-doux sur --carte-fond */

  /* -- G-61 t3 : les marques se derivent des REGLES, sur le fond de LEUR
     regle (outils/contraste.py, `_derivation_des_marques`). ------------- */
  /* Le focus universel (`:focus-visible`) n'a pas de surface dans sa regle :
     les surfaces ou un element se focalise, declarees ici. */
  /* @contexte * : --page-fond, --page-fond-doux, --tete-fond, --carte-fond, --bon-interne-fond, --td-fond, --td-fond-zebre, --td-fond-survol, --td-fond-reste, --avis-alerte-fond, --avis-refus-fond, --avis-succes-fond */
  /* Les bordures DECORATIVES : un cadre, un separateur, un filet. Elles
     n'identifient ni un controle ni un etat (WCAG 1.4.11 ne les vise pas).
     Une bordure qui n'est pas ici est une marque, mesuree a 3:1. Le
     contour d'un bouton desactive ou d'un champ en lecture en fait partie :
     un composant inactif est exempte par WCAG 1.4.11. */
  /* @filet --bande-trait */
  /* @filet --tete-bordure */
  /* @filet --bouton-desactive-bordure */
  /* @filet --lecture-bordure */
  /* @filet --liste-bordure */
  /* @filet --segment-separateur */
  /* @filet --th-filet */
  /* @filet --td-filet */
  /* @filet --tableau-bordure */
  /* @filet --avis-refus-bordure */
  /* @filet --avis-alerte-bordure */
  /* @filet --carte-bordure */
  /* @filet --carte-bordure-survol */
  /* @filet --carte-filet */
  /* @filet --bon-bordure */
  /* @filet --bon-filet-interne */
  /* @filet --connexion-filet */
  /* Les contours des CONTROLES, chacun sur le fond de sa regle. */
  /* @marque bouton2-contour : --bouton2-bordure sur --bouton2-fond */
  /* @marque bouton2-contour-tete : --bouton2-bordure sur --tete-fond */
  /* @marque bouton2-contour-survol : --bouton2-bordure-survol sur --bouton2-fond-survol */
  /* @marque bouton-danger-contour : --bouton-danger-texte sur --bouton-danger-fond */
  /* @marque bouton-danger-contour-survol : --bouton-danger-texte sur --bouton-danger-fond-survol */
  /* @marque champ-contour : --champ-bordure sur --champ-fond */
  /* @marque champ-contour-survol : --champ-bordure-survol sur --champ-fond */
  /* @marque champ-contour-survol-inactif : --champ-bordure-survol sur --champ-fond-inactif */
  /* @marque champ-anneau-inactif : --champ-anneau sur --champ-fond-inactif */
  /* @marque champ-contour-modifie : --champ-bordure-survol sur --champ-fond-modifie */
  /* @marque champ-contour-erreur : --champ-bordure-erreur sur --champ-fond */
  /* @marque champ-contour-erreur-inactif : --champ-bordure-erreur sur --champ-fond-inactif */
  /* @marque selecteur-contour : --champ-bordure sur --selecteur-fond */
  /* @marque selecteur-contour-survol : --champ-bordure-survol sur --selecteur-fond */
  /* @marque selecteur-contour-rempli : --champ-bordure-survol sur --selecteur-fond-rempli */
  /* @marque puce-contour : --puce-bordure sur --puce-fond */
  /* @marque puce-contour-survol : --puce-bordure-survol sur --puce-fond-survol */
  /* @marque segment-contour : --segment-bordure sur --segment-fond */
  /* @marque pastille-brouillon-contour : --pastille-brouillon-bordure sur --pastille-brouillon-fond */
  /* @marque rush-contour : --rush-bordure sur --rush-fond */

  /* -- focus clavier ------------------------------------------------------- */
  --focus-couleur: var(--focus);
  --focus-epaisseur: var(--pas-1);
  --focus-decalage: var(--pas-0-5);
}