.reader { --reader-bg: #fff; --reader-fg: #252525; --reader-panel: #f5f6f8; --reader-border: #c9ced6; --reader-highlight: #dde9fc; }
.reader.theme-sepia { --reader-bg: #f4ecd8; --reader-fg: #433422; --reader-panel: #e9dfc7; --reader-border: #c6b89a; --reader-highlight: #d9ccb0; }
.reader.theme-night { --reader-bg: #20242a; --reader-fg: #e6e6e6; --reader-panel: #292f37; --reader-border: #525d6c; --reader-highlight: #384d68; }
body.reader-open { overflow: hidden; }
#reader-book { position: fixed; inset: 0; z-index: 1050; background: var(--reader-bg); color: var(--reader-fg); display: flex; flex-direction: column; }
#reader-book[hidden], .reader [hidden] { display: none; }
.reader-header { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .8rem 1.2rem; border-bottom: 1px solid var(--reader-border); background: var(--reader-panel); }
.reader-heading { min-width: 0; }
.reader-heading h2 { font-size: 1.1rem; margin: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.reader-heading p { font-size: .85rem; margin: .2rem 0 0; }
.reader-header-actions { display: flex; gap: .5rem; flex-shrink: 0; }
.reader-button { border: 1px solid var(--reader-border); border-radius: .4rem; background: var(--reader-bg); color: var(--reader-fg); padding: .5rem .75rem; cursor: pointer; font: inherit; }
.reader-button:hover:not(:disabled), .reader-button[aria-expanded="true"] { background: var(--reader-highlight); }
.reader-button:disabled { opacity: .45; cursor: default; }
.reader-options { position: absolute; right: 1rem; top: calc(100% + .5rem); z-index: 2; width: min(19rem, calc(100vw - 2rem)); background: var(--reader-panel); border: 1px solid var(--reader-border); border-radius: .7rem; padding: 1.2rem; box-shadow: 0 .5rem 2rem #0003; max-height: calc(100dvh - 7rem); overflow: auto; }
.reader-options h3 { font-size: 1.1rem; margin: 0 0 1rem; }
.reader-options label { display: block; margin: .7rem 0 .3rem; }
.reader-options select { width: 100%; border: 1px solid var(--reader-border); border-radius: .3rem; padding: .5rem; background: var(--reader-bg); color: var(--reader-fg); }
.reader-options button { margin-top: 1rem; width: 100%; }
.reader-options p { font-size: .8rem; margin: .8rem 0 0; }
.reader-shell { display: grid; grid-template-columns: 17rem minmax(0, 1fr); flex: 1; min-height: 0; }
.reader.toc-collapsed .reader-shell { grid-template-columns: minmax(0, 1fr); }
.reader-sidebar { overflow: auto; padding: 1.3rem .8rem; border-right: 1px solid var(--reader-border); background: var(--reader-panel); }
.reader-sidebar h3 { font-size: 1rem; padding: 0 .5rem; margin-bottom: 1rem; }
.reader-toc-item { display: block; width: 100%; border: 0; border-radius: .3rem; background: transparent; color: inherit; font: inherit; font-size: .9rem; text-align: left; padding: .65rem .5rem; overflow-wrap: anywhere; cursor: pointer; }
.reader-toc-item:hover, .reader-toc-item[aria-current="location"] { background: var(--reader-highlight); }
.reader-toc-item[aria-current="location"] { font-weight: 600; }
.reader-main { min-height: 0; min-width: 0; display: flex; flex-direction: column; }
.reader-content { flex: 1; min-height: 0; overflow: auto; padding: clamp(1.2rem, 4vw, 4rem); line-height: 1.75; font-family: Georgia, serif; overflow-wrap: anywhere; background: var(--reader-bg); color: var(--reader-fg); }
.reader-content > div { max-width: 50rem; margin: auto; }
.reader-content img { max-width: 100%; height: auto; display: block; margin: 1rem auto; }
.reader-content table { max-width: 100%; border-collapse: collapse; }
.reader-content td, .reader-content th { border: 1px solid; padding: .3rem; }
.reader-content h1, .reader-content h2, .reader-content h3 { line-height: 1.3; margin: 1.5em 0 .6em; }
.reader-content p { margin: 0 0 .8em; }
.reader-content a { color: inherit; text-decoration: underline; }
.font-small .reader-content { font-size: 1rem; }
.font-medium .reader-content { font-size: 1.2rem; }
.font-large .reader-content { font-size: 1.4rem; }
.font-xlarge .reader-content { font-size: 1.65rem; }
.reader-navigation { display: flex; align-items: center; justify-content: space-between; gap: .5rem; padding: .6rem 1rem; border-top: 1px solid var(--reader-border); font-size: .9rem; }
#reader-status-slot { background: var(--reader-panel); }
#reader-status-slot p { font-size: .75rem; margin: 0; padding: .25rem 1rem; }
.reader button:focus-visible, .reader select:focus-visible, .reader-content:focus-visible { outline: 3px solid #258cfb; outline-offset: -3px; }
@media (max-width: 640px) {
    .reader-header { padding: .6rem; gap: .5rem; }
    .reader-heading h2 { max-width: 42vw; }
    .reader-heading p { display: none; }
    .reader-shell { grid-template-columns: min(43vw, 15rem) minmax(0, 1fr); }
    .reader-sidebar { padding: .8rem .35rem; }
    .reader-navigation { font-size: .75rem; padding: .5rem; gap: .25rem; }
    .reader-button { padding: .45rem .55rem; }
    #reader-status-slot { display: none; }
}

.epub-library { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 1.4rem; }
.library-book { display: flex; flex-direction: column; min-width: 0; border: 1px solid #dce4ee; border-radius: .8rem; overflow: hidden; background: #fff; box-shadow: 0 3px 12px #1028460a; }
.library-book-cover { position: relative; aspect-ratio: 2 / 3; width: 100%; background: #edeff3; display: grid; place-items: center; overflow: hidden; }
.library-book-cover img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; }
.library-cover-placeholder { color: #66758a; font-size: .9rem; border: 1px solid #bcc5d2; border-radius: .3rem; padding: 2rem 1rem; }
.library-book-info { padding: 1rem 1rem .7rem; overflow-wrap: anywhere; }
.library-book-info h3 { margin: 0 0 .4rem; font-size: 1rem; line-height: 1.4; }
.library-book-info p { margin: 0; font-size: .8rem; color: #596b80; }
.library-book-actions { display: flex; gap: .5rem; padding: 0 1rem 1rem; margin-top: auto; }
.library-book-actions button { flex: 1; font-size: .85rem; padding: .5rem .25rem; }
@media (max-width: 420px) { .epub-library { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7rem; } .library-book-info { padding: .7rem; } .library-book-actions { padding: 0 .7rem .7rem; gap: .3rem; } }

.reader-progress-info { display: grid; justify-items: center; gap: .2rem; min-width: 0; }
#reader-percentage { font-weight: 600; font-size: .85rem; }
#reader-progress { display: block; width: min(12rem, 100%); height: .35rem; accent-color: #4776a8; }
@media (max-width: 640px) { #reader-percentage { font-size: .75rem; } }
