html,body,#map{height:100%;margin:0}body{font-family:Arial,"Segoe UI",sans-serif;overflow:hidden}.topbar{position:fixed;z-index:1001;top:12px;left:50%;transform:translateX(-50%);background:rgba(15,23,42,.92);color:white;border-radius:14px;padding:10px 16px;box-shadow:0 6px 22px #0005;display:flex;gap:12px;align-items:center}.topbar h1{font-size:16px;margin:0;white-space:nowrap}.btn{border:0;border-radius:9px;background:#fff;color:#111827;padding:7px 10px;cursor:pointer;font-weight:700}.sidebar{position:fixed;z-index:1000;right:-370px;top:12px;bottom:12px;width:330px;transition:right .25s ease;background:rgba(255,255,255,.96);border-radius:16px;box-shadow:0 8px 30px #0004;overflow:auto;padding:15px;direction:rtl}.brand{padding:4px 2px 12px;border-bottom:1px solid #ddd}.brand h2{margin:0 0 5px;font-size:20px}.brand p{margin:0;color:#64748b;font-size:12px}.actions{display:flex;gap:7px;margin:12px 0}.actions button{flex:1}.group{border:1px solid #e5e7eb;border-radius:12px;margin:9px 0;overflow:hidden;background:#fff}.group-head{display:flex;align-items:center;gap:8px;padding:10px;cursor:pointer;background:#f8fafc}.group-head strong{flex:1;font-size:14px}.dot{width:11px;height:11px;border-radius:50%}.children{padding:5px 9px 8px}.children.collapsed{display:none}.layer-row{display:flex;align-items:center;gap:8px;padding:7px 3px;font-size:13px;cursor:pointer}.layer-row span{flex:1}.layer-row small{color:#94a3b8;margin-right:5px}.status{font-size:12px;color:#475569;background:#f1f5f9;padding:9px;border-radius:9px;margin-top:10px}.basemap{font-size:12px;margin:10px 0;padding:8px;background:#eef2ff;border-radius:9px}.popup table{border-collapse:collapse;width:100%;font-size:12px}.popup th,.popup td{border-bottom:1px solid #eee;padding:5px;text-align:right}.popup th{color:#475569;width:42%}.popup h3{margin:0 0 8px;font-size:15px}.sidebar.open{right:12px}.menu{display:block;position:fixed;z-index:1002;right:12px;top:12px;border:0;border-radius:11px;padding:10px 13px;background:#0f172a;color:#fff;font-size:16px;cursor:pointer;box-shadow:0 4px 14px #0005}.menu span{margin-right:5px;font:700 13px Arial,"Segoe UI",sans-serif}@media(max-width:800px){.sidebar{width:300px;top:8px;bottom:8px}.sidebar.open{right:8px}.menu{right:12px;top:12px}.menu span{display:none}.topbar{left:12px;transform:none;right:60px;justify-content:center}.topbar h1{font-size:13px}.topbar .btn{display:none}}
.topbar{left:50%;right:auto;transform:translateX(-50%);justify-content:center;width:max-content;max-width:calc(100vw - 100px)}
.topbar h1{white-space:normal}
.btn:focus-visible{outline:3px solid #38bdf8;outline-offset:2px}
@media(max-width:800px){
  .topbar{right:60px;left:12px}
}
.bearing-readout{position:fixed;z-index:1002;left:50%;bottom:18px;transform:translateX(-50%);padding:8px 13px;border-radius:10px;background:rgba(15,23,42,.92);box-shadow:0 4px 14px #0005;color:#fff;font:700 13px Arial,Segoe UI,sans-serif;direction:rtl;pointer-events:none}@media(max-width:800px){.bearing-readout{bottom:16px;font-size:12px}}
.menu{pointer-events:auto!important}
.rotation-hint{margin:0;color:#cbd5e1;font:600 12px Arial,Segoe UI,sans-serif;white-space:nowrap}@media(max-width:800px){.rotation-hint{display:none}}