.explore-page .navbar { background: var(--clr-dark); }
.map-explorer { padding-top: 155px; }
.map-intro { padding-bottom: var(--space-xl); }
.map-intro .section-badge { margin-bottom: var(--space-sm); }
.map-intro h1 { font-family: var(--font-heading); font-size: clamp(2rem, 5vw, 3.6rem); line-height: 1.15; }
.map-intro p:not(.section-badge) { max-width: 700px; margin: 1rem 0; color: var(--clr-text-muted); }
.map-intro a, .map-directory a { color: var(--clr-easy); }
.map-controls { display: flex; align-items: end; gap: 1rem; flex-wrap: wrap; }
.map-controls fieldset { border: 0; min-width: 0; }
.map-controls legend, .map-controls label { font-weight: 600; font-size: .9rem; }
.map-controls legend { margin-bottom: .5rem; }
.map-controls label { display: grid; gap: .5rem; }
.map-chips { display: flex; gap: .5rem; flex-wrap: wrap; }
.map-explorer button, .map-explorer select { font: inherit; min-height: 44px; padding: .6rem .9rem; border: 1px solid var(--clr-text-muted); border-radius: var(--radius-sm); color: var(--clr-text); background: var(--clr-dark-card); cursor: pointer; }
.map-explorer button:disabled, .map-explorer select:disabled { opacity: .6; cursor: wait; }
.map-explorer button[aria-pressed="true"] { background: var(--clr-primary-dark); border-color: var(--clr-easy); box-shadow: inset 0 0 0 1px var(--clr-easy); }
.map-explorer :focus-visible { outline: 3px solid var(--clr-water); outline-offset: 3px; }
.map-dot { display: inline-block; width: .6rem; height: .6rem; border-radius: 50%; margin-right: .35rem; }
.map-dot.easy { background: var(--clr-easy); }
.map-dot.moderate { background: var(--clr-moderate); }
.map-dot.hard { background: var(--clr-hard); }
.map-notes { padding-top: 1rem; padding-bottom: 1rem; font-size: .85rem; color: var(--clr-text-muted); }
#map-status { color: var(--clr-text); margin-bottom: .25rem; }
.map-approx-key { color: var(--clr-moderate); font-weight: bold; }
#trail-map { height: calc(100vh - 140px); min-height: 420px; width: 100%; background: var(--clr-dark-surface); z-index: 0; scroll-margin-top: 130px; }
.map-help { font-size: .85rem; color: var(--clr-text-muted); padding-top: 1rem; padding-bottom: 2rem; }
.map-directory { padding-bottom: 3rem; scroll-margin-top: 140px; }
.map-directory h2 { font-family: var(--font-heading); font-size: 2rem; }
.map-directory ul { list-style: none; padding: 0; margin-top: 1rem; }
.map-directory li { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem 0; border-bottom: 1px solid var(--clr-border); scroll-margin-top: 140px; }
.map-directory li[hidden] { display: none; }
.map-directory li p { font-size: .85rem; color: var(--clr-text-muted); }
.map-directory button { flex-shrink: 0; }
.trail-pin { background: none; border: none; }
.trail-pin span { display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; margin: 6px; border: 3px solid var(--clr-white); border-radius: 50% 50% 50% 0; transform: rotate(-45deg); box-shadow: var(--shadow-md); background: var(--clr-easy); }
.trail-pin.moderate span { background: var(--clr-moderate); }
.trail-pin.hard span { background: var(--clr-hard); }
.trail-pin.approximate span { border: 3px dashed var(--clr-white); border-radius: 50%; }
.trail-pin b { transform: rotate(45deg); color: var(--clr-dark); font-size: 18px; }
#trail-map .leaflet-popup-content-wrapper, #trail-map .leaflet-popup-tip { background: var(--clr-dark-card); color: var(--clr-text); }
#trail-map .leaflet-popup-content { margin: 14px; font-family: var(--font-body); }
.map-popup img { display: block; width: 100%; height: 120px; object-fit: cover; border-radius: var(--radius-sm); }
.map-popup h2 { font: 600 1.2rem/1.3 var(--font-heading); margin-top: .7rem; }
#trail-map .map-popup p { margin: .5rem 0; line-height: 1.4; }
.map-popup .map-photo-note { font-size: .7rem; }
#trail-map .map-popup a { color: var(--clr-easy); }
#trail-map .map-popup .map-guide { display: inline-flex; min-height: 44px; align-items: center; font-weight: 600; }
#trail-map .map-location-note { color: var(--clr-moderate); }
#trail-map .leaflet-control-zoom a { width: 44px; height: 44px; line-height: 44px; }
#trail-map .leaflet-control-layers-toggle { width: 44px; height: 44px; }
#trail-map .leaflet-control-layers label { min-height: 44px; display: flex; align-items: center; }
#trail-map .leaflet-popup-close-button { width: 44px; height: 44px; font-size: 26px; color: var(--clr-text); }
#trail-map .leaflet-control-attribution { max-width: calc(100vw - 24px); overflow-wrap: anywhere; }
@media (max-width: 767px) {
    .map-explorer { padding-top: 130px; }
    .map-controls { gap: .8rem; }
    .map-controls fieldset { flex-basis: 100%; }
    .map-chips { gap: .35rem; }
    .map-chips button { padding: .6rem .65rem; font-size: .85rem; }
    .map-controls label { flex: 1; min-width: 0; }
    .map-controls select { width: 100%; }
    #trail-map { height: 60vh; min-height: 0; }
    .map-directory li { align-items: flex-start; flex-direction: column; gap: .5rem; }
}

.map-story-link { margin-top: .75rem; max-width: 65ch; }
.map-visit-badge { color: var(--clr-easy); font-weight: 600; }
.route-story { max-width: 850px; padding-bottom: 4rem; }
.route-story h2 { margin: 2rem 0 1rem; }
.route-story p { margin: 1rem 0; line-height: 1.7; }
.route-story img { width: 100%; height: auto; border-radius: var(--radius-sm); }
.route-story figcaption { margin-top: .5rem; font-size: .85rem; }
.route-story a, .map-directory a { overflow-wrap: anywhere; }

.outing-gallery-controls { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; margin: 1rem 0; }
.outing-gallery-controls button { min-height: 44px; padding: .65rem 1rem; border: 1px solid currentColor; border-radius: var(--radius-sm); background: var(--clr-dark-card); color: var(--clr-text); cursor: pointer; }
.outing-gallery-controls button[aria-disabled="true"] { opacity: .55; cursor: default; }
.outing-gallery-controls button:focus-visible { outline: 3px solid var(--clr-easy); outline-offset: 3px; }
@media (max-width: 767px) {
    .map-controls label { flex: 1 1 140px; }
    #map-reset { flex: 1 0 100%; }
}

.map-controls input[type="search"] { width: 100%; min-height: 44px; padding: .6rem .8rem; border: 1px solid #708078; border-radius: 6px; background: #fff; color: #172e20; }
.trail-pin.unrated > span { background: #67716c; }
