Frozen Edges

The component is self-contained: one file, no dependencies, the palette in --vibeui-datagrid-003-*. Server rendered: there is no state, everything rests on CSS. The edge columns are pinned with position:sticky at left:0 and right:0 and carry a background of their own — without it the scrolling cells show straight through. The table is built with border-collapse:separate: with collapsed borders a sticky cell loses its own line. The scrolling lives in a container with role=region, aria-label and tabindex=0, so it works from the keyboard. The shadow at the pinned edges appears on scrolling through animation-timeline:scroll under @supports — where that is unavailable there is simply no shadow, and the layout does not suffer. The maximum of the week is marked with a pill in a color-mix of the accent. The theme comes from the surrounding color-scheme through light-dark(); the surface stays opaque deliberately — through transparent sticky cells the scrolling rows would show through — and is overridden by the background prop.