.dropdown{width:100%;position:relative}.dropdown__btn{background:var(--fill-2);border:1px solid var(--fill-4);color:#fff;border-radius:var(--ctl-radius,10px);cursor:pointer;justify-content:space-between;align-items:center;gap:8px;width:100%;padding:8px 12px;font-family:inherit;font-size:13px;font-weight:600;display:flex}.dropdown__btn:hover{background:var(--fill-4)}.dropdown__btn:focus-visible{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}.dropdown.is-open .dropdown__btn{border-color:var(--brand)}.dropdown__caret{color:var(--ink-45);transition:transform .12s}.dropdown.is-open .dropdown__caret{transform:rotate(180deg)}.dropdown__menu{z-index:20;background:var(--panel);border:1px solid var(--fill-4);border-radius:var(--surface-radius,12px);max-height:240px;margin:0;padding:6px;list-style:none;position:absolute;top:calc(100% + 6px);left:0;right:0;overflow:auto;box-shadow:0 12px 32px #00000080}.dropdown__opt{cursor:pointer;color:#fffc;border-radius:8px;justify-content:space-between;align-items:center;gap:8px;padding:8px 12px;font-size:13px;font-weight:600;display:flex}.dropdown__opt:hover,.dropdown__opt.is-focused{background:var(--fill-3);color:#fff}.dropdown__opt.is-active{color:#fff}.dropdown__opt.is-active:after{content:"";background:var(--accent);border-radius:50%;flex:none;width:8px;height:8px}