/* Mein-Rosapineta 1.5.6 – mobile Karte in der gemeinsamen App-Hülle
   Wird ausschließlich in /mobile/page.php?view=map geladen. */

html:has(body.mr-mobile-view-map),
body.mr-mobile-view-map {
    width: 100% !important;
    height: 100% !important;
    min-height: 100% !important;
    margin: 0 !important;
    overflow: hidden !important;
    overscroll-behavior: none;
    background: #dcebf7 !important;
}

body.mr-mobile-view-map {
    --mr-map-blue: #0b6ee8;
    --mr-map-ink: #102b55;
    --mr-map-line: rgba(171, 195, 218, .78);
    --mr-map-shadow: 0 12px 36px rgba(8, 37, 76, .20);
}

body.mr-mobile-view-map .site-header,
body.mr-mobile-view-map .site-footer,
body.mr-mobile-view-map footer,
body.mr-mobile-view-map .floating-settings,
body.mr-mobile-view-map [data-quick-settings],
body.mr-mobile-view-map .quick-settings,
body.mr-mobile-view-map .breadcrumbs,
body.mr-mobile-view-map .breadcrumb {
    display: none !important;
}

body.mr-mobile-view-map main,
body.mr-mobile-view-map .site-main,
body.mr-mobile-view-map .main,
body.mr-mobile-view-map .page,
body.mr-mobile-view-map .page-content,
body.mr-mobile-view-map .container,
body.mr-mobile-view-map .content,
body.mr-mobile-view-map .content-wrap {
    width: 100% !important;
    max-width: none !important;
    height: 100% !important;
    min-height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

body.mr-mobile-view-map .live-map-shell {
    position: fixed !important;
    z-index: 1000 !important;
    inset: 68px 0 78px !important;
    display: block !important;
    width: 100vw !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: #dcebf7 !important;
    overflow: hidden !important;
}

body.mr-mobile-view-map .live-map-card {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    overflow: hidden !important;
}

body.mr-mobile-view-map .live-map-canvas,
body.mr-mobile-view-map [data-live-map] {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
}

body.mr-mobile-view-map .live-map-topbar {
    position: fixed !important;
    left: -10000px !important;
    top: -10000px !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
}

/* Die vorhandene Seitenleiste wird als mobiles Bottom-Sheet weiterverwendet. */
body.mr-mobile-view-map .live-map-sidebar {
    position: fixed !important;
    z-index: 1700 !important;
    left: 8px !important;
    right: 8px !important;
    bottom: max(86px, calc(78px + env(safe-area-inset-bottom, 0px))) !important;
    top: auto !important;
    display: block !important;
    width: auto !important;
    max-width: none !important;
    max-height: min(76dvh, 700px) !important;
    margin: 0 !important;
    padding: 0 12px 18px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    border: 1px solid var(--mr-map-line) !important;
    border-radius: 25px !important;
    background: rgba(255, 255, 255, .98) !important;
    box-shadow: 0 -12px 46px rgba(7, 31, 67, .27) !important;
    transform: translateY(calc(100% + 28px)) !important;
    opacity: 0 !important;
    pointer-events: none !important;
    visibility: hidden !important;
    transition: transform .24s ease, opacity .2s ease, visibility .24s step-end !important;
}

body.mr-mobile-view-map.mr-map-drawer-open .live-map-sidebar {
    transform: translateY(0) !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    visibility: visible !important;
    transition: transform .24s ease, opacity .2s ease, visibility 0s !important;
}

body.mr-mobile-view-map .live-map-sidebar-head,
body.mr-mobile-view-map .live-map-sidebar > .live-map-search {
    display: none !important;
}

.mr-map-drawer-head {
    position: sticky;
    z-index: 4;
    top: 0;
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) 42px;
    align-items: center;
    gap: 8px;
    margin: 0 -12px 10px;
    padding: 9px 12px 10px;
    border-bottom: 1px solid #e4ebf2;
    background: rgba(255, 255, 255, .98);
}

.mr-map-drawer-head::before {
    content: '';
    grid-column: 1 / -1;
    justify-self: center;
    width: 44px;
    height: 5px;
    margin-bottom: 2px;
    border-radius: 99px;
    background: #aeb8c4;
}

.mr-map-drawer-head > span {
    grid-column: 1;
    grid-row: 2;
    display: grid;
    width: 36px;
    height: 36px;
    place-items: center;
    border-radius: 12px;
    background: #eaf4ff;
    font-size: 19px;
}

.mr-map-drawer-head > div {
    grid-column: 2;
    grid-row: 2;
    min-width: 0;
}

.mr-map-drawer-head strong {
    display: block;
    color: var(--mr-map-ink);
    font-size: 1rem;
}

.mr-map-drawer-head small {
    display: block;
    margin-top: 2px;
    color: #78879a;
    font-size: .73rem;
}

.mr-map-drawer-close {
    grid-column: 3;
    grid-row: 2;
    width: 38px;
    height: 38px;
    border: 0;
    border-radius: 50%;
    background: #eef3f8;
    color: #38536f;
    font-size: 22px;
}

body.mr-mobile-view-map .live-map-quick-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 7px !important;
}

body.mr-mobile-view-map .live-map-quick-action {
    min-height: 74px !important;
    padding: 8px 4px !important;
    border: 1px solid #d9e4ef !important;
    border-radius: 16px !important;
    background: #f8fbff !important;
    box-shadow: none !important;
}

body.mr-mobile-view-map .live-map-filter-section,
body.mr-mobile-view-map .live-map-results-section,
body.mr-mobile-view-map .live-map-radius-row {
    border-color: #dce6ef !important;
    border-radius: 17px !important;
    background: #fbfdff !important;
}

body.mr-mobile-view-map .live-map-filter-grid,
body.mr-mobile-view-map .live-map-tag-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

body.mr-mobile-view-map .live-map-filter,
body.mr-mobile-view-map .live-map-tag {
    min-height: 44px !important;
    border-radius: 13px !important;
    text-align: left !important;
}

body.mr-mobile-view-map .live-map-sidebar-links {
    padding-bottom: 4px !important;
}

.mr-map-backdrop {
    position: fixed;
    z-index: 1550;
    inset: 0;
    display: none;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    background: rgba(6, 22, 47, .34);
    backdrop-filter: blur(1.5px);
    -webkit-backdrop-filter: blur(1.5px);
}

body.mr-map-drawer-open .mr-map-backdrop {
    display: block;
}

/* Suchleiste und Kategorien schweben direkt auf der Karte. */
.mr-map-mobile-ui {
    position: fixed;
    z-index: 1450;
    inset: 68px 0 78px;
    pointer-events: none;
}

.mr-map-searchbar {
    position: absolute;
    top: 12px;
    left: 12px;
    right: 12px;
    height: 55px;
    display: grid;
    grid-template-columns: 31px minmax(0, 1fr) 38px;
    align-items: center;
    gap: 4px;
    padding: 0 8px 0 12px;
    border: 1px solid rgba(188, 207, 225, .92);
    border-radius: 20px;
    background: rgba(255, 255, 255, .96);
    box-shadow: var(--mr-map-shadow);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    pointer-events: auto;
}

.mr-map-search-icon {
    color: #55708e;
    font-size: 25px;
    line-height: 1;
}

.mr-map-searchbar input {
    width: 100%;
    min-width: 0;
    height: 45px;
    border: 0 !important;
    outline: 0 !important;
    background: transparent !important;
    color: #172f52;
    font-size: 16px;
    box-shadow: none !important;
}

.mr-map-searchbar input::placeholder {
    color: #738399;
}

.mr-map-search-clear {
    width: 36px;
    height: 36px;
    border: 0;
    border-radius: 50%;
    background: #eff3f7;
    color: #49617d;
    font-size: 21px;
}

.mr-map-search-clear[hidden] {
    display: none;
}

.mr-map-chip-row {
    position: absolute;
    top: 77px;
    left: 0;
    right: 0;
    display: flex;
    gap: 7px;
    padding: 0 12px 8px;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scrollbar-width: none;
    pointer-events: auto;
}

.mr-map-chip-row::-webkit-scrollbar {
    display: none;
}

.mr-map-chip {
    flex: 0 0 auto;
    min-height: 39px;
    padding: 8px 13px;
    border: 1px solid rgba(188, 207, 225, .96);
    border-radius: 999px;
    background: rgba(255, 255, 255, .97);
    color: #294461;
    font-size: .78rem;
    font-weight: 850;
    white-space: nowrap;
    box-shadow: 0 7px 20px rgba(8, 37, 76, .14);
}

.mr-map-chip.is-active {
    border-color: #0874eb;
    background: linear-gradient(135deg, #096ee8, #16a8e6);
    color: #fff;
}

.mr-map-fabs {
    --mr-map-fab-width: 148px;
    position: absolute;
    right: 12px;
    bottom: 14px;
    display: grid;
    gap: 9px;
    pointer-events: auto;
    transition: bottom .2s ease;
}

.mr-map-fab {
    position: relative;
    width: var(--mr-map-fab-width);
    min-width: var(--mr-map-fab-width);
    height: 54px;
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr);
    align-items: center;
    gap: 8px;
    padding: 5px 11px 5px 7px;
    border: 1px solid rgba(181, 201, 221, .94);
    border-radius: 17px;
    background: rgba(255, 255, 255, .97);
    color: #183a63;
    font-weight: 850;
    text-align: left;
    box-shadow: 0 8px 24px rgba(8, 35, 73, .19);
}

.mr-map-fab-icon {
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    border-radius: 12px;
    background: #eaf4ff;
    color: #096edc;
}

.mr-map-fab-icon svg {
    width: 23px;
    height: 23px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.mr-map-fab-copy {
    min-width: 0;
    display: grid;
    gap: 2px;
    line-height: 1;
}

.mr-map-fab-copy strong,
.mr-map-fab-copy small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.mr-map-fab-copy strong {
    color: #15385f;
    font-size: 10.5px;
    font-weight: 950;
    letter-spacing: .025em;
}

.mr-map-fab-copy small {
    color: #70849a;
    font-size: 8.5px;
    font-weight: 750;
}

.mr-map-fab.is-primary {
    border-color: #086fe3;
    background: linear-gradient(145deg, #0871e9, #0ea5e9);
    color: #fff;
}

.mr-map-fab.is-primary .mr-map-fab-icon {
    background: rgba(255, 255, 255, .18);
    color: #fff;
}

.mr-map-fab.is-primary .mr-map-fab-copy strong,
.mr-map-fab.is-primary .mr-map-fab-copy small {
    color: #fff;
}

.mr-map-fab.is-filter {
    width: var(--mr-map-fab-width);
    justify-self: stretch;
}

.mr-map-fab.is-filter.is-open {
    border-color: #0a72e6;
    background: #edf6ff;
}

.mr-map-fab-count {
    position: absolute;
    right: -4px;
    top: -5px;
    min-width: 21px;
    height: 21px;
    padding: 0 5px;
    border: 2px solid #fff;
    border-radius: 99px;
    background: #102e5a;
    color: #fff;
    font-size: 9px;
    line-height: 17px;
    text-align: center;
}

.mr-map-home {
    position: absolute;
    left: 12px;
    bottom: 14px;
    min-height: 50px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 0 15px;
    border: 1px solid rgba(181, 201, 221, .94);
    border-radius: 17px;
    background: rgba(255, 255, 255, .97);
    color: #17395f;
    font-size: .82rem;
    font-weight: 900;
    box-shadow: 0 8px 24px rgba(8, 35, 73, .19);
    pointer-events: auto;
}

.mr-map-layer-menu {
    position: absolute;
    right: calc(var(--mr-map-fab-width, 148px) + 20px);
    bottom: 73px;
    width: 178px;
    padding: 7px;
    border: 1px solid var(--mr-map-line);
    border-radius: 17px;
    background: rgba(255, 255, 255, .98);
    box-shadow: var(--mr-map-shadow);
    pointer-events: auto;
}

.mr-map-layer-menu[hidden] {
    display: none;
}

.mr-map-layer-menu button {
    width: 100%;
    min-height: 43px;
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 8px 10px;
    border: 0;
    border-radius: 12px;
    background: transparent;
    color: #284665;
    font-weight: 800;
    text-align: left;
}

.mr-map-layer-menu button.is-active {
    background: #eaf4ff;
    color: #076fe4;
}

/* Leaflet-Werkzeuge bleiben erreichbar, aber unterhalb der neuen Kopfzeile. */
body.mr-mobile-view-map .leaflet-top {
    top: 128px !important;
}

body.mr-mobile-view-map .leaflet-left {
    left: 4px !important;
}

body.mr-mobile-view-map .leaflet-control-zoom,
body.mr-mobile-view-map .leaflet-control {
    border-radius: 13px !important;
    overflow: hidden;
    box-shadow: 0 7px 20px rgba(9, 38, 76, .17) !important;
}

body.mr-mobile-view-map .leaflet-control-attribution {
    max-width: calc(100vw - 16px);
    font-size: 9px !important;
}

/* Vorhandene Punktdetails werden als gut lesbares Bottom-Sheet gezeigt. */
body.mr-mobile-view-map .live-map-detail {
    position: fixed !important;
    z-index: 1500 !important;
    left: 8px !important;
    right: 8px !important;
    bottom: max(86px, calc(78px + env(safe-area-inset-bottom, 0px))) !important;
    top: auto !important;
    width: auto !important;
    max-width: none !important;
    max-height: min(57dvh, 590px) !important;
    margin: 0 !important;
    padding: 19px 16px 16px !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    border: 1px solid var(--mr-map-line) !important;
    border-radius: 26px !important;
    background: rgba(255, 255, 255, .985) !important;
    box-shadow: 0 -13px 46px rgba(7, 31, 67, .27) !important;
}

body.mr-mobile-view-map .live-map-detail[hidden] {
    display: none !important;
}

body.mr-mobile-view-map .live-map-detail::before {
    content: '';
    position: sticky;
    top: -11px;
    z-index: 2;
    display: block;
    width: 44px;
    height: 5px;
    margin: -6px auto 10px;
    border-radius: 99px;
    background: #aeb8c4;
}

/* 1.9.4: Der Schliessen-Knopf bleibt auch beim Scrollen und unter Android sichtbar. */
body.mr-mobile-view-map .live-map-detail > .live-map-detail-close {
    position: sticky !important;
    z-index: 20 !important;
    top: 0 !important;
    float: right;
    display: grid !important;
    place-items: center;
    width: 44px !important;
    min-width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
    margin: -13px -8px -44px 0 !important;
    padding: 0 !important;
    border: 1px solid #d8e5ef !important;
    border-radius: 50% !important;
    background: #fff !important;
    color: #123b70 !important;
    box-shadow: 0 8px 22px rgba(9, 39, 78, .2) !important;
    font-size: 0 !important;
    line-height: 1 !important;
    opacity: 1 !important;
    visibility: visible !important;
}

body.mr-mobile-view-map .live-map-detail > .live-map-detail-close::before {
    content: '\00d7';
    display: block;
    font-size: 29px;
    font-weight: 500;
    line-height: 1;
}

body.mr-mobile-view-map .live-map-detail h2,
body.mr-mobile-view-map .live-map-detail h3 {
    color: #0f2850 !important;
    line-height: 1.16 !important;
}

body.mr-mobile-view-map .live-map-detail a,
body.mr-mobile-view-map .live-map-detail button {
    min-height: 46px;
    border-radius: 14px !important;
}

body.mr-mobile-view-map.mr-map-detail-open .mr-map-home,
body.mr-mobile-view-map.mr-map-detail-open .mr-map-fabs,
body.mr-mobile-view-map.mr-map-detail-open .mr-map-layer-menu {
    display: none !important;
}

@media (max-width: 380px) {
    .mr-map-searchbar {
        left: 8px;
        right: 8px;
    }

    .mr-map-chip-row {
        padding-left: 8px;
        padding-right: 8px;
    }

    .mr-map-chip {
        padding-left: 11px;
        padding-right: 11px;
        font-size: .72rem;
    }

    .mr-map-fabs {
        --mr-map-fab-width: 124px;
        right: 8px;
    }

    .mr-map-fab {
        grid-template-columns: 32px minmax(0, 1fr);
        gap: 6px;
        padding-right: 8px;
    }

    .mr-map-fab-icon {
        width: 32px;
        height: 32px;
        border-radius: 10px;
    }

    .mr-map-fab-icon svg {
        width: 20px;
        height: 20px;
    }

    .mr-map-fab-copy strong {
        font-size: 9px;
    }

    .mr-map-fab-copy small {
        font-size: 7.5px;
    }

    .mr-map-layer-menu {
        right: calc(var(--mr-map-fab-width, 124px) + 16px);
        width: 142px;
    }

    body.mr-mobile-view-map .live-map-filter-grid,
    body.mr-mobile-view-map .live-map-tag-grid {
        grid-template-columns: 1fr !important;
    }
}

/* Breite Browser behalten die Karten-App statt des unpassenden Website-Menüs. */
@media (min-width: 961px) {
    body.mr-mobile-view-map.mr-mobile-shell > .mr-app-page-header {
        position: fixed !important;
        z-index: 2500 !important;
        inset: 0 0 auto !important;
        min-height: 68px !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        align-items: center !important;
        gap: 12px !important;
        padding: 8px 18px !important;
        color: #fff !important;
        background: linear-gradient(120deg, #082d69, #0759bd 58%, #149bd7) !important;
        box-shadow: 0 5px 18px rgba(8, 43, 91, .18) !important;
    }

    body.mr-mobile-view-map .mr-app-page-brand {
        min-width: 0;
        height: 48px;
        display: flex;
        align-items: center;
        gap: 10px;
        color: #fff;
        text-decoration: none;
    }

    body.mr-mobile-view-map .mr-app-page-brand-logo {
        width: 46px;
        height: 46px;
        flex: 0 0 46px;
        display: grid;
        place-items: center;
        overflow: hidden;
        border: 1px solid rgba(255, 255, 255, .66);
        border-radius: 13px;
        background: #ead7b4;
    }

    body.mr-mobile-view-map .mr-app-page-brand-logo img {
        width: 100%;
        height: 100%;
        display: block;
        object-fit: cover;
    }

    body.mr-mobile-view-map .mr-app-page-brand-copy {
        min-width: 0;
        display: grid;
        gap: 3px;
        color: #fff;
        line-height: 1;
    }

    body.mr-mobile-view-map .mr-app-page-brand-copy strong {
        font-size: 17px;
        font-weight: 900;
    }

    body.mr-mobile-view-map .mr-app-page-brand-copy small {
        color: rgba(255, 255, 255, .88);
        font-size: 7px;
        font-weight: 900;
        letter-spacing: .105em;
    }

    body.mr-mobile-view-map .mr-app-page-actions {
        display: flex;
        align-items: center;
        gap: 7px;
    }

    body.mr-mobile-view-map .mr-app-page-profile,
    body.mr-mobile-view-map .mr-app-page-action {
        position: relative;
        width: 40px;
        height: 40px;
        flex: 0 0 40px;
        display: grid;
        place-items: center;
        overflow: hidden;
        border: 1px solid rgba(255, 255, 255, .32);
        border-radius: 50%;
        color: #fff;
        background: rgba(255, 255, 255, .13);
        text-decoration: none;
    }

    body.mr-mobile-view-map .mr-app-page-profile img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    body.mr-mobile-view-map .mr-app-page-points {
        min-width: 58px;
        height: 40px;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 4px;
        padding: 0 10px;
        border: 1px solid rgba(255, 255, 255, .3);
        border-radius: 999px;
        color: #fff;
        background: rgba(255, 255, 255, .13);
        text-decoration: none;
    }

    body.mr-mobile-view-map .mr-app-page-action svg {
        width: 21px;
        height: 21px;
        fill: none;
        stroke: currentColor;
        stroke-width: 2;
    }

    body.mr-mobile-view-map .mr-app-page-action b {
        position: absolute;
        right: -2px;
        top: -3px;
        min-width: 17px;
        height: 17px;
        padding: 0 4px;
        border-radius: 99px;
        color: #fff;
        background: #ef2c3a;
        font-size: 8px;
        line-height: 17px;
        text-align: center;
    }

    body.mr-mobile-view-map .live-map-shell {
        inset: 68px 0 0 !important;
    }

    body.mr-mobile-view-map .mr-map-mobile-ui {
        inset: 68px 0 0;
    }

    body.mr-mobile-view-map .mr-map-searchbar {
        right: auto;
        width: min(720px, calc(100vw - 220px));
    }

    body.mr-mobile-view-map .mr-map-chip-row {
        right: auto;
        width: min(900px, calc(100vw - 190px));
    }

    body.mr-mobile-view-map .live-map-sidebar {
        left: auto !important;
        right: 16px !important;
        top: 84px !important;
        bottom: 16px !important;
        width: min(430px, calc(100vw - 32px)) !important;
        max-width: 430px !important;
        max-height: none !important;
        border-radius: 24px !important;
        transform: translateX(calc(100% + 36px)) !important;
    }

    body.mr-mobile-view-map.mr-map-drawer-open .live-map-sidebar {
        transform: translateX(0) !important;
    }

    body.mr-mobile-view-map .mr-map-backdrop {
        inset: 68px 0 0;
        background: rgba(6, 22, 47, .20);
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }

    body.mr-mobile-view-map .live-map-detail {
        left: auto !important;
        right: 16px !important;
        top: 84px !important;
        bottom: 16px !important;
        width: min(430px, calc(100vw - 32px)) !important;
        max-width: 430px !important;
        max-height: none !important;
        border-radius: 24px !important;
    }

    body.mr-mobile-view-map > .mr-app-page-menu {
        position: fixed !important;
        z-index: 2147483000 !important;
        inset: 0 !important;
        display: flex !important;
        align-items: stretch !important;
        justify-content: flex-end !important;
    }

    body.mr-mobile-view-map > .mr-app-page-menu[hidden] {
        display: none !important;
    }

    body.mr-mobile-view-map .mr-app-page-menu-backdrop {
        position: absolute;
        inset: 0;
        border: 0;
        background: rgba(5, 25, 50, .42);
    }

    body.mr-mobile-view-map .mr-app-page-menu-panel {
        position: relative;
        width: min(430px, calc(100vw - 24px));
        height: 100dvh;
        display: flex;
        flex-direction: column;
        overflow: hidden;
        padding: 14px;
        border-radius: 24px 0 0 24px;
        background: linear-gradient(180deg, #fbfdff, #f3f9fd);
        box-shadow: -18px 0 46px rgba(7, 37, 78, .24);
    }

    body.mr-mobile-view-map .mr-app-page-menu-grabber {
        display: none;
    }

    body.mr-mobile-view-map .mr-app-page-menu-panel header {
        min-height: 52px;
        display: flex;
        align-items: center;
        gap: 10px;
        padding-bottom: 10px;
        border-bottom: 1px solid #d7e4ef;
    }

    body.mr-mobile-view-map .mr-app-page-menu-panel header > div {
        min-width: 0;
        flex: 1;
    }

    body.mr-mobile-view-map .mr-app-page-menu-panel header strong,
    body.mr-mobile-view-map .mr-app-page-menu-panel header small {
        display: block;
    }

    body.mr-mobile-view-map .mr-app-page-menu-panel header > button {
        width: 38px;
        height: 38px;
        border: 0;
        border-radius: 12px;
        color: #45617c;
        background: #eaf1f7;
        font-size: 22px;
    }

    body.mr-mobile-view-map .mr-app-page-menu-panel nav {
        min-height: 0;
        flex: 1;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        align-content: start;
        gap: 8px;
        overflow-y: auto;
        padding: 12px 0;
    }

    body.mr-mobile-view-map .mr-app-page-menu-panel nav a {
        min-height: 64px;
        display: flex;
        align-items: center;
        gap: 9px;
        padding: 9px;
        border: 1px solid #d6e3ee;
        border-radius: 15px;
        color: #17365e;
        background: #fff;
        text-decoration: none;
    }

    body.mr-mobile-view-map .mr-app-page-menu-icon {
        width: 34px;
        height: 34px;
        flex: 0 0 34px;
        display: grid;
        place-items: center;
        border-radius: 10px;
        background: #e9f5ff;
    }

    body.mr-mobile-view-map .mr-app-page-menu-panel nav strong {
        font-size: 11px;
        line-height: 1.2;
    }

    body.mr-mobile-view-map .mr-app-page-menu-footer {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
        padding-top: 10px;
        border-top: 1px solid #d7e4ef;
    }

    body.mr-mobile-view-map .mr-app-page-menu-footer > a {
        min-height: 48px;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 7px;
        padding: 7px;
        border: 1px solid #c9daea;
        border-radius: 14px;
        color: #17426f;
        background: #fff;
        text-decoration: none;
    }
}