:root{color-scheme:light;--paper:#f5f1e8;--ink:#302f29;--muted:#77756b;--rule:#ded8cc;--accent:#8c4936;--panel:#fcf9f2;--size:21px;--leading:1.9;font-family:"PingFang SC","Microsoft YaHei",sans-serif;background:var(--paper);color:var(--ink)}
*{box-sizing:border-box}body{margin:0}:root[data-theme=light]{--paper:#fff;--ink:#292929;--panel:#fafafa;--rule:#dedede;--muted:#686868}:root[data-theme=dark]{color-scheme:dark;--paper:#000;--panel:#000;--ink:#bdbdbd;--muted:#999;--rule:#303030;--accent:#c99b85}
button,input{font:inherit}button{color:inherit;background:none;border:0;cursor:pointer;min-width:44px;min-height:44px;padding:8px 12px;border-radius:5px}button:hover{background:var(--rule)}button:disabled{opacity:.3;cursor:default}button:focus-visible,a:focus-visible,label.import-label:focus-within,input:focus-visible{outline:2px solid var(--accent);outline-offset:4px}button[aria-pressed=true]{outline:1px solid var(--accent);background:var(--paper)}[hidden]{display:none!important}
.bar{height:76px;display:flex;align-items:center;gap:24px;max-width:1280px;margin:auto;padding:0 44px;border-bottom:1px solid var(--rule)}.wordmark{font-family:"Songti SC","Noto Serif CJK SC",serif;font-size:24px;letter-spacing:3px;padding-left:0;display:flex;align-items:center;gap:12px;white-space:nowrap}.seal{background:var(--accent);color:var(--paper);font-size:12px;letter-spacing:0;padding:2px 4px;line-height:20px}.book-label{font-size:13px;letter-spacing:1px;color:var(--muted);flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}#settings-button{font-size:20px;font-family:serif}
.welcome{max-width:1060px;min-height:calc(100svh - 76px);position:relative;margin:auto;padding:70px 36px 30px}.eyebrow{font-size:11px;letter-spacing:3px;color:var(--accent);margin:26px 0}.welcome h1{font-family:"Songti SC","Noto Serif CJK SC",serif;font-size:clamp(38px,5vw,60px);font-weight:400;letter-spacing:4px;line-height:1.55;margin:0 0 22px}.intro{font-size:16px;line-height:1.9;color:var(--muted);margin-bottom:34px}.primary{background:var(--ink);color:var(--paper);padding:14px 25px;min-height:50px;border-radius:3px;display:inline-flex;gap:48px;align-items:center;justify-content:center;font-size:16px;cursor:pointer}.primary:hover{background:var(--accent)}.file-input{width:1px;height:1px;position:absolute;overflow:hidden;clip-path:inset(50%)}.file-note{font-size:12px;color:var(--muted);margin-top:16px}.text-button{font-size:14px;color:var(--accent);padding-left:0;margin-top:12px}.welcome-foot{border-top:1px solid var(--rule);margin-top:58px;padding-top:20px;font-size:12px;color:var(--muted);display:flex;justify-content:space-between;gap:20px}
.reading{max-width:760px;margin:auto;padding:54px 28px 100px}.chapter-meta{font-size:13px;color:var(--muted);display:flex;justify-content:space-between;gap:20px;letter-spacing:1px}.reading h1{font-family:"Songti SC","Noto Serif CJK SC",serif;font-size:30px;line-height:1.6;font-weight:500;margin:20px 0 38px;overflow-wrap:anywhere}.reading h1:focus{outline:none}#prose{font-family:"Noto Serif CJK SC","Songti SC","SimSun",serif;font-size:var(--size);line-height:var(--leading);overflow-wrap:anywhere}#prose p{margin:0 0 1.15em;text-indent:2em;white-space:pre-wrap}.chapter-end{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--rule);margin-top:44px;padding:20px 0;color:var(--accent)}.reader-nav{position:fixed;bottom:0;left:50%;transform:translateX(-50%);display:flex;align-items:center;justify-content:space-between;gap:12px;width:min(760px,100%);padding:8px 20px calc(8px + env(safe-area-inset-bottom));border:1px solid var(--rule);border-bottom:none;background:var(--panel);z-index:5}#progress{font-size:13px;color:var(--muted);font-variant-numeric:tabular-nums;flex:1;text-align:right}
dialog{border:1px solid var(--rule);background:var(--panel);color:var(--ink);border-radius:12px;padding:24px;width:min(480px,calc(100% - 28px));max-height:82svh;box-shadow:0 15px 80px #0002}dialog::backdrop{background:#15181266;backdrop-filter:blur(3px)}.dialog-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;gap:15px}.dialog-head h2{font-family:serif;font-size:24px;font-weight:500;margin:0}.dialog-head button{font-size:24px}input[type=search]{width:100%;background:var(--paper);color:var(--ink);border:1px solid var(--rule);border-radius:5px;padding:12px;font-size:16px}.toc-row{display:block;text-align:left;width:100%;border-bottom:1px solid var(--rule);border-radius:0;padding:14px 10px;font-size:15px}.toc-row small{display:block;font-size:12px;color:var(--muted);margin-bottom:5px}.toc-row[aria-current=true]{color:var(--accent);border-left:2px solid var(--accent);background:var(--paper)}.setting{display:grid;grid-template-columns:1fr auto;gap:16px;margin:24px 0}.setting input{grid-column:1/-1;width:100%;accent-color:var(--accent)}fieldset{border:0;padding:0;margin:28px 0}.themes{display:flex;gap:10px;margin-top:12px}.themes button{flex:1;border:1px solid var(--rule)}.small{font-size:14px;line-height:1.8;color:var(--muted)}#library-title{font-size:22px;line-height:1.7}#replace{width:100%;margin:15px 0}.import-label{position:relative}#notice{position:fixed;bottom:95px;left:50%;transform:translateX(-50%);max-width:calc(100% - 32px);width:max-content;background:var(--ink);color:var(--paper);border-radius:6px;padding:12px 18px;font-size:14px;z-index:10;display:none}#notice.visible{display:block}
@media(max-width:700px){.bar{height:64px;padding:0 20px;gap:16px}.wordmark{font-size:22px}.book-label{font-size:12px}.welcome{padding:35px 26px 26px;min-height:calc(100svh - 64px)}.eyebrow{font-size:10px;letter-spacing:1.5px;margin-top:26px}.welcome h1{font-size:38px;line-height:1.5}.welcome-foot{margin-top:40px;flex-direction:column;gap:8px}.reading{padding:32px 22px 90px}.reading h1{font-size:27px;margin-bottom:30px}.chapter-meta{font-size:12px}.reader-nav{padding-left:12px;padding-right:12px}dialog{padding:20px}#toc-dialog{height:80svh}.primary{width:100%}}
@media(prefers-reduced-motion:no-preference){.welcome{animation:arrive .45s ease-out}@keyframes arrive{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}}

.toc-volume{border-bottom:1px solid var(--rule)}.toc-volume summary{padding:16px 8px;min-height:48px;cursor:pointer;font-family:"Songti SC",serif;font-size:17px;line-height:1.6;overflow-wrap:anywhere}.toc-volume summary:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}.toc-volume[open] summary{color:var(--accent)}.toc-volume .toc-row{padding-left:20px}.file-note{font-size:14px;line-height:1.8}

/* Safe areas and flexible layout for Android phones and unfolded screens. */
.bar{padding-left:max(20px,env(safe-area-inset-left));padding-right:max(20px,env(safe-area-inset-right));padding-top:env(safe-area-inset-top);height:calc(64px + env(safe-area-inset-top))}
.reading{width:100%;padding-left:max(22px,env(safe-area-inset-left));padding-right:max(22px,env(safe-area-inset-right))}
.chapter-meta>span:first-child{min-width:0;overflow-wrap:anywhere}.chapter-meta>span:last-child{flex-shrink:0}
.reader-nav{padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right))}
dialog{max-height:calc(100dvh - 28px - env(safe-area-inset-top) - env(safe-area-inset-bottom));overflow-y:auto}
#toc-dialog{height:min(80dvh,760px)}
@media(min-width:701px){.reading{max-width:800px;padding-left:40px;padding-right:40px}.reader-nav{width:min(800px,100%)}.welcome{max-width:1060px}.bar{padding-left:36px;padding-right:36px}}
@media(orientation:landscape) and (max-height:540px){
 .welcome{padding-top:20px;min-height:calc(100dvh - 64px)}.eyebrow{margin-top:12px}.welcome h1{font-size:32px;line-height:1.3}.intro{margin-bottom:16px}.welcome-foot{margin-top:22px}.reading{padding-top:20px}.reading h1{margin:12px 0 22px;font-size:25px}dialog,#toc-dialog{height:auto;max-height:calc(100dvh - 20px)}
}
@media(horizontal-viewport-segments:2){
 .reading,.reader-nav{width:env(viewport-segment-width 0 0);max-width:800px;margin-left:max(0px,calc((env(viewport-segment-width 0 0) - 800px)/2));margin-right:0}
 .reader-nav{left:0;transform:none}
}

/* Desktop book spreads: a continuous pair of columns clipped to two pages. */
body.spread-view{overflow:hidden}
.spread-view .reading{max-width:1320px;padding:22px 44px 0}
.spread-view .reading h1{font-size:26px;margin:12px 0 20px}
.spread-view #page-window{position:relative;overflow:hidden;isolation:isolate}
.spread-view #page-window::after{content:"";position:absolute;left:50%;top:0;bottom:0;width:1px;background:var(--rule);pointer-events:none}
.spread-view #prose{height:100%;column-count:2;column-gap:64px;column-fill:auto;overflow:visible;will-change:transform}
.spread-view #prose p{orphans:2;widows:2}
.spread-view .chapter-end{display:none}
.spread-view #spread-status{text-align:center;margin:8px 0;font-size:13px;font-variant-numeric:tabular-nums}
.spread-view .reader-nav{width:min(1320px,100%)}

/* Keep dismissal controls visible while only the chapter list scrolls. */
#toc-dialog[open]{display:flex;flex-direction:column;overflow:hidden}
#toc-dialog>.dialog-head,#toc-dialog>input,#toc-dialog>p{flex-shrink:0}
#toc-list{min-height:0;overflow-y:auto;overscroll-behavior:contain}
.reader-nav>button{flex-shrink:0}
#toc-button{white-space:nowrap}
#current-chapter{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px;line-height:1.4}
#current-volume,#current-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#current-volume{font-size:11px;color:var(--muted)}
#current-title{font-size:13px}
#progress{flex:0 0 auto}
@media(max-width:480px){.reader-nav{gap:4px}#toc-button{padding-left:6px;padding-right:6px}#progress{font-size:11px}}
