/* ═══════════════════════════════════════════════════════════════════════════
   LA CHARTE — « la souveraineté tenue »
   ═══════════════════════════════════════════════════════════════════════════
   🔴 POURQUOI CE FICHIER EXISTE, ET CE QU'IL REMPLACE.
   Le 19/09/2026, les jetons de la charte vivaient dans DIX blocs <style>
   séparés. Mesuré : sur 16 sélecteurs présents dans au moins huit pages,
   QUATRE seulement avaient un corps identique. `:root` existait en cinq
   versions, `body` en cinq, `h2` en quatre, `.lead` en cinq. Ce n'étaient pas
   des copies : c'étaient des versions qui avaient déjà divergé, chacune juste
   le jour où on l'avait écrite.

   ⭐ Une valeur de charte recopiée vieillit plus vite que la page qui la porte.
   Ici, elle n'existe qu'une fois.

   ⚠️ CE FICHIER EST DE MÊME ORIGINE, ET C'EST LA CONDITION. Le site mesure et
   publie les appels à des serveurs tiers ; une feuille de style ou une police
   servie par Google apparaîtrait dans sa propre mesure. Les polices sont donc
   AUTO-HÉBERGÉES dans polices/ — Spectral, Archivo et IBM Plex Mono, sous
   licence ouverte SIL OFL, sous-ensembles latins seulement (16 fichiers,
   241 Ko). Ne jamais les remplacer par un <link> vers fonts.googleapis.com.

   ⚠️ LES DEUX DOCUMENTS IMPRIMABLES (dossier.html, livre-blanc) n'utilisent
   d'ici que les JETONS : leur mise en page est en points typographiques, c'est
   du papier, pas un écran.
   ══════════════════════════════════════════════════════════════════════════ */

@font-face{font-family:"Spectral";font-style:italic;font-weight:300;
  font-display:swap;src:url(polices/Spectral-300-italic-latinx.woff2) format("woff2");
  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:"Spectral";font-style:italic;font-weight:300;
  font-display:swap;src:url(polices/Spectral-300-italic-latin.woff2) format("woff2");
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:"Spectral";font-style:normal;font-weight:300;
  font-display:swap;src:url(polices/Spectral-300-normal-latinx.woff2) format("woff2");
  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:"Spectral";font-style:normal;font-weight:300;
  font-display:swap;src:url(polices/Spectral-300-normal-latin.woff2) format("woff2");
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:"Spectral";font-style:normal;font-weight:400;
  font-display:swap;src:url(polices/Spectral-400-normal-latinx.woff2) format("woff2");
  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:"Spectral";font-style:normal;font-weight:400;
  font-display:swap;src:url(polices/Spectral-400-normal-latin.woff2) format("woff2");
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:"Spectral";font-style:normal;font-weight:600;
  font-display:swap;src:url(polices/Spectral-600-normal-latinx.woff2) format("woff2");
  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:"Spectral";font-style:normal;font-weight:600;
  font-display:swap;src:url(polices/Spectral-600-normal-latin.woff2) format("woff2");
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:"Spectral";font-style:normal;font-weight:700;
  font-display:swap;src:url(polices/Spectral-700-normal-latinx.woff2) format("woff2");
  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:"Spectral";font-style:normal;font-weight:700;
  font-display:swap;src:url(polices/Spectral-700-normal-latin.woff2) format("woff2");
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:"Archivo";font-style:normal;font-weight:400 600;
  font-display:swap;src:url(polices/Archivo-400-normal-latinx.woff2) format("woff2");
  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:"Archivo";font-style:normal;font-weight:400 600;
  font-display:swap;src:url(polices/Archivo-400-normal-latin.woff2) format("woff2");
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:400;
  font-display:swap;src:url(polices/IBMPlexMono-400-normal-latinx.woff2) format("woff2");
  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:400;
  font-display:swap;src:url(polices/IBMPlexMono-400-normal-latin.woff2) format("woff2");
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:500;
  font-display:swap;src:url(polices/IBMPlexMono-500-normal-latinx.woff2) format("woff2");
  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:500;
  font-display:swap;src:url(polices/IBMPlexMono-500-normal-latin.woff2) format("woff2");
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
/* ── LES JETONS ─────────────────────────────────────────────────────────── */
:root{
  /* Couleurs — chacune avec son contraste MESURÉ sur le papier, pas estimé */
  --encre:#131728;        /* 17,0:1 ✓ */
  --bleu:#002B7F;         /* 12,2:1 ✓ — la couleur structurante */
  --texte:#3E4459;        /*  9,3:1 ✓ — le texte courant */
  --note:#565E72;         /*  6,2:1 ✓ — les libellés de marge */
  --papier:#FBFAF7;
  --lavis:#F1F3F9;        /* le fond des encadrés */
  --filet:#D9DEEC;        /* 1,3:1 — un FILET, jamais du texte */
  --or:#E8B100;           /* 9,1:1 sur encre · 1,9:1 sur papier :
                             ⚠️ NE PORTE JAMAIS DE TEXTE NI D'INFORMATION SEULE */
  --clair:#9FB0DE;        /* 8,3:1 sur encre — le texte secondaire en négatif */
  /* Les trois états de la mesure */
  --etat-c:#1A6B47;       /* 6,2:1 ✓ */
  --etat-nc:#A3231F;      /* 7,1:1 ✓ */
  --etat-nt:#8A5A12;      /* 5,7:1 ✓ */
  --focus:#B03A0B;        /* 5,8:1 ✓ — l'anneau de focus, jamais retiré */

  --serif:Spectral,Georgia,"Times New Roman",serif;
  --sans:Archivo,"Helvetica Neue",Helvetica,system-ui,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;

  --marge:80px;           /* la marge de la grille */
  --gouttiere:24px;
  --rythme:8px;           /* tout espacement est un multiple de 8 */
  --radius:0;             /* la charte n'arrondit rien : elle trace */

  /* Le mouvement — voir plus bas la règle qui le gouverne */
  --t-court:160ms; --t-moyen:420ms; --t-mesure:900ms;
  --courbe:cubic-bezier(.2,.7,.2,1);
}

/* ── LE SOCLE ───────────────────────────────────────────────────────────── */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--sans);font-size:17px;line-height:1.6;
  color:var(--encre);background:var(--papier);font-variant-numeric:tabular-nums;
  -webkit-font-smoothing:antialiased}
