.reader-page { padding:48px 0 70px; }
.reader-heading { text-align:center; }
.reader-heading h1 { margin:0; font-size:clamp(38px,5.1vw,64px); line-height:1.1; }
.reader-heading>p:last-child { margin:16px auto 30px; color:var(--muted); font-size:17px; }
.reader-shell { width:min(1260px,calc(100% - 32px)); margin:auto; overflow:hidden; border:1px solid var(--line); border-radius:12px; background:#292724; box-shadow:0 24px 55px rgba(40,32,25,.18); }
.reader-toolbar { min-height:58px; padding:9px 14px; display:flex; align-items:center; gap:10px; background:var(--surface); color:var(--ink); font-family:'TC Volume Sans',sans-serif; }
.reader-toolbar--top { border-bottom:1px solid var(--line); }
.reader-toolbar--bottom { justify-content:center; border-top:1px solid var(--line); }
.reader-toolbar label { font-size:11px; letter-spacing:.05em; text-transform:uppercase; }
.reader-toolbar select,.reader-tool,.reader-nav { min-height:38px; padding:7px 13px; border:1px solid var(--orange); border-radius:999px; background:var(--button-cream); color:var(--button-ink); font:12px 'TC Volume Sans',sans-serif; cursor:pointer; text-decoration:none; }
.reader-toolbar select:hover,.reader-tool:hover,.reader-nav:hover:not(:disabled) { background:var(--orange); }
.reader-toolbar-spacer { flex:1; }
.reader-stage { position:relative; min-height:min(76vh,890px); padding:28px; display:grid; place-items:center; overflow:hidden; background:radial-gradient(circle at center,#59524b 0,#302d29 66%,#262421 100%); }
.reader-stage:fullscreen { width:100vw; height:100vh; padding:22px; background:#211f1d; }
.reader-book { width:100%; opacity:0; transition:opacity 240ms ease; }
.reader-book.is-ready { opacity:1; }
.reader-book canvas { filter:drop-shadow(0 16px 20px rgba(0,0,0,.35)); }
.reader-loading { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; color:#fff9ef; text-align:center; }
.reader-loading[hidden] { display:none; }
.reader-loading strong { font-family:'Libre Baskerville',Baskerville,Georgia,serif; font-size:24px; font-style:italic; font-weight:400; }
.reader-loading span:last-child { color:#d9d1c7; font:12px 'TC Volume Sans',sans-serif; }
.reader-spinner { width:36px; height:36px; margin-bottom:8px; border:3px solid rgba(255,255,255,.25); border-top-color:var(--orange); border-radius:50%; animation:reader-spin .8s linear infinite; }
.reader-error { max-width:500px; padding:40px; color:#fff9ef; text-align:center; }
.reader-error h2 { margin-top:0; font-size:34px; }
.reader-error .button { margin-top:8px; }
.reader-page-count { min-width:135px; margin:0; color:var(--muted); font:12px 'TC Volume Sans',sans-serif; text-align:center; }
.reader-nav { min-width:92px; }
.reader-nav:disabled { opacity:.45; cursor:not-allowed; }
.reader-back { margin-top:24px; text-align:center; }
.reader-back a { color:var(--orange-dark); font:12px 'TC Volume Sans',sans-serif; text-decoration:underline; text-underline-offset:4px; }
@keyframes reader-spin { to { transform:rotate(360deg); } }
@media(max-width:760px) {
  .reader-page { padding-top:38px; }
  .reader-heading>p:last-child { margin-bottom:24px; }
  .reader-shell { width:calc(100% - 18px); border-radius:8px; }
  .reader-toolbar { padding:8px; gap:7px; }
  .reader-toolbar label { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }
  .reader-toolbar select,.reader-tool,.reader-nav { min-height:36px; padding:6px 10px; font-size:11px; }
  .reader-stage { min-height:69vh; padding:12px 6px; }
  .reader-tool { white-space:nowrap; }
  .reader-page-count { min-width:108px; font-size:11px; }
  .reader-nav { min-width:76px; }
}
@media(max-width:470px) {
  #reader-fullscreen { display:none; }
  .reader-toolbar-spacer { display:none; }
  .reader-toolbar--top { justify-content:space-between; }
}
@media(prefers-reduced-motion:reduce) { .reader-spinner { animation:none; } }