.recovery-main {
  display: flex;
  align-items: center;
  justify-content: center;
  padding-top: 26px;
  padding-bottom: 54px;
}

.recovery-shell { width: min(520px, 100%); }
.recovery-logo {
  position: relative;
  z-index: 1;
  width: 92px;
  height: 92px;
  margin: 0 auto -27px;
  padding: 5px;
  border: 1px solid rgba(255,255,255,.38);
  border-radius: 25px;
  background: rgba(255,255,255,.13);
  box-shadow: 0 18px 38px rgba(0,25,88,.28);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.recovery-logo img { width: 100%; height: 100%; display: block; border-radius: 20px; object-fit: cover; }
.recovery-card { padding-top: 55px; text-align: center; }
.recovery-card .eyebrow { color: #0873d9; }
.recovery-card h1 { margin: 0; font-size: clamp(27px, 5vw, 36px); line-height: 1.08; letter-spacing: -.035em; }
.recovery-intro { margin: 13px auto 24px; max-width: 410px; color: #687791; font-size: 14px; line-height: 1.5; }
.recovery-field { margin-bottom: 18px; text-align: left; }
.recovery-card .submit-button { margin-top: 2px; }

@media (max-width: 720px) {
  .recovery-main { padding-top: 20px; padding-bottom: 36px; }
  .recovery-logo { width: 78px; height: 78px; margin-bottom: -23px; border-radius: 22px; }
  .recovery-logo img { border-radius: 17px; }
  .recovery-card { padding-top: 47px; }
  .recovery-intro { margin-bottom: 20px; }
}

@media (max-width: 720px) and (max-height: 700px) {
  .recovery-main { padding-top: 10px; padding-bottom: 22px; }
  .recovery-logo { width: 66px; height: 66px; margin-bottom: -20px; }
  .recovery-card { padding-top: 40px; }
  .recovery-card h1 { font-size: 25px; }
  .recovery-intro { margin-top: 9px; margin-bottom: 15px; font-size: 13px; }
  .prototype-note { display: none; }
}