/* Critical navigation stays usable independently of display and animation scripts. */
.menu-button > svg, .drawer-close > svg { pointer-events: none; }
@media (max-width:800px) {
    .portal-top .menu-button, .site-header .menu-button {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        touch-action: manipulation;
    }
    .sidebar {
        max-width: calc(100vw - 48px);
        height: 100vh;
        height: 100dvh;
        visibility: hidden;
        pointer-events: none;
        transform: translate3d(-100%, 0, 0);
        transition: transform .22s ease, visibility .22s ease;
        overscroll-behavior: contain;
        z-index: 90;
    }
    .sidebar.open {
        visibility: visible;
        pointer-events: auto;
        transform: translate3d(0, 0, 0);
    }
    .sidebar nav { min-height: 0; -webkit-overflow-scrolling: touch; }
    .sidebar-brand > .drawer-close {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 44px;
        min-height: 44px;
        touch-action: manipulation;
    }
    .drawer-backdrop { z-index: 85; touch-action: manipulation; }
    .drawer-backdrop.public-backdrop { z-index: 45; }
    .navigation-open { overflow: hidden; }
}
@media (min-width:801px) {
    .sidebar { visibility: visible; pointer-events: auto; transform: none; }
    .portal-top .menu-button { display: none; }
}
@media (prefers-reduced-motion:reduce) {
    .sidebar { transition: none; }
}