From 01694e0e835f21cd5ed42939b640856f5f07a63a Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Fri, 16 Oct 2026 04:31:07 +0000
Subject: [PATCH] M1: GAM as the library

Find footage for a scene in GAM, including where something is said in
a video, and place that moment in the scene. Either as muted b-roll
under the narration, or as a clip that plays its own sound. The moment
becomes the visual's trim:
- padded so a cut does not clip a word;
- sized by a search placeholder's `moment` when it asks for one;
- kept inside the asset.

Search placeholders resolve the same way. Every scene showing one gets
the trim.

GVC's server calls GAM as the signed-in user by forwarding their own
Notes token, so GAM's ownership checks hold and there is no service
account. A token is only forwarded after this app has verified it.
GAM down is a 502 gam_unavailable. GAM refusing the session is
gam_rejected_session, which names the JWT secret mismatch.

Thumbnails and names are looked up per page load, because GAM's
signed URLs expire. They load straight from GAM, so the CSP's img-src
and media-src carry GAM_BASE_URL, templated like the Notes origin.

A note pushed from Notes can now finish the hand-off: "Copy into GAM"
moves each file the spec still points at inside the note into the
user's library. Each ref is replaced under the same key, so nothing
that used it changes. It saves one version. Failures stay to retry.
Only /media/ paths on the configured Notes are fetched, since a pasted
spec is untrusted input, and the size cap is enforced while the file
streams.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_016fiRJAt34ag62iPiuMkNhm
---
 .env.example                                  |  13 +-
 backend/app/auth.py                           |  24 ++
 backend/app/config.py                         |  10 +-
 backend/app/gam/__init__.py                   |   1 +
 backend/app/gam/client.py                     | 156 ++++++++++
 backend/app/main.py                           |  12 +
 backend/app/outbound.py                       |  24 ++
 backend/app/routers/gam.py                    |  52 ++++
 backend/app/routers/projects.py               |  28 +-
 backend/app/schemas_gam.py                    |  56 ++++
 backend/app/schemas_projects.py               |  12 +
 backend/app/services/note_media.py            | 119 ++++++++
 backend/tests/conftest.py                     |  16 +
 backend/tests/fake_siblings.py                | 101 +++++++
 backend/tests/test_gam_api.py                 |  92 ++++++
 backend/tests/test_note_media.py              | 111 +++++++
 docker-compose.yml                            |   4 +
 docs/plan-of-attack.md                        |  14 +-
 frontend/Dockerfile                           |   6 +-
 frontend/csp.test.ts                          |   9 +
 frontend/nginx.conf                           |   8 +-
 frontend/src/api/gam.ts                       |  68 +++++
 frontend/src/api/projects.ts                  |  50 ++++
 .../src/components/FootageSearch.test.tsx     | 148 ++++++++++
 frontend/src/components/FootageSearch.tsx     | 274 ++++++++++++++++++
 frontend/src/components/SceneList.tsx         |  32 +-
 frontend/src/components/VisualStrip.test.tsx  |  77 +++++
 frontend/src/components/VisualStrip.tsx       | 120 ++++++++
 frontend/src/spec/footage.test.ts             | 217 ++++++++++++++
 frontend/src/spec/footage.ts                  | 217 ++++++++++++++
 frontend/src/stores/projects.ts               |  55 ++++
 frontend/src/views/ProjectView.tsx            | 139 ++++++++-
 32 files changed, 2236 insertions(+), 29 deletions(-)
 create mode 100644 backend/app/gam/__init__.py
 create mode 100644 backend/app/gam/client.py
 create mode 100644 backend/app/outbound.py
 create mode 100644 backend/app/routers/gam.py
 create mode 100644 backend/app/schemas_gam.py
 create mode 100644 backend/app/services/note_media.py
 create mode 100644 backend/tests/fake_siblings.py
 create mode 100644 backend/tests/test_gam_api.py
 create mode 100644 backend/tests/test_note_media.py
 create mode 100644 frontend/src/api/gam.ts
 create mode 100644 frontend/src/components/FootageSearch.test.tsx
 create mode 100644 frontend/src/components/FootageSearch.tsx
 create mode 100644 frontend/src/components/VisualStrip.test.tsx
 create mode 100644 frontend/src/components/VisualStrip.tsx
 create mode 100644 frontend/src/spec/footage.test.ts
 create mode 100644 frontend/src/spec/footage.ts

diff --git a/.env.example b/.env.example
index bb49229..e15e2cb 100644
--- a/.env.example
+++ b/.env.example
@@ -17,9 +17,20 @@ CORS_ORIGIN=
 # over /api/config, and the frontend container's CSP connect-src, so one setting.
 NOTES_BASE_URL=https://notes.geckopico.com
 
-# The media library. Read from M1 on.
+# The media library. GVC's server searches it and uploads to it as the signed-in user,
+# and the browser loads thumbnails and previews from it (the CSP's img-src/media-src).
+# GAM must share JWT_SECRET_KEY with Notes and GVC, or it refuses the forwarded session.
+#
+# In development: GAM_BASE_URL=http://localhost:8001 and NOTES_BASE_URL=http://localhost:8000.
+# The dev user (DEV_AUTH_USER) sends no token, so GAM must run with a dev user too.
 GAM_BASE_URL=https://gam.geckopico.com
 
+# Per-request timeout for GAM, in seconds.
+GAM_TIMEOUT_SECONDS=30
+
+# The largest file "Copy into GAM" will move out of a note pushed from Notes, in MB.
+NOTE_MEDIA_MAX_MB=4096
+
 # ─── Administrators ──────────────────────────────────────────────────────────
 
 # Gecko Notes user ids or usernames, comma-separated, matched exactly. Nothing in GVC
diff --git a/backend/app/auth.py b/backend/app/auth.py
index b163942..a2f498f 100644
--- a/backend/app/auth.py
+++ b/backend/app/auth.py
@@ -212,6 +212,30 @@ def current_user(
 CurrentUser = Annotated[UserCtx, Depends(current_user)]
 
 
+def caller_token(
+    authorization: Annotated[Optional[str], Header()] = None,
+    gecko_session: Annotated[Optional[str], Cookie()] = None,
+) -> Optional[str]:
+    """The raw token the caller signed in with, to call GAM as them.
+
+    GAM verifies the same Notes-issued JWT, so forwarding it lets GVC search and upload
+    as the user, with GAM's own per-user ownership intact and no service account to
+    hold. Same transport order as `current_user` (header, then cookie). Only meaningful
+    on a route that also depends on `current_user`, which has already verified it and
+    applied the cookie path's origin check.
+
+    None under the dev user: GAM then has to be running with a dev user of its own.
+    """
+    if authorization and authorization.startswith("Bearer "):
+        return authorization[7:].strip() or None
+    if gecko_session:
+        return gecko_session.strip() or None
+    return None
+
+
+CallerToken = Annotated[Optional[str], Depends(caller_token)]
+
+
 # ─── administrators ──────────────────────────────────────────────────────────
 #
 # The token carries no admin claim and `User.is_admin` has no writer, so an admin is
diff --git a/backend/app/config.py b/backend/app/config.py
index 5bff0ca..ec3b6aa 100644
--- a/backend/app/config.py
+++ b/backend/app/config.py
@@ -56,9 +56,15 @@ class Settings(BaseSettings):
     database_url: str = ""
 
     # ─── siblings ────────────────────────────────────────────────────────────
-    # The media library. Read from M1 on; set now so a deployment's .env is complete
-    # before anything depends on it.
+    # The media library: footage, pictures and music are searched for and kept there.
     gam_base_url: str = "https://gam.geckopico.com"
+    # Per request to GAM. Generous, because a search that runs its semantic half calls
+    # an embedding provider before it answers.
+    gam_timeout_seconds: float = 30
+    # The largest file "Copy into GAM" will move out of a pushed note. Streamed to a
+    # temp file and checked as it arrives, not after: a size checked afterwards has
+    # already filled the disk.
+    note_media_max_mb: int = 4096
 
     # ─── http ────────────────────────────────────────────────────────────────
     cors_origin: str = ""
diff --git a/backend/app/gam/__init__.py b/backend/app/gam/__init__.py
new file mode 100644
index 0000000..570a5ff
--- /dev/null
+++ b/backend/app/gam/__init__.py
@@ -0,0 +1 @@
+"""GAM, the suite's media library, as GVC sees it."""
diff --git a/backend/app/gam/client.py b/backend/app/gam/client.py
new file mode 100644
index 0000000..f15635b
--- /dev/null
+++ b/backend/app/gam/client.py
@@ -0,0 +1,156 @@
+"""Calling GAM as the signed-in user.
+
+GVC forwards the caller's own Notes-issued token, so GAM sees the same user it would
+see from its own frontend: same library, same ownership checks. No service account,
+and nothing GVC could reach that the user could not.
+
+Every failure becomes a `GamError` with a code, which `main.py` turns into a 502 in the
+suite's error shape. A 502 rather than passing GAM's status through: from the browser's
+point of view GVC is the server, and GVC's upstream failed.
+"""
+
+from __future__ import annotations
+
+import logging
+from typing import IO, Any, Dict, Optional
+
+import httpx
+
+from app import outbound
+from app.config import settings
+from app.schemas_gam import GamAssetRead, GamHit, GamSearch
+
+logger = logging.getLogger(__name__)
+
+
+class GamError(Exception):
+    def __init__(self, code: str, message: str, *, status_code: int = 502):
+        super().__init__(message)
+        self.code = code
+        self.message = message
+        self.status_code = status_code
+
+
+def _absolute(url: Optional[str]) -> Optional[str]:
+    """GAM's media URLs are relative to GAM (`/media/<key>?exp=…&sig=…`)."""
+    if not url:
+        return None
+    if url.startswith("http://") or url.startswith("https://"):
+        return url
+    return settings.gam_base_url.rstrip("/") + url
+
+
+def to_asset(raw: Dict[str, Any]) -> GamAssetRead:
+    return GamAssetRead(
+        id=raw["id"],
+        name=raw.get("name") or "",
+        asset_type=raw.get("asset_type") or "",
+        duration_seconds=raw.get("duration_seconds"),
+        width=raw.get("width"),
+        height=raw.get("height"),
+        file_url=_absolute(raw.get("file_url")),
+        thumb_url=_absolute(raw.get("thumb_url")),
+        credit=raw.get("credit") or "",
+        parent_asset_id=raw.get("parent_asset_id"),
+        in_point=raw.get("in_point"),
+        out_point=raw.get("out_point"),
+        missing=bool(raw.get("missing")),
+    )
+
+
+class GamClient:
+    def __init__(self, token: Optional[str]):
+        headers = {"Authorization": f"Bearer {token}"} if token else {}
+        self._http = outbound.client(
+            settings.gam_base_url, timeout=settings.gam_timeout_seconds, headers=headers
+        )
+
+    def close(self) -> None:
+        self._http.close()
+
+    def _request(self, method: str, path: str, **kwargs) -> httpx.Response:
+        try:
+            response = self._http.request(method, path, **kwargs)
+        except httpx.TimeoutException as exc:
+            raise GamError("gam_unavailable", "The asset library took too long to answer") from exc
+        except httpx.HTTPError as exc:
+            logger.warning("GAM unreachable at %s: %s", settings.gam_base_url, exc)
+            raise GamError("gam_unavailable", "Could not reach the asset library") from exc
+
+        if response.status_code == 401:
+            # The user is signed in here, so GAM refusing the same token means the two
+            # apps disagree about JWT_SECRET_KEY: an operator's problem, said as one.
+            raise GamError(
+                "gam_rejected_session",
+                "The asset library did not accept your session. GVC and GAM probably "
+                "have different JWT_SECRET_KEY values.",
+            )
+        if response.status_code >= 500:
+            raise GamError("gam_unavailable", f"The asset library failed ({response.status_code})")
+        return response
+
+    @staticmethod
+    def _detail(response: httpx.Response) -> tuple[str, str]:
+        try:
+            detail = response.json().get("detail") or {}
+        except ValueError:
+            detail = {}
+        if isinstance(detail, dict):
+            return detail.get("code") or "gam_error", detail.get("message") or response.text[:200]
+        return "gam_error", str(detail)
+
+    def search(self, query: str, *, asset_type: Optional[str] = None, limit: int = 30) -> GamSearch:
+        params: Dict[str, Any] = {"q": query, "limit": limit}
+        if asset_type:
+            params["asset_type"] = asset_type
+        response = self._request("GET", "/api/search", params=params)
+        if response.status_code != 200:
+            code, message = self._detail(response)
+            raise GamError(code, message, status_code=400 if response.status_code < 500 else 502)
+        body = response.json()
+        return GamSearch(
+            data=[
+                GamHit(
+                    asset=to_asset(hit["asset"]),
+                    score=hit.get("score") or 0.0,
+                    snippet=hit.get("snippet") or "",
+                    start_time=hit.get("start_time"),
+                    # Absent from a GAM older than its `end_time` change (gam#36); the
+                    # editor then sizes the moment itself.
+                    end_time=hit.get("end_time"),
+                )
+                for hit in body.get("data", [])
+            ],
+            total=body.get("total", 0),
+            query=body.get("query", query),
+            semantic=bool(body.get("semantic")),
+            semantic_error=body.get("semantic_error"),
+        )
+
+    def get_asset(self, asset_id: str) -> Optional[GamAssetRead]:
+        response = self._request("GET", f"/api/assets/{asset_id}")
+        if response.status_code == 404:
+            return None
+        if response.status_code != 200:
+            code, message = self._detail(response)
+            raise GamError(code, message)
+        return to_asset(response.json()["data"])
+
+    def upload(self, filename: str, stream: IO[bytes], content_type: Optional[str]) -> GamAssetRead:
+        """Store one file in the user's library and return it."""
+        response = self._request(
+            "POST",
+            "/api/assets",
+            files={"files": (filename, stream, content_type or "application/octet-stream")},
+        )
+        if response.status_code not in (200, 201):
+            code, message = self._detail(response)
+            raise GamError(code, message, status_code=502)
+        body = response.json()
+        created = body.get("created") or []
+        if not created:
+            # GAM's partial success: a 201 that stored nothing names why per file.
+            rejected = (body.get("rejected") or [{}])[0]
+            raise GamError(rejected.get("code") or "gam_error",
+                           rejected.get("message") or "The asset library did not store the file")
+        return to_asset(created[0])
diff --git a/backend/app/main.py b/backend/app/main.py
index c8062e9..23cb5c5 100644
--- a/backend/app/main.py
+++ b/backend/app/main.py
@@ -19,6 +19,8 @@
 from app.auth import CurrentUser, is_admin
 from app.config import settings
 from app.database import engine, get_session
+from app.gam.client import GamError
+from app.routers import gam as gam_router
 from app.routers import projects as projects_router
 from app.routers import spec as spec_router
 from app.schemas import ClientConfig, DataResponse, HealthResponse
@@ -76,6 +78,15 @@ async def _http_exception_handler(request, exc: StarletteHTTPException):
     return JSONResponse(status_code=exc.status_code, content={"detail": detail})
 
 
+@app.exception_handler(GamError)
+async def _gam_error_handler(request, exc: GamError):
+    """GAM failing is GVC's upstream failing: in the suite's error shape, with GAM's
+    own code where it gave one, so the editor can say which app is at fault."""
+    return JSONResponse(
+        status_code=exc.status_code, content={"detail": {"code": exc.code, "message": exc.message}}
+    )
+
+
 def _default_code(status_code: int) -> str:
     return {
         400: "bad_request",
@@ -126,3 +137,4 @@ def me(user: CurrentUser, session: Session = Depends(get_session)) -> DataRespon
 
 app.include_router(projects_router.router, prefix="/api/projects", tags=["projects"])
 app.include_router(spec_router.router, prefix="/api/spec", tags=["spec"])
+app.include_router(gam_router.router, prefix="/api/gam", tags=["gam"])
diff --git a/backend/app/outbound.py b/backend/app/outbound.py
new file mode 100644
index 0000000..44e9695
--- /dev/null
+++ b/backend/app/outbound.py
@@ -0,0 +1,24 @@
+"""HTTP clients for calls GVC makes to its siblings (GAM, Notes).
+
+One place builds them, so tests can swap the transport for an `httpx.MockTransport`
+and fake both siblings without a network, the way GAM fakes fal.ai.
+"""
+
+from typing import Dict, Optional
+
+import httpx
+
+# Tests set this; production leaves it None, which is httpx's real network transport.
+TRANSPORT: Optional[httpx.BaseTransport] = None
+
+
+def client(base_url: str, *, timeout: float, headers: Optional[Dict[str, str]] = None) -> httpx.Client:
+    return httpx.Client(
+        base_url=base_url.rstrip("/"),
+        timeout=timeout,
+        headers=headers or {},
+        transport=TRANSPORT,
+        # Never follow a redirect to somewhere else: the base URLs are configured, and a
+        # sibling that answers with a redirect is misconfigured, not something to chase.
+        follow_redirects=False,
+    )
diff --git a/backend/app/routers/gam.py b/backend/app/routers/gam.py
new file mode 100644
index 0000000..9e6162b
--- /dev/null
+++ b/backend/app/routers/gam.py
@@ -0,0 +1,52 @@
+"""Searching and reading GAM, the media library, as the signed-in user."""
+
+from typing import Iterator, Literal, Optional
+
+from fastapi import APIRouter, Depends, Query
+
+from app.auth import CallerToken, CurrentUser
+from app.gam.client import GamClient
+from app.schemas import DataResponse
+from app.schemas_gam import AssetLookup, AssetLookupResult, GamSearch
+
+router = APIRouter()
+
+
+def get_gam(_user: CurrentUser, token: CallerToken) -> Iterator[GamClient]:
+    """A GAM client acting as the caller. Depends on `current_user` first, so a token
+    is only ever forwarded after this app has verified it."""
+    client = GamClient(token)
+    try:
+        yield client
+    finally:
+        client.close()
+
+
+@router.get("/search", response_model=GamSearch)
+def search(
+    q: str = Query(default="", max_length=500),
+    # What can go on screen or under it. GAM also holds documents, which a video has
+    # no use for, so they are not offered.
+    type: Optional[Literal["image", "video", "audio"]] = Query(default=None),
+    limit: int = Query(default=30, ge=1, le=100),
+    gam: GamClient = Depends(get_gam),
+) -> GamSearch:
+    if not q.strip():
+        return GamSearch(data=[], total=0, query="")
+    result = gam.search(q, asset_type=type, limit=limit)
+    if type is None:
+        # Without a type filter GAM returns documents too; keep the three media kinds.
+        result.data = [h for h in result.data if h.asset.asset_type in ("image", "video", "audio")]
+        result.total = len(result.data)
+    return result
+
+
+@router.post("/assets/lookup", response_model=DataResponse[AssetLookupResult])
+def lookup(body: AssetLookup, gam: GamClient = Depends(get_gam)) -> DataResponse[AssetLookupResult]:
+    """Names, thumbnails and fresh signed URLs for the GAM assets a spec uses.
+
+    One GET per id, in sequence: a project uses a handful, and GAM has no batch read.
+    Asked for on each page load, because the signed URLs expire.
+    """
+    assets = {asset_id: gam.get_asset(asset_id) for asset_id in dict.fromkeys(body.ids)}
+    return DataResponse(data=AssetLookupResult(assets=assets))
diff --git a/backend/app/routers/projects.py b/backend/app/routers/projects.py
index f05b41b..bc307a8 100644
--- a/backend/app/routers/projects.py
+++ b/backend/app/routers/projects.py
@@ -7,10 +7,13 @@
 from app.database import get_session
 from app.models.project import Project, ProjectVersion
 from app.schemas import DataResponse, ListResponse
+from app.gam.client import GamClient
+from app.routers.gam import get_gam
 from app.schemas_projects import (
-    ProjectCreate, ProjectImport, ProjectRead, ProjectSummary, SpecSave, VersionDetail,
-    VersionRead,
+    CopyFailureRead, NoteMediaCopy, ProjectCreate, ProjectImport, ProjectRead,
+    ProjectSummary, SpecSave, VersionDetail, VersionRead,
 )
+from app.services import note_media
 from app.services import projects as service
 from app.spec.starter import starter_spec
 
@@ -146,3 +149,24 @@ def revert_project(
     project = service.get_owned(session, user, project_id)
     service.revert(session, project, service.get_version(session, project, version_id))
     return DataResponse(data=_read(project))
+
+
+@router.post("/{project_id}/copy-note-media", response_model=DataResponse[NoteMediaCopy])
+def copy_note_media(
+    project_id: str,
+    user: CurrentUser,
+    session: Session = Depends(get_session),
+    gam: GamClient = Depends(get_gam),
+) -> DataResponse[NoteMediaCopy]:
+    """Move the files a pushed note still points at into GAM, as one new version.
+
+    Synchronous: a pushed note carries a handful of pictures and a music file. If that
+    proves slow it moves onto the job queue rendering brings (M2).
+    """
+    project = service.get_owned(session, user, project_id)
+    result = note_media.copy_note_media(session, project, gam)
+    return DataResponse(data=NoteMediaCopy(
+        project=_read(project),
+        copied=result.copied,
+        failed=[CopyFailureRead(key=f.key, message=f.message) for f in result.failed],
+    ))
diff --git a/backend/app/schemas_gam.py b/backend/app/schemas_gam.py
new file mode 100644
index 0000000..f943c83
--- /dev/null
+++ b/backend/app/schemas_gam.py
@@ -0,0 +1,56 @@
+"""GAM's assets and search hits, in GVC's own shape.
+
+Normalised rather than passed through, so a field GAM renames breaks this file and its
+tests instead of every screen that shows a thumbnail. Only what GVC uses is kept.
+"""
+
+from typing import Dict, List, Optional
+
+from pydantic import BaseModel, Field
+
+
+class GamAssetRead(BaseModel):
+    id: str
+    name: str
+    asset_type: str
+    duration_seconds: Optional[float] = None
+    width: Optional[int] = None
+    height: Optional[int] = None
+    # Absolute and signed by GAM: usable directly in <img>/<video>, expiring after
+    # GAM's media TTL, so fetched per page load and never stored in a spec.
+    file_url: Optional[str] = None
+    thumb_url: Optional[str] = None
+    credit: str = ""
+    # A GAM clip has no file of its own: it is its parent's bytes between these points.
+    parent_asset_id: Optional[str] = None
+    in_point: Optional[float] = None
+    out_point: Optional[float] = None
+    missing: bool = False
+
+
+class GamHit(BaseModel):
+    asset: GamAssetRead
+    score: float = 0.0
+    snippet: str = ""
+    # The moment that matched, in seconds into the asset. Both null for a hit on the
+    # file's name or description rather than on something said in it.
+    start_time: Optional[float] = None
+    end_time: Optional[float] = None
+
+
+class GamSearch(BaseModel):
+    data: List[GamHit]
+    total: int
+    query: str
+    # Whether GAM's meaning-based half ran. "No results" means less when it did not.
+    semantic: bool = False
+    semantic_error: Optional[str] = None
+
+
+class AssetLookup(BaseModel):
+    ids: List[str] = Field(default_factory=list, max_length=200)
+
+
+class AssetLookupResult(BaseModel):
+    # Null for an id GAM no longer has (deleted, or not this user's).
+    assets: Dict[str, Optional[GamAssetRead]]
diff --git a/backend/app/schemas_projects.py b/backend/app/schemas_projects.py
index 57faca8..b12b3a0 100644
--- a/backend/app/schemas_projects.py
+++ b/backend/app/schemas_projects.py
@@ -67,3 +67,15 @@ class Validation(BaseModel):
     issues: List[SpecIssue] = Field(default_factory=list)
     # The spec as it would be stored: migrated, defaults filled in. Only when valid.
     spec: Optional[Dict[str, Any]] = None
+
+
+class CopyFailureRead(BaseModel):
+    key: str
+    message: str
+
+
+class NoteMediaCopy(BaseModel):
+    project: ProjectRead
+    # Asset keys now pointing at GAM, and the ones still in the note (retryable).
+    copied: List[str]
+    failed: List[CopyFailureRead]
diff --git a/backend/app/services/note_media.py b/backend/app/services/note_media.py
new file mode 100644
index 0000000..3954ab0
--- /dev/null
+++ b/backend/app/services/note_media.py
@@ -0,0 +1,119 @@
+"""Moving a pushed note's pictures and sounds into GAM.
+
+A note pushed from Notes arrives pointing at files inside the note (`from: "notes"`).
+Copying them into GAM is what finishes the hand-off: afterwards the project depends on
+the library, not on the note, which may be edited or deleted without touching the video.
+
+Each ref is replaced under the same key, so every visual, overlay and track that used
+it keeps working unchanged. Files are moved one at a time and the ones that fail stay
+as they were, to be retried: one unreadable file must not lose the copies that worked.
+"""
+
+from __future__ import annotations
+
+import logging
+import mimetypes
+import tempfile
+from dataclasses import dataclass, field
+from typing import List
+from urllib.parse import urlsplit
+
+import httpx
+from sqlmodel import Session
+
+from app import outbound
+from app.config import settings
+from app.gam.client import GamClient, GamError
+from app.models.project import Project
+from app.services import projects as project_service
+from app.spec.model import GamAsset, NotesAsset
+
+logger = logging.getLogger(__name__)
+
+_CHUNK = 1024 * 1024
+
+
+class CopyFailed(Exception):
+    pass
+
+
+@dataclass
+class CopyFailure:
+    key: str
+    message: str
+
+
+@dataclass
+class CopyResult:
+    copied: List[str] = field(default_factory=list)
+    failed: List[CopyFailure] = field(default_factory=list)
+
+
+def _safe_path(url: str) -> str:
+    """Only a path into Notes' own media, fetched only from the configured Notes.
+
+    A spec can be pasted by anyone, so a `notes` ref's URL is untrusted input: taken as
+    given, it would make this server fetch any address it was handed.
+    """
+    parts = urlsplit(url)
+    if parts.scheme or parts.netloc or not parts.path.startswith("/media/") or ".." in parts.path:
+        raise CopyFailed("Not a file in a note's media")
+    return parts.path
+
+
+def _fetch_to(path: str, sink) -> str:
+    """Stream a Notes media file into `sink`, refusing past the size cap. Returns its
+    content type."""
+    limit = settings.note_media_max_mb * 1024 * 1024
+    received = 0
+    with outbound.client(settings.notes_base_url, timeout=120) as notes:
+        try:
+            with notes.stream("GET", path) as response:
+                if response.status_code == 404:
+                    raise CopyFailed("The note no longer has this file")
+                if response.status_code != 200:
+                    raise CopyFailed(f"Gecko Notes answered {response.status_code}")
+                for chunk in response.iter_bytes(_CHUNK):
+                    received += len(chunk)
+                    if received > limit:
+                        raise CopyFailed(f"Larger than {settings.note_media_max_mb} MB")
+                    sink.write(chunk)
+                return response.headers.get("content-type", "").split(";")[0].strip()
+        except httpx.HTTPError as exc:
+            raise CopyFailed("Could not reach Gecko Notes") from exc
+
+
+def copy_note_media(session: Session, project: Project, gam: GamClient) -> CopyResult:
+    spec = project_service.require_spec(project_service.decode(project.spec))
+    result = CopyResult()
+
+    for key, ref in list(spec.assets.items()):
+        if not isinstance(ref, NotesAsset):
+            continue
+        try:
+            path = _safe_path(ref.url)
+            filename = path.rsplit("/", 1)[-1] or key
+            with tempfile.TemporaryFile() as buffer:
+                content_type = _fetch_to(path, buffer) or mimetypes.guess_type(filename)[0]
+                buffer.seek(0)
+                stored = gam.upload(filename, buffer, content_type)
+        except CopyFailed as exc:
+            result.failed.append(CopyFailure(key, str(exc)))
+            continue
+        except GamError as exc:
+            result.failed.append(CopyFailure(key, exc.message))
+            continue
+
+        spec.assets[key] = GamAsset.model_validate({
+            "from": "gam", "id": stored.id, "type": ref.type,
+            "label": ref.label or stored.name,
+        })
+        result.copied.append(key)
+
+    if result.copied:
+        count = len(result.copied)
+        project_service.save(
+            session, project, spec,
+            message=f"Copied {count} file{'' if count == 1 else 's'} from the note into GAM",
+        )
+    return result
diff --git a/backend/tests/conftest.py b/backend/tests/conftest.py
index 9180057..7ba002a 100644
--- a/backend/tests/conftest.py
+++ b/backend/tests/conftest.py
@@ -87,3 +87,19 @@ def switch_user_fixture():
     def switch(user_id: str) -> None:
         fastapi_app.dependency_overrides[current_user] = _as(user_id)
     return switch
+
+
+@pytest.fixture(name="siblings")
+def siblings_fixture(monkeypatch):
+    """GAM and Notes, faked. Every outbound request GVC makes goes here."""
+    import httpx
+
+    from app import outbound
+    from app.config import settings
+    from tests.fake_siblings import GAM, NOTES, FakeSiblings
+
+    fake = FakeSiblings()
+    monkeypatch.setattr(outbound, "TRANSPORT", httpx.MockTransport(fake.handler))
+    monkeypatch.setattr(settings, "gam_base_url", GAM)
+    monkeypatch.setattr(settings, "notes_base_url", NOTES)
+    return fake
diff --git a/backend/tests/fake_siblings.py b/backend/tests/fake_siblings.py
new file mode 100644
index 0000000..7e28c19
--- /dev/null
+++ b/backend/tests/fake_siblings.py
@@ -0,0 +1,101 @@
+"""GAM and Gecko Notes, faked behind one `httpx.MockTransport`.
+
+Installed on `app.outbound.TRANSPORT`, so every client GVC builds talks to these
+instead of the network. Records what it was asked, so tests can assert the caller's
+token was forwarded and nothing was fetched that should not have been.
+"""
+
+import json
+from dataclasses import dataclass, field
+from typing import Dict, List, Optional
+
+import httpx
+
+GAM = "https://gam.test"
+NOTES = "https://notes.test"
+
+
+def gam_asset(asset_id: str, name: str, asset_type: str = "video", **extra) -> dict:
+    return {
+        "id": asset_id,
+        "name": name,
+        "asset_type": asset_type,
+        "duration_seconds": 1800.0 if asset_type == "video" else None,
+        "file_url": f"/media/{asset_id}.bin?exp=1&sig=x",
+        "thumb_url": f"/media/{asset_id}.jpg?exp=1&sig=x",
+        "credit": "",
+        "missing": False,
+        **extra,
+    }
+
+
+@dataclass
+class FakeSiblings:
+    assets: Dict[str, dict] = field(default_factory=dict)
+    hits: List[dict] = field(default_factory=list)
+    notes_files: Dict[str, bytes] = field(default_factory=dict)
+    requests: List[httpx.Request] = field(default_factory=list)
+    # Set to make GAM answer every request with this status.
+    gam_status: Optional[int] = None
+    gam_down: bool = False
+    # Filenames GAM should refuse on upload.
+    refuse_uploads: List[str] = field(default_factory=list)
+    uploads: List[dict] = field(default_factory=list)
+
+    def handler(self, request: httpx.Request) -> httpx.Response:
+        self.requests.append(request)
+        url = str(request.url)
+        if url.startswith(GAM):
+            return self._gam(request)
+        if url.startswith(NOTES):
+            path = request.url.path
+            if path in self.notes_files:
+                return httpx.Response(200, content=self.notes_files[path],
+                                      headers={"content-type": "image/png"})
+            return httpx.Response(404)
+        raise AssertionError(f"unexpected outbound request to {url}")
+
+    def _gam(self, request: httpx.Request) -> httpx.Response:
+        if self.gam_down:
+            raise httpx.ConnectError("refused", request=request)
+        if self.gam_status:
+            return httpx.Response(self.gam_status, json={"detail": {"code": "x", "message": "y"}})
+        path = request.url.path
+        if path == "/api/search":
+            return httpx.Response(200, json={
+                "data": self.hits, "total": len(self.hits),
+                "query": request.url.params.get("q"), "semantic": False, "semantic_error": None,
+            })
+        if path.startswith("/api/assets/") and request.method == "GET":
+            asset = self.assets.get(path.rsplit("/", 1)[-1])
+            if asset is None:
+                return httpx.Response(404, json={"detail": {"code": "not_found", "message": "gone"}})
+            return httpx.Response(200, json={"data": asset})
+        if path == "/api/assets" and request.method == "POST":
+            body = request.read()
+            filename = body.split(b'filename="', 1)[1].split(b'"', 1)[0].decode()
+            if filename in self.refuse_uploads:
+                return httpx.Response(400, json={"detail": {
+                    "code": "unsupported_type", "message": "That file type is not supported"}})
+            new_id = f"gam-{len(self.uploads) + 1}"
+            asset = gam_asset(new_id, filename, "image")
+            self.assets[new_id] = asset
+            self.uploads.append({"filename": filename, "size": len(body)})
+            return httpx.Response(201, json={"created": [asset], "rejected": []})
+        return httpx.Response(404)
+
+    def gam_requests(self) -> List[httpx.Request]:
+        return [r for r in self.requests if str(r.url).startswith(GAM)]
+
+
+def hit(asset: dict, *, start=None, end=None, snippet="") -> dict:
+    data = {"asset": asset, "score": 0.03, "snippet": snippet, "start_time": start,
+            "segment_id": "seg" if start is not None else None, "sources": ["keyword"],
+            "other_matches": 0}
+    if end is not None:
+        data["end_time"] = end
+    return data
+
+
+def dumps(value) -> str:
+    return json.dumps(value)
diff --git a/backend/tests/test_gam_api.py b/backend/tests/test_gam_api.py
new file mode 100644
index 0000000..4aca345
--- /dev/null
+++ b/backend/tests/test_gam_api.py
@@ -0,0 +1,92 @@
+"""GAM as the library: search, lookup, and how GAM failing is reported."""
+
+import time
+
+from jose import jwt
+
+from app.config import settings
+from tests.fake_siblings import GAM, gam_asset, hit
+
+
+def _token(sub="notes-user-1"):
+    return jwt.encode({"sub": sub, "username": "gecko", "exp": int(time.time()) + 3600},
+                      settings.jwt_secret_key, algorithm="HS256")
+
+
+def test_a_hit_carries_the_moment_and_absolute_signed_urls(auth_client, siblings):
+    reel = gam_asset("g1", "Archive interview, 1971")
+    siblings.hits = [hit(reel, start=734.0, end=741.5, snippet="the «salt» road")]
+
+    body = auth_client.get("/api/gam/search", params={"q": "salt road"}).json()
+
+    assert body["total"] == 1
+    top = body["data"][0]
+    assert (top["start_time"], top["end_time"]) == (734.0, 741.5)
+    assert top["snippet"] == "the «salt» road"
+    assert top["asset"]["file_url"] == f"{GAM}/media/g1.bin?exp=1&sig=x"
+    assert top["asset"]["thumb_url"] == f"{GAM}/media/g1.jpg?exp=1&sig=x"
+
+
+def test_a_gam_without_end_times_still_answers(auth_client, siblings):
+    """Before gam#36, hits had no end_time. The editor sizes the moment itself then."""
+    siblings.hits = [hit(gam_asset("g1", "Reel"), start=10.0)]
+    top = auth_client.get("/api/gam/search", params={"q": "x"}).json()["data"][0]
+    assert top["start_time"] == 10.0 and top["end_time"] is None
+
+
+def test_documents_are_not_offered_for_a_video(auth_client, siblings):
+    siblings.hits = [hit(gam_asset("d1", "Report", "document")), hit(gam_asset("i1", "Map", "image"))]
+    body = auth_client.get("/api/gam/search", params={"q": "x"}).json()
+    assert [h["asset"]["id"] for h in body["data"]] == ["i1"]
+
+
+def test_the_type_filter_is_passed_to_gam(auth_client, siblings):
+    auth_client.get("/api/gam/search", params={"q": "x", "type": "video"})
+    assert siblings.gam_requests()[0].url.params["asset_type"] == "video"
+    assert auth_client.get("/api/gam/search", params={"q": "x", "type": "document"}).status_code == 422
+
+
+def test_an_empty_query_does_not_reach_gam(auth_client, siblings):
+    assert auth_client.get("/api/gam/search", params={"q": "  "}).json()["total"] == 0
+    assert siblings.gam_requests() == []
+
+
+def test_the_callers_own_token_is_what_gam_sees(client, siblings):
+    token = _token()
+    res = client.get("/api/gam/search", params={"q": "x"},
+                     headers={"Authorization": f"Bearer {token}"})
+    assert res.status_code == 200
+    assert siblings.gam_requests()[0].headers["authorization"] == f"Bearer {token}"
+
+
+def test_nothing_is_forwarded_for_a_caller_this_app_did_not_verify(client, siblings):
+    res = client.get("/api/gam/search", params={"q": "x"},
+                     headers={"Authorization": "Bearer not-a-real-token"})
+    assert res.status_code == 401
+    assert siblings.gam_requests() == []
+
+
+def test_gam_down_is_a_502_that_names_the_library(auth_client, siblings):
+    siblings.gam_down = True
+    res = auth_client.get("/api/gam/search", params={"q": "x"})
+    assert res.status_code == 502
+    assert res.json()["detail"]["code"] == "gam_unavailable"
+
+
+def test_gam_refusing_the_session_names_the_secret_mismatch(auth_client, siblings):
+    siblings.gam_status = 401
+    res = auth_client.get("/api/gam/search", params={"q": "x"})
+    assert res.status_code == 502
+    assert res.json()["detail"]["code"] == "gam_rejected_session"
+    assert "JWT_SECRET_KEY" in res.json()["detail"]["message"]
+
+
+def test_lookup_returns_fresh_urls_and_null_for_what_is_gone(auth_client, siblings):
+    siblings.assets = {"g1": gam_asset("g1", "Reel")}
+    res = auth_client.post("/api/gam/assets/lookup", json={"ids": ["g1", "gone", "g1"]})
+    assets = res.json()["data"]["assets"]
+    assert assets["g1"]["name"] == "Reel"
+    assert assets["g1"]["file_url"].startswith(GAM)
+    assert assets["gone"] is None
+    # Asked once each, however often a spec mentions it.
+    assert len(siblings.gam_requests()) == 2
diff --git a/backend/tests/test_note_media.py b/backend/tests/test_note_media.py
new file mode 100644
index 0000000..5b56be3
--- /dev/null
+++ b/backend/tests/test_note_media.py
@@ -0,0 +1,111 @@
+"""Copying a pushed note's media into GAM, which finishes the hand-off from Notes."""
+
+from app.config import settings
+from tests.conftest import load_fixture
+from tests.fake_siblings import NOTES
+
+
+def _push(client, spec=None):
+    res = client.post("/api/projects/import", json={"spec": spec or load_fixture("notes_push_0_1.json")})
+    assert res.status_code == 201, res.text
+    return res.json()["data"]
+
+
+def _copy(client, project_id):
+    return client.post(f"/api/projects/{project_id}/copy-note-media")
+
+
+def test_every_note_file_moves_into_gam_under_the_same_key(auth_client, siblings):
+    siblings.notes_files = {
+        "/media/u1/map.png": b"map", "/media/u1/market.jpg": b"market", "/media/u1/theme.mp3": b"mp3",
+    }
+    project = _push(auth_client)
+    before = project["spec"]
+
+    res = _copy(auth_client, project["id"])
+
+    assert res.status_code == 200, res.text
+    body = res.json()["data"]
+    assert sorted(body["copied"]) == ["a1", "a2", "a3"]
+    assert body["failed"] == []
+    after = body["project"]
+    assert after["pending_note_media"] == 0
+    assert after["version"] == project["version"] + 1
+    for key in ("a1", "a2", "a3"):
+        assert after["spec"]["assets"][key]["from"] == "gam"
+        # The type the note used it as survives: a videoFile block stays a video.
+        assert after["spec"]["assets"][key]["type"] == before["assets"][key]["type"]
+    # Nothing that pointed at those keys needed to change.
+    assert after["spec"]["segments"] == before["segments"]
+    assert after["spec"]["audio_tracks"] == before["audio_tracks"]
+    assert [u["filename"] for u in siblings.uploads] == ["map.png", "market.jpg", "theme.mp3"]
+
+    history = auth_client.get(f"/api/projects/{project['id']}/versions?limit=1").json()["data"][0]
+    assert history["message"] == "Copied 3 files from the note into GAM"
+
+
+def test_a_file_that_fails_stays_in_the_note_to_retry(auth_client, siblings):
+    siblings.notes_files = {"/media/u1/map.png": b"map", "/media/u1/theme.mp3": b"mp3"}
+    siblings.refuse_uploads = ["theme.mp3"]
+    project = _push(auth_client)
+
+    body = _copy(auth_client, project["id"]).json()["data"]
+
+    assert body["copied"] == ["a1"]
+    failed = {f["key"]: f["message"] for f in body["failed"]}
+    assert failed["a2"] == "The note no longer has this file"
+    assert failed["a3"] == "That file type is not supported"
+    assert body["project"]["pending_note_media"] == 2
+    assert body["project"]["spec"]["assets"]["a2"]["from"] == "notes"
+
+    # Retry once the note has it again: only what is left is fetched.
+    siblings.notes_files["/media/u1/market.jpg"] = b"market"
+    siblings.refuse_uploads = []
+    siblings.requests.clear()
+    retry = _copy(auth_client, project["id"]).json()["data"]
+    assert sorted(retry["copied"]) == ["a2", "a3"]
+    assert retry["project"]["pending_note_media"] == 0
+
+
+def test_nothing_copied_is_no_new_version(auth_client, siblings):
+    project = _push(auth_client)
+    body = _copy(auth_client, project["id"]).json()["data"]
+    assert body["copied"] == []
+    assert body["project"]["version"] == project["version"]
+
+
+def test_a_pasted_url_cannot_make_this_server_fetch_anywhere_else(auth_client, siblings):
+    spec = {"spec_version": "0.2", "assets": {
+        "a_evil": {"from": "notes", "url": "http://169.254.169.254/latest/meta-data", "type": "image"},
+        "a_up": {"from": "notes", "url": "/media/../etc/passwd", "type": "image"},
+        "a_api": {"from": "notes", "url": "/api/notes", "type": "image"},
+    }}
+    project = _push(auth_client, spec)
+    body = _copy(auth_client, project["id"]).json()["data"]
+    assert {f["key"] for f in body["failed"]} == {"a_evil", "a_up", "a_api"}
+    assert siblings.requests == []
+
+
+def test_a_file_over_the_cap_is_refused_while_it_streams(auth_client, siblings, monkeypatch):
+    monkeypatch.setattr(settings, "note_media_max_mb", 1)
+    siblings.notes_files = {"/media/u1/map.png": b"x" * (2 * 1024 * 1024)}
+    project = _push(auth_client, {"spec_version": "0.2", "assets": {
+        "a1": {"from": "notes", "url": "/media/u1/map.png", "type": "image"}}})
+    body = _copy(auth_client, project["id"]).json()["data"]
+    assert body["failed"] == [{"key": "a1", "message": "Larger than 1 MB"}]
+    assert siblings.uploads == []
+
+
+def test_files_come_only_from_the_configured_notes(auth_client, siblings):
+    siblings.notes_files = {"/media/u1/map.png": b"map"}
+    project = _push(auth_client, {"spec_version": "0.2", "assets": {
+        "a1": {"from": "notes", "url": "/media/u1/map.png", "type": "image"}}})
+    _copy(auth_client, project["id"])
+    assert str(siblings.requests[0].url) == f"{NOTES}/media/u1/map.png"
+
+
+def test_another_users_project_cannot_be_copied(auth_client, siblings, switch_user):
+    project = _push(auth_client)
+    switch_user("someone-else")
+    assert _copy(auth_client, project["id"]).status_code == 404
+    assert siblings.requests == []
diff --git a/docker-compose.yml b/docker-compose.yml
index 3756087..bd0d29b 100644
--- a/docker-compose.yml
+++ b/docker-compose.yml
@@ -14,6 +14,8 @@ services:
       - CORS_ORIGIN=${CORS_ORIGIN:-}
       - NOTES_BASE_URL=${NOTES_BASE_URL:-https://notes.geckopico.com}
       - GAM_BASE_URL=${GAM_BASE_URL:-https://gam.geckopico.com}
+      - GAM_TIMEOUT_SECONDS=${GAM_TIMEOUT_SECONDS:-30}
+      - NOTE_MEDIA_MAX_MB=${NOTE_MEDIA_MAX_MB:-4096}
       - ADMIN_USERS=${ADMIN_USERS:-}
       - ENVIRONMENT=${ENVIRONMENT:-production}
     # Never published to the host: the frontend proxies it, and ProxyHeadersMiddleware
@@ -38,6 +40,8 @@ services:
     environment:
       # The CSP's connect-src; must agree with the backend's value.
       - NOTES_BASE_URL=${NOTES_BASE_URL:-https://notes.geckopico.com}
+      # The CSP's img-src and media-src, for GAM thumbnails and previews; same rule.
+      - GAM_BASE_URL=${GAM_BASE_URL:-https://gam.geckopico.com}
     depends_on:
       - gvc-backend
     networks:
diff --git a/docs/plan-of-attack.md b/docs/plan-of-attack.md
index 3cab785..6eac23d 100644
--- a/docs/plan-of-attack.md
+++ b/docs/plan-of-attack.md
@@ -147,8 +147,10 @@ Nothing after creation knows or cares which way a project came in. Consequences:
   reads them.
 - The Notes media a pushed spec refers to (`from: "notes"` URLs) is copied into GAM
   when the project is imported, so afterwards the project doesn't depend on the note
-  either. That copy needs M1's media resolver. Until then, an imported project is
-  flagged "media not yet copied".
+  either. A pushed project says how many files are still in the note, and "Copy into
+  GAM" (`POST /api/projects/{id}/copy-note-media`) moves them, replacing each ref
+  under the same key so nothing that pointed at it changes. Files that fail stay as
+  they were, to retry.
 - **The one remaining runtime tie to Notes is login.** GVC verifies the JWT Notes
   issues (suite SSO), as GAM does, and has no accounts of its own. If Notes is down,
   nobody can sign in anew, but everything else in GVC keeps working.
@@ -260,7 +262,7 @@ Specified here, applied in GAM's repository, not from this one.
 
 | | Change | Why |
 |---|---|---|
-| GAM-1 | `end_time` on `SearchHit`, from the transcript segment | S3: a moment needs an out point |
+| GAM-1 | `end_time` on `SearchHit`, from the transcript segment. **Done: [davior/gam#36](https://github.com/davior/gam/pull/36).** GVC also works without it, sizing a moment as start + 5 s | S3: a moment needs an out point |
 | GAM-2 | Run M5's acceptance on a real library; document that semantic search needs an embedding provider | "Find where people talk about *X*" is the feature most of this goal rests on, and it has never been checked end to end |
 | GAM-3 | `origin_project_id` / `origin_reference_id` on `Asset` (migration) + upload with `source: "gvc_export"` | Filing renders back into the library |
 | GAM-4 | M9: documented read API, `/picker?embed=1` with `postMessage({ assetId, inPoint, outPoint })` | Picking assets and moments by hand in the editor |
@@ -273,7 +275,7 @@ GAM-1 and GAM-2 come first. They're small, and M1 below depends on them.
 | | Change | Why |
 |---|---|---|
 | GN-V1 | "Make video" posts the spec from `POST /api/video/spec` to GVC's `POST /api/projects/import` and opens the returned project | The one-way push (D3) |
-| GN-V2 | Notes media readable by GAM's import (a signed URL or a server-to-server fetch with the user's token) | So a pushed project's pictures can be copied into GAM |
+| ~~GN-V2~~ | **Not needed.** Notes serves `/media/*` with no authentication at all (`gecko-notes/backend/app/main.py`), so GVC's server fetches a pushed note's files directly. Worth knowing for its own sake: anyone holding a note's media URL can fetch it, which is Notes' existing behaviour, not something GVC adds | |
 | GN-V3 | Once GVC renders (M2): Notes' own render pipeline is retired (the Notes spec doc §10, Phase 4) | One renderer, not two |
 
 ## Milestones
@@ -283,8 +285,8 @@ Each milestone ends with something you can use, not just with code merged.
 | | Milestone | Scope | Done when |
 |---|---|---|---|
 | **M0** | **Genesis** | Skeleton from GAM: `config.py`, `clock.py`, Alembic, shadow-user auth on the Notes JWT, `/api/health`, Dockerfiles (backend with ffmpeg), compose, nginx, CI. `Project` (current spec as JSON) and `ProjectVersion` (snapshot, author, message). Spec Pydantic model copied from Notes with S1–S3 applied, `0.1 → 0.2` migration on load. Projects API: blank project (title card + one empty scene), paste a spec, `POST /api/projects/import` for a Notes push, versions and revert, validation with errors by path. React shell: project list, a plain scene list (add, reorder, delete, edit narration), a JSON tab with live validation, version history. | You can sign in with your Notes account, make a video's structure by hand, paste the Notes spec doc's §6 example and see it validate (or see exactly why not), and import a spec Notes produced |
-| **M1** | **GAM as the library** | GAM-1 and GAM-2 applied. `from: "gam"` assets resolved through signed URLs into a local cache keyed on asset id and checksum. Search GAM from GVC: results with transcript snippets, and picking a hit fills a scene's visual and trim (S3). `search` placeholders resolved from that list. A pushed note's media copied into GAM (D3). | A scene's footage is found by what is said in it ("where people talk about *X*") and lands in the spec as a trimmed GAM clip |
-| **M2** | **Native renderer** | Engine copied from Notes (D1). The compile step from the Notes spec doc §5.8, plus S1 framing. Renders: per-join transitions with the project default, per-scene motion and framing, N audio tracks with fades, crossfades and ducking, trims, card/scene/clip. All media from GAM (M1). Placeholder slates. Preview (480p) and full render as jobs. Download, and file the render back to GAM (GAM-3). Credits from GAM attribution. TTS through Notes' `POST /api/settings/speech/tts`, so voices and keys stay in one place (open decision 3). | A spec with two music tracks crossfading at a scene cut, a dissolve into one scene, and a Ken Burns path over a chosen part of a picture renders correctly |
+| **M1** | **GAM as the library** | GAM-1 applied (gam#36). GVC's server calls GAM as the signed-in user by forwarding their own Notes token, so GAM's ownership checks hold and no service account exists. Search GAM from a scene: results with transcript snippets and the moment's time; picking a hit places it as muted b-roll or as a clip with its own sound, trimmed to what was said (padded, and sized by a placeholder's `moment`). `search` placeholders resolved the same way. Thumbnails and names looked up per page load, since GAM's signed URLs expire, and loaded straight from GAM (CSP `img-src`/`media-src`). A pushed note's media copied into GAM (D3). The byte cache keyed on asset id and checksum moved to M2: nothing reads media bytes until the renderer does. | A scene's footage is found by what is said in it ("where people talk about *X*") and lands in the spec as a trimmed GAM clip |
+| **M2** | **Native renderer** | Engine copied from Notes (D1). The compile step from the Notes spec doc §5.8, plus S1 framing. Renders: per-join transitions with the project default, per-scene motion and framing, N audio tracks with fades, crossfades and ducking, trims, card/scene/clip. All media from GAM (M1), its bytes fetched through signed URLs into a local cache keyed on asset id and checksum. Placeholder slates. Preview (480p) and full render as jobs. Download, and file the render back to GAM (GAM-3). Credits from GAM attribution. TTS through Notes' `POST /api/settings/speech/tts`, so voices and keys stay in one place (open decision 3). | A spec with two music tracks crossfading at a scene cut, a dissolve into one scene, and a Ken Burns path over a chosen part of a picture renders correctly |
 | **M3** | **Editor** | The M0 scene list grows into the storyboard: a card per segment (thumbnail, label, first line), lanes for audio tracks and overlays against the segments, a per-scene panel (visual, trim, transition, motion with a drag-a-box framing tool, voice), a project defaults panel. Sliders take their ranges from the schema (the Notes spec doc, open decision 12). Undo/redo over `ProjectVersion`. | You can build and fix a whole video by hand without opening the JSON tab |
 | **M4** | **AI drafting** | Providers copied from GAM's M6. "New video from a prompt": brief → spec (D2) with GAM search as a tool, and placeholders for gaps, with one repair round. Also from selected GAM assets. Cost estimate before running, usage recorded. | "Make a 3-minute video about *X* using clips where people talk about it" produces a spec that previews immediately |
 | **M5** | **AI editing** | The Notes spec doc §8.2 operations, addressed by id. Chat beside the storyboard. Suggestions staged and accepted one by one. Generate placeholders sent to GAM's M8. | "Change the music after the second chapter to something calmer, and dissolve into the last scene" becomes reviewed, applied edits |
diff --git a/frontend/Dockerfile b/frontend/Dockerfile
index f68ced2..6bd912c 100644
--- a/frontend/Dockerfile
+++ b/frontend/Dockerfile
@@ -22,8 +22,10 @@ EXPOSE 80
 # The CSP's connect-src, so a deployment pointing at a different Notes instance does
 # not need its own image. Substituted at container start, not build time.
 ENV NOTES_BASE_URL=https://notes.geckopico.com
+# img-src and media-src: thumbnails and previews load from GAM directly.
+ENV GAM_BASE_URL=https://gam.geckopico.com
 
-# Only this one is substituted; nginx's own $variables ($uri, $host, $remote_addr …)
+# Only these two are substituted; nginx's own $variables ($uri, $host, $remote_addr …)
 # must survive untouched, which is why envsubst is given an explicit list rather than
 # left to replace everything it recognises.
-CMD ["/bin/sh", "-c", "envsubst '${NOTES_BASE_URL}' < /etc/nginx/templates/default.conf.template > /etc/nginx/conf.d/default.conf && nginx -g 'daemon off;'"]
+CMD ["/bin/sh", "-c", "envsubst '${NOTES_BASE_URL} ${GAM_BASE_URL}' < /etc/nginx/templates/default.conf.template > /etc/nginx/conf.d/default.conf && nginx -g 'daemon off;'"]
diff --git a/frontend/csp.test.ts b/frontend/csp.test.ts
index 16d270a..529077b 100644
--- a/frontend/csp.test.ts
+++ b/frontend/csp.test.ts
@@ -70,4 +70,13 @@ describe('Content-Security-Policy', () => {
     expect(directive('connect-src')).toContain('${NOTES_BASE_URL}')
     expect(directive('connect-src')).not.toContain('geckopico.com')
   })
+
+  it('lets thumbnails and footage previews load from GAM, templated too', () => {
+    // GAM's signed media URLs go straight into <img> and <video>. Without its origin
+    // here every thumbnail is blocked, which shows only as a console warning.
+    for (const name of ['img-src', 'media-src']) {
+      expect(directive(name)).toContain('${GAM_BASE_URL}')
+      expect(directive(name)).not.toContain('geckopico.com')
+    }
+  })
 })
diff --git a/frontend/nginx.conf b/frontend/nginx.conf
index e259ee4..f33c1d3 100644
--- a/frontend/nginx.conf
+++ b/frontend/nginx.conf
@@ -60,8 +60,10 @@ server {
         #
         # No 'unsafe-eval' here — gecko-notes needs it for BlockNote; GVC does not.
         #
-        # img-src and media-src will need the GAM origin once previews show GAM media
-        # (M1), unless that is proxied through this origin instead.
-        add_header Content-Security-Policy "default-src 'self'; script-src 'self' 'sha256-k5/2A0I5Mwg2n/V9CEukpiKkBRPF23IJ/Ucem02Iz78='; style-src 'self' 'unsafe-inline'; img-src 'self' data: blob:; media-src 'self' blob:; font-src 'self'; connect-src 'self' ${NOTES_BASE_URL}; frame-ancestors 'self'";
+        # img-src and media-src carry the GAM origin: thumbnails and footage previews load
+        # straight from GAM's signed media URLs rather than through this server, which
+        # would otherwise relay every byte of every preview. Substituted from
+        # GAM_BASE_URL at container start, like the Notes origin above.
+        add_header Content-Security-Policy "default-src 'self'; script-src 'self' 'sha256-k5/2A0I5Mwg2n/V9CEukpiKkBRPF23IJ/Ucem02Iz78='; style-src 'self' 'unsafe-inline'; img-src 'self' data: blob: ${GAM_BASE_URL}; media-src 'self' blob: ${GAM_BASE_URL}; font-src 'self'; connect-src 'self' ${NOTES_BASE_URL}; frame-ancestors 'self'";
     }
 }
diff --git a/frontend/src/api/gam.ts b/frontend/src/api/gam.ts
new file mode 100644
index 0000000..5d2c97c
--- /dev/null
+++ b/frontend/src/api/gam.ts
@@ -0,0 +1,68 @@
+import client from '@/api/client'
+
+/**
+ * GAM, the media library, searched and read through GVC's backend as the signed-in
+ * user. The URLs here are absolute and signed by GAM, and they expire: use them to
+ * show something now, never store them in a spec (a spec keeps only the asset id).
+ */
+
+export interface GamAsset {
+  id: string
+  name: string
+  asset_type: 'image' | 'video' | 'audio' | string
+  duration_seconds: number | null
+  width: number | null
+  height: number | null
+  file_url: string | null
+  thumb_url: string | null
+  credit: string
+  parent_asset_id: string | null
+  in_point: number | null
+  out_point: number | null
+  missing: boolean
+}
+
+export interface GamHit {
+  asset: GamAsset
+  score: number
+  /** Keyword hits wrap the matched words in «guillemets». */
+  snippet: string
+  /** The moment that matched, in seconds. Null for a hit on the file's name. */
+  start_time: number | null
+  /** Null on a GAM older than gam#36; the editor then sizes the moment itself. */
+  end_time: number | null
+}
+
+export interface GamSearch {
+  data: GamHit[]
+  total: number
+  query: string
+  /** Whether GAM's meaning-based half ran; "no results" means less when it did not. */
+  semantic: boolean
+  semantic_error: string | null
+}
+
+export type MediaKind = 'image' | 'video' | 'audio'
+
+interface DataResponse<T> {
+  data: T
+}
+
+export const gamApi = {
+  search(q: string, type?: MediaKind): Promise<GamSearch> {
+    return client
+      .get<GamSearch>('/gam/search', { params: { q, type, limit: 30 } })
+      .then((r) => r.data)
+  },
+
+  /** Fresh names, thumbnails and URLs for the GAM assets a spec uses; null if gone. */
+  lookup(ids: string[]): Promise<Record<string, GamAsset | null>> {
+    if (ids.length === 0) return Promise.resolve({})
+    return client
+      .post<DataResponse<{ assets: Record<string, GamAsset | null> }>>(
+        '/gam/assets/lookup',
+        { ids }
+      )
+      .then((r) => r.data.data.assets)
+  },
+}
diff --git a/frontend/src/api/projects.ts b/frontend/src/api/projects.ts
index d785ec8..61d39d6 100644
--- a/frontend/src/api/projects.ts
+++ b/frontend/src/api/projects.ts
@@ -21,6 +21,41 @@ export interface Card {
   subtitle?: string
 }
 
+export interface Trim {
+  in: number
+  out?: number
+}
+
+export interface Visual {
+  asset: string
+  trim?: Trim
+  audio?: 'mute' | 'play'
+  loop?: boolean
+  [key: string]: unknown
+}
+
+/** An entry in the spec's asset registry. Only the fields the editor reads are named. */
+export type AssetRef =
+  | { from: 'gam'; id: string; type?: string; label?: string }
+  | { from: 'notes'; url: string; type: string; label?: string }
+  | {
+      from: 'generate'
+      type: string
+      prompt: string
+      status?: string
+      label?: string
+      [key: string]: unknown
+    }
+  | {
+      from: 'search'
+      query: string
+      type?: string
+      moment?: { min?: number; max?: number }
+      status?: 'unresolved' | 'resolved'
+      result?: { from: 'gam'; id: string; in?: number; out?: number }
+      label?: string
+    }
+
 export interface Segment {
   id: string
   kind: 'scene' | 'card' | 'clip'
@@ -28,6 +63,7 @@ export interface Segment {
   label?: string
   chapter?: string
   card?: Card
+  visual?: Visual
   narration?: { beats: Beat[]; [key: string]: unknown }
   transition_in?: { style?: string; duration?: number }
   [key: string]: unknown
@@ -38,6 +74,7 @@ export interface VideoSpec {
   id?: string
   title: string
   source?: { kind: 'note' | 'brief'; [key: string]: unknown }
+  assets?: Record<string, AssetRef>
   segments: Segment[]
   [key: string]: unknown
 }
@@ -80,6 +117,12 @@ export interface Validation {
   spec: VideoSpec | null
 }
 
+export interface NoteMediaCopy {
+  project: Project
+  copied: string[]
+  failed: { key: string; message: string }[]
+}
+
 interface DataResponse<T> {
   data: T
 }
@@ -136,6 +179,13 @@ export const projectsApi = {
       .then((r) => r.data.data)
   },
 
+  /** Move a pushed note's files into GAM; failures stay in the note, to retry. */
+  copyNoteMedia(id: string): Promise<NoteMediaCopy> {
+    return client
+      .post<DataResponse<NoteMediaCopy>>(`/projects/${id}/copy-note-media`)
+      .then((r) => r.data.data)
+  },
+
   /** Always resolves for a reachable server: an invalid spec is an answer, not an error. */
   validate(spec: unknown): Promise<Validation> {
     return client
diff --git a/frontend/src/components/FootageSearch.test.tsx b/frontend/src/components/FootageSearch.test.tsx
new file mode 100644
index 0000000..90df5db
--- /dev/null
+++ b/frontend/src/components/FootageSearch.test.tsx
@@ -0,0 +1,148 @@
+import { render, screen } from '@testing-library/react'
+import userEvent from '@testing-library/user-event'
+import { afterEach, describe, expect, it, vi } from 'vitest'
+import { gamApi, type GamAsset, type GamHit, type GamSearch } from '@/api/gam'
+import FootageSearch from '@/components/FootageSearch'
+
+function asset(overrides: Partial<GamAsset> = {}): GamAsset {
+  return {
+    id: 'g1',
+    name: 'Archive interview',
+    asset_type: 'video',
+    duration_seconds: 1800,
+    width: null,
+    height: null,
+    file_url: 'https://gam.test/media/g1?sig=x',
+    thumb_url: 'https://gam.test/media/g1.jpg?sig=x',
+    credit: 'BBC Archive, 1971',
+    parent_asset_id: null,
+    in_point: null,
+    out_point: null,
+    missing: false,
+    ...overrides,
+  }
+}
+
+function result(hits: GamHit[], semantic = true): GamSearch {
+  return { data: hits, total: hits.length, query: 'q', semantic, semantic_error: null }
+}
+
+const spoken: GamHit = {
+  asset: asset(),
+  score: 0.03,
+  snippet: 'they talked about «water» all day',
+  start_time: 734,
+  end_time: 741.5,
+}
+
+afterEach(() => vi.restoreAllMocks())
+
+describe('FootageSearch', () => {
+  it('finds where something is said and places that moment as b-roll', async () => {
+    const search = vi.spyOn(gamApi, 'search').mockResolvedValue(result([spoken]))
+    const onPick = vi.fn()
+    render(
+      <FootageSearch title="Footage" purpose="scene" onPick={onPick} onClose={vi.fn()} />
+    )
+
+    await userEvent.type(screen.getByLabelText('Search the asset library'), 'water')
+    await userEvent.click(screen.getByRole('button', { name: 'Search' }))
+
+    expect(search).toHaveBeenCalledWith('water', 'video')
+    expect(await screen.findByText('water', { selector: 'mark' })).toBeInTheDocument()
+    expect(screen.getByText('at 12:14–12:21')).toBeInTheDocument()
+
+    await userEvent.click(screen.getByRole('button', { name: /Archive interview/ }))
+    expect(screen.getByText('Uses 12:13–12:22 (9 s)')).toBeInTheDocument()
+    expect(screen.getByText('BBC Archive, 1971')).toBeInTheDocument()
+    const video = document.querySelector('video')!
+    expect(video.getAttribute('src')).toBe('https://gam.test/media/g1?sig=x#t=733.5,742')
+
+    await userEvent.click(screen.getByRole('button', { name: 'Play with its sound' }))
+    expect(onPick).toHaveBeenCalledWith(spoken, 'clip')
+  })
+
+  it('offers a picture as a picture', async () => {
+    const map = {
+      ...spoken,
+      start_time: null,
+      end_time: null,
+      asset: asset({ asset_type: 'image', name: 'Map' }),
+    }
+    vi.spyOn(gamApi, 'search').mockResolvedValue(result([map]))
+    const onPick = vi.fn()
+    render(
+      <FootageSearch
+        title="Footage"
+        purpose="scene"
+        initialQuery="map"
+        onPick={onPick}
+        onClose={vi.fn()}
+      />
+    )
+
+    await userEvent.click(screen.getByRole('button', { name: 'Pictures' }))
+    await userEvent.click(screen.getByRole('button', { name: 'Search' }))
+    await userEvent.click(await screen.findByRole('button', { name: /Map/ }))
+
+    expect(screen.getByText('A still picture')).toBeInTheDocument()
+    expect(screen.queryByRole('button', { name: 'Play with its sound' })).toBeNull()
+    await userEvent.click(screen.getByRole('button', { name: 'Use this picture' }))
+    expect(onPick).toHaveBeenCalledWith(map, 'broll')
+  })
+
+  it('sizes the moment the way a placeholder asked for', async () => {
+    vi.spyOn(gamApi, 'search').mockResolvedValue(result([spoken]))
+    render(
+      <FootageSearch
+        title="Find: ruins"
+        purpose="resolve"
+        initialQuery="ruins"
+        moment={{ min: 20 }}
+        onPick={vi.fn()}
+        onClose={vi.fn()}
+      />
+    )
+    await userEvent.click(screen.getByRole('button', { name: 'Search' }))
+    await userEvent.click(
+      await screen.findByRole('button', { name: /Archive interview/ })
+    )
+    expect(screen.getByText('Uses 12:07–12:27 (20 s)')).toBeInTheDocument()
+    expect(screen.getByRole('button', { name: 'Use this' })).toBeInTheDocument()
+  })
+
+  it('says when only the word-matching half of the search ran', async () => {
+    vi.spyOn(gamApi, 'search').mockResolvedValue(result([], false))
+    render(
+      <FootageSearch
+        title="F"
+        purpose="scene"
+        initialQuery="x"
+        onPick={vi.fn()}
+        onClose={vi.fn()}
+      />
+    )
+    await userEvent.click(screen.getByRole('button', { name: 'Search' }))
+    expect(await screen.findByText(/Matched on words only/)).toBeInTheDocument()
+    expect(screen.getByText('Nothing in the library matches.')).toBeInTheDocument()
+  })
+
+  it('shows what went wrong when the library cannot be reached', async () => {
+    vi.spyOn(gamApi, 'search').mockRejectedValue(
+      new Error('Could not reach the asset library')
+    )
+    render(
+      <FootageSearch
+        title="F"
+        purpose="scene"
+        initialQuery="x"
+        onPick={vi.fn()}
+        onClose={vi.fn()}
+      />
+    )
+    await userEvent.click(screen.getByRole('button', { name: 'Search' }))
+    expect(await screen.findByRole('alert')).toHaveTextContent(
+      'Could not reach the asset library'
+    )
+  })
+})
diff --git a/frontend/src/components/FootageSearch.tsx b/frontend/src/components/FootageSearch.tsx
new file mode 100644
index 0000000..ce2d881
--- /dev/null
+++ b/frontend/src/components/FootageSearch.tsx
@@ -0,0 +1,274 @@
+import { useState, type FormEvent, type ReactNode } from 'react'
+import { Film, Image as ImageIcon, Search, X } from 'lucide-react'
+import { apiErrorMessage } from '@/api/client'
+import { gamApi, type GamHit, type GamSearch, type MediaKind } from '@/api/gam'
+import { clock, momentTrim, type MomentSize, type PlaceMode } from '@/spec/footage'
+
+/**
+ * - `scene`: footage for one scene, as b-roll under its narration or as a clip with
+ *   its own sound.
+ * - `resolve`: whatever answers a `search` placeholder.
+ */
+type Purpose = 'scene' | 'resolve'
+
+interface Props {
+  title: string
+  purpose: Purpose
+  initialQuery?: string
+  initialType?: MediaKind
+  /** How long a found moment should be: a placeholder's `moment`, or the default. */
+  moment?: MomentSize
+  onPick: (hit: GamHit, mode: PlaceMode) => void
+  onClose: () => void
+}
+
+const TYPES: { id: MediaKind | undefined; label: string }[] = [
+  { id: 'video', label: 'Video' },
+  { id: 'image', label: 'Pictures' },
+  { id: undefined, label: 'Everything' },
+]
+
+/** GAM's «matched» words, shown marked rather than with the guillemets. */
+function Snippet({ text }: { text: string }) {
+  const parts: ReactNode[] = []
+  text.split(/«([^»]*)»/).forEach((part, i) => {
+    if (part) parts.push(i % 2 === 1 ? <mark key={i}>{part}</mark> : part)
+  })
+  return <p className="line-clamp-2 text-xs text-gray-600 dark:text-gray-400">{parts}</p>
+}
+
+/**
+ * Searching GAM for something to show, including "where people talk about X": GAM
+ * searches what is said in its videos, and a hit on a line comes back as the moment
+ * it was said, which becomes the trim.
+ */
+export default function FootageSearch({
+  title,
+  purpose,
+  initialQuery = '',
+  initialType = 'video',
+  moment,
+  onPick,
+  onClose,
+}: Props) {
+  const [query, setQuery] = useState(initialQuery)
+  const [type, setType] = useState<MediaKind | undefined>(initialType)
+  const [result, setResult] = useState<GamSearch | null>(null)
+  const [selected, setSelected] = useState<GamHit | null>(null)
+  const [busy, setBusy] = useState(false)
+  const [error, setError] = useState<string | null>(null)
+
+  async function run(event?: FormEvent) {
+    event?.preventDefault()
+    if (!query.trim()) return
+    setBusy(true)
+    setError(null)
+    setSelected(null)
+    try {
+      setResult(await gamApi.search(query, type))
+    } catch (err) {
+      setResult(null)
+      setError(apiErrorMessage(err))
+    } finally {
+      setBusy(false)
+    }
+  }
+
+  const trim = selected ? momentTrim(selected, moment) : undefined
+  const isVideo = selected?.asset.asset_type === 'video'
+
+  return (
+    <div
+      className="fixed inset-0 z-40 flex items-start justify-center bg-black/40 p-4 pt-12"
+      onClick={onClose}
+    >
+      <div
+        role="dialog"
+        aria-label={title}
+        className="card flex max-h-[85vh] w-full max-w-3xl flex-col gap-3 p-4"
+        onClick={(e) => e.stopPropagation()}
+      >
+        <div className="flex items-center gap-2">
+          <h2 className="flex-1 font-semibold text-gray-900 dark:text-gray-100">
+            {title}
+          </h2>
+          <button
+            type="button"
+            className="btn btn-ghost p-2"
+            aria-label="Close"
+            onClick={onClose}
+          >
+            <X className="h-4 w-4" />
+          </button>
+        </div>
+
+        <form onSubmit={(e) => void run(e)} className="flex gap-2">
+          <input
+            className="input flex-1"
+            aria-label="Search the asset library"
+            placeholder="What is said, or what it shows: e.g. people talking about water"
+            value={query}
+            onChange={(e) => setQuery(e.target.value)}
+            autoFocus
+          />
+          <button type="submit" className="btn btn-primary" disabled={busy}>
+            <Search className="mr-1 inline h-4 w-4" />
+            Search
+          </button>
+        </form>
+
+        <div className="flex gap-1" role="group" aria-label="Kind of media">
+          {TYPES.map((t) => (
+            <button
+              key={t.label}
+              type="button"
+              aria-pressed={type === t.id}
+              className={`btn text-xs ${type === t.id ? 'btn-secondary' : 'btn-ghost'}`}
+              onClick={() => setType(t.id)}
+            >
+              {t.label}
+            </button>
+          ))}
+        </div>
+
+        {error && (
+          <p role="alert" className="text-sm text-red-600 dark:text-red-400">
+            {error}
+          </p>
+        )}
+        {result && !result.semantic && (
+          <p className="text-xs text-gray-500">
+            {result.semantic_error
+              ? `Matched on words only: GAM's meaning-based search failed (${result.semantic_error}).`
+              : "Matched on words only: meaning-based search isn't set up in GAM."}
+          </p>
+        )}
+
+        <div className="grid min-h-0 flex-1 gap-3 overflow-hidden md:grid-cols-2">
+          <ul className="space-y-1 overflow-auto" aria-label="Results">
+            {result?.data.length === 0 && (
+              <li className="text-sm text-gray-500">Nothing in the library matches.</li>
+            )}
+            {result?.data.map((h, i) => (
+              <li key={`${h.asset.id}-${i}`}>
+                <button
+                  type="button"
+                  aria-pressed={selected === h}
+                  onClick={() => setSelected(h)}
+                  className={`flex w-full gap-2 rounded p-2 text-left hover:bg-gray-100 dark:hover:bg-gray-700 ${
+                    selected === h ? 'bg-primary-50 dark:bg-gray-700' : ''
+                  }`}
+                >
+                  {h.asset.thumb_url ? (
+                    <img
+                      src={h.asset.thumb_url}
+                      alt=""
+                      className="h-12 w-20 shrink-0 rounded object-cover"
+                    />
+                  ) : (
+                    <span className="flex h-12 w-20 shrink-0 items-center justify-center rounded bg-gray-100 dark:bg-gray-800">
+                      {h.asset.asset_type === 'image' ? (
+                        <ImageIcon className="h-4 w-4 text-gray-400" />
+                      ) : (
+                        <Film className="h-4 w-4 text-gray-400" />
+                      )}
+                    </span>
+                  )}
+                  <span className="min-w-0 flex-1">
+                    <span className="block truncate text-sm font-medium text-gray-900 dark:text-gray-100">
+                      {h.asset.name}
+                    </span>
+                    {h.start_time !== null && (
+                      <span className="text-xs text-gray-500">
+                        at {clock(h.start_time)}
+                        {h.end_time !== null && `–${clock(h.end_time)}`}
+                      </span>
+                    )}
+                    {h.snippet && <Snippet text={h.snippet} />}
+                  </span>
+                </button>
+              </li>
+            ))}
+          </ul>
+
+          {selected && (
+            <div className="space-y-2" aria-label="Selected">
+              {isVideo && selected.asset.file_url ? (
+                <video
+                  key={`${selected.asset.id}-${trim?.in}`}
+                  controls
+                  preload="metadata"
+                  className="w-full rounded bg-black"
+                  src={
+                    trim
+                      ? `${selected.asset.file_url}#t=${trim.in},${trim.out}`
+                      : selected.asset.file_url
+                  }
+                />
+              ) : selected.asset.file_url ? (
+                <img
+                  src={selected.asset.file_url}
+                  alt={selected.asset.name}
+                  className="w-full rounded"
+                />
+              ) : null}
+              <p className="text-sm text-gray-700 dark:text-gray-300">
+                {trim
+                  ? `Uses ${clock(trim.in)}–${clock(trim.out)} (${Math.round(trim.out - trim.in)} s)`
+                  : isVideo
+                    ? 'Uses the whole video'
+                    : 'A still picture'}
+              </p>
+              {selected.asset.credit && (
+                <p className="text-xs text-gray-500">{selected.asset.credit}</p>
+              )}
+              <div className="flex flex-wrap gap-2">
+                {purpose === 'resolve' ? (
+                  <button
+                    type="button"
+                    className="btn btn-primary"
+                    onClick={() => onPick(selected, 'broll')}
+                  >
+                    Use this
+                  </button>
+                ) : isVideo ? (
+                  <>
+                    <button
+                      type="button"
+                      className="btn btn-primary"
+                      onClick={() => onPick(selected, 'broll')}
+                    >
+                      Use as b-roll
+                    </button>
+                    <button
+                      type="button"
+                      className="btn btn-secondary"
+                      onClick={() => onPick(selected, 'clip')}
+                    >
+                      Play with its sound
+                    </button>
+                  </>
+                ) : (
+                  <button
+                    type="button"
+                    className="btn btn-primary"
+                    onClick={() => onPick(selected, 'broll')}
+                  >
+                    Use this picture
+                  </button>
+                )}
+              </div>
+              {purpose === 'scene' && isVideo && (
+                <p className="text-xs text-gray-500">
+                  B-roll plays silently under this scene&apos;s narration. With its sound,
+                  the scene becomes a clip and its narration is set aside (Discard brings
+                  it back).
+                </p>
+              )}
+            </div>
+          )}
+        </div>
+      </div>
+    </div>
+  )
+}
diff --git a/frontend/src/components/SceneList.tsx b/frontend/src/components/SceneList.tsx
index d686302..770c15d 100644
--- a/frontend/src/components/SceneList.tsx
+++ b/frontend/src/components/SceneList.tsx
@@ -1,5 +1,8 @@
 import { ArrowDown, ArrowUp, Plus, Trash2 } from 'lucide-react'
+import type { GamAsset } from '@/api/gam'
 import type { Segment, VideoSpec } from '@/api/projects'
+import VisualStrip from '@/components/VisualStrip'
+import { removeVisual } from '@/spec/footage'
 import {
   addScene,
   moveSegment,
@@ -12,6 +15,10 @@ import {
 interface Props {
   spec: VideoSpec
   onChange: (next: VideoSpec) => void
+  /** GAM assets the spec shows, looked up by the project store. */
+  gamAssets?: Record<string, GamAsset | null>
+  /** Open the footage search for the segment at this index. */
+  onFindFootage?: (index: number) => void
 }
 
 const KIND_LABEL: Record<Segment['kind'], string> = {
@@ -23,12 +30,17 @@ const KIND_LABEL: Record<Segment['kind'], string> = {
 /**
  * The video as a list of segments, built and rearranged by hand.
  *
- * The seed of M3's storyboard: today it edits labels, card titles and narration, and
- * adds, moves and removes scenes. Everything else a segment carries (its picture,
- * transition, Ken Burns move) is kept untouched and edited in the JSON tab until the
- * per-scene panel exists.
+ * The seed of M3's storyboard: today it edits labels, card titles, narration and each
+ * scene's picture or footage (found in GAM), and adds, moves and removes scenes.
+ * Everything else a segment carries (transition, Ken Burns move) is kept untouched and
+ * edited in the JSON tab until the per-scene panel exists.
  */
-export default function SceneList({ spec, onChange }: Props) {
+export default function SceneList({
+  spec,
+  onChange,
+  gamAssets = {},
+  onFindFootage,
+}: Props) {
   const segments = spec.segments
   const edit = (index: number, change: (s: Segment) => Segment) =>
     onChange(updateSegment(spec, index, change))
@@ -95,6 +107,16 @@ export default function SceneList({ spec, onChange }: Props) {
             />
           )}
 
+          {segment.kind !== 'card' && onFindFootage && (
+            <VisualStrip
+              spec={spec}
+              segment={segment}
+              gamAssets={gamAssets}
+              onFind={() => onFindFootage(index)}
+              onRemove={() => onChange(removeVisual(spec, index))}
+            />
+          )}
+
           {segment.kind === 'scene' && (
             <textarea
               className="input min-h-[5rem] w-full"
diff --git a/frontend/src/components/VisualStrip.test.tsx b/frontend/src/components/VisualStrip.test.tsx
new file mode 100644
index 0000000..5afb24c
--- /dev/null
+++ b/frontend/src/components/VisualStrip.test.tsx
@@ -0,0 +1,77 @@
+import { render, screen } from '@testing-library/react'
+import { describe, expect, it, vi } from 'vitest'
+import type { GamAsset } from '@/api/gam'
+import type { Segment, VideoSpec } from '@/api/projects'
+import VisualStrip from '@/components/VisualStrip'
+
+const reel: GamAsset = {
+  id: 'g1',
+  name: 'Archive interview',
+  asset_type: 'video',
+  duration_seconds: 1800,
+  width: null,
+  height: null,
+  file_url: 'https://gam.test/f',
+  thumb_url: 'https://gam.test/t.jpg',
+  credit: '',
+  parent_asset_id: null,
+  in_point: null,
+  out_point: null,
+  missing: false,
+}
+
+const spec: VideoSpec = {
+  title: 'T',
+  assets: {
+    a_reel: { from: 'gam', id: 'g1' },
+    a_gone: { from: 'gam', id: 'g9', label: 'Old map' },
+    a_note: { from: 'notes', url: '/media/u1/map.png', type: 'image' },
+    a_ruins: { from: 'search', query: 'ruins at dusk', status: 'unresolved' },
+  },
+  segments: [],
+}
+
+function strip(segment: Segment) {
+  return render(
+    <VisualStrip
+      spec={spec}
+      segment={segment}
+      gamAssets={{ g1: reel, g9: null }}
+      onFind={vi.fn()}
+      onRemove={vi.fn()}
+    />
+  )
+}
+
+describe('VisualStrip', () => {
+  it('shows the footage with its thumbnail and trim', () => {
+    strip({
+      id: 's',
+      kind: 'scene',
+      visual: { asset: 'a_reel', trim: { in: 733.5, out: 742 } },
+    })
+    expect(screen.getByText('Archive interview')).toBeInTheDocument()
+    expect(screen.getByText('12:13–12:22')).toBeInTheDocument()
+    expect(document.querySelector('img')?.getAttribute('src')).toBe(
+      'https://gam.test/t.jpg'
+    )
+  })
+
+  it('says why there is nothing to show', () => {
+    const { unmount } = strip({ id: 's', kind: 'scene', visual: { asset: 'a_gone' } })
+    expect(screen.getByText('No longer in the library')).toBeInTheDocument()
+    unmount()
+    strip({ id: 's', kind: 'scene', visual: { asset: 'a_note' } })
+    expect(screen.getByText('Still in the note')).toBeInTheDocument()
+  })
+
+  it('names what a placeholder is waiting for', () => {
+    strip({ id: 's', kind: 'scene', visual: { asset: 'a_ruins' } })
+    expect(screen.getByText('To find: “ruins at dusk”')).toBeInTheDocument()
+  })
+
+  it('offers to find footage for a scene without any', () => {
+    strip({ id: 's', kind: 'scene' })
+    expect(screen.getByRole('button', { name: 'Find footage' })).toBeInTheDocument()
+  })
+})
diff --git a/frontend/src/components/VisualStrip.tsx b/frontend/src/components/VisualStrip.tsx
new file mode 100644
index 0000000..3eea43b
--- /dev/null
+++ b/frontend/src/components/VisualStrip.tsx
@@ -0,0 +1,120 @@
+import { Film, ImageOff, Search, X } from 'lucide-react'
+import type { GamAsset } from '@/api/gam'
+import type { Segment, VideoSpec } from '@/api/projects'
+import { clock } from '@/spec/footage'
+
+interface Props {
+  spec: VideoSpec
+  segment: Segment
+  gamAssets: Record<string, GamAsset | null>
+  onFind: () => void
+  onRemove: () => void
+}
+
+interface Shown {
+  name: string
+  thumb: string | null
+  /** Why there is no picture to show yet, when there isn't. */
+  note?: string
+}
+
+/** What a segment's visual is, in words a person can check at a glance. */
+function describe(spec: VideoSpec, key: string, gamAssets: Props['gamAssets']): Shown {
+  const ref = spec.assets?.[key]
+  if (!ref) return { name: key, thumb: null, note: 'Not in this project’s assets' }
+  const fromGam = (id: string, label?: string): Shown => {
+    if (!(id in gamAssets)) return { name: label ?? id, thumb: null }
+    const asset = gamAssets[id]
+    if (!asset)
+      return { name: label ?? id, thumb: null, note: 'No longer in the library' }
+    if (asset.missing)
+      return { name: asset.name, thumb: null, note: 'Its file is missing in GAM' }
+    return { name: asset.name, thumb: asset.thumb_url }
+  }
+  switch (ref.from) {
+    case 'gam':
+      return fromGam(ref.id, ref.label)
+    case 'search':
+      return ref.result
+        ? fromGam(ref.result.id, ref.label)
+        : { name: ref.label ?? ref.query, thumb: null, note: `To find: “${ref.query}”` }
+    case 'notes':
+      return {
+        name: ref.label ?? ref.url.split('/').pop() ?? key,
+        thumb: null,
+        note: 'Still in the note',
+      }
+    case 'generate':
+      return {
+        name: ref.label ?? 'To generate',
+        thumb: null,
+        note: `To generate: “${ref.prompt}”`,
+      }
+  }
+}
+
+/**
+ * The picture or footage a scene shows, with its trim, and the way to change it.
+ * Cards draw their own background, so they have none.
+ */
+export default function VisualStrip({
+  spec,
+  segment,
+  gamAssets,
+  onFind,
+  onRemove,
+}: Props) {
+  const visual = segment.visual
+  if (!visual) {
+    return (
+      <button type="button" className="btn btn-ghost text-xs" onClick={onFind}>
+        <Search className="mr-1 inline h-3 w-3" />
+        Find footage
+      </button>
+    )
+  }
+  const shown = describe(spec, visual.asset, gamAssets)
+  const trim = visual.trim
+  return (
+    <div
+      className="flex items-center gap-3 rounded bg-gray-50 p-2 dark:bg-gray-800"
+      aria-label="Picture"
+    >
+      {shown.thumb ? (
+        <img src={shown.thumb} alt="" className="h-12 w-20 rounded object-cover" />
+      ) : (
+        <span className="flex h-12 w-20 items-center justify-center rounded bg-gray-200 dark:bg-gray-700">
+          {shown.note ? (
+            <ImageOff className="h-4 w-4 text-gray-400" />
+          ) : (
+            <Film className="h-4 w-4 text-gray-400" />
+          )}
+        </span>
+      )}
+      <span className="min-w-0 flex-1 text-sm">
+        <span className="block truncate text-gray-900 dark:text-gray-100">
+          {shown.name}
+        </span>
+        <span className="text-xs text-gray-500">
+          {trim &&
+            `${clock(trim.in)}–${trim.out !== undefined ? clock(trim.out) : 'end'}`}
+          {trim && shown.note && ' · '}
+          {shown.note}
+          {visual.audio === 'play' && ' · with its sound'}
+        </span>
+      </span>
+      <button type="button" className="btn btn-ghost text-xs" onClick={onFind}>
+        <Search className="mr-1 inline h-3 w-3" />
+        Change
+      </button>
+      <button
+        type="button"
+        className="btn btn-ghost p-2"
+        aria-label="Remove picture"
+        onClick={onRemove}
+      >
+        <X className="h-4 w-4" />
+      </button>
+    </div>
+  )
+}
diff --git a/frontend/src/spec/footage.test.ts b/frontend/src/spec/footage.test.ts
new file mode 100644
index 0000000..03c6f75
--- /dev/null
+++ b/frontend/src/spec/footage.test.ts
@@ -0,0 +1,217 @@
+import { describe, expect, it } from 'vitest'
+import type { GamAsset, GamHit } from '@/api/gam'
+import type { VideoSpec } from '@/api/projects'
+import {
+  assetKeyFor,
+  clock,
+  gamIdsIn,
+  momentTrim,
+  placeHit,
+  removeVisual,
+  resolveSearch,
+  unresolvedSearches,
+} from '@/spec/footage'
+
+function asset(overrides: Partial<GamAsset> = {}): GamAsset {
+  return {
+    id: 'g1',
+    name: 'Archive interview, 1971.mp4',
+    asset_type: 'video',
+    duration_seconds: 1800,
+    width: 1920,
+    height: 1080,
+    file_url: 'https://gam.test/media/g1',
+    thumb_url: 'https://gam.test/media/g1.jpg',
+    credit: '',
+    parent_asset_id: null,
+    in_point: null,
+    out_point: null,
+    missing: false,
+    ...overrides,
+  }
+}
+
+function hit(overrides: Partial<GamHit> = {}, a: Partial<GamAsset> = {}): GamHit {
+  return {
+    asset: asset(a),
+    score: 0.03,
+    snippet: 'the «salt» road',
+    start_time: 734,
+    end_time: 741.5,
+    ...overrides,
+  }
+}
+
+function spec(): VideoSpec {
+  return {
+    title: 'T',
+    segments: [
+      {
+        id: 's_1',
+        kind: 'scene',
+        visual: { asset: 'a_old', fit: 'pad', motion: { effect: 'zoom_in' } },
+        narration: { beats: [{ id: 'b1', text: 'Words.' }] },
+        overlays: [{ id: 'o1', type: 'text', text: 'x' }],
+      },
+    ],
+  }
+}
+
+describe('momentTrim', () => {
+  it('pads what was said so a cut does not clip a word', () => {
+    expect(momentTrim(hit())).toEqual({ in: 733.5, out: 742 })
+  })
+
+  it('assumes a short moment when GAM does not say where it ends', () => {
+    expect(momentTrim(hit({ end_time: null }))).toEqual({ in: 733.5, out: 739.5 })
+  })
+
+  it('widens to a minimum around the middle of the line', () => {
+    expect(momentTrim(hit(), { min: 20 })).toEqual({ in: 727.8, out: 747.8 })
+  })
+
+  it('cuts to a maximum', () => {
+    expect(momentTrim(hit(), { max: 4 })).toEqual({ in: 733.5, out: 737.5 })
+  })
+
+  it('stays inside the asset at both ends', () => {
+    expect(momentTrim(hit({ start_time: 1, end_time: 2 }), { min: 10 })).toEqual({
+      in: 0,
+      out: 10,
+    })
+    expect(momentTrim(hit({ start_time: 1797, end_time: 1800 }))).toEqual({
+      in: 1796.5,
+      out: 1800,
+    })
+  })
+
+  it('has nothing to cut for a hit on the file rather than a moment', () => {
+    expect(momentTrim(hit({ start_time: null, end_time: null }))).toBeUndefined()
+  })
+})
+
+describe('assetKeyFor', () => {
+  it('makes a readable key and keeps it unique', () => {
+    const s = {
+      ...spec(),
+      assets: { a_archive_interview_1971: { from: 'gam' as const, id: 'other' } },
+    }
+    expect(assetKeyFor(s, asset())).toBe('a_archive_interview_1971_2')
+  })
+
+  it('reuses the key already used for the same asset', () => {
+    const s = { ...spec(), assets: { a_reel: { from: 'gam' as const, id: 'g1' } } }
+    expect(assetKeyFor(s, asset())).toBe('a_reel')
+  })
+})
+
+describe('placeHit', () => {
+  it('puts a moment under the narration as muted b-roll', () => {
+    const next = placeHit(spec(), 0, hit(), 'broll')
+    const scene = next.segments[0]
+    expect(scene.kind).toBe('scene')
+    expect(scene.visual).toEqual({
+      asset: 'a_archive_interview_1971',
+      fit: 'pad',
+      trim: { in: 733.5, out: 742 },
+      audio: 'mute',
+      loop: true,
+    })
+    expect(scene.narration?.beats[0].text).toBe('Words.')
+    expect(scene.overlays).toHaveLength(1)
+    expect(next.assets?.a_archive_interview_1971).toEqual({
+      from: 'gam',
+      id: 'g1',
+      type: 'video',
+      label: 'Archive interview, 1971.mp4',
+    })
+  })
+
+  it('makes a clip that plays its own sound and carries nothing said over it', () => {
+    const clip = placeHit(spec(), 0, hit(), 'clip').segments[0]
+    expect(clip.kind).toBe('clip')
+    expect(clip.visual?.audio).toBe('play')
+    expect(clip.visual?.loop).toBe(false)
+    expect(clip.narration).toBeUndefined()
+    expect(clip.overlays).toBeUndefined()
+  })
+
+  it('takes a picture whole, with no trim', () => {
+    const visual = placeHit(
+      spec(),
+      0,
+      hit({}, { asset_type: 'image', id: 'i1', name: 'Map' }),
+      'broll'
+    ).segments[0].visual
+    expect(visual?.trim).toBeUndefined()
+    expect(visual?.asset).toBe('a_map')
+  })
+
+  it('turns a clip whose footage is removed back into a scene', () => {
+    const clip = placeHit(spec(), 0, hit(), 'clip')
+    const scene = removeVisual(clip, 0).segments[0]
+    expect(scene.kind).toBe('scene')
+    expect(scene.visual).toBeUndefined()
+    expect(scene.narration?.beats).toEqual([{ id: 'b1', text: '' }])
+  })
+
+  it('removes a picture and keeps the rest of the scene', () => {
+    const scene = removeVisual(spec(), 0).segments[0]
+    expect(scene.visual).toBeUndefined()
+    expect(scene.narration?.beats[0].text).toBe('Words.')
+  })
+})
+
+describe('search placeholders', () => {
+  function withPlaceholder(): VideoSpec {
+    return {
+      title: 'T',
+      assets: {
+        a_ruins: {
+          from: 'search',
+          query: 'drone footage of ruins',
+          moment: { min: 12 },
+          status: 'unresolved',
+        },
+        a_map: { from: 'gam', id: 'm1' },
+      },
+      segments: [
+        { id: 's_1', kind: 'scene', visual: { asset: 'a_ruins' } },
+        { id: 's_2', kind: 'scene', visual: { asset: 'a_ruins', audio: 'mute' } },
+        { id: 's_3', kind: 'scene', visual: { asset: 'a_map' } },
+      ],
+    }
+  }
+
+  it('lists what is still to find', () => {
+    expect(unresolvedSearches(withPlaceholder()).map((p) => p.key)).toEqual(['a_ruins'])
+  })
+
+  it('resolves to the found moment and trims every scene that shows it', () => {
+    const next = resolveSearch(withPlaceholder(), 'a_ruins', hit())
+    expect(next.assets?.a_ruins).toMatchObject({
+      from: 'search',
+      query: 'drone footage of ruins',
+      status: 'resolved',
+      type: 'video',
+      result: { from: 'gam', id: 'g1', in: 731.8, out: 743.8 },
+    })
+    expect(next.segments[0].visual?.trim).toEqual({ in: 731.8, out: 743.8 })
+    expect(next.segments[1].visual).toEqual({
+      asset: 'a_ruins',
+      audio: 'mute',
+      trim: { in: 731.8, out: 743.8 },
+    })
+    expect(next.segments[2].visual?.trim).toBeUndefined()
+    expect(unresolvedSearches(next)).toEqual([])
+    expect(gamIdsIn(next)).toEqual(['g1', 'm1'])
+  })
+})
+
+describe('clock', () => {
+  it('reads like a timecode', () => {
+    expect(clock(734.2)).toBe('12:14')
+    expect(clock(3725)).toBe('1:02:05')
+    expect(clock(5)).toBe('0:05')
+  })
+})
diff --git a/frontend/src/spec/footage.ts b/frontend/src/spec/footage.ts
new file mode 100644
index 0000000..32d3dfd
--- /dev/null
+++ b/frontend/src/spec/footage.ts
@@ -0,0 +1,217 @@
+import type { GamAsset, GamHit } from '@/api/gam'
+import type { AssetRef, Segment, Trim, VideoSpec } from '@/api/projects'
+
+/**
+ * Putting things found in GAM into a spec, as pure functions from one spec to the next.
+ *
+ * Same rules as `edits.ts`: each returns a new spec and leaves every field it does not
+ * understand as it was. The spec only ever records GAM's asset id and the trim; the
+ * signed URLs a hit carries expire and are fetched afresh to show anything.
+ */
+
+/** How long a moment is taken to be when GAM does not say where it ends (pre gam#36). */
+export const DEFAULT_MOMENT_SECONDS = 5
+
+export interface MomentSize {
+  min?: number
+  max?: number
+  /** Seconds of lead-in and tail around what was said, so a cut does not clip a word. */
+  pad?: number
+}
+
+const tenth = (n: number) => Math.round(n * 10) / 10
+
+/**
+ * The stretch of an asset to play for a hit: what was said, padded, then made at least
+ * `min` and at most `max` long, and kept inside the asset.
+ *
+ * Undefined for a hit with no moment (a match on the file's name): the whole asset then.
+ */
+export function momentTrim(
+  hit: GamHit,
+  size: MomentSize = {}
+): Required<Trim> | undefined {
+  if (hit.start_time === null) return undefined
+  const { min, max, pad = 0.5 } = size
+  const start = hit.start_time
+  const end = hit.end_time ?? start + DEFAULT_MOMENT_SECONDS
+  let a = Math.max(0, start - pad)
+  let b = end + pad
+
+  if (min !== undefined && b - a < min) {
+    // Widened around the middle of what was said, so the line stays in the cut.
+    const centre = (start + end) / 2
+    a = centre - min / 2
+    b = centre + min / 2
+    if (a < 0) {
+      b -= a
+      a = 0
+    }
+  }
+  if (max !== undefined && b - a > max) b = a + max
+
+  const duration = hit.asset.duration_seconds
+  if (duration) {
+    b = Math.min(b, duration)
+    a = Math.max(0, Math.min(a, b - 0.1))
+  }
+  return { in: tenth(a), out: tenth(b) }
+}
+
+function slug(name: string): string {
+  return name
+    .toLowerCase()
+    .replace(/\.[a-z0-9]{2,4}$/, '')
+    .replace(/[^a-z0-9]+/g, '_')
+    .replace(/^_+|_+$/g, '')
+    .slice(0, 24)
+}
+
+/**
+ * The registry key for a GAM asset: the one already used for it, or a new readable one.
+ * Reusing it means two scenes cut from the same interview share one entry, so swapping
+ * the interview later is one edit.
+ */
+export function assetKeyFor(spec: VideoSpec, asset: GamAsset): string {
+  const assets = spec.assets ?? {}
+  for (const [key, ref] of Object.entries(assets)) {
+    if (ref.from === 'gam' && ref.id === asset.id) return key
+  }
+  const base = `a_${slug(asset.name) || 'gam'}`
+  let key = base
+  for (let n = 2; key in assets; n += 1) key = `${base}_${n}`
+  return key
+}
+
+function withGamAsset(spec: VideoSpec, asset: GamAsset): [VideoSpec, string] {
+  const key = assetKeyFor(spec, asset)
+  if (spec.assets?.[key]) return [spec, key]
+  const ref: AssetRef = {
+    from: 'gam',
+    id: asset.id,
+    type: asset.asset_type,
+    label: asset.name,
+  }
+  return [{ ...spec, assets: { ...(spec.assets ?? {}), [key]: ref } }, key]
+}
+
+/**
+ * - `broll`: the scene's picture, muted and looped under its narration.
+ * - `clip`: played with its own sound, nothing said over it. A clip carries no
+ *   narration or overlays, so the segment's are dropped (Discard brings them back).
+ */
+export type PlaceMode = 'broll' | 'clip'
+
+export function placeHit(
+  spec: VideoSpec,
+  index: number,
+  hit: GamHit,
+  mode: PlaceMode,
+  size: MomentSize = {}
+): VideoSpec {
+  const [next, key] = withGamAsset(spec, hit.asset)
+  const trim = hit.asset.asset_type === 'image' ? undefined : momentTrim(hit, size)
+  const segments = next.segments.map((segment, i): Segment => {
+    if (i !== index) return segment
+    const fit = segment.visual?.fit
+    const visual = {
+      asset: key,
+      ...(fit !== undefined ? { fit } : {}),
+      ...(trim ? { trim } : {}),
+      audio: mode === 'clip' ? ('play' as const) : ('mute' as const),
+      loop: mode !== 'clip',
+    }
+    if (mode === 'clip') {
+      // eslint-disable-next-line @typescript-eslint/no-unused-vars
+      const { narration: _n, overlays: _o, ...rest } = segment
+      return { ...rest, kind: 'clip', visual }
+    }
+    return {
+      ...segment,
+      kind: 'scene',
+      visual,
+      narration: segment.narration ?? { beats: [{ id: 'b1', text: '' }] },
+    }
+  })
+  return { ...next, segments }
+}
+
+/**
+ * Back to the project's background: the picture goes, everything else stays.
+ *
+ * A clip is nothing but its footage, so a clip without one becomes an empty scene
+ * rather than a spec that no longer validates.
+ */
+export function removeVisual(spec: VideoSpec, index: number): VideoSpec {
+  return {
+    ...spec,
+    segments: spec.segments.map((segment, i): Segment => {
+      if (i !== index) return segment
+      // eslint-disable-next-line @typescript-eslint/no-unused-vars
+      const { visual: _v, ...rest } = segment
+      if (segment.kind !== 'clip') return rest
+      return { ...rest, kind: 'scene', narration: { beats: [{ id: 'b1', text: '' }] } }
+    }),
+  }
+}
+
+/**
+ * Resolve a `search` placeholder to what was found.
+ *
+ * The key stays a search ref (it records what was asked for, and why the asset is
+ * there); `result` says what answered it. When the placeholder asked for a moment,
+ * every segment showing it gets that moment as its trim.
+ */
+export function resolveSearch(spec: VideoSpec, key: string, hit: GamHit): VideoSpec {
+  const ref = spec.assets?.[key]
+  if (!ref || ref.from !== 'search') return spec
+  const trim =
+    ref.moment && hit.asset.asset_type !== 'image'
+      ? momentTrim(hit, ref.moment)
+      : undefined
+  const resolved: AssetRef = {
+    ...ref,
+    type: ref.type ?? hit.asset.asset_type,
+    status: 'resolved',
+    result: { from: 'gam', id: hit.asset.id, ...(trim ?? {}) },
+  }
+  return {
+    ...spec,
+    assets: { ...spec.assets, [key]: resolved },
+    segments: spec.segments.map((segment) =>
+      trim && segment.visual?.asset === key
+        ? { ...segment, visual: { ...segment.visual, trim } }
+        : segment
+    ),
+  }
+}
+
+/** The `search` placeholders still waiting for footage, with their keys. */
+export function unresolvedSearches(
+  spec: VideoSpec
+): { key: string; ref: Extract<AssetRef, { from: 'search' }> }[] {
+  return Object.entries(spec.assets ?? {}).flatMap(([key, ref]) =>
+    ref.from === 'search' && ref.status !== 'resolved' ? [{ key, ref }] : []
+  )
+}
+
+/** The GAM ids a spec shows, including resolved placeholders: what to look up. */
+export function gamIdsIn(spec: VideoSpec): string[] {
+  const ids = Object.values(spec.assets ?? {}).flatMap((ref) =>
+    ref.from === 'gam'
+      ? [ref.id]
+      : ref.from === 'search' && ref.result
+        ? [ref.result.id]
+        : []
+  )
+  return [...new Set(ids)]
+}
+
+/** `734.2` → `12:14`, `3725` → `1:02:05`. */
+export function clock(seconds: number): string {
+  const s = Math.floor(seconds)
+  const h = Math.floor(s / 3600)
+  const m = Math.floor((s % 3600) / 60)
+  const ss = String(s % 60).padStart(2, '0')
+  return h > 0 ? `${h}:${String(m).padStart(2, '0')}:${ss}` : `${m}:${ss}`
+}
diff --git a/frontend/src/stores/projects.ts b/frontend/src/stores/projects.ts
index 54a1ca0..bcb6347 100644
--- a/frontend/src/stores/projects.ts
+++ b/frontend/src/stores/projects.ts
@@ -1,7 +1,9 @@
 import { create } from 'zustand'
 import { apiErrorMessage } from '@/api/client'
+import { gamApi, type GamAsset } from '@/api/gam'
 import {
   projectsApi,
+  type NoteMediaCopy,
   specIssuesOf,
   type Project,
   type ProjectSummary,
@@ -37,6 +39,11 @@ interface ProjectState {
 
   versions: Version[]
 
+  /** GAM assets the draft shows, by GAM id: names, thumbnails, fresh signed URLs.
+   *  Null for one GAM no longer has. Never saved: the URLs expire. */
+  gamAssets: Record<string, GamAsset | null>
+  gamError: string | null
+
   loadList: () => Promise<void>
   createBlank: (title: string) => Promise<Project | null>
   open: (id: string) => Promise<void>
@@ -46,6 +53,10 @@ interface ProjectState {
   loadVersions: () => Promise<void>
   revert: (versionId: string) => Promise<void>
   remove: (id: string) => Promise<boolean>
+  /** Look up whichever of these GAM ids are not already known. */
+  loadGamAssets: (ids: string[]) => Promise<void>
+  /** Move a pushed note's files into GAM. Needs a saved draft: it writes a version. */
+  copyNoteMedia: () => Promise<NoteMediaCopy | null>
   reset: () => void
 }
 
@@ -61,6 +72,8 @@ const initial = {
   error: null,
   issues: [],
   versions: [],
+  gamAssets: {},
+  gamError: null,
 }
 
 // Bumped by every request that replaces what is on screen, and by `reset()`. A
@@ -105,6 +118,8 @@ export const useProjectStore = create<ProjectState>((set, get) => ({
       versions: [],
       project: null,
       draft: null,
+      gamAssets: {},
+      gamError: null,
     })
     try {
       const project = await projectsApi.get(id)
@@ -192,6 +207,46 @@ export const useProjectStore = create<ProjectState>((set, get) => ({
     }
   },
 
+  async loadGamAssets(ids) {
+    const known = get().gamAssets
+    const wanted = ids.filter((id) => !(id in known))
+    if (wanted.length === 0) return
+    const token = projectToken
+    try {
+      const found = await gamApi.lookup(wanted)
+      if (token !== projectToken) return
+      set({ gamAssets: { ...get().gamAssets, ...found }, gamError: null })
+    } catch (error) {
+      if (token !== projectToken) return
+      // Shown beside the scenes, not as the page's error: the project is still
+      // editable with GAM down, it just cannot show its pictures.
+      set({ gamError: apiErrorMessage(error) })
+    }
+  },
+
+  async copyNoteMedia() {
+    const project = get().project
+    if (!project || get().dirty) return null
+    const token = projectToken
+    set({ saving: true, error: null })
+    try {
+      const result = await projectsApi.copyNoteMedia(project.id)
+      if (token !== projectToken) return null
+      set({
+        project: result.project,
+        draft: result.project.spec,
+        dirty: false,
+        saving: false,
+      })
+      void get().loadVersions()
+      return result
+    } catch (error) {
+      if (token !== projectToken) return null
+      set({ saving: false, error: apiErrorMessage(error) })
+      return null
+    }
+  },
+
   reset() {
     listToken += 1
     projectToken += 1
diff --git a/frontend/src/views/ProjectView.tsx b/frontend/src/views/ProjectView.tsx
index cdf153d..14526e7 100644
--- a/frontend/src/views/ProjectView.tsx
+++ b/frontend/src/views/ProjectView.tsx
@@ -1,14 +1,20 @@
-import { useEffect, useState } from 'react'
-import { ArrowLeft, Save, Undo2 } from 'lucide-react'
+import { useEffect, useMemo, useState } from 'react'
+import { ArrowLeft, CloudUpload, Save, Search, Undo2 } from 'lucide-react'
 import { Link, useParams } from 'react-router-dom'
+import type { NoteMediaCopy } from '@/api/projects'
+import FootageSearch from '@/components/FootageSearch'
 import HistoryPanel from '@/components/HistoryPanel'
 import IssueList from '@/components/IssueList'
 import JsonPanel from '@/components/JsonPanel'
 import SceneList from '@/components/SceneList'
+import { gamIdsIn, placeHit, resolveSearch, unresolvedSearches } from '@/spec/footage'
 import { useProjectStore } from '@/stores/projects'
 
 type Tab = 'scenes' | 'json' | 'history'
 
+/** What the footage search is open for: one scene, or a placeholder to resolve. */
+type Finding = { kind: 'scene'; index: number } | { kind: 'resolve'; key: string }
+
 const TABS: { id: Tab; label: string }[] = [
   { id: 'scenes', label: 'Scenes' },
   { id: 'json', label: 'JSON' },
@@ -29,12 +35,26 @@ export default function ProjectView() {
   const edit = useProjectStore((s) => s.edit)
   const save = useProjectStore((s) => s.save)
   const discard = useProjectStore((s) => s.discard)
+  const gamAssets = useProjectStore((s) => s.gamAssets)
+  const gamError = useProjectStore((s) => s.gamError)
+  const loadGamAssets = useProjectStore((s) => s.loadGamAssets)
+  const copyNoteMedia = useProjectStore((s) => s.copyNoteMedia)
   const [tab, setTab] = useState<Tab>('scenes')
+  const [finding, setFinding] = useState<Finding | null>(null)
+  const [copyResult, setCopyResult] = useState<NoteMediaCopy | null>(null)
 
   useEffect(() => {
     if (id) void open(id)
   }, [id, open])
 
+  // Keyed on the ids as a string, so typing narration does not re-ask GAM; only a
+  // newly placed asset does, and the store fetches just the ones it lacks.
+  const gamIds = useMemo(() => (draft ? gamIdsIn(draft) : []), [draft])
+  const gamKey = gamIds.join(',')
+  useEffect(() => {
+    if (gamKey) void loadGamAssets(gamKey.split(','))
+  }, [gamKey, loadGamAssets])
+
   if (loading || (!project && !error)) {
     return <p className="p-6 text-sm text-gray-500">Loading…</p>
   }
@@ -52,6 +72,16 @@ export default function ProjectView() {
   }
 
   const source = draft.source
+  const toFind = unresolvedSearches(draft)
+  const placeholder =
+    finding?.kind === 'resolve'
+      ? toFind.find((p) => p.key === finding.key)?.ref
+      : undefined
+
+  async function onCopy() {
+    setCopyResult(await copyNoteMedia())
+  }
+
   return (
     <div className="mx-auto max-w-4xl space-y-4 p-6">
       <div className="flex items-center gap-3">
@@ -89,11 +119,39 @@ export default function ProjectView() {
       </p>
 
       {project.pending_note_media > 0 && (
-        <p className="rounded border border-amber-200 bg-amber-50 p-3 text-sm text-amber-800 dark:border-amber-800 dark:bg-amber-950 dark:text-amber-200">
-          {project.pending_note_media} picture or sound file
-          {project.pending_note_media === 1 ? ' is' : 's are'} still inside the note this
-          came from. They move into the asset library once GVC is connected to it.
-        </p>
+        <div className="space-y-2 rounded border border-amber-200 bg-amber-50 p-3 text-sm text-amber-800 dark:border-amber-800 dark:bg-amber-950 dark:text-amber-200">
+          <p>
+            {project.pending_note_media} picture or sound file
+            {project.pending_note_media === 1 ? ' is' : 's are'} still inside the note
+            this came from. Copy {project.pending_note_media === 1 ? 'it' : 'them'} into
+            the asset library so this video no longer depends on the note.
+          </p>
+          <button
+            type="button"
+            className="btn btn-secondary"
+            disabled={dirty || saving}
+            title={dirty ? 'Save first: copying writes a new version' : undefined}
+            onClick={() => void onCopy()}
+          >
+            <CloudUpload className="mr-1 inline h-4 w-4" />
+            {dirty ? 'Save first, then copy into GAM' : 'Copy into GAM'}
+          </button>
+        </div>
+      )}
+      {copyResult && (
+        <div role="status" className="text-sm text-gray-700 dark:text-gray-300">
+          {copyResult.copied.length > 0 &&
+            `Copied ${copyResult.copied.length} into GAM. `}
+          {copyResult.failed.length > 0 && (
+            <ul className="mt-1 list-disc pl-5 text-red-700 dark:text-red-300">
+              {copyResult.failed.map((f) => (
+                <li key={f.key}>
+                  <code className="text-xs">{f.key}</code>: {f.message}
+                </li>
+              ))}
+            </ul>
+          )}
+        </div>
       )}
 
       {error && (
@@ -125,7 +183,72 @@ export default function ProjectView() {
         ))}
       </div>
 
-      {tab === 'scenes' && <SceneList spec={draft} onChange={edit} />}
+      {tab === 'scenes' && toFind.length > 0 && (
+        <section aria-label="To find" className="card space-y-2 p-3">
+          <h2 className="text-sm font-medium text-gray-900 dark:text-gray-100">
+            Footage still to find
+          </h2>
+          <ul className="space-y-1">
+            {toFind.map(({ key, ref }) => (
+              <li key={key} className="flex items-center gap-2 text-sm">
+                <span className="flex-1 text-gray-700 dark:text-gray-300">
+                  “{ref.query}”
+                </span>
+                <button
+                  type="button"
+                  className="btn btn-ghost text-xs"
+                  onClick={() => setFinding({ kind: 'resolve', key })}
+                >
+                  <Search className="mr-1 inline h-3 w-3" />
+                  Find
+                </button>
+              </li>
+            ))}
+          </ul>
+        </section>
+      )}
+      {tab === 'scenes' && gamError && (
+        <p className="text-xs text-amber-700 dark:text-amber-300">
+          Could not show pictures from the asset library: {gamError}
+        </p>
+      )}
+      {tab === 'scenes' && (
+        <SceneList
+          spec={draft}
+          onChange={edit}
+          gamAssets={gamAssets}
+          onFindFootage={(index) => setFinding({ kind: 'scene', index })}
+        />
+      )}
+      {finding?.kind === 'scene' && (
+        <FootageSearch
+          title={`Footage for ${draft.segments[finding.index]?.label || 'this scene'}`}
+          purpose="scene"
+          onClose={() => setFinding(null)}
+          onPick={(hit, mode) => {
+            edit(placeHit(draft, finding.index, hit, mode))
+            setFinding(null)
+          }}
+        />
+      )}
+      {finding?.kind === 'resolve' && placeholder && (
+        <FootageSearch
+          title={`Find: ${placeholder.query}`}
+          purpose="resolve"
+          initialQuery={placeholder.query}
+          initialType={
+            placeholder.type === 'image' || placeholder.type === 'audio'
+              ? placeholder.type
+              : 'video'
+          }
+          moment={placeholder.moment}
+          onClose={() => setFinding(null)}
+          onPick={(hit) => {
+            edit(resolveSearch(draft, finding.key, hit))
+            setFinding(null)
+          }}
+        />
+      )}
       {/* Keyed on the draft, so a change made elsewhere (scene list, revert, save)
           replaces the box's contents instead of leaving a stale copy in it. */}
       {tab === 'json' && (