With exactly 2 video tiles, the layout branch flex-shrinks tiles to
exactly fill the scroll container (fractional heights, bottom tile
flush against the scroller's clip edge). In that configuration
Chromium's rounded-rect box-shadow fast path misrenders at fractional
pixel offsets: the corner shows a straight diagonal wedge instead of
a rounded crescent, and the bottom tile's bottom shadow band is
clipped entirely by the scroller's overflow. With 3+ tiles the grid
branch uses natural (non-fractional) 16:9 heights, so it doesn't hit
this.
filter: drop-shadow() renders the same offset shadow through a
different rasterization path that isn't susceptible to this, and
(as a side benefit) isn't clipped by scrollable overflow the way
box-shadow's ink overflow is.
- VideoCallContent.svelte: shadow-sm -> drop-shadow-sm on video tiles.
- base.css: add --drop-shadow/-sm/-lg tokens mirroring the --shadow-*
scale, consumed by Tailwind's drop-shadow-* utilities.
- clay.css, navy.css: matching --drop-shadow-* overrides in both
light and dark. flat.css needs no changes; it inherits base.
Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
