.ribbon{position:relative;display:flex;flex-direction:column;gap:.75rem;margin:2.5rem 0 3rem;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}.rib-track{display:flex;width:max-content;animation:slide calc(var(--n) * 3.2s) linear infinite}.rib-track.rev{animation-direction:reverse}.rib-track:hover{animation-play-state:paused}.rib-lane{display:flex;gap:.5rem;padding-right:.5rem}.rib-mark{display:inline-flex;align-items:center;gap:.6rem;height:44px;padding:0 .9rem 0 .55rem;border:1px solid var(--line);border-radius:999px;background:var(--white);font-size:var(--t-1);color:var(--ink-2);white-space:nowrap;transition:border-color .25s ease,color .25s ease,box-shadow .25s ease}.rib-mark img{width:28px;height:28px;object-fit:contain;border-radius:6px;filter:grayscale(1) contrast(1.05) opacity(.72);transition:filter .3s ease}.rib-mark:hover{border-color:var(--line-2);color:var(--ink);box-shadow:0 6px 18px -12px #0f0f0e80}.rib-mark:hover img{filter:none}.rib-note{margin-top:.75rem;text-align:center;letter-spacing:.02em}.rib-note a{color:inherit;text-decoration:underline;text-underline-offset:2px}@media(prefers-reduced-motion:reduce){.rib-track{animation:none}.ribbon{overflow-x:auto;mask-image:none;-webkit-mask-image:none}}@media(max-width:640px){.rib-mark{height:38px;font-size:var(--t-0)}.rib-mark img{width:22px;height:22px}}
