main[data-decouvrir="journaux"] #dv .lb{padding:24px;background:#080e1beF;overflow:auto}
main[data-decouvrir="journaux"] #dv .lbin{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:20px;max-width:1140px;padding-top:42px;height:calc(100dvh - 48px);margin:auto;--ink:#f3f6fc;--line:#364153;--mut:#b8c3d7;--acc2:#abc6ff}
main[data-decouvrir="journaux"] #dv .lb .x{position:absolute;top:0;right:0;float:none;z-index:3;width:40px;height:40px;border-radius:8px;background:#1c293f;font:28px/1 system-ui;color:#fff}
main[data-decouvrir="journaux"] #dv .jr-stage{position:relative;overflow:auto;min-height:0;background:#111722;border:1px solid #364153;border-radius:10px;grid-column:1;grid-row:1 / 3;padding:14px;overscroll-behavior:contain}
.jr-sheet{position:relative;margin:0 auto;flex-shrink:0}main[data-decouvrir="journaux"] #dv #lbimg{display:block;cursor:default;border-radius:0;box-shadow:none}
main[data-decouvrir="journaux"] #dv .lbmeta{grid-column:2;grid-row:2;overflow:auto;font-size:12px;max-height:155px;padding:12px 0;border-top:1px solid #364153}main[data-decouvrir="journaux"] #dv .lbmeta .t{font:650 14px/1.4 system-ui}main[data-decouvrir="journaux"] #dv .lbdl{background:#c0d2ff;color:#14213d;font-size:12px;padding:9px;min-height:40px}main[data-decouvrir="journaux"] #dv .lbfree{margin:8px 0 0}
.jr-tools{grid-column:2;grid-row:1;overflow:auto;min-height:0;padding-right:6px;font:14px/1.45 system-ui;color:#f3f6fc;overscroll-behavior:contain}.jr-heading>span{font-size:10px;letter-spacing:.14em;color:#a9c5ff;font-weight:700}.jr-heading h2{font:750 23px/1.2 system-ui;margin:5px 0}.jr-heading p{color:#b8c3d7;font-size:12px;margin:8px 0 18px}.jr-control{display:block;font-size:13px;margin:12px 0}.jr-control output{float:right;color:#abc6ff}.jr-control input{display:block;width:100%;min-height:28px;margin:3px 0;accent-color:#adc6ff}.jr-tools button,.jr-tools select{display:block;width:100%;min-height:40px;border:1px solid #46556c;border-radius:8px;background:#1c293f;color:#f3f6fc;padding:8px 12px;font:600 13px/1.4 system-ui;text-align:left;margin:7px 0;cursor:pointer}.jr-tools button[aria-pressed=true]{background:#c0d2ff;color:#14213d}.jr-tools button:disabled{opacity:.45;cursor:not-allowed}.jr-language{display:block;color:#b8c3d7;font-size:12px;margin-top:18px}.jr-note,#jr-status{font:12px/1.5 system-ui;color:#b8c3d7}.jr-tools .jr-reset{background:transparent;text-align:center}.jr-tools textarea{width:100%;background:#f9fafc;color:#172031;border-radius:8px;padding:12px;font:15px/1.6 system-ui;resize:vertical}.jr-tools :is(button,input,select,textarea):focus-visible{outline:2px solid #abc6ff;outline-offset:2px}.jr-lens{position:absolute;z-index:3;width:170px;height:170px;border:3px solid #abc6ff;border-radius:50%;overflow:hidden;pointer-events:none;background:#fff;box-shadow:0 5px 25px #0008}.jr-guide{position:absolute;left:0;right:0;height:34px;transform:translateY(-50%);background:#ffdc441c;border-block:2px solid #eebd38;pointer-events:none;z-index:2}
@media(max-width:760px){main[data-decouvrir="journaux"] #dv .lb{padding:12px}main[data-decouvrir="journaux"] #dv .lbin{display:flex;flex-direction:column;gap:14px;height:auto;min-height:calc(100dvh - 24px)}main[data-decouvrir="journaux"] #dv .jr-stage{height:60dvh;flex:none;width:100%}.jr-tools{overflow:visible;padding:0}.jr-tools button{min-height:44px}main[data-decouvrir="journaux"] #dv .lbmeta{order:3;max-height:none}}
main[data-decouvrir="journaux"] #dv .lb{background:#0d1422}
main[data-decouvrir="journaux"] #dv .lbin{grid-template-rows:minmax(0,1fr) auto}
.jr-tools{background:#0d1422;scrollbar-width:thin}.jr-stage{scrollbar-width:thin}
.jr-recent{margin:18px 0 24px;border:1px solid var(--line);border-radius:12px;padding:14px 18px;background:var(--surface);font-size:14px}.jr-recent summary{cursor:pointer;font-weight:650;color:var(--ink)}.jr-recent p{color:var(--muted);line-height:1.6}.jr-sources{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.jr-sources a{display:block;padding:14px;border:1px solid var(--line);border-radius:10px;font-weight:650}.jr-sources small{display:block;font-size:12px;font-weight:400;line-height:1.5;margin-top:6px;color:var(--muted)}.jr-recent .jr-rights{font-size:12px}@media(max-width:760px){.jr-sources{grid-template-columns:1fr}}
@media(max-width:760px){main[data-decouvrir="journaux"] #dv .lb .x{position:fixed;top:12px;right:12px}}
/* ZONE À LIRE (lot v2-journal-zone-r1) : le cadre que l'on trace avant l'extraction.
   L'ombre de 9999px assombrit toute la page autour du cadre : on voit d'un coup d'œil
   ce qui sera lu, sans ajouter d'élément ni repeindre l'image. Elle est coupée par le
   débordement de .jr-stage, donc elle ne déborde jamais du cadre de lecture. */
.jr-pick{position:absolute;z-index:2;border:2px solid #ffd54a;background:#ffd54a14;box-shadow:0 0 0 9999px #060b16b3;pointer-events:none}
main[data-decouvrir="journaux"] #dv .jr-stage.jr-picking{cursor:crosshair;touch-action:none}
main[data-decouvrir="journaux"] #dv .jr-stage.jr-picking .jr-lens{display:none}
main[data-decouvrir="journaux"] #dv .jr-tools #jr-zone-clear[hidden]{display:none}
/* Le menu des langues redevenait illisible sous l'apparence 6 : `html[data-style="6"]
   select option{background:var(--surface);color:var(--ink)}` prend le --surface CLAIR de
   la page et le --ink que .lbin redéfinit en clair pour le panneau sombre, donc texte pâle sur
   fond blanc (capture Stéphane du 22/09). On fixe les deux couleurs ici, sur le select ET
   ses options, et on coupe l'apparence native pour que le fond sombre tienne partout. */
main[data-decouvrir="journaux"] #dv .jr-tools select{appearance:none;-webkit-appearance:none;background-color:#1c293f;color:#f3f6fc;padding-right:34px;background-image:linear-gradient(45deg,transparent 50%,#abc6ff 50%),linear-gradient(135deg,#abc6ff 50%,transparent 50%);background-size:6px 6px,6px 6px;background-repeat:no-repeat;background-position:calc(100% - 18px) 18px,calc(100% - 12px) 18px}
main[data-decouvrir="journaux"] #dv .jr-tools select option{background:#1c293f;color:#f3f6fc}
/* PANNEAU REFONDU (lot v2-journal-lire-r2) : une action principale, le français d'abord,
   les réglages rangés dans un repli. Les styles ci-dessus restent ceux du lecteur du 18/09,
   on ne redéfinit ici que ce que la nouvelle hiérarchie demande. */
.jr-tools .jr-main{background:#c0d2ff;color:#14213d;font:700 15px/1.4 system-ui;text-align:center;min-height:48px;margin:14px 0 8px}
.jr-tools .jr-main[aria-pressed=true]{background:#ffd54a;color:#231a00}
#jr-zone-actions{display:flex;gap:8px}
#jr-zone-actions button{margin:0 0 8px}
#jr-zone-actions .jr-lien{flex:0 0 auto;width:auto;padding:8px 10px}
.jr-tools .jr-lien{display:inline-block;width:auto;background:transparent;border-color:transparent;color:#abc6ff;text-decoration:underline;min-height:0;padding:6px 0;font-weight:600}
.jr-tools .jr-lien:hover{color:#dbe6ff}
.jr-tools h3{font:700 14px/1.3 system-ui;margin:16px 0 7px;color:#f3f6fc}
.jr-fr{background:#f9fafc;color:#172031;border-radius:8px;padding:13px 14px;font:15px/1.65 system-ui;white-space:pre-wrap;max-height:42vh;overflow:auto}
#jr-resultat{margin-top:6px}
.jr-tools details{margin:12px 0}
.jr-tools details>summary{cursor:pointer;list-style:none;border:1px solid #46556c;border-radius:8px;background:#1c293f;padding:11px 12px;font:600 13px/1.4 system-ui;color:#f3f6fc;min-height:40px;display:flex;align-items:center;justify-content:space-between}
.jr-tools details>summary::-webkit-details-marker{display:none}
.jr-tools details>summary::after{content:"";width:7px;height:7px;border-right:2px solid #abc6ff;border-bottom:2px solid #abc6ff;transform:rotate(45deg) translateY(-2px);transition:transform .15s}
.jr-tools details[open]>summary::after{transform:rotate(-135deg) translateY(-2px)}
.jr-tools details>summary:focus-visible{outline:2px solid #abc6ff;outline-offset:2px}
.jr-tools details[open]>summary{border-bottom-left-radius:0;border-bottom-right-radius:0}
.jr-tools details>:not(summary){padding:0 2px}
.jr-reglages{border-top:1px solid #364153;padding-top:12px;margin-top:18px}
@media(max-width:760px){.jr-fr{max-height:none}.jr-tools .jr-main{min-height:52px}}
/* Le titre du panneau tenait sur deux lignes avec le point d'interrogation tout seul sur la
   seconde (capture du banc, 22/09) : titre raccourci, et on demande au navigateur
   d'équilibrer les lignes plutôt que de remplir la première. */
.jr-heading h2{text-wrap:balance}
/* LARGEUR DU PANNEAU (lot v2-journal-panneau-r4) : la colonne de droite n'est plus figée à
   280 px, elle suit `--jr-panneau`. La poignée reprend la forme de celle du salon
   (`.tchat-poignee` : pilule, cible tactile de 44 px, révélée au survol, toujours visible au
   doigt), tournée d'un quart de tour, et prend les couleurs du panneau sombre plutôt que le
   blanc de `--surface`, qui jurerait ici. Elle se place dans la gouttière de 20 px. */
main[data-decouvrir="journaux"] #dv .lbin{grid-template-columns:minmax(0,1fr) var(--jr-panneau,280px)}
.jr-poignee{position:absolute;right:calc(var(--jr-panneau,280px) + 10px);top:50%;z-index:12;transform:translate(50%,-50%);display:grid;place-items:center;width:24px;height:34px;min-width:24px;min-height:34px;padding:0;border:1px solid #46556c;border-radius:12px;background:#1c293f;color:#abc6ff;box-shadow:0 2px 8px #0009;cursor:col-resize;touch-action:none;opacity:0;transition:opacity .15s}
main[data-decouvrir="journaux"] #dv .lbin:hover .jr-poignee,main[data-decouvrir="journaux"] #dv .lbin:focus-within .jr-poignee,.jr-poignee[data-actif="1"]{opacity:1}
.jr-poignee:hover,.jr-poignee[data-actif="1"]{background:#c0d2ff;color:#14213d}
.jr-poignee:focus-visible{opacity:1;outline:2px solid #abc6ff;outline-offset:3px}
.jr-poignee>svg{width:12px;height:16px;pointer-events:none}
.jr-poignee::after{content:"";position:absolute;left:50%;top:50%;width:44px;height:44px;transform:translate(-50%,-50%)}
@media(hover:none){.jr-poignee{opacity:1}}
/* La traduction est ce qu'on vient lire : elle gagne en hauteur en même temps qu'en largeur. */
.jr-fr{max-height:min(56vh,560px);font-size:15.5px}
@media(max-width:760px){.jr-poignee{display:none}main[data-decouvrir="journaux"] #dv .lbin{grid-template-columns:none}.jr-fr{max-height:none}}

/* LE PRINCIPE, ANNONCÉ EN HAUT DE LA PAGE (même lot) : la lecture d'un article entouré ne se
   devine pas depuis la galerie, il faut avoir ouvert une une pour la découvrir. Trois temps,
   des pictogrammes maison plutôt que des emoji, et rien qui clignote. */
.jr-mode{margin:22px 0 26px;border:1px solid var(--line);border-radius:14px;padding:18px 20px;background:var(--surface)}
.jr-mode h2{font:750 19px/1.25 system-ui;margin:0 0 6px}
.jr-mode>p{color:var(--muted);margin:0 0 16px;font-size:14px;line-height:1.6;max-width:62ch}
.jr-mode-etapes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:0;padding:0;list-style:none;counter-reset:jrm}
.jr-mode-etapes li{display:flex;gap:11px;align-items:flex-start;font-size:14px;line-height:1.5}
.jr-mode-etapes svg{flex:0 0 auto;width:26px;height:26px;color:var(--accent,#315bc6)}
.jr-mode-etapes b{display:block;font-weight:650}
.jr-mode-etapes span{color:var(--muted)}
@media(max-width:760px){.jr-mode{padding:15px 16px;margin:16px 0 20px}.jr-mode-etapes{grid-template-columns:1fr;gap:12px}}
/* MONTRER QUE ÇA TRAVAILLE (lot v2-journal-progres-r5). Capture de Stéphane, 23/09 :
   « Lecture du texte : 16 % » en gris, perdu entre le zoom et un repli. Pendant qu'une
   machine tourne, le bloc passe en évidence, une barre avance, et le cadre sur le journal
   respire : c'est l'image qu'on regarde en attendant, pas le panneau. */
.jr-travail{margin:12px 0}
.jr-travail[data-actif="1"]{border:1px solid #46556c;border-radius:10px;background:#16223a;padding:11px 13px}
.jr-travail[data-actif="1"] #jr-status{color:#f3f6fc;font:600 13.5px/1.45 system-ui;display:flex;align-items:center;gap:9px}
.jr-travail[data-actif="1"] #jr-status::before{content:"";flex:0 0 auto;width:14px;height:14px;border-radius:50%;border:2px solid #abc6ff;border-top-color:transparent;animation:jr-tourne .85s linear infinite}
@keyframes jr-tourne{to{transform:rotate(360deg)}}
.jr-barre{height:6px;border-radius:99px;background:#26334c;overflow:hidden;margin-top:10px}
.jr-barre>i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,#8fb3ff,#c0d2ff);width:0;transition:width .25s ease-out}
.jr-barre[data-mode="indetermine"]>i{width:38%;animation:jr-glisse 1.2s ease-in-out infinite}
@keyframes jr-glisse{0%{margin-left:-40%}100%{margin-left:102%}}
.jr-pick[data-travail="1"]{animation:jr-cadre 1.5s ease-in-out infinite}
@keyframes jr-cadre{0%,100%{border-color:#ffd54a;box-shadow:0 0 0 9999px #060b16b3}50%{border-color:#fff6d2;box-shadow:0 0 0 9999px #060b16b3,0 0 18px 2px #ffd54a66}}
@media(prefers-reduced-motion:reduce){
  .jr-travail[data-actif="1"] #jr-status::before{animation:none;border-top-color:#abc6ff;opacity:.6}
  .jr-barre[data-mode="indetermine"]>i{animation:none;width:100%;opacity:.55}
  .jr-pick[data-travail="1"]{animation:none}}

/* LA PLACE AU TEXTE (même lot) : « une fois la zone extraite et/ou traduite on lui donne bcp
   plus de place, les autres outils se cachent ». Le titre, les commandes secondaires, le zoom
   et les réglages se replient ; le bouton principal reste, puisque le geste suivant est
   presque toujours d'entourer un autre article ; « Outils » rouvre le tout. */
.jr-tete{display:flex;align-items:center;gap:10px}
.jr-tete .jr-main{flex:1;margin:14px 0 8px}
.jr-tools[data-lecture="1"]{display:flex;flex-direction:column}
.jr-tools[data-lecture="1"] .jr-heading,
.jr-tools[data-lecture="1"] #jr-secondaire,
.jr-tools[data-lecture="1"] .jr-reglages{display:none}
.jr-tools[data-lecture="1"][data-outils="1"] .jr-heading,
.jr-tools[data-lecture="1"][data-outils="1"] #jr-secondaire{display:block}
.jr-tools[data-lecture="1"][data-outils="1"] .jr-reglages{display:block}
.jr-tools[data-lecture="1"] .jr-tete{flex:0 0 auto}
.jr-tools[data-lecture="1"] .jr-travail{flex:0 0 auto}
.jr-tools[data-lecture="1"] #jr-resultat{flex:1 1 auto;min-height:0;display:flex;flex-direction:column;margin-top:4px}
.jr-tools[data-lecture="1"] #jr-fr-bloc{flex:1 1 auto;min-height:0;display:flex;flex-direction:column}
.jr-tools[data-lecture="1"] #jr-fr-bloc h3{flex:0 0 auto}
.jr-tools[data-lecture="1"] .jr-fr{flex:1 1 auto;min-height:120px;max-height:none}
.jr-tools[data-lecture="1"] #jr-vo{flex:0 0 auto}
#jr-outils{flex:0 0 auto;white-space:nowrap}
@media(max-width:760px){.jr-tools[data-lecture="1"]{display:block}.jr-tools[data-lecture="1"] .jr-fr{min-height:0}}
/* `hidden` DOIT RESTER HIDDEN (mesuré au banc le 23/09, bug présent depuis le lot r2).
   Plusieurs règles de ce fichier posent un `display` sur des éléments qui portent l'attribut :
   `.jr-tools .jr-lien{display:inline-block}` et `#jr-zone-actions{display:flex}`. Une règle
   de classe bat `[hidden]{display:none}` de la feuille du navigateur, donc le lien « Ouvrir
   dans Google Traduction », qui ne doit apparaître qu'en dernier recours, et les boutons
   « Relire cette zone / Effacer le cadre », qui n'ont de sens qu'avec un cadre, restaient
   affichés en permanence. Une seule règle, en fin de feuille, referme le piège pour tout le
   lecteur. */
main[data-decouvrir="journaux"] #dv [hidden]{display:none!important}
/* LES 80 % POUR LE TEXTE. Première mesure au banc : 58 % de la hauteur du panneau. Le reste
   dormait dans des blocs qui n'avaient plus rien à dire une fois la lecture finie. On reprend
   sans rien retirer d'utile : le bandeau d'état s'efface quand il n'y a plus d'attente (sa
   dernière phrase passe à côté du titre « En français »), le bouton du haut se compacte, la
   note et le repli se resserrent, et la fiche du journal rend une soixantaine de pixels. */
.jr-tools[data-lecture="1"] .jr-travail[data-actif="0"]{display:none}
.jr-tools[data-lecture="1"] .jr-tete .jr-main{min-height:42px;margin:10px 0 4px;font-size:14px}
.jr-tools[data-lecture="1"] #jr-fr-bloc h3{margin:4px 0 6px;font-size:13px}
.jr-tools[data-lecture="1"] #jr-fr-note{font-size:11.5px;line-height:1.45;margin:6px 0 0}
.jr-tools[data-lecture="1"] #jr-vo{margin:8px 0 0}
.jr-tools[data-lecture="1"] #jr-vo>summary{min-height:34px;padding:7px 11px;font-size:12.5px}
.jr-tools[data-lecture="1"] #jr-resultat{margin-top:0}
main[data-decouvrir="journaux"] #dv .lbin[data-lecture="1"] .lbmeta{max-height:92px;padding:9px 0}
#jr-source{font-weight:400;color:#b8c3d7;font-size:12px}
@media(max-width:760px){main[data-decouvrir="journaux"] #dv .lbin[data-lecture="1"] .lbmeta{max-height:none}}
/* LA MISE EN PAGE RETROUVÉE (lot v2-journal-mep-r6). Une annonce de 1839 est une petite
   affiche : titre énorme, accroche en italique, corps serré, prix en gras, date en petit.
   La traduction rendait un pavé uniforme. Les tailles ci-dessous ne cherchent pas à imiter
   le plomb d'origine, mais à rendre la HIÉRARCHIE lisible d'un coup d'œil. */
.jr-fr .jr-b{margin:0 0 9px}
.jr-fr .jr-b:last-child{margin-bottom:0}
.jr-fr .jr-t1{font:750 20px/1.25 system-ui;letter-spacing:.005em;margin:2px 0 10px}
.jr-fr .jr-t2{font:700 16px/1.3 system-ui;margin:14px 0 7px}
.jr-fr .jr-corps{font:15.5px/1.65 system-ui}
.jr-fr .jr-petit{font-size:12.5px;line-height:1.5;color:#4b5a72}
.jr-fr .jr-centre{text-align:center}
.jr-fr .jr-t1+.jr-t2{margin-top:2px}
/* l'interrupteur, dans l'en-tête du bloc : petit, à sa place, jamais au centre de l'attention */
.jr-bascule{float:right;display:inline-flex;align-items:center;gap:6px;font:400 11.5px/1 system-ui;color:#b8c3d7;cursor:pointer;user-select:none}
.jr-bascule input{width:30px;height:17px;margin:0;appearance:none;-webkit-appearance:none;border-radius:99px;background:#39465e;position:relative;cursor:pointer;transition:background .15s;flex:0 0 auto}
.jr-bascule input::after{content:"";position:absolute;top:2px;left:2px;width:13px;height:13px;border-radius:50%;background:#dbe3f2;transition:transform .15s}
.jr-bascule input:checked{background:#8fb3ff}
.jr-bascule input:checked::after{transform:translateX(13px);background:#12203a}
.jr-bascule input:focus-visible{outline:2px solid #abc6ff;outline-offset:2px}
@media(max-width:760px){.jr-fr .jr-t1{font-size:18px}}
/* ESSAYER SUR UNE ANNONCE (lot v2-journal-essai-r7). Suggestion 5, retenue par Stéphane le
   26/09 : trois annonces au-dessus de la galerie, un clic ouvre la une et entoure l'annonce.
   Chaque carte est un BOUTON entier, image comprise : un seul geste, une cible large. Les
   couleurs sont les jetons de la page (--surface, --ink, --muted, --line, --accent, --soft),
   redéfinis par le thème de nuit : le jour et la nuit suivent sans rien redéfinir ici. La
   vignette montre le HAUT de l'annonce, titre et gravure, là où l'œil reconnaît un sujet. */
.jr-essai{margin:0 0 26px}
.jr-essai h2{font:750 19px/1.25 system-ui;margin:0 0 6px}
.jr-essai>p{color:var(--muted);margin:0 0 14px;font-size:14px;line-height:1.6;max-width:62ch}
.jr-essai-cartes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.jr-essai-carte{display:flex;flex-direction:column;align-items:stretch;width:100%;min-height:0;margin:0;padding:0;border:1px solid var(--line);border-radius:12px;background:var(--surface);color:var(--ink);font:inherit;text-align:left;overflow:hidden;cursor:pointer;transition:border-color .15s,box-shadow .15s}
.jr-essai-carte img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;object-position:top;background:var(--soft);border-bottom:1px solid var(--line)}
.jr-essai-lieu{display:block;margin:12px 14px 2px;font-size:12px;line-height:1.4;color:var(--muted)}
.jr-essai-carte b{display:block;margin:0 14px;font:650 15px/1.35 system-ui}
.jr-essai-txt{display:block;margin:5px 14px 14px;font-size:13.5px;line-height:1.55;color:var(--muted)}
.jr-essai-carte:hover{border-color:var(--accent);box-shadow:0 4px 18px #14213d1f}
.jr-essai-carte:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.jr-essai-carte[aria-busy="true"]{cursor:progress;border-color:var(--accent)}
.jr-essai-note{margin:12px 0 0;padding:10px 13px;border-radius:10px;background:var(--soft);color:var(--ink);font-size:13.5px;line-height:1.5}
/* au téléphone, trois images pleine largeur feraient un mur de neuf cents pixels avant la
   collection : chaque carte passe en ligne, l'image à gauche, le texte à droite */
@media(max-width:760px){
  .jr-essai-cartes{grid-template-columns:1fr;gap:10px}
  .jr-essai-carte{display:grid;grid-template-columns:40% minmax(0,1fr);grid-template-rows:auto auto 1fr;column-gap:12px}
  .jr-essai-carte img{grid-row:1 / 4;align-self:stretch;height:auto;min-height:104px;aspect-ratio:auto;border-bottom:0;border-right:1px solid var(--line)}
  .jr-essai-lieu{margin:10px 12px 2px 0}
  .jr-essai-carte b{margin:0 12px 0 0;font-size:14.5px}
  .jr-essai-txt{margin:4px 12px 10px 0;font-size:13px;line-height:1.5}}
/* LA VIGNETTE DE LA ZONE (même lot, suggestion 13) : en tête du texte français, flottante à
   droite, elle relie ce qu'on lit à l'endroit d'où il vient. Un clic ramène le cadre à
   l'écran et l'éclaire trois fois. Le bouton hérite des règles `.jr-tools button` (pleine
   largeur, fond sombre) : on les reprend ici, sur le fond clair du texte français. */
.jr-tools .jr-apercu{float:right;width:96px;min-height:0;margin:2px 0 8px 12px;padding:0;border:1px solid #c9d3e3;border-radius:6px;background:#fff;overflow:hidden;cursor:pointer;line-height:0}
.jr-tools .jr-apercu img{display:block;width:100%;height:auto;max-height:144px;object-fit:cover;object-position:top}
.jr-tools .jr-apercu:hover{border-color:#8fb3ff;box-shadow:0 2px 10px #14213d26}
.jr-tools .jr-apercu:focus-visible{outline:2px solid #2456c6;outline-offset:2px}
.jr-pick.jr-pick-flash{animation:jr-flash .5s ease-in-out 3}
@keyframes jr-flash{0%,100%{border-color:#ffd54a;box-shadow:0 0 0 9999px #060b16b3}50%{border-color:#fff;box-shadow:0 0 0 9999px #060b16b3,0 0 0 5px #ffd54a99}}
@media(prefers-reduced-motion:reduce){.jr-essai-carte{transition:none}.jr-pick.jr-pick-flash{animation:none;outline:3px solid #fff;outline-offset:2px}}
@media(max-width:760px){.jr-tools .jr-apercu{width:84px}}
/* ── v2-journal-surimp-r8 : la traduction posée sur le journal ─────────────────────────────
   Le calque suit le cadre (même rectangle) et passe SOUS lui : le voile jaune du cadre et son
   bord restent visibles. Aucun `display` n'est posé sur une classe (règle du lecteur : un
   `display` de classe écrase `[hidden]`), la visibilité passe par le style en ligne. */
.jr-surimp{position:absolute;z-index:1;pointer-events:none;overflow:visible}
.jr-surimp .jr-sur-papier,.jr-surimp .jr-sur-texte{opacity:0;transition:opacity .24s ease}
.jr-surimp .jr-sur-vu{opacity:1}
.jr-surimp .jr-sur-texte{font-family:"Iowan Old Style","Palatino Linotype",Palatino,"Book Antiqua",Georgia,"Times New Roman",serif;font-kerning:normal;text-rendering:geometricPrecision}
.jr-surimp .jr-sur-contour{fill:#3b82f612;stroke:#3b82f6;stroke-width:2;stroke-opacity:.9;animation:jr-sur-pouls 1.6s ease-in-out infinite}
.jr-surimp .jr-sur-barre{fill:#2563eb;transform-box:fill-box;transform-origin:left center;animation:jr-sur-balaye .42s ease-out both}
@keyframes jr-sur-pouls{50%{stroke-opacity:.45;fill:#3b82f606}}
@keyframes jr-sur-balaye{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.jr-bascule.jr-bascule-sur{margin-right:12px}
@media (prefers-reduced-motion:reduce){.jr-surimp .jr-sur-papier,.jr-surimp .jr-sur-texte{transition:none}.jr-surimp .jr-sur-contour{animation:none}.jr-surimp .jr-sur-barre{animation:none}}

/* POIGNEES_DEBUT (lot v2-journal-poignees-r9) : les huit poignees du cadre. Specificite 0,2,0 au
   moins : la page donne a tout bouton min-height:44px et touch-action:manipulation, remis a zero
   ici. La zone de toucher fait 44 px au moins (pseudo-element), la poignee visible 14 px. */
.jr-pick .jr-bord{position:absolute;box-sizing:border-box;width:14px;height:14px;min-width:0;min-height:0;margin:0;padding:0;border:2px solid #0b1220;border-radius:3px;background:#ffd54a;box-shadow:0 0 0 1px #ffd54acc;pointer-events:auto;touch-action:none;cursor:nwse-resize;z-index:3;-webkit-appearance:none;appearance:none}
/* la zone de toucher se place par rapport a l'INTERIEUR de la bordure (2 px) : (taille - 4) + 2 x marge
   >= 44 px sur chaque axe. Mesure au banc, pixel par pixel : 40 px avec une marge qui oubliait la bordure. */
.jr-pick .jr-bord::before{content:"";position:absolute;inset:-17px}
.jr-pick :is(.jr-bord-n,.jr-bord-s,.jr-bord-e,.jr-bord-w)::before{inset:-19px}
.jr-pick :is(.jr-bord-nw,.jr-bord-ne,.jr-bord-se,.jr-bord-sw){z-index:4}
.jr-pick .jr-bord-nw{left:-8px;top:-8px}
.jr-pick .jr-bord-ne{right:-8px;top:-8px;cursor:nesw-resize}
.jr-pick .jr-bord-se{right:-8px;bottom:-8px}
.jr-pick .jr-bord-sw{left:-8px;bottom:-8px;cursor:nesw-resize}
.jr-pick .jr-bord-n,.jr-pick .jr-bord-s{left:calc(50% - 11px);width:22px;height:10px;border-radius:5px;cursor:ns-resize}
.jr-pick .jr-bord-n{top:-6px}
.jr-pick .jr-bord-s{bottom:-6px}
.jr-pick .jr-bord-e,.jr-pick .jr-bord-w{top:calc(50% - 11px);width:10px;height:22px;border-radius:5px;cursor:ew-resize}
.jr-pick .jr-bord-e{right:-6px}
.jr-pick .jr-bord-w{left:-6px}
.jr-pick .jr-bord:hover,.jr-pick[data-ajuste="1"] .jr-bord{background:#fff3b8}
.jr-pick .jr-bord:focus-visible{outline:3px solid #fff;outline-offset:2px}
.jr-pick[data-petit="1"] .jr-bord-n,.jr-pick[data-petit="1"] .jr-bord-s,.jr-pick[data-petit="1"] .jr-bord-e,.jr-pick[data-petit="1"] .jr-bord-w{display:none}
.jr-stage.jr-picking .jr-pick .jr-bord{display:none}
.jr-pick[data-ajuste="1"]{animation:none}
/* la zone d'actions etait une rangee flexible de boutons : un paragraphe s'y serait loge A COTE
   d'eux. Elle passe en bloc (le [hidden]{display:none!important} de la feuille la masque toujours),
   et ses deux boutons retrouvent leur rangee d'origine dans .jr-zone-boutons, aux memes regles. */
#jr-zone-actions{display:block}
#jr-zone-actions .jr-zone-boutons{display:flex;gap:8px}
#jr-zone-actions .jr-bords-aide{margin:0 0 8px;font:500 12.5px/1.45 system-ui,sans-serif;color:#b0bdd3}
@media (pointer:coarse){
  .jr-pick .jr-bord{width:18px;height:18px}
  .jr-pick .jr-bord::before{inset:-15px}
  .jr-pick .jr-bord-nw{left:-10px;top:-10px}
  .jr-pick .jr-bord-ne{right:-10px;top:-10px}
  .jr-pick .jr-bord-se{right:-10px;bottom:-10px}
  .jr-pick .jr-bord-sw{left:-10px;bottom:-10px}
  .jr-pick .jr-bord-n,.jr-pick .jr-bord-s{left:calc(50% - 13px);width:26px;height:12px}
  .jr-pick .jr-bord-n{top:-7px}
  .jr-pick .jr-bord-s{bottom:-7px}
  .jr-pick .jr-bord-e,.jr-pick .jr-bord-w{top:calc(50% - 13px);width:12px;height:26px}
  .jr-pick .jr-bord-e{right:-7px}
  .jr-pick .jr-bord-w{left:-7px}
  .jr-pick :is(.jr-bord-n,.jr-bord-s,.jr-bord-e,.jr-bord-w)::before{inset:-18px}
}
/* POIGNEES_FIN */
/* ── lot v2-journal-langues-r10 : la liseuse dans la langue du visiteur ───────────────────────────
   Une interface de droite à gauche (arabe, persan, ourdou) garde la disposition du panneau ; chaque texte
   traduit prend le sens de sa langue (dir=auto posé par la couche de langues), et un bouton aligné à
   gauche par la feuille s'aligne sur le début de son texte. Le calque posé sur le journal hérite de la
   langue de la page pour choisir ses polices (lang sur le SVG). */
.jr-tools button[dir=auto]:not(.jr-main):not(.jr-reset){text-align:start}
.jr-fr[dir=rtl]{text-align:right}
.jr-fr[dir=rtl] .jr-centre{text-align:center}

/* AIMANT_DEBUT (lot v2-journal-aimant-r10) : les traits des separations de colonnes, pendant le geste. Au-dessus du
   cadre (le voile du cadre assombrit tout ce qui est hors de lui), sans capter le pointeur. Jaune du cadre, lisere
   sombre : lisible sur le papier clair comme sur le voile. */
.jr-aimant{position:absolute;inset:0;z-index:3;pointer-events:none}
.jr-aimant i{position:absolute;background:#ffd54a;box-shadow:0 0 0 1px #0b1220;opacity:.6;border-radius:1px}
.jr-aimant i.jr-aimant-actif{opacity:1;box-shadow:0 0 0 1px #0b1220,0 0 7px 2px #ffd54a}
@media (prefers-reduced-motion:no-preference){.jr-aimant i{transition:opacity .12s ease}}
/* AIMANT_FIN */

/* ARTICLE_DEBUT (lot v2-journal-article-r11) : le cadre qui saute vers l'article entier y GLISSE (0,3 s), sans
   mouvement pour qui le demande ; « Garder mon trace » sous le bouton principal, visible aussi quand la lecture a pris
   toute la place (les boutons du cadre, eux, s'y replient). */
@media (prefers-reduced-motion:no-preference){.jr-pick.jr-saute{transition:left .3s ease,top .3s ease,width .3s ease,height .3s ease}}
.jr-garde-ligne{margin:-2px 0 6px}
.jr-garde-ligne[hidden]{display:none}
/* ARTICLE_FIN */

/* LISIBILITE_DEBUT (lot v2-journal-lisibilite-r12) : les champs de la liseuse gardent SES couleurs. La feuille
   d'apparence du site pose « html[data-style] textarea, select, input:not(checkbox, radio) { background:
   var(--surface); color: var(--ink) } », plus specifique que « .jr-tools textarea » : en mode jour, le texte d'origine
   s'ecrivait en encre claire du panneau sur le fond clair de la page (contraste 1,0 a 1,08 sur les 9 styles, mesure
   du 28/09). L'identifiant de la visionneuse bat la regle du site sans !important ; les valeurs sont celles que la
   liseuse declarait deja. */
#lb .jr-tools textarea{background:#f9fafc;color:#172031}
#lb .jr-tools select{background:#1c293f;color:#f3f6fc}
#lb .jr-tools input[type=range]{background:transparent}
/* LISIBILITE_FIN */