// Marquee.jsx — signature stamped repeat strip
function Marquee() {
  const { T } = useLang();
  const items = T.marquee;
  const run = [...items, ...items, ...items];
  return (
    <div style={{ background: "var(--ink)", borderTop: "1px solid var(--border-dark)",
      borderBottom: "1px solid var(--border-dark)", overflow: "hidden", padding: "16px 0" }}>
      <div style={{ display: "flex", gap: 0, whiteSpace: "nowrap", width: "max-content",
        animation: "nm-marq 30s linear infinite" }}>
        {run.map((t, i) => (
          <span key={i} style={{ display: "inline-flex", alignItems: "center", gap: 34,
            fontFamily: "var(--font-display)", fontWeight: 800, fontSize: 16, textTransform: "uppercase",
            letterSpacing: ".06em", color: i % 2 ? "var(--lime)" : "var(--paper)", paddingRight: 34 }}>
            {t}
            <span style={{ width: 7, height: 7, borderRadius: 999, background: "var(--lime)", flex: "none" }} />
          </span>
        ))}
      </div>
      <style>{`@keyframes nm-marq{from{transform:translateX(0)}to{transform:translateX(-33.33%)}}
        @media (prefers-reduced-motion:reduce){[style*="nm-marq"]{animation:none !important}}`}</style>
    </div>
  );
}
window.Marquee = Marquee;