/*9:16 outer design frame, normalized1080x1920. The390px UI plane is a
  centered content region; its art, text, timing cues and input coordinates
  retain their proportions. Side scenery is generated art, never stretched UI.*/
:root{--aspect-side:42.375px}
#viewport-frame{position:absolute;width:474.75px;height:844px;left:50%;top:50%;transform:translate(-50%,-50%) scale(var(--scale));transform-origin:center;overflow:hidden;isolation:isolate;background:#f6e8ce url('assets/room-extension-v44.webp') center/cover no-repeat;box-shadow:0 8px 80px #584b3940}
#game{left:50%;top:50%;width:390px;height:844px;transform:translate(-50%,-50%);overflow:visible;background:transparent;box-shadow:none}
#game>.loading{width:474.75px;margin-left:calc(-1 * var(--aspect-side))}
.world-scene>.shade{left:calc(-1 * var(--aspect-side));right:calc(-1 * var(--aspect-side))}
/*Four-pixel decorative background edge feather; the central architecture,
  door, furniture and all original anchors remain the original generated art.*/
.world-scene .room.layered{mask-image:linear-gradient(to right,transparent,#000 4px,#000 calc(100% - 4px),transparent),linear-gradient(to right,transparent,#000 32px,#000 calc(100% - 32px),transparent);mask-size:100% 45%,100% 55%;mask-position:top,bottom;mask-repeat:no-repeat}
.overlay{left:calc(-1 * var(--aspect-side));right:calc(-1 * var(--aspect-side));padding-inline:calc(20px + var(--aspect-side))}
.tap-zone,.intro-skip-area{left:calc(-1 * var(--aspect-side));right:calc(-1 * var(--aspect-side))}
#rotate{background-image:url('assets/rotate-mother-v44.webp');background-size:contain;background-position:center;background-repeat:no-repeat}
