@layer layout {
    .nur-menu {
        position: fixed;
        inset: 0;
        z-index: 80;
        display: flex;
        flex-direction: column;
        background: var(--nur-bg);
        transform: translateX(100%);
        visibility: hidden;
        transition: transform 0.28s var(--nur-ease), visibility 0.28s;
    }

    .nur-menu.is-open {
        transform: none;
        visibility: visible;
    }

    .nur-menu__head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        height: var(--nur-header-h);
        padding-inline: var(--nur-gutter);
        border-bottom: 1px solid var(--nur-line);
        background: var(--nur-surface);
    }

    .nur-menu__head img {
        width: auto;
        height: 36px;
    }

    .nur-menu__body {
        flex: 1;
        overflow-y: auto;
        padding: var(--nur-space-4) var(--nur-gutter);
        overscroll-behavior: contain;
    }

    .nur-menu__link,
    .nur-menu__summary {
        display: flex;
        align-items: center;
        justify-content: space-between;
        min-height: 56px;
        padding-inline: var(--nur-space-2);
        border-bottom: 1px solid var(--nur-line);
        font-size: var(--nur-text-lg);
        font-weight: 600;
        cursor: pointer;
        list-style: none;
    }

    .nur-menu__summary::-webkit-details-marker {
        display: none;
    }

    .nur-menu__summary::after {
        content: "+";
        color: var(--nur-gold-600);
        font-size: 1.5rem;
        font-weight: 400;
    }

    details[open] > .nur-menu__summary::after {
        content: "\2212";
    }

    .nur-menu__sub a {
        display: flex;
        align-items: center;
        min-height: var(--nur-tap);
        padding-left: var(--nur-space-5);
        color: var(--nur-ink-soft);
    }

    .nur-menu__foot {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: var(--nur-space-3);
        padding: var(--nur-space-4) var(--nur-gutter) calc(var(--nur-space-4) + env(safe-area-inset-bottom));
        border-top: 1px solid var(--nur-line);
        background: var(--nur-surface);
    }

    body.is-locked {
        overflow: hidden;
    }
}
