.marquee {
  position: fixed;
  top: 0;
  width: 100%;
  overflow: hidden;
  z-index: 100;
  background: var(--bg-secondary);
  padding: 0.3rem 0;
}

.marquee-inner {
  display: flex;
  animation: scroll calc(var(--badge-count, 10) * 3s) linear infinite;
}

.marquee-track {
  display: flex;
  flex-shrink: 0;
  gap: 0.25rem;
}

@keyframes scroll {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

@media (prefers-reduced-motion: reduce) {
  .marquee-inner { animation-play-state: paused; }
}