Full-Bleed Animated Outline Banner Block for React

Edit LAUNCH at the top of the file: the chip's words (chip), the news (news), the link's words (link) and where it goes (href). Keep the news to about 45 characters: the whole line then stays on one line on a desktop and wraps to two lines at most on a 320-pixel phone, where the chip, the sentence and the link flow as one piece of text. The sentence sits in a bdi, so in a right-to-left page its full stop stays at its end.

The chip carries a decorative layer: a conic gradient on a square twice the chip's width, turned about the chip's centre by the spin keyframes that Tailwind ships, and a mask that cuts it down to a ring one pixel thick. The animation is animate-[spin_1.6s_ease-in-out_3]: change 1.6s for the speed and the last number for how many sweeps. After the last one the light stops and the chip rests. The layer is aria-hidden and ignores the pointer, so it never gets in the way.

The light stays where it starts and never turns (motion-reduce:animate-none), and the line shows at once instead of fading in. Nothing else on the band moves, so there's no pause button to add: the sweep lasts under five seconds and stops by itself.

No separate one: the band follows the theme. The tint is bg-muted/50 on the full-width section, light on a light page and dark on a dark one, and the sweeping light and the link use the foreground colour. There's no bg-foreground panel and no primary colour, so it sits quietly above any hero.

The tint is on the full-width section, and the line sits in the same max-w-6xl page column as every block. Its Guides layer draws the column's two rails and one rule along the top edge, with a plus on each crossing. There's no bottom rule: the block below draws that line, so the boundary under the band has exactly one. Put it first on the page or between your navbar and your hero.

Not in this block: a launch band is short-lived and sits at the top for the week. If you need a dismiss, copy the fold from the Top Bar Banner: a ghost icon button, a grid row that eases from 1fr to 0fr, and focus moving on to what follows.