@import url('../playful_shared/style.css?v=20261002play1');
.backdrop{background-image:url('assets/room-v2.webp?v=20261003night2');background-position:center 48%;transition:filter .7s}.lights-off .backdrop{filter:brightness(.57) saturate(.8)}.app{grid-template-rows:73px 69px minmax(0,1fr) auto}.heading h1,body[data-theme=night] .heading h1{color:#705857;text-shadow:0 1px 0 #fff4df88}.heading small{color:#8a6e58;font-size:9px;letter-spacing:1.7px}.lights-off .heading h1,body[data-theme=night].lights-off .heading h1{color:#fff1d9;text-shadow:0 2px 4px #37294c55}.lights-off .heading small{color:#e1c6a9}.scene{max-width:850px;overflow:hidden}.play-area{overflow:hidden}.speech{background:#fff8e6;font-size:clamp(16px,2.2vw,22px);line-height:1.22;max-width:99%;padding:8px 15px}.speech-row{z-index:2}#caption{max-width:690px}#patient{transform-origin:center 70%}.lights-off .scene{filter:brightness(.82)}.scene [data-room-control]{transition:filter .2s}.scene [data-room-control].requested{filter:drop-shadow(0 0 6px #fff6b0) drop-shadow(0 0 12px #edc45388)}.scene [data-room-control][aria-disabled=true]{cursor:default}.music-on [data-room-control=music] image{animation:music-rock 2.2s ease-in-out infinite;transform-origin:515px 537px}.paused .music-on image{animation-play-state:paused}#story-bubble{filter:drop-shadow(0 7px 10px #6b4d403b);cursor:pointer}#step-line{min-height:24px;text-align:center;font-size:13px;line-height:1.3;font-weight:750;color:#6f6156;padding:0 5px 5px}.lights-off #step-line{color:#ffedcd}#tools{gap:7px;min-height:73px}.tool{min-width:58px;width:66px;height:70px;padding:4px;border-radius:17px;gap:2px;box-shadow:0 4px 0 #5841341c;border:2px solid #fff6df;background:#fff7e9}.tool img{width:43px;height:43px;object-fit:contain}.tool span{font-size:11px;line-height:1.1;font-weight:650}.tool.step-current{border-color:#8eb497;background:#fff9d6;box-shadow:0 0 0 2px #faf0c455,0 4px 0 #7c6a4f1b}.tool.step-done{opacity:.58;background:#e8efda}.tool.step-done:after{content:'✓';position:absolute;top:1px;right:3px;width:17px;height:17px;border-radius:50%;background:#6e9c80;color:white;font-size:12px;display:grid;place-items:center}.tool:disabled{opacity:.66}.tool.step-current:disabled{opacity:1}#progress{font-size:11px;letter-spacing:.3px;font-weight:650;color:#665345}.lights-off #progress{color:#f6e3be}.mini-button{background:#fff3e0d9}#night-status{position:absolute;bottom:3%;left:50%;transform:translateX(-50%);width:min(365px,94%);background:#fff6e3ed;border:2px solid #eedbb3;box-shadow:0 5px 24px #5d3d4930;border-radius:23px;padding:11px 14px;display:flex;align-items:center;justify-content:center;gap:5px 9px;flex-wrap:wrap;text-align:center;pointer-events:none;color:#715768}#night-status>span{font-size:31px;color:#b98a49;line-height:1}#night-status strong{font-size:21px;line-height:1.2}#night-status small{width:100%;font-size:13px;font-weight:650;color:#927a65}#night-status.is-next{padding:12px 15px}#night-status.is-next strong{font-size:18px}.art-note{top:133px}.curtain-close{animation:curtain-settle .6s ease-out}@keyframes curtain-settle{from{opacity:.6}to{opacity:1}}@keyframes music-rock{0%,100%{transform:rotate(-2deg)}50%{transform:rotate(2deg)}}
@media(max-width:520px){.app{grid-template-rows:63px 70px minmax(0,1fr) auto}.heading h1{font-size:20px}.heading small{font-size:7px;letter-spacing:.8px}.speech{font-size:16px;padding:9px 12px}.speech-row{padding:0 2px}#tools{gap:5px;min-height:66px}.tool{min-width:44px;width:51px;height:63px;padding:3px;border-radius:14px}.tool img{width:38px;height:38px}.tool span{font-size:9px}#step-line{font-size:12px;min-height:23px}#night-status strong{font-size:20px}#night-status{bottom:1%;padding:9px 11px}#night-status.is-next strong{font-size:17px}}
@media(max-width:360px){.tool{width:46px}.tool img{width:34px;height:34px}.tool span{font-size:8px}#tools{gap:4px}.speech{font-size:15px}}
@media(max-height:650px) and (orientation:portrait){.app{grid-template-rows:56px 68px minmax(0,1fr) auto}.heading small{display:none}.speech{font-size:14px}#tools{min-height:57px}.tool{height:55px}.tool img{height:31px;width:31px}#step-line{font-size:11px;min-height:20px}#night-status{bottom:0;padding:7px 9px}#night-status strong{font-size:17px}#night-status small{font-size:11px}.bottom-row{margin-top:2px}}
@media(orientation:landscape) and (max-height:560px){.app{grid-template-columns:minmax(0,1fr) 171px;grid-template-rows:51px 61px minmax(0,1fr);max-width:1080px}.heading small{display:none}.topbar{grid-column:1/3}.speech-row{grid-column:1/3}.speech{font-size:15px;padding:7px 13px}.play-area{grid-column:1;grid-row:3}footer{grid-column:2;grid-row:3;display:flex;flex-direction:column;justify-content:center}#tools{display:grid;grid-template-columns:repeat(3,48px);gap:7px 5px;min-height:0}.tool{width:48px;min-width:44px;height:55px;padding:3px}.tool img{width:31px;height:31px}.tool span{font-size:8px}#step-line{font-size:11px;min-height:22px}#progress{font-size:9px}.bottom-row{margin-top:7px}#night-status{bottom:0;width:270px;padding:6px 10px}#night-status strong{font-size:17px}#night-status small{font-size:11px}.art-note{top:110px}}
@media(prefers-reduced-motion:reduce){.music-on [data-room-control=music] image,.curtain-close{animation:none}.backdrop,.scene [data-room-control]{transition:none}}
/* Keep every finger control comfortable on compact phones and landscape. */
.mini-button{width:44px;height:44px;min-width:44px;min-height:44px}.bottom-row{height:44px;min-height:44px}.speech{min-height:44px}.round-button{min-width:44px;min-height:44px}.paused.music-on [data-room-control=music] image,.paused .breathing{animation-play-state:paused}

/* Contextual guidance stays anchored to the current room object. */
#step-hint{filter:drop-shadow(0 3px 3px #75532666)}.guide-arrow{animation:guide-bob .8s ease-in-out infinite}.guide-halo{animation:guide-glow 1.15s ease-in-out infinite}.guide-star{animation:guide-twinkle 1s ease-in-out infinite}.guided-target{filter:drop-shadow(0 0 9px #ffe492)!important}.tool.guided-target{border-color:#dfa744;background:#fff1b3;animation:guide-tool 1s ease-in-out infinite}
@keyframes guide-bob{0%,100%{transform:translateY(-7px)}50%{transform:translateY(0)}}@keyframes guide-glow{0%,100%{opacity:.4;stroke-width:4}50%{opacity:1;stroke-width:9}}@keyframes guide-twinkle{0%,100%{opacity:.35}50%{opacity:1}}@keyframes guide-tool{50%{box-shadow:0 0 0 5px #ffd97877}}
#story-bubble{position:absolute;inset:3% 2%;margin:auto;width:min(640px,96%);height:auto;max-height:94%;aspect-ratio:1.25;display:flex;flex-direction:column;gap:8px;padding:12px;border:3px solid #ead9b6;border-radius:24px;background:#fffaf0;color:#705857;box-shadow:0 10px 35px #50373745;z-index:3;overflow:hidden;font:inherit;touch-action:manipulation;cursor:pointer;filter:none}
.story-heading{flex:none;font-size:clamp(16px,2.6vw,24px);font-weight:750;line-height:1.2}#story-picture{display:block;min-height:0;flex:1;width:100%;object-fit:contain;border-radius:13px}.story-footer{flex:none;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:6px 18px;line-height:1.2}.story-listen{font-size:12px;color:#8d7769}#story-pages{display:flex;align-items:center;gap:7px}#story-pages b{font-size:12px;margin-left:3px}.story-dot{width:7px;height:7px;background:#ded0be;border-radius:50%}.story-dot.is-current{background:#b18648;box-shadow:0 0 0 3px #efdeba}.paused #step-hint *,.paused .guided-target{animation-play-state:paused!important}
@media(max-height:650px){#story-bubble{gap:5px;padding:8px;border-radius:18px}.story-heading{font-size:15px}.story-listen{font-size:10px}.story-footer{gap:5px 10px}}
@media(prefers-reduced-motion:reduce){#step-hint *,.guided-target{animation:none!important}.guide-halo{opacity:1}}
