/* style.css */
:root{--ink:#2c4337;--muted:#89917e;--border:#dce0d3;--caption-bg:hsla(152,25%,18%,.8);--caption-ink:#fff;--font-scale:1;--line-height:1.9}*{box-sizing:border-box}body{margin:0;background:#f6f6ef;color:var(--ink);font-family:Arial,'Noto Sans TC',sans-serif}button,input,select{font:inherit}button{border:1px solid var(--border);border-radius:6px;background:transparent;color:inherit;padding:9px 13px;cursor:pointer}button:hover{background:#e7ebdf}button:focus-visible,input:focus-visible,select:focus-visible,[tabindex]:focus-visible{outline:2px solid #8f7850;outline-offset:3px}[hidden]{display:none!important}.reader-layout{display:grid;grid-template-columns:190px minmax(0,1fr);gap:24px;padding:18px 24px 12px;height:100vh;min-height:500px}.catalog{border-right:1px solid var(--border);padding-right:18px;display:flex;flex-direction:column;min-height:0}.catalog-book{padding:11px 0 23px;border-bottom:1px solid var(--border);margin-bottom:12px}.catalog-book button{border:0;padding:0;text-align:left;width:100%;background:transparent}.catalog h1{font:500 23px/1.65 'Songti TC',serif;letter-spacing:2px;margin:0;overflow-wrap:anywhere}.catalog p{font-size:11px;color:var(--muted);margin:10px 0 0;line-height:1.6}#chapters{overflow:auto;scrollbar-width:thin;flex:1}.chapter-item{display:flex;gap:9px;align-items:baseline;width:100%;border:0;border-left:2px solid transparent;text-align:left;padding:13px 9px;border-radius:0;margin:2px 0;font-size:12px;line-height:1.7}.chapter-item span{font:10px Georgia;color:#a0a68e;flex-shrink:0}.chapter-item.active{border-left-color:#526c4a;background:#e9eddf;color:#334e36}.workspace{min-width:0;display:flex;flex-direction:column;min-height:0}.toolbar{display:flex;align-items:center;gap:12px;margin:0 0 12px;font-size:11px;flex-shrink:0;min-height:36px}.toolbar button{font-size:11px;padding:8px 12px}.toolbar-right{margin-left:auto;display:flex;gap:9px}.ratio{display:flex;background:#e9eddf;border-radius:6px;padding:3px}.ratio button{border:0;padding:6px 13px}.ratio .active{background:#fff;box-shadow:0 1px 4px #1d351d10}.stage-wrap{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;border:1px solid #dde1d4;background:#e6e9de;border-radius:9px;padding:18px;overflow:hidden}.stage{position:relative;display:flex;flex-direction:column;color:#625137;border:1px solid #cbbb98;box-shadow:0 8px 22px #293b2320;container-type:inline-size;overflow:hidden;flex-shrink:0}.stage.wide{aspect-ratio:16/9}.stage.tall{aspect-ratio:9/16}.book{background:#ede2c9;background-image:radial-gradient(ellipse at 50% 30%,#fff9e688,transparent 75%),repeating-linear-gradient(1deg,#805e1b05 0 1px,transparent 1px 4px)}.scroll{background:linear-gradient(90deg,#ac854f,#ead5ae 3%,#f4e2bd 50%,#ead5ae 97%,#ac854f)}.lace{background:#f5efe2}.stage:before{content:'';position:absolute;inset:10px;border:1px solid #9d805a55;pointer-events:none;z-index:2}.stage.scroll:before{inset:10px 15px;border:0;border-top:5px solid #9d784a;border-bottom:5px solid #9d784a}.stage.lace:before{border:4px double #a9936b;border-radius:18px}.page-top{display:flex;justify-content:space-between;gap:16px;font:1.35cqw/1.6 'Songti TC',serif;color:#927d5c;letter-spacing:1px;margin:3% 5.5% 0;flex-shrink:0}.page-top span{max-width:49%;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.reading{position:relative;flex:1;min-height:0;margin:1% 7% 2.5%;overflow:auto;scrollbar-width:none;overscroll-behavior:contain;mask-image:linear-gradient(transparent,#000 5%,#000 94%,transparent);font-family:'Songti TC','Noto Serif TC','SimSun',serif;font-size:calc(2.55cqw * var(--font-scale));line-height:var(--line-height)}.reading::-webkit-scrollbar{display:none}#textRows{position:relative;min-height:100%}.text-row{display:block;white-space:pre;line-height:var(--line-height);padding:0 8px;margin:0;border-radius:3px;opacity:.75;cursor:pointer;color:#64563e;min-height:1em;transition:color .12s,background .12s;outline-offset:-2px!important}.text-row.active{opacity:1;color:#82581f;background:#b08b4f21}.text-row:hover{opacity:1}.stage.tall .page-top{font-size:2.6cqw;margin:8% 8% 0;gap:10px}.stage.tall .reading{font-size:calc(4.7cqw * var(--font-scale));margin:3% 10% 6%}.subtitle{position:absolute;top:86%;left:50%;transform:translate(-50%,-50%);width:max-content;max-width:90%;padding:.55em 1.2em;border-radius:7px;background:var(--caption-bg);color:var(--caption-ink);font:1.8cqw/1.6 'Songti TC',serif;text-align:center;z-index:4;cursor:ns-resize;touch-action:none;user-select:none;box-shadow:0 3px 12px #201d1115}.subtitle.dragging{box-shadow:0 0 0 2px #b29663}.drag-hint{position:absolute;right:4px;top:50%;transform:translateY(-50%);font:11px Arial;opacity:0}.subtitle:hover .drag-hint,.subtitle:focus .drag-hint{opacity:.8}.stage.tall .subtitle{font-size:3.8cqw;max-width:90%;padding:.5em 1em}.player{flex-shrink:0;padding-top:15px}input[type=range]{accent-color:#496643;cursor:pointer}#seek{width:100%;height:3px;display:block;margin:0}.player-row{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:10px;font-size:10px}.transport{display:flex;align-items:center;gap:12px}.transport button,.player-options button{border:0;font-size:11px}.transport .play{width:43px;height:43px;border-radius:50%;background:#35543e;color:#fff;font-size:14px}.player-options{display:flex;gap:4px;align-items:center}.player-options select{border:0;background:transparent;color:#69805f;padding:5px;font-size:11px}#status{font-size:9px;color:#8c967f;margin:6px 0 0;text-align:right;min-height:12px}.screen-controls{display:none;position:absolute;bottom:2%;left:50%;transform:translateX(-50%);gap:5px;background:#fbf5e9e8;border-radius:30px;padding:4px;z-index:5;opacity:0;transition:opacity .2s}.screen-controls button{border:0;font-size:13px;padding:5px 12px}#exit{display:none;position:absolute;right:15px;top:12px;z-index:5;background:#f9f1e5dd;padding:6px 11px;opacity:0}.stage:fullscreen{margin:auto}.stage:fullscreen::backdrop{background:#19221b}.stage:fullscreen .screen-controls,.stage:fullscreen #exit,.presentation .screen-controls,.presentation #exit{display:flex}.stage:fullscreen:hover .screen-controls,.stage:fullscreen:focus-within .screen-controls,.stage:fullscreen:hover #exit,.stage:fullscreen:focus-within #exit,.presentation .stage:hover .screen-controls,.presentation .stage:hover #exit{opacity:1}.presentation .stage-wrap{position:fixed;inset:0;border:0;border-radius:0;padding:0;background:#19221b;z-index:100}.presentation .stage{z-index:101}dialog{border:1px solid #d2d9c7;border-radius:12px;color:var(--ink);background:#fafaf2;padding:24px;width:min(410px,calc(100vw - 24px));max-height:88vh;overflow:auto;box-shadow:0 20px 80px #20302130}dialog::backdrop{background:transparent;backdrop-filter:none}.dialog-heading{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--border);padding-bottom:15px}.dialog-heading h2{font:22px serif;margin:0}.dialog-heading button{border:0;padding:4px}section{margin-top:23px}section h3{font-size:12px;font-weight:500;margin-bottom:14px}.templates{display:flex;gap:10px}.templates button{flex:1;font-size:11px;padding:6px;border:1px solid transparent}.templates .active{border-color:#78916c;background:#edf1e5}.swatch{display:grid;place-items:center;font:22px serif;height:52px;border:1px solid #cebd9a;margin-bottom:8px;border-radius:3px}.setting{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:12px;margin:17px 0;color:#65775c}.setting input[type=range]{width:135px;margin-left:auto}.setting output{font-size:10px;min-width:32px;text-align:right;color:#8f997f}.setting input[type=checkbox]{accent-color:#496643;width:18px;height:18px}.setting input[type=color]{width:46px;height:28px;border:1px solid var(--border);padding:2px;background:#fff}.setting input[type=number]{width:80px;border:1px solid var(--border);border-radius:4px;padding:7px;background:#fff}.hint{font-size:10px;line-height:1.9;color:#8b977d}#recenter{font-size:11px}#audio{display:none}
@media(max-width:1000px){.reader-layout{grid-template-columns:155px minmax(0,1fr);padding:12px;gap:15px}.catalog{padding-right:12px}.catalog h1{font-size:20px}.chapter-item{font-size:11px}.stage-wrap{padding:12px}.toolbar{gap:6px}.toolbar-right{gap:5px}.toolbar button{padding:8px 9px}}@media(max-width:650px){.reader-layout{grid-template-columns:112px minmax(0,1fr);gap:8px;padding:8px;min-height:480px}.catalog{padding-right:7px}.catalog-book{padding-top:4px;padding-bottom:16px}.catalog h1{font-size:18px;letter-spacing:1px}.catalog p{font-size:9px}.chapter-item{display:block;padding:10px 6px;font-size:10px}.chapter-item span{margin-right:6px}.toolbar{flex-wrap:wrap;gap:5px;margin-bottom:7px}.toolbar-right{width:100%;justify-content:flex-end}.toolbar button{font-size:10px;padding:7px 8px}.ratio button{padding:5px 11px}.stage-wrap{padding:6px}.player-row{flex-wrap:wrap;gap:5px;font-size:9px}.transport{gap:0}.transport button{font-size:9px;padding:7px}.transport .play{width:35px;height:35px}.player-options{margin-left:auto}.player-options select{font-size:10px}.player-options button{padding:5px}.player-row>span{min-width:70px}.screen-controls,#exit{opacity:1!important}.stage.tall .reading{font-size:calc(5.2cqw * var(--font-scale));margin-left:8%;margin-right:8%}#status{font-size:8px;line-height:1.5}}

#catalogToggle{display:none}@media(max-width:650px){.reader-layout{grid-template-columns:minmax(0,1fr)}.catalog{display:none}.catalog-open .catalog{display:flex;position:absolute;left:8px;top:55px;bottom:115px;width:185px;background:#f7f8ef;box-shadow:6px 8px 24px #293c2525;z-index:20;padding:18px;border:1px solid #d3dcc5;border-radius:8px}#catalogToggle{display:block}.toolbar-right{width:auto}.toolbar{flex-wrap:wrap}.stage.tall .reading{font-size:calc(5cqw * var(--font-scale))}}

.stage{isolation:isolate;background:transparent}.stage::after{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none}.stage.book::after{background:#ede2c9;background-image:radial-gradient(ellipse at 50% 30%,#fff9e688,transparent 75%),repeating-linear-gradient(1deg,#805e1b05 0 1px,transparent 1px 4px);filter:saturate(var(--book-saturation,1))}.stage.scroll::after{background:linear-gradient(90deg,#ac854f,#ead5ae 3%,#f4e2bd 50%,#ead5ae 97%,#ac854f);filter:saturate(var(--scroll-saturation,1))}.stage.lace::after{background:#f5efe2;filter:saturate(var(--lace-saturation,1))}.subtitle{font-size:calc(1.8cqw * var(--caption-font-scale,1))}.stage.tall .subtitle{font-size:calc(3.8cqw * var(--caption-font-scale,1))}.text-row{height:calc(1em * var(--line-height));overflow:hidden}.text-row.heading-row{font-weight:600;text-align:center;letter-spacing:.07em;opacity:.9;color:#6f5a37}.text-row.heading-1{font-size:1.08em;height:calc(1em / 1.08 * var(--line-height));line-height:calc(var(--line-height) / 1.08)}.text-row.blank-row{cursor:default}.text-row.active{background:#b08b4f24;opacity:1}.text-row.current{color:#80551c}.setting select{background:#fffef8;border:1px solid var(--border);padding:6px;border-radius:4px;color:var(--ink)}

#settings{position:fixed;inset:auto;left:16px;top:64px;margin:0;width:min(300px,calc(100vw - 24px));max-height:calc(100dvh - 80px);padding:12px;font-size:12px;z-index:100;box-shadow:0 6px 24px #20302125}#settings .dialog-heading{padding-bottom:8px;cursor:move;touch-action:none;user-select:none}#settings h2{font-size:16px}#settings h3{font-size:13px;margin:10px 0 7px}#settings section{margin-top:10px}#settings .setting{font-size:12px;margin:8px 0;gap:6px}#settings button{font-size:11px;padding:6px 8px}#settings .hint{font-size:10px;line-height:1.5;margin:6px 0}#settings .swatch{height:30px;font-size:17px}#subtitleText{white-space:pre-line}

.volume-control{display:flex;align-items:center;gap:5px;font-size:11px}.volume-control input{width:70px}.volume-control output{min-width:32px}.player-options{flex-wrap:wrap}@media(max-width:600px){.volume-control input{width:50px}.player-row{flex-wrap:wrap;gap:8px}}

.waveform-wrap{position:absolute;left:10%;right:10%;bottom:13px;height:60px;pointer-events:none;opacity:.55;color:inherit}#waveform{width:100%;height:100%;display:block}.reading{margin-bottom:66px}

.caption-settings{margin-top:14px;border-top:1px solid var(--border);padding-top:10px}.caption-settings summary{font-size:13px;font-weight:600;cursor:pointer}
.speech-options{display:flex;gap:12px;align-items:center;flex-wrap:wrap;padding:4px 0;font-size:13px}.speech-options label{display:flex;align-items:center;gap:5px}.speech-options label[hidden]{display:none}.speech-options select{max-width:220px}

/* Common controls sit outside the page so they do not overlap headings. */
.reader-quick{display:flex;justify-content:flex-end;align-items:center;gap:7px;flex-wrap:wrap;margin:0 0 7px;font-size:11px;flex-shrink:0}
.reader-quick label{display:flex;align-items:center;gap:4px}.reader-quick button,.reader-quick select{font-size:11px;min-height:28px;padding:3px 6px;border:1px solid #ccd4c8;border-radius:4px;background:#fff;color:#263e2a;max-width:175px}.reader-quick #quickFont{width:54px}.reader-quick .is-blue,.reader-quick #quickCaptions[aria-pressed=false]{color:#1265d5;border-color:#1265d5;background:#edf4ff}.templates{flex-wrap:wrap}.templates button{min-width:68px}
.swatch.white,.stage.white::after{background:#fff;background-image:none}.stage.white{color:#000;border-color:#ddd}.stage.white .text-row,.stage.white .text-row.current,.stage.white .text-row.heading-row{color:#000;opacity:1}.stage.white .text-row.active{color:#000;background:#e8edf3}.stage.white .page-top{color:#000}.stage.white:before{border-color:#ddd}
@media(max-width:650px){.reader-quick{gap:4px}.reader-quick label{font-size:10px}.reader-quick select{max-width:135px}}

.toolbar-right.reader-quick{margin:0 0 0 auto;gap:5px;flex-wrap:wrap}.toolbar-right.reader-quick button,.toolbar-right.reader-quick select{min-height:29px;padding:4px 7px}.view-mode .reader-layout{grid-template-columns:minmax(0,1fr);height:100dvh;min-height:0;padding:6px;gap:0}.view-mode .catalog{display:none}.view-mode .stage-wrap{padding:0;border-radius:0}.view-mode .toolbar{margin-bottom:5px}.view-mode .stage{aspect-ratio:auto}.view-mode .workspace{min-height:0}

/* A single fine gold frame with ornamental corners. */
.stage{border:0}
.stage::before,.stage.scroll::before,.stage.lace::before,.stage.white::before{inset:10px;border:1px solid #d5a34d;border-radius:0;z-index:3;background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2080%2080%22%3E%3Cg%20transform%3D%22%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22%23d5a34d%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M6%2078V29Q6%206%2029%206H78M12%2078V32Q12%2012%2032%2012H78%22%2F%3E%3Cpath%20d%3D%22M6%2047C27%2041%203%2026%2015%2017C27%209%2029%2035%2017%2031C6%2026%2027%204%2035%2010C46%2020%2022%2029%2027%2015C31%203%2042%2018%2049%206M6%2061C21%2053%208%2048%2016%2040M61%206C53%2021%2048%208%2040%2016%22%2F%3E%3Cpath%20d%3D%22M14%2014Q3%201%203%2013Q1%2023%2014%2020M20%2014Q23%201%2013%203%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E"),url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2080%2080%22%3E%3Cg%20transform%3D%22translate%2880%200%29%20scale%28-1%201%29%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22%23d5a34d%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M6%2078V29Q6%206%2029%206H78M12%2078V32Q12%2012%2032%2012H78%22%2F%3E%3Cpath%20d%3D%22M6%2047C27%2041%203%2026%2015%2017C27%209%2029%2035%2017%2031C6%2026%2027%204%2035%2010C46%2020%2022%2029%2027%2015C31%203%2042%2018%2049%206M6%2061C21%2053%208%2048%2016%2040M61%206C53%2021%2048%208%2040%2016%22%2F%3E%3Cpath%20d%3D%22M14%2014Q3%201%203%2013Q1%2023%2014%2020M20%2014Q23%201%2013%203%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E"),url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2080%2080%22%3E%3Cg%20transform%3D%22translate%2880%2080%29%20scale%28-1%20-1%29%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22%23d5a34d%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M6%2078V29Q6%206%2029%206H78M12%2078V32Q12%2012%2032%2012H78%22%2F%3E%3Cpath%20d%3D%22M6%2047C27%2041%203%2026%2015%2017C27%209%2029%2035%2017%2031C6%2026%2027%204%2035%2010C46%2020%2022%2029%2027%2015C31%203%2042%2018%2049%206M6%2061C21%2053%208%2048%2016%2040M61%206C53%2021%2048%208%2040%2016%22%2F%3E%3Cpath%20d%3D%22M14%2014Q3%201%203%2013Q1%2023%2014%2020M20%2014Q23%201%2013%203%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E"),url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2080%2080%22%3E%3Cg%20transform%3D%22translate%280%2080%29%20scale%281%20-1%29%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22%23d5a34d%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M6%2078V29Q6%206%2029%206H78M12%2078V32Q12%2012%2032%2012H78%22%2F%3E%3Cpath%20d%3D%22M6%2047C27%2041%203%2026%2015%2017C27%209%2029%2035%2017%2031C6%2026%2027%204%2035%2010C46%2020%2022%2029%2027%2015C31%203%2042%2018%2049%206M6%2061C21%2053%208%2048%2016%2040M61%206C53%2021%2048%208%2040%2016%22%2F%3E%3Cpath%20d%3D%22M14%2014Q3%201%203%2013Q1%2023%2014%2020M20%2014Q23%201%2013%203%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E");background-size:58px 58px;background-repeat:no-repeat;background-position:left top,right top,right bottom,left bottom;}

.settings-save-bar{position:sticky;top:-24px;z-index:8;background:#fafaf2;padding:10px 0;border-bottom:1px solid #dce0d3}.settings-save-bar button{background:#35543e;color:#fff;font-weight:600;width:100%}.settings-save-bar button:disabled{opacity:.6;cursor:default}.settings-save-bar .hint{margin:6px 0 0}

/* Visible playback activity, including system speech. */
.waveform-wrap{z-index:3;opacity:.85;bottom:12px;height:60px}.stage.tall .waveform-wrap{height:42px;bottom:9px}
.workspace,.player,.player-row,.speech-options{min-width:0}.player{max-width:100%}.speech-options select{min-width:0;max-width:min(220px,55vw)}
@media(max-width:650px){.reader-layout{height:100dvh;min-height:0;padding:5px}.workspace{overflow:hidden}.toolbar-right.reader-quick{gap:3px}.player{padding-top:8px}.speech-options{font-size:10px;gap:4px;padding:2px 0}.speech-options label{max-width:100%;min-width:0}.speech-options select{font-size:10px;max-width:55vw}.player-row{display:grid;grid-template-columns:auto minmax(0,1fr);gap:3px;margin-top:4px}.player-row>span{min-width:0;font-size:9px}.transport{justify-content:flex-end;gap:0;min-width:0}.transport button{padding:4px;min-width:25px;font-size:13px}.transport .play{width:31px;height:31px;min-width:31px}.player-options{grid-column:1/-1;justify-content:flex-end;gap:4px;margin:0}.volume-control{font-size:10px}.volume-control input{width:50px}.volume-control output{min-width:26px}.player-options select{padding:3px}.player-options button{padding:3px}#status{margin:2px 0 0;min-height:10px}.stage-wrap{min-height:60px}#voiceLabel{flex:1}#voiceChoice{width:100%;max-width:55vw}}

/* Align the reading page to its controls, without an outer green mat. */
.stage-wrap{background:transparent;border:0;border-radius:0;padding:0;align-items:flex-end}.player{padding-top:5px}.speech-options{padding:2px 0}.stage{cursor:pointer}.stage .subtitle{cursor:ns-resize}.presentation .stage-wrap{align-items:center}.view-mode .stage-wrap{align-items:stretch}
@media(max-width:650px){.stage-wrap{padding:0;background:transparent;border:0}.player{padding-top:4px}}

.stage-wrap{flex:0 0 auto;align-items:flex-start;min-height:0}.presentation .stage-wrap{align-items:center;height:auto!important}.view-mode .stage-wrap{align-items:stretch}
.syb-copy-restricted .stage,.syb-copy-restricted .catalog{-webkit-user-select:none!important;user-select:none!important}
@media print{.syb-copy-restricted .reader-layout{visibility:hidden}}
.syb-status-success{color:#1f7a35!important}.syb-status-error{color:#b42318!important}

/* Fit both toolbar and transport inside the embedded viewport. */
.reader-layout{height:100dvh;min-height:0}.workspace{min-height:0;display:flex;flex-direction:column;overflow:hidden}.toolbar,.player{flex-shrink:0}.stage-wrap{min-height:0;flex-shrink:1;justify-content:center;align-items:center}.reading{overflow:hidden!important;touch-action:pan-y}.catalog{min-height:0}


/* ink.css */
.stage.ink{background:#f4f4ef;color:#222;border-color:#c7cbc6;isolation:isolate}.swatch.ink{background:linear-gradient(165deg,#f5f5ef 35%,#a6afa9 65%,#edf0e9 85%);color:#344039}#inkScene{display:none;position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:-1;opacity:var(--ink-opacity,.45)}.stage.ink #inkScene{display:block}.stage.ink .page-top{color:#4a534c;position:relative}.stage.ink .text-row{color:#1d2926;opacity:1;text-shadow:none}.stage.ink .text-row.active{color:#663e16;background:#d4b7874d}.stage.ink:before{border-color:#626d5f30}.stage.ink .reading{z-index:1}


/* qingming.css */
.stage.qingming{background:#f3eddb;color:#241e17;isolation:isolate}.swatch.qingming{background:linear-gradient(135deg,#c3ac7b,#ebe0bf);color:#574522}#qingmingScene{display:none;position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none;opacity:var(--qingming-opacity,.38)}.stage.qingming #qingmingScene{display:block}.stage.qingming .text-row{color:#292319;opacity:1;text-shadow:none}.stage.qingming .text-row.active{color:#663b0c;background:#fff1cc85}.stage.qingming .page-top{color:#57472f;position:relative}.stage.qingming .reading{z-index:1}

.stage.qingming{background:#fff7d9}.stage.qingming #qingmingScene{filter:sepia(.55) saturate(.65) brightness(1.22) contrast(.88)}

/* White breathing room inside the decorative frame. */
.stage.qingming{background:#f5e7bd}.stage.qingming::after{background:none}

/* Preserve fine ink detail without artificial aging or washed-out contrast. */
.stage.qingming #qingmingScene{filter:none;image-rendering:auto}


/* scenes.css */
.stage.city{background:#101d35;isolation:isolate}.swatch.city{background:linear-gradient(#122640,#364a63 65%,#eeb25e);color:#fff}.stage.city #inkScene{display:block}.stage.city .page-top{position:relative;color:#ede8da}.stage.city .reading{z-index:1}.stage.city .text-row{color:#f8f1de;opacity:1;text-shadow:none}.stage.city .text-row.active{background:#ffe3a32b;color:#fff}.stage.city:before{border-color:#e8dcb333}.stage.has-body-color .text-row,.stage.has-body-color .text-row.active{color:var(--body-text-color)!important}.stage.ink #inkScene,.stage.city #inkScene,.stage.qingming #qingmingScene{opacity:var(--scene-opacity,.5)}


/* custom-background.css */
#customBackgroundDrop{display:block;border:2px dashed #8e9c80;border-radius:10px;background:#edf1e5;padding:20px 12px;text-align:center;cursor:pointer;font-size:14px;line-height:1.8}#customBackgroundDrop span{font-size:12px}#customBackgroundDrop.drag-over{border-color:#436744;background:#dce9d3}#customBackgroundDrop:focus-visible{outline:2px solid #436744}.swatch.custom{background:linear-gradient(135deg,#dbe4cd,#b5cbca);color:#34544b}.stage.custom{background:#f5f2e9;isolation:isolate}.custom-background-layer{display:none;position:absolute;inset:0;pointer-events:none;z-index:-1;overflow:hidden;opacity:var(--scene-opacity,.5)}.stage.custom .custom-background-layer{display:block}.custom-background-layer img{display:block;position:absolute;top:0;left:0;max-width:none;height:100%;width:auto;will-change:transform}.stage.custom .page-top{position:relative;color:#514c3c}.stage.custom .reading{z-index:1}.stage.custom .text-row{color:#292319;opacity:1;text-shadow:none}.stage.custom .text-row.active{background:#eadcae70}.stage.custom.has-body-color .text-row{color:var(--body-text-color)!important}
.saved-background-preview{display:flex;align-items:center;gap:10px;margin:10px 0}.saved-background-preview img{width:150px;max-height:110px;object-fit:contain;border:1px solid #c5cdbd;border-radius:6px;background:#fff}.saved-background-preview button{font-size:12px}
.background-slots{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:10px 0}.background-slots button{min-width:0;padding:8px 5px;font-size:12px;border:1px solid #c8cdbf;border-radius:6px;display:flex;flex-direction:column;gap:5px;align-items:center}.background-slots button.active{border-color:#1265d5;background:#edf4ff;color:#1265d5}.background-slots img{width:100%;height:65px;object-fit:contain;background:#fff}.background-slots small{font-size:10px}.saved-background-preview img{width:75px;max-height:55px}

.background-slots{grid-template-columns:minmax(0,1fr)}


/* reader-tools.css */
.text-style-controls{display:flex;align-items:center;gap:12px;margin:10px 0}.text-style-controls label{display:flex;align-items:center;gap:8px}#bodyBold{font-size:18px;min-width:38px}#bodyBold[aria-pressed=true]{color:#1265d5;border-color:#1265d5;background:#edf4ff}.stage.body-bold .text-row{font-weight:700!important}.stage.outline-white .text-row{-webkit-text-stroke:.65px #fff;paint-order:stroke fill;text-shadow:1px 0 #fff,-1px 0 #fff,0 1px #fff,0 -1px #fff}.stage.outline-black .text-row{-webkit-text-stroke:.65px #000;paint-order:stroke fill;text-shadow:1px 0 #000,-1px 0 #000,0 1px #000,0 -1px #000}#videoRecord[disabled]{opacity:.5}.syb-recording-stop{position:fixed;right:16px;bottom:16px;z-index:9999;background:#9c2828;color:#fff;border:0;padding:10px 16px;border-radius:8px}
.toolbar-right.reader-quick #viewMode,.toolbar-right.reader-quick #fullscreen{font-size:24px;font-weight:900;line-height:1;min-width:38px;min-height:36px;padding:5px 8px;text-shadow:.35px 0 currentColor,-.35px 0 currentColor}.toolbar-right.reader-quick #quickBold{font-size:16px;min-width:31px;font-weight:700}#quickBold[aria-pressed=true]{color:#1265d5;border-color:#1265d5;background:#edf4ff}
.stage.syb-capture-armed{outline:3px solid #d62828!important;outline-offset:3px}.stage.syb-capture-recording{outline-color:#ee2424!important}.syb-recording-stop{top:8px;bottom:auto!important;font-size:13px;max-width:260px;padding:7px 12px}.syb-recording-stop[hidden],.syb-video-download[hidden]{display:none!important}.syb-video-download{display:inline-block;margin-top:8px}

/* Consistent aspect ratio in every layout; fullscreen must not stretch the stage. */
.view-mode .stage.wide{aspect-ratio:16/9}.view-mode .stage.tall{aspect-ratio:9/16}
.stage:fullscreen{min-width:0!important;min-height:0!important;max-width:100vw!important;max-height:100vh!important;inset:0!important;margin:auto!important}
.stage.syb-capture-armed{outline:3px solid #91bce8!important;outline-offset:3px}
.stage.syb-capture-recording{outline-color:#e52929!important}
#play.syb-recording-active,#screenPlay.syb-recording-active{background:#bc2929!important;color:#fff!important;box-shadow:0 0 0 3px #e5292940}
.syb-recording-stop.syb-recording-ready{background:#d9eafb;color:#234e78;border:1px solid #91bce8}
.stage.syb-capture-armed,.stage.syb-capture-armed *{cursor:none!important;caret-color:transparent!important}
.stage.wide:fullscreen{width:min(100vw,177.7777778vh)!important;height:min(100vh,56.25vw)!important}
.stage.tall:fullscreen{width:min(100vw,56.25vh)!important;height:min(100vh,177.7777778vw)!important}

.stage-wrap{justify-content:center}.view-mode .stage-wrap{align-items:flex-start}

/* Keep the compact catalog aligned only with the reading stage, excluding controls. */
.reader-layout{position:relative}
.catalog{align-self:start;min-height:0;overflow:hidden}
.catalog-book{flex:0 0 auto;padding:3px 0 10px;margin-bottom:5px}
.catalog h1{line-height:1.35}
.catalog p{margin-top:5px}
#catalogAuthor:empty{display:none}
#chapters{min-height:0;overscroll-behavior:contain}
.chapter-item{padding:6px 7px;margin:0;line-height:1.45;gap:7px}
@media(max-width:650px){.catalog-open .catalog{padding:10px}.chapter-item{padding:5px 6px;line-height:1.4}}

.toolbar,.player{box-sizing:border-box}.syb-compact-controls .toolbar{flex-wrap:wrap;gap:5px}.syb-compact-controls .toolbar-right{display:flex;flex-wrap:wrap;gap:4px;justify-content:center;max-width:100%;margin-inline:auto}.syb-compact-controls .player-row{flex-wrap:wrap;justify-content:center;gap:5px}.syb-compact-controls .player-options{flex-wrap:wrap;justify-content:center;max-width:100%;margin-inline:auto}.syb-compact-controls .transport{gap:4px}.syb-compact-controls .toolbar button{padding:5px 7px}.syb-tiny-controls .volume-control{display:flex;align-items:center;gap:3px}.syb-tiny-controls #volume{width:70px}.syb-tiny-controls .transport button{padding:5px}.syb-tiny-controls #clock{min-width:0}.syb-tiny-controls .player-options{gap:2px}.syb-tiny-controls .toolbar-right.reader-quick #viewMode,.syb-tiny-controls .toolbar-right.reader-quick #fullscreen{font-size:20px;min-width:30px;min-height:30px}
.syb-compact-controls .toolbar-right select{max-width:100%;min-width:0}.syb-tiny-controls .volume-control,.syb-tiny-controls .transport{flex-wrap:wrap;justify-content:center;max-width:100%}


/* calligraphy.css */
.stage .reading,.stage .page-top,.stage .subtitle{font-family:var(--reader-font,"Songti TC",serif)}
.toolbar #bodyFont{width:auto;max-width:120px;min-width:70px;font-size:inherit;padding:8px}
@media(max-width:600px){.toolbar #bodyFont{max-width:84px;min-width:60px;padding:5px}}


/* presentation.css */
.stage.custom .custom-background-layer{inset:var(--picture-y,12%) var(--picture-x,4%);z-index:0}
.stage.custom.picture-fade .custom-background-layer{mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.stage.custom .page-top{z-index:1}
.stage.custom[data-picture-mat=book]::after{background:#ede2c9;background-image:radial-gradient(ellipse at 50% 30%,#fff9e688,transparent 75%),repeating-linear-gradient(1deg,#805e1b05 0 1px,transparent 1px 4px);filter:saturate(var(--book-saturation,1))}
.stage.custom[data-picture-mat=scroll]::after{background:linear-gradient(90deg,#ac854f,#ead5ae 3%,#f4e2bd 50%,#ead5ae 97%,#ac854f);filter:saturate(var(--scroll-saturation,1))}
.stage.custom[data-picture-mat=lace]::after{background:#f5efe2;filter:saturate(var(--lace-saturation,1))}
.stage.custom[data-picture-mat=white]::after{background:#fff}
.settings-zoom{display:flex;justify-content:flex-end;align-items:center;gap:8px;margin:8px 0}.settings-zoom button{padding:3px 10px;font-size:18px}.settings-zoom span{font-size:16px}
#quickBodyFont,#bodyFont{max-width:135px}

/* A brighter central row without changing the chosen text colour or font weight. */
.stage .text-row.current{opacity:1!important;background:linear-gradient(90deg,transparent,rgba(255,244,187,.86) 6%,rgba(255,244,187,.86) 94%,transparent)!important;box-shadow:inset 0 1px 0 #fff9da99,inset 0 -1px 0 #efd68166}


/* storyteller.css */
#stage.syb-actor-stage{overflow:hidden}.syb-storyteller{position:absolute;z-index:8;touch-action:none;cursor:grab;user-select:none;aspect-ratio:1;transform-origin:50% 90%;transform:translateY(calc(var(--lift,0)*1px)) rotate(calc(var(--sway,0)*1deg));filter:drop-shadow(0 3px 3px #0001)}.syb-storyteller[hidden]{display:none}.actor-canvas{display:block;width:100%;height:100%;pointer-events:none}.breathing .actor-canvas{animation:actor-breathe var(--breath-period,12s) ease-in-out infinite;transform-origin:50% 90%}@keyframes actor-breathe{0%,100%{transform:scaleY(1)}50%{transform:scaleY(var(--breath-scale,1.0025))}}.actor-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:12px 0}.actor-card{display:flex;flex-direction:column;align-items:center;padding:6px;border:2px solid #d5d6c8;border-radius:10px;background:#faf7ef;cursor:pointer;font-size:12px}.actor-card.selected{border-color:#376c50;background:#edf5e9;box-shadow:0 0 0 1px #376c50}.actor-card-picture{display:block;width:100%;aspect-ratio:1;background-size:400% 200%;background-position:0 0;background-repeat:no-repeat}.actor-card:focus-visible{outline:3px solid #b88b3d;outline-offset:2px}.syb-storyteller-settings label{display:block;margin:12px 0}.syb-storyteller-settings select{max-width:100%}.syb-storyteller-settings output{display:inline-block;min-width:4em}#actorNote,#actorDialogueStatus{font-size:12px}@media(prefers-reduced-motion:reduce){.syb-storyteller{transform:none}.breathing .actor-canvas{animation:none}}


/* caption-display.css */
.stage .subtitle,.stage.tall .subtitle{padding:var(--caption-pad-y,3px) var(--caption-pad-x,10px);line-height:1.3;min-width:0;width:max-content}.stage .subtitle[data-caption-look="outline"]{background:transparent!important;box-shadow:none;padding:0 .08em}.stage #subtitleText{color:var(--caption-ink,#fff);-webkit-text-fill-color:var(--caption-ink,#fff);-webkit-text-stroke:var(--caption-stroke,2px) rgba(0,0,0,var(--caption-stroke-alpha,.85));paint-order:stroke fill;text-shadow:none}.settings-global-bar[hidden]{display:none!important}.settings-global-bar{margin:8px 0;padding:8px 0;border-bottom:1px solid #ded8c8}.settings-global-bar p{white-space:pre-line}


/* featured-reader.css */
/* Homepage exposes exactly play/pause, progress and volume. Full reader is unchanged. */
body.syb-feature-preview .catalog,body.syb-feature-preview .toolbar,body.syb-feature-preview #settings,body.syb-feature-preview .page-top,body.syb-feature-preview #watermark,body.syb-feature-preview .speech-options,body.syb-feature-preview .screen-controls,body.syb-feature-preview #clock,body.syb-feature-preview #status,body.syb-feature-preview .transport>:not(#play),body.syb-feature-preview .player-options>:not(.volume-control){display:none!important}
body.syb-feature-preview .reader-layout{display:block;padding:0;margin:0;height:100dvh;min-height:0}body.syb-feature-preview .workspace{width:100%;height:100%;padding:0;margin:0;border:0;background:transparent}body.syb-feature-preview .stage-wrap{padding:0;margin:0;border:0;background:transparent}body.syb-feature-preview .stage{margin:0;cursor:pointer}body.syb-feature-preview .reading{font-size:calc(3.1cqw * var(--font-scale));margin:5% 6% 12%}body.syb-feature-preview .subtitle{font-size:calc(2.6cqw * var(--caption-font-scale,1))}
body.syb-feature-preview .player{box-sizing:border-box;padding:12px 10px;margin:0 auto;background:#f6f6ef}body.syb-feature-preview #seek{width:100%;display:block;margin:0}body.syb-feature-preview .player-row{display:grid;grid-template-columns:36px minmax(0,1fr);align-items:center;gap:12px;margin-top:10px}body.syb-feature-preview .transport{display:contents}body.syb-feature-preview #play{width:36px;height:36px;min-width:36px;padding:0;margin:0}body.syb-feature-preview .player-options{display:block;width:100%;min-width:0;max-width:100%;margin:0}body.syb-feature-preview .volume-control{display:flex;flex-wrap:nowrap;align-items:center;gap:5px;width:100%;min-width:0;font-size:12px}body.syb-feature-preview #volume{flex:1 1 0;min-width:20px;width:0;max-width:none}body.syb-feature-preview #volumeValue{min-width:31px;font-size:11px;text-align:right}
body.syb-feature-preview .player-options{grid-column:2;grid-row:1}body.syb-feature-preview #play{grid-column:1;grid-row:1}

body.syb-feature-preview .player{padding:6px 5px}body.syb-feature-preview .player-row{grid-template-columns:18px minmax(0,1fr);gap:6px;margin-top:5px}body.syb-feature-preview #play{width:18px;height:18px;min-width:18px;font-size:7px;border-radius:50%}body.syb-feature-preview .volume-control{width:50%;min-width:74px;font-size:6px;gap:2.5px;line-height:1}body.syb-feature-preview #volume{height:8px}body.syb-feature-preview #volumeValue{min-width:16px;font-size:6px}body.syb-feature-preview #volume::-webkit-slider-thumb{width:8px;height:8px}body.syb-feature-preview #volume::-moz-range-thumb{width:8px;height:8px}
body.syb-feature-preview #volume{appearance:none;-webkit-appearance:none;height:2px;border:0;border-radius:3px;background:#d6ddd2}body.syb-feature-preview #volume::-webkit-slider-thumb{-webkit-appearance:none;width:8px;height:8px;border:0;border-radius:50%;background:#476746}body.syb-feature-preview #volume::-moz-range-thumb{width:8px;height:8px;border:0;border-radius:50%;background:#476746}body.syb-feature-preview #volumeValue{font-size:5.5px}