:root{--bg:#f3efe5;--surface:#faf8f1;--ink:#283229;--muted:#505c4e;--line:#d8d8c9;--accent:#345f43;--accent-soft:#e1ead9;--shadow:0 24px 70px #31403412;--font-size:20px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-family:Georgia,"Noto Serif SC","Songti SC",serif}button,input{font:inherit}button{cursor:pointer}.topbar{height:70px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 32px;background:var(--surface);position:sticky;top:0;z-index:10}.brand{display:flex;align-items:center;gap:10px;color:var(--ink);text-decoration:none}.brand-mark{display:grid;place-items:center;width:34px;height:34px;background:var(--accent);color:#fff;font:700 22px Georgia;font-style:italic}.brand strong{display:block;font:700 16px/1 Arial,sans-serif;letter-spacing:.16em}.brand small{display:block;margin-top:5px;color:var(--muted);font:10px/1 Arial,sans-serif;letter-spacing:.19em}.topbar-actions{display:flex;gap:8px}.icon-button,.round-button{border:1px solid var(--line);background:transparent;color:var(--ink);min-height:34px;padding:6px 11px}.icon-button:hover,.round-button:hover{background:var(--accent-soft)}.app-shell{display:grid;grid-template-columns:310px minmax(0,1fr);min-height:calc(100vh - 70px)}.library{border-right:1px solid var(--line);padding:42px 24px 30px;position:sticky;top:70px;height:calc(100vh - 70px);overflow:auto;background:#f0ecdf}.eyebrow{color:var(--accent);font:700 10px/1.2 Arial,sans-serif;letter-spacing:.18em;margin:0 0 12px}.library h1{font:600 28px/1.2 Georgia;margin:0 0 12px}.library-heading>p:last-child{font-size:14px;line-height:1.7;color:var(--muted);margin:0 0 28px}.search-label{display:block;font:700 10px Arial,sans-serif;letter-spacing:.12em;color:var(--muted);margin-bottom:8px}.library input{width:100%;padding:11px 12px;border:1px solid var(--line);background:var(--surface);color:var(--ink);outline:none}.library input:focus{border-color:var(--accent);box-shadow:0 0 0 3px #3d714f20}.book-list{display:grid;gap:7px;margin-top:20px}.book-card{border:1px solid transparent;padding:13px 12px;background:transparent;text-align:left;color:var(--ink);display:block;width:100%;transition:.2s}.book-card:hover{background:var(--surface);border-color:var(--line)}.book-card.active{background:var(--surface);border-color:var(--accent);box-shadow:var(--shadow)}.book-card-top{display:flex;align-items:center;justify-content:space-between;gap:8px;color:var(--muted);font:10px Arial,sans-serif;letter-spacing:.1em}.book-card h2{font:600 16px/1.35 Georgia;margin:7px 0 4px}.book-card p{font-size:11px;color:var(--muted);margin:0;line-height:1.45}.book-status{font-size:10px;color:var(--accent);margin-top:7px}.book-status.pending{color:#8b6a35}.library-note{border-top:1px solid var(--line);display:flex;gap:9px;margin-top:28px;padding-top:18px;color:var(--muted);font-size:11px;line-height:1.6}.note-dot{display:block;flex:none;width:7px;height:7px;border-radius:50%;background:var(--accent);margin-top:6px}.library-note p{margin:0}.reader{min-width:0}.reader-hero{max-width:920px;margin:0 auto;padding:76px 42px 42px;display:flex;justify-content:space-between;gap:24px;border-bottom:1px solid var(--line)}.reader-hero h2{font:600 clamp(34px,5vw,66px)/1.08 Georgia;margin:0;letter-spacing:-.04em;max-width:760px}.book-meta{color:var(--muted);font-size:15px;line-height:1.7;margin:16px 0 0}.hero-index{align-self:flex-end;color:var(--accent);white-space:nowrap;font:600 27px Georgia}.hero-index small{color:var(--muted);font-size:12px}.reader-toolbar{max-width:920px;margin:0 auto;padding:19px 42px;display:flex;align-items:center;gap:20px;flex-wrap:wrap;border-bottom:1px solid var(--line)}.toolbar-group{display:flex;align-items:center;gap:8px}.toolbar-label{font:700 10px Arial,sans-serif;letter-spacing:.12em;color:var(--muted)}.segmented{display:flex;border:1px solid var(--line);background:var(--surface)}.segmented button{border:0;background:transparent;color:var(--muted);padding:7px 11px;font:12px Arial,sans-serif}.segmented button[aria-pressed=true]{background:var(--accent);color:white}.font-controls{margin-left:auto}.font-controls span{min-width:24px;text-align:center;font:12px Arial,sans-serif;color:var(--muted)}.round-button{padding:2px 9px;min-height:28px}.progress-row{max-width:920px;margin:0 auto;padding:15px 42px 0;display:flex;align-items:center;gap:11px}.progress-track{height:3px;background:var(--line);flex:1}.progress-track span{height:100%;display:block;width:0;background:var(--accent);transition:width .2s}.progress-row>span{color:var(--muted);font:10px Arial,sans-serif;min-width:30px;text-align:right}.translation-notice{max-width:920px;margin:22px auto 0;padding:12px 16px;background:#efe8d4;border-left:3px solid #b7893e;color:#725d38;font-size:13px;line-height:1.6}.reading-content{max-width:920px;margin:0 auto;padding:40px 42px 80px;font-size:var(--font-size);line-height:1.95}.reading-block{margin:0 0 28px;scroll-margin-top:100px}.reading-block.is-heading{font-weight:600;color:var(--accent);font-size:1.18em;margin-top:48px;margin-bottom:20px;line-height:1.5}.reading-block p{margin:0;overflow-wrap:anywhere;word-break:break-word}.reading-block .translation{font-family:"Noto Serif SC","Songti SC",serif;font-size:.68em;line-height:1.7;color:var(--muted);border-left:2px solid var(--accent-soft);padding:6px 0 6px 16px;margin-top:9px;overflow-wrap:anywhere;word-break:break-word}.reading-block .translation[hidden]{display:none}.reading-block.no-translation{opacity:.94}.reader-footer{max-width:920px;border-top:1px solid var(--line);margin:0 auto;padding:18px 42px 40px;display:flex;justify-content:space-between;gap:12px;color:var(--muted);font:10px Arial,sans-serif;letter-spacing:.04em}@media(max-width:900px){.app-shell{grid-template-columns:1fr}.library{position:relative;top:0;height:auto;border-right:0;border-bottom:1px solid var(--line);padding:24px 20px}.book-list{grid-template-columns:repeat(2,minmax(0,1fr))}.library-note{display:none}.reader-hero{padding:45px 24px 30px}.reader-toolbar,.progress-row,.reading-content,.reader-footer{padding-left:24px;padding-right:24px}.reader-toolbar{gap:12px}.font-controls{margin-left:0}}@media(max-width:560px){.topbar{height:62px;padding:0 16px}.brand strong{font-size:13px}.brand small{font-size:8px}.icon-button span{display:none}.book-list{grid-template-columns:1fr}.reader-hero{padding:34px 18px 25px}.reader-hero h2{font-size:36px}.hero-index{font-size:20px}.reader-toolbar{padding:14px 18px}.reader-toolbar .toolbar-group{width:100%;justify-content:space-between}.font-controls{justify-content:flex-start!important}.progress-row,.reading-content,.reader-footer{padding-left:18px;padding-right:18px}.reading-content{padding-top:30px;font-size:var(--font-size);line-height:1.85}.reader-footer{flex-direction:column}.translation-notice{margin-left:18px;margin-right:18px}}
body.theme-dark{--bg:#222823;--surface:#293129;--ink:#dbe1d3;--muted:#aebaa6;--line:#465143;--accent:#b1d49f;--accent-soft:#3a4b38}body.theme-dark .topbar,body.theme-dark .library{background:var(--surface)}body.theme-dark .library{background:#252e27}body.theme-dark .translation-notice{background:#3b3525;color:#ddc98e}body.focus-mode .topbar{display:none}body.focus-mode .app-shell{display:block}body.focus-mode .library{display:none}body.focus-mode .reader-toolbar{position:sticky;top:0;background:var(--bg);z-index:5}
body.theme-dark .segmented button[aria-pressed=true]{color:#222823}
body.theme-dark .brand-mark{color:#222823}
body.theme-dark .book-status.pending{color:#d6bd87}
.book-status.pending{color:#70501f}
a:focus-visible,button:focus-visible,input:focus-visible,.translation:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
.reading-block .translation{font-family:"Noto Serif SC","Songti SC",serif;font-size:.68em;line-height:1.7;color:var(--muted);cursor:help;vertical-align:baseline;filter:blur(7px);transition:none;user-select:none}.reading-block .translation.short{display:inline-block;margin-left:.45em}.reading-block .translation.long{display:block;border-left:2px solid var(--accent-soft);padding:5px 0 5px 16px;margin-top:8px}.reading-block .translation:hover,.reading-block .translation:focus-visible,.reading-block .translation.is-revealed{filter:none;outline:none}.reading-block .translation[hidden]{display:none}
@media(max-width:600px){.reading-block .translation{cursor:pointer}.reading-block .translation:hover{filter:blur(7px)}.reading-block .translation:focus-visible,.reading-block .translation.is-revealed{filter:none}}
.library-filters{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:14px}.library-filters label{font:700 9px Arial,sans-serif;letter-spacing:.1em;color:var(--muted)}.library-filters select{width:100%;padding:8px 7px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font:12px Arial,sans-serif}.book-count{margin:12px 0 0;color:var(--muted);font:10px Arial,sans-serif}.book-route{margin:10px 0 0;color:var(--accent);font:12px Arial,sans-serif;letter-spacing:.03em}
.reading-time{margin:6px 0 0;color:var(--accent);font:10px/1.5 Arial,sans-serif}
.library-resources{display:block;margin-top:14px;color:var(--accent);font:12px/1.8 Arial,sans-serif;text-underline-offset:3px}.library-resources:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
.study-guide{margin-top:18px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:12px 0;color:var(--muted);font:11px/1.6 Arial,sans-serif}.study-guide summary{cursor:pointer;color:var(--accent);font-weight:700}.study-guide ol{margin:8px 0 0;padding-left:20px}.study-guide li{margin:2px 0}
.book-sources{max-width:920px;margin:16px auto 0;padding:0 42px;display:flex;flex-wrap:wrap;gap:12px;font:12px/1.6 Arial,sans-serif}.book-sources a{color:var(--accent);text-underline-offset:3px}.book-card p,.book-meta,.book-route{overflow-wrap:anywhere}.book-count{line-height:1.6}.book-status{display:block;line-height:1.6}@media(max-width:900px){.book-sources{padding:0 24px}}@media(max-width:560px){.book-sources{padding:0 18px}.reader-hero h2{font-size:30px;overflow-wrap:anywhere}}
.speech-panel{flex:1 1 100%;border-top:1px solid var(--line);padding-top:14px;display:grid;gap:8px}.speech-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.speech-button{border:1px solid var(--line);background:var(--surface);color:var(--ink);padding:7px 10px;font:12px Arial,sans-serif}.speech-button:hover:not(:disabled){background:var(--accent-soft)}.speech-button:disabled{cursor:not-allowed;opacity:.45}.speech-check{display:flex;align-items:center;gap:5px;color:var(--muted);font:12px Arial,sans-serif}.speech-options label{color:var(--muted);font:11px Arial,sans-serif}.speech-options select{border:1px solid var(--line);background:var(--surface);color:var(--ink);padding:6px 8px;font:12px Arial,sans-serif;max-width:230px}.speech-status{margin:0;color:var(--muted);font:11px/1.5 Arial,sans-serif}.reading-block.is-current{border-left:3px solid var(--accent);padding-left:15px;margin-left:-18px;background:linear-gradient(90deg,var(--accent-soft),transparent 35%)}
@media(max-width:900px){.reading-block.is-current{margin-left:-3px;padding-left:12px}.speech-panel{flex-basis:100%}}
.reader-toolbar{position:sticky;top:70px;background:var(--bg);z-index:6}@media(max-width:560px){.reader-toolbar{top:62px}}body.focus-mode .reader-toolbar{top:0}
.speech-button.speech-primary{border-color:var(--accent);background:var(--accent);color:var(--speech-button-ink,#fff)}.speech-button.speech-primary:hover:not(:disabled){filter:brightness(.94)}.speech-options{align-items:center}.speech-options select{min-width:118px}.speech-options input[type=range]{width:min(230px,32vw);accent-color:var(--accent);cursor:pointer}.speech-options input[type=number]{width:64px;padding:6px 7px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font:12px Arial,sans-serif}.speech-options output{min-width:42px;color:var(--accent);font:700 12px/1 Arial,sans-serif}.speech-options datalist{display:none}.speech-target,.speech-voice-info{color:var(--muted);font:11px/1.5 Arial,sans-serif}.speech-range{display:flex;align-items:center;gap:6px;color:var(--muted);font:11px Arial,sans-serif}.reading-block{cursor:pointer;border-radius:2px}.reading-block:focus-visible{outline:3px solid var(--accent);outline-offset:5px}.reading-block.is-selected{box-shadow:inset 3px 0 0 var(--accent),0 0 0 1px var(--accent-soft);padding-left:15px;background:linear-gradient(90deg,var(--accent-soft),transparent 42%)}.reading-block.is-current.is-selected{box-shadow:inset 3px 0 0 var(--accent),0 0 0 1px var(--accent)}
@media(max-width:900px){.speech-options input[type=range]{width:min(220px,42vw)}.reading-block.is-selected{padding-left:12px}}
@media(max-width:560px){.speech-options input[type=range]{width:calc(100% - 96px)}.speech-options output{margin-left:auto}.speech-button{min-height:34px}.speech-range{width:100%;justify-content:flex-start}.reading-block.is-selected{padding-left:12px}}
body.theme-dark{--speech-button-ink:#1f2a22}

/* Compact read-aloud disclosure: the reader keeps its full width for text until the user opens it. */
.speech-panel{position:relative;flex:0 0 auto;align-self:center;min-width:0;border-top:0;padding-top:0;display:block}
.speech-toggle{display:inline-flex;align-items:center;gap:8px;min-height:38px;padding:8px 15px;border:1px solid var(--line);border-radius:999px;background:var(--surface);color:var(--ink);font:700 12px/1 Arial,sans-serif;letter-spacing:.04em;box-shadow:0 4px 14px #3140340c}
.speech-toggle:hover,.speech-toggle:focus-visible{background:var(--accent-soft)}
.speech-toggle span[aria-hidden=true]{display:grid;place-items:center;width:16px;height:16px;border-radius:50%;background:var(--accent);color:var(--speech-button-ink,#fff);font-size:12px;line-height:1;transform:rotate(90deg);transition:transform .18s ease}
.speech-toggle.is-open span[aria-hidden=true]{transform:rotate(-90deg)}
.speech-toggle.is-speaking{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.speech-menu{position:absolute;right:0;top:calc(100% + 12px);z-index:30;width:min(760px,calc(100vw - 36px));max-height:calc(100vh - 150px);overflow:auto;padding:16px;border:1px solid var(--line);border-radius:12px;background:var(--surface);box-shadow:0 20px 52px #1f2c231f;display:grid;gap:12px}
.speech-menu[hidden]{display:none}
.speech-menu::before{content:"";position:absolute;right:28px;top:-7px;width:12px;height:12px;background:var(--surface);border-left:1px solid var(--line);border-top:1px solid var(--line);transform:rotate(45deg)}
.speech-menu-header{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding-bottom:10px;border-bottom:1px solid var(--line)}
.speech-menu-header strong{color:var(--ink);font:700 13px/1.2 Arial,sans-serif}
.speech-menu-header span{color:var(--muted);font:11px/1.4 Arial,sans-serif}
.speech-menu .speech-row{min-width:0}
.speech-menu .speech-main-controls{padding-bottom:2px}
.speech-menu .speech-status{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
@media(max-width:900px){.speech-menu{width:min(700px,calc(100vw - 32px))}}
@media(max-width:560px){.speech-panel{width:100%}.speech-toggle{width:100%;justify-content:center}.speech-menu{position:fixed;left:16px;right:16px;top:calc(62px + 10px);width:auto;max-height:calc(100vh - 90px);padding:14px}.speech-menu::before{right:calc(50% - 6px)}.speech-menu-header{align-items:flex-start;flex-direction:column;gap:3px}.speech-menu .speech-main-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.speech-menu .speech-main-controls .speech-primary{grid-column:span 2}.speech-menu .speech-main-controls .speech-check{grid-column:span 1}.speech-menu .speech-options{align-items:flex-start}.speech-menu .speech-options select{max-width:calc(100vw - 150px)}body.focus-mode .speech-menu{top:10px}}