.role-picker{position:relative;z-index:5;margin-top:4px}
.role-picker summary{display:flex;align-items:center;justify-content:space-between;gap:16px;list-style:none;border-bottom:1px solid var(--line);padding:12px 0;font-size:18px;letter-spacing:-.025em;cursor:pointer;color:var(--brand-paper)}
.role-picker summary::-webkit-details-marker{display:none}
.role-picker summary[aria-disabled=true]{opacity:.5;cursor:default}
.role-picker summary:focus-visible,.role-options button:focus-visible{outline:2px solid var(--brand-peach);outline-offset:4px}
.role-picker summary>span:last-child{color:var(--brand-peach);transition:transform .2s}
.role-picker[open] summary>span:last-child{transform:rotate(180deg)}
.role-options{position:absolute;top:calc(100% + 8px);left:0;right:0;max-height:min(340px,50dvh);overflow-y:auto;overscroll-behavior:contain;padding:6px;background:#191817;border:1px solid #efc2a738;border-radius:14px;box-shadow:0 18px 48px #0009;scrollbar-color:#625147 #191817}
.role-options button{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:44px;padding:12px;text-align:left;border:0;border-radius:8px;background:transparent;color:var(--brand-paper);font:inherit;font-size:13px;cursor:pointer}
.role-options button:hover,.role-options button:focus{background:#efc2a712}
.role-options button[aria-selected=true]{color:var(--brand-peach);background:#efc2a71a}
.role-options button:focus-visible{outline-offset:-2px}
@media(prefers-reduced-motion:reduce){.role-picker summary>span:last-child{transition:none}}
