:root{
  --bg:#0e1622;
  --panel:#111d2e;
  --panel-2:#16273b;
  --border:#233a55;
  --text:#e6edf6;
  --muted:#9fb2c9;
  --accent:#3dd6c0;
  --accent-dim:#2aa88f;
  --danger:#ff5d5d;
  --warn:#ffb454;
  --class-b:#3b9ae1;
  --class-c:#c95be0;
  --class-d:#5b9be0;
  --class-e:#e05ba8;
  --doc:#ff7a3d;
  --radius:10px;
  --shadow:0 10px 30px rgba(0,0,0,.35);
}
*{box-sizing:border-box}
html,body{height:100%;margin:0}
body{
  font-family:"Inter",system-ui,-apple-system,sans-serif;
  background:var(--bg);color:var(--text);
  display:flex;flex-direction:column;
}
.app-header{
  display:flex;align-items:center;justify-content:space-between;
  padding:10px 18px;background:linear-gradient(180deg,#0b1422,#0e1622);
  border-bottom:1px solid var(--border);z-index:1000;
}
.brand{display:flex;align-items:center;gap:12px}
.logo{width:34px;height:34px;color:var(--accent);flex:none}
.brand-text h1{font-size:15px;font-weight:800;margin:0;letter-spacing:.2px}
.brand-text p{font-size:11px;color:var(--muted);margin:0}
.panel-toggle{display:none;background:none;border:1px solid var(--border);color:var(--text);border-radius:8px;padding:7px;cursor:pointer}

.app-main{flex:1;display:flex;min-height:0}
.panel{
  width:340px;flex:none;background:var(--panel);
  border-right:1px solid var(--border);overflow-y:auto;
  padding:14px 16px 30px;
}
.panel-section{padding:13px 0;border-bottom:1px solid var(--border)}
.panel-section h2{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.6px;color:var(--accent);margin:0 0 9px}
.hint{font-size:11.5px;color:var(--muted);line-height:1.5;margin:0 0 10px}
.coord-inputs{display:flex;gap:8px;margin-bottom:9px}
.coord-inputs label{flex:1;display:flex;flex-direction:column;font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;gap:3px}
.coord-inputs input{background:var(--panel-2);border:1px solid var(--border);color:var(--text);border-radius:7px;padding:8px 9px;font-family:"JetBrains Mono",monospace;font-size:12px;width:100%}
.coord-inputs input:focus{outline:none;border-color:var(--accent-dim)}
.coord-actions{display:flex;gap:8px}
.btn{border:none;border-radius:7px;padding:9px 12px;font-size:12px;font-weight:600;cursor:pointer;font-family:inherit}
.btn-primary{background:var(--accent);color:#06231d}
.btn-primary:hover{background:#4ee6cf}
.btn-ghost{background:transparent;border:1px solid var(--border);color:var(--text)}
.btn-ghost:hover{border-color:var(--accent-dim);color:var(--accent)}
.btn-ghost.active{background:var(--accent-dim);color:#06231d;border-color:var(--accent-dim)}

.result{font-size:12px;margin-top:12px;display:none}
.result.show{display:block}
.result .r-card{background:var(--panel-2);border:1px solid var(--border);border-radius:9px;padding:10px 11px;margin-bottom:9px}
.result .r-card.alert{border-color:var(--danger)}
.result .r-card.warn{border-color:var(--warn)}
.result .r-card.ok{border-color:var(--accent-dim)}
.result .r-title{font-weight:700;font-size:12.5px;display:flex;align-items:center;gap:7px;margin-bottom:6px}
.result .r-title .dot{width:9px;height:9px;border-radius:50%}
.result .r-sub{color:var(--muted);font-size:11px;line-height:1.45}
.result .r-sub a{color:var(--accent)}
.result .laanc-box{margin-top:9px;background:rgba(61,214,192,.08);border:1px solid var(--accent-dim);border-radius:8px;padding:9px 11px}
.result .laanc-box a{color:var(--accent);font-weight:600}
.result .coords{font-family:"JetBrains Mono",monospace;font-size:11px;color:var(--muted);margin-bottom:9px}

.layer-list{list-style:none;margin:0;padding:0}
.layer-list li{display:flex;align-items:center;gap:9px;padding:6px 0;font-size:12.5px;cursor:pointer;user-select:none}
.layer-list li:hover{color:var(--accent)}
.layer-list input{accent-color:var(--accent);width:15px;height:15px;flex:none}
.layer-list .sw{width:16px;height:9px;border-radius:3px;flex:none;border:1px solid rgba(255,255,255,.25)}
.layer-list .count{margin-left:auto;font-size:10px;color:var(--muted);font-family:"JetBrains Mono",monospace}

.legend{list-style:none;margin:0;padding:0;font-size:11.5px}
.legend li{display:flex;align-items:center;gap:9px;padding:4px 0;color:var(--muted)}
.legend .sw{width:18px;height:11px;border-radius:3px;flex:none;border:1px solid rgba(255,255,255,.2)}

.link-list{list-style:none;margin:0;padding:0;font-size:12px}
.link-list li{padding:5px 0}
.link-list a{color:var(--accent);text-decoration:none}
.link-list a:hover{text-decoration:underline}

.disclaimer p{font-size:10.5px;color:var(--muted);line-height:1.55;margin:0}

.map{flex:1;min-width:0;background:#0b1422}
.leaflet-container{background:#0b1422;font-family:inherit}
.leaflet-popup-content-wrapper{background:var(--panel);color:var(--text);border:1px solid var(--border);border-radius:8px}
.leaflet-popup-tip{background:var(--panel)}
.leaflet-popup-content{margin:11px 13px;font-size:12px;line-height:1.45}
.leaflet-popup-content b{color:var(--accent)}
.leaflet-popup-content .pop-sub{color:var(--muted);font-size:11px;margin-top:3px}
.leaflet-popup-content .pop-link{display:inline-block;margin-top:6px;color:var(--accent);font-weight:600;text-decoration:none}
.leaflet-control-zoom a{background:var(--panel)!important;color:var(--text)!important;border-color:var(--border)!important}
.leaflet-control-attribution{background:rgba(11,20,34,.8);color:var(--muted)!important}
.leaflet-control-attribution a{color:var(--muted)!important}

@media (max-width:820px){
  .panel-toggle{display:block}
  .panel{position:fixed;z-index:1100;left:0;top:53px;bottom:0;width:88vw;max-width:360px;transform:translateX(-100%);transition:transform .25s ease;border-right:1px solid var(--border);box-shadow:var(--shadow)}
  .panel.open{transform:translateX(0)}
  .app-main{display:block}
  .map{height:calc(100vh - 53px)}
}