html,body{height:100%;margin:0}
.layout{height:100%;display:flex}
.panel{width:320px;max-width:42vw;overflow:auto;border-right:1px solid #e5e5e5;padding:16px;box-sizing:border-box}
.panel-head h1{font-size:16px;margin:0 0 6px}
.meta{font-size:12px;color:#666;margin:0 0 12px}
.toggles{display:flex;flex-direction:column;gap:8px}
.toggle{display:flex;align-items:center;gap:8px;cursor:pointer}
.toggle input{cursor:pointer}
.toggle span{font-size:14px}
.legend{margin-top:16px;font-size:12px;color:#333}
.legend-row{display:flex;align-items:center;gap:8px;margin:6px 0}
.swatch{width:14px;height:14px;border:1px solid rgba(0,0,0,.15);box-sizing:border-box}
.map-wrap{flex:1;min-width:0}
#map{height:100%;width:100%}
.leaflet-tooltip{
  background:#ffffff;
  border:none;
  box-shadow:0 2px 8px rgba(0,0,0,.15);
  padding:8px 10px;
  font-size:13px;
}