.vp-company-list{display:grid;gap:10px;margin:20px 0;min-width:0}
.vp-company-option{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;padding:16px;border:1px solid var(--line);border-radius:var(--radius-md);background:var(--surface,#fff);color:var(--text);text-align:left;font:inherit;cursor:pointer;transition:background-color 150ms ease-out,border-color 150ms ease-out}
.vp-company-option>span:first-child{min-width:0;overflow-wrap:anywhere}
.vp-company-option strong,.vp-company-option small{display:block}
.vp-company-option small{margin-top:4px;color:var(--text-soft);font-size:.8rem}
.vp-company-state{flex-shrink:0;font-size:.75rem;color:var(--green);font-weight:600}
.vp-company-option:hover:not(:disabled){border-color:var(--green);background:var(--green-softer)}
.vp-company-option:active:not(:disabled){transform:scale(.99)}
.vp-company-option[aria-current]{background:var(--green-softer);cursor:default}
.vp-company-option:disabled:not([aria-current]){opacity:.65;cursor:wait}
.vp-company-list :focus-visible,.vp-company-dialog :focus-visible,#companyStep :focus-visible{outline:3px solid var(--green);outline-offset:3px}
.vp-company-heading,.vp-company-actions{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.vp-company-heading h2{margin:0;font-size:1.3rem;letter-spacing:-.02em}
.vp-company-feedback{font-size:.85rem;overflow-wrap:anywhere;min-height:1.5em}
.vp-company-dialog{--modal-open-dur:250ms;--modal-close-dur:150ms;--modal-scale:.96;--modal-scale-close:.96;--modal-ease:cubic-bezier(.22,1,.36,1);width:min(540px,calc(100% - 24px));max-height:calc(100dvh - 32px);padding:24px;border:1px solid var(--line);border-radius:var(--radius-xl,24px);color:var(--text);background:var(--surface,#fff);box-shadow:0 24px 80px #0003}
.vp-company-dialog::backdrop{background:rgba(15,23,42,.5)}
.vp-company-dialog [hidden],#companyStep[hidden],#loginForm[hidden],#vpSwitchCompanyButton[hidden]{display:none!important}
#vpSwitchCompanyButton{width:100%;font:inherit;cursor:pointer;text-align:left;background:transparent;border:0}
#vpSwitchCompanyButton:hover{background:rgba(255,255,255,.08)}
#vpSwitchCompanyButton:focus-visible{outline:3px solid var(--green-2,var(--green));outline-offset:-3px}
#companyStep{width:100%;max-width:520px}
/* transitions-dev modal recipe, scoped to avoid changing existing panel modals. */
.vp-company-dialog .t-modal {
  transform-origin: center;
  transform: scale(var(--modal-scale));
  opacity: 0;
  pointer-events: none;
  transition:
    transform var(--modal-open-dur) var(--modal-ease),
    opacity   var(--modal-open-dur) var(--modal-ease);
  will-change: transform, opacity;
}
.vp-company-dialog .t-modal.is-open {
  transform: scale(1);
  opacity: 1;
  pointer-events: auto;
}
.vp-company-dialog .t-modal.is-closing {
  transform: scale(var(--modal-scale-close));
  opacity: 0;
  pointer-events: none;
  transition:
    transform var(--modal-close-dur) var(--modal-ease),
    opacity   var(--modal-close-dur) var(--modal-ease);
}
@media(prefers-reduced-motion:reduce){.vp-company-dialog .t-modal,.vp-company-option{transition:none!important}.vp-company-option:active{transform:none!important}}
@media(max-width:480px){.vp-company-dialog{padding:18px}.vp-company-option{padding:14px;gap:10px}}