a{color:var(--bleu);text-underline-offset:3px}
a:hover{color:var(--encre)}
/* ⭐ L'anneau de focus est DESSINÉ dans la charte. Une maison qui vend
   l'accessibilité ne laisse pas ce détail à l'improvisation de chaque page. */
a:focus-visible,button:focus-visible,input:focus-visible,
select:focus-visible,textarea:focus-visible,summary:focus-visible{
  outline:2px solid var(--focus);outline-offset:3px}
.skip{position:absolute;left:-999px}
/* Réservé aux technologies d'assistance : lu, jamais affiché. Employé pour les
   <caption> de tableau, qui nomment le tableau sans alourdir la page.
   🔴 Posé le 20/09/2026 : lois-europeennes.html employait déjà `sr-only`, qui
   n'existait PAS — les deux légendes se seraient affichées en clair. La sonde
   rendait « aucun manquement » : elle ne juge pas le rendu. */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip:focus{left:12px;top:12px;background:#fff;padding:8px 14px;
  border:2px solid var(--bleu);z-index:100}
img{max-width:100%;height:auto}

/* ── LA GRILLE ──────────────────────────────────────────────────────────── */
.wrap{max-width:1120px;margin:0 auto;padding-left:var(--marge);padding-right:var(--marge)}
.g{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));
  column-gap:var(--gouttiere);max-width:1120px;margin:0 auto;
  padding-left:var(--marge);padding-right:var(--marge)}
.col-marge{grid-column:1 / span 2}      /* le libellé */
.col-corps{grid-column:3 / span 9}      /* le texte */
.col-large{grid-column:3 / span 10}
.col-plein{grid-column:1 / span 12}

/* ── LA TYPOGRAPHIE ─────────────────────────────────────────────────────── */
h1,h2,h3{font-family:var(--serif);color:var(--encre);font-weight:700;
  letter-spacing:-.022em;text-wrap:balance}
h1{font-size:clamp(2.6rem,5.4vw,4.2rem);line-height:1.0;margin:0 0 .2em}
h2{font-size:clamp(1.5rem,2.4vw,1.9rem);line-height:1.12;margin:2.4em 0 .5em}
h3{font-size:1.16rem;line-height:1.24;margin:1.9em 0 .35em;color:var(--bleu)}
p,li,td{color:var(--texte)}
p{line-height:1.64;max-width:66ch}
.lead{font-family:var(--serif);font-size:clamp(1.18rem,1.9vw,1.5rem);
  font-style:italic;font-weight:300;line-height:1.45;color:#2B3148;max-width:62ch}
.lab{font-family:var(--mono);font-size:11px;letter-spacing:.16em;
  text-transform:uppercase;font-weight:500;color:var(--note)}
.s{font-family:var(--serif)} .m{font-family:var(--mono)}
code{font-family:var(--mono);font-size:.92em}

/* ── LES FILETS : TROIS POIDS, TROIS SENS ───────────────────────────────── */
.filet{border-top:1px solid var(--filet)}       /* sépare deux lignes d'une liste */
.filet-section{border-top:2px solid var(--encre)} /* ouvre ou ferme une section */
/* ⭐ 4 px d'or = UNE QUANTITÉ MESURÉE, et sa longueur l'encode.
   L'or ne décore plus rien. Une barre d'or dont la largeur ne vient pas
   d'un chiffre est une faute de charte. */
.echelle{height:4px;background:var(--filet)}
.echelle > span{display:block;height:4px;background:var(--or);
  transform-origin:left center;animation:tracer var(--t-mesure) var(--courbe) both}

/* ── LES COMPOSANTS ─────────────────────────────────────────────────────── */
.btn{font-family:var(--sans);font-size:15px;font-weight:600;text-decoration:none;
  min-height:44px;display:inline-flex;align-items:center;padding:15px 30px;
  border:1px solid transparent;cursor:pointer;border-radius:var(--radius);
  transition:background-color var(--t-court) var(--courbe),
             color var(--t-court) var(--courbe)}
.btn-1{color:#fff;background:var(--bleu)}
.btn-1:hover{background:var(--encre);color:#fff}
.btn-2{color:var(--bleu);background:transparent;border-color:var(--bleu)}
.btn-2:hover{background:var(--lavis)}
.boite{background:var(--lavis);border:1px solid var(--filet);padding:18px 22px;margin:1.3em 0}
.citation{border-left:3px solid var(--encre);padding:4px 0 4px 26px;margin:1.6em 0}
.boite-souligne{background:#fff;border:1px solid var(--filet);border-left:3px solid var(--encre);
  padding:18px 22px;margin:1.3em 0}
/* ⚠️ NI L'UNE NI L'AUTRE NE PORTE D'OR, et c'est délibéré. La première
   version de cette charte soulignait ces deux encadrés à l'or — donc l'or
   décorait, alors que la règle dit qu'il mesure. Une règle qui souffre deux
   exceptions n'est plus une règle : c'est une préférence. L'or est réservé
   aux échelles, sans exception, et le devient ici. */
.citation p{font-family:var(--serif);font-size:1.5rem;line-height:1.38;
  font-weight:600;color:var(--encre)}
.negatif{background:var(--encre);color:#fff}
.negatif h2,.negatif h3{color:#fff}
.negatif p,.negatif li{color:var(--clair)}
.negatif .lab{color:var(--or)}
table{border-collapse:collapse;width:100%;margin:1.2em 0}
th{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;
  text-align:left;color:var(--encre);padding:0 12px 11px 0;border-bottom:1px solid var(--encre)}
td{padding:14px 12px 14px 0;border-bottom:1px solid var(--filet);vertical-align:top}
.etat{font-family:var(--serif);font-weight:700;font-size:1.5rem;line-height:1}
.etat-c{color:var(--etat-c)} .etat-nc{color:var(--etat-nc)} .etat-nt{color:var(--etat-nt)}

.chiffres{display:flex;flex-wrap:wrap;gap:14px;margin:1.5em 0}
.chiffre{flex:1 1 160px;border-top:3px solid var(--encre);padding:14px 18px 0 0}
.chiffre b{display:block;font-family:var(--serif);font-size:2.6rem;font-weight:700;
  line-height:.95;color:var(--encre)}
.chiffre span{display:block;font-family:var(--mono);font-size:11px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--note);margin-top:8px}
.appel{background:var(--encre);padding:24px 28px;margin:2.6em 0 0}
.appel h2{color:#fff;margin:0 0 .3em;font-size:1.22rem}
.appel p{color:var(--clair);margin:.3em 0}
.appel a{color:var(--or)}

/* ── LE BANDEAU ET LE PIED ──────────────────────────────────────────────── */
.or-haut{height:4px;background:var(--or)}
.topbar{background:#fff;border-bottom:1px solid var(--filet)}
.topbar .row{display:flex;align-items:center;justify-content:space-between;
  padding:17px 0;gap:18px}
.brand{font-family:var(--sans);font-weight:600;font-size:17px;color:var(--bleu);
  text-decoration:none}
.brand span{color:var(--note);font-weight:400}
.topnav{display:flex;gap:26px;align-items:center;font-size:14px}
.topnav a{color:var(--note);text-decoration:none}
.topnav a:hover{color:var(--bleu);text-decoration:underline}
.topnav a[aria-current="page"]{color:var(--encre);font-weight:600;
  border-bottom:2px solid var(--or);padding-bottom:3px}
.lang{font-size:13px;font-weight:600;color:var(--bleu);text-decoration:none;
  border:1px solid var(--filet);padding:5px 11px}
.lang:hover{background:var(--lavis)}
footer{border-top:1px solid var(--filet);margin-top:60px}
footer .row{display:flex;justify-content:space-between;align-items:baseline;
  gap:22px;padding:22px 0 28px;flex-wrap:wrap}
footer a{color:var(--note);text-decoration:none;font-size:13px}
footer a:hover{color:var(--bleu);text-decoration:underline}

/* ── L'UNIVERS TEMPOSYSTEM ──────────────────────────────────────────────── */
/* ⭐ La MÊME ligne sur les trois sites. Posée le 20/09/2026 après avoir mesuré
   que 7 pages de temposystem.eu sur 10 ne pointaient vers aucun des deux
   autres — dont preuve.html, le fonds de commerce. 60,5 % des lecteurs sont
   des agents IA : ils suivent les liens, ils ne devinent pas les marques.
   ⚠️ Ce fichier vit en TROIS exemplaires (racine, robotics/, dataact) —
   `verifier-univers.sh` échoue si les empreintes divergent. */
.ecosysteme{font-size:13px;color:var(--note);line-height:1.75;
  padding:16px 0 0;margin:0;max-width:820px}
/* 🔴 --clair (#9FB0DE) A ÉTÉ ESSAYÉ ICI ET REFUSÉ : 2,07:1 sur --papier, quand
   WCAG AA exige 4,5:1 pour 11 px. --note donne 6,21:1. ⭐ La sonde ne pouvait
   PAS attraper cette faute : elle déclare le contraste « non testable », parce
   qu'il demande le rendu de la page. C'est exactement à quoi sert le troisième
   état — il dit où l'instrument s'arrête, et donc où il faut regarder soi-même. */
.ecosysteme b{display:block;font:500 11px/1.4 var(--mono);letter-spacing:.09em;
  text-transform:uppercase;color:var(--note);margin:0 0 5px}
.ecosysteme a{color:var(--note);text-decoration:none;
  border-bottom:1px solid var(--filet)}
.ecosysteme a:hover{color:var(--bleu);border-bottom-color:var(--bleu)}
/* le site où l'on se trouve, souligné d'or : le repère, pas un lien de plus */
.ecosysteme a[aria-current]{color:var(--encre);border-bottom-color:var(--or)}

/* ── LE MOUVEMENT ───────────────────────────────────────────────────────── */
/* 🔴 UNE SEULE RÈGLE : RIEN NE BOUGE QUI NE MESURE RIEN.
   Une animation ne signale pas qu'un site est vivant : elle montre une
   quantité se constituer. Toute autre est retirée.
   ⚠️ Et chaque animation part d'un état DÉJÀ LISIBLE — jamais de l'invisible :
   sans mouvement, la page est complète. */
@keyframes tracer{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes poser{from{opacity:.35;transform:translateY(5px)}to{opacity:1;transform:none}}
.poser{animation:poser var(--t-moyen) var(--courbe) backwards}
.poser-2{animation-delay:60ms} .poser-3{animation-delay:120ms}
.poser-4{animation-delay:180ms} .poser-5{animation-delay:240ms}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}
  html{scroll-behavior:auto}}

/* ── LES ÉCRANS ÉTROITS ─────────────────────────────────────────────────── */
@media (max-width:860px){
  :root{--marge:24px}
  .g{grid-template-columns:repeat(4,minmax(0,1fr))}
  .col-marge,.col-corps,.col-large,.col-plein{grid-column:1 / span 4}
  .col-marge{margin-bottom:6px}
  .topbar .row{flex-wrap:wrap}
  .topnav{gap:16px;flex-wrap:wrap}
  body{font-size:16px}
}

/* ── LE PAPIER ──────────────────────────────────────────────────────────── */
@media print{
  body{background:#fff;font-size:10.5pt}
  .topbar,.topnav,.or-haut,.btn{display:none}
  a{color:var(--encre);text-decoration:none}
  h2,h3{break-after:avoid}
}