:root{--bg:#f6f4ef;--fg:#16262a;--muted:#5b6b6e;--card:#fff;--line:#e2ddd2;--accent:#1f7a68;--warm:#d9822b}
@media(prefers-color-scheme:dark){:root{--bg:#0e1a1d;--fg:#eaf1ef;--muted:#92a5a6;--card:#14262a;--line:#223a3f;--accent:#7fd1b9;--warm:#f0a95a}}
*{box-sizing:border-box}
html,body{margin:0;height:100%;background:var(--bg);color:var(--fg);font:15px/1.45 system-ui,-apple-system,sans-serif}
#map{position:fixed;inset:0}
.panel{position:fixed;top:12px;left:12px;z-index:2;width:min(240px,calc(100vw - 24px));padding:12px 14px;background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:0 2px 10px rgba(0,0,0,.08)}
.home{font-weight:700;font-size:1.05rem;color:inherit;text-decoration:none;letter-spacing:-.01em}
.meter{margin:6px 0 6px;color:var(--muted);font-size:.9rem}
.meter b{color:var(--fg)}
.bar{height:6px;border-radius:3px;background:var(--line);overflow:hidden}
.bar i{display:block;height:100%;width:0;background:var(--accent);transition:width .6s}
.legend{list-style:none;margin:10px 0 0;padding:0;display:flex;gap:10px;flex-wrap:wrap;font-size:.8rem;color:var(--muted)}
.sw{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:5px;vertical-align:-1px}
.sw.live{background:var(--accent)}.sw.building{background:var(--warm)}.sw.unslopped{background:var(--line);border:1px solid var(--muted)}
.credit{position:fixed;right:8px;bottom:4px;z-index:2;margin:0;font-size:.72rem;color:var(--muted);background:color-mix(in srgb,var(--bg) 80%,transparent);padding:2px 6px;border-radius:6px}
.credit a{color:inherit}
/* HTML labels (MapLibre text would need a glyph service) */
.lbl{pointer-events:none;white-space:nowrap;font-size:11px;color:var(--muted);text-shadow:0 0 3px var(--bg),0 0 3px var(--bg)}
.lbl.prov{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.12em;opacity:.75}
.lbl.prov.live{color:var(--accent);opacity:1}
.lbl.city::before{content:"";display:inline-block;width:4px;height:4px;border-radius:50%;background:var(--muted);margin-right:4px;vertical-align:2px}
.lbl.cap{font-weight:600;color:var(--fg)}
.pin{cursor:pointer;display:flex;align-items:center;gap:6px;padding:3px 9px 3px 4px;background:var(--card);border:2px solid var(--accent);border-radius:999px;font-size:12px;font-weight:600;color:var(--fg);box-shadow:0 2px 8px rgba(0,0,0,.15);white-space:nowrap}
.pin::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--accent)}
.pin:hover,.pin:focus-visible{background:var(--accent);color:var(--card);outline:none}
.maplibregl-popup-content{background:var(--card);color:var(--fg);border-radius:10px;padding:10px 12px;font:13px/1.45 system-ui,-apple-system,sans-serif}
.maplibregl-popup-tip{border-top-color:var(--card)!important;border-bottom-color:var(--card)!important}
.pop .tag{font-size:.7rem;color:var(--accent);text-transform:uppercase;letter-spacing:.06em}
.pop h3{margin:2px 0 2px;font-size:1rem}
.pop p{margin:0 0 6px;color:var(--muted)}
.pop a{color:var(--accent);font-weight:600}
.pin.group{border-style:dashed}