/* 步骤及表单样式复制自 breathFrame政务/breathframe-ui/src/styles/utilities.css。
   登录外壳、品牌、帮助区和验证码沿用官网 login.html / login.css。 */
:root {
  --bf-color-text-primary: var(--auth-foreground);
  --bf-color-text-secondary: var(--auth-input-text);
  --bf-color-text-muted: var(--auth-muted);
  --bf-color-border: var(--auth-border);
  --bf-accent-9: var(--auth-accent);
  --bf-color-focus: var(--auth-accent);
  --bf-color-bg-elevated: var(--auth-surface);
  --bf-color-text-success: #1b7f4b;
  --bf-color-bg-success: #e8f5ed;
}
.auth-form__inner { display: grid; gap: 1rem; }
.auth-header { margin-bottom: 0; }
.reset-field { border: 1px solid var(--auth-border); border-radius: 0.75rem; }
.reset-field:focus-within { border-color: var(--auth-accent); }
.auth-field { gap: 0.75rem; }
.auth-icon { flex: none; }
a.auth-button { display: flex; align-items: center; justify-content: center; text-decoration: none; }
.bf-auth-register-verified__change { border: 0; background: none; font: inherit; cursor: pointer; }
.bf-auth-forgot-back { background: transparent; }
.auth-message { margin-top: 0; }
@media (min-width: 640px) {
  .auth-card { height: auto; min-height: 40rem; align-items: stretch; }
  .auth-help { height: auto; }
}
.bf-auth-register-header { text-align: center; }
.bf-auth-register-header__title { margin: 0; color: var(--bf-color-text-primary, #fafafa); font-size: clamp(1.25rem, 3vw, 1.5rem); font-weight: var(--bf-font-weight-semibold, 600); line-height: 1.25; }
.bf-auth-register-header__description { margin: var(--bf-space-2, 0.5rem) 0 0; color: var(--bf-color-text-muted, #7f7f89); font-size: var(--bf-type-body-size, 0.875rem); line-height: 1.55; }
.bf-auth-register-verified { display: flex; flex-wrap: wrap; align-items: center; gap: var(--bf-space-2, 0.5rem); padding: var(--bf-space-3, 0.75rem) var(--bf-space-4, 1rem); background: color-mix(in srgb, var(--bf-color-bg-success, #0f2a1a) 55%, transparent); border: 1px solid color-mix(in srgb, var(--bf-color-text-success, #3dd68c) 45%, transparent); border-radius: var(--bf-radius-lg, 0.75rem); }
.bf-auth-register-verified__text { margin: 0; color: var(--bf-color-text-success, #3dd68c); font-size: var(--bf-type-body-size, 0.875rem); line-height: 1.5; }
.bf-auth-register-verified__mobile { margin-left: var(--bf-space-1, 0.25rem); color: var(--bf-color-text-primary, #fafafa); font-weight: var(--bf-font-weight-semibold, 600); }
.bf-auth-register-verified__change { height: auto; min-height: 0; padding: 0; color: var(--bf-color-text-muted, #7f7f89); font-size: var(--bf-type-label-size, 0.75rem); text-decoration: underline; }
.bf-auth-register-phone-form { display: grid; gap: var(--bf-space-5, 1.25rem); }
.bf-auth-register-phone-form__submit { width: 100%; min-height: 2.75rem; border-radius: var(--bf-radius-lg, 0.75rem); }
/* NOTE: 找回密码页：步骤条 / 面包屑 / 验证码行与登录页 phone-row 同构。时间：2026-09-23 */
.bf-auth-forgot-breadcrumb { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 0.35rem; margin: 0; color: var(--bf-color-text-muted, #7f7f89); font-size: var(--bf-type-label-size, 0.75rem); line-height: 1.5; }
.bf-auth-forgot-breadcrumb__link { color: var(--bf-accent-9, #cc1717); text-decoration: none; }
.bf-auth-forgot-breadcrumb__link:hover { text-decoration: underline; }
.bf-auth-forgot-breadcrumb__sep { color: var(--bf-color-text-muted, #7f7f89); user-select: none; }
.bf-auth-forgot-breadcrumb__current { color: var(--bf-color-text-secondary, #b4b4bd); }
.bf-auth-forgot-steps { display: flex; align-items: flex-start; justify-content: center; gap: 0; margin: 0; padding: 0; list-style: none; }
.bf-auth-forgot-steps__item { position: relative; display: flex; flex: 1 1 0; max-width: 6.5rem; flex-direction: column; align-items: center; gap: var(--bf-space-2, 0.5rem); color: var(--bf-color-text-muted, #7f7f89); font-size: var(--bf-type-label-size, 0.75rem); text-align: center; }
.bf-auth-forgot-steps__item:not(:last-child)::after { content: ''; position: absolute; top: 0.875rem; left: calc(50% + 1.125rem); width: calc(100% - 2.25rem); height: 2px; background: var(--bf-color-border, #303036); }
.bf-auth-forgot-steps__item--active { color: var(--bf-color-text-primary, #fafafa); }
.bf-auth-forgot-steps__item--active::after,
.bf-auth-forgot-steps__item--done::after { background: color-mix(in srgb, var(--bf-accent-9, #cc1717) 55%, var(--bf-color-border, #303036)); }
.bf-auth-forgot-steps__badge { display: grid; width: 1.75rem; height: 1.75rem; flex: none; place-items: center; font-size: 0.6875rem; font-weight: var(--bf-font-weight-semibold, 600); background: var(--bf-color-bg-elevated, #1a1a1a); border: 1px solid var(--bf-color-border, #303036); border-radius: var(--bf-radius-full, 9999px); }
.bf-auth-forgot-steps__item--active .bf-auth-forgot-steps__badge,
.bf-auth-forgot-steps__item--done .bf-auth-forgot-steps__badge { color: #fff; background: var(--bf-accent-9, #cc1717); border-color: var(--bf-accent-9, #cc1717); }
.bf-auth-forgot-steps__label { line-height: 1.35; }
.bf-auth-forgot-sms-row { display: flex; min-width: 0; align-items: stretch; gap: 0; overflow: hidden; border: 1px solid var(--bf-color-border, #303036); border-radius: var(--bf-radius-lg, 0.75rem); background: var(--bf-color-bg-elevated, #1a1a1a); }
.bf-auth-forgot-sms-row:focus-within { border-color: var(--bf-color-focus, #f04444); box-shadow: 0 0 0 1px var(--bf-color-focus, #f04444); }
.bf-auth-forgot-sms-row__input { flex: 1 1 auto; min-width: 0; }
.bf-auth-forgot-sms-row__input .bf-input-frame { border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.bf-auth-forgot-sms-row__input .bf-input-frame:focus-within { border-color: transparent; box-shadow: none; }
.bf-auth-forgot-sms-row__action { height: auto; min-height: 3rem; align-self: stretch; border-left: 1px solid var(--bf-color-border, #303036); border-radius: 0; white-space: nowrap; }
.bf-auth-forgot-success { display: grid; gap: var(--bf-space-3, 0.75rem); justify-items: center; padding: var(--bf-space-2, 0.5rem) 0; text-align: center; }
.bf-auth-forgot-success__icon { display: grid; width: 3rem; height: 3rem; place-items: center; color: var(--bf-color-text-success, #3dd68c); font-size: 1.5rem; font-weight: var(--bf-font-weight-semibold, 600); background: color-mix(in srgb, var(--bf-color-bg-success, #0f2a1a) 55%, transparent); border: 1px solid color-mix(in srgb, var(--bf-color-text-success, #3dd68c) 45%, transparent); border-radius: var(--bf-radius-full, 9999px); }
.bf-auth-forgot-success__text { margin: 0; color: var(--bf-color-text-secondary, #b4b4bd); font-size: var(--bf-type-body-size, 0.875rem); line-height: 1.55; }
.bf-auth-forgot-back { width: 100%; color: var(--bf-color-text-muted, #7f7f89); }