*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#010911;color:white;font-family:Arial,sans-serif}.viewport{min-height:100svh;display:flex;align-items:center;justify-content:center}.room{width:min(100vw,calc(100svh * 1080 / 1920));aspect-ratio:1080/1920;position:relative;overflow:hidden;flex-shrink:0;touch-action:manipulation}.layer{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;pointer-events:none;user-select:none;-webkit-user-select:none}.fade{opacity:1;transition:opacity .5s ease}.hidden.fade{opacity:0;pointer-events:none}.entry{position:absolute;inset:0;z-index:30}.entry-btn{position:absolute;inset:0;width:100%;height:100%;border:0;padding:0;cursor:pointer;background:transparent;transition:transform .12s ease}.entry-btn:active,.entry-btn.pressed{transform:scale(.975)}.entry-btn:focus-visible{outline:4px solid #ffd37b;outline-offset:-8px}.entry-btn .layer{pointer-events:none}.bubble-wrap{position:absolute;inset:0;z-index:21;pointer-events:none;transform-origin:18% 57%}.bubble-wrap .layer{position:absolute}.bubble-wrap.bounce{animation:bounce-in .43s cubic-bezier(.2,1.5,.35,1) both}.bubble-wrap.pop{animation:pop-out .26s ease-in both}@keyframes bounce-in{from{opacity:0;transform:translateY(2.5%) scale(.78)}75%{opacity:1;transform:translateY(-.6%) scale(1.04)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes pop-out{from{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.2)}}.hotspot{position:absolute;z-index:18;border:0;background:transparent;cursor:pointer}.hotspot:disabled{cursor:default}.hotspot:focus-visible{outline:3px solid #f9c663;border-radius:40%}.play{left:40%;top:70.9%;width:20%;height:10.3%;border-radius:50%}.prev{left:26%;top:72%;width:14%;height:8%}.next{left:61%;top:72%;width:15%;height:8%}.player-prog{position:absolute;z-index:12;left:20%;top:58.1%;width:60%;height:5%;display:flex;flex-direction:column;justify-content:flex-start;gap:6%;pointer-events:auto}.player-prog.hidden,.email-ui.hidden{pointer-events:none}.player-prog input{width:100%;height:35%;margin:0;cursor:pointer;accent-color:#e6e5e4;background:transparent;touch-action:none}.player-prog input::-webkit-slider-runnable-track{height:4px;border-radius:10px;background:linear-gradient(90deg,#eef0ef var(--progress,0%),#657b80 var(--progress,0%))}.player-prog input::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;height:14px;width:14px;border-radius:50%;background:#faf9f4;margin-top:-5px}.player-prog input{appearance:none;-webkit-appearance:none}.player-prog input::-moz-range-track{height:4px;background:#657b80}.player-prog input::-moz-range-progress{height:4px;background:#fff}.player-prog input::-moz-range-thumb{background:white;border:0;height:14px;width:14px;border-radius:50%}.times{display:flex;justify-content:space-between;font-size:clamp(10px,2.4vw,18px);font-weight:500;line-height:1}.email-ui{position:absolute;z-index:19;left:25%;top:57.8%;width:55%;height:7%;transition:opacity .5s}.email-ui form{display:flex;gap:1.5%;width:100%;height:45%;}.email-ui input{min-width:0;flex:1;background:#021219;color:#f6f6f6;border:1px solid #5b6669;border-radius:0;font-weight:700;font-size:clamp(7px,1.9vw,16px);padding:0 3%}.email-ui input::placeholder{color:#aab1b2;opacity:1}.email-ui button{border:1px solid #d4a42b;color:#f6cd58;background:#071017;font-weight:800;white-space:nowrap;font-size:clamp(7px,1.9vw,16px);padding:0 3%;cursor:pointer}.email-ui button:disabled{opacity:.6;cursor:wait}.email-feedback{font-size:clamp(8px,1.8vw,14px);margin:4px 0;color:#f7d37a;text-shadow:0 1px 4px #000}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}@media(min-width:700px){.times{font-size:17px}.email-ui input,.email-ui button{font-size:15px}}

/* Test 02: opacity animation completion must NEVER unhide a dialogue bubble. */
.layer.is-hidden { visibility: hidden; }
.bubble-wrap.hidden { visibility: hidden; opacity: 0; pointer-events: none; }
