fix(video-bites): show a card skeleton before the media mounts

[posthog]

Problem

• A visitor on the flamingo.run homepage saw the video carousel paint empty dark boxes while scrolling — the first thing the page shows.
• VideoHoverPreviewSurface gates its media on an IntersectionObserver mount signal (playerMounted). Until that fires, the un-mounted branch rendered a bare bg-ods-card rectangle: no poster, no play glyph.
• Observer callbacks are async and batched per frame, so a fast marquee glide or a chevron jump moves a card into view before the gate catches up. Seam warps (the marquee renders two copies) are the worst case.
• The same surface backs at least six other detail pages (case studies, interviews, investor updates, webinars, podcasts, what-i-shipped), so the defect was not confined to the homepage.

Change

• The un-mounted branch now renders real card chrome instead of a flat fill:
  • poster present → the thumbnail as a lazy next/image (off-screen cards fetch nothing) plus the center play glyph;
  • no poster → an animated shimmer plus the play glyph.
• An ungated card now reads as a card. Because the resting mounted card already shows the same poster, the mount-gate hand-off is now seamless — no dark flash while the observer catches up, and none on a seam warp.

Scope notes

• The inbox report also floated making the mount index sticky and widening the root margin. With a real poster skeleton in place, both add cost for no visible gain: poster and first video frame look identical, so there is nothing left to re-blank. Sticky mount would also drop the surface's documented bounded live-player count (a homepage strip can hold up to 24 featured bites). Left out on purpose.
• The featured-bites payload (multi-platform-hub/lib/data/featured-video-bites-utils.ts) already carries thumbnail_url for every bite that has one (it spreads the full bite). A bite with no thumbnail now shows the shimmer skeleton rather than a black box.

Test plan

• Load the flamingo.run homepage carousel and scroll it fast / jump with the chevrons — cards show a poster + play glyph, never a flat dark box, before the player mounts.
• A bite with no thumbnail_url shows an animated shimmer, not black.
• Hover playback, navigation links, and the resting/active states are unchanged.

Why

The homepage hero carousel is the first thing a flamingo.run visitor sees; empty dark boxes read as broken even though nothing functional fails. This is polish on a high-visibility, shared surface.

---

Created with PostHog Desktop from this inbox report.