/* Calendrier éditorial GRID
   Conception mobile d'abord. Les points de rupture ajoutent des colonnes,
   ils ne réparent pas une mise en page pensée pour le bureau.

   Contrastes vérifiés sur blanc, WCAG 2.1 AA exige 4,5:1 pour le texte courant :
     --ink   #141618  18,1:1
     --ink2  #39424a  10,2:1
     --ink3  #545e66   6,6:1
     --ink4  #667079   5,1:1   plancher, y compris sur --wash (4,8:1)
   Aucun gris plus clair ne porte de texte. Taille de police plancher : 11px.
   --red 4,3:1, réservé aux aplats, bordures et gros titres.
   --red-txt 5,6:1 pour tout texte rouge de petite taille.
*/

:root{
  --red:#e73029; --red-txt:#c8241e;
  --ink:#141618; --ink2:#39424a; --ink3:#545e66; --ink4:#667079;
  --line:#dfe3e6; --line2:#eceff1; --bg:#fbfbfc; --wash:#f5f7f8; --white:#fff;
  --alerte-txt:#8a3211; --alerte-bg:#fff5ef; --alerte-line:#f6cdb4;
  --note-bg:#fffaeb; --note-line:#f3dfae; --note-txt:#6f5011;
  /* zone visible avant « voir plus » : une teinte, jamais une rupture */
  --zone:#fdecea; --zone-bord:#f5c9c5;
  --r:6px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{
  font:15px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Helvetica,Arial,sans-serif,
    "Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
  color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased;
  overflow-wrap:break-word;
}
button,input,select{font:inherit;color:inherit}
button{cursor:pointer}
[hidden]{display:none !important}

/* cible tactile : 44px minimum sur tout ce qui se tape */
button,summary,a.act,.opt{min-height:44px}
@media (min-width:1080px){ button,summary,.opt{min-height:32px} }

:focus-visible{outline:2px solid var(--red-txt);outline-offset:2px;border-radius:3px}
.skip{position:absolute;left:-999px;top:0;background:var(--ink);color:#fff;padding:10px 14px;z-index:200}
.skip:focus{left:0}

/* ---------------------------------------------------------------- entête */
.top{background:var(--white);border-bottom:1px solid var(--line);padding:11px 14px 10px;
  display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.brand{font-weight:650;font-size:16px;letter-spacing:-.02em;line-height:1.2}
.brand span{color:var(--red-txt)}
.ctx{color:var(--ink3);font-size:12px;width:100%;order:3}
.apercu{margin-left:auto;border:1px solid var(--line);background:var(--white);border-radius:20px;
  padding:5px 12px;font-size:12px;color:var(--ink3);display:flex;align-items:center;gap:7px}
.apercu[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:#fff}
.apercu .pin{width:8px;height:8px;border-radius:50%;background:var(--line);flex:0 0 auto}
.apercu[aria-pressed="true"] .pin{background:#fff}

.bandeau{background:var(--note-bg);border-bottom:1px solid var(--note-line);color:var(--note-txt);
  padding:9px 14px;font-size:12px;line-height:1.45}
.bandeau b{font-weight:650}

/* ---------------------------------------------------------------- écrans */
.ecrans{background:var(--white);border-bottom:1px solid var(--line);display:flex;gap:2px;
  padding:0 8px;overflow-x:auto;scrollbar-width:none;position:sticky;top:0;z-index:30}
.ecrans::-webkit-scrollbar{display:none}
.ecrans button{border:0;background:none;padding:11px 12px 9px;font-size:14px;color:var(--ink3);
  border-bottom:2px solid transparent;margin-bottom:-1px;white-space:nowrap;display:flex;align-items:center;gap:6px}
.ecrans button[aria-selected="true"]{color:var(--ink);border-bottom-color:var(--red);font-weight:600}
.badge{background:var(--ink);color:#fff;border-radius:10px;padding:1px 6px;font-size:11px;font-weight:600;line-height:1.4}
.ecrans button[aria-selected="true"] .badge{background:var(--red-txt)}

/* ---------------------------------------------------------------- outils */
.outils{background:var(--white);border-bottom:1px solid var(--line);padding:9px 14px;
  display:flex;flex-direction:column;gap:8px}
.ligne{display:flex;gap:7px;align-items:center;flex-wrap:wrap}
.rech{flex:1 1 100%;border:1px solid var(--line);border-radius:var(--r);padding:9px 11px;font-size:14px;
  background:var(--white);min-width:0}
.bt{border:1px solid var(--line);background:var(--white);border-radius:var(--r);padding:7px 12px;
  font-size:13px;color:var(--ink2);display:inline-flex;align-items:center;gap:7px;white-space:nowrap}
.bt:hover{border-color:var(--ink4)}
.bt[aria-expanded="true"],.bt.actif{border-color:var(--ink);color:var(--ink)}
.bt .n{background:var(--ink);color:#fff;border-radius:10px;padding:0 6px;font-size:11px;font-weight:600}
.raz{border:0;background:none;color:var(--ink3);font-size:13px;text-decoration:underline;padding:7px 4px}

.seg{display:inline-flex;border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.seg button{border:0;background:var(--white);padding:7px 10px;font-size:12px;color:var(--ink3);
  border-right:1px solid var(--line)}
.seg button:last-child{border-right:0}
.seg button[aria-pressed="true"]{background:var(--wash);color:var(--ink);font-weight:600}
.etiq{font-size:11px;color:var(--ink4);text-transform:uppercase;letter-spacing:.06em}

/* sélection visible dans le bouton fermé */
.apercus{display:inline-flex;align-items:center}
.apercus .pt{width:9px;height:9px;border-radius:50%;margin-left:-3px;border:1.5px solid var(--white);flex:0 0 auto}
.apercus .pt:first-child{margin-left:0}
.ini{width:19px;height:19px;border-radius:50%;color:#fff;font-size:11px;font-weight:650;
  display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;letter-spacing:-.04em}
.apercus .ini{margin-left:-6px;border:1.5px solid var(--white)}
.apercus .ini:first-child{margin-left:0}

/* filtres en ligne, bureau seulement */
.enligne{display:none;gap:7px;flex-wrap:wrap;align-items:center}
details.f{position:relative}
details.f>summary{list-style:none;display:inline-flex;align-items:center;gap:7px;white-space:nowrap;
  border:1px solid var(--line);background:var(--white);border-radius:var(--r);padding:6px 11px;font-size:13px;color:var(--ink2)}
details.f>summary::-webkit-details-marker{display:none}
details.f[open]>summary{border-color:var(--ink);color:var(--ink)}
details.f>summary .car{font-size:11px;color:var(--ink4)}
.pop{position:absolute;top:calc(100% + 5px);left:0;z-index:60;background:var(--white);
  border:1px solid var(--line);border-radius:var(--r);box-shadow:0 10px 30px rgba(20,22,24,.14);
  padding:6px;min-width:236px;max-height:340px;overflow:auto}

.opt{display:flex;align-items:center;gap:9px;padding:8px 9px;border-radius:4px;font-size:14px;width:100%}
.opt:hover{background:var(--wash)}
.opt input{width:17px;height:17px;margin:0;flex:0 0 auto;accent-color:var(--red)}
.opt .pt{width:10px;height:10px;border-radius:50%;flex:0 0 auto}
.opt .aide{margin-left:auto;color:var(--ink4);font-size:12px;white-space:nowrap}

/* ---------------------------------------------------------------- synthèse */
.synthese{background:var(--white);border-bottom:1px solid var(--line);padding:8px 14px;
  display:flex;gap:6px;align-items:center;font-size:13px;color:var(--ink3);
  overflow-x:auto;scrollbar-width:none;white-space:nowrap}
.synthese::-webkit-scrollbar{display:none}
.synthese b{color:var(--ink);font-weight:650}
.synthese .k{border:1px solid var(--line);border-radius:20px;padding:5px 11px;background:var(--white);
  color:var(--ink3);font-size:12.5px;flex:0 0 auto}
.synthese .k[aria-pressed="true"]{background:var(--ink);color:#fff;border-color:var(--ink)}
.synthese .k b{color:inherit}
.repart{display:none}

/* ---------------------------------------------------------------- pastilles */
.pil{display:inline-flex;align-items:center;gap:5px;font-size:12px;padding:2px 8px;border-radius:20px;
  border:1px solid var(--line);color:var(--ink2);background:var(--white);white-space:nowrap;line-height:1.55}
.pil .pt{width:7px;height:7px;border-radius:50%;flex:0 0 auto}
.tag{display:inline-block;font-size:12px;padding:1px 7px;border-radius:3px;background:var(--line2);color:var(--ink2)}
.alerte{display:inline-flex;align-items:center;gap:4px;font-size:12px;color:var(--alerte-txt);
  background:var(--alerte-bg);border:1px solid var(--alerte-line);border-radius:3px;padding:1px 6px;line-height:1.5}
.cadenas{color:var(--red-txt);font-size:12px}

/* ---------------------------------------------------------------- contenu */
main{padding:14px 14px 80px}
.vide{text-align:center;color:var(--ink3);padding:48px 14px;font-size:14px}
.vide p{max-width:34em;margin:0 auto}

/* ---- agenda, vue par défaut sur mobile ---- */
.mois{margin-bottom:22px}
.mois>h2{font-size:13px;font-weight:650;color:var(--ink2);text-transform:uppercase;letter-spacing:.05em;
  padding-bottom:7px;border-bottom:1px solid var(--line);margin-bottom:10px;
  display:flex;align-items:baseline;gap:8px}
.mois>h2 .cpt{font-weight:400;text-transform:none;letter-spacing:0;color:var(--ink4);font-size:12px}

.agenda{list-style:none}
.jour{display:grid;grid-template-columns:1fr;gap:5px;padding:9px 0;border-bottom:1px solid var(--line2)}
.jour:last-child{border-bottom:0}
.jh{display:flex;align-items:baseline;gap:7px;color:var(--ink3);font-size:13px}
.jh .jn{font-weight:650;color:var(--ink);font-size:15px}
.jh .aujourdhui{background:var(--ink);color:#fff;border-radius:20px;padding:1px 8px;font-size:11px;font-weight:600}
.jc{display:flex;flex-direction:column;gap:5px;min-width:0}

/* ---- carte ---- */
.carte{border:1px solid var(--line);border-left:4px solid var(--ink4);border-radius:0 var(--r) var(--r) 0;
  background:var(--white);padding:9px 11px;text-align:left;width:100%;display:block}
.carte:hover{background:var(--wash)}
.carte .t{font-size:14px;line-height:1.35;font-weight:500;color:var(--ink)}
.carte .meta{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:6px;
  font-size:12px;color:var(--ink3)}
.carte .meta .pt{width:8px;height:8px;border-radius:50%;flex:0 0 auto}

/* bande d'événement */
.bande{display:flex;align-items:center;gap:6px;font-size:12px;line-height:1.5;border-radius:3px;
  padding:3px 9px;background:#eef1fd;color:#2f3a86;border:1px solid #d8def8;min-width:0;
  white-space:nowrap;overflow:hidden}
.bande.salon{background:#eaf7f0;color:#0f5f42;border-color:#c8e7d8}
.bande .pt{width:6px;height:6px;border-radius:50%;background:currentColor;flex:0 0 auto}
.bande .ty{color:inherit;opacity:.8;overflow:hidden;text-overflow:ellipsis}
.bande .nm{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* note privée */
.notep{background:var(--note-bg);border:1px solid var(--note-line);border-radius:3px;padding:6px 10px;
  font-size:12.5px;line-height:1.45;color:var(--note-txt)}

/* ---- stock sans date ---- */
.stock{background:var(--white);border:1px solid var(--line);border-radius:var(--r);margin-bottom:16px}
.stock>summary{list-style:none;display:flex;align-items:center;gap:8px;padding:11px 13px;font-size:14px;font-weight:600}
.stock>summary::-webkit-details-marker{display:none}
.stock>summary .car{margin-left:auto;color:var(--ink4);font-size:11px}
.stock[open]>summary{border-bottom:1px solid var(--line)}
.stock .liste{padding:8px;display:flex;flex-direction:column;gap:5px}

/* ---- grille mensuelle, à partir de 700px ---- */
.grille{display:none}

/* ---- à valider ---- */
.mdet{display:block}
.mdet .liste-v{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:var(--r);
  overflow:hidden;background:var(--white)}
.rangee{display:block;width:100%;text-align:left;padding:11px 13px;border-bottom:1px solid var(--line2);
  border-left:4px solid transparent;background:var(--white)}
.rangee:last-child{border-bottom:0}
.rangee:hover{background:var(--wash)}
.rangee[aria-current="true"]{background:var(--wash);border-left-color:var(--red)}
.rangee .t{font-size:14px;line-height:1.35;font-weight:500}
.rangee .meta{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin-top:6px;font-size:12px;color:var(--ink3)}
.retour{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line);background:var(--white);
  border-radius:var(--r);padding:8px 13px;font-size:13.5px;margin-bottom:12px}
.fiche{background:var(--white);border:1px solid var(--line);border-radius:var(--r);padding:16px 15px 18px}
.fiche h2{font-size:19px;line-height:1.3;font-weight:650;letter-spacing:-.01em;margin:11px 0 4px}
.chapeau{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.kv{display:grid;grid-template-columns:1fr;gap:2px;padding:12px 0;border-top:1px solid var(--line2);margin-top:14px}
.kv dt{color:var(--ink4);font-size:12px;text-transform:uppercase;letter-spacing:.05em}
.kv dd{font-size:14px;margin-bottom:9px}
.kv dd:last-child{margin-bottom:0}
.kv .second{color:var(--ink3);font-size:12.5px}
.cite{background:var(--wash);border-left:4px solid var(--red);padding:11px 13px;border-radius:0 4px 4px 0;
  font-size:13.5px;line-height:1.6;margin-top:14px;white-space:pre-line;color:var(--ink2)}
a.act{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--red-txt);color:#fff;
  border-radius:var(--r);padding:12px 18px;font-size:14.5px;font-weight:600;text-decoration:none;margin-top:18px;width:100%}
a.act:hover{background:#a81b16}
.act-aide{font-size:12.5px;color:var(--ink3);margin-top:9px;line-height:1.5}

/* ---- ambassadeurs ---- */
.amb{display:flex;flex-direction:column;gap:12px}
.dg{background:var(--white);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.dg.inactif{background:var(--wash)}
.dg>header{padding:12px 13px;border-bottom:1px solid var(--line);display:flex;gap:10px;align-items:flex-start}
.dg h3{font-size:15px;font-weight:650;line-height:1.3}
.dg .fonc{font-size:12.5px;color:var(--ink3);line-height:1.4;margin-top:2px}
.cadences{padding:11px 13px;display:flex;flex-direction:column;gap:9px;border-bottom:1px solid var(--line2)}
.cad{display:grid;grid-template-columns:1fr auto;gap:3px 10px;align-items:center}
.cad .lb{font-size:13px;color:var(--ink2)}
.cad .ch{font-size:13px;text-align:right;white-space:nowrap}
.cad .ch b{font-weight:650}
.cad .jauge{grid-column:1/-1;display:flex;gap:3px;flex-wrap:wrap}
.cad .jauge i{width:16px;height:8px;border-radius:2px;background:var(--line);display:block}
.cad .jauge i.on{background:var(--ink2)}
.cad.rep .jauge i.on{background:#2470bd}
.ecart{font-weight:650;font-size:13px}
.ecart.sous{color:var(--red-txt)}
.ecart.atteint{color:#12724c}
.dg .prods{padding:9px 13px 13px;display:flex;flex-direction:column;gap:6px}
.dg .aucun{padding:13px;font-size:13px;color:var(--ink3)}
.plus{border:1px dashed var(--line);background:none;border-radius:var(--r);padding:9px;font-size:13px;color:var(--ink3);width:100%}

/* ---------------------------------------------------------------- panneaux */
.voile{position:fixed;inset:0;background:rgba(20,22,24,.38);opacity:0;pointer-events:none;
  transition:opacity .15s;z-index:90}
.voile.on{opacity:1;pointer-events:auto}
.tiroir{position:fixed;inset:0;background:var(--white);z-index:100;
  transform:translateY(100%);transition:transform .2s cubic-bezier(.32,.72,0,1);
  display:flex;flex-direction:column;overflow:hidden}
.tiroir.on{transform:none}
.tiroir>header{padding:14px 16px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:12px;flex:0 0 auto}
.tiroir>header h2{font-size:16px;font-weight:650}
.tiroir .fermer{border:0;background:none;color:var(--ink2);display:inline-flex;align-items:center;
  gap:7px;font-size:15px;padding:0 4px;order:-1}
.tiroir .fermer .fl{font-size:19px;line-height:1}
.tiroir .fermer .cr{display:none}
.tiroir>header h2{font-size:16px;font-weight:650;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tiroir .corps{overflow-y:auto;padding:14px 16px 30px;-webkit-overflow-scrolling:touch}
.tiroir .pied{flex:0 0 auto;padding:11px 16px;border-top:1px solid var(--line);display:flex;gap:9px}
.tiroir .pied button{flex:1;border:1px solid var(--line);background:var(--white);border-radius:var(--r);padding:11px;font-size:14px}
.tiroir .pied .prim{background:var(--ink);border-color:var(--ink);color:#fff;font-weight:600}
.grp{margin-bottom:18px}
.grp h3{font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink4);margin-bottom:6px}

.pied-page{border-top:1px solid var(--line);margin-top:30px;padding:16px 14px 0;font-size:12.5px;
  color:var(--ink3);line-height:1.6}
.pied-page b{color:var(--ink2)}

/* ================================================================ ≥ 520px */
@media (min-width:520px){
  .jour{grid-template-columns:74px 1fr;gap:10px;align-items:start}
  .jh{flex-direction:column;gap:0;padding-top:2px}
  .jh .jn{font-size:19px;line-height:1.15}
  .kv{grid-template-columns:118px 1fr;gap:8px 14px}
  .kv dt{text-transform:none;letter-spacing:0;font-size:13px;padding-top:1px}
  .kv dd{margin-bottom:0}
  a.act{width:auto}
}

/* ================================================================ ≥ 700px */
@media (min-width:700px){
  body{font-size:14px}
  .top{padding:12px 20px}
  .ctx{width:auto;order:0}
  .ecrans{padding:0 14px}
  .outils{padding:9px 20px;flex-direction:row;align-items:center;flex-wrap:wrap}
  .rech{flex:0 1 210px;padding:7px 10px;font-size:13px}
  .synthese{padding:8px 20px}
  main{padding:16px 20px 80px}

  /* la grille mensuelle devient possible */
  .grille{display:block;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:var(--white)}
  .grille .jours-en{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));background:var(--wash);
    border-bottom:1px solid var(--line)}
  .grille .jours-en div{padding:6px 8px;font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink4)}
  .grille .sem{border-bottom:1px solid var(--line)}
  .grille .sem:last-child{border-bottom:0}
  .grille .couloir{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:2px;padding:3px 3px 0}
  .grille .couloir .bande{padding:1px 7px;font-size:11px}
  .grille .cases{display:grid;grid-template-columns:repeat(7,minmax(0,1fr))}
  .grille .case{min-height:104px;padding:4px 5px 7px;border-right:1px solid var(--line2);min-width:0;overflow:hidden}
  .grille .case:last-child{border-right:0}
  .grille .case.hors{background:#fcfcfd}
  .grille .case.we{background:#fafbfb}
  .grille .num{font-size:12px;color:var(--ink4);padding:1px 2px 4px;display:inline-block}
  .grille .case.jour-j .num{background:var(--ink);color:#fff;border-radius:50%;width:21px;height:21px;
    display:inline-flex;align-items:center;justify-content:center;font-weight:650}
  .grille .carte{border:0;border-left:3px solid var(--ink4);background:var(--wash);border-radius:0 3px 3px 0;
    padding:4px 6px;margin-bottom:3px;min-height:0}
  .grille .carte .t{font-size:12px;line-height:1.3;font-weight:400;display:-webkit-box;
    -webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .grille .carte .meta{margin-top:3px;font-size:11px;gap:5px}
  .grille .notep{padding:4px 7px;font-size:11px;margin-bottom:3px}
  .grille .autres{border:0;background:none;color:var(--ink3);font-size:11.5px;text-decoration:underline;
    padding:2px 3px;min-height:0}
  .grille .autres:hover{color:var(--red-txt)}
  .repart{display:inline;margin-left:auto;padding-left:14px;color:var(--ink4);font-size:12px}
}

/* ================================================================ ≥ 900px */
@media (min-width:900px){
  .mdet{display:grid;grid-template-columns:minmax(280px,340px) 1fr;gap:16px;align-items:start}
  .mdet .liste-v{max-height:calc(100vh - 230px);overflow-y:auto}
  .mdet .fiche{max-height:calc(100vh - 230px);overflow-y:auto}
  .retour{display:none}
  .dg .prods{flex-direction:row;overflow-x:auto;gap:8px;padding-bottom:14px}
  .dg .prods>.carte{flex:0 0 250px}
  .plus{width:auto;flex:0 0 auto;align-self:stretch;padding:9px 14px}
  .cadences{flex-direction:row;gap:26px}
  .cad{flex:1;grid-template-columns:1fr auto}
}

/* ================================================================ ≥ 1080px */
@media (min-width:1080px){
  .top{padding:13px 24px}
  .outils{padding:9px 24px}
  .synthese{padding:8px 24px}
  main{padding:18px 24px 80px}
  .btn-filtres{display:none}
  .enligne{display:flex}
  .colonnes{display:grid;grid-template-columns:1fr 264px;gap:18px;align-items:start}
  .stock{position:sticky;top:64px;margin-bottom:0;max-height:calc(100vh - 96px);display:flex;flex-direction:column}
  .stock .liste{overflow-y:auto}
  .stock>summary{cursor:default}
  .stock>summary .car{display:none}
}

@media (prefers-reduced-motion:reduce){
  *{transition:none !important;animation:none !important}
}

@media print{
  .ecrans,.outils,.apercu,.voile,.tiroir,.stock>summary .car{display:none !important}
  body{background:#fff;font-size:11pt}
  .carte,.grille,.dg{break-inside:avoid}
}

/* ---- anomalies de la dernière construction, version de travail seulement ---- */
.anomalies{margin-top:12px;border:1px solid var(--alerte-line);background:var(--alerte-bg);
  border-radius:var(--r);padding:0 12px}
.anomalies>summary{list-style:none;display:flex;align-items:center;gap:9px;padding:10px 0;
  font-size:13px;color:var(--alerte-txt);font-weight:600}
.anomalies>summary::-webkit-details-marker{display:none}
.anomalies>summary .puce{font-size:14px}
.anomalies>summary .car{margin-left:auto;font-size:11px;font-weight:400}
.anomalies[open]>summary{border-bottom:1px solid var(--alerte-line)}
.anomalies ul{list-style:none;margin:10px 0 0;display:flex;flex-direction:column;gap:6px}
.anomalies li{font-size:12.5px;line-height:1.45;color:var(--ink2)}
.anomalies li .ou{display:inline-block;font-weight:650;color:var(--alerte-txt);
  background:var(--white);border:1px solid var(--alerte-line);border-radius:3px;
  padding:0 6px;margin-right:6px;white-space:nowrap}
.anomalies .quoi{font-size:12px;color:var(--ink3);line-height:1.5;margin:10px 0 12px;
  padding-top:9px;border-top:1px solid var(--alerte-line)}


/* ---------------------------------------------------------------- le post */
/* Une colonne de lecture bornée. Un texte de 2 000 signes étalé sur 1 400 px
   est illisible : l'œil perd la ligne. On plafonne autour de 62 signes. */
.tiroir .fiche.lecture{max-width:none;padding:0;border:0;background:none}
.post{margin:16px 0 4px}
.post .bloc{
  white-space:pre-wrap;          /* restitue les sauts de ligne ET les lignes vides */
  font-size:16px;line-height:1.62;color:var(--ink);
  max-width:38em;
  overflow-wrap:break-word;
}
.post .bloc + .bloc{margin-top:0}
/* La portion visible avant « voir plus » est signalée par une teinte, à
   l'intérieur du même bloc de texte. Aucun filet, aucune rupture : le texte
   se lit d'un trait, la couleur informe sans interrompre. */
.post .avant{
  background:var(--zone);
  box-shadow:0 0 0 2px var(--zone);   /* respire sans déplacer une ligne */
  border-radius:2px;
  -webkit-box-decoration-break:clone;box-decoration-break:clone;
}
.post .legende{max-width:38em;margin-top:18px;color:var(--ink3);font-size:12px;line-height:1.5;
  display:flex;align-items:baseline;gap:8px}
.post .legende .puce{width:11px;height:11px;border-radius:2px;background:var(--zone);
  border:1px solid var(--zone-bord);flex:0 0 auto;transform:translateY(1px)}

.fiche .sous{color:var(--ink3);font-size:13px;margin:2px 0 0;display:flex;flex-wrap:wrap;gap:7px}
.fiche .sous .sep{color:var(--line)}
.fiche.lecture h2{font-size:20px;margin:12px 0 0}
.fiche.lecture .kv{max-width:38em}
.rangee .extrait{display:block;margin-top:4px;color:var(--ink3);font-size:12.5px;line-height:1.45}

/* ================================================================ ≥ 700px */
@media (min-width:700px){
  .tiroir{inset:24px auto 24px 50%;transform:translate(-50%,110%);width:min(760px,calc(100vw - 48px));
    border-radius:12px;box-shadow:0 24px 70px rgba(20,22,24,.28)}
  .tiroir.on{transform:translate(-50%,0)}
  .tiroir>header{padding:16px 22px}
  .tiroir .corps{padding:18px 22px 34px}
  .tiroir .fermer{order:0;margin-left:auto}
  .tiroir .fermer .fl,.tiroir .fermer .lb{display:none}
  .tiroir .fermer .cr{display:inline;font-size:26px;line-height:1;color:var(--ink3)}
  .post .bloc{font-size:16.5px}
}
