@charset "UTF-8";
:root{--paper:#f8f3e6;--ink:#352e29;--muted:#837362;--wine:#6c3034;--gold:#d9bd8c;--ui:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;--serif:"Songti SC","Noto Serif CJK SC","SimSun",serif;--page-w:480px;--page-h:660px}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:var(--ui)}body{color:var(--ink);background:#382a22 url('assets/walnut.jpg') center/cover fixed;overflow-x:hidden}body:before{content:"";position:fixed;inset:0;pointer-events:none;background:linear-gradient(105deg,rgba(15,12,10,.3),transparent 45%,rgba(8,6,4,.22));z-index:-1}button,input,textarea{font:inherit}button{cursor:pointer}button,a,input,textarea{touch-action:manipulation}button{color:inherit}button:disabled{opacity:.35;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid #be7d46;outline-offset:4px}button{border:0;background:none}a{color:inherit;text-decoration:none}[hidden]{display:none!important}.toolbar{height:82px;display:flex;align-items:center;justify-content:space-between;padding:0 38px;color:#eee2cb;position:relative;z-index:4;border-bottom:1px solid #dfc4a21a}.tool-button{font-size:14px;letter-spacing:.06em;padding:10px 0;display:flex;align-items:center;gap:9px}.tool-button>span{font-size:23px;font-weight:200}.wordmark{font-family:var(--serif);font-size:23px;letter-spacing:.22em}.wordmark span{font-size:12px;letter-spacing:.13em;font-family:var(--ui);margin-left:20px;color:#cbbba4}.desk{min-height:calc(100svh - 82px);position:relative;display:flex;align-items:center;justify-content:center;padding:28px 34px 106px}.intro{position:absolute;left:max(8%,calc(50% - 450px));top:23%;color:#eadfc9;transition:opacity .45s,transform .6s}.eyebrow{font-size:12px;letter-spacing:.22em}.intro>p{font-family:var(--serif);font-size:27px;line-height:1.6;letter-spacing:.13em;margin:35px 0 0}.intro>p>span{font-family:var(--ui);font-size:13px;letter-spacing:.19em;color:#cbb498}.intro-rule{height:1px;width:44px;background:#bc9472;margin:25px 0}.intro .intro-small{font-size:17px;line-height:2.2;letter-spacing:.1em;margin:0;color:#d4c3aa}.book-stage{width:calc(var(--page-w)*2);height:var(--page-h);perspective:2200px;position:relative;margin-top:10px}.book{width:100%;height:100%;position:relative;transform-style:preserve-3d}.spread{position:absolute;inset:0;display:flex;box-shadow:0 5px 0 #d0bd99,0 8px 0 #887558,0 12px 0 #502b29,5px 30px 52px #09070699;opacity:0;transition:opacity .3s;transform:translateY(0)}.page{position:relative;width:50%;height:100%;background:var(--paper);border-radius:2px;overflow:hidden;color:var(--ink)}.left-page{background:linear-gradient(90deg,#efe7d5 0%,#faf5e9 7%,#f9f4e8 90%,#d8ceba 99.6%);border-radius:4px 0 0 3px}.right-page{background:linear-gradient(90deg,#d5c9b4 0%,#f5efdf 3%,#faf5e9 12%,#f9f4e8 93%,#e8dec9);border-radius:0 4px 3px 0}.page:after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.15;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.88' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23807665' filter='url(%23n)' opacity='.28' d='M0 0h160v160H0z'/%3E%3C/svg%3E")}.page-head{position:absolute;top:25px;left:40px;right:40px;display:flex;align-items:center;justify-content:space-between;gap:20px;color:#8c7d69;font-size:12px;letter-spacing:.1em;border-bottom:1px solid #a98b6629;padding-bottom:9px;white-space:nowrap;overflow:hidden}.page-head span:last-child{overflow:hidden;text-overflow:ellipsis}.page-body{position:absolute;left:45px;right:42px;top:76px;bottom:62px;font-family:var(--serif);font-size:17px;line-height:1.95;overflow:hidden;overflow-wrap:anywhere}.left-page .page-body{left:42px;right:45px}.page-body p{margin:0 0 .85em;white-space:pre-wrap;text-align:justify;text-indent:2em}.page-body p.continued{text-indent:0}.page-body .verse{margin:0;line-height:1.92;text-indent:0;text-align:left;white-space:pre-wrap}.page-body .signature{text-align:right;text-indent:0;margin:.35em 0;font-size:.88em;color:#6d6155}.page-body .subtitle{text-indent:0;text-align:center;font-size:.9em;color:#75695b;margin:.2em 0 1.1em}.page-body .space{height:.7em}.page-body h2{font-size:27px;font-weight:500;letter-spacing:.06em;line-height:1.5;margin:2px 0 28px;color:#663a33;text-wrap:balance}.page-body h3{font-size:21px;font-weight:600;margin:1em 0 .8em;line-height:1.6;letter-spacing:.06em}.page-number{position:absolute;bottom:25px;left:0;right:0;text-align:center;font-size:12px;font-family:Georgia,serif;color:#8a7964;letter-spacing:.18em}.cover{position:absolute;left:50%;top:0;width:50%;height:100%;border-radius:2px 5px 5px 2px;background:#53272c url('assets/cover.jpg') center/cover;color:var(--gold);box-shadow:inset 10px 0 14px #14080768,inset 12px 0 0 #9c56521a,inset -2px 0 4px #11050480,6px 7px 0 #cbb99c,8px 10px 0 #4d2a29,10px 27px 48px #090503b0;transform-origin:left center;backface-visibility:hidden;transition:transform 1s cubic-bezier(.33,.05,.25,1),opacity .35s .6s;z-index:3}.cover-border{position:absolute;inset:26px 27px 27px 32px;border:1px solid #dab78550;box-shadow:inset 0 0 0 5px #64322e20;pointer-events:none}.cover-topline{position:absolute;top:10%;left:0;right:0;text-align:center;font-size:12px;letter-spacing:.34em;color:#dcc29c}.cover h1{font-family:var(--serif);font-size:clamp(52px,5.5vw,74px);font-weight:500;letter-spacing:.22em;writing-mode:vertical-rl;position:absolute;left:50%;top:23%;margin:0;transform:translateX(-50%);text-shadow:1px 1px 0 #201010,0 0 8px #d4a66315}.cover-author{position:absolute;left:27%;top:29%;writing-mode:vertical-rl;letter-spacing:.35em;font-family:var(--serif);font-size:16px}.cover-foot{position:absolute;bottom:10%;text-align:center;width:100%;font-size:12px;letter-spacing:.21em}.open-corner{position:absolute;right:0;bottom:0;display:flex;align-items:center;gap:15px;padding:22px;color:#e9d5b1;font-size:13px;min-width:106px;min-height:72px;background:linear-gradient(135deg,transparent 45%,#d9bb8855 98%);border-bottom-right-radius:5px}.open-corner span:last-child{font-size:25px}.book.open .front-cover{transform:rotateY(-178deg);opacity:0;pointer-events:none}.book.open .spread{opacity:1}.desk.is-reading .intro{opacity:0;transform:translateX(-25px);pointer-events:none}.book.closed-back .spread{opacity:0}.back-cover{transform:rotateY(0);z-index:5}.back-title{text-align:center;font-family:var(--serif);font-size:21px;letter-spacing:.2em;margin-top:15%}.back-cover blockquote{font-family:var(--serif);font-size:24px;line-height:2;letter-spacing:.09em;position:absolute;left:14%;right:12%;top:37%;margin:0}.back-credit{position:absolute;top:55%;right:15%;font-size:12px}.back-bottom{position:absolute;bottom:15%;width:100%;text-align:center;font-size:12px;letter-spacing:.12em}.turn-leaf{position:absolute;top:0;left:50%;width:50%;height:100%;background:linear-gradient(90deg,#eee4d1,#fffbed 70%,#dccdae);z-index:2;transform-origin:left;backface-visibility:hidden;pointer-events:none;opacity:0}.turn-leaf.forward{animation:turnForward .66s ease-in-out}.turn-leaf.backward{animation:turnBackward .66s ease-in-out}.book.closing .back-cover{animation:shutCover .9s ease-in-out}.book.closing .spread{opacity:1;transition:opacity .9s}.book.closing.closed-back .spread{opacity:0}@keyframes turnForward{0%{opacity:1;transform:rotateY(0)}90%{opacity:1}100%{opacity:0;transform:rotateY(-180deg)}}@keyframes turnBackward{0%{opacity:0;transform:rotateY(-180deg)}10%{opacity:1}100%{opacity:1;transform:rotateY(0)}}@keyframes shutCover{0%{transform:rotateY(-177deg)}100%{transform:rotateY(0)}}.reader-nav{position:absolute;bottom:39px;left:50%;transform:translateX(-50%);display:flex;gap:27px;align-items:center;color:#e8d9bf}.nav-arrow{font-size:24px;border:1px solid #bca88655;border-radius:50%;width:42px;height:42px;transition:background .2s}.nav-arrow:hover{background:#e4d0a51c}.page-control{text-align:center;min-width:125px}#current-label{font-size:13px;max-width:200px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;margin-bottom:6px}#jump-form{display:flex;justify-content:center;align-items:center;gap:7px;font-size:12px;color:#bdac92}#page-input{width:44px;background:#ffffff09;border:0;border-bottom:1px solid #b39d7b77;color:#e8d9bf;text-align:center;appearance:textfield;font-size:13px;padding:2px}#page-input::-webkit-inner-spin-button{display:none}#jump-form button{padding:1px 5px;color:#e6d1ae}.close-book{font-size:12px;white-space:nowrap;position:absolute;left:calc(100% + 34px);color:#cbb79c}.desk-foot{position:absolute;bottom:13px;left:38px;right:38px;display:flex;justify-content:space-between;font-size:12px;letter-spacing:.07em;color:#baa68d}.title-page{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.title-page small{font-family:var(--ui);font-size:12px;color:#8c775d;letter-spacing:.14em}.title-page h2{font-size:42px;letter-spacing:.22em;writing-mode:vertical-rl;line-height:1.5;margin:38px 0}.title-page p{font-size:15px;text-indent:0;text-align:center;letter-spacing:.13em}.title-page .small-date{font-size:12px;font-family:var(--ui);margin-top:24px;color:#94816a}.dedication{height:100%;display:flex;flex-direction:column;justify-content:center;padding:15% 8%;font-family:var(--serif);color:#6a5140}.dedication p{font-size:20px;text-indent:0;line-height:2.2;text-align:left}.dedication .dedication-author{font-size:13px;color:#97816b;margin-top:15px}.chapter-page{height:100%;padding:18% 10% 5%;position:relative}.chapter-page .chapter-index{font-family:var(--ui);font-size:13px;color:#957f63;letter-spacing:.25em}.chapter-page h2{writing-mode:vertical-rl;font-size:36px;letter-spacing:.14em;max-height:80%;margin:36px 0 0 37%;line-height:1.65}.chapter-page:after{content:"";position:absolute;left:8%;bottom:10%;height:60px;border-left:1px solid #976c4255}.photo-page{height:100%;padding:12px 8px;display:flex;flex-direction:column;align-items:center;justify-content:center}.scrap-photo{position:relative;width:94%;margin:0;padding:11px 11px 35px;background:#fffdf5;box-shadow:2px 6px 10px #49341a2b,0 0 0 1px #7e664017;transform:rotate(-2deg)}.photo-page.even .scrap-photo{transform:rotate(1.5deg)}.scrap-photo:before,.scrap-photo:after{content:"";position:absolute;width:77px;height:27px;background:#c5a87877;box-shadow:0 1px 2px #51422314;z-index:1;top:-10px;left:8%;transform:rotate(-19deg);clip-path:polygon(2% 0,99% 4%,97% 94%,0 100%)}.scrap-photo:after{left:auto;right:5%;top:auto;bottom:-8px;transform:rotate(-17deg);background:#b9b4a363}.scrap-photo button{padding:0;width:100%;display:block}.scrap-photo img{max-width:100%;max-height:calc(var(--page-h) - 340px);display:block;margin:auto;object-fit:contain;filter:sepia(.05)}.photo-caption{margin-top:27px;font-family:"Kaiti SC","STKaiti",var(--serif);font-size:16px;line-height:1.75;color:#67533d;text-align:left;width:94%;position:relative}.photo-caption:before{content:"";display:block;width:30px;height:1px;background:#a88c6380;margin-bottom:12px}.photo-index{position:absolute;bottom:8px;right:12px;font-family:Georgia,serif;color:#a88d69;font-size:12px;letter-spacing:.1em}.tree-half{height:100%;position:relative;overflow:hidden;cursor:zoom-in}.tree-half img{position:absolute;width:200%;max-width:none;left:0;top:50%;transform:translateY(-50%)}.tree-half.right img{left:-100%}.tree-half:before{content:"弋三多堂家系图";position:absolute;top:0;left:0;right:0;background:var(--paper);z-index:1;font-size:20px;color:#6c4035;padding:8px 0}.tree-half.right:before{content:"家族世系"}.tree-half:after{content:"点击放大查看";position:absolute;bottom:0;left:0;right:0;background:var(--paper);font-family:var(--ui);font-size:12px;color:#86725c;padding:8px 0}.end-page{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center}.end-page p{text-indent:0;text-align:center;font-size:25px;letter-spacing:.25em;color:#73563f}.end-page button{font-family:var(--ui);font-size:14px;padding:13px 24px;border:1px solid #ac906b77;color:#765136;margin-top:30px}.end-page span{font-size:12px;letter-spacing:.12em;color:#988268;margin-top:16px}.side-panel{position:fixed;top:0;bottom:0;width:340px;background:#f5efe2;color:var(--ink);z-index:20;padding:32px 27px;overflow-y:auto;transition:transform .3s ease;box-shadow:10px 0 40px #0004}.toc-panel{left:0;transform:translateX(-105%)}.notes-panel{right:0;transform:translateX(105%);background:#f3ead8}.side-panel.visible{transform:translateX(0)}.panel-shade{position:fixed;inset:0;background:#140e0c55;z-index:10;backdrop-filter:blur(2px)}.panel-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:28px}.panel-head .eyebrow{color:#957d5c;font-size:12px}.panel-head h2{font:30px var(--serif);margin:8px 0 0;letter-spacing:.1em}.icon-button{font-size:28px;width:40px;height:40px;font-weight:200}.search-wrap{position:relative;border-bottom:1px solid #bdaa8c;display:flex;align-items:center;gap:9px}.search-wrap>span{font-size:28px;color:#8e7356}.search-wrap input{width:100%;padding:12px 0;border:0;background:none;font-size:14px;min-width:0;color:#493c2f}.search-wrap kbd{font-size:11px;color:#ad9878;white-space:nowrap}.search-status{font-size:12px;color:#95856d;margin:23px 0 13px}#contents button,#search-results button{display:block;text-align:left;width:100%;padding:10px 8px;line-height:1.5;border-radius:2px;font-size:14px}#contents button:hover,#search-results button:hover,#contents button.active{background:#e5d9c5;color:#6e3030}#contents button.level3{padding-left:22px;font-size:13px;color:#7b6d5a}#contents .toc-chapter{font-family:var(--serif);font-size:16px;margin-top:18px;padding-top:15px;border-top:1px solid #c7b99e55;color:#713d35}#contents .toc-title{display:flex;justify-content:space-between;gap:10px}#contents .toc-page{color:#a18c6d;font-size:12px;white-space:nowrap}.panel-foot{border-top:1px solid #cebea4;margin-top:24px;padding-top:18px;font-size:12px;color:#8f7c63;line-height:1.8}#search-results small{display:block;font-size:12px;line-height:1.8;color:#8b755e;margin-top:6px}mark{background:#e7cf9b;color:inherit}.note-intro{font-family:var(--serif);font-size:18px;line-height:1.8;color:#786046}#note-form label{display:block;font-size:13px;color:#816c50;margin:22px 0 10px}#note-form input,#note-form textarea{width:100%;background:#fffdf533;border:0;border-bottom:1px solid #bfae8f;border-radius:0;line-height:1.9;padding:8px 10px;font-size:15px;color:#514131;resize:vertical}.submit-note{width:100%;padding:15px 17px;background:#70413a;color:#f8ecd6;margin-top:25px;display:flex;justify-content:space-between;font-size:14px}.local-notice{font-size:12px;line-height:1.8;color:#917c61;margin:16px 0 25px}.message{background:#fcf6e8;box-shadow:1px 3px 6px #83623b15;padding:18px;margin:15px 0;transform:rotate(-.7deg);border-top:1px solid #fff}.message p{white-space:pre-wrap;word-break:break-word;font:17px/1.8 var(--serif);margin:0 0 12px}.message footer{font-size:12px;color:#987c59;display:flex;justify-content:space-between;gap:8px}.message button{font-size:12px;color:#8c725c;padding:0}#note-status{font-size:13px;line-height:1.7;color:#80523b}#photo-dialog{width:min(94vw,1400px);max-width:none;height:91svh;background:#211b17;color:#eadcc7;border:1px solid #8a7353;padding:16px 24px;box-shadow:0 20px 70px #0009}#photo-dialog::backdrop{background:#120e0aed}#photo-dialog header{display:flex;justify-content:space-between;align-items:center;gap:20px;font-size:14px;line-height:1.7;min-height:50px}#photo-dialog header span{max-width:85%}.lightbox-image{height:calc(100% - 100px);overflow:auto;text-align:center}.lightbox-image img{max-height:100%;max-width:100%;object-fit:contain}#photo-dialog p{text-align:center;font-size:12px;color:#a99276;margin:14px 0}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.loading{position:fixed;bottom:80px;left:50%;transform:translateX(-50%);z-index:8;background:#f8eddb;color:#745337;padding:10px 20px;border-radius:2px;font-size:13px}.noscript{position:fixed;inset:40%;background:white;padding:20px}.measure-page{position:fixed;left:-20000px;top:0;visibility:hidden;pointer-events:none;width:var(--page-w);height:var(--page-h);background:white}.measure-page .page-body{overflow:visible}.empty-leaf{height:100%;display:grid;place-items:center;font-size:13px;letter-spacing:.23em;color:#aa977a}
.desk{padding-top:18px;padding-bottom:90px}.book-stage{margin-top:8px}.long-caption .photo-caption{font-size:14px;line-height:1.65;margin-top:20px}.long-caption .scrap-photo img{max-height:calc(var(--page-h) - 390px)}.tree-half img,.tree-dialog .lightbox-image img{clip-path:inset(8% 0 6% 0)}
#photo-dialog[open]{display:flex;flex-direction:column}#photo-dialog header{flex-shrink:0}.lightbox-image{flex:1;min-height:0;height:auto;margin-top:12px}.zoom-controls{display:flex;align-items:center;justify-content:center;gap:12px;font-size:14px;padding:12px 0 0;flex-shrink:0}.zoom-controls button{border:1px solid #816e53;padding:6px 11px;border-radius:2px;min-height:36px}.zoom-controls small{font-size:12px;color:#b3a087}.zoom-controls span{font-size:13px;min-width:40px}.lightbox-image img{vertical-align:top}
@media(min-width:1600px){.toolbar{height:90px}.desk{min-height:calc(100svh - 90px)}}
@media(max-width:800px){.toolbar{height:66px;padding:0 20px}.wordmark{font-size:20px}.wordmark span{display:none}.tool-button{font-size:13px;gap:5px}.tool-button>span{font-size:21px}.desk{padding:22px 14px 108px;min-height:calc(100svh - 66px);align-items:flex-start}.book-stage{width:var(--page-w);margin-top:10px}.cover{left:0;width:100%}.intro{display:none}.page{width:100%}.right-page{display:none}.left-page{background:linear-gradient(90deg,#e9deca,#faf5e9 6%,#f9f4e8 95%,#eadfc8)}.page-body,.left-page .page-body{left:28px;right:28px;top:64px;bottom:52px;font-size:17px}.page-head{left:28px;right:28px;top:21px}.page-body h2{font-size:25px}.page-body h3{font-size:21px}.cover h1{font-size:62px}.cover-author{font-size:16px}.page-number{bottom:18px}.reader-nav{bottom:45px;gap:24px}.desk-foot{left:20px;right:20px;font-size:12px;bottom:15px}.desk-foot>span:first-child{display:none}.desk-foot{justify-content:center}.close-book{left:calc(100% + 17px);font-size:12px}.turn-leaf{left:0;width:100%}.side-panel{width:min(350px,90vw)}.chapter-page h2{font-size:32px}.photo-caption{font-size:15px}.scrap-photo img{max-height:calc(var(--page-h) - 330px)}.tree-half img{width:200%}.tree-half:before{font-size:17px}.book.open .front-cover{transform:rotateY(-100deg)}#photo-dialog{padding:10px 14px}.lightbox-image img{max-height:none;max-width:100%}.wordmark{letter-spacing:.15em}.search-wrap kbd{display:none}}
@media(max-width:390px){.tool-button{font-size:12px}.toolbar{padding:0 14px}.close-book{position:static;padding:0;margin-left:-12px}.reader-nav{gap:17px}.page-control{min-width:98px}.cover h1{font-size:54px}}
/* Quiet reading edition: explicit title columns, upright photographs, fine gutter. */
button:focus:not(:focus-visible),a:focus:not(:focus-visible){outline:none}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline:1px solid #9a8a73;outline-offset:3px}
.search-wrap input:focus,.search-wrap input:focus-visible,#note-form input:focus-visible,#note-form textarea:focus-visible,#page-input:focus-visible{outline:none}
.search-wrap:focus-within{border-bottom-color:#766c5c;background:#b1a38c0b}
#note-form input:focus-visible,#note-form textarea:focus-visible,#page-input:focus-visible{border-bottom-color:#7b715f;box-shadow:0 1px 0 #7b715f}
#contents button.active{color:#544737;background:#9d8d741c}
.left-page,.right-page{background:#faf5e9}
.right-page{border-left:1px solid #b5a58c55}
.page:after{opacity:.08}
.spread{transition:opacity .2s}
.chapter-page{padding:10% 7% 4%}
.chapter-page h2.chapter-title{writing-mode:horizontal-tb;display:flex;flex-direction:row-reverse;justify-content:center;align-items:flex-start;gap:22px;max-height:none;margin:38px 0 0;line-height:1.35;font-size:clamp(26px,calc(var(--page-h) / 20),36px);letter-spacing:.15em;text-wrap:nowrap;overflow-wrap:normal}
.chapter-phrase{display:block;writing-mode:vertical-rl;white-space:nowrap;word-break:keep-all;line-height:1.35}
.chapter-page:after{height:44px;bottom:6%}
.photo-page .scrap-photo,.photo-page.even .scrap-photo{transform:none;width:96%;padding:12px 12px 32px;border-radius:0;background:#fffdf8;box-shadow:0 3px 8px #49341a18,0 0 0 1px #7e664020}
.scrap-photo:before,.scrap-photo:after{display:none;content:none}
.scrap-photo img{filter:none}
.treatment-fine .scrap-photo{padding:7px 7px 27px;background:transparent;border:1px solid #b7a58b;box-shadow:none}
.treatment-paper .scrap-photo{padding:15px 15px 31px;background:#e9e0ce;box-shadow:0 1px 0 #fff9,0 0 0 1px #b2a08766}
.photo-caption{width:96%;margin-top:22px}
.tree-half img,.tree-dialog .lightbox-image img{clip-path:none}
.tree-dialog .lightbox-image{background:#fffcf8}
.back-cover{left:0;transition:none;box-shadow:inset -6px 0 8px #14080745,-6px 7px 0 #cbb99c,-8px 10px 0 #4d2a29,-10px 27px 48px #09050390}
.close-leaf{display:none;position:absolute;top:0;left:50%;width:50%;height:100%;z-index:7;transform-origin:left center;transform-style:preserve-3d;pointer-events:none}
.closing-face{position:absolute;inset:0;backface-visibility:hidden;overflow:hidden}
.closing-paper{background:var(--paper);color:var(--ink)}
.closing-cloth{transform:rotateY(180deg);background:#53272c url('assets/cover.jpg') center/cover;color:var(--gold);border-radius:4px;box-shadow:inset -6px 0 8px #14080745}
.closing-cloth blockquote{font-family:var(--serif);font-size:24px;line-height:2;letter-spacing:.09em;position:absolute;left:14%;right:12%;top:37%;margin:0}
.book.closing-ready .close-leaf{display:block;will-change:transform;transform:rotateY(0)}
.book.closing .close-leaf{display:block;animation:closeToLeft .7s cubic-bezier(.4,0,.2,1) both}
.book.closing .back-cover{animation:none}
.book.closing-ready .spread{opacity:1;transition:none;box-shadow:none}
.book.closing-ready .right-page{visibility:hidden}
.book.closing-ready .front-cover{visibility:hidden;transition:none}
.book.closed-back .spread{display:none;opacity:0;visibility:hidden;box-shadow:none;transition:none}
.book.closed-back .front-cover{display:none;visibility:hidden;box-shadow:none;transition:none}
.book.at-cover .front-cover{transition:none}
.rewind-pages{display:none;position:absolute;inset:0;pointer-events:none;z-index:6;transform-style:preserve-3d}
.rewind-pages i{position:absolute;left:50%;top:0;width:50%;height:100%;transform-origin:left center;background:#f9f2e3;border:1px solid #cabda377;box-shadow:2px 0 3px #3c2d261a;transform:rotateY(-180deg);animation:rewindLeaf .4s cubic-bezier(.2,.5,.4,1) both}
.rewind-pages i:nth-child(2){animation-delay:.065s;background:#f3ead8}
.rewind-pages i:nth-child(3){animation-delay:.13s}
.book.rewinding .rewind-pages{display:block}
.book.rewinding .front-cover{z-index:8;opacity:1;transition:none;animation:rewindCover .42s .18s cubic-bezier(.2,.5,.4,1) both}
.book.rewinding .spread{opacity:1;transition:none}
.return-bookmark{position:absolute;right:22px;top:-13px;z-index:9;display:flex;align-items:center;gap:7px;color:#eee3ce;background:#78664f;padding:11px 13px 17px;font-size:12px;letter-spacing:.06em;clip-path:polygon(0 0,100% 0,100% 100%,50% calc(100% - 5px),0 100%);box-shadow:0 2px 3px #1d151333;transition:background .2s}
.return-bookmark:hover{background:#635641}
.return-bookmark{top:-25px}
.return-bookmark:focus-visible{outline:none;background:#564a38;text-decoration:underline;text-underline-offset:4px}
.desk.is-back .return-bookmark{right:calc(50% + 22px)}
@keyframes closeToLeft{from{transform:rotateY(0)}to{transform:rotateY(-180deg)}}
@keyframes rewindLeaf{0%{transform:rotateY(-180deg);opacity:1}85%{opacity:1}100%{transform:rotateY(0);opacity:0}}
@keyframes rewindCover{from{transform:rotateY(-180deg)}to{transform:rotateY(0)}}
@media(max-width:800px){
  .chapter-page h2.chapter-title{font-size:30px;gap:20px;margin-top:30px}
  .left-page{background:#faf5e9}
  .close-leaf,.rewind-pages i{left:0;width:100%;transform-origin:center}
  .book.rewinding .front-cover{transform-origin:center}
  .desk.is-back .return-bookmark{right:16px}
  .return-bookmark{right:16px;top:-23px;font-size:12px;padding:9px 12px 15px}
  .search-wrap input,#note-form input,#note-form textarea{font-size:16px}
}
/* Compact navigation: outside covers flank the quiet page controls. */
.reader-nav{display:grid;grid-template-columns:auto 42px minmax(108px,1fr) 42px auto;gap:18px;width:min(470px,calc(100% - 32px));align-items:center}
.page-control{min-width:0}
.cover-tab{padding:9px 10px;min-height:42px;border-block:1px solid #bca88655;color:#e1d2b9;font-size:14px;white-space:nowrap}
.cover-tab:hover:not(:disabled){background:#e4d0a51c}
.cover-tab:disabled,.nav-arrow:disabled{opacity:.35;cursor:default}
#closed-label{display:block;color:#bdac92;font-size:13px;letter-spacing:.12em}
#jump-form{gap:6px}
.note-host{display:block;text-align:right;font-size:14px;margin-top:10px}
.local-notice a{text-decoration:underline;text-underline-offset:3px;overflow-wrap:anywhere}
.email-fallback{margin-top:18px;display:flex;flex-direction:column;align-items:flex-start;gap:10px}
.email-fallback button{border:1px solid #aa977766;padding:8px 12px;font-size:14px;min-height:38px;color:#6d5b45}
.email-fallback span{font-size:12px;line-height:1.8;color:#917c61}
#saved-notes{margin-top:26px;border-top:1px solid #bfae8f55;padding-top:17px;font-size:12px;color:#816c50}
#saved-notes summary{cursor:pointer;line-height:1.8}
@media(max-width:800px){.reader-nav{grid-template-columns:auto 38px minmax(94px,1fr) 38px auto;gap:7px;width:calc(100% - 28px)}.reader-nav .nav-arrow{width:38px;height:42px}.cover-tab{padding:8px 6px}#page-input{width:36px}}
@media(max-width:360px){.reader-nav{grid-template-columns:auto 32px minmax(80px,1fr) 32px auto;gap:5px}.reader-nav .nav-arrow{width:32px;height:38px}.cover-tab{padding-inline:3px;font-size:13px}#jump-form{gap:3px}#jump-form>label{display:none}#page-input{width:32px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;transition-duration:.001ms!important;scroll-behavior:auto!important}}
/* Four quiet symbols. The closed front cover only offers its corner opening. */
.reader-nav{grid-template-columns:repeat(4,44px);width:auto;gap:20px}
.reader-nav .nav-arrow{position:relative;display:grid;place-items:center;width:44px;height:44px;padding:10px;border:0;border-radius:50%;color:#e8d9bf}
.nav-arrow svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
.nav-arrow:after{content:attr(data-tip);position:absolute;bottom:calc(100% + 9px);left:50%;transform:translateX(-50%);padding:7px 10px;border-radius:4px;background:#30271fea;color:#eee3ce;font-size:12px;white-space:nowrap;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .15s}
.nav-arrow:not(:disabled):hover:after,.nav-arrow:not(:disabled):focus-visible:after{opacity:1;visibility:visible}
@media(max-width:800px){.reader-nav{grid-template-columns:repeat(4,44px);gap:16px;width:auto}}
.book{z-index:2;pointer-events:none}.book .spread,.book .cover{pointer-events:auto}
.title-page h2{white-space:nowrap;flex-shrink:0;font-size:clamp(30px,calc(var(--page-h) / 18),42px);margin:24px 0}
.book:not(.open) .spread,.book.closed-back .spread{pointer-events:none}
.book.open .front-cover{pointer-events:none}
.toolbar-actions{display:flex;align-items:center;gap:26px}
.music-button{min-width:64px;min-height:44px;transition:color .15s,background-color .15s;position:relative}
.music-button svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.music-button[aria-pressed="true"]{color:#f8eddb}
.music-button[aria-pressed="true"]:after{content:"";position:absolute;left:0;right:0;bottom:4px;height:1px;background:currentColor;opacity:.65}
.music-status{position:fixed;z-index:9;top:70px;right:38px;max-width:calc(100vw - 28px);margin:0;padding:12px 16px;font-size:13px;line-height:1.7;color:#604d39;background:#f5efe2;border-radius:4px;box-shadow:0 4px 20px #17100b30}
.form-honeypot{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
#note-status:empty{display:none}#note-status{font-size:14px;line-height:1.8;margin-top:18px}
@media(max-width:800px){.book-stage{margin-left:0;flex-shrink:0}.toolbar-actions{gap:16px}.music-status{top:64px;right:14px}.music-button{min-width:44px;font-size:0;gap:0;justify-content:center}}
@media(max-width:360px){.toolbar-actions{gap:8px}.toolbar{padding-inline:14px}.wordmark{font-size:19px;letter-spacing:.1em}.tool-button{gap:5px;font-size:12px}.music-button{font-size:0}}
/* Cover motion has one timeline and no delayed fade or invisible animated layer. */
.front-cover{transition:none}
.book.open .front-cover{display:none}
.open-leaf{display:none;position:absolute;left:50%;top:0;width:50%;height:100%;z-index:7;transform-origin:left center;transform-style:preserve-3d;pointer-events:none}
.book.opening .open-leaf{display:block;will-change:transform;animation:openFrontCover .56s cubic-bezier(.3,.15,.35,1) both}
.opening-face{position:absolute;inset:0;backface-visibility:hidden}
.opening-cloth.cover{left:0;top:0;width:100%;height:100%;transition:none}
.opening-paper{transform:rotateY(180deg);background:#faf5e9;overflow:hidden;border-radius:4px 0 0 3px}
.opening-paper .page-body{left:42px;right:45px}
.book.opening .spread{transition:none;opacity:1;box-shadow:none}
@media(min-width:801px){.book.opening .left-page{visibility:hidden}}
.book.rewinding .front-cover{display:block;visibility:visible;will-change:transform}
.open-corner svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
@keyframes openFrontCover{from{transform:rotateY(0)}to{transform:rotateY(-180deg)}}
@media(max-width:800px){.open-leaf{left:0;width:100%;transform-origin:left center}.opening-paper{visibility:hidden}}
.music-tools{display:flex;align-items:center;gap:2px}
.music-button.is-playing{color:#fff5df}
.music-button.is-playing:after{content:"";position:absolute;inset:auto 0 4px;height:1px;background:currentColor;opacity:.65}
.music-quick-pause{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;padding:12px}
.music-quick-pause:hover{background:#e4d0a51c}
.music-quick-pause svg,#music-dialog svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
#music-dialog{width:min(480px,calc(100vw - 32px));max-height:calc(100svh - 48px);overflow:auto;overscroll-behavior:contain;border:1px solid #d4c6af;border-radius:12px;padding:30px;background:#f8f3e8;color:#473d32;box-shadow:0 18px 60px #160d0840}
#music-dialog::backdrop{background:#1c140ec2}
.music-header{display:flex;align-items:flex-start;gap:16px;justify-content:space-between}
.music-header .eyebrow{font-size:11px;color:#756652}
.music-header h2{font:25px/1.55 var(--serif);margin:12px 0 0;text-wrap:balance}
.music-header .icon-button{display:grid;place-items:center;width:44px;height:44px;flex-shrink:0;margin:-12px -12px 0 0;border-radius:50%}
.music-header .icon-button:hover{background:#e9dfce}
#music-description{font-size:13px;line-height:1.8;color:#72644f;margin:14px 0 22px}
.music-tracks{list-style:none;padding:0;margin:0;border-top:1px solid #d8ccb8;max-height:min(38svh,360px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#ac987d transparent}
.music-tracks li{border-bottom:1px solid #ded4c4}
.music-track{width:100%;display:flex;align-items:center;gap:14px;text-align:left;padding:15px 10px;min-height:68px;border-radius:4px;transition:background-color .15s}
.music-track:hover{background:#eee6d8}
.music-track[aria-current]{background:#e8ddca}
.track-number{font:13px Georgia,serif;color:#786851;min-width:18px}
.track-copy{display:flex;flex-direction:column;gap:5px;flex:1;min-width:0}
.track-title{font-size:15px;line-height:1.45;overflow-wrap:anywhere}
.track-artist{font-size:12px;color:#766750;line-height:1.5}
.track-state{font-size:11px;white-space:nowrap;color:#69553d}
.music-player{margin-top:24px}
#music-now{font-size:12px;line-height:1.7;color:#72644f;margin:0 0 12px;overflow-wrap:anywhere}
.music-transport{display:flex;align-items:center;gap:18px}
.music-play{min-height:44px;display:flex;align-items:center;gap:8px;font-size:14px;white-space:nowrap;padding:8px 12px;border-radius:6px;background:#69503d;color:#fff8eb}
.music-play:hover{background:#55412f}
.music-progress{flex:1;min-width:0}
#music-seek{display:block;width:100%;height:28px;margin:0;accent-color:#7b6247;cursor:pointer;touch-action:auto}
.music-time{display:flex;justify-content:space-between;gap:12px;font-size:11px;font-variant-numeric:tabular-nums;color:#72644f}
#music-status{margin:14px 0 0;font-size:13px;line-height:1.7;color:#733e33}
#music-status:empty{display:none}
#music-dialog :focus-visible,.open-corner:focus-visible{outline:2px solid #88734f;outline-offset:3px}
.open-corner:focus-visible{outline-color:#f0d6a6;outline-offset:-4px}
.music-tools :focus-visible{outline:2px solid #e4d3b4;outline-offset:2px}
@media(max-width:800px){.toolbar-actions{gap:10px}.music-tools{gap:0}.music-quick-pause{width:44px;min-height:44px;padding:11px}}
@media(max-width:480px){#toc-toggle{font-size:0;gap:0;width:44px;height:44px;justify-content:center}.music-button{min-width:44px}}
@media(max-width:360px){.toolbar-actions{gap:6px}.wordmark{font-size:18px;letter-spacing:.05em}#music-dialog{padding:24px 18px}.music-header h2{font-size:23px}.music-track{gap:10px;padding-inline:6px}.track-state{font-size:10px}}

/* Unframed photographs: the caption takes its natural height before the image is sized. */
.album-photo{position:relative;isolation:isolate;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:24px;height:100%;margin:0;padding:24px 10px;font-size:15px;line-height:1.8}
.album-image{position:relative;min-height:0;flex:0 1 auto;max-width:100%;display:flex;align-items:center;justify-content:center}
.album-image:before,.chapter-page:after{content:none;display:none}
.album-image button{display:flex;align-items:center;justify-content:center;min-height:0;max-width:100%;height:100%;padding:0;border:0;background:transparent;border-radius:0;box-shadow:none;cursor:zoom-in}
.album-image img{display:block;width:auto;height:auto;min-width:0;min-height:0;max-width:100%;max-height:100%;object-fit:contain;filter:none;border:0;border-radius:0;box-shadow:none}
.album-caption{flex:none;align-self:stretch;margin:0;font-family:"Kaiti SC","STKaiti",var(--serif);font-size:inherit;line-height:inherit;color:var(--ui-secondary);text-align:start;overflow-wrap:anywhere}
.album-photo-long{font-size:14px;line-height:1.75}
@media(max-width:800px){.album-photo{padding:18px 4px;gap:22px}}

/* Centered album edition — one quiet canvas, one compact control surface. */
:root{
  --viewer-bg:#efdfdd;--surface:#fffdfb;--paper:var(--surface);--surface-hover:#f4efed;
  --surface-selected:#eee6e3;--ui-text:#433d3b;--ui-secondary:#6d625e;
  --ui-line:#e3dad5;--ui-focus:#695750;--accent-solid:#76534d;
  --cover-duration:.68s;--return-duration:.62s;--cover-ease:linear;
}
body{background:var(--viewer-bg);color:var(--ui-text)}
body:before{display:none}
/* The reading paper and toolbar share one warm-white surface, including turning leaves. */
.page,.left-page,.right-page,.opening-paper,.closing-paper,.turn-leaf,.rewind-pages i,.rewind-pages i:nth-child(2){background:var(--paper)}
.page:after{content:none;background:none}
.right-page{border-left-color:var(--ui-line)}
.desk{min-height:100svh;padding:30px 76px 102px;align-items:center;justify-content:center}
.book-stage{margin:0;flex-shrink:0;perspective:5000px}
.book{transform:translateX(-25%)}
.book.open{transform:translateX(0)}
.book.closed-back{transform:translateX(25%)}
.book.opening{animation:centerOpen var(--cover-duration) var(--cover-ease) both}
.book.closing{animation:centerClose var(--cover-duration) var(--cover-ease) both}
.book.opening .open-leaf{animation-duration:var(--cover-duration);animation-timing-function:var(--cover-ease)}
.book.closing .close-leaf{animation-duration:var(--cover-duration);animation-timing-function:var(--cover-ease)}
.spread{transition:none;box-shadow:0 3px 0 var(--ui-line),0 5px 0 #7a554e,0 14px 30px #52312b22}
.cover{box-shadow:inset 7px 0 10px #14080744,inset -1px 0 1px #11050444,3px 3px 0 var(--ui-line),5px 5px 0 #68403e,0 16px 30px #52312b30}
.back-cover{box-shadow:inset -5px 0 8px #14080733,-3px 3px 0 var(--ui-line),-5px 5px 0 #68403e,0 16px 30px #52312b30}
.book.opening .opening-cloth{box-shadow:inset 7px 0 10px #14080744}
.book.opening .opening-cloth.cover{transform:none;opacity:1;display:block}
.book.open .spread{cursor:pointer}
.book.closing-ready .spread,.book.opening .spread{box-shadow:none}
.book.at-cover .front-cover{cursor:pointer}
@keyframes centerOpen{0%{transform:translateX(-25.0000%)}6.25%{transform:translateX(-25.0000%)}12.5%{transform:translateX(-25.0000%)}18.75%{transform:translateX(-25.0000%)}25%{transform:translateX(-25.0000%)}31.25%{transform:translateX(-25.0000%)}37.5%{transform:translateX(-25.0000%)}43.75%{transform:translateX(-25.0000%)}50%{transform:translateX(-25.0000%)}56.25%{transform:translateX(-17.4582%)}62.5%{transform:translateX(-10.8609%)}68.75%{transform:translateX(-5.8485%)}75%{transform:translateX(-2.5995%)}81.25%{transform:translateX(-0.8709%)}87.5%{transform:translateX(-0.1785%)}93.75%{transform:translateX(-0.0114%)}100%{transform:translateX(0.0000%)}}
@keyframes centerClose{0%{transform:translateX(0.0000%)}6.25%{transform:translateX(0.0114%)}12.5%{transform:translateX(0.1785%)}18.75%{transform:translateX(0.8709%)}25%{transform:translateX(2.5995%)}31.25%{transform:translateX(5.8485%)}37.5%{transform:translateX(10.8609%)}43.75%{transform:translateX(17.4582%)}50%{transform:translateX(25.0000%)}56.25%{transform:translateX(25.0000%)}62.5%{transform:translateX(25.0000%)}68.75%{transform:translateX(25.0000%)}75%{transform:translateX(25.0000%)}81.25%{transform:translateX(25.0000%)}87.5%{transform:translateX(25.0000%)}93.75%{transform:translateX(25.0000%)}100%{transform:translateX(25.0000%)}}
.return-leaf{display:none;position:absolute;left:0;top:0;width:50%;height:100%;transform-origin:right center;transform-style:preserve-3d;z-index:8;pointer-events:none}
.return-face{position:absolute;inset:0;backface-visibility:hidden}
.return-inside{transform:rotateY(180deg)}
.return-face>.page{width:100%}
.return-face .return-cover-copy.cover{left:0;width:100%;transform:none;opacity:1;display:block;visibility:visible;box-shadow:inset 5px 0 9px #14080733}
.book.rewinding{animation:centerReturn var(--return-duration) var(--cover-ease) both}
.book.rewinding.rewind-from-back{animation-name:centerReturnFromBack}
.book.rewinding .return-leaf{display:block;animation:returnFrontCover var(--return-duration) var(--cover-ease) both;will-change:transform}
.book.rewinding .front-cover,.book.rewinding .back-cover{display:none!important;animation:none}
.book.rewinding .left-page{visibility:hidden}
.book.rewinding .return-face>.left-page{visibility:visible}
.book.rewinding .spread{box-shadow:none}
.book.rewinding.rewind-from-back .spread{display:none}
@keyframes returnFrontCover{0%{transform:rotateY(0.0000deg)}6.25%{transform:rotateY(1.7293deg)}12.5%{transform:rotateY(6.8508deg)}18.75%{transform:rotateY(15.1677deg)}25%{transform:rotateY(26.3604deg)}31.25%{transform:rotateY(39.9987deg)}37.5%{transform:rotateY(55.5585deg)}43.75%{transform:rotateY(72.4419deg)}50%{transform:rotateY(90.0000deg)}56.25%{transform:rotateY(107.5581deg)}62.5%{transform:rotateY(124.4415deg)}68.75%{transform:rotateY(140.0013deg)}75%{transform:rotateY(153.6396deg)}81.25%{transform:rotateY(164.8323deg)}87.5%{transform:rotateY(173.1492deg)}93.75%{transform:rotateY(178.2707deg)}100%{transform:rotateY(180.0000deg)}}
@keyframes centerReturn{0%{transform:translateX(0.0000%)}6.25%{transform:translateX(-0.0114%)}12.5%{transform:translateX(-0.1785%)}18.75%{transform:translateX(-0.8709%)}25%{transform:translateX(-2.5995%)}31.25%{transform:translateX(-5.8485%)}37.5%{transform:translateX(-10.8609%)}43.75%{transform:translateX(-17.4582%)}50%{transform:translateX(-25.0000%)}56.25%{transform:translateX(-25.0000%)}62.5%{transform:translateX(-25.0000%)}68.75%{transform:translateX(-25.0000%)}75%{transform:translateX(-25.0000%)}81.25%{transform:translateX(-25.0000%)}87.5%{transform:translateX(-25.0000%)}93.75%{transform:translateX(-25.0000%)}100%{transform:translateX(-25.0000%)}}
@keyframes centerReturnFromBack{0%{transform:translateX(25.0000%)}6.25%{transform:translateX(24.9886%)}12.5%{transform:translateX(24.8215%)}18.75%{transform:translateX(24.1291%)}25%{transform:translateX(22.4005%)}31.25%{transform:translateX(19.1515%)}37.5%{transform:translateX(14.1391%)}43.75%{transform:translateX(7.5418%)}50%{transform:translateX(0.0000%)}56.25%{transform:translateX(-7.5418%)}62.5%{transform:translateX(-14.1391%)}68.75%{transform:translateX(-19.1515%)}75%{transform:translateX(-22.4005%)}81.25%{transform:translateX(-24.1291%)}87.5%{transform:translateX(-24.8215%)}93.75%{transform:translateX(-24.9886%)}100%{transform:translateX(-25.0000%)}}
@keyframes openFrontCover{0%{transform:rotateY(0deg)}6.25%{transform:rotateY(-1.7293deg)}12.5%{transform:rotateY(-6.8508deg)}18.75%{transform:rotateY(-15.1677deg)}25%{transform:rotateY(-26.3604deg)}31.25%{transform:rotateY(-39.9987deg)}37.5%{transform:rotateY(-55.5585deg)}43.75%{transform:rotateY(-72.4419deg)}50%{transform:rotateY(-90deg)}56.25%{transform:rotateY(-107.5581deg)}62.5%{transform:rotateY(-124.4415deg)}68.75%{transform:rotateY(-140.0013deg)}75%{transform:rotateY(-153.6396deg)}81.25%{transform:rotateY(-164.8323deg)}87.5%{transform:rotateY(-173.1492deg)}93.75%{transform:rotateY(-178.2707deg)}100%{transform:rotateY(-180deg)}}
@keyframes closeToLeft{0%{transform:rotateY(0deg)}6.25%{transform:rotateY(-1.7293deg)}12.5%{transform:rotateY(-6.8508deg)}18.75%{transform:rotateY(-15.1677deg)}25%{transform:rotateY(-26.3604deg)}31.25%{transform:rotateY(-39.9987deg)}37.5%{transform:rotateY(-55.5585deg)}43.75%{transform:rotateY(-72.4419deg)}50%{transform:rotateY(-90deg)}56.25%{transform:rotateY(-107.5581deg)}62.5%{transform:rotateY(-124.4415deg)}68.75%{transform:rotateY(-140.0013deg)}75%{transform:rotateY(-153.6396deg)}81.25%{transform:rotateY(-164.8323deg)}87.5%{transform:rotateY(-173.1492deg)}93.75%{transform:rotateY(-178.2707deg)}100%{transform:rotateY(-180deg)}}

.toolbar{position:fixed;inset:auto auto max(18px,env(safe-area-inset-bottom)) 50%;transform:translateX(-50%);height:60px;width:max-content;max-width:calc(100vw - 24px);padding:7px 10px;display:flex;gap:4px;align-items:center;justify-content:center;background:var(--surface);color:var(--ui-text);border:0;border-radius:12px;box-shadow:0 0 0 1px #00000008,0 2px 4px #00000008,0 8px 24px #52312b0f;z-index:8}
.toolbar .tool-button{position:relative;display:flex;justify-content:center;align-items:center;gap:7px;min-width:44px;min-height:44px;padding:9px 12px;font-size:13px;letter-spacing:0;border-radius:6px;color:var(--ui-text);transition:background-color .15s,color .15s,scale .15s}
.toolbar .tool-button>span{font-size:13px;font-weight:400;white-space:nowrap}
.toolbar #toc-toggle{width:auto;font-size:13px;gap:7px}
.toolbar .edge-tool{padding:10px}
.toolbar svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.toolbar .music-button:after{display:none}
.toolbar .music-button.is-playing{color:var(--accent-solid);background:var(--surface-selected)}
.tool-divider{height:20px;width:1px;background:var(--ui-line);margin-inline:4px}
.tool-button:active:not(:disabled),.music-play:active,.icon-button:active{scale:.96}
.reader-nav{position:fixed;inset:0;transform:none;display:block;width:auto;pointer-events:none;z-index:3}
.reader-nav .nav-arrow{position:absolute;top:calc(50% - 36px);transform:translateY(-50%);width:48px;height:56px;display:grid;place-items:center;padding:9px;border:0;border-radius:10px;background:transparent;color:#755c57;pointer-events:auto;transition:background-color .15s,color .15s}
#prev{left:18px}#next{right:18px}
.reader-nav .nav-arrow svg{width:30px;height:30px;stroke-width:1.5}
.toolbar .tool-button:after,.nav-arrow:after{content:attr(data-tip);position:absolute;inset:auto auto calc(100% + 10px) 50%;transform:translateX(-50%);background:#433d3b;color:#fffdfb;padding:6px 9px;border-radius:5px;font:12px/1.5 var(--ui);white-space:nowrap;pointer-events:none;opacity:0;visibility:hidden;transition:opacity .15s}
.nav-arrow:after{bottom:auto;top:calc(100% + 8px)}
.toolbar .tool-button:focus-visible:after,.nav-arrow:focus-visible:after{opacity:1;visibility:visible}

.side-panel{width:min(368px,calc(100vw - 24px));padding:28px;background:var(--surface);color:var(--ui-text);box-shadow:0 8px 36px #433d3b1a;overscroll-behavior:contain}
.panel-shade{background:#433d3b26;backdrop-filter:none}
.panel-head{margin-bottom:28px;align-items:center}
.panel-head .eyebrow{display:none}
.panel-head h2{font:500 23px/1.4 var(--ui);letter-spacing:0;margin:0}
.panel-head .icon-button{width:44px;height:44px;border-radius:50%;color:var(--ui-secondary);margin-inline-end:-10px}
.search-wrap{border:0;border-radius:8px;background:var(--surface-hover);padding-inline:12px;gap:8px}
.search-wrap>span{font-size:25px;color:var(--ui-secondary)}
.search-wrap input{font-size:16px;color:var(--ui-text)}
.search-wrap:focus-within{background:var(--surface-hover);outline:2px solid var(--ui-focus);outline-offset:2px}
.search-status,.panel-foot,#contents .toc-page,#search-results small{color:var(--ui-secondary)}
#contents button,#search-results button{padding:12px 10px;border-radius:6px;min-height:44px}
#contents button:hover,#search-results button:hover{background:transparent;color:var(--ui-text)}
#contents button.active,#contents button.active:hover{background:var(--surface-selected);color:var(--ui-text)}
#contents button.level3{color:var(--ui-secondary)}
#contents .toc-chapter{color:var(--ui-text);font-family:var(--ui);font-weight:500;border-color:var(--ui-line)}
.note-intro{font:15px/1.8 var(--ui);color:var(--ui-secondary);margin:0 0 28px}
#note-form label{font-size:13px;color:var(--ui-text);margin:22px 0 9px}
#note-form input,#note-form textarea{border:1px solid var(--ui-line);background:var(--surface-hover);border-radius:8px;font:16px/1.8 var(--ui);padding:11px 12px;color:var(--ui-text)}
#note-form textarea{min-height:170px}
.submit-note{background:var(--accent-solid);color:#fffdfb;padding:13px 16px;min-height:48px;border-radius:8px;font-size:14px;margin-top:22px;align-items:center}

#music-dialog{width:min(460px,calc(100vw - 32px));max-height:calc(100svh - 40px);padding:24px;border:0;border-radius:16px;background:var(--surface);color:var(--ui-text);box-shadow:0 0 0 1px #00000006,0 24px 80px #433d3b33}
#music-dialog::backdrop{background:#433d3b45}
.music-header{align-items:center;gap:12px;margin-bottom:20px}
.music-header h2{font:600 20px/1.55 var(--ui);margin:0;text-wrap:initial;letter-spacing:0}
.music-header .icon-button{margin:0 -8px 0 0;width:44px;height:44px;color:var(--ui-secondary)}
#music-dialog .icon-button svg{width:20px;height:20px}
.music-tracks{max-height:min(49svh,408px);border:0;margin:0 -8px;scrollbar-color:#bbb0aa transparent}
.music-tracks li{border:0}
.music-track{min-height:64px;padding:12px 10px;gap:12px;border-radius:8px;color:var(--ui-text);background:transparent}
.music-track[aria-current]{background:var(--surface-selected)}
.music-track[aria-current] .track-title{font-weight:600}
.track-number{font:12px var(--ui);font-variant-numeric:tabular-nums;min-width:20px;color:var(--ui-secondary)}
.track-copy{gap:3px}
.track-title{font-size:14px;line-height:1.5;overflow-wrap:break-word}
.track-artist{font-size:12px;color:var(--ui-secondary);line-height:1.5}
.track-state{color:var(--ui-text);width:16px;text-align:center;flex-shrink:0}
#music-dialog .track-state svg{width:16px;height:16px;stroke-width:2}
.track-selected{font-size:20px}
.music-player{margin-top:20px;padding-top:14px;border-top:1px solid var(--ui-line)}
.music-transport{gap:18px;align-items:flex-start}
.music-play{position:relative;display:block;flex-shrink:0;width:44px;height:44px;min-height:44px;margin-top:0;padding:10px;background:transparent;color:var(--ui-text);border-radius:50%;transition:background-color .15s,scale .15s}
#music-dialog .music-play svg{position:absolute;inset:10px;width:24px;height:24px;fill:currentColor;stroke:none;transition:opacity .15s,scale .15s,filter .15s;transition-timing-function:cubic-bezier(.2,0,0,1)}
.music-play .play-symbol{translate:1px 0}
.music-play .pause-symbol,.music-play.is-active .play-symbol{opacity:0;scale:.25;filter:blur(4px)}
.music-play.is-active .pause-symbol{opacity:1;scale:1;filter:blur(0)}
.music-progress{padding-top:0}
#music-seek{appearance:none;-webkit-appearance:none;background:transparent;height:28px;width:100%;margin:0;accent-color:var(--ui-text);--progress:0%}
#music-seek::-webkit-slider-runnable-track{height:4px;border-radius:4px;background:linear-gradient(to right,var(--ui-text) var(--progress),var(--ui-line) var(--progress))}
#music-seek::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:10px;height:10px;border-radius:50%;margin-top:-3px;background:var(--ui-text)}
#music-seek::-moz-range-track{height:4px;border-radius:4px;background:var(--ui-line)}
#music-seek::-moz-range-progress{height:4px;border-radius:4px;background:var(--ui-text)}
#music-seek::-moz-range-thumb{width:10px;height:10px;border:0;border-radius:50%;background:var(--ui-text)}
.music-time{font-size:10px;color:var(--ui-secondary)}
.toolbar button:focus-visible,.nav-arrow:focus-visible,.side-panel button:focus-visible,#music-dialog :focus-visible,#share-dialog :focus-visible{outline:2px solid var(--ui-focus);outline-offset:3px}
#note-form input:focus-visible,#note-form textarea:focus-visible{outline:2px solid var(--ui-focus);outline-offset:2px;box-shadow:none;border-color:var(--ui-line)}
.loading{bottom:96px;background:var(--surface);color:var(--ui-secondary);border-radius:8px;box-shadow:0 4px 18px #433d3b12}
#announcement,#qa-results{top:0;left:0;margin:0}
@media(hover:hover){
  .toolbar .tool-button:hover:not(:disabled),.reader-nav .nav-arrow:hover:not(:disabled),.music-play:hover,.music-header .icon-button:hover,.panel-head .icon-button:hover{background:var(--surface-hover)}
  .toolbar .tool-button:hover:not(:disabled):after,.reader-nav .nav-arrow:hover:not(:disabled):after{opacity:1;visibility:visible}
  #contents button:hover,#search-results button:hover,.music-track:hover{background:var(--surface-hover);color:var(--ui-text)}
  #contents button.active:hover,.music-track[aria-current]:hover{background:var(--surface-selected);color:var(--ui-text)}
}
@media(max-width:800px){
  .desk{padding:24px 26px 110px;min-height:100svh;align-items:center}
  .book-stage{margin:0}
  .book,.book.open,.book.closed-back{transform:none}
  .book.opening,.book.closing,.book.rewinding,.book.rewinding.rewind-from-back{animation:none}
  .book.opening .open-leaf{transform-origin:center;animation-duration:.38s}
  .book.closing .close-leaf{left:0;width:100%;transform-origin:center;animation-duration:.38s}
  .return-leaf{width:100%;transform-origin:center}
  .book.rewinding .return-leaf{animation-duration:.38s}
  .reader-nav .nav-arrow{width:40px;height:52px;border-radius:8px;top:calc(50% - 44px);padding:8px 2px}
  #prev{left:0}#next{right:0}
  .reader-nav .nav-arrow svg{width:23px;height:23px}
  .reader-nav .nav-arrow:after{display:none}
  .toolbar{height:58px;padding:7px 8px;gap:0;bottom:max(18px,env(safe-area-inset-bottom))}
  .toolbar .tool-button{padding-inline:10px;font-size:13px;gap:6px;width:auto}
  .toolbar .tool-divider{margin-inline:2px}
  .side-panel{padding:24px}
}
@media(max-width:540px){
  .toolbar .tool-button{padding-inline:8px}
  .toolbar .tool-button>span{display:none}
  .toolbar .tool-divider{margin-inline:3px}
}
@media(max-width:360px){
  #music-dialog{padding:20px;width:calc(100vw - 24px)}
  .music-header h2{font-size:18px}
  .music-track{padding:11px 8px;gap:9px}
  .music-transport{gap:12px}
}
@media(prefers-reduced-motion:reduce){.book,.book.opening,.book.closing,.book.rewinding,.return-leaf,.open-leaf,.close-leaf{animation:none!important}.music-play svg,.tool-button,.side-panel{transition:none!important}}
@media(forced-colors:active){button:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid Highlight!important}.toolbar,#music-dialog,#share-dialog{border:1px solid CanvasText}#music-seek{appearance:auto}}

/* Sharing stays entirely on-device until the visitor chooses a destination. */
#share-dialog{width:min(400px,calc(100vw - 32px));max-height:calc(100svh - 32px);padding:24px;border:0;border-radius:16px;background:var(--surface);color:var(--ui-text);box-shadow:0 0 0 1px #00000006,0 24px 80px #433d3b33;overscroll-behavior:contain;font-family:var(--ui)}
#share-dialog::backdrop{background:#433d3b45}
.share-header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:22px}
.share-header h2{margin:0;font:600 20px/1.55 var(--ui)}
.share-header .icon-button{width:44px;height:44px;margin-inline-end:-8px;flex-shrink:0;color:var(--ui-secondary);border-radius:50%}
#share-dialog svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.share-header .icon-button svg{width:20px;height:20px}
.share-book{display:flex;align-items:center;gap:20px;padding-bottom:24px;border-bottom:1px solid var(--ui-line);margin-bottom:20px}
.share-cover{width:68px;height:92px;flex-shrink:0;display:grid;place-items:center;background:#53272c url('assets/cover.jpg') center/cover;border-radius:2px 4px 4px 2px;box-shadow:0 0 0 1px #0000001a,0 4px 10px #433d3b1a;color:#e1c598}
#share-dialog .share-cover svg{width:46px;height:56px;fill:currentColor;stroke:none;opacity:.76}
.share-book-title{margin:0 0 8px;font:24px/1.5 var(--serif);letter-spacing:2px}
.share-book-subtitle{margin:0;font:13px/1.7 var(--ui);color:var(--ui-secondary)}
.share-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.share-action{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:16px 8px;min-height:110px;border-radius:10px;font:14px/1.5 var(--ui);color:var(--ui-text)}
.share-action-icon{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--surface-hover)}
.wechat-icon{color:#27784d}
#share-dialog .wechat-icon svg{width:28px;height:28px}
.share-action:disabled{opacity:.5;cursor:default}
#share-link-field{margin-top:16px}
#share-link{width:100%;min-height:44px;border:1px solid var(--ui-line);border-radius:8px;background:transparent;color:var(--ui-secondary);font:13px/1.6 var(--ui);padding:10px 12px;text-overflow:ellipsis}
.share-help{margin-top:18px;padding:14px 16px;border-radius:8px;background:var(--surface-hover);text-align:start}
.share-help h3{margin:0 0 6px;font:500 14px/1.6 var(--ui)}
.share-help p,.share-availability,.share-status{font:13px/1.8 var(--ui);color:var(--ui-secondary);margin:0;overflow-wrap:break-word}
.share-availability,.share-status{margin-top:18px;text-align:center}
.share-availability:empty,.share-status:empty{display:none}
.share-system{display:flex;align-items:center;justify-content:center;gap:4px;width:100%;min-height:44px;margin-top:12px;border-radius:8px;font:13px/1.6 var(--ui);color:var(--ui-secondary)}
#share-dialog .share-system svg{width:15px;height:15px}
@media(hover:hover){.share-action:not(:disabled):hover,.share-system:hover,.share-header .icon-button:hover{background:var(--surface-hover)}}
@media(max-width:360px){#share-dialog{padding:20px;width:calc(100vw - 24px)}.share-book{gap:16px}.share-action{padding-inline:4px}}
