/* Une page de lecture, pilotée par la palette commune du site. */
.reading-topline{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:25px;margin-bottom:23px;font-size:.74rem;font-weight:800;color:var(--muted)}.reading-topline a{color:var(--teal);text-decoration:none}.reading-topline a:hover{text-decoration:underline}.reading-topline>span{font-size:.68rem;letter-spacing:.03em}
.reader-paper{display:grid;grid-template-columns:225px minmax(0,1fr);gap:clamp(30px,4vw,60px);background:var(--cream);padding:clamp(25px,4vw,52px);border:1px solid var(--line);border-left:4px solid color-mix(in srgb,var(--teal) 35%,var(--line));box-shadow:5px 5px 0 var(--paper),6px 6px 0 var(--line),11px 11px 0 var(--paper),12px 12px 0 var(--line),0 20px 40px color-mix(in srgb,var(--navy) 6%,transparent);margin-bottom:70px;view-transition-name:reader-paper;scroll-margin-top:20px}
.reader-side{position:sticky;top:25px;align-self:start}.reader-poster{margin:0 0 24px}.poster-zoom{display:block;width:100%;border:0;background:var(--deep);padding:14px 10px 9px;cursor:zoom-in;color:var(--cream);box-shadow:0 9px 22px color-mix(in srgb,var(--navy) 16%,transparent);transition:transform .2s ease,box-shadow .2s ease}.poster-zoom:hover{transform:translateY(-4px);box-shadow:0 15px 30px color-mix(in srgb,var(--navy) 23%,transparent)}.poster-zoom img{display:block;width:100%;height:auto;object-fit:contain}.poster-zoom>span{display:block;font:700 .65rem/1.4 'DM Sans',sans-serif;margin-top:11px;letter-spacing:.02em}
.reader-chapter{display:block;text-decoration:none;border-top:1px solid var(--line);padding-top:18px;color:var(--navy)}.reader-chapter small{display:block;text-transform:uppercase;font-size:.62rem;letter-spacing:.07em;font-weight:800;color:var(--teal);margin-bottom:9px}.reader-chapter strong{font:800 1.2rem/1.15 'Outfit',sans-serif;display:block}.reader-chapter>span{font-size:.68rem;font-weight:800;color:var(--muted);display:block;margin-top:12px}.reader-chapter:hover>span{color:var(--teal)}
.reader-text{min-width:0;max-width:740px}.story-heading{margin:0 0 33px}.story-heading .eyebrow{font-size:.65rem;letter-spacing:.08em}.story-heading h1{font-size:clamp(2.35rem,3.5vw,3.6rem);line-height:1.07;margin:18px 0 20px;letter-spacing:-.04em;color:var(--navy);text-wrap:pretty}.story-deck{color:var(--muted);font-size:1.03rem;line-height:1.65;margin-bottom:20px}.reading-meta{display:flex;flex-wrap:wrap;gap:8px 15px;font-size:.63rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--teal);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:12px 0}
.article-body{font-size:1.055rem;line-height:1.85;color:var(--ink)}.article-body>p{margin:0 0 1em}.article-body>p:first-of-type:first-letter{float:left;font:800 3.8rem/.9 'Outfit',sans-serif;color:var(--teal);margin:9px 9px 0 0}.article-body h2{font-size:1.9rem;margin:1.9em 0 .8em;color:var(--navy);scroll-margin-top:20px}.article-body strong{color:var(--navy)}.article-body .article-emphasis{padding:17px 22px;margin:1.4em 0;background:color-mix(in srgb,var(--sun) 17%,var(--cream));border-left:3px solid var(--sun);font:700 1.16rem/1.55 'Outfit',sans-serif}.article-body ul,.article-body ol{padding-left:1.5em}.article-body li{margin:.4em 0}.article-body a{color:var(--teal)}
.original-teaser{margin:32px 0 20px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:15px 0}.original-teaser summary{cursor:pointer;color:var(--teal);font-size:.78rem;font-weight:800}.teaser-copy{padding:19px 0 0;color:var(--muted);font-size:.91rem;line-height:1.7}.teaser-copy .section-label{display:none}.teaser-copy h2{font-size:1.55rem;color:var(--navy)}.teaser-copy p{margin-bottom:.75em}.article-origin{font-size:.76rem;color:var(--teal);font-weight:800;text-underline-offset:4px;display:inline-block;margin:9px 0 18px}
.reading-turns{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:34px 0 20px;border-top:1px solid var(--line);padding-top:24px}.reading-turns a{position:relative;display:block;padding:17px 18px 44px;background:var(--paper);border:1px solid var(--line);text-decoration:none;color:var(--navy);transition:background .18s,transform .18s}.reading-turns a:hover{transform:translateY(-3px);background:color-mix(in srgb,var(--teal) 7%,var(--cream))}.reading-turns small{display:block;color:var(--teal);font-size:.6rem;text-transform:uppercase;letter-spacing:.04em;font-weight:800;margin-bottom:9px}.reading-turns strong{font:700 1rem/1.2 'Outfit',sans-serif;display:block}.reading-turns a>span{position:absolute;bottom:10px;left:18px;font-size:1.6rem;color:var(--teal)}.reading-next{text-align:right}.reading-turns .reading-next>span{left:auto;right:18px}.reading-first{font-size:.77rem;color:var(--muted);align-self:center}.reading-back{display:block;color:var(--teal);font-size:.74rem;font-weight:800;text-align:center;text-underline-offset:4px;margin-top:25px}
.reading-pending{padding:25px 0 35px}.reading-pending h2{font-size:2.1rem;margin:17px 0}.reading-pending p{font-size:1rem;line-height:1.7;color:var(--muted)}.reading-pending .button{font-size:.8rem;margin-top:10px}
.poster-dialog{border:0;background:var(--deep);padding:18px;width:min(94vw,1100px);max-width:94vw;max-height:94vh;overflow:auto;color:var(--cream);box-shadow:0 24px 70px color-mix(in srgb,var(--navy) 50%,transparent)}.poster-dialog::backdrop{background:color-mix(in srgb,var(--deep) 85%,transparent)}.poster-toolbar{display:flex;justify-content:space-between;align-items:center;gap:18px;font-size:.74rem;font-weight:800;margin-bottom:14px}.poster-toolbar button{flex:none;font:800 .75rem 'DM Sans',sans-serif;border:0;border-radius:999px;background:var(--cream);color:var(--navy);padding:9px 13px;cursor:pointer}.poster-dialog img{display:block;max-width:100%;max-height:calc(94vh - 92px);width:auto;height:auto;object-fit:contain;margin:auto}
@view-transition{navigation:auto}::view-transition-old(reader-paper){animation:reading-away .18s ease both;transform-origin:left center}::view-transition-new(reader-paper){animation:reading-arrive .24s ease both;transform-origin:left center}@keyframes reading-away{to{opacity:0;transform:perspective(1600px) rotateY(-5deg) translateX(-12px)}}@keyframes reading-arrive{from{opacity:0;transform:perspective(1600px) rotateY(6deg) translateX(15px)}to{opacity:1;transform:none}}
@media(max-width:1000px){.reader-paper{grid-template-columns:180px minmax(0,1fr);gap:30px;padding:28px}.story-heading h1{font-size:2.7rem}}
@media(max-width:760px){.reading-topline{margin:20px auto;font-size:.7rem;gap:10px}.reading-topline>span{display:none}.reader-paper{display:flex;flex-direction:column;padding:25px;gap:28px;margin-bottom:48px}.reader-side{position:static;display:grid;grid-template-columns:100px minmax(0,1fr);gap:20px;align-items:center;order:0}.reader-poster{margin:0}.poster-zoom{padding:7px}.poster-zoom>span{font-size:.5rem;margin:6px 0 1px}.reader-chapter{padding:0;border:0}.reader-chapter strong{font-size:1.3rem}.reader-chapter>span{margin-top:9px;font-size:.65rem}.story-heading h1{font-size:clamp(2.2rem,7vw,3rem)}.story-heading{margin-bottom:25px}.reader-text{order:1}.article-body{font-size:1rem;line-height:1.78}.story-deck{font-size:1rem}.reading-turns{gap:10px}.reading-turns a{padding:14px 13px 38px}.reading-turns strong{font-size:.93rem}.reader-paper{border-left-width:3px}}
@media(max-width:420px){.reader-paper{padding:22px 18px}.reader-side{grid-template-columns:82px minmax(0,1fr);gap:16px}.reader-chapter strong{font-size:1.15rem}.story-heading h1{font-size:2.25rem}.story-heading .eyebrow{font-size:.58rem}.reading-meta{font-size:.58rem}.reading-turns small{font-size:.55rem}.reading-turns strong{font-size:.83rem}.poster-dialog{padding:12px}.poster-toolbar{gap:8px;font-size:.65rem}.poster-dialog img{max-height:calc(94vh - 88px)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.poster-zoom,.reading-turns a{transition:none}.poster-zoom:hover,.reading-turns a:hover{transform:none}::view-transition-old(reader-paper),::view-transition-new(reader-paper){animation:none}}

/* Reserve the original poster ratio; the cached preview stays visible while it loads. */
.poster-stage{position:relative;width:min(100%,calc((94vh - 92px) * var(--poster-ratio)));aspect-ratio:var(--poster-ratio);margin-inline:auto}.poster-stage img{position:absolute;inset:0;width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;margin:0}#poster-original:not([src]){visibility:hidden}

/* Text-only editions keep the same reading width and navigation. */
.reader-without-poster{grid-template-columns:minmax(0,740px);justify-content:center;gap:24px}.reader-without-poster .reader-side{position:static;grid-row:2}.reader-without-poster .reader-text{grid-row:1}.reader-without-poster .reader-chapter{font-size:.8rem}.article-body h3{font-size:1.35rem;line-height:1.4;color:var(--navy);margin:1.6em 0 .7em}.article-body code{font-size:.9em;overflow-wrap:anywhere}.article-body blockquote{margin:1.4em 0;padding:12px 20px;border-left:3px solid var(--teal);color:var(--navy);background:color-mix(in srgb,var(--teal) 5%,var(--cream))}.article-body blockquote p{margin:0}
@media(max-width:760px){.reader-without-poster .reader-side{order:2;display:block}.reader-without-poster .reader-text{order:1}}

/* Des repères chaleureux accompagnent la lecture, dans la palette de la bibliothèque. */
.reader-paper{border-left-color:var(--teal);border-radius:22px}
.story-heading .eyebrow{background:#fff0d7;color:#a13e2a;padding:7px 10px;border-radius:8px;line-height:1.5}
.story-heading h1{overflow-wrap:break-word}.reading-meta{background:#e6f3ed;border:0;border-left:3px solid var(--teal);border-radius:0 9px 9px 0;padding:12px 15px;color:#176e68}
.reader-chapter{border:0;background:#fff2d8;padding:20px;border-radius:16px}.reader-chapter small{color:#a13e2a}.reader-chapter>span{color:#50656b}
.article-body .article-emphasis{background:#fff2d8;border-left:4px solid #e5a624;border-radius:0 12px 12px 0}.article-body blockquote{background:#e9f5ef;border-left-color:var(--teal);border-radius:0 12px 12px 0}
.reading-turns a{border-radius:14px;border-color:#c4dbd4;background:#edf6f1}.reading-turns .reading-next{background:#fff2d8;border-color:#ead7a8}.reading-turns .reading-next small,.reading-turns .reading-next>span{color:#a13e2a}
@media(max-width:760px){.reader-chapter{padding:15px}.story-heading .eyebrow{font-size:.65rem}.reader-paper{border-radius:18px}}
@media(max-width:420px){.reader-chapter{padding:13px}.reading-meta{font-size:.62rem;line-height:1.5}.reading-turns small{font-size:.61rem}}