/* Room coordinates move the scenery and character, never the care panel. */
.game>.room-stage{--room-caption:calc(var(--caption-name) + var(--caption-state));--room-size:clamp(150px,25dvh,285px);padding:44px 0 0;overflow:hidden;background:var(--season-center,#f4f7ed);touch-action:pan-y}
.room-stage:before{display:none}
.room-world{position:absolute;inset:0 0 var(--room-caption);overflow:hidden;pointer-events:none;z-index:-1;contain:layout paint}
.room-wall{position:absolute;inset:0 0 28%;background:linear-gradient(0deg,var(--season-edge,#e1eddf),var(--season-center,#fffaf0));border-bottom:7px solid #f1e5ce;box-shadow:0 1px 0 #baa989}
.room-floor{position:absolute;inset:72% 0 0;background-color:#e0d0b5;background-image:repeating-linear-gradient(90deg,transparent 0 calc(var(--room-plank,72px) - 1px),#b3a08029 calc(var(--room-plank,72px) - 1px) var(--room-plank,72px)),linear-gradient(#e7d9c1,#e0d0b5);border-top:1px solid #baa989}
.room-area{position:absolute;inset:48px 0 0;pointer-events:none}
.room-area>svg{width:100%;max-width:640px;margin:auto;height:100%;display:block;overflow:visible}
.room-stage>.baby-scene{position:absolute;inset:auto auto calc(var(--room-caption) + 14px) 50%;grid-area:auto;width:var(--room-size);height:calc(var(--room-size) * 1.08);max-height:none;min-height:0;align-self:auto;transform:translateX(calc(-50% + var(--room-baby-x,0px)));z-index:1;pointer-events:none}
.room-stage #babyTouch{width:100%;height:100%;animation:none!important;pointer-events:auto}
.room-stage #baby{width:100%;height:100%;filter:none}
.room-stage #babyTouch:hover #baby{filter:none}
.room-stage #babyTouch.crawl-route,.room-stage #babyTouch.walk-route{animation:none!important}
.room-stage.room-travelling #baby .crawl-pose{animation:none;transform:scaleX(var(--room-facing,1));transform-origin:160px 150px}
.room-stage.room-travelling #baby.motion-walk .posture-frame{transform:scaleX(var(--room-facing,1))}
.room-stage.room-curious #baby:not(.sleep):not(.cry) .head{animation:room-look 2.4s ease-in-out 2}
.room-stage.room-curious #baby:not(.sleep):not(.cry) .arm-right{transform-origin:205px 161px;animation:room-reach 2.4s ease-in-out 2}
.room-stage .room-offscreen{visibility:hidden}
.room-stage .room-offscreen *, .room-stage[data-room-paused="true"] .avatar *{animation-play-state:paused!important}
.room-stage>.baby-caption{align-self:end;grid-template-rows:var(--caption-name) calc(var(--caption-state) - 20px) 20px;background:linear-gradient(#e0d0b5,var(--season-surface,#fffaf1));position:relative;pointer-events:none;z-index:2}
.room-stage .baby-caption>.baby-name{grid-row:1;width:calc(100% - 124px);justify-self:center}
.room-stage .baby-caption>.baby-state{grid-row:2}
.room-stage .baby-state>.status,.room-stage .baby-state>.milestone{width:calc(100% - 124px);line-height:1.15;font-size:clamp(.68rem,2.4vw,.82rem)}
.room-navigation{grid-row:3;display:flex;align-items:center;justify-content:center;gap:8px;line-height:1;pointer-events:auto}
.room-place{font:800 .67rem/1 'DM Sans',sans-serif;color:var(--season-muted,#678376)}
.room-navigation button{position:absolute;top:0;left:6px;width:44px;height:44px;padding:7px;border-radius:50%;border:1px solid #b8cbb6;background:#fffaf1b8;color:#386e70;display:grid;place-items:center;touch-action:manipulation}
.room-navigation #roomRight{left:auto;right:6px}
.room-navigation button svg{width:28px;height:28px;display:block}
.room-navigation #roomRight svg{transform:rotate(180deg)}
.room-navigation button:disabled{opacity:.3;cursor:default}
/* Touch-capable computers also use swipe, even with a mouse attached. */
.room-stage[data-room-touch="true"] .room-navigation button{display:none}
.room-stage[data-room-touch="true"] .baby-caption>.baby-name,.room-stage[data-room-touch="true"] .baby-state>:is(.status,.milestone){width:calc(100% - 24px);max-width:calc(100% - 24px)}
@media(any-pointer:coarse){.room-navigation button{display:none}.room-stage .baby-caption>.baby-name,.room-stage .baby-state>:is(.status,.milestone){width:calc(100% - 24px);max-width:calc(100% - 24px)}}
.room-stage .thermometer-trigger{bottom:calc(var(--room-caption) + 12px);right:8px;width:40px;height:40px;padding:6px}
.room-stage .thermometer-trigger svg{width:26px;height:26px}
.room-stage .season-decor{z-index:0;opacity:var(--room-decor-opacity,1)}
.room-stage .season-ornament{bottom:calc(var(--room-caption) + 57px);--ornament-size:clamp(38px,8vw,64px);opacity:.8}
.room-stage .season-canopy{opacity:.65}
.room-stage .room-signal{position:absolute;top:44%;left:8px;z-index:7;display:flex;align-items:center;gap:0;min-width:54px;min-height:48px;padding:5px 8px 5px 2px;border:1px solid var(--season-border,#bed5c5);border-radius:20px 20px 20px 4px;background:#fffaf1;color:#386e70;box-shadow:0 3px 10px #386e7015;touch-action:manipulation}
.room-signal[data-side="right"]{left:auto;right:8px;flex-direction:row-reverse;border-radius:20px 20px 4px 20px;padding:5px 2px 5px 8px}
.room-signal[data-side="right"] .room-signal-arrow{transform:rotate(180deg)}
.room-signal-arrow{width:20px;height:26px;display:block}
.room-signal-icon{display:grid;place-items:center;width:32px;height:32px}
.room-signal svg{display:block;width:100%;height:100%}
.room-signal[data-upset="true"]{border-color:#dca48f;background:#fff5eb}
.room-signal-arrives{animation:room-signal-arrival .8s ease-in-out 3}
.room-stage .room-signal[hidden],.room-curiosity[hidden],.room-baby-thought[hidden],.room-swipe-hint[hidden]{display:none}
.room-curiosity{position:absolute;width:48px;height:48px;bottom:4px;left:calc(50% + 58px);pointer-events:none;animation:room-curiosity 2.4s ease-in-out 2;transform-origin:center bottom}
.room-curiosity>svg{width:100%;height:100%;display:block}
.room-baby-thought{position:absolute;top:0;right:4px;width:39px;height:35px;padding:6px;background:#fffaf1;border:1px solid #bed5c5;border-radius:14px 14px 14px 3px;pointer-events:none;animation:room-thought .25s ease-out}
.room-baby-thought>svg{display:block;width:100%;height:100%}
.room-swipe-hint{position:absolute;left:50%;top:56px;transform:translateX(-50%);z-index:3;display:flex;align-items:center;gap:3px;white-space:nowrap;padding:5px 8px;color:#4a7164;background:#fffaf1e8;border-radius:30px;font:700 .68rem/1.2 'DM Sans',sans-serif;pointer-events:none}
.room-swipe-hint>span:first-child,.room-swipe-hint>span:last-child{width:20px;height:22px;display:block;animation:room-swipe-nudge 1.5s ease-in-out 3}
.room-swipe-hint>span:last-child svg{transform:rotate(180deg)}
.room-swipe-hint svg{width:100%;height:100%}
.room-stage[data-room-care="bath"] .room-empty-tub{visibility:hidden}
/* Each overhead view carries its own floor as the camera passes into other areas. */
.room-stage[data-room-care="bath"] [data-room-area="2"],.room-stage[data-room-sleeping="true"] [data-room-area="3"]{display:none}
.room-overhead-floor{position:absolute;inset:0 -24px;background-color:#e0d0b5;background-image:repeating-linear-gradient(90deg,transparent 0 calc(var(--room-plank,72px) - 1px),#b3a08029 calc(var(--room-plank,72px) - 1px) var(--room-plank,72px));background-position:24px 0;mask-image:linear-gradient(90deg,transparent,#000 24px calc(100% - 24px),transparent)}
.room-overhead-floor[hidden]{display:none}
.room-bath-mat{display:none;position:absolute;left:50%;bottom:3px;width:calc(var(--room-size) + 36px);height:calc(var(--room-size) * 1.18 + 16px);transform:translateX(-50%);border:4px solid #efd1b9;border-radius:35px;background:repeating-linear-gradient(0deg,#edccb5 0 2px,#e9c5ae 2px 5px);box-shadow:0 2px 0 #b9987d33}
.room-bath-mat:after{content:"";position:absolute;inset:5px;border:1px dashed #fff5e3;border-radius:27px}
.room-stage[data-room-care="bath"] .room-bath-mat{display:block}
.room-stage.is-caring>.baby-scene{height:calc(var(--room-size) * 1.18);bottom:calc(var(--room-caption) + 6px)}
.room-stage .care-scene{pointer-events:auto}
.room-stage .room-upgraded-cup[data-upgraded="true"]{stroke:#386e70;stroke-width:2}
.room-stage.room-dragging{cursor:grabbing}
.room-stage:is(.room-dragging,.room-panning) :is(.room-area,.room-overhead-floor),.room-stage:is(.room-dragging,.room-panning)>.baby-scene{will-change:transform}
/* Play guidance uses the existing, fixed-height message slot. */
.feedback-slot>.toy-play-note{position:static;inset:auto;transform:none;width:100%;max-width:none;margin:0;padding:1px 5px;border-radius:8px;background:var(--season-soft,#edf7ef);color:var(--season-ink,#285f57);font-size:.72rem;line-height:1.2;text-align:left;pointer-events:auto}
.feedback-slot:has(.toy-play-note:not([hidden]))>:is(.care-panel-hint,.need-hint){visibility:hidden}
.feedback-slot:has(.reward-pop.show,.toast.show,.care-inline-controls:not([hidden]))>.toy-play-note{visibility:hidden}
@keyframes room-look{0%,100%{transform:rotate(0)}40%,65%{transform:rotate(7deg)}}
@keyframes room-reach{0%,100%{transform:rotate(0)}40%,65%{transform:rotate(-26deg)}}
@keyframes room-curiosity{0%,100%{transform:rotate(-4deg)}45%,65%{transform:rotate(8deg)}}
@keyframes room-thought{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
@keyframes room-signal-arrival{50%{transform:translateY(-3px)}}
@keyframes room-swipe-nudge{50%{transform:translateX(-3px)}}
@media(max-width:610px){.game>.room-stage{--room-size:clamp(145px,25dvh,215px)}}
@media(min-width:900px){.room-area{left:10%;right:10%}}
@media(max-height:660px){.game>.room-stage{--room-size:clamp(112px,24dvh,155px)}.room-area{top:36px}.room-stage .baby-state>.status{font-size:.65rem}.room-place{font-size:.62rem}.room-baby-thought{width:32px;height:29px;padding:4px}.room-curiosity{width:38px;height:38px;left:calc(50% + 38px)}.room-swipe-hint{top:50px}.room-navigation button{width:40px;height:40px;padding:5px}}
@media(max-height:540px){.game>.room-stage{--room-size:95px}.room-area{top:32px}.room-stage .thermometer-trigger{width:34px;height:34px;bottom:calc(var(--room-caption) + 5px)}.room-stage .thermometer-trigger svg{width:22px;height:22px}.room-stage>.baby-scene{bottom:calc(var(--room-caption) + 2px)}.room-swipe-hint{top:42px;font-size:.6rem}.room-stage .room-signal{top:35%}.room-baby-thought{display:none}}
@media(prefers-reduced-motion:reduce){.room-stage .room-signal,.room-stage.room-curious #baby .head,.room-stage.room-curious #baby .arm-right,.room-curiosity,.room-baby-thought,.room-swipe-hint>span{animation:none!important}.room-stage.room-travelling #baby *{animation:none!important}}

.room-bed-frame{display:none;position:absolute;inset:-8px -8px -4px;z-index:-1;pointer-events:none}
.room-bed-frame>svg{width:100%;height:100%;display:block}
.room-stage[data-room-sleeping="true"] .room-bed-frame{display:block}
.room-stage[data-room-sleeping="true"] .room-crib{visibility:hidden}
.room-stage[data-room-sleeping="true"] #baby :is(.infant-mat,.rest-surface){display:none!important}
