@layer components{.menu-select{flex-direction:column;gap:.5rem;display:flex}.menu-select[data-side=left]{flex-direction:row;align-items:center}.menu{--x:0;--y:-.25rem;transform:translate(var(--x), var(--y)) scale(.95);min-width:calc(anchor-size(width) - 1rem);background-color:var(--bgE);border:1px solid var(--borderE);max-height:min(20rem,50vh);box-shadow:0 2px 10px var(--shadow-color);opacity:0;pointer-events:none;transition:opacity .3s ease-in-out, transform .3s ease-in-out, display .3s allow-discrete, overlay .3s allow-discrete;position-area:bottom span-right;position-try-fallbacks:flip-block, flip-inline;overscroll-behavior:contain;transform-origin:0 0;border-radius:8px;outline:none;margin:0;padding:.5rem;inset:auto;overflow-y:auto}.menu:popover-open{opacity:1;pointer-events:auto;transform:none}.menu li{cursor:pointer;border-radius:6px;padding:.5rem .5rem .5rem 2rem;list-style:none;transition:border-color .2s;position:relative}.menu li:hover{background-color:var(--bgE-hover)}.menu li[data-active=true]{background-color:var(--bgE-active)}.menu li[aria-selected=true]:after{content:"";border:3px solid #fff;border-width:0 3px 3px 0;width:6px;height:12px;position:absolute;top:50%;left:0;transform:rotate(45deg)translateY(-100%)}@starting-style{.menu-select .menu:popover-open{transform:translate(var(--x), var(--y)) scale(.97);opacity:0}}@supports not (anchor-name:--x){.menu-select .menu{position:fixed;top:30%;left:1rem}}}
