/* Keep the two-scene teaching layout; bind its entrances to spherical coordinates. */
[hidden]{display:none!important}
#stage.scene-one,#stage.scene-two{background-image:none;background-color:#655a42}
#panorama{position:absolute;inset:0;width:100%;height:100%;touch-action:none;cursor:grab}
#panorama.dragging{cursor:grabbing}
#panorama:focus-visible{outline:3px solid #e0c684;outline-offset:-3px}
#world{position:absolute;inset:0;pointer-events:none;overflow:hidden}
#world button{pointer-events:auto}
#world .hero,#world .hotspot{position:absolute;right:auto;bottom:auto;transform:translate(-50%,-50%)}
#world .hero{width:38%;padding:.4cqw;color:#584326;pointer-events:none}
.hero h1{font-size:2.7cqw;margin:1cqw 0}.hero p{font-size:1.15cqw}
.hotspot{font-size:1.15cqw;background:#fff8e8ed;box-shadow:0 0 14px #f7d38b80}
#world .hotspot:after{box-shadow:0 0 0 5px #fff6db88,0 0 14px #ffe397}
.pano-controls{position:absolute;bottom:12%;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:6px;white-space:nowrap;z-index:2;background:#fff8e5d9;border-radius:28px;padding:5px}
.pano-controls button{font-size:12px;padding:6px 12px;min-height:34px}.pano-controls span{font-size:12px;min-width:38px;text-align:center}
.pano-hint{position:absolute;left:50%;bottom:7.7%;transform:translateX(-50%);margin:0;font-size:11px;white-space:nowrap;background:#fff8e5cc;border-radius:15px;padding:3px 12px;pointer-events:none}
#panoStatus,#panoError{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:5;padding:18px;border-radius:12px;background:#fff8e8;max-width:85%;text-align:center}
.guide{pointer-events:none}
@media(max-width:850px){.pano-controls{bottom:14%}.pano-controls button{font-size:11px;min-height:30px;padding:4px 8px}.pano-hint{display:none}}
@media(max-width:500px) and (orientation:portrait){#stage{width:100vw;height:100dvh;top:0;transform:none}header{left:10px;right:10px;flex-direction:column;gap:8px}.tools button{font-size:12px;min-height:34px}#sceneTitle{font-size:14px}#world .hero{width:80%}.hero h1{font-size:25px}.hero small{font-size:12px}.hero p{font-size:13px}.hero button{font-size:14px;min-height:38px}#world .hotspot{font-size:13px;min-height:38px}.pano-controls{bottom:12%;gap:3px}.pano-controls button{font-size:12px;min-height:36px}.pano-controls span{display:none}footer button{font-size:12px;padding:8px 12px}footer{bottom:3%}.guide{display:none}}