/* My Flower Heart Studio v8.3: panorama engine styles (pano.js). Transform + opacity only. */
.mfhpano{position:absolute;inset:0;overflow:hidden;background:#4a3a31;touch-action:none;-webkit-user-select:none;user-select:none;contain:strict}
.mfhpano-stage{position:absolute;left:0;top:0;transform-origin:0 0;backface-visibility:hidden;-webkit-backface-visibility:hidden;opacity:0;transition:opacity 350ms cubic-bezier(.25,.46,.3,1)}
.mfhpano-stage.is-ready{opacity:1}
/* the room: tiny preview -> standard -> HD, each one fading in over the one below (same size and framing, so no flash) */
.mfhpano-img,.mfhpano-lqip{position:absolute;inset:0;display:block;width:100%;height:100%;max-width:none;pointer-events:none;-webkit-user-drag:none}
.mfhpano-img{transition:opacity 650ms cubic-bezier(.45,.05,.2,1)}
.mfhpano-img.is-pending{opacity:0}
/* the light blur sits on the tiny preview only, which is removed once the room is in */
.mfhpano-lqip{filter:blur(8px);transform:scale(1.01)}
/* sharp close-up of a corner (full screen): cross-fades over the landed zone, settling from 3% larger */
.mfhpano-close{position:absolute;left:0;top:0;width:100%;height:100%;display:block;max-width:none;object-fit:cover;object-position:50% 50%;pointer-events:none;opacity:0;backface-visibility:hidden;transform:scale(1.03);transition:opacity 400ms cubic-bezier(.45,.05,.2,1),transform 1600ms cubic-bezier(.22,.8,.2,1)}
.mfhpano-close.is-on{opacity:1;transform:scale(1);transition-duration:650ms,1600ms}
/* hot.js puts dots here: same coordinates as the image (left/top in %) */
.mfhpano-layer{position:absolute;inset:0;pointer-events:none}
.mfhpano-layer>*{pointer-events:auto}
@media (prefers-reduced-motion: reduce){.mfhpano-stage,.mfhpano-img,.mfhpano-close{transition:none}}
