:root {
      --recovery-primary: #0788c8;
      --recovery-primary-dark: #056da3;
      --recovery-ink: #17324d;
      --recovery-muted: #66788d;
      --recovery-line: #d9e4ee;
      --recovery-soft: #f4f8fb;
      --recovery-success: #16815b;
      --recovery-danger: #b54747;
    }

    .recovery-page {
      min-height: 100vh;
      color: var(--recovery-ink);
      background:
        radial-gradient(circle at 8% 12%, rgba(7, 136, 200, .16), transparent 27%),
        radial-gradient(circle at 92% 84%, rgba(255, 203, 119, .22), transparent 30%),
        linear-gradient(135deg, #fbfdff 0%, #eef6fb 54%, #ffffff 100%);
    }

    .recovery-shell {
      width: min(100% - 32px, 1020px);
      min-height: 100vh;
      margin: 0 auto;
      display: grid;
      grid-template-columns: minmax(0, .92fr) minmax(360px, 1.08fr);
      align-items: center;
      gap: 54px;
      padding: 52px 0;
    }

    .recovery-brand {
      padding: 26px 12px;
    }

    .recovery-logo {
      display: inline-flex;
      align-items: center;
      margin-bottom: 32px;
    }

    .recovery-logo img {
      display: block;
      width: auto;
      max-width: 190px;
      max-height: 64px;
    }

    .recovery-eyebrow {
      margin: 0 0 14px;
      color: var(--recovery-primary);
      font-size: 12px;
      font-weight: 800;
      letter-spacing: .1em;
      text-transform: uppercase;
    }

    .recovery-brand h1 {
      max-width: 390px;
      margin: 0;
      color: var(--recovery-ink);
      font-size: clamp(2rem, 4vw, 3.25rem);
      font-weight: 800;
      letter-spacing: -.035em;
      line-height: 1.05;
    }

    .recovery-copy {
      max-width: 410px;
      margin: 20px 0 0;
      color: var(--recovery-muted);
      font-size: 1.05rem;
      line-height: 1.65;
    }

    .recovery-steps {
      display: grid;
      gap: 15px;
      margin: 32px 0 0;
      padding: 0;
      list-style: none;
    }

    .recovery-steps li {
      display: flex;
      align-items: center;
      gap: 12px;
      color: #46617a;
      font-size: .94rem;
      line-height: 1.35;
    }

    .recovery-step-icon {
      width: 32px;
      height: 32px;
      flex: 0 0 32px;
      display: grid;
      place-items: center;
      border-radius: 10px;
      color: var(--recovery-primary);
      background: #e5f4fc;
    }

    .recovery-card {
      padding: clamp(28px, 5vw, 46px);
      border: 1px solid rgba(217, 228, 238, .95);
      border-radius: 24px;
      background: rgba(255, 255, 255, .96);
      box-shadow: 0 20px 46px rgba(24, 61, 91, .12);
    }

    .recovery-card__icon {
      width: 52px;
      height: 52px;
      display: grid;
      place-items: center;
      margin-bottom: 20px;
      border-radius: 16px;
      color: #fff;
      background: linear-gradient(135deg, var(--recovery-primary), #56b3e2);
      font-size: 20px;
    }

    .recovery-card h2 {
      margin: 0;
      color: var(--recovery-ink);
      font-size: clamp(1.5rem, 3vw, 2rem);
      font-weight: 800;
      letter-spacing: -.025em;
    }

    .recovery-card__copy {
      margin: 11px 0 28px;
      color: var(--recovery-muted);
      line-height: 1.55;
    }

    .recovery-field {
      margin-bottom: 20px;
    }

    .recovery-field label {
      display: block;
      margin-bottom: 8px;
      color: #36516c;
      font-size: .92rem;
      font-weight: 700;
    }

    .recovery-field__control {
      position: relative;
    }

    .recovery-field__control i {
      position: absolute;
      top: 50%;
      left: 16px;
      transform: translateY(-50%);
      color: var(--recovery-primary);
      pointer-events: none;
    }

    .recovery-field .au-input {
      min-height: 48px;
      padding: 12px 15px 12px 45px;
      border: 1px solid #bfd3e4;
      border-radius: 12px;
      color: var(--recovery-ink);
      box-shadow: none;
    }

    .recovery-field .au-input:focus {
      border-color: var(--recovery-primary);
      box-shadow: 0 0 0 4px rgba(7, 136, 200, .13);
    }

    .recovery-field--plain .au-input {
      padding-left: 15px;
    }

    .recovery-help {
      margin: -7px 0 23px;
      color: var(--recovery-muted);
      font-size: .85rem;
      line-height: 1.45;
    }

    .recovery-password-strength { margin: -5px 0 22px; }
    .recovery-password-strength__heading { display: flex; justify-content: space-between; gap: 12px; margin-bottom: 7px; color: var(--recovery-muted); font-size: .82rem; font-weight: 700; }
    .recovery-password-strength__heading strong { color: var(--recovery-muted); }
    .recovery-password-strength__track { height: 7px; overflow: hidden; border-radius: 999px; background: #e8eff5; }
    .recovery-password-strength__track span { display: block; width: 0; height: 100%; border-radius: inherit; background: #bdc9d4; transition: width .2s ease, background .2s ease; }
    .recovery-password-strength[data-level="very-weak"] strong,
    .recovery-password-strength[data-level="weak"] strong { color: #b54747; }
    .recovery-password-strength[data-level="very-weak"] .recovery-password-strength__track span { width: 25%; background: #d65a5a; }
    .recovery-password-strength[data-level="weak"] .recovery-password-strength__track span { width: 40%; background: #df7d49; }
    .recovery-password-strength[data-level="fair"] strong { color: #9a6b10; }
    .recovery-password-strength[data-level="fair"] .recovery-password-strength__track span { width: 60%; background: #d5a32b; }
    .recovery-password-strength[data-level="good"] strong { color: #267b72; }
    .recovery-password-strength[data-level="good"] .recovery-password-strength__track span { width: 80%; background: #36a18c; }
    .recovery-password-strength[data-level="strong"] strong { color: #16815b; }
    .recovery-password-strength[data-level="strong"] .recovery-password-strength__track span { width: 100%; background: #21a870; }

    .recovery-submit {
      width: 100%;
      min-height: 48px;
      border: 0;
      border-radius: 12px;
      color: #fff;
      background: linear-gradient(100deg, var(--recovery-primary), #159fd4);
      box-shadow: 0 10px 20px rgba(7, 136, 200, .2);
      font-size: 1rem;
      font-weight: 700;
      transition: transform .18s ease, box-shadow .18s ease;
    }

    .recovery-submit:hover,
    .recovery-submit:focus {
      color: #fff;
      background: linear-gradient(100deg, var(--recovery-primary-dark), var(--recovery-primary));
      box-shadow: 0 13px 24px rgba(7, 136, 200, .27);
      transform: translateY(-1px);
    }

    .recovery-submit--link {
      align-items: center;
      display: flex;
      justify-content: center;
      text-decoration: none;
    }

    .recovery-alert {
      display: flex;
      align-items: flex-start;
      gap: 11px;
      margin: 0 0 22px;
      padding: 14px 15px;
      border: 1px solid;
      border-radius: 12px;
      font-size: .92rem;
      line-height: 1.45;
    }

    .recovery-alert i { margin-top: 2px; }
    .recovery-alert--error { border-color: #edc9c9; color: #8f3434; background: #fff5f5; }
    .recovery-alert--success { border-color: #bde3d4; color: #146c55; background: #f1fbf6; }

    .recovery-divider {
      height: 1px;
      margin: 28px 0 19px;
      background: var(--recovery-line);
    }

    .recovery-back {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      color: #41617b;
      font-size: .92rem;
      font-weight: 700;
    }

    .recovery-back:hover,
    .recovery-back:focus {
      color: var(--recovery-primary-dark);
      text-decoration: none;
    }

    @media (max-width: 900px) {
      .recovery-shell {
        width: min(100% - 40px, 620px);
        grid-template-columns: 1fr;
        gap: 18px;
        padding: 34px 0;
      }
      .recovery-brand { padding: 0 4px; }
      .recovery-logo { margin-bottom: 22px; }
      .recovery-copy, .recovery-brand h1 { max-width: none; }
      .recovery-steps { display: none; }
    }

    @media (max-width: 480px) {
      .recovery-shell { width: min(100% - 24px, 620px); padding: 22px 0; }
      .recovery-card { border-radius: 20px; padding: 26px 22px; }
      .recovery-brand h1 { font-size: 2rem; }
      .recovery-copy { font-size: .98rem; }
    }