.login-step{margin-top:20px}
.login-links{display:flex;justify-content:space-between;gap:12px;margin:9px 0 15px}
.login-links .text-button{font-size:11px}
.step-title{margin:5px 0 5px;color:var(--ink);font-size:18px;font-weight:800;letter-spacing:-.03em}
.step-description{margin:0 0 18px;color:var(--muted);font-size:11px;line-height:1.7}
.login-step .button-wide + .button-wide{margin-top:9px}
.login-step .captcha-field{margin-top:0;margin-bottom:18px}

/* Keep every authentication step on the same vertical rhythm. */
.login-intro{margin:54px 0 28px}
.login-step{margin-top:18px}
.login-step .captcha-field{margin-top:16px;margin-bottom:14px}
.login-card .captcha-field .code-heading{margin-bottom:8px}
.captcha-slider-control{margin-top:8px}
.captcha-progress{min-height:16px;margin-top:5px}
.captcha-field .form-message{min-height:18px;margin-top:4px}
.form-message:empty{min-height:0;margin-top:0}
.login-links{margin:12px 0 16px}
.login-step .login-links + [id$="CaptchaMount"] .captcha-field{margin-top:0}
.login-card .button-wide{margin-top:18px}
.code-entry-panel{margin-top:16px}
.code-entry-panel .code-heading{margin-bottom:8px}
.code-entry-panel .verify-button{margin-top:12px!important}
.step-title{margin:0 0 7px}
.step-description{margin-bottom:16px}
.login-footnote{margin-top:28px}

@media(max-width:760px){
  .login-panel{padding:26px 20px 32px}
  .login-intro{margin:48px 0 24px}
  .login-intro h2{font-size:29px}
  .login-intro p{font-size:13px}
}

@media(max-width:420px){
  .login-panel{padding-right:16px;padding-left:16px}
  .login-intro{margin-top:42px;margin-bottom:22px}
  .login-intro h2{font-size:27px}
  .login-card .button-wide{margin-top:16px}
  .login-footnote{margin-top:24px;font-size:10px}
}
