.room-bedroom [data-bedroom-clip]{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;pointer-events:none;opacity:var(--bedroom-opacity,0)!important;transition:none}
.speaker-hit{position:absolute;z-index:6;left:var(--speaker-left,68%);top:var(--speaker-top,49%);width:var(--speaker-width,5%);height:var(--speaker-height,9%);min-width:44px;min-height:44px;padding:0;border:0;border-radius:22%;background:transparent;color:inherit;cursor:pointer;touch-action:manipulation}
.speaker-hit[hidden],#room-sound[hidden]{display:none!important}
.speaker-hit .hello-tag{top:-27px}
.speaker-hit:hover .hello-tag,.speaker-hit:focus-visible .hello-tag{opacity:1;transform:translate(-50%,-3px)}
.speaker-hit:focus-visible{outline:1px solid #edf1be;outline-offset:5px}
.speaker-hit::after{content:'';position:absolute;left:50%;top:50%;width:7px;height:7px;border-radius:50%;background:#edf1be;box-shadow:0 0 10px #edf1be88;opacity:0;pointer-events:none;transform:translate(-50%,-50%)}
[data-music=playing] .speaker-hit::after{opacity:.7;animation:speaker-breathe 2.5s ease-in-out infinite}
@keyframes speaker-breathe{50%{opacity:.25;transform:translate(-50%,-50%) scale(.75)}}
#room-sound{display:inline-flex;align-items:center;gap:8px;min-width:44px;min-height:44px;padding:0;background:transparent;border:0;color:inherit;font:inherit;cursor:pointer;touch-action:manipulation}
#room-sound svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.4}
#room-sound[aria-pressed=true]{color:#edf1be}
#room-sound:focus-visible{outline:1px solid #edf1be;outline-offset:4px}
@media(max-width:600px){#room-sound span{display:none}#room-sound{width:44px;justify-content:center}.controls-right{gap:8px}}
@media(prefers-reduced-motion:reduce){[data-music=playing] .speaker-hit::after{animation:none}.speaker-hit .hello-tag{transition:none}}

/* The reading scene keeps its full architectural composition on narrow screens. */
.room-bedroom .droge-hit,.room-bedroom .reply{display:none!important}
.room-bedroom .speaker-hit{transform:translate(-50%,-50%)}
.room-bedroom .room-copy{max-width:min(660px,48vw)}
@media(max-width:850px){
 .room-bedroom .scene-frame{background:radial-gradient(ellipse at 60% 22%,#504330,#25271c 50%,#171812 82%)}
 .room-bedroom .composition{mask-image:none;transform-origin:50% 50%}
 .room-bedroom .scene-shade{background:linear-gradient(180deg,#080c0944,transparent 14%,transparent 60%,#171812 92%)}
 .room-bedroom .room-copy{max-width:calc(100vw - 44px)}
}

/* Full wide room compositions keep the environment and music objects visible. */
[data-wide] .speaker-hit{transform:translate(-50%,-50%)}
[data-wide] .droge-hit,[data-wide] .reply{display:none!important}
@media(max-width:850px){[data-wide] .scene-frame{background:radial-gradient(ellipse at 50% 22%,#403a2d,#171812 82%)}[data-wide] .composition{mask-image:none;transform-origin:50% 50%}[data-wide] .scene-shade{background:linear-gradient(180deg,#080c0933,transparent 14%,transparent 60%,#171812 92%)}[data-wide] .room-copy{max-width:calc(100vw - 44px)}}

/* Two decoded layers keep the detailed water loop opaque while the next copy seeks. */
.room-pool [data-pool-clip]{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;pointer-events:none;opacity:var(--pool-opacity,0)!important;transition:none}