:root{--bronze:#8a6a3c;--ink:#2b241b;--ivory:#f3ece0;--glass:rgba(32,26,19,.62)}
*{box-sizing:border-box}
html,body{margin:0;height:100%;background:#1b1712;font-family:"Segoe UI","Leelawadee UI",Tahoma,sans-serif;color:var(--ivory);overflow:hidden}
#pano{position:fixed;inset:0}
#bar{position:fixed;top:0;left:0;right:0;display:flex;align-items:center;gap:12px;padding:10px 14px;padding-top:max(10px,env(safe-area-inset-top));
  background:linear-gradient(180deg,rgba(20,16,11,.75),rgba(20,16,11,0));z-index:10;pointer-events:none}
#bar>*{pointer-events:auto}
.brand{color:var(--ivory);text-decoration:none;font-size:15px;white-space:nowrap}
.brand span{color:#d8c39b;font-weight:300}
#title{flex:1;text-align:center;font-size:16px;font-weight:600;text-shadow:0 1px 6px #000;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
nav{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
nav button{background:var(--glass);color:var(--ivory);border:1px solid rgba(216,195,155,.45);border-radius:18px;padding:7px 12px;font-size:13px;cursor:pointer;backdrop-filter:blur(6px)}
nav button.on{background:var(--bronze);border-color:#d8c39b}
.panel{position:fixed;z-index:9;background:var(--glass);border:1px solid rgba(216,195,155,.35);border-radius:14px;backdrop-filter:blur(8px);box-shadow:0 8px 30px rgba(0,0,0,.35)}
.hidden{display:none!important}
#rooms{top:58px;right:12px;max-height:70vh;overflow:auto;padding:8px;width:min(340px,92vw)}
#rooms a{display:flex;gap:10px;align-items:center;padding:6px;border-radius:10px;color:var(--ivory);text-decoration:none;font-size:13px}
#rooms a:hover,#rooms a.cur{background:rgba(138,106,60,.55)}
#rooms img{width:72px;height:36px;object-fit:cover;border-radius:6px;background:#333}
#minimap{left:12px;bottom:max(12px,env(safe-area-inset-bottom));width:min(330px,46vw);padding:8px}
#mm{width:100%;height:auto;display:block}
.mm-legend{font-size:11px;color:#d8c39b;margin-top:2px}.mm-legend .lv{color:#e9b86b}
#mm .room{fill:rgba(243,236,224,.10);stroke:none}#mm .room.ext{fill:rgba(160,170,175,.15)}
#mm .wall{fill:#d9cbb0}#mm .lvl{fill:rgba(233,184,107,.18);stroke:#e9b86b;stroke-width:40;stroke-dasharray:120 70}
#mm .dot{fill:#f3ece0;stroke:#2b241b;stroke-width:40;cursor:pointer}#mm .dot.loft{fill:#e9b86b}
#mm .dot.cur{fill:#c8913f;stroke:#fff;stroke-width:60}
#mm .cone{fill:rgba(200,145,63,.45)}
#before{left:50%;top:50%;transform:translate(-50%,-50%);width:min(980px,94vw);max-height:86vh;overflow:auto;padding:12px}
.bf-head{display:flex;gap:10px;align-items:baseline;margin-bottom:8px}.bf-head span{flex:1;font-size:12px;color:#d8c39b}
.bf-head button{background:none;border:0;color:var(--ivory);font-size:18px;cursor:pointer}
.bf-body{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media (max-width:700px){.bf-body{grid-template-columns:1fr}}
.bf-lab{font-size:12px;letter-spacing:.08em;color:#d8c39b;margin-bottom:4px}
#bf-photos{display:grid;grid-template-columns:1fr 1fr;gap:6px}#bf-photos img{width:100%;border-radius:8px;cursor:zoom-in}
#bf-after{width:100%;border-radius:8px;cursor:zoom-in}
#lightbox{position:fixed;inset:0;background:rgba(0,0,0,.88);z-index:20;display:flex;align-items:center;justify-content:center}
#lightbox img{max-width:96vw;max-height:92vh}
#note{position:fixed;right:12px;bottom:max(10px,env(safe-area-inset-bottom));font-size:11px;color:rgba(243,236,224,.7);z-index:8;text-shadow:0 1px 3px #000;max-width:46vw;text-align:right}
/* hotspots */
.hs-walk{width:46px;height:46px;border-radius:50%;background:rgba(43,36,27,.55);border:2px solid #f3ece0;box-shadow:0 0 0 6px rgba(200,145,63,.25);cursor:pointer;transition:transform .15s}
.hs-walk:hover{transform:scale(1.12)}
.hs-walk::after{content:"";position:absolute;left:50%;top:50%;width:14px;height:14px;border-top:3px solid #f3ece0;border-right:3px solid #f3ece0;transform:translate(-60%,-35%) rotate(-45deg)}
.hs-walk span{visibility:hidden;position:absolute;bottom:56px;left:50%;transform:translateX(-50%);white-space:nowrap;background:var(--glass);padding:4px 10px;border-radius:10px;font-size:12px;color:var(--ivory);border:1px solid rgba(216,195,155,.4)}
.hs-walk:hover span{visibility:visible}
@media (hover:none){.hs-walk span{visibility:visible;font-size:11px}}
.pnlm-load-box{background:var(--glass)!important;border-radius:12px!important}
.pnlm-controls-container{top:64px!important}
.pnlm-panorama-info{display:none!important}
#note{font-size:12px;background:rgba(32,26,19,.45);padding:3px 8px;border-radius:8px}