.marquee{overflow:hidden;width:100%;background-color:var(--color-bg);padding-block:var(--marquee-pad-block);-webkit-mask-image:linear-gradient(to right,transparent 0%,black 10%,black 90%,transparent 100%);mask-image:linear-gradient(to right,transparent 0%,black 10%,black 90%,transparent 100%)}.marquee__header{font-size:clamp(1.4rem, 4vw, 2.2rem);font-weight:800;text-align:center;margin-bottom:var(--space-3)}.marquee__inner{display:flex;width:max-content;will-change:transform;animation:marquee var(--marquee-duration,15s) linear infinite;animation-name:marquee;animation-duration:var(--marquee-duration,15s);animation-timing-function:linear;animation-iteration-count:infinite;animation-direction:normal}.marquee[style*='--marquee-direction: right'] .marquee__inner{animation-direction:reverse}.marquee__group{display:flex;flex:0 0 auto;align-items:center}.marquee__item{margin:0 1.5rem;white-space:nowrap;padding:6px 16px 6px 12px;border-radius:999px;font-size:1.05rem;font-weight:600;letter-spacing:.01em}.marquee--dark .marquee__item{background:#000;color:#fff}.marquee--light .marquee__item{background:#fff;color:var(--text-primary);box-shadow:0 8px 18px rgb(0 0 0 / .06);border:1px solid rgb(0 0 0 / .08)}.marquee--reverse .marquee__inner{animation-direction:reverse}@keyframes marquee{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}@media (prefers-reduced-motion:reduce){.marquee__inner{animation:none;transform:none}}