/* Full-bleed responsive environment. Artwork and guests share one cover plane. */
body.r-page #lounge-preview { position:relative; isolation:isolate; left:50%; width:100vw; max-width:none; height:clamp(480px,64vw,960px); min-height:0; margin:16px 0 24px -50vw; overflow:hidden; background:transparent; }
body.r-page #lounge-preview .overhead-lounge { position:absolute; inset:0; width:100%; height:100%; margin:0; aspect-ratio:auto; overflow:hidden; border-radius:0; z-index:-2; }
.lounge-world { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); background:url('assets/milo-garden-lounge.webp') center / 100% 100% no-repeat; mask-image:linear-gradient(to right,transparent,#000 10%,#000 90%,transparent); }
body.r-page #lounge-preview .overhead-lounge { mask-image:linear-gradient(to bottom,transparent,#000 18%,#000 78%,transparent); }
body.r-page #lounge-preview .overhead-lounge::before { content:''; position:absolute; inset:-40px; background:url('assets/milo-garden-lounge.webp') center / cover no-repeat; filter:blur(32px); opacity:.12; }
body.r-page #lounge-preview::after { content:''; position:absolute; inset:0; z-index:-1; pointer-events:none; background:rgba(255,243,230,.09); mask-image:linear-gradient(transparent,#000 25%,#000 75%,transparent); }
body.r-page #lounge-preview .preview-top { display:block; margin:0; padding:28px 24px 0; }
body.r-page #lounge-preview .preview-status { margin:8px 0 0; padding:0 24px; font-size:clamp(15px,1.6vw,21px); font-weight:700; }
body.r-page #lounge-preview .preview-note { position:absolute; bottom:20px; left:0; width:100%; margin:0; padding:0 24px; box-sizing:border-box; opacity:1; }
.lounge-walker { position:absolute; width:8%; aspect-ratio:1; transform:translate(-50%,-90%); pointer-events:none; }
.lounge-walker::before { content:''; position:absolute; width:54%; height:12%; bottom:4%; left:23%; border-radius:50%; background:#452b1c; opacity:.12; filter:blur(3px); }
.lounge-walker i { display:block; width:100%; height:100%; background-image:url('assets/milo-walking-animals.webp'); background-size:400% 200%; background-repeat:no-repeat; transform-origin:50% 88%; }
.lounge-dome { position:absolute; width:19%; aspect-ratio:1.25; z-index:100; pointer-events:none; transform-origin:50% 100%; border:1px solid rgba(255,255,255,.75); border-bottom-color:rgba(210,140,156,.3); border-radius:52% 52% 42% 42%; background:radial-gradient(ellipse at 28% 18%,rgba(255,255,255,.45),transparent 30%),linear-gradient(135deg,rgba(255,249,227,.13),rgba(245,178,199,.12)); box-shadow:inset 0 0 14px rgba(255,252,241,.3),0 3px 14px rgba(182,117,139,.09); }
.lounge-dome::before { content:''; position:absolute; left:16%; top:12%; width:25%; height:25%; border-top:2px solid rgba(255,255,255,.65); border-radius:50%; transform:rotate(-32deg); }
@media(max-width:650px) {
  body.r-page #lounge-preview { height:94vw; min-height:350px; max-height:none; }
  .lounge-world { mask-image:linear-gradient(to right,transparent,#000 4%,#000 96%,transparent); }
  body.r-page #lounge-preview .preview-note { font-size:11px; padding-inline:20px; }
}
