:root{color-scheme:dark;--navy:#101b25;--panel:#16242f;--line:#ffffff1b;--gold:#ddbc82;--muted:#a3afb8;--text:#f4f4ef}*{box-sizing:border-box}body{margin:0;background:var(--navy);color:var(--text);font-family:Segoe UI,Arial,sans-serif;font-size:14px}button,input{font:inherit}button{border:1px solid var(--line);border-radius:7px;background:#ffffff06;color:var(--text);padding:10px 14px;cursor:pointer;transition:background .15s,border-color .15s;white-space:nowrap}button:hover{background:#ffffff14;border-color:#ffffff40}button:focus-visible,input:focus-visible,canvas:focus-visible{outline:2px solid var(--gold);outline-offset:3px}button:disabled{opacity:.4;cursor:default}button[aria-pressed=true],button.active{background:#ddbc821b;border-color:#ddbc8260;color:#f1d6a6}[hidden]{display:none!important}#app{height:100dvh;min-height:480px;display:flex;flex-direction:column;overflow:hidden}.topbar{height:76px;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;padding:0 28px;gap:22px;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:12px;min-width:210px}.brand svg{width:35px;height:35px;fill:var(--gold)}.brand strong{font-family:Georgia,serif;font-size:23px;letter-spacing:4px;font-weight:400;display:block;line-height:1.15}.brand span{color:var(--muted);font-size:9px;letter-spacing:3px}.view-switch{display:flex;background:#080f16;padding:4px;border:1px solid var(--line);border-radius:9px;gap:4px}.view-switch button{border:0;background:transparent;font-size:13px;padding:8px 17px}.view-switch .selected{background:#293641;color:var(--text)}.primary{background:var(--gold);color:#17212a;font-weight:600;border-color:var(--gold);min-width:174px}.primary:hover{background:#edd09f;color:#15212c}.primary span{margin-right:7px}#stage{position:relative;flex:1;min-height:0;overflow:hidden;background:radial-gradient(ellipse at center,#223f4c,#101820)}#panorama{width:100%;height:100%;display:block;cursor:grab;touch-action:none}#panorama.dragging{cursor:grabbing}#flatView{position:absolute;inset:0;display:grid;place-items:center;padding:26px}#flatImage{display:block;max-width:100%;max-height:100%;width:auto;height:auto;box-shadow:0 12px 45px #0008}#flatView .flat-guides{pointer-events:none;position:absolute;inset:26px;color:var(--gold);font-size:12px}.flat-guides .left-edge{position:absolute;left:0;top:50%;background:#101b25dd;padding:8px}.flat-guides .right-edge{position:absolute;right:0;top:50%;background:#101b25dd;padding:8px}.flat-guides i{position:absolute;left:0;right:0;top:50%;border-top:1px dashed #ddbc8270}.scene-title{position:absolute;left:28px;top:25px;pointer-events:none;text-shadow:0 2px 12px #000b;background:linear-gradient(90deg,#10212b99,transparent);padding:14px 45px 16px 18px;border-left:2px solid var(--gold)}.eyebrow{font-size:9px;letter-spacing:2.4px;color:#e2d1af}.scene-title h1{font:normal 27px Georgia,serif;margin:7px 0}.scene-title p{margin:0;color:#e7e9e9;font-size:12px}.direction{position:absolute;top:26px;right:28px;color:#edf1f2;background:#101b25ba;backdrop-filter:blur(10px);padding:9px 12px;border:1px solid #ffffff20;border-radius:7px;font-size:11px;font-variant-numeric:tabular-nums}.mini-map{position:absolute;left:28px;bottom:24px;width:224px;background:#101b25e6;backdrop-filter:blur(12px);border:1px solid #ffffff29;border-radius:9px;padding:10px}.mini-label{font-size:9px;letter-spacing:1.2px;display:flex;justify-content:space-between;color:#d7dcdf;margin-bottom:8px}.mini-image{height:92px;overflow:hidden;position:relative;border-radius:3px;background:#0b131b}.mini-image img{width:100%;height:100%;object-fit:fill;opacity:.8}.mini-image #mapPosition{position:absolute;left:50%;top:50%;width:8px;height:8px;background:#fff;border:2px solid var(--navy);box-shadow:0 0 0 1px white;border-radius:50%;transform:translate(-50%,-50%)}.map-seam{position:absolute;top:0;bottom:0;width:2px;background:var(--gold)}.map-seam.left{left:0}.map-seam.right{right:0}.mini-map p{font-size:10px;color:var(--muted);margin:8px 0 0;text-align:center}.canvas-actions{position:absolute;right:28px;bottom:24px;display:flex;gap:8px}.canvas-actions button{background:#101b25cf;backdrop-filter:blur(12px);border-color:#ffffff35}.canvas-actions button span{margin-left:5px}.canvas-actions button[aria-pressed=true]{color:var(--gold);border-color:var(--gold)}.toolbar{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:16px 28px;border-top:1px solid var(--line);background:var(--navy);flex-wrap:wrap}.presets{display:flex;gap:6px}.presets button{font-size:12px;padding:9px 12px}.inspect{display:flex;gap:16px;white-space:nowrap;font-size:12px;color:#c8d0d5}.inspect label{display:flex;align-items:center;gap:7px;cursor:pointer}.inspect input{accent-color:var(--gold);width:14px;height:14px}.zoom{display:flex;align-items:center;gap:8px}.zoom button{padding:3px 9px;font-size:20px;border:0}.zoom input{accent-color:var(--gold);width:100px;cursor:pointer}.bottomline{display:flex;gap:18px;padding:0 28px 14px;align-items:center;font-size:10px;color:var(--muted);flex-wrap:wrap}.bottomline button{padding:0;background:none;border:0;font-size:10px;color:#e1cba6;text-decoration:underline;text-underline-offset:3px}.local-badge{margin-left:auto;white-space:nowrap}.local-badge i{display:inline-block;background:#8bb99c;width:5px;height:5px;border-radius:100%;margin-right:5px}.loading{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;gap:12px;align-items:center;background:#101b25e6;padding:20px 26px;border:1px solid var(--line);border-radius:10px}.loading span{width:18px;height:18px;border:2px solid #ddbc8230;border-top-color:var(--gold);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.message{position:absolute;top:112px;left:50%;transform:translateX(-50%);max-width:min(660px,90%);padding:13px 18px;border:1px solid #ddbc8270;background:#14212bf2;color:#f0dfc0;border-radius:8px;z-index:5;font-size:13px;line-height:1.5}.message.error{border-color:#ed9584;color:#ffdbd4}#dropHint{position:absolute;inset:14px;background:#0e1f2bea;border:2px dashed var(--gold);border-radius:12px;display:grid;place-items:center;z-index:10;pointer-events:none;text-align:center}#dropHint strong{font:30px Georgia,serif;display:block;margin-bottom:14px}#dropHint span{color:var(--muted)}#crosshair{position:absolute;left:50%;top:50%;width:12px;height:12px;transform:translate(-50%,-50%);border:1px solid #fffc;border-radius:100%;box-shadow:0 0 1px 1px #0008;pointer-events:none;display:none}body.inspect-mode #crosshair{display:block}body.flat-mode .scene-title{display:none}body.flat-mode .direction,body.flat-mode .mini-map,body.flat-mode #crosshair{display:none}body.flat-mode .presets,body.flat-mode .zoom{opacity:.4;pointer-events:none}body.flat-mode #autoRotate{display:none}body.flat-mode .canvas-actions{bottom:12px;right:14px}body.flat-mode #gridToggle{visibility:hidden}body.flat-mode .inspect label:has(#gridToggle){display:none}
@media(max-width:1050px){.toolbar{gap:10px}.inspect{margin-left:auto}.zoom{display:none}.topbar{padding:0 20px}.brand{min-width:170px}.bottomline{padding-left:20px;padding-right:20px}.local-badge{display:none}}
@media(max-width:650px){#app{min-height:520px}.topbar{height:108px;padding:12px 16px;flex-wrap:wrap;gap:10px}.brand{min-width:0}.brand strong{font-size:18px}.brand svg{width:27px}.brand span{font-size:8px}.primary{min-width:0;font-size:12px;padding:9px 11px}.view-switch{order:3;width:100%;justify-content:center;padding:2px}.view-switch button{flex:1;padding:5px}.scene-title{left:16px;top:15px;padding:10px 25px 12px 12px}.scene-title h1{font-size:22px}.scene-title p{font-size:10px}.eyebrow{font-size:8px}.direction{right:16px;top:auto;bottom:68px;font-size:10px}.mini-map{display:none}.canvas-actions{bottom:16px;right:16px}.canvas-actions button{padding:9px 11px;font-size:12px}.toolbar{padding:11px 14px;gap:12px;justify-content:center}.presets{width:100%;justify-content:space-between;gap:4px}.presets button{font-size:10px;padding:9px 6px;flex:1}.inspect{margin:0;font-size:11px;gap:22px}.bottomline{padding:0 14px 10px;font-size:9px;gap:7px}.bottomline #imageNote{width:100%}.message{top:100px;font-size:12px}.zoom{display:none}}
@media(prefers-reduced-motion:reduce){button{transition:none}.loading span{animation:none}}

/* Desktop headset preview uses two square views, without a fake optical warp. */
body.headset-mode .scene-title,body.headset-mode .mini-map,body.headset-mode #crosshair{display:none}
body.headset-mode .direction{top:16px;right:50%;transform:translateX(50%);z-index:2}
#eyeLabels{position:absolute;inset:0 0 auto;display:flex;pointer-events:none;padding-top:18px}
#eyeLabels span{width:50%;text-align:center;font-size:10px;letter-spacing:2px;color:#efdfc1;text-shadow:0 2px 6px #000}
#headsetNote{position:absolute;bottom:72px;left:50%;transform:translateX(-50%);max-width:90%;width:max-content;background:#101b25df;border:1px solid #ddbc8230;border-radius:6px;color:#e4d4b7;font-size:11px;text-align:center;padding:9px 15px;pointer-events:none}
.vr-ready{border-color:#8bb99c!important;color:#b6e2c5!important}
#vrHelp{max-width:620px;width:calc(100% - 30px);background:#14222d;color:var(--text);border:1px solid #ddbc8255;border-radius:14px;padding:32px;box-shadow:0 20px 80px #0009}
#vrHelp::backdrop{background:#07131bcc;backdrop-filter:blur(5px)}
#vrHelp h2{font:normal 29px Georgia,serif;margin:12px 0 24px}
#vrHelp p{font-size:13px;line-height:1.65;color:#c4cdd4}
#vrHelp strong{color:#f0e1c6}#vrHelp a{color:var(--gold)}
#vrHelp .close-dialog{position:absolute;right:15px;top:12px;border:0;font-size:23px;padding:4px 9px}
#vrStatus{padding:12px 15px;border-left:2px solid var(--gold);background:#ddbc820b}
#vrHelp .vr-caveat{font-size:11px;color:#a5b4bd;border-top:1px solid var(--line);padding-top:15px;margin-top:20px}
#startSimulation{margin-top:10px}
@media(max-width:1050px){.view-switch button{padding-left:11px;padding-right:11px}.brand{min-width:145px}.topbar{gap:12px}}
@media(max-width:650px){.view-switch button{font-size:11px;padding:5px 8px}.canvas-actions{gap:5px}.canvas-actions button{padding:8px;font-size:11px}body.headset-mode .direction{top:43px;bottom:auto}#headsetNote{font-size:9px;padding:8px;bottom:62px}#eyeLabels{padding-top:18px}#eyeLabels span{font-size:9px;letter-spacing:1px}#vrHelp{padding:25px}#vrHelp h2{font-size:25px}}
