:root{--paper: #fdf3e8;--fur: #f9e7d2;--ink: #4a3a2e;--outline: #593a2e;--blush: #fcb0ab;--pumpkin: #ee9c53;--stem: #6e9457;--dusk: #2e3a5c;--bg: #efe2ce;--stage-bg: var(--paper);--ink-soft: #7a6552;--accent: var(--pumpkin);--accent-2: var(--stem);--banner-bg: rgba(253, 243, 232, .88);--control-bg: rgba(253, 243, 232, .82);--font: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans SC", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--stage-w: 1280;--stage-h: 720}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--ink);font-family:var(--font);overscroll-behavior:none;-webkit-user-select:none;user-select:none;touch-action:pan-y}@media (prefers-color-scheme: dark){:root{--bg: #2a2333}}.stage{position:fixed;top:0;right:0;bottom:0;left:0;height:100vh;height:100dvh;display:grid;place-items:center;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);background:radial-gradient(circle at 50% 30%,#f3e8d6,#e4d2b6 75%)}.stage-inner{--avail-h: calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom)) ;position:relative;width:min(100vw,calc(var(--avail-h) * (var(--stage-w) / var(--stage-h))));aspect-ratio:var(--stage-w) / var(--stage-h);max-height:var(--avail-h);overflow:hidden;background:var(--stage-bg);border-radius:18px;box-shadow:0 24px 60px #00000080}@media (max-width: 820px){.stage-inner{border-radius:0}}.page{position:absolute;top:0;right:0;bottom:0;left:0;animation:page-in .24s ease}@keyframes page-in{0%{opacity:0}to{opacity:1}}.layer{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center}.layer[hidden]{display:none}.layer img{width:100%;height:100%;object-fit:contain;-webkit-user-drag:none}.layer.background{z-index:0}.layer-placeholder{padding:.35em .7em;border:2px dashed rgba(89,58,46,.4);border-radius:10px;font-size:clamp(11px,1.6vw,15px);letter-spacing:.04em;color:var(--ink-soft);background:#593a2e0f}.layer.background .layer-placeholder{align-self:start;margin-top:12px;border-style:solid}.is-glowing{animation:glow 1.4s ease-in-out infinite alternate}@keyframes glow{0%{filter:drop-shadow(0 0 0 rgba(255,210,120,0))}to{filter:drop-shadow(0 0 26px rgba(255,210,120,.9))}}.page.is-glowing{animation:page-glow 1.8s ease-in-out infinite alternate}.page.is-glowing:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;pointer-events:none;background:radial-gradient(circle at 50% 46%,#ffd68c57,#ffd68c00 62%);mix-blend-mode:screen;animation:page-glow-veil 1.8s ease-in-out infinite alternate}@keyframes page-glow{0%{filter:brightness(1) saturate(1)}to{filter:brightness(1.07) saturate(1.12)}}@keyframes page-glow-veil{0%{opacity:.25}to{opacity:1}}.is-twinkling{animation:twinkle 1s ease-in-out infinite alternate}@keyframes twinkle{0%{opacity:.5}to{opacity:1}}.layer.swap-to{z-index:2;opacity:0;transition:opacity .26s ease}.layer.swap-to:not([hidden]){opacity:1}.layer.swap-to[hidden]{display:grid;opacity:0;pointer-events:none}.layer.extra-flash{z-index:3;opacity:0;transition:opacity .26s ease}.layer.extra-flash:not([hidden]){opacity:1}.layer.extra-flash[hidden]{display:grid;opacity:0;pointer-events:none}.layer.extra-flash .layer-placeholder{display:none}.hotspot{position:absolute;z-index:5;min-width:120px;min-height:120px;border:0;background:transparent;border-radius:24px;cursor:pointer}.hotspot:active{background:#ffffff24}.hotspot.extra-hotspot{z-index:8;min-width:0;min-height:0}.hotspot.extra-hotspot:active{background:#ffffff1a}.sticker-bag{position:absolute;z-index:7;left:45%;bottom:20%;display:flex;flex-wrap:wrap;gap:3px;max-width:26%}.sticker{position:relative;display:block;width:clamp(32px,4.6vw,50px);height:clamp(32px,4.6vw,50px);animation:pop .3s cubic-bezier(.3,1.5,.5,1)}.sticker img{width:100%;height:100%;object-fit:contain;border-radius:16%;filter:drop-shadow(0 2px 3px rgba(74,45,30,.35))}.count-row{position:absolute;z-index:7;left:50%;bottom:13%;transform:translate(-50%);display:flex;gap:clamp(8px,3.4vw,40px);justify-content:center}.count-num{display:grid;place-items:center;width:clamp(30px,4.5vw,46px);height:clamp(30px,4.5vw,46px);border-radius:999px;background:var(--accent);color:#fff;border:3px solid var(--paper);font:800 clamp(15px,2.4vw,24px) var(--font);box-shadow:0 3px 10px #0000004d;animation:pop .3s cubic-bezier(.3,1.5,.5,1)}@keyframes pop{0%{transform:scale(.2);opacity:0}to{transform:scale(1);opacity:1}}.text-banner{position:absolute;z-index:6;left:calc(env(safe-area-inset-left) + clamp(12px,4%,44px));bottom:calc(env(safe-area-inset-bottom) + clamp(10px,3.5%,26px));display:flex;flex-direction:row;align-items:center;gap:clamp(10px,1.6vw,18px);max-width:min(80%,760px);padding:0;border:0;background:transparent;color:#fff;font-family:var(--font);text-align:left;cursor:pointer}.text-banner .banner-text{transition:opacity .5s ease}.text-banner.is-dim .banner-text{opacity:.12}.text-banner .replay-icon{transition:opacity .5s ease}.text-banner.is-dim .replay-icon{opacity:.5}.text-banner.is-dim{pointer-events:none}.text-banner.is-dim .replay-icon{pointer-events:auto}.text-banner .replay-icon{flex:0 0 auto;display:grid;place-items:center;width:clamp(40px,6vw,54px);height:clamp(40px,6vw,54px);border-radius:50%;background:var(--accent);color:#fff;font-size:clamp(15px,2.2vw,21px);padding-left:2px;box-shadow:0 3px #78461e73,0 3px 12px #00000059}.text-banner:active .replay-icon{transform:translateY(2px);box-shadow:0 1px #78461e73,0 1px 6px #00000059}.text-banner .banner-text{display:flex;flex-direction:column;align-items:flex-start;gap:1px;min-width:0;text-shadow:0 1px 4px rgba(0,0,0,.6),0 0 16px rgba(0,0,0,.45)}.text-banner .sentence{font-size:clamp(17px,min(3.4vw,5.6vh),34px);font-weight:700;letter-spacing:.02em;text-wrap:balance}.text-banner .chant{font-size:clamp(13px,min(2.3vw,3.6vh),22px);color:#ffd9a8;font-weight:700}.title-card{background:#2e3a5c}.title-card .layer-placeholder{display:none}.title-card .title-content{position:absolute;z-index:6;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:.55em;text-align:center;padding:clamp(28px,8%,76px) 6% 5%;color:#fff7ec}.title-card .series{margin:0;font-size:clamp(13px,2.2vw,20px);letter-spacing:.3em;color:#ffd9a8;text-transform:uppercase;text-shadow:0 1px 6px rgba(20,24,44,.7)}.title-card .title{margin:0;font-size:clamp(32px,6.6vw,66px);font-weight:800;color:#fff7ec;text-shadow:0 2px 12px rgba(20,24,44,.8),0 0 3px rgba(20,24,44,.6)}.start-button{margin-top:.6em;padding:.55em 2em;border:0;border-radius:999px;background:var(--accent);color:#2a1400;font:700 clamp(18px,3vw,28px) var(--font);cursor:pointer;box-shadow:0 6px #b5641f}.start-button:active{transform:translateY(3px);box-shadow:0 3px #b5641f}.top-controls{position:absolute;z-index:10;top:calc(env(safe-area-inset-top) + 10px);right:calc(env(safe-area-inset-right) + 12px);display:flex;gap:8px;align-items:flex-start}.parent-menu{position:relative}.parent-menu .gear{width:40px;height:40px;border:0;border-radius:50%;background:var(--control-bg);color:var(--ink-soft);font-size:20px;cursor:pointer}.menu-scrim{position:fixed;top:0;right:0;bottom:0;left:0;z-index:20}.menu-panel{position:absolute;z-index:21;top:48px;right:0;width:260px;padding:14px;border-radius:16px;background:var(--paper);border:1px solid rgba(89,58,46,.18);box-shadow:0 20px 50px #4a2d1e47;display:flex;flex-direction:column;gap:12px}.menu-row{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:14px;color:var(--ink)}.segmented{display:flex;border-radius:10px;overflow:hidden;border:1px solid rgba(89,58,46,.25)}.segmented button{padding:7px 12px;border:0;background:transparent;color:var(--ink-soft);font:600 13px var(--font);cursor:pointer}.segmented button.on{background:var(--accent);color:#fff}.segmented.single{padding:0}.menu-action,.menu-close{padding:10px;border:0;border-radius:10px;font:600 14px var(--font);cursor:pointer}.menu-action{background:var(--accent);color:#fff}.menu-close{background:#593a2e1a;color:var(--ink)}.nav-arrow{position:absolute;z-index:8;top:50%;transform:translateY(-50%);width:clamp(44px,6vw,62px);height:clamp(44px,6vw,62px);border:0;border-radius:50%;background:var(--control-bg);color:var(--ink);font-size:clamp(24px,3.6vw,36px);line-height:1;cursor:pointer}.nav-prev{left:1.5%}.nav-next{right:1.5%}.nav-arrow:active{transform:translateY(-50%) scale(.94)}.progress-dots{position:absolute;z-index:7;top:calc(env(safe-area-inset-top) + 12px);left:50%;transform:translate(-50%);display:flex;gap:6px}.progress-dots .dot{width:7px;height:7px;border-radius:50%;background:#ffffff40}.progress-dots .dot.done{background:#ffffff80}.progress-dots .dot.current{background:var(--accent);transform:scale(1.4)}.rotate-hint{display:none}@media (max-width: 900px) and (orientation: portrait){.stage-inner{display:none}.rotate-hint{display:block;padding:1em 1.4em;font-size:18px;text-align:center;color:var(--ink-soft)}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}