video style added

backend/app/llm/provider.py

@@ -60,6 +60,18 @@ def triage_lm() -> dspy.LM:
     return _build(settings.llm_triage_model, effort="low", temperature=0.2, max_tokens=2000)
 
 
+FOCUS_MAX_TOKENS = 2000  # three titles and two-line descriptions plus GLM's low-effort reasoning
+
+
+@lru_cache
+def focus_lm(retry: bool = False) -> dspy.LM:
+    """The video wizard's focus suggestions: a little material in, three short topics out, so a small cap keeps it
+    quick. retry=True is the second try after an unusable answer: a different temperature, so it is a fresh call and
+    not that answer again from the cache."""
+    return _build(settings.llm_fast_model, effort="low", temperature=0.8 if retry else 0.4,
+                  max_tokens=FOCUS_MAX_TOKENS)
+
+
 def configure_default() -> None:
     dspy.configure(lm=main_lm(), adapter=dspy.JSONAdapter())
 

backend/app/llm/signatures.py

@@ -265,3 +265,20 @@ class TriageMessage(dspy.Signature):
     standalone_question: str = dspy.OutputField(desc="For archive: the question with follow ups resolved")
     depth: Literal["quick", "deep"] = dspy.OutputField()
     reply: str = dspy.OutputField(desc="For non archive kinds: the reply to show. Empty for archive")
+
+
+class FocusTopic(BaseModel):
+    # Not "title"/"description": with those names GLM sometimes wrote the word "Description" as every title.
+    topic: str = Field(description="The angle itself in 3 to 7 words, e.g. \"Why tokens break software margins\". "
+                                   "Never a label such as Title, Topic or Description. No trailing period")
+    summary: str = Field(description="Two short sentences (at most 40 words): what the video would cover and the "
+                                     "angle it takes, using only this material")
+
+
+class VideoFocusTopics(dspy.Signature):
+    """Suggest three distinct angles a short explainer video could focus on, drawn only from this material. Each has a
+    short, specific topic (different for each of the three) and a two sentence summary of what the video covers about
+    that angle. Never use em dashes."""
+
+    items: list[str] = dspy.InputField(desc="Each item: a title (when there is one), then the start of its text")
+    topics: list[FocusTopic] = dspy.OutputField(desc="Exactly 3 focus topics")

backend/app/routers/notebooks.py

@@ -144,6 +144,21 @@ def list_notebooks(ctx: Ctx = Depends(get_ctx)):
     ]
 
 
+# Above /{notebook_id}, so "chats" is not read as a notebook id.
+@router.get("/chats")
+def list_all_chats(ctx: Ctx = Depends(get_ctx)):
+    """Every chat in the workspace that has an answer, newest first (the video wizard's "Made from" menu)."""
+    answered = select(Message.chat_id).where(Message.role == "assistant")
+    rows = ctx.db.execute(
+        select(Chat, Notebook.title).join(Notebook, Notebook.id == Chat.notebook_id)
+        .where(Chat.workspace_id == ctx.workspace.id, Chat.id.in_(answered))
+        .order_by(Chat.updated_at.desc())
+    ).all()
+    return [{"id": str(c.id), "title": c.title, "notebook_id": str(c.notebook_id), "notebook_title": nb_title,
+             "updated_at": c.updated_at.isoformat() if c.updated_at else None}
+            for c, nb_title in rows]
+
+
 @router.get("/{notebook_id}")
 def get_notebook(notebook_id: uuid.UUID, ctx: Ctx = Depends(get_ctx)):
     nb = _get(ctx, notebook_id)

backend/app/routers/videos.py

@@ -26,7 +26,10 @@ from sqlalchemy import select
 
 from app.auth import Ctx, get_ctx
 from app.config import settings
-from app.models import Artifact, B2VVideo, Document, Notebook, Upload
+from app.llm import run
+from app.llm.provider import focus_lm
+from app.llm.signatures import VideoFocusTopics
+from app.models import Artifact, B2VVideo, Chat, Document, Message, Notebook, Upload
 from app.routers.sources import is_locked
 from app.services import b2v_access, video_limits, video_quota
 from app.services import blog2video as b2v
@@ -43,7 +46,14 @@ MIN_CONTENT = 50
 MAX_CONTENT = 100_000
 MAX_LINKS = 10
 MAX_POSTS = 200  # a notebook's posts, combined into one video (the ingest SCAN_CAP)
+MAX_CHATS = 5  # notebook chats, combined into one video (the wizard's cap, as for posts)
 MAX_FILES = 5
+# Sent ahead of chat transcripts: blog2video only takes content, so this tells its script writer what it is reading.
+CHAT_CONTEXT = ("The text below is one or more conversations between a user and an AI assistant. Make the video about "
+                "the subject of these conversations: the questions the user asked and the answers and conclusions "
+                "reached. Present it "
+                "as a clear explainer for a general audience, in your own narration. Do not read it out as a dialogue, "
+                "and do not mention the chat, the user or the AI assistant.")
 FILE_MAX_BYTES = 5 * 1024 * 1024
 FILE_TYPES = {".pdf", ".docx", ".pptx", ".md", ".txt", ".vtt"}
 LOGO_MAX_BYTES = 2 * 1024 * 1024
@@ -163,19 +173,38 @@ class VideoOptions(BaseModel):
         return data
 
 
+class FocusIn(BaseModel):
+    # A source from the workspace: exactly one of these. document_ids are a notebook's ticked posts, combined into one
+    # video; chat_ids are notebook chats, sent as their transcripts (combined too).
+    document_id: uuid.UUID | None = None
+    document_ids: list[uuid.UUID] | None = Field(None, min_length=1, max_length=MAX_POSTS)
+    chat_ids: list[uuid.UUID] | None = Field(None, min_length=1, max_length=MAX_CHATS)
+    notebook_id: uuid.UUID | None = None  # names a combined video after its notebook
+
+    @model_validator(mode="after")
+    def one_source(self):
+        if sum(x is not None for x in (self.document_id, self.document_ids, self.chat_ids)) != 1:
+            raise ValueError("Pick one source: a notebook, a post or chats")
+        return self
+
+
 class VideoCreateIn(VideoOptions):
-    # Source: exactly one of these. document_ids are a notebook's ticked posts, combined into one video.
+    # Source: exactly one of these (the first three as in FocusIn).
     document_id: uuid.UUID | None = None
     document_ids: list[uuid.UUID] | None = Field(None, min_length=1, max_length=MAX_POSTS)
+    chat_ids: list[uuid.UUID] | None = Field(None, min_length=1, max_length=MAX_CHATS)
     url: str | None = Field(None, max_length=2000)
     content: str | None = Field(None, max_length=MAX_CONTENT)
     title: str | None = Field(None, max_length=300)
     notebook_id: uuid.UUID | None = None  # names a combined video after its notebook
+    # One of the suggested focus topics (/focus-topics): the video is mainly about it. None = the material as a whole.
+    focus: str | None = Field(None, max_length=200)
+    focus_detail: str | None = Field(None, max_length=400)  # the topic's description: what the video should cover
 
     @model_validator(mode="after")
     def one_source(self):
-        if sum(x is not None for x in (self.document_id, self.document_ids, self.url, self.content)) != 1:
-            raise ValueError("Pick one source: a notebook, a post, a link or pasted text")
+        if sum(x is not None for x in (self.document_id, self.document_ids, self.url, self.content, self.chat_ids)) != 1:
+            raise ValueError("Pick one source: a notebook, a post, chats, a link or pasted text")
         if self.document_ids and len(self.document_ids) == 1:
             self.document_id, self.document_ids = self.document_ids[0], None
         return self
@@ -190,7 +219,7 @@ def _not_indexed(count: int) -> HTTPException:
                               "Untick them or upgrade to index your whole archive.")
 
 
-def _combined(ctx: Ctx, body: VideoCreateIn) -> tuple[str, str]:
+def _combined(ctx: Ctx, body: FocusIn | VideoCreateIn, limit: int) -> tuple[str, str]:
     """Several posts as one text, oldest first, each given an equal share so none is cut off entirely."""
     ids = set(body.document_ids or [])
     docs = list(ctx.db.scalars(select(Document).where(Document.id.in_(ids),
@@ -201,40 +230,116 @@ def _combined(ctx: Ctx, body: VideoCreateIn) -> tuple[str, str]:
     if locked:
         raise _not_indexed(locked)
     docs.sort(key=lambda d: (d.published_at is None, d.published_at.timestamp() if d.published_at else 0))
-    share = MAX_CONTENT // len(docs)
+    share = limit // len(docs)
     text = "\n\n".join(f"# {d.title}\n\n{(d.clean_text or '').strip()}"[:share] for d in docs)
     nb = ctx.db.scalar(select(Notebook).where(Notebook.id == body.notebook_id,
                                               Notebook.workspace_id == ctx.workspace.id)) if body.notebook_id else None
     return (nb.title if nb else f"{docs[0].title} + {len(docs) - 1} more"), text
 
 
+def _cite_free(text: str) -> str:
+    """Citation markers ([1], [2]) point at the notebook's posts, which blog2video never sees."""
+    return re.sub(r"\s*\[\d+\]", "", text).strip()
+
+
+def _load_chats(ctx: Ctx, ids: list[uuid.UUID]) -> list[tuple[Chat, list[Message]]]:
+    """This workspace's chats, oldest first, each with its messages in order. 404 if any is not ours."""
+    chats = list(ctx.db.scalars(select(Chat).where(Chat.id.in_(set(ids)), Chat.workspace_id == ctx.workspace.id)
+                                .order_by(Chat.created_at)))
+    if len(chats) != len(set(ids)):
+        raise HTTPException(404, "Chat not found")
+    msgs = ctx.db.scalars(select(Message).where(Message.chat_id.in_([c.id for c in chats]))
+                          .order_by(Message.created_at)).all()
+    return [(c, [m for m in msgs if m.chat_id == c.id]) for c in chats]
+
+
+def _chat_title(chat: Chat, msgs: list[Message]) -> str:
+    return chat.title or next((m.content for m in msgs if m.role == "user"), "")[:80] or "Chat"
+
+
+def _chats(ctx: Ctx, ids: list[uuid.UUID], limit: int) -> tuple[str, str]:
+    """Chats' turns as one text, each chat given an equal share. Over its share, a chat's oldest turns go so its
+    conclusion stays. Several chats are headed by their titles."""
+    loaded = _load_chats(ctx, ids)
+    share = limit // len(loaded)
+    parts = []
+    for chat, msgs in loaded:
+        if not any(m.role == "assistant" for m in msgs):
+            raise HTTPException(400, f'"{_chat_title(chat, msgs)}" has no answers yet')
+        turns = [f"{'User' if m.role == 'user' else 'Assistant'}: {t}" for m in msgs if (t := _cite_free(m.content))]
+        head = f"# {_chat_title(chat, msgs)}\n\n" if len(loaded) > 1 else ""
+        size = len(head) + sum(len(t) + 2 for t in turns)
+        while len(turns) > 1 and size > share:
+            size -= len(turns.pop(0)) + 2
+        parts.append(head + "\n\n".join(turns))
+    first = _chat_title(*loaded[0])
+    return (first if len(loaded) == 1 else f"{first} + {len(loaded) - 1} more"), "\n\n".join(parts)
+
+
+def _doc(ctx: Ctx, document_id: uuid.UUID) -> Document:
+    doc = ctx.db.scalar(select(Document).where(Document.id == document_id, Document.workspace_id == ctx.workspace.id))
+    if not doc:
+        raise HTTPException(404, "Post not found")
+    if is_locked(doc):
+        raise _not_indexed(1)
+    return doc
+
+
+def _source_text(ctx: Ctx, body: FocusIn | VideoCreateIn, limit: int = MAX_CONTENT) -> tuple[str, str]:
+    """A workspace source (posts, a chat, one post) or pasted text as a title and one text."""
+    if body.document_ids:
+        return _combined(ctx, body, limit)
+    if body.chat_ids:
+        return _chats(ctx, body.chat_ids, limit)
+    if body.document_id:
+        doc = _doc(ctx, body.document_id)
+        return doc.title, (doc.clean_text or "")[:limit]
+    return getattr(body, "title", None) or "", getattr(body, "content", None) or ""
+
+
+def _instructions(body: VideoCreateIn) -> str:
+    """What blog2video's script writer is told ahead of the material: what a chat is, and the focus picked (worded
+    for the house style's depth). Empty when neither applies."""
+    parts = [CHAT_CONTEXT] if body.chat_ids else []
+    if focus := (body.focus or "").strip():
+        detail = re.sub(r"\s+", " ", body.focus_detail or "").strip().rstrip(".")
+        cover = f" What to cover: {detail}." if detail else ""
+        length = b2v_access.house_length(body.video_style)
+        if length == "short":
+            parts.append(f'The main focus of this video is one topic only: "{focus}".{cover} Make it an overview of '
+                         "that topic: cover just the parts of the material about it, briefly, and leave the rest out.")
+        elif length == "medium":
+            parts.append(f'The main focus of this video is one topic only: "{focus}".{cover} Make it a deep dive into '
+                         "that topic: explore it in depth using the parts of the material about it, and leave the rest "
+                         "out.")
+        else:
+            parts.append(f'The main focus of this video is: "{focus}".{cover} Leave out parts of the material not '
+                         "about it.")
+    return " ".join(parts)
+
+
 def _source(ctx: Ctx, body: VideoCreateIn) -> tuple[dict, str]:
     """The blog2video source fields and a title for our artifact."""
-    if body.document_ids:
-        title, text = _combined(ctx, body)
-    elif body.document_id:
-        doc = ctx.db.scalar(select(Document).where(Document.id == body.document_id,
-                                                   Document.workspace_id == ctx.workspace.id))
-        if not doc:
-            raise HTTPException(404, "Post not found")
-        if is_locked(doc):
-            raise _not_indexed(1)
-        if re.match(r"https?://", doc.url or ""):
-            return {"url": doc.url, "title": doc.title[:255]}, doc.title
-        # Uploaded files have no public link (upload://name): send their text instead.
-        title, text = doc.title, doc.clean_text or ""
-    elif body.url:
+    if body.url:
         if not re.match(r"https?://", body.url):
             raise HTTPException(400, "Enter a link that starts with http:// or https://")
         return {"url": body.url}, body.title or body.url
-    else:
-        title, text = body.title or "", body.content or ""
-        if not title.strip():
-            raise HTTPException(400, "Give the pasted text a title")
+    if body.document_id and not body.focus:
+        doc = _doc(ctx, body.document_id)
+        if re.match(r"https?://", doc.url or ""):
+            return {"url": doc.url, "title": doc.title[:255]}, doc.title
+        # Uploaded files have no public link (upload://name): their text is sent instead (below). So is any post
+        # given a focus, which goes in front of the text.
+    with upstream():  # the focus wording needs the house styles
+        head = _instructions(body)
+    title, text = _source_text(ctx, body, MAX_CONTENT - len(head) - 10)
+    if body.content is not None and not title.strip():
+        raise HTTPException(400, "Give the pasted text a title")
     text = text.strip()
     if len(text) < MIN_CONTENT:
         raise HTTPException(400, f"Add at least {MIN_CONTENT} characters of text")
-    return {"content": text[:MAX_CONTENT], "title": title[:255]}, title
+    content = f"{head}\n\n---\n\n{text}" if head else text
+    return {"content": content[:MAX_CONTENT], "title": title[:255]}, title
 
 
 def _metadata(ctx: Ctx, row: B2VVideo, **extra) -> dict:
@@ -245,6 +350,9 @@ def _metadata(ctx: Ctx, row: B2VVideo, **extra) -> dict:
 def _check(ctx: Ctx, options: VideoOptions) -> tuple[dict, Plan]:
     payload = options.payload()
     with upstream():  # checking a template or voice may need blog2video's catalog
+        # A house style decides the length, whatever the client sent (before the checks, which gate some lengths).
+        if length := b2v_access.house_length(payload.get("video_style")):
+            payload["video_length"] = length
         plan = b2v_access.check_refs(ctx, payload)
     accent = (ctx.workspace.brand_json or {}).get("accent")
     if plan.brand_kit and accent and "accent_color" not in payload:
@@ -323,7 +431,8 @@ def create_video(body: VideoCreateIn, ctx: Ctx = Depends(get_ctx), _: None = Dep
                                                           document_id=str(body.document_id) if body.document_id
                                                           else None,
                                                           document_ids=[str(d) for d in body.document_ids or []]
-                                                          or None)},
+                                                          or None,
+                                                          chat_ids=[str(c) for c in body.chat_ids or []] or None)},
                                    row.idempotency_key)
         return int(created["video_id"])
 
@@ -332,6 +441,74 @@ def create_video(body: VideoCreateIn, ctx: Ctx = Depends(get_ctx), _: None = Dep
     return serialize_artifact(a)
 
 
+def _excerpt(text: str | None, limit: int) -> str:
+    """The start of a text, cut on a word boundary."""
+    text = re.sub(r"\s+", " ", text or "").strip()
+    if len(text) <= limit:
+        return text
+    return text[:limit].rsplit(" ", 1)[0] + "..."
+
+
+def _focus_material(ctx: Ctx, body: FocusIn) -> list[str]:
+    """What the focus suggestions read: each post's title and the start of its text, or a chat's title and first
+    exchange (per chat). A little text, so a vague title or an untitled chat still says what it is about. Checked like a create
+    (another workspace's source 404s, locked posts 400)."""
+    if body.chat_ids:
+        loaded = _load_chats(ctx, body.chat_ids)
+        answer_len = 600 if len(loaded) == 1 else 300
+        items = []
+        for chat, msgs in loaded:
+            question = next((m.content for m in msgs if m.role == "user"), "")
+            answer = next((m.content for m in msgs if m.role == "assistant"), "")
+            parts = [chat.title or "", _excerpt(question, 300), _excerpt(_cite_free(answer), answer_len)]
+            if item := "\n".join(p for p in parts if p):
+                items.append(item)
+        return items
+    ids = set(body.document_ids or [body.document_id])
+    docs = list(ctx.db.scalars(select(Document).where(Document.id.in_(ids),
+                                                      Document.workspace_id == ctx.workspace.id)))
+    if len(docs) != len(ids):
+        raise HTTPException(404, "Post not found")
+    if locked := sum(is_locked(d) for d in docs):
+        raise _not_indexed(locked)
+    each = 800 if len(docs) == 1 else 400
+    items = ["\n".join(p for p in (d.title or "", _excerpt(d.clean_text, each)) if p) for d in docs[:5]]
+    return [i for i in items if i]
+
+
+@router.post("/focus-topics")
+def focus_topics(body: FocusIn, ctx: Ctx = Depends(get_ctx)):
+    """Three topics a video from this source could focus on, suggested by the AI from each item's title and the start
+    of its text. Asked for while the wizard is still on step 1, shown on step 2."""
+    items = _focus_material(ctx, body)
+    if not items:
+        return {"topics": []}
+    topics: list[dict] = []
+    # One retry when the answer has fewer than 3 usable topics (a placeholder for every title, repeats).
+    for retry in (False, True):
+        out = run.predict(VideoFocusTopics, db=ctx.db, workspace_id=ctx.workspace.id, lm=focus_lm(retry), items=items)
+        _add_topics(topics, out.get("topics"))
+        if len(topics) >= 3:
+            break
+    return {"topics": topics[:3]}
+
+
+FOCUS_PLACEHOLDERS = {"title", "topic", "description", "summary", "name", "angle", "focus"}
+
+
+def _add_topics(topics: list[dict], raw) -> None:
+    """Add the model's usable topics to `topics` (as {title, description}): a real title, not seen before."""
+    for t in raw or []:
+        if not isinstance(t, dict):
+            continue
+        title = str(t.get("topic") or t.get("title") or "").strip().strip(".").strip()[:120]
+        description = re.sub(r"\s+", " ", str(t.get("summary") or t.get("description") or "")).strip()[:300]
+        if not title or title.lower() in FOCUS_PLACEHOLDERS:
+            continue
+        if title.lower() not in {x["title"].lower() for x in topics}:
+            topics.append({"title": title, "description": description})
+
+
 @router.post("/batch", status_code=201)
 def create_videos(body: VideoBatchIn, ctx: Ctx = Depends(get_ctx), _: None = Depends(b2v_ready)):
     """Multi-link: one video per link, each charged and keyed on its own. Background music is single-video only."""

backend/app/services/b2v_access.py

@@ -18,6 +18,16 @@ from app.services.plans import Plan, effective_plan
 from app.services.video_limits import require_premium
 
 BUILTIN_STYLES = {"auto", "explainer", "storytelling", "promotional"}
+# Custom styles made on our blog2video account itself, offered to every workspace in place of the others when they
+# exist (matched by name, the first is the default). Each sets the video length; the wizard has no length picker and
+# only says roughly how long the video comes out.
+HOUSE_STYLES = [  # (name on blog2video, video length, what the wizard says it is: about three lines)
+    ("Overview", "short", "A clear, neutral rundown of the key points. It gets straight to the main idea, one point per "
+                          "scene in plain words. Best for quick social posts and teasers. Usually under a minute long."),
+    ("Deep dive", "medium", "Sets up the context first, then works through the reasoning, examples and trade-offs, each "
+                            "scene building on the last. Best for YouTube, tutorials and full explainers. Usually 1 to "
+                            "2 minutes long."),
+]
 PREMIUM_LENGTHS = {"detailed", "more_detailed", "mdetailed"}
 
 
@@ -116,10 +126,31 @@ def check_template(ctx: Ctx, template: str, plan: Plan) -> None:
         raise not_found("Template not found")
 
 
+def house_styles() -> list[dict]:
+    """HOUSE_STYLES found among the account's custom styles, in HOUSE_STYLES order, with the length each sets."""
+    by_name = {str(s.get("name") or "").strip().lower(): s for s in (b2v.video_styles() or {}).get("styles") or []
+               if s.get("kind") == "custom" and s.get("custom_id") is not None}
+    out = []
+    for name, length, blurb in HOUSE_STYLES:
+        if s := by_name.get(name.lower()):
+            out.append({"id": f"custom:{s['custom_id']}", "custom_id": s["custom_id"], "name": s.get("name"),
+                        "description": blurb, "kind": "house", "length": length})
+    return out
+
+
+def house_length(style: str | None) -> str | None:
+    """The video length a house style sets; None for any other style."""
+    if not style or not style.startswith("custom:"):
+        return None
+    return next((s["length"] for s in house_styles() if s["id"] == style), None)
+
+
 def check_style(ctx: Ctx, style: str) -> None:
     if style in BUILTIN_STYLES:
         return
     if (sid := _custom_id(style, "custom:")) is not None:
+        if any(s["custom_id"] == sid for s in house_styles()):
+            return
         owned_style(ctx, sid)
         return
     raise not_found("Video style not found")  # includes your_style, which learns from every workspace's edits
@@ -159,7 +190,10 @@ def check_refs(ctx: Ctx, body: dict, plan: Plan | None = None) -> Plan:
 
 
 def visible_styles(ctx: Ctx) -> list[dict]:
-    """Built-in styles (read-only) and this workspace's custom styles. Never "Your Style", never others'."""
+    """The house styles when the account has them; otherwise built-in styles (read-only) and this workspace's custom
+    styles. Never "Your Style", never others'."""
+    if house := house_styles():
+        return [{k: v for k, v in s.items() if k != "length"} for s in house]
     mine = set(ctx.db.scalars(select(B2VStyle.b2v_style_id).where(B2VStyle.workspace_id == ctx.workspace.id)))
     out = []
     for s in (b2v.video_styles() or {}).get("styles") or []:

backend/tests/test_videos.py

@@ -19,7 +19,9 @@ from app.models import (
     B2VStyle,
     B2VTemplate,
     B2VVideo,
+    Chat,
     Document,
+    Message,
     Notebook,
     Subscription,
     UsageCounter,
@@ -296,6 +298,78 @@ def test_locked_posts_are_refused_before_charging(client, b2v, owner, db_session
     assert not creates(b2v) and used(db_session, ws) == 0
 
 
+def add_chat(db, ws, turns: list[tuple[str, str]], title: str | None = "Pricing chat") -> Chat:
+    nb = Notebook(workspace_id=ws.id, title="Pricing series")
+    db.add(nb)
+    db.flush()
+    chat = Chat(workspace_id=ws.id, notebook_id=nb.id, title=title)
+    db.add(chat)
+    db.flush()
+    for i, (role, text) in enumerate(turns):
+        db.add(Message(chat_id=chat.id, role=role, content=text,
+                       created_at=datetime(2026, 1, 1, tzinfo=UTC) + timedelta(minutes=i)))
+    db.commit()
+    return chat
+
+
+def test_chat_is_sent_as_its_transcript_after_the_context_prompt(client, b2v, owner, db_session):
+    from app.routers.videos import CHAT_CONTEXT
+    headers, ws = owner
+    chat = add_chat(db_session, ws, [("user", "How often should I raise prices?"),
+                                     ("assistant", "Once a year, and tell readers why [1]. Grandfather the early ones [2].")])
+    r = client.post("/api/videos", json={"chat_ids": [str(chat.id)]}, headers=headers)
+    assert r.status_code == 201 and r.json()["content"]["title"] == "Pricing chat"
+    sent = creates(b2v)[-1]["json"]
+    assert sent["title"] == "Pricing chat" and "chat_ids" not in sent and "url" not in sent
+    assert sent["content"].startswith(CHAT_CONTEXT)
+    assert "User: How often should I raise prices?" in sent["content"]
+    assert "Assistant: Once a year, and tell readers why. Grandfather the early ones." in sent["content"]
+    assert used(db_session, ws) == 1
+
+
+def test_several_chats_make_one_video(client, b2v, owner, other, db_session):
+    from app.routers.videos import CHAT_CONTEXT
+    headers, ws = owner
+    a = add_chat(db_session, ws, [("user", "How often should I raise prices?"),
+                                  ("assistant", "Once a year, and tell readers why it is happening.")])
+    b = add_chat(db_session, ws, [("user", "Should early readers keep their price?"),
+                                  ("assistant", "Yes, grandfather them: they took the risk first.")], title="Early readers")
+    r = client.post("/api/videos", json={"chat_ids": [str(a.id), str(b.id)]}, headers=headers)
+    assert r.status_code == 201 and r.json()["content"]["title"] == "Pricing chat + 1 more"
+    content = creates(b2v)[-1]["json"]["content"]
+    assert content.startswith(CHAT_CONTEXT)
+    assert content.index("# Pricing chat") < content.index("User: How often") < content.index("# Early readers")
+    assert "Assistant: Yes, grandfather them" in content
+    # Six is over the cap; one chat that is not ours makes it 404.
+    six = [str(add_chat(db_session, ws, [("user", "Q?"), ("assistant", "A long enough answer.")]).id) for _ in range(6)]
+    assert client.post("/api/videos", json={"chat_ids": six}, headers=headers).status_code == 422
+    theirs = add_chat(db_session, other[1], [("user", "Q?"), ("assistant", "A.")])
+    r = client.post("/api/videos", json={"chat_ids": [str(a.id), str(theirs.id)]}, headers=headers)
+    assert r.status_code == 404 and len(creates(b2v)) == 1
+
+
+def test_chats_list_across_notebooks_only_answered_ones(client, owner, other, db_session):
+    headers, ws = owner
+    answered = add_chat(db_session, ws, [("user", "Q?"), ("assistant", "A.")])
+    add_chat(db_session, ws, [("user", "Unanswered?")])
+    add_chat(db_session, other[1], [("user", "Q?"), ("assistant", "A.")])
+    r = client.get("/api/notebooks/chats", headers=headers)
+    assert r.status_code == 200
+    assert [(c["id"], c["notebook_title"]) for c in r.json()] == [(str(answered.id), "Pricing series")]
+
+
+def test_chat_source_is_checked(client, b2v, owner, other, db_session):
+    headers, ws = owner
+    theirs = add_chat(db_session, other[1], [("user", "Q?"), ("assistant", "A long enough answer, really.")])
+    assert client.post("/api/videos", json={"chat_ids": [str(theirs.id)]}, headers=headers).status_code == 404
+    empty = add_chat(db_session, ws, [("user", "Anyone there?")])
+    assert client.post("/api/videos", json={"chat_ids": [str(empty.id)]}, headers=headers).status_code == 400
+    doc = add_doc(db_session, ws, "https://ada.example.com/p/a")
+    r = client.post("/api/videos", json={"chat_ids": [str(empty.id)], "document_id": str(doc.id)}, headers=headers)
+    assert r.status_code == 422
+    assert not creates(b2v) and used(db_session, ws) == 0
+
+
 def test_another_workspaces_post_is_404(client, b2v, owner, other, db_session):
     headers, ws = owner
     mine = add_doc(db_session, ws, "https://ada.example.com/p/a", "Enough text to make a video from, really. " * 3)
@@ -464,6 +538,158 @@ def test_catalog_shows_only_this_workspace(client, b2v, owner, theirs, db_sessio
     assert [t["id"] for t in cat["my_templates"]] == ["custom_58"]
 
 
+@pytest.fixture()
+def house(monkeypatch):
+    """Our account has the two house styles (made on blog2video itself, not by any workspace)."""
+    styles = DEFAULTS["GET /api/video-styles"]["styles"] + [
+        {"id": "custom:21", "custom_id": 21, "name": "Deep dive", "kind": "custom", "guidance": "Context first."},
+        {"id": "custom:20", "custom_id": 20, "name": "Overview", "kind": "custom", "guidance": "Neutral."}]
+    monkeypatch.setitem(DEFAULTS, "GET /api/video-styles", {"styles": styles})
+
+
+def test_catalog_offers_only_the_house_styles(client, b2v, owner, house, db_session):
+    headers, ws = owner
+    db_session.add(B2VStyle(b2v_style_id=7, workspace_id=ws.id, name="Mine"))
+    db_session.commit()
+    styles = client.get("/api/videos/catalog", headers=headers).json()["video_styles"]
+    assert [(s["id"], s["name"], s["kind"]) for s in styles] == [("custom:20", "Overview", "house"),
+                                                                 ("custom:21", "Deep dive", "house")]
+    assert all(s["description"] and "length" not in s for s in styles)
+
+
+@pytest.mark.parametrize("style,length", [("custom:20", "short"), ("custom:21", "medium")])
+def test_house_style_sets_the_length(client, b2v, owner, house, free_plan, style, length):
+    make_video(client, owner[0], video_style=style, video_length="detailed")
+    sent = creates(b2v)[-1]["json"]
+    assert sent["video_style"] == style and sent["video_length"] == length
+
+
+def test_other_account_styles_stay_refused(client, b2v, owner, house):
+    r = client.post("/api/videos", json={"url": "https://a.test/x", "video_style": "custom:9"}, headers=owner[0])
+    assert r.status_code == 404 and not creates(b2v)
+
+
+@pytest.fixture()
+def suggest(monkeypatch):
+    """The AI's focus suggestions, canned: records what it was given."""
+    from app.llm import run
+    seen: list[dict] = []
+
+    def predict(signature, *, db, workspace_id, job=None, lm=None, **inputs):
+        seen.append({"signature": signature.__name__, **inputs})
+        topic = lambda title, desc="": {"title": title, "description": desc}  # noqa: E731
+        return {"topics": [topic("Why prices go up.", "Why raises happen.  Once a year,\n with notice."),
+                           topic("why prices go up"), topic("Grandfathering early readers", "Keep early prices."),
+                           topic("Annual raises", "One raise a year."), topic("A fourth one")]}
+
+    monkeypatch.setattr(run, "predict", predict)
+    return seen
+
+
+def test_focus_topics_for_posts_a_chat_and_one_post(client, owner, db_session, suggest):
+    headers, ws = owner
+    a = add_doc(db_session, ws, "https://ada.example.com/p/a", "Raise prices once a year, and say why. " * 3)
+    b = add_doc(db_session, ws, "https://ada.example.com/p/b", "Start cheaper than you think you should. " * 3)
+    chat = add_chat(db_session, ws, [("user", "How often should I raise prices?"),
+                                     ("assistant", "Once a year, and tell readers why it is happening [1].")])
+    for body in ({"document_ids": [str(a.id), str(b.id)]}, {"chat_ids": [str(chat.id)]}, {"document_id": str(a.id)}):
+        r = client.post("/api/videos/focus-topics", json=body, headers=headers)
+        assert r.status_code == 200, r.text
+        assert r.json()["topics"] == [
+            {"title": "Why prices go up", "description": "Why raises happen. Once a year, with notice."},
+            {"title": "Grandfathering early readers", "description": "Keep early prices."},
+            {"title": "Annual raises", "description": "One raise a year."}]
+    assert [s["signature"] for s in suggest] == ["VideoFocusTopics"] * 3
+    # Each item is a title and the start of its text: a little, never the whole post or transcript.
+    posts, chat_item, one = (s["items"] for s in suggest)
+    assert len(posts) == 2 and all(p.startswith("On Pricing\n") for p in posts)
+    assert any("Raise prices once a year" in p for p in posts) and any("Start cheaper" in p for p in posts)
+    assert chat_item == ["Pricing chat\nHow often should I raise prices?\nOnce a year, and tell readers why it is "
+                         "happening."]
+    assert one[0].startswith("On Pricing\nRaise prices")
+
+
+def test_focus_material_is_short_and_untitled_chats_still_get_topics(client, owner, db_session, suggest):
+    headers, ws = owner
+    long = add_doc(db_session, ws, "https://ada.example.com/p/a", "Pricing is a promise to your readers. " * 200)
+    other = add_doc(db_session, ws, "https://ada.example.com/p/b", "Grandfather the people who came early. " * 200)
+    untitled = add_chat(db_session, ws, [("user", "Should I raise prices?"), ("assistant", "Yes, once a year [1].")],
+                        title=None)
+    r = client.post("/api/videos/focus-topics", json={"document_ids": [str(long.id), str(other.id)]}, headers=headers)
+    assert len(r.json()["topics"]) == 3
+    assert all(len(i) < 450 and i.endswith("...") for i in suggest[-1]["items"])  # 400 characters of text per post
+    titled = add_chat(db_session, ws, [("user", "What about early readers?"), ("assistant", "Keep their price.")])
+    r = client.post("/api/videos/focus-topics", json={"chat_ids": [str(untitled.id), str(titled.id)]}, headers=headers)
+    assert len(r.json()["topics"]) == 3 and len(suggest[-1]["items"]) == 2
+    r = client.post("/api/videos/focus-topics", json={"chat_ids": [str(untitled.id)]}, headers=headers)
+    assert len(r.json()["topics"]) == 3
+    assert suggest[-1]["items"] == ["Should I raise prices?\nYes, once a year."]
+
+
+def test_unusable_topics_get_one_fresh_retry(client, owner, db_session, monkeypatch):
+    from app.llm import run
+    headers, ws = owner
+    doc = add_doc(db_session, ws, "https://ada.example.com/p/a", "Raise prices once a year, and say why. " * 3)
+    lms = []
+    answers = [  # what GLM did: the word "Description" as every title, then a proper answer
+        {"topics": [{"topic": "Description", "summary": f"Angle {i}."} for i in range(3)]},
+        {"topics": [{"topic": "Annual raises", "summary": "One raise a year."},
+                    {"topic": "Grandfathering early readers", "summary": "Keep early prices."},
+                    {"topic": "Saying why prices go up", "summary": "Explain the raise."}]},
+    ]
+
+    def predict(signature, *, db, workspace_id, job=None, lm=None, **inputs):
+        lms.append(lm)
+        return answers[len(lms) - 1]
+
+    monkeypatch.setattr(run, "predict", predict)
+    r = client.post("/api/videos/focus-topics", json={"document_id": str(doc.id)}, headers=headers)
+    assert [t["title"] for t in r.json()["topics"]] == ["Annual raises", "Grandfathering early readers",
+                                                        "Saying why prices go up"]
+    assert len(lms) == 2 and lms[0] is not lms[1]  # the retry is a fresh call, not the cached bad answer
+
+
+def test_focus_topics_check_the_source(client, owner, other, db_session, suggest):
+    headers, ws = owner
+    theirs = add_chat(db_session, other[1], [("user", "Q?"), ("assistant", "A long enough answer, really.")])
+    assert client.post("/api/videos/focus-topics", json={"chat_ids": [str(theirs.id)]}, headers=headers).status_code == 404
+    locked = add_doc(db_session, ws, "https://ada.example.com/p/b")
+    locked.path, locked.metadata_json = None, {"locked": True}
+    db_session.commit()
+    r = client.post("/api/videos/focus-topics", json={"document_id": str(locked.id)}, headers=headers)
+    assert r.status_code == 400 and not suggest
+
+
+@pytest.mark.parametrize("style,length,words", [("custom:20", "short", "overview of that topic"),
+                                                ("custom:21", "medium", "deep dive into that topic")])
+def test_focus_goes_ahead_of_the_material_worded_for_the_style(client, b2v, owner, house, db_session,
+                                                               style, length, words):
+    headers, ws = owner
+    doc = add_doc(db_session, ws, "https://ada.example.com/p/a", "Raise prices once a year, and say why. " * 3)
+    make_video(client, headers, url=None, document_id=str(doc.id), video_style=style, focus="Annual raises",
+               focus_detail="One raise a year, announced early.  Why readers accept it.")
+    sent = creates(b2v)[-1]["json"]
+    assert "url" not in sent and sent["video_length"] == length  # a focus needs the text, not the link
+    head, material = sent["content"].split("\n\n---\n\n", 1)
+    assert head.index('"Annual raises"') < head.index("What to cover: One raise a year, announced early. Why "
+                                                      "readers accept it.") < head.index(words)
+    assert material.startswith("Raise prices")
+    # The topic alone (no description) still works, without the "What to cover" part.
+    make_video(client, headers, url=None, document_id=str(doc.id), video_style=style, focus="Annual raises")
+    head = creates(b2v)[-1]["json"]["content"].split("\n\n---\n\n", 1)[0]
+    assert '"Annual raises"' in head and "What to cover" not in head
+
+
+def test_chat_with_a_focus_keeps_the_chat_context_first(client, b2v, owner, house, db_session):
+    from app.routers.videos import CHAT_CONTEXT
+    headers, ws = owner
+    chat = add_chat(db_session, ws, [("user", "How often should I raise prices?"),
+                                     ("assistant", "Once a year, and tell readers why it is happening.")])
+    make_video(client, headers, url=None, chat_ids=[str(chat.id)], video_style="custom:20", focus="Annual raises")
+    content = creates(b2v)[-1]["json"]["content"]
+    assert content.startswith(CHAT_CONTEXT) and content.index('"Annual raises"') < content.index("User:")
+
+
 # Premium (★) and per-workspace counters
 
 

frontend/src/api/endpoints.ts

@@ -12,6 +12,7 @@ import type {
   LibraryVoice,
   Notebook,
   NotebookSummary,
+  WorkspaceChat,
   Page,
   Platform,
   Quota,
@@ -38,6 +39,8 @@ import type {
   VideoCatalog,
   VideoConfig,
   VideoCreateBody,
+  VideoFocusSource,
+  VideoFocusTopic,
   VideoCustomVoice,
   VideoDesignedVoice,
   VideoJobState,
@@ -89,6 +92,8 @@ export const notebooksApi = {
   removeDoc: (id: string, docId: string) => del(`/api/notebooks/${id}/documents/${docId}`),
   artifacts: (id: string) => api<Artifact[]>(`/api/notebooks/${id}/artifacts`),
   chats: (id: string) => api<ChatSummary[]>(`/api/notebooks/${id}/chats`),
+  /** Every answered chat in the workspace, newest first. */
+  allChats: () => api<WorkspaceChat[]>("/api/notebooks/chats"),
   messages: (chatId: string) => api<ChatMessage[]>(`/api/notebooks/chats/${chatId}/messages`),
   removeChat: (chatId: string) => del(`/api/notebooks/chats/${chatId}`),
 };
@@ -241,6 +246,8 @@ export const videosApi = {
   catalog: () => api<VideoCatalog>("/api/videos/catalog"),
   list: () => api<VideoListItem[]>("/api/videos"),
   create: (body: VideoCreateBody) => post<Artifact>("/api/videos", body),
+  /** Three topics the AI suggests a video from this source could focus on. */
+  focusTopics: (body: VideoFocusSource) => post<{ topics: VideoFocusTopic[] }>("/api/videos/focus-topics", body),
   /** Multi-link: one video per link. Items with `error` say where it stopped (usually the allowance ran out). */
   createBatch: (urls: string[], options: VideoOptions) =>
     post<(Artifact | { error: string; url: string })[]>("/api/videos/batch", { ...options, urls }),

frontend/src/api/types.ts

@@ -82,6 +82,8 @@ export type Citation = {
 };
 
 export type ChatSummary = { id: string; title: string | null; updated_at: string | null };
+/** A chat listed across the whole workspace, with the notebook it belongs to. */
+export type WorkspaceChat = ChatSummary & { notebook_id: string; notebook_title: string };
 export type ChatMessage = { id: string; role: "user" | "assistant"; text: string; citations: Citation[] };
 
 export type ArtifactType = "summary" | "audio_overview" | "video" | "quote_card" | "carousel" | "launch_kit";
@@ -407,7 +409,8 @@ export type VideoStyleItem = {
   id: string;
   name: string;
   description?: string | null;
-  kind: "builtin" | "custom";
+  /** house: made on our blog2video account and offered to everyone; the server sets the video length from it. */
+  kind: "builtin" | "custom" | "house";
   custom_id?: number;
   guidance?: string | null;
   version?: number;
@@ -493,12 +496,24 @@ export type VideoOptions = {
   bgm_volume: number;
 };
 
+/** A workspace source the AI can suggest focus topics for. */
+/** A focus topic the AI suggests: a short title, and two sentences on what the video would cover. */
+export type VideoFocusTopic = { title: string; description: string };
+
+export type VideoFocusSource = { document_id?: string; document_ids?: string[]; chat_ids?: string[]; notebook_id?: string };
+
 export type VideoCreateBody = VideoOptions & {
+  /** One of the suggested focus topics: the video is mainly about it. */
+  focus?: string;
+  /** The picked topic's description, sent so blog2video knows what to cover. */
+  focus_detail?: string;
   document_id?: string;
   /** A notebook's ticked posts, combined into one video. */
   document_ids?: string[];
   /** Names a combined video after its notebook. */
   notebook_id?: string;
+  /** Notebook chats: their transcripts, after a prompt saying what they are (combined into one video). */
+  chat_ids?: string[];
   url?: string;
   content?: string;
   title?: string;

frontend/src/components/DocPicker.tsx

@@ -39,17 +39,21 @@ export function DocPicker({
     );
   }, [docs, q, exclude]);
 
-  // The tick-all box: ticked only while every pickable post in view is ticked. Ticking it picks them all,
-  // unticking it clears them.
+  // The tick-all box: ticked only while every pickable post in view is ticked, or with a `max`, exactly the first `max`
+  // of them. Ticking it picks those, unticking it clears them.
   const pickable = visible.filter((d) => !d.locked);
-  const allOn = pickable.length > 0 && pickable.every((d) => selected.includes(d.id));
+  const full = !!max && selected.length >= max;
+  const firstFew = max ? pickable.slice(0, max).map((d) => d.id) : null;
+  const allOn = pickable.length > 0 && (firstFew
+    ? selected.length === firstFew.length && firstFew.every((id) => selected.includes(id))
+    : pickable.every((d) => selected.includes(d.id)));
 
   if (!docs) return <Loading label="Loading posts" />;
   if (docs.length === 0) return <p className="muted">No posts yet. Connect a source first.</p>;
 
   const selectAll = () => {
-    const ids = Array.from(new Set([...selected, ...visible.filter((d) => !d.locked).map((d) => d.id)]));
-    onChange(max ? ids.slice(0, max) : ids);
+    if (firstFew) return onChange(firstFew);
+    onChange(Array.from(new Set([...selected, ...pickable.map((d) => d.id)])));
   };
 
   const toggle = (id: string) => {
@@ -68,7 +72,7 @@ export function DocPicker({
             <label className="picker-all">
               <input type="checkbox" checked={allOn} disabled={pickable.length === 0}
                      onChange={() => (allOn ? onChange(selected.filter((id) => !pickable.some((d) => d.id === id))) : selectAll())} />
-              Select All
+              {max && pickable.length > max ? `Select first ${max}` : "Select All"}
             </label>
             {count && <span>{selected.length} selected{max ? ` of ${max}` : ""}</span>}
           </div>
@@ -78,7 +82,7 @@ export function DocPicker({
         {visible.map((d) => (
           <li key={d.id}>
             <label className={`picker-row${selected.includes(d.id) ? " on" : ""}${d.locked ? " locked" : ""}`}>
-              <input type={single ? "radio" : "checkbox"} name="doc-picker" checked={selected.includes(d.id)} disabled={d.locked}
+              <input type={single ? "radio" : "checkbox"} name="doc-picker" checked={selected.includes(d.id)} disabled={d.locked || (!single && full && !selected.includes(d.id))}
                      onChange={() => toggle(d.id)} />
               <span className="picker-title">{d.title}</span>
               <span className="mono muted picker-meta">

frontend/src/components/video/SourcePicker.tsx

@@ -1,91 +1,80 @@
-import { useEffect, useRef, useState } from "react";
+import { useEffect, useMemo, useRef, useState } from "react";
 import { Link } from "react-router-dom";
-import { docsApi } from "../../api/endpoints";
-import type { Doc, NotebookSummary } from "../../api/types";
+import type { Doc, NotebookSummary, WorkspaceChat } from "../../api/types";
 import { DocPicker } from "../DocPicker";
 import { Dropdown } from "../Dropdown";
 import { formatDate, Loading } from "../ui";
-import { loadDocs, loadNotebooks, sourceCache } from "./sourceCache";
+import { freshlySeeded, loadChats, loadDocs, loadNotebooks, sourceCache } from "./sourceCache";
 
-/** What a video is made from: a notebook's ticked posts (combined into one video), or one post. */
-export type VideoSource = { kind: "notebook"; id: string } | { kind: "post"; id: string };
+/** What a video is made from: a notebook's ticked posts (combined into one video), one post, or ticked notebook chats
+ * (combined too; the ticks are held next to the source, like a notebook's posts). */
+export type VideoSource = { kind: "notebook"; id: string } | { kind: "post"; id: string } | { kind: "chats" };
 
 const ONE_POST = "__post";
+const CHATS = "__chats";
+/** Most posts one video can combine. */
+export const MAX_VIDEO_POSTS = 5;
 
-/** Step 1's source: a notebook (every indexed post ticked, untick to leave out) or a single post. */
+/** Step 1's source: a notebook (its first MAX_VIDEO_POSTS indexed posts ticked, retick to change) or a single post. */
 export function SourcePicker({
   source,
   onSource,
   postIds,
   onPostIds,
+  chatIds,
+  onChatIds,
 }: {
   source: VideoSource | null;
   onSource: (s: VideoSource | null) => void;
   postIds: string[];
   onPostIds: (ids: string[]) => void;
+  chatIds: string[];
+  onChatIds: (ids: string[]) => void;
 }) {
   const [notebooks, setNotebooks] = useState<NotebookSummary[] | null>(sourceCache.notebooks);
+  const [chats, setChats] = useState<WorkspaceChat[] | null>(sourceCache.chats);
   const [docs, setDocs] = useState<Doc[] | null>(null);
   const ticks = useRef(postIds);
   ticks.current = postIds;
-  const [post, setPost] = useState<Doc | null>(null);
-  // "One post..." picked in the select: the archive is listed until a post is chosen.
+  // "Create a video on a single post" picked in the menu: the archive is listed, and stays listed once a post is
+  // chosen (its radio ticked), so another can be picked from the same list.
   const [choosing, setChoosing] = useState(false);
 
   useEffect(() => {
     loadNotebooks().then(setNotebooks).catch(() => setNotebooks((n) => n ?? []));
+    loadChats().then(setChats).catch(() => setChats((c) => c ?? []));
   }, []);
 
   const notebookId = source?.kind === "notebook" ? source.id : null;
   const postId = source?.kind === "post" ? source.id : null;
+  const onChats = source?.kind === "chats";
 
   useEffect(() => {
     if (!notebookId) return;
     let live = true;
     const tickable = (list: Doc[]) => list.filter((d) => !d.locked).map((d) => d.id);
-    // A cached list shows at once, every post ticked; the refresh below then only updates it.
+    const firstFew = (list: Doc[]) => tickable(list).slice(0, MAX_VIDEO_POSTS);
+    // A cached list shows at once, the first few posts ticked; the refresh below then only updates it.
     const cached = sourceCache.docs.get(notebookId);
     setDocs(cached ?? null);
-    if (cached) onPostIds(tickable(cached));
+    if (cached) onPostIds(firstFew(cached));
+    // Just handed over by the page that holds them (the notebook page): already current, no need to load them again.
+    if (cached && freshlySeeded(notebookId)) return;
     loadDocs(notebookId).then((fresh) => {
       if (!live) return;
       setDocs(fresh);
-      if (!cached) return onPostIds(tickable(fresh)); // all in by default
-      // Keep the user's ticks through the refresh: drop posts that are gone, tick ones that are new.
+      if (!cached) return onPostIds(firstFew(fresh)); // the first few in by default
+      // Keep the user's ticks through the refresh: drop posts that are gone, tick new ones while there is room.
       const now = new Set(tickable(fresh));
       const before = new Set(cached.map((d) => d.id));
-      onPostIds([...ticks.current.filter((id) => now.has(id)), ...[...now].filter((id) => !before.has(id))]);
+      onPostIds([...ticks.current.filter((id) => now.has(id)), ...[...now].filter((id) => !before.has(id))]
+        .slice(0, MAX_VIDEO_POSTS));
     }).catch(() => undefined);
     return () => {
       live = false;
     };
   }, [notebookId, onPostIds]);
 
-  useEffect(() => {
-    if (postId) docsApi.get(postId).then(setPost).catch(() => setPost(null));
-  }, [postId]);
-
-  if (postId && !choosing) {
-    return (
-      <div className="field">
-        <span className="vw-label">Post</span>
-        <div className="vw-source-post">
-          <div>
-            <strong>{post?.title ?? "Loading..."}</strong>
-            {post && (
-              <span className="mono muted small">
-                {formatDate(post.published_at)} · {post.words} words
-              </span>
-            )}
-          </div>
-          <button type="button" className="btn btn-small" onClick={() => setChoosing(true)}>
-            Change
-          </button>
-        </div>
-      </div>
-    );
-  }
-
   const ticked = docs ? postIds.length : 0;
   const pickable = docs?.filter((d) => !d.locked).length ?? 0;
 
@@ -95,11 +84,15 @@ export function SourcePicker({
         <span className="vw-label">Made from</span>
         <Dropdown
           label="Made from"
-          value={choosing || postId ? ONE_POST : notebookId ?? ONE_POST}
+          value={choosing || postId ? ONE_POST : onChats ? CHATS : notebookId ?? ONE_POST}
           onChange={(v) => {
             if (v === ONE_POST) {
               setChoosing(true);
               onSource(null);
+            } else if (v === CHATS) {
+              setChoosing(false);
+              onChatIds([]); // none ticked to start with
+              onSource({ kind: "chats" });
             } else {
               setChoosing(false);
               onSource({ kind: "notebook", id: v });
@@ -109,20 +102,34 @@ export function SourcePicker({
             // The API lists the "All posts" notebook first, so the sections come out in order.
             ...(notebooks ?? []).map((n) => ({ value: n.id, label: n.is_archive ? "My whole archive" : n.title,
                                                hint: `${n.document_count} posts`, group: n.is_archive ? "Archive" : "Notebooks" })),
+            ...(chats?.length ? [{ value: CHATS, label: "Chats", hint: `${chats.length} chat${chats.length === 1 ? "" : "s"}`,
+                                   group: "Chats" }] : []),
             { value: ONE_POST, label: "Create a video on a single post", group: "Single post" },
           ]}
         />
+        <small className="muted vw-hint">
+          {onChats
+            ? "The video explains what the ticked chats are about."
+            : "Choose a notebook, individual posts, a chat or your whole archive."}
+        </small>
       </div>
 
-      {choosing && (
-        <DocPicker
-          selected={postId ? [postId] : []}
-          onChange={(ids) => {
-            setChoosing(false);
-            onSource({ kind: "post", id: ids[0] });
-          }}
-          single
-        />
+      {onChats && (
+        <div className="field">
+          <span className="vw-label">Chats</span>
+          <ChatPicker chats={chats} selected={chatIds} onChange={onChatIds} />
+          {chats && chats.length > 0 && (
+            <small className="muted vw-hint">
+              {chatIds.length === 0
+                ? "Tick at least one chat."
+                : `You can select up to ${Math.min(MAX_VIDEO_POSTS, chats.length)} (${chatIds.length} selected). They are combined into one video.`}
+            </small>
+          )}
+        </div>
+      )}
+
+      {(choosing || postId) && (
+        <DocPicker selected={postId ? [postId] : []} onChange={(ids) => onSource({ kind: "post", id: ids[0] })} single />
       )}
 
       {notebookId && !choosing && (
@@ -146,11 +153,11 @@ export function SourcePicker({
         ) : (
           <div className="field">
             <span className="vw-label">Posts</span>
-            <DocPicker docs={docs} selected={postIds} onChange={onPostIds} count={false} />
+            <DocPicker docs={docs} selected={postIds} onChange={onPostIds} max={MAX_VIDEO_POSTS} count={false} />
             <small className="muted vw-hint">
               {ticked === 0
                 ? "Tick at least one post."
-                : `${ticked} of ${pickable} post${pickable === 1 ? "" : "s"} ticked. They are combined into one video.`}
+                : `You can select up to ${Math.min(MAX_VIDEO_POSTS, pickable)} (${ticked} selected). They are combined into one video.`}
             </small>
           </div>
         )
@@ -158,3 +165,62 @@ export function SourcePicker({
     </>
   );
 }
+
+/** Searchable checklist of the workspace's chats (title, notebook, date), up to MAX_VIDEO_POSTS ticked. The posts
+ * list's look (DocPicker), so both sources read the same. */
+function ChatPicker({ chats, selected, onChange }: {
+  chats: WorkspaceChat[] | null;
+  selected: string[];
+  onChange: (ids: string[]) => void;
+}) {
+  const [q, setQ] = useState("");
+  const visible = useMemo(() => {
+    const needle = q.trim().toLowerCase();
+    return (chats ?? []).filter((c) => !needle || (c.title ?? "").toLowerCase().includes(needle)
+      || c.notebook_title.toLowerCase().includes(needle));
+  }, [chats, q]);
+
+  if (!chats) {
+    return (
+      <div className="picker">
+        <div className="picker-bar">
+          <input className="input input-sm" placeholder="Search chats" disabled aria-label="Search chats" />
+        </div>
+        <div className="picker-list vw-posts-wait"><Loading label="Loading chats" /></div>
+      </div>
+    );
+  }
+  if (chats.length === 0) return <p className="muted">No chats yet. Ask something in a notebook first.</p>;
+
+  const full = selected.length >= MAX_VIDEO_POSTS;
+  const toggle = (id: string) => {
+    if (selected.includes(id)) return onChange(selected.filter((x) => x !== id));
+    if (!full) onChange([...selected, id]);
+  };
+
+  return (
+    <div className="picker">
+      <div className="picker-bar">
+        <input className="input input-sm" placeholder="Search chats" value={q} onChange={(e) => setQ(e.target.value)}
+               aria-label="Search chats" />
+      </div>
+      <ul className="picker-list">
+        {visible.map((c) => {
+          const on = selected.includes(c.id);
+          return (
+            <li key={c.id}>
+              <label className={`picker-row${on ? " on" : ""}`}>
+                <input type="checkbox" checked={on} disabled={!on && full} onChange={() => toggle(c.id)} />
+                <span className="picker-title">{c.title || "Untitled chat"}</span>
+                <span className="mono muted picker-meta">
+                  {c.notebook_title}{c.updated_at ? ` · ${formatDate(c.updated_at)}` : ""}
+                </span>
+              </label>
+            </li>
+          );
+        })}
+        {visible.length === 0 && <li className="muted">No chats match.</li>}
+      </ul>
+    </div>
+  );
+}

frontend/src/components/video/sourceCache.ts

@@ -1,10 +1,11 @@
 import { notebooksApi } from "../../api/endpoints";
-import type { Doc, NotebookSummary } from "../../api/types";
+import type { Doc, NotebookSummary, WorkspaceChat } from "../../api/types";
 
 /** The video wizard's step 1 lists, kept for the browser session (until a full reload) so re-opening the wizard
  * shows them at once. Readers show what is cached, then refresh in the background through the loaders below. */
 export const sourceCache = {
   notebooks: null as NotebookSummary[] | null,
+  chats: null as WorkspaceChat[] | null,
   archiveId: null as string | null,
   docs: new Map<string, Doc[]>(),
 };
@@ -12,8 +13,10 @@ export const sourceCache = {
 /** Forget everything, so one account never sees another's posts (called on log in and log out). */
 export function clearSourceCache(): void {
   sourceCache.notebooks = null;
+  sourceCache.chats = null;
   sourceCache.archiveId = null;
   sourceCache.docs.clear();
+  seededAt.clear();
 }
 
 export async function loadNotebooks(): Promise<NotebookSummary[]> {
@@ -22,12 +25,33 @@ export async function loadNotebooks(): Promise<NotebookSummary[]> {
   return n;
 }
 
+export async function loadChats(): Promise<WorkspaceChat[]> {
+  const c = await notebooksApi.allChats();
+  sourceCache.chats = c;
+  return c;
+}
+
 export async function loadArchiveId(): Promise<string> {
   const nb = await notebooksApi.archive();
   sourceCache.archiveId = nb.id;
   return nb.id;
 }
 
+/** A page that already holds a notebook's current posts (the notebook page) hands them over, so the video wizard
+ * shows them without loading them again. For a minute SourcePicker trusts them and skips its own refresh. */
+const seededAt = new Map<string, number>();
+const SEED_TRUST_MS = 60_000;
+
+export function seedDocs(notebookId: string, docs: Doc[]): void {
+  sourceCache.docs.set(notebookId, docs);
+  seededAt.set(notebookId, Date.now());
+}
+
+export function freshlySeeded(notebookId: string): boolean {
+  const at = seededAt.get(notebookId);
+  return at !== undefined && Date.now() - at < SEED_TRUST_MS;
+}
+
 export async function loadDocs(notebookId: string): Promise<Doc[]> {
   const nb = await notebooksApi.get(notebookId);
   sourceCache.docs.set(notebookId, nb.documents);

frontend/src/pages/NotebookView.tsx

@@ -6,24 +6,27 @@ import type { Artifact, ChatSummary, Citation, Notebook } from "../api/types";
 import { ArtifactCard, CitationList } from "../components/ArtifactCard";
 import { Markdown } from "../components/Markdown";
 import { DocPicker } from "../components/DocPicker";
-import { TelescopeIcon } from "../components/icons/Icons";
+import { Dropdown } from "../components/Dropdown";
+import { ChevronIcon, TelescopeIcon } from "../components/icons/Icons";
 import { Reader } from "../components/Reader";
-import { ConfirmButton, errorMessage, formatDate, Loading, Modal, Tabs } from "../components/ui";
+import { seedDocs } from "../components/video/sourceCache";
+import { ConfirmButton, errorMessage, formatDate, Loading, Modal } from "../components/ui";
+import { VideoCreateForm } from "./VideoCreate";
 
 type Turn = { role: "user" | "assistant"; text: string; citations?: Citation[]; status?: string; steps?: string[] };
 
-type Pane = "create" | "posts";
 
 const STARTERS = ["What are the strongest ideas across these posts?", "Where do I contradict myself?", "Which post is most worth updating, and why?"];
 
-/** The Create tab: one click per format with sensible defaults, options folded away. */
-function StudioPanel({ notebookId, disabled }: { notebookId: string; disabled: boolean }) {
+/** Create: one click per format with sensible defaults, options folded away; then what was made from this notebook. */
+function StudioPanel({ notebookId, disabled, onCreateVideo }: { notebookId: string; disabled: boolean; onCreateVideo: () => void }) {
   const [artifacts, setArtifacts] = useState<Artifact[] | null>(null);
   const [format, setFormat] = useState<"deep_dive" | "brief" | "debate">("deep_dive");
   const [minutes, setMinutes] = useState(6);
   const [error, setError] = useState<string | null>(null);
   const [busy, setBusy] = useState(false);
   const [reading, setReading] = useState<{ id: string; start: number; end: number } | null>(null);
+  const [audioOpen, setAudioOpen] = useState(false); // the Audio overview tile is opened to its options
 
   const load = useCallback(() => notebooksApi.artifacts(notebookId).then(setArtifacts), [notebookId]);
   useEffect(() => {
@@ -48,43 +51,57 @@ function StudioPanel({ notebookId, disabled }: { notebookId: string; disabled: b
 
   return (
     <div className="stack">
+      <span className="vw-label">Create</span>
       <div className="nbv-make">
-        <button className="nbv-make-main" disabled={off} onClick={() => make({ type: "audio_overview", format, minutes })}>
-          <strong>Audio overview</strong>
-          <span className="muted small">
-            {format === "deep_dive" ? "Deep dive" : format === "brief" ? "Brief" : "Debate"} · {minutes} min
+        {/* Opens its options (format, length) right under it; the audio is made from there */}
+        <button className={`nbv-make-main${audioOpen ? " open" : ""}`} disabled={off} aria-expanded={audioOpen}
+                onClick={() => setAudioOpen(!audioOpen)}>
+          <span>Audio overview</span>
+          <span className="nbv-make-meta">
+            <span className="muted small">
+              {format === "deep_dive" ? "Deep dive" : format === "brief" ? "Brief" : "Debate"} · {minutes} min
+            </span>
+            <ChevronIcon size={16} className={`chevron${audioOpen ? " open" : ""}`} />
           </span>
         </button>
-        <Link className={off ? "disabled" : ""} to={`/app/videos/new?notebook_id=${notebookId}`} aria-disabled={off}>
-          Video
-        </Link>
+        {audioOpen && (
+          <div className="nbv-audio-opts">
+            <div className="nbv-audio-row">
+              <div className="field">
+                <span className="small muted">Format</span>
+                <Dropdown<typeof format> label="Audio format" value={format} onChange={setFormat}
+                  options={[
+                    { value: "deep_dive", label: "Deep dive" },
+                    { value: "brief", label: "Brief" },
+                    { value: "debate", label: "Debate" },
+                  ]} />
+              </div>
+              <div className="field">
+                <span className="small muted">Length</span>
+                <Dropdown<string> label="Length" value={String(minutes)} onChange={(v) => setMinutes(Number(v))}
+                  options={[3, 6, 10, 15].map((m) => ({ value: String(m), label: `${m} min` }))} />
+              </div>
+            </div>
+            <button className="btn btn-primary btn-small" disabled={off}
+                    onClick={() => make({ type: "audio_overview", format, minutes }).then(() => setAudioOpen(false))}>
+              {busy ? "Starting..." : "Create audio overview"}
+            </button>
+          </div>
+        )}
+        <button disabled={off} onClick={onCreateVideo}>
+          Create Video
+        </button>
         <button disabled={off} onClick={() => make({ type: "summary" })}>
-          Summary
+          Generate Summary
         </button>
         <button disabled={off} onClick={() => make({ type: "quote_card" })}>
-          Quote card
+          Make Quote Card
         </button>
       </div>
-      <details className="delivery">
-        <summary className="mono muted small">Audio options</summary>
-        <div className="row">
-          <select className="input input-sm" value={format} onChange={(e) => setFormat(e.target.value as typeof format)} aria-label="Audio format">
-            <option value="deep_dive">Deep dive</option>
-            <option value="brief">Brief</option>
-            <option value="debate">Debate</option>
-          </select>
-          <select className="input input-sm" value={minutes} onChange={(e) => setMinutes(Number(e.target.value))} aria-label="Length">
-            {[3, 6, 10, 15].map((m) => (
-              <option key={m} value={m}>
-                {m} min
-              </option>
-            ))}
-          </select>
-        </div>
-      </details>
       {disabled && <p className="muted small">Add posts to this notebook to start creating.</p>}
       {error && <p className="error-text">{error}</p>}
-      <div className="studio-list">
+      {(!artifacts || artifacts.length > 0) && <span className="vw-label nbv-made-label">Made from this notebook</span>}
+      {(!artifacts || artifacts.length > 0) && <div className="studio-list nbv-made">
         {!artifacts && <Loading />}
         {artifacts?.map((a) => (
           <ArtifactCard
@@ -101,7 +118,7 @@ function StudioPanel({ notebookId, disabled }: { notebookId: string; disabled: b
             }
           />
         ))}
-      </div>
+      </div>}
       {reading && <Reader documentId={reading.id} highlight={{ start: reading.start, end: reading.end }} onClose={() => setReading(null)} />}
     </div>
   );
@@ -117,12 +134,12 @@ export default function NotebookView() {
   const [chats, setChats] = useState<ChatSummary[]>([]);
   const [busy, setBusy] = useState(false);
   const [adding, setAdding] = useState(false);
+  const [makingVideo, setMakingVideo] = useState(false); // the video wizard is open in a modal
   const [toAdd, setToAdd] = useState<string[]>([]);
   const [addError, setAddError] = useState<string | null>(null);
   const [reading, setReading] = useState<{ id: string; start?: number; end?: number } | null>(null);
   const [editingTitle, setEditingTitle] = useState(false);
   const [title, setTitle] = useState("");
-  const [pane, setPane] = useState<Pane>("create");
   const [params, setParams] = useSearchParams();
   const asked = useRef(false);
   const bottom = useRef<HTMLDivElement>(null);
@@ -326,53 +343,55 @@ export default function NotebookView() {
       </section>
 
       <aside className="card nbv-pane nbv-side">
-        <Tabs<Pane>
-          tabs={[
-            { id: "create", label: "Create" },
-            { id: "posts", label: "Posts", count: nb.documents.length },
-          ]}
-          value={pane}
-          onChange={setPane}
-        />
-        {pane === "create" && <StudioPanel notebookId={nb.id} disabled={nb.documents.length === 0} />}
-        {pane === "posts" && (
-          <>
-            {nb.is_archive ? (
-              <p className="muted small">Every indexed post. New posts join automatically.</p>
-            ) : (
-              <button className="btn btn-small" onClick={() => setAdding(true)}>
-                Add posts
-              </button>
+        <StudioPanel notebookId={nb.id} disabled={nb.documents.length === 0}
+                     onCreateVideo={() => {
+                       seedDocs(nb.id, nb.documents); // the posts this page already has: the wizard shows them at once
+                       setMakingVideo(true);
+                     }} />
+
+        {/* Posts: below the create buttons and what was made */}
+        <section className="nbv-section">
+          <div className="nbv-section-head">
+            <span className="vw-label">Posts <span className="mono muted">{nb.documents.length}</span></span>
+            {!nb.is_archive && (
+              <button className="btn btn-small" onClick={() => setAdding(true)}>+ Add posts</button>
             )}
-            <ul className="nbv-docs">
-              {nb.documents.map((d) => (
-                <li key={d.id} className="nbv-doc">
-                  <button className="link-btn" onClick={() => setReading({ id: d.id })}>
-                    {d.title}
+          </div>
+          {nb.is_archive && <p className="muted small">Every indexed post. New posts join automatically.</p>}
+          {!nb.is_archive && nb.documents.length === 0 && <p className="muted small">No posts yet. Add some to start asking and creating.</p>}
+          <ul className="nbv-docs">
+            {nb.documents.map((d) => (
+              <li key={d.id} className="nbv-doc">
+                <button className="link-btn" onClick={() => setReading({ id: d.id })}>
+                  {d.title}
+                </button>
+                <span className="mono muted">{formatDate(d.published_at)}</span>
+                {!nb.is_archive && (
+                  <button
+                    className="icon-btn nbv-remove"
+                    aria-label={`Remove ${d.title} from this notebook`}
+                    title="Remove from this notebook (the post itself is kept)"
+                    onClick={async () => {
+                      await notebooksApi.removeDoc(nb.id, d.id);
+                      load();
+                    }}
+                  >
+                    <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.6">
+                      <path d="M6 6l12 12M18 6L6 18" />
+                    </svg>
                   </button>
-                  <span className="mono muted">{formatDate(d.published_at)}</span>
-                  {!nb.is_archive && (
-                    <button
-                      className="icon-btn nbv-remove"
-                      aria-label={`Remove ${d.title}`}
-                      title="Remove from notebook"
-                      onClick={async () => {
-                        await notebooksApi.removeDoc(nb.id, d.id);
-                        load();
-                      }}
-                    >
-                      <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.6">
-                        <path d="M6 6l12 12M18 6L6 18" />
-                      </svg>
-                    </button>
-                  )}
-                </li>
-              ))}
-            </ul>
-          </>
-        )}
+                )}
+              </li>
+            ))}
+          </ul>
+        </section>
       </aside>
 
+      {makingVideo && (
+        <Modal title="New video" onClose={() => setMakingVideo(false)} wide>
+          <VideoCreateForm startNotebook={nb.id} inModal />
+        </Modal>
+      )}
       {adding && (
         <Modal title="Add posts" onClose={() => setAdding(false)} wide>
           <DocPicker selected={toAdd} onChange={setToAdd} exclude={nb.documents.map((d) => d.id)} />

frontend/src/pages/VideoCreate.tsx

@@ -4,6 +4,8 @@ import { videosApi, videoVoicesApi } from "../api/endpoints";
 import type {
   VideoCatalog,
   VideoConfig,
+  VideoFocusSource,
+  VideoFocusTopic,
   VideoOptions,
   VideoQuota,
   VideoSavedVoice,
@@ -12,7 +14,7 @@ import type {
   VideoVoicesResponse,
 } from "../api/types";
 import { Dropdown } from "../components/Dropdown";
-import { CheckIcon } from "../components/icons/Icons";
+import { CheckIcon, SparkleIcon } from "../components/icons/Icons";
 import { errorMessage, Loading, PageHeader } from "../components/ui";
 import { SourcePicker, type VideoSource } from "../components/video/SourcePicker";
 import { loadArchiveId, sourceCache } from "../components/video/sourceCache";
@@ -52,12 +54,19 @@ function Steps({ step }: { step: number }) {
   );
 }
 
+/** The New video page (/app/videos/new?notebook_id=… | document_id=…). */
 export default function VideoCreate() {
-  const navigate = useNavigate();
   const [params] = useSearchParams();
+  return <VideoCreateForm startNotebook={params.get("notebook_id")} startDoc={params.get("document_id")} />;
+}
+
+/** The three-step video wizard: as a page, or inside a modal (inModal: no page header, no step-1 Back, no outer card;
+ * the modal's own close button leaves it). */
+export function VideoCreateForm({ startNotebook = null, startDoc = null, inModal = false }: {
+  startNotebook?: string | null; startDoc?: string | null; inModal?: boolean;
+}) {
+  const navigate = useNavigate();
   const { openUpgrade } = useUpgrade();
-  const startNotebook = params.get("notebook_id");
-  const startDoc = params.get("document_id");
 
   const [config, setConfig] = useState<VideoConfig | null>(null);
   const [catalog, setCatalog] = useState<VideoCatalog | null>(null);
@@ -71,6 +80,12 @@ export default function VideoCreate() {
       : sourceCache.archiveId ? { kind: "notebook", id: sourceCache.archiveId } : null,
   );
   const [postIds, setPostIds] = useState<string[]>([]);
+  const [chatIds, setChatIds] = useState<string[]>([]);
+  // Step 2's "focus on": the AI's three suggestions for the step 1 choice (sourceKey), and the one picked (none =
+  // the whole material).
+  const [topics, setTopics] = useState<VideoFocusTopic[] | null>(null);
+  const topicsFor = useRef(""); // the sourceKey of the suggestions shown or on their way
+  const [focus, setFocus] = useState<VideoFocusTopic | null>(null);
   const [busy, setBusy] = useState(false);
   const [error, setError] = useState<string | null>(null);
   const { playing, play } = useAudio();
@@ -78,7 +93,7 @@ export default function VideoCreate() {
   const [form, setForm] = useState<VideoOptions>({
     stock_footage_enabled: true,
     aspect_ratio: "landscape",
-    video_length: "medium", // every video is medium (1 to 2 min); there is no length picker
+    video_length: "medium", // no length picker: the server sets it from a house style
     logo_position: "bottom_right",
     logo_opacity: 0.9,
     template: "default",
@@ -120,6 +135,9 @@ export default function VideoCreate() {
       const first = pool[Math.floor(Math.random() * pool.length)];
       const known = new Set([...c.my_templates, ...c.crafted_templates, ...c.templates].map((t) => t.id));
       if (first) setForm((f) => (known.has(f.template) ? f : { ...f, ...templateFields(first) }));
+      // Start on the first house style (Overview) unless the form already names one on offer.
+      const house = c.video_styles.filter((s) => s.kind === "house");
+      if (house.length) setForm((f) => (house.some((s) => s.id === f.video_style) ? f : { ...f, video_style: house[0].id }));
     }).catch((e) => setLoadError(errorMessage(e)));
     loadVoices()
       .then((v) => v.saved[0] && pickVoice(v.saved[0]))
@@ -140,7 +158,11 @@ export default function VideoCreate() {
 
   const templates = catalog?.templates ?? [];
   const shown: VideoTemplate[] = templates;
-  const styles: VideoStyleItem[] = [{ id: "auto", name: "Auto", kind: "builtin" }, ...(catalog?.video_styles ?? [])];
+  // The house styles alone when the account has them; otherwise "Auto" and the rest, as before.
+  const listed = catalog?.video_styles ?? [];
+  const houseStyles = listed.some((s) => s.kind === "house");
+  const styles: VideoStyleItem[] = houseStyles ? listed : [{ id: "auto", name: "Auto", kind: "builtin" }, ...listed];
+  const picked = styles.find((s) => s.id === form.video_style);
   const saved = voices?.saved ?? [];
   const left = quota ? Math.max(quota.limit - quota.used, 0) : null;
 
@@ -159,7 +181,41 @@ export default function VideoCreate() {
     }));
   }
 
-  const sourceReady = source?.kind === "post" || (source?.kind === "notebook" && postIds.length > 0);
+  const sourceReady = source?.kind === "post" || (source?.kind === "chats" && chatIds.length > 0)
+    || (source?.kind === "notebook" && postIds.length > 0);
+
+  /** Step 1's choice as API fields: the same for the focus suggestions and the create. */
+  const sourceFields = (): VideoFocusSource | null => !source ? null
+    : source.kind === "post" ? { document_id: source.id }
+    : source.kind === "chats" ? { chat_ids: chatIds }
+    : { document_ids: postIds, notebook_id: source.id };
+  // The focus suggestions belong to one step 1 choice. They are asked for while still on step 1, as soon as the choice
+  // is complete, so they are usually there by step 2; a new source or other ticks asks again. The short wait lets a
+  // run of ticks settle into one request.
+  const sourceKey = !source ? ""
+    : source.kind === "chats" ? `chats:${[...chatIds].sort().join(",")}`
+    : `${source.kind}:${source.id}:${source.kind === "notebook" ? [...postIds].sort().join(",") : ""}`;
+
+  useEffect(() => {
+    if (!sourceReady || sourceKey === topicsFor.current) return;
+    const fields = sourceFields();
+    if (!fields) return;
+    const timer = setTimeout(() => {
+      topicsFor.current = sourceKey;
+      setTopics(null);
+      setFocus(null);
+      // An answer for a choice that has since changed is dropped (topicsFor moved on). A failure counts as no
+      // topics: the block hides, and this choice is not asked again.
+      videosApi.focusTopics(fields)
+        .then((r) => topicsFor.current === sourceKey && setTopics(r.topics))
+        .catch(() => topicsFor.current === sourceKey && setTopics([]));
+    }, 600);
+    return () => clearTimeout(timer);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [sourceKey, sourceReady]);
+  // Suggestions made for an earlier choice are never shown for this one: the cards wait for the new ones (and so
+  // does Go to step 2). null = still loading; [] = none to show.
+  const shownTopics = topicsFor.current === sourceKey ? topics : null;
 
   function options(): VideoOptions {
     const o: VideoOptions = { ...form };
@@ -171,9 +227,9 @@ export default function VideoCreate() {
     setError(null);
     setBusy(true);
     try {
-      if (!source) return;
-      const from = source.kind === "post" ? { document_id: source.id } : { document_ids: postIds, notebook_id: source.id };
-      const a = await videosApi.create({ ...options(), ...from });
+      const from = sourceFields();
+      if (!from) return;
+      const a = await videosApi.create({ ...options(), ...from, ...(focus ? { focus: focus.title, focus_detail: focus.description } : {}) });
       navigate(`/app/videos/${a.id}`);
     } catch (e) {
       setError(errorMessage(e)); // 402 also opens the upgrade popup (api/client.ts)
@@ -183,8 +239,8 @@ export default function VideoCreate() {
 
   if (loadError) {
     return (
-      <div className="page-wrap">
-        <PageHeader eyebrow="Videos" title="New video" />
+      <div className={inModal ? "vw-in-modal" : "page-wrap"}>
+        {!inModal && <PageHeader eyebrow="Videos" title="New video" />}
         <p className="error-text">{loadError}</p>
       </div>
     );
@@ -192,8 +248,8 @@ export default function VideoCreate() {
   if (!config) return <Loading label="Loading" />;
   if (!config.configured) {
     return (
-      <div className="page-wrap">
-        <PageHeader eyebrow="Videos" title="New video" />
+      <div className={inModal ? "vw-in-modal" : "page-wrap"}>
+        {!inModal && <PageHeader eyebrow="Videos" title="New video" />}
         <p className="notice">Video is not set up on this server yet.</p>
       </div>
     );
@@ -202,14 +258,18 @@ export default function VideoCreate() {
   const currentVoice = saved.find((v) => v.voice_id === form.custom_voice_id);
 
   return (
-    <div className="page-wrap">
-      <PageHeader eyebrow="Videos" title="New video">
-        {left !== null && (
-          <span className="mono muted">{left} of {quota!.limit} video{quota!.limit === 1 ? "" : "s"} left</span>
-        )}
-      </PageHeader>
+    <div className={inModal ? "stack vw-in-modal" : "page-wrap"}>
+      {inModal ? (
+        left !== null && <span className="mono muted small vw-modal-quota">{left} of {quota!.limit} video{quota!.limit === 1 ? "" : "s"} left</span>
+      ) : (
+        <PageHeader eyebrow="Videos" title="New video">
+          {left !== null && (
+            <span className="mono muted">{left} of {quota!.limit} video{quota!.limit === 1 ? "" : "s"} left</span>
+          )}
+        </PageHeader>
+      )}
 
-      {step === 1 && (
+      {step === 1 && !inModal && (
         // Leaves the wizard for wherever it was opened from. Steps 2 and 3 have their own Back at the bottom.
         <button type="button" className="vw-back"
                 onClick={() => (window.history.length > 1 ? navigate(-1) : navigate("/app/videos"))}>
@@ -217,11 +277,12 @@ export default function VideoCreate() {
         </button>
       )}
       <Steps step={step} />
-      <section className="card stack vw">
+      <section className={inModal ? "stack vw" : "card stack vw"}>
 
         {/* Stays mounted on steps 2 and 3, so going Back keeps the loaded posts and the ticks */}
         <div style={{ display: step === 1 ? "contents" : "none" }}>
-          <SourcePicker source={source} onSource={setSource} postIds={postIds} onPostIds={setPostIds} />
+          <SourcePicker source={source} onSource={setSource} postIds={postIds} onPostIds={setPostIds}
+                        chatIds={chatIds} onChatIds={setChatIds} />
         </div>
 
         {step === 1 && (
@@ -240,13 +301,15 @@ export default function VideoCreate() {
                   ))}
                 </div>
               </div>
-              <label className="vw-option">
-                <input type="checkbox" checked={form.stock_footage_enabled}
-                       onChange={(e) => set({ stock_footage_enabled: e.target.checked })} />
-                Insert stock footage automatically
-              </label>
+              <div className="field">
+                <span className="vw-label">Stock footage</span>
+                <label className="vw-option">
+                  <input type="checkbox" checked={form.stock_footage_enabled}
+                         onChange={(e) => set({ stock_footage_enabled: e.target.checked })} />
+                  Insert stock footage automatically
+                </label>
+              </div>
             </div>
-            <small className="muted vw-note">Your video will be about 1 to 2 minutes long.</small>
 
             {error && <p className="error-text">{error}</p>}
             <div className="vw-nav">
@@ -286,15 +349,20 @@ export default function VideoCreate() {
             <div className="vw-style-row">
               <div className="field">
                 <span className="vw-label">Video style</span>
-                <div className="vw-chips">
-                  {styles.map((s) => (
-                    <button key={s.id} type="button" className={`vw-chip${form.video_style === s.id ? " on" : ""}`}
-                            aria-pressed={form.video_style === s.id} title={s.description ?? undefined}
-                            onClick={() => set({ video_style: s.id })}>
-                      {s.name}{s.kind === "custom" ? " (yours)" : ""}
-                    </button>
-                  ))}
-                </div>
+                {catalog === null ? <Loading label="Loading styles" /> : (
+                  <div className="vw-chips vw-style-chips">
+                    {styles.map((s) => (
+                      <button key={s.id} type="button" className={`vw-chip${form.video_style === s.id ? " on" : ""}`}
+                              aria-pressed={form.video_style === s.id} title={s.description ?? undefined}
+                              onClick={() => set({ video_style: s.id })}>
+                        {s.name}{s.kind === "custom" ? " (yours)" : ""}
+                      </button>
+                    ))}
+                  </div>
+                )}
+                {houseStyles && picked?.description && (
+                  <small className="muted vw-style-note">{picked.description}</small>
+                )}
               </div>
 
               <div className="field">
@@ -310,9 +378,50 @@ export default function VideoCreate() {
               </div>
             </div>
 
+            {/* Asked for on step 1, so usually here already. Hidden only when the request failed */}
+            {sourceReady && shownTopics?.length !== 0 && (
+              <div className="field vw-focus">
+                <span className="vw-label">What should the video focus on?</span>
+                <div className="vw-focus-grid" aria-busy={shownTopics === null}>
+                  {shownTopics === null
+                    ? [0, 1, 2].map((i) => (
+                      <div key={i} className="vw-focus-card wait" aria-hidden="true">
+                        <SparkleIcon size={18} />
+                        <span className="vw-focus-text">
+                          <span className="vw-focus-bar" />
+                          <span className="vw-focus-bar short" />
+                        </span>
+                      </div>
+                    ))
+                    : shownTopics.map((t) => {
+                      const on = focus?.title === t.title;
+                      return (
+                        <button key={t.title} type="button" className={`vw-focus-card${on ? " on" : ""}`}
+                                aria-pressed={on} onClick={() => setFocus(on ? null : t)}>
+                          <SparkleIcon size={18} />
+                          <span className="vw-focus-text">
+                            <strong>{t.title}</strong>
+                            {t.description && <small className="vw-focus-desc">{t.description}</small>}
+                          </span>
+                          {on && <CheckIcon size={18} />}
+                        </button>
+                      );
+                    })}
+                </div>
+                {shownTopics && (
+                  <small className="muted vw-hint">
+                    {focus ? "The video is mainly about this topic." : "None picked: the video covers the material as a whole."}
+                  </small>
+                )}
+              </div>
+            )}
+
             <div className="vw-nav">
               <button className="btn" onClick={() => setStep(1)}>Back</button>
-              <button className="btn btn-primary vw-next" onClick={() => setStep(3)}>Go to step 3</button>
+              {/* Waits for the focus suggestions (shown, or none to show), so they are never skipped past */}
+              <button className="btn btn-primary vw-next" disabled={shownTopics === null} onClick={() => setStep(3)}>
+                Go to step 3
+              </button>
             </div>
           </>
         )}

frontend/src/pages/VideoEditor.tsx

@@ -298,8 +298,16 @@ export default function VideoEditor() {
 
   const title = project?.artifact.title ?? "Video";
   const failed = !!status && (!!status.error || status.status === "failed");
+  // Until the first /status answer, our stored status decides (as for edit jobs), so reopening a video that is still
+  // being made goes straight to its progress screen instead of showing the editor first.
+  const stored = !status && genKey === 0 ? project?.artifact.status : null;
   // First generation only: an edit job on a finished video has its own progress screen.
-  const generating = !!status && !status.ready && !failed && !REVIEW.has(status.status) && !(status.status in JOBS);
+  const generating = status
+    ? !status.ready && !failed && !REVIEW.has(status.status) && !(status.status in JOBS)
+    : stored === "generating" || stored === "pending";
+  // Stored as waiting on a review or failed: /status says which screen, so the editor stays hidden until it answers.
+  const awaiting = stored === "review" || stored === "failed";
+  const step: number = status?.step ?? (typeof project?.artifact.content?.step === "number" ? project.artifact.content.step : 1);
   // The live preview only while blog2video says the video is ready (generated / done, or rendering its MP4). The preview link is minted once
   // and kept, so it is there in every state; mid-job it would show a half-changed video. Until /status answers, our
   // stored status decides.
@@ -374,10 +382,9 @@ export default function VideoEditor() {
       {generating && (
         <section className="card stack vw-making">
           <h2>Making your video</h2>
-          <ol className="vw-progress" aria-label={`Step ${status?.step ?? 1} of ${STEPS.length}`}>
+          <ol className="vw-progress" aria-label={`Step ${step} of ${STEPS.length}`}>
             {STEPS.map((s, i) => {
               const n = i + 1;
-              const step = status?.step ?? 1;
               const done = n < step;
               return (
                 <li key={s} className={done ? "done" : n === step ? "on" : ""} aria-current={n === step ? "step" : undefined}>
@@ -432,7 +439,9 @@ export default function VideoEditor() {
       {/* A background job (not a render, which shows its own progress) takes the editor's place until it ends */}
       {fullScreenJob && running && <JobProgress label={running.label} name={title} state={job.data ?? null} />}
 
-      {project && panelProps && !generating && !REVIEW.has(status?.status ?? "") && !fullScreenJob && (
+      {awaiting && <div className="loading-center"><Loading label="Loading video" /></div>}
+
+      {project && panelProps && !generating && !awaiting && !REVIEW.has(status?.status ?? "") && !fullScreenJob && (
         <div className="stack vw-editor-v2">
           <section className="card vw-preview-card wide">
             {project.preview_url && previewReady ? (

frontend/src/styles/pages.css

@@ -937,7 +937,7 @@ select.input option {
   grid-column: 2;
   width: 26px;
   height: 26px;
-  opacity: 0;
+  opacity: 0.55; /* always visible, so removing a post is easy to find */
 }
 
 .nbv-doc:hover .nbv-remove,
@@ -3017,10 +3017,10 @@ select.input,
   font: 600 1.6rem var(--font-display, inherit);
 }
 
-/* Notebook view: chat takes the room, one side panel with Create / Posts tabs */
+/* Notebook view: chat takes the room, one narrower side panel (Create, what was made, Posts) */
 @media (min-width: 1100px) {
   .nbv {
-    grid-template-columns: minmax(0, 1fr) minmax(340px, 420px);
+    grid-template-columns: minmax(0, 1fr) minmax(290px, 340px);
   }
 }
 
@@ -3485,3 +3485,119 @@ details.map-legend[open] summary {
 .tabs a.tab {
   text-decoration: none;
 }
+
+/* Notebook side panel: Create, what was made, then Posts, in one scrolling column */
+.nbv-section {
+  display: grid;
+  gap: 10px;
+  padding-top: 14px;
+  border-top: 1px solid var(--line);
+}
+
+.nbv-section-head {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 10px;
+}
+
+.nbv-section-head .mono {
+  margin-left: 4px;
+  letter-spacing: 0;
+}
+
+.nbv-made-label {
+  padding-top: 6px;
+}
+
+/* What was made keeps its own scroll so a long list cannot push the posts far down */
+.nbv-made {
+  max-height: 40vh;
+  overflow-y: auto;
+  scrollbar-width: thin;
+}
+
+.nbv-side {
+  scrollbar-width: thin;
+}
+
+/* Create buttons: one per row, compact (Audio overview opens its options right under it) */
+.nbv-make {
+  grid-template-columns: minmax(0, 1fr);
+}
+
+.nbv-make > button,
+.nbv-make > a {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 10px;
+  min-height: 46px;
+  padding: 0 14px;
+}
+
+/* Audio overview looks like the others (no highlight); its current format / length and chevron on the right */
+.nbv-make .nbv-make-main {
+  grid-column: auto;
+  display: flex; /* label left, format / length + chevron right (the older rule made it a stacked grid) */
+  padding: 0 14px;
+  border-color: var(--line);
+  background: transparent;
+}
+
+.nbv-make-meta {
+  display: inline-flex;
+  align-items: center;
+  gap: 8px;
+}
+
+/* Audio overview opened: a blue edge, its options panel just below */
+.nbv-make .nbv-make-main.open {
+  border-color: var(--blue);
+}
+
+.nbv-audio-opts {
+  display: grid;
+  gap: 12px;
+  padding: 14px;
+  border: 1px solid var(--blue-35);
+  border-radius: var(--radius-sm);
+  background: var(--blue-05);
+}
+
+.nbv-audio-row {
+  display: grid;
+  grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); /* Format needs a little more room than Length */
+  gap: 10px;
+}
+
+/* Each dropdown fills its column and can shrink, instead of spilling into its neighbour */
+.nbv-audio-row > .field {
+  min-width: 0;
+}
+
+.nbv-audio-row > .field > * {
+  width: 100%;
+  min-width: 0;
+}
+
+.nbv-audio-opts .dropdown-btn {
+  padding: 0 12px;
+  font-size: 0.9rem;
+}
+
+.nbv-audio-opts .dropdown-btn {
+  height: 40px;
+  border-radius: 12px;
+}
+
+.nbv-audio-opts > .btn {
+  justify-self: end;
+}
+
+.nbv-audio-opts .dropdown-value {
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}

frontend/src/styles/videos.css

@@ -871,6 +871,126 @@ a.mc-action {
   color: var(--white);
 }
 
+.vw-focus {
+  margin-bottom: 12px;
+}
+
+.vw-focus-grid {
+  display: grid;
+  grid-template-columns: repeat(3, minmax(0, 1fr));
+  gap: 12px;
+}
+
+.vw-focus-card {
+  display: flex;
+  align-items: flex-start; /* title and description read from the top */
+  gap: 12px;
+  min-height: 72px;
+  padding: 14px 16px;
+  border: 1px solid var(--line);
+  border-radius: 16px;
+  background: var(--surface);
+  color: var(--text);
+  font: inherit;
+  text-align: left;
+  cursor: pointer;
+}
+
+.vw-focus-card > .icon {
+  flex-shrink: 0;
+  margin-top: 2px;
+}
+
+.vw-focus-text {
+  display: grid;
+  flex: 1;
+  gap: 6px;
+  min-width: 0;
+}
+
+.vw-focus-text strong {
+  font-weight: 500;
+}
+
+/* The topic's description: two lines at most */
+.vw-focus-desc {
+  display: -webkit-box;
+  overflow: hidden;
+  color: var(--text-2);
+  font-size: 0.82rem;
+  line-height: 1.4;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 2;
+  line-clamp: 2;
+}
+
+.vw-focus-card.on {
+  border-color: var(--blue);
+}
+
+.vw-focus-card.wait {
+  cursor: default;
+  color: var(--text-2);
+}
+
+/* The loading line in place of a topic: a light-to-dark bar with a sweep across it */
+.vw-focus-bar {
+  display: block;
+  height: 14px;
+  border-radius: 6px;
+  background: linear-gradient(90deg, #b8bcc6, #3d4658, #b8bcc6);
+  background-size: 200% 100%;
+  opacity: 0.85;
+  animation: vw-focus-sweep 1.6s linear infinite;
+}
+
+.vw-focus-bar.short {
+  width: 60%;
+  height: 10px;
+}
+
+@keyframes vw-focus-sweep {
+  from { background-position: 100% 0; }
+  to { background-position: -100% 0; }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .vw-focus-bar {
+    animation: none;
+    background: linear-gradient(90deg, #b8bcc6, #3d4658);
+  }
+}
+
+@media (max-width: 720px) {
+  .vw-focus-grid {
+    grid-template-columns: 1fr;
+  }
+}
+
+/* Video style pills: a little wider than the generic chips */
+.vw-style-chips .vw-chip {
+  min-width: 132px;
+  justify-content: center;
+  padding-inline: 24px;
+}
+
+.vw-style-chips .vw-chip.on,
+.vw-style-chips .vw-chip[aria-pressed="true"] {
+  border-color: var(--blue);
+  background: var(--blue);
+  color: var(--white);
+  box-shadow: var(--glow-sm);
+}
+
+.vw-style-note {
+  display: -webkit-box;
+  margin-top: 10px;
+  overflow: hidden;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 3; /* the description is written to fit three lines */
+  line-clamp: 3;
+}
+
 .vw-premium-badge.small {
   padding: 1px 8px;
   font-size: 0.68rem;
@@ -3064,3 +3184,39 @@ a.mc-action {
   justify-self: start;
   font-size: 0.875rem;
 }
+
+/* Modals that scroll (e.g. Edit Scene): a very thin, quiet scrollbar */
+.modal {
+  scrollbar-width: thin; /* Firefox */
+  scrollbar-color: var(--line-strong, rgba(255, 255, 255, 0.2)) transparent;
+}
+
+.modal::-webkit-scrollbar {
+  width: 4px;
+}
+
+.modal::-webkit-scrollbar-track {
+  background: transparent;
+}
+
+.modal::-webkit-scrollbar-thumb {
+  border-radius: 999px;
+  background: var(--line-strong, rgba(255, 255, 255, 0.2));
+}
+
+.modal::-webkit-scrollbar-thumb:hover {
+  background: var(--text-3, rgba(255, 255, 255, 0.4));
+}
+
+/* The video wizard inside a modal (from a notebook): a wider modal, no page-level width or outer card */
+.modal-wide:has(.vw-in-modal) {
+  width: min(700px, 100%);
+}
+
+.vw-in-modal .vw {
+  max-width: none;
+}
+
+.vw-modal-quota {
+  justify-self: end;
+}