/* BD restaurées + liseuse — même charte que le site (style.css : --navy, --gold, --cream, Cinzel / Spectral) */

/* ---------- bibliothèque ---------- */
.bd-hero{background:var(--navy);color:#e9e2d2;padding:4.5rem 1.25rem 3.5rem;text-align:center}
.bd-hero .kicker{font-family:"Cinzel",serif;font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;color:var(--gold)}
.bd-hero h1{color:#fff;font-size:clamp(1.9rem,4.5vw,3rem);margin:.6rem 0 1rem;text-wrap:balance}
.bd-hero p{max-width:40rem;margin:0 auto;color:#cfc6b3}
.bd-section{max-width:var(--maxw);margin:0 auto;padding:3.5rem 1.25rem}
.bd-section h2{font-size:1.5rem;margin-bottom:1.4rem;text-wrap:balance}
.bd-albums{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1.5rem}
.bd-album{background:#fff;border:1px solid var(--line);display:flex;flex-direction:column}
.bd-album img{width:100%;aspect-ratio:3/4;object-fit:cover;object-position:top;display:block;background:var(--cream)}
.bd-album .corps{padding:1rem 1.1rem 1.2rem;display:flex;flex-direction:column;gap:.35rem;flex:1}
.bd-album h3{font-size:1.05rem}
.bd-album .meta{font-size:.85rem;color:var(--muted)}
.bd-album .btn-lire{margin-top:auto;align-self:flex-start}
.bd-album.bientot{opacity:.7}
.etiquette{display:inline-block;font-family:"Cinzel",serif;font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--gold-d);border:1px solid var(--gold);padding:.15rem .45rem;align-self:flex-start}

/* avant / après */
.comparer{position:relative;max-width:960px;margin:0 auto;aspect-ratio:3/2;overflow:hidden;border:1px solid var(--line);
  touch-action:none;user-select:none;cursor:ew-resize}
.comparer img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.comparer .apres{clip-path:inset(0 0 0 50%)}
.comparer .poignee{position:absolute;top:0;bottom:0;left:50%;width:2px;background:var(--gold);transform:translateX(-1px)}
.comparer .poignee::after{content:"◂ ▸";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  background:var(--navy);color:var(--gold);font-size:.8rem;padding:.35rem .5rem;border-radius:20px;white-space:nowrap}
.comparer .lib{position:absolute;top:.6rem;font-family:"Cinzel",serif;font-size:.68rem;letter-spacing:.12em;
  background:rgba(14,26,43,.8);color:#fff;padding:.2rem .55rem}
.comparer .lib.g{left:.6rem}.comparer .lib.d{right:.6rem}
.legende{max-width:960px;margin:.7rem auto 0;font-size:.9rem;color:var(--muted);text-align:center}
.bd-pont{background:var(--cream);border-top:1px solid var(--line)}
.bd-pont .grille{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.5rem}

/* ---------- liseuse ---------- */
body.liseuse{background:#0b121d;color:#e9e2d2}
.l-barre{position:sticky;top:0;z-index:10;display:flex;flex-wrap:wrap;align-items:center;gap:.5rem 1rem;
  padding:.55rem 1rem;background:rgba(14,26,43,.96);border-bottom:1px solid #22324a;font-family:"Cinzel",serif;font-size:.78rem}
.l-barre a,.l-barre button,.l-barre select{color:#e9e2d2;background:none;border:1px solid #2b3e5c;padding:.35rem .7rem;
  font:inherit;letter-spacing:.06em;cursor:pointer;text-decoration:none}
.l-barre button:hover,.l-barre a:hover{border-color:var(--gold);color:#fff}
.l-barre button[aria-pressed="true"]{background:var(--gold);color:var(--navy);border-color:var(--gold)}
.l-titre{flex:1;min-width:10rem;color:var(--gold);letter-spacing:.1em}
.l-compteur{font-variant-numeric:tabular-nums}
.l-scene{position:relative;display:flex;justify-content:center;align-items:flex-start;padding:1rem .5rem 2rem;overflow-x:auto}
/* zoom : --z = 1 -> la page entière tient dans la hauteur de l'écran */
.l-page{--z:1;height:calc((100vh - 8rem) * var(--z));width:auto;max-width:none;display:block;flex:none;box-shadow:0 8px 40px rgba(0,0,0,.5);background:#1a2233}
.l-zone{position:absolute;top:0;bottom:0;width:22%;cursor:pointer}
.l-zone.g{left:0}.l-zone.d{right:0}
.l-date{text-align:center;font-family:"Spectral",serif;font-style:italic;color:#a9b2c2;padding-bottom:.5rem}
.l-fin{max-width:36rem;margin:0 auto 3rem;text-align:center;background:var(--navy2);padding:1.8rem 1.4rem;border:1px solid #2b3e5c}
.l-fin h2{color:#fff;font-size:1.2rem;margin-bottom:.6rem}
.l-fin p{color:#cfc6b3}
.l-miniatures{display:flex;gap:.4rem;overflow-x:auto;padding:.6rem 1rem 1rem;scrollbar-width:thin}
.l-miniatures img{height:84px;width:auto;opacity:.55;cursor:pointer;border:2px solid transparent;flex:none}
.l-miniatures img.actif{opacity:1;border-color:var(--gold)}
:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
@media (max-width:600px){.l-barre{position:static;font-size:.72rem}.l-titre{flex-basis:100%;order:-1}}