.reader-page { --reading-width: 800px; }
.reader-title { text-align: center; max-width: 850px; margin: 0 auto 24px; }
.reader-title h1 { font-size: clamp(1.5rem,3vw,2.3rem); }
.reader-title h2 { font-size: 1.2rem; margin: 12px 0; }
.reader-note { margin: 15px auto 0; font-size: .875rem; color: var(--muted); max-width: 700px; }
.reader-nav { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin: 24px 0; }
.disabled { border-color: var(--line); color: var(--muted); }
.reader-controls { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 20px; padding: 18px 0; }
.reader-controls label { display: flex; align-items: center; gap: 10px; font-size: .875rem; }
.reader-controls input { padding: 0; width: 150px; accent-color: #6e941f; }
.reader-controls output { font-size: .875rem; color: var(--muted); }
.reading-pages { width: min(100%,var(--reading-width)); margin: 20px auto 0; background: var(--paper); }
.reading-panel { margin: 0; padding: 0 0 8px; }
.reading-image { width: 100%; height: auto; max-width: 100%; object-fit: contain; background: #e0e6db; }
.reading-image.image-error { aspect-ratio: 2/3; }
.reading-panel figcaption { padding: 3px 12px; margin: 0; text-align: center; }
.chapter-finish { text-align: center; color: var(--muted); margin: 26px auto; max-width: 700px; }
.back-top { display: block; width: max-content; margin: 24px auto 0; padding: 10px 20px; border: 1px solid var(--line); border-radius: 9px; }
.reader-page.dark { --ink: #e2e8e2; --muted: #abb5ae; --canvas: #111915; --paper: #1b2620; --line: #3b4940; }
.reader-page.dark .site-footer { background: #18221c; }
.reader-page.dark .genre { color: #b7cc98; }
.reader-page.dark a:hover { color: #b7e660; }
.reader-page.dark .primary { color: #203009; }
.reader-page.dark .footer-grid section p { color: var(--muted); }
@media (max-width: 700px) {
    .reader-nav { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
    .reader-controls { gap: 14px; }
    .reader-controls label { flex-wrap: wrap; justify-content: center; }
    .reading-pages { width: 100%; }
    .reader-title h1 { font-size: 1.45rem; }
}