@font-face{font-family:ChillRoundM;src:url(/story/ChillRoundM.otf) format("opentype");font-weight:400 900;font-style:normal;font-display:swap}:root{color:#17120b;background:#dcb381;font-family:PingFang SC,Microsoft YaHei,Noto Sans CJK SC,system-ui,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}html,body,#app{width:100%;min-height:100%;margin:0}body{min-height:100vh;overflow:auto;background-color:#dcb381;background-image:repeating-linear-gradient(45deg,rgba(255,255,255,.05) 0,rgba(255,255,255,.05) 2px,transparent 2px,transparent 4px)}::-webkit-scrollbar{width:0;background:transparent}button{font:inherit}.app-shell{width:100%;min-height:100vh}.app-error{display:grid;width:100%;min-height:100vh;place-items:center;padding:24px;color:#17120b;font-size:18px;font-weight:800;text-align:center}.book-stage{--binder-gap: clamp(14px, 1.7vw, 24px);--binder-gap-total: calc(var(--binder-gap) + var(--binder-gap));--page-frame-inset: clamp(4px, .55vw, 8px);--page-spread-half-gap: clamp(7px, .575vw, 11px);--page-spread-gap: calc(var(--page-spread-half-gap) + var(--page-spread-half-gap));--stage-chrome-height: 104px;--single-page-size: min( calc(100vw - 48px - var(--binder-gap-total)), calc(100dvh - var(--stage-chrome-height) - var(--binder-gap-total)), 900px );--double-page-size: min( calc(50vw - 24px - var(--binder-gap)), calc(100dvh - var(--stage-chrome-height) - var(--binder-gap-total)), 820px );position:relative;isolation:isolate;display:grid;place-items:center;width:100%;min-height:100vh;min-height:100dvh;padding:56px 20px 44px;overflow:hidden}.book-tools{position:absolute;top:16px;right:16px;z-index:50;display:flex;gap:8px;padding:8px;border:1px solid rgba(255,255,255,.82);border-radius:9999px;background:#ffffffbd;box-shadow:0 10px 20px #0000001f,0 2px 4px #00000014;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.icon-toggle{display:grid;width:40px;height:40px;place-items:center;border:0;border-radius:9999px;color:#7a4f2a;background:#8b5a2b14;cursor:pointer;transition:background .15s ease,color .15s ease,box-shadow .15s ease,transform .15s ease}.icon-toggle:hover{background:#8b5a2b29}.icon-toggle:active{transform:scale(.95)}.icon-toggle:disabled{cursor:not-allowed;opacity:.48;transform:none}.icon-toggle.is-active{color:#fff;background:#8b5a2b;box-shadow:0 4px 10px #8b5a2b52}.icon-toggle-svg{width:20px;height:20px;flex:0 0 auto}.icon-toggle:focus-visible,.nav-button:focus-visible{outline:2px solid rgba(31,41,55,.42);outline-offset:2px}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.binder-cover{position:relative;border-radius:12px;background-color:#8b5a2b;background-image:url("data:image/svg+xml,%3Csvg width='100' height='100' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100' height='100' filter='url(%23noise)' opacity='0.15'/%3E%3C/svg%3E");box-shadow:inset 0 0 30px #0009,15px 25px 30px #0006,5px 5px 15px #0003;transition:all .6s ease-in-out}.binder-cover-double{width:calc(var(--double-page-size) * 2 + var(--binder-gap) * 2);height:calc(var(--double-page-size) + var(--binder-gap) * 2)}.binder-cover-single{width:calc(var(--single-page-size) + var(--binder-gap) * 2);height:calc(var(--single-page-size) + var(--binder-gap) * 2)}.spine-shadow{position:absolute;inset-block:0;z-index:0;background:linear-gradient(to right,#0006,#0000001a 20%,#000c,#0000001a 80%,#0006);box-shadow:inset 0 0 20px #000c;transition:all .6s ease-in-out}.spine-double{left:50%;width:64px;margin-left:-32px;border-radius:0}.spine-single{left:0;width:40px;border-radius:12px 0 0 12px}.binder-inner{position:absolute;inset:var(--binder-gap);display:flex}.paper-base{background-color:#fffdf8;background-image:url("data:image/svg+xml,%3Csvg width='100' height='100' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.05' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100' height='100' filter='url(%23noise)' opacity='0.04'/%3E%3C/svg%3E")}.paper-thickness-left{border-radius:8px 2px 2px 8px;box-shadow:-1px 1px #e6e4df,-2px 2px #d6d4ce,-3px 3px #e6e4df,-4px 4px #d6d4ce,-5px 5px #e6e4df,-8px 8px 15px #0000004d,inset 0 0 40px #d2b48c1a}.paper-thickness-right{border-radius:2px 8px 8px 2px;box-shadow:1px 1px #e6e4df,2px 2px #d6d4ce,3px 3px #e6e4df,4px 4px #d6d4ce,5px 5px #e6e4df,8px 8px 15px #0000004d,inset 0 0 40px #d2b48c1a}.paper-bed,.holes-layer{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;pointer-events:none}.paper-bed{z-index:1}.binder-cover-double .paper-bed{gap:var(--page-spread-gap)}.paper-bed-page{flex:1 1 0;min-width:0}.book-frame{position:absolute;inset:var(--page-frame-inset);z-index:10;width:auto;height:auto;filter:drop-shadow(0 18px 28px rgba(74,55,32,.24))}.book-frame.single{width:auto;height:auto}.book-frame.webgl-active,.book-frame.webgl-active .webgl-layer,.book-frame.webgl-active .webgl-canvas{overflow:visible}.flip-book{width:100%;height:100%;min-width:0!important;min-height:0!important}.flip-book .stf__wrapper{position:relative;width:100%;height:100%;padding-bottom:0!important}.webgl-layer{position:absolute;top:0;right:0;bottom:0;left:0;z-index:5;width:100%;height:100%;overflow:hidden;touch-action:none}.webgl-book-canvas{width:100%;height:100%}.webgl-book-canvas canvas{display:block;width:100%!important;height:100%!important}.webgl-static-pages{position:absolute;top:0;right:0;bottom:0;left:0;z-index:10;display:flex}.webgl-static-pages.single{display:block}.webgl-static-pages.is-muted{pointer-events:none}.webgl-page-slot{position:relative;height:100%;min-width:0;flex:1 1 0;overflow:hidden}.webgl-page-slot-single{width:100%}.webgl-page-slot-left .page-wrapper{border-radius:8px 2px 2px 8px}.webgl-page-slot-right .page-wrapper,.webgl-page-slot-single .page-wrapper{border-radius:2px 8px 8px 2px}.webgl-canvas{position:absolute;top:0;right:0;bottom:0;left:0;z-index:30;overflow:hidden;pointer-events:none;opacity:0;transition:opacity .08s ease}.webgl-canvas.is-visible{opacity:1}.webgl-canvas canvas{display:block;width:100%!important;height:100%!important;filter:drop-shadow(0 18px 18px rgba(45,25,8,.22))}.flip-book .stf__block{top:0;right:0;bottom:0;left:0;perspective:1050px}.book-frame:not(.single) .page-wrapper.--left .page-surface{width:calc(100% - var(--page-spread-half-gap));margin-right:var(--page-spread-half-gap);border-radius:inherit}.book-frame:not(.single) .page-wrapper.--right .page-surface{width:calc(100% - var(--page-spread-half-gap));margin-left:var(--page-spread-half-gap);border-radius:inherit}.book-frame:not(.single) .page-wrapper.--left{border-radius:8px 2px 2px 8px}.book-frame:not(.single) .page-wrapper.--right{border-radius:2px 8px 8px 2px}.book-frame.single .page-wrapper{border-radius:2px 8px 8px 2px}.flip-book .stf__item.--soft{filter:drop-shadow(0 10px 14px rgba(58,39,15,.16))}.page-flip-binder-decor-layer{position:absolute;inset:calc(var(--page-frame-inset) * -1);z-index:24;pointer-events:none}.page-flip-binder-decor-layer .holes-layer,.page-flip-binder-decor-layer .ring-rail,.page-flip-binder-decor-layer .binder-ring-solid{transition:none}.holes-layer{z-index:60;opacity:1;transition:opacity .12s ease}.hole{position:absolute;z-index:20;width:14px;height:14px;border-radius:50%;background-color:#1a100b;box-shadow:inset 2px 2px 6px #000,-1px -1px 1px #0000000d,1px 1px 1px #ffffffe6;transform:translateY(-50%)}.hole-left{left:calc(50% - 32px)}.hole-right{left:calc(50% + 18px)}.hole-single{left:18px}.ring-rail{position:absolute;inset-block:0;z-index:70;width:0;opacity:1;pointer-events:none;transition:all .6s ease-in-out}.binder-ring-solid{position:absolute;left:0;height:12px;background:linear-gradient(to bottom,#fff,#cbd5e1 20%,#94a3b8,#475569 80%,#1e293b);box-shadow:0 4px 5px -1px #0009,inset 0 1px 1px #ffffffe6;transition:all .6s cubic-bezier(.25,1,.5,1)}.ring-double{width:58px;border-radius:6px;transform:translate(-50%,-50%)}.ring-single{width:31px;border-radius:0 6px 6px 0;transform:translateY(-50%)}.book-nav{position:absolute;left:50%;bottom:20px;z-index:40;display:flex;width:min(calc(100vw - 32px),448px);align-items:center;justify-content:space-between;gap:12px;padding:10px 14px;border:1px solid rgba(255,255,255,.75);border-radius:9999px;background:#ffffffb3;box-shadow:0 12px 22px #0000001f,0 2px 4px #0000000f;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transform:translate(-50%)}.nav-button{min-width:78px;padding:11px 18px;border:0;border-radius:9999px;color:#fff;background:#8b5a2b;box-shadow:0 4px 10px #8b5a2b66;cursor:pointer;font-weight:700;transition:background .15s ease,transform .15s ease}.nav-button:hover:not(:disabled){background:#6e4620}.nav-button:active:not(:disabled){transform:scale(.95)}.nav-button:disabled{background:#d2b89f;cursor:not-allowed}.page-counter{padding:8px 14px;border-radius:12px;color:#431407;background:#ffffffb8;box-shadow:0 1px 2px #0000000d;font-weight:700;letter-spacing:0;white-space:nowrap}.page-wrapper{width:100%;height:100%;margin:0;padding:0;overflow:hidden;border-radius:2px 8px 8px 2px;background:transparent;transform:translateZ(0);-webkit-transform:translateZ(0)}.page-surface{position:relative;width:100%;height:100%;overflow:hidden;border-radius:inherit;background:#fff7d7;container-type:size}.page-surface-blank{background:#fffdf8}.page-surface:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:10;pointer-events:none;background:linear-gradient(90deg,rgba(60,35,9,.18),transparent 5%,transparent 95%,rgba(60,35,9,.13)),linear-gradient(180deg,rgba(255,255,255,.18),transparent 18%,transparent 82%,rgba(69,43,18,.14));mix-blend-mode:multiply;opacity:.46}.page-canvas{position:absolute;top:50%;left:50%;transform-origin:center center}.page-image{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;-webkit-user-select:none;user-select:none;pointer-events:none}.page-image.cover{object-fit:cover}.page-image.contain{object-fit:contain;background:#fff4bf}.text-block{position:absolute;font-family:ChillRoundM,PingFang SC,Microsoft YaHei,Noto Sans CJK SC,system-ui,sans-serif;font-weight:900;letter-spacing:0;white-space:pre;text-shadow:0 2px 0 rgba(255,255,255,.48),0 4px 12px rgba(255,244,187,.32)}.choice-button{position:absolute;z-index:12;display:flex;align-items:center;justify-content:flex-start;padding:0 .25em;border:3px solid transparent;border-radius:12px;color:#10100d;background:#ffe87900;cursor:pointer;font-family:ChillRoundM,PingFang SC,Microsoft YaHei,Noto Sans CJK SC,system-ui,sans-serif;font-weight:900;letter-spacing:0;text-align:left;text-shadow:0 2px 0 rgba(255,255,255,.52),0 4px 12px rgba(255,244,187,.36);touch-action:manipulation;-webkit-user-select:none;user-select:none}.choice-button:hover,.choice-button:focus-visible{background:#fff18557;outline:none}.choice-button.selected{border-color:#ffe955f5;background:radial-gradient(circle at 16% 50%,rgba(255,255,255,.86),transparent 16%),#ffe64a6b;box-shadow:0 0 0 4px #ffffff8a,0 0 20px #ffd935eb;animation:choiceGlow .72s ease-in-out 3}@keyframes choiceGlow{0%,to{transform:scale(1);filter:brightness(1)}50%{transform:scale(1.035);filter:brightness(1.18)}}@media(min-width:640px){.book-stage{padding:56px 24px 44px}.spine-single{width:48px}}@media(max-width:560px){.book-stage{--binder-gap: 12px;--page-frame-inset: 4px;--page-spread-half-gap: 6px;--stage-chrome-height: 92px;padding:52px 12px 36px}.book-nav{gap:12px;bottom:14px;width:calc(100vw - 24px);padding:8px 10px}.nav-button{min-width:68px;padding:10px 14px}.page-counter{padding:7px 10px}}