.recovery-form {
  position: relative;
  display: grid;
  gap: 12px;
}

.recovery-form label {
  color: var(--text);
  font-weight: 760;
}

.recovery-form input {
  width: 100%;
  min-height: 46px;
  border: 1px solid var(--line-strong);
  border-radius: var(--radius-sm);
  background: rgba(7,11,18,0.72);
  color: var(--text);
  font: inherit;
  padding: 10px 12px;
}

.recovery-form input:hover { border-color: rgba(130,189,255,0.46); }

.recovery-form input:focus-visible {
  outline: 3px solid rgba(130,189,255,0.42);
  outline-offset: 2px;
  border-color: var(--accent-2);
}

.recovery-form input[aria-invalid="true"] { border-color: var(--danger); }

.recovery-form .button {
  width: fit-content;
  cursor: pointer;
  color: #f8fafc;
  border-color: rgba(130,189,255,0.55);
  background: linear-gradient(180deg, #285a99 0%, #1a3f70 100%);
  box-shadow: 0 12px 32px rgba(15,53,100,0.42);
}

.recovery-form .button:hover,
.recovery-form .button:focus-visible {
  color: #f8fafc;
  border-color: rgba(130,189,255,0.78);
  background: linear-gradient(180deg, #3166a5 0%, #204b82 100%);
  box-shadow: 0 16px 38px rgba(15,53,100,0.50);
}

.recovery-form .button:disabled {
  cursor: wait;
  opacity: 0.7;
  transform: none;
}

.form-help {
  margin: -4px 0 2px;
  color: var(--muted-2);
  font-size: 0.9rem;
}

.form-status {
  min-height: 1.6em;
  margin: 2px 0 0;
  color: var(--success);
  font-weight: 720;
}

.form-status[data-state="error"] { color: var(--danger); }

@media (max-width: 620px) {
  .recovery-form .button { width: 100%; }
}