:root{color-scheme:light;--ink:#434940;--quiet:#72776d;--paper:#fffefa;--page-ratio:612/792;--book-width:1000px;--book-height:647px}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}body{font:14px/1.5 "Segoe UI","Microsoft YaHei",sans-serif;color:var(--ink);background:#e5e5e1;background-image:radial-gradient(ellipse at 50% 39%,#f2f2ee 0%,#e5e5e1 62%,#d6d7d2 100%)}button,a,input{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button:disabled{opacity:.25;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid #6a795f;outline-offset:5px}svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.45;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.chrome{position:fixed;z-index:5;transition:opacity .7s ease,transform .7s ease}.header{top:0;left:0;right:0;height:78px;display:flex;align-items:center;justify-content:space-between;padding:0 42px}.wordmark{display:flex;gap:10px;align-items:center;text-decoration:none;color:#4b5448;font-size:17px;letter-spacing:4px;font-family:"Songti SC",SimSun,serif}.wordmark svg{width:23px;height:23px;stroke-width:1.2}.document-name{position:absolute;left:50%;transform:translateX(-50%);color:var(--quiet);font-size:13px;letter-spacing:.8px}.header-tools{display:flex;gap:9px}.icon-button{border:0;background:transparent;width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;transition:background .2s,opacity .2s}.icon-button:hover:not(:disabled){background:#79816b15}.sound-off{display:none}body.muted .sound-on{display:none}body.muted .sound-off{display:block}.stage{height:100%;display:grid;place-items:center;padding:80px 38px 95px;perspective:2400px}.book{position:relative;width:var(--book-width);height:var(--book-height);isolation:isolate;transform:translateY(-3px);perspective:2400px;touch-action:pan-y;user-select:none;-webkit-user-select:none}.book-cover{position:absolute;inset:-5px -7px -12px;border-radius:3px 5px 7px 7px;background:#5a6258;box-shadow:0 30px 45px -22px #343c3670,0 10px 20px -8px #343c3630;z-index:-2}.paper-stack{position:absolute;inset:3px -3px -7px;border-radius:1px 3px 5px 5px;background:repeating-linear-gradient(to bottom,#d1d0c8 0px,#eeeee7 1px,#faf9f3 2px,#eeeee7 3px);border:1px solid #bcbeb3;z-index:-1;box-shadow:0 2px 2px #0002}.page{position:absolute;top:0;width:50%;height:100%;padding:0;border:0;border-radius:0;background:var(--paper);overflow:hidden;display:block;outline-offset:8px!important}.page img,.sheet-face img{display:block;width:100%;height:100%;object-fit:contain;background:#fffefa;mix-blend-mode:multiply;pointer-events:none}.page img.empty,.sheet-face img.empty{visibility:hidden}.left-page{left:0;border-radius:2px 0 0 2px}.right-page{right:0;border-radius:0 2px 2px 0}.page-shading{position:absolute;inset:0;pointer-events:none}.left-page .page-shading{background:linear-gradient(90deg,#8b846b08,transparent 9%,transparent 86%,#90897508 94%,#443d2825 100%)}.right-page .page-shading{background:linear-gradient(90deg,#443d2828, #9089750b 5%,transparent 15%,transparent 94%,#8b846b08)}.spine{position:absolute;top:0;bottom:0;left:50%;width:3px;transform:translateX(-50%);background:linear-gradient(90deg,#403b292d,#ffffff35,#403b2922);pointer-events:none;z-index:3}.turn-sheet{position:absolute;top:0;left:50%;width:50%;height:100%;transform-origin:left center;transform-style:preserve-3d;z-index:4;will-change:transform;pointer-events:none}.turn-sheet[hidden]{display:none}.turn-sheet.backward{left:0;transform-origin:right center}.sheet-face{position:absolute;inset:0;background:var(--paper);backface-visibility:hidden;-webkit-backface-visibility:hidden;overflow:hidden;box-shadow:0 0 1px #a4a190}.sheet-back{transform:rotateY(180deg)}.turn-shade{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,#3f37261c,transparent 22%,#fff5 65%,#45403518);opacity:var(--shade,.12)}.sheet-back .turn-shade{background:linear-gradient(270deg,#3f372622,transparent 30%,#fff7 70%,#45403522)}.loading{position:absolute;inset:0;display:flex;justify-content:center;align-items:center;background:#faf9f5;z-index:4;color:var(--quiet);letter-spacing:1px}.loading[hidden]{display:none}.footer{bottom:28px;left:42px;right:42px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px}.reading-hint,.end-hint{color:#73796e;font-size:12px;letter-spacing:.3px}.reading-hint kbd{font-family:inherit;margin-left:4px}.end-hint{text-align:right}.reading-controls{display:flex;gap:9px;align-items:center;padding:4px 10px;border:1px solid #858b761c;background:#f8f8f16b;box-shadow:0 4px 12px #414a3605;border-radius:50px;backdrop-filter:blur(12px)}.page-count{border:0;background:none;min-width:97px;padding:9px 5px;font-size:14px;font-variant-numeric:tabular-nums}.page-count span{color:#808578;margin-left:7px;font-size:12px}.control-divider{height:18px;width:1px;background:#858b7630;margin:0 2px}.progress-track{position:fixed;bottom:0;left:0;right:0;height:2px;background:#6571510e}.progress-track div{height:100%;width:0;background:#78876b65;transition:width .7s ease}.reading .chrome{opacity:0;transform:translateY(-3px);pointer-events:none}.reading .footer{transform:translateY(5px)}.reading .chrome:hover,.reading .chrome:focus-within{opacity:1;transform:none;pointer-events:auto}.error{position:fixed;max-width:420px;padding:20px;background:#faf9f5;box-shadow:0 10px 40px #0001;border-radius:8px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}dialog{color:var(--ink);border:1px solid #a1a68f36;background:#fafaf7}dialog::backdrop{background:#32382c50;backdrop-filter:blur(5px)}.jump-dialog{padding:24px;width:290px;border-radius:12px;box-shadow:0 20px 70px #0002}.dialog-heading{display:flex;align-items:center;justify-content:space-between}.dialog-heading label{font-size:16px}.jump-field{display:flex;align-items:center;gap:12px;margin:24px 0}.jump-field input{font:28px "Segoe UI",sans-serif;width:150px;padding:10px;border:1px solid #cfd3c7;border-radius:5px;color:var(--ink);background:white}.jump-field span{color:var(--quiet)}.go-button{width:100%;background:#59664f;color:#fff;border:0;padding:12px;border-radius:5px}.zoom-dialog{position:fixed;margin:auto;width:100vw;height:100vh;max-width:100vw;max-height:100vh;padding:0;border:0;background:#e2e3dd;overflow:hidden}.zoom-toolbar{display:flex;align-items:center;justify-content:space-between;height:64px;padding:0 26px;background:#f4f5efd9;border-bottom:1px solid #c7ccbc;gap:15px}.zoom-pagination{display:flex;align-items:center;gap:8px}.zoom-pagination span{min-width:65px;text-align:center;font-variant-numeric:tabular-nums}.zoom-range{display:flex;align-items:center;gap:12px;color:var(--quiet);font-size:13px}.zoom-range input{width:140px;accent-color:#667b55}.zoom-range output{width:40px;font-variant-numeric:tabular-nums}.zoom-scroll{height:calc(100% - 64px);overflow:auto;padding:30px;overscroll-behavior:contain}.zoom-scroll img{display:block;width:var(--zoom-width,1200px);max-width:none;height:auto;margin:0 auto;background:white;box-shadow:0 8px 35px #3333}.zoom-scroll::-webkit-scrollbar{width:9px;height:9px}.zoom-scroll::-webkit-scrollbar-thumb{background:#adb4a3;border-radius:8px}.zoom-scroll::-webkit-scrollbar-track{background:#e2e3dd}@media(max-width:800px){.header{height:62px;padding:0 18px}.stage{padding:65px 18px 98px}.footer{left:14px;right:14px;bottom:23px;display:flex;justify-content:center}.reading-hint,.end-hint{display:none}.document-name{font-size:12px}.wordmark{font-size:15px;gap:7px;letter-spacing:2px}.wordmark svg{width:19px}.header-tools{gap:1px}.zoom-toolbar{padding:0 12px}.zoom-range{gap:7px}.zoom-range input{width:85px}.zoom-range output{display:none}.zoom-scroll{padding:15px}}@media(max-width:420px){.document-name{display:none}.reading-controls{gap:4px}.stage{padding-left:12px;padding-right:12px}.zoom-pagination{gap:0}.zoom-range{font-size:12px}.zoom-toolbar{gap:4px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important}}@media print{.chrome,.progress-track,.spine,.book-cover,.paper-stack{display:none}.book{width:100%;height:auto}.stage{padding:0}.page{position:static;width:100%}.page img{height:auto}.page-shading{display:none}}
