/* Form details shared by sign in, sign up and reset password (the page frame lives in hero.css) */
.auth-links { display: flex; justify-content: space-between; flex-wrap: wrap; gap: var(--s-2); margin-top: var(--s-5); font-size: .92rem; }
.phone-row { display: grid; grid-template-columns: 150px 1fr; gap: var(--s-2); }
.pw-rules { margin: 0 0 var(--s-3); padding: 0; list-style: none; font-size: .8rem; color: var(--faint); display: grid; grid-template-columns: 1fr 1fr; gap: 2px var(--s-3); }
.pw-rules li { transition: color .2s var(--ease); }
.pw-rules li.ok { color: var(--ok); }
.pw-wrap { position: relative; }
.pw-wrap .input { padding-right: 46px; }
.pw-toggle {
  position: absolute; right: 4px; top: 50%; transform: translateY(-50%); width: 34px; height: 32px; display: grid; place-items: center;
  background: transparent; border: 0; border-radius: 6px; color: var(--ink-soft); cursor: pointer;
  transition: color .16s var(--ease), background-color .16s var(--ease);
}
.pw-toggle:hover { color: var(--ink); background: var(--surface-2); }
.pw-toggle[aria-pressed="true"] { color: var(--primary); }
.otp { letter-spacing: .4em; text-align: center; font-size: 1.2rem; }
#clerk-captcha { margin: var(--s-2) 0; }