.pr-modal { position: fixed; inset: 0; z-index: 1000; display: flex; align-items: center; justify-content: center; padding: 16px; }
.pr-modal[hidden] { display: none !important; }
.pr-modal__backdrop { position: absolute; inset: 0; background: rgba(0,0,0,.58); backdrop-filter: blur(3px); }
.pr-modal__box { position: relative; background: var(--pr-bg); border-radius: var(--pr-radius-lg); box-shadow: var(--pr-shadow-lg); width: 100%; max-width: 460px; max-height: 92vh; overflow-y: auto; animation: pr-modal-in .2s var(--pr-ease); }
.pr-modal__box--signup { max-width: 520px; }
@keyframes pr-modal-in { from { opacity: 0; transform: scale(.96) translateY(8px); } to { opacity: 1; transform: none; } }
.pr-modal__close { position: absolute; top: 14px; right: 14px; width: 34px; height: 34px; display: flex; align-items: center; justify-content: center; border-radius: var(--pr-radius-sm); color: var(--pr-text-muted); transition: all var(--pr-t); z-index: 2; }
.pr-modal__close:hover { background: var(--pr-surface); color: var(--pr-text); }
.pr-modal__header { text-align: center; padding: 28px 32px 20px; }
.pr-modal__header-logo { height: 36px; margin: 0 auto 14px; }
.pr-modal__header h2 { font-family: 'Poppins', sans-serif; font-size: 22px; font-weight: 700; margin-bottom: 4px; color: var(--pr-text); }
.pr-modal__header p { font-size: 13px; color: var(--pr-text-muted); }
.pr-modal form { padding: 0 32px 24px; }
.pr-pw-toggle { position: absolute; right: 12px; font-size: 16px; color: var(--pr-text-muted); height: 100%; display: flex; align-items: center; background: none; border: none; cursor: pointer; }
/* Signup step progress */
.pr-signup-progress { height: 3px; background: var(--pr-surface); }
.pr-signup-progress__bar { height: 100%; background: linear-gradient(90deg, var(--pr-blue), var(--pr-orange)); transition: width .3s var(--pr-ease); }
.pr-role-opt { display: flex; align-items: center; gap: 12px; padding: 14px 16px; border: 2px solid var(--pr-border); border-radius: 10px; cursor: pointer; transition: all var(--pr-t); }
.pr-role-opt:has(input:checked), .pr-role-opt.is-selected { border-color: var(--pr-blue) !important; background: var(--pr-blue-light) !important; }
.pr-role-opt:hover { border-color: var(--pr-border-dark); }