/* Local fonts: OFL license and provenance in assets/fonts. No external font service. */
@font-face{font-family:CastleSerif;src:url('assets/fonts/castle-serif.woff2') format('woff2');font-weight:400 700;font-style:normal;font-display:swap}
@font-face{font-family:CastleDisplay;src:url('assets/fonts/castle-display.woff2') format('woff2');font-weight:400 700;font-style:normal;font-display:swap}
html,body,button{font-family:CastleSerif,'Songti SC','STSong','SimSun',serif;font-weight:500}
#stage{width:min(calc(var(--app-h,100vh) * .666667),112vw);height:min(var(--app-h,100vh),168vw);top:50%;left:50%;transform:translate(-50%,-50%);margin:0}
.paper h2{font-family:inherit;font-weight:500;font-size:23px;letter-spacing:.06em;line-height:1.65}
.paper p,.wish-view p{font-size:16px;line-height:1.95;letter-spacing:.025em}
.paper,.wish-view{background-color:#f0dece;background-clip:padding-box}
.paper small{font-size:13px;line-height:1.8}
#overlay{align-items:flex-start}
#object-sheet{margin:auto;max-height:none;flex-shrink:0}
.paper button,.soft-button{font-size:16px;line-height:1.6;padding:12px 17px}
.photo-inspection p,.photo-view p{font-size:15px;line-height:1.85;letter-spacing:.025em}
#dialogue{bottom:12%;padding:18px 23px 13px;max-width:420px;background:linear-gradient(135deg,#34213aef,#51313eea);border-color:#d5ac8f79;box-shadow:0 10px 35px #190d2d44}
#speaker{font-size:15px;color:#f8d7b3;letter-spacing:.08em}
#dialogue-line{font-size:17px;line-height:1.9;letter-spacing:.025em;margin:10px 0}
#dialogue-next{font-size:14px;min-height:44px;letter-spacing:.05em}
#speech,#stage.show-hints #speech{bottom:16%;font-size:16px;letter-spacing:.025em;line-height:1.85}
#speech small{font-size:14px;line-height:1.75;margin-top:6px}
.bag-item small{font-size:13px;letter-spacing:.01em}
.bag-empty,.inspect-caption{font-size:15px;line-height:1.8}
.hotspot .object-label{font-size:13px;letter-spacing:.02em}
#story-caption,.scene-balcony #story-caption{font-size:16px;letter-spacing:.025em;line-height:1.85}
#story-caption small{font-size:14px;letter-spacing:.02em}
.fire-message{top:13%;font-size:27px;line-height:1.9;letter-spacing:.04em;padding:17px 0;background:radial-gradient(ellipse,#251a408f,transparent 72%);text-shadow:0 2px 9px #110b22,0 0 24px #251132}
.fire-message small{font-size:15px;letter-spacing:.03em}
/* Attached to the scene FX plane so the inscription follows a close look at the door. */
.gate-time{left:32%;top:40%;width:36%;padding:12px 0 10px;text-align:center;color:#ffe5b8;letter-spacing:0;background:radial-gradient(ellipse,#512735c7,transparent 76%);text-shadow:0 1px 3px #492230,0 0 9px #48212e;z-index:2;pointer-events:none}
.gate-time>small{font-size:12px;letter-spacing:.1em;white-space:nowrap;display:block;margin-bottom:5px}
.gate-digits{display:flex;justify-content:center;align-items:flex-start;font-size:22px;font-family:CastleDisplay,Georgia,serif;line-height:1.1;font-variant-numeric:tabular-nums}
.gate-digits span{min-width:24%;font-weight:500}.gate-digits b{font-size:14px;font-weight:400;padding-top:3px}.gate-digits em{font:12px CastleSerif,serif;display:block;margin-top:5px;color:#e8be9f}
#start-menu{position:absolute;inset:0;top:0;left:0;width:100%;height:100%;z-index:11;overflow:hidden;background:#201b31;transition:opacity .7s ease}
#start-menu>img{position:absolute;width:100%;height:100%;object-fit:fill;filter:brightness(.87);transition:transform 1.2s ease,filter 1.2s ease}
#start-menu:after{content:'';position:absolute;inset:0;background:linear-gradient(#100f2922,transparent 53%,#14102618);pointer-events:none}
.start-heading{position:absolute;top:20%;left:7%;width:86%;text-align:center;text-shadow:0 2px 15px #1b1230;z-index:2;color:#fae7cc}
.start-heading>small{font:14px CastleDisplay,Georgia,serif;letter-spacing:.25em;opacity:.8}
.start-heading h1{font-size:31px;font-weight:500;line-height:1.75;letter-spacing:.12em;margin:16px auto;width:9em;max-width:100%;text-wrap:balance}
.start-heading p{font-size:14px;line-height:1.9;letter-spacing:.06em;margin:12px auto 0;max-width:19em;color:#f3ddcc}
#start-game{position:absolute;bottom:18%;left:50%;transform:translateX(-50%);z-index:3;border:0;background:radial-gradient(ellipse,#32263a88,transparent 72%);min-width:180px;min-height:90px;text-align:center;padding:12px 22px;color:#ffe9c7;text-shadow:0 1px 10px #190e2b}
#start-game:before,#start-game:after{content:'✧';position:absolute;top:33px;font-size:17px;color:#e7c798;opacity:.8}#start-game:before{left:5px}#start-game:after{right:5px}
#start-game span{display:block;font-family:CastleDisplay,Georgia,serif;font-size:44px;letter-spacing:.08em;line-height:1.1}
#start-game small{display:block;font-size:14px;letter-spacing:.09em;margin-top:12px;opacity:.88}
#start-game:active{filter:brightness(1.25)}#start-game:disabled{cursor:wait}
.start-mist{position:absolute;left:-20%;top:38%;width:140%;height:40%;pointer-events:none;background:radial-gradient(ellipse,#c5bad21a,transparent 65%);animation:start-mist 15s ease-in-out infinite alternate;z-index:1}
body.at-start #controls,body.at-start #bag-toggle,body.at-start #backzone,body.at-start #bag-panel{visibility:hidden}
body.at-start #controls{visibility:visible}
body.at-start #hint,body.at-start #settings,body.at-start #stepback{display:none}
#start-sound-cue{position:absolute;bottom:5%;left:8%;width:84%;z-index:3;margin:0;text-align:center;color:#f6dfc5;font-size:13px;line-height:1.7;letter-spacing:.03em;text-shadow:0 2px 8px #20132c}
.scene-path #bag-toggle,.scene-path #bag-panel{visibility:hidden}
body.starting #start-menu{opacity:0;pointer-events:none}body.starting #start-menu>img{transform:scale(1.08);filter:brightness(.45)}
body.starting #start-menu>img{transform:none;filter:brightness(.87)}
@keyframes start-mist{to{transform:translateX(8%) translateY(-5%)}}
@media(max-width:430px){.gate-digits{font-size:20px}.gate-time>small{font-size:11px}.start-heading h1{font-size:29px}.paper{padding:28px 12px 24px}.paper p{font-size:16px}.paper h2{font-size:21px}#dialogue{width:88%;bottom:12%;padding:17px 20px 12px}}
@media(max-height:600px){.start-heading{top:12%}.start-heading h1{font-size:25px;margin:10px auto}.start-heading p{font-size:13px}#start-game{bottom:12%}#dialogue{bottom:8%;padding-top:12px}#dialogue-line{font-size:16px;margin:6px 0}.gate-time{padding-top:8px}}
@media(prefers-reduced-motion:reduce){.start-mist{animation:none}#start-menu,#start-menu>img{transition:none}}
/* In-scene blowing: the cake and its flames remain fully visible. */
#cake-breath{position:absolute;left:10%;top:66%;width:80%;z-index:8;text-align:center;pointer-events:none;color:#fff0d5;text-shadow:0 2px 7px #331e31,0 0 15px #331e31}
#cake-breath p{font-size:15px;line-height:1.7;margin:0 0 8px;letter-spacing:.02em}
.breath-actions{display:flex;justify-content:center;align-items:center}
.breath-actions button{pointer-events:auto;min-height:44px;padding:9px 15px;background:linear-gradient(135deg,#6b3b53ed,#533046ed);border:1px solid #d0a06b;border-radius:22px;color:#ffe6bf;font-size:15px;box-shadow:inset 0 1px #efcaa429,0 3px 13px #32132b40;white-space:nowrap}
.breath-actions button+button{margin-left:9px}
.breath-actions button:disabled{opacity:.65}
#cake-breath #mic-status{font-size:13px;line-height:1.65;margin:8px 0 0}
#mic-status:empty{display:none}
.blowing-candles #bag-toggle,.blowing-candles #bag-panel{visibility:hidden}
#belle-expression{display:none;position:absolute;inset:0;width:100%;height:100%;object-fit:fill;opacity:0;pointer-events:none;user-select:none}
.scene-belle #belle-expression{display:block}
#belle-expression.belle-waving{animation:belle-greeting 3s ease-in-out both}
.scene-belle #speech{bottom:5%;background:radial-gradient(ellipse,#301b36c9,transparent 74%);padding:16px 10px;max-width:85%}
.sky-letter-prop{z-index:4;min-width:66px;min-height:60px;transform:translate(-50%,-50%) rotate(-10deg);border-radius:0}
.sky-letter-prop img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 5px 7px #180d2f99) drop-shadow(0 0 7px #ffe0a43d)}
.sky-letter-prop:after{display:none}
.sky-letter-prop.letter-arriving{animation:letter-to-hand .85s cubic-bezier(.23,.65,.3,1) both}
#overlay.sky-letter-open{background:#170e293b}
@keyframes belle-greeting{0%{opacity:0}12%,67%{opacity:1}100%{opacity:0}}
@keyframes letter-to-hand{0%{opacity:0;transform:translate(230%,0) rotate(14deg) scale(.35)}18%{opacity:1}100%{opacity:1;transform:translate(-50%,-50%) rotate(-10deg) scale(1)}}
@media(max-width:380px){#cake-breath{left:9%;width:82%}#cake-breath p{font-size:14px}.breath-actions button{font-size:14px;padding:9px 12px}}
@media(prefers-reduced-motion:reduce){#belle-expression.belle-waving{animation-duration:.8s}.sky-letter-prop.letter-arriving{animation:none}}
