.spinnerGroup {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.spinner {
  animation: spin 0.9s linear infinite;
}
.skeleton {
  display: grid;
  gap: var(--space-3);
}
.skeleton span {
  block-size: 0.9rem;
  border-radius: var(--radius-pill);
  background: linear-gradient(
    90deg,
    var(--skeleton-base),
    var(--skeleton-highlight),
    var(--skeleton-base)
  );
  background-size: 200% 100%;
  animation: shimmer 1.5s linear infinite;
}
@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
@keyframes shimmer {
  to {
    background-position: -200% 0;
  }
}
@media (prefers-reduced-motion: reduce) {
  .spinner {
    animation-duration: 1.8s;
  }
  .skeleton span {
    animation: none;
    background: var(--skeleton-base);
  }
}
