:root {
  --reader-bg: #f4f1eb;
  --reader-panel: #fffdf9;
  --reader-ink: #242526;
  --reader-muted: #74736f;
  --reader-line: #ddd8cf;
  --reader-line-strong: #cfc5b7;
  --reader-accent: #7c5b3a;
  --reader-accent-soft: #eee4d7;
  --reader-shadow: 0 24px 70px rgba(35, 31, 27, .10);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
}
* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; }
body {
  min-height: 100vh;
  background: var(--reader-bg);
  color: var(--reader-ink);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  -webkit-font-smoothing: antialiased;
}
button, input, select { font: inherit; }
button { color: inherit; }
a { color: inherit; }
[hidden] { display: none !important; }
.reader-page.reader-drawer-open { overflow: hidden; }

.reader-topbar {
  position: sticky;
  top: 0;
  z-index: 40;
  min-height: 62px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 16px;
  padding: 8px max(18px, calc((100vw - 1320px) / 2));
  border-bottom: 1px solid rgba(45, 41, 37, .09);
  background: color-mix(in srgb, var(--reader-bg) 91%, transparent);
  backdrop-filter: blur(18px);
}
.reader-back {
  color: #6d6d68;
  text-decoration: none;
  font-size: .82rem;
  white-space: nowrap;
}
.reader-back:hover { color: var(--reader-ink); }
.reader-book-heading {
  min-width: 0;
  display: grid;
  justify-items: center;
  line-height: 1.15;
  text-align: center;
}
.reader-book-heading strong,
.reader-book-heading small {
  max-width: min(52vw, 680px);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.reader-book-heading strong { font-size: .9rem; font-weight: 700; }
.reader-book-heading small { margin-top: 3px; color: var(--reader-muted); font-size: .7rem; }
.reader-top-actions { display: flex; align-items: center; gap: 6px; }
.reader-top-actions button,
.reader-progress-menu,
.reader-library-head button {
  min-height: 36px;
  border: 1px solid var(--reader-line);
  border-radius: 999px;
  background: rgba(255,255,255,.62);
  padding: 0 12px;
  cursor: pointer;
  color: #5d5e5a;
  font-size: .76rem;
  transition: background .18s ease, border-color .18s ease, color .18s ease, transform .18s ease;
}
.reader-top-actions button:hover,
.reader-progress-menu:hover,
.reader-library-head button:hover { background: #fff; border-color: var(--reader-line-strong); color: var(--reader-ink); }
.reader-top-actions button:active,
.reader-progress-menu:active { transform: translateY(1px); }

.reader-main { min-height: calc(100vh - 62px); }
.reader-welcome {
  width: min(1120px, calc(100% - 36px));
  margin: 0 auto;
  padding: 68px 0 86px;
}
.reader-welcome-copy { max-width: 720px; }
.reader-kicker,
.reader-library-head span,
.reader-drawer-panel header span {
  display: block;
  margin: 0 0 9px;
  color: #8b755d;
  font-size: .68rem;
  font-weight: 750;
  letter-spacing: .11em;
  text-transform: uppercase;
}
.reader-welcome h1 {
  margin: 0;
  max-width: 760px;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(2rem, 5vw, 4rem);
  font-weight: 500;
  letter-spacing: -.035em;
  line-height: 1.02;
}
.reader-welcome-copy > p:not(.reader-kicker) {
  max-width: 680px;
  margin: 22px 0 0;
  color: #686963;
  font-size: 1rem;
  line-height: 1.75;
}
.reader-welcome-actions { display: flex; align-items: center; gap: 15px; margin-top: 26px; }
.reader-welcome-actions > span { color: #8c8a84; font-size: .72rem; letter-spacing: .05em; }
.reader-primary {
  min-height: 44px;
  border: 0;
  border-radius: 12px;
  background: #2b2b2a;
  padding: 0 18px;
  color: #fff;
  cursor: pointer;
  font-weight: 700;
  box-shadow: 0 8px 22px rgba(20,20,20,.12);
}
.reader-primary:hover { background: #151515; }
.reader-dropzone {
  width: 100%;
  min-height: 210px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 8px;
  margin-top: 44px;
  border: 1px dashed #c4b39e;
  border-radius: 24px;
  background:
    radial-gradient(circle at 20% 25%, rgba(139,103,63,.07), transparent 27%),
    radial-gradient(circle at 78% 72%, rgba(95,91,134,.05), transparent 28%),
    rgba(255,255,255,.55);
  cursor: pointer;
  transition: border-color .18s ease, background .18s ease, transform .18s ease;
}
.reader-dropzone:hover { border-color: #a78d70; background-color: rgba(255,255,255,.85); }
.reader-dropzone:active { transform: translateY(1px); }
.reader-drop-icon {
  width: 56px;
  height: 56px;
  display: grid;
  place-items: center;
  margin-bottom: 5px;
  border-radius: 50%;
  background: var(--reader-accent-soft);
  color: var(--reader-accent);
  font-size: 1.65rem;
}
.reader-dropzone strong { font-size: 1rem; }
.reader-dropzone small { color: var(--reader-muted); }
.reader-library-preview { margin-top: 50px; }
.reader-library-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 17px;
}
.reader-library-head h2,
.reader-drawer-panel h2 { margin: 0; font-family: Georgia, serif; font-size: 1.55rem; font-weight: 500; }
.reader-library-head span { margin-bottom: 5px; }
.reader-book-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}
.reader-book-card {
  position: relative;
  min-width: 0;
  min-height: 168px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  border: 1px solid var(--reader-line);
  border-radius: 16px;
  background: rgba(255,255,255,.72);
  padding: 17px;
  cursor: pointer;
  text-align: left;
  transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
}
.reader-book-card:hover { transform: translateY(-2px); border-color: #c8b8a5; background: #fff; box-shadow: 0 12px 28px rgba(35,31,27,.06); }
.reader-book-card-format {
  width: max-content;
  padding: 4px 7px;
  border-radius: 999px;
  background: #f1ebe2;
  color: #755a3c;
  font-size: .62rem;
  font-weight: 750;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.reader-book-card-copy { min-width: 0; }
.reader-book-card strong {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  font-family: Georgia, serif;
  font-size: 1.06rem;
  font-weight: 500;
  line-height: 1.25;
}
.reader-book-card small { display: block; margin-top: 7px; color: var(--reader-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.reader-empty-library { margin: 18px 0 0; color: #85847f; font-size: .83rem; }
.reader-local-note { margin: 28px 0 0; color: #8b8983; font-size: .73rem; }

.reader-workspace { height: calc(100vh - 62px); min-height: 520px; display: grid; grid-template-rows: minmax(0, 1fr) 54px; }
.reader-stage {
  position: relative;
  min-height: 0;
  overflow: hidden;
  background: var(--reader-panel);
}
.reader-render,
.reader-plain { width: 100%; height: 100%; }
.reader-render { position: relative; z-index: 1; }
.reader-plain {
  position: relative;
  z-index: 1;
  overflow: auto;
  padding: clamp(34px, 7vw, 82px) max(28px, calc((100vw - 820px) / 2));
  background: var(--reader-panel);
  color: var(--reader-ink);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 18px;
  line-height: 1.65;
}
.reader-plain h1,
.reader-plain h2,
.reader-plain h3 { line-height: 1.2; font-weight: 600; }
.reader-plain p { margin: 0 0 1.05em; }
.reader-plain img { max-width: 100%; height: auto; }
.reader-plain pre { white-space: pre-wrap; font: inherit; }
.reader-page-nav {
  position: absolute;
  z-index: 7;
  top: 50%;
  transform: translateY(-50%);
  width: 46px;
  height: 72px;
  border: 0;
  border-radius: 14px;
  background: rgba(244,241,235,.72);
  color: #6e6c66;
  cursor: pointer;
  font-family: Georgia, serif;
  font-size: 2.3rem;
  line-height: 1;
  opacity: .26;
  transition: opacity .18s ease, background .18s ease;
}
.reader-stage:hover .reader-page-nav { opacity: .72; }
.reader-page-nav:hover { opacity: 1 !important; background: rgba(235,229,220,.94); }
.reader-page-prev { left: 12px; }
.reader-page-next { right: 12px; }
.reader-loading {
  position: absolute;
  z-index: 10;
  inset: 0;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 13px;
  background: rgba(244,241,235,.88);
  backdrop-filter: blur(5px);
}
.reader-loading span {
  width: 28px;
  height: 28px;
  border: 2px solid #d3c7b8;
  border-top-color: #775a3c;
  border-radius: 50%;
  animation: readerSpin .8s linear infinite;
}
.reader-loading strong { color: #68655f; font-size: .82rem; }
@keyframes readerSpin { to { transform: rotate(360deg); } }
.reader-progressbar {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) 52px;
  align-items: center;
  gap: 14px;
  padding: 0 max(18px, calc((100vw - 1180px) / 2));
  padding-bottom: var(--safe-bottom);
  border-top: 1px solid rgba(45,41,37,.09);
  background: color-mix(in srgb, var(--reader-bg) 94%, white);
}
.reader-progressbar input { width: 100%; accent-color: #856443; }
.reader-progressbar > span { color: #77756f; font-size: .73rem; text-align: right; }
.reader-progress-menu { min-height: 32px; }

.reader-drawer {
  position: fixed;
  z-index: 70;
  inset: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) min(440px, 92vw);
}
.reader-drawer-overlay { border: 0; background: rgba(26,25,23,.26); backdrop-filter: blur(3px); cursor: default; }
.reader-drawer-panel {
  overflow: auto;
  background: #fbfaf7;
  box-shadow: -18px 0 60px rgba(20,18,16,.14);
  padding: 26px 24px 40px;
}
.reader-drawer-panel > header {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 20px;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--reader-line);
}
.reader-drawer-panel > header > button {
  width: 36px;
  height: 36px;
  border: 1px solid var(--reader-line);
  border-radius: 50%;
  background: #fff;
  cursor: pointer;
  font-size: 1.1rem;
}
.reader-storage { margin: 14px 0; color: #87847e; font-size: .7rem; }
.reader-library-list { display: grid; gap: 9px; }
.reader-library-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  border: 1px solid var(--reader-line);
  border-radius: 12px;
  background: #fff;
  padding: 11px 12px;
}
.reader-library-open {
  min-width: 0;
  border: 0;
  background: transparent;
  padding: 0;
  cursor: pointer;
  text-align: left;
}
.reader-library-open strong,
.reader-library-open small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.reader-library-open strong { font-family: Georgia, serif; font-size: .94rem; font-weight: 600; }
.reader-library-open small { margin-top: 4px; color: var(--reader-muted); font-size: .68rem; }
.reader-library-delete {
  width: 32px;
  height: 32px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #99928a;
  cursor: pointer;
}
.reader-library-delete:hover { background: #f5eeea; color: #875d50; }
.reader-toc { display: grid; gap: 4px; padding-top: 16px; }
.reader-toc button {
  width: 100%;
  border: 0;
  border-radius: 8px;
  background: transparent;
  padding: 9px 10px;
  color: #585852;
  cursor: pointer;
  text-align: left;
  font-size: .82rem;
  line-height: 1.3;
}
.reader-toc button:hover { background: #f0ece5; color: #232322; }
.reader-toc .depth-1 { padding-left: 24px; }
.reader-toc .depth-2 { padding-left: 38px; font-size: .76rem; }
.reader-toc .depth-3 { padding-left: 52px; font-size: .73rem; }

.reader-settings {
  position: fixed;
  z-index: 80;
  top: 70px;
  right: max(18px, calc((100vw - 1320px) / 2));
  width: min(380px, calc(100vw - 28px));
  border: 1px solid var(--reader-line);
  border-radius: 16px;
  background: rgba(255,253,249,.97);
  box-shadow: var(--reader-shadow);
  padding: 16px;
  backdrop-filter: blur(14px);
}
.reader-settings-grid { display: grid; gap: 14px; }
.reader-settings label { display: grid; grid-template-columns: 120px minmax(0, 1fr); align-items: center; gap: 12px; }
.reader-settings label > span { color: #6f6e69; font-size: .72rem; }
.reader-settings input { width: 100%; accent-color: #80603f; }
.reader-settings select {
  width: 100%;
  height: 34px;
  border: 1px solid var(--reader-line);
  border-radius: 8px;
  background: #fff;
  padding: 0 8px;
  color: #4b4b47;
}

.reader-drop-overlay {
  position: fixed;
  z-index: 100;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 20px;
  background: rgba(244,241,235,.84);
  backdrop-filter: blur(12px);
}
.reader-drop-overlay > div {
  width: min(600px, 92vw);
  min-height: 260px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 11px;
  border: 1px dashed #ad9274;
  border-radius: 26px;
  background: rgba(255,253,249,.92);
  box-shadow: var(--reader-shadow);
}
.reader-drop-overlay span { font-size: 2rem; color: var(--reader-accent); }
.reader-drop-overlay small { color: var(--reader-muted); font-size: .74rem; }
.reader-toast {
  position: fixed;
  z-index: 120;
  left: 50%;
  bottom: calc(22px + var(--safe-bottom));
  transform: translateX(-50%);
  max-width: min(540px, calc(100vw - 30px));
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 999px;
  background: rgba(36,37,38,.94);
  padding: 10px 15px;
  color: #fff;
  box-shadow: 0 15px 40px rgba(0,0,0,.18);
  font-size: .77rem;
  text-align: center;
}

body[data-theme="night"] { --reader-bg: #181918; --reader-panel: #1f211f; --reader-ink: #e8e4dc; --reader-muted: #aaa69e; --reader-line: #383a36; --reader-line-strong: #4b4d47; }
body[data-theme="night"] .reader-top-actions button,
body[data-theme="night"] .reader-progress-menu,
body[data-theme="night"] .reader-library-head button,
body[data-theme="night"] .reader-book-card,
body[data-theme="night"] .reader-drawer-panel,
body[data-theme="night"] .reader-library-row,
body[data-theme="night"] .reader-drawer-panel > header > button,
body[data-theme="night"] .reader-settings { background: #222421; color: #e8e4dc; }
body[data-theme="night"] .reader-primary { background: #ded7cb; color: #20211f; }
body[data-theme="white"] { --reader-bg: #f7f7f7; --reader-panel: #fff; }

@media (max-width: 900px) {
  .reader-book-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .reader-top-actions button:first-child { display: none; }
  .reader-page-nav { width: 40px; opacity: .18; }
}
@media (max-width: 640px) {
  .reader-topbar { grid-template-columns: auto minmax(0, 1fr) auto; gap: 8px; padding: 7px 10px; }
  .reader-back span { display: none; }
  .reader-top-actions button { min-width: 34px; min-height: 34px; padding: 0 9px; font-size: 0; }
  .reader-top-actions button::after { font-size: .76rem; }
  .reader-top-actions [data-import-book]::after { content: "+"; font-size: 1rem; }
  .reader-top-actions [data-toggle-settings] { font-size: .72rem; }
  .reader-top-actions [data-toggle-settings]::after { content: ""; }
  .reader-top-actions [data-fullscreen] { font-size: .9rem; }
  .reader-top-actions [data-fullscreen]::after { content: ""; }
  .reader-book-heading strong, .reader-book-heading small { max-width: 44vw; }
  .reader-welcome { width: min(100% - 24px, 1120px); padding: 42px 0 70px; }
  .reader-welcome-actions { align-items: flex-start; flex-direction: column; }
  .reader-dropzone { margin-top: 30px; min-height: 180px; }
  .reader-book-grid { grid-template-columns: 1fr; }
  .reader-library-head { align-items: flex-start; flex-direction: column; }
  .reader-workspace { height: calc(100dvh - 62px); grid-template-rows: minmax(0, 1fr) 50px; }
  .reader-page-nav { top: auto; bottom: 14px; width: 42px; height: 42px; border-radius: 50%; transform: none; opacity: .72; }
  .reader-page-prev { left: 12px; }
  .reader-page-next { right: 12px; }
  .reader-progressbar { grid-template-columns: auto minmax(0,1fr) 42px; gap: 8px; padding: 0 10px var(--safe-bottom); }
  .reader-progress-menu { min-height: 30px; padding: 0 9px; }
  .reader-settings { top: 66px; right: 8px; }
  .reader-settings label { grid-template-columns: 95px minmax(0,1fr); }
  .reader-drawer { grid-template-columns: 1fr; }
  .reader-drawer-overlay { display: none; }
  .reader-drawer-panel { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; animation-duration: .001ms !important; }
}


/* Mode Focus — lecture sans chrome */
.reader-focus-exit{position:fixed;z-index:80;top:14px;right:16px;display:none;align-items:center;justify-content:center;min-height:36px;padding:0 12px;border:1px solid rgba(20,22,20,.12);border-radius:999px;background:rgba(250,248,243,.92);backdrop-filter:blur(12px);box-shadow:0 7px 24px rgba(16,18,17,.09);color:#555a57;font:650 .72rem/1 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;cursor:pointer}
.reader-focus .reader-topbar,.reader-focus .reader-progressbar,.reader-focus .reader-page-nav{display:none!important}
.reader-focus .reader-main{height:100dvh;min-height:100dvh;padding:0}
.reader-focus .reader-workspace{height:100dvh;min-height:100dvh;grid-template-rows:minmax(0,1fr)}
.reader-focus .reader-stage{height:100dvh;min-height:100dvh;border:0;border-radius:0;box-shadow:none}
.reader-focus .reader-render,.reader-focus .reader-plain{height:100dvh!important;max-height:none}
.reader-focus .reader-focus-exit{display:inline-flex!important}
.reader-focus .reader-welcome{padding-top:70px}
body[data-theme="night"].reader-focus .reader-focus-exit{background:rgba(34,36,33,.9);border-color:rgba(255,255,255,.12);color:#e8e4dc}
@media (max-width:640px){.reader-focus-exit{top:10px;right:10px;min-height:34px;padding:0 10px}.reader-focus .reader-stage{height:100dvh}}


/* Lecteur multiformat — AZW/AZW3/MOBI/CBZ via Foliate JS */
.reader-foliate-view{
  display:block;
  width:100%;
  height:100%;
  min-width:0;
  min-height:0;
  background:var(--reader-panel);
  color:var(--reader-ink);
  outline:none;
}
.reader-render:has(.reader-foliate-view){
  padding:0;
  overflow:hidden;
}
body[data-theme="night"] .reader-foliate-view{
  background:#1f211f;
}
.reader-settings input:disabled,
.reader-settings select:disabled{
  opacity:.42;
  cursor:not-allowed;
}
.reader-settings label:has(input:disabled),
.reader-settings label:has(select:disabled){
  opacity:.62;
}
@media(max-width:640px){
  .reader-foliate-view{height:100%}
}


/* Lecteur V2 — zoom + navigation rapide */
.reader-stage-tools{
  position:absolute;
  z-index:9;
  top:12px;
  left:50%;
  transform:translateX(-50%);
  display:flex;
  align-items:center;
  gap:3px;
  padding:4px;
  border:1px solid rgba(73,67,59,.11);
  border-radius:999px;
  background:rgba(250,248,243,.82);
  box-shadow:0 5px 18px rgba(42,37,31,.07);
  backdrop-filter:blur(10px);
  opacity:.5;
  transition:opacity .18s ease,background .18s ease;
}
.reader-stage:hover .reader-stage-tools,
.reader-stage-tools:focus-within{opacity:1;background:rgba(250,248,243,.96)}
.reader-stage-tools button{
  min-width:34px;
  height:30px;
  border:0;
  border-radius:999px;
  background:transparent;
  color:#68645e;
  cursor:pointer;
  font-size:.7rem;
  font-weight:750;
}
.reader-stage-tools button:hover{background:#ece7df;color:#292724}
.reader-stage-tools [data-zoom-label]{
  min-width:52px;
  text-align:center;
  color:#76716a;
  font-size:.65rem;
  font-variant-numeric:tabular-nums;
}
.reader-render.is-comic{
  overflow:auto!important;
  overscroll-behavior:contain;
}
.reader-render.is-comic .reader-foliate-view{
  transform-origin:top center;
}
body.reader-focus .reader-stage-tools{top:10px}
@media(max-width:640px){
  .reader-stage-tools{
    top:8px;
    gap:1px;
    padding:3px;
    opacity:.82;
  }
  .reader-stage-tools button{
    min-width:31px;
    height:28px;
    padding:0 6px;
    font-size:.63rem;
  }
  .reader-stage-tools [data-zoom-label]{
    min-width:46px;
    font-size:.59rem;
  }
}
@media(max-width:390px){
  .reader-stage-tools{
    left:50%;
    max-width:calc(100% - 92px);
  }
  .reader-stage-tools button[data-jump-pages]{
    min-width:28px;
    font-size:.57rem;
  }
}


/* Correctif V3 — zoom visuel réel */
.reader-render,
.reader-plain{
  transform-origin:top left;
}
.reader-render.is-zoomed{
  overflow:auto!important;
}
.reader-stage-tools{
  min-width:138px;
  justify-content:center;
}
.reader-stage-tools [data-zoom-label]{
  min-width:58px;
}
@media(max-width:390px){
  .reader-stage-tools{
    max-width:none;
    min-width:132px;
  }
}


/* ==========================================================
   Lecteur actif — pages, recherche, notes, marque-pages
   ========================================================== */
body[data-theme="sepia"]{
  --reader-bg:#eee5d5;
  --reader-panel:#f4ead8;
  --reader-ink:#3b3228;
  --reader-muted:#887967;
  --reader-line:#d7c7b2;
  --reader-line-strong:#c5b097;
}
body[data-theme="sepia"] .reader-top-actions button,
body[data-theme="sepia"] .reader-progress-menu,
body[data-theme="sepia"] .reader-library-head button,
body[data-theme="sepia"] .reader-book-card,
body[data-theme="sepia"] .reader-drawer-panel,
body[data-theme="sepia"] .reader-library-row,
body[data-theme="sepia"] .reader-drawer-panel > header > button,
body[data-theme="sepia"] .reader-settings{
  background:#f7efdf;
  color:#3b3228;
}

/* Recent books now display progress */
.reader-book-card-copy em,
.reader-library-open em{
  display:block;
  margin-top:5px;
  color:#8a8177;
  font-size:.61rem;
  font-style:normal;
}
.reader-book-card-progress,
.reader-library-progress{
  display:block;
  width:100%;
  height:4px;
  margin-top:10px;
  overflow:hidden;
  border-radius:999px;
  background:#e7e1d9;
}
.reader-book-card-progress i,
.reader-library-progress i{
  display:block;
  height:100%;
  border-radius:inherit;
  background:#826245;
}
.reader-library-progress{max-width:240px;margin-top:7px}

/* Command footer */
.reader-workspace{
  grid-template-rows:minmax(0,1fr) auto;
}
.reader-progressbar{
  min-height:82px;
  display:grid;
  grid-template-columns:auto minmax(180px,1fr) minmax(180px,auto);
  grid-template-rows:auto;
  align-items:center;
  gap:12px;
  padding:9px max(14px,calc((100vw - 1280px)/2)) calc(9px + var(--safe-bottom));
}
.reader-progress-tools{
  display:flex;
  align-items:center;
  gap:4px;
  min-width:0;
  overflow-x:auto;
  scrollbar-width:none;
}
.reader-progress-tools::-webkit-scrollbar{display:none}
.reader-progress-tools .reader-progress-menu{
  flex:0 0 auto;
  min-height:31px;
  padding:0 9px;
  font-size:.68rem;
}
.reader-history-tools{
  display:inline-flex;
  gap:3px;
  margin-left:2px;
}
.reader-history-tools button{
  width:31px;
  height:31px;
  border:1px solid var(--reader-line);
  border-radius:999px;
  background:rgba(255,255,255,.62);
  color:#6c6862;
  cursor:pointer;
}
.reader-history-tools button:disabled{opacity:.3;cursor:not-allowed}
.reader-progress-track{
  display:grid;
  grid-template-columns:minmax(0,1fr) 48px;
  align-items:center;
  gap:8px;
}
.reader-progress-track input{width:100%;accent-color:#856443}
.reader-progress-track span{
  color:#77756f;
  font-size:.69rem;
  text-align:right;
  font-variant-numeric:tabular-nums;
}
.reader-position-meta{
  min-width:0;
  display:grid;
  justify-items:end;
  text-align:right;
}
.reader-position-meta strong{
  max-width:320px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:.66rem;
  color:#5f5d58;
}
.reader-position-meta small{
  margin-top:2px;
  color:#8b877f;
  font-size:.54rem;
}

/* Wider drawers */
.reader-drawer-panel-wide{width:min(760px,94vw)}
.reader-drawer:has(.reader-drawer-panel-wide){
  grid-template-columns:minmax(0,1fr) min(760px,94vw);
}
.reader-drawer-panel > header p{
  margin:4px 0 0;
  max-width:520px;
  color:#8b857d;
  font-size:.64rem;
  line-height:1.4;
}

/* Page thumbnails */
.reader-pages-toolbar{
  position:sticky;
  top:-26px;
  z-index:3;
  display:flex;
  align-items:center;
  gap:8px;
  padding:12px 0 10px;
  background:linear-gradient(#fbfaf7 78%,rgba(251,250,247,0));
}
.reader-pages-toolbar label{
  display:flex;
  align-items:center;
  gap:6px;
  color:#7c756d;
  font-size:.61rem;
}
.reader-pages-toolbar input[type="range"]{width:110px;accent-color:#856443}
.reader-pages-toolbar input[type="number"]{
  width:70px;
  height:32px;
  border:1px solid var(--reader-line);
  border-radius:8px;
  background:#fff;
  padding:0 8px;
}
.reader-pages-toolbar button,
.reader-book-search button,
.reader-bookmark-actions button,
.reader-notes-actions button{
  min-height:32px;
  border:1px solid var(--reader-line);
  border-radius:9px;
  background:#fff;
  padding:0 10px;
  cursor:pointer;
  font-size:.62rem;
}
.reader-page-thumbs{
  --thumb-size:130px;
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(var(--thumb-size),1fr));
  gap:10px;
  padding:4px 1px 20px;
}
.reader-page-thumb{
  min-width:0;
  display:grid;
  gap:7px;
  border:1px solid transparent;
  border-radius:13px;
  background:transparent;
  padding:6px;
  cursor:pointer;
  text-align:left;
}
.reader-page-thumb:hover{background:#f1ece5}
.reader-page-thumb.is-current{
  border-color:#8b6e51;
  background:#f5efe7;
  box-shadow:0 0 0 2px rgba(139,110,81,.08);
}
.reader-page-thumb-paper{
  aspect-ratio:.72;
  min-height:calc(var(--thumb-size) * 1.25);
  display:flex;
  flex-direction:column;
  gap:6px;
  overflow:hidden;
  border:1px solid #ddd6cd;
  border-radius:5px;
  background:#fffdf9;
  padding:10px 9px;
  box-shadow:0 3px 12px rgba(43,37,31,.07);
}
.reader-page-thumb-paper i{
  display:block;
  width:52%;
  height:5px;
  border-radius:999px;
  background:#d8d2cb;
}
.reader-page-thumb-paper em{
  overflow:hidden;
  color:#706a63;
  font:400 .49rem/1.34 Georgia,serif;
  font-style:normal;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:11;
}
.reader-page-thumb-comic{padding:0;background:#ebe8e4}
.reader-page-thumb-comic img{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
}
.reader-page-thumb>span:last-child{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:5px;
}
.reader-page-thumb strong{font-size:.63rem}
.reader-page-thumb small{color:#8b847d;font-size:.53rem}
.reader-page-thumb.is-thumb-error .reader-page-thumb-paper::after{
  content:"Aperçu indisponible";
  margin:auto;
  color:#918a82;
  font-size:.52rem;
}

/* Search */
.reader-book-search{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:7px;
  margin-top:16px;
}
.reader-book-search input{
  min-width:0;
  height:42px;
  border:1px solid var(--reader-line);
  border-radius:11px;
  background:#fff;
  padding:0 12px;
  outline:0;
}
.reader-book-search input:focus{border-color:#a58d72;box-shadow:0 0 0 3px rgba(133,100,67,.08)}
.reader-search-status{margin:10px 0;color:#8b857d;font-size:.63rem}
.reader-search-results{display:grid;gap:6px}
.reader-search-result{
  width:100%;
  border:1px solid var(--reader-line);
  border-radius:11px;
  background:#fff;
  padding:10px 11px;
  cursor:pointer;
  text-align:left;
}
.reader-search-result:hover{background:#f5f1ea}
.reader-search-result span{
  display:block;
  color:#967b5e;
  font-size:.52rem;
  font-weight:750;
  text-transform:uppercase;
  letter-spacing:.07em;
}
.reader-search-result strong{
  display:block;
  margin-top:4px;
  color:#504d48;
  font:500 .7rem/1.48 Georgia,serif;
}

/* Bookmarks + Notes */
.reader-bookmark-actions,.reader-notes-actions{
  display:flex;
  gap:5px;
  flex-wrap:wrap;
  margin:15px 0 11px;
}
.reader-bookmarks-list,.reader-notes-list{display:grid;gap:7px}
.reader-saved-item,.reader-note-item{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:8px;
  align-items:start;
  border:1px solid var(--reader-line);
  border-radius:12px;
  background:#fff;
  padding:9px 9px 9px 11px;
}
.reader-saved-open,.reader-note-open{
  min-width:0;
  border:0;
  background:transparent;
  padding:0;
  cursor:pointer;
  text-align:left;
}
.reader-saved-open strong{display:block;font-size:.74rem}
.reader-saved-open small,.reader-note-open small{display:block;margin-top:4px;color:#8c867e;font-size:.54rem}
.reader-saved-item>div,.reader-note-item>div{display:flex;gap:3px}
.reader-saved-item>div button,.reader-note-item>div button{
  width:29px;height:29px;border:0;border-radius:8px;background:#f5f1eb;color:#80776d;cursor:pointer;
}
.reader-note-open>span{
  display:block;color:#95785a;font-size:.5rem;font-weight:800;text-transform:uppercase;letter-spacing:.07em
}
.reader-note-open blockquote{
  margin:5px 0 0;padding-left:9px;border-left:2px solid #d9c8b5;
  color:#5c5751;font:500 .68rem/1.5 Georgia,serif;
}
.reader-note-open p{margin:6px 0 0;color:#65615b;font-size:.64rem;line-height:1.45}
.philosophal-reader-highlight{background:#eadb79;color:inherit;border-radius:.15em}

/* Selection action bar */
.reader-selection-tools{
  position:fixed;
  z-index:125;
  left:50%;
  bottom:calc(94px + var(--safe-bottom));
  transform:translateX(-50%);
  display:flex;
  align-items:center;
  gap:3px;
  max-width:calc(100vw - 24px);
  padding:5px;
  border:1px solid rgba(55,49,43,.12);
  border-radius:999px;
  background:rgba(36,35,32,.96);
  box-shadow:0 14px 40px rgba(0,0,0,.2);
}
.reader-selection-tools button{
  border:0;border-radius:999px;background:transparent;color:#f3efe8;
  min-height:31px;padding:0 10px;cursor:pointer;font-size:.61rem;white-space:nowrap;
}
.reader-selection-tools button:hover{background:rgba(255,255,255,.1)}
.reader-selection-tools [data-selection-close]{width:31px;padding:0;color:#c9c3bb}

/* Shortcuts */
.reader-shortcuts-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:7px;
  margin-top:16px;
}
.reader-shortcuts-grid>div{
  display:grid;
  grid-template-columns:48px 1fr;
  align-items:center;
  gap:8px;
  padding:8px;
  border-radius:10px;
  background:#f4f0ea;
}
.reader-shortcuts-grid kbd{
  justify-self:center;
  min-width:34px;
  padding:5px 6px;
  border:1px solid #d7cfc5;
  border-bottom-width:2px;
  border-radius:7px;
  background:#fff;
  font:700 .62rem/1 system-ui,sans-serif;
  text-align:center;
}
.reader-shortcuts-grid span{font-size:.62rem;color:#65615b}
.reader-shortcuts-hint{margin:14px 0 0;color:#858078;font-size:.62rem;line-height:1.5}

/* Advanced typography */
.reader-plain{
  max-width:var(--reader-text-max,none);
  margin-left:auto;
  margin-right:auto;
}
.reader-plain p{margin-bottom:var(--reader-paragraph-space,1.05em)}
.reader-settings{
  max-height:calc(100dvh - 90px);
  overflow:auto;
}
.reader-settings-grid{grid-template-columns:1fr}
.reader-settings label{
  grid-template-columns:126px minmax(0,1fr);
}
.reader-render,.reader-plain{will-change:filter}
.reader-ui-hidden .reader-topbar,
.reader-ui-hidden .reader-progressbar,
.reader-ui-hidden .reader-page-nav,
.reader-ui-hidden .reader-stage-tools{
  opacity:0;
  pointer-events:none;
}
.reader-topbar,.reader-progressbar,.reader-page-nav,.reader-stage-tools{
  transition:opacity .18s ease;
}

/* Focus mode stays readable, with selection tools available */
.reader-focus .reader-selection-tools{bottom:22px}
.reader-focus .reader-stage-tools{opacity:.18}
.reader-focus .reader-stage:hover .reader-stage-tools{opacity:.8}

@media(max-width:980px){
  .reader-progressbar{
    grid-template-columns:1fr;
    gap:7px;
    min-height:104px;
  }
  .reader-position-meta{justify-items:start;text-align:left}
  .reader-position-meta strong{max-width:100%}
  .reader-progress-tools{order:1}
  .reader-progress-track{order:2}
  .reader-position-meta{order:3}
}
@media(max-width:640px){
  .reader-workspace{grid-template-rows:minmax(0,1fr) auto}
  .reader-progressbar{
    min-height:116px;
    padding:6px 8px calc(7px + var(--safe-bottom));
  }
  .reader-progress-tools .reader-progress-menu{font-size:.58rem;padding:0 7px}
  .reader-position-meta small{display:none}
  .reader-drawer:has(.reader-drawer-panel-wide){grid-template-columns:1fr}
  .reader-drawer-panel-wide{width:100%}
  .reader-pages-toolbar{top:-26px;flex-wrap:wrap}
  .reader-pages-toolbar label:first-child{flex:1 1 100%}
  .reader-page-thumbs{grid-template-columns:repeat(auto-fill,minmax(105px,1fr))}
  .reader-selection-tools{
    bottom:calc(124px + var(--safe-bottom));
    overflow-x:auto;
    max-width:calc(100vw - 14px);
  }
  .reader-selection-tools button{padding:0 8px;font-size:.56rem}
  .reader-shortcuts-grid{grid-template-columns:1fr}
  .reader-top-actions [data-open-shortcuts]{font-size:.74rem}
  .reader-top-actions [data-open-shortcuts]::after{content:""}
}
@media(max-width:420px){
  .reader-progress-tools [data-open-search]{padding-inline:6px}
  .reader-page-thumbs{grid-template-columns:repeat(2,minmax(0,1fr))}
  .reader-settings label{grid-template-columns:105px minmax(0,1fr)}
}


/* Lecteur final — miniatures visuelles & doubles pages */
.reader-page-thumb.is-wide-page{
  grid-column:span 2;
}
.reader-page-thumb.is-wide-page .reader-page-thumb-paper{
  aspect-ratio:1.38;
  min-height:0;
}
.reader-page-thumb.is-wide-page .reader-page-thumb-comic img{
  object-fit:contain;
}
@media(max-width:560px){
  .reader-page-thumb.is-wide-page{grid-column:span 2}
}


/* V32 : des pages entières, un zoom navigable et des miniatures accessibles. */
.reader-workspace{height:calc(100dvh - var(--reader-topbar-height,62px));min-height:0;grid-template-rows:minmax(0,1fr) auto}
.reader-render.is-text-epub{width:min(100%,var(--epub-reading-width,100%));margin-inline:auto;overflow:hidden}
.reader-pagination-host{position:fixed;left:-100000px;top:0;overflow:hidden;pointer-events:none;visibility:hidden}
.reader-stage-tools select{max-width:95px;min-height:29px;border:0;border-right:1px solid var(--reader-line);background:transparent;color:inherit;font-size:12px;padding:0 8px;cursor:pointer}
.reader-stage-tools{opacity:.8}
.reader-render:has(.reader-visual-spread){overflow:hidden}
.reader-visual-spread{width:100%;height:100%;overflow:auto;display:flex;align-items:safe center;justify-content:safe center;padding:12px clamp(34px,5vw,72px);overscroll-behavior:contain}
.reader-visual-spread-canvas{display:flex;flex-shrink:0;align-items:center;justify-content:center;gap:0;max-width:none;max-height:none}
.reader-visual-page{position:relative;flex-shrink:0;overflow:hidden;margin:0;height:100%;display:flex;align-items:center;justify-content:center}
.reader-visual-page img{display:block;width:100%;height:100%;object-fit:contain;user-select:none;-webkit-user-drag:none}
.reader-visual-page iframe{position:absolute;top:0;left:0;border:0;transform-origin:top left;background:#fff}
.reader-visual-page figcaption{position:absolute;inset:0;display:grid;place-items:center;background:var(--reader-panel);color:var(--reader-muted)}
.reader-spread-locker{display:grid;gap:10px;padding:14px;margin-bottom:18px;border:1px solid var(--reader-line);border-radius:13px;background:var(--reader-bg)}
.reader-spread-locker strong{display:block;font-size:14px}
.reader-spread-locker small{display:block;margin-top:4px;font-size:12px;line-height:1.5;color:var(--reader-muted)}
.reader-spread-locker-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.reader-spread-locker-actions>span{flex:1 1 100%;font-size:12px;color:var(--reader-muted)}
.reader-spread-locker-actions button,.reader-spread-lock-chip{min-height:34px;padding:7px 10px;border:1px solid var(--reader-line);border-radius:8px;background:var(--reader-panel);cursor:pointer;font-size:12px}
.reader-spread-locker-actions button:disabled{opacity:.4;cursor:default}
.reader-spread-lock-list{display:flex;flex-wrap:wrap;gap:6px}
.reader-spread-start{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:12px}
.reader-spread-start select{min-width:0;max-width:100%;padding:7px 8px;border:1px solid var(--reader-line);border-radius:7px;background:var(--reader-panel);color:inherit;font-size:12px}
.reader-page-thumb{position:relative;padding:5px;cursor:default}
.reader-thumb-open{display:grid;gap:7px;width:100%;border:0;border-radius:6px;background:transparent;color:inherit;padding:0;cursor:pointer;text-align:left}
.reader-thumb-open:focus-visible{outline:2px solid #7c6046;outline-offset:4px}
.reader-thumb-caption{display:flex;justify-content:space-between;align-items:center;gap:6px}
.reader-thumb-caption strong{font-size:12px}
.reader-thumb-caption small{font-size:11px}
.reader-page-thumb-paper{position:relative;min-height:0;aspect-ratio:.72}
.reader-page-thumb-comic{padding:0;background:var(--reader-panel)}
.reader-page-thumb-comic img{width:100%;height:100%;object-fit:contain;display:block}
.reader-page-thumb-comic iframe{position:absolute;left:0;top:0;transform-origin:top left;border:0;pointer-events:none;background:#fff}
.reader-pair-select{position:absolute;top:10px;left:10px;display:grid;place-items:center;width:30px;height:30px;border:1px solid var(--reader-line);border-radius:8px;background:rgba(255,253,249,.95);box-shadow:0 2px 8px #0001;cursor:pointer}
.reader-pair-select input{width:19px;height:19px;margin:0;accent-color:#7c6046;cursor:pointer}
.reader-page-thumb.is-pair-selected{box-shadow:0 0 0 2px #9b795c}
.reader-page-thumb.is-pair-locked .reader-thumb-caption::after{content:'Associée';font-size:10px;color:#7c6046}
.reader-page-thumb.is-wide-page{grid-column:span 2}
.reader-page-thumb.is-wide-page .reader-page-thumb-paper{aspect-ratio:1.42}
.reader-page-thumbs[aria-busy="true"]::before{content:'Création des miniatures…';grid-column:1/-1;color:var(--reader-muted);font-size:13px;padding:20px 0}
.reader-pages-toolbar label,.reader-pages-toolbar button,.reader-drawer-panel>header p{font-size:12px}
@media(max-width:720px){.reader-visual-spread{padding:8px 28px}.reader-progress-tools{flex-wrap:wrap}.reader-stage-tools select{max-width:85px}.reader-spread-start{align-items:flex-start;flex-direction:column}}
@media(prefers-reduced-motion:reduce){.reader-visual-spread-canvas{transition:none}}