/* Map: base layers, pins, clusters, controls, preview sheet */
/* map */
.map{position:relative;overflow:hidden;background:var(--map-land);border-radius:18px;border:1px solid var(--line);touch-action:pan-y;user-select:none;-webkit-user-select:none}
.map.grab{cursor:grab}.map.grabbing{cursor:grabbing}
.map-svg{position:absolute;inset:0;width:100%;height:100%;display:block}
.home-map{height:clamp(420px,62vh,660px)}
.m-land{fill:var(--map-land)} .m-block{fill:var(--map-block)} .m-park{fill:var(--map-park)} .m-water{fill:var(--map-water)} .m-river{fill:none;stroke:var(--map-water);stroke-width:5;stroke-linecap:round}
.m-mount{fill:var(--map-mount)} .m-mount2{fill:var(--map-mount2)}
.m-street{fill:none;stroke:var(--map-road);stroke-width:1.6;stroke-linecap:round}
.m-road-c{fill:none;stroke:var(--map-case);stroke-width:6;stroke-linecap:round;stroke-linejoin:round}
.m-road{fill:none;stroke:var(--map-road);stroke-width:4;stroke-linecap:round;stroke-linejoin:round}
.m-major-c{fill:none;stroke:var(--map-major-case);stroke-width:8.5;stroke-linecap:round;stroke-linejoin:round}
.m-major{fill:none;stroke:var(--map-major);stroke-width:6;stroke-linecap:round;stroke-linejoin:round}
.m-metro{fill:none;stroke-width:3;stroke-dasharray:7 5;stroke-linecap:round;opacity:.8}
.m-label{fill:var(--map-label);font-family:var(--f-body);font-weight:600;font-size:calc(var(--lz,1) * 12px);letter-spacing:.12em;text-anchor:middle;text-transform:uppercase}
.m-plabel{fill:var(--good);opacity:.75;font-family:var(--f-body);font-size:calc(var(--lz,1) * 11px);font-weight:500;text-anchor:middle}
.m-mlabel{fill:var(--map-label);font-family:var(--f-display);font-size:22px;letter-spacing:.5em;text-anchor:middle;opacity:.7}
.map-pins{position:absolute;inset:0;pointer-events:none}
.pin{position:absolute;left:0;top:0;pointer-events:auto;border:1.5px solid var(--line);background:var(--surface);color:var(--ink);border-radius:999px;padding:0 11px 0 9px;height:34px;display:flex;align-items:center;gap:6px;font-weight:700;font-size:.9rem;white-space:nowrap;box-shadow:var(--shadow);transition:background .15s,color .15s,scale .15s;will-change:transform}
.pin::after{content:"";position:absolute;left:50%;bottom:-7px;width:10px;height:10px;background:inherit;border-right:1.5px solid var(--line);border-bottom:1.5px solid var(--line);transform:translateX(-50%) rotate(45deg);border-radius:0 0 3px 0}
.pin .dot{width:10px;height:10px;border-radius:50%;flex:none}
.pin:hover,.pin.hot,.pin.sel{background:var(--accent);color:var(--accent-ink);border-color:var(--accent);z-index:3;scale:1.08}
.pin:hover::after,.pin.hot::after,.pin.sel::after{border-color:var(--accent)}
.pin.drop{animation:drop .5s cubic-bezier(.2,1.4,.4,1)}
@keyframes drop{from{translate:0 -40px;opacity:0}to{translate:0 0;opacity:1}}
.cluster{position:absolute;left:0;top:0;pointer-events:auto;width:52px;height:52px;margin:-26px 0 0 -26px;border-radius:50%;background:var(--accent);color:var(--accent-ink);border:4px solid color-mix(in srgb,var(--accent) 35%,transparent);background-clip:padding-box;display:grid;place-items:center;font-weight:700;font-size:1.05rem;box-shadow:var(--shadow);transition:scale .15s}
.cluster:hover{scale:1.1}
.map-ctrl{position:absolute;right:calc(12px + env(safe-area-inset-right,0px));top:12px;display:grid;gap:8px;z-index:4}
.map-ctrl button{width:48px;height:48px;border-radius:12px;border:1.5px solid var(--line);background:var(--surface);font-size:1.5rem;font-weight:500;box-shadow:var(--shadow);display:grid;place-items:center}
.map-ctrl button:hover{border-color:var(--ink)}
.map-ctrl button.txt{width:auto;padding:0 12px;font-size:.85rem;font-weight:600}
.map-hint{position:absolute;left:12px;top:12px;z-index:4;background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:6px 10px;font-size:.85rem;color:var(--muted);box-shadow:var(--shadow);max-width:calc(100% - 90px)}
.map-legend{position:absolute;left:12px;bottom:12px;z-index:3;display:flex;flex-wrap:wrap;gap:6px 12px;background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:6px 10px;font-size:.8rem;color:var(--muted)}
.map-legend span{display:flex;align-items:center;gap:6px}
.map-legend i{width:10px;height:10px;border-radius:50%}
.sheet{position:absolute;z-index:5;left:12px;bottom:12px;width:min(380px,calc(100% - 24px));background:var(--surface);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);overflow:hidden;animation:up .25s ease-out}
@keyframes up{from{transform:translateY(16px);opacity:0}}
.sheet .ph{height:130px}
.sheet .bd{padding:12px 14px 14px;display:grid;gap:6px}
.sheet .x{position:absolute;right:8px;top:8px;width:40px;height:40px;border-radius:50%;border:0;background:rgba(0,0,0,.55);color:#fff;font-size:1.3rem}
.ph svg{display:block;width:100%;height:100%}
.map.active{box-shadow:inset 0 0 0 3px var(--accent)}
.map-lock{position:absolute;inset:0;z-index:6;display:grid;place-items:center;padding:24px;text-align:center;background:rgba(10,10,10,.5);color:#fff;font-weight:600;font-size:1.15rem;line-height:1.4;opacity:0;pointer-events:none;transition:opacity .25s}
.map-lock.show{opacity:1}
.map-fs{position:absolute;z-index:5;right:calc(12px + env(safe-area-inset-right,0px));bottom:12px;box-shadow:var(--shadow)}
.map.map-full{position:fixed;inset:0;z-index:75;height:auto;border-radius:0;border:0}
.map.map-full .map-ctrl{top:calc(12px + env(safe-area-inset-top,0px))}
.map.map-full .map-fs{top:calc(12px + env(safe-area-inset-top,0px));bottom:auto;left:calc(12px + env(safe-area-inset-left,0px));right:auto}
.map.map-full .map-hint{display:none}
.map.map-full .map-legend{bottom:calc(12px + env(safe-area-inset-bottom,0px))}
.map.map-full .sheet{bottom:calc(12px + env(safe-area-inset-bottom,0px))}
html.no-scroll{overflow:hidden}