/* A single, front-facing wall. Three.js supplies the depth; the DOM supplies access. */
html:has(.lounge-page),body.lounge-page{height:100%;overflow:hidden}
.lounge-page{--wall:#f2f0e8;background:var(--wall)}
.lounge-page main{height:100dvh}
.room-arrival{display:none}
.room-loading .room-arrival,.room-arrived .room-arrival{display:grid;place-items:center;position:fixed;inset:0;z-index:1000;background:#fff;opacity:1;visibility:visible;transition:opacity .15s ease,visibility 0s}
.room-loading body>:not(.room-arrival){visibility:hidden}
:root.room-loading[data-time]{--nav-ink:#000;--nav-paper:#f2f0ea;--nav-hover:#e5e3db}
:root.room-loading #logo{filter:none}
.arrival-copy{position:relative;display:grid;place-items:center;color:#000}
.arrival-copy button{display:none;position:absolute;top:48px;white-space:nowrap;background:transparent;border:0;color:#000;text-decoration:underline;text-underline-offset:4px;padding:12px;font-size:12px}
.room-loading-slow .arrival-copy button{display:block}
.room-loading #main{opacity:0}
.room-arrived .room-arrival{opacity:0;visibility:hidden;pointer-events:none;transition:opacity .15s ease,visibility 0s .15s}
.room-arrived .loader-bridge-fill{animation:none}
@media(prefers-reduced-motion:reduce){.room-arrival,.room-arrived .room-arrival{transition:none}}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.room-view{position:absolute;inset:0;overflow:hidden;background:var(--wall);isolation:isolate}
.wall-canvas{position:absolute;inset:0;width:100%;height:100%;opacity:0;pointer-events:none}
.wall-ready .wall-canvas{opacity:1}
.wall-cornice{position:absolute;inset:100px 0 auto;height:22px;background:linear-gradient(#ece9dd 0 14%,#faf7ef 15% 36%,#ded9cb 37% 43%,#f6f0df 44% 70%,#fdfaf2 71% 83%,#dcd7c8 84%);box-shadow:0 8px 14px #4d483a16}
.wall-composition{position:absolute;inset:0}
.photo-gallery{position:absolute;left:4%;top:21%;width:64%;height:65%;padding:0;border:0;background:transparent;transform-origin:0 0}

.portrait-wall{position:relative;width:100%;height:100%;outline:none;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));grid-template-rows:repeat(4,minmax(0,1fr));gap:15px;touch-action:none}
.portrait-frame{position:relative;min-width:0;min-height:0;margin:0;padding:5px 5px 22px;background:#fcfaf5;box-shadow:1px 2px 4px #5a402c28;transform:rotate(var(--angle,0deg));transform-origin:center;user-select:none;-webkit-user-select:none;touch-action:none;cursor:grab}
.board-arranged .portrait-frame{position:absolute;width:var(--photo-width);height:var(--photo-height);left:var(--photo-x);top:var(--photo-y)}
.portrait-photo,.portrait-mat{display:block;width:100%;height:100%;min-height:0}
a.portrait-photo{outline-offset:3px;touch-action:none;cursor:pointer}
.portrait-mat{overflow:hidden;background:#d8d8c8}
.portrait-frame img{width:100%;height:100%;object-fit:cover;object-position:center 35%;pointer-events:none}
.polaroid-name{position:absolute;inset:auto 0 0;width:100%;height:22px;padding:0;border:0;background:transparent;color:#6e685b;font:10px/22px 'Instrument Sans',sans-serif;text-align:center;letter-spacing:.02em;cursor:grab;touch-action:none}
.portrait-frame.is-picked,.portrait-frame.is-dragging{z-index:50!important;cursor:grabbing}
.portrait-frame.is-picked,.polaroid-name:focus-visible,a.portrait-photo:focus-visible{outline:2px solid #79988b;outline-offset:3px}
.portrait-frame.is-dragging .polaroid-name{cursor:grabbing}
.is-empty{display:none}
.room-objects{position:absolute;inset:0;pointer-events:none}
.room-objects>*{position:absolute;pointer-events:auto;transform-origin:0 0}
.wall-tv{left:80.5%;top:64%;width:17.5%;height:auto;aspect-ratio:16/10;border:7px solid #151716;border-bottom-width:10px;border-radius:7px;background:#111513;box-shadow:4px 8px 16px #303f352a}
.wall-painting{left:69.5%;top:62%;width:9%;height:auto;aspect-ratio:3/4;margin:0;padding:5px;border:5px solid #92704a;background:#b09369;box-shadow:3px 5px 3px #66503033,8px 12px 18px #352b1c20}
.wall-painting img{height:100%;width:100%;object-fit:cover}
.tv-toggle{position:absolute;inset:0;display:grid;place-items:center;width:100%;height:100%;background:transparent;border:0;cursor:pointer;padding:0}
.tv-toggle[hidden]{display:none}
.tv-toggle img{width:30%;height:auto;filter:brightness(0) invert(1);opacity:.68}
.tv-toggle:focus-visible{outline:2px solid #79988b;outline-offset:8px}
.tv-status{position:absolute;inset:0;display:grid;place-items:center;background:#17251f;color:#f6f0df;font-size:12px;line-height:1.3;padding:8px}
.tv-status[hidden]{display:none}
.tv-toggle .tv-preview,.wall-ready .tv-toggle .tv-preview{width:100%;height:100%;object-fit:cover;filter:none;opacity:1;border-radius:4px;position:absolute;inset:0}
.has-video .tv-toggle::after{content:'';position:absolute;width:0;height:0;border-top:9px solid transparent;border-bottom:9px solid transparent;border-left:14px solid #fff;filter:drop-shadow(0 1px 5px #000a)}
.room-video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#11221c;border:0;border-radius:4px}
.room-video[hidden]{display:none}
/* Transparent hit surfaces stay aligned with the real 3D objects. */
.wall-ready .wall-cornice{visibility:hidden}
.wall-ready .photo-gallery,.wall-ready .wall-tv,.wall-ready .wall-painting{background:transparent;border-color:transparent;box-shadow:none}
.wall-ready .portrait-frame,.wall-ready .portrait-mat{background:transparent!important;box-shadow:none!important}
.wall-ready .portrait-frame img,.wall-ready .polaroid-name,.wall-ready .wall-painting img,.wall-ready .tv-toggle img{opacity:0}
.wall-ready .polaroid-name:focus-visible{opacity:1;background:#fcfaf5}
[data-time="night"] .room-view{--wall:#343b37}

[data-time="night"] .portrait-frame{background:#d9d7cb}
[data-time="night"] .portrait-frame img,[data-time="night"] .wall-painting img{filter:brightness(.8)}
[data-time="night"] .wall-ready .photo-gallery{background:transparent;border-color:transparent}
/* Tall sash windows and a desk replace the pinboard composition. */
.room-window{position:absolute;left:78%;top:18%;width:29%;height:65%;border:12px solid #eeeadf;background:linear-gradient(#dce8df 0 45%,#a5b9a0 60%,#769479);box-shadow:inset 6px 0 12px #63766533;pointer-events:none}
.room-window::before{content:'';position:absolute;left:48%;height:100%;width:10px;background:#eeeadf}
.room-window::after{content:'';position:absolute;top:26%;width:100%;height:9px;background:#eeeadf}
.room-sun{position:absolute;z-index:2;left:84%;top:29%;width:42px;height:42px}
.room-sun .celestial{width:30px;height:30px}
.wall-ready .room-window{opacity:0}
[data-time="night"] .room-window{background:linear-gradient(#0c1718,#243b31);border-color:#626a60}

.room-panorama{position:relative;width:100%;height:100%;overflow:hidden}
.room-pagination{display:none}
@media(max-aspect-ratio:4/5),(max-width:1100px) and (max-height:520px){
 .room-view{--room-pages:4;--photo-pages:3;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;scrollbar-width:none;touch-action:pan-x pinch-zoom}
 .room-view::-webkit-scrollbar{display:none}
 .room-panorama{width:calc(var(--room-pages)*100vw);height:100%;overflow:clip}
 .wall-cornice{top:82px;height:16px}
 .photo-gallery{left:24px;top:130px;width:calc(var(--photo-pages)*100vw - 48px);height:calc(100% - 192px);padding:0;border:0}
 .portrait-wall{grid-template-columns:repeat(9,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr));grid-auto-flow:column;gap:20px;touch-action:pan-x pinch-zoom}
 .portrait-frame{padding:5px 5px 22px;touch-action:pan-x pinch-zoom;cursor:default}
 a.portrait-photo,.polaroid-name{touch-action:pan-x pinch-zoom}
 .polaroid-name{height:22px;font-size:10px;line-height:22px;cursor:default}
 .room-window{left:calc(var(--photo-pages)*100vw + 6vw);top:17%;width:94vw;height:63%;border-width:10px}
 .room-sun{left:calc(var(--photo-pages)*100vw + 23vw);top:29%;width:44px;height:44px}.room-sun .celestial{width:30px;height:30px}
 .wall-tv{left:calc(var(--photo-pages)*100vw + 39vw);top:56%;width:53vw;height:auto;aspect-ratio:16/10;border-width:5px}
 .wall-painting{left:calc(var(--photo-pages)*100vw + 9vw);top:55%;width:24vw;height:auto;aspect-ratio:3/4;border-width:4px;padding:4px}
 .room-pagination{display:flex;position:fixed;z-index:8;bottom:max(16px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);align-items:center;gap:0}
 .room-pagination button{display:grid;place-items:center;width:30px;height:30px;border:0;background:transparent;padding:0;border-radius:50%}
 .room-pagination button::before{content:'';display:block;width:5px;height:5px;border-radius:5px;background:var(--ink);opacity:.26;transition:width .2s,opacity .2s}
 .room-pagination button[aria-current="true"]::before{width:17px;opacity:.8}
 .room-pagination button:focus-visible{outline:1px solid var(--ink);outline-offset:0}
}
@media(max-width:1100px) and (max-height:520px){
 .wall-cornice{top:62px}.photo-gallery{top:99px;height:calc(100% - 144px)}
 .room-window{top:25%;height:56%;width:73vw;left:calc(var(--photo-pages)*100vw + 25vw)}
 .wall-tv{top:43%;width:min(32vw,49.6vh);left:calc(var(--photo-pages)*100vw + 53vw)}
 .wall-painting{width:14vw;left:calc(var(--photo-pages)*100vw + 32vw)}
 .room-sun{top:29%;left:calc(var(--photo-pages)*100vw + 40vw)}
 .room-pagination{bottom:5px}
}
@media(prefers-reduced-motion:reduce){.room-pagination button::before{transition:none}}
