:root{--page-w: clamp(280px, 28vw, 390px);--page-h: clamp(430px, 64vh, 530px);--board: 132px;--ink: #2a241c;--gold: #e4c77a;--gold-deep: #9a7436;--blue: #14386e;--paper: #f7f1e4;color-scheme:dark;font-family:"Noto Serif TC",PMingLiU,Songti TC,serif}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:#000;color:#f4ecdc}button,input,textarea,select{font:inherit}.desk,.admin-shell{min-height:100vh}.scene{position:relative;min-height:100vh;display:flex;flex-wrap:wrap;justify-content:safe center;align-items:safe center;align-content:safe center;gap:42px;padding:36px 28px 48px}.lang-menu{position:absolute;top:28px;right:28px;z-index:6;display:flex;align-items:center;justify-content:flex-end;gap:12px;margin:0;color:#eadcc4;font-size:14px;letter-spacing:.12em}.lang-menu select{min-width:132px;border:1px solid rgba(228,199,122,.5);border-radius:999px;background:#241910;color:#f4ecdc;padding:8px 14px;cursor:pointer}.lang-menu select:focus{outline:none;border-color:#e4c77a;box-shadow:0 0 0 3px #e4c77a40}.stage{position:relative;z-index:1;isolation:isolate;flex:0 0 auto}.book-slot{position:relative;width:var(--page-w);height:calc(var(--page-h) + 48px);display:flex;justify-content:center;align-items:flex-start;padding-top:6px;perspective:6200px;transition:width 1s cubic-bezier(.77,0,.18,1),height 1s cubic-bezier(.77,0,.18,1)}.book-slot.is-open{width:calc(var(--page-w) * 2);height:var(--page-h);align-items:center}.rest-shadow{position:absolute;left:8%;right:2%;bottom:10px;height:28px;background:#00000080;filter:blur(14px);border-radius:50%}.book{position:absolute;right:0;top:6px;width:var(--page-w);height:var(--page-h);transform-style:preserve-3d;transform:rotateX(26deg) rotateY(28deg);transform-origin:center center;transition:transform 1s cubic-bezier(.77,0,.18,1),top 1s cubic-bezier(.77,0,.18,1);pointer-events:none}.book *{pointer-events:none}.book.is-shut .board-face,.book-slot.is-open .sheet.can-turn,.book-slot.is-open .cover-face.inside.can-turn{pointer-events:auto;cursor:pointer}.book-slot.is-open .book{top:0;transform:none;transition:transform .9s cubic-bezier(.33,0,.2,1) .28s,top 1s cubic-bezier(.77,0,.18,1)}.spine3d{position:absolute;left:0;top:0;width:var(--board);height:100%;transform-origin:left center;transform:rotateY(90deg);background:linear-gradient(90deg,#102646,#1b3d72 46%,#2c5696);opacity:1;visibility:visible;transition:opacity .45s ease,visibility 0s linear}.spine3d i{display:block;height:2px;margin:28px 10px 0;background:linear-gradient(90deg,transparent,#e4c56b 20%,#e4c56b 80%,transparent)}.spine3d i:last-child{position:absolute;left:10px;right:10px;bottom:28px;margin:0}.page-face{position:absolute;left:7px;right:5px;bottom:0;height:var(--board);transform-origin:center bottom;transform:rotateX(90deg);background:repeating-linear-gradient(#f4ecde 0,#f4ecde 3px,#c9b696 3px,#c9b696 4px);border-radius:0 0 18px 2px;opacity:1;transition:opacity .4s ease}.fore-edge{position:absolute;right:0;bottom:0;width:var(--board);height:36px;transform-origin:right bottom;transform:rotateY(-90deg);background:repeating-linear-gradient(90deg,#f3eadc 0,#f3eadc 3px,#d4c2a6 3px,#d4c2a6 4px);border-radius:0 0 14px;opacity:1;transition:opacity .4s ease}.book-slot.is-open .page-face,.book-slot.is-open .fore-edge{opacity:0;transition-delay:.72s}.book-slot.is-open .spine3d{opacity:0;visibility:hidden;transition:opacity .45s ease .72s,visibility 0s linear 1.17s}.sheet,.cover,.leaf{position:absolute;top:0;right:0;bottom:0;left:0}.sheet{display:flex;border-radius:0 7px 7px 0;overflow:hidden;background:var(--paper);box-shadow:8px 0 18px #00000029;transform:translateZ(0)}.cover{transform-style:preserve-3d;transform-origin:left center;transform:translateZ(.8px);transition:transform 1s cubic-bezier(.65,.02,.2,1)}.book-slot.is-open .cover{z-index:0;transform:rotateY(-180deg)}.book-slot.is-open .sheet,.riffle{z-index:2}.cover-face{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;-webkit-backface-visibility:hidden;backface-visibility:hidden}.cover-face.front{transform:rotateY(0);visibility:visible;transition:visibility 0s linear 0s}.book-slot.is-open .cover-face.front{visibility:hidden;transition:visibility 0s linear 1s}.face-clip{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;overflow:hidden;border-radius:inherit}.board-face{background:radial-gradient(ellipse at 28% 0%,rgba(255,255,255,.16),transparent 40%),linear-gradient(165deg,#3d68a4,#2c4f88 46%,#243f6e);color:#e4c56b;border-radius:3px 8px 8px 3px;box-shadow:inset 0 0 0 1px #0000002e}.runes{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:fill;transform-origin:0 0;pointer-events:none}.cover-corner{position:absolute;z-index:2;width:18%;aspect-ratio:1;pointer-events:none;background:radial-gradient(circle at 100% 100%,transparent 69%,#f6e7a8 70.2%,#f6e7a8 72.4%,#e4c56b 73.6%)}.cover-corner.tl{top:14px;left:14px}.cover-corner.tr{top:14px;right:14px;transform:scaleX(-1)}.cover-corner.bl{bottom:14px;left:14px;transform:scaleY(-1)}.cover-corner.br{bottom:14px;right:14px;transform:scale(-1)}.warp-editor{margin-top:18px}.warp-help{margin:0 0 12px;color:#d9ccb6;font-size:14px;line-height:1.7}.warp-stage{position:relative;width:min(320px,100%);aspect-ratio:390 / 530;touch-action:none;-webkit-user-select:none;user-select:none;cursor:grab}.warp-stage:active{cursor:grabbing}.warp-board{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden;border-radius:6px;background:radial-gradient(ellipse at 28% 0%,rgba(255,255,255,.16),transparent 40%),linear-gradient(165deg,#3d68a4,#2c4f88 46%,#243f6e)}.warp-lines{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;overflow:visible;pointer-events:none}.warp-lines polygon{fill:transparent;stroke:#e4c77ad9;stroke-width:.6;vector-effect:non-scaling-stroke}.warp-handle{position:absolute;z-index:2;width:18px;height:18px;margin:0;padding:0;border:2px solid #f3e2b0;border-radius:50%;background:#1a140c;transform:translate(-50%,-50%);cursor:grab;touch-action:none}.warp-handle:active{cursor:grabbing}.warp-editor>button{margin-top:12px}.cover-face.inside{transform:rotateY(180deg);background:#f7f1e4}.inside-edge{display:none}.page-fill{height:100%;min-width:0;flex:1;color:var(--ink);background:radial-gradient(ellipse at 0% 0%,rgba(255,255,255,.7),transparent 46%),linear-gradient(180deg,#fbf7ee,#f1e6d2)}.blank-page,.endpaper{width:100%}.left-page,.right-page{position:relative}.left-page{display:flex;flex-direction:column;justify-content:center;padding:48px 36px 48px 42px}.left-page h2{margin:0;font-size:42px;font-weight:700;letter-spacing:.12em;line-height:1.3}.book.lang-en .left-page h2{font-size:34px;letter-spacing:.02em}.book.lang-en .prose h3,.book.lang-en .running{letter-spacing:.04em}.rule{width:72px;height:1px;margin-top:22px;background:linear-gradient(90deg,var(--gold-deep),transparent)}.right-page{display:flex;flex-direction:column;min-height:0;padding:22px 22px 16px 32px}.right-page:before{content:"";position:absolute;inset:0 auto 0 0;width:26px;background:linear-gradient(90deg,rgba(70,48,20,.16),transparent);pointer-events:none}.running,.folio{display:flex;justify-content:space-between;color:#8a7760;font-size:12px;letter-spacing:.12em}.running{padding-bottom:8px;border-bottom:1px solid rgba(154,116,54,.35)}.prose{flex:1;min-height:0;overflow:auto;padding:16px 8px 8px 6px}.prose h3{margin:0 0 12px;font-size:22px;letter-spacing:.08em}.page-photo{display:block;width:100%;max-height:220px;object-fit:contain;margin:0 0 12px;border-radius:6px;background:#ffffff73}.prose p,.blank-copy{margin:0 0 14px;font-size:16px;line-height:1.95}.folio{justify-content:center;padding-top:6px}.prose::-webkit-scrollbar{width:8px}.prose::-webkit-scrollbar-thumb{background:#785c3059;border-radius:8px}.flying-page{display:flex;align-items:flex-end;justify-content:center;padding-bottom:16px;color:#b7a88e;letter-spacing:.14em;background:repeating-linear-gradient(transparent 0 28px,#a88e6029 29px),linear-gradient(#fbf7ee,#efe3cf)}.riffle{position:absolute;top:0;right:0;bottom:0;left:0;transform-style:preserve-3d;transform-origin:left center;animation:riffle .56s cubic-bezier(.4,.02,.18,1) forwards;pointer-events:none}@keyframes riffle{0%{transform:translateZ(2px) rotateY(0)}to{transform:translateZ(2px) rotateY(-178deg)}}.riffle.riffle-prev{animation-name:riffle-prev;z-index:3}@keyframes riffle-prev{0%{transform:translateZ(8px) rotateY(-178deg)}to{transform:translateZ(8px) rotateY(0)}}.leaf-face{position:absolute;top:0;right:0;bottom:0;left:0;-webkit-backface-visibility:hidden;backface-visibility:hidden;background:#f7f1e4;border-radius:0 7px 7px 0}.leaf-face .page-fill,.leaf-face .flying-page{overflow:hidden;background:#f7f1e4}.leaf-face.back{transform:rotateY(180deg)}.leaf-face.front:after,.sheet:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;background:linear-gradient(90deg,rgba(40,24,8,.05),transparent 18%)}.lookup{position:relative;z-index:5;flex:0 0 auto;width:300px;padding:26px 22px 20px;border:0;border-radius:0;background:#000;box-shadow:none;font-family:"Noto Serif TC",PMingLiU,Songti TC,serif;letter-spacing:.06em}.lookup-kicker{margin:0;color:var(--gold);letter-spacing:.22em;font-size:12px}.lookup h2{margin:0 0 18px;font-size:28px;font-weight:700;letter-spacing:inherit;font-family:inherit;text-align:center}.lookup label,.admin label{display:flex;flex-direction:column;gap:8px;font-size:14px;color:#eadcc4}.lookup input,.admin input,.admin textarea{width:100%;border:1px solid rgba(154,116,54,.45);border-radius:10px;background:#f7f1e4;color:var(--ink);padding:12px 14px;outline:none;font-family:inherit;letter-spacing:inherit}.lookup input{border:1px solid rgba(228,199,122,.45);border-radius:10px;background:#000;color:#f4ecdc}.lookup input::placeholder{color:#f4ecdc8c}.lookup input:focus,.admin input:focus,.admin textarea:focus{border-color:#8d6730;box-shadow:0 0 0 3px #e4c77a40}.primary,.lookup .text-button,.admin button,.catalog button{border:0;cursor:pointer}.primary{width:100%;margin-top:14px;padding:12px 16px;border-radius:999px;color:#1a140c;background:linear-gradient(#f3e2b0,#c6a15b);font-weight:700;letter-spacing:.12em}.lookup .primary{background:#000;color:#f4ecdc;border:1px solid rgba(228,199,122,.45);letter-spacing:inherit;font-family:inherit}.primary:disabled{opacity:.55;cursor:default}.notice{min-height:0;margin:14px 0 0;color:#d9ccb6;font-size:14px;line-height:1.7;letter-spacing:inherit;font-family:inherit}.notice.ok{color:#d5ecda}.notice.err{color:#ffc1b5}.catalog{margin-top:8px}.catalog p{margin:0 0 8px;color:#b7a78d;font-size:13px;letter-spacing:.12em}.catalog ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}.catalog button{border-radius:999px;padding:6px 10px;color:#f4ecdc;background:#ffffff0f;border:1px solid rgba(228,199,122,.25)}.catalog button.on{color:#1a140c;background:var(--gold);border-color:transparent}.page-nav{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:10px 12px;margin-top:14px}.page-nav button{flex:0 0 auto;white-space:nowrap;border-radius:999px;padding:6px 14px;color:#f4ecdc;background:#000;border:1px solid rgba(228,199,122,.45);font-family:inherit;letter-spacing:inherit}.page-nav button:disabled{opacity:.35}.page-nav span{flex:0 0 auto;white-space:nowrap;color:#d9ccb6;font-size:14px;letter-spacing:inherit;font-family:inherit}.lookup-links{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:16px}.text-button,.admin-link{color:var(--gold);background:transparent;padding:0;text-decoration:none;font-size:14px;font-family:inherit;letter-spacing:inherit}.lookup.shake{animation:shake .42s ease}@keyframes shake{20%{transform:translate(-5px)}40%{transform:translate(5px)}60%{transform:translate(-3px)}80%{transform:translate(2px)}}.loading-book{width:var(--page-w);height:var(--page-h);display:grid;place-items:center;border-radius:8px;background:#14386e;color:var(--gold)}.login-panel{display:flex;flex-direction:column;gap:14px;max-width:420px;margin-top:12vh}.login-panel h1{margin:6px 0 8px;font-size:36px;letter-spacing:.08em}.admin-shell{padding:32px 20px 64px;background:radial-gradient(ellipse at 50% 0%,rgba(92,132,196,.16),transparent 40%),#161310}.admin{width:min(860px,100%);margin:0 auto}.admin-bar,.chapter-head,.admin-actions,.admin-footer,.icon-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.admin-bar h1{margin:6px 0 0;font-size:36px;letter-spacing:.08em}.admin-actions a{color:var(--gold);text-decoration:none}.admin-actions .primary{width:auto;margin:0;padding-inline:22px}.admin-card{margin-top:16px;padding:18px;border-radius:16px;background:#fffaf20f;border:1px solid rgba(228,199,122,.2)}.admin-lang{margin-top:18px;justify-content:flex-start}.edition-note,.edition-hint{margin:10px 0 0;color:#d9ccb6;font-size:14px;letter-spacing:0}.admin-card.editing-en{border-color:#96bae673}.admin-card h2{margin:0;font-size:18px}.admin-card h3{margin:0;font-size:16px;font-weight:600}.page-stack{margin-top:8px}.leaf-editor{margin-top:14px;padding-top:12px;border-top:1px solid rgba(228,199,122,.18)}.leaf-editor p{margin:0;color:#d9ccb6}.upload-row{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:12px}.upload-row .page-photo{width:120px;max-height:90px;margin:0}.upload-button{display:inline-flex;align-items:center;border-radius:999px;padding:7px 12px;color:#f4ecdc;background:transparent;border:1px solid rgba(228,199,122,.35);cursor:pointer}.upload-button input{display:none}.admin-card label{margin-top:14px}.admin textarea{resize:vertical;line-height:1.8}.icon-row button,.admin-footer>button{border-radius:999px;padding:7px 12px;color:#f4ecdc;background:transparent;border:1px solid rgba(228,199,122,.35)}.icon-row button:disabled{opacity:.35;cursor:default}.danger{color:#2a100d!important;background:#e7b2a8!important;border-color:transparent!important}.admin-footer{margin-top:18px;align-items:flex-start}.admin-status{margin:8px 0 0;min-height:1.5em;color:#ffc1b5}.admin-status.ok{color:#d5ecda}.read-back{display:none}@media(min-width:761px){.stage{margin-left:-96px;margin-right:96px}.lookup{position:absolute;top:50%;right:auto;bottom:auto;left:calc(50% + var(--page-w) / 2 - 24px);translate:0 -50%;width:min(300px,calc(50vw - var(--page-w) / 2 - 104px));height:auto;display:block;padding:26px 22px 20px;transition:left 1s cubic-bezier(.77,0,.18,1),width 1s cubic-bezier(.77,0,.18,1)}.scene:has(.book-slot.is-open) .lookup{left:calc(50% + var(--page-w) - 60px);width:min(300px,calc(50vw - var(--page-w) - 104px));top:calc(50% - 6px);padding:24px 22px}.scene:has(.book-slot.is-open) .lookup h2,.scene:has(.book-slot.is-open) .lookup-links{text-align:center;justify-content:center}}@media(min-width:761px)and (max-width:1499px){.stage{margin-left:0;margin-right:0}.lookup,.scene:has(.book-slot.is-open) .lookup{position:relative;top:auto;right:auto;bottom:auto;left:auto;translate:none;width:min(300px,calc(100vw - 56px))}.scene:not(:has(.book-slot.is-open)) .lookup{margin-left:28px}}@media(max-width:760px){:root{--page-w: 390px;--page-h: 530px;--book-fit: min(1, calc((100vw - 32px)/780px) , calc((100dvh - 240px)/530px) );--read-fit: min(1, calc((100vw - 32px)/390px) , calc((100dvh - 180px)/530px) )}.scene{flex-direction:column;padding:28px 16px 40px;gap:22px}.lang-menu{top:16px;right:16px}.book-slot,.lookup{flex-shrink:0}.book-slot{zoom:var(--book-fit)}.scene.is-settled .book-slot{transition:width .42s ease,height .42s ease}.scene.is-settled .book-slot.is-open{overflow:hidden}.scene.is-reading .book-slot{overflow:hidden;transition:none}.scene.is-reading.is-settled .book-slot{overflow:hidden}.scene.is-reading .book-slot.is-open{width:var(--page-w);height:var(--page-h)}.scene.is-reading .prose{pointer-events:auto;touch-action:pan-y}.lookup-panel{display:grid;grid-template-rows:1fr;transition:grid-template-rows .42s ease,opacity .32s ease}.lookup-panel>div{min-height:0;overflow:hidden}.scene.is-reading .lookup-panel{grid-template-rows:0fr;opacity:0;pointer-events:none;transition:none}.lookup .read-back{display:block;max-height:0;margin-top:0;padding-top:0;padding-bottom:0;border-width:0;opacity:0;overflow:hidden;pointer-events:none;transition:max-height .42s ease,margin-top .42s ease,padding .42s ease,border-width .42s ease,opacity .32s ease}.scene.is-reading .read-back{max-height:72px;margin-top:14px;padding:12px 16px;border-width:1px;opacity:1;pointer-events:auto;transition:none}.book{height:auto;aspect-ratio:390 / 530}.lookup{width:min(88vw,360px)}.admin-bar,.chapter-head,.admin-footer{align-items:stretch;flex-direction:column}}
