/* A drifting row of tools (templates/partials/_marquee.html). The track holds the row twice and slides by half its
   width, so the loop has no seam. Flat edges, no fades. */
.marquee { overflow: hidden; padding: .4rem 0; }
.marquee-track { display: flex; gap: .75rem; width: max-content; animation: mq-slide 60s linear infinite; }
.marquee.slow .marquee-track { animation-duration: 90s; }
.marquee:hover .marquee-track { animation-play-state: paused; }
.mq-item { display: inline-flex; align-items: center; gap: .55rem; padding: .55rem 1rem .55rem .7rem; border: 1.5px solid var(--line);
  border-radius: 999px; background: #fff; font-weight: 700; font-size: .95rem; white-space: nowrap; color: var(--fg); }
.mq-item:not(:has(img)) { padding-left: 1rem; }
.mq-item img { width: 28px; height: 28px; object-fit: contain; }
@keyframes mq-slide { to { transform: translateX(calc(-50% - .375rem)); } }
@media (prefers-reduced-motion: reduce) {
  .marquee-track { animation: none; flex-wrap: wrap; width: auto; justify-content: center; }
  .marquee-track > [aria-hidden="true"] { display: none; }
}