html.auth-callback-pending #portal-content,
html.auth-callback-pending .skip-link {
  display: none;
}

html.auth-callback-pending #callback-loading {
  display: grid;
}

.callback-loading[hidden] {
  display: none;
}

.callback-loading {
  min-height: 100vh;
  padding: 1.5rem;
  place-items: center;
  background: #f9f9f9;
  color: #141414;
}

.callback-loading-card {
  width: min(620px, 100%);
  padding: clamp(2rem, 7vw, 4.5rem);
  border-top: 8px solid #01388c;
  background: #ffffff;
  box-shadow: 0 18px 46px rgba(0, 32, 77, 0.12);
  text-align: center;
}

.callback-loading-card h1 {
  max-width: none;
  margin: 0 0 1rem;
  font-size: clamp(2rem, 5vw, 3.5rem);
}

.callback-loading-card p:last-child {
  margin: 0;
  color: #5d6572;
}

.callback-eyebrow {
  margin: 0 0 0.75rem;
  color: #01388c;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.12em;
}

.callback-spinner {
  width: 46px;
  height: 46px;
  margin: 0 auto 1.5rem;
  border: 5px solid #d9dde3;
  border-top-color: #00d19e;
  border-radius: 50%;
  animation: callback-spin 800ms linear infinite;
}

@keyframes callback-spin {
  to { transform: rotate(360deg); }
}

@media (prefers-reduced-motion: reduce) {
  .callback-spinner {
    animation-duration: 1600ms;
  }
}