/* Leapfrog Connect — Credential Verification */

html {
  -webkit-tap-highlight-color: transparent;
}

body {
  min-height: 100dvh;
  background-color: #0a0f1d;
  background-image:
    radial-gradient(ellipse 80% 50% at 50% -20%, rgba(37, 99, 235, 0.28), transparent 55%),
    radial-gradient(ellipse 60% 40% at 100% 100%, rgba(29, 78, 216, 0.12), transparent 50%),
    radial-gradient(ellipse 40% 30% at 0% 80%, rgba(14, 165, 233, 0.08), transparent 45%);
  background-attachment: fixed;
}

.glass-card {
  background: linear-gradient(
    165deg,
    rgba(15, 23, 42, 0.92) 0%,
    rgba(10, 15, 29, 0.88) 100%
  );
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}

.seal-ring {
  background: conic-gradient(from 180deg, #22c55e, #16a34a, #4ade80, #22c55e);
}

.fade-in {
  animation: fadeIn 0.45s ease-out both;
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

#manual-id:focus {
  outline: none;
  box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.45);
}