.role-selector{--background:#ffffff1a;--background-hover:#ffffff26;--border:#ffffff2e;--border-hover:#ffffff47;--text:#fff;--text-muted:#ffffffa6;--list-bg:#ffffff1f;--list-text:#ffffffb3;--list-text-hover:#fff;--list-border:#ffffff26;--accent:var(--accent-primary,#4cc8e0);--item-height:72px;--radius:20px;z-index:10;width:100%;max-width:420px;font-size:16px;line-height:1.4;position:relative}.role-selector__button{z-index:2;border:1px solid var(--border);border-radius:var(--radius);background:var(--background);width:100%;color:var(--text);font-family:inherit;font-size:inherit;text-align:left;cursor:pointer;-webkit-backdrop-filter:blur(16px);justify-content:space-between;align-items:center;gap:16px;padding:18px 24px;transition:background .2s,border-color .2s;display:flex;position:relative}.role-selector__button:hover{background:var(--background-hover);border-color:var(--border-hover)}.role-selector__button:focus-visible{border-color:var(--accent);outline:none;box-shadow:0 0 0 3px #4cc8e033}.role-selector.is-open .role-selector__button{-webkit-backdrop-filter:none;pointer-events:none;background:0 0;border-color:#0000}.role-selector.is-open .role-selector__content,.role-selector.is-open .role-selector__arrow{opacity:0}.role-selector__content{flex-direction:column;gap:4px;display:flex}.role-selector__label{letter-spacing:-.01em;font-size:17px;font-weight:600}.role-selector__description{color:var(--text-muted);font-size:14px}.role-selector__arrow{flex-shrink:0;width:14px;height:14px;transition:transform .3s;position:relative}.role-selector__arrow:before,.role-selector__arrow:after{content:"";opacity:.5;border-top:2px solid;border-bottom:0;border-left:0;border-right:2px solid;width:9px;height:9px;transition:opacity .2s;position:absolute;left:50%}.role-selector__arrow:before{top:-2px;transform:translate(-50%)rotate(-45deg)}.role-selector__arrow:after{bottom:-2px;transform:translate(-50%)rotate(135deg)}.role-selector.is-open .role-selector__arrow{transform:rotate(180deg)}.role-selector.is-open .role-selector__arrow:before,.role-selector.is-open .role-selector__arrow:after{opacity:.8}.role-selector__list{background:var(--list-bg);border:1px solid var(--list-border);border-radius:var(--radius);-webkit-backdrop-filter:blur(20px);transform:translateY(var(--selected-offset,0));margin:0;padding:0;list-style:none;transition:opacity .25s,transform .4s cubic-bezier(.2,.9,.4,1.1);position:absolute;top:0;left:0;right:0;overflow:hidden;box-shadow:0 4px 24px #00000040,0 12px 48px #0003}.role-selector:not(.is-open) .role-selector__list{opacity:0;pointer-events:none}.role-selector.is-open .role-selector__list{opacity:1;pointer-events:auto}.role-selector__option{min-height:var(--item-height);color:var(--list-text);cursor:pointer;outline:none;flex-direction:column;justify-content:center;gap:4px;padding:18px 24px;transition:color .2s,background .2s;display:flex}.role-selector__option:not(:last-child){border-bottom:1px solid var(--list-border)}.role-selector__option:hover,.role-selector__option.is-focused{color:var(--list-text-hover);background:#ffffff1a}.role-selector__option.is-selected{color:var(--text)}.role-selector__option:focus-visible{color:var(--list-text-hover);background:#ffffff1f}.role-selector__option-label{font-size:17px;font-weight:600}.role-selector__option-description{opacity:.65;font-size:14px}@media (max-width:480px){.role-selector{--item-height:68px;max-width:100%}.role-selector__button,.role-selector__option{padding:16px 20px}.role-selector__label,.role-selector__option-label{font-size:16px}.role-selector__description,.role-selector__option-description{font-size:13px}}@media (max-height:540px) and (orientation:landscape){.role-selector__list{max-height:60vh;margin-top:12px;position:static;overflow:hidden auto;transform:none}.role-selector:not(.is-open) .role-selector__list{display:none}.role-selector.is-open .role-selector__button{background:var(--background);border-color:var(--border);-webkit-backdrop-filter:blur(16px);pointer-events:auto}.role-selector.is-open .role-selector__content,.role-selector.is-open .role-selector__arrow{opacity:1}}
