<!-- source-hash: fb39f9743352e03b32dfac5b92ed2410 -->
Horizontal-scroll media strip that renders mixed still-image and video tiles, opening a lightbox modal for images and playing clips inline.

## Key Components

### Interfaces

- **`MediaGalleryStripItem`** — Shape of each media item: `media_type`, `media_url`, optional `title`, and optional stable `id`
- **`MediaGalleryStripProps`** — Props for the strip: an `items` array and an optional `className`

### Exports

- **`MediaGalleryStrip`** — Primary component; renders a horizontally-scrollable row of 240×200 tiles
- **`isGalleryImage`** *(internal)* — Returns `true` for any `media_type` that is not `"video"` or `"demo"`

### Behavior

- **Image tiles** render as accessible `<button>` elements (keyboard focusable, `aria-label` included) that open `ImageGalleryModal` at the correct lightbox index, computed against image-only items (skipping video tiles to avoid off-by-one bugs)
- **Video tiles** render `<Video url={...} layout="native" />` inline with its own native controls
- Returns `null` when `items` is empty or undefined

## Usage Example

```typescript
import { MediaGalleryStrip, MediaGalleryStripItem } from './media-gallery-strip';

const media: MediaGalleryStripItem[] = [
  { id: 'img-1', media_type: 'screenshot', media_url: '/shots/dashboard.png', title: 'Dashboard' },
  { id: 'vid-1', media_type: 'video',      media_url: '/clips/demo.mp4',      title: 'Demo' },
  { id: 'img-2', media_type: 'screenshot', media_url: '/shots/settings.png',  title: 'Settings' },
];

export default function ReleasePage() {
  return (
    <MediaGalleryStrip
      items={media}
      className="py-4"
    />
  );
}
```

> **Note:** The lightbox index tracks only image-type items — clicking the third tile (an image) correctly opens the modal at index `1`, not index `2`, regardless of how many video tiles precede it.