.dropdown {
    position: relative;
    display: inline-block;

    summary {
        cursor: pointer;
    }

    .menu {
        position: absolute;
        width: inherit;
        left: 50%;
        transform: translateX(-50%);
        top: 100%;
        z-index: 1000;

        background: var(--bg-lighter);
        border: var(--solid-border);

        a:hover {
            backdrop-filter: brightness(60%);
        }
    }

    [open] .menu {
        display: block;
    }

    .menu a {
        display: block;
        padding: 0.5rem 0.75rem;
        text-decoration: none;
        color: inherit;
    }
}