/* Site de formation « Réglementation européenne des drones ».
   S'ajoute à charte.css sans la modifier : mêmes variables, mêmes polices locales,
   aucune ressource distante. Voir docs/formation/DESIGN-SITE.md.
   Convention : tout ce qui est propre au site est préfixé ft-. */

:root{
  --ft-bar:56px;              /* hauteur de la barre supérieure */
  --ft-tabs:40px;             /* hauteur de la rangée d'onglets */
  --ft-plan:260px;            /* largeur du rail de plan */
  --ft-gap:40px;              /* marge d'écran */
  --ft-unit:8px;              /* pas d'espacement */
  --ft-body:1.125rem;         /* 18 px minimum à l'écran */
}

/* Thème clair : redéfinition des seules variables de surface (DESIGN-SITE §3). */
:root[data-theme="light"]{
  color-scheme:light;
  --bg:#F4F8FB;--surface:#FFFFFF;--surface-2:#E6EEF4;--surface-3:#D8E3EC;
  --text:#00131E;--muted:#5F7389;--dim:#8AA0B3;
  --border:rgba(0,19,30,.10);--border-2:rgba(0,19,30,.18);
}
:root[data-theme="light"] body{background:var(--bg);color:var(--text)}
:root[data-theme="dark"]{color-scheme:dark}

/* La charte pose des marges de page ; le site de formation gère les siennes. */
body.ft-chapitre,body.ft-accueil{padding:0;background:var(--bg);color:var(--text);
  font:var(--ft-body)/1.5 var(--font-body);-webkit-font-smoothing:antialiased}

/* ══ Barre supérieure ════════════════════════════════════════════════════════ */
.ft-bar{position:sticky;top:0;z-index:40;height:var(--ft-bar);display:flex;align-items:center;
  gap:calc(var(--ft-unit)*2);padding:0 calc(var(--ft-unit)*3);background:var(--surface);
  border-bottom:1px solid var(--border)}
.ft-brand{display:flex;align-items:center;flex:none}
.ft-logo{height:30px;width:auto;display:block}
:root[data-theme="dark"] .ft-logo-light,:root[data-theme="light"] .ft-logo-dark{display:none}
.ft-title{font:600 .95rem/1.2 var(--font-head);letter-spacing:-.01em;color:var(--text);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ft-parcours{margin-left:auto;display:flex;align-items:center;gap:var(--ft-unit);flex:none}
.ft-parcours-lbl{font:.7rem/1 var(--font-mono);color:var(--dim);text-transform:uppercase;letter-spacing:.08em}
.ft-parcours select{font:.8rem var(--font-body);color:var(--text);background:var(--surface-2);
  border:1px solid var(--border-2);border-radius:var(--r-sm);padding:5px 8px;cursor:pointer}
.ft-icon-btn{flex:none;width:32px;height:32px;display:grid;place-items:center;font-size:1rem;
  color:var(--muted);background:transparent;border:1px solid var(--border-2);border-radius:var(--r-sm);cursor:pointer}
.ft-icon-btn:hover,.ft-icon-btn:focus-visible{color:var(--text);border-color:var(--red-500);outline:none}
:root[data-theme="dark"] .ft-only-light,:root[data-theme="light"] .ft-only-dark{display:none}

/* ══ Onglets de chapitre ═════════════════════════════════════════════════════ */
.ft-tabs{position:sticky;top:var(--ft-bar);z-index:35;display:flex;align-items:stretch;
  height:var(--ft-tabs);gap:2px;padding:0 calc(var(--ft-unit)*3);overflow-x:auto;
  background:var(--bg);border-bottom:1px solid var(--border);scrollbar-width:thin}
.ft-tab{display:flex;align-items:center;gap:7px;padding:0 11px;white-space:nowrap;
  text-decoration:none;color:var(--muted);font-size:.8rem;border-bottom:2px solid transparent}
.ft-tab b{font:600 .78rem var(--font-mono);color:var(--dim)}
.ft-tab span{max-width:14ch;overflow:hidden;text-overflow:ellipsis}
.ft-tab:hover{color:var(--text);background:var(--surface)}
.ft-tab.on{color:var(--text);border-bottom-color:var(--red-500)}
.ft-tab.on b{color:var(--red-500)}
.ft-tab.off{opacity:.38;cursor:default}
.ft-tab.off:hover{background:none;color:var(--muted)}

/* ══ Chapitre : plan + écrans ════════════════════════════════════════════════ */
.ft-layout{display:grid;grid-template-columns:var(--ft-plan) minmax(0,1fr);
  min-height:calc(100vh - var(--ft-bar) - var(--ft-tabs))}
body.plan-off .ft-layout{grid-template-columns:0 minmax(0,1fr)}
body.plan-off .ft-plan{opacity:0;pointer-events:none;transform:translateX(-12px)}

.ft-plan{position:sticky;top:calc(var(--ft-bar) + var(--ft-tabs));align-self:start;
  height:calc(100vh - var(--ft-bar) - var(--ft-tabs));overflow-y:auto;overflow-x:hidden;
  padding:calc(var(--ft-unit)*2) calc(var(--ft-unit)*2) calc(var(--ft-unit)*4);
  border-right:1px solid var(--border);background:var(--surface);
  transition:opacity .2s ease,transform .2s ease;scrollbar-width:thin}
.ft-plan-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:calc(var(--ft-unit)*2)}
.ft-plan-kicker{font:.68rem/1 var(--font-mono);color:var(--dim);text-transform:uppercase;letter-spacing:.12em}
.ft-plan-sec{margin-bottom:var(--ft-unit)}
.ft-plan-sec>summary{list-style:none;cursor:pointer;display:flex;gap:7px;align-items:baseline;
  padding:5px 4px;font:500 .84rem/1.35 var(--font-body);color:var(--text);border-radius:var(--r-sm)}
.ft-plan-sec>summary::-webkit-details-marker{display:none}
.ft-plan-sec>summary::before{content:"▸";flex:none;color:var(--dim);font-size:.7rem;transition:transform .15s ease}
.ft-plan-sec[open]>summary::before{transform:rotate(90deg)}
.ft-plan-sec>summary:hover{background:var(--surface-2)}
.ft-plan-sec>summary b{font:600 .72rem var(--font-mono);color:var(--red-500);flex:none}
.ft-plan-sec ul{list-style:none;margin:2px 0 calc(var(--ft-unit)*1.5);padding:0 0 0 14px;
  border-left:1px solid var(--border)}
.ft-plan-sec li a{display:flex;gap:7px;align-items:baseline;padding:4px 6px;border-radius:var(--r-sm);
  text-decoration:none;color:var(--muted);font-size:.8rem;line-height:1.35}
.ft-plan-sec li a:hover{color:var(--text);background:var(--surface-2)}
.ft-plan-dot{flex:none;width:5px;height:5px;margin-top:.5em;border-radius:50%;background:var(--border-2)}
.ft-plan-sec li a.on{color:var(--text);font-weight:500}
.ft-plan-sec li a.on .ft-plan-dot{background:var(--red-500);box-shadow:0 0 0 3px rgba(227,6,19,.18)}
.ft-plan-sec li a[hidden]{display:none}

/* ══ Un écran ════════════════════════════════════════════════════════════════ */
.ft-screens{min-width:0;position:relative}
/* La charte pose un liseré rouge pleine hauteur sur `[data-kind=elargissement]` (diaporama
   machine) ; ici l'élargissement s'annonce par son bandeau, pas par un trait collé au plan. */
.ft-screens .screen[data-kind=elargissement]{box-shadow:none}
/* Le contenu est centré verticalement quand il tient dans le cadre, et se déroule
   normalement quand il déborde : `justify-content:center` seul pousse le haut du bloc
   hors de la fenêtre dès que l'écran est plus haut que le viewport (étroit, projection). */
.screen{display:flex;flex-direction:column;justify-content:safe center;gap:calc(var(--ft-unit)*2);
  min-height:calc(100vh - var(--ft-bar) - var(--ft-tabs));
  padding:calc(var(--ft-unit)*4) var(--ft-gap) calc(var(--ft-unit)*6)}
.screen[hidden]{display:none}
/* Le saut d'ancre du navigateur (#2-3) colle l'écran sous la barre collante : on lui
   réserve la hauteur des deux barres. */
.screen{scroll-margin-top:calc(var(--ft-bar) + var(--ft-tabs))}
.screen.ft-in{animation:ft-in .22s ease both}
@keyframes ft-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.screen.ft-in{animation:none}}

.ft-stage{display:grid;grid-template-columns:minmax(0,58fr) minmax(0,42fr);
  gap:var(--ft-gap);align-items:center}
/* Les kinds à données (chiffres, comparatif, frise) prennent toute la largeur du cadre,
   mais pas plus : au-delà d'environ 1200 px une ligne de tableau devient illisible. */
.ft-stage-wide{grid-template-columns:minmax(0,1fr);max-width:1240px}
.ft-stage:not(:has(.ft-fig)){grid-template-columns:minmax(0,1fr)}
.ft-text{min-width:0;display:flex;flex-direction:column;gap:calc(var(--ft-unit)*2)}

.ft-kicker{margin:0;font:.72rem/1 var(--font-mono);color:var(--dim);
  text-transform:uppercase;letter-spacing:.14em}
.ft-kicker::after{content:"";display:block;width:34px;height:2px;margin-top:9px;background:var(--red-500)}
.ft-h2{margin:0;font:600 2.5rem/1.1 var(--font-head);letter-spacing:-.015em;color:var(--text);
  display:flex;align-items:flex-start;gap:calc(var(--ft-unit)*1.5);flex-wrap:wrap}
.ft-prose{margin:0;font-size:1.0625rem;line-height:1.6;color:var(--muted);max-width:62ch}
.ft-beyond{margin:0 0 calc(var(--ft-unit)*-1);align-self:flex-start;
  font:600 .68rem/1 var(--font-mono);text-transform:uppercase;letter-spacing:.14em;
  color:#fff;background:var(--red-500);padding:6px 12px;border-radius:var(--r-sm)}

ul.ft-points{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:calc(var(--ft-unit)*1.5)}
ul.ft-points li{position:relative;padding-left:20px;font-size:1.25rem;line-height:1.45;color:var(--text)}
ul.ft-points li::before{content:"";position:absolute;left:0;top:.62em;width:9px;height:3px;
  border-radius:2px;background:var(--red-500)}
ul.ft-points strong{font-weight:600}

/* Figure : ratio conservé, fond de surface, bouton plein écran en coin. */
.ft-fig{margin:0;min-width:0;display:flex;flex-direction:column;gap:calc(var(--ft-unit)*1.5)}
.ft-fig-frame{position:relative;background:var(--surface);border:1px solid var(--border);
  border-radius:var(--r-lg);overflow:hidden;display:grid;place-items:center;
  min-height:220px;max-height:64vh;cursor:zoom-in}
.ft-fig-frame img{display:block;width:100%;height:100%;max-height:64vh;object-fit:contain}
/* Les schémas sont dessinés sur la palette sombre (c'est aussi celle de la projection).
   En thème clair on garde donc leur plaque sombre plutôt que de les rendre illisibles :
   un schéma est une planche, pas du texte. Un SVG qui veut suivre le thème utilise
   `currentColor`, hérité ici de la plaque. */
.ft-svg{width:100%;padding:calc(var(--ft-unit)*2);background:var(--navy-950);color:var(--ice-50);
  border-radius:calc(var(--r-lg) - 1px)}
.ft-svg svg{display:block;width:100%;height:auto;max-height:60vh}
:root[data-theme="light"] .ft-fig-frame:has(.ft-svg){background:var(--navy-950);border-color:rgba(0,19,30,.2)}
.ft-fig-full{position:absolute;top:10px;right:10px;width:30px;height:30px;display:grid;place-items:center;
  font-size:.9rem;color:var(--text);background:var(--surface-2);border:1px solid var(--border-2);
  border-radius:var(--r-sm);cursor:pointer;opacity:0;transition:opacity .15s ease}
.ft-fig-frame:hover .ft-fig-full,.ft-fig-full:focus-visible{opacity:1}
.ft-fig figcaption{margin:0;font:.75rem/1.4 var(--font-mono);color:var(--dim)}

ol.ft-legend{list-style:none;margin:0;padding:0;display:grid;
  grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:5px 16px;font-size:.84rem;line-height:1.35}
ol.ft-legend li{display:flex;gap:8px;align-items:baseline;color:var(--text)}
ol.ft-legend li b{flex:none;width:1.55em;height:1.55em;display:grid;place-items:center;border-radius:50%;
  background:var(--red-500);color:#fff;font:600 .68rem var(--font-mono)}
ol.ft-legend-lg{font-size:1rem;grid-template-columns:1fr;gap:8px}

/* À retenir : carte à bord rouge. */
.retenir{border:1px solid var(--border);border-left:3px solid var(--red-500);
  border-radius:0 var(--r-md) var(--r-md) 0;background:var(--surface);padding:calc(var(--ft-unit)*2)}
.retenir-lbl{margin:0 0 6px;font:.68rem/1 var(--font-mono);color:var(--red-500);
  text-transform:uppercase;letter-spacing:.14em}
.retenir-p{margin:0;font-size:1.125rem;line-height:1.45;color:var(--text)}
.retenir-p+.retenir-p{margin-top:6px}

/* Bloc machine : repliable, une puce par modèle. */
details.machine{border:1px solid var(--border);border-radius:var(--r-md);background:var(--surface)}
details.machine>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:var(--ft-unit);
  flex-wrap:wrap;padding:11px calc(var(--ft-unit)*2);font:500 .92rem var(--font-body);color:var(--text)}
details.machine>summary::-webkit-details-marker{display:none}
.machine-pic{color:var(--red-500)}
.machine-chip{font:.7rem var(--font-mono);color:var(--muted);border:1px solid var(--border-2);
  border-radius:999px;padding:2px 9px}
.machine-p{margin:0;padding:0 calc(var(--ft-unit)*2) 11px;font-size:.98rem;line-height:1.5;color:var(--muted)}
.machine-p b{color:var(--text);font-weight:600}
.machine-src{display:block;font:.72rem var(--font-mono);color:var(--dim);margin-top:3px}

/* Divergence : pastille « corrigé » et bulle. */
.ft-corrige{align-self:center;font:600 .66rem/1 var(--font-mono);text-transform:uppercase;letter-spacing:.1em;
  color:var(--warning);background:rgba(245,158,11,.14);border:1px solid rgba(245,158,11,.4);
  border-radius:999px;padding:5px 10px;cursor:help}
.ft-corrige:hover,.ft-corrige[aria-expanded="true"]{background:rgba(245,158,11,.24)}
.ft-bulle{border:1px solid rgba(245,158,11,.35);border-left:3px solid var(--warning);
  border-radius:0 var(--r-md) var(--r-md) 0;background:var(--surface);padding:calc(var(--ft-unit)*2);font-size:.95rem}
.ft-bulle[hidden]{display:none}
.ft-bulle-p{margin:0;color:var(--muted)}
.ft-bulle-fix{margin:6px 0 0;color:var(--text);font-weight:500}
.ft-bulle-src,.ft-bulle-more{margin:6px 0 0;font:.72rem var(--font-mono);color:var(--dim)}
.ft-niveau{display:inline-block;margin-right:7px;font:600 .64rem var(--font-mono);text-transform:uppercase;
  letter-spacing:.08em;border-radius:var(--r-sm);padding:2px 7px}
/* Les niveaux portent l'identifiant du YAML, sans accent : erreur rouge, obsolète
   orange, imprécision bleu, complément vert, non vérifiée gris (DESIGN-SITE §5). */
.ft-niveau-erreur{color:var(--red-400);background:rgba(227,6,19,.16)}
.ft-niveau-obsolete,.ft-niveau-nuance{color:var(--warning);background:rgba(245,158,11,.16)}
.ft-niveau-imprecision{color:var(--info);background:rgba(63,162,208,.16)}
.ft-niveau-complement{color:var(--success);background:rgba(16,185,129,.16)}
.ft-niveau-non-verifiee{color:var(--dim);background:var(--surface-2)}

/* Kind chiffres : grille de KPI. */
.ft-kpis{display:grid;gap:calc(var(--ft-unit)*2);grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
.ft-kpi{background:var(--surface);border:1px solid var(--border);border-top:2px solid var(--red-500);
  border-radius:var(--r-md);padding:calc(var(--ft-unit)*2)}
/* La valeur s'adapte à sa longueur : « 15 °C » tient en grand, « -2 °C / 1 000 ft »
   doit rétrécir plutôt que déborder ou se couper en quatre lignes. */
.ft-kpi b{display:block;font:600 3.5rem/1.05 var(--font-mono);color:var(--text);letter-spacing:-.03em;
  overflow-wrap:break-word;hyphens:none}
.ft-kpi b[data-len="moyen"]{font-size:2.5rem}
.ft-kpi b[data-len="long"]{font-size:1.9rem;letter-spacing:-.02em}
.ft-kpi span{display:block;margin-top:9px;font-size:.92rem;color:var(--muted)}

/* Kind comparatif : tableau plein cadre, en-tête collante. */
.ft-table-wrap{border:1px solid var(--border);border-radius:var(--r-md);overflow:auto;background:var(--surface);max-height:66vh}
table.comparatif{border-collapse:separate;border-spacing:0;width:100%;font-size:1rem}
table.comparatif th,table.comparatif td{padding:13px 16px;text-align:left;vertical-align:top;
  border-bottom:1px solid var(--border)}
table.comparatif thead th{position:sticky;top:0;z-index:1;background:var(--surface-2);color:var(--muted);
  font:600 .72rem var(--font-mono);text-transform:uppercase;letter-spacing:.1em;white-space:nowrap;cursor:pointer}
table.comparatif thead th:hover{color:var(--text)}
table.comparatif thead th[aria-sort]::after{content:" ▴";color:var(--red-500)}
table.comparatif thead th[aria-sort="descending"]::after{content:" ▾"}
table.comparatif tbody th{font-weight:600;color:var(--text);white-space:nowrap}
table.comparatif tbody tr:last-child th,table.comparatif tbody tr:last-child td{border-bottom:0}
table.comparatif tbody tr:hover th,table.comparatif tbody tr:hover td{background:var(--surface-2)}

/* Kind frise : axe horizontal, pastilles datées. */
ol.frise{list-style:none;margin:0;padding:calc(var(--ft-unit)*3) 0 0;display:flex;gap:0;overflow-x:auto;
  scrollbar-width:thin;position:relative}
ol.frise::before{content:"";position:absolute;left:0;right:0;top:calc(var(--ft-unit)*3 + 5px);
  height:2px;background:var(--border-2)}
ol.frise li{flex:1 0 190px;padding:0 calc(var(--ft-unit)*2) 0 0;position:relative}
.frise-pin{display:flex;flex-direction:column;gap:5px;align-items:flex-start;width:100%;padding:0;
  text-align:left;background:none;border:0;cursor:pointer;color:var(--text)}
.frise-pin::before{content:"";width:12px;height:12px;border-radius:50%;background:var(--bg);
  border:2px solid var(--red-500);margin-bottom:calc(var(--ft-unit)*1.5)}
.frise-pin b{font:600 1.05rem var(--font-mono);color:var(--red-500)}
.frise-pin span{font-size:1rem;line-height:1.35;color:var(--text);border-bottom:1px dotted var(--border-2)}
.frise-pin:hover span{border-bottom-color:var(--red-500)}
.frise-pin:hover::before,.frise-pin[aria-expanded="true"]::before{background:var(--red-500)}
.frise-txt{margin:11px 0 0;padding-left:0;font-size:.95rem;line-height:1.5;color:var(--muted)}
.frise-txt[hidden]{display:none}

/* Kind cas : situation, étapes numérotées, verdict. */
.ft-cas{display:flex;flex-direction:column;gap:calc(var(--ft-unit)*2)}
.ft-cas-sit{margin:0;background:var(--surface-2);border-radius:var(--r-md);
  padding:calc(var(--ft-unit)*2);font-size:1.0625rem;line-height:1.5}
.ft-cas-lbl{display:block;margin-bottom:5px;font:.68rem/1 var(--font-mono);color:var(--dim);
  text-transform:uppercase;letter-spacing:.14em}
ol.ft-cas-steps{list-style:none;counter-reset:cas;margin:0;padding:0;display:flex;flex-direction:column;gap:calc(var(--ft-unit)*1.5)}
ol.ft-cas-steps li{counter-increment:cas;position:relative;padding-left:38px}
ol.ft-cas-steps li::before{content:counter(cas);position:absolute;left:0;top:0;width:26px;height:26px;
  display:grid;place-items:center;border-radius:50%;background:var(--surface-2);border:1px solid var(--border-2);
  font:600 .8rem var(--font-mono);color:var(--text)}
ol.ft-cas-steps li b{display:block;font-size:1.0625rem;font-weight:600;line-height:1.35}
ol.ft-cas-steps li span{display:block;margin-top:3px;font-size:.98rem;line-height:1.5;color:var(--muted)}
.ft-verdict{margin:0;border:1px solid rgba(16,185,129,.4);border-left:3px solid var(--success);
  border-radius:0 var(--r-md) var(--r-md) 0;background:rgba(16,185,129,.09);
  padding:calc(var(--ft-unit)*2);font-size:1.0625rem;line-height:1.45;color:var(--text)}

/* Notes formateur et sources en pied d'écran. */
details.notes{border:1px dashed var(--border-2);border-radius:var(--r-md);background:transparent}
details.notes>summary{list-style:none;cursor:pointer;padding:9px calc(var(--ft-unit)*2);
  font:.85rem var(--font-body);color:var(--muted);display:flex;align-items:center;gap:var(--ft-unit)}
details.notes>summary::-webkit-details-marker{display:none}
details.notes kbd{font:.7rem var(--font-mono);color:var(--dim);border:1px solid var(--border-2);
  border-radius:4px;padding:1px 5px}
details.notes p{margin:0;padding:0 calc(var(--ft-unit)*2) 11px;font-size:.95rem;line-height:1.55;color:var(--muted)}
.ft-sources{margin:0;font:.75rem/1.55 var(--font-mono);color:var(--dim)}
.ft-fact{margin-left:6px;border:1px solid var(--border);border-radius:var(--r-sm);padding:1px 6px}

/* Barre de progression et compteur. */
.ft-progress{position:fixed;left:0;right:0;bottom:0;z-index:30;height:3px;background:var(--surface-2)}
.ft-progress>span{display:block;height:100%;width:0;background:var(--red-500);transition:width .25s ease}
.ft-diff-count{display:none}

/* Plein écran d'une figure : la légende passe à droite. */
dialog.ft-full{width:min(96vw,1700px);max-width:96vw;height:94vh;margin:auto;padding:0;
  border:1px solid var(--border-2);border-radius:var(--r-lg);background:var(--bg);color:var(--text);overflow:hidden}
dialog.ft-full::backdrop{background:rgba(0,10,18,.86)}
.ft-full-body{display:grid;grid-template-columns:minmax(0,1fr) minmax(240px,28%);gap:calc(var(--ft-unit)*3);
  height:100%;padding:calc(var(--ft-unit)*3)}
.ft-full-vis{min-width:0;display:grid;place-items:center}
.ft-full-vis img,.ft-full-vis svg{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain}
/* Même plaque sombre qu'en page pour un schéma affiché en grand. */
.ft-full-vis .ft-svg{background:var(--navy-950);color:var(--ice-50);border-radius:var(--r-md);
  padding:calc(var(--ft-unit)*3);max-height:100%;display:grid;place-items:center}
.ft-full-vis .ft-svg svg{max-height:82vh;width:100%}
.ft-full-side{overflow-y:auto}
.ft-full-cap{margin:0 0 calc(var(--ft-unit)*2);font:.85rem/1.5 var(--font-mono);color:var(--dim)}
.ft-full-close{position:absolute;top:12px;right:14px;z-index:2;width:34px;height:34px;font-size:1rem;
  color:var(--text);background:var(--surface);border:1px solid var(--border-2);border-radius:50%;cursor:pointer}

/* ══ Accueil ═════════════════════════════════════════════════════════════════ */
.ft-home{max-width:1180px;margin:0 auto;padding:calc(var(--ft-unit)*6) calc(var(--ft-unit)*3) calc(var(--ft-unit)*10)}
.ft-hero{padding-bottom:calc(var(--ft-unit)*5);border-bottom:1px solid var(--border);margin-bottom:calc(var(--ft-unit)*7)}
.ft-hero h1{margin:calc(var(--ft-unit)*2) 0 0;font:600 clamp(2.2rem,4.6vw,3.6rem)/1.05 var(--font-head);
  letter-spacing:-.025em;max-width:22ch}
.ft-hero-sub{margin:calc(var(--ft-unit)*2) 0 0;max-width:62ch;font-size:1.125rem;line-height:1.6;color:var(--muted)}
.ft-hero-meta{margin:calc(var(--ft-unit)*3) 0 0;font:.75rem var(--font-mono);color:var(--dim);
  display:flex;gap:9px;flex-wrap:wrap}
.ft-dot{color:var(--border-2)}
.ft-sec{margin-bottom:calc(var(--ft-unit)*7)}
.ft-sec-h{margin:0 0 calc(var(--ft-unit)*3);font:600 .78rem/1 var(--font-mono);color:var(--dim);
  text-transform:uppercase;letter-spacing:.16em}

.ft-parcours-grid{display:grid;gap:calc(var(--ft-unit)*2);grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}
.ft-pcard{display:flex;flex-direction:column;gap:var(--ft-unit);padding:calc(var(--ft-unit)*3);
  text-decoration:none;color:inherit;background:var(--surface);border:1px solid var(--border);
  border-radius:var(--r-lg);transition:border-color .15s ease,transform .15s ease}
.ft-pcard:hover{border-color:var(--red-500);transform:translateY(-2px)}
.ft-pcard.off{opacity:.5}
.ft-pcard-id{font:600 1.35rem/1 var(--font-mono);color:var(--red-500);letter-spacing:-.01em}
.ft-pcard-lbl{font:600 1.05rem/1.25 var(--font-head);color:var(--text)}
.ft-pcard-txt{font-size:.92rem;line-height:1.5;color:var(--muted);flex:1}
.ft-pcard-go{margin-top:var(--ft-unit);font:.72rem var(--font-mono);color:var(--dim);
  text-transform:uppercase;letter-spacing:.1em}
.ft-pcard:hover .ft-pcard-go{color:var(--red-500)}

.ft-chapters{display:grid;gap:calc(var(--ft-unit)*2);grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}
.ft-chap{position:relative;display:flex;flex-direction:column;gap:var(--ft-unit);
  padding:calc(var(--ft-unit)*2.5);min-height:150px;text-decoration:none;color:inherit;
  background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);
  overflow:hidden;transition:border-color .15s ease,transform .15s ease}
.ft-chap:hover{border-color:var(--red-500);transform:translateY(-2px)}
/* La couverture reste une ambiance derrière le numéro : assez présente pour distinguer
   les chapitres, jamais assez pour gêner la lecture. Le thème clair en demande moins. */
/* La vignette reste une ambiance, jamais un fond de lecture : les figures claires
   (cartes, tableaux, ciels) noient le numéro et le titre. Elle est donc désaturée,
   assombrie et confinée au tiers droit de la carte, le texte gardant le fond plein. */
.ft-chap-cover{position:absolute;inset:0 0 0 auto;width:52%;height:100%;object-fit:cover;
  opacity:.5;filter:saturate(.55) brightness(.62);
  -webkit-mask-image:linear-gradient(90deg,transparent 0,rgba(0,0,0,.85) 55%,#000 100%);
  mask-image:linear-gradient(90deg,transparent 0,rgba(0,0,0,.85) 55%,#000 100%)}
:root[data-theme="light"] .ft-chap-cover{opacity:.38;filter:saturate(.6) brightness(1.04)}
.ft-chap:hover .ft-chap-cover{opacity:.66}
.ft-chap>*:not(.ft-chap-cover){position:relative}
.ft-chap-num{font:600 2.6rem/1 var(--font-mono);color:var(--red-500);letter-spacing:-.04em}
.ft-chap-t{font:600 1rem/1.3 var(--font-head);color:var(--text);flex:1}
.ft-chap-meta{font:.72rem var(--font-mono);color:var(--dim)}
.ft-chap.off{opacity:.46}
.ft-chap.off .ft-chap-num{color:var(--dim)}
.ft-soon{color:var(--muted)}
.ft-chap-bar{display:block;height:2px;background:var(--surface-3);border-radius:999px;overflow:hidden}
.ft-chap-bar>i{display:block;height:100%;width:0;background:var(--red-500)}

.ft-tools{display:grid;gap:var(--ft-unit);grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}
.ft-tool{display:flex;flex-direction:column;gap:3px;padding:calc(var(--ft-unit)*2);text-decoration:none;
  color:inherit;background:var(--surface-2);border:1px solid transparent;border-radius:var(--r-md)}
.ft-tool:hover{border-color:var(--red-500)}
.ft-tool b{font:600 .95rem var(--font-head)}
.ft-tool span{font:.74rem var(--font-mono);color:var(--dim)}
.ft-tool.off{opacity:.45}

.ft-gloss{display:grid;grid-template-columns:auto minmax(0,1fr);gap:9px calc(var(--ft-unit)*3);margin:0}
.ft-gloss dt{font:600 .85rem var(--font-mono);color:var(--red-500)}
.ft-gloss dd{margin:0;font-size:.95rem;line-height:1.5;color:var(--muted)}

/* ══ Pages transverses ═══════════════════════════════════════════════════════
   Une annexe se lit en défilant, pas écran par écran : pas de plan, pas de
   projection, une colonne de lecture large et un en-tête qui pose le contexte. */
body.ft-page{padding:0;background:var(--bg);color:var(--text);
  font:var(--ft-body)/1.5 var(--font-body);-webkit-font-smoothing:antialiased}
.ft-tabs-outils{gap:0;overflow-x:auto;scrollbar-width:thin}
.ft-tabs-outils .ft-tab{font-size:.84rem}
.ft-tabs-outils .ft-tab b{color:var(--muted)}
.ft-tabs-outils .ft-tab span{max-width:none}

.ft-doc{max-width:900px;margin:0 auto;padding:calc(var(--ft-unit)*6) calc(var(--ft-unit)*3) calc(var(--ft-unit)*10)}
.ft-doc-large{max-width:1180px}
.ft-doc-head{padding-bottom:calc(var(--ft-unit)*4);border-bottom:1px solid var(--border);
  margin-bottom:calc(var(--ft-unit)*5)}
.ft-doc-head h1{margin:calc(var(--ft-unit)*2) 0 0;font:600 clamp(1.9rem,3.4vw,2.8rem)/1.1 var(--font-head);
  letter-spacing:-.02em;color:var(--text);max-width:22ch}
.ft-doc-lede{margin-top:calc(var(--ft-unit)*2.5);max-width:72ch}
.ft-doc-lede p{margin:0 0 calc(var(--ft-unit)*1.5);font-size:1.0625rem;line-height:1.6;color:var(--muted)}
.ft-doc-lede p:last-child{margin-bottom:0}
.ft-doc-lede em{color:var(--text);font-style:normal;font-weight:500}
.ft-doc-note{font-size:.95rem!important;color:var(--dim)!important;border-left:2px solid var(--border-2);
  padding-left:calc(var(--ft-unit)*1.5)}
.ft-doc-stats{display:flex;flex-wrap:wrap;gap:calc(var(--ft-unit)*2.5);margin-top:calc(var(--ft-unit)*3);
  font:.8rem var(--font-mono);color:var(--dim)}
.ft-doc-stat b{color:var(--text)}
.ft-empty{margin:calc(var(--ft-unit)*6) 0;text-align:center;color:var(--dim);font-size:1rem}
.ft-empty[hidden]{display:none}

/* Filtres en pastilles : niveau, chapitre, parcours. */
.ft-filters{margin-top:calc(var(--ft-unit)*3);display:flex;flex-direction:column;gap:var(--ft-unit)}
.ft-filter-row{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
/* Le libellé sert aussi de titre de bloc ailleurs (répartition, correction) :
   la colonne fixe de 72 px ne vaut que dans une rangée de filtres. */
.ft-filter-lbl{font:.68rem/1.4 var(--font-mono);color:var(--dim);
  text-transform:uppercase;letter-spacing:.1em;margin:0}
.ft-filter-row>.ft-filter-lbl,.ft-ex-chapsel>.ft-filter-lbl{flex:none;width:72px}
.ft-filter-count{margin:2px 0 0 72px;font:.72rem var(--font-mono);color:var(--dim)}
.ft-chipbtn{font:.78rem var(--font-body);color:var(--muted);background:var(--surface);
  border:1px solid var(--border);border-radius:999px;padding:5px 12px;cursor:pointer;
  transition:border-color .15s ease,color .15s ease}
.ft-chipbtn i{font-style:normal;font-family:var(--font-mono);font-size:.7rem;color:var(--dim);margin-left:4px}
.ft-chipbtn:hover{color:var(--text);border-color:var(--border-2)}
.ft-chipbtn.on{color:var(--text);border-color:var(--red-500);background:rgba(227,6,19,.1)}
.ft-chipbtn.on i{color:var(--red-400)}

/* ── Divergences : la citation du support et la correction en regard ──────── */
.ft-divs{display:flex;flex-direction:column;gap:calc(var(--ft-unit)*2)}
.ft-div{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);
  padding:calc(var(--ft-unit)*2.5) calc(var(--ft-unit)*3);scroll-margin-top:calc(var(--ft-bar) + var(--ft-tabs) + 16px)}
.ft-div[hidden]{display:none}
.ft-div:target{border-color:var(--red-500);box-shadow:0 0 0 3px rgba(227,6,19,.14)}
.ft-div-head{display:flex;flex-wrap:wrap;gap:var(--ft-unit);align-items:center;
  margin-bottom:calc(var(--ft-unit)*2)}
.ft-div-page{font:600 .74rem var(--font-mono);color:var(--text)}
.ft-div-chap{font:.74rem var(--font-mono);color:var(--muted)}
.ft-div-id{margin-left:auto;font:.68rem var(--font-mono);color:var(--dim)}
.ft-div-body{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:calc(var(--ft-unit)*3)}
.ft-div-col{min-width:0}
.ft-div-lbl{margin:0 0 6px;font:.66rem/1 var(--font-mono);text-transform:uppercase;letter-spacing:.11em}
.ft-div-said .ft-div-lbl{color:var(--dim)}
.ft-div-fix .ft-div-lbl{color:var(--red-500)}
.ft-div blockquote{margin:0;padding-left:calc(var(--ft-unit)*1.5);border-left:2px solid var(--border-2);
  font-size:.98rem;line-height:1.55;color:var(--muted);font-style:italic}
.ft-div-txt{margin:0;padding-left:calc(var(--ft-unit)*1.5);border-left:2px solid var(--red-500);
  font-size:.98rem;line-height:1.55;color:var(--text)}
.ft-div-foot{margin-top:calc(var(--ft-unit)*2);padding-top:calc(var(--ft-unit)*1.5);
  border-top:1px dashed var(--border)}
.ft-div-quote{margin:0;font-size:.88rem;line-height:1.5;color:var(--muted)}
.ft-div-quote span{font:.68rem var(--font-mono);color:var(--dim);text-transform:uppercase;letter-spacing:.09em}
.ft-div-refs{display:flex;flex-wrap:wrap;gap:var(--ft-unit);align-items:baseline;margin:6px 0 0}
.ft-div-src{font:.72rem var(--font-mono);color:var(--dim)}
.ft-div-go{margin-left:auto;font:.76rem var(--font-mono);color:var(--info);text-decoration:none;white-space:nowrap}
.ft-div-go:hover{text-decoration:underline}

/* ── Glossaire ────────────────────────────────────────────────────────────── */
.ft-search{display:flex;flex-wrap:wrap;gap:var(--ft-unit);align-items:center;margin-top:calc(var(--ft-unit)*3)}
.ft-search-lbl{font:.68rem/1 var(--font-mono);color:var(--dim);text-transform:uppercase;letter-spacing:.1em}
.ft-search input{flex:1;min-width:220px;max-width:420px;font:1rem var(--font-body);color:var(--text);
  background:var(--surface);border:1px solid var(--border-2);border-radius:var(--r-sm);padding:9px 13px}
.ft-search input:focus{outline:none;border-color:var(--red-500);box-shadow:0 0 0 3px rgba(227,6,19,.12)}
.ft-search-count{margin:0;font:.72rem var(--font-mono);color:var(--dim)}
.ft-alpha{display:flex;flex-wrap:wrap;gap:4px;margin-top:calc(var(--ft-unit)*2)}
.ft-alpha a{font:600 .74rem var(--font-mono);color:var(--muted);text-decoration:none;
  border:1px solid var(--border);border-radius:var(--r-sm);padding:3px 8px;min-width:26px;text-align:center}
.ft-alpha a:hover{color:var(--text);border-color:var(--red-500)}
.ft-gloss-list{display:flex;flex-direction:column}
.ft-gloss-letter{margin:calc(var(--ft-unit)*4) 0 var(--ft-unit);font:600 1.5rem/1 var(--font-mono);
  color:var(--red-500);border-bottom:1px solid var(--border);padding-bottom:var(--ft-unit);
  scroll-margin-top:calc(var(--ft-bar) + var(--ft-tabs) + 16px)}
/* La première lettre suit déjà le filet de l'en-tête : pas de double respiration. */
.ft-gloss-letter:first-child{margin-top:0}
.ft-gloss-letter[hidden]{display:none}
.ft-gterm{padding:calc(var(--ft-unit)*2) 0;border-bottom:1px solid var(--border)}
.ft-gterm[hidden]{display:none}
.ft-gterm-t{margin:0;font:600 1.05rem/1.3 var(--font-head);color:var(--text);
  display:flex;flex-wrap:wrap;gap:var(--ft-unit);align-items:baseline}
.ft-gterm-sig{font:600 .74rem var(--font-mono);color:var(--red-500);
  border:1px solid rgba(227,6,19,.32);border-radius:var(--r-sm);padding:1px 7px}
.ft-gterm-d{margin:6px 0 0;font-size:.98rem;line-height:1.6;color:var(--muted);max-width:78ch}
.ft-gterm-src{margin:6px 0 0;font:.7rem var(--font-mono);color:var(--dim)}

/* ── Fiches de synthèse ───────────────────────────────────────────────────── */
.ft-fiche{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);
  padding:calc(var(--ft-unit)*3);margin-bottom:calc(var(--ft-unit)*3);
  scroll-margin-top:calc(var(--ft-bar) + var(--ft-tabs) + 16px)}
.ft-fiche-head{display:flex;gap:calc(var(--ft-unit)*2);align-items:center;
  padding-bottom:calc(var(--ft-unit)*2);border-bottom:2px solid var(--red-500);
  margin-bottom:calc(var(--ft-unit)*3)}
.ft-fiche-num{font:600 2.6rem/1 var(--font-mono);color:var(--red-500);letter-spacing:-.04em;flex:none}
.ft-fiche-id{min-width:0;flex:1}
.ft-fiche-t{margin:0;font:600 1.35rem/1.2 var(--font-head);color:var(--text)}
.ft-fiche-meta{margin:3px 0 0;font:.72rem var(--font-mono);color:var(--dim)}
.ft-fiche-go{flex:none;font:.76rem var(--font-mono);color:var(--info);text-decoration:none}
.ft-fiche-go:hover{text-decoration:underline}
.ft-fiche-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:calc(var(--ft-unit)*4)}
.ft-fiche-col{min-width:0;display:flex;flex-direction:column;gap:calc(var(--ft-unit)*3)}
.ft-fiche-sec h3{margin:0 0 var(--ft-unit);font:600 .68rem/1 var(--font-mono);color:var(--dim);
  text-transform:uppercase;letter-spacing:.12em}
.ft-fiche-ul{margin:0;padding-left:1.1em;display:flex;flex-direction:column;gap:5px}
.ft-fiche-ul li{font-size:.95rem;line-height:1.5;color:var(--muted)}
.ft-fiche-kp li{color:var(--text)}
.ft-fiche-ul li::marker{color:var(--red-500)}
/* Les valeurs de chiffres ne sont pas toujours courtes (« ≈ 28 ft près du sol ») :
   la cellule respire assez pour n'en couper aucune sur deux lignes serrées. */
.ft-fiche-kpis{display:grid;gap:var(--ft-unit);grid-template-columns:repeat(auto-fit,minmax(168px,1fr))}
.ft-fiche-kpi{background:var(--surface-2);border-radius:var(--r-sm);padding:calc(var(--ft-unit)*1.5);
  border-top:2px solid var(--red-500);min-width:0}
.ft-fiche-kpi b{display:block;font:600 1.15rem/1.25 var(--font-mono);color:var(--text);
  letter-spacing:-.02em;overflow-wrap:anywhere}
.ft-fiche-kpi span{display:block;margin-top:4px;font-size:.76rem;line-height:1.3;color:var(--muted)}
.ft-fiche-ret{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.ft-fiche-ret li{font-size:.95rem;line-height:1.5;color:var(--text);
  border-left:2px solid var(--red-500);padding-left:calc(var(--ft-unit)*1.5)}
/* Renvoi vers l'écran : une pastille discrète, pas un caractère perdu en fin de phrase. */
.ft-fiche-ref{display:inline-grid;place-items:center;width:17px;height:17px;vertical-align:-2px;
  margin-left:5px;border-radius:50%;background:var(--surface-2);color:var(--dim);
  text-decoration:none;font-size:.62rem;line-height:1}
.ft-fiche-ref:hover{background:var(--red-500);color:#fff}

/* ── Comparatifs, frise, cas : en-tête commun ─────────────────────────────── */
.ft-comp,.ft-frisebloc{margin-bottom:calc(var(--ft-unit)*6)}
.ft-comp[hidden],.ft-frisebloc[hidden]{display:none}
.ft-comp-head{display:flex;gap:calc(var(--ft-unit)*2);align-items:flex-end;justify-content:space-between;
  margin-bottom:calc(var(--ft-unit)*2);flex-wrap:wrap}
.ft-comp-kick{margin:0 0 4px;font:.7rem/1 var(--font-mono);color:var(--red-500);
  text-transform:uppercase;letter-spacing:.11em}
.ft-comp-t{margin:0;font:600 1.4rem/1.2 var(--font-head);color:var(--text)}
.ft-comp-go{font:.76rem var(--font-mono);color:var(--info);text-decoration:none;white-space:nowrap}
.ft-comp-go:hover{text-decoration:underline}
.ft-comp-lede{margin:0 0 calc(var(--ft-unit)*2);font-size:.98rem;line-height:1.6;color:var(--muted);max-width:74ch}
.ft-page .ft-table-wrap{max-height:none}
.ft-page .retenir,.ft-page .ft-sources{margin-top:calc(var(--ft-unit)*2)}

/* ── Frise : axe horizontal en grille ─────────────────────────────────────── */
/* Une colonne par jalon. Le minimum de 150 px fait tenir sept jalons sans défilement
   sur un écran de bureau ; au-delà, l'axe défile horizontalement plutôt que de
   comprimer les dates jusqu'à l'illisible. */
.ft-frise-axe{list-style:none;margin:calc(var(--ft-unit)*3) 0 0;padding:0;display:grid;
  grid-template-columns:repeat(var(--ft-jalons),minmax(150px,1fr));gap:0;
  overflow-x:auto;scrollbar-width:thin;position:relative;padding-top:calc(var(--ft-unit)*2)}
.ft-frise-axe::before{content:"";position:absolute;left:0;right:0;top:calc(var(--ft-unit)*2 + 6px);
  height:2px;background:linear-gradient(90deg,var(--border-2),var(--red-500))}
.ft-jalon{padding:0 calc(var(--ft-unit)*2) 0 0;position:relative;min-width:0}
.ft-jalon-pin{display:flex;flex-direction:column;gap:5px;align-items:flex-start;width:100%;padding:0;
  text-align:left;background:none;border:0;cursor:pointer;color:var(--text)}
.ft-jalon-pin::before{content:"";width:14px;height:14px;border-radius:50%;background:var(--bg);
  border:3px solid var(--red-500);box-sizing:border-box;margin-bottom:var(--ft-unit)}
.ft-jalon-pin b{font:600 .92rem/1.25 var(--font-mono);color:var(--red-500);letter-spacing:-.02em}
.ft-jalon-pin span{font:600 .92rem/1.3 var(--font-head);color:var(--text)}
.ft-jalon-pin:hover span{color:var(--red-400)}
.ft-jalon-txt{margin:var(--ft-unit) 0 0;padding-right:var(--ft-unit);
  font-size:.88rem;line-height:1.55;color:var(--muted)}
.ft-jalon-txt[hidden]{display:none}

/* ── Études de cas : cartes ───────────────────────────────────────────────── */
.ft-cas-grid{display:grid;gap:calc(var(--ft-unit)*3);grid-template-columns:repeat(auto-fill,minmax(420px,1fr))}
.ft-cascard{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);
  padding:calc(var(--ft-unit)*3);display:flex;flex-direction:column;gap:calc(var(--ft-unit)*2)}
.ft-cascard[hidden]{display:none}
.ft-cascard-head{margin:0}
.ft-cascard-t{margin:0;font:600 1.2rem/1.25 var(--font-head);color:var(--text)}
.ft-page .ft-cas-sit{margin:0;background:var(--surface-2);border-radius:var(--r-md);
  padding:calc(var(--ft-unit)*2);font-size:.98rem;line-height:1.55;color:var(--text)}
.ft-cas-det{border:0}
.ft-cas-det>summary{list-style:none;cursor:pointer;display:flex;gap:7px;align-items:center;
  font:.7rem/1 var(--font-mono);color:var(--dim);text-transform:uppercase;letter-spacing:.1em;
  padding:6px 0;border-bottom:1px solid var(--border)}
.ft-cas-det>summary::-webkit-details-marker{display:none}
.ft-cas-det>summary span{transition:transform .15s ease;display:inline-block}
.ft-cas-det:not([open])>summary span{transform:rotate(-90deg)}
.ft-cas-det>summary i{font-style:normal;margin-left:auto;color:var(--red-500)}
.ft-cas-det>summary:hover{color:var(--text)}
.ft-page ol.ft-cas-steps{margin:calc(var(--ft-unit)*2) 0 0;padding-left:0;list-style:none;counter-reset:s;
  display:flex;flex-direction:column;gap:var(--ft-unit)}
.ft-page ol.ft-cas-steps li{counter-increment:s;padding-left:calc(var(--ft-unit)*4);position:relative}
.ft-page ol.ft-cas-steps li::before{content:counter(s);position:absolute;left:0;top:1px;
  width:22px;height:22px;display:grid;place-items:center;border-radius:50%;
  background:rgba(227,6,19,.14);color:var(--red-400);font:600 .72rem var(--font-mono)}
.ft-page ol.ft-cas-steps b{display:block;font:600 .95rem/1.35 var(--font-head);color:var(--text)}
.ft-page ol.ft-cas-steps span{display:block;margin-top:2px;font-size:.9rem;line-height:1.5;color:var(--muted)}
.ft-page .ft-verdict{margin:0;border:1px solid rgba(16,185,129,.4);border-left:3px solid var(--success);
  background:rgba(16,185,129,.08);border-radius:var(--r-md);padding:calc(var(--ft-unit)*2);
  font-size:.98rem;line-height:1.5;color:var(--text)}
.ft-verdict-lbl{display:block;margin-bottom:4px;font:.66rem/1 var(--font-mono);color:var(--success);
  text-transform:uppercase;letter-spacing:.11em}
.ft-cascard-foot{display:flex;gap:var(--ft-unit);align-items:baseline;justify-content:space-between;
  margin-top:auto;padding-top:var(--ft-unit);border-top:1px solid var(--border);flex-wrap:wrap}

/* ══ Examen blanc ════════════════════════════════════════════════════════════ */
.ft-btn{font:600 .88rem var(--font-body);border-radius:var(--r-sm);padding:10px 18px;cursor:pointer;
  border:1px solid var(--border-2);background:var(--surface);color:var(--text);
  transition:border-color .15s ease,background .15s ease}
.ft-btn:hover{border-color:var(--red-500)}
.ft-btn-primary{background:var(--red-500);border-color:var(--red-500);color:#fff}
.ft-btn-primary:hover{background:var(--red-400);border-color:var(--red-400)}
.ft-btn-ghost{background:none;color:var(--muted);font-weight:400;padding:7px 13px;font-size:.8rem}
.ft-btn-ghost:hover{color:var(--text)}
.ft-btn[disabled]{opacity:.4;cursor:default;border-color:var(--border)}

.ft-ex-modes{display:grid;gap:calc(var(--ft-unit)*2);grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.ft-ex-mode{display:flex;flex-direction:column;gap:5px;align-items:flex-start;text-align:left;
  padding:calc(var(--ft-unit)*2.5);background:var(--surface);border:1px solid var(--border);
  border-radius:var(--r-lg);cursor:pointer;transition:border-color .15s ease}
.ft-ex-mode b{font:600 1.05rem var(--font-head);color:var(--text)}
.ft-ex-mode span{font-size:.88rem;line-height:1.45;color:var(--muted)}
.ft-ex-mode:hover{border-color:var(--border-2)}
.ft-ex-mode.on{border-color:var(--red-500);background:rgba(227,6,19,.07)}
.ft-ex-chapsel{margin-top:calc(var(--ft-unit)*3);display:flex;gap:var(--ft-unit);align-items:flex-start}
.ft-ex-chapsel[hidden]{display:none}
.ft-ex-chips{display:flex;flex-wrap:wrap;gap:6px}
.ft-ex-go{margin-top:calc(var(--ft-unit)*4);display:flex;flex-wrap:wrap;gap:calc(var(--ft-unit)*2);
  align-items:center}
.ft-ex-seedline{margin:0;font:.76rem var(--font-mono);color:var(--dim);display:flex;gap:var(--ft-unit);align-items:center}
.ft-ex-seedline code{color:var(--text);background:var(--surface-2);border-radius:var(--r-sm);padding:2px 8px}
.ft-ex-hint{flex-basis:100%;margin:0;font-size:.82rem;line-height:1.5;color:var(--dim);max-width:60ch}
.ft-ex-repartition{margin-top:calc(var(--ft-unit)*5);padding-top:calc(var(--ft-unit)*3);
  border-top:1px solid var(--border)}
.ft-ex-rep{list-style:none;margin:var(--ft-unit) 0 0;padding:0;display:grid;gap:var(--ft-unit);
  grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}
.ft-ex-rep li{display:flex;gap:var(--ft-unit);align-items:baseline;font-size:.86rem;color:var(--muted)}
.ft-ex-rep b{flex:none;width:28px;font:600 1rem var(--font-mono);color:var(--red-500);text-align:right}

/* Épreuve en cours : le chapeau se réduit à son titre, la question remonte. */
body.ft-ex-on .ft-doc-lede,body.ft-ex-on .ft-doc-head .ft-kicker{display:none}
body.ft-ex-on .ft-doc-head{padding-bottom:calc(var(--ft-unit)*2);margin-bottom:calc(var(--ft-unit)*3)}
body.ft-ex-on .ft-doc-head h1{margin:0;font-size:1.5rem}

.ft-ex-bar{display:flex;gap:calc(var(--ft-unit)*2);align-items:center;
  padding-bottom:calc(var(--ft-unit)*2);border-bottom:1px solid var(--border);
  margin-bottom:calc(var(--ft-unit)*4)}
.ft-ex-count{margin:0;font:.82rem var(--font-mono);color:var(--dim);flex:none}
.ft-ex-count b{font-size:1.1rem;color:var(--text)}
.ft-ex-prog{flex:1;height:4px;background:var(--surface-2);border-radius:999px;overflow:hidden}
.ft-ex-prog>span{display:block;height:100%;width:0;background:var(--red-500);transition:width .25s ease}
.ft-ex-timer{margin:0;flex:none;font:600 1.15rem var(--font-mono);color:var(--text);
  background:var(--surface-2);border-radius:var(--r-sm);padding:4px 12px;font-variant-numeric:tabular-nums}
.ft-ex-timer.urgent{color:var(--red-400);background:rgba(227,6,19,.14)}
.ft-ex-timer[hidden]{display:none}
.ft-ex-qkick{margin:0;font:.7rem/1 var(--font-mono);color:var(--red-500);
  text-transform:uppercase;letter-spacing:.11em}
.ft-ex-qt{margin:calc(var(--ft-unit)*1.5) 0 calc(var(--ft-unit)*3);
  font:600 1.5rem/1.35 var(--font-head);color:var(--text);max-width:52ch}
.ft-ex-choices{display:flex;flex-direction:column;gap:var(--ft-unit)}
.ft-ex-choice{display:flex;gap:calc(var(--ft-unit)*1.5);align-items:flex-start;text-align:left;
  padding:calc(var(--ft-unit)*2);background:var(--surface);border:1px solid var(--border);
  border-radius:var(--r-md);cursor:pointer;font:1rem/1.5 var(--font-body);color:var(--text);
  transition:border-color .15s ease,background .15s ease}
.ft-ex-choice i{flex:none;width:24px;height:24px;display:grid;place-items:center;border-radius:50%;
  background:var(--surface-2);color:var(--dim);font:600 .74rem var(--font-mono);font-style:normal}
.ft-ex-choice:hover{border-color:var(--border-2)}
.ft-ex-choice.on{border-color:var(--red-500);background:rgba(227,6,19,.08)}
.ft-ex-choice.on i{background:var(--red-500);color:#fff}
.ft-ex-nav{display:flex;gap:var(--ft-unit);justify-content:space-between;margin-top:calc(var(--ft-unit)*3)}
.ft-ex-map{display:flex;flex-wrap:wrap;gap:5px;margin-top:calc(var(--ft-unit)*5);
  padding-top:calc(var(--ft-unit)*3);border-top:1px solid var(--border)}
.ft-ex-dot{width:30px;height:30px;font:.76rem var(--font-mono);color:var(--dim);cursor:pointer;
  background:var(--surface);border:1px solid var(--border);border-radius:var(--r-sm)}
.ft-ex-dot.done{color:var(--text);background:var(--surface-2);border-color:var(--border-2)}
.ft-ex-dot.on{border-color:var(--red-500);color:var(--red-400)}

.ft-ex-score{padding:calc(var(--ft-unit)*3);border-radius:var(--r-lg);border:1px solid var(--border);
  background:var(--surface);text-align:center;margin-bottom:calc(var(--ft-unit)*4)}
.ft-ex-score.pass{border-color:rgba(16,185,129,.45);background:rgba(16,185,129,.08)}
.ft-ex-score.fail{border-color:rgba(227,6,19,.4);background:rgba(227,6,19,.07)}
.ft-ex-scorelbl{margin:0;font:.7rem/1 var(--font-mono);text-transform:uppercase;letter-spacing:.12em;color:var(--dim)}
.ft-ex-score.pass .ft-ex-scorelbl{color:var(--success)}
.ft-ex-score.fail .ft-ex-scorelbl{color:var(--red-400)}
.ft-ex-scoren{margin:var(--ft-unit) 0 0;font:600 1.2rem var(--font-mono);color:var(--muted)}
.ft-ex-scoren b{font-size:3.2rem;color:var(--text);letter-spacing:-.03em}
.ft-ex-scorepc{margin:4px 0 0;font:.82rem var(--font-mono);color:var(--dim)}
.ft-ex-bychap{margin-bottom:calc(var(--ft-unit)*5)}
.ft-ex-chaprows{display:flex;flex-direction:column;gap:5px;margin-top:var(--ft-unit)}
.ft-ex-chaprow{display:flex;gap:calc(var(--ft-unit)*2);align-items:center;text-decoration:none;
  padding:7px calc(var(--ft-unit)*1.5);border-radius:var(--r-sm);color:var(--muted)}
.ft-ex-chaprow:hover{background:var(--surface-2);color:var(--text)}
.ft-ex-chapname{flex:1;min-width:0;font-size:.88rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ft-ex-chapbar{flex:none;width:120px;height:5px;background:var(--surface-2);border-radius:999px;overflow:hidden}
.ft-ex-chapbar>i{display:block;height:100%;background:var(--success)}
.ft-ex-chaprow.weak .ft-ex-chapbar>i{background:var(--red-500)}
.ft-ex-chaprow b{flex:none;width:44px;text-align:right;font:600 .82rem var(--font-mono);color:var(--text)}
.ft-ex-rev{background:var(--surface);border:1px solid var(--border);border-left:3px solid var(--success);
  border-radius:var(--r-md);padding:calc(var(--ft-unit)*2.5);margin-top:var(--ft-unit)}
.ft-ex-rev.ko{border-left-color:var(--red-500)}
.ft-ex-revhead{display:flex;gap:var(--ft-unit);align-items:center;margin-bottom:var(--ft-unit)}
.ft-ex-revn{width:24px;height:24px;display:grid;place-items:center;border-radius:50%;
  background:var(--surface-2);color:var(--dim);font:600 .72rem var(--font-mono)}
.ft-ex-revv{font:.68rem/1 var(--font-mono);text-transform:uppercase;letter-spacing:.1em;color:var(--success)}
.ft-ex-rev.ko .ft-ex-revv{color:var(--red-400)}
.ft-ex-revq{margin:0 0 var(--ft-unit);font:600 1rem/1.4 var(--font-head);color:var(--text)}
.ft-ex-revchoices{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px}
.ft-ex-revchoices li{display:flex;gap:var(--ft-unit);align-items:flex-start;
  font-size:.92rem;line-height:1.45;color:var(--muted)}
.ft-ex-revchoices i{flex:none;width:20px;height:20px;display:grid;place-items:center;border-radius:50%;
  background:var(--surface-2);color:var(--dim);font:600 .66rem var(--font-mono);font-style:normal}
.ft-ex-revchoices li.good{color:var(--text)}
.ft-ex-revchoices li.good i{background:rgba(16,185,129,.2);color:var(--success)}
.ft-ex-revchoices li.bad i{background:rgba(227,6,19,.18);color:var(--red-400)}
.ft-ex-revex{margin:var(--ft-unit) 0 0;padding-left:calc(var(--ft-unit)*1.5);
  border-left:2px solid var(--border-2);font-size:.9rem;line-height:1.55;color:var(--muted)}
.ft-ex-revfoot{display:flex;gap:var(--ft-unit);justify-content:space-between;align-items:baseline;
  margin:calc(var(--ft-unit)*1.5) 0 0;flex-wrap:wrap}
.ft-ex-again{display:flex;gap:var(--ft-unit);margin-top:calc(var(--ft-unit)*4)}

/* ══ Arbre de décision ═══════════════════════════════════════════════════════ */
.ft-dec-print{margin:calc(var(--ft-unit)*3) 0 0}
.ft-dec-print a{text-decoration:none;display:inline-block}
/* Arbre en cours : le chapeau cède la place à la question (même logique que
   `ft-ex-on` pour l'examen) ; le lien imprimable reste, il sert en salle. */
body.ft-dec-on .ft-doc-lede{display:none}
body.ft-dec-on .ft-doc-head{padding-bottom:calc(var(--ft-unit)*2);margin-bottom:calc(var(--ft-unit)*3)}
body.ft-dec-on .ft-doc-head h1{margin:calc(var(--ft-unit)*1.5) 0 0;font-size:1.5rem}
body.ft-dec-on .ft-dec-print{margin-top:calc(var(--ft-unit)*2)}
.ft-dec-trail{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:calc(var(--ft-unit)*3);
  padding-bottom:calc(var(--ft-unit)*2);border-bottom:1px solid var(--border)}
.ft-dec-trail[hidden]{display:none}
.ft-dec-crumb{display:flex;gap:6px;align-items:center;font:.8rem var(--font-body);color:var(--muted);
  background:var(--surface);border:1px solid var(--border);border-radius:999px;padding:5px 13px 5px 5px;
  cursor:pointer;text-align:left;max-width:100%}
.ft-dec-crumb i{flex:none;width:20px;height:20px;display:grid;place-items:center;border-radius:50%;
  background:var(--surface-2);color:var(--dim);font:600 .66rem var(--font-mono);font-style:normal}
.ft-dec-crumb:hover{color:var(--text);border-color:var(--red-500)}
.ft-dec-step{margin:0;font:.7rem/1 var(--font-mono);color:var(--red-500);
  text-transform:uppercase;letter-spacing:.12em}
.ft-dec-qt{margin:calc(var(--ft-unit)*1.5) 0 0;font:600 clamp(1.5rem,2.8vw,2.1rem)/1.25 var(--font-head);
  color:var(--text);max-width:24ch;letter-spacing:-.015em}
.ft-dec-aide{margin:calc(var(--ft-unit)*2) 0 0;padding-left:calc(var(--ft-unit)*1.5);
  border-left:2px solid var(--info);font-size:.95rem;line-height:1.6;color:var(--muted);max-width:70ch}
.ft-dec-aide[hidden]{display:none}
.ft-dec-opts{display:flex;flex-direction:column;gap:var(--ft-unit);margin-top:calc(var(--ft-unit)*4)}
.ft-dec-opt{display:flex;gap:var(--ft-unit);align-items:center;justify-content:space-between;
  text-align:left;padding:calc(var(--ft-unit)*2.5) calc(var(--ft-unit)*3);background:var(--surface);
  border:1px solid var(--border);border-left:4px solid var(--border-2);border-radius:var(--r-md);
  cursor:pointer;font:1.0625rem/1.45 var(--font-body);color:var(--text);
  transition:border-color .15s ease,transform .15s ease,background .15s ease}
.ft-dec-opt i{flex:none;color:var(--dim);font-style:normal}
.ft-dec-opt:hover{border-left-color:var(--red-500);background:var(--surface-2);transform:translateX(3px)}
.ft-dec-opt:hover i{color:var(--red-500)}
.ft-dec-opt-ok{border-left-color:var(--success)}
.ft-dec-opt-declaration{border-left-color:var(--info)}
.ft-dec-opt-autorisation{border-left-color:var(--warning)}
.ft-dec-opt-interdit{border-left-color:var(--red-500)}
.ft-dec-v{padding:calc(var(--ft-unit)*4);border-radius:var(--r-lg);border:1px solid var(--border);
  border-left:5px solid var(--dim);background:var(--surface)}
.ft-dec-v[hidden],.ft-dec-q[hidden]{display:none}
.ft-dec-v.ft-verdict-ok{border-left-color:var(--success);background:rgba(16,185,129,.07)}
.ft-dec-v.ft-verdict-declaration{border-left-color:var(--info);background:rgba(63,162,208,.07)}
.ft-dec-v.ft-verdict-autorisation{border-left-color:var(--warning);background:rgba(245,158,11,.07)}
.ft-dec-v.ft-verdict-interdit{border-left-color:var(--red-500);background:rgba(227,6,19,.07)}
.ft-dec-vlbl{margin:0;font:600 .72rem/1 var(--font-mono);text-transform:uppercase;letter-spacing:.14em;
  color:var(--dim)}
.ft-verdict-ok .ft-dec-vlbl{color:var(--success)}
.ft-verdict-declaration .ft-dec-vlbl{color:var(--info)}
.ft-verdict-autorisation .ft-dec-vlbl{color:var(--warning)}
.ft-verdict-interdit .ft-dec-vlbl{color:var(--red-400)}
.ft-dec-vt{margin:calc(var(--ft-unit)*1.5) 0 0;font:600 clamp(1.4rem,2.6vw,1.9rem)/1.2 var(--font-head);
  color:var(--text);letter-spacing:-.015em}
.ft-dec-vtxt{margin:calc(var(--ft-unit)*2) 0 0;font-size:1.0625rem;line-height:1.65;color:var(--text);max-width:70ch}
.ft-dec-vregle{margin:calc(var(--ft-unit)*2) 0 0;font:.76rem/1.6 var(--font-mono);color:var(--dim);max-width:78ch}
.ft-dec-vregle[hidden]{display:none}
.ft-dec-vgo{margin:calc(var(--ft-unit)*2) 0 0}
.ft-dec-vgo a{font:.8rem var(--font-mono);color:var(--info);text-decoration:none}
.ft-dec-vgo a[hidden]{display:none}
.ft-dec-restart{display:flex;gap:var(--ft-unit);margin:calc(var(--ft-unit)*3) 0 0}
.ft-dec-restart button[hidden]{display:none}
.ft-dec-all{margin-top:calc(var(--ft-unit)*6);border-top:1px solid var(--border);padding-top:calc(var(--ft-unit)*3)}
.ft-dec-all>summary{list-style:none;cursor:pointer;font:.72rem/1 var(--font-mono);color:var(--dim);
  text-transform:uppercase;letter-spacing:.11em;display:flex;gap:var(--ft-unit);align-items:center}
.ft-dec-all>summary::-webkit-details-marker{display:none}
.ft-dec-all>summary::before{content:"▸";transition:transform .15s ease}
.ft-dec-all[open]>summary::before{transform:rotate(90deg)}
.ft-dec-all>summary i{font-style:normal;color:var(--red-500)}
.ft-dec-all>summary:hover{color:var(--text)}
.ft-dec-list{display:grid;gap:var(--ft-unit);grid-template-columns:repeat(auto-fill,minmax(300px,1fr));
  margin-top:calc(var(--ft-unit)*2)}
.ft-dec-li{background:var(--surface);border:1px solid var(--border);border-left:3px solid var(--dim);
  border-radius:var(--r-md);padding:calc(var(--ft-unit)*2)}
.ft-dec-li.ft-verdict-ok{border-left-color:var(--success)}
.ft-dec-li.ft-verdict-declaration{border-left-color:var(--info)}
.ft-dec-li.ft-verdict-autorisation{border-left-color:var(--warning)}
.ft-dec-li.ft-verdict-interdit{border-left-color:var(--red-500)}
.ft-dec-libadge{margin:0;font:600 .64rem/1 var(--font-mono);text-transform:uppercase;letter-spacing:.12em;
  color:var(--dim)}
.ft-verdict-ok .ft-dec-libadge{color:var(--success)}
.ft-verdict-declaration .ft-dec-libadge{color:var(--info)}
.ft-verdict-autorisation .ft-dec-libadge{color:var(--warning)}
.ft-verdict-interdit .ft-dec-libadge{color:var(--red-400)}
.ft-dec-li h3{margin:6px 0 0;font:600 1rem/1.3 var(--font-head);color:var(--text)}
.ft-dec-li p{margin:5px 0 0;font-size:.88rem;line-height:1.5;color:var(--muted)}

/* ══ Pied ════════════════════════════════════════════════════════════════════ */
.ft-foot{display:flex;flex-wrap:wrap;gap:9px;align-items:center;padding:calc(var(--ft-unit)*3);
  border-top:1px solid var(--border);font:.72rem var(--font-mono);color:var(--dim)}
body.ft-chapitre .ft-foot{display:none}

/* ══ Projection ══════════════════════════════════════════════════════════════ */
:root.diffusion,body.diffusion{--ft-body:1.75rem}
body.diffusion .ft-bar,body.diffusion .ft-tabs,body.diffusion .ft-plan,
body.diffusion details.notes,body.diffusion .ft-sources,body.diffusion .ft-foot{display:none}
body.diffusion .ft-layout{grid-template-columns:minmax(0,1fr);min-height:100vh}
body.diffusion .screen{min-height:100vh;padding:calc(var(--ft-unit)*5) 5vw;font-size:1.75rem}
body.diffusion .ft-h2{font-size:3.25rem}
body.diffusion ul.ft-points li{font-size:1.875rem;line-height:1.4}
body.diffusion .ft-prose{font-size:1.5rem;max-width:48ch}
body.diffusion .retenir-p{font-size:1.625rem}
body.diffusion .ft-stage{grid-template-columns:minmax(0,62fr) minmax(0,38fr);align-items:center}
body.diffusion .ft-fig-frame{max-height:72vh}
body.diffusion .ft-fig-frame img,body.diffusion .ft-svg svg{max-height:72vh}
body.diffusion ol.ft-legend{font-size:1.1rem}
body.diffusion .ft-kpi b{font-size:5rem}
body.diffusion .ft-kpi b[data-len="moyen"]{font-size:3.4rem}
body.diffusion .ft-kpi b[data-len="long"]{font-size:2.6rem}
body.diffusion .ft-kpi span{font-size:1.3rem}
body.diffusion table.comparatif{font-size:1.5rem}
body.diffusion .ft-diff-count{display:block;position:fixed;right:calc(var(--ft-unit)*3);
  bottom:calc(var(--ft-unit)*2);margin:0;font:.95rem var(--font-mono);color:var(--dim)}
body.diffusion .ft-fig-full,body.diffusion details.machine{display:none}

/* ══ Adaptations ═════════════════════════════════════════════════════════════ */
@media (max-width:1100px){
  .ft-layout,body.plan-off .ft-layout{grid-template-columns:minmax(0,1fr)}
  .ft-plan{position:fixed;top:calc(var(--ft-bar) + var(--ft-tabs));left:0;width:var(--ft-plan);z-index:36;
    box-shadow:8px 0 24px rgba(0,10,18,.3)}
  body:not(.plan-on) .ft-plan{opacity:0;pointer-events:none;transform:translateX(-12px)}
  body.plan-on .ft-plan{opacity:1;pointer-events:auto;transform:none}
}
@media (max-width:900px){
  .ft-stage{grid-template-columns:minmax(0,1fr);align-items:stretch}
  .ft-fig{order:-1}
  .ft-fig-frame,.ft-fig-frame img,.ft-svg svg{max-height:42vh}
  .ft-h2{font-size:1.9rem}
  ul.ft-points li{font-size:1.0625rem}
  .screen{min-height:0;justify-content:flex-start;
    padding:calc(var(--ft-unit)*3) calc(var(--ft-unit)*2.5) calc(var(--ft-unit)*6)}
  .ft-title{display:none}
  ol.ft-legend{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));font-size:.78rem}
}
@media (max-width:860px){
  .ft-div-body,.ft-fiche-grid{grid-template-columns:minmax(0,1fr);gap:calc(var(--ft-unit)*2)}
  .ft-cas-grid{grid-template-columns:minmax(0,1fr)}
  .ft-doc{padding:calc(var(--ft-unit)*4) calc(var(--ft-unit)*2) calc(var(--ft-unit)*8)}
  .ft-filter-lbl{width:100%}
  .ft-filter-count{margin-left:0}
  .ft-fiche-head{flex-wrap:wrap}
  .ft-ex-bar{flex-wrap:wrap}
  .ft-ex-prog{order:3;flex-basis:100%}
}

@media print{
  .ft-bar,.ft-tabs,.ft-plan,.ft-progress,.ft-fig-full{display:none}
  .ft-layout{grid-template-columns:minmax(0,1fr)}
  .screen{display:flex!important;min-height:auto;break-after:page;padding:0 0 24px}
  .screen[hidden]{display:flex!important}
  /* Pages transverses : les filtres et les boutons n'ont pas de sens sur papier ;
     une fiche de synthèse tient sur sa page A4. */
  .ft-filters,.ft-search,.ft-alpha,.ft-doc-stats,.ft-btn,.ft-ex-map,.ft-dec-print,
  .ft-ex-start,.ft-ex-run,.ft-dec-restart,.ft-comp-go,.ft-div-go,.ft-fiche-go{display:none}
  .ft-doc{max-width:none;padding:0}
  /* Une fiche commence toujours sur une page neuve. Elle n'est pas forcée à tenir
     sur une seule : le chapitre 11 en a trop (47 écrans) et couper son contenu
     serait pire qu'une deuxième feuille. Typographie resserrée pour que la
     plupart des chapitres tiennent malgré tout sur une A4. */
  .ft-fiche{break-after:page;border:0;padding:0;margin:0 0 8mm}
  .ft-fiche-grid{gap:8mm}
  .ft-fiche-head{margin-bottom:5mm;padding-bottom:3mm}
  .ft-fiche-num{font-size:1.8rem}
  .ft-fiche-t{font-size:1.1rem}
  .ft-fiche-col{gap:5mm}
  .ft-fiche-ul li,.ft-fiche-ret li{font-size:.8rem;line-height:1.35}
  .ft-fiche-kpi b{font-size:.95rem}
  .ft-fiche-sec{break-inside:avoid}
  .ft-div,.ft-cascard,.ft-comp,.ft-frisebloc{break-inside:avoid}
  .ft-cas-det:not([open])>summary+*{display:block}
  .ft-dec-all{display:block}
  .ft-dec-all>summary{display:none}
}