/* ═══════════════════════════════════════════════════════════════════
   /glossaire/<notion> — la page d'une notion
   -------------------------------------------------------------------
   Feuille PARTAGÉE par toutes les pages de notion, et non inlinée dans
   chacune : elles sont générées par tools/gen-seo.mjs à partir de
   oeuvres/lexique.json, et dupliquer six kilooctets de CSS par page
   n'aurait servi qu'à les faire diverger.

   Une notion se LIT — c'est le seul endroit du site, avec la liseuse, où
   l'on tient quatre cents mots d'affilée. Le corps est donc en Spectral,
   la serif de lecture de la maison, et non en Inter qui est la police
   d'interface. La mesure est courte (62 caractères) pour la même raison.
   ═══════════════════════════════════════════════════════════════════ */
:root{
  --bg:#15100b;--surface:#1e1710;--text:#f3e9d4;
  --muted:#b7a888;--accent:#d5402f;--border:rgba(243,233,212,.13);
  --paper:#15100b;--paper-2:#1e1710;--card:#221a12;
  --ink:#f3e9d4;--ink-soft:#c7b599;
  --red:#d5402f;--red-deep:#e5644f;--red-text:#e5644f;--bright:#e5644f;
  --line-strong:rgba(243,233,212,.34);--hover:rgba(243,233,212,.05);
  --gold:#d8ad4c;--gold-deep:#bd8f38;--blue:#5c8aa3;--const:#9a8b72;
  --line:rgba(243,233,212,.13);--line-soft:rgba(243,233,212,.07);--ok:#7fa855;
  --f-ui:'Inter',system-ui,sans-serif;--f-serif:'Spectral',Georgia,serif;--f-hand:'Caveat',cursive;
  --candle:rgba(216,173,76,.18);
  --emphase:linear-gradient(150deg,#2c2117,#211a12,#1b150e);
}
*{box-sizing:border-box;margin:0;padding:0;}
html{background:var(--bg);}
body{background:var(--bg);color:var(--text);font-family:var(--f-ui);
  -webkit-font-smoothing:antialiased;}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:4px;}

.nt{max-width:760px;margin:0 auto;
  padding:clamp(30px,4.5vh,52px) clamp(24px,5vw,56px) clamp(64px,10vh,104px);}

/* ── fil d'Ariane ── */
.nt-fil{font-family:var(--f-ui);font-size:.76rem;color:var(--muted);
  margin-bottom:26px;line-height:1.7;}
/* Les liens du fil d'Ariane ne sont pas dans une phrase : WCAG 2.5.8 ne
   les exempte pas, et à la seule hauteur de ligne ils mesuraient 15 px. */
.nt-fil a{display:inline-block;padding:5px 0;color:var(--muted);text-decoration:none;text-underline-offset:3px;}
.nt-fil a:hover{color:var(--gold);text-decoration:underline;}
.nt-fil span{color:var(--const);margin:0 7px;}

/* ── tête ── */
.nt-label{font-family:var(--f-ui);font-size:.72rem;font-weight:600;
  letter-spacing:.11em;text-transform:uppercase;color:var(--muted);margin-bottom:11px;}
.nt-h1{font-family:'Fraunces',serif;font-weight:900;
  font-size:clamp(2rem,4.6vw,3rem);line-height:1.04;letter-spacing:-.03em;
  margin-bottom:10px;}
.nt-de{display:block;font-family:var(--f-serif);font-style:italic;
  font-weight:400;font-size:clamp(1rem,2vw,1.24rem);color:var(--gold);
  letter-spacing:0;margin-top:8px;}
.nt-chapo{font-family:var(--f-serif);font-size:1.14rem;line-height:1.7;
  color:var(--ink-soft);margin:22px 0 0;padding-left:18px;
  border-left:2px solid var(--gold-deep);}

/* ── le corps ── */
.nt-corps{margin-top:clamp(34px,5vh,52px);}
.nt-corps p{font-family:var(--f-serif);font-size:1.06rem;line-height:1.78;
  color:var(--text);margin-bottom:20px;}
.nt-corps p b{font-weight:600;}
.nt-corps p i{color:var(--ink-soft);}
/* La citation garde le filet de gauche : c'est la règle typographique de
   la maison, et la seule exception à « plus de filet latéral ». */
.nt-corps blockquote{font-family:var(--f-serif);font-style:italic;
  font-size:1.04rem;line-height:1.72;color:var(--ink-soft);
  margin:26px 0;padding:2px 0 2px 20px;border-left:3px solid var(--red);}
.nt-corps blockquote cite{display:block;margin-top:9px;font-style:normal;
  font-family:var(--f-ui);font-size:.8rem;color:var(--muted);}

/* ── l'appareil, en pied ── */
.nt-appareil{margin-top:clamp(44px,6vh,66px);display:grid;gap:1px;
  background:var(--border);border:1px solid var(--border);border-radius:16px;
  overflow:hidden;grid-template-columns:repeat(2,1fr);}
.nt-bloc{background:var(--surface);padding:22px 22px 24px;}
.nt-bloc--source{background:var(--emphase);position:relative;
  box-shadow:inset 0 0 0 1px rgba(216,173,76,.20);}
.nt-bloc--source::after{content:'';position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse at 50% 118%,var(--candle) 0%,transparent 62%);}
.nt-bloc>*{position:relative;z-index:1;}
.nt-bloc-t{font-family:var(--f-ui);font-size:.72rem;font-weight:600;
  letter-spacing:.11em;text-transform:uppercase;color:var(--muted);margin-bottom:13px;}
.nt-bloc--source .nt-bloc-t{color:var(--gold);}
.nt-bloc p{font-size:.9rem;line-height:1.66;color:var(--ink-soft);}
.nt-liens{list-style:none;display:flex;flex-direction:column;gap:3px;}
/* Ces liens sont des entrées de LISTE, pas des liens en ligne dans une
   phrase : l'exception de WCAG 2.5.8 ne les couvre pas, et à la seule
   hauteur de ligne ils mesuraient 18 px. Le rembourrage vertical les porte
   au-delà des 24 px du critère AA. */
.nt-liens a{display:inline-block;padding:4px 0;
  font-size:.9rem;line-height:1.5;color:var(--gold);
  text-decoration:none;text-underline-offset:3px;}
.nt-liens a:hover{text-decoration:underline;}

/* ── Chez Debord : le renvoi au site frère ──
   Pleine largeur dans l'appareil (c'est un autre livre, pas une pièce de
   l'atelier), une thèse par ligne, sa glose dessous. Le lien du texte
   courant est en ligne dans une phrase : WCAG 2.5.8 l'exempte. */
.nt-appareil .nt-bloc--debord{grid-column:1/-1;}
.nt-bloc--debord>p a{color:var(--gold);text-underline-offset:3px;}
.nt-debord{margin-top:12px;gap:10px;}
.nt-debord li{display:flex;flex-direction:column;gap:1px;}
.nt-debord span{font-size:.86rem;line-height:1.55;color:var(--muted);}

/* ── les voisines ── */
.nt-voisines{margin-top:clamp(34px,5vh,50px);padding-top:26px;
  border-top:1px solid var(--border);}
.nt-puces{display:flex;flex-wrap:wrap;gap:8px;margin-top:13px;}
.nt-puces a{display:inline-flex;align-items:center;padding:8px 15px;
  border-radius:999px;border:1px solid var(--border);background:var(--surface);
  font-family:var(--f-ui);font-size:.84rem;color:var(--text);text-decoration:none;
  transition:border-color .18s,color .18s;}
.nt-puces a:hover{border-color:var(--gold);color:var(--gold);}

/* ── pied ── */
.nt-fin{margin-top:clamp(40px,6vh,60px);}
.nt-btn{display:inline-flex;align-items:center;gap:9px;padding:11px 24px;
  border-radius:999px;background:var(--accent);color:#fff;
  font-family:var(--f-ui);font-size:14px;font-weight:600;text-decoration:none;
  transition:opacity .18s,transform .18s;}
.nt-btn:hover{opacity:.86;transform:translateY(-1px);}

@media(max-width:720px){
  .nt-appareil{grid-template-columns:1fr;}
}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;}}

/* ═══════════════════════════════════════════════════════════════════
   LA PAGE-MONDE (mission glossaire-mondes, sept. 2026)
   -------------------------------------------------------------------
   Une notion qui a son dossier (glossaire/mondes/<slug>/) est un ESSAI
   LONG avec un MONDE : la colonne de texte à gauche, et à droite, collée
   à l'écran, la scène qui le suit — le motif « le texte au centre,
   l'appareil en marge » de l'atelier, où la marge est ici un monde.
   LA COLONNE DE TEXTE NE BOUGE JAMAIS (règle de la maison) : tout le
   mouvement vit dans la scène, pilotée par la POSITION de lecture.
   Sous 1100 px la scène passe AU-DESSUS du texte, en image fixe : une
   scène sous le texte serait hors de vue au moment où elle sert.
   ═══════════════════════════════════════════════════════════════════ */
.nt--monde{max-width:1240px;}
.nt-grid{display:flex;flex-direction:column;}
.nt-col{min-width:0;max-width:680px;}
.nt-monde{order:-1;position:relative;margin:0 0 30px;
  aspect-ratio:16/10;border-radius:18px;overflow:hidden;
  background:#0d0a07;border:1px solid var(--border);}
.nt-monde canvas,.nt-monde-still{position:absolute;inset:0;width:100%;height:100%;
  display:block;object-fit:cover;}
/* L'IMAGE FIXE NE SE ROGNE JAMAIS. Dans la colonne collante, la boîte est
   haute et étroite tandis que la capture est en 16/10 : `cover` en gardait
   la bande centrale et coupait les bords. Sur une scène en trois
   dimensions on y perdait le cadrage ; sur une PLANCHE TYPOGRAPHIQUE — la
   forme-valeur — on y perdait les mots, « 10 livres de thé » se lisant
   « ivres de thé ». Le canevas, lui, se rend à l'aspect de sa boîte : pour
   lui `cover` ne fait rien. */
.nt-monde-still{object-fit:contain;}
.nt-monde canvas[hidden],.nt-monde-still[hidden]{display:none;}
.nt-monde-cap{position:absolute;left:0;right:0;bottom:0;margin:0;
  padding:38px 20px 16px;font-family:var(--f-serif);font-style:italic;
  font-size:.94rem;line-height:1.5;color:var(--ink-soft);
  background:linear-gradient(to bottom,rgba(13,10,7,0),rgba(13,10,7,.92) 60%);
  transition:opacity .35s;}
.nt-monde-cap.swap{opacity:0;}
/* La ligne fixe : ce qu'on voit est DANS le livre, et l'on peut y aller. */
.nt-monde-src{position:absolute;top:12px;left:14px;margin:0;z-index:2;}
.nt-monde-src a{display:inline-block;padding:6px 11px;border-radius:999px;
  background:rgba(13,10,7,.72);border:1px solid rgba(216,173,76,.35);
  font-family:var(--f-ui);font-size:.7rem;font-weight:600;letter-spacing:.08em;
  text-transform:uppercase;color:var(--gold);text-decoration:none;}
.nt-monde-src a:hover{border-color:var(--gold);background:rgba(13,10,7,.9);}
/* Vignette : la pénombre gagne les bords, comme partout où le site s'éclaire à la bougie. */
.nt-monde canvas+.nt-monde-vignette,.nt-monde::before{content:'';position:absolute;inset:0;
  pointer-events:none;z-index:1;box-shadow:inset 0 0 90px 20px rgba(8,5,3,.55);}
/* Sous 1100 px la légende passe SOUS l'image fixe et non par-dessus :
   trois lignes en surimpression mangeaient une image de deux cents pixels. */
/* MISSION vivant-sur-mobile (sept. 2026) : sous 1100 px la scène n'est plus
   une image fixe qu'on dépasse en lisant, mais une BANDE COLLANTE en haut de
   l'écran, sous la topbar (--nt-top, mesurée par monde-driver.js), que le
   texte vient lire par-dessous. La colonne de texte ne bouge toujours pas ;
   le monde joue pendant qu'on descend, exactement comme la colonne collante
   des écrans larges. Sa hauteur est bornée pour laisser au moins la moitié
   de l'écran au texte. Sans script, c'est l'image fixe qui colle : la page
   est finie sans une ligne de JS. */
@media(max-width:1099px){
  .nt-monde{position:sticky;top:calc(var(--nt-top,44px) + 8px);z-index:5;
    aspect-ratio:auto;height:min(44vh,380px);margin:0 0 22px;}
  .nt-monde-cap{padding:26px 14px 10px;font-size:.84rem;line-height:1.4;}
  /* la ligne « D'après le texte » tenait deux lignes sur une bande de 370 px :
     elle se tronque au lieu de manger l'image (le plancher des 11 px est tenu) */
  .nt-monde-src{top:8px;left:8px;max-width:calc(100% - 16px);}
  .nt-monde-src a{max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:5px 10px;}
}
/* SUR TÉLÉPHONE, UNE BANDE RÉDUITE (mission `mobile-lecture`). À 44 vh la
   scène et sa légende de quatre lignes prenaient 357 px sur 812 : il restait
   quatre cents pixels pour lire un essai de deux mille mots. La bande tombe à
   28 % de l'écran et la légende se replie sur une ligne qu'on touche pour la
   lire (`cap-fold`, posée par monde-driver.js — sans script la légende reste
   entière, rien n'est caché sans moyen de le lire). */
@media(max-width:760px){
  .nt-monde{height:clamp(170px,28vh,240px);margin:0 0 18px;border-radius:14px;}
  .nt-monde.cap-fold .nt-monde-cap{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
    padding:20px 40px 9px 12px;cursor:pointer;z-index:3;}
  .nt-monde.cap-fold::after{content:'';position:absolute;right:14px;bottom:13px;z-index:4;
    width:8px;height:8px;border-right:1.6px solid var(--gold);border-bottom:1.6px solid var(--gold);
    transform:rotate(-135deg);pointer-events:none;transition:transform .2s;}
  .nt-monde.cap-fold.cap-open::after{transform:rotate(45deg);bottom:16px;}
  .nt-monde.cap-fold .nt-monde-cap.is-open{white-space:normal;overflow:auto;max-height:calc(100% - 46px);
    padding:12px 40px 12px 12px;background:rgba(13,10,7,.94);}
  .nt-monde.cap-fold .nt-monde-cap:focus-visible{outline:2px solid var(--gold);outline-offset:-2px;}
}
@media(min-width:1100px){
  .nt-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(340px,44%);
    gap:clamp(28px,4vw,64px);align-items:start;}
  .nt-monde{order:0;position:sticky;top:60px;margin:0;aspect-ratio:auto;
    height:calc(100vh - 80px);}
}

/* ── le sommaire ── */
.nt-som{margin-top:28px;padding:16px 20px 14px;border:1px solid var(--border);
  border-radius:14px;background:var(--surface);}
.nt-som-t{font-family:var(--f-ui);font-size:.72rem;font-weight:600;
  letter-spacing:.11em;text-transform:uppercase;color:var(--muted);margin-bottom:8px;}
.nt-som ol{list-style:none;counter-reset:som;}
.nt-som li{counter-increment:som;}
.nt-som a{display:flex;gap:12px;align-items:baseline;padding:5px 0;
  font-family:var(--f-serif);font-size:.98rem;color:var(--ink-soft);text-decoration:none;}
.nt-som a::before{content:counter(som,upper-roman);font-family:'Fraunces',serif;
  font-style:italic;font-weight:500;color:var(--gold);min-width:1.6em;font-size:.95rem;}
.nt-som a:hover{color:var(--gold);}

/* ── les sections de l'essai ── */
.nt-sec{margin-top:clamp(38px,5.5vh,58px);scroll-margin-top:72px;}
.nt-sec h2{font-family:'Fraunces',serif;font-weight:900;letter-spacing:-.02em;
  font-size:clamp(1.36rem,2.4vw,1.62rem);line-height:1.18;margin:0 0 18px;
  display:flex;gap:14px;align-items:baseline;}
.nt-sec-n{font-style:italic;font-weight:500;color:var(--gold);font-size:.92em;flex:none;}
.nt-sec h2+p{margin-top:0;}
.nt-corps .nt-sec p a{color:var(--gold);text-decoration:none;
  border-bottom:1px solid rgba(216,173,76,.45);}
.nt-corps .nt-sec p a:hover{border-bottom-color:var(--gold);}

/* ── les citations mènent au passage ──
   Une citation relevée dans le texte servi est un LIEN vers ce passage
   (le contrat de deep-link #s=&q= de la liseuse). En ligne, elle garde la
   couleur du texte : les guillemets et un filet pointillé suffisent à dire
   qu'on peut y aller — vingt-cinq liens dorés dans un essai feraient un
   texte qui clignote. Lien en ligne dans une phrase : WCAG 2.5.8 exempte
   sa hauteur. */
.nt-corps q{quotes:"«\00a0" "\00a0»";}
/* (0,3,1) et non (0,2,1) : la règle des liens de paragraphe, juste au-dessus,
   les repeignait en or — vécu à la première capture. */
.nt-corps .nt-sec p a.nt-q{color:inherit;text-decoration:none;
  border-bottom:1px dotted rgba(216,173,76,.6);}
.nt-corps .nt-sec p a.nt-q:hover{border-bottom:1px solid var(--gold);color:var(--gold);}
.nt-corps .nt-sec p a.nt-q q::before,.nt-corps .nt-sec p a.nt-q q::after{color:var(--gold);}
.nt-corps blockquote p{font:inherit;color:inherit;margin:0;}
/* Le renvoi sous la citation n'est pas dans une phrase : il prend ses 24 px. */
.nt-corps blockquote cite a{display:inline-block;padding:4px 0;color:var(--gold);
  text-decoration:none;margin-left:10px;white-space:nowrap;}
.nt-corps blockquote cite a:hover{text-decoration:underline;}

/* ── la signature de source, sous l'essai ── */
.nt-colophon{margin-top:26px;padding-top:16px;border-top:1px solid var(--border);
  font-family:var(--f-ui);font-size:.8rem;line-height:1.6;color:var(--muted);}


/* ═══ L'architecture « plein » : la scène derrière la page ═══
   Quand le monde est une scène à hauteur d'homme (la statue du travail
   aliéné), la colonne collante la rognerait. La scène occupe alors tout
   l'écran, fixe, et le texte passe devant, dans une colonne posée sur un
   voile qui s'éteint vers la droite — le monde reste visible à côté de la
   ligne qu'on lit. Sous 1100 px, rien de tout cela : l'image fixe au-dessus
   du texte, comme partout. */
@media(min-width:1100px){
  html.js-monde .nt--plein .nt-monde--plein{position:fixed;inset:0;height:auto;top:0;
    border:0;border-radius:0;z-index:0;}
  html.js-monde .nt--plein .nt-monde--plein::before{display:none;}
  html.js-monde .nt--plein .nt-grid{display:block;}
  html.js-monde .nt--plein .nt-col{position:relative;z-index:1;max-width:600px;
    padding:0 40px 0 0;}
  html.js-monde .nt--plein .nt-col::before{content:'';position:fixed;inset:0;z-index:-1;
    pointer-events:none;
    background:linear-gradient(to right,rgba(13,10,7,.94) 0,rgba(13,10,7,.9) 560px,rgba(13,10,7,.55) 820px,rgba(13,10,7,0) 1040px);}
  /* la légende se pose en haut à droite, sous le lien de source : le bas du cadre est aux figures */
  html.js-monde .nt--plein .nt-monde-cap{left:auto;right:40px;top:104px;bottom:auto;max-width:380px;
    padding:14px 18px;border-radius:12px;background:rgba(13,10,7,.72);
    border:1px solid rgba(243,233,212,.12);}
  html.js-monde .nt--plein .nt-monde-src{left:auto;right:40px;top:64px;}
  html.js-monde .nt--plein .nt-monde-credit{position:absolute;right:40px;top:auto;bottom:14px;margin:0;
    font-family:var(--f-ui);font-size:.72rem;color:var(--muted);max-width:380px;text-align:right;}
  html.js-monde .nt--plein .nt-sec{min-height:78vh;}
  html.js-monde .nt--plein .lm-foot{position:relative;z-index:1;}
}
.nt-monde-credit{display:none;}
html.js-monde .nt--plein .nt-monde-credit{display:block;}
@media(max-width:480px){
  /* LE PLANCHER DU PROJET EST 11 px pour un texte fonctionnel, et celui-ci
     en est un : c'est le renvoi qui mène au passage. Il valait .62rem, soit
     9,9 px — sur les vingt-quatre pages-monde. Il tient à .72rem parce que
     l'interlettrage et le rembourrage se resserrent en échange. */
  .nt-monde-src{top:8px;left:10px;right:10px;}
  .nt-monde-src a{font-size:.72rem;letter-spacing:.04em;padding:5px 8px;}
}

/* ═══════════════════════════════════════════════════════════════════
   LA PAGE DE CHAPITRE (mission chapitres-capital, sept. 2026)
   -------------------------------------------------------------------
   /oeuvres/capital-1/chapitre-<n> — une explication écrite, SANS scène :
   la figure d'un chapitre existe déjà, le plus souvent, sur la page de la
   notion qu'il établit. La grammaire est celle des pages de notion (même
   colonne en Spectral, mêmes sections numérotées), et la marge porte
   l'appareil de l'atelier : les parties du chapitre avec leur poids, les
   notions, les dates, l'instrument, la marche. Au-dessus de 1100 px elle
   est collante à droite ; en dessous elle suit le texte — l'essai se lit
   seul, et le bouton « Lire le chapitre » est déjà en tête.
   ═══════════════════════════════════════════════════════════════════ */
.nt--ch{max-width:1180px;}
.ch-num{display:block;font-style:italic;font-weight:500;font-size:.46em;
  letter-spacing:0;color:var(--gold);margin-bottom:8px;}
.ch-nums{font-family:var(--f-ui);font-size:.84rem;line-height:1.65;color:var(--muted);margin-top:14px;}
.ch-nums b{font-weight:600;color:var(--ink-soft);}
.ch-acts{display:flex;flex-wrap:wrap;gap:12px 20px;align-items:center;margin-top:26px;}
.ch-marge{margin-top:clamp(40px,6vh,60px);display:flex;flex-direction:column;gap:1px;
  background:var(--border);border:1px solid var(--border);border-radius:16px;overflow:hidden;}
.ch-marge .nt-bloc{padding:18px 20px 20px;}
.ch-plan,.ch-dates{list-style:none;display:flex;flex-direction:column;gap:7px;}
.ch-plan li{display:grid;grid-template-columns:2.3em minmax(0,1fr) auto;gap:8px;align-items:baseline;
  font-family:var(--f-serif);font-size:.88rem;line-height:1.45;color:var(--ink-soft);}
.ch-dates li{display:grid;grid-template-columns:3.1em minmax(0,1fr);gap:8px;align-items:baseline;
  font-family:var(--f-serif);font-size:.88rem;line-height:1.45;color:var(--ink-soft);}
.ch-plan .n,.ch-dates .y{font-family:'Fraunces',serif;font-style:italic;font-weight:500;color:var(--gold);}
.ch-plan .p{font-family:var(--f-ui);font-size:.72rem;color:var(--muted);font-variant-numeric:tabular-nums;}
.ch-suite{margin-top:clamp(40px,6vh,56px);padding-top:22px;border-top:1px solid var(--border);
  display:grid;grid-template-columns:1fr 1fr;gap:14px;}
/* Ancres bâties sur <a> : couleur ET soulignement déclarés, sinon l'agent
   utilisateur les rend bleues et soulignées (le défaut payé sur .lk). */
.ch-suite a{display:flex;flex-direction:column;gap:4px;padding:12px 15px;border:1px solid var(--border);
  border-radius:12px;background:var(--surface);color:var(--text);text-decoration:none;
  transition:border-color .18s;}
.ch-suite a:hover,.ch-suite a:focus-visible{border-color:var(--gold);}
.ch-suite .k{font-family:var(--f-ui);font-size:.72rem;font-weight:600;letter-spacing:.08em;
  text-transform:uppercase;color:var(--muted);}
.ch-suite .t{font-family:var(--f-serif);font-size:.95rem;line-height:1.4;}
.ch-suite .suiv{grid-column:2;text-align:right;}
@media(min-width:1100px){
  .nt--ch .nt-grid{display:grid;grid-template-columns:minmax(0,1fr) 320px;
    gap:clamp(28px,4vw,64px);align-items:start;}
  .nt--ch .ch-marge{position:sticky;top:60px;margin-top:0;max-height:calc(100vh - 80px);overflow:auto;}
}
@media(max-width:560px){
  .ch-suite{grid-template-columns:1fr;}
  .ch-suite .suiv{grid-column:1;text-align:left;}
}

/* CIBLES AU DOIGT (mission `cibles-tactiles`) : fil d'Ariane (31 px), « Lire
   dans le texte » (30 px), puces de notions (34 px). Le rembourrage monte, la
   marge négative rend la place : la mise en page ne bouge pas. */
@media (pointer:coarse){
  .nt-fil a{padding:12px 0;margin:-7px 0;}
  .nt-corps blockquote cite a{padding:11px 0;margin:-7px 0;}
  .nt-puces a{min-height:44px;}
  .nt-som a{padding:10px 0;}
}