.auth-wrap .btn,
.hdr .btn {
  background: #111b31 !important;
  color: var(--fg) !important;
  border: 1px solid rgba(255, 138, 60, .5) !important;
  box-shadow: 0 0 0 1px rgba(255, 138, 60, .08), 0 10px 28px rgba(255, 138, 60, .24) !important;
  filter: none !important;
  transition: border-color .2s ease, box-shadow .2s ease, color .2s ease, transform .2s ease, background .2s ease;
}

.auth-wrap .btn:hover,
.auth-wrap .btn:focus-visible,
.hdr .btn:hover,
.hdr .btn:focus-visible {
  background: #16223b !important;
  color: var(--fg) !important;
  border-color: rgba(255, 138, 60, .9) !important;
  box-shadow: 0 0 0 1px rgba(255, 138, 60, .16), 0 12px 34px rgba(255, 138, 60, .34) !important;
  filter: none !important;
  transform: translateY(-1px);
  outline: none;
}

.auth-wrap button.btn:disabled {
  cursor: wait !important;
  opacity: 1;
}

.auth-wrap .btn.auth-feedback-ok {
  animation: authButtonFlashOk .62s ease-in-out;
}

.auth-wrap .btn.auth-feedback-error {
  animation: authButtonFlashError .62s ease-in-out;
}

@keyframes authButtonFlashOk {
  0%, 100% {
    color: var(--fg);
    border-color: rgba(255, 138, 60, .5);
    box-shadow: 0 10px 28px rgba(255, 138, 60, .24);
  }
  35%, 70% {
    color: #bbf7d0;
    border-color: #22c55e;
    box-shadow: 0 0 0 4px rgba(34, 197, 94, .2), 0 0 34px rgba(34, 197, 94, .72);
  }
}

@keyframes authButtonFlashError {
  0%, 100% {
    color: var(--fg);
    border-color: rgba(255, 138, 60, .5);
    box-shadow: 0 10px 28px rgba(255, 138, 60, .24);
  }
  35%, 70% {
    color: #fecaca;
    border-color: #ef4444;
    box-shadow: 0 0 0 4px rgba(239, 68, 68, .2), 0 0 34px rgba(239, 68, 68, .72);
  }
}