Tags Marquee Banner Block for React

Edit TAGS at the top of the file: each has a name, a count (the plain number) and hot. The count is formatted by one Intl.NumberFormat("en-US", { notation: "compact" }) at module level, so 25300 reads "25K" and 3900 reads "3.9K" for every visitor and the server and the browser always agree. Use a locale of your own there if you'd like.

The Marquee has reverse on, so it runs in the opposite direction to the Scroll Marquee Banner: the tickers on one page don't all drift the same way. Remove reverse for the usual direction. In a right-to-left page each direction flips with the page.

By hovering or focusing the row (it holds while they do), by pressing the pause button before it (its name stays "Pause the scrolling tags" and its pressed state says whether it's paused), or by turning on reduced motion in the system, in which case the row doesn't animate and the button is hidden.

A dot marks a tag that's climbing at the moment. It's decoration for sighted visitors, and a visually hidden "Hot:" before the tag's name says the same to screen readers, so the link reads "Hot: #types 25K". Remove hot from an entry to drop both.

The tag names and counts each sit in a bdi, so "#types" and "25K" keep their own direction while the chips run from the other side. The trending icon is a trend line, not an arrow, so it doesn't turn around. Spacing is logical throughout.