@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+TC:wght@400;500;600&display=swap');
:root{--ink:#312c25;--gold:#bb995b;--paper:#f2e9d3;--serif:'Noto Serif TC','Songti TC','PMingLiU',serif}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:#29251d;color:#f5eedf;font-family:var(--serif);background-image:radial-gradient(circle at 68% 8%,#8e76553b,transparent 40%),linear-gradient(90deg,#211d17,#383029 50%,#211d17)}a{color:inherit;text-decoration:none}button{font:inherit}a:focus-visible,button:focus-visible{outline:2px solid #e7c984;outline-offset:4px}.site-header{height:70px;display:flex;justify-content:space-between;align-items:center;gap:18px;padding:0 clamp(20px,4vw,65px);border-bottom:1px solid #b69b6a49;font-size:11px;letter-spacing:.17em}.site-header .brand{font:600 16px Georgia,serif;letter-spacing:.27em}.site-header>a:last-child:hover,.return-link:hover{color:#eac787}.reader-shell{width:min(1600px,100%);margin:auto;display:grid;grid-template-columns:minmax(260px,340px) minmax(0,1fr);min-height:calc(100vh - 70px)}.contents{padding:clamp(30px,4vw,60px);border-right:1px solid #b69b6a49;max-height:calc(100vh - 70px);position:sticky;top:0;overflow:auto}.eyebrow{font:11px Georgia,serif;letter-spacing:.25em;color:#d1b678}.contents h1{font-size:clamp(40px,4vw,57px);font-weight:400;letter-spacing:.13em;margin:23px 0}.contents-top p{line-height:2.1;font-size:13px;letter-spacing:.1em;color:#d5c8b1}.serial-tag{display:inline-block;margin:23px 0 38px;border:1px solid #b9966c;padding:8px 13px;color:#e1bc7e;font-size:11px;letter-spacing:.17em}.contents-heading{border-top:1px solid #b69b6a49;padding:20px 0 13px;display:flex;justify-content:space-between;font-size:12px;letter-spacing:.14em}.contents-heading span{font-family:Georgia,serif;color:#bba77f}.contents nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.contents nav button{border:1px solid #b69b6a36;background:#fff0;color:#e2d5ba;text-align:left;padding:11px;font-size:11px;cursor:pointer}.contents nav button[aria-current="true"]{background:#b99d6b;color:#29251d}.contents nav button:hover{border-color:#d9bc83}.contents-note{font-size:11px;color:#a89c88;line-height:1.8;margin:23px 0}.book-section{padding:clamp(20px,4vw,56px);min-width:0}.book-toolbar{width:min(730px,100%);margin:auto auto 15px;display:flex;justify-content:space-between;color:#d0b88b;font:11px Georgia,var(--serif);letter-spacing:.17em}.book{position:relative;width:min(730px,100%);height:min(68vw,690px);min-height:530px;margin:auto;perspective:1700px;filter:drop-shadow(19px 23px 18px #100d0bcc)}.book:before{content:"";position:absolute;inset:8px -8px -8px 9px;background:repeating-linear-gradient(0deg,#d5c4a6 0 1px,#eadbc0 1px 3px);border:1px solid #b79b6c;border-radius:3px;transform:skewY(1deg)}.book-spine{position:absolute;z-index:2;inset:0 auto 0 0;width:24px;background:linear-gradient(90deg,#654a31,#d3b98b 40%,#f4e8ce);box-shadow:4px 0 9px #4d3a2a50}.paper{position:relative;z-index:1;height:100%;background:var(--paper);color:var(--ink);padding:clamp(27px,4vw,57px) clamp(27px,5vw,70px) 35px clamp(43px,6vw,82px);display:flex;flex-direction:column;border:1px solid #c9b38e;box-shadow:inset 12px 0 17px #ac8e5a21,inset -12px 0 25px #bca37a2a;transform-origin:left center;backface-visibility:hidden}.paper:before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.2;background:radial-gradient(#977c51 0.4px,transparent 0.7px);background-size:9px 9px}.paper.turn-next{animation:turn-next .5s ease-in-out}.paper.turn-previous{animation:turn-previous .5s ease-in-out}@keyframes turn-next{0%{transform:rotateY(0)}48%{transform:rotateY(-65deg);filter:brightness(.75)}100%{transform:rotateY(0)}}@keyframes turn-previous{0%{transform:rotateY(0)}48%{transform:rotateY(65deg);filter:brightness(.85)}100%{transform:rotateY(0)}}.page-heading,.page-foot{position:relative;display:flex;justify-content:space-between;gap:15px;font:10px Georgia,var(--serif);letter-spacing:.16em;color:#877352}.page-heading{padding-bottom:14px;border-bottom:1px solid #c9b995}.page-foot{padding-top:15px;border-top:1px solid #c9b995}.page-content{position:relative;overflow-y:auto;flex:1;padding:30px 12px 18px 0;scrollbar-color:#b5a078 transparent;scrollbar-width:thin}.page-content p{font-size:clamp(15px,1.35vw,18px);line-height:2.15;letter-spacing:.045em;margin:0 0 1.2em;overflow-wrap:anywhere}.page-content .chapter-opening{font-size:13px;letter-spacing:.26em;color:#9a784b;margin-bottom:28px}.page-content .continuing{font-size:14px;color:#826a4c;letter-spacing:.15em}.book-controls{width:min(730px,100%);margin:28px auto 13px;display:flex;align-items:center;justify-content:space-between;gap:15px}.book-controls button{border:1px solid #ad9367;background:#45382a;color:#f2e4c9;padding:12px 19px;cursor:pointer;font-size:12px;letter-spacing:.13em}.book-controls button:hover:not(:disabled){background:#725a3d}.book-controls button:disabled{opacity:.35;cursor:default}.book-controls span{font:12px Georgia,serif;color:#d3ba8d}.progress-track{width:min(730px,100%);height:3px;background:#6e5c45;margin:auto}.progress-track span{display:block;height:100%;width:0;background:#e2bb71;transition:width .3s}.reading-hint,.return-link{display:block;text-align:center;font-size:11px;letter-spacing:.1em;color:#ae9f88;line-height:2;margin:17px auto}.return-link{margin-top:29px;color:#dfc390}.series-end{text-align:center;padding-top:25%;font-size:clamp(22px,3vw,35px);letter-spacing:.18em;color:#765a35}.series-end small{display:block;font-size:12px;margin-top:20px;letter-spacing:.16em;color:#947d61}
@media(max-width:880px){.reader-shell{display:block}.contents{position:static;max-height:none;border-right:0;border-bottom:1px solid #b69b6a49;padding:30px 22px}.contents-top h1{margin:10px 0}.contents-top p{margin:0}.serial-tag{margin:15px 0}.contents nav{display:flex;overflow:auto;scrollbar-width:none}.contents nav::-webkit-scrollbar{display:none}.contents nav button{white-space:nowrap}.contents-note{display:none}.book-section{padding:25px 18px 60px}.book{height:670px}}@media(max-width:500px){.site-header{height:58px;padding:0 15px}.site-header>span{display:none}.site-header>a:last-child{font-size:10px}.book{height:min(75vh,620px);min-height:450px}.paper{padding:23px 23px 24px 38px}.page-content{padding-top:23px}.page-content p{font-size:15px;line-height:1.95}.book-controls button{padding:11px}.contents{padding:24px 17px}}@media(prefers-reduced-motion:reduce){.paper.turn-next,.paper.turn-previous{animation:none}.progress-track span{transition:none}}
