/* Shared More maps appearance. Page styles retain control placement. */
        #mapsButton {
            font-family: Arial, Helvetica, sans-serif;
            position: fixed;

            width: 104px;
            height: 34px;
            box-sizing: border-box;
            background-color: #ffffff;
            color: #111;
            padding: 0 10px;
            border: 1px solid rgba(23, 33, 43, 0.14);
            border-radius: 8px;
            text-decoration: none;
            font-size: 13px;
            font-weight: bold;
            line-height: 1.1;
            text-align: center;
            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.18);
            cursor: pointer;
        }

        #mapsButton:hover, #mapsButton:focus-visible {
            color: #111;
            background-color: #ffffff;
        }

        #mapsMenu {
            font-family: Arial, Helvetica, sans-serif;
            border: 0;
            --maps-menu-padding: 6px;
            display: none;
            position: fixed;

            background-color: rgba(255, 255, 255, 0.94);
            padding: 0 var(--maps-menu-padding) var(--maps-menu-padding);
            border-radius: 8px;
            box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
            width: calc(104px + var(--maps-scrollbar-width, 0px));
            box-sizing: border-box;
            /* Menus start no lower than 90px; leave 200px for the bottom controls. */
            max-height: calc(100vh - 290px - env(safe-area-inset-bottom, 0px));
            max-height: calc(100dvh - 290px - env(safe-area-inset-bottom, 0px));
            overflow-y: auto;
            overflow-x: hidden;
            scrollbar-width: thin;
            scrollbar-color: #92a58a transparent;
            overscroll-behavior-y: contain;
            touch-action: pan-y;
            -webkit-overflow-scrolling: touch;
        }

        #mapsMenu a,
        #mapsMenu .mapsGuidesLabel,
        #mapsMenu .mapsListLabel {
            display: block;
            padding: 7px 6px;
            border-radius: 6px;
            color: #111;
            text-decoration: none;
            font-size: 12px;
            font-weight: bold;
            line-height: 1.12;
            text-align: center;
        }

        #mapsMenu a:hover {
            background-color: #f0f0f0;
        }

        #mapsMenu .mapsGuides {
            margin: 0 calc(-1 * var(--maps-menu-padding));
            padding: 0 4px;
            border-radius: 8px 8px 0 0;
            background: #edf6e8;
            box-shadow: inset 0 0 0 1px #dce8d5;
            overflow: hidden;
        }

        #mapsMenu .mapsGuidesLabel,
        #mapsMenu .mapsListLabel {
            display: block;
            margin: 0 -4px 3px;
            padding: 6px 4px;
            background: #426b32;
            color: #fff;
            border-radius: 0;
        }

        #mapsMenu .mapsListLabel {
            margin: 0 calc(-1 * var(--maps-menu-padding)) 3px;
        }

        #mapsMenu .mapsGuides a {
            display: flex;
            align-items: center;
            justify-content: center;
            box-sizing: border-box;
            min-height: 36px;
            padding: 4px 2px;
            border-radius: 4px;
            color: #35552a;
        }

        #mapsMenu .mapsGuides a + a {
            border-top: 1px solid #dce8d5;
        }

        #mapsMenu .mapsGuides a:hover,
        #mapsMenu .mapsGuides a:focus-visible {
            background: #dcebd3;
        }

        #mapsMenu a:focus-visible {
            outline: 2px solid #426b32;
            outline-offset: -2px;
        }

#mapsButton:focus-visible { outline: 2px solid #426b32; outline-offset: 2px; }
#mapsMenu a:hover, #mapsMenu a:focus-visible { color: #111; }
#mapsMenu .mapsGuides a:hover, #mapsMenu .mapsGuides a:focus-visible { color: #35552a; }
@media (max-width: 768px) {
  #mapsButton { width: 96px; height: 32px; padding: 0 8px; font-size: 12px; }
  #mapsMenu { --maps-menu-padding: 5px; width: calc(96px + var(--maps-scrollbar-width, 0px)); }
  #mapsMenu a, #mapsMenu .mapsGuidesLabel, #mapsMenu .mapsListLabel { padding: 6px 4px; font-size: 11px; }
}

#mapsMenu::-webkit-scrollbar { width: 6px; }
#mapsMenu::-webkit-scrollbar-track { background: transparent; margin-block: 8px; }
#mapsMenu::-webkit-scrollbar-thumb { background: #92a58a; border-radius: 999px; }
#mapsMenu::-webkit-scrollbar-thumb:hover { background: #657e5b; }
#mapsMenu.has-scroll { cursor: grab; }
#mapsMenu.is-dragging, #mapsMenu.is-dragging a { cursor: grabbing; user-select: none; }
#mapsMenu a { -webkit-user-drag: none; }

/* Short landscape screens need more scrolling room beside the button stack. */
@media (orientation: landscape) and (max-height: 500px) {
  html #mapsMenu {
    right: calc(70px + env(safe-area-inset-right, 0px));
    left: auto;
    max-height: calc(100vh - 150px - env(safe-area-inset-bottom, 0px));
    max-height: calc(100dvh - 150px - env(safe-area-inset-bottom, 0px));
  }
}