/* One continuous camera: approach, automatic doors, same reception, room dissolve. */
.massage-scene{background:#eee9e5}
.indoor-world{position:absolute;inset:0;z-index:3;opacity:0;transition:opacity .5s cubic-bezier(.22,0,.24,1)}
.entry-stage{position:absolute;inset:0;z-index:2;overflow:hidden;background:#f4f1ff;pointer-events:none}
.facade-camera{position:absolute;left:0;top:16.6667%;width:100%;aspect-ratio:3/2;transform-origin:60% 45%;transform:translate(0,0) scale(1);will-change:transform}
.facade-art{width:100%;height:100%;image-rendering:pixelated}
.facade-picture,.portal-picture{display:block;width:100%;height:100%}
.entry-portal{position:absolute;left:19.6%;top:48.1%;width:34.3%;height:30.2%;overflow:hidden;background:#b3a087;box-shadow:inset 0 0 0 2px #39312b}
.portal-view{width:100%;height:100%;object-fit:cover;object-position:center;image-rendering:pixelated;filter:brightness(.88)}
.door-pane{position:absolute;top:0;bottom:0;width:50%;border:2px solid #443a30;background:linear-gradient(128deg,#cbd2d653 0%,#eee1bf24 24%,#c3c4c033 25%,#ffffff4d 27%,#d3c5af13 28%,#b5b8b226 70%,#ffffff38 72%,#21222c33 73%);box-shadow:inset 0 0 0 1px #b8b2a654;transition:transform .75s cubic-bezier(.4,0,.25,1);will-change:transform}
.door-pane:after{content:'';position:absolute;top:44%;width:3px;height:18%;background:#dfd6b9;box-shadow:1px 1px 0 #534f47}
.door-left{left:0}.door-left:after{right:7%}
.door-right{right:0}.door-right:after{left:7%}

/* Keep the same animation active across phases; opening the doors never restarts it. */
.massage-home:not([data-entry="loading"]):not([data-entry="ready"]) .facade-camera{animation:arrival-push 1.75s cubic-bezier(.5,0,.4,1) both}
@keyframes arrival-push{
  from{transform:translate(0,0) scale(1)}
  to{transform:translate(-2%,3%) scale(1.32)}
}
.massage-home[data-entry="doors"] .door-left,
.massage-home[data-entry="reception"] .door-left,
.massage-home[data-entry="room"] .door-left{transform:translateX(-102%)}
.massage-home[data-entry="doors"] .door-right,
.massage-home[data-entry="reception"] .door-right,
.massage-home[data-entry="room"] .door-right{transform:translateX(102%)}

/* Fade the room over the still-visible reception. Neither scene slides sideways. */
.massage-home[data-entry="room"] .indoor-world,
.massage-home[data-entry="ready"] .indoor-world{opacity:1}
.massage-home[data-entry="ready"] .indoor-world{transition:none}
.massage-home[data-entry="ready"] .entry-stage{display:none}
.massage-home .start-area{transition:opacity .25s ease}
.massage-home:not([data-entry="ready"]) .start-area{visibility:hidden;opacity:0;pointer-events:none}
.massage-home[data-entry="ready"] .start-area{visibility:visible;opacity:1}
html[data-motion="paused"] .indoor-world{transition:none}
@media(prefers-reduced-motion:reduce){.indoor-world,.door-pane,.massage-home .start-area{transition:none}.facade-camera{animation:none!important}}