.maplibregl-map { font-family: inherit; }
.maplibregl-marker img { max-width: none; }
.maplibregl-marker:focus-visible { outline: 3px solid #1473e6; outline-offset: 3px; }
/* The public map sits behind the 52px navigation and mobile search controls. */
#map .maplibregl-ctrl-top-right { top: 72px; }
#map .maplibregl-ctrl-attrib { max-width: min(560px, calc(100vw - 24px)); }
.mb-map-error { position: absolute; z-index: 5; top: 50%; left: 50%; transform: translate(-50%, -50%); padding: 1rem; background: white; color: #222; border-radius: 8px; max-width: 320px; box-shadow: 0 2px 12px #0003; }
.mb-map-error button { padding: .5rem 1rem; cursor: pointer; }
.mb-map-view-control {
    width: 148px;
    padding: 5px;
    color: #21342e;
    background: #fff;
    border: 1px solid #dce5e0;
    border-radius: 16px;
    box-shadow: 0 4px 18px #142c261c;
    font-family: inherit;
}
.mb-map-view-options { display: flex; gap: 4px; }
.mb-map-view-control .mb-map-view-option {
    display: flex;
    flex: 1;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    min-height: 64px;
    padding: 5px;
    border: 2px solid transparent;
    border-radius: 11px;
    background: #fff;
    color: #43544c;
    font-family: inherit;
    font-size: 11px;
    font-weight: 600;
    line-height: 1.35;
    cursor: pointer;
}
.mb-map-view-control .mb-map-view-option[aria-pressed="true"] { border-color: #167957; color: #116444; background: #edf8f2; }
.mb-map-view-control .mb-map-view-option:hover { background: #f0f5f2; }
.mb-map-view-control .mb-map-view-option:focus-visible { outline: 3px solid #1473e6; outline-offset: 2px; }
.mb-map-view-preview { width: 52px; height: 32px; border-radius: 5px; overflow: hidden; }
.mb-map-view-map .mb-map-view-preview {
    background: linear-gradient(115deg, transparent 43%, #fff 43% 50%, transparent 50%),
        linear-gradient(20deg, #d3e6dc 30%, #fff 30% 37%, #d8e4dd 37% 63%, #a6d3dc 63% 78%, #d8e4dd 78%);
}
.mb-map-view-aerial .mb-map-view-preview {
    background: linear-gradient(118deg, transparent 40%, #c8c7ad 40% 45%, transparent 45%),
        linear-gradient(26deg, #3c5d3b 24%, #6b7a50 24% 39%, #4d6550 39% 61%, #557e86 61% 76%, #3d604b 76%);
}
.mb-map-view-status { margin: 5px 5px 3px; color: #52645b; font-size: 10px; line-height: 1.45; }
.mb-map-view-status[hidden] { display: none; }
.mb-map-explore-control {
    display: flex;
    flex-direction: column;
    width: 148px;
    padding: 5px;
    border: 1px solid #dce5e0;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 4px 18px #142c261c;
}
.mb-map-explore-control[hidden] { display: none; }
.mb-map-explore-control button {
    width: 100%;
    min-height: 36px;
    padding: 6px 10px;
    border: 0;
    border-radius: 9px;
    background: #fff;
    color: #21342e;
    font-family: inherit;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.4;
    cursor: pointer;
}
.mb-map-explore-control button:hover { background: #edf8f2; }
.mb-map-explore-control button:disabled { opacity: .55; cursor: default; }
.mb-map-explore-control button:focus-visible { outline: 3px solid #1473e6; outline-offset: 1px; }
.mb-map-explore-control button[aria-pressed="true"] { color: #116444; background: #edf8f2; }
.mb-map-memory-preview {
    position: relative;
    width: 128px;
    height: 154px;
    padding: 5px;
    border: 0;
    border-radius: 14px;
    background: #fff;
    color: #21342e;
    box-shadow: 0 6px 24px #142c264d;
    cursor: pointer;
    z-index: 2;
}
.mb-map-memory-preview::after {
    content: '';
    position: absolute;
    left: calc(50% - 7px);
    bottom: -7px;
    width: 14px;
    height: 14px;
    background: #fff;
    transform: rotate(45deg);
}
.mb-map-memory-preview img,
.mb-map-memory-placeholder {
    position: absolute;
    inset: 5px 5px 32px;
    width: 118px;
    height: 117px;
    border-radius: 10px;
    object-fit: cover;
}
.mb-map-memory-placeholder { display: grid; place-items: center; background: #e5f1e9; font-size: 12px; }
.mb-map-memory-preview [hidden] { display: none; }
.mb-map-memory-caption {
    position: absolute;
    right: 9px;
    bottom: 9px;
    left: 9px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-size: 12px;
    font-weight: 600;
}
/* Keep source attribution visible above the mobile bottom navigation. */
@media (max-width: 768px) {
    #map .maplibregl-ctrl-bottom-right { bottom: calc(64px + env(safe-area-inset-bottom, 0px)); }
    .mb-map-view-control { width: 132px; }
    .mb-map-view-control .mb-map-view-option { min-height: 60px; }
    .mb-map-view-preview { width: 45px; height: 28px; }
    .mb-map-explore-control { width: 132px; }
    .mb-map-explore-control button { min-height: 44px; }
}
