/* Phone hamburger drawer. Desktop layout (desktop.css, 960px+) is unchanged. */

@media (max-width: 959px) {
    html.menu-open,
    body.menu-open {
        overflow: hidden;
        overscroll-behavior: none;
    }
    body.menu-open {
        position: fixed;
        left: 0;
        right: 0;
        width: 100%;
    }

    .menu-overlay {
        display: none;
        position: fixed;
        inset: 0;
        z-index: 180;
        background: rgba(5, 7, 13, 0.55);
        -webkit-tap-highlight-color: transparent;
    }
    .menu-overlay.active { display: block; }

    .hamburger {
        position: fixed;
        top: 1.1rem;
        right: 1.1rem;
        z-index: 200;
    }

    .menu,
    .menu.active {
        overflow-x: hidden;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior: contain;
        touch-action: pan-y;
        height: 100%;
        max-height: 100vh;
        max-height: 100dvh;
        padding-bottom: calc(2.8rem + env(safe-area-inset-bottom, 0px));
    }

    .menu a {
        touch-action: manipulation;
        -webkit-tap-highlight-color: rgba(212, 169, 94, 0.25);
    }
}

@media (min-width: 960px) {
    .menu-overlay { display: none !important; }
}