/**
 * Canonical Vocabinet loading ring — shared by landing (`landing.html`) and app web.
 * Keep in sync with `src/theme/brandLoadingSpinnerLayout.ts`.
 */
.brand-loading-spinner {
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 50%;
  border: 3px solid rgba(198, 246, 51, 0.2);
  border-top-color: #c6f633;
  animation: brand-loading-spin 0.85s linear infinite;
}

.brand-loading-spinner--small {
  width: 1.5rem;
  height: 1.5rem;
  border-width: 2px;
}

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

@media (prefers-reduced-motion: reduce) {
  .brand-loading-spinner {
    animation: none;
  }
}