:root{color-scheme:dark;font-family:-apple-system,BlinkMacSystemFont,"Noto Sans TC","Microsoft JhengHei",sans-serif;background:#08090c;color:#f1f1f3;--muted:#969ba7;--accent:#dac093}*{box-sizing:border-box}body{margin:0}a{color:inherit;text-decoration:none}button,select{font:inherit;color:inherit;background:#20232c;border:1px solid #383c49;border-radius:9px;min-height:44px;padding:8px 12px;cursor:pointer}a:focus-visible,button:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:4px}[hidden]{display:none!important}.library{max-width:1050px;margin:auto;padding:44px 20px 20px}.eyebrow{color:var(--accent);font-size:12px;letter-spacing:3px}h1{font-size:40px;letter-spacing:-2px;margin:16px 0 10px}.dot{color:var(--accent)}.masthead p,.library-footer{color:var(--muted);font-size:14px}.continue{display:block;border:1px solid #665a43;background:linear-gradient(110deg,#28241c,#14161c);padding:20px;border-radius:14px;margin:30px 0;color:var(--accent)}.continue strong{display:block;font-size:22px;color:#fff;margin:8px 0}.continue small{color:#c2bbaa}.list-heading{display:flex;align-items:center;justify-content:space-between;margin:32px 0 18px}.list-heading h2{font-size:18px;margin:0}.list-heading span{color:var(--muted);font-size:12px}.chapter-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.chapter-card{background:#14161d;border:1px solid #252831;border-radius:12px;overflow:hidden;transition:transform .15s}.chapter-card:hover{transform:translateY(-3px)}.cover{position:relative;aspect-ratio:4/3;overflow:hidden;background:#20232c}.cover img{width:100%;height:100%;object-fit:cover;object-position:top}.badge{position:absolute;bottom:9px;left:9px;background:#08090ce6;padding:5px 8px;border-radius:6px;font-size:11px}.card-info{padding:13px}.card-info h3{font-size:16px;margin:0 0 7px}.card-info p{font-size:12px;color:var(--muted);margin:0 0 10px}progress{display:block;width:100%;height:4px;border:0;border-radius:6px;overflow:hidden;background:#30343e}progress::-webkit-progress-bar{background:#30343e}progress::-webkit-progress-value{background:var(--accent)}progress::-moz-progress-bar{background:var(--accent)}.library-footer{text-align:center;padding:36px 0 16px;font-size:12px}#reader{background:#000;min-height:100dvh;padding-top:calc(68px + env(safe-area-inset-top))}.reader-bar{height:calc(68px + env(safe-area-inset-top));padding:env(safe-area-inset-top) 12px 0;position:fixed;top:0;left:0;right:0;z-index:5;background:#101116f2;border-bottom:1px solid #2b2d35;display:flex;align-items:center;justify-content:space-between;gap:8px}.reader-bar a{padding:12px 0;color:var(--accent);font-size:14px}.reader-bar div{text-align:center}.reader-bar strong{font-size:15px}.reader-bar span{display:block;font-size:11px;color:var(--muted);margin-top:4px}.reader-bar button{font-size:12px}#pages{max-width:720px;margin:auto}#pages img{display:block;width:100%;height:auto;background:#161616}#single{max-width:720px;margin:auto;touch-action:pan-y pinch-zoom}#single-image{display:block;width:100%;height:auto;object-fit:contain;max-height:calc(100dvh - 210px);min-height:180px}.page-controls{display:flex;align-items:center;justify-content:center;gap:8px;padding:14px 8px}.page-controls label{font-size:12px;color:var(--muted)}.page-controls select{max-width:82px}.page-controls button{font-size:12px}.hint{font-size:12px;text-align:center;color:var(--muted)}.chapter-nav{max-width:720px;margin:0 auto;display:flex;gap:12px;justify-content:space-between;padding:26px 12px 90px}.chapter-nav a{background:#1c1e25;border:1px solid #30333c;border-radius:8px;padding:12px;font-size:13px}.chapter-nav a[aria-disabled=true]{opacity:.35;pointer-events:none}#top{position:fixed;right:16px;bottom:calc(16px + env(safe-area-inset-bottom));background:#292a30e8;font-size:12px;z-index:4}#status{position:fixed;bottom:12px;left:12px;right:12px;z-index:10;background:#423222;padding:16px;border-radius:8px;font-size:13px}@media(min-width:640px){.library{padding-top:64px}.chapter-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}h1{font-size:52px}}@media(min-width:900px){.chapter-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

.image-page{position:relative;width:100%;background:#252525;overflow:hidden}.image-page img{display:block;width:100%;height:100%;object-fit:contain}.image-page.loading{background:linear-gradient(110deg,#202020 25%,#303030 45%,#202020 65%);background-size:200% 100%;animation:skeleton 1.8s ease-in-out infinite}.image-page.failed{display:flex;align-items:center;justify-content:center}.image-page button{max-width:90%}#single-frame .image-page{max-height:calc(100dvh - 210px);min-height:180px}#single-image{max-height:none;min-height:0;height:100%}.chapter-panel{display:block;max-width:720px;margin:auto;padding:28px 16px;text-align:center;background:#1c1e25;color:var(--accent);border-block:1px solid #30333c}@keyframes skeleton{to{background-position:-200% 0}}@media(prefers-reduced-motion:reduce){.image-page.loading{animation:none}}

/* Keep the preview underneath until the original's opacity transition finishes. */
#pages .image-page img,#single-frame .image-page img{position:absolute;inset:0;width:100%;height:100%;background:transparent;object-fit:contain}
.image-page .page-thumbnail{filter:blur(12px);transform:scale(1.03);pointer-events:none}
.image-page .page-image{z-index:1;opacity:0;transition:opacity .35s ease}
.image-page.loaded .page-image{opacity:1}
.image-page button{position:relative;z-index:2;background:#20232ceF}

/* In normal flow: never cover a page, even with Safari text enlargement. */
.network-tools{position:static;display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;width:100%;max-width:720px;margin:0 auto;background:#101116f2;border-bottom:1px solid #383c49;padding:8px max(12px,env(safe-area-inset-right)) 8px max(12px,env(safe-area-inset-left));padding-bottom:calc(76px + env(safe-area-inset-bottom));font-size:12px;overflow-wrap:anywhere}
.network-tools label{display:flex;flex-wrap:wrap;align-items:center;gap:8px;min-width:0;max-width:100%}
.network-tools select{font-size:12px;min-height:44px;min-width:0;max-width:100%;padding:6px 10px}
.network-tools span{min-width:0;max-width:100%;color:var(--muted)}
.manifest-status{max-width:720px;margin:0 auto;padding:12px max(16px,env(safe-area-inset-right)) 12px max(16px,env(safe-area-inset-left));background:#28241c;font-size:13px;overflow-wrap:anywhere}
.manifest-status p{margin:0 0 8px}