Merge remote-tracking branch 'origin/master' into feat/send-unify

# Conflicts: # examples/acp-agent/tests/snapshots/cordis-inspect-jsdoc/session.jsonl # examples/acp-agent/tests/snapshots/cordis-inspect-jsdoc/stdout.expected.jsonl # packages/cordis/tool-cordis/src/api-catalog.ts # packages/pty/pty-local/tests/index.spec.ts # packages/session-query/session-query/tests/tracing.spec.ts
2026-07-23 22:41:45 +08:00
parent 1f9a3e1bee a08a008fad
commit d5f88f1221
333 changed files with 10751 additions and 907 deletions
--- a/packages/client/connection/src/client/fixture.ts
+++ b/packages/client/connection/src/client/fixture.ts
@@ -2,8 +2,8 @@
 // RpcRequest<P> and returns RpcResponse<T> (echoing the rpcId); streams yield RpcRequest<frame>
 // (the fixture IS the fake server, so it mints frame rpcIds); root respond takes ClientResponse
 // and returns RpcReceipt. fx-alpha carries a hand-built history script (60 turns, pageable);
-// prompt triggers a chunked streaming replay; cancel stops the replay; one resident pending
-// approval (placeholder-card material, subscribed-baseline-replay semantics: stable rpcId reuse).
+// prompt triggers a chunked streaming replay; cancel stops the replay; resident pending
+// approval/question requests exercise replay and composer takeover with stable rpcIds.

 import type { ContentBlock } from '@deepseek-ai/dsh-llm/types'
 import type { SessionEvent, SessionId } from '@deepseek-ai/dsh-session/types'
@@ -62,13 +62,19 @@ function buildAlphaLog(): SessionEvent[] {
  }
  for (let turn = 0; turn < 60; turn++) {
    push({ type: 'turn/start', data: { turn, trigger: { kind: 'message', source: { kind: 'user' } } } })
-    push({
+    const userSeq = push({
      type: 'user/message', surfaceOp: 'append',
      data: {
        content: text(turn === 59 ? USER_MARKDOWN_LITERAL : `问题 ${turn}：fixture 历史消息，用于翻页与渲染验收。`),
        source: { kind: 'user' },
      },
    })
+    if (turn === 0) {
+      push({
+        type: 'session/title',
+        data: { title: 'Fixture 历史会话', messageSeqs: [userSeq], source: { kind: 'fallback' } },
+      })
+    }
    if (turn % 9 === 4) {
      push({ type: 'user/message', surfaceOp: 'append', data: { content: text(`[fixture] 上下文注入（turn ${turn}）`), source: { kind: 'plugin', plugin: 'fixture' } } })
    }
@@ -187,6 +193,20 @@ function viewFor(event: SessionEvent, log: readonly SessionEvent[]): ToolEventVi
  return undefined
 }

+/** Fold the latest fixture title into the host's control-frame projection. */
+function titleFrameOf(id: SessionId, log: readonly SessionEvent[]): Extract<MuxFrame, { type: 'session/title' }> | undefined {
+  const event = log.findLast(item => (item as { type: string }).type === 'session/title')
+  if (event === undefined) return undefined
+  const titleEvent = event as unknown as { seq: number; time: number; data: { title: string } }
+  return {
+    type: 'session/title',
+    sessionId: id,
+    title: titleEvent.data.title,
+    eventSeq: titleEvent.seq,
+    updatedAt: titleEvent.time,
+  }
+}
+
 /**
 * Message-boundary paging (mirrors the host's paging contract): count
 * maxMessages messages
@@ -281,6 +301,41 @@ export function createFixtureApi(): ApiProxy {
  const mint = (): ReturnType<typeof RpcId> => RpcId(`fx-rpc-${nextRpc++}`)
  /** Resident pending approval (stable rpcId: every mux open replays the same id, matching host replay semantics). */
  const pendingApprovalRpcId = mint()
+  const pendingQuestionRpcId = mint()
+  let questionPending = true
+  const fixtureQuestions: Extract<MuxFrame, { type: 'question/requested' }>['questions'] = [
+    {
+      id: 'harness-profile',
+      header: '偏好',
+      question: '你现在更想招哪类 Agent/Harness 候选人？',
+      options: [
+        { label: '工程落地型 (Recommended)', description: '更看重能直接做 runtime、tool executor、sandbox、trace 和线上问题排查。' },
+        { label: '研究潜力型', description: '更看重 Agent 理解、训练评测思路和长期成长空间。' },
+        { label: '均衡型', description: '同时要求工程能力和 Agent 认知，但可能筛选门槛更高。' },
+      ],
+    },
+    {
+      id: 'work-mode',
+      header: '方式',
+      question: '你希望候选人优先展示哪种工作方式？',
+      options: [
+        { label: '先做小型原型 (Recommended)', description: '用可运行结果尽快验证关键假设。' },
+        { label: '先写完整设计', description: '先收敛边界、协议和风险，再开始实现。' },
+      ],
+    },
+    {
+      id: 'signals',
+      header: '信号',
+      question: '哪些面试信号最重要？',
+      detail: '按当前招聘目标选择；跳过则视为不设偏好。',
+      multiSelect: true,
+      options: [
+        { label: '系统设计' },
+        { label: '代码质量' },
+        { label: 'Agent 产品判断' },
+      ],
+    },
+  ]

  const muxConns = new Set<StreamConn<MuxFrame>>()
  const hostConns = new Set<StreamConn<HostFrame>>()
@@ -326,6 +381,10 @@ export function createFixtureApi(): ApiProxy {
    emitMux(view === undefined
      ? { type: 'session/event', sessionId: id, event }
      : { type: 'session/event', sessionId: id, event, view })
+    if ((event as { type: string }).type === 'session/title') {
+      // The raw title is already in this log, so the latest-title fold must find it.
+      emitMux(titleFrameOf(id, log) as Extract<MuxFrame, { type: 'session/title' }>)
+    }
  }

  /** At most one in-flight replay per session; cancel clears it. */
@@ -354,6 +413,12 @@ export function createFixtureApi(): ApiProxy {
    appendUser(id: string, msg: string): void {
      append(sid(id), { type: 'user/message', surfaceOp: 'append', data: { content: text(msg), source: { kind: 'user' } } })
    },
+    /** Append a later durable title revision through the normal raw-event + control-frame path. */
+    appendTitle(id: string, title: string): void {
+      const log = logOf(sid(id))
+      const messageSeqs = log.filter(event => event.type === 'user/message').map(event => event.seq)
+      append(sid(id), { type: 'session/title', data: { title, messageSeqs, source: { kind: 'provider', provider: 'fixture' } } })
+    },
    /** Log append WITHOUT the mux emit: a frame lost in transit — history still serves it, the client must repull. */
    appendSilent(id: string, msg: string): void {
      const log = logOf(sid(id))
@@ -467,10 +532,12 @@ export function createFixtureApi(): ApiProxy {
        muxConns.add(conn)
        const breakNow = (): void => { conn.breakNow() }
        streamBreakers.add(breakNow)
-        // Open baseline: subscribed for attached (running) sessions + pending approval replay (stable rpcId).
+        // Open baseline: subscribed sessions + pending interactions replayed with stable rpcIds.
        for (const s of sessions) {
          if (!s.running) continue
          conn.push({ rpcId: mint(), payload: { type: 'session/subscribed', sessionId: s.sessionId, lastSeq: (logs.get(s.sessionId)?.length ?? 0) - 1 } })
+          const title = titleFrameOf(s.sessionId, logs.get(s.sessionId) ?? [])
+          if (title !== undefined) conn.push({ rpcId: mint(), payload: title })
        }
        conn.push({
          rpcId: pendingApprovalRpcId,
@@ -480,6 +547,14 @@ export function createFixtureApi(): ApiProxy {
            toolName: 'dangerous_tool', reason: 'fixture 常驻占位审批（可见不可答）',
          },
        })
+        if (questionPending) {
+          conn.push({
+            rpcId: pendingQuestionRpcId,
+            payload: {
+              type: 'question/requested', sessionId: sid('fx-alpha'), questions: fixtureQuestions,
+            },
+          })
+        }
        try {
          yield* conn.drain(signal)
        } finally {
@@ -509,9 +584,16 @@ export function createFixtureApi(): ApiProxy {
      },
    },
    respond(message: ClientResponse): Promise<RpcReceipt> {
-      // The v1 UI never answers (PendingCard is visible but not answerable); implemented for type completeness, always not-pending.
-      void message
-      return Promise.resolve({ accepted: false, reason: 'not-pending' })
+      if (!questionPending || message.rpcId !== pendingQuestionRpcId) {
+        return Promise.resolve({ accepted: false, reason: 'not-pending' })
+      }
+      questionPending = false
+      emitMux({
+        type: 'question/resolved', sessionId: sid('fx-alpha'),
+        questionRpcId: pendingQuestionRpcId,
+        outcome: message.result.ok ? 'answered' : 'cancelled',
+      })
+      return Promise.resolve({ accepted: true })
    },
  }
 }
--- a/packages/client/connection/tests/fixture.spec.ts
+++ b/packages/client/connection/tests/fixture.spec.ts
@@ -18,6 +18,7 @@ interface TimingHooks {
  setHistoryDelay(ms: number): void
  failNextHistory(): void
  appendUser(id: string, msg: string): void
+  appendTitle(id: string, title: string): void
  appendSilent(id: string, msg: string): void
  breakStreams(): void
 }
@@ -148,14 +149,14 @@ describe('createFixtureApi', () => {
    expect(types.at(-1)).toBe('turn/end') // steer did not restart the turn
  })

-  it('mux open replays the baseline: subscribed for running sessions + the resident approval with a stable rpcId', async () => {
+  it('mux open replays subscribed sessions and resident interactions with stable rpcIds', async () => {
    const api = createFixtureApi()
    const openOnce = async (): Promise<RpcRequest<MuxFrame>[]> => {
      const abort = new AbortController()
      const envelopes: RpcRequest<MuxFrame>[] = []
      for await (const envelope of api.events.mux(req({}), abort.signal)) {
        envelopes.push(envelope)
-        if (envelopes.length >= 2) abort.abort()
+        if (envelopes.length >= 4) abort.abort()
      }
      return envelopes
    }
@@ -163,8 +164,11 @@ describe('createFixtureApi', () => {
    const second = await openOnce()
    expect(first[0]?.payload).toMatchObject({ type: 'session/subscribed', sessionId: 'fx-alpha' })
    expect((first[0]?.payload as { lastSeq: number }).lastSeq).toBeGreaterThan(0)
-    expect(first[1]?.payload).toMatchObject({ type: 'approval/requested', toolName: 'dangerous_tool' })
-    expect(second[1]?.rpcId).toBe(first[1]?.rpcId) // stable rpcId across replays (host replay semantics)
+    expect(first[1]?.payload).toMatchObject({ type: 'session/title', sessionId: 'fx-alpha', title: 'Fixture 历史会话' })
+    expect(first[2]?.payload).toMatchObject({ type: 'approval/requested', toolName: 'dangerous_tool' })
+    expect(second[2]?.rpcId).toBe(first[2]?.rpcId) // stable rpcId across replays (host replay semantics)
+    expect(first[3]?.payload).toMatchObject({ type: 'question/requested', sessionId: 'fx-alpha' })
+    expect(second[3]?.rpcId).toBe(first[3]?.rpcId)
  })

  it('steer with no replay in flight falls through to a fresh queued turn; non-text blocks stringify empty', async () => {
@@ -217,9 +221,38 @@ describe('createFixtureApi', () => {
    }
  })

-  it('respond is a typed stub: always not-pending', async () => {
+  it('respond resolves the resident question once and rejects duplicate or unrelated ids', async () => {
    const api = createFixtureApi()
    expect(await api.respond({ type: 'client-response', rpcId: RpcId('x'), result: { ok: true, value: {} } })).toEqual({ accepted: false, reason: 'not-pending' })
+    const abort = new AbortController()
+    let question: RpcRequest<MuxFrame> | undefined
+    for await (const envelope of api.events.mux(req({}), abort.signal)) {
+      if (envelope.payload.type !== 'question/requested') continue
+      question = envelope
+      abort.abort()
+    }
+    if (question === undefined) throw new Error('fixture question missing')
+    const response = { type: 'client-response' as const, rpcId: question.rpcId, result: { ok: true as const, value: {} } }
+    expect(await api.respond(response)).toEqual({ accepted: true })
+    expect(await api.respond(response)).toEqual({ accepted: false, reason: 'not-pending' })
+
+    const replayAbort = new AbortController()
+    const replayed = await collect(api.events.mux(req({}), replayAbort.signal), replayAbort, frames => frames.length === 2)
+    expect(replayed.every(frame => frame.type !== 'question/requested')).toBe(true)
+
+    const cancelledApi = createFixtureApi()
+    const cancelAbort = new AbortController()
+    let cancelQuestion: RpcRequest<MuxFrame> | undefined
+    for await (const envelope of cancelledApi.events.mux(req({}), cancelAbort.signal)) {
+      if (envelope.payload.type !== 'question/requested') continue
+      cancelQuestion = envelope
+      cancelAbort.abort()
+    }
+    if (cancelQuestion === undefined) throw new Error('fixture cancellation question missing')
+    expect(await cancelledApi.respond({
+      type: 'client-response', rpcId: cancelQuestion.rpcId,
+      result: { ok: false, error: { code: 'cancelled', message: 'skip', details: {} } },
+    })).toEqual({ accepted: true })
  })

  it('describe answers the fixture identity', async () => {
@@ -248,10 +281,15 @@ describe('createFixtureApi', () => {
    await new Promise(resolve => setTimeout(resolve, 10))
    hooks.appendSilent('fx-alpha', '静默丢帧')
    hooks.appendUser('fx-alpha', '正常直播')
+    hooks.appendTitle('fx-alpha', 'Fixture 修订标题')
    await vi.waitFor(() => {
      expect(seen.some(f => f.type === 'session/event' && JSON.stringify(f.event.data).includes('正常直播'))).toBe(true)
+      expect(seen.some(f => f.type === 'session/title' && f.title === 'Fixture 修订标题')).toBe(true)
    })
    expect(seen.some(f => f.type === 'session/event' && JSON.stringify(f.event.data).includes('静默丢帧'))).toBe(false)
+    const rawTitleIndex = seen.findIndex(f => f.type === 'session/event' && (f.event as { type: string }).type === 'session/title')
+    const titleControlIndex = seen.findIndex(f => f.type === 'session/title' && f.title === 'Fixture 修订标题')
+    expect(titleControlIndex).toBe(rawTitleIndex + 1)
    // But history serves the silent event (the client's repull finds it).
    const repull = await api.sessions.history(req({ sessionId: sid('fx-alpha'), maxMessages: 5 }))
    if (!repull.result.ok) throw new Error('repull failed')
--- a/packages/client/runtime/README.md
+++ b/packages/client/runtime/README.md
@@ -2,6 +2,10 @@

 Client cordis boot + core services: SlotsService (Service wrapper over SlotCore + 'slots/changed' bridge), SessionsService (list store projection, scope tree, bindings, ancestry), the Session object layer (exported as a type; instances are owned and handed out by SessionsService — the manager/paging internals stay package-internal, tests reach them via src), ClientLoader (`./loader` subpath, statically held by the shell). Contract: api-contracts v3 §4.

+## Session title projection
+
+`SessionManager` retains the latest validated `session/title` control snapshot independently of list and session-instance arrival. Newer event seqs replace older snapshots, title timestamps contribute to list recency, and a subscription baseline discards any retained title beyond its `lastSeq` before the optional folded title arrives. Explicit session removal also clears the retained title. The client-facing `SessionSummary.title` is therefore only the actual durable title; `displayTitle` is always present and falls back through the cwd basename and session id. A cold persisted session keeps that fallback until opening or resuming it causes the host to fold and project its log-backed title.
+
 ## Model Experience

 None, as the client runtime hosts browser-side services and the session object layer; nothing here reaches a model request.
@@ -15,4 +19,3 @@ None; this package neither assembles nor sends a provider request.
 - **`loader.unload` is a stub (throws not-implemented)** — the full chain (fiber dispose → registration cascade → style removal) lands with the HMR project.
 - **Scope teardown is stage-driven, single-occupant today** — the staged session follows `list.current` exactly (staging is the open signal: the event window opens ⟺ the session is on stage); a removed-while-staged session's scope survives frozen until the stage moves on, not until true observer count reaches zero. Resolution (`cell()`/`binding()`/`scope()`) is pure addressing, render-safe. The staged state can widen to a multi-pane list when concurrent panes land.
 - **Value imports of this package from plugin bundles must use the `/client` subpath** — the bare package name is not in the loader externals table and inlines a second module instance, whose private scope-tag Symbol never matches (the empty-state P0 postmortem).
- **`SessionSummary.title` is a display projection** — the wire summary carries no title yet; the cwd basename stands in, then the raw id.
--- a/packages/client/runtime/src/client/sessions/lineage.ts
+++ b/packages/client/runtime/src/client/sessions/lineage.ts
@@ -4,9 +4,15 @@

 import type { SessionId, SessionSummary } from '@deepseek-ai/dsh-client-connection/client'

+/** Host list summary enriched with the latest mux-projected durable title. */
+export interface TitledSessionSummary extends SessionSummary {
+  title?: string
+}
+
 /** One flattened session-list row (summary + lineage indent depth). */
 export interface SessionListEntry {
  sessionId: SessionId
+  title?: string
  updatedAt: number
  running: boolean
  parentSessionId?: SessionId
@@ -21,12 +27,12 @@ export interface SessionListEntry {
 * @param summaries - the host's session.list items.
 * @returns display rows in render order.
 */
-export function flattenLineage(summaries: readonly SessionSummary[]): SessionListEntry[] {
-  const byId = new Map<SessionId, SessionSummary>()
+export function flattenLineage(summaries: readonly TitledSessionSummary[]): SessionListEntry[] {
+  const byId = new Map<SessionId, TitledSessionSummary>()
  for (const s of summaries) byId.set(s.sessionId, s)

-  const children = new Map<SessionId, SessionSummary[]>()
-  const roots: SessionSummary[] = []
+  const children = new Map<SessionId, TitledSessionSummary[]>()
+  const roots: TitledSessionSummary[] = []
  for (const s of summaries) {
    if (s.parentSessionId !== undefined && byId.has(s.parentSessionId)) {
      const list = children.get(s.parentSessionId) ?? []
@@ -37,12 +43,12 @@ export function flattenLineage(summaries: readonly SessionSummary[]): SessionLis
    }
  }

-  const byUpdatedDesc = (a: SessionSummary, b: SessionSummary): number => b.updatedAt - a.updatedAt
+  const byUpdatedDesc = (a: TitledSessionSummary, b: TitledSessionSummary): number => b.updatedAt - a.updatedAt
  roots.sort(byUpdatedDesc)

  const out: SessionListEntry[] = []
  const visited = new Set<SessionId>()
-  const walk = (s: SessionSummary, depth: number): void => {
+  const walk = (s: TitledSessionSummary, depth: number): void => {
    if (visited.has(s.sessionId)) {
      console.warn(`[web-runtime] lineage cycle at ${s.sessionId}; emitting as root`)
      return
--- a/packages/client/runtime/src/client/sessions/manager.ts
+++ b/packages/client/runtime/src/client/sessions/manager.ts
@@ -4,7 +4,7 @@

 import type { IApiClient, HostFrame, MuxFrame, RpcError, RpcRequest, RpcResult, SessionId, SessionSummary } from '@deepseek-ai/dsh-client-connection/client'
 import { transportError } from '@deepseek-ai/dsh-client-connection/client'
-import type { SessionListEntry } from './lineage.ts'
+import type { SessionListEntry, TitledSessionSummary } from './lineage.ts'
 import { flattenLineage } from './lineage.ts'
 import { Notifier } from './notifier.ts'
 import { Session } from './session.ts'
@@ -19,6 +19,13 @@ export interface SessionListSnapshot {
 /** Per-session cap for pre-instantiation approval/question buffering (low-frequency frames; a few dozen covers any real backlog). */
 const PENDING_BUFFER_CAP = 32

+/** Latest title control snapshot retained independently of list/instance arrival. */
+interface SessionTitleSnapshot {
+  title: string
+  eventSeq: number
+  updatedAt: number
+}
+
 /** Instance cluster + frame entry + the session list (see the web client architecture RFC). */
 export class SessionManager {
  private readonly sessions = new Map<SessionId, Session>()
@@ -27,6 +34,7 @@ export class SessionManager {
   *  drop-and-backfill path; replayed and cleared on instantiation. Bounded per session (these
   *  frames are low-frequency; overflow drops oldest) and dropped on session-removed (audit S7). */
  private readonly pendingBuffers = new Map<SessionId, RpcRequest<MuxFrame>[]>()
+  private readonly titleSnapshots = new Map<SessionId, SessionTitleSnapshot>()
  private summaries: SessionSummary[] = []
  private listState: 'idle' | 'loading' | 'error' = 'idle'
  private listError: RpcError | null = null
@@ -158,6 +166,24 @@ export class SessionManager {
  handleMuxEnvelope(envelope: RpcRequest<MuxFrame>): void {
    const frame = envelope.payload
    if (frame.type === 'stream/error') return // Controller already treats this as stream failure
+    if (frame.type === 'session/title') {
+      const current = this.titleSnapshots.get(frame.sessionId)
+      if (current !== undefined && current.eventSeq >= frame.eventSeq) return
+      this.titleSnapshots.set(frame.sessionId, {
+        title: frame.title,
+        eventSeq: frame.eventSeq,
+        updatedAt: frame.updatedAt,
+      })
+      this.notifier.markDirty()
+      return
+    }
+    if (frame.type === 'session/subscribed') {
+      const current = this.titleSnapshots.get(frame.sessionId)
+      if (current !== undefined && current.eventSeq > frame.lastSeq) {
+        this.titleSnapshots.delete(frame.sessionId)
+        this.notifier.markDirty()
+      }
+    }
    const session = this.sessions.get(frame.sessionId)
    if (session === undefined) {
      // Approval/question frames never hit history: buffer for replay on instantiation;
@@ -204,6 +230,7 @@ export class SessionManager {
        this.summaries = this.summaries.filter(s => s.sessionId !== frame.sessionId)
        this.sessions.get(frame.sessionId)?.handleRemoved() // instance survives (resident-instance rule), only flagged in the snapshot
        this.pendingBuffers.delete(frame.sessionId) // a removed session's buffered frames must not replay on a future instantiation
+        this.titleSnapshots.delete(frame.sessionId)
        this.notifier.markDirty()
        return
      }
@@ -230,12 +257,19 @@ export class SessionManager {
  }

  private buildListSnapshot(): SessionListSnapshot {
-    const fresh = flattenLineage(this.summaries)
+    const merged: TitledSessionSummary[] = this.summaries.map((summary) => {
+      const title = this.titleSnapshots.get(summary.sessionId)
+      return title === undefined
+        ? summary
+        : { ...summary, title: title.title, updatedAt: Math.max(summary.updatedAt, title.updatedAt) }
+    })
+    const fresh = flattenLineage(merged)
    const items = fresh.map((entry) => {
      const prev = this.entryCache.get(entry.sessionId)
      if (
        prev !== undefined && prev.updatedAt === entry.updatedAt && prev.running === entry.running
-        && prev.parentSessionId === entry.parentSessionId && prev.cwd === entry.cwd && prev.depth === entry.depth
+        && prev.parentSessionId === entry.parentSessionId && prev.cwd === entry.cwd
+        && prev.title === entry.title && prev.depth === entry.depth
      ) return prev
      this.entryCache.set(entry.sessionId, entry)
      return entry
--- a/packages/client/runtime/src/client/sessions/service.ts
+++ b/packages/client/runtime/src/client/sessions/service.ts
@@ -25,7 +25,10 @@ import type { Session } from './session.ts'
 /** Session list row projected from the host list RPC plus live stream increments. */
 export interface SessionSummary {
  id: SessionId
-  title: string
+  /** Latest durable log-backed title, absent until the host projects one. */
+  title?: string
+  /** Human-facing label: durable title, project basename, then session id. */
+  displayTitle: string
  cwd?: string
  parentId?: SessionId
  running: boolean
@@ -62,10 +65,11 @@ export function scopeOf(ctx: Context): SessionId | undefined {
 function sessionScope(): void {}

 /**
- * Display title projection. The wire summary carries no title yet (P-I
- * ledger): the project directory's basename stands in, then the raw id.
+ * Display title projection: durable title, project directory basename, then
+ * the raw id.
 */
-function titleOf(cwd: string | undefined, id: SessionId): string {
+function displayTitleOf(title: string | undefined, cwd: string | undefined, id: SessionId): string {
+  if (title !== undefined) return title
  if (cwd !== undefined && cwd !== '') {
    const base = cwd.replace(/[/\\]+$/, '').split(/[/\\]/).pop()
    if (base !== undefined && base !== '') return base
@@ -259,9 +263,10 @@ export class SessionsService {
      ids.push(entry.sessionId)
      byId[entry.sessionId] = {
        id: entry.sessionId,
-        title: titleOf(entry.cwd, entry.sessionId),
+        displayTitle: displayTitleOf(entry.title, entry.cwd, entry.sessionId),
        running: entry.running,
        updatedAt: entry.updatedAt,
+        ...(entry.title !== undefined ? { title: entry.title } : {}),
        ...(entry.cwd !== undefined ? { cwd: entry.cwd } : {}),
        ...(entry.parentSessionId !== undefined ? { parentId: entry.parentSessionId } : {}),
      }
--- a/packages/client/runtime/tests/manager.spec.ts
+++ b/packages/client/runtime/tests/manager.spec.ts
@@ -89,6 +89,66 @@ describe('list lifecycle', () => {
    expect(result).toMatchObject({ ok: true, value: { sessionId: S2 } })
    expect(manager.getListSnapshot().items.map(i => i.sessionId)).toEqual([S2])
  })
+
+  it('retains monotonic title snapshots before list arrival, merges recency, and clears them on removal', async () => {
+    const api = new FakeApiClient()
+    const manager = new SessionManager(api)
+    manager.handleMuxEnvelope({
+      rpcId: 'title-new' as never,
+      payload: { type: 'session/title', sessionId: S1, title: 'Newest', eventSeq: 4, updatedAt: 300 },
+    })
+    manager.handleMuxEnvelope({
+      rpcId: 'title-stale' as never,
+      payload: { type: 'session/title', sessionId: S1, title: 'Stale', eventSeq: 3, updatedAt: 900 },
+    })
+    manager.handleMuxEnvelope({
+      rpcId: 'title-equal' as never,
+      payload: { type: 'session/title', sessionId: S1, title: 'Equal', eventSeq: 4, updatedAt: 901 },
+    })
+    api.onList = () => Promise.resolve(ok({
+      items: [summary(S1), summary(S2, { updatedAt: 200 })] as never[],
+    }))
+    await manager.refreshList()
+
+    const titled = manager.getListSnapshot()
+    expect(titled.items.map(item => item.sessionId)).toEqual([S1, S2])
+    expect(titled.items[0]).toMatchObject({ title: 'Newest', updatedAt: 300 })
+    expect(titled.items[1]?.title).toBeUndefined()
+
+    manager.handleHostEnvelope({ rpcId: 'removed' as never, payload: { type: 'host/session-removed', sessionId: S1 } })
+    manager.handleHostEnvelope({ rpcId: 'readded' as never, payload: { type: 'host/session-added', sessionId: S1 } })
+    expect(manager.getListSnapshot().items.find(item => item.sessionId === S1)?.title).toBeUndefined()
+  })
+
+  it('drops a retained title beyond the subscription baseline before accepting its durable replay', async () => {
+    const api = new FakeApiClient()
+    api.onList = () => Promise.resolve(ok({ items: [summary(S1)] as never[] }))
+    const manager = new SessionManager(api)
+    await manager.refreshList()
+    manager.handleMuxEnvelope({
+      rpcId: 'title-unflushed' as never,
+      payload: { type: 'session/title', sessionId: S1, title: 'Unflushed', eventSeq: 4, updatedAt: 400 },
+    })
+
+    manager.handleMuxEnvelope({
+      rpcId: 'subscribed-recovered' as never,
+      payload: { type: 'session/subscribed', sessionId: S1, lastSeq: 2 },
+    })
+    expect(manager.getListSnapshot().items[0]?.title).toBeUndefined()
+    expect(manager.getListSnapshot().items[0]?.updatedAt).toBe(100)
+
+    manager.handleMuxEnvelope({
+      rpcId: 'title-durable' as never,
+      payload: { type: 'session/title', sessionId: S1, title: 'Durable', eventSeq: 2, updatedAt: 200 },
+    })
+    expect(manager.getListSnapshot().items[0]).toMatchObject({ title: 'Durable', updatedAt: 200 })
+
+    manager.handleMuxEnvelope({
+      rpcId: 'subscribed-current' as never,
+      payload: { type: 'session/subscribed', sessionId: S1, lastSeq: 2 },
+    })
+    expect(manager.getListSnapshot().items[0]).toMatchObject({ title: 'Durable', updatedAt: 200 })
+  })
 })

 describe('host frame routing', () => {
--- a/packages/client/runtime/tests/sessions-service.spec.ts
+++ b/packages/client/runtime/tests/sessions-service.spec.ts
@@ -41,16 +41,21 @@ async function feedList(b: Bench, rows: { id: string; cwd?: string; parentId?: s
 }

 describe('list store projection', () => {
-  it('projects ids/byId with cwd-basename titles (id fallback) and parent links', async () => {
+  it('projects durable titles separately from cwd/id display fallbacks and parent links', async () => {
    const b = bench()
+    b.svc.manager.handleMuxEnvelope({
+      rpcId: 'title' as never,
+      payload: { type: 'session/title', sessionId: sid('s1'), title: 'Durable title', eventSeq: 2, updatedAt: 3 },
+    })
    await feedList(b, [
      { id: 's1', cwd: '/home/u/proj-a/' },
      { id: 's2', parentId: 's1', running: true },
    ])
    const state = b.svc.list.getSnapshot()
    expect(state.ids).toEqual(['s1', 's2'])
-    expect(state.byId[sid('s1')]).toMatchObject({ title: 'proj-a', cwd: '/home/u/proj-a/' })
-    expect(state.byId[sid('s2')]).toMatchObject({ title: 's2', parentId: 's1', running: true })
+    expect(state.byId[sid('s1')]).toMatchObject({ title: 'Durable title', displayTitle: 'Durable title', cwd: '/home/u/proj-a/' })
+    expect(state.byId[sid('s2')]).toMatchObject({ displayTitle: 's2', parentId: 's1', running: true })
+    expect(state.byId[sid('s2')]?.title).toBeUndefined()
  })

  it('reflects live increments (host stream via manager) into the store', async () => {
@@ -273,12 +278,13 @@ describe('create', () => {
 })

 describe('coverage tails (branch duals)', () => {
-  it('titleOf falls back to the id for empty and separator-only cwd', async () => {
+  it('displayTitleOf falls back to the id for empty and separator-only cwd', async () => {
    const b = bench()
    await feedList(b, [{ id: 'no-base', cwd: '///' }, { id: 'empty-cwd', cwd: '' }])
    const { byId } = b.svc.list.getSnapshot()
-    expect(byId[sid('no-base')]?.title).toBe('no-base')
-    expect(byId[sid('empty-cwd')]?.title).toBe('empty-cwd')
+    expect(byId[sid('no-base')]?.displayTitle).toBe('no-base')
+    expect(byId[sid('empty-cwd')]?.displayTitle).toBe('empty-cwd')
+    expect(byId[sid('no-base')]?.title).toBeUndefined()
  })

  it('binding for an unknown session returns undefined and leaves the staged scope intact', async () => {
--- a/packages/client/ui-conversation/README.md
+++ b/packages/client/ui-conversation/README.md
@@ -26,4 +26,4 @@ None; this package neither assembles nor sends a provider request.
 - **Details panel is the minimal form** — selected call args/result raw display; the Input/Output/Metadata switch, Prev/Next stepping, and See-in-trajectory deep link are deferred.
 - **Assistant footer extensions (IconActions row, per-message paging) are reserved slots** — drawn in the design, not implemented.
 - **The sparkle icon for the others tool row is a hand-drawn approximation** — the design glyph's vector geometry is not exportable locally; promotion into ui-primitives waits on an exact export.
- **Approval/question cards are display-only placeholders** — web-side answering (composer takeover panel) is the P-II approvals project.
+- **Approval cards are display-only placeholders** — question requests answer through the composer chain (ui-question), while web-side approval answering is the P-II approvals project.
--- a/packages/client/ui-conversation/src/client/index.ts
+++ b/packages/client/ui-conversation/src/client/index.ts
@@ -18,8 +18,8 @@ export type {
 } from './contract/views.ts'
 export type { ToolCallBlock } from './contract/tool-call-model.ts'
 export type {
-  ChatStore, ChatViewInjected, ChatViewSlotProps, ConversationInjected, ConversationSlotProps,
-  ConvViewOwnerProps, ConvViewProps, DetailsInjected, DetailsSlotProps,
+  ChatStore, ChatViewInjected, ChatViewSlotProps, ComposerChainProps, ConversationInjected,
+  ConversationSlotProps, ConvViewOwnerProps, ConvViewProps, DetailsInjected, DetailsSlotProps,
  EmptyStateInjected, EmptyStateSlotProps, ToolRowOwnerProps, ToolRowProps,
 } from './contract/slots.ts'
 // Export discipline: packages/client/AGENTS.md.
--- a/packages/client/ui-conversation/src/client/skeleton/ConversationRoot.tsx
+++ b/packages/client/ui-conversation/src/client/skeleton/ConversationRoot.tsx
@@ -90,7 +90,7 @@ export function ConversationRoot({
                    disabled={last}
                    onClick={() => { open(s.id) }}
                  >
-                    {s.title}
+                    {s.displayTitle}
                  </button>
                </span>
              )
--- a/packages/client/ui-conversation/tests/apply-inject.spec.tsx
+++ b/packages/client/ui-conversation/tests/apply-inject.spec.tsx
@@ -51,7 +51,7 @@ async function bench() {

  const listStore = createSnapshotStore<SessionListState>({
    ids: [ROOT],
-    byId: { [ROOT]: { id: ROOT, title: 'R', cwd: '/proj', running: false, updatedAt: 1 } },
+    byId: { [ROOT]: { id: ROOT, title: 'R', displayTitle: 'R', cwd: '/proj', running: false, updatedAt: 1 } },
    current: ROOT,
  } as SessionListState)
  const sessionFake = {
--- a/packages/client/ui-conversation/tests/chat-apply.spec.tsx
+++ b/packages/client/ui-conversation/tests/chat-apply.spec.tsx
@@ -26,8 +26,8 @@ async function bench() {
  const listStore = createSnapshotStore<SessionListState>({
    ids: [ROOT, CHILD],
    byId: {
-      [ROOT]: { id: ROOT, title: 'R', running: false, updatedAt: 1 },
-      [CHILD]: { id: CHILD, title: 'C', parentId: ROOT, running: false, updatedAt: 2 },
+      [ROOT]: { id: ROOT, title: 'R', displayTitle: 'R', running: false, updatedAt: 1 },
+      [CHILD]: { id: CHILD, title: 'C', displayTitle: 'C', parentId: ROOT, running: false, updatedAt: 2 },
    },
    current: undefined,
  } as SessionListState)
--- a/packages/client/ui-conversation/tests/chat-stats-bash-sample.spec.tsx
+++ b/packages/client/ui-conversation/tests/chat-stats-bash-sample.spec.tsx
@@ -122,8 +122,8 @@ describe('bash sample row', () => {
    return createSnapshotStore<SessionListState>({
      ids: [ROOT, CHILD],
      byId: {
-        [ROOT]: { id: ROOT, title: 'r', running: false, updatedAt: 0 },
-        [CHILD]: { id: CHILD, title: 'c', parentId: ROOT, running: false, updatedAt: 0 },
+        [ROOT]: { id: ROOT, title: 'r', displayTitle: 'r', running: false, updatedAt: 0 },
+        [CHILD]: { id: CHILD, title: 'c', displayTitle: 'c', parentId: ROOT, running: false, updatedAt: 0 },
      },
      current: undefined,
    } as SessionListState)
@@ -157,7 +157,7 @@ describe('bash sample row', () => {
    const orphan = 'late-child' as SessionId
    store.update((d) => {
      d.ids.push(orphan)
-      d.byId[orphan] = { id: orphan, title: 'l', running: false, updatedAt: 0 }
+      d.byId[orphan] = { id: orphan, title: 'l', displayTitle: 'l', running: false, updatedAt: 0 }
    })
    const view = render(<BashRow {...rowProps(orphan, { store })} />)
    expect(view.container.querySelector('[data-sample="bash-global"]')).not.toBeNull()
--- a/packages/client/ui-conversation/tests/selection-survival.spec.ts
+++ b/packages/client/ui-conversation/tests/selection-survival.spec.ts
@@ -123,23 +123,25 @@ describe('selection survives on the store seat', () => {
    expect(two.store.getSnapshot().selection).toEqual({ turnSeq: 9, callId: 'z' })
  })

-  it('a title-upgrading list refresh keeps instance identity and the selection value', async () => {
+  it('a display-title-upgrading list refresh keeps instance identity and the selection value', async () => {
    const b = bench()
    // First-send shape: client-side create inserts the row without cwd (title = bare id).
    b.api.onCreate = () => Promise.resolve(ok({ sessionId: sid('s1') }))
    const id = await b.sessions.create({})
    await flush()
-    expect(b.sessions.list.getSnapshot().byId[id]?.title).toBe('s1')
+    expect(b.sessions.list.getSnapshot().byId[id]).toMatchObject({ displayTitle: 's1' })
+    expect(b.sessions.list.getSnapshot().byId[id]?.title).toBeUndefined()

    const store = storeFor(b, 'conversation', id)
    store.actions.select({ turnSeq: 3, callId: 'c1' })
    store.actions.setDraft('half-typed')

-    // The late list refresh lands (host knows the cwd → formal title).
+    // The late list refresh lands (host knows the cwd → better fallback label).
    feed(b, [{ id: 's1', cwd: '/w/proj-a' }])
    await b.sessions.manager.refreshList()
    await flush()
-    expect(b.sessions.list.getSnapshot().byId[id]?.title).toBe('proj-a')
+    expect(b.sessions.list.getSnapshot().byId[id]).toMatchObject({ displayTitle: 'proj-a' })
+    expect(b.sessions.list.getSnapshot().byId[id]?.title).toBeUndefined()

    const after = storeFor(b, 'conversation', id)
    expect(after).toBe(store)
--- a/packages/client/ui-conversation/tests/skeleton-branches.spec.tsx
+++ b/packages/client/ui-conversation/tests/skeleton-branches.spec.tsx
@@ -46,7 +46,7 @@ function listHook(rows: { id: string; title: string; cwd?: string; parentId?: st
  const store = createSnapshotStore<SessionListState>({
    ids: rows.map(r => r.id as SessionId),
    byId: Object.fromEntries(rows.map(r => [r.id, {
-      id: r.id as SessionId, title: r.title, running: false, updatedAt: 1,
+      id: r.id as SessionId, title: `durable ${r.title}`, displayTitle: r.title, running: false, updatedAt: 1,
      ...(r.cwd !== undefined ? { cwd: r.cwd } : {}),
      ...(r.parentId !== undefined ? { parentId: r.parentId as SessionId } : {}),
    }])),
--- a/packages/client/ui-conversation/tests/skeleton.spec.tsx
+++ b/packages/client/ui-conversation/tests/skeleton.spec.tsx
@@ -53,7 +53,7 @@ function fakeSessions(rows: { id: string; title: string; cwd?: string; parentId?
  const store = createSnapshotStore<SessionListState>({
    ids: rows.map(r => sid(r.id)),
    byId: Object.fromEntries(rows.map(r => [r.id, {
-      id: sid(r.id), title: r.title, running: false, updatedAt: 1,
+      id: sid(r.id), title: `durable ${r.title}`, displayTitle: r.title, running: false, updatedAt: 1,
      ...(r.cwd !== undefined ? { cwd: r.cwd } : {}),
      ...(r.parentId !== undefined ? { parentId: sid(r.parentId) } : {}),
    }])),
--- a/packages/client/ui-question/README.md
+++ b/packages/client/ui-question/README.md
@@ -0,0 +1,20 @@
+# @deepseek-ai/dsh-client-ui-question
+
+Web `ask_user_question` feature plugin. Its host half mounts `dsh-tool-ask-user` only when the Web feature is selected; its browser half registers the `question` entry in the conversation-owned `conversation.composer` keyed slot.
+
+The component renders one question at a time with progress navigation, single- and multi-select choices, recommendation badges derived from label suffixes, and custom answers. Single-select choices advance immediately, and Enter submits once every question is answered or skipped; Enter during IME composition confirms the input candidate without advancing. It submits one structured answer batch for the whole request: “Skip this question” retains other drafts and emits the existing blank `{ selected: [] }` shape for that item, while close rejects the whole wait as `ASK_CANCELLED`.
+
+Selection state is local to a component keyed by the request rpcId. A replay with the same id preserves a still-mounted draft, while `question/resolved` from the host removes the composer. The host remains authoritative: successful HTTP delivery does not remove pending state locally.
+
+## Model Experience
+
+Indirectly, through `dsh-tool-ask-user`; that package owns the model-visible tool schema and structured result.
+
+#### KV Cache effect
+
+No direct invalidation; `dsh-tool-ask-user` owns the model-visible tool call and result.
+
+## Known Limitations and Deferred Work
+
+- **Unsubmitted drafts are not durable** — reconnect resync or a full page reload restores the host-owned pending request with the same rpcId, but a composer unmount resets local option and custom-text drafts.
+- **One request owns the composer at a time** — later pending requests remain in the session snapshot and become visible after the earlier request resolves.
--- a/packages/client/ui-question/package.json
+++ b/packages/client/ui-question/package.json
@@ -0,0 +1,67 @@
+{
+  "name": "@deepseek-ai/dsh-client-ui-question",
+  "description": "Web ask_user_question feature: host tool mount plus composer-takeover question UI",
+  "version": "0.0.1",
+  "private": true,
+  "type": "module",
+  "main": "lib/index.js",
+  "types": "lib/types/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./lib/types/index.d.ts",
+      "default": "./lib/index.js"
+    },
+    "./invariant": {
+      "types": "./lib/types/invariant.d.ts",
+      "default": "./lib/invariant.js"
+    },
+    "./client": {
+      "types": "./lib/types/client/index.d.ts",
+      "default": "./lib/client.js"
+    },
+    "./src/*": "./src/*",
+    "./package.json": "./package.json"
+  },
+  "dshClient": {
+    "inject": [
+      "@deepseek-ai/dsh-client-ui-conversation"
+    ],
+    "platform": "web"
+  },
+  "scripts": {
+    "bundle": "tsdown",
+    "watch": "tsdown --watch"
+  },
+  "license": "BSD-3-Clause",
+  "dependencies": {
+    "@deepseek-ai/dsh-client-connection": "workspace:^",
+    "@deepseek-ai/dsh-client-runtime": "workspace:^",
+    "@deepseek-ai/dsh-client-ui-conversation": "workspace:^",
+    "@deepseek-ai/dsh-client-ui-primitives": "workspace:^",
+    "@deepseek-ai/dsh-client-ui-slots": "workspace:^",
+    "@deepseek-ai/dsh-tool-ask-user": "workspace:^",
+    "clsx": "^2.0.0",
+    "react": "^18.2.0"
+  },
+  "peerDependencies": {
+    "@deepseek-ai/dsh-invariants": "^0.0.1",
+    "cordis": "^4.0.0-rc.7"
+  },
+  "devDependencies": {
+    "@deepseek-ai/dsh-agent": "workspace:^",
+    "@deepseek-ai/dsh-invariants": "workspace:^",
+    "@deepseek-ai/dsh-system-prompt": "workspace:^",
+    "@deepseek-ai/dsh-tools": "workspace:^",
+    "@deepseek-ai/dsh-user-interaction": "workspace:^",
+    "@types/react": "~18.3.1",
+    "cordis": "^4.0.0-rc.7"
+  },
+  "files": [
+    "lib/index.js",
+    "lib/invariant.js",
+    "lib/client.js",
+    "lib/types/**/*.d.ts",
+    "lib/types/**/*.d.ts.map",
+    "src"
+  ]
+}
--- a/packages/client/ui-question/src/client/QuestionComposer.module.css
+++ b/packages/client/ui-question/src/client/QuestionComposer.module.css
@@ -0,0 +1,348 @@
+.frame {
+  display: flex;
+  justify-content: center;
+  padding: 6px 24px 10px;
+}
+
+.card {
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+  max-width: 720px;
+  /* Composer seat sits in a fixed-height conversation column (overflow
+     hidden): cap the card against the viewport and scroll the option list
+     so header and footer actions stay reachable on long batches. */
+  max-height: min(60vh, 520px);
+  padding: 14px 16px 12px;
+  border: 1px solid var(--dsw-alias-border-l2-darkmode-thin);
+  border-radius: 18px;
+  background: var(--dsw-specific-input-major);
+  box-shadow: var(--dsw-shadow-lv1-blur);
+  color: var(--dsw-alias-label-primary);
+}
+
+.card,
+.card * {
+  box-sizing: border-box;
+}
+
+.header {
+  display: flex;
+  align-items: flex-start;
+  justify-content: space-between;
+  gap: 16px;
+  flex-shrink: 0;
+  margin-bottom: 8px;
+}
+
+.headingBlock {
+  min-width: 0;
+  padding: 1px 2px;
+}
+
+.eyebrow {
+  margin-bottom: 2px;
+  color: var(--dsw-alias-label-tertiary);
+  font-size: 11px;
+  line-height: 16px;
+}
+
+.title {
+  display: flex;
+  align-items: baseline;
+  flex-wrap: wrap;
+  gap: 6px;
+  margin: 0;
+  font-size: 16px;
+  line-height: 22px;
+  font-weight: 600;
+}
+
+.multiSelectHint {
+  color: var(--dsw-alias-label-tertiary);
+  font-size: 14px;
+  line-height: 20px;
+  font-weight: 400;
+  white-space: nowrap;
+}
+
+.detail {
+  margin: 2px 0 0;
+  color: var(--dsw-alias-label-tertiary);
+  font-size: 13px;
+  line-height: 20px;
+  font-weight: 400;
+}
+
+.headerActions,
+.footerActions {
+  display: flex;
+  align-items: center;
+  gap: 4px;
+  flex-shrink: 0;
+}
+
+.progress {
+  padding: 0 6px;
+  color: var(--dsw-alias-label-tertiary);
+  font-size: 12px;
+  line-height: 24px;
+  white-space: nowrap;
+}
+
+.iconButton {
+  display: grid;
+  place-items: center;
+  width: 24px;
+  height: 24px;
+  padding: 0;
+  border: none;
+  border-radius: 999px;
+  background: transparent;
+  color: var(--dsw-alias-label-tertiary);
+  cursor: pointer;
+}
+
+.iconButton:hover:not(:disabled) {
+  background: var(--dsw-alias-interactive-bg-hover);
+  color: var(--dsw-alias-label-primary);
+}
+
+.iconButton:disabled {
+  color: var(--dsw-alias-label-dimmed);
+  cursor: default;
+}
+
+.options {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+  /* The scrollable region of the capped card (ChatView list pattern). */
+  min-height: 0;
+  overflow-y: auto;
+}
+
+.option {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  width: 100%;
+  min-height: 42px;
+  padding: 5px 8px;
+  border: 1px solid transparent;
+  border-radius: 12px;
+  background: transparent;
+  color: inherit;
+  text-align: left;
+  cursor: pointer;
+  transition: background-color 120ms ease, border-color 120ms ease;
+}
+
+.option:hover:not(:disabled),
+.optionSelected {
+  background: var(--dsw-alias-interactive-bg-hover);
+}
+
+.optionSelected {
+  border-color: var(--dsw-alias-border-l2);
+}
+
+.option:disabled,
+.customTrigger:disabled {
+  cursor: default;
+}
+
+.number {
+  display: grid;
+  place-items: center;
+  flex: 0 0 28px;
+  width: 28px;
+  height: 28px;
+  border: 1px solid var(--dsw-alias-border-l2);
+  border-radius: 999px;
+  background: var(--dsw-alias-bg-module-platform);
+  color: var(--dsw-alias-label-tertiary);
+  font-size: 12px;
+  line-height: 18px;
+}
+
+.optionCopy {
+  min-width: 0;
+  flex: 1;
+}
+
+.optionLine {
+  display: flex;
+  align-items: baseline;
+  flex-wrap: wrap;
+  gap: 2px 6px;
+}
+
+.optionLabel {
+  font-size: 14px;
+  line-height: 20px;
+  font-weight: 600;
+}
+
+.badge {
+  padding: 0 6px;
+  border-radius: 999px;
+  background: var(--dsw-alias-bg-module-platform);
+  color: var(--dsw-alias-label-secondary);
+  font-size: 11px;
+  line-height: 18px;
+}
+
+.description {
+  color: var(--dsw-alias-label-tertiary);
+  font-size: 13px;
+  line-height: 20px;
+  font-weight: 400;
+}
+
+.choiceIcon {
+  display: grid;
+  place-items: center;
+  width: 20px;
+  color: var(--dsw-alias-label-tertiary);
+}
+
+.custom {
+  border: 1px solid transparent;
+  border-radius: 12px;
+}
+
+.customOpen {
+  border-color: var(--dsw-alias-border-l2);
+  background: var(--dsw-alias-bg-module-platform);
+}
+
+.customOptionless {
+  border: none;
+  background: transparent;
+}
+
+.customTrigger {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  width: 100%;
+  min-height: 42px;
+  padding: 5px 8px;
+  border: none;
+  background: transparent;
+  color: var(--dsw-alias-label-tertiary);
+  font-size: 14px;
+  line-height: 20px;
+  text-align: left;
+  cursor: pointer;
+}
+
+.customTrigger:hover:not(:disabled) {
+  color: var(--dsw-alias-label-primary);
+}
+
+.customInput {
+  display: block;
+  width: calc(100% - 20px);
+  min-height: 54px;
+  max-height: 140px;
+  margin: 0 10px 10px;
+  padding: 7px 10px;
+  resize: vertical;
+  border: 1px solid var(--dsw-alias-border-l2);
+  border-radius: 10px;
+  outline: none;
+  background: var(--dsw-specific-input-major);
+  color: var(--dsw-alias-label-primary);
+  caret-color: var(--dsw-alias-state-business-primary);
+  font: inherit;
+  font-size: 13px;
+  line-height: 20px;
+}
+
+.customInput:focus {
+  border-color: var(--dsw-alias-state-business-primary);
+}
+
+.customInput::placeholder {
+  color: var(--dsw-alias-label-caption);
+}
+
+.customOptionless .customInput {
+  width: 100%;
+  min-height: 58px;
+  margin: 0;
+  background: var(--dsw-alias-bg-module-platform);
+}
+
+.footer {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 12px;
+  flex-shrink: 0;
+  margin-top: 8px;
+  padding: 0 2px;
+}
+
+.feedback {
+  min-height: 16px;
+  color: var(--dsw-alias-state-error-primary);
+  font-size: 11px;
+  line-height: 16px;
+}
+
+@media (max-width: 720px) {
+  .frame {
+    padding: 6px 10px 10px;
+  }
+
+  .card {
+    padding: 12px 10px 10px;
+    border-radius: 16px;
+  }
+
+  .header {
+    display: block;
+  }
+
+  .headerActions {
+    justify-content: flex-end;
+    margin-top: 8px;
+  }
+
+  .headingBlock {
+    padding: 0 2px;
+  }
+
+  .title {
+    font-size: 15px;
+    line-height: 21px;
+  }
+
+  .option,
+  .customTrigger {
+    align-items: flex-start;
+    gap: 8px;
+    padding: 6px;
+  }
+
+  .choiceIcon {
+    margin-top: 3px;
+  }
+
+  .footer {
+    align-items: flex-end;
+  }
+
+  .footerActions {
+    flex-shrink: 0;
+  }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .option {
+    transition: none;
+  }
+}
--- a/packages/client/ui-question/src/client/QuestionComposer.tsx
+++ b/packages/client/ui-question/src/client/QuestionComposer.tsx
@@ -0,0 +1,297 @@
+import { useMemo, useState, type KeyboardEvent } from 'react'
+import clsx from 'clsx'
+import {
+  Button, IconCheckOutline16, IconChevronLeftOutline14, IconChevronRightOutline14,
+  IconCloseOutline16, IconEditOutline16,
+} from '@deepseek-ai/dsh-client-ui-primitives'
+import { PendingQuestion, type QuestionAnswer, type QuestionComposerProps } from './contract/slots.ts'
+import css from './QuestionComposer.module.css'
+
+interface DraftAnswer {
+  selected: string[]
+  custom: string
+  customOpen: boolean
+  skipped: boolean
+}
+
+/**
+ * Split the conventional recommendation suffix without changing the answer value.
+ * @param label - Original option label returned if selected.
+ * @returns Display label plus recommendation state.
+ */
+export function parseRecommendedLabel(label: string): { label: string; recommended: boolean } {
+  const suffix = /\s*(?:\((?:recommended|推荐)\)|（(?:recommended|推荐)）)\s*$/i
+  return suffix.test(label)
+    ? { label: label.replace(suffix, ''), recommended: true }
+    : { label, recommended: false }
+}
+
+/**
+ * Remove a conventional multi-select suffix so the hint can be styled separately.
+ * @param title - Question title supplied by the interaction request.
+ * @returns Question title without a trailing multi-select marker.
+ */
+export function parseQuestionTitle(title: string): string {
+  return title.replace(/\s*[（(]可多选[）)]\s*$/, '')
+}
+
+/** Return whether a textarea key event belongs to an active IME composition. */
+function isComposing(event: KeyboardEvent<HTMLTextAreaElement>): boolean {
+  return event.nativeEvent.isComposing || event.nativeEvent.keyCode === 229
+}
+
+/**
+ * Composer takeover boundary; the carrier key keys local drafts, so a
+ * same-request replay (same key, new carrier object) preserves them.
+ * @param props - the selector-matched pending question carrier plus the framework standard kit.
+ * @returns The question flow for this request.
+ */
+export function QuestionComposer(props: QuestionComposerProps) {
+  // Domain-face mint rides the carrier's stable identity (never minted in a
+  // select/render dispatch — per-dispatch minting would churn memo identity).
+  const question = useMemo(() => new PendingQuestion(props.matched), [props.matched])
+  return <QuestionFlow key={question.key} pending={question} />
+}
+
+function QuestionFlow({ pending }: { pending: PendingQuestion }) {
+  const questions = pending.questions
+  const [index, setIndex] = useState(0)
+  const [drafts, setDrafts] = useState<DraftAnswer[]>(() => questions.map(question => ({
+    selected: [], custom: '', customOpen: (question.options?.length ?? 0) === 0, skipped: false,
+  })))
+  const [busy, setBusy] = useState<'answer' | 'cancel' | null>(null)
+  const [error, setError] = useState<string | null>(null)
+  const question = questions[index]!
+  const draft = drafts[index]!
+  const hasOptions = (question.options?.length ?? 0) > 0
+
+  const cancelFlow = (): void => {
+    setBusy('cancel')
+    setError(null)
+    void pending.cancel().catch((cause: unknown) => {
+      setBusy(null)
+      setError(cause instanceof Error ? cause.message : String(cause))
+    })
+  }
+
+  const updateDraft = (update: (current: DraftAnswer) => DraftAnswer): void => {
+    setDrafts(current => current.map((item, itemIndex) => itemIndex === index ? update(item) : item))
+    setError(null)
+  }
+
+  const choose = (label: string): void => {
+    updateDraft((current) => {
+      const selected = question.multiSelect === true
+        ? current.selected.includes(label)
+          ? current.selected.filter(item => item !== label)
+          : [...current.selected, label]
+        : [label]
+      return { selected, custom: '', customOpen: false, skipped: false }
+    })
+    if (question.multiSelect !== true && index < questions.length - 1) {
+      setIndex(current => current + 1)
+    }
+  }
+
+  const openCustom = (): void => {
+    updateDraft(current => ({ ...current, selected: [], customOpen: true, skipped: false }))
+  }
+
+  const answered = (item: DraftAnswer): boolean =>
+    item.selected.length > 0 || item.custom.trim() !== ''
+
+  const completed = (item: DraftAnswer): boolean => answered(item) || item.skipped
+
+  const submitDrafts = (values: DraftAnswer[]): void => {
+    const missing = values.findIndex(item => !completed(item))
+    if (missing >= 0) {
+      setIndex(missing)
+      setError('请先完成这道问题。')
+      return
+    }
+    const answer: QuestionAnswer = {
+      answers: questions.map((item, itemIndex) => {
+        const value = values[itemIndex] as DraftAnswer
+        if (value.skipped) return { id: item.id, selected: [] }
+        const custom = value.custom.trim()
+        return {
+          id: item.id,
+          selected: custom === '' ? value.selected : [],
+          ...(custom === '' ? {} : { custom }),
+        }
+      }),
+    }
+    setBusy('answer')
+    setError(null)
+    void pending.answer(answer).catch((cause: unknown) => {
+      setBusy(null)
+      setError(cause instanceof Error ? cause.message : String(cause))
+    })
+  }
+
+  const continueFlow = (): void => {
+    if (!answered(draft)) {
+      setError('请选择一个选项或填写自定义答案。')
+      return
+    }
+    if (index < questions.length - 1) {
+      setIndex(current => current + 1)
+      setError(null)
+      return
+    }
+    submitDrafts(drafts)
+  }
+
+  const skipQuestion = (): void => {
+    const nextDrafts = drafts.map((item, itemIndex) => itemIndex === index
+      ? {
+          selected: [], custom: '',
+          customOpen: (question.options?.length ?? 0) === 0,
+          skipped: true,
+        }
+      : item)
+    setDrafts(nextDrafts)
+    setError(null)
+    if (index < questions.length - 1) {
+      setIndex(current => current + 1)
+      return
+    }
+    submitDrafts(nextDrafts)
+  }
+
+  return (
+    <div className={css.frame} data-question-key={pending.key}>
+      <section className={css.card} aria-labelledby={`question-${pending.key}-${String(index)}`}>
+        <header className={css.header}>
+          <div className={css.headingBlock}>
+            {question.header !== undefined && <div className={css.eyebrow}>{question.header}</div>}
+            <h2 className={css.title} id={`question-${pending.key}-${String(index)}`}>
+              <span>{question.multiSelect === true
+                ? parseQuestionTitle(question.question)
+                : question.question}</span>
+              {question.multiSelect === true && <span className={css.multiSelectHint}>可多选</span>}
+            </h2>
+            {question.detail !== undefined && <p className={css.detail}>{question.detail}</p>}
+          </div>
+          <div className={css.headerActions}>
+            <span className={css.progress}>{index + 1} / {questions.length}</span>
+            <button
+              type="button" className={css.iconButton} aria-label="上一题"
+              disabled={index === 0 || busy !== null}
+              onClick={() => { setIndex(index - 1); setError(null) }}
+            >
+              <IconChevronLeftOutline14 />
+            </button>
+            <button
+              type="button" className={css.iconButton} aria-label="下一题"
+              disabled={index === questions.length - 1 || busy !== null}
+              onClick={() => { setIndex(index + 1); setError(null) }}
+            >
+              <IconChevronRightOutline14 />
+            </button>
+            <button
+              type="button" className={css.iconButton} aria-label="放弃整组问题"
+              title="放弃整组问题"
+              disabled={busy !== null} onClick={cancelFlow}
+            >
+              <IconCloseOutline16 />
+            </button>
+          </div>
+        </header>
+
+        <div className={css.options} role={question.multiSelect === true ? 'group' : 'radiogroup'}>
+          {(question.options ?? []).map((option, optionIndex) => {
+            const selected = draft.selected.includes(option.label)
+            const display = parseRecommendedLabel(option.label)
+            return (
+              <button
+                type="button" key={`${option.label}-${String(optionIndex)}`}
+                className={clsx(css.option, selected && css.optionSelected)}
+                role={question.multiSelect === true ? 'checkbox' : 'radio'}
+                aria-checked={selected}
+                aria-label={display.label}
+                disabled={busy !== null}
+                onClick={() => { choose(option.label) }}
+                onKeyDown={(event) => {
+                  if (event.key !== 'Enter' || !drafts.every(completed)) return
+                  event.preventDefault()
+                  submitDrafts(drafts)
+                }}
+              >
+                <span className={css.number}>{optionIndex + 1}</span>
+                <span className={css.optionCopy}>
+                  <span className={css.optionLine}>
+                    <span className={css.optionLabel}>{display.label}</span>
+                    {display.recommended && <span className={css.badge}>推荐</span>}
+                    {option.description !== undefined && (
+                      <span className={css.description}>{option.description}</span>
+                    )}
+                  </span>
+                </span>
+                <span className={css.choiceIcon}>
+                  {selected ? <IconCheckOutline16 /> : <IconChevronRightOutline14 />}
+                </span>
+              </button>
+            )
+          })}
+
+          <div className={clsx(
+            css.custom,
+            draft.customOpen && css.customOpen,
+            !hasOptions && css.customOptionless,
+          )}>
+            {hasOptions && (
+              <button
+                type="button" className={css.customTrigger}
+                disabled={busy !== null} onClick={openCustom}
+                aria-expanded={draft.customOpen}
+              >
+                <span className={css.number}><IconEditOutline16 /></span>
+                <span>其他，请填写自定义答案</span>
+              </button>
+            )}
+            {draft.customOpen && (
+              <textarea
+                autoFocus
+                className={css.customInput}
+                value={draft.custom}
+                disabled={busy !== null}
+                rows={2}
+                placeholder="输入你的答案"
+                onChange={(event) => {
+                  const value = event.target.value
+                  updateDraft(current => ({
+                    ...current, selected: [], custom: value, customOpen: true, skipped: false,
+                  }))
+                }}
+                onKeyDown={(event) => {
+                  if (event.key === 'Enter' && !event.shiftKey && !isComposing(event)) {
+                    event.preventDefault()
+                    continueFlow()
+                  }
+                }}
+              />
+            )}
+          </div>
+        </div>
+
+        <footer className={css.footer}>
+          <div className={css.feedback} role="status">{error}</div>
+          <div className={css.footerActions}>
+            <Button variant="ghost" size="sm" disabled={busy !== null} onClick={skipQuestion}>
+              跳过本题
+            </Button>
+            <Button
+              variant="primary" size="sm"
+              disabled={busy !== null || !answered(draft)} onClick={continueFlow}
+            >
+              {busy === 'answer'
+                ? '正在提交…'
+                : index === questions.length - 1 ? '提交' : '下一题'}
+            </Button>
+          </div>
+        </footer>
+      </section>
+    </div>
+  )
+}
--- a/packages/client/ui-question/src/client/contract/slots.ts
+++ b/packages/client/ui-question/src/client/contract/slots.ts
@@ -0,0 +1,77 @@
+/**
+ * Question-composer slot contract: the registrant-side props composition for
+ * the conversation-owned `conversation.composer` slot, plus the question
+ * domain face over the runtime's carrier object. The carrier (PendingWait)
+ * owns envelope transport only; the question protocol — answer value shape,
+ * cancelled error encoding, receipt checks — lives HERE, with the package
+ * that consumes it.
+ */
+import type { PropsRuntime } from '@deepseek-ai/dsh-client-ui-slots'
+// Also pulls ui-conversation's SlotMap merge (the 'conversation.composer'
+// entry) into every program that sees this contract, so PropsRuntime resolves.
+import type {} from '@deepseek-ai/dsh-client-ui-conversation/client'
+import type { PendingWait } from '@deepseek-ai/dsh-client-runtime/client'
+import type { QuestionResponsePayload } from '@deepseek-ai/dsh-client-connection/client'
+
+/** The pending question carrier the owner dispatches into the composer slot. */
+export type QuestionWait = PendingWait<'question'>
+
+/** One structured answer batch covering every question of the request. */
+export type QuestionAnswer = QuestionResponsePayload['answer']
+
+/**
+ * Question domain face over the carrier: render identity and questions
+ * transparently forwarded; answer/cancel own the wire encoding (the ok value
+ * shape and the cancelled error) and turn a rejected carrier receipt into a
+ * thrown error. Components mint one per carrier via useMemo (never inside a
+ * select — a per-dispatch mint would churn identity and break memoization).
+ */
+export class PendingQuestion {
+  /**
+   * @param wait - the runtime carrier for one pending question request.
+   */
+  constructor(private readonly wait: QuestionWait) {}
+
+  /** Opaque render identity (React key / draft remount axis), forwarded from the carrier. */
+  get key(): string {
+    return this.wait.key
+  }
+
+  /** The request's question list, forwarded from the carrier payload. */
+  get questions(): QuestionWait['payload']['questions'] {
+    return this.wait.payload.questions
+  }
+
+  /**
+   * Deliver the whole answer batch; a rejected carrier receipt throws.
+   * @param answer - complete structured answer batch.
+   */
+  async answer(answer: QuestionAnswer): Promise<void> {
+    const receipt = await this.wait.respond({
+      ok: true, value: { sessionId: this.wait.sessionId, answer },
+    })
+    if (!receipt.accepted) {
+      throw new Error(`question response rejected: ${receipt.reason}`)
+    }
+  }
+
+  /** Reject the whole wait (the host resolves the tool call as cancelled); a rejected receipt throws. */
+  async cancel(): Promise<void> {
+    const receipt = await this.wait.respond({
+      ok: false,
+      error: { code: 'cancelled', message: 'the user closed this question request', details: {} },
+    })
+    if (!receipt.accepted) {
+      throw new Error(`question cancellation rejected: ${receipt.reason}`)
+    }
+  }
+}
+
+/**
+ * Full component props: the framework runtime share (chain currency +
+ * session/global standard kit) plus the chain `matched` share — the entry's
+ * selector result, already narrowed to the question carrier. No injected
+ * share: the carrier plus the domain face above carry the whole behavior
+ * surface.
+ */
+export type QuestionComposerProps = PropsRuntime<'conversation.composer'> & { matched: QuestionWait }
--- a/packages/client/ui-question/src/client/index.ts
+++ b/packages/client/ui-question/src/client/index.ts
@@ -0,0 +1,36 @@
+/**
+ * Web question plugin, browser half: QuestionComposer registered as a
+ * selector-routed entry of the conversation-declared composer chain. Pure
+ * consumer — the selector narrows the owner's currency to the question
+ * carrier (matched prop), and the whole behavior surface rides the carrier
+ * (domain encoding in contract/slots.ts PendingQuestion); no inject face, no
+ * service dependency beyond slots. Export discipline: packages/client/AGENTS.md.
+ */
+import type { ClientContext } from '@deepseek-ai/dsh-client-runtime/client'
+import type { ComposerChainProps } from '@deepseek-ai/dsh-client-ui-conversation/client'
+import type { QuestionWait } from './contract/slots.ts'
+import { QuestionComposer } from './QuestionComposer.tsx'
+
+export { PendingQuestion } from './contract/slots.ts'
+export type { QuestionAnswer, QuestionComposerProps, QuestionWait } from './contract/slots.ts'
+
+/** Required services (cordis fiber inject — the loader passes the whole export surface as an object plugin). */
+export const inject = ['slots']
+
+/** Chain routing: claim the composer while a question wait is pending (pure — owner props only). */
+function selectQuestion({ interactions }: ComposerChainProps): QuestionWait | null {
+  return interactions.find((i): i is QuestionWait => i.kind === 'question') ?? null
+}
+
+/**
+ * Client plugin body: register the question composer into the composer chain.
+ * Zero business face — data and verbs both live on the matched carrier.
+ * @param ctx - client root context.
+ */
+export function apply(ctx: ClientContext): void {
+  const slots = ctx.slots
+  ctx.effect(
+    () => slots.register({ name: 'conversation.composer', select: selectQuestion }, QuestionComposer),
+    'ui-question: composer chain registration',
+  )
+}
--- a/packages/client/ui-question/src/css-modules.d.ts
+++ b/packages/client/ui-question/src/css-modules.d.ts
@@ -0,0 +1,4 @@
+declare module '*.module.css' {
+  const classes: Readonly<Record<string, string>>
+  export default classes
+}
--- a/packages/client/ui-question/src/index.ts
+++ b/packages/client/ui-question/src/index.ts
@@ -0,0 +1,17 @@
+/**
+ * Web question plugin, node half: enabling this UI feature also exposes the
+ * model-facing ask_user_question tool on the host composition.
+ */
+import type { Context } from 'cordis'
+import * as toolAskUser from '@deepseek-ai/dsh-tool-ask-user'
+
+/** Host services required by the model-facing tool. */
+export const inject = ['tools', 'userInteraction']
+
+/**
+ * Mount ask_user_question for hosts that selected the Web question plugin.
+ * @param ctx - Host plugin context carrying tools and userInteraction.
+ */
+export function apply(ctx: Context): void {
+  toolAskUser.apply(ctx)
+}
--- a/packages/client/ui-question/src/invariant.ts
+++ b/packages/client/ui-question/src/invariant.ts
@@ -0,0 +1,31 @@
+/**
+ * Package-owned invariant companion for `@deepseek-ai/dsh-client-ui-question`.
+ * @module @deepseek-ai/dsh-client-ui-question/invariant
+ */
+
+/* jscpd:ignore-start */
+import type { Context } from 'cordis'
+import type { InvariantInstaller } from '@deepseek-ai/dsh-invariants'
+
+const PACKAGE_NAME = '@deepseek-ai/dsh-client-ui-question'
+
+/** Cordis companion plugin name. */
+export const name = 'client-ui-question-invariant'
+/** Service required before the companion can reserve package ownership. */
+export const inject = ['invariants']
+
+/**
+ * No runtime invariant: tool and slot registrations are effects
+ * owned and observed by their respective registries; the host pending table is
+ * exercised through the public wire protocol.
+ */
+const install: InvariantInstaller = () => {}
+
+/**
+ * Register this package's invariant companion.
+ * @param ctx - Cordis context carrying the invariant service.
+ * @returns The installed registration's disposer after setup succeeds.
+ */
+export const apply = (ctx: Context): Promise<() => void> =>
+  Promise.resolve(ctx.invariants.register(PACKAGE_NAME, install))
+/* jscpd:ignore-end */
--- a/packages/client/ui-question/tests/browser-plugin.spec.ts
+++ b/packages/client/ui-question/tests/browser-plugin.spec.ts
@@ -0,0 +1,64 @@
+/**
+ * apply wiring on a real cordis Context + SlotsService: QuestionComposer
+ * registered as the `question` entry of the conversation-declared composer
+ * slot with ZERO business face (data and verbs ride the dispatched carrier),
+ * load-order fail-loud, and fiber-teardown unregistration. Component and
+ * domain-face behavior is covered props-direct in question-composer.spec.tsx;
+ * no renderer machinery here.
+ */
+import { Context } from 'cordis'
+import { describe, expect, it } from 'vitest'
+import { SlotsService } from '@deepseek-ai/dsh-client-runtime/client'
+import { QuestionComposer } from '../src/client/QuestionComposer.tsx'
+import { apply, inject } from '../src/client/index.ts'
+
+async function bench() {
+  const ctx = new Context()
+  await ctx.plugin(SlotsService).await()
+  const slots = ctx.get('slots') as SlotsService
+  // Stand-in for ui-conversation's conversation entry: the composer slot only
+  // exists while a live entry declares it in children (declaration account:
+  // design §2.2).
+  slots.register(
+    { name: 'root', children: { 'conversation.composer': { kind: 'chain', scope: 'session' } } } as never,
+    () => null,
+  )
+  return { ctx, slots }
+}
+
+describe('apply', () => {
+  it('declares the services it binds', () => {
+    expect(inject).toEqual(['slots'])
+  })
+
+  it('fails loud when no live entry has declared the composer slot', async () => {
+    const ctx = new Context()
+    await ctx.plugin(SlotsService).await()
+    await expect(ctx.plugin({ inject: [...inject], apply }))
+      .rejects.toThrow(/slot "conversation.composer" is not declared/)
+  })
+
+  it('registers the question entry: routing selector, no inject face', async () => {
+    const { ctx, slots } = await bench()
+    await ctx.plugin({ inject: [...inject], apply }).await()
+    const entry = slots.entries('conversation.composer')[0]!
+    expect(entry.component).toBe(QuestionComposer)
+    // The whole behavior surface rides the matched carrier: no business face.
+    expect(entry.inject).toBeUndefined()
+    // The selector narrows the chain currency: question wait in → that wait; none → null.
+    const select = entry.select as (owner: { interactions: readonly { kind: string }[] }) => unknown
+    const question = { kind: 'question' }
+    expect(select({ interactions: [{ kind: 'approval' }, question] })).toBe(question)
+    expect(select({ interactions: [{ kind: 'approval' }] })).toBeNull()
+    expect(select({ interactions: [] })).toBeNull()
+  })
+
+  it('teardown unregisters the slot entry', async () => {
+    const { ctx, slots } = await bench()
+    const fiber = ctx.plugin({ inject: [...inject], apply })
+    await fiber.await()
+    expect(slots.entries('conversation.composer')).toHaveLength(1)
+    await fiber.dispose()
+    expect(slots.entries('conversation.composer')).toHaveLength(0)
+  })
+})
--- a/packages/client/ui-question/tests/node-plugin.spec.ts
+++ b/packages/client/ui-question/tests/node-plugin.spec.ts
@@ -0,0 +1,28 @@
+import { Context } from 'cordis'
+import { afterEach, describe, expect, it } from 'vitest'
+import ToolRegistry from '@deepseek-ai/dsh-tools'
+import SystemPrompt from '@deepseek-ai/dsh-system-prompt'
+import UserInteractionService from '@deepseek-ai/dsh-user-interaction'
+import { apply, inject } from '../src/index.ts'
+
+let ctx: Context | undefined
+
+afterEach(async () => {
+  await ctx?.fiber.dispose()
+  ctx = undefined
+})
+
+describe('ui-question node plugin', () => {
+  it('exposes ask_user_question only for the selected Web feature lifecycle', async () => {
+    ctx = new Context()
+    await ctx.plugin(SystemPrompt)
+    await ctx.plugin(ToolRegistry)
+    await ctx.plugin(UserInteractionService)
+    const feature = ctx.plugin({ inject: [...inject], apply })
+    await feature.await()
+    expect(ctx.tools.get('ask_user_question')).toBeDefined()
+
+    await feature.dispose()
+    expect(ctx.tools.get('ask_user_question')).toBeUndefined()
+  })
+})
--- a/packages/client/ui-question/tests/question-composer.spec.tsx
+++ b/packages/client/ui-question/tests/question-composer.spec.tsx
@@ -0,0 +1,265 @@
+// @vitest-environment jsdom
+import { afterEach, describe, expect, it, vi } from 'vitest'
+import { cleanup, fireEvent, render, screen } from '@testing-library/react'
+import type { ConversationSnapshot, SessionId, SessionListState } from '@deepseek-ai/dsh-client-runtime/client'
+import { PendingWait } from '@deepseek-ai/dsh-client-runtime/client'
+import type { RpcReceipt } from '@deepseek-ai/dsh-client-connection/client'
+import { RpcId } from '@deepseek-ai/dsh-client-connection/client'
+import type { SnapshotSelectorHook } from '@deepseek-ai/dsh-client-ui-slots'
+import { PendingQuestion } from '../src/client/contract/slots.ts'
+import {
+  QuestionComposer, parseQuestionTitle, parseRecommendedLabel,
+} from '../src/client/QuestionComposer.tsx'
+
+afterEach(cleanup)
+
+const SID = 's1' as SessionId
+
+/** Framework standard-kit stubs: the composer consumes none of them, the
+ *  composed props type mandates their delivery (framework hooks are plain
+ *  stubs per the client testing discipline). */
+const kit = {
+  sessionId: SID,
+  useSession: (() => { throw new Error('unused') }) as unknown as SnapshotSelectorHook<ConversationSnapshot>,
+  useSessions: (() => { throw new Error('unused') }) as unknown as SnapshotSelectorHook<SessionListState>,
+}
+
+const QUESTIONS = [
+  {
+    id: 'profile', header: '偏好', question: '选择候选人类型',
+    detail: '按当前空缺岗位的优先级选择。',
+    options: [
+      { label: '工程落地型 (Recommended)', description: '优先工程交付。' },
+      { label: '研究潜力型', description: '优先研究能力。' },
+    ],
+  },
+  {
+    id: 'detail', question: '补充你的要求',
+  },
+  {
+    id: 'signals', question: '选择重要信号（可多选）', multiSelect: true,
+    options: [{ label: '系统设计' }, { label: '代码质量' }, { label: '产品判断' }],
+  },
+]
+
+/** Carrier fixture: a real PendingWait over a scripted respond carrier. */
+function wait(rpcId = 'question-1', respond = vi.fn(() => Promise.resolve<RpcReceipt>({ accepted: true }))) {
+  const carrier = new PendingWait(
+    'question', RpcId(rpcId), SID, { questions: QUESTIONS } as PendingWait<'question'>['payload'], respond)
+  return { carrier, respond }
+}
+
+/** The client-response envelope respond must have received for an answer batch. */
+function answeredEnvelope(rpcId: string, answers: object[]) {
+  return {
+    type: 'client-response', rpcId: RpcId(rpcId),
+    result: { ok: true, value: { sessionId: SID, answer: { answers } } },
+  }
+}
+
+describe('QuestionComposer', () => {
+  it('collects single, custom, and multi-select answers before one batch submit', () => {
+    const { carrier, respond } = wait()
+    render(<QuestionComposer matched={carrier} interactions={[carrier]} {...kit} />)
+
+    expect(screen.getByText('1 / 3')).toBeTruthy()
+    expect(screen.getByText('推荐')).toBeTruthy()
+    expect(screen.getByText('工程落地型')).toBeTruthy()
+    expect(screen.getByText('按当前空缺岗位的优先级选择。')).toBeTruthy()
+    fireEvent.keyDown(screen.getByRole('radio', { name: /工程落地型/ }), { key: 'Enter' })
+    expect(respond).not.toHaveBeenCalled()
+    fireEvent.click(screen.getByRole('radio', { name: /工程落地型/ }))
+
+    expect(screen.getByText('2 / 3')).toBeTruthy()
+    // detail is per-question: the second question carries none.
+    expect(screen.queryByText('按当前空缺岗位的优先级选择。')).toBeNull()
+    expect(screen.queryByRole('button', { name: '填写答案' })).toBeNull()
+    const custom = screen.getByPlaceholderText('输入你的答案')
+    fireEvent.change(custom, { target: { value: '要能独立排查线上问题' } })
+    fireEvent.keyDown(custom, { key: 'Enter' })
+
+    expect(screen.getByText('3 / 3')).toBeTruthy()
+    expect(screen.getByText('选择重要信号')).toBeTruthy()
+    expect(screen.getByText('可多选')).toBeTruthy()
+    expect(screen.queryByText('（可多选）')).toBeNull()
+    fireEvent.click(screen.getByRole('checkbox', { name: '系统设计' }))
+    fireEvent.click(screen.getByRole('checkbox', { name: '系统设计' }))
+    fireEvent.click(screen.getByRole('checkbox', { name: '系统设计' }))
+    fireEvent.click(screen.getByRole('checkbox', { name: '代码质量' }))
+    fireEvent.keyDown(screen.getByRole('checkbox', { name: '代码质量' }), { key: 'Enter' })
+
+    // The domain face encoded the whole batch into one carrier envelope.
+    expect(respond).toHaveBeenCalledWith(answeredEnvelope('question-1', [
+      { id: 'profile', selected: ['工程落地型 (Recommended)'] },
+      { id: 'detail', selected: [], custom: '要能独立排查线上问题' },
+      { id: 'signals', selected: ['系统设计', '代码质量'] },
+    ]))
+    expect((screen.getByRole('button', { name: '正在提交…' }) as HTMLButtonElement).disabled).toBe(true)
+  })
+
+  it('skips individual questions without discarding earlier answers', () => {
+    const { carrier, respond } = wait()
+    render(<QuestionComposer matched={carrier} interactions={[carrier]} {...kit} />)
+
+    expect((screen.getByText('下一题').closest('button') as HTMLButtonElement).disabled).toBe(true)
+    fireEvent.click(screen.getByRole('radio', { name: '研究潜力型' }))
+    expect(screen.getByText('2 / 3')).toBeTruthy()
+    fireEvent.click(screen.getByRole('button', { name: '跳过本题' }))
+    expect(screen.getByText('3 / 3')).toBeTruthy()
+    fireEvent.click(screen.getByRole('button', { name: '跳过本题' }))
+
+    expect(respond).toHaveBeenCalledWith(answeredEnvelope('question-1', [
+      { id: 'profile', selected: ['研究潜力型'] },
+      { id: 'detail', selected: [] },
+      { id: 'signals', selected: [] },
+    ]))
+  })
+
+  it('keeps IME Enter inside the custom input until composition finishes', () => {
+    const { carrier, respond } = wait()
+    render(<QuestionComposer matched={carrier} interactions={[carrier]} {...kit} />)
+
+    fireEvent.click(screen.getByRole('radio', { name: '研究潜力型' }))
+    const custom = screen.getByPlaceholderText('输入你的答案')
+    fireEvent.change(custom, { target: { value: '中文输入' } })
+
+    fireEvent.keyDown(custom, { key: 'Enter', isComposing: true })
+    expect(screen.getByText('2 / 3')).toBeTruthy()
+    expect(respond).not.toHaveBeenCalled()
+
+    fireEvent.keyDown(custom, { key: 'Enter', keyCode: 229 })
+    expect(screen.getByText('2 / 3')).toBeTruthy()
+    expect(respond).not.toHaveBeenCalled()
+
+    fireEvent.keyDown(custom, { key: 'Enter' })
+    expect(screen.getByText('3 / 3')).toBeTruthy()
+  })
+
+  it('opens custom input, reports missing skipped answers, and supports header navigation', () => {
+    const { carrier, respond } = wait()
+    render(<QuestionComposer matched={carrier} interactions={[carrier]} {...kit} />)
+
+    fireEvent.click(screen.getByRole('button', { name: '其他，请填写自定义答案' }))
+    expect(screen.getByPlaceholderText('输入你的答案')).toBeTruthy()
+    fireEvent.click(screen.getByRole('radio', { name: '工程落地型' }))
+    const emptyCustom = screen.getByPlaceholderText('输入你的答案')
+    fireEvent.keyDown(emptyCustom, { key: 'Enter', shiftKey: true })
+    expect(screen.getByText('2 / 3')).toBeTruthy()
+    fireEvent.keyDown(emptyCustom, { key: 'Enter' })
+    expect(screen.getByText('请选择一个选项或填写自定义答案。')).toBeTruthy()
+
+    fireEvent.click(screen.getByLabelText('下一题'))
+    fireEvent.click(screen.getByRole('checkbox', { name: '产品判断' }))
+    fireEvent.click(screen.getByRole('button', { name: '提交' }))
+    expect(screen.getByText('请先完成这道问题。')).toBeTruthy()
+    expect(screen.getByText('2 / 3')).toBeTruthy()
+    fireEvent.click(screen.getByLabelText('上一题'))
+    expect(screen.getByText('1 / 3')).toBeTruthy()
+    expect(respond).not.toHaveBeenCalled()
+  })
+
+  it('surfaces cancellation failures: rejected receipt text and raw transport reasons', async () => {
+    const respond = vi.fn()
+      .mockResolvedValueOnce({ accepted: false, reason: 'bad-response' })
+      .mockRejectedValueOnce(new Error('第二次取消失败'))
+    const { carrier } = wait('question-1', respond)
+    render(<QuestionComposer matched={carrier} interactions={[carrier]} {...kit} />)
+
+    // Receipt rejection surfaces through the domain face's thrown message.
+    fireEvent.click(screen.getByRole('button', { name: '放弃整组问题' }))
+    expect(await screen.findByText('question cancellation rejected: bad-response')).toBeTruthy()
+    expect((screen.getByRole('button', { name: '跳过本题' }) as HTMLButtonElement).disabled).toBe(false)
+
+    fireEvent.click(screen.getByRole('button', { name: '放弃整组问题' }))
+    expect(await screen.findByText('第二次取消失败')).toBeTruthy()
+  })
+
+  it('surfaces transport rejection and resets local drafts for a different request', async () => {
+    const respond = vi.fn()
+      .mockRejectedValueOnce(new Error('网络中断'))
+      .mockRejectedValueOnce('字符串错误')
+    const first = wait('first', respond)
+    const view = render(<QuestionComposer matched={first.carrier} interactions={[first.carrier]} {...kit} />)
+
+    fireEvent.click(screen.getByRole('radio', { name: /研究潜力型/ }))
+    expect(screen.getByText('2 / 3')).toBeTruthy()
+    const second = wait('second', respond)
+    view.rerender(<QuestionComposer matched={second.carrier} interactions={[second.carrier]} {...kit} />)
+    expect(screen.getByRole('radio', { name: /研究潜力型/ }).getAttribute('aria-checked')).toBe('false')
+
+    fireEvent.click(screen.getByRole('radio', { name: /工程落地型/ }))
+    const custom = screen.getByPlaceholderText('输入你的答案')
+    fireEvent.change(custom, { target: { value: 'x' } })
+    fireEvent.keyDown(custom, { key: 'Enter' })
+    fireEvent.click(screen.getByRole('checkbox', { name: '系统设计' }))
+    fireEvent.click(screen.getByRole('button', { name: '提交' }))
+    expect(await screen.findByText('网络中断')).toBeTruthy()
+    expect((screen.getByRole('button', { name: '提交' }) as HTMLButtonElement).disabled).toBe(false)
+
+    fireEvent.click(screen.getByRole('button', { name: '提交' }))
+    expect(await screen.findByText('字符串错误')).toBeTruthy()
+  })
+
+  it('same-key carrier replacement (baseline replay) keeps drafts', () => {
+    const first = wait('same-id')
+    const view = render(<QuestionComposer matched={first.carrier} interactions={[first.carrier]} {...kit} />)
+    fireEvent.click(screen.getByRole('radio', { name: /研究潜力型/ }))
+    expect(screen.getByText('2 / 3')).toBeTruthy()
+    // Replay mints a NEW carrier for the same request; same key = no remount.
+    const replayed = wait('same-id')
+    view.rerender(<QuestionComposer matched={replayed.carrier} interactions={[replayed.carrier]} {...kit} />)
+    expect(screen.getByText('2 / 3')).toBeTruthy()
+  })
+})
+
+describe('PendingQuestion domain face', () => {
+  it('encodes the answer batch into the ok envelope and throws on a rejected receipt', async () => {
+    const respond = vi.fn()
+      .mockResolvedValueOnce({ accepted: true })
+      .mockResolvedValueOnce({ accepted: false, reason: 'not-pending' })
+    const question = new PendingQuestion(wait('rq', respond).carrier)
+    const batch = { answers: [{ id: 'mode', selected: ['Fast'] }] }
+    await expect(question.answer(batch)).resolves.toBeUndefined()
+    expect(respond).toHaveBeenCalledWith(answeredEnvelope('rq', batch.answers))
+    await expect(question.answer(batch)).rejects.toThrow(/question response rejected: not-pending/)
+  })
+
+  it('encodes cancellation as the cancelled error envelope and throws on a rejected receipt', async () => {
+    const respond = vi.fn()
+      .mockResolvedValueOnce({ accepted: true })
+      .mockResolvedValueOnce({ accepted: false, reason: 'bad-response' })
+    const question = new PendingQuestion(wait('rc', respond).carrier)
+    await expect(question.cancel()).resolves.toBeUndefined()
+    expect(respond).toHaveBeenCalledWith({
+      type: 'client-response', rpcId: RpcId('rc'),
+      result: {
+        ok: false,
+        error: { code: 'cancelled', message: 'the user closed this question request', details: {} },
+      },
+    })
+    await expect(question.cancel()).rejects.toThrow(/question cancellation rejected: bad-response/)
+  })
+
+  it('forwards key and questions from the carrier', () => {
+    const question = new PendingQuestion(wait('rk').carrier)
+    expect(question.key).toBe('q:rk')
+    expect(question.questions).toBe(wait('rk').carrier.payload.questions)
+  })
+})
+
+describe('parseRecommendedLabel', () => {
+  it('recognizes English and Chinese suffixes without changing ordinary labels', () => {
+    expect(parseRecommendedLabel('Fast (Recommended)')).toEqual({ label: 'Fast', recommended: true })
+    expect(parseRecommendedLabel('稳妥（推荐）')).toEqual({ label: '稳妥', recommended: true })
+    expect(parseRecommendedLabel('稳妥 (推荐)')).toEqual({ label: '稳妥', recommended: true })
+    expect(parseRecommendedLabel('Plain')).toEqual({ label: 'Plain', recommended: false })
+  })
+})
+
+describe('parseQuestionTitle', () => {
+  it('removes Chinese and ASCII multi-select suffixes', () => {
+    expect(parseQuestionTitle('选择信号（可多选）')).toBe('选择信号')
+    expect(parseQuestionTitle('选择信号 (可多选)')).toBe('选择信号')
+    expect(parseQuestionTitle('选择信号')).toBe('选择信号')
+  })
+})
--- a/packages/client/ui-question/tsconfig.json
+++ b/packages/client/ui-question/tsconfig.json
@@ -0,0 +1,36 @@
+{
+  "extends": "../../../tsconfig.base.client.json",
+  "compilerOptions": {
+    "rootDir": "src",
+    "outDir": "lib/types"
+  },
+  "include": [
+    "src"
+  ],
+  "references": [
+    {
+      "path": "../../../vendor/cordis"
+    },
+    {
+      "path": "../connection"
+    },
+    {
+      "path": "../runtime"
+    },
+    {
+      "path": "../ui-conversation"
+    },
+    {
+      "path": "../ui-primitives"
+    },
+    {
+      "path": "../ui-slots"
+    },
+    {
+      "path": "../../ui/tool-ask-user"
+    },
+    {
+      "path": "../../support/invariants"
+    }
+  ]
+}
--- a/packages/client/ui-question/tsdown.config.ts
+++ b/packages/client/ui-question/tsdown.config.ts
@@ -0,0 +1,3 @@
+import { clientBundle } from '../tsdown.client.ts'
+
+export default clientBundle('@deepseek-ai/dsh-client-ui-question', ['lib/types/index.js', 'lib/types/invariant.js'])
--- a/packages/client/ui-sidebar/src/client/tree.ts
+++ b/packages/client/ui-sidebar/src/client/tree.ts
@@ -154,7 +154,7 @@ function sessionRow(g: Group, s: SessionSummary, depth: number, hasChildren: boo
    type: 'session',
    id: s.id,
    groupKey: g.key,
-    title: s.title,
+    title: s.displayTitle,
    depth,
    hasChildren,
    expanded,
@@ -183,7 +183,7 @@ function flattenVisible(g: Group, expandedSessions: ReadonlySet<string>, rows: S
 function searchVisible(g: Group, q: string): Set<SessionId> {
  const visible = new Set<SessionId>()
  for (const m of g.summaries.values()) {
-    if (!m.title.toLowerCase().includes(q)) continue
+    if (!m.displayTitle.toLowerCase().includes(q)) continue
    let cur: SessionSummary | undefined = m
    while (cur !== undefined && !visible.has(cur.id)) {
      visible.add(cur.id)
@@ -213,9 +213,9 @@ function flattenSearch(g: Group, visible: ReadonlySet<SessionId>, rows: SidebarR
 *
 * Normal mode: every project row shows; sessions show under expanded
 * projects, descending only into expanded sessions. Search mode (non-blank
- * query, case-insensitive title substring): expansion state is ignored —
+ * query, case-insensitive display-title substring): expansion state is ignored —
 * matched sessions and their ancestor chains are forced visible, groups
- * without a title or label hit are dropped, and a label-only hit keeps the
+ * without a display-title or label hit are dropped, and a label-only hit keeps the
 * bare project row.
 * @param list - sessions list snapshot.
 * @param view - local expansion arrays and search query.
--- a/packages/client/ui-sidebar/tests/apply.spec.tsx
+++ b/packages/client/ui-sidebar/tests/apply.spec.tsx
@@ -23,7 +23,7 @@ async function bench() {
  await ctx.plugin(SlotsService).await()
  const list = createSnapshotStore<SessionListState>({
    ids: [sid('a')],
-    byId: { [sid('a')]: { id: sid('a'), title: 'alpha', cwd: '/proj', running: false, updatedAt: 1 } },
+    byId: { [sid('a')]: { id: sid('a'), title: 'alpha', displayTitle: 'alpha', cwd: '/proj', running: false, updatedAt: 1 } },
    current: undefined,
  })
  const sessions = { list, create: vi.fn(async () => sid('minted')), open: vi.fn() }
--- a/packages/client/ui-sidebar/tests/sidebar-root.spec.tsx
+++ b/packages/client/ui-sidebar/tests/sidebar-root.spec.tsx
@@ -38,6 +38,7 @@ function summary(init: SummaryInit): SessionSummary {
  const s: SessionSummary = {
    id: sid(init.id),
    title: init.title ?? init.id,
+    displayTitle: init.title ?? init.id,
    running: init.running ?? false,
    updatedAt: init.updatedAt ?? 0,
  }
--- a/packages/client/ui-sidebar/tests/tree.spec.ts
+++ b/packages/client/ui-sidebar/tests/tree.spec.ts
@@ -11,6 +11,7 @@ const sid = (s: string) => s as SessionId
 interface SummaryInit {
  id: string
  title?: string
+  displayTitle?: string
  cwd?: string
  parentId?: string
  running?: boolean
@@ -20,10 +21,11 @@ interface SummaryInit {
 function summary(init: SummaryInit): SessionSummary {
  const s: SessionSummary = {
    id: sid(init.id),
-    title: init.title ?? init.id,
+    displayTitle: init.displayTitle ?? init.title ?? init.id,
    running: init.running ?? false,
    updatedAt: init.updatedAt ?? 0,
  }
+  if (init.title !== undefined) s.title = init.title
  if (init.cwd !== undefined) s.cwd = init.cwd
  if (init.parentId !== undefined) s.parentId = sid(init.parentId)
  return s
@@ -211,6 +213,15 @@ describe('deriveRows search', () => {
    const rows = deriveRows(list, view({ query: '   ' }))
    expect(rows.every(r => r.type === 'project')).toBe(true)
  })
+
+  it('matches the effective display title when no durable title is available', () => {
+    const fallback = listOf(summary({ id: 'raw-id', displayTitle: 'project fallback', cwd: '/elsewhere' }))
+    const rows = deriveRows(fallback, view({ query: 'fallback' }))
+    expect(rows).toEqual([
+      expect.objectContaining({ type: 'project', key: '/elsewhere' }),
+      expect.objectContaining({ type: 'session', id: 'raw-id', title: 'project fallback' }),
+    ])
+  })
 })

 describe('formatRelativeTime', () => {
--- a/packages/client/web/README.md
+++ b/packages/client/web/README.md
@@ -4,6 +4,8 @@ Web shell library: `bootWebShell(el, seams?)` mounts the whole client — loader

 The optional `seams` parameter forwards the client loader's `fetchBundle`/`executeBundle` transport overrides (`BootSeams`); production callers omit it — it exists for test environments where `<script>` execution cannot reach the page context (jsdom).

+The shell owns browser-title projection. With a selected session carrying a durable title, it renders `<session title> — <existing HTML title>` and reacts to later title revisions; no selection or a selected untitled session preserves the existing title, and shell unmount restores it. The existing HTML title remains the configurable product suffix.
+
 ## Model Experience

 None, as the entry shell boots the browser plugin tree; nothing here reaches a model request.
--- a/packages/client/web/src/DocumentTitle.tsx
+++ b/packages/client/web/src/DocumentTitle.tsx
@@ -0,0 +1,22 @@
+import { useEffect, useRef } from 'react'
+
+/** Props for the shell-owned browser title projection. */
+export interface DocumentTitleProps {
+  /** Durable title of the selected session, or undefined for the product title. */
+  title?: string
+}
+
+/**
+ * Project the selected durable session title into the browser title and
+ * restore the shell's original product title when unmounted.
+ * @param props - selected session title projection.
+ * @returns no rendered content.
+ */
+export function DocumentTitle({ title }: DocumentTitleProps): null {
+  const original = useRef(document.title)
+  useEffect(() => {
+    document.title = title === undefined ? original.current : `${title} — ${original.current}`
+    return () => { document.title = original.current }
+  }, [title])
+  return null
+}
--- a/packages/client/web/src/app.tsx
+++ b/packages/client/web/src/app.tsx
@@ -6,6 +6,9 @@
 */
 import type { ReactNode } from 'react'
 import type { Context } from 'cordis'
+import type { SessionsService } from '@deepseek-ai/dsh-client-runtime/client'
+import { bindSnapshotSelector } from '@deepseek-ai/dsh-client-web-react'
+import { DocumentTitle } from './DocumentTitle.tsx'
 // Type-only: pulls the runtime's SlotMap declaration merge (the 'root' key) into this program.
 import type {} from '@deepseek-ai/dsh-client-runtime/client'

@@ -24,5 +27,20 @@ export interface AssemblyDeps {
 */
 export function buildRenderApp(deps: AssemblyDeps): () => ReactNode {
  const { ctx } = deps
-  return () => ctx.slots.renderSlot('root', {})
+  const sessions = ctx.get('sessions') as SessionsService | undefined
+  if (sessions === undefined) throw new Error('shell assembly: sessions service unavailable')
+  const useSessions = bindSnapshotSelector(sessions.list)
+  const SessionDocumentTitle = (): ReactNode => {
+    const title = useSessions((state) => {
+      const id = state.current
+      return id === undefined ? undefined : state.byId[id]?.title
+    })
+    return <DocumentTitle {...title === undefined ? {} : { title }} />
+  }
+  return () => (
+    <>
+      <SessionDocumentTitle />
+      {ctx.slots.renderSlot('root', {})}
+    </>
+  )
 }
--- a/packages/client/web/src/index.ts
+++ b/packages/client/web/src/index.ts
@@ -8,4 +8,5 @@
 export { bootWebShell } from './boot.tsx'
 export { AppRoot, type AppRootProps } from './AppRoot.tsx'
 export { buildRenderApp, type AssemblyDeps } from './app.tsx'
+export { DocumentTitle, type DocumentTitleProps } from './DocumentTitle.tsx'
 export { seedModules } from './seed.ts'
--- a/packages/client/web/tests/boot.spec.tsx
+++ b/packages/client/web/tests/boot.spec.tsx
@@ -39,7 +39,7 @@ window.DSHClientProxy.loadPlugin({
    return {
      apply: (ctx) => {
        ctx.plugin(SlotsService)
-        const list = createSnapshotStore({ ids: ['s1'], byId: { s1: { id: 's1', title: 'S1', running: false, updatedAt: 1 } }, current: 's1' })
+        const list = createSnapshotStore({ ids: ['s1'], byId: { s1: { id: 's1', title: 'S1', displayTitle: 'S1', running: false, updatedAt: 1 } }, current: 's1' })
        ctx.provide('sessions', {
          list,
          cell: (id) => (id === 's1' ? { sessionId: 's1', session: { getSnapshot: () => ({}), subscribe: () => () => {} } } : undefined),
@@ -134,6 +134,7 @@ afterEach(() => {
  delete win.__TEST_RUNTIME_STORE__
  document.body.innerHTML = ''
  document.head.querySelectorAll('script').forEach((s) => { s.remove() })
+  document.title = ''
 })

 /** Hand the real runtime surface to the stub bundle (runtime is not a seeded library). */
@@ -147,6 +148,7 @@ describe('bootWebShell (real loader + real script execution)', () => {
    win.__DSH_BOOT__ = { plugins: bootPlugins() }
    seedSlotsService()
    const el = mountPoint()
+    document.title = 'DeepSeek Harness'
    let unmount: (() => void) | undefined
    act(() => { unmount = bootWebShell(el, seams(fakeBundles())) })
    expect(el.textContent).toContain('HARNESS')
@@ -155,9 +157,11 @@ describe('bootWebShell (real loader + real script execution)', () => {
    await flushLoader()
    expect(el.querySelector('[data-testid="fake-frame"]')).not.toBeNull()
    expect(el.textContent).not.toContain('HARNESS')
+    expect(document.title).toBe('S1 — DeepSeek Harness')

    act(() => { unmount!() })
    expect(el.childElementCount).toBe(0)
+    expect(document.title).toBe('DeepSeek Harness')
  })

  it('store seat round-trips through the entry props (useStore + actions)', async () => {
@@ -218,6 +222,9 @@ describe('buildRenderApp — assembly contract', () => {
    const ctx = new Context()
    const fiber = ctx.plugin(SlotsService)
    await fiber.await()
+    ctx.provide('sessions', {
+      list: createSnapshotStore({ ids: [], byId: {}, current: undefined }),
+    })
    const renderApp = buildRenderApp({ ctx, requireModule: () => undefined })
    expect(renderApp).toBeTypeOf('function')
    // No renderer installed: the one-line shell must surface the boot-order error.
--- a/packages/client/web/tests/document-title.spec.tsx
+++ b/packages/client/web/tests/document-title.spec.tsx
@@ -0,0 +1,28 @@
+// @vitest-environment jsdom
+import { afterEach, describe, expect, it } from 'vitest'
+import { cleanup, render } from '@testing-library/react'
+import { DocumentTitle } from '../src/DocumentTitle.tsx'
+
+afterEach(() => {
+  cleanup()
+  document.title = ''
+})
+
+describe('DocumentTitle', () => {
+  it('preserves the product title without a durable title and restores it on unmount', () => {
+    document.title = 'DeepSeek Harness'
+    const mounted = render(<DocumentTitle />)
+    expect(document.title).toBe('DeepSeek Harness')
+
+    mounted.rerender(<DocumentTitle title="First title" />)
+    expect(document.title).toBe('First title — DeepSeek Harness')
+
+    mounted.rerender(<DocumentTitle title="Revised title" />)
+    expect(document.title).toBe('Revised title — DeepSeek Harness')
+
+    mounted.rerender(<DocumentTitle />)
+    expect(document.title).toBe('DeepSeek Harness')
+    mounted.unmount()
+    expect(document.title).toBe('DeepSeek Harness')
+  })
+})