.panorama-viewer{position:relative;isolation:isolate;overflow:hidden;background:#171714;min-height:240px;height:100%;touch-action:none}
.panorama-viewer>canvas{display:block;width:100%;height:100%;cursor:grab;outline-offset:-4px;touch-action:none}
.panorama-viewer>canvas:active{cursor:grabbing}
.panorama-hotspots{position:absolute;inset:0;pointer-events:none}
.panorama-hotspot{position:absolute;transform:translate(-50%,-50%);width:48px;height:48px;padding:0;border:2px solid rgba(255,255,255,.9);border-radius:50%;background:rgba(38,38,33,.72);color:#fff;pointer-events:auto;box-shadow:0 2px 16px #0005;display:grid;place-items:center;cursor:pointer}
.panorama-hotspot:hover,.panorama-hotspot:focus-visible{border-color:#f9b233;background:#262621}
.hotspot-arrow{display:block;width:28px;height:28px;line-height:1;transform-origin:center}.hotspot-arrow svg{display:block;width:100%;height:100%}
.hotspot-card{position:absolute;bottom:calc(100% + 12px);left:calc(50% + var(--hotspot-card-x,0px));transform:translateX(-50%);width:136px;max-width:calc(100vw - 32px);display:block;opacity:0;visibility:hidden;transition:opacity 180ms ease,visibility 180ms;overflow:visible;background:#262621;color:#f0f0eb;border:1px solid #ffffff60;border-radius:7px;box-shadow:0 8px 24px #0006;pointer-events:none;line-height:1.3;font:13px Arial,Helvetica,sans-serif;font-weight:400;text-align:center}
.hotspot-card::after{content:'';position:absolute;top:100%;left:calc(50% - var(--hotspot-card-x,0px));transform:translateX(-50%);width:0;height:0;border-left:8px solid transparent;border-right:8px solid transparent;border-top:9px solid #262621}
.hotspot-card-image{display:block;width:100%;height:90px;object-fit:cover;border-radius:6px 6px 0 0;background:#171714}
.hotspot-card-name{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere;padding:8px 7px;font-weight:500}
.panorama-hotspot.preview-below .hotspot-card{top:calc(100% + 12px);bottom:auto}
.panorama-hotspot.preview-below .hotspot-card::after{top:auto;bottom:100%;border-top:0;border-bottom:9px solid #262621}
.panorama-hotspot:focus-visible{z-index:2}.panorama-hotspot:focus-visible .hotspot-card{opacity:1;visibility:visible}
@media(hover:hover){.panorama-hotspot:hover{z-index:2}.panorama-hotspot:hover .hotspot-card{opacity:1;visibility:visible}}
.panorama-status{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);max-width:80%;padding:16px 20px;background:#262621ed;color:#f0f0eb;border-radius:12px;text-align:center;pointer-events:none}
.floorplan{position:absolute;z-index:5;right:18px;bottom:18px;display:flex;align-items:flex-end;flex-direction:column;gap:8px;max-width:calc(100% - 36px);color:#f0f0eb;font:13px Arial,Helvetica,sans-serif;touch-action:auto}
.floorplan-panel{width:340px;max-width:100%;border:1px solid #66665a;background:#262621f5;border-radius:12px;overflow:hidden;box-shadow:0 8px 28px #0006}
.floorplan-header{display:flex;align-items:center;gap:8px;padding:8px}
.floorplan-header select{flex:1;min-width:0;color:#f0f0eb;background:#34342e;border:1px solid #66665a;border-radius:6px;padding:7px;font:inherit}
.floorplan-header button{font-size:22px;line-height:1;background:transparent;border:0;color:#f0f0eb;cursor:pointer;padding:4px 8px}
.floorplan-map{position:relative;background:#edece5;line-height:0}
.floorplan-map img{display:block;width:100%;height:auto;pointer-events:none}
.floorplan-points{position:absolute;inset:0;pointer-events:none}
.floorplan-point{position:absolute;pointer-events:auto;transform:translate(-50%,-50%);border:2px solid white;box-shadow:0 1px 7px #0009;border-radius:50%;background:#262621;width:18px;height:18px;padding:0;cursor:pointer;touch-action:none;z-index:1}
.floorplan-point:hover,.floorplan-point:focus-visible{outline:3px solid #f9b233;z-index:3}
.floorplan-point.is-current{background:#f9b233;border-color:#262621;z-index:2}
.floorplan-direction{position:absolute;left:50%;top:50%;width:0;height:0;margin-left:-7px;margin-top:-28px;border-left:7px solid transparent;border-right:7px solid transparent;border-bottom:18px solid #f9b233;transform-origin:7px 28px;filter:drop-shadow(0 0 1px #262621)}
.floorplan-message{color:#262621;line-height:1.5;margin:0;padding:20px}
.floorplan-toggle{background:#262621ed;border:1px solid #66665a;color:#f0f0eb;border-radius:24px;padding:10px 16px;cursor:pointer;font:inherit;box-shadow:0 3px 16px #0004}
.floorplan-toggle:hover{border-color:#f9b233}
.floorplan-north{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:10px;font-size:12px}
.floorplan-north input{flex:1;min-width:100px;accent-color:#f9b233}
.floorplan-north output{min-width:35px}
.panorama-hotspot[hidden],.panorama-status[hidden],.hotspot-card-image[hidden],.floorplan[hidden],.floorplan-panel[hidden],.floorplan-north[hidden],.floorplan-map img[hidden],.floorplan-message[hidden]{display:none}
@media(max-width:700px){.floorplan{right:12px;bottom:12px;max-width:calc(100% - 24px)}.floorplan-panel{width:280px}.panorama-hotspot{width:44px;height:44px}}

.panorama-viewer>canvas.panorama-transition{position:absolute;inset:0;z-index:1;pointer-events:none;cursor:inherit}
@media(prefers-reduced-motion:reduce){.hotspot-card{transition:none}}