/* Mise en page : un plan de l'édifice à gauche, qu'on lit de bas en haut comme une
   coupe de bâtiment ; la fiche du nœud choisi à droite, composée comme une page de cours. */
:root {
  --papier: #f4f5f7;
  --surface: #ffffff;
  --encre: #1b1e24;
  --encre-2: #4f5561;
  --encre-3: #686e79;   /* 9 nov. 2026 : #858b96 → #686e79, contraste AA (4,7 sur le papier) */
  --filet: #d8dbe1;
  --trame: #e3e6eb;
  --rouge: #b0001a;
  --rouge-fond: #fbeef0;
  --noeud: #ffffff;
  --arete: #a1a6af;
  --arete-vive: #1b1e24;
  --choix: #8a6400;
  --choix-fond: #fdf5dc;
  --corrige-fond: #eef6f1;
  --corrige-filet: #2b7550;
  --revoir: #9a5800; --revoir-fond: #fbf0e0;   /* « à revoir » des exercices (§63) */
  --c-fond: #666b74;
  --c-ord: #6a7d00;
  --c-alg: #d26d00;
  --c-top: #c0007a;
  --c-nb: #0070c0;     /* nombres et arithmétique */
  --c-ana: #00866b;    /* analyse */
  --c-geo: #8a45ab;    /* géométrie */
  --c-mix: #2f343c;    /* théorie mixte : contour dégradé entre ses sources */
  --c-neutre: #2f343c; /* chapitres des graphes intérieurs */
  --c-axiome: #c00000;
  --ombre: 0 1px 2px rgba(27, 30, 36, .08), 0 4px 14px rgba(27, 30, 36, .08);

  --f-titre: "Spectral", "Iowan Old Style", "Palatino Linotype", Georgia, serif;
  --f-texte: "Spectral", "Iowan Old Style", "Palatino Linotype", Georgia, serif;
  --f-ui: "IBM Plex Sans", "Segoe UI", system-ui, sans-serif;
  --f-mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --papier: #121418; --surface: #191c22; --encre: #e7e9ed; --encre-2: #aeb4be; --encre-3: #90979f;
    --filet: #2b2f37; --trame: #1f2329; --rouge: #ff6d7d; --rouge-fond: #351a1f; --noeud: #1d2027;
    --arete: #5b616b; --arete-vive: #e7e9ed; --choix: #e6c15c; --choix-fond: #2c2512; --corrige-fond: #17251e; --corrige-filet: #5cbf8a; --revoir: #e8a352; --revoir-fond: #2b2115;
    --c-fond: #a3a8b1; --c-ord: #b6ca4c; --c-alg: #ffa24a; --c-top: #ff62bd; --c-mix: #c9ced6;
    --c-nb: #55aaff; --c-ana: #35caa4; --c-geo: #c793e6; --c-neutre: #c9ced6; --c-axiome: #ff6b6b;
    --ombre: 0 1px 2px rgba(0, 0, 0, .4), 0 6px 18px rgba(0, 0, 0, .35);
    color-scheme: dark;
  }
}
:root[data-theme="light"] { color-scheme: light; }
:root[data-theme="dark"] {
  --papier: #121418; --surface: #191c22; --encre: #e7e9ed; --encre-2: #aeb4be; --encre-3: #90979f;
  --filet: #2b2f37; --trame: #1f2329; --rouge: #ff6d7d; --rouge-fond: #351a1f; --noeud: #1d2027;
  --arete: #5b616b; --arete-vive: #e7e9ed; --choix: #e6c15c; --choix-fond: #2c2512; --corrige-fond: #17251e; --corrige-filet: #5cbf8a; --revoir: #e8a352; --revoir-fond: #2b2115;
  --c-fond: #a3a8b1; --c-ord: #b6ca4c; --c-alg: #ffa24a; --c-top: #ff62bd; --c-mix: #c9ced6;
  --c-nb: #55aaff; --c-ana: #35caa4; --c-geo: #c793e6; --c-neutre: #c9ced6; --c-axiome: #ff6b6b;
  --ombre: 0 1px 2px rgba(0, 0, 0, .4), 0 6px 18px rgba(0, 0, 0, .35);
  color-scheme: dark;
}

html, body { height: 100%; }
body {
  background: var(--papier); color: var(--encre);
  font-family: var(--f-ui); font-size: 15px; line-height: 1.5;
}
body::before {
  content: ""; position: fixed; inset: 0 0 auto; height: env(safe-area-inset-top, 0px);
  z-index: 10; background: var(--surface);
}
button { font: inherit; color: inherit; }
:focus-visible { outline: 2px solid var(--rouge); outline-offset: 2px; }

.app { display: grid; grid-template-rows: auto minmax(0, 1fr); height: 100%; }

/* ---------------------------------------------------------------- en-tête */
.entete {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px 20px;
  padding-block: 10px;
  padding-left: max(16px, env(safe-area-inset-left, 0px));
  padding-right: max(16px, env(safe-area-inset-right, 0px));
  background: var(--surface); border-bottom: 1px solid var(--filet);
  position: relative; z-index: 5;
}
.marque {
  font-family: var(--f-titre); font-weight: 600; font-size: 19px; letter-spacing: .14em;
  margin: 0; white-space: nowrap; display: inline-flex; align-items: center; gap: 10px;
}
.marque-logo { flex: none; display: block; }
.fil { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; margin: 0; padding: 0; list-style: none; min-width: 0; flex: 1; }
.fil li { display: flex; align-items: center; gap: 4px; font-size: 14px; color: var(--encre-2); white-space: nowrap; }
.fil li + li::before { content: "›"; color: var(--encre-3); }
.fil button {
  border: 0; background: none; padding: 2px 6px; border-radius: 4px; cursor: pointer; color: var(--encre-2);
}
.fil button:hover { background: var(--trame); color: var(--encre); }
.fil li:last-child button { color: var(--encre); font-weight: 600; cursor: default; }
.fil li:last-child button:hover { background: none; }
.fil li:last-child button.rappel { cursor: pointer; text-decoration: underline dotted var(--encre-3); text-underline-offset: 4px; }
.fil li:last-child button.rappel:hover { background: var(--trame); }

.legende { position: relative; }
.bouton-theme {
  margin-left: auto; margin-right: -16px; flex: none; display: grid; place-items: center;
  width: 30px; height: 30px; padding: 0; border: 0; border-radius: 8px; background: none; cursor: pointer;
}
.bouton-theme svg { display: block; transition: transform .2s ease; }
.bouton-theme:hover svg { transform: rotate(-12deg) scale(1.06); }
.bouton-theme:focus-visible { outline: 2px solid var(--encre-3); outline-offset: 2px; }
.bouton-theme .icone-lune { display: none; }
.bouton-theme.clair .icone-soleil { display: none; }
.bouton-theme.clair .icone-lune { display: block; }
.partager {
  margin-left: 0; cursor: pointer; font-size: 13px; color: var(--encre-2); background: none;
  border: 1px solid var(--filet); border-radius: 999px; padding: 3px 12px;
}
.partager:hover { color: var(--encre); border-color: var(--encre-3); }
.partager.copie { color: var(--c-ana); border-color: var(--c-ana); }
body.en-rubrique .bouton-theme { margin-left: auto; }
.signaler {
  flex: none; display: grid; place-items: center; width: 30px; height: 30px; padding: 0; margin-left: 0;
  border: 0; border-radius: 8px; background: none; color: var(--encre-2); cursor: pointer;   /* même gris que la loupe */
}
.signaler:hover, .signaler[aria-expanded="true"] { color: var(--encre); background: var(--trame); }
.signaler:focus-visible { outline: 2px solid var(--encre-3); outline-offset: 2px; }
.apropos-repli details { border-top: 1px solid var(--filet); }
.apropos-repli summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 10px; padding: 12px 0 4px; }
.apropos-repli summary::-webkit-details-marker { display: none; }
.apropos-repli summary h3 { margin: 0; font-size: 17px; font-family: var(--f-titre); font-weight: 600; color: var(--encre-2); }
.apropos-repli summary::before { content: ""; flex: none; width: 7px; height: 7px; border-right: 1.6px solid var(--encre-3); border-bottom: 1.6px solid var(--encre-3); transform: rotate(-45deg); transition: transform .15s; margin-left: 2px; }
.apropos-repli details[open] summary::before { transform: rotate(45deg); }
.apropos-repli summary:hover h3 { color: var(--encre); }
.apropos-repli summary:focus-visible { outline: 2px solid var(--encre-3); outline-offset: 2px; border-radius: 4px; }
.texte-auteur .apropos-repli .corps-texte { font-size: 14px; line-height: 1.6; color: var(--encre-2); padding-top: 6px; }
.apropos-repli .corps-texte p { margin: 0 0 8px; }
section[id^="apropos-"] .corps-texte a { color: var(--encre); text-decoration: underline; text-decoration-color: var(--encre-3); text-underline-offset: 3px; }
section[id^="apropos-"] .corps-texte a:hover { text-decoration-color: var(--encre); }
/* Impression des fiches de l'édifice (domaine À propos – apparence) : bouton à côté du drapeau, menu,
   et feuille d'impression #impression, seule visible à l'impression. Couleurs du thème clair, toujours. */
.imp-elt { display: inline-grid; place-items: center; width: 26px; height: 26px; padding: 0; margin-left: 0; vertical-align: middle; border: 0; border-radius: 6px; background: none; color: var(--encre-3); cursor: pointer; opacity: .55; transition: opacity .15s; position: relative; top: -2px; }
.imp-elt:hover, .imp-elt:focus-visible, .imp-elt[aria-expanded="true"] { opacity: 1; color: var(--encre); background: var(--trame); }
.imp-elt:focus-visible { outline: 2px solid var(--encre-3); outline-offset: 1px; }
@media (hover: none) { .imp-elt { opacity: .8; } }
.imp-menu { position: fixed; z-index: 40; width: 290px; background: var(--surface); border: 1px solid var(--filet); border-radius: 10px; box-shadow: 0 10px 30px rgb(0 0 0 / .16); padding: 6px; font: 14px/1.4 var(--f-ui); color: var(--encre); }
.imp-menu[hidden] { display: none; }
.imp-menu .imp-t { font-size: 11.5px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--encre-3); padding: 6px 10px 4px; }
.imp-menu button { display: block; width: 100%; text-align: left; border: 0; background: none; padding: 7px 10px; border-radius: 6px; font: inherit; color: inherit; cursor: pointer; }
.imp-menu button:hover, .imp-menu button:focus-visible { background: var(--trame); outline: none; }
.imp-menu button small { display: block; color: var(--encre-3); font-size: 12.5px; }
.imp-menu label { display: flex; align-items: center; gap: 8px; padding: 8px 10px 6px; border-top: 1px solid var(--filet); margin-top: 4px; font-size: 13px; color: var(--encre-2); cursor: pointer; }
.imp-menu .imp-attente { padding: 8px 10px; font-size: 13px; color: var(--encre-2); }
@media (max-width: 560px) { .imp-menu { left: 0 !important; right: 0; top: auto !important; bottom: 0; width: auto; border-radius: 14px 14px 0 0; padding: 8px 8px max(12px, env(safe-area-inset-bottom)); font-size: 15px; } .imp-menu button { padding: 11px 12px; } }
#impression { display: none; }
@media print {
  :root, :root[data-theme] { color-scheme: light !important; }
  html, body { height: auto !important; overflow: visible !important; background: #fff !important; }
  #impression { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  body.imprime > *:not(#impression) { display: none !important; }
  body.imprime #impression { display: block !important; }
  .retour-edifice { display: none !important; }   /* impression native (Ctrl+P) : pas de bouton de retour sur la page */
  .retour-lex { display: none !important; }
}
#impression { --papier: #f4f5f7; --surface: #ffffff; --encre: #1b1e24; --encre-2: #4f5561; --encre-3: #686e79; --filet: #d8dbe1; --trame: #e3e6eb; --rouge: #b0001a; --rouge-fond: #fbeef0; --noeud: #ffffff; --arete: #a1a6af; --arete-vive: #1b1e24; --choix: #8a6400; --choix-fond: #fdf5dc; --corrige-fond: #eef6f1; --corrige-filet: #2b7550; --c-fond: #666b74; --c-ord: #6a7d00; --c-alg: #d26d00; --c-top: #c0007a; --c-nb: #0070c0;      --c-ana: #00866b;     --c-geo: #8a45ab;     --c-mix: #2f343c;     --c-neutre: #2f343c;  --c-axiome: #c00000; color: var(--encre); background: #fff; font-family: var(--f-texte); font-size: 10.5pt; line-height: 1.5; }
#impression a, #impression .lien-noeud, #impression .terme { color: inherit; text-decoration: none; border: 0; background: none; font: inherit; padding: 0; }
#impression .ip-couv { border-top: 3px solid var(--c-nb); padding-top: 10mm; margin-bottom: 6mm; }
#impression .ip-sur { font: 600 9pt var(--f-ui); letter-spacing: .12em; text-transform: uppercase; color: #6b717c; }
#impression .ip-couv h1 { font-family: var(--f-titre); font-size: 28pt; font-weight: 600; margin: 3mm 0 2mm; line-height: 1.1; }
#impression .ip-couv p { margin: 0; color: var(--encre-2); }
#impression .ip-adr { font: 9pt var(--f-ui); color: var(--c-nb); margin-top: 3mm; }
#impression ol.ip-somm { list-style: none; counter-reset: s; padding: 0; margin: 6mm 0 0; border-top: 1px solid var(--filet); }
#impression ol.ip-somm li { counter-increment: s; display: flex; gap: 4mm; padding: 1.5mm 0; border-bottom: 1px solid #eceef1; }
#impression ol.ip-somm li::before { content: counter(s); font: 600 9pt var(--f-ui); color: var(--encre-3); width: 6mm; }
#impression ol.ip-somm li span { flex: 1; } #impression ol.ip-somm i { font: normal 8.5pt var(--f-ui); color: var(--encre-3); }
#impression .ip-fiche { position: relative; border-top: 1.5px solid var(--encre); padding-top: 4mm; margin-top: 9mm; }
#impression.ip-seule .ip-fiche:first-child { border-top: 0; margin-top: 0; padding-top: 0; }
#impression .ip-couv + .ip-fiche { break-before: page; border-top: 0; margin-top: 0; }
#impression .ip-num { position: absolute; right: 0; top: 4mm; font: 600 9pt var(--f-ui); color: #b4b9c1; }
#impression .ip-nat { font: 600 8.5pt var(--f-ui); letter-spacing: .1em; text-transform: uppercase; color: var(--encre-2); }
#impression .ip-definition .ip-nat, #impression .ip-axiome .ip-nat { color: var(--rouge); }
#impression h2 { font-family: var(--f-titre); font-size: 17pt; font-weight: 600; margin: 1mm 0 2.5mm; line-height: 1.2; }
#impression .ip-nat, #impression h2, #impression .ip-liens, #impression .ip-et { break-after: avoid; }
#impression .ip-liens { font: 8.5pt/1.45 var(--f-ui); color: #5b616c; margin: 0 0 3mm; }
#impression .ip-liens b { font-weight: 600; color: var(--encre-2); margin-right: 1.5mm; }
#impression .ip-fiche > .ip-liens:last-child { break-before: avoid; }
#impression p { margin: 0 0 2mm; orphans: 2; widows: 2; }
#impression .ip-et { display: block; font: 600 8pt var(--f-ui); letter-spacing: .1em; text-transform: uppercase; color: #6b717c; margin-bottom: 1.5mm; }
#impression .enonce { border-left: 4px double var(--encre); padding: 2.5mm 3mm 1mm 4mm; margin: 3mm 0; break-inside: avoid; background: #f6f7f9; }
#impression .ip-definition .enonce, #impression .ip-axiome .enonce { border-left: 3px solid var(--rouge); background: var(--rouge-fond); }
#impression .enonce > .tete { display: block; font: 600 8pt var(--f-ui); letter-spacing: .1em; text-transform: uppercase; color: #6b717c; margin-bottom: 1.5mm; }
#impression .choix, #impression .admis { border-left: 3px solid var(--choix); background: var(--choix-fond); padding: 2mm 3mm; margin: 3mm 0; break-inside: avoid; font-size: 10pt; }
#impression .choix .tete, #impression .admis .tete { display: block; font: 600 8pt var(--f-ui); letter-spacing: .08em; text-transform: uppercase; margin-bottom: 1mm; }
#impression .ip-preuve { margin: 4mm 0; font-size: 10pt; }
#impression .cqfd { display: block; text-align: right; margin-top: -5mm; }
#impression .ip-rq { margin-top: 4mm; border-top: 1px solid var(--filet); padding-top: 3mm; font-size: 10pt; }
#impression .ip-r { break-inside: avoid; margin-bottom: 2mm; }
#impression .ip-r:has(figure) { break-inside: auto; }   /* une remarque illustrée peut se couper : sinon elle laisse une page à moitié vide */
#impression .katex { font-size: 1.06em; } #impression .katex-display { margin: 2mm 0; }
#impression figure.schema { break-inside: avoid; }
#impression .ip-pied { margin-top: 10mm; padding-top: 2mm; border-top: 1px solid var(--filet); font: 8pt var(--f-ui); color: var(--encre-3); }
/* Projection d'un exercice en classe (domaine À propos – apparence) : bouton à côté du drapeau, écran plein. */
.pj-elt { display: inline-grid; place-items: center; width: 26px; height: 26px; padding: 0; margin-left: -8px; vertical-align: middle; border: 0; border-radius: 6px; background: none; color: var(--encre-3); cursor: pointer; opacity: .55; transition: opacity .15s; }
.pj-elt:hover, .pj-elt:focus-visible { opacity: 1; color: var(--encre); background: var(--trame); }
.pj-elt:focus-visible { outline: 2px solid var(--encre-3); outline-offset: 1px; }
/* Partager un exercice : lien vers sa feuille, ouverte sur lui (#exercices/feuille/<feuille>/<exercice>) */
.partage-exo { display: inline-flex; align-items: center; gap: 4px; height: 26px; padding: 0 5px; margin-left: -6px; vertical-align: middle; border: 0; border-radius: 6px; background: none; color: var(--encre-3); font: inherit; font-size: 12px; cursor: pointer; opacity: .55; transition: opacity .15s; }
.partage-exo svg { width: 16px; height: 16px; flex: none; }
.partage-exo:hover, .partage-exo:focus-visible, .partage-exo.copie { opacity: 1; color: var(--encre); background: var(--trame); }
.partage-exo.copie { color: var(--c-ana); }
.partage-exo:focus-visible { outline: 2px solid var(--encre-3); outline-offset: 1px; }
.exo.exo-vise { box-shadow: 0 0 0 2px var(--c-ana); transition: box-shadow .6s; }
@media (max-width: 760px) { .pj-elt { display: none; } }
.pj { --papier: #f4f5f7; --surface: #fff; --encre: #1b1e24; --encre-2: #4f5561; --encre-3: #686e79; --filet: #d8dbe1; --trame: #e3e6eb; --corrige-fond: #eef6f1; --corrige-filet: #2b7550;
  --sy-vd: #5b2a78; --sy-vm: #8a45ab; --sy-vl: #dcc6ea; --pj-v: #8a45ab; --pj-passe: .38; --pj-ombre: 0 1px 2px rgba(27,30,36,.06), 0 6px 20px rgba(27,30,36,.06);
  position: fixed; inset: 0; z-index: 70; background: var(--papier); color: var(--encre); display: flex; flex-direction: column; font-family: var(--f-ui); color-scheme: light; }
.pj.sombre { --papier: #121418; --surface: #191c22; --encre: #e7e9ed; --encre-2: #aeb4be; --encre-3: #90979f; --filet: #2b2f37; --trame: #262a31; --corrige-fond: #17251e; --corrige-filet: #5cbf8a;
  --sy-vd: #ead6f6; --sy-vm: #c793e6; --sy-vl: #56366c; --pj-v: #c793e6; --pj-passe: .5; --pj-ombre: 0 1px 2px rgba(0,0,0,.4), 0 6px 18px rgba(0,0,0,.35); color-scheme: dark; }
.pj[hidden] { display: none; }
.pj-haut { display: flex; align-items: center; gap: 12px; padding: 14px 36px; background: var(--surface); border-bottom: 1px solid var(--filet); font-size: 15px; color: var(--encre-2); }
.pj-haut svg.sym { width: 22px; height: 22px; } .pj-haut b { color: var(--encre); font-weight: 600; } .pj-haut .pj-sp { flex: 1; }
.pj-etapes { display: flex; gap: 6px; } .pj-etapes i { width: 26px; height: 5px; border-radius: 3px; background: var(--trame); } .pj-etapes i.f { background: var(--encre-2); } .pj-etapes i.c { background: var(--pj-v); }
.pj-scene { flex: 1; min-height: 0; display: flex; justify-content: center; align-items: flex-start; gap: 32px; padding: 32px 40px 16px; }
.pj-carte { position: relative; background: var(--surface); border: 1px solid var(--filet); border-radius: 12px; padding: 30px 40px 26px; box-shadow: var(--pj-ombre); max-height: 100%; overflow-y: auto; box-sizing: border-box; scrollbar-width: thin; }
.pj-carte::before { content: ""; position: sticky; display: block; top: -30px; margin: -30px -40px 25px; height: 5px; background: var(--pj-v); }
.pj-seule { width: min(1240px, 100%); }
.pj-g { width: 38%; padding: 24px 30px 18px; } .pj-g::before { top: -24px; margin: -24px -30px 19px; }
.pj-d { width: 62%; padding: 24px 34px 18px; } .pj-d::before { top: -24px; margin: -24px -34px 19px; }
.pj-tete { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.pj-tete svg.sym { width: 40px; height: 40px; }
.pj-tete h1 { margin: 0; font-family: var(--f-titre); font-size: clamp(30px, 2.4vw, 46px); line-height: 1.1; font-weight: 600; color: var(--encre); }
.pj-g .pj-tete svg.sym { width: 26px; height: 26px; } .pj-g .pj-tete h1 { font-size: clamp(20px, 1.5vw, 28px); }
.pj .difficulte { gap: 5px; } .pj .difficulte i { width: 24px; height: 9px; border-radius: 3px; } .pj-g .difficulte i { width: 15px; height: 6px; }
.pj .etiquette-type { font-size: 17px; border-radius: 5px; padding: 2px 10px; } .pj-g .etiquette-type { font-size: 12.5px; padding: 1px 7px; }
.pj-meta { font-size: clamp(15px, 1vw, 19px); color: var(--encre-2); margin: 10px 0 22px; } .pj-g .pj-meta { font-size: 13.5px; margin: 6px 0 14px; }
.pj-enonce { font-family: var(--f-texte); font-size: clamp(22px, 1.62vw, 31px); line-height: 1.5; }
.pj-g .pj-enonce { font-size: clamp(15px, 1.05vw, 20px); color: var(--encre-2); }
.pj-enonce p, .pj-corr p { margin: 0 0 .55em; }
.pj-onglet { display: inline-block; font-size: 17px; font-weight: 600; padding: 7px 16px; border-radius: 8px 8px 0 0; background: var(--corrige-fond); color: var(--corrige-filet); border: 1px solid color-mix(in srgb, var(--corrige-filet) 35%, transparent); border-bottom-color: transparent; }
.pj-onglet::before { content: "− "; font-family: var(--f-mono); }
.pj-corr { font-family: var(--f-texte); font-size: clamp(20px, 1.5vw, 29px); line-height: 1.5; background: var(--corrige-fond); border-left: 4px solid var(--corrige-filet); border-radius: 0 8px 8px 8px; padding: 20px 28px 8px; }
.pj-bloc { transition: opacity .25s; } .pj-bloc.passe { opacity: var(--pj-passe); }
.pj-ind { margin-top: 14px; font-size: 16px; color: var(--encre-3); }
.pj-bas { display: flex; align-items: center; gap: 10px; padding: 12px 36px 18px; font-size: 14px; color: var(--encre-3); }
.pj-bas button { font: inherit; border: 1px solid var(--filet); background: var(--surface); border-radius: 8px; padding: 8px 14px; color: var(--encre); cursor: pointer; }
.pj-bas button:hover { border-color: var(--encre-3); } .pj-bas button:disabled { opacity: .45; cursor: default; }
.pj-bas kbd { font: inherit; border: 1px solid var(--filet); background: var(--surface); border-radius: 5px; padding: 1px 6px; font-size: 12.5px; } .pj-bas .pj-sp { flex: 1; }
.pj .katex { font-size: 1.06em; }
.pj a, .pj .terme, .pj .lien-noeud { color: inherit; pointer-events: none; text-decoration: none; border: 0; background: none; font: inherit; padding: 0; }
/* Cours : ligne en dégradé des familles du chapitre et symbole sous le numéro (domaine À propos – apparence). */
.chapitres li { position: relative; }
.chapitres li::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--bande-ch, transparent); pointer-events: none; }
.chapitre .num { display: flex; flex-direction: column; align-items: center; gap: 8px; }
.chapitre .num svg.sc { width: 40px; height: 40px; flex: none; }
svg.sc .f1 { fill: var(--c); } svg.sc .f2 { fill: var(--c); fill-opacity: .55; } svg.sc .f3 { fill: var(--c); fill-opacity: .2; }
svg.sc .t { fill: none; stroke: var(--c); stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; stroke-opacity: .8; }
svg.sc .t3 { fill: none; stroke: var(--c); stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.kx { visibility: hidden; font-family: var(--f-mono); font-size: .9em; }   /* en attente de composition */
.kx-erreur, .sans-katex .kx { visibility: visible; font-family: var(--f-mono); font-size: .9em; }
/* Visionneuse de PDF de l'application installée (domaine À propos – apparence) */
.vp { position: fixed; inset: 0; z-index: 80; display: flex; flex-direction: column; background: var(--papier); }
.vp[hidden] { display: none; }
html.vp-ouverte, html.vp-ouverte body { overflow: hidden; }
.vp-barre { display: flex; align-items: center; gap: 10px; padding: max(8px, env(safe-area-inset-top)) 12px 8px; background: var(--surface); border-bottom: 1px solid var(--filet); font: 14px var(--f-ui); color: var(--encre-2); }
.vp-barre button, .vp-barre a { flex: none; font: inherit; color: var(--encre); background: none; border: 1px solid var(--filet); border-radius: 8px; padding: 7px 11px; text-decoration: none; cursor: pointer; }
.vp-barre .vp-retour { font-weight: 600; border-color: var(--encre-3); }
.vp-titre { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vp-num { flex: none; font-variant-numeric: tabular-nums; } .vp-num b { font-weight: 600; color: var(--encre); } .vp-num i { font-style: normal; }
.vp-pages { flex: 1; overflow-y: auto; -webkit-overflow-scrolling: touch; padding: 8px 8px max(16px, env(safe-area-inset-bottom)); display: flex; flex-direction: column; align-items: center; gap: 8px; }
.vp-pages canvas { max-width: 100%; height: auto; background: #fff; box-shadow: 0 1px 3px rgb(0 0 0 / .2); }
.vp-attente { margin: 40px 16px; font: 15px var(--f-ui); color: var(--encre-2); text-align: center; }
@media (max-width: 480px) { .vp-titre { display: none; } }
/* Cours : « Ce que ce chapitre définit » (domaine À propos – apparence) */
.defs-ch { display: flex; flex-wrap: wrap; gap: 6px; }
.def-ch { font: 13.5px/1.3 var(--f-texte); color: var(--encre); background: var(--surface); border: 1px solid var(--filet); border-radius: 6px; padding: 4px 8px; cursor: pointer; text-align: left; }
.def-ch span { font: 11px var(--f-ui); color: var(--encre-3); margin-left: 6px; }
.def-ch:hover { border-color: var(--encre-3); }
.def-ch:focus-visible { outline: 2px solid var(--encre-3); outline-offset: 1px; }
.defs-plus { margin-top: 8px; } .defs-plus summary { cursor: pointer; font: 13px var(--f-ui); color: var(--encre-2); margin-bottom: 6px; }
.puce-cours { display: inline-block; margin: 2px 4px 2px 0; font: 12.5px var(--f-ui); color: var(--encre); text-decoration: none; border: 1px solid var(--filet); border-left: 3px solid var(--r-cours, #00866b); border-radius: 0 6px 6px 0; padding: 2px 8px; }
.puce-cours:hover { border-color: var(--encre-3); }
.bulle-cours { font: 12.5px/1.45 var(--f-ui); color: var(--encre-2); margin: 6px 0 0; padding-top: 6px; border-top: 1px dashed var(--filet); }
/* Index alphabétique (domaine À propos – apparence) */
.ix-outils { position: sticky; top: 0; z-index: 3; background: var(--papier); padding: 10px 0 8px; display: flex; flex-direction: column; gap: 8px; border-bottom: 1px solid var(--filet); }
.ix-outils input { font: 15px var(--f-ui); padding: 8px 12px; border: 1px solid var(--filet); border-radius: 8px; background: var(--surface); color: var(--encre); max-width: 420px; }
.ix-lettres { display: flex; flex-wrap: wrap; gap: 2px; }
.ix-lettres a { font: 600 13px var(--f-ui); color: var(--encre-2); text-decoration: none; padding: 3px 7px; border-radius: 5px; }
.ix-lettres a:hover { background: var(--trame); color: var(--encre); }
.ix-corps { columns: 2 380px; column-gap: 40px; margin-top: 12px; }
.ix-lettre { break-inside: avoid-column; }
.ix-lettre h3 { font-family: var(--f-titre); font-size: 26px; margin: 18px 0 6px; color: var(--encre); break-after: avoid; scroll-margin-top: 110px; }
.ix-lettre ul { list-style: none; margin: 0; padding: 0; }
.ix-lettre li { break-inside: avoid; padding: 3px 0; font-size: 15px; line-height: 1.5; }
.ix-terme { font-family: var(--f-texte); color: var(--encre); margin-right: 4px; }
.ix-lex, .ix-cours { font: 12px var(--f-ui); text-decoration: none; color: var(--encre-2); border: 1px solid var(--filet); border-radius: 5px; padding: 1px 6px; white-space: nowrap; display: inline-block; margin: 1px 0; }
.ix-lex { border-left: 3px solid var(--r-edifice); } .ix-cours { border-left: 3px solid var(--r-cours); }
.ix-lex:hover, .ix-cours:hover { color: var(--encre); border-color: var(--encre-3); }
.ix-vide { color: var(--encre-2); }
/* « Reprendre où j'en étais » (domaine À propos – apparence) */
.acc-reprise { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; margin: 18px 0 4px; }
.ar-tete { font: 600 11.5px var(--f-ui); letter-spacing: .1em; text-transform: uppercase; color: var(--encre-3); margin-right: 2px; }
.ar-lien { display: flex; align-items: center; gap: 8px; max-width: 100%; text-decoration: none; color: var(--encre); background: var(--surface); border: 1px solid var(--filet); border-radius: 10px; padding: 6px 12px 6px 8px; }
.ar-lien:hover { border-color: var(--encre-3); }
.ar-lien svg.sym { width: 22px; height: 22px; flex: none; }
.ar-lien span { display: flex; flex-direction: column; min-width: 0; }
.ar-lien b { font: 600 14px/1.3 var(--f-ui); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 300px; }
.ar-lien small { font: 12px/1.3 var(--f-ui); color: var(--encre-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 300px; }
.ar-effacer { border: 0; background: none; font: 12.5px var(--f-ui); color: var(--encre-3); cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 560px) { .ar-lien { flex: 1 1 100%; } .ar-lien b, .ar-lien small { max-width: none; } }
/* Accessibilité (9 nov. 2026, §59) : contour de focus visible sur les éléments sans style propre (bulles SVG de
   l'accueil et de l'édifice, liens nus) ; une seule règle, au clavier seulement (:focus-visible). */
a:focus-visible, button:focus-visible, [tabindex]:focus-visible, summary:focus-visible { outline: 2px solid var(--encre-2); outline-offset: 2px; }
svg a:focus-visible { outline: none; } svg a:focus-visible rect { stroke-width: 12; stroke: var(--encre); }
.retour-renvoi { position: fixed; z-index: 45; left: 50%; transform: translateX(-50%); bottom: max(18px, env(safe-area-inset-bottom)); font: 600 14px var(--f-ui); color: var(--surface); background: var(--encre); border: 0; border-radius: 999px; padding: 10px 18px; box-shadow: 0 6px 20px rgb(0 0 0 / .25); cursor: pointer; }
.retour-renvoi[hidden] { display: none; }
.retour-renvoi:hover { background: var(--encre-2); }
.retour-repere { outline: 2px solid var(--r-cours); outline-offset: 3px; border-radius: 6px; transition: outline-color .6s; }

/* Recherche globale (domaine À propos – apparence) : loupe de l'en-tête, Ctrl K ou « / ». */
.chercher-tout { flex: none; display: grid; place-items: center; width: 30px; height: 30px; padding: 0; margin-right: -16px; border: 0; border-radius: 8px; background: none; color: var(--encre-2); cursor: pointer; }
body.en-rubrique .chercher-tout { margin-left: auto; }
body.en-rubrique .chercher-tout ~ .bouton-theme { margin-left: 0; }
.chercher-tout:hover, .chercher-tout[aria-expanded="true"] { color: var(--encre); background: var(--trame); }
.chercher-tout:focus-visible { outline: 2px solid var(--encre-3); outline-offset: 2px; }
.rg-fond { position: fixed; inset: 0; z-index: 50; background: rgb(18 20 24 / .38); display: flex; justify-content: center; align-items: flex-start; padding: 9vh 16px 16px; }
.rg-fond[hidden] { display: none; }
.rg-boite { width: min(640px, 100%); max-height: 78vh; display: flex; flex-direction: column; background: var(--surface); border: 1px solid var(--filet); border-radius: 12px; box-shadow: 0 18px 50px rgb(0 0 0 / .22); overflow: hidden; }
.rg-champ { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border-bottom: 1px solid var(--filet); color: var(--encre-3); }
.rg-champ input { flex: 1; min-width: 0; border: 0; outline: 0; background: none; color: var(--encre); font: inherit; font-size: 17px; }
.rg-champ kbd, .rg-pied kbd { font: inherit; font-size: 11.5px; color: var(--encre-3); border: 1px solid var(--filet); border-radius: 5px; padding: 1px 6px; }
.rg-champ input::-webkit-search-cancel-button { -webkit-appearance: none; display: none; }
.rg-fermer { border: 0; background: none; color: var(--encre-3); cursor: pointer; font-size: 13px; padding: 4px 6px; border-radius: 6px; }
.rg-fermer:hover { background: var(--trame); color: var(--encre); }
.rg-res { overflow-y: auto; padding: 6px 0 8px; overscroll-behavior: contain; }
.rg-groupe { display: flex; align-items: center; gap: 7px; margin: 10px 16px 4px; font-size: 11.5px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--encre-3); }
.rg-groupe svg.sym { width: 15px; height: 15px; vertical-align: 0; }
.rg-item { display: block; width: 100%; box-sizing: border-box; text-align: left; border: 0; background: none; color: var(--encre); font: inherit; cursor: pointer; padding: 7px 16px; text-decoration: none; }
.rg-item[aria-selected="true"], .rg-item:hover { background: var(--trame); }
.rg-titre { display: block; font-size: 15px; line-height: 1.35; }
.rg-titre mark { background: none; color: inherit; font-weight: 700; }
.rg-det { display: block; font-size: 12.5px; color: var(--encre-3); margin-top: 1px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rg-plus .rg-titre { color: var(--encre-2); }
.rg-vide { padding: 14px 16px; font-size: 14px; color: var(--encre-2); line-height: 1.5; }
.rg-vide button { border: 0; background: none; padding: 0; font: inherit; color: var(--encre); text-decoration: underline; text-decoration-color: var(--filet); text-underline-offset: 3px; cursor: pointer; }
.rg-pied { display: flex; gap: 14px; flex-wrap: wrap; padding: 8px 16px; border-top: 1px solid var(--filet); font-size: 12px; color: var(--encre-3); }
@media (max-width: 560px) { .rg-fond { padding: 0; } .rg-boite { width: 100%; max-height: none; height: 100%; border-radius: 0; border: 0; } .rg-champ input { font-size: 16px; } .rg-pied { display: none; } }
.acc-profils { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.acc-profil { padding: 16px 18px; display: flex; flex-direction: column; gap: 8px; }
.acc-profil h4 { margin: 0; font-family: var(--f-titre); font-size: 19px; }
.acc-profil p { margin: 0; font-size: 14px; line-height: 1.5; color: var(--encre-2); }
.acc-puces { display: flex; flex-wrap: wrap; gap: 6px; }
.acc-puces .chip { text-decoration: none; font-size: 13px; }
.acc-profil .acc-profil-liens { margin-top: auto; display: flex; flex-direction: column; gap: 4px; font-size: 14px; }
.acc-profil-liens a, .acc-nouv-liens a { color: var(--encre); text-decoration: underline; text-decoration-color: var(--filet); text-underline-offset: 3px; }
.acc-nouv { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.acc-nouv-carte { padding: 14px 16px; border-left: 3px solid var(--c); text-decoration: none; color: var(--encre); display: flex; flex-direction: column; gap: 6px; }
.acc-nouv-carte:hover { border-color: var(--c); }
.acc-nouv-titre { font-family: var(--f-titre); font-size: 17px; line-height: 1.3; }
.acc-nouv-liens { display: flex; flex-wrap: wrap; gap: 6px 20px; margin: 12px 0 0; font-size: 14px; }
@media (max-width: 1100px) { .acc-profils { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 860px) { .acc-nouv { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 560px) { .acc-profils { grid-template-columns: minmax(0, 1fr); } }
/* ---- repères de couleur des rubriques (accueil et menu) */
:root { --r-edifice: var(--c-nb); --r-cours: var(--c-ana); --r-exercices: var(--c-geo); --r-annales: var(--c-alg); --r-neutre: var(--encre-3); }
.menu-rubriques a[data-rubrique="edifice"], .acc-rub[href="#edifice"] { --r: var(--r-edifice); }
.menu-rubriques a[data-rubrique="cours"], .acc-rub[href="#cours"], .acc-etape[href^="#cours/"] { --r: var(--r-cours); }
.menu-rubriques a[data-rubrique="exercices"], .acc-rub[href="#exercices"], .acc-etape[href^="#exercices"] { --r: var(--r-exercices); }
.menu-rubriques a[data-rubrique="annales"], .acc-rub[href="#annales"] { --r: var(--r-annales); }
.menu-rubriques a[data-rubrique="activites"], .acc-rub[href="#activites"] { --r: var(--c-ord); }
.menu-rubriques a[data-rubrique="accueil"], .menu-rubriques a[data-rubrique="nouveautes"], .menu-rubriques a[data-rubrique="index"], .menu-rubriques a[data-rubrique="a-propos"] { --r: var(--r-neutre); }
.acc-fil .acc-etape:last-of-type { --r: var(--r-edifice); }
/* Bande en haut de l'encadré : couleur de sa rubrique ; dégradé des rubriques vers lesquelles mène un profil. */
.acc-rub, .acc-profil, .acc-nouv-carte, .acc-etape { position: relative; overflow: hidden; }
.acc-rub::before, .acc-profil::before, .acc-nouv-carte::before, .acc-etape::before {
  content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px; background: var(--r-bande, var(--r, transparent)); pointer-events: none;
}
.acc-nouv-carte { border-left-width: 1px; border-left-color: var(--filet); --r: var(--c); }
.acc-profil.p-lycee { --r-bande: linear-gradient(90deg, var(--r-cours), var(--r-exercices)); }
.acc-profil.p-prepa { --r-bande: linear-gradient(90deg, var(--r-cours), var(--r-exercices), var(--r-annales)); }
.acc-profil.p-concours { --r-bande: linear-gradient(90deg, var(--r-edifice), var(--r-annales), var(--r-cours)); }
.acc-profil.p-curiosite { --r-bande: linear-gradient(90deg, var(--r-edifice), var(--r-neutre)); }

/* ---- symboles des rubriques : aplats de trois nuances de la couleur de chaque rubrique (inversées en sombre) */
:root {
  --sy-bd: #0b3a63; --sy-bb: #1d5e96; --sy-b1: #0070c0; --sy-b2: #3c8fd6; --sy-b3: #86bcea;
  --sy-vd: #5b2a78; --sy-vm: #8a45ab; --sy-vl: #dcc6ea; --sy-td: #005a48; --sy-tm: #00866b; --sy-tl: #a9dfd1;
  --sy-od: #8f4a00; --sy-om: #d26d00; --sy-ol: #f6cf9f; --sy-gd: #3f4550; --sy-gm: #7a818c; --sy-gl: #d4d7dc;
}
:root[data-theme="dark"] {
  --sy-bd: #a9cbec; --sy-bb: #7fb0de; --sy-b1: #55aaff; --sy-b2: #2f7cc4; --sy-b3: #a9d2fa;
  --sy-vd: #ead6f6; --sy-vm: #c793e6; --sy-vl: #56366c; --sy-td: #c6f0e5; --sy-tm: #35caa4; --sy-tl: #1d5649;
  --sy-od: #ffdcb3; --sy-om: #ffa24a; --sy-ol: #6a4218; --sy-gd: #d6d9de; --sy-gm: #a3a8b1; --sy-gl: #4a505b;
}
.sy-bd { fill: var(--sy-bd); } .sy-bb { fill: var(--sy-bb); } .sy-b1 { fill: var(--sy-b1); } .sy-b2 { fill: var(--sy-b2); } .sy-b3 { fill: var(--sy-b3); }
.sy-vd { fill: var(--sy-vd); } .sy-vm { fill: var(--sy-vm); } .sy-vl { fill: var(--sy-vl); } .sy-td { fill: var(--sy-td); } .sy-tm { fill: var(--sy-tm); } .sy-tl { fill: var(--sy-tl); }
.sy-od { fill: var(--sy-od); } .sy-om { fill: var(--sy-om); } .sy-ol { fill: var(--sy-ol); } .sy-gd { fill: var(--sy-gd); } .sy-gm { fill: var(--sy-gm); } .sy-gl { fill: var(--sy-gl); }
svg.sym { width: 20px; height: 20px; flex: none; display: inline-block; vertical-align: -4px; }
.menu-rubriques .m-titre { display: inline-flex; align-items: center; gap: 8px; }
.menu-rubriques .m-titre svg.sym { width: 19px; height: 19px; }
.acc-rub h4 { display: flex; align-items: center; gap: 10px; line-height: 1.1; min-width: 0; }
.acc-rub h4 svg.sym { width: 28px; height: 28px; }
/* encadrés « Par où commencer ? » : symbole calé sur la première ligne du titre, qui peut passer sur deux lignes */
.acc-profil h4 { display: flex; align-items: flex-start; gap: 10px; }
.acc-profil h4 svg.sym { width: 26px; height: 26px; margin-top: 1px; }
/* symbole, titre et nombre sur une même ligne médiane (le titre seul s'alignait sur la ligne de base du nombre) */
.acc-rubriques .acc-rub .r-tete { align-items: center; min-height: 32px; }
.fil li.fil-icone { margin-right: 2px; }
/* Onglets des rubriques dans l'en-tête, sur grand écran (domaine À propos – apparence, MEMO_atlas_apropos.md §66) :
   la rubrique courante est entourée d'une pastille à sa couleur, qui s'agrandit pour contenir la suite du fil
   d'Ariane (« Cours › chapitre ») ; le fil lui-même est alors masqué. Quand un fil est à lire, les autres
   rubriques se replient en pastilles sans couleur réduites à leur symbole. Sous 1100 px (téléphone, tablette) :
   une seconde ligne sous la barre, où les rubriques autres que la courante sont toujours repliées. */
@media (max-width: 1099px) {
  .nav-rub { order: 20; flex: 0 0 auto; display: flex; align-items: center; gap: 4px; min-width: 0; margin: 0; padding: 0; border: 0; background: none; }
  body.a-onglet .nav-rub { flex: 1 1 100%; }
  .nav-rub { grid-column: 1 / -1; grid-row: 3; }   /* téléphone : l'en-tête est une grille (voir plus bas) */
  body.a-onglet .nav-rub { grid-row: 2; }
  /* L'édifice : le bouton Légende partage la seconde ligne avec les rubriques (colonnes du drapeau et de Partager). */
  body:not(.en-rubrique) .nav-rub { grid-column: 1 / 5; }
  body:not(.en-rubrique) .legende { grid-row: 2; grid-column: 5 / -1; justify-self: end; }
  body:not(.en-rubrique) .nav-rub-cur { padding-right: 10px; }

  .fil { order: 21; }
  body.a-onglet .fil { display: none; }
  .nav-rub a { flex: none; display: inline-flex; align-items: center; justify-content: center; gap: 6px; text-decoration: none; color: var(--encre-2); font-family: var(--f-ui); font-size: 14px; }
  .nav-rub > a { width: 30px; height: 30px; border: 1px solid var(--filet); border-radius: 999px; background: var(--surface); }
  .nav-rub > a .nav-rub-nom, .nav-rub-cur:has(.nav-rub-suite) > a .nav-rub-nom { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .nav-rub a svg.sym { width: 16px; height: 16px; }
  .nav-rub-cur { flex: 0 1 auto; min-width: 0; display: inline-flex; align-items: center; gap: 2px; padding: 3px 11px 3px 9px; min-height: 30px; box-sizing: border-box; border: 1px solid color-mix(in srgb, var(--r) 65%, transparent); background: color-mix(in srgb, var(--r) 13%, transparent); border-radius: 17px; }
  .nav-rub-cur > a { color: var(--encre); font-weight: 600; }
  .nav-rub-suite { display: inline-flex; align-items: center; flex-wrap: wrap; min-width: 0; font-family: var(--f-ui); font-size: 13px; line-height: 1.25; }
  .nav-rub-suite button { all: unset; cursor: pointer; color: var(--encre-2); min-width: 0; }
  .nav-rub-suite button + button::before { content: "›"; margin: 0 5px; color: var(--encre-3); }
  .nav-rub-suite button:last-child { color: var(--encre); font-weight: 600; cursor: default; }
  .nav-rub-suite button span { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
  .nav-rub-suite button { display: inline-flex; }
  .nav-rub-cur > a + .nav-rub-suite { margin-left: 4px; }
}
@media (max-width: 420px) {
  /* Très petit écran, édifice : la pastille colorée se réduit aussi à son symbole, pour laisser la place à Légende. */
  body:not(.en-rubrique) .nav-rub-cur { width: 30px; height: 30px; min-height: 0; padding: 0; justify-content: center; }
  body:not(.en-rubrique) .nav-rub-cur > a .nav-rub-nom { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .nav-rub { gap: 3px; }
  .nav-rub > a { width: 28px; height: 28px; }
  .nav-rub-cur:has(.nav-rub-suite) > a { display: none; }   /* la couleur de la pastille dit déjà la rubrique */
  .nav-rub-cur:has(.nav-rub-suite) { padding-left: 11px; }
  .nav-rub-suite button span { -webkit-line-clamp: 3; }
}
.nav-rub [data-onglet="edifice"] { --r: var(--r-edifice); }
.nav-rub [data-onglet="cours"] { --r: var(--r-cours); }
.nav-rub [data-onglet="exercices"] { --r: var(--r-exercices); }
.nav-rub [data-onglet="annales"] { --r: var(--r-annales); }
.nav-rub [data-onglet="activites"] { --r: var(--c-ord); }
.nav-rub [data-onglet="accueil"] { --r: var(--r-neutre); }
@media (min-width: 1100px) {
  .entete:has(.nav-rub) { flex-wrap: nowrap; min-width: 0; }
  .nav-rub { display: flex; align-items: center; gap: 2px; flex: 0 1 auto; min-width: 0; }
  .nav-rub a { flex: none; display: inline-flex; align-items: center; gap: 6px; font-family: var(--f-ui); font-size: 13.5px; font-weight: 500; color: var(--encre-2); text-decoration: none; white-space: nowrap; padding: 5px 11px; border: 1px solid transparent; border-radius: 999px; }
  .nav-rub a svg.sym { width: 15px; height: 15px; }
  .nav-rub a:hover { background: var(--trame); color: var(--encre); }
  .nav-rub a[aria-current="page"] { color: var(--encre); font-weight: 600; border-color: color-mix(in srgb, var(--r) 65%, transparent); background: color-mix(in srgb, var(--r) 13%, transparent); }
  .nav-rub a:focus-visible { outline: 2px solid var(--r); outline-offset: 1px; }
  body.a-onglet .fil { display: none; }
  .nav-rub.replie { gap: 6px; }
  .nav-rub.replie > a { width: 32px; height: 32px; padding: 0; justify-content: center; border-color: var(--filet); background: var(--surface); }
  .nav-rub.replie > a:hover { background: var(--trame); }
  .nav-rub.replie > a .nav-rub-nom { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .nav-rub.replie > a svg.sym { width: 16px; height: 16px; }
  .nav-rub-cur { flex: 0 1 auto; display: inline-flex; align-items: center; min-width: 0; border: 1px solid color-mix(in srgb, var(--r) 65%, transparent); background: color-mix(in srgb, var(--r) 13%, transparent); border-radius: 999px; }
  .nav-rub-cur > a[aria-current="page"] { border-color: transparent; background: none; }
  .nav-rub-suite { display: inline-flex; align-items: center; min-width: 0; overflow: hidden; padding-right: 13px; font-family: var(--f-ui); font-size: 13.5px; }
  .nav-rub-suite button { all: unset; flex: 0 1 auto; min-width: 0; display: inline-flex; align-items: center; cursor: pointer; color: var(--encre-2); white-space: nowrap; }
  .nav-rub-suite button span { display: block; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
  .nav-rub-suite button::before { content: "›"; margin: 0 7px 0 0; color: var(--encre-3); flex: none; }
  .nav-rub-suite button:hover span { color: var(--encre); text-decoration: underline; text-underline-offset: 3px; }
  .nav-rub-suite button:last-child { color: var(--encre); font-weight: 600; cursor: default; flex-shrink: 1; }
  .nav-rub-suite button:last-child:hover span { text-decoration: none; }
  .nav-rub-suite button + button { margin-left: 7px; }
  .nav-rub-suite button:focus-visible { outline: 2px solid var(--r); outline-offset: 2px; border-radius: 3px; }
  .fil { overflow: hidden; }
}
.fil li.fil-icone + li::before { content: none; }
.nouv-rub svg.sym, .acc-nouv-carte svg.sym { width: 16px; height: 16px; vertical-align: -3px; }
.nouv-filtres .chip svg.sym { width: 15px; height: 15px; }

/* ---- nouveautés */
.nouv-filtres { display: flex; flex-wrap: wrap; gap: 8px; margin: 4px 0 26px; }
.nouv-filtres .chip { display: inline-flex; align-items: center; gap: 7px; }
.nouv-filtres .chip span { color: var(--encre-3); font-variant-numeric: tabular-nums; }
.nouv-filtres .chip[aria-pressed="true"] { background: var(--encre); color: var(--papier); border-color: var(--encre); }
.nouv-filtres .chip[aria-pressed="true"] span { color: inherit; opacity: .7; }
.nouv-point { width: 8px; height: 8px; border-radius: 50%; background: var(--c); display: inline-block; flex: none; }
.nouv-fil { list-style: none; margin: 0; padding: 0; }
.nouv-jour { display: grid; grid-template-columns: 190px minmax(0, 1fr); gap: 0 28px; padding-bottom: 26px; position: relative; }
.nouv-jour::before { content: ''; position: absolute; left: 190px; top: 26px; bottom: -26px; width: 1px; background: var(--filet); transform: translateX(13px); }
.nouv-jour:last-child::before { display: none; }
.nouv-date { margin: 0; padding: 18px 0 0; font-family: var(--f-ui); font-size: 13px; font-weight: 500; color: var(--encre-2); text-align: right; position: sticky; top: 8px; align-self: start; }
.nouv-date time { display: inline-block; }
.nouv-date time::first-letter { text-transform: uppercase; }
.nouv-date::after { content: ''; position: absolute; left: calc(100% + 13px); top: 22px; width: 9px; height: 9px; border-radius: 50%; background: var(--papier); border: 2px solid var(--encre-3); transform: translateX(-50%); }
.nouv-entrees { display: grid; gap: 12px; }
.nouv { padding: 16px 20px 14px; border-left: 3px solid var(--c); }
.nouv.neuf { box-shadow: 0 0 0 1px var(--c) inset; }
.nouv-rub { margin: 0 0 4px; display: flex; align-items: center; gap: 8px; font-size: 12px; letter-spacing: .04em; text-transform: uppercase; color: var(--encre-2); }
.nouv-badge { text-transform: none; letter-spacing: 0; font-size: 11.5px; font-weight: 600; color: var(--papier); background: var(--c); border-radius: 999px; padding: 1px 8px; }
.nouv h4 { margin: 0 0 6px; font-family: var(--f-titre); font-size: 20px; line-height: 1.3; }
.nouv-texte { font-family: var(--f-texte); font-size: 16px; line-height: 1.55; color: var(--encre); }
.nouv-texte p { margin: 0 0 .5em; }
.nouv-liens { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 6px 0 0; font-size: 14px; }
.nouv-liens a { color: var(--encre); text-decoration: underline; text-decoration-color: var(--c); text-underline-offset: 3px; text-decoration-thickness: 2px; }
.m-badge.m-neuf { background: var(--encre); color: var(--papier); border-color: var(--encre); }
@media (max-width: 860px) {
  .nouv-jour { grid-template-columns: minmax(0, 1fr); padding-bottom: 18px; }
  .nouv-jour::before, .nouv-date::after { display: none; }
  .nouv-date { position: static; text-align: left; padding: 0 0 8px; }
  .nouv { padding: 14px 16px 12px; }
}
.signal-elt {
  display: inline-grid; place-items: center; width: 26px; height: 26px; padding: 0; margin-left: 6px; vertical-align: middle;
  border: 0; border-radius: 6px; background: none; color: var(--encre-3); cursor: pointer; opacity: .55; transition: opacity .15s;
}
.signal-elt:hover, .signal-elt:focus-visible, .signal-elt[aria-expanded="true"] { opacity: 1; color: var(--encre); background: var(--trame); }
.signal-elt:focus-visible { outline: 2px solid var(--encre-3); outline-offset: 1px; }
.exo-tete .signal-elt { margin-left: auto; }
.fiche h2 .signal-elt { position: relative; top: -2px; }
@media (hover: none) { .signal-elt { opacity: .8; } }
.signaler-panneau {
  position: fixed; z-index: 70; width: min(340px, calc(100vw - 24px)); padding: 16px 16px 14px;
  background: var(--surface); color: var(--encre); border: 1px solid var(--filet); border-radius: 12px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, .16); font-size: 14px; line-height: 1.45;
}
.signaler-panneau h3 { margin: 0 0 6px; font-family: var(--f-titre); font-size: 18px; }
.signaler-panneau .sp-cible { margin: 0 0 8px; color: var(--encre-2); font-size: 13px; overflow-wrap: anywhere; }
.signaler-panneau .sp-cible b { color: var(--encre); font-weight: 600; }
.signaler-panneau p { margin: 0 0 12px; }
.signaler-panneau .sp-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.signaler-panneau .sp-actions a, .signaler-panneau .sp-actions button {
  font: inherit; font-size: 13.5px; padding: 6px 14px; border-radius: 6px; border: 1px solid var(--filet);
  background: var(--surface); color: var(--encre); text-decoration: none; cursor: pointer;
}
.signaler-panneau .sp-actions .sp-ecrire { background: var(--encre); color: var(--papier); border-color: var(--encre); }
.signaler-panneau .sp-fermer { position: absolute; top: 8px; right: 8px; width: 28px; height: 28px; border: 0; border-radius: 6px; background: none; color: var(--encre-2); font-size: 20px; cursor: pointer; }
.legende > summary {
  list-style: none; cursor: pointer; font-size: 13px; color: var(--encre-2);
  border: 1px solid var(--filet); border-radius: 999px; padding: 3px 12px;
}
.legende > summary::-webkit-details-marker { display: none; }
.legende[open] > summary { color: var(--encre); border-color: var(--encre-3); }
.legende-corps {
  position: absolute; right: 0; top: calc(100% + 8px); width: min(374px, calc(100vw - 32px)); box-sizing: border-box;
  background: var(--surface); border: 1px solid var(--filet); border-radius: 8px; box-shadow: var(--ombre);
  padding: 14px 16px; display: grid; gap: 12px; font-size: 13px; overflow-y: auto; overscroll-behavior: contain;
}
.legende-corps h3 { margin: 0 0 6px; font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--encre-3); font-weight: 500; }
.legende-liste { display: flex; flex-wrap: wrap; gap: 6px 14px; margin: 0; padding: 0; list-style: none; }
.legende-liste li { display: flex; align-items: center; gap: 6px; }
.pastille { width: 12px; height: 12px; border-radius: 3px; border: 2px solid var(--c); background: color-mix(in srgb, var(--c) 14%, var(--noeud)); }

/* ---------------------------------------------------------------- zones */
.corps {
  display: grid; min-height: 0;
  grid-template-columns: minmax(0, 1fr) 9px var(--largeur-panneau, clamp(440px, 42vw, 820px));
}
.cadre { position: relative; min-width: 0; min-height: 0; }
.separateur {
  position: relative; cursor: col-resize; background: var(--surface); touch-action: none;
  border-left: 1px solid var(--filet); border-right: 1px solid var(--filet);
}
.separateur::after {
  content: ""; position: absolute; left: 50%; top: 50%; width: 3px; height: 36px; border-radius: 2px;
  transform: translate(-50%, -50%); background: var(--encre-3); opacity: .45; transition: opacity .15s, height .15s;
}
.separateur:hover::after, .separateur:focus-visible::after, .separateur.actif::after { opacity: 1; height: 56px; }
body.redim { cursor: col-resize; user-select: none; }
body.redim .vue { pointer-events: none; }
.vue {
  position: absolute; inset: 0; overflow: auto;
  touch-action: pan-x pan-y;   /* un doigt : défilement natif ; deux doigts : zoom du graphe (zoomGraphe) */
  background-color: var(--papier);
  background-image: radial-gradient(var(--trame) 1px, transparent 1px);
  background-size: 18px 18px;
}
.dimension { position: relative; margin: 0 auto 64px; }  /* marge : les commandes ne masquent pas la dernière rangée */
.plan { position: absolute; left: 0; top: 0; transform-origin: 0 0; }
.plan svg { position: absolute; left: 0; top: 0; overflow: visible; }

.commandes {
  position: absolute; right: 12px; bottom: 12px; display: flex; gap: 4px;
  background: var(--surface); border: 1px solid var(--filet); border-radius: 8px; padding: 4px;
  box-shadow: var(--ombre);
}
.commandes button {
  min-width: 34px; height: 30px; border: 0; background: none; border-radius: 5px; cursor: pointer;
  font-size: 14px; color: var(--encre-2); padding: 0 8px;
}
.commandes button:hover { background: var(--trame); color: var(--encre); }
.commandes .remonter { font-size: 13px; }

/* ---------------------------------------------------------------- graphe */
.rang-etiq {
  position: absolute; left: 14px; font-family: var(--f-mono); font-size: 11px; color: var(--encre-3);
  transform: translateY(-50%); letter-spacing: .04em; pointer-events: none;
}
.rang-trait { position: absolute; left: 70px; right: 0; border-top: 1px dashed var(--trame); pointer-events: none; }

.arete { fill: none; stroke: var(--arete); stroke-width: 1.4; marker-end: url(#pointe); transition: stroke .15s, opacity .15s; }
.arete.entree { stroke-dasharray: 4 4; }
.zone-arete { fill: none; stroke: transparent; stroke-width: 12; pointer-events: stroke; cursor: pointer; }
#pointe path { fill: var(--arete); }
#pointe-vive path { fill: var(--arete-vive); }
.plan.focus .arete { opacity: .25; }
.plan.focus .arete.vive { opacity: 1; stroke: var(--arete-vive); stroke-width: 1.8; marker-end: url(#pointe-vive); }

:root { --c-n: var(--c-nb); --c-z: var(--c-nb); --c-q: var(--c-nb); --c-r: var(--c-nb); --c-c: var(--c-nb); --c-ari: var(--c-nb); }
.noeud {
  --c: var(--c-neutre);
  position: absolute; display: flex; align-items: center; justify-content: center; text-align: center;
  padding: 4px 12px; border-radius: 8px; cursor: pointer;
  border: 1.5px solid var(--c); background: color-mix(in srgb, var(--c) 9%, var(--noeud));
  font-size: 13px; line-height: 1.25; font-weight: 500; color: var(--encre);
  transition: transform .15s, box-shadow .15s, opacity .15s;
}
.noeud:hover { transform: translateY(-1px); box-shadow: var(--ombre); }
.plan.focus .noeud { opacity: .4; }
.plan.focus .noeud.voisin { opacity: 1; }
.noeud.choisi { box-shadow: 0 0 0 3px var(--surface), 0 0 0 5px var(--c); }
/* Fondements ou portée d'une fiche (boutons de la fiche) : les bulles de la fermeture restent vives, les
   autres s'estompent ; le survol d'une bulle à la souris (classe focus) reprend la main tant qu'il dure. */
.plan.dep:not(.focus) .noeud:not(.dep-oui):not(.dep-origine) { opacity: .25; }
.plan.dep:not(.focus) .arete:not(.dep-vive) { opacity: .15; }
.plan.dep:not(.focus) .arete.dep-vive { stroke: var(--arete-vive); stroke-width: 1.8; marker-end: url(#pointe-vive); }
.noeud.dep-origine { box-shadow: 0 0 0 3px var(--surface), 0 0 0 5px var(--c); }

.fam-fond { --c: var(--c-fond); }
.fam-ord  { --c: var(--c-ord); }
.fam-alg  { --c: var(--c-alg); }
.fam-top  { --c: var(--c-top); }
.fam-mix  { --c: var(--c-mix); background: var(--noeud); }
/* Théorie mixte de l'édifice : le contour passe de la couleur d'une source à celle de l'autre. */
.noeud.mixte {
  --c: var(--c1);
  border-color: transparent;
  background: var(--deg-fond) padding-box, var(--deg-bord) border-box;
}
.pastille.mixte {
  border: 2px solid transparent;
  background: linear-gradient(var(--noeud), var(--noeud)) padding-box, linear-gradient(90deg, var(--c-alg), var(--c-top)) border-box;
}
.fam-ana  { --c: var(--c-ana); }
.fam-geo  { --c: var(--c-geo); }
.fam-ari  { --c: var(--c-ari); }
.fam-n { --c: var(--c-n); } .fam-z { --c: var(--c-z); } .fam-q { --c: var(--c-q); }
.fam-r { --c: var(--c-r); } .fam-c { --c: var(--c-c); }
.nombre { border-radius: 50%; border-width: 2.5px; padding: 0; font-family: var(--f-titre); font-size: 22px; font-weight: 400; color: var(--c); }

/* natures, dans les graphes intérieurs */
.nat-définition { --c: var(--rouge); background: var(--rouge-fond); }
.nat-axiome { --c: var(--c-axiome); background: color-mix(in srgb, var(--c-axiome) 8%, var(--noeud)); border-width: 2px; }
.nat-théorème { --c: var(--encre); background: var(--noeud); border: 3.5px double var(--c); }
.nat-proposition, .nat-lemme, .nat-corollaire { --c: var(--encre-2); background: var(--noeud); }
.nat-chapitre { --c: var(--c-neutre); background: color-mix(in srgb, var(--c-neutre) 6%, var(--noeud)); }
.entree-amont {
  --c: var(--encre-3); border-style: dashed; background: var(--papier); color: var(--encre-2); font-weight: 400;
}
.entree-amont::before {
  content: "niveau supérieur"; position: absolute; top: -9px; left: 50%; transform: translateX(-50%);
  font-family: var(--f-mono); font-size: 9.5px; letter-spacing: .05em; color: var(--encre-3);
  background: var(--papier); padding: 0 4px; white-space: nowrap;
}
.etoile { color: var(--choix); font-weight: 600; margin-left: 3px; }
/* † : résultat pas entièrement démontré à cet endroit (champ admis, voir construire.py) */
.dague { color: var(--encre-2); font-weight: 600; margin-left: 3px; }
/* dans les bulles, la croix du texte (Spectral) : celle des polices sans empattement est souvent réduite à un petit + surélevé */
.noeud .dague { font-family: var(--f-titre); font-size: 15px; line-height: 1; }
.legende-liste .dague, .admis-ici .tete .dague { font-family: var(--f-titre); }
.admis-ici .tete .dague { margin: 0 2px 0 0; font-size: 13px; }
.legende-liste .dague { font-size: 16px; }
.a-interieur::after {
  content: ""; position: absolute; top: -7px; right: -7px; width: 16px; height: 16px; border-radius: 4px;
  background:
    linear-gradient(var(--c), var(--c)) 4px 4px / 8px 1.5px no-repeat,
    linear-gradient(var(--c), var(--c)) 4px 10.5px / 8px 1.5px no-repeat,
    linear-gradient(var(--c), var(--c)) 4px 4px / 1.5px 8px no-repeat,
    linear-gradient(var(--c), var(--c)) 10.5px 4px / 1.5px 8px no-repeat,
    var(--surface);
  border: 1.5px solid var(--c);
}

/* ---------------------------------------------------------------- panneau */
.panneau { min-width: 0; overflow: auto; background: var(--surface); display: flex; flex-direction: column; }
.tete-panneau { position: sticky; top: 0; background: var(--surface); z-index: 3; }
.onglets {
  display: flex; gap: 2px; padding: 8px 12px 0; border-bottom: 1px solid var(--filet);
  background: var(--surface);
}
/* Recherche dans tout l'édifice (chercherEdifice) */
.cherche-edifice { position: relative; padding: 12px 24px 0; }
.cherche-edifice input {
  width: 100%; box-sizing: border-box; font: inherit; font-family: var(--f-ui); font-size: 14px;
  padding: 8px 12px 8px 34px; border: 1px solid var(--filet); border-radius: 8px; color: var(--encre);
  background: var(--papier) no-repeat 11px 50% / 15px 15px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%237c838e' stroke-width='1.6'%3E%3Ccircle cx='6.5' cy='6.5' r='5'/%3E%3Cpath d='M10.3 10.3 15 15'/%3E%3C/svg%3E");
}
.cherche-edifice .cherche-ligne { display: flex; gap: 8px; align-items: center; }
.cherche-edifice .cherche-ligne input { flex: 1; min-width: 0; }
.cherche-edifice input::-webkit-search-cancel-button { display: none; }   /* remplacé par le bouton */
.effacer-edifice { flex: none; font-size: 13.5px; font-weight: 600; background: var(--encre); border-color: var(--encre); color: var(--surface); padding: 7px 14px; box-shadow: 0 1px 0 rgba(0,0,0,.25); }
.effacer-edifice:hover { background: var(--encre-2); border-color: var(--encre-2); }
.effacer-edifice:focus-visible { outline: 2px solid var(--encre-2); outline-offset: 2px; }
.effacer-edifice svg { width: 16px; height: 16px; flex: none; }
.effacer-edifice[hidden] { display: none; }
.cherche-edifice input:focus { outline: 2px solid var(--rouge); outline-offset: -1px; border-color: transparent; }
.resultats-edifice {
  position: absolute; left: 24px; right: 24px; top: calc(100% + 4px); max-height: min(60vh, 460px); overflow: auto;
  background: var(--surface); border: 1px solid var(--filet); border-radius: 8px; box-shadow: var(--ombre); z-index: 5;
  font-family: var(--f-ui); padding: 4px;
}
.resultats-edifice .re-item {
  display: block; width: 100%; text-align: left; border: 0; background: none; cursor: pointer; color: var(--encre);
  padding: 7px 10px; border-radius: 6px; font: inherit;
}
.resultats-edifice .re-item[aria-selected="true"], .resultats-edifice .re-item:hover { background: var(--trame); }
.resultats-edifice .re-titre { font-size: 14px; font-weight: 500; display: flex; align-items: baseline; gap: 8px; }
.resultats-edifice .re-titre .re-nature { font-size: 11px; letter-spacing: .04em; text-transform: uppercase; color: var(--re-c, var(--encre-3)); font-weight: 500; }
.resultats-edifice .re-chemin { font-size: 12px; color: var(--encre-3); margin-top: 1px; }
.resultats-edifice .re-motif { font-size: 12px; color: var(--encre-2); margin-top: 1px; }
.resultats-edifice mark { background: none; color: var(--rouge); font-weight: 600; }
.resultats-edifice .re-vide { padding: 10px; font-size: 13px; color: var(--encre-3); }
.onglets button {
  border: 0; background: none; padding: 8px 12px; cursor: pointer; font-size: 14px; color: var(--encre-2);
  border-bottom: 2px solid transparent; margin-bottom: -1px;
}
.onglets button[aria-selected="true"] { color: var(--encre); border-bottom-color: var(--rouge); font-weight: 500; }
.onglet { padding: 20px 24px 40px; }
/* Une cible atteinte par scrollIntoView ou par une ancre ne passe pas sous la barre collante (recherche et onglets),
   dont la hauteur est mesurée (--haut-tete-panneau, posée par un ResizeObserver). */
.onglet :is([id], h2, h3, details, .bouton, .remarque, .enonce) { scroll-margin-top: calc(var(--haut-tete-panneau, 52px) + 8px); }
/* Passage d'un onglet à l'autre par un glissement du doigt : le contenu entre du côté d'où vient l'onglet. */
@keyframes onglet-depuis-droite { from { transform: translateX(28px); opacity: .3; } to { transform: none; opacity: 1; } }
@keyframes onglet-depuis-gauche { from { transform: translateX(-28px); opacity: .3; } to { transform: none; opacity: 1; } }
.onglet.glisse-droite { animation: onglet-depuis-droite .2s ease-out; }
.onglet.glisse-gauche { animation: onglet-depuis-gauche .2s ease-out; }
@media (prefers-reduced-motion: reduce) { .onglet.glisse-droite, .onglet.glisse-gauche { animation: none; } }
/* Retour à la page d'où l'on est venu (cours, annales, exercices…) : visible seulement après un lien vers l'édifice. */
.retour-edifice {
  position: fixed; z-index: 40; left: max(14px, env(safe-area-inset-left, 0px)); bottom: calc(14px + env(safe-area-inset-bottom, 0px));
  display: flex; align-items: stretch; max-width: min(440px, calc(100vw - 28px));
  background: var(--surface); color: var(--encre); border: 1px solid var(--filet); border-radius: 999px; box-shadow: var(--ombre);
  font-family: var(--f-ui); font-size: 13px; opacity: .97;
}
.retour-edifice[hidden] { display: none; }
/* Sur téléphone, le bouton est posé sur le panneau : une marge sous le contenu pour qu'il n'en cache pas la fin.
   Au bureau, il est posé sur le graphe. Bandeau d'installation (iOS, Android) présent : le bouton passe au-dessus. */
@media (max-width: 860px) { body.avec-retour-edifice .onglet { padding-bottom: 88px; } }
body.avec-appli-encart .retour-edifice { bottom: calc(var(--haut-appli-encart, 72px) + 22px + env(safe-area-inset-bottom, 0px)); }
.retour-edifice button { border: 0; background: none; color: inherit; cursor: pointer; font: inherit; }
.retour-edifice .re-aller { display: flex; align-items: center; gap: 7px; min-width: 0; padding: 7px 6px 7px 13px; border-radius: 999px 0 0 999px; }
.retour-edifice .re-aller span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.retour-edifice .re-aller b { font-weight: 600; }
.retour-edifice .re-aller svg { flex: none; width: 15px; height: 15px; }
.retour-edifice .re-fermer { flex: none; width: 32px; padding: 0; color: var(--encre-3); font-size: 17px; line-height: 1; border-left: 1px solid var(--filet); border-radius: 0 999px 999px 0; }
.retour-edifice button:hover { background: var(--trame); color: var(--encre); }
.retour-edifice button:focus-visible { outline: 2px solid var(--rouge); outline-offset: -2px; }

.fiche { font-family: var(--f-texte); font-size: 17px; line-height: 1.55; max-width: 46rem; }
.fiche p { margin: 0 0 .7em; }
.sur-titre {
  font-family: var(--f-mono) !important; font-size: 11.5px !important; letter-spacing: .06em; text-transform: uppercase;
  color: var(--encre-3); margin: 0 0 4px !important; display: flex; gap: 10px; flex-wrap: wrap;
}
.sur-titre .sorte { color: var(--c, var(--encre-2)); font-weight: 500; }
.fiche h2 {
  font-family: var(--f-titre); font-weight: 600; font-size: 25px; line-height: 1.2; margin: 0 0 14px;
  text-wrap: balance;
}
.contexte {
  font-family: var(--f-ui); font-size: 13.5px; color: var(--encre-2); background: var(--papier);
  border-radius: 6px; padding: 8px 12px; margin: 0 0 16px !important;
}
.choix {
  font-family: var(--f-ui); font-size: 13.5px; line-height: 1.5; background: var(--choix-fond);
  border-radius: 6px; padding: 10px 12px; margin: 0 0 16px;
}
.choix p { margin: 0; }
.choix strong.tete { color: var(--choix); display: block; font-size: 11.5px; letter-spacing: .06em; text-transform: uppercase; margin-bottom: 2px; }
details.choix { padding: 0; }
details.choix > summary.tete { color: var(--choix); font-size: 11.5px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; cursor: pointer; list-style: none; display: flex; align-items: baseline; gap: 8px; padding: 8px 12px; border-radius: 6px; }
details.choix > summary::-webkit-details-marker { display: none; }
details.choix > summary::before { content: "+"; font-family: var(--f-mono); font-size: 14px; width: 10px; flex: none; }
details.choix[open] > summary::before { content: "−"; }
details.choix > summary:hover .choix-aide { color: var(--encre-2); }
details.choix > summary:focus-visible { outline: 2px solid var(--choix); outline-offset: 1px; }
.choix-aide { text-transform: none; letter-spacing: 0; font-weight: 400; font-size: 12.5px; color: var(--encre-3); }
details.choix .choix-corps { padding: 0 12px 10px 30px; }
details.choix .choix-corps p + p { margin-top: 6px; }
.admis-ici {
  font-family: var(--f-ui); font-size: 13.5px; line-height: 1.5; background: var(--trame);
  border-radius: 6px; padding: 10px 12px; margin: 0 0 16px;
}
.admis-ici strong.tete { color: var(--encre-2); display: block; font-size: 11.5px; letter-spacing: .06em; text-transform: uppercase; margin-bottom: 2px; }
.admis-ici ul { margin: 2px 0 4px; padding-left: 18px; }
.admis-ici li { margin: 2px 0; }
.admis-ici p { margin: 0; }
.admis-ici .ai-etat { margin-top: 4px; font-size: 12.5px; }
.admis-ici .ee-note { color: var(--encre-2); }
.admis-ici .ai-etat a, .legende-liste a { color: var(--encre-2); text-underline-offset: 3px; text-decoration-color: var(--encre-3); }
.admis-ici .ai-etat a::after { content: " →"; }
.enonce {
  border-left: 3px solid var(--c, var(--encre)); padding: 4px 0 4px 16px; margin: 4px 0 18px;
}
.enonce .tete, .remarque .tete, .preuve summary {
  font-family: var(--f-ui); font-size: 11.5px; letter-spacing: .07em; text-transform: uppercase;
  color: var(--encre-3); font-weight: 500;
}
.enonce .tete { display: block; margin-bottom: 4px; }
.preuve { margin: 0 0 18px; border-top: 1px solid var(--filet); border-bottom: 1px solid var(--filet); padding: 10px 0; }
.preuve summary { cursor: pointer; list-style: none; display: flex; align-items: center; gap: 8px; }
.preuve summary::-webkit-details-marker { display: none; }
.preuve summary::before { content: "+"; font-family: var(--f-mono); font-size: 14px; width: 12px; color: var(--encre-2); }
.preuve[open] summary::before { content: "−"; }
.preuve .contenu { padding-top: 10px; }
.preuve .cqfd { display: block; text-align: right; color: var(--encre-2); font-size: 15px; }
.remarque { margin: 0 0 14px; font-size: 16px; color: var(--encre); }
.document-fiche { margin: 18px 0; padding: 14px 16px; border: 1px solid var(--filet); border-left: 3px solid var(--c, var(--encre-3)); border-radius: 8px; background: var(--surface); }
.document-fiche .tete { display: block; font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--encre-3); margin-bottom: 4px; }
.document-fiche .doc-titre { margin: 0; font-weight: 600; font-size: 16px; }
.document-fiche .doc-desc { margin: 4px 0 0; font-size: 14.5px; color: var(--encre-2); }
.document-fiche .doc-meta { margin: 6px 0 10px; font-size: 12.5px; color: var(--encre-3); font-family: var(--f-mono); }
.document-fiche .doc-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.document-fiche .doc-actions .bouton { text-decoration: none; }
.remarque .tete { display: block; margin-bottom: 2px; }
pre.code {
  font-family: var(--f-mono); font-size: 13px; line-height: 1.5; background: var(--papier); border: 1px solid var(--filet);
  border-radius: 6px; padding: 10px 12px; overflow-x: auto; margin: .3em 0 .9em; white-space: pre;
}
p.sq, .formule.sq { margin-left: 1.6em; }
.tab-wrap { overflow-x: auto; margin: .6em 0 1em; }
table.tab-exo { border-collapse: collapse; width: 100%; font-size: .95em; }
table.tab-exo th, table.tab-exo td { border: 1px solid var(--bord, rgba(127,127,127,.45)); padding: .35em .55em; text-align: center; vertical-align: middle; }
table.tab-exo th { background: rgba(0,84,159,.12); font-weight: 600; }
table.tab-exo td:first-child { text-align: left; }
figure.fig { margin: .6em 0 1em; text-align: center; }
figure.fig img { max-width: 100%; height: auto; background: #fff; padding: 8px; border-radius: 6px; }
/* Schémas de l'édifice (contenu/schemas, outils/edifice_svg.py) : SVG en ligne, couleurs du thème. */
figure.schema { margin: .8em 0 1.1em; text-align: center; }
figure.schema > svg { max-width: 100%; height: auto; overflow: visible; }
figure.schema figcaption { font-size: .9em; color: var(--encre-2); text-align: left; margin: .35em auto 0; max-width: 34em; line-height: 1.45; }
svg.schema { --sc-t: var(--encre); --sc-g: var(--encre-3); --sc-r: var(--rouge); --sc-b: var(--c-nb); --sc-v: var(--c-ana); --sc-o: var(--choix); }
svg.schema [class*="s-"] { fill: none; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
svg.schema .s-t { stroke: var(--sc-t); } svg.schema .s-g { stroke: var(--sc-g); stroke-width: 1.2; }
svg.schema .s-r { stroke: var(--sc-r); stroke-width: 2.2; } svg.schema .s-b { stroke: var(--sc-b); stroke-width: 2; }
svg.schema .s-v { stroke: var(--sc-v); stroke-width: 2; } svg.schema .s-o { stroke: var(--sc-o); stroke-width: 2; }
svg.schema .d { stroke-dasharray: 5 4; }
svg.schema .f-t { fill: var(--sc-t); fill-opacity: .08; } svg.schema .f-g { fill: var(--sc-g); fill-opacity: .14; }
svg.schema .f-r { fill: var(--sc-r); fill-opacity: .14; } svg.schema .f-b { fill: var(--sc-b); fill-opacity: .14; }
svg.schema .f-v { fill: var(--sc-v); fill-opacity: .16; } svg.schema .f-o { fill: var(--sc-o); fill-opacity: .18; }
svg.schema .p-t { fill: var(--sc-t); } svg.schema .p-g { fill: var(--sc-g); } svg.schema .p-r { fill: var(--sc-r); }
svg.schema .p-b { fill: var(--sc-b); } svg.schema .p-v { fill: var(--sc-v); } svg.schema .p-o { fill: var(--sc-o); }
svg.schema .p-fond { fill: var(--surface); }
svg.schema text { font-family: KaTeX_Main, var(--f-texte); font-size: 17px; fill: var(--sc-t); }
svg.schema text.ui { font-family: var(--f-ui); font-size: 13px; }
svg.schema .x-g { fill: var(--sc-g); } svg.schema .x-r { fill: var(--sc-r); } svg.schema .x-b { fill: var(--sc-b); }
svg.schema .x-v { fill: var(--sc-v); } svg.schema .x-o { fill: var(--sc-o); }
p code, li code { font-family: ui-monospace, Menlo, Consolas, monospace; font-size: .9em; background: var(--fond-code, rgba(127,127,127,.12)); padding: 0 .25em; border-radius: 3px; }
.source-exo { font-size: .82em; opacity: .7; font-style: italic; margin: .3em 0 0; }
.formule { overflow-x: auto; overflow-y: hidden; margin: .2em 0 .8em; padding: 2px 0; }
blockquote.redaction { margin: .4em 0 .9em; padding: .3em 0 .3em 14px; border-left: 3px solid var(--filet); color: var(--encre-2); }
blockquote.redaction p { margin: 0; }
.katex .ponct { font-family: var(--f-texte); font-size: calc(1em / 1.21); font-style: normal; font-weight: normal; }
.ouvrir {
  display: inline-flex; align-items: center; gap: 8px; margin: 4px 0 20px; cursor: pointer;
  border: 1.5px solid var(--encre); background: var(--encre); color: var(--surface);
  border-radius: 6px; padding: 8px 14px; font-family: var(--f-ui); font-size: 14px; font-weight: 500;
}
.ouvrir:hover { background: var(--encre-2); border-color: var(--encre-2); }
.liens { font-family: var(--f-ui); display: grid; gap: 12px; margin-top: 22px; padding-top: 16px; border-top: 1px solid var(--filet); }
.liens h3 { margin: 0 0 6px; font-size: 11.5px; letter-spacing: .07em; text-transform: uppercase; color: var(--encre-3); font-weight: 500; }
.puces { display: flex; flex-wrap: wrap; gap: 6px; }
.puce {
  --c: var(--encre-3);
  border: 1px solid color-mix(in srgb, var(--c) 55%, var(--filet)); background: var(--surface);
  border-radius: 999px; padding: 3px 10px; font-size: 13px; cursor: pointer; color: var(--encre);
}
.puce:hover { background: color-mix(in srgb, var(--c) 12%, var(--surface)); }
.puce .niv { color: var(--encre-3); font-size: 11.5px; margin-left: 4px; }
.vide { color: var(--encre-3); font-size: 13px; }
.dep-boutons { display: flex; flex-wrap: wrap; gap: 8px; }
.dep-boutons .bouton[aria-pressed="true"] { background: var(--encre); border-color: var(--encre); color: var(--surface); }
.dep-boutons .bouton:disabled { color: var(--encre-3); border-style: dashed; cursor: default; }
.dep-liste { display: grid; gap: 8px; font-size: 13px; margin-top: 10px; }
.dep-liste[hidden] { display: none; }
.choix-theorie > p { margin: 0 0 8px; font-size: 13px; line-height: 1.5; color: var(--encre-2); }
.choix-theorie > .dep-groupe { font-size: 13px; }
.choix-theorie > p .etoile { margin-left: 0; }
.dep-liste > p { margin: 0; color: var(--encre-2); line-height: 1.5; }
.dep-groupe > summary { cursor: pointer; display: flex; align-items: center; gap: 8px; padding: 2px 0; list-style: none; }
.dep-groupe > summary::-webkit-details-marker { display: none; }
.dep-groupe > summary::before { content: "+"; font-family: var(--f-mono); width: 10px; color: var(--encre-3); }
.dep-groupe[open] > summary::before { content: "−"; }
.dep-groupe > summary .dep-n { font-family: var(--f-mono); font-size: 11.5px; color: var(--encre-3); }
.dep-groupe > .puces { padding: 6px 0 4px 18px; }
.dep-liste .dep-actions { display: flex; flex-wrap: wrap; gap: 8px; }
/* portée « en bloc » d'une fiche intérieure : à part, repliée, en retrait */
.dep-bloc { border-top: 1px dashed var(--filet); padding-top: 6px; }
.dep-bloc > summary { color: var(--encre-3); flex-wrap: wrap; }
.dep-bloc-corps { display: grid; gap: 6px; padding: 6px 0 2px 18px; opacity: .8; }
.credits p { font-size: 13px; line-height: 1.55; color: var(--encre-2); margin: 0; }
.credits a { color: inherit; text-underline-offset: 3px; }
/* État de l'édifice (etatEdifice) et son lien depuis l'accueil de l'édifice */
.lien-etat-edifice { font-family: var(--f-ui); font-size: 14px; margin: 0 0 18px !important; }
.lien-etat-edifice a { color: var(--encre-2); text-underline-offset: 3px; text-decoration-color: var(--encre-3); }
.lien-etat-edifice a::after { content: " →"; }
.lien-etat-edifice a:hover { color: var(--encre); }
.ee-chiffres { display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; margin: 14px 0 10px; font-family: var(--f-ui); }
.ee-chiffres > div { border: 1px solid var(--filet); border-radius: 8px; padding: 8px 10px; background: var(--surface); }
.ee-chiffres strong { display: block; font-family: var(--f-titre); font-size: 22px; font-weight: 600; line-height: 1.15; }
.ee-chiffres span { font-size: 12px; color: var(--encre-2); }
.ee-titre { font-family: var(--f-ui); font-size: 11.5px; letter-spacing: .07em; text-transform: uppercase; color: var(--encre-3); font-weight: 500; margin: 24px 0 6px; }
.ee-liste { list-style: none; margin: 0 0 6px; padding: 0; }
.ee-liste li { padding: 8px 0; border-top: 1px solid var(--filet); }
.ee-liste li p { margin: 0 !important; }
.ee-tete { display: flex; flex-wrap: wrap; gap: 2px 10px; align-items: center; font-family: var(--f-ui); }
.ee-lieu { font-size: 12px; color: var(--encre-3); }
.ee-fiche { font-size: 16px; }
.ee-fleche, .ee-note { color: var(--encre-3); }
.ee-note { font-family: var(--f-ui); font-size: 12.5px; }
.ee-objet { font-size: 15px; color: var(--encre-2); }
.ee-objet + .ee-objet { margin-top: 4px !important; }
.ee-vide { font-family: var(--f-ui); font-size: 13.5px; color: var(--encre-2); }
.ee-replie { margin-top: 24px; }
@media (max-width: 600px) { .ee-chiffres { grid-template-columns: repeat(2, 1fr); } .ee-chiffres > div:last-child { grid-column: span 2; } }

.terme {
  color: var(--rouge); cursor: help; border-bottom: 1px dotted currentColor;
  font-weight: 600; font-style: normal;
}
.terme:hover { background: var(--rouge-fond); }
/* notation du lexique dans une formule : même rouge, sans graisse ni italique imposés */
.katex .terme-math { font-weight: inherit; font-style: inherit; border-bottom-width: 1px; padding-bottom: 1px; }
.katex .terme-math .terme-math { color: inherit; border-bottom: none; }
.notation { font-weight: 400; color: var(--encre-2); margin-left: 6px; }
.notation .terme { color: inherit; border-bottom: none; cursor: inherit; font-weight: inherit; }
.lien-noeud { color: inherit; text-decoration: underline; text-decoration-color: var(--encre-3); text-underline-offset: 3px; }
.lien-noeud:hover { text-decoration-color: var(--encre); }

/* lexique */
.recherche { width: 100%; box-sizing: border-box; padding: 8px 12px; border: 1px solid var(--filet); border-radius: 6px; background: var(--papier); color: var(--encre); font: inherit; font-size: 14px; margin-bottom: 16px; }
.lexique { display: block; min-width: 0; max-width: 46rem; }
.onglet { min-width: 0; overflow-wrap: break-word; }
.entree-lex { padding: 12px 0; border-bottom: 1px solid var(--filet); font-family: var(--f-texte); font-size: 16px; scroll-margin-top: 60px; border-radius: 4px; transition: background .6s; }
.entree-lex h3 { font-family: var(--f-titre); font-size: 18px; font-weight: 600; margin: 0 0 4px; color: var(--rouge); }
.entree-lex p { margin: 0 0 .5em; }
.entree-lex .emplois { font-family: var(--f-ui); font-size: 12.5px; color: var(--encre-3); display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 6px; }
.entree-lex.eclair { background: var(--rouge-fond); }
/* Titre d'une entrée qui porte le bouton « ← terme précédent » (chaîne de termes ouverts depuis le lexique) : le
   bouton suit le titre sur sa ligne, passe dessous quand la place manque, et le nom n'est abrégé que s'il dépasse la ligne. */
.tete-lex { display: flex; flex-wrap: wrap; align-items: baseline; column-gap: 10px; row-gap: 3px; margin: 0 0 4px; }
.tete-lex > h3 { margin: 0; min-width: 0; overflow-wrap: anywhere; }
.tete-lex > h3:focus { outline: none; }
.tete-lex > h3:focus-visible { outline: 2px solid var(--rouge); outline-offset: 2px; border-radius: 2px; }
.retour-lex { flex: 0 1 auto; min-width: 0; max-width: 100%; min-height: 24px; display: inline-flex; align-items: center; gap: 5px; padding: 2px 10px 2px 8px; font-family: var(--f-ui); font-size: 12.5px; line-height: 1.2; color: var(--encre-2); background: none; border: 1px solid var(--filet); border-radius: 999px; cursor: pointer; }
.retour-lex[hidden] { display: none; }
.retour-lex svg { flex: none; width: 12px; height: 12px; }
.retour-lex .rl-nom { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.retour-lex:hover { color: var(--encre); border-color: var(--rouge); }
.retour-lex:focus-visible { outline: 2px solid var(--rouge); outline-offset: 2px; color: var(--encre); }
/* exemples du lexique : pastille repliable entre la définition et « Défini dans » */
.intro-lex { font-family: var(--f-ui); font-size: 13px; line-height: 1.5; color: var(--encre-2); margin: -6px 0 10px; max-width: 46rem; }
.exemples-lex { margin: 4px 0 2px; }
.exemples-lex > summary { display: inline-flex; align-items: center; gap: 6px; list-style: none; cursor: pointer; font-family: var(--f-ui); font-size: 12.5px; color: var(--encre-2); border: 1px solid var(--filet); border-radius: 999px; padding: 2px 11px 2px 8px; background: var(--surface); user-select: none; }
.exemples-lex > summary::-webkit-details-marker { display: none; }
.exemples-lex > summary:hover { border-color: var(--rouge); color: var(--encre); }
.exemples-lex .signe::before { content: '+'; color: var(--rouge); font-weight: 600; font-size: 14px; line-height: 1; display: inline-block; width: .7em; text-align: center; }
.exemples-lex[open] .signe::before { content: '\2212'; }
.exemples-corps { border-left: 2px solid var(--filet); margin: 8px 0 4px 6px; padding: 0 0 0 12px; min-width: 0; }
.exemples-corps ol { list-style: none; margin: 0; padding: 0; }
.exemples-corps li { margin: 0 0 .7em; min-width: 0; }
.exemples-corps li:last-child { margin-bottom: 0; }
.exemples-corps .ex-num { font-weight: 600; font-family: var(--f-titre); }

/* bulle de définition au survol */
.bulle {
  position: fixed; z-index: 45;   /* au-dessus du bouton de retour (40) */ width: min(360px, calc(100vw - 24px)); box-sizing: border-box;
  background: var(--surface); border: 1px solid var(--filet); border-radius: 8px; box-shadow: var(--ombre);
  padding: 12px 14px 10px; font-family: var(--f-texte); font-size: 15.5px; line-height: 1.5;
}
.bulle .bulle-terme { font-family: var(--f-titre); font-weight: 600; color: var(--rouge); margin: 0 0 4px; font-size: 16.5px; }
.bulle p { margin: 0 0 .5em; }
.bulle .bulle-pied { font-family: var(--f-ui); font-size: 12px; color: var(--encre-3); margin: 6px 0 0; }
.bulle .formule { margin: .2em 0 .5em; }
/* lexique pas encore chargé (site publié : lexique.json) : attente discrète, ou échec avec « réessayer » */
.attente-lexique { font-family: var(--f-ui); font-size: 13.5px; color: var(--encre-3); }
.reessayer-lexique { font: inherit; color: var(--rouge); background: none; border: 0; padding: 0; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }

/* ================================================================ menu des rubriques */
.marque-menu { position: relative; }
.marque-bouton {
  display: inline-flex; align-items: center; gap: 10px; border: 0; background: none; padding: 4px 8px 4px 4px;
  margin: -4px 0 -4px -4px; border-radius: 8px; cursor: pointer; font: inherit; letter-spacing: inherit; color: var(--encre);
}
.marque-bouton:hover, .marque-bouton[aria-expanded="true"] { background: var(--trame); }
.marque-bouton .chevron { width: 12px; height: 12px; color: var(--encre-3); transition: transform .15s; margin-left: -2px; }
.marque-bouton[aria-expanded="true"] .chevron { transform: rotate(180deg); }
.menu-rubriques {
  position: absolute; left: -4px; top: calc(100% + 10px); z-index: 20; width: min(340px, calc(100vw - 24px));
  background: var(--surface); border: 1px solid var(--filet); border-radius: 10px; box-shadow: var(--ombre);
  padding: 6px; display: grid; gap: 2px; font-family: var(--f-ui); letter-spacing: normal;
}
.menu-rubriques[hidden] { display: none; }
.menu-rubriques a {
  display: grid; grid-template-columns: 1fr auto; gap: 1px 10px; padding: 9px 12px 9px 14px; border-radius: 7px;
  color: var(--encre); text-decoration: none; position: relative;
}
.menu-rubriques a:hover, .menu-rubriques a:focus-visible { background: var(--papier); outline: none; }
/* Repère de couleur de chaque rubrique (même couleur que sur l'accueil et dans les Nouveautés) ; la rubrique
   courante est en plus sur fond teinté. Le rouge reste réservé aux définitions, aux axiomes et au logo. */
.menu-rubriques a::before {
  content: ""; position: absolute; left: 4px; top: 10px; bottom: 10px; width: 3px; border-radius: 2px; background: var(--r, var(--filet));
}
.menu-rubriques a[aria-current="page"] { background: var(--trame); }
.menu-rubriques a[aria-current="page"]::before { width: 4px; }
.menu-rubriques .m-titre { font-size: 14.5px; font-weight: 600; }
.menu-rubriques .m-desc { grid-column: 1 / -1; font-size: 12.5px; color: var(--encre-2); line-height: 1.4; }
.menu-rubriques .m-badge {
  align-self: center; font-family: var(--f-mono); font-size: 10px; letter-spacing: .05em; text-transform: uppercase;
  color: var(--encre-3); border: 1px solid var(--filet); border-radius: 999px; padding: 1px 7px;
}
.menu-rubriques hr { border: 0; border-top: 1px solid var(--filet); margin: 4px 8px; }

/* ================================================================ pages des rubriques */
body.en-rubrique .legende { display: none; }
.rubrique { min-height: 0; overflow: auto; background: var(--papier); }
.rubrique[hidden] { display: none; }
.rubrique:focus { outline: none; }   /* focus rendu à la rubrique au retour depuis l'édifice (tabindex -1) */
.page { max-width: 1180px; margin: 0 auto; padding: 28px 24px 72px; }
.page-tete { max-width: 52rem; margin-bottom: 22px; }
.page-tete h2 { font-family: var(--f-titre); font-weight: 600; font-size: 32px; line-height: 1.15; margin: 0 0 10px; }
.page-tete .chapeau { font-family: var(--f-texte); font-size: 17.5px; line-height: 1.55; color: var(--encre); }
.page-tete .chapeau p { margin: 0 0 .6em; }
.maquette {
  display: flex; gap: 10px; align-items: baseline; font-size: 13px; line-height: 1.5; color: var(--encre-2);
  border: 1px dashed var(--encre-3); border-radius: 8px; padding: 8px 12px; margin: 0 0 24px; background: var(--surface);
}
.ann-info { font-size: 13px; line-height: 1.5; color: var(--encre-2); margin: 0 0 20px; }
.maquette strong { font-family: var(--f-mono); font-size: 10.5px; letter-spacing: .06em; text-transform: uppercase; color: var(--rouge); font-weight: 600; white-space: nowrap; }
.carte { background: var(--surface); border: 1px solid var(--filet); border-radius: 10px; }
/* ---- Accueil */
.accueil .page { max-width: 1120px; }
.acc-hero { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 36px; align-items: center; padding: 18px 0 34px; }
.acc-hero h2 { font-family: var(--f-titre); font-weight: 600; font-size: clamp(34px, 4.6vw, 52px); line-height: 1.06; letter-spacing: -.01em; margin: 6px 0 16px; text-wrap: balance; }
.acc-hero h2 em { font-style: italic; color: var(--rouge); }
.acc-hero .chapeau { font-family: var(--f-texte); font-size: 18.5px; line-height: 1.6; max-width: 34rem; margin: 0 0 22px; }
.acc-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.acc-actions .bouton { font-size: 14.5px; padding: 9px 16px; text-decoration: none; }
.acc-carte-edifice { cursor: pointer; position: relative; display: block; padding: 14px 14px 10px; text-decoration: none; color: inherit; transition: border-color .15s, box-shadow .15s; }
.acc-carte-edifice:hover { border-color: var(--encre-3); box-shadow: var(--ombre); }
.acc-mini { display: block; width: 100%; height: auto; max-height: 440px; }
.acc-mini .ar { fill: none; stroke: var(--arete); stroke-width: 4.5; opacity: .8; }
.acc-mini .nd rect { fill: color-mix(in srgb, var(--c) 16%, var(--surface)); stroke: var(--c); stroke-width: 7; transition: fill .15s; }
.acc-mini .nd .pastille { fill: var(--c); stroke: none; }
.acc-mini a:hover rect, .acc-mini a:focus-visible rect { fill: color-mix(in srgb, var(--c) 55%, var(--surface)); }
.acc-mini a:focus-visible { outline: none; }
.acc-legende { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; font-size: 12.5px; color: var(--encre-2); padding: 8px 4px 0; border-top: 1px solid var(--filet); margin-top: 6px; }
.acc-legende b { font-family: var(--f-mono); font-weight: 600; color: var(--encre); }
.acc-section { margin: 26px 0 0; }
.acc-section > h3 { font-family: var(--f-ui); font-size: 12px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--encre-2); margin: 0 0 12px; }
.acc-rubriques { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 14px; }
/* Cinq rubriques sur une seule ligne dès que la page est assez large (11 nov. 2026, demande de l'auteur) : cartes resserrées. */
@media (min-width: 1040px) {
  .acc-rubriques { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; }
  .acc-rubriques .acc-rub { padding: 16px 14px 14px; }
  .acc-rubriques .acc-rub h4 { font-size: 19px; gap: 8px; } .acc-rubriques .acc-rub h4 svg.sym { width: 24px; height: 24px; }
  .acc-rubriques .acc-rub .r-chiffre { font-size: 21px; } .acc-rubriques .acc-rub p { font-size: 14.5px; }
  .acc-rubriques .acc-rub .r-pied { font-size: 12.5px; }
}
.acc-rub { display: flex; flex-direction: column; gap: 8px; padding: 18px 18px 16px; text-decoration: none; color: inherit; transition: border-color .15s, box-shadow .15s, transform .15s; }
.acc-rub:hover, .acc-rub:focus-visible { border-color: var(--encre-3); box-shadow: var(--ombre); transform: translateY(-1px); outline: none; }
.acc-rub .r-tete { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.acc-rub h4 { font-family: var(--f-titre); font-size: 22px; font-weight: 600; margin: 0; }
.acc-rub .r-chiffre { font-family: var(--f-mono); font-size: 26px; font-weight: 600; line-height: 1; color: var(--encre); }
.acc-rub .r-unite { font-size: 12.5px; color: var(--encre-2); margin-top: -4px; }
.acc-rub p { font-family: var(--f-texte); font-size: 15.5px; line-height: 1.5; margin: 0; color: var(--encre); flex: 1; }
.acc-rub .r-pied { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 13px; color: var(--encre-2); border-top: 1px solid var(--filet); padding-top: 9px; margin-top: 2px; }
.acc-rub .r-pied .fleche { color: var(--encre); font-weight: 600; }
.acc-rub.a-venir .r-chiffre { color: var(--encre-3); }
.acc-fil { display: grid; grid-template-columns: minmax(0,1fr) auto minmax(0,1fr) auto minmax(0,1fr); gap: 10px; align-items: stretch; padding: 18px; }
.acc-etape { display: flex; flex-direction: column; gap: 6px; padding: 12px 14px; border-radius: 8px; background: var(--papier); text-decoration: none; color: inherit; }
a.acc-etape:hover { background: var(--trame); }
.acc-etape .e-sorte { font-family: var(--f-mono); font-size: 10.5px; letter-spacing: .06em; text-transform: uppercase; color: var(--encre-2); }
.acc-etape .e-titre { font-family: var(--f-titre); font-size: 18px; font-weight: 600; line-height: 1.25; }
.acc-etape .e-detail { font-size: 13px; color: var(--encre-2); display: flex; flex-wrap: wrap; gap: 4px 10px; }
.acc-fleche { align-self: center; color: var(--encre-3); font-size: 22px; }
.acc-fil-note { font-family: var(--f-texte); font-size: 15.5px; line-height: 1.55; color: var(--encre); margin: 12px 2px 0; max-width: 52rem; }
.acc-pied a { color: var(--encre); text-decoration: none; font-weight: 500; }
.acc-pied a:hover { text-decoration: underline; }
.acc-pied { margin-top: 34px; padding-top: 14px; border-top: 1px solid var(--filet); font-size: 13px; color: var(--encre-2); display: flex; flex-wrap: wrap; gap: 6px 18px; justify-content: space-between; }
@media (max-width: 820px) {
  .acc-hero { grid-template-columns: 1fr; gap: 20px; padding-top: 4px; }
  .acc-fil { grid-template-columns: 1fr; }
  .acc-fleche { transform: rotate(90deg); justify-self: center; }
}

.titre-bloc { margin: 0 0 8px; font-size: 11.5px; letter-spacing: .07em; text-transform: uppercase; color: var(--encre-3); font-weight: 500; }
.puces-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.chip {
  border: 1px solid var(--filet); background: var(--surface); border-radius: 999px; padding: 4px 12px; cursor: pointer;
  font-size: 13px; color: var(--encre-2); display: inline-flex; gap: 6px; align-items: baseline;
}
.chip:hover { border-color: var(--encre-3); color: var(--encre); }
.chip[aria-pressed="true"] { background: var(--encre); border-color: var(--encre); color: var(--surface); }
.chip[aria-pressed="true"] .compte { color: inherit; opacity: .8; }
.chip .compte { font-family: var(--f-mono); font-size: 11px; color: var(--encre-3); }
.segments { display: inline-flex; border: 1px solid var(--filet); border-radius: 8px; padding: 3px; background: var(--surface); gap: 2px; }
.segments button { border: 0; background: none; border-radius: 6px; padding: 5px 12px; font-size: 13.5px; cursor: pointer; color: var(--encre-2); }
.segments button[aria-pressed="true"] { background: var(--trame); color: var(--encre); font-weight: 600; }
.statut {
  font-family: var(--f-mono); font-size: 10.5px; letter-spacing: .05em; text-transform: uppercase; white-space: nowrap;
  border: 1px dashed var(--encre-3); color: var(--encre-3); border-radius: 999px; padding: 1px 8px;
}
.statut.depose { border-style: solid; border-color: var(--c-ana); color: var(--c-ana); }
.bouton {
  display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--filet); background: var(--surface);
  color: var(--encre); border-radius: 6px; padding: 6px 12px; font-size: 13.5px; cursor: pointer; text-decoration: none;
}
.bouton:hover { border-color: var(--encre-3); }
.bouton[aria-disabled="true"] { color: var(--encre-3); border-style: dashed; cursor: not-allowed; }
.bouton.plein { background: var(--encre); border-color: var(--encre); color: var(--surface); }
.lien-simple { color: var(--encre); text-decoration: underline; text-decoration-color: var(--encre-3); text-underline-offset: 3px; }
.mini-theorie { display: inline-flex; align-items: center; gap: 5px; font-size: 12.5px; color: var(--encre-2); }
.mini-theorie::before { content: ""; width: 8px; height: 8px; border-radius: 2px; background: var(--c); }
.vide-note { color: var(--encre-3); font-size: 13px; font-style: italic; }

/* ---- cours : catalogue */
.cours-filtres { display: flex; flex-wrap: wrap; gap: 12px 20px; align-items: center; margin-bottom: 22px; }
.niveau { margin: 0 0 28px; }
.niveau-tete { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; margin: 0 0 10px; }
.niveau-tete h3 { font-family: var(--f-titre); font-size: 22px; font-weight: 600; margin: 0; }
.niveau-tete span { font-size: 13.5px; color: var(--encre-2); }
.chapitres { list-style: none; margin: 0; padding: 0; overflow: hidden; }
.chapitres li + li { border-top: 1px solid var(--filet); }
.chapitre {
  display: grid; grid-template-columns: 48px minmax(0, 1fr) minmax(0, 220px) auto; gap: 6px 16px; align-items: center;
  padding: 12px 16px; color: inherit; text-decoration: none;
}
.chapitre:hover { background: var(--papier); }
.chapitre .num { font-family: var(--f-titre); font-size: 24px; color: var(--encre-2); text-align: center; }
.chapitre .ch-titre { font-family: var(--f-titre); font-size: 18px; font-weight: 600; display: block; }
.chapitre .ch-resume { font-size: 13.5px; color: var(--encre-2); display: block; margin-top: 2px; }
.chapitre .ch-theories { display: flex; flex-wrap: wrap; gap: 4px 12px; }
.bientot { font-size: 13.5px; color: var(--encre-2); border-top: 1px solid var(--filet); padding-top: 14px; }

/* ---- cours : lecture d'un chapitre */
.lecture { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 24px; align-items: start; }
.lecteur { overflow: hidden; overflow: clip; }   /* clip : coins arrondis sans bloquer le bouton collant */
.lecteur-barre {
  display: flex; flex-wrap: wrap; gap: 8px; align-items: center; justify-content: space-between;
  padding: 8px 10px; border-bottom: 1px solid var(--filet); font-size: 13px; color: var(--encre-2);
}
.lecteur-barre .groupe { display: flex; gap: 6px; align-items: center; }
.lecteur-fond { background: var(--trame); padding: 28px 16px; display: flex; justify-content: center; }
.lecteur-pages { flex-direction: column; align-items: center; gap: 16px; padding: 16px; min-height: 300px; }
.page-pdf { width: 100%; height: auto; background: #fff; box-shadow: var(--ombre); display: block; }
.feuille-a4 {
  width: min(100%, 560px); aspect-ratio: 1 / 1.414; background: #fff; color: #1b1e24; box-shadow: var(--ombre);
  padding: 9% 10%; display: flex; flex-direction: column; gap: 10px; font-family: var(--f-texte);
}
.feuille-a4 .fa-titre { font-size: clamp(15px, 2.6vw, 22px); font-weight: 600; text-align: center; margin-bottom: 6px; }
.feuille-a4 .fa-ligne { height: 7px; border-radius: 3px; background: #e6e8ec; }
.feuille-a4 .fa-cadre { border-left: 3px double #c00; padding: 8px 10px; display: grid; gap: 7px; }
.feuille-a4 .fa-note { margin-top: auto; text-align: center; font-family: var(--f-ui); font-size: 12.5px; color: #7c838e; }
.cote { display: grid; gap: 14px; position: sticky; top: 16px; align-content: start;
  /* Colonne défilable à part : on atteint le bas sans faire défiler tout le PDF. */
  max-height: calc(100vh - 104px); max-height: calc(100dvh - 104px); overflow-y: auto; overscroll-behavior: contain;
  scrollbar-width: thin; padding: 2px 4px 2px 2px; margin: -2px -4px -2px -2px; }
/* Téléphone : bouton posé sur le visualiseur, qui mène au sommaire et aux liens placés sous le PDF. */
.lecteur-raccourci, .cote-retour { display: none; }
.cote .carte { padding: 14px 16px; }
.sommaire { margin: 0; padding-left: 20px; font-family: var(--f-texte); font-size: 15.5px; display: grid; gap: 4px; }
/* Partie du sommaire : mène à sa page dans le visualiseur. */
.sommaire .vers-page { all: unset; cursor: pointer; display: block; text-align: left; border-radius: 3px; }   /* bloc : un bouton en ligne alignerait le numéro sur sa dernière ligne */
.sommaire .vers-page:hover, .sommaire .vers-page:focus-visible { color: var(--rouge); text-decoration: underline; text-underline-offset: 3px; }
.sommaire .vers-page:focus-visible { outline: 2px solid var(--rouge); outline-offset: 2px; }
.sommaire .num-page { font-family: var(--f-ui); font-size: 12px; color: var(--encre-3); margin-left: 6px; white-space: nowrap; }
.cours-lies { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; font-size: 14.5px; }
.cours-lie { display: block; color: var(--encre); text-decoration: none; }
.cours-lies .cl-lieu { display: block; font-size: 12px; color: var(--encre-2); letter-spacing: .02em; }
.cours-lie .cl-titre { text-decoration: underline; text-decoration-color: var(--encre-3); text-underline-offset: 3px; }
.cours-lie:hover .cl-titre { text-decoration-color: currentColor; }
.voisins { display: flex; justify-content: space-between; gap: 12px; margin-top: 20px; font-size: 13.5px; }
.voisins a { color: var(--encre-2); text-decoration: none; }
.voisins a:hover { color: var(--encre); }

/* ---- exercices */
.banque { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: 24px; align-items: start; }
.filtres { padding: 14px 16px; display: grid; grid-template-columns: minmax(0, 1fr); gap: 18px; position: sticky; top: 16px;
  /* Colonne défilable à part, comme .cote : on atteint le bas des filtres sans faire défiler la banque. */
  max-height: calc(100vh - 104px); max-height: calc(100dvh - 104px); overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; }
.filtres > div { min-width: 0; }
.filtres label { display: flex; gap: 8px; align-items: center; font-size: 13.5px; cursor: pointer; }
.filtres select { width: 100%; max-width: 100%; font: inherit; font-size: 13.5px; padding: 5px 6px; border: 1px solid var(--filet); border-radius: 6px; background: var(--surface); color: var(--encre); }
.niveaux-diff { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; }
.niveaux-diff button { min-width: 0; border: 1px solid var(--filet); background: var(--surface); border-radius: 6px; padding: 6px 0; cursor: pointer; }
.niveaux-diff button[aria-pressed="true"] { border-color: var(--encre); box-shadow: inset 0 0 0 1px var(--encre); }
.niveaux-diff button:disabled { opacity: .35; cursor: default; }
.difficulte { display: inline-flex; gap: 3px; vertical-align: middle; }
.difficulte i { width: 14px; height: 6px; border-radius: 2px; background: var(--trame); border: 1px solid var(--filet); }
.difficulte i.plein { background: var(--encre-2); border-color: var(--encre-2); }
.resultats-tete { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; justify-content: space-between; margin-bottom: 12px; font-size: 13.5px; color: var(--encre-2); }
.bandeau-filtre { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; background: var(--surface); border: 1px solid var(--filet); border-left: 3px solid var(--rouge); border-radius: 6px; padding: 8px 12px; margin-bottom: 12px; font-size: 13.5px; }
.exo { padding: 16px 18px 12px; margin-bottom: 14px; scroll-margin-top: 16px; }
.lien-exo { color: inherit; text-decoration: none; }
.lien-exo:hover { text-decoration: underline; text-decoration-color: var(--encre-3); text-underline-offset: 4px; }
.exo-titre { font-family: var(--f-ui); font-size: 13.5px; font-weight: 500; color: var(--encre-2); margin-left: 6px; }
.tete-recherche { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 8px; min-height: 28px; }
.tete-recherche .titre-bloc { margin: 0; }
.effacer-recherche-exo { display: inline-flex; align-items: center; gap: 5px; font-size: 12.5px; font-weight: 600; padding: 4px 10px; background: var(--encre); border-color: var(--encre); color: var(--surface); }
.effacer-recherche-exo:hover { background: var(--encre-2); border-color: var(--encre-2); }
.effacer-recherche-exo svg { width: 14px; height: 14px; flex: none; }
.recherche-exo { width: 100%; box-sizing: border-box; padding: 7px 10px; border: 1px solid var(--filet); border-radius: 6px; background: var(--papier); color: var(--encre); font: inherit; font-size: 13.5px; }
.chip.cache { display: none; }
.themes .chip { font-size: 12.5px; padding: 3px 10px; text-align: left; }
button.lien-simple { border: 0; background: none; padding: 0; cursor: pointer; font: inherit; font-size: 13px; color: var(--encre-2); }
.plus-themes { margin-top: 8px; }
.mot-cle { border: 1px solid var(--filet); background: var(--papier); color: var(--encre-2); border-radius: 4px; padding: 1px 7px; font-size: 12px; cursor: pointer; }
.mot-cle:hover, .mot-cle[aria-pressed="true"] { border-color: var(--encre-3); color: var(--encre); }
.exo-liens { display: flex; flex-wrap: wrap; gap: 6px; margin-left: auto; }
.exo-liens .bouton { font-size: 12.5px; padding: 4px 10px; }
.exo-atlas { display: flex; flex-wrap: wrap; gap: 6px 10px; align-items: center; margin-top: 10px; font-size: 13px; color: var(--encre-3); }
.exo-tete { display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: center; margin-bottom: 4px; }
.exo-tete h3 { font-family: var(--f-titre); font-size: 19px; margin: 0; }
.exo-meta { font-size: 13px; color: var(--encre-2); margin-bottom: 10px; }
.etiquette-type { font-size: 11.5px; border-radius: 4px; padding: 1px 7px; background: var(--trame); color: var(--encre-2); }
.exo-enonce { font-family: var(--f-texte); font-size: 16.5px; line-height: 1.55; }
.exo-enonce p { margin: 0 0 .6em; }
.exo-pied { display: flex; flex-wrap: wrap; gap: 8px 16px; align-items: center; border-top: 1px solid var(--filet); margin-top: 10px; padding-top: 10px; font-size: 13px; }
.exo-pied .notions { display: flex; flex-wrap: wrap; gap: 6px 12px; align-items: center; flex: 1; min-width: 200px; }
.exo .corrige { margin-top: 14px; }
.exo .corrige summary { cursor: pointer; font-size: 13.5px; font-weight: 600; list-style: none; display: inline-block;
  padding: 5px 12px; border-radius: 6px; background: var(--corrige-fond); color: var(--corrige-filet);
  border: 1px solid color-mix(in srgb, var(--corrige-filet) 35%, transparent); }
.exo .corrige summary:hover { border-color: var(--corrige-filet); }
.exo .corrige[open] summary { border-radius: 6px 6px 0 0; border-bottom-color: transparent; }
.exo .corrige summary::-webkit-details-marker { display: none; }
.exo .corrige summary::before { content: "+ "; font-family: var(--f-mono); color: inherit; }
.exo .corrige[open] summary::before { content: "− "; }
.exo .corrige .contenu { font-family: var(--f-texte); font-size: 16px; line-height: 1.55; padding: 12px 16px 6px;
  background: var(--corrige-fond); border-left: 3px solid var(--corrige-filet); border-radius: 0 6px 6px 6px; }
.exo .corrige .contenu p { margin: 0 0 .6em; }
/* Corrigé question par question, suivi des exercices (domaine À propos – apparence, MEMO_atlas_apropos.md §63) */
.corr-etape + .corr-etape { border-top: 1px dashed color-mix(in srgb, var(--corrige-filet) 35%, transparent); padding-top: .6em; }
.corr-suite { display: flex; flex-wrap: wrap; gap: 8px 16px; align-items: center; margin: 4px 0 10px; font-family: var(--f-ui); font-size: 13.5px; }
.corr-suite .bouton { font-size: 13.5px; padding: 5px 12px; color: var(--corrige-filet); border-color: color-mix(in srgb, var(--corrige-filet) 45%, transparent); background: var(--surface); }
.corr-suite .bouton:hover { border-color: var(--corrige-filet); }
.corr-suite .cs-n { color: var(--encre-3); font-weight: 400; margin-left: 4px; font-size: 12.5px; }
.exo-suivi { display: flex; gap: 6px; }
.exo-suivi button { font: inherit; font-size: 12.5px; padding: 3px 10px; border-radius: 999px; border: 1px solid var(--filet); background: var(--surface); color: var(--encre-2); cursor: pointer; }
.exo-suivi button:hover { border-color: var(--encre-3); color: var(--encre); }
.exo-suivi [data-suivi="fait"][aria-pressed="true"] { background: var(--corrige-fond); border-color: var(--corrige-filet); color: var(--corrige-filet); font-weight: 600; }
.exo-suivi [data-suivi="revoir"][aria-pressed="true"] { background: var(--revoir-fond); border-color: var(--revoir); color: var(--revoir); font-weight: 600; }
.exo[data-suivi] .exo-tete h3::after { font-family: var(--f-ui); font-size: 12px; font-weight: 600; margin-left: 10px; padding: 2px 8px; border-radius: 999px; vertical-align: 2px; }
.exo[data-suivi="fait"] .exo-tete h3::after { content: "✓ fait"; background: var(--corrige-fond); color: var(--corrige-filet); }
.exo[data-suivi="revoir"] .exo-tete h3::after { content: "↻ à revoir"; background: var(--revoir-fond); color: var(--revoir); }
.chip[data-filtre="suivi"] i { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 6px; vertical-align: 1px; border: 1.5px solid var(--encre-3); }
.chip[data-filtre="suivi"][value="fait"] i { background: var(--corrige-filet); border-color: var(--corrige-filet); }
.chip[data-filtre="suivi"][value="revoir"] i { background: var(--revoir); border-color: var(--revoir); }
.suivi-jauge { display: flex; align-items: center; gap: 10px; font-family: var(--f-ui); font-size: 12.5px; color: var(--encre-2); }
.suivi-jauge[hidden] { display: none; }
.sj-barre { display: flex; flex: 1; min-width: 70px; max-width: 220px; height: 6px; border-radius: 3px; background: var(--trame); overflow: hidden; }
.sj-f { background: var(--corrige-filet); }
.sj-r { background: var(--revoir); }
.bandeau-filtre .suivi-jauge { flex: 1 1 160px; }
.feuilles { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 14px; }
.niveau-exos + .niveau-exos { margin-top: 28px; }
.niveaux-exos { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 14px; }
.niveau-exo { position: relative; display: flex; flex-direction: column; gap: 8px; padding: 18px 20px; color: inherit; text-decoration: none; }
.niveau-exo h3, .niveau-exos-tete h3 { margin: 0; font-family: var(--f-titre); font-size: 22px; }
.niveau-exo p, .niveau-exos-tete p { margin: 0; font-size: 14px; color: var(--encre-2); }
.niveau-exo .fleche { position: absolute; top: 18px; right: 20px; color: var(--encre-3); }
a.niveau-exo:hover { border-color: var(--encre-3); }
.niveau-exos-chiffres { font-size: 13px !important; color: var(--encre) !important; }
.niveau-exos-tete { display: flex; flex-wrap: wrap; gap: 14px; align-items: flex-end; justify-content: space-between; padding: 18px 20px; margin-bottom: 16px; }
.niveau-exos-tete > div { display: grid; gap: 8px; min-width: 240px; flex: 1; }
.feuille { padding: 16px 18px; display: flex; flex-direction: column; gap: 10px; }
.feuille h3 { font-family: var(--f-titre); font-size: 19px; margin: 0; display: flex; align-items: center; gap: 10px; }
.feuille h3 svg.sc { width: 32px; height: 32px; flex: none; }
.repartition { display: flex; height: 8px; border-radius: 4px; overflow: hidden; background: var(--trame); }
.repartition span { display: block; }
.repartition-legende { display: flex; flex-wrap: wrap; gap: 4px 12px; font-size: 12px; color: var(--encre-2); }
.parties { margin: 0; padding-left: 18px; font-size: 13.5px; color: var(--encre-2); display: grid; gap: 2px; }
.feuille .actions { display: flex; flex-wrap: wrap; gap: 6px; margin-top: auto; align-items: center; }
.repartition-legende .pastille-diff { display: inline-block; width: 10px; height: 10px; border-radius: 2px; margin-right: 4px; vertical-align: -1px; }

/* ---- annales */
.annales-barre { display: flex; flex-wrap: wrap; gap: 12px 20px; align-items: center; margin-bottom: 16px; }
.grille-wrap { overflow-x: auto; scrollbar-width: none; overscroll-behavior-x: contain; }
.grille-wrap::-webkit-scrollbar { display: none; }
.grille { border-collapse: separate; border-spacing: 0; width: max-content; min-width: 100%; font-size: 13.5px; }
.grille thead th:first-child, .grille tbody th { position: sticky; left: 0; z-index: 2; background: var(--surface); box-shadow: 1px 0 0 var(--filet); }
.grille td, .grille thead th:not(:first-child) { min-width: 150px; }
/* curseur de défilement des années */
.defil-annees { display: flex; align-items: center; gap: 10px; flex: 1 1 260px; min-width: 220px; margin-left: auto; font-family: var(--f-mono); font-size: 12px; color: var(--encre-2); }
.defil-annees input[type=range] { flex: 1; min-width: 120px; accent-color: var(--encre-2); cursor: ew-resize; }
.defil-annees .bout { white-space: nowrap; }
.defil-annees .visible { white-space: nowrap; color: var(--encre); min-width: 92px; text-align: center; }
.defil-annees button { border: 1px solid var(--filet); background: var(--surface); color: var(--encre-2); border-radius: 6px; width: 26px; height: 26px; cursor: pointer; line-height: 1; }
.defil-annees button:hover { color: var(--encre); border-color: var(--encre-3); }
.defil-annees button:disabled { opacity: .35; cursor: default; }
@media (max-width: 640px) {
  .grille-wrap .grille tbody th { white-space: normal; width: 96px; min-width: 96px; max-width: 96px; padding-right: 8px; }
  .grille-wrap .grille tbody th small { display: none; }
  .grille td, .grille thead th:not(:first-child) { min-width: 132px; }
  .defil-annees .visible { display: none; }
}
.grille th, .grille td { padding: 10px 12px; border-bottom: 1px solid var(--filet); text-align: left; vertical-align: top; }
.grille thead th { font-family: var(--f-mono); font-size: 11.5px; font-weight: 500; color: var(--encre-3); letter-spacing: .05em; position: sticky; top: 0; background: var(--surface); }
.grille tbody tr:last-child td, .grille tbody tr:last-child th { border-bottom: 0; }
.grille tbody th { font-weight: 600; white-space: nowrap; }
.grille tbody th small { display: block; font-weight: 400; color: var(--encre-3); font-size: 12px; white-space: normal; }
.cases { display: flex; gap: 4px; flex-wrap: wrap; }
.case {
  min-width: 30px; height: 28px; padding: 0 6px; border-radius: 6px; border: 1px dashed var(--encre-3); background: none;
  color: var(--encre-3); font-family: var(--f-mono); font-size: 11.5px; cursor: pointer;
}
.case:hover { border-style: solid; color: var(--encre); }
.case.present { border: 1px solid var(--c-ana); color: var(--encre); background: color-mix(in srgb, var(--c-ana) 12%, var(--surface)); }
a.case.present { text-decoration: none; display: inline-grid; place-items: center; }
a.case.present:hover { background: color-mix(in srgb, var(--c-ana) 26%, var(--surface)); }
.case.attente { border: 1px dashed var(--choix); color: var(--choix); background: var(--choix-fond); }
span.case { cursor: default; display: inline-grid; place-items: center; }
span.case:hover { border-style: dashed; color: inherit; }
table.grille .pli-tete { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; }
table.grille button.pli-tout { flex: none; display: inline-flex; align-items: center; gap: 6px; margin: -3px 0 -3px 0; padding: 2px 3px 2px 8px; border: 1px solid var(--encre-3); border-radius: 6px; background: var(--surface); color: var(--encre-2); font: 500 11.5px/1.2 var(--f-mono); letter-spacing: 0; text-transform: none; cursor: pointer; }
table.grille button.pli-tout:hover { color: var(--encre); border-color: var(--encre); }
.pli-signe { display: inline-grid; place-items: center; width: 16px; height: 16px; border-radius: 4px; background: color-mix(in srgb, var(--encre) 10%, transparent); color: var(--encre); font: 600 13px/1 var(--f-mono); }
@media (max-width: 640px) { table.grille .pli-txt { display: none; } table.grille button.pli-tout { padding: 2px 3px; } }
.aide-pli { margin: 14px 0 8px; font-size: 13px; color: var(--encre-2); }
.aide-pli .pli-signe { width: 18px; height: 18px; border: 1px solid var(--encre-3); background: var(--surface); vertical-align: -3px; }
.grille .pastilles { display: inline-flex; flex-wrap: wrap; gap: 3px; padding: 3px 0; cursor: pointer; }
.grille .pastille { width: 13px; height: 10px; border-radius: 3px; border: 1px solid var(--c-ana); background: color-mix(in srgb, var(--c-ana) 30%, var(--surface)); }
.grille .pastille:hover { background: var(--c-ana); }
/* lignes repliables : colonnes étroites tant qu'aucune ligne n'est ouverte, largeur normale dès qu'une l'est */
.grille.grille-pli td, .grille.grille-pli thead th:not(:first-child) { min-width: 96px; }
.grille.grille-pli tbody tr:not(.replie) td { min-width: 150px; }
@media (max-width: 640px) { .grille.grille-pli td, .grille.grille-pli thead th:not(:first-child) { min-width: 84px; } .grille.grille-pli tbody tr:not(.replie) td { min-width: 132px; } }
table.grille button.pli-ann { flex: none; display: inline-grid; place-items: center; width: 22px; height: 22px; margin: -2px 8px 0 0; padding: 0; vertical-align: middle; border: 1px solid var(--encre-3); border-radius: 6px; background: var(--surface); color: var(--encre); font: 600 15px/1 ui-monospace, monospace; cursor: pointer; }
table.grille .pli-tete button.pli-ann { margin: -1px 0 0; order: 2; }
table.grille button.pli-ann:hover { border-color: var(--encre); }
.grille .pli-ann:focus-visible { outline: 2px solid var(--accent, currentColor); outline-offset: 2px; }
.grille tr.replie th, .grille tr.replie td { padding-top: 8px; padding-bottom: 8px; }
.grille .nb-replie { font-size: 12px; color: var(--encre-2); }
.legende-annales a { color: inherit; text-decoration: underline; text-decoration-color: var(--filet); text-underline-offset: 3px; }
.legende-annales a:hover { text-decoration-color: currentColor; }
.grille .rapports { margin-top: 6px; font-size: 12px; line-height: 1.5; }
.grille .rapports a { color: var(--encre-2); text-decoration: underline; text-decoration-color: var(--filet); text-underline-offset: 3px; }
.grille .hors { color: var(--encre-3, var(--encre-2)); opacity: .55; font-size: 13px; padding-left: 4px; }
.grille .source-ann { margin-top: 2px; color: var(--encre-2); }
.grille .rapports a:hover { color: var(--encre); text-decoration-color: currentColor; }
.case[aria-pressed="true"] { box-shadow: 0 0 0 2px var(--rouge); }
.rech-ann { padding: 18px 20px; margin: 26px 0 8px; }
.rech-ann .rech-tete { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.rech-ann .rech-effacer { font-size: 13.5px; font-weight: 600; background: var(--encre); border-color: var(--encre); color: var(--surface); padding: 7px 14px; box-shadow: 0 1px 0 rgba(0,0,0,.25); }
.rech-ann .rech-effacer:hover { background: var(--encre-2); border-color: var(--encre-2); }
.rech-ann .rech-effacer:focus-visible { outline: 2px solid var(--encre-2); outline-offset: 2px; }
.rech-ann .rech-effacer svg { width: 16px; height: 16px; flex: none; }
.rech-ann .rech-effacer[hidden] { display: none; }
.rech-periode { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--encre-2); }
.rech-themes .sous { flex-basis: 100%; display: flex; flex-wrap: wrap; gap: 6px 8px; align-items: baseline; margin-top: 2px; }
.rech-themes .sous .chip { font-size: 12px; padding-top: 2px; padding-bottom: 2px; }
.rech-themes .sous .chip small, .rech-domaines .chip small { color: var(--encre-3); margin-left: 4px; }
.rech-ann h3 { margin: 0 0 4px; font-size: 17px; }
.rech-ann .rech-aide { margin: 0 0 12px; color: var(--encre-2); font-size: 13.5px; }
.rech-ligne { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.rech-ligne input[type=search] { flex: 1 1 280px; min-width: 0; padding: 9px 12px; border: 1px solid var(--filet); border-radius: 8px; background: var(--papier); color: var(--encre); font: inherit; font-size: 15px; }
.rech-ligne input[type=search]:focus { outline: 2px solid var(--encre-3); outline-offset: 1px; }
.rech-ligne select { padding: 8px 8px; border: 1px solid var(--filet); border-radius: 8px; background: var(--papier); color: var(--encre); font: inherit; font-size: 13.5px; }
.rech-themes { margin-top: 12px; display: flex; flex-wrap: wrap; gap: 6px 8px; align-items: baseline; font-size: 13px; color: var(--encre-2); }
.rech-themes .chip { font-size: 12.5px; }
.rech-themes .edif { font-size: 12px; color: var(--encre-2); text-decoration: underline; text-decoration-color: var(--filet); text-underline-offset: 3px; }
.rech-domaines { margin-top: 14px; columns: 3 260px; column-gap: 20px; }
/* colonnes équilibrées (à la manière d'un mur de briques) : un domaine ne se coupe pas d'une colonne à l'autre */
.rech-domaines > div { break-inside: avoid; margin-bottom: 14px; }
.rech-domaines h4 { margin: 0 0 8px; padding: 0 0 4px 9px; font-size: 13px; font-family: var(--f-mono); font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: color-mix(in srgb, var(--dc, var(--encre-2)) 72%, var(--encre)); border-left: 3px solid var(--dc, var(--ligne)); border-bottom: 1px solid color-mix(in srgb, var(--dc, var(--encre-3)) 35%, transparent); }
.rech-domaines .puces-chips { gap: 5px; }
.rech-domaines .chip { text-align: left; }
.rech-domaines .chip small { color: var(--encre-3); margin-left: 4px; }
.rech-bilan { margin: 16px 0 8px; font-size: 13.5px; color: var(--encre-2); }
.res-ann { padding: 14px 16px; margin-top: 10px; }
.res-ann .res-tete { display: flex; flex-wrap: wrap; gap: 6px 12px; align-items: baseline; justify-content: space-between; }
.res-ann .res-conc { font-family: var(--f-mono); font-size: 12px; color: var(--encre-2); letter-spacing: .02em; }
.res-ann h4 { margin: 4px 0 4px; font-size: 16px; }
.res-ann h4 a { color: inherit; text-decoration: none; }
.res-ann h4 a:hover { text-decoration: underline; }
.res-ann .res-resume { margin: 0 0 8px; font-size: 14px; color: var(--encre-2); line-height: 1.5; }
.res-parties { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.res-parties li { border-left: 3px solid var(--corrige-filet); padding: 3px 0 3px 10px; font-size: 13.5px; }
.res-parties li.sec { border-left-color: var(--filet); }
.res-parties a.partie { color: var(--encre); font-weight: 600; text-decoration: none; }
.res-parties a.partie:hover { text-decoration: underline; }
.res-parties .pp { font-family: var(--f-mono); font-size: 11.5px; color: var(--encre-3); margin-left: 6px; }
.res-parties .tt { display: block; margin-top: 2px; color: var(--encre-2); font-size: 12.5px; }
.res-parties .tt b { color: var(--encre); font-weight: 600; }
.f-ann { white-space: nowrap; }
.res-parties mark, .res-ann mark { background: var(--choix-fond); color: inherit; border-radius: 3px; padding: 0 2px; }
.res-autres { font-size: 12.5px; color: var(--encre-3); margin-top: 6px; }
.res-plus { margin-top: 12px; }
.presentation-ann { margin: -6px 0 18px; }
.presentation-ann > summary { cursor: pointer; display: inline-flex; align-items: center; gap: 6px; font-size: 13.5px; color: var(--encre-2); padding: 4px 10px; border: 1px solid var(--filet); border-radius: 999px; list-style: none; }
.presentation-ann > summary::-webkit-details-marker { display: none; }
.presentation-ann > summary::before { content: '▸'; font-size: 11px; transition: transform .15s; }
.presentation-ann[open] > summary::before { transform: rotate(90deg); }
.presentation-ann > summary:hover { color: var(--encre); border-color: var(--encre-3); }
.presentation-ann .chapeau { margin-top: 12px; }
.vue-ann button { display: inline-flex; align-items: center; gap: 6px; }
.vue-ann svg { width: 14px; height: 14px; fill: currentColor; }
.liste-ann .la-bilan { font-size: 13.5px; color: var(--encre-2); margin: 0 0 10px; }
.la-annees { display: flex; flex-wrap: wrap; gap: 5px; margin-bottom: 8px; position: sticky; top: 0; z-index: 3; background: var(--papier); padding: 6px 0; }
.la-annees .chip { font-family: var(--f-mono); font-size: 12px; }
.la-annees .chip.decrite { border-color: var(--corrige-filet); color: var(--encre); }
.la-annees .chip.decrite::after { content: ''; display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--corrige-filet); margin-left: 5px; vertical-align: middle; }
.liste-ann .la-bilan a { color: var(--encre); }
.la-an h3 { font-family: var(--f-titre); font-size: 20px; margin: 22px 0 6px; scroll-margin-top: 64px; }
.fiche-ann { padding: 14px 16px; margin-top: 10px; }
.fiche-ann .fa-tete { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: center; justify-content: space-between; }
.fiche-ann .fa-liens { display: flex; flex-wrap: wrap; gap: 6px; }
.fiche-ann .fa-liens .bouton { font-size: 12.5px; padding: 4px 10px; }
.fiche-ann h4 { margin: 8px 0 4px; font-size: 16px; }
.fiche-ann .fa-vide, .fiche-ann .fa-source { margin: 8px 0 0; font-size: 13px; color: var(--encre-3); }
.fiche-ann .fa-source a { color: var(--encre-2); }
.fiche-ann .fa-themes { display: flex; flex-wrap: wrap; gap: 5px; margin: 6px 0 4px; }
.fiche-ann .fa-themes .chip { font-size: 12px; padding-top: 2px; padding-bottom: 2px; }
.fa-parties { margin-top: 6px; }
.fa-parties summary { cursor: pointer; font-size: 13px; color: var(--encre-2); padding: 4px 0; }
.fa-parties summary:hover { color: var(--encre); }
.fa-parties .res-parties { margin-top: 6px; }
.fiches-ann a { color: var(--encre-2); }
.res-ann .lien-fiche { font-size: 12.5px; color: var(--encre-2); text-decoration: underline; text-decoration-color: var(--filet); text-underline-offset: 3px; }
.panneau-ann { position: fixed; inset: 0; z-index: 50; display: flex; justify-content: flex-end; }
.panneau-ann .pa-fond { position: absolute; inset: 0; background: rgba(0, 0, 0, .45); }
.panneau-ann .pa-corps { position: relative; width: min(640px, 100%); height: 100%; overflow-y: auto; background: var(--papier); border-left: 1px solid var(--filet); padding: 48px 18px 24px; box-sizing: border-box; animation: pa-entree .18s ease-out; }
.panneau-ann .fiche-ann { margin: 0; }
.panneau-ann .pa-fermer { position: absolute; top: 8px; right: 12px; width: 32px; height: 32px; border-radius: 6px; border: 1px solid var(--filet); background: var(--surface); color: var(--encre); font-size: 20px; line-height: 1; cursor: pointer; }
@keyframes pa-entree { from { transform: translateX(24px); opacity: 0; } to { transform: none; opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .panneau-ann .pa-corps { animation: none; } }
.legende-annales { display: flex; flex-wrap: wrap; gap: 6px 18px; font-size: 12.5px; color: var(--encre-2); margin-top: 10px; }
.tiroir { margin-top: 18px; padding: 18px 20px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px 28px; }
.tiroir h3 { grid-column: 1 / -1; font-family: var(--f-titre); font-size: 22px; margin: 0; }
.tiroir .sur-titre { grid-column: 1 / -1; margin-bottom: -10px !important; }
.tiroir dl { margin: 0; display: grid; grid-template-columns: auto 1fr; gap: 8px 14px; font-size: 13.5px; align-items: center; }
.tiroir dt { color: var(--encre-3); }
.tiroir dd { margin: 0; }

/* ---- application installable : invitation à installer */
.appli-encart {
  position: fixed; z-index: 60; left: 12px; right: 12px; bottom: calc(12px + env(safe-area-inset-bottom, 0px));
  max-width: 520px; margin: 0 auto; display: flex; align-items: center; gap: 12px; padding: 12px 12px 12px 14px;
  background: var(--surface); color: var(--encre); border: 1px solid var(--filet); border-radius: 12px;
  box-shadow: 0 8px 28px rgba(0, 0, 0, .18); font-size: 14px; line-height: 1.4; animation: ae-entree .2s ease-out;
}
.appli-encart img { border-radius: 9px; flex: none; }
.appli-encart p { margin: 0; flex: 1; }
.appli-encart .ae-partage { width: 17px; height: 17px; vertical-align: -3px; color: #0a84ff; }
.appli-encart .ae-installer { flex: none; font: inherit; font-weight: 600; padding: 7px 14px; border-radius: 8px; border: 0; background: var(--encre); color: var(--papier); cursor: pointer; }
.appli-encart .ae-fermer { flex: none; width: 30px; height: 30px; border-radius: 8px; border: 0; background: transparent; color: var(--encre-2); font-size: 22px; line-height: 1; cursor: pointer; }
@keyframes ae-entree { from { transform: translateY(16px); opacity: 0; } to { transform: none; opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .appli-encart { animation: none; } }

/* ---- à propos */
.apropos { display: grid; grid-template-columns: 280px minmax(0, 1fr); gap: 32px; align-items: start; }
.profil { padding: 22px; text-align: center; position: sticky; top: 16px; }
.portrait {
  width: 120px; height: 120px; border-radius: 50%; margin: 0 auto 14px; display: grid; place-items: center;
  font-family: var(--f-titre); font-size: 40px; color: var(--encre-2); background: var(--trame); border: 1px dashed var(--encre-3);
}
.profil h3 { font-family: var(--f-titre); font-size: 22px; margin: 0; }
.profil .fonction { color: var(--encre-2); font-size: 14px; margin: 2px 0 16px; }
.chiffres { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; text-align: left; border-top: 1px solid var(--filet); padding-top: 14px; }
.chiffres div { font-size: 12px; color: var(--encre-2); }
.chiffres b { display: block; font-family: var(--f-titre); font-size: 22px; color: var(--encre); font-weight: 600; }
.texte-auteur section { margin-bottom: 26px; }
.texte-auteur h3 { font-family: var(--f-titre); font-size: 22px; margin: 0 0 8px; display: flex; gap: 10px; align-items: baseline; }
.texte-auteur .corps-texte { font-family: var(--f-texte); font-size: 17px; line-height: 1.6; }
.texte-auteur .corps-texte p { margin: 0 0 .7em; }
.texte-auteur .a-rediger .corps-texte { color: var(--encre-3); border: 1px dashed var(--encre-3); border-radius: 8px; padding: 12px 14px; }
.portrait.a-photo { width: 140px; height: 140px; border: 2px solid var(--filet); background: var(--trame); overflow: hidden; }
.portrait.a-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.apropos-mention { margin: 28px 0 0; font-size: 12.5px; font-style: italic; color: var(--encre-3); }
.profil .etablissement { color: var(--encre-3); font-size: 13px; margin: -10px 0 16px; }
.apropos-sommaire { display: flex; flex-direction: column; gap: 2px; text-align: left; border-top: 1px solid var(--filet); margin-top: 14px; padding-top: 10px; }
.apropos-sommaire a { color: var(--encre-2); text-decoration: none; font-size: 13.5px; padding: 4px 8px; border-radius: 6px; }
.apropos-sommaire a:hover { background: var(--trame); color: var(--encre); }
.texte-auteur section { scroll-margin-top: 72px; }
.apropos-frise { list-style: none; margin: 14px 0 0; padding: 0 0 0 4px; }
.apropos-frise li { position: relative; display: grid; grid-template-columns: 112px minmax(0, 1fr); column-gap: 18px; padding: 0 0 14px 18px; border-left: 2px solid var(--filet); }
.apropos-frise li:last-child { padding-bottom: 0; border-left-color: transparent; }
.apropos-frise li::before { content: ''; position: absolute; left: -6px; top: 5px; width: 10px; height: 10px; border-radius: 50%; background: var(--papier); border: 2px solid var(--encre-3); }
.apropos-frise li:last-child::before { background: var(--encre); border-color: var(--encre); }
.af-periode { grid-row: span 2; font-size: 12.5px; color: var(--encre-3); font-variant-numeric: tabular-nums; padding-top: 2px; }
.af-titre { font-size: 15px; color: var(--encre); line-height: 1.4; }
.af-lieu { font-size: 13px; color: var(--encre-2); }
.apropos-contact { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 18px; padding: 14px 18px; margin-top: 4px; }
.apropos-contact .ac-adresse { font-size: 16px; color: var(--encre); overflow-wrap: anywhere; }
.apropos-contact .ac-actions { display: flex; gap: 8px; }
.apropos-contact .ac-ecrire, .apropos-contact .ac-copier { font: inherit; font-size: 13.5px; padding: 6px 14px; border-radius: 6px; border: 1px solid var(--filet); background: var(--surface); color: var(--encre); text-decoration: none; cursor: pointer; }
.apropos-contact .ac-ecrire { background: var(--encre); color: var(--papier); border-color: var(--encre); }
.apropos-contact .ac-ecrire:hover, .apropos-contact .ac-copier:hover { opacity: .85; }
.apropos-epreuves { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-top: 14px; }
.apropos-epreuves article { padding: 16px 18px; }
.apropos-epreuves h4 { font-family: var(--f-titre); font-size: 19px; margin: 0; }
.apropos-epreuves .ae-public { font-size: 12px; letter-spacing: .04em; text-transform: uppercase; color: var(--encre-3); margin: 2px 0 8px; }
.apropos-epreuves .ae-texte { font-size: 14.5px; line-height: 1.55; color: var(--encre-2); }
.apropos-epreuves .ae-texte p { margin: 0; }

@media (max-width: 860px) {
  .page { padding: 20px 16px 56px; }
  .page-tete h2 { font-size: 26px; }
  .chapitre { grid-template-columns: 36px minmax(0, 1fr); }
  .chapitre .ch-theories, .chapitre .statut { grid-column: 2; }
  .lecture, .banque, .apropos { grid-template-columns: minmax(0, 1fr); }
  .cote, .filtres, .profil { position: static; }
  .cote { max-height: none; overflow: visible; padding: 0; margin: 0; }
  .filtres { max-height: none; overflow: visible; }
  .lecteur-raccourci { display: flex; justify-content: flex-end; align-items: flex-start; position: sticky; bottom: 14px; height: 0; padding-right: 12px; z-index: 2; pointer-events: none; }
  .lecteur-raccourci button { flex: none; white-space: nowrap; pointer-events: auto; transform: translateY(-100%); border: 1px solid var(--filet); background: var(--surface); color: var(--encre);
    opacity: .94; border-radius: 999px; padding: 7px 13px; font-family: var(--f-ui); font-size: 13px; box-shadow: var(--ombre); cursor: pointer; }
  .cote-retour { display: block; justify-self: start; border: 1px solid var(--filet); background: var(--surface); color: var(--encre-2); border-radius: 999px; padding: 5px 12px; font-family: var(--f-ui); font-size: 13px; cursor: pointer; }
  .apropos-epreuves { grid-template-columns: minmax(0, 1fr); }
  .apropos-frise li { grid-template-columns: minmax(0, 1fr); }
  .af-periode { grid-row: auto; padding-top: 0; }
  .apropos-sommaire { display: none; }
  .tiroir { grid-template-columns: minmax(0, 1fr); }
  .rubrique { overflow: visible; }
}

/* ---------------------------------------------------------------- étroit */
@media (max-width: 860px) {
  .app { height: auto; display: block; }
  .corps { display: block; }
  .separateur { display: none; }
  .cadre { height: 64vh; border-right: 0; border-bottom: 1px solid var(--filet); }
  .panneau { overflow: visible; overflow-x: clip; }   /* clip : l'animation du glissement ne crée pas de défilement horizontal, et la barre reste collante */
  /* La barre (recherche et onglets) reste collée en haut de l'écran quand on descend dans la fiche ou le lexique ;
     sous l'encoche, en mode application, elle s'arrête sous la bande de la zone sûre (body::before). */
  .tete-panneau { top: env(safe-area-inset-top, 0px); }
  .onglet :is([id], h2, h3, details, .bouton, .remarque, .enonce) { scroll-margin-top: calc(var(--haut-tete-panneau, 52px) + 8px + env(safe-area-inset-top, 0px)); }
  .onglet { padding-left: max(16px, env(safe-area-inset-left, 0px)); padding-right: max(16px, env(safe-area-inset-right, 0px)); }
  .cherche-edifice { padding-left: 16px; padding-right: 16px; }
  .cherche-edifice input { font-size: 16px; }
  .effacer-edifice { padding: 8px 10px; }
  .effacer-edifice span { display: none; }   /* 16 px : pas de zoom automatique sur iOS */
  .resultats-edifice { left: 16px; right: 16px; max-height: 55vh; }
  .marque { font-size: 17px; white-space: normal; }
  .entete { display: grid; grid-template-columns: minmax(0, 1fr) auto auto auto auto; align-items: center; }   /* marque, loupe, thème, drapeau, Partager */
  /* Trois boutons à symbole de même taille (36 px, cible tactile), également espacés et centrés sur une même ligne ;
     un écart plus large les sépare de la marque (le chevron du menu) et du bouton Partager. */
  .entete { column-gap: 2px; }
  .chercher-tout, .bouton-theme, .signaler { width: 36px; height: 36px; margin: 0 !important; border-radius: 9px; }
  .bouton-theme svg { width: 24px; height: 24px; }
  .chercher-tout { justify-self: end; margin-left: 10px !important; }
  .partager { margin-left: 8px; padding: 4px 11px; }
  .fil { grid-column: 1 / -1; grid-row: 2; }
  /* Un titre de graphe long (« Suites de composition et théorème de Jordan-Hölder ») passe à la ligne au lieu de
     faire défiler la page en largeur ; le titre reste entier, sans troncature. */
  .fil li { white-space: normal; min-width: 0; align-items: baseline; }   /* « › » face à la première ligne */
  .fil button { min-width: 0; text-align: left; overflow-wrap: anywhere; }
  .commandes button { min-width: 30px; padding: 0 6px; }
}
@media (max-width: 350px) { .marque { letter-spacing: .04em; gap: 6px; font-size: 16px; } .chercher-tout, .bouton-theme, .signaler { width: 32px; height: 32px; } .chercher-tout { margin-left: 4px !important; } .partager { margin-left: 4px; padding: 3px 7px; font-size: 12px; } }
/* Formules centrées trop larges (téléphone) : défilement horizontal plutôt que débordement. */
.katex-display { overflow-x: auto; overflow-y: hidden; padding: 2px 0; }
@media (prefers-reduced-motion: reduce) {
  * { transition: none !important; scroll-behavior: auto !important; }
}
/* ---- Rubrique Activités (MEMO_atlas_activites.md) : onglets en intercalaires de classeur, cartes, symbole.
   Les styles propres à chaque activité sont dans son module (activites/), chargé à la demande. */
.activites-sy1 { fill: var(--c-ord); } .activites-sy2 { fill: var(--c-ord); opacity: .55; } .activites-sy3 { fill: var(--c-ord); opacity: .25; }
.activites-onglets { display: flex; align-items: flex-end; gap: 4px; margin: 0 0 -1px; padding: 6px 2px 0; overflow-x: auto; scrollbar-width: thin; position: relative; z-index: 1; }
.activites-onglet { --o: var(--c-ord); flex: 0 0 auto; display: inline-flex; align-items: center; gap: 8px; max-width: 16rem; padding: 7px 16px 8px; font: 500 14px/1.25 var(--f-ui); color: var(--encre-2); text-decoration: none; white-space: nowrap;
  background: var(--trame); border: 1px solid var(--filet); border-top: 4px solid var(--o); border-radius: 10px 10px 0 0; }
.activites-onglet-toutes { --o: var(--encre-3); }
/* Casse-têtes : teinte propre au groupe (bleu pétrole, entre le bleu de l'édifice et le vert de l'analyse). */
:root { --activites-jeu: #0e7490; } :root[data-theme="dark"] { --activites-jeu: #5cc8dc; }
[data-teinte="jeu"] { --o: var(--activites-jeu) !important; } [data-teinte="geo"] { --o: var(--c-geo) !important; }
/* Explorations : le sous-menu et les cartes prennent la couleur du domaine mathématique (celles des familles de l'édifice). */
.activites-sous a, .activites-carte { --o: var(--c-ord); }
[data-domaine="analyse"] { --o: var(--c-ana) !important; } [data-domaine="geometrie"] { --o: var(--c-geo) !important; }
[data-domaine="algebre"] { --o: var(--c-alg) !important; } [data-domaine="nombres"], [data-domaine="probabilites"], [data-domaine="denombrement"] { --o: var(--c-nb) !important; }
.activites-onglet:hover { color: var(--encre); background: var(--surface); }
.activites-onglet[aria-current="page"] { color: var(--encre); background: var(--papier); border-bottom-color: var(--papier); padding-top: 11px; font-weight: 600; }
.activites-onglet .niv { font: 11px var(--f-mono); color: var(--encre-3); background: var(--surface); border: 1px solid var(--filet); border-radius: 999px; padding: 0 6px; }
.activites-feuille { border-top: 1px solid var(--filet); padding-top: 26px; }
.activites-sous { display: flex; flex-wrap: wrap; gap: 8px; margin: -8px 0 26px; padding-bottom: 14px; border-bottom: 1px solid var(--filet); }
.activites-sous a { display: inline-flex; align-items: baseline; gap: 8px; padding: 6px 13px; font: 500 14px/1.25 var(--f-ui); color: var(--encre-2); text-decoration: none; background: var(--surface); border: 1px solid var(--filet); border-left: 3px solid var(--o); border-radius: 6px; }
.activites-sous a:hover { color: var(--encre); border-color: var(--encre-3); border-left-color: var(--o); }
.activites-sous a[aria-current="page"] { color: var(--surface); background: var(--encre); border-color: var(--encre); border-left-color: var(--o); font-weight: 600; }
.activites-sous .niv { font: 11px var(--f-mono); opacity: .75; }
.activites-sous a.activites-retour { --o: var(--c-ord); }
.activites-filtres { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 26px; margin: -6px 0 22px; padding-bottom: 16px; border-bottom: 1px solid var(--filet); }
.activites-filtre { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.activites-filtre > span { font: 500 12px var(--f-ui); letter-spacing: .06em; text-transform: uppercase; color: var(--encre-3); }
.activites-filtre .puces-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.activites-filtre .chip[data-domaine] { border-left: 3px solid var(--o); }
.activites-compte { margin: 0 0 0 auto; font: 13px var(--f-mono); color: var(--encre-3); }
.activites-cartes { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 14px; }
.activites-carte { display: flex; flex-direction: column; gap: 6px; padding: 16px 18px; text-decoration: none; color: var(--encre); border-top: 3px solid var(--o); }
.activites-carte:hover { border-color: var(--encre-3); border-top-color: var(--o); }
.activites-carte-tete { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 4px; }
.activites-carte-tete .niv { text-align: right; } .activites-carte h3 { overflow-wrap: anywhere; }
/* Vignette d'une activité : petit dessin au trait (champ vignette du catalogue). a : trait de la couleur de la carte ; f : aplat léger ; p : point ; t : tirets. */
.activites-vig { flex: none; width: 116px; height: auto; fill: none; stroke: var(--encre-3); stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; background: var(--papier); border: 1px solid var(--filet); border-radius: 6px; }
.activites-vig .a { stroke: var(--o); stroke-width: 2.2; } .activites-vig .f { fill: var(--o); fill-opacity: .22; stroke: none; }
.activites-vig .p { fill: var(--o); stroke: none; } .activites-vig .t { stroke-dasharray: 3 3; } .activites-vig .e { stroke: var(--encre); stroke-width: 2; }
@media (max-width: 420px) { .activites-vig { width: 84px; } }
.activites-carte .niv { font: 12px var(--f-ui); letter-spacing: .06em; text-transform: uppercase; color: var(--encre-3); }
.activites-carte h3 { margin: 0; font: 600 21px/1.2 var(--f-titre); }
.activites-carte p { margin: 0; font: 15.5px/1.5 var(--f-texte); color: var(--encre-2); }
.activites-carte .fleche { margin-top: auto; align-self: flex-end; color: var(--encre-3); }
.activites-pied { display: flex; justify-content: flex-end; margin-top: 18px; }
@media (max-width: 600px) { .activites-sous a { font-size: 13px; padding: 5px 10px; } }

/* ---- pages de lecture */
html, body.l-corps { height: auto; }
.nobr { white-space: nowrap; } math[display="block"] { overflow-x: auto; overflow-y: hidden; padding: 2px 0; }
body.l-corps { min-height: 100%; margin: 0; display: block; }
.l-tete { position: sticky; top: 0; z-index: 5; display: flex; align-items: center; gap: 12px; padding: 10px max(16px, env(safe-area-inset-left, 0px)); background: var(--surface); border-bottom: 1px solid var(--filet); }
.l-marque { display: inline-flex; align-items: center; gap: 10px; color: var(--encre); text-decoration: none; font-family: var(--f-titre); font-size: 19px; letter-spacing: .14em; font-weight: 600; }
.l-marque img { width: 28px; height: 28px; border-radius: 7px; }
.l-rubriques { display: flex; gap: 4px 14px; flex-wrap: wrap; margin-left: 8px; font-size: 13.5px; }
.l-rubriques a { color: var(--encre-2); text-decoration: none; }
.l-rubriques a:hover { color: var(--encre); }
.l-ouvrir { margin-left: auto; flex: none; font-size: 13.5px; font-weight: 600; padding: 7px 14px; border-radius: 8px; background: var(--encre); color: var(--papier); text-decoration: none; }
.l-page { max-width: 820px; margin: 0 auto; padding: 22px 16px 64px; }
.l-fil { font-size: 13px; color: var(--encre-3); margin: 0 0 14px; display: flex; flex-wrap: wrap; gap: 4px 8px; }
.l-fil a { color: var(--encre-2); text-decoration: none; }
.l-fil a:hover { text-decoration: underline; }
.l-page .fiche h1 { font-family: var(--f-titre); font-size: 30px; line-height: 1.2; margin: 4px 0 14px; }
.l-page .fiche { font-family: var(--f-texte); font-size: 17px; line-height: 1.6; }
.l-page .fiche details.preuve[open] > summary { margin-bottom: 6px; }
.l-page .liens a.puce { text-decoration: none; color: var(--encre); }
.l-page h2.l-sec { font-family: var(--f-titre); font-size: 21px; margin: 30px 0 10px; }
.l-liste { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.l-liste li { font-family: var(--f-ui); font-size: 14.5px; }
.l-liste a { color: var(--encre); text-decoration: none; border-bottom: 1px solid var(--filet); }
.l-liste a:hover { border-bottom-color: var(--encre-2); }
.l-liste .l-sorte { color: var(--encre-3); font-size: 12.5px; margin-right: 6px; }
.l-ouvrir-bas { display: inline-block; margin-top: 26px; }
.l-page a.terme { text-decoration: none; cursor: pointer; }
.l-page span.terme { cursor: auto; }
.l-page span.terme:hover { background: none; }
.l-404 .l-liste { margin-top: 10px; }
.l-pied { max-width: 820px; margin: 0 auto; padding: 18px 16px 40px; border-top: 1px solid var(--filet); font-size: 12.5px; color: var(--encre-3); }
.l-pied a { color: var(--encre-2); }
.l-ann .l-boutons { display: flex; flex-wrap: wrap; gap: 8px; margin: 6px 0 14px; font-family: var(--f-ui); }
.l-ann .l-boutons a { font-size: 14px; padding: 6px 14px; border-radius: 8px; border: 1px solid var(--filet); color: var(--encre); text-decoration: none; background: var(--surface); }
.l-ann .l-boutons a.plein { background: var(--encre); color: var(--papier); border-color: var(--encre); }
.l-ann .l-partie { margin: 0 0 12px; padding: 10px 14px; border-left: 3px solid var(--filet); background: var(--surface); border-radius: 0 8px 8px 0; }
.l-ann .l-partie h3 { margin: 0 0 4px; font-family: var(--f-titre); font-size: 17px; }
.l-ann .l-partie p { margin: 0; font-family: var(--f-ui); font-size: 13.5px; color: var(--encre-2); }
.l-ann .l-meta { font-family: var(--f-ui); font-size: 13px; color: var(--encre-3); margin: 0 0 8px; }
/* rubriques Cours et Exercices (lecture-cours.mjs) */
.l-sommaire { margin: 0; padding-left: 22px; font-family: var(--f-texte); font-size: 16px; display: grid; gap: 4px; }
.l-sommaire a { color: var(--encre); }
.l-exo h1 .l-titre-exo { font-style: italic; font-weight: 400; }
.l-etiquettes { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.l-notions a { color: var(--encre); text-decoration: underline dotted; text-underline-offset: 3px; }
.l-exo .exo { padding: 0; margin-bottom: 16px; }
.l-exos li { display: grid; gap: 2px; padding: 4px 0; }
.l-exos .difficulte { display: inline-flex; vertical-align: middle; margin-left: 6px; }
.l-extrait { color: var(--encre-3); font-size: 13px; }
.l-suite { display: flex; justify-content: space-between; gap: 12px; margin-top: 26px; font-family: var(--f-ui); font-size: 14px; }
.l-suite a { color: var(--encre-2); text-decoration: none; }
.l-suite a:hover { color: var(--encre); text-decoration: underline; }
@media (max-width: 640px) {
  .l-rubriques { display: none; }
  .l-page .fiche h1 { font-size: 25px; }
  .l-page .fiche { font-size: 16.5px; }
}