:root { --bg:#0b0b0b; --card:#151515; --ink:#f0f0f0; --muted:#aaa; --border:#262626; --tap:#1b1b1b }
* { box-sizing:border-box; -webkit-tap-highlight-color:transparent }
html,body,#app { height:100%; margin:0 }
body { font-family:Montserrat,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif; background:var(--bg); color:var(--ink) }

#topbar { position:sticky; top:0; z-index:1000; display:flex; align-items:center; gap:10px; padding:12px 14px; background:linear-gradient(180deg,#0b0b0bcc,#0b0b0b66,#0000) }
#brand { flex:1; font-size:20px; letter-spacing:.3px }

.iconbtn { width:42px; height:42px; display:grid; place-items:center; background:var(--card); border:1px solid var(--border); border-radius:14px; color:var(--ink); cursor:pointer }
.iconbtn:active { background:var(--tap) }
.backbtn { font-size:24px; line-height:1 }

.burger span { display:block; width:18px; height:2px; background:var(--ink); margin:2px 0; border-radius:2px }

.view { padding:12px 12px 0 12px }
.list { display:grid; gap:12px }
.card { background:var(--card); border:1px solid var(--border); border-radius:18px; padding:16px }
.card:active { background:var(--tap) }
.card h3 { margin:0; font-size:18px; font-weight:400 }

#map { position:fixed; inset:56px 0 0 0 }
.locate-btn { position:fixed; left:10px; bottom:16px; z-index:900; width:46px; height:46px; border-radius:14px; border:1px solid var(--border); background:var(--card); color:var(--ink); font-size:18px }

#menuPanel { position:fixed; inset:0; z-index:1200; background:rgba(0,0,0,.35) }
.menu-sheet { position:absolute; right:12px; top:64px; background:var(--card); border:1px solid var(--border); border-radius:16px; padding:8px; display:flex; flex-direction:column; gap:8px; min-width:140px }
.menu-item { appearance:none; border:1px solid var(--border); background:#111; color:var(--ink); padding:10px 12px; border-radius:12px; text-align:left }
.menu-item:active { background:var(--tap) }

.leaflet-control-zoom { margin:10px 0 0 10px }
.leaflet-tooltip.label { background:#000c; border:1px solid #000; color:#fff; border-radius:8px; padding:2px 6px; font-size:12px }
.leaflet-container { background:#000 }

@media (min-width:768px){ .view{ max-width:680px; margin:0 auto } #map{ inset:60px 0 0 0 } }