:root{--map-ink:#243337;--map-muted:#667774;--map-line:#dce7e4;--map-accent:#287c70;--map-bg:#f4f6f4;--map-paper:#fff;--map-warm:#956b43}
*{box-sizing:border-box}
body{margin:0;background:var(--map-bg);color:var(--map-ink)}
a{color:var(--map-accent)}
.mapHero{padding:24px 0 18px;border-bottom:1px solid var(--map-line)}
.mapHero .kicker,.mapSection .kicker{margin:0;color:var(--map-warm);font-size:11px;font-weight:950;letter-spacing:.11em}
.mapHero h1{margin:5px 0 8px;font-size:clamp(34px,4.4vw,50px);line-height:1.16;letter-spacing:-.035em}
.mapHero>p:not(.kicker){max-width:900px;margin:0;color:var(--map-muted);font-size:15px;line-height:1.75}
.mapHeroMeta{display:flex;gap:7px;flex-wrap:wrap;margin-top:12px}
.mapHeroMeta span{padding:5px 9px;border-radius:999px;background:#edf5f2;color:#41665f;font-size:11px;font-weight:850}

.mapWorkspace{padding:18px 0 34px}
.mapControlPanel{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(220px,.65fr);gap:18px;align-items:end;margin-bottom:14px;padding:15px 16px;border:1px solid #d8e4e0;border-radius:18px;background:#fff;box-shadow:0 5px 18px rgba(36,70,63,.045)}
.mapControlGroup>span,.mapMetricGroup>span,.mapPrefLabel>span{display:block;margin-bottom:7px;color:#667a75;font-size:11px;font-weight:950;letter-spacing:.04em}
.mapMetricGroup{grid-column:1/-1}.mapMetricButtons,.mapAreaButtons{display:flex;gap:7px;flex-wrap:wrap}.mapMetricButtons button,.mapAreaButtons button{min-height:42px;padding:8px 13px;border:1px solid #c8d9d4;border-radius:12px;background:#f9fbfa;color:#4c655f;font:inherit;font-size:13px;font-weight:850;cursor:pointer}.mapMetricButtons button[aria-pressed=true],.mapAreaButtons button[aria-pressed=true]{border-color:var(--map-accent);background:var(--map-accent);color:#fff}
.mapMetricButtons button:focus-visible,.mapAreaButtons button:focus-visible,.mapPrefLabel select:focus-visible,.mapTools button:focus-visible{outline:3px solid rgba(40,124,112,.3);outline-offset:2px}
.mapPrefLabel select{width:100%;min-height:42px;padding:8px 36px 8px 11px;border:1px solid #c8d9d4;border-radius:12px;background:#fff;color:var(--map-ink);font:inherit;font-size:13px;font-weight:800}
.mapControlPanel.is-non-rent .mapPrefLabel{grid-column:1/-1;max-width:360px}

.mapStatusStrip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-bottom:12px}
.mapStatusItem{padding:11px 12px;border:1px solid #dde7e4;border-radius:13px;background:#fff}
.mapStatusItem small{display:block;color:#7b8985;font-size:10px;font-weight:850}
.mapStatusItem strong{display:block;margin-top:2px;font-size:17px;line-height:1.25;font-variant-numeric:tabular-nums}

.metricMapShell{position:relative;border:1px solid #d7e3df;border-radius:20px;background:#fff;box-shadow:0 8px 28px rgba(36,70,63,.06);overflow:hidden}
.mapTools{display:flex;align-items:center;gap:7px;flex-wrap:wrap;padding:12px 14px;border-bottom:1px solid #e8efed;background:#fbfcfb}
.mapTools button{min-height:38px;padding:7px 11px;border:1px solid #d3dfdc;border-radius:999px;background:#fff;color:#46635d;font:inherit;font-size:12px;font-weight:850;cursor:pointer}
.mapTools [data-life-fit-map-zoom]{margin-left:auto;color:#778783;font-size:11px;font-weight:850}
.metricMapCanvas{position:relative;min-height:620px;background:linear-gradient(180deg,#fafcfc,#f3f7f5)}
.metricMapCanvas>svg{display:block;width:100%;height:auto;touch-action:none;cursor:grab;user-select:none}
.metricMapCanvas>svg.lifeFitMapV1Panning{cursor:grabbing}
.lifeFitMapV1Land{fill:url(#lifeFitMapV1LandGradient);stroke:#9fbdb7;stroke-width:1.35;vector-effect:non-scaling-stroke;filter:drop-shadow(0 5px 10px rgba(49,87,81,.10))}
.lifeFitMapV1Prefecture{fill:none;stroke:#9fb8b3;stroke-width:.62;opacity:.72;vector-effect:non-scaling-stroke;pointer-events:none}
.lifeFitMapV1Grid{stroke:#b8ceca;stroke-width:.75;opacity:.24;stroke-dasharray:3 7;vector-effect:non-scaling-stroke}
.lifeFitMapV1Inset{fill:rgba(255,255,255,.88);stroke:#c9d9d5;stroke-width:1.2}
.lifeFitMapV1InsetTitle{font-size:10px;font-weight:850;fill:#5d7470;letter-spacing:.02em}
.lifeFitMapV1Leader{stroke:#78958e;stroke-width:1;opacity:.58;vector-effect:non-scaling-stroke}
.lifeFitMetricMarker{cursor:pointer}
.lifeFitMetricDot{stroke:#fff;stroke-width:1.2;vector-effect:non-scaling-stroke;filter:drop-shadow(0 1px 2px rgba(35,62,58,.16));transition:stroke-width .12s ease,opacity .12s ease}
.lifeFitMetricMarker:hover .lifeFitMetricDot,.lifeFitMetricMarker:focus .lifeFitMetricDot{stroke:#203a36;stroke-width:2.5}
.lifeFitMetricDot.bucket-0,.lifeFitMetricSwatch.bucket-0{fill:#287c70;background:#287c70}
.lifeFitMetricDot.bucket-1,.lifeFitMetricSwatch.bucket-1{fill:#69aa9d;background:#69aa9d}
.lifeFitMetricDot.bucket-2,.lifeFitMetricSwatch.bucket-2{fill:#d2bc78;background:#d2bc78}
.lifeFitMetricDot.bucket-3,.lifeFitMetricSwatch.bucket-3{fill:#e79a6d;background:#e79a6d}
.lifeFitMetricDot.bucket-4,.lifeFitMetricSwatch.bucket-4{fill:#cf675b;background:#cf675b}

.lifeFitMetricDot.neutral-0,.lifeFitMetricSwatch.neutral-0{fill:#d8ecea;background:#d8ecea}
.lifeFitMetricDot.neutral-1,.lifeFitMetricSwatch.neutral-1{fill:#acd4cf;background:#acd4cf}
.lifeFitMetricDot.neutral-2,.lifeFitMetricSwatch.neutral-2{fill:#72b4ac;background:#72b4ac}
.lifeFitMetricDot.neutral-3,.lifeFitMetricSwatch.neutral-3{fill:#428f86;background:#428f86}
.lifeFitMetricDot.neutral-4,.lifeFitMetricSwatch.neutral-4{fill:#256b64;background:#256b64}
.lifeFitMetricDot.is-missing{fill:#d8dddc;stroke:#b8c2bf;opacity:.78}
.lifeFitMetricSwatch.is-missing{background:#d8dddc}
.lifeFitMapV1Status{min-height:590px;display:grid;place-items:center;padding:28px;text-align:center;color:#64777b;line-height:1.7}
.lifeFitMapV1Tooltip{position:absolute;z-index:5;pointer-events:none;transform:translate(10px,-100%);max-width:240px;padding:8px 10px;border-radius:10px;background:rgba(35,54,57,.95);color:#fff;font-size:12px;font-weight:800;line-height:1.45;box-shadow:0 8px 22px rgba(18,36,39,.20)}
.lifeFitMapV1Tooltip[hidden]{display:none}

.metricMapFooter{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;align-items:center;padding:13px 15px;border-top:1px solid #e8efed;background:#fff}
.metricMapLegend{display:flex;gap:10px 14px;flex-wrap:wrap}
.metricMapLegend span{display:inline-flex;align-items:center;gap:5px;color:#64736f;font-size:11px}
.lifeFitMetricSwatch{width:10px;height:10px;border-radius:50%;display:inline-block;flex:0 0 auto}
.lifeFitMapV1Miss{color:#8a6d55;font-size:11px;line-height:1.55}
.lifeFitMapV1Miss[hidden]{display:none}
.metricSelection{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:12px;padding:14px 16px;border:1px solid #dbe6e3;border-radius:15px;background:#fff}
.metricSelection div{min-width:0}
.metricSelection small{display:block;color:#82908d;font-size:10px;font-weight:900}
.metricSelection strong{display:block;margin:2px 0;font-size:16px}
.metricSelection span{display:block;color:#5d706b;font-size:13px;font-weight:800}
.metricSelection a{flex:0 0 auto;min-height:40px;display:inline-flex;align-items:center;padding:8px 12px;border:1px solid #bcd3cd;border-radius:10px;text-decoration:none;font-size:12px;font-weight:900}

.mapNotice{margin:12px 0 0;padding:13px 15px;border-left:4px solid #b88447;background:#fffaf0;color:#6e604d;font-size:12px;line-height:1.7}
.mapNotice strong{color:#493e31}
.mapSection{padding:32px 0;border-top:1px solid var(--map-line)}
.mapSectionHead{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:12px}
.mapSectionHead h2{margin:4px 0 0;font-size:30px}
.mapSectionHead p{max-width:520px;margin:0;color:var(--map-muted);font-size:12px;text-align:right}
.mapRankList{border-top:1px solid var(--map-line)}
.mapRankRow{display:grid;grid-template-columns:48px minmax(0,1fr) 110px 110px;align-items:center;gap:12px;min-height:62px;border-bottom:1px solid var(--map-line);color:inherit;text-decoration:none}
.mapRankRow:hover{background:#f8faf9}
.mapRankNo{color:#71807c;font-weight:900}.mapRankPlace strong{display:block;font-size:15px}.mapRankPlace small{display:block;color:#7b8986;font-size:10px}.mapRankValue{text-align:right;color:#246e64;font-size:17px;font-weight:900;font-variant-numeric:tabular-nums}.mapRankAction{text-align:right;color:var(--map-accent);font-size:11px;font-weight:850}
.mapSource{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px;align-items:start;padding:24px 0}
.mapSource h2{margin:0 0 6px;font-size:22px}.mapSource p{margin:0;max-width:820px;color:var(--map-muted);font-size:12px;line-height:1.8}.mapSource a{font-size:12px;font-weight:850}
footer{margin-top:22px;padding-top:22px;border-top:1px solid var(--map-line);color:var(--map-muted);font-size:12px}

@media(max-width:800px){
 .mapControlPanel{grid-template-columns:1fr}.mapStatusStrip{grid-template-columns:repeat(2,1fr)}.metricMapCanvas{min-height:560px}.metricMapFooter{grid-template-columns:1fr}.mapSectionHead{display:block}.mapSectionHead p{margin-top:5px;text-align:left}.mapRankRow{grid-template-columns:38px minmax(0,1fr) 90px}.mapRankAction{display:none}.mapSource{grid-template-columns:1fr}
}
@media(max-width:600px){
 .mapHero{padding:8px 0 10px}.mapHero h1{font-size:30px;margin:3px 0 5px}.mapHero>p:not(.kicker){font-size:13px;line-height:1.6}.mapHeroMeta{margin-top:8px}.mapHeroMeta span{padding:4px 7px;font-size:10px}.mapWorkspace{padding-top:12px}.mapControlPanel{padding:12px;border-radius:15px}.mapMetricButtons{display:grid;grid-template-columns:repeat(3,1fr)}.mapMetricButtons button{padding:7px 5px;font-size:12px}.mapAreaButtons{display:grid;grid-template-columns:repeat(3,1fr)}.mapAreaButtons button{padding:7px 5px;font-size:11px}.mapStatusItem{padding:9px}.mapStatusItem strong{font-size:15px}.metricMapShell{border-radius:15px}.metricMapCanvas{min-height:520px}.mapTools{padding:9px}.mapTools button{min-height:40px}.metricMapFooter{padding:11px}.metricMapLegend{gap:8px}.metricSelection{align-items:flex-start;flex-direction:column}.metricSelection a{width:100%;justify-content:center}.mapRankRow{grid-template-columns:32px minmax(0,1fr) 82px;gap:7px}.mapRankPlace strong{font-size:13px}.mapRankValue{font-size:14px}.mapSectionHead h2{font-size:25px}
}
@media(prefers-reduced-motion:reduce){.lifeFitMetricDot{transition:none}}
