.map-page {
    --map-ink: #292a25;
    --map-muted: #73756f;
    --map-line: #e7e7e1;
    --map-surface: #fff;
    --map-accent: #346538;
    color: var(--map-ink);
}

.map-page .site-footer { margin-top: 2rem; padding-bottom: 5rem; }
.map-main { padding-bottom: 1rem; }
.map-intro .breadcrumbs { margin-bottom: 1.5rem; }
.map-page .map-intro h1 { margin: 2.5rem 0 .65rem; }
.map-intro > p:last-child { max-width: 68ch; color: var(--map-muted); }
.map-kicker { margin: 0; color: var(--map-accent); font-size: .72rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }

.map-workspace {
    display: grid;
    grid-template-columns: minmax(270px, 320px) minmax(0, 1fr);
    min-height: 680px;
    height: min(78vh, 880px);
    margin-inline: auto;
    border: 1px solid var(--map-line);
    background: var(--map-surface);
}

.map-sidebar {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    min-width: 0;
    padding: 1.25rem;
    overflow-y: auto;
    border-right: 1px solid var(--map-line);
}

.map-controls { display: grid; gap: .75rem; }
.map-control { display: grid; gap: .25rem; }
.map-control[hidden], .map-stats[hidden] { display: none; }
.map-control label, .map-detail-eyebrow { color: var(--map-muted); font-size: .72rem; font-weight: 650; letter-spacing: .04em; }
.map-page .map-control select {
    width: 100%;
    min-height: 2.75rem;
    padding: .5rem .7rem;
    border: 1px solid #d8d8d0;
    border-radius: 4px;
    background: #fff;
    color: var(--map-ink);
    font-size: .82rem;
}
.map-toggle { display: flex; align-items: center; gap: .5rem; min-height: 2.75rem; color: var(--map-ink) !important; font-size: .8rem !important; cursor: pointer; }
.map-toggle input { width: 1rem; height: 1rem; margin: 0; accent-color: var(--map-accent); }
.map-heat-help { margin: -.75rem 0 0 1.5rem; color: var(--map-muted); font-size: .68rem; line-height: 1.4; }

.map-notice { padding: .7rem .8rem; border-left: 2px solid #8a9b77; background: #f5f6f2; color: #515c4d; font-size: .76rem; line-height: 1.5; }
.map-notice.is-error { border-color: #a14337; background: #fbf1ef; color: #782d26; }
.map-notice.is-warning { border-color: #b58a36; background: #faf6e9; color: #655222; }

.map-detail { padding-top: 1rem; border-top: 1px solid var(--map-line); }
.map-detail-eyebrow { margin: 0 0 .35rem; text-transform: uppercase; }
.map-page .map-detail h2 { margin: 0; font-size: 1.1rem; line-height: 1.3; }
.map-detail > p:not(.map-detail-eyebrow) { margin: .4rem 0 0; color: var(--map-muted); font-size: .78rem; }
.map-stats { display: grid; grid-template-columns: 1fr 1fr; gap: .85rem .65rem; margin: 1rem 0 0; }
.map-stats > div { min-width: 0; }
.map-stats dt { color: var(--map-muted); font-size: .68rem; }
.map-stats dd { margin: .1rem 0 0; color: var(--map-ink); font-size: .83rem; font-variant-numeric: tabular-nums; font-weight: 650; overflow-wrap: anywhere; }
.map-projects { margin-top: 1rem; }
.map-projects h3 { margin: 0 0 .45rem; font-size: .78rem; font-weight: 700; }
.map-project-status { margin: 0; color: var(--map-muted); font-size: .72rem; }
.map-project-status.is-error { color: #782d26; }
.map-project-links { margin: 0 0 .25rem; font-size: .68rem; }
.map-project-links a { color: var(--map-accent, #215db6); text-decoration: none; }
.map-project-links a:hover { text-decoration: underline; }
.map-project-list { display: grid; gap: .4rem; }
.map-project { display: flex; justify-content: space-between; gap: .5rem; padding-block: .4rem; border-top: 1px solid var(--map-line); font-size: .72rem; }
.map-project strong { overflow-wrap: anywhere; font-weight: 600; }
.map-project a.map-project-name { overflow-wrap: anywhere; font-weight: 600; color: inherit; text-decoration: none; }
.map-project a.map-project-name:hover { text-decoration: underline; }
.map-project span { flex: 0 0 auto; color: var(--map-muted); font-variant-numeric: tabular-nums; }

.map-legend { margin-top: auto; padding-top: 1rem; border-top: 1px solid var(--map-line); }
.map-page .map-legend h2 { margin: 0 0 .6rem; font-size: .78rem; font-weight: 700; }
.map-legend-scale { height: .55rem; background: linear-gradient(90deg, #e7e2ca, #c9bc8d, #a6a16b, #718555, #355e3e); }
.map-legend-labels { display: flex; justify-content: space-between; gap: .5rem; margin-top: .3rem; color: var(--map-muted); font-size: .67rem; font-variant-numeric: tabular-nums; }
.map-legend > p { margin: .65rem 0 0; color: var(--map-muted); font-size: .68rem; }
.map-credit { margin: 0; color: var(--map-muted); font-size: .65rem; line-height: 1.55; }
.map-credit a { color: var(--map-accent); text-decoration: underline !important; }

.map-canvas-wrap { position: relative; min-width: 0; min-height: 0; background: #e8e8e2; }
#property-map { position: absolute; inset: 0; }
.map-north-label { position: absolute; top: 1rem; left: 1rem; z-index: 1; padding: .4rem .6rem; border: 1px solid rgb(255 255 255 / .75); background: rgb(255 255 255 / .88); color: var(--map-ink); font-size: .7rem; font-weight: 650; pointer-events: none; }
.map-js-notice { position: absolute; inset: 1rem 1rem auto; z-index: 2; padding: .8rem; background: #fff; color: var(--map-ink); font-size: .8rem; }
#property-map .maplibregl-ctrl-group { border: 1px solid rgb(41 42 37 / .15); border-radius: 4px; box-shadow: none; }
#property-map .maplibregl-ctrl-group button { width: 38px; height: 38px; }
#property-map .maplibregl-ctrl-attrib { font-size: .62rem; }
#property-map .maplibregl-ctrl-logo { margin: 0 0 4px 4px; }
.map-popup-card { max-width: 280px; }
.map-popup-eyebrow { margin: 0 0 .25rem; color: var(--map-muted); font-size: .65rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.map-page .map-popup-title { margin: 0; font-size: .98rem; line-height: 1.3; }
.map-popup-stats { display: grid; grid-template-columns: 1fr 1fr; gap: .65rem .8rem; margin: .8rem 0 0; }
.map-popup-stats > div { min-width: 0; }
.map-popup-stats dt { color: var(--map-muted); font-size: .65rem; }
.map-popup-stats dd { margin: .1rem 0 0; color: var(--map-ink); font-size: .75rem; font-variant-numeric: tabular-nums; font-weight: 650; overflow-wrap: anywhere; }
.map-popup-empty { margin: .65rem 0 0; color: var(--map-muted); font-size: .75rem; line-height: 1.45; }
.map-popup-legend { margin-top: .8rem; padding-top: .7rem; border-top: 1px solid var(--map-line); }
.map-popup-legend-title { margin: 0 0 .4rem; font-size: .7rem; font-weight: 700; }
.map-popup-legend > p { margin: .5rem 0 0; color: var(--map-muted); font-size: .64rem; }
.map-popup-projects { margin-top: .8rem; padding-top: .65rem; border-top: 1px solid var(--map-line); }
.map-popup-projects h3 { margin: 0 0 .35rem; font-size: .7rem; }
.map-popup-projects .map-project { font-size: .66rem; }
.map-popup-projects .map-project span { max-width: 48%; text-align: right; white-space: normal; }
.map-fixed-popup {
    position: absolute;
    top: 1rem;
    left: 1rem;
    z-index: 4;
    min-width: 240px;
    max-width: min(320px, calc(100% - 2rem));
    padding: .9rem 1rem;
    border: 1px solid var(--map-line);
    border-radius: 4px;
    background: var(--map-surface);
    color: var(--map-ink);
    box-shadow: 0 4px 18px rgb(25 30 20 / .18);
    pointer-events: none;
}

@media (max-width: 760px) {
    .map-intro { padding-block: 1.8rem 1.1rem; }
    .map-workspace {
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: auto minmax(440px, 62vh);
        width: min(100% - 1.5rem, 640px);
        height: auto;
        min-height: 0;
    }
    .map-sidebar { gap: 1rem; padding: 1rem; overflow: visible; border-right: 0; }
    .map-controls { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7rem; }
    .map-control:nth-child(2) { grid-column: 1 / -1; }
    .map-toggle { align-self: center; }
    .map-detail { display: grid; grid-template-columns: minmax(0, 1fr); }
    .map-legend { margin-top: 0; }
    .map-canvas-wrap { grid-row: 2; }
    .map-fixed-popup {
        top: .75rem;
        left: .75rem;
        max-width: none;
    }
    .map-credit { max-width: 70ch; }
}

@media (max-width: 380px) {
    .map-workspace { width: calc(100% - 1rem); }
    .map-controls { grid-template-columns: minmax(0, 1fr); }
    .map-control:nth-child(2) { grid-column: auto; }
}

@media (prefers-reduced-motion: reduce) {
    .map-page *, .map-page *::before, .map-page *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; }
}