From 7dcf5d907068446eacafb44f4d3cd6d45aefbfd6 Mon Sep 17 00:00:00 2001
From: digua <i@digua.me>
Date: Sun, 26 Jul 2026 15:28:14 +0800
Subject: [PATCH] feat(web): add Web WASM AI chat

---
 apps/web-wasm/src/components/ai/WebAIChat.vue | 551 ++++++++++++++++++
 .../components/ai/WebAIModelSetupModal.vue    | 164 ++++++
 .../src/components/ai/message-mapper.test.ts  |  27 +
 .../src/components/ai/message-mapper.ts       |  50 ++
 apps/web-wasm/src/pages/SessionDetailPage.vue |  20 +-
 eslint.config.mjs                             |   6 +-
 package.json                                  |  21 +-
 packages/ai-runtime/package.json              |  19 +
 .../src/context-compression.test.ts           |  37 ++
 .../ai-runtime/src/context-compression.ts     |  94 +++
 packages/ai-runtime/src/default-assistant.ts  |  71 +++
 packages/ai-runtime/src/errors.ts             |  26 +
 packages/ai-runtime/src/index.ts              |   6 +
 packages/ai-runtime/src/runtime.test.ts       | 209 +++++++
 packages/ai-runtime/src/runtime.ts            | 205 +++++++
 packages/ai-runtime/src/token-budget.ts       |  32 +
 packages/ai-runtime/src/types.ts              | 144 +++++
 .../tools/src/definitions/search-segments.ts  |  68 +++
 packages/tools/src/index.ts                   |   1 +
 packages/tools/src/registry.ts                |   2 +
 packages/web-ai-runtime/package.json          |  18 +
 packages/web-ai-runtime/src/errors.test.ts    |  14 +
 packages/web-ai-runtime/src/errors.ts         |  41 ++
 packages/web-ai-runtime/src/index.ts          |   6 +
 .../src/model-config-store.test.ts            |  64 ++
 .../web-ai-runtime/src/model-config-store.ts  | 135 +++++
 .../web-ai-runtime/src/provider-factory.ts    |  26 +
 packages/web-ai-runtime/src/rpc-adapters.ts   |  99 ++++
 packages/web-ai-runtime/src/runtime.test.ts   | 173 ++++++
 packages/web-ai-runtime/src/runtime.ts        | 172 ++++++
 packages/web-ai-runtime/src/types.ts          |  67 +++
 packages/web-runtime/package.json             |   2 +
 packages/web-runtime/scripts/bench-import.mts |   6 +-
 .../src/ai/browser-ai-runtime.test.ts         | 148 +++++
 .../src/ai/conversation-repository.ts         | 244 ++++++++
 packages/web-runtime/src/ai/privacy.ts        |  32 +
 packages/web-runtime/src/ai/tool-runtime.ts   |  96 +++
 .../src/import/session-runtime.test.ts        |   6 +-
 packages/web-runtime/src/index.ts             |   3 +
 packages/web-runtime/src/rpc/protocol.ts      |  67 +++
 .../src/sqlite/database-runtime.ts            |   4 +-
 .../src/storage/workspace-database.ts         |   2 +-
 .../web-runtime/src/worker/controller.test.ts |   6 +-
 packages/web-runtime/src/worker/controller.ts |  79 ++-
 pnpm-lock.yaml                                | 264 ++++++++-
 src/i18n/locales/en-US/index.ts               |   2 +
 src/i18n/locales/en-US/webAI.json             |  51 ++
 src/i18n/locales/ja-JP/index.ts               |   2 +
 src/i18n/locales/ja-JP/webAI.json             |  51 ++
 src/i18n/locales/zh-CN/index.ts               |   2 +
 src/i18n/locales/zh-CN/webAI.json             |  51 ++
 src/i18n/locales/zh-TW/index.ts               |   2 +
 src/i18n/locales/zh-TW/webAI.json             |  51 ++
 src/services/browser-runtime/register.test.ts |   6 +-
 src/services/browser-runtime/register.ts      |   2 +
 src/services/browser-runtime/service.ts       |   5 +
 tests/web-ai-sdk-spike/README.md              |  58 ++
 tests/web-ai-sdk-spike/baseline.html          |  12 +
 tests/web-ai-sdk-spike/index.html             |  76 +++
 tests/web-ai-sdk-spike/src/baseline.ts        |   1 +
 tests/web-ai-sdk-spike/src/main.ts            | 135 +++++
 tests/web-ai-sdk-spike/src/runtime.ts         | 225 +++++++
 tests/web-ai-sdk-spike/src/style.css          | 193 ++++++
 tests/web-ai-sdk-spike/tsconfig.json          |   5 +
 tests/web-ai-sdk-spike/vite.config.mts        |  25 +
 65 files changed, 4455 insertions(+), 27 deletions(-)
 create mode 100644 apps/web-wasm/src/components/ai/WebAIChat.vue
 create mode 100644 apps/web-wasm/src/components/ai/WebAIModelSetupModal.vue
 create mode 100644 apps/web-wasm/src/components/ai/message-mapper.test.ts
 create mode 100644 apps/web-wasm/src/components/ai/message-mapper.ts
 create mode 100644 packages/ai-runtime/package.json
 create mode 100644 packages/ai-runtime/src/context-compression.test.ts
 create mode 100644 packages/ai-runtime/src/context-compression.ts
 create mode 100644 packages/ai-runtime/src/default-assistant.ts
 create mode 100644 packages/ai-runtime/src/errors.ts
 create mode 100644 packages/ai-runtime/src/index.ts
 create mode 100644 packages/ai-runtime/src/runtime.test.ts
 create mode 100644 packages/ai-runtime/src/runtime.ts
 create mode 100644 packages/ai-runtime/src/token-budget.ts
 create mode 100644 packages/ai-runtime/src/types.ts
 create mode 100644 packages/tools/src/definitions/search-segments.ts
 create mode 100644 packages/web-ai-runtime/package.json
 create mode 100644 packages/web-ai-runtime/src/errors.test.ts
 create mode 100644 packages/web-ai-runtime/src/errors.ts
 create mode 100644 packages/web-ai-runtime/src/index.ts
 create mode 100644 packages/web-ai-runtime/src/model-config-store.test.ts
 create mode 100644 packages/web-ai-runtime/src/model-config-store.ts
 create mode 100644 packages/web-ai-runtime/src/provider-factory.ts
 create mode 100644 packages/web-ai-runtime/src/rpc-adapters.ts
 create mode 100644 packages/web-ai-runtime/src/runtime.test.ts
 create mode 100644 packages/web-ai-runtime/src/runtime.ts
 create mode 100644 packages/web-ai-runtime/src/types.ts
 create mode 100644 packages/web-runtime/src/ai/browser-ai-runtime.test.ts
 create mode 100644 packages/web-runtime/src/ai/conversation-repository.ts
 create mode 100644 packages/web-runtime/src/ai/privacy.ts
 create mode 100644 packages/web-runtime/src/ai/tool-runtime.ts
 create mode 100644 src/i18n/locales/en-US/webAI.json
 create mode 100644 src/i18n/locales/ja-JP/webAI.json
 create mode 100644 src/i18n/locales/zh-CN/webAI.json
 create mode 100644 src/i18n/locales/zh-TW/webAI.json
 create mode 100644 tests/web-ai-sdk-spike/README.md
 create mode 100644 tests/web-ai-sdk-spike/baseline.html
 create mode 100644 tests/web-ai-sdk-spike/index.html
 create mode 100644 tests/web-ai-sdk-spike/src/baseline.ts
 create mode 100644 tests/web-ai-sdk-spike/src/main.ts
 create mode 100644 tests/web-ai-sdk-spike/src/runtime.ts
 create mode 100644 tests/web-ai-sdk-spike/src/style.css
 create mode 100644 tests/web-ai-sdk-spike/tsconfig.json
 create mode 100644 tests/web-ai-sdk-spike/vite.config.mts

diff --git a/apps/web-wasm/src/components/ai/WebAIChat.vue b/apps/web-wasm/src/components/ai/WebAIChat.vue
new file mode 100644
index 00000000..d340fcbc
--- /dev/null
+++ b/apps/web-wasm/src/components/ai/WebAIChat.vue
@@ -0,0 +1,551 @@
+<script setup lang="ts">
+import { computed, nextTick, onMounted, ref, watch } from 'vue'
+import { useI18n } from 'vue-i18n'
+import type { RuntimeContentBlock, RuntimeMessage } from '@openchatlab/ai-runtime'
+import {
+  WebAIChatRuntime,
+  type AgentStreamEvent,
+  type RuntimeConversation,
+  type SaveWebModelConfigInput,
+  type WebAIConnectionTestResult,
+  type WebModelConfig,
+} from '@openchatlab/web-ai-runtime'
+import ChatMessage from '@/components/AIChat/chat/ChatMessage.vue'
+import { useBrowserRuntimeRpc } from '@/services/browser-runtime/service'
+import { reportRuntimeLog } from '@/services/log-report'
+import { useToast } from '@/composables/useToast'
+import WebAIModelSetupModal from './WebAIModelSetupModal.vue'
+import { toWebAIChatMessage } from './message-mapper'
+
+const props = defineProps<{
+  sessionId: string
+  sessionName: string
+}>()
+
+const { t, locale } = useI18n()
+const toast = useToast()
+const runtime = new WebAIChatRuntime(useBrowserRuntimeRpc())
+const setupModal = ref<InstanceType<typeof WebAIModelSetupModal> | null>(null)
+const setupOpen = ref(false)
+const testing = ref(false)
+const saving = ref(false)
+const config = ref<WebModelConfig | null>(null)
+const conversations = ref<RuntimeConversation[]>([])
+const conversationId = ref<string | null>(null)
+const messages = ref<RuntimeMessage[]>([])
+const streamingMessage = ref<RuntimeMessage | null>(null)
+const prompt = ref('')
+const generating = ref(false)
+const loading = ref(true)
+const errorText = ref('')
+const processText = ref('')
+const listOpen = ref(false)
+const messagesContainer = ref<HTMLElement | null>(null)
+
+const displayMessages = computed(() => {
+  const result = messages.value.map((message) => toWebAIChatMessage(message))
+  if (streamingMessage.value) result.push(toWebAIChatMessage(streamingMessage.value, true))
+  return result
+})
+
+const presetQuestions = computed(() => [
+  t('webAI.presets.overview'),
+  t('webAI.presets.topics'),
+  t('webAI.presets.activity'),
+])
+
+onMounted(async () => {
+  try {
+    config.value = await runtime.getConfig()
+    await loadConversations()
+    if (!config.value) setupOpen.value = true
+  } catch (error) {
+    errorText.value = error instanceof Error ? error.message : String(error)
+  } finally {
+    loading.value = false
+  }
+})
+
+watch(
+  () => props.sessionId,
+  async () => {
+    if (generating.value) return
+    conversationId.value = null
+    messages.value = []
+    await loadConversations()
+  }
+)
+
+watch(displayMessages, () => void scrollToBottom(), { deep: true })
+
+async function loadConversations(preferredId?: string) {
+  conversations.value = await runtime.conversations.listConversations(props.sessionId)
+  const nextId = preferredId ?? conversationId.value ?? conversations.value[0]?.id ?? null
+  if (nextId && conversations.value.some((item) => item.id === nextId)) {
+    await selectConversation(nextId)
+  } else {
+    conversationId.value = null
+    messages.value = []
+  }
+}
+
+async function selectConversation(id: string) {
+  if (generating.value || id === conversationId.value) return
+  conversationId.value = id
+  messages.value = await runtime.conversations.getMessages(id)
+  errorText.value = ''
+  listOpen.value = false
+}
+
+function newConversation() {
+  if (generating.value) return
+  conversationId.value = null
+  messages.value = []
+  errorText.value = ''
+  listOpen.value = false
+}
+
+async function deleteConversation(id: string) {
+  if (generating.value || !window.confirm(t('webAI.conversations.deleteConfirm'))) return
+  await runtime.conversations.deleteConversation(id)
+  if (conversationId.value === id) conversationId.value = null
+  await loadConversations()
+}
+
+async function renameConversation(conversation: RuntimeConversation) {
+  if (generating.value) return
+  const title = window.prompt(t('webAI.conversations.renamePrompt'), conversation.title ?? props.sessionName)?.trim()
+  if (!title) return
+  await runtime.conversations.renameConversation(conversation.id, title)
+  await loadConversations(conversation.id)
+}
+
+async function ensureConversation(question: string): Promise<string> {
+  if (conversationId.value) return conversationId.value
+  const title = question.replace(/\s+/g, ' ').slice(0, 36)
+  const conversation = await runtime.conversations.createConversation(props.sessionId, title)
+  conversationId.value = conversation.id
+  conversations.value = [conversation, ...conversations.value]
+  return conversation.id
+}
+
+async function send(content = prompt.value) {
+  const question = content.trim()
+  if (!question || generating.value) return
+  if (!config.value) {
+    setupOpen.value = true
+    return
+  }
+  prompt.value = ''
+  errorText.value = ''
+  processText.value = ''
+  generating.value = true
+  reportRuntimeLog({
+    level: 'info',
+    scope: 'web-ai',
+    message: 'AI generation started',
+    data: { sessionId: props.sessionId, conversationId: conversationId.value },
+  })
+  try {
+    const id = await ensureConversation(question)
+    messages.value.push({
+      id: `optimistic-${Date.now()}`,
+      conversationId: id,
+      role: 'user',
+      content: question,
+      createdAt: Date.now(),
+    })
+    await runtime.run({
+      sessionId: props.sessionId,
+      conversationId: id,
+      locale: locale.value,
+      userMessage: question,
+      onEvent: handleEvent,
+    })
+    await refreshCurrentConversation()
+    await loadConversationListOnly()
+    reportRuntimeLog({
+      level: 'info',
+      scope: 'web-ai',
+      message: 'AI generation completed',
+      data: { sessionId: props.sessionId, conversationId: id },
+    })
+  } catch (error) {
+    const aborted = isAbortError(error)
+    if (!aborted) {
+      errorText.value = getFriendlyError(error)
+    }
+    reportRuntimeLog({
+      level: aborted ? 'info' : 'error',
+      scope: 'web-ai',
+      message: aborted ? 'AI generation aborted' : 'AI generation failed',
+      data: { code: getErrorCode(error), aborted },
+    })
+    await refreshCurrentConversation()
+  } finally {
+    generating.value = false
+    streamingMessage.value = null
+    processText.value = ''
+  }
+}
+
+function stop() {
+  if (conversationId.value && runtime.stop(conversationId.value)) {
+    reportRuntimeLog({
+      level: 'info',
+      scope: 'web-ai',
+      message: 'AI generation stopped',
+      data: { sessionId: props.sessionId, conversationId: conversationId.value },
+    })
+  }
+}
+
+async function regenerate() {
+  if (!conversationId.value || generating.value || !config.value) return
+  const previousMessages = messages.value
+  const latestAssistantIndex = messages.value.findLastIndex((message) => message.role === 'assistant')
+  if (latestAssistantIndex >= 0) {
+    messages.value = messages.value.filter((_, index) => index !== latestAssistantIndex)
+  }
+  generating.value = true
+  errorText.value = ''
+  try {
+    await runtime.regenerateLast({
+      sessionId: props.sessionId,
+      conversationId: conversationId.value,
+      locale: locale.value,
+      onEvent: handleEvent,
+    })
+  } catch (error) {
+    messages.value = previousMessages
+    if (!isAbortError(error)) errorText.value = getFriendlyError(error)
+  } finally {
+    generating.value = false
+    streamingMessage.value = null
+    processText.value = ''
+    await refreshCurrentConversation()
+  }
+}
+
+function handleEvent(event: AgentStreamEvent) {
+  if (event.type === 'start') {
+    streamingMessage.value = {
+      id: event.messageId,
+      conversationId: conversationId.value!,
+      role: 'assistant',
+      content: '',
+      createdAt: Date.now(),
+      blocks: [],
+    }
+    return
+  }
+  const message = streamingMessage.value
+  if (!message) return
+  if (event.type === 'text-delta') {
+    message.content += event.delta
+    appendTextBlock(message, 'text', event.delta)
+  } else if (event.type === 'reasoning-delta') {
+    appendTextBlock(message, 'reasoning', event.delta)
+  } else if (event.type === 'tool-start') {
+    message.blocks?.push({ type: 'tool', callId: event.callId, name: event.name, input: event.input })
+    processText.value = t('webAI.usingTool', { name: event.name })
+  } else if (event.type === 'tool-result') {
+    const block = message.blocks?.find((item) => item.type === 'tool' && item.callId === event.callId) as
+      | Extract<RuntimeContentBlock, { type: 'tool' }>
+      | undefined
+    if (block) {
+      block.result = event.result
+      block.isError = event.isError
+    }
+  } else if (event.type === 'chart') {
+    message.blocks?.push({ type: 'chart', payload: event.payload })
+  } else if (event.type === 'evidence') {
+    message.blocks?.push({ type: 'evidence', payload: event.payload })
+  } else if (event.type === 'compression-start') {
+    processText.value = t('webAI.compressing')
+  } else if (event.type === 'compression-done') {
+    processText.value = ''
+  }
+}
+
+function appendTextBlock(message: RuntimeMessage, type: 'text' | 'reasoning', delta: string) {
+  const last = message.blocks?.at(-1)
+  if (last?.type === type) last.text += delta
+  else message.blocks?.push({ type, text: delta })
+}
+
+async function refreshCurrentConversation() {
+  if (conversationId.value) messages.value = await runtime.conversations.getMessages(conversationId.value)
+}
+
+async function loadConversationListOnly() {
+  conversations.value = await runtime.conversations.listConversations(props.sessionId)
+}
+
+async function testConnection(input: SaveWebModelConfigInput) {
+  testing.value = true
+  const result = await runtime.testConnection(input)
+  setupModal.value?.setTestResult(result)
+  testing.value = false
+}
+
+async function saveConfig(input: SaveWebModelConfigInput) {
+  saving.value = true
+  const result: WebAIConnectionTestResult = await runtime.testConnection(input)
+  setupModal.value?.setTestResult(result)
+  if (result.ok) {
+    config.value = await runtime.saveConfig(input)
+    reportRuntimeLog({
+      level: 'info',
+      scope: 'web-ai',
+      message: 'Browser model configuration saved',
+      data: { provider: input.provider, model: input.model },
+    })
+    setupOpen.value = false
+    toast.success(t('webAI.config.saved'))
+  }
+  saving.value = false
+}
+
+function getFriendlyError(error: unknown): string {
+  if (error && typeof error === 'object' && 'data' in error) {
+    const code = (error as { data?: { code?: string } }).data?.code
+    if (code && ['AUTH', 'RATE_LIMIT', 'MODEL_NOT_FOUND', 'TIMEOUT', 'NETWORK_OR_CORS'].includes(code)) {
+      return t(`webAI.errors.${code}`)
+    }
+  }
+  return error instanceof Error ? error.message : String(error)
+}
+
+function getErrorCode(error: unknown): string {
+  if (error && typeof error === 'object' && 'data' in error) {
+    return String((error as { data?: { code?: unknown } }).data?.code ?? 'UNKNOWN')
+  }
+  return isAbortError(error) ? 'ABORTED' : 'UNKNOWN'
+}
+
+function isAbortError(error: unknown): boolean {
+  if (error instanceof DOMException && error.name === 'AbortError') return true
+  if (!error || typeof error !== 'object') return false
+  const candidate = error as { code?: unknown; data?: { code?: unknown } }
+  return candidate.code === 'ABORTED' || candidate.data?.code === 'ABORTED'
+}
+
+async function scrollToBottom() {
+  await nextTick()
+  messagesContainer.value?.scrollTo({ top: messagesContainer.value.scrollHeight, behavior: 'smooth' })
+}
+
+function handleInputKeydown(event: KeyboardEvent) {
+  if (event.key !== 'Enter' || event.shiftKey || event.isComposing) return
+  event.preventDefault()
+  void send()
+}
+</script>
+
+<template>
+  <div class="relative flex h-full min-h-0 overflow-hidden bg-white/40 dark:bg-page-dark">
+    <button
+      v-if="listOpen"
+      type="button"
+      class="absolute inset-0 z-20 bg-black/20 md:hidden"
+      :aria-label="t('common.close')"
+      @click="listOpen = false"
+    />
+    <aside
+      class="absolute inset-y-0 left-0 z-30 flex w-64 shrink-0 flex-col border-r border-gray-200 bg-white transition-transform md:static md:translate-x-0 dark:border-gray-800 dark:bg-page-dark"
+      :class="listOpen ? 'translate-x-0' : '-translate-x-full'"
+    >
+      <div class="flex items-center justify-between px-3 py-3">
+        <span class="text-xs font-semibold text-gray-500 dark:text-gray-400">{{ t('webAI.conversations.title') }}</span>
+        <UButton
+          icon="i-heroicons-plus"
+          size="xs"
+          color="neutral"
+          variant="ghost"
+          :aria-label="t('webAI.conversations.new')"
+          @click="newConversation"
+        />
+      </div>
+      <div class="min-h-0 flex-1 space-y-1 overflow-y-auto px-2 pb-3">
+        <p v-if="conversations.length === 0" class="px-2 py-6 text-center text-xs text-gray-400">
+          {{ t('webAI.conversations.empty') }}
+        </p>
+        <div
+          v-for="conversation in conversations"
+          :key="conversation.id"
+          class="group flex items-center rounded-lg transition-colors"
+          :class="
+            conversation.id === conversationId
+              ? 'bg-primary-50 text-primary-700 dark:bg-primary-900/20 dark:text-primary-300'
+              : 'text-gray-600 hover:bg-gray-100 dark:text-gray-400 dark:hover:bg-gray-800/60'
+          "
+        >
+          <button
+            type="button"
+            class="min-w-0 flex-1 truncate px-2.5 py-2 text-left text-xs"
+            @click="selectConversation(conversation.id)"
+          >
+            {{ conversation.title || t('webAI.conversations.untitled') }}
+          </button>
+          <div class="mr-1 flex opacity-0 transition-opacity group-hover:opacity-100 group-focus-within:opacity-100">
+            <UButton
+              icon="i-heroicons-pencil"
+              size="xs"
+              color="neutral"
+              variant="ghost"
+              :aria-label="t('webAI.conversations.rename')"
+              @click="renameConversation(conversation)"
+            />
+            <UButton
+              icon="i-heroicons-trash"
+              size="xs"
+              color="neutral"
+              variant="ghost"
+              :aria-label="t('webAI.conversations.delete')"
+              @click="deleteConversation(conversation.id)"
+            />
+          </div>
+        </div>
+      </div>
+    </aside>
+
+    <section class="flex min-w-0 flex-1 flex-col">
+      <div class="flex h-11 shrink-0 items-center gap-2 border-b border-gray-100 px-3 dark:border-gray-800/70">
+        <UButton
+          icon="i-heroicons-bars-3"
+          size="sm"
+          color="neutral"
+          variant="ghost"
+          class="md:hidden"
+          :aria-label="t('webAI.conversations.title')"
+          @click="listOpen = true"
+        />
+        <div class="flex min-w-0 items-center gap-2">
+          <UIcon name="i-heroicons-sparkles" class="h-4 w-4 shrink-0 text-primary-500" />
+          <span class="truncate text-sm font-medium text-gray-700 dark:text-gray-200">
+            {{ t('webAI.defaultAssistant') }}
+          </span>
+        </div>
+        <span v-if="processText" class="ml-auto truncate text-xs text-gray-400">{{ processText }}</span>
+        <UButton
+          icon="i-heroicons-cog-6-tooth"
+          size="sm"
+          color="neutral"
+          variant="ghost"
+          class="ml-auto"
+          :aria-label="t('webAI.config.title')"
+          @click="setupOpen = true"
+        />
+      </div>
+
+      <div ref="messagesContainer" class="min-h-0 flex-1 overflow-x-hidden overflow-y-auto px-3 py-5 sm:px-5">
+        <div v-if="loading" class="flex h-full items-center justify-center">
+          <UIcon name="i-heroicons-arrow-path" class="h-5 w-5 animate-spin text-primary-500" />
+        </div>
+        <div
+          v-else-if="displayMessages.length === 0"
+          class="mx-auto flex min-h-full max-w-2xl flex-col items-center justify-center px-3 pb-24 text-center"
+        >
+          <div class="flex h-11 w-11 items-center justify-center rounded-2xl bg-primary-50 dark:bg-primary-900/20">
+            <UIcon name="i-heroicons-sparkles" class="h-5 w-5 text-primary-500" />
+          </div>
+          <h2 class="mt-4 text-lg font-semibold text-gray-900 dark:text-white">{{ t('webAI.emptyTitle') }}</h2>
+          <p class="mt-1 max-w-md text-sm leading-6 text-gray-500 dark:text-gray-400">
+            {{ t('webAI.emptyDescription') }}
+          </p>
+          <div class="mt-5 flex max-w-xl flex-wrap justify-center gap-2">
+            <button
+              v-for="question in presetQuestions"
+              :key="question"
+              type="button"
+              class="rounded-full border border-gray-200 bg-white px-3 py-1.5 text-xs text-gray-600 transition-colors hover:border-primary-200 hover:bg-primary-50 hover:text-primary-700 dark:border-gray-700 dark:bg-gray-900 dark:text-gray-300 dark:hover:border-primary-800 dark:hover:bg-primary-900/20"
+              @click="send(question)"
+            >
+              {{ question }}
+            </button>
+          </div>
+        </div>
+        <div v-else class="mx-auto max-w-3xl space-y-6 px-1 sm:px-4">
+          <ChatMessage
+            v-for="message in displayMessages"
+            :key="message.id"
+            :message-id="message.id"
+            :role="message.role"
+            :content="message.content"
+            :timestamp="message.timestamp"
+            :content-blocks="message.contentBlocks"
+            :is-streaming="message.isStreaming"
+          />
+        </div>
+      </div>
+
+      <div class="shrink-0 px-3 pb-3 sm:px-5">
+        <div class="mx-auto max-w-3xl">
+          <div
+            v-if="errorText"
+            class="mb-2 flex items-start gap-2 rounded-lg bg-red-50 px-3 py-2 text-xs text-red-700 dark:bg-red-900/20 dark:text-red-300"
+          >
+            <UIcon name="i-heroicons-exclamation-circle" class="mt-0.5 h-4 w-4 shrink-0" />
+            <span class="min-w-0 flex-1">{{ errorText }}</span>
+            <button type="button" @click="errorText = ''"><UIcon name="i-heroicons-x-mark" class="h-4 w-4" /></button>
+          </div>
+          <div
+            class="rounded-2xl border border-gray-200 bg-white p-2 shadow-sm focus-within:border-primary-300 dark:border-gray-700 dark:bg-gray-900 dark:focus-within:border-primary-700"
+          >
+            <textarea
+              v-model="prompt"
+              rows="2"
+              class="max-h-40 min-h-12 w-full resize-none bg-transparent px-2 py-1.5 text-sm text-gray-900 outline-none placeholder:text-gray-400 dark:text-white"
+              :placeholder="t('webAI.inputPlaceholder')"
+              :disabled="generating"
+              @keydown="handleInputKeydown"
+            />
+            <div class="flex items-center justify-between gap-2 px-1">
+              <button
+                v-if="messages.some((message) => message.role === 'assistant') && !generating"
+                type="button"
+                class="rounded-md px-2 py-1 text-xs text-gray-500 transition-colors hover:bg-gray-100 dark:hover:bg-gray-800"
+                @click="regenerate"
+              >
+                {{ t('webAI.regenerate') }}
+              </button>
+              <span v-else />
+              <UButton
+                v-if="generating"
+                icon="i-heroicons-stop-solid"
+                size="sm"
+                color="neutral"
+                variant="soft"
+                @click="stop"
+              >
+                {{ t('webAI.stop') }}
+              </UButton>
+              <UButton
+                v-else
+                icon="i-heroicons-arrow-up"
+                size="sm"
+                color="primary"
+                :disabled="!prompt.trim()"
+                @click="send()"
+              >
+                {{ t('webAI.send') }}
+              </UButton>
+            </div>
+          </div>
+          <p class="mt-1.5 text-center text-[11px] text-gray-400">{{ t('webAI.footer') }}</p>
+        </div>
+      </div>
+    </section>
+
+    <WebAIModelSetupModal
+      ref="setupModal"
+      v-model:open="setupOpen"
+      :config="config"
+      :testing="testing"
+      :saving="saving"
+      @test="testConnection"
+      @save="saveConfig"
+    />
+  </div>
+</template>
diff --git a/apps/web-wasm/src/components/ai/WebAIModelSetupModal.vue b/apps/web-wasm/src/components/ai/WebAIModelSetupModal.vue
new file mode 100644
index 00000000..70f6e00f
--- /dev/null
+++ b/apps/web-wasm/src/components/ai/WebAIModelSetupModal.vue
@@ -0,0 +1,164 @@
+<script setup lang="ts">
+import { reactive, ref, watch } from 'vue'
+import { useI18n } from 'vue-i18n'
+import type {
+  SaveWebModelConfigInput,
+  WebAIConnectionTestResult,
+  WebModelConfig,
+  WebAIProvider,
+} from '@openchatlab/web-ai-runtime'
+
+const props = defineProps<{
+  open: boolean
+  config: WebModelConfig | null
+  testing?: boolean
+  saving?: boolean
+}>()
+
+const emit = defineEmits<{
+  'update:open': [value: boolean]
+  test: [input: SaveWebModelConfigInput]
+  save: [input: SaveWebModelConfigInput]
+}>()
+
+const { t } = useI18n()
+const result = ref<WebAIConnectionTestResult | null>(null)
+const form = reactive<SaveWebModelConfigInput>({
+  provider: 'deepseek',
+  baseURL: 'https://api.deepseek.com',
+  model: 'deepseek-v4-flash',
+  apiKey: '',
+})
+
+const providerOptions = [
+  { label: 'DeepSeek', value: 'deepseek' },
+  { label: t('webAI.config.openAICompatible'), value: 'openai-compatible' },
+]
+
+watch(
+  () => props.open,
+  (open) => {
+    if (!open) return
+    result.value = null
+    form.provider = props.config?.provider ?? 'deepseek'
+    form.baseURL = props.config?.baseURL ?? 'https://api.deepseek.com'
+    form.model = props.config?.model ?? 'deepseek-v4-flash'
+    form.contextWindow = props.config?.contextWindow
+    form.apiKey = ''
+  },
+  { immediate: true }
+)
+
+watch(
+  () => form.provider,
+  (provider) => {
+    if (provider === 'deepseek' && (!form.baseURL || form.baseURL.includes('example'))) {
+      form.baseURL = 'https://api.deepseek.com'
+      form.model = 'deepseek-v4-flash'
+    }
+  }
+)
+
+function getInput(): SaveWebModelConfigInput | null {
+  if (!form.apiKey.trim() || !form.model.trim() || !form.baseURL?.trim()) {
+    result.value = {
+      ok: false,
+      error: { code: 'NOT_CONFIGURED', message: t('webAI.config.required'), retryable: false },
+    }
+    return null
+  }
+  return {
+    provider: form.provider as WebAIProvider,
+    baseURL: form.baseURL.trim(),
+    model: form.model.trim(),
+    contextWindow: form.contextWindow,
+    apiKey: form.apiKey.trim(),
+  }
+}
+
+function testConnection() {
+  const input = getInput()
+  if (input) emit('test', input)
+}
+
+function save() {
+  const input = getInput()
+  if (input) emit('save', input)
+}
+
+defineExpose({
+  setTestResult(value: WebAIConnectionTestResult) {
+    result.value = value
+  },
+})
+</script>
+
+<template>
+  <UModal :open="open" :title="t('webAI.config.title')" @update:open="emit('update:open', $event)">
+    <template #content>
+      <div class="w-full max-w-lg bg-white p-5 dark:bg-page-dark">
+        <div class="flex items-start justify-between gap-4">
+          <div>
+            <h2 class="text-base font-semibold text-gray-900 dark:text-white">{{ t('webAI.config.title') }}</h2>
+            <p class="mt-1 text-xs leading-5 text-gray-500 dark:text-gray-400">{{ t('webAI.config.description') }}</p>
+          </div>
+          <UButton
+            icon="i-heroicons-x-mark"
+            color="neutral"
+            variant="ghost"
+            size="sm"
+            :aria-label="t('common.close')"
+            @click="emit('update:open', false)"
+          />
+        </div>
+
+        <div class="mt-5 space-y-4">
+          <UFormField :label="t('webAI.config.provider')">
+            <USelect v-model="form.provider" class="w-full" :items="providerOptions" value-key="value" />
+          </UFormField>
+          <UFormField :label="t('webAI.config.baseURL')">
+            <UInput v-model="form.baseURL" class="w-full" autocomplete="url" />
+          </UFormField>
+          <UFormField :label="t('webAI.config.model')">
+            <UInput v-model="form.model" class="w-full" autocomplete="off" />
+          </UFormField>
+          <UFormField :label="t('webAI.config.apiKey')">
+            <UInput
+              v-model="form.apiKey"
+              class="w-full"
+              type="password"
+              autocomplete="off"
+              :placeholder="config ? t('webAI.config.apiKeyReplace') : t('webAI.config.apiKeyPlaceholder')"
+            />
+          </UFormField>
+
+          <div
+            class="rounded-lg bg-gray-50 px-3 py-2.5 text-xs leading-5 text-gray-500 dark:bg-gray-800/50 dark:text-gray-400"
+          >
+            <p>{{ t('webAI.config.keyStorageWarning') }}</p>
+            <p class="mt-1">{{ t('webAI.config.corsWarning') }}</p>
+          </div>
+
+          <div
+            v-if="result"
+            class="rounded-lg px-3 py-2 text-xs"
+            :class="
+              result.ok
+                ? 'bg-emerald-50 text-emerald-700 dark:bg-emerald-900/20 dark:text-emerald-300'
+                : 'bg-red-50 text-red-700 dark:bg-red-900/20 dark:text-red-300'
+            "
+          >
+            {{ result.ok ? t('webAI.config.testSuccess', { ms: result.latencyMs }) : result.error?.message }}
+          </div>
+        </div>
+
+        <div class="mt-5 flex justify-end gap-2">
+          <UButton color="neutral" variant="soft" :loading="testing" @click="testConnection">
+            {{ t('webAI.config.test') }}
+          </UButton>
+          <UButton color="primary" :loading="saving" @click="save">{{ t('common.save') }}</UButton>
+        </div>
+      </div>
+    </template>
+  </UModal>
+</template>
diff --git a/apps/web-wasm/src/components/ai/message-mapper.test.ts b/apps/web-wasm/src/components/ai/message-mapper.test.ts
new file mode 100644
index 00000000..2000997d
--- /dev/null
+++ b/apps/web-wasm/src/components/ai/message-mapper.test.ts
@@ -0,0 +1,27 @@
+import assert from 'node:assert/strict'
+import { describe, it } from 'node:test'
+
+import { toWebAIContentBlocks } from './message-mapper'
+
+describe('toWebAIContentBlocks', () => {
+  it('maps shared runtime blocks to the existing ChatLab message renderer', () => {
+    const blocks = toWebAIContentBlocks([
+      { type: 'reasoning', text: 'checking' },
+      {
+        type: 'tool',
+        callId: 'call-1',
+        name: 'get_chat_overview',
+        input: {},
+        result: { content: '{"count":12}' },
+      },
+      { type: 'chart', payload: { spec: { type: 'bar', title: 'Messages' }, rowCount: 1, data: {} } },
+      { type: 'text', text: 'done' },
+    ])
+
+    assert.deepEqual(
+      blocks.map((block) => block.type),
+      ['think', 'tool', 'chart', 'text']
+    )
+    assert.equal(blocks[1]?.type === 'tool' ? blocks[1].tool.status : null, 'done')
+  })
+})
diff --git a/apps/web-wasm/src/components/ai/message-mapper.ts b/apps/web-wasm/src/components/ai/message-mapper.ts
new file mode 100644
index 00000000..8665646d
--- /dev/null
+++ b/apps/web-wasm/src/components/ai/message-mapper.ts
@@ -0,0 +1,50 @@
+import type { RuntimeContentBlock, RuntimeMessage } from '@openchatlab/ai-runtime'
+import type { ChartPayload, ChatEvidencePayload } from '@openchatlab/core'
+import type { ChatMessage, ContentBlock } from '@/stores/aiChat'
+
+export function toWebAIContentBlocks(blocks: RuntimeContentBlock[] | undefined): ContentBlock[] {
+  return (blocks ?? []).flatMap((block): ContentBlock[] => {
+    if (block.type === 'text') return [{ type: 'text', text: block.text }]
+    if (block.type === 'reasoning') return [{ type: 'think', tag: 'reasoning', text: block.text }]
+    if (block.type === 'tool') {
+      return [
+        {
+          type: 'tool',
+          tool: {
+            name: block.name,
+            displayName: block.name,
+            status: block.result ? (block.isError ? 'error' : 'done') : 'running',
+            params: isRecord(block.input) ? block.input : undefined,
+            toolCallId: block.callId,
+            result: block.result?.content,
+            displayResult: block.result?.content,
+            isError: block.isError,
+          },
+        },
+      ]
+    }
+    if (block.type === 'chart') {
+      const payloads = Array.isArray(block.payload) ? block.payload : [block.payload]
+      return payloads.filter(isRecord).map((chart) => ({ type: 'chart', chart: chart as unknown as ChartPayload }))
+    }
+    if (block.type === 'evidence' && isRecord(block.payload)) {
+      return [{ type: 'evidence', evidence: block.payload as unknown as ChatEvidencePayload }]
+    }
+    return []
+  })
+}
+
+export function toWebAIChatMessage(message: RuntimeMessage, isStreaming = false): ChatMessage {
+  return {
+    id: message.id,
+    role: message.role,
+    content: message.content,
+    timestamp: message.createdAt,
+    contentBlocks: toWebAIContentBlocks(message.blocks),
+    isStreaming,
+  }
+}
+
+function isRecord(value: unknown): value is Record<string, unknown> {
+  return !!value && typeof value === 'object' && !Array.isArray(value)
+}
diff --git a/apps/web-wasm/src/pages/SessionDetailPage.vue b/apps/web-wasm/src/pages/SessionDetailPage.vue
index dbfb7078..bf2c0a71 100644
--- a/apps/web-wasm/src/pages/SessionDetailPage.vue
+++ b/apps/web-wasm/src/pages/SessionDetailPage.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { computed, watch } from 'vue'
+import { computed, defineAsyncComponent, watch } from 'vue'
 import { storeToRefs } from 'pinia'
 import { useI18n } from 'vue-i18n'
 import { useRoute, useRouter } from 'vue-router'
@@ -9,13 +9,18 @@ import { useSessionAnalysisPageBase } from '@/composables'
 import { useSessionStore } from '@/stores/session'
 import SessionInsights from '../components/session/insights/SessionInsights.vue'
 
+const WebAIChat = defineAsyncComponent(() => import('../components/ai/WebAIChat.vue'))
+
 const { t } = useI18n()
 const route = useRoute()
 const router = useRouter()
 const sessionStore = useSessionStore()
 const { currentSessionId, isInitialized, sessions } = storeToRefs(sessionStore)
 
-const tabs = [{ id: 'insights', labelKey: 'analysis.tabs.insights', icon: 'i-heroicons-presentation-chart-bar' }]
+const tabs = [
+  { id: 'insights', labelKey: 'analysis.tabs.insights', icon: 'i-heroicons-presentation-chart-bar' },
+  { id: 'ai-chat', labelKey: 'analysis.tabs.aiChat', icon: 'i-heroicons-sparkles' },
+]
 
 const {
   activeTab,
@@ -100,8 +105,8 @@ watch(
         @update:full-range="fullTimeRange = $event"
       />
 
-      <div class="relative flex-1 overflow-y-auto">
-        <LoadingState v-if="isLoading" variant="overlay" :text="t('common.loading')" />
+      <div class="relative min-h-0 flex-1" :class="activeTab === 'ai-chat' ? 'overflow-hidden' : 'overflow-y-auto'">
+        <LoadingState v-if="isLoading && activeTab !== 'ai-chat'" variant="overlay" :text="t('common.loading')" />
 
         <SessionInsights
           v-if="activeTab === 'insights'"
@@ -117,6 +122,13 @@ watch(
           :filtered-member-count="filteredMemberCount"
           :time-filter="timeFilter"
         />
+
+        <WebAIChat
+          v-else-if="activeTab === 'ai-chat' && currentSessionId"
+          :key="'ai-chat-' + currentSessionId"
+          :session-id="currentSessionId"
+          :session-name="session.name"
+        />
       </div>
     </template>
 
diff --git a/eslint.config.mjs b/eslint.config.mjs
index 08c8bd02..c520c774 100644
--- a/eslint.config.mjs
+++ b/eslint.config.mjs
@@ -88,7 +88,7 @@ export default defineConfigWithVueTs(
   },
 
   // Standalone browser runtime and browser service adapters must not pull in
-  // Electron, Node-only runtimes, AI runtimes, or CLI backend implementation.
+  // Electron, Node-only runtimes, or CLI backend implementation.
   {
     files: ['packages/web-runtime/src/**/*.ts', 'src/services/**/browser.ts'],
     ignores: ['**/*.test.ts', '**/*.spec.ts'],
@@ -109,10 +109,6 @@ export default defineConfigWithVueTs(
               name: '@openchatlab/http-routes',
               message: 'Standalone browser code cannot depend on HTTP server routes.',
             },
-            {
-              name: '@openchatlab/tools',
-              message: 'Standalone browser MVP does not include the AI tool runtime.',
-            },
             {
               name: '@openchatlab/config',
               message: 'Standalone browser code cannot depend on the Node-backed config package.',
diff --git a/package.json b/package.json
index e1e53f1c..2dc47618 100644
--- a/package.json
+++ b/package.json
@@ -36,15 +36,18 @@
     "dev:serve": "bash scripts/dev-serve.sh",
     "dev:cli-web": "pnpm run ensure:server-native && CHATLAB_AUTO_SERVE=1 vite --config vite.cli-web.config.mts",
     "dev:web-wasm": "vite --config vite.web-wasm.config.mts",
+    "dev:web-ai-spike": "vite --config tests/web-ai-sdk-spike/vite.config.mts",
     "ensure:server-native": "pnpm --filter chatlab-cli run ensure-native",
     "build:cli-web": "vite build --config vite.cli-web.config.mts",
     "build:web-wasm": "vite build --config vite.web-wasm.config.mts",
+    "build:web-ai-spike": "vite build --config tests/web-ai-sdk-spike/vite.config.mts",
     "docs:dev": "pnpm --filter @openchatlab/docs dev",
     "docs:build": "pnpm --filter @openchatlab/docs build",
     "docs:preview": "pnpm --filter @openchatlab/docs preview",
     "format": "prettier --write .",
     "lint": "eslint . --ext .js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix",
     "type-check:web": "vue-tsc --noEmit -p tsconfig.web.json",
+    "type-check:web-ai-spike": "tsc --noEmit -p tests/web-ai-sdk-spike/tsconfig.json",
     "type-check:node": "tsc --noEmit -p tsconfig.node.json && tsc --noEmit -p apps/desktop/tsconfig.node.json",
     "type-check:all": "pnpm run type-check:web && pnpm run type-check:node",
     "type-check": "vue-tsc --noEmit -p tsconfig.web.json",
@@ -68,11 +71,8 @@
     "vue-i18n": "^11.2.8"
   },
   "devDependencies": {
-    "@openchatlab/core": "workspace:*",
-    "@openchatlab/parser": "workspace:*",
-    "@openchatlab/shared-types": "workspace:*",
-    "@openchatlab/tools": "workspace:*",
-    "@openchatlab/web-runtime": "workspace:*",
+    "@ai-sdk/deepseek": "^3.0.13",
+    "@ai-sdk/openai-compatible": "^3.0.14",
     "@electron-toolkit/tsconfig": "^1.0.1",
     "@iconify-json/heroicons": "^1.2.3",
     "@iconify-json/lucide": "^1.2.118",
@@ -80,12 +80,20 @@
     "@iconify/vue": "5.0.1",
     "@nuxt/icon": "2.3.1",
     "@nuxt/ui": "^4.9.0",
+    "@openchatlab/ai-runtime": "workspace:*",
+    "@openchatlab/core": "workspace:*",
+    "@openchatlab/parser": "workspace:*",
+    "@openchatlab/shared-types": "workspace:*",
+    "@openchatlab/tools": "workspace:*",
+    "@openchatlab/web-ai-runtime": "workspace:*",
+    "@openchatlab/web-runtime": "workspace:*",
     "@tailwindcss/vite": "^4.0.0",
     "@types/markdown-it": "^14.1.2",
     "@vitejs/plugin-vue": "^6.0.0",
     "@vue/eslint-config-prettier": "^10.2.0",
     "@vue/eslint-config-typescript": "^14.9.0",
     "@vueuse/core": "^13.9.0",
+    "ai": "^7.0.37",
     "dayjs": "^1.11.19",
     "eslint": "^9.39.1",
     "eslint-plugin-vue": "^9.33.0",
@@ -97,6 +105,7 @@
     "vite": "^7.0.0",
     "vue": "^3.5.25",
     "vue-router": "^4.6.3",
-    "vue-tsc": "3.2.6"
+    "vue-tsc": "3.2.6",
+    "zod": "^3.25.76"
   }
 }
diff --git a/packages/ai-runtime/package.json b/packages/ai-runtime/package.json
new file mode 100644
index 00000000..7161ec36
--- /dev/null
+++ b/packages/ai-runtime/package.json
@@ -0,0 +1,19 @@
+{
+  "name": "@openchatlab/ai-runtime",
+  "version": "0.0.0",
+  "private": true,
+  "description": "Platform-independent ChatLab AI agent runtime",
+  "type": "module",
+  "main": "./src/index.ts",
+  "types": "./src/index.ts",
+  "exports": {
+    ".": "./src/index.ts",
+    "./default-assistant": "./src/default-assistant.ts"
+  },
+  "dependencies": {
+    "@openchatlab/core": "workspace:*",
+    "@openchatlab/shared-types": "workspace:*",
+    "ai": "^7.0.37",
+    "zod": "^3.25.76"
+  }
+}
diff --git a/packages/ai-runtime/src/context-compression.test.ts b/packages/ai-runtime/src/context-compression.test.ts
new file mode 100644
index 00000000..995dc208
--- /dev/null
+++ b/packages/ai-runtime/src/context-compression.test.ts
@@ -0,0 +1,37 @@
+import assert from 'node:assert/strict'
+import { describe, it } from 'node:test'
+
+import { DEFAULT_COMPRESSION_POLICY, selectCompressionMessages } from './context-compression'
+import type { RuntimeMessage } from './types'
+
+function message(id: string, content: string): RuntimeMessage {
+  return { id, conversationId: 'conversation-1', role: 'user', content, createdAt: Number(id) }
+}
+
+describe('selectCompressionMessages', () => {
+  it('keeps history untouched below the 70 percent threshold', () => {
+    const messages = [message('1', 'short message')]
+    const result = selectCompressionMessages(
+      messages,
+      { model: {} as never, contextWindow: 1_000 },
+      DEFAULT_COMPRESSION_POLICY,
+      'system'
+    )
+    assert.equal(result.shouldCompress, false)
+    assert.deepEqual(result.recentMessages, messages)
+  })
+
+  it('selects old messages and retains the recent 20 percent buffer', () => {
+    const messages = Array.from({ length: 8 }, (_, index) => message(String(index + 1), '中'.repeat(120)))
+    const result = selectCompressionMessages(
+      messages,
+      { model: {} as never, contextWindow: 1_000 },
+      DEFAULT_COMPRESSION_POLICY,
+      'system'
+    )
+    assert.equal(result.shouldCompress, true)
+    assert.ok(result.oldMessages.length >= DEFAULT_COMPRESSION_POLICY.minMessages)
+    assert.ok(result.recentMessages.length > 0)
+    assert.deepEqual([...result.oldMessages, ...result.recentMessages], messages)
+  })
+})
diff --git a/packages/ai-runtime/src/context-compression.ts b/packages/ai-runtime/src/context-compression.ts
new file mode 100644
index 00000000..1cb0c6ed
--- /dev/null
+++ b/packages/ai-runtime/src/context-compression.ts
@@ -0,0 +1,94 @@
+import { generateText } from 'ai'
+
+import { AiRuntimeError, normalizeRuntimeError } from './errors'
+import { estimateMessageTokens } from './token-budget'
+import type { AgentStreamEvent, CompressionPolicy, ConversationRepository, RuntimeMessage, RuntimeModel } from './types'
+
+export const DEFAULT_COMPRESSION_POLICY: CompressionPolicy = {
+  thresholdRatio: 0.7,
+  recentBufferRatio: 0.2,
+  maxSummaryTokens: 8_192,
+  minMessages: 3,
+  maxToolResultCharacters: 24_000,
+}
+
+export function resolveCompressionPolicy(input?: Partial<CompressionPolicy>): CompressionPolicy {
+  return { ...DEFAULT_COMPRESSION_POLICY, ...input }
+}
+
+export function selectCompressionMessages(
+  messages: RuntimeMessage[],
+  model: RuntimeModel,
+  policy: CompressionPolicy,
+  systemPrompt: string
+): { shouldCompress: boolean; oldMessages: RuntimeMessage[]; recentMessages: RuntimeMessage[]; tokens: number } {
+  const tokens =
+    Math.ceil(systemPrompt.length / 4) +
+    messages.reduce((sum, message) => sum + estimateMessageTokens(message, policy.maxToolResultCharacters), 0)
+  if (tokens < model.contextWindow * policy.thresholdRatio) {
+    return { shouldCompress: false, oldMessages: [], recentMessages: messages, tokens }
+  }
+
+  const recentBudget = model.contextWindow * policy.recentBufferRatio
+  let recentTokens = 0
+  let splitAt = messages.length
+  for (let index = messages.length - 1; index >= 0; index -= 1) {
+    const next = estimateMessageTokens(messages[index]!, policy.maxToolResultCharacters)
+    if (recentTokens + next > recentBudget) break
+    recentTokens += next
+    splitAt = index
+  }
+  const oldMessages = messages.slice(0, splitAt)
+  return {
+    shouldCompress: oldMessages.filter((message) => message.role !== 'summary').length >= policy.minMessages,
+    oldMessages,
+    recentMessages: messages.slice(splitAt),
+    tokens,
+  }
+}
+
+function formatCompressionInput(messages: RuntimeMessage[]): string {
+  return messages
+    .map(
+      (message) =>
+        `${message.role === 'user' ? 'User' : message.role === 'summary' ? 'Previous summary' : 'Assistant'}: ${message.content}`
+    )
+    .join('\n\n')
+}
+
+export async function compressConversation(input: {
+  conversationId: string
+  messages: RuntimeMessage[]
+  model: RuntimeModel
+  repository: ConversationRepository
+  systemPrompt: string
+  signal: AbortSignal
+  policy: CompressionPolicy
+  onEvent: (event: AgentStreamEvent) => void
+}): Promise<{ messages: RuntimeMessage[]; compressed: boolean }> {
+  const selected = selectCompressionMessages(input.messages, input.model, input.policy, input.systemPrompt)
+  if (!selected.shouldCompress) return { messages: input.messages, compressed: false }
+
+  input.onEvent({ type: 'compression-start' })
+  try {
+    const result = await generateText({
+      model: input.model.model,
+      abortSignal: input.signal,
+      maxOutputTokens: Math.min(input.policy.maxSummaryTokens, Math.floor(input.model.contextWindow * 0.1)),
+      prompt: `Compress the following AI conversation into a concise progressive summary. Preserve prior summary facts, decisions, user preferences, names, dates, data and unresolved tasks. Paraphrase; never copy long messages verbatim. Use the conversation language. Output only the summary.\n\n${formatCompressionInput(selected.oldMessages)}`,
+    })
+    const boundary = selected.recentMessages[0]?.id ?? selected.oldMessages.at(-1)!.id
+    const summary = await input.repository.replaceSummary(input.conversationId, {
+      content: result.text,
+      boundaryMessageId: boundary,
+    })
+    input.onEvent({ type: 'compression-done', summaryMessageId: summary.id })
+    return { messages: [summary, ...selected.recentMessages], compressed: true }
+  } catch (error) {
+    const normalized = normalizeRuntimeError(error, input.signal)
+    if (normalized.code === 'ABORTED') throw normalized
+    // Compression failure must never mutate or remove the original history.
+    if (error instanceof AiRuntimeError && error.code === 'CONTEXT_TOO_LARGE') throw error
+    return { messages: input.messages, compressed: false }
+  }
+}
diff --git a/packages/ai-runtime/src/default-assistant.ts b/packages/ai-runtime/src/default-assistant.ts
new file mode 100644
index 00000000..fe35036b
--- /dev/null
+++ b/packages/ai-runtime/src/default-assistant.ts
@@ -0,0 +1,71 @@
+export type AssistantLocale = 'zh-CN' | 'zh-TW' | 'en-US' | 'ja-JP'
+
+const PROMPTS: Record<AssistantLocale, string> = {
+  'zh-CN': `你是 ChatLab 里的聊天记录分析搭档。你擅长从群聊或私聊记录中梳理事实、时间线、话题变化、互动方式和值得注意的模式，帮助用户更清楚地理解一段对话，而不是机械地生成分析报告。
+
+## 交流方式
+
+- 跟随用户使用的语言和交流方式，说自然、直接的人话。
+- 简单问题直接回答；复杂问题再分层说明，只在有助于理解时使用标题、列表或表格。
+- 在证据允许时给出明确判断，无法确认的部分要坦率说明。
+
+## 分析边界
+
+- 明确区分聊天记录中能够确认的事实、基于证据作出的推断，以及暂时无法判断的部分。
+- 涉及性格、情绪、关系和动机时尤其谨慎，不替当事人编造心理活动，也不轻易给人贴标签。
+- 可以适量引用有代表性的原话和数据支撑结论，但不要大段堆砌聊天记录。
+- 除非用户明确要求，不说教、不擅自给人生建议，也不把每次回答都写成总结报告。`,
+  'zh-TW': `你是 ChatLab 裡的聊天記錄分析搭檔。你擅長從群聊或私聊記錄中梳理事實、時間線、話題變化、互動方式和值得注意的模式，幫助使用者更清楚地理解一段對話，而不是機械地產生分析報告。
+
+## 交流方式
+
+- 跟隨使用者使用的語言和交流方式，使用自然、直接的表達。
+- 簡單問題直接回答；複雜問題再分層說明，只在有助於理解時使用標題、清單或表格。
+- 在證據允許時給出明確判斷，無法確認的部分要坦率說明。
+
+## 分析邊界
+
+- 明確區分聊天記錄中能夠確認的事實、基於證據作出的推論，以及暫時無法判斷的部分。
+- 涉及性格、情緒、關係和動機時尤其謹慎，不替當事人編造心理活動，也不輕易貼標籤。
+- 可以適量引用有代表性的原話和資料支撐結論，但不要大段堆砌聊天記錄。
+- 除非使用者明確要求，不說教、不擅自給人生建議，也不把每次回答都寫成總結報告。`,
+  'en-US': `You are ChatLab's chat analysis partner. Help users understand group or private chat records by clarifying facts, timelines, topic shifts, interaction patterns, and other notable details instead of mechanically producing reports.
+
+## Communication
+
+- Match the user's language and conversational style. Sound natural and direct.
+- Answer simple questions directly. Structure complex answers only when it improves understanding.
+- Give a clear judgment when evidence supports it and say plainly what cannot be established.
+
+## Analysis boundaries
+
+- Distinguish facts established by the records, reasonable inferences, and unknowns.
+- Be especially careful with personality, emotion, relationships, and motives. Do not invent inner states or casually label people.
+- Use a few representative quotes or data points when useful, but never dump long chat logs.
+- Unless asked, do not moralize, give unsolicited life advice, or turn every response into a report.`,
+  'ja-JP': `あなたは ChatLab のチャット分析パートナーです。グループチャットや個人チャットの記録から、事実、時系列、話題の変化、やり取りの傾向、注目すべき点を整理し、機械的な分析レポートではなく会話を理解できる回答を届けます。
+
+## コミュニケーション
+
+- ユーザーの言語と話し方に合わせ、自然で率直な言葉を使ってください。
+- 簡単な質問には端的に答え、複雑な質問だけを整理して説明してください。
+- 根拠が十分なら明確な判断を示し、確認できないことは率直に伝えてください。
+
+## 分析上の境界
+
+- 記録から確認できる事実、根拠に基づく推測、現時点では判断できないことを明確に区別してください。
+- 性格、感情、人間関係、動機については特に慎重に扱い、本人の内面を作り上げたり安易にレッテルを貼ったりしないでください。
+- 結論を支える場合は代表的な発言やデータを少量引用できますが、長いチャットログをそのまま並べないでください。
+- ユーザーが求めない限り、説教、頼まれていない人生相談、毎回のレポート化は避けてください。`,
+}
+
+export function normalizeAssistantLocale(locale: string): AssistantLocale {
+  if (locale.startsWith('zh-TW') || locale.startsWith('zh-HK')) return 'zh-TW'
+  if (locale.startsWith('zh')) return 'zh-CN'
+  if (locale.startsWith('ja')) return 'ja-JP'
+  return 'en-US'
+}
+
+export function getDefaultAssistantPrompt(locale: string): string {
+  return PROMPTS[normalizeAssistantLocale(locale)]
+}
diff --git a/packages/ai-runtime/src/errors.ts b/packages/ai-runtime/src/errors.ts
new file mode 100644
index 00000000..5a046f41
--- /dev/null
+++ b/packages/ai-runtime/src/errors.ts
@@ -0,0 +1,26 @@
+import type { RuntimeErrorData } from './types'
+
+export class AiRuntimeError extends Error {
+  readonly code: RuntimeErrorData['code']
+  readonly retryable: boolean
+
+  constructor(data: RuntimeErrorData, options?: ErrorOptions) {
+    super(data.message, options)
+    this.name = 'AiRuntimeError'
+    this.code = data.code
+    this.retryable = data.retryable
+  }
+
+  toJSON(): RuntimeErrorData {
+    return { code: this.code, message: this.message, retryable: this.retryable }
+  }
+}
+
+export function normalizeRuntimeError(error: unknown, signal?: AbortSignal): AiRuntimeError {
+  if (error instanceof AiRuntimeError) return error
+  if (signal?.aborted || (error instanceof DOMException && error.name === 'AbortError')) {
+    return new AiRuntimeError({ code: 'ABORTED', message: 'The AI request was cancelled.', retryable: true })
+  }
+  const message = error instanceof Error ? error.message : String(error)
+  return new AiRuntimeError({ code: 'MODEL_ERROR', message, retryable: true }, { cause: error })
+}
diff --git a/packages/ai-runtime/src/index.ts b/packages/ai-runtime/src/index.ts
new file mode 100644
index 00000000..aa27e376
--- /dev/null
+++ b/packages/ai-runtime/src/index.ts
@@ -0,0 +1,6 @@
+export * from './context-compression'
+export * from './default-assistant'
+export * from './errors'
+export * from './runtime'
+export * from './token-budget'
+export * from './types'
diff --git a/packages/ai-runtime/src/runtime.test.ts b/packages/ai-runtime/src/runtime.test.ts
new file mode 100644
index 00000000..09c9615f
--- /dev/null
+++ b/packages/ai-runtime/src/runtime.test.ts
@@ -0,0 +1,209 @@
+import assert from 'node:assert/strict'
+import { describe, it } from 'node:test'
+
+import { MockLanguageModelV3, simulateReadableStream } from 'ai/test'
+
+import { runAgent } from './runtime'
+import type {
+  AgentStreamEvent,
+  AppendRuntimeMessageInput,
+  ConversationRepository,
+  RuntimeConversation,
+  RuntimeMessage,
+  RuntimeToolDefinition,
+  RuntimeToolResult,
+  ToolExecutionContext,
+  ToolExecutor,
+} from './types'
+
+const EMPTY_USAGE = {
+  inputTokens: { total: 12, noCache: 12, cacheRead: 0, cacheWrite: 0 },
+  outputTokens: { total: 4, text: 4, reasoning: 0 },
+}
+
+class MemoryRepository implements ConversationRepository {
+  readonly messages: RuntimeMessage[] = []
+  readonly conversation: RuntimeConversation = {
+    id: 'conversation-1',
+    sessionId: 'session-1',
+    title: null,
+    createdAt: 1,
+    updatedAt: 1,
+  }
+
+  async getConversation(id: string): Promise<RuntimeConversation | null> {
+    return id === this.conversation.id ? this.conversation : null
+  }
+
+  async getMessages(conversationId: string): Promise<RuntimeMessage[]> {
+    return this.messages.filter((message) => message.conversationId === conversationId)
+  }
+
+  async appendMessage(input: AppendRuntimeMessageInput): Promise<RuntimeMessage> {
+    const message: RuntimeMessage = {
+      id: input.id ?? `message-${this.messages.length + 1}`,
+      conversationId: input.conversationId,
+      role: input.role,
+      content: input.content,
+      createdAt: input.createdAt ?? Date.now(),
+      blocks: input.blocks,
+      usage: input.usage,
+    }
+    this.messages.push(message)
+    return message
+  }
+
+  async updateMessage(id: string, patch: Pick<RuntimeMessage, 'content' | 'blocks' | 'usage'>): Promise<void> {
+    const message = this.messages.find((item) => item.id === id)
+    if (message) Object.assign(message, patch)
+  }
+
+  async replaceSummary(
+    conversationId: string,
+    input: { content: string; boundaryMessageId: string }
+  ): Promise<RuntimeMessage> {
+    const current = this.messages.find((message) => message.role === 'summary')
+    if (current) {
+      current.content = input.content
+      return current
+    }
+    return this.appendMessage({ conversationId, role: 'summary', content: input.content })
+  }
+}
+
+class FakeToolExecutor implements ToolExecutor {
+  readonly calls: Array<{ name: string; input: unknown; context: ToolExecutionContext }> = []
+
+  listTools(): RuntimeToolDefinition[] {
+    return [
+      {
+        name: 'get_chat_overview',
+        description: 'Get a safe local chat overview.',
+        inputSchema: { type: 'object', properties: {}, additionalProperties: false },
+      },
+    ]
+  }
+
+  async execute(
+    name: string,
+    input: unknown,
+    context: ToolExecutionContext,
+    _signal: AbortSignal
+  ): Promise<RuntimeToolResult> {
+    this.calls.push({ name, input, context })
+    return {
+      content: '{"totalMessages":128}',
+      data: { totalMessages: 128 },
+      chart: { spec: { type: 'bar', title: 'Messages' }, data: [] },
+    }
+  }
+}
+
+describe('runAgent', () => {
+  it('streams text, persists the assistant message, and emits stable events', async () => {
+    const model = new MockLanguageModelV3({
+      doStream: {
+        stream: simulateReadableStream({
+          chunks: [
+            { type: 'stream-start', warnings: [] },
+            { type: 'text-start', id: 'text-1' },
+            { type: 'text-delta', id: 'text-1', delta: '测试' },
+            { type: 'text-delta', id: 'text-1', delta: '成功' },
+            { type: 'text-end', id: 'text-1' },
+            { type: 'finish', finishReason: { unified: 'stop', raw: 'stop' }, usage: EMPTY_USAGE },
+          ],
+        }),
+      },
+    })
+    const repository = new MemoryRepository()
+    const events: AgentStreamEvent[] = []
+
+    const result = await runAgent({
+      conversationId: 'conversation-1',
+      sessionId: 'session-1',
+      systemPrompt: 'You are a test assistant.',
+      userMessage: 'hello',
+      model: { model, contextWindow: 128_000 },
+      repository,
+      tools: new FakeToolExecutor(),
+      signal: new AbortController().signal,
+      onEvent: (event) => events.push(event),
+    })
+
+    assert.equal(result.message.content, '测试成功')
+    assert.equal(result.finishReason, 'stop')
+    assert.equal(repository.messages.at(-1)?.content, '测试成功')
+    assert.deepEqual(
+      events.filter((event) => event.type === 'text-delta').map((event) => event.delta),
+      ['测试', '成功']
+    )
+    assert.equal(events.at(0)?.type, 'start')
+    assert.equal(events.at(-1)?.type, 'finish')
+  })
+
+  it('executes a tool with the bound session and continues to a final answer', async () => {
+    const model = new MockLanguageModelV3({
+      doStream: [
+        {
+          stream: simulateReadableStream({
+            chunks: [
+              { type: 'stream-start', warnings: [] },
+              {
+                type: 'tool-call',
+                toolCallId: 'call-1',
+                toolName: 'get_chat_overview',
+                input: '{}',
+              },
+              { type: 'finish', finishReason: { unified: 'tool-calls', raw: 'tool_calls' }, usage: EMPTY_USAGE },
+            ],
+          }),
+        },
+        {
+          stream: simulateReadableStream({
+            chunks: [
+              { type: 'stream-start', warnings: [] },
+              { type: 'text-start', id: 'text-2' },
+              { type: 'text-delta', id: 'text-2', delta: '共有 128 条消息。' },
+              { type: 'text-end', id: 'text-2' },
+              { type: 'finish', finishReason: { unified: 'stop', raw: 'stop' }, usage: EMPTY_USAGE },
+            ],
+          }),
+        },
+      ],
+    })
+    const tools = new FakeToolExecutor()
+    const events: AgentStreamEvent[] = []
+
+    const result = await runAgent({
+      conversationId: 'conversation-1',
+      sessionId: 'session-1',
+      systemPrompt: 'Always use the local tool.',
+      userMessage: 'How many messages?',
+      model: { model, contextWindow: 128_000 },
+      repository: new MemoryRepository(),
+      tools,
+      signal: new AbortController().signal,
+      onEvent: (event) => events.push(event),
+    })
+
+    assert.equal(result.message.content, '共有 128 条消息。')
+    assert.deepEqual(result.toolsUsed, ['get_chat_overview'])
+    assert.equal(tools.calls[0]?.context.sessionId, 'session-1')
+    assert.equal(
+      result.message.blocks?.some((block) => block.type === 'chart'),
+      true
+    )
+    assert.equal(
+      events.some((event) => event.type === 'tool-start'),
+      true
+    )
+    assert.equal(
+      events.some((event) => event.type === 'tool-result'),
+      true
+    )
+    assert.equal(
+      events.some((event) => event.type === 'chart'),
+      true
+    )
+  })
+})
diff --git a/packages/ai-runtime/src/runtime.ts b/packages/ai-runtime/src/runtime.ts
new file mode 100644
index 00000000..a1eee523
--- /dev/null
+++ b/packages/ai-runtime/src/runtime.ts
@@ -0,0 +1,205 @@
+import type { ModelMessage, ToolSet } from 'ai'
+import { jsonSchema, stepCountIs, streamText, tool } from 'ai'
+
+import { compressConversation, resolveCompressionPolicy } from './context-compression'
+import { normalizeRuntimeError } from './errors'
+import { truncateToolResult } from './token-budget'
+import type {
+  AgentStreamEvent,
+  FinishReason,
+  RunAgentInput,
+  RunAgentResult,
+  RuntimeContentBlock,
+  RuntimeMessage,
+  RuntimeToolResult,
+  TokenUsage,
+} from './types'
+
+function createId(prefix: string): string {
+  return `${prefix}_${crypto.randomUUID()}`
+}
+
+function toModelMessages(messages: RuntimeMessage[], userMessage: string): ModelMessage[] {
+  const result: ModelMessage[] = messages.map((message) => ({
+    role: message.role === 'summary' ? 'assistant' : message.role,
+    content: message.role === 'summary' ? `[Conversation summary]\n${message.content}` : message.content,
+  }))
+  result.push({ role: 'user', content: userMessage })
+  return result
+}
+
+function mapFinishReason(reason: string | undefined, aborted: boolean): FinishReason {
+  if (aborted) return 'aborted'
+  if (reason === 'stop' || reason === 'length' || reason === 'content-filter' || reason === 'tool-calls') return reason
+  if (reason === 'error') return 'error'
+  return 'unknown'
+}
+
+function mapUsage(usage: {
+  inputTokens?: number
+  outputTokens?: number
+  totalTokens?: number
+  inputTokenDetails?: { cacheReadTokens?: number; cacheWriteTokens?: number }
+  outputTokenDetails?: { reasoningTokens?: number }
+}): TokenUsage {
+  return {
+    inputTokens: usage.inputTokens,
+    outputTokens: usage.outputTokens,
+    totalTokens: usage.totalTokens,
+    cacheReadTokens: usage.inputTokenDetails?.cacheReadTokens,
+    cacheWriteTokens: usage.inputTokenDetails?.cacheWriteTokens,
+    reasoningTokens: usage.outputTokenDetails?.reasoningTokens,
+  }
+}
+
+function appendResultBlocks(
+  result: RuntimeToolResult,
+  blocks: RuntimeContentBlock[],
+  onEvent: (event: AgentStreamEvent) => void
+): void {
+  if (result.chart !== undefined) {
+    blocks.push({ type: 'chart', payload: result.chart })
+    onEvent({ type: 'chart', payload: result.chart })
+  }
+  if (result.evidence !== undefined) {
+    blocks.push({ type: 'evidence', payload: result.evidence })
+    onEvent({ type: 'evidence', payload: result.evidence })
+  }
+}
+
+export async function runAgent(input: RunAgentInput): Promise<RunAgentResult> {
+  const requestId = input.requestId ?? createId('request')
+  const assistantMessageId = input.messageId ?? createId('message')
+  const policy = resolveCompressionPolicy(input.compression)
+  input.onEvent({ type: 'start', requestId, messageId: assistantMessageId })
+
+  try {
+    const storedMessages = await input.repository.getMessages(input.conversationId)
+    const prepared = await compressConversation({
+      conversationId: input.conversationId,
+      messages: storedMessages,
+      model: input.model,
+      repository: input.repository,
+      systemPrompt: input.systemPrompt,
+      signal: input.signal,
+      policy,
+      onEvent: input.onEvent,
+    })
+
+    const blocks: RuntimeContentBlock[] = []
+    const toolsUsed = new Set<string>()
+    const toolSet: ToolSet = Object.fromEntries(
+      input.tools.listTools().map((definition) => [
+        definition.name,
+        tool({
+          description: definition.description,
+          inputSchema: jsonSchema(definition.inputSchema as Parameters<typeof jsonSchema>[0]),
+          execute: async (toolInput, options) => {
+            toolsUsed.add(definition.name)
+            input.onEvent({ type: 'tool-start', callId: options.toolCallId, name: definition.name, input: toolInput })
+            try {
+              const rawResult = await input.tools.execute(
+                definition.name,
+                toolInput,
+                { sessionId: input.sessionId, conversationId: input.conversationId },
+                input.signal
+              )
+              const limited = truncateToolResult(rawResult.content, policy.maxToolResultCharacters)
+              const result = {
+                ...rawResult,
+                content: limited.content,
+                truncated: rawResult.truncated || limited.truncated,
+              }
+              blocks.push({ type: 'tool', callId: options.toolCallId, name: definition.name, input: toolInput, result })
+              input.onEvent({
+                type: 'tool-result',
+                callId: options.toolCallId,
+                name: definition.name,
+                result,
+                isError: false,
+              })
+              appendResultBlocks(result, blocks, input.onEvent)
+              return result
+            } catch (error) {
+              const result = { content: error instanceof Error ? error.message : String(error) }
+              blocks.push({
+                type: 'tool',
+                callId: options.toolCallId,
+                name: definition.name,
+                input: toolInput,
+                result,
+                isError: true,
+              })
+              input.onEvent({
+                type: 'tool-result',
+                callId: options.toolCallId,
+                name: definition.name,
+                result,
+                isError: true,
+              })
+              return result
+            }
+          },
+        }),
+      ])
+    )
+
+    let text = ''
+    let reasoning = ''
+    let aborted = false
+    let finalReason: string | undefined
+    const result = streamText({
+      model: input.model.model,
+      instructions: input.systemPrompt,
+      messages: toModelMessages(prepared.messages, input.userMessage),
+      tools: toolSet,
+      stopWhen: stepCountIs(input.maxToolSteps ?? 8),
+      maxOutputTokens: input.maxOutputTokens ?? 4_096,
+      abortSignal: input.signal,
+      onError: () => undefined,
+    })
+
+    for await (const part of result.stream) {
+      if (part.type === 'text-delta') {
+        text += part.text
+        input.onEvent({ type: 'text-delta', delta: part.text })
+      } else if (part.type === 'reasoning-delta') {
+        reasoning += part.text
+        input.onEvent({ type: 'reasoning-delta', delta: part.text })
+      } else if (part.type === 'finish') {
+        finalReason = part.finishReason
+      } else if (part.type === 'abort') {
+        aborted = true
+      } else if (part.type === 'error' && !input.signal.aborted) {
+        throw part.error
+      }
+    }
+
+    if (reasoning) blocks.unshift({ type: 'reasoning', text: reasoning })
+    if (text) blocks.push({ type: 'text', text })
+    let usage: TokenUsage = {}
+    try {
+      usage = mapUsage(await result.usage)
+    } catch (error) {
+      if (!input.signal.aborted) throw error
+      aborted = true
+    }
+    input.onEvent({ type: 'usage', usage })
+    const finishReason = mapFinishReason(finalReason, aborted || input.signal.aborted)
+    const message = await input.repository.appendMessage({
+      id: assistantMessageId,
+      conversationId: input.conversationId,
+      role: 'assistant',
+      content: text,
+      blocks,
+      usage,
+    })
+    input.onEvent({ type: 'finish', reason: finishReason })
+    return { message, usage, finishReason, toolsUsed: [...toolsUsed], compressed: prepared.compressed }
+  } catch (error) {
+    const normalized = normalizeRuntimeError(error, input.signal)
+    input.onEvent({ type: 'error', error: normalized.toJSON() })
+    if (normalized.code === 'ABORTED') input.onEvent({ type: 'finish', reason: 'aborted' })
+    throw normalized
+  }
+}
diff --git a/packages/ai-runtime/src/token-budget.ts b/packages/ai-runtime/src/token-budget.ts
new file mode 100644
index 00000000..c2da05d7
--- /dev/null
+++ b/packages/ai-runtime/src/token-budget.ts
@@ -0,0 +1,32 @@
+import type { RuntimeContentBlock, RuntimeMessage } from './types'
+
+/** Browser-safe approximation: CJK characters are close to one token; Latin text averages four characters per token. */
+export function estimateTextTokens(text: string): number {
+  if (!text) return 0
+  const normalized = text.replace(/\s+/g, ' ').trim()
+  if (!normalized) return 0
+  const cjk = (normalized.match(/[\u3400-\u9fff\uf900-\ufaff]/g) ?? []).length
+  return Math.max(1, Math.ceil(cjk * 1.15 + (normalized.length - cjk) / 4))
+}
+
+export function contentBlockText(
+  block: RuntimeContentBlock,
+  maxToolResultCharacters = Number.MAX_SAFE_INTEGER
+): string {
+  if (block.type === 'text' || block.type === 'reasoning') return block.text
+  if (block.type !== 'tool' || !block.result) return ''
+  return block.result.content.slice(0, maxToolResultCharacters)
+}
+
+export function estimateMessageTokens(message: RuntimeMessage, maxToolResultCharacters?: number): number {
+  let tokens = estimateTextTokens(message.content) + 4
+  for (const block of message.blocks ?? []) {
+    tokens += estimateTextTokens(contentBlockText(block, maxToolResultCharacters))
+  }
+  return tokens
+}
+
+export function truncateToolResult(result: string, maxCharacters: number): { content: string; truncated: boolean } {
+  if (result.length <= maxCharacters) return { content: result, truncated: false }
+  return { content: `${result.slice(0, maxCharacters)}\n[truncated]`, truncated: true }
+}
diff --git a/packages/ai-runtime/src/types.ts b/packages/ai-runtime/src/types.ts
new file mode 100644
index 00000000..9d6215d0
--- /dev/null
+++ b/packages/ai-runtime/src/types.ts
@@ -0,0 +1,144 @@
+import type { LanguageModel } from 'ai'
+
+export interface TokenUsage {
+  inputTokens?: number
+  outputTokens?: number
+  totalTokens?: number
+  cacheReadTokens?: number
+  cacheWriteTokens?: number
+  reasoningTokens?: number
+}
+
+export type RuntimeMessageRole = 'user' | 'assistant' | 'summary'
+
+export interface RuntimeMessage {
+  id: string
+  conversationId: string
+  role: RuntimeMessageRole
+  content: string
+  createdAt: number
+  blocks?: RuntimeContentBlock[]
+  usage?: TokenUsage
+}
+
+export type RuntimeContentBlock =
+  | { type: 'text'; text: string }
+  | { type: 'reasoning'; text: string }
+  | { type: 'tool'; callId: string; name: string; input: unknown; result?: RuntimeToolResult; isError?: boolean }
+  | { type: 'chart'; payload: unknown }
+  | { type: 'evidence'; payload: unknown }
+
+export interface RuntimeConversation {
+  id: string
+  sessionId: string
+  title: string | null
+  createdAt: number
+  updatedAt: number
+}
+
+export interface AppendRuntimeMessageInput {
+  id?: string
+  conversationId: string
+  role: RuntimeMessageRole
+  content: string
+  createdAt?: number
+  blocks?: RuntimeContentBlock[]
+  usage?: TokenUsage
+}
+
+export interface ConversationRepository {
+  getConversation(id: string): Promise<RuntimeConversation | null>
+  getMessages(conversationId: string): Promise<RuntimeMessage[]>
+  appendMessage(input: AppendRuntimeMessageInput): Promise<RuntimeMessage>
+  updateMessage(id: string, patch: Pick<RuntimeMessage, 'content' | 'blocks' | 'usage'>): Promise<void>
+  replaceSummary(conversationId: string, input: { content: string; boundaryMessageId: string }): Promise<RuntimeMessage>
+}
+
+export interface RuntimeToolResult {
+  content: string
+  data?: unknown
+  chart?: unknown
+  evidence?: unknown
+  truncated?: boolean
+}
+
+export interface RuntimeToolDefinition {
+  name: string
+  description: string
+  inputSchema: {
+    type: 'object'
+    properties: Record<string, unknown>
+    required?: string[]
+    additionalProperties?: boolean
+  }
+}
+
+export interface ToolExecutionContext {
+  sessionId: string
+  conversationId: string
+}
+
+export interface ToolExecutor {
+  listTools(): RuntimeToolDefinition[]
+  execute(name: string, input: unknown, context: ToolExecutionContext, signal: AbortSignal): Promise<RuntimeToolResult>
+}
+
+export interface RuntimeModel {
+  model: LanguageModel
+  contextWindow: number
+}
+
+export type FinishReason = 'stop' | 'length' | 'content-filter' | 'tool-calls' | 'error' | 'aborted' | 'unknown'
+
+export type AgentStreamEvent =
+  | { type: 'start'; requestId: string; messageId: string }
+  | { type: 'text-delta'; delta: string }
+  | { type: 'reasoning-delta'; delta: string }
+  | { type: 'tool-start'; callId: string; name: string; input: unknown }
+  | { type: 'tool-result'; callId: string; name: string; result: RuntimeToolResult; isError: boolean }
+  | { type: 'chart'; payload: unknown }
+  | { type: 'evidence'; payload: unknown }
+  | { type: 'compression-start' }
+  | { type: 'compression-done'; summaryMessageId: string }
+  | { type: 'usage'; usage: TokenUsage }
+  | { type: 'finish'; reason: FinishReason }
+  | { type: 'error'; error: RuntimeErrorData }
+
+export interface RuntimeErrorData {
+  code: 'ABORTED' | 'MODEL_ERROR' | 'TOOL_ERROR' | 'CONTEXT_TOO_LARGE' | 'PERSISTENCE_ERROR' | 'UNKNOWN'
+  message: string
+  retryable: boolean
+}
+
+export interface RunAgentInput {
+  requestId?: string
+  messageId?: string
+  conversationId: string
+  sessionId: string
+  systemPrompt: string
+  userMessage: string
+  model: RuntimeModel
+  repository: ConversationRepository
+  tools: ToolExecutor
+  signal: AbortSignal
+  maxToolSteps?: number
+  maxOutputTokens?: number
+  compression?: Partial<CompressionPolicy>
+  onEvent: (event: AgentStreamEvent) => void
+}
+
+export interface RunAgentResult {
+  message: RuntimeMessage
+  usage: TokenUsage
+  finishReason: FinishReason
+  toolsUsed: string[]
+  compressed: boolean
+}
+
+export interface CompressionPolicy {
+  thresholdRatio: number
+  recentBufferRatio: number
+  maxSummaryTokens: number
+  minMessages: number
+  maxToolResultCharacters: number
+}
diff --git a/packages/tools/src/definitions/search-segments.ts b/packages/tools/src/definitions/search-segments.ts
new file mode 100644
index 00000000..ee8b913e
--- /dev/null
+++ b/packages/tools/src/definitions/search-segments.ts
@@ -0,0 +1,68 @@
+import type { JsonSchema, ToolDefinition, ToolExecutionContext, ToolResult } from '../types'
+
+const inputSchema: JsonSchema = {
+  type: 'object',
+  properties: {
+    keyword: { type: 'string', description: '用于查找会话片段的关键词' },
+    limit: { type: 'number', description: '最多返回多少个片段，默认 20，最大 50' },
+  },
+  required: ['keyword'],
+}
+
+interface SearchSegmentRow {
+  id: number
+  startTs: number
+  endTs: number
+  messageCount: number
+  participants: string | null
+  preview: string | null
+}
+
+async function handler(params: Record<string, unknown>, context: ToolExecutionContext): Promise<ToolResult> {
+  const keyword = String(params.keyword ?? '').trim()
+  if (!keyword) return { content: JSON.stringify({ segments: [] }), data: [] }
+  const limit = Math.max(1, Math.min(Number(params.limit) || 20, 50))
+  const rows = await context.dataProvider!.executeParameterizedSql<SearchSegmentRow>(
+    `WITH hits AS (
+       SELECT DISTINCT mc.segment_id
+       FROM message m
+       JOIN message_context mc ON mc.message_id = m.id
+       WHERE m.content LIKE '%' || :keyword || '%'
+     )
+     SELECT s.id,
+            s.start_ts AS startTs,
+            s.end_ts AS endTs,
+            s.message_count AS messageCount,
+            GROUP_CONCAT(DISTINCT COALESCE(mb.group_nickname, mb.account_name, mb.platform_id)) AS participants,
+            (
+              SELECT SUBSTR(hit.content, 1, 240)
+              FROM message hit
+              JOIN message_context hit_context ON hit_context.message_id = hit.id
+              WHERE hit_context.segment_id = s.id AND hit.content LIKE '%' || :keyword || '%'
+              ORDER BY hit.ts ASC, hit.id ASC
+              LIMIT 1
+            ) AS preview
+     FROM hits
+     JOIN segment s ON s.id = hits.segment_id
+     JOIN message_context mc ON mc.segment_id = s.id
+     JOIN message m ON m.id = mc.message_id
+     JOIN member mb ON mb.id = m.sender_id
+     GROUP BY s.id
+     ORDER BY s.start_ts DESC
+     LIMIT :limit`,
+    { keyword, limit }
+  )
+  const segments = rows.map((row) => ({
+    ...row,
+    participants: row.participants ? row.participants.split(',').slice(0, 20) : [],
+  }))
+  return { content: JSON.stringify({ segments }), data: segments }
+}
+
+export const searchSegmentsTool: ToolDefinition = {
+  name: 'search_segments',
+  description: '按关键词查找本地会话片段，返回时间、参与者、消息数和有限预览；不依赖 AI 摘要或 RAG。',
+  inputSchema,
+  handler,
+  category: 'analysis',
+}
diff --git a/packages/tools/src/index.ts b/packages/tools/src/index.ts
index c5fd12a3..16bb6cc1 100644
--- a/packages/tools/src/index.ts
+++ b/packages/tools/src/index.ts
@@ -35,6 +35,7 @@ export { getMembersTool } from './definitions/get-members'
 export { getMemberNameHistoryTool } from './definitions/get-member-name-history'
 export { getConversationBetweenTool } from './definitions/get-conversation-between'
 export { getSegmentSummariesTool } from './definitions/get-segment-summaries'
+export { searchSegmentsTool } from './definitions/search-segments'
 export { responseTimeAnalysisTool } from './definitions/response-time-analysis'
 export { keywordFrequencyTool } from './definitions/keyword-frequency'
 export { renderChartTool } from './definitions/render-chart'
diff --git a/packages/tools/src/registry.ts b/packages/tools/src/registry.ts
index 53197647..ffd0e3b0 100644
--- a/packages/tools/src/registry.ts
+++ b/packages/tools/src/registry.ts
@@ -26,6 +26,7 @@ import { recentMessagesTool } from './definitions/recent-messages'
 import { getMemberNameHistoryTool } from './definitions/get-member-name-history'
 import { getConversationBetweenTool } from './definitions/get-conversation-between'
 import { getSegmentSummariesTool } from './definitions/get-segment-summaries'
+import { searchSegmentsTool } from './definitions/search-segments'
 import { responseTimeAnalysisTool } from './definitions/response-time-analysis'
 import { keywordFrequencyTool } from './definitions/keyword-frequency'
 import { semanticSearchCurrentChatTool } from './definitions/semantic-search-current-chat'
@@ -53,6 +54,7 @@ const SHARED_TOOLS: ToolDefinition[] = [
   getMemberNameHistoryTool,
   getConversationBetweenTool,
   getSegmentSummariesTool,
+  searchSegmentsTool,
   responseTimeAnalysisTool,
   keywordFrequencyTool,
   renderChartTool,
diff --git a/packages/web-ai-runtime/package.json b/packages/web-ai-runtime/package.json
new file mode 100644
index 00000000..d56ad7e1
--- /dev/null
+++ b/packages/web-ai-runtime/package.json
@@ -0,0 +1,18 @@
+{
+  "name": "@openchatlab/web-ai-runtime",
+  "version": "0.0.0",
+  "private": true,
+  "description": "Browser model, secret storage, and RPC adapters for ChatLab Web WASM AI",
+  "type": "module",
+  "main": "./src/index.ts",
+  "types": "./src/index.ts",
+  "exports": {
+    ".": "./src/index.ts"
+  },
+  "dependencies": {
+    "@ai-sdk/openai-compatible": "^3.0.14",
+    "@openchatlab/ai-runtime": "workspace:*",
+    "@openchatlab/web-runtime": "workspace:*",
+    "ai": "^7.0.37"
+  }
+}
diff --git a/packages/web-ai-runtime/src/errors.test.ts b/packages/web-ai-runtime/src/errors.test.ts
new file mode 100644
index 00000000..81d5c8ec
--- /dev/null
+++ b/packages/web-ai-runtime/src/errors.test.ts
@@ -0,0 +1,14 @@
+import assert from 'node:assert/strict'
+import { describe, it } from 'node:test'
+
+import { normalizeWebAIError } from './errors'
+
+describe('normalizeWebAIError', () => {
+  it('maps provider and browser transport failures to stable UI error codes', () => {
+    assert.equal(normalizeWebAIError({ statusCode: 401, message: 'unauthorized' }).data.code, 'AUTH')
+    assert.equal(normalizeWebAIError({ status: 429, message: 'too many requests' }).data.code, 'RATE_LIMIT')
+    assert.equal(normalizeWebAIError({ status: 404, message: 'missing model' }).data.code, 'MODEL_NOT_FOUND')
+    assert.equal(normalizeWebAIError(new TypeError('Failed to fetch')).data.code, 'NETWORK_OR_CORS')
+    assert.equal(normalizeWebAIError(new Error('request timed out')).data.code, 'TIMEOUT')
+  })
+})
diff --git a/packages/web-ai-runtime/src/errors.ts b/packages/web-ai-runtime/src/errors.ts
new file mode 100644
index 00000000..0ce894b0
--- /dev/null
+++ b/packages/web-ai-runtime/src/errors.ts
@@ -0,0 +1,41 @@
+import type { WebAIRuntimeErrorData } from './types'
+
+export class WebAIRuntimeError extends Error {
+  constructor(
+    readonly data: WebAIRuntimeErrorData,
+    options?: ErrorOptions
+  ) {
+    super(data.message, options)
+    this.name = 'WebAIRuntimeError'
+  }
+}
+
+export function normalizeWebAIError(error: unknown): WebAIRuntimeError {
+  if (error instanceof WebAIRuntimeError) return error
+  const candidate = error as { statusCode?: number; status?: number; message?: string; name?: string }
+  const status = candidate?.statusCode ?? candidate?.status
+  const message = error instanceof Error ? error.message : String(error)
+  if (status === 401 || status === 403) {
+    return new WebAIRuntimeError({ code: 'AUTH', message, retryable: false, status }, { cause: error })
+  }
+  if (status === 404) {
+    return new WebAIRuntimeError({ code: 'MODEL_NOT_FOUND', message, retryable: false, status }, { cause: error })
+  }
+  if (status === 429) {
+    return new WebAIRuntimeError({ code: 'RATE_LIMIT', message, retryable: true, status }, { cause: error })
+  }
+  if (candidate?.name === 'TimeoutError' || /timeout|timed out/i.test(message)) {
+    return new WebAIRuntimeError({ code: 'TIMEOUT', message, retryable: true, status }, { cause: error })
+  }
+  if (error instanceof TypeError && /fetch|network|load failed/i.test(message)) {
+    return new WebAIRuntimeError(
+      {
+        code: 'NETWORK_OR_CORS',
+        message: 'The model request was blocked by the network or browser CORS policy.',
+        retryable: true,
+      },
+      { cause: error }
+    )
+  }
+  return new WebAIRuntimeError({ code: 'UNKNOWN', message, retryable: true, status }, { cause: error })
+}
diff --git a/packages/web-ai-runtime/src/index.ts b/packages/web-ai-runtime/src/index.ts
new file mode 100644
index 00000000..5a7e43ed
--- /dev/null
+++ b/packages/web-ai-runtime/src/index.ts
@@ -0,0 +1,6 @@
+export * from './errors'
+export * from './model-config-store'
+export * from './provider-factory'
+export * from './rpc-adapters'
+export * from './runtime'
+export * from './types'
diff --git a/packages/web-ai-runtime/src/model-config-store.test.ts b/packages/web-ai-runtime/src/model-config-store.test.ts
new file mode 100644
index 00000000..c6a4e144
--- /dev/null
+++ b/packages/web-ai-runtime/src/model-config-store.test.ts
@@ -0,0 +1,64 @@
+import assert from 'node:assert/strict'
+import { webcrypto } from 'node:crypto'
+import { describe, it } from 'node:test'
+
+import { WebModelConfigStore, type BrowserKeyValueStore } from './model-config-store'
+
+class MemoryKeyValueStore implements BrowserKeyValueStore {
+  readonly values = new Map<string, unknown>()
+
+  async get<T>(key: string): Promise<T | undefined> {
+    return this.values.get(key) as T | undefined
+  }
+
+  async set<T>(key: string, value: T): Promise<void> {
+    this.values.set(key, structuredClone(value))
+  }
+
+  async delete(key: string): Promise<void> {
+    this.values.delete(key)
+  }
+}
+
+describe('WebModelConfigStore', () => {
+  it('round-trips a model config without storing the API key as plaintext', async () => {
+    const storage = new MemoryKeyValueStore()
+    const store = new WebModelConfigStore(storage, webcrypto as unknown as Crypto)
+
+    const config = await store.save({
+      provider: 'deepseek',
+      model: 'deepseek-v4-flash',
+      apiKey: 'temporary-test-secret',
+    })
+
+    assert.equal(config.model, 'deepseek-v4-flash')
+    assert.equal(await store.getApiKey(), 'temporary-test-secret')
+    assert.doesNotMatch(JSON.stringify([...storage.values.values()]), /temporary-test-secret/)
+  })
+
+  it('atomically replaces and clears the current model bundle', async () => {
+    const storage = new MemoryKeyValueStore()
+    const store = new WebModelConfigStore(storage, webcrypto as unknown as Crypto)
+    await store.save({ provider: 'deepseek', model: 'deepseek-v4-flash', apiKey: 'first-secret' })
+    await store.save({
+      provider: 'openai-compatible',
+      baseURL: 'https://example.invalid/v1/',
+      model: 'custom-model',
+      apiKey: 'second-secret',
+    })
+
+    assert.deepEqual(await store.getConfig(), {
+      provider: 'openai-compatible',
+      baseURL: 'https://example.invalid/v1/',
+      model: 'custom-model',
+      contextWindow: undefined,
+      updatedAt: (await store.getConfig())?.updatedAt,
+    })
+    assert.equal(await store.getApiKey(), 'second-secret')
+    assert.doesNotMatch(JSON.stringify([...storage.values.values()]), /first-secret|second-secret/)
+
+    await store.clear()
+    assert.equal(await store.getConfig(), null)
+    assert.equal(await store.getApiKey(), null)
+  })
+})
diff --git a/packages/web-ai-runtime/src/model-config-store.ts b/packages/web-ai-runtime/src/model-config-store.ts
new file mode 100644
index 00000000..70a4e973
--- /dev/null
+++ b/packages/web-ai-runtime/src/model-config-store.ts
@@ -0,0 +1,135 @@
+import type { SaveWebModelConfigInput, WebModelConfig } from './types'
+
+const STORAGE_KEY = 'current-model'
+const DATABASE_NAME = 'chatlab-web-ai'
+const OBJECT_STORE_NAME = 'settings'
+
+interface StoredModelBundle {
+  config: WebModelConfig
+  keyMaterial: string
+  apiKeyCiphertext: string
+  iv: string
+}
+
+export interface BrowserKeyValueStore {
+  get<T>(key: string): Promise<T | undefined>
+  set<T>(key: string, value: T): Promise<void>
+  delete(key: string): Promise<void>
+}
+
+function bytesToBase64(bytes: Uint8Array): string {
+  let binary = ''
+  for (const byte of bytes) binary += String.fromCharCode(byte)
+  return btoa(binary)
+}
+
+function base64ToBytes(value: string): Uint8Array<ArrayBuffer> {
+  const binary = atob(value)
+  return Uint8Array.from(binary, (character) => character.charCodeAt(0))
+}
+
+export class IndexedDbKeyValueStore implements BrowserKeyValueStore {
+  private databasePromise: Promise<IDBDatabase> | undefined
+
+  async get<T>(key: string): Promise<T | undefined> {
+    const store = await this.transaction('readonly')
+    return new Promise<T | undefined>((resolve, reject) => {
+      const request = store.get(key)
+      request.onsuccess = () => resolve(request.result as T | undefined)
+      request.onerror = () => reject(request.error)
+    })
+  }
+
+  async set<T>(key: string, value: T): Promise<void> {
+    const store = await this.transaction('readwrite')
+    await new Promise<void>((resolve, reject) => {
+      const request = store.put(value, key)
+      request.onsuccess = () => resolve()
+      request.onerror = () => reject(request.error)
+    })
+  }
+
+  async delete(key: string): Promise<void> {
+    const store = await this.transaction('readwrite')
+    await new Promise<void>((resolve, reject) => {
+      const request = store.delete(key)
+      request.onsuccess = () => resolve()
+      request.onerror = () => reject(request.error)
+    })
+  }
+
+  private async transaction(mode: IDBTransactionMode): Promise<IDBObjectStore> {
+    const database = await (this.databasePromise ??= this.open())
+    return database.transaction(OBJECT_STORE_NAME, mode).objectStore(OBJECT_STORE_NAME)
+  }
+
+  private open(): Promise<IDBDatabase> {
+    if (typeof indexedDB === 'undefined') return Promise.reject(new Error('IndexedDB is not available'))
+    return new Promise((resolve, reject) => {
+      const request = indexedDB.open(DATABASE_NAME, 1)
+      request.onupgradeneeded = () => {
+        if (!request.result.objectStoreNames.contains(OBJECT_STORE_NAME)) {
+          request.result.createObjectStore(OBJECT_STORE_NAME)
+        }
+      }
+      request.onsuccess = () => resolve(request.result)
+      request.onerror = () => reject(request.error)
+    })
+  }
+}
+
+export class WebModelConfigStore {
+  constructor(
+    private readonly storage: BrowserKeyValueStore = new IndexedDbKeyValueStore(),
+    private readonly cryptoProvider: Crypto = crypto
+  ) {}
+
+  async save(input: SaveWebModelConfigInput): Promise<WebModelConfig> {
+    const apiKey = input.apiKey.trim()
+    if (!apiKey) throw new Error('API key is required')
+    const key = await this.cryptoProvider.subtle.generateKey({ name: 'AES-GCM', length: 256 }, true, [
+      'encrypt',
+      'decrypt',
+    ])
+    const iv = this.cryptoProvider.getRandomValues(new Uint8Array(12))
+    const plaintext = new TextEncoder().encode(apiKey)
+    const ciphertext = await this.cryptoProvider.subtle.encrypt({ name: 'AES-GCM', iv }, key, plaintext)
+    const keyMaterial = await this.cryptoProvider.subtle.exportKey('raw', key)
+    const config: WebModelConfig = {
+      provider: input.provider,
+      baseURL: input.baseURL?.trim() || undefined,
+      model: input.model.trim(),
+      contextWindow: input.contextWindow,
+      updatedAt: Date.now(),
+    }
+    await this.storage.set<StoredModelBundle>(STORAGE_KEY, {
+      config,
+      keyMaterial: bytesToBase64(new Uint8Array(keyMaterial)),
+      apiKeyCiphertext: bytesToBase64(new Uint8Array(ciphertext)),
+      iv: bytesToBase64(iv),
+    })
+    return config
+  }
+
+  async getConfig(): Promise<WebModelConfig | null> {
+    return (await this.storage.get<StoredModelBundle>(STORAGE_KEY))?.config ?? null
+  }
+
+  async getApiKey(): Promise<string | null> {
+    const bundle = await this.storage.get<StoredModelBundle>(STORAGE_KEY)
+    if (!bundle) return null
+    const key = await this.cryptoProvider.subtle.importKey('raw', base64ToBytes(bundle.keyMaterial), 'AES-GCM', false, [
+      'decrypt',
+    ])
+    const plaintext = await this.cryptoProvider.subtle.decrypt(
+      { name: 'AES-GCM', iv: base64ToBytes(bundle.iv) },
+      key,
+      base64ToBytes(bundle.apiKeyCiphertext)
+    )
+    return new TextDecoder().decode(plaintext)
+  }
+
+  clear(): Promise<void> {
+    return this.storage.delete(STORAGE_KEY)
+  }
+}
diff --git a/packages/web-ai-runtime/src/provider-factory.ts b/packages/web-ai-runtime/src/provider-factory.ts
new file mode 100644
index 00000000..7e5407a4
--- /dev/null
+++ b/packages/web-ai-runtime/src/provider-factory.ts
@@ -0,0 +1,26 @@
+import type { LanguageModel } from 'ai'
+
+import type { WebModelConfig } from './types'
+
+export interface CreatedWebModel {
+  model: LanguageModel
+  contextWindow: number
+}
+
+export async function createWebAIModel(config: WebModelConfig, apiKey: string): Promise<CreatedWebModel> {
+  const baseURL = (config.baseURL || (config.provider === 'deepseek' ? 'https://api.deepseek.com' : '')).replace(
+    /\/+$/,
+    ''
+  )
+  if (!baseURL) throw new Error('API URL is required for an OpenAI-compatible provider')
+
+  const { createOpenAICompatible } = await import('@ai-sdk/openai-compatible')
+  return {
+    model: createOpenAICompatible({
+      name: config.provider === 'deepseek' ? 'deepseek' : 'chatlab-web',
+      apiKey,
+      baseURL,
+    }).chatModel(config.model),
+    contextWindow: config.contextWindow ?? 128_000,
+  }
+}
diff --git a/packages/web-ai-runtime/src/rpc-adapters.ts b/packages/web-ai-runtime/src/rpc-adapters.ts
new file mode 100644
index 00000000..2382b0ae
--- /dev/null
+++ b/packages/web-ai-runtime/src/rpc-adapters.ts
@@ -0,0 +1,99 @@
+import type {
+  AppendRuntimeMessageInput,
+  ConversationRepository,
+  RuntimeConversation,
+  RuntimeMessage,
+  RuntimeToolDefinition,
+  ToolExecutionContext,
+  ToolExecutor,
+} from '@openchatlab/ai-runtime'
+import type { WebRuntimeTaskPayload, WebRuntimeTaskResult, WebRuntimeTaskType } from '@openchatlab/web-runtime'
+
+export interface WebRuntimeRpcPort {
+  request<T extends WebRuntimeTaskType>(
+    type: T,
+    payload: WebRuntimeTaskPayload<T>,
+    options?: { signal?: AbortSignal }
+  ): Promise<WebRuntimeTaskResult<T>>
+}
+
+export class RpcConversationRepository implements ConversationRepository {
+  constructor(private readonly rpc: WebRuntimeRpcPort) {}
+
+  getConversation(id: string): Promise<RuntimeConversation | null> {
+    return this.rpc.request('ai.conversation.get', { conversationId: id })
+  }
+
+  getMessages(conversationId: string): Promise<RuntimeMessage[]> {
+    return this.rpc.request('ai.message.list', { conversationId })
+  }
+
+  appendMessage(input: AppendRuntimeMessageInput): Promise<RuntimeMessage> {
+    return this.rpc.request('ai.message.append', input)
+  }
+
+  async updateMessage(id: string, patch: Pick<RuntimeMessage, 'content' | 'blocks' | 'usage'>): Promise<void> {
+    await this.rpc.request('ai.message.update', { messageId: id, patch })
+  }
+
+  replaceSummary(
+    conversationId: string,
+    input: { content: string; boundaryMessageId: string }
+  ): Promise<RuntimeMessage> {
+    return this.rpc.request('ai.summary.replace', { conversationId, ...input })
+  }
+
+  createConversation(sessionId: string, title?: string | null): Promise<RuntimeConversation> {
+    return this.rpc.request('ai.conversation.create', { sessionId, title })
+  }
+
+  listConversations(sessionId: string): Promise<RuntimeConversation[]> {
+    return this.rpc.request('ai.conversation.list', { sessionId })
+  }
+
+  async renameConversation(conversationId: string, title: string): Promise<boolean> {
+    return (await this.rpc.request('ai.conversation.rename', { conversationId, title })).renamed
+  }
+
+  async deleteConversation(conversationId: string): Promise<boolean> {
+    return (await this.rpc.request('ai.conversation.delete', { conversationId })).deleted
+  }
+
+  async deleteMessage(messageId: string): Promise<boolean> {
+    return (await this.rpc.request('ai.message.delete', { messageId })).deleted
+  }
+}
+
+export class RpcToolExecutor implements ToolExecutor {
+  constructor(
+    private readonly rpc: WebRuntimeRpcPort,
+    private readonly sessionId: string,
+    private readonly locale: string
+  ) {}
+
+  listTools(): RuntimeToolDefinition[] {
+    throw new Error('Use loadTools before executing the runtime')
+  }
+
+  execute(): Promise<never> {
+    return Promise.reject(new Error('Use withDefinitions before executing the runtime'))
+  }
+
+  loadTools(signal?: AbortSignal) {
+    return this.rpc.request('ai.tool.list', undefined, { signal })
+  }
+
+  withDefinitions(definitions: Awaited<ReturnType<RpcToolExecutor['loadTools']>>): ToolExecutor {
+    return {
+      listTools: () => definitions,
+      execute: (name: string, input: unknown, context: ToolExecutionContext, signal: AbortSignal) => {
+        if (context.sessionId !== this.sessionId) throw new Error('AI tool session does not match the bound session')
+        return this.rpc.request(
+          'ai.tool.execute',
+          { sessionId: this.sessionId, name, input, locale: this.locale },
+          { signal }
+        )
+      },
+    }
+  }
+}
diff --git a/packages/web-ai-runtime/src/runtime.test.ts b/packages/web-ai-runtime/src/runtime.test.ts
new file mode 100644
index 00000000..d11e9d06
--- /dev/null
+++ b/packages/web-ai-runtime/src/runtime.test.ts
@@ -0,0 +1,173 @@
+import assert from 'node:assert/strict'
+import { webcrypto } from 'node:crypto'
+import { describe, it } from 'node:test'
+
+import type { RuntimeConversation, RuntimeMessage } from '@openchatlab/ai-runtime'
+import { MockLanguageModelV3, simulateReadableStream } from 'ai/test'
+
+import { WebModelConfigStore, type BrowserKeyValueStore } from './model-config-store'
+import type { CreatedWebModel } from './provider-factory'
+import type { WebRuntimeRpcPort } from './rpc-adapters'
+import { WebAIChatRuntime } from './runtime'
+
+const EMPTY_USAGE = {
+  inputTokens: { total: 12, noCache: 12, cacheRead: 0, cacheWrite: 0 },
+  outputTokens: { total: 4, text: 4, reasoning: 0 },
+}
+
+class MemoryKeyValueStore implements BrowserKeyValueStore {
+  private readonly values = new Map<string, unknown>()
+  async get<T>(key: string): Promise<T | undefined> {
+    return this.values.get(key) as T | undefined
+  }
+  async set<T>(key: string, value: T): Promise<void> {
+    this.values.set(key, value)
+  }
+  async delete(key: string): Promise<void> {
+    this.values.delete(key)
+  }
+}
+
+function createRpc(): WebRuntimeRpcPort {
+  const conversations = new Map<string, RuntimeConversation>()
+  const messages: RuntimeMessage[] = []
+  let sequence = 0
+  return {
+    request: async (type, payload) => {
+      switch (type) {
+        case 'ai.conversation.create': {
+          const input = payload as { sessionId: string; title?: string | null }
+          const conversation: RuntimeConversation = {
+            id: `conversation-${++sequence}`,
+            sessionId: input.sessionId,
+            title: input.title ?? null,
+            createdAt: Date.now(),
+            updatedAt: Date.now(),
+          }
+          conversations.set(conversation.id, conversation)
+          return conversation as never
+        }
+        case 'ai.conversation.get':
+          return (conversations.get((payload as { conversationId: string }).conversationId) ?? null) as never
+        case 'ai.message.list':
+          return messages.filter(
+            (message) => message.conversationId === (payload as { conversationId: string }).conversationId
+          ) as never
+        case 'ai.message.append': {
+          const input = payload as Omit<RuntimeMessage, 'id' | 'createdAt'>
+          const message: RuntimeMessage = {
+            ...input,
+            id: `message-${++sequence}`,
+            createdAt: Date.now(),
+          }
+          messages.push(message)
+          return message as never
+        }
+        case 'ai.message.update': {
+          const input = payload as { messageId: string; patch: Partial<RuntimeMessage> }
+          const message = messages.find((item) => item.id === input.messageId)
+          if (message) Object.assign(message, input.patch)
+          return undefined as never
+        }
+        case 'ai.message.delete': {
+          const index = messages.findIndex((message) => message.id === (payload as { messageId: string }).messageId)
+          if (index >= 0) messages.splice(index, 1)
+          return { deleted: index >= 0 } as never
+        }
+        case 'ai.tool.list':
+          return [] as never
+        default:
+          throw new Error(`Unexpected test RPC task: ${type}`)
+      }
+    },
+  }
+}
+
+function stream(text: string) {
+  return {
+    stream: simulateReadableStream({
+      chunks: [
+        { type: 'stream-start' as const, warnings: [] },
+        { type: 'text-start' as const, id: 'text' },
+        { type: 'text-delta' as const, id: 'text', delta: text },
+        { type: 'text-end' as const, id: 'text' },
+        { type: 'finish' as const, finishReason: { unified: 'stop' as const, raw: 'stop' }, usage: EMPTY_USAGE },
+      ],
+    }),
+  }
+}
+
+describe('WebAIChatRuntime', () => {
+  it('persists one user turn and supports regenerating the latest assistant reply', async () => {
+    const configStore = new WebModelConfigStore(new MemoryKeyValueStore(), webcrypto as unknown as Crypto)
+    await configStore.save({ provider: 'deepseek', model: 'deepseek-v4-flash', apiKey: 'test-secret' })
+    const model = new MockLanguageModelV3({ doStream: [stream('first answer'), stream('second answer')] })
+    const modelFactory = async (): Promise<CreatedWebModel> => ({ model, contextWindow: 128_000 })
+    const runtime = new WebAIChatRuntime(createRpc(), configStore, modelFactory)
+    const conversation = await runtime.conversations.createConversation('session-1')
+
+    const first = await runtime.run({
+      sessionId: 'session-1',
+      conversationId: conversation.id,
+      locale: 'en',
+      userMessage: 'hello',
+      onEvent: () => undefined,
+    })
+    assert.equal(first.assistantMessage.content, 'first answer')
+
+    const regenerated = await runtime.regenerateLast({
+      sessionId: 'session-1',
+      conversationId: conversation.id,
+      locale: 'en',
+      onEvent: () => undefined,
+    })
+    assert.equal(regenerated.assistantMessage.content, 'second answer')
+    assert.deepEqual(
+      (await runtime.conversations.getMessages(conversation.id)).map((message) => [message.role, message.content]),
+      [
+        ['user', 'hello'],
+        ['assistant', 'second answer'],
+      ]
+    )
+  })
+
+  it('keeps the previous assistant reply when regeneration fails', async () => {
+    const configStore = new WebModelConfigStore(new MemoryKeyValueStore(), webcrypto as unknown as Crypto)
+    await configStore.save({ provider: 'deepseek', model: 'deepseek-v4-flash', apiKey: 'test-secret' })
+    const model = new MockLanguageModelV3({
+      doStream: {
+        stream: simulateReadableStream({
+          chunks: [
+            { type: 'stream-start', warnings: [] },
+            { type: 'error', error: new Error('provider unavailable') },
+          ],
+        }),
+      },
+    })
+    const runtime = new WebAIChatRuntime(createRpc(), configStore, async () => ({ model, contextWindow: 128_000 }))
+    const conversation = await runtime.conversations.createConversation('session-1')
+    await runtime.conversations.appendMessage({
+      conversationId: conversation.id,
+      role: 'user',
+      content: 'hello',
+    })
+    await runtime.conversations.appendMessage({
+      conversationId: conversation.id,
+      role: 'assistant',
+      content: 'existing answer',
+    })
+
+    await assert.rejects(
+      runtime.regenerateLast({
+        sessionId: 'session-1',
+        conversationId: conversation.id,
+        locale: 'en',
+        onEvent: () => undefined,
+      })
+    )
+    assert.deepEqual(
+      (await runtime.conversations.getMessages(conversation.id)).map((message) => message.content),
+      ['hello', 'existing answer']
+    )
+  })
+})
diff --git a/packages/web-ai-runtime/src/runtime.ts b/packages/web-ai-runtime/src/runtime.ts
new file mode 100644
index 00000000..9b09fb6e
--- /dev/null
+++ b/packages/web-ai-runtime/src/runtime.ts
@@ -0,0 +1,172 @@
+import { getDefaultAssistantPrompt, runAgent, type ConversationRepository } from '@openchatlab/ai-runtime'
+import { generateText } from 'ai'
+
+import { normalizeWebAIError, WebAIRuntimeError } from './errors'
+import { WebModelConfigStore } from './model-config-store'
+import { createWebAIModel, type CreatedWebModel } from './provider-factory'
+import { RpcConversationRepository, RpcToolExecutor, type WebRuntimeRpcPort } from './rpc-adapters'
+import type {
+  SaveWebModelConfigInput,
+  WebAIConnectionTestResult,
+  WebAIRunInput,
+  WebAIRunResult,
+  WebModelConfig,
+} from './types'
+
+export class WebAIChatRuntime {
+  readonly conversations: RpcConversationRepository
+  private readonly active = new Map<string, AbortController>()
+
+  constructor(
+    private readonly rpc: WebRuntimeRpcPort,
+    private readonly configStore: WebModelConfigStore = new WebModelConfigStore(),
+    private readonly modelFactory: (
+      config: WebModelConfig,
+      apiKey: string
+    ) => Promise<CreatedWebModel> = createWebAIModel
+  ) {
+    this.conversations = new RpcConversationRepository(rpc)
+  }
+
+  getConfig(): Promise<WebModelConfig | null> {
+    return this.configStore.getConfig()
+  }
+
+  saveConfig(input: SaveWebModelConfigInput): Promise<WebModelConfig> {
+    return this.configStore.save(input)
+  }
+
+  clearConfig(): Promise<void> {
+    return this.configStore.clear()
+  }
+
+  async testConnection(input?: SaveWebModelConfigInput): Promise<WebAIConnectionTestResult> {
+    const startedAt = performance.now()
+    try {
+      const { config, apiKey } = input
+        ? {
+            config: {
+              provider: input.provider,
+              baseURL: input.baseURL,
+              model: input.model,
+              contextWindow: input.contextWindow,
+              updatedAt: Date.now(),
+            } satisfies WebModelConfig,
+            apiKey: input.apiKey,
+          }
+        : await this.getRequiredConfig()
+      const model = await this.modelFactory(config, apiKey)
+      await generateText({ model: model.model, prompt: 'Reply with OK.', maxOutputTokens: 8 })
+      return { ok: true, latencyMs: Math.round(performance.now() - startedAt) }
+    } catch (error) {
+      return { ok: false, error: normalizeWebAIError(error).data }
+    }
+  }
+
+  async run(input: WebAIRunInput): Promise<WebAIRunResult> {
+    if (this.active.has(input.conversationId)) throw new Error('This AI conversation is already generating')
+    const abortController = new AbortController()
+    this.active.set(input.conversationId, abortController)
+    try {
+      const { config, apiKey } = await this.getRequiredConfig()
+      const model = await this.modelFactory(config, apiKey)
+      const toolBridge = new RpcToolExecutor(this.rpc, input.sessionId, input.locale)
+      const tools = toolBridge.withDefinitions(await toolBridge.loadTools(abortController.signal))
+      const userMessage = await this.conversations.appendMessage({
+        conversationId: input.conversationId,
+        role: 'user',
+        content: input.userMessage,
+      })
+      const repository = filterMessagesFromHistory(this.conversations, new Set([userMessage.id]))
+      const result = await runAgent({
+        conversationId: input.conversationId,
+        sessionId: input.sessionId,
+        systemPrompt: getDefaultAssistantPrompt(input.locale),
+        userMessage: input.userMessage,
+        model,
+        repository,
+        tools,
+        signal: abortController.signal,
+        compression: { thresholdRatio: 0.7, recentBufferRatio: 0.2 },
+        onEvent: input.onEvent,
+      })
+      return { userMessage, assistantMessage: result.message }
+    } catch (error) {
+      if (abortController.signal.aborted) throw error
+      throw normalizeWebAIError(error)
+    } finally {
+      this.active.delete(input.conversationId)
+    }
+  }
+
+  stop(conversationId: string): boolean {
+    const controller = this.active.get(conversationId)
+    if (!controller) return false
+    controller.abort()
+    return true
+  }
+
+  async regenerateLast(input: Omit<WebAIRunInput, 'userMessage'>): Promise<WebAIRunResult> {
+    if (this.active.has(input.conversationId)) throw new Error('This AI conversation is already generating')
+    const messages = await this.conversations.getMessages(input.conversationId)
+    const assistant = [...messages].reverse().find((message) => message.role === 'assistant')
+    if (!assistant) throw new Error('No assistant message is available to regenerate')
+    const assistantIndex = messages.findIndex((message) => message.id === assistant.id)
+    const user = [...messages.slice(0, assistantIndex)].reverse().find((message) => message.role === 'user')
+    if (!user) throw new Error('No user message is available to regenerate')
+    const abortController = new AbortController()
+    this.active.set(input.conversationId, abortController)
+    try {
+      const { config, apiKey } = await this.getRequiredConfig()
+      const model = await this.modelFactory(config, apiKey)
+      const toolBridge = new RpcToolExecutor(this.rpc, input.sessionId, input.locale)
+      const tools = toolBridge.withDefinitions(await toolBridge.loadTools(abortController.signal))
+      const result = await runAgent({
+        conversationId: input.conversationId,
+        sessionId: input.sessionId,
+        systemPrompt: getDefaultAssistantPrompt(input.locale),
+        userMessage: user.content,
+        model,
+        // 保留旧回复直到新回复成功，失败或中止时不会让用户丢失原有结果。
+        repository: filterMessagesFromHistory(this.conversations, new Set([user.id, assistant.id])),
+        tools,
+        signal: abortController.signal,
+        onEvent: input.onEvent,
+      })
+      await this.conversations.deleteMessage(assistant.id)
+      return { userMessage: user, assistantMessage: result.message }
+    } catch (error) {
+      if (abortController.signal.aborted) throw error
+      throw normalizeWebAIError(error)
+    } finally {
+      this.active.delete(input.conversationId)
+    }
+  }
+
+  private async getRequiredConfig(): Promise<{ config: WebModelConfig; apiKey: string }> {
+    const [config, apiKey] = await Promise.all([this.configStore.getConfig(), this.configStore.getApiKey()])
+    if (!config || !apiKey) {
+      throw new WebAIRuntimeError({
+        code: 'NOT_CONFIGURED',
+        message: 'Configure a browser-compatible model before starting AI chat.',
+        retryable: false,
+      })
+    }
+    return { config, apiKey }
+  }
+}
+
+function filterMessagesFromHistory(
+  repository: ConversationRepository,
+  messageIds: ReadonlySet<string>
+): ConversationRepository {
+  return {
+    ...repository,
+    getConversation: (id) => repository.getConversation(id),
+    getMessages: async (conversationId) =>
+      (await repository.getMessages(conversationId)).filter((message) => !messageIds.has(message.id)),
+    appendMessage: (input) => repository.appendMessage(input),
+    updateMessage: (id, patch) => repository.updateMessage(id, patch),
+    replaceSummary: (conversationId, input) => repository.replaceSummary(conversationId, input),
+  }
+}
diff --git a/packages/web-ai-runtime/src/types.ts b/packages/web-ai-runtime/src/types.ts
new file mode 100644
index 00000000..ff368f47
--- /dev/null
+++ b/packages/web-ai-runtime/src/types.ts
@@ -0,0 +1,67 @@
+import type { AgentStreamEvent, RuntimeConversation, RuntimeMessage } from '@openchatlab/ai-runtime'
+
+export type WebAIProvider = 'deepseek' | 'openai-compatible'
+
+export interface WebModelConfig {
+  provider: WebAIProvider
+  baseURL?: string
+  model: string
+  contextWindow?: number
+  updatedAt: number
+}
+
+export interface SaveWebModelConfigInput extends Omit<WebModelConfig, 'updatedAt'> {
+  apiKey: string
+}
+
+export interface WebAIConnectionTestResult {
+  ok: boolean
+  latencyMs?: number
+  error?: WebAIRuntimeErrorData
+}
+
+export interface WebAIRuntimeErrorData {
+  code: 'NOT_CONFIGURED' | 'AUTH' | 'RATE_LIMIT' | 'MODEL_NOT_FOUND' | 'TIMEOUT' | 'NETWORK_OR_CORS' | 'UNKNOWN'
+  message: string
+  retryable: boolean
+  status?: number
+}
+
+export interface WebAIRunInput {
+  sessionId: string
+  conversationId: string
+  locale: string
+  userMessage: string
+  onEvent: (event: AgentStreamEvent) => void
+}
+
+export interface WebAIRunResult {
+  userMessage: RuntimeMessage
+  assistantMessage: RuntimeMessage
+}
+
+export interface WebAIRuntimeCapabilities {
+  defaultAssistant: true
+  customAssistants: false
+  skills: false
+  rag: false
+  localModels: false
+  multipleModelSlots: false
+  historyEditing: false
+  regenerateLast: true
+  persistentApiKey: true
+}
+
+export const WEB_AI_RUNTIME_CAPABILITIES: WebAIRuntimeCapabilities = {
+  defaultAssistant: true,
+  customAssistants: false,
+  skills: false,
+  rag: false,
+  localModels: false,
+  multipleModelSlots: false,
+  historyEditing: false,
+  regenerateLast: true,
+  persistentApiKey: true,
+}
+
+export type { AgentStreamEvent, RuntimeConversation, RuntimeMessage }
diff --git a/packages/web-runtime/package.json b/packages/web-runtime/package.json
index 2cd70a41..f6f7cecc 100644
--- a/packages/web-runtime/package.json
+++ b/packages/web-runtime/package.json
@@ -10,8 +10,10 @@
     ".": "./src/index.ts"
   },
   "dependencies": {
+    "@openchatlab/ai-runtime": "workspace:*",
     "@openchatlab/core": "workspace:*",
     "@openchatlab/parser": "workspace:*",
+    "@openchatlab/tools": "workspace:*",
     "@sqlite.org/sqlite-wasm": "3.53.0-build1"
   }
 }
diff --git a/packages/web-runtime/scripts/bench-import.mts b/packages/web-runtime/scripts/bench-import.mts
index 44d5373d..053d201e 100644
--- a/packages/web-runtime/scripts/bench-import.mts
+++ b/packages/web-runtime/scripts/bench-import.mts
@@ -43,7 +43,11 @@ class MemoryWorkspaceDatabase implements WorkspaceDatabasePort {
     return operation()
   }
 
-  async withDatabase<T>(filename: string, schemaSql: string, operation: (db: DatabaseAdapter) => T): Promise<T> {
+  async withDatabase<T>(
+    filename: string,
+    schemaSql: string,
+    operation: (db: DatabaseAdapter) => T | Promise<T>
+  ): Promise<T> {
     let entry = this.databases.get(filename)
     if (!entry) {
       const raw = new this.sqlite3.oo1.DB(':memory:', 'c')
diff --git a/packages/web-runtime/src/ai/browser-ai-runtime.test.ts b/packages/web-runtime/src/ai/browser-ai-runtime.test.ts
new file mode 100644
index 00000000..30cb184a
--- /dev/null
+++ b/packages/web-runtime/src/ai/browser-ai-runtime.test.ts
@@ -0,0 +1,148 @@
+import assert from 'node:assert/strict'
+import { describe, it } from 'node:test'
+
+import sqlite3InitModule, { type Database, type Sqlite3Static } from '@sqlite.org/sqlite-wasm'
+import { CHAT_DB_TABLES, type DatabaseAdapter } from '@openchatlab/core'
+
+import { SqliteWasmDatabaseAdapter } from '../sqlite/adapter'
+import type { WorkspaceDatabasePort } from '../storage/workspace-database'
+import { BrowserAIConversationRepository } from './conversation-repository'
+import { BrowserAIToolRuntime } from './tool-runtime'
+
+class MemoryWorkspaceDatabase implements WorkspaceDatabasePort {
+  private readonly databases = new Map<string, { raw: Database; adapter: SqliteWasmDatabaseAdapter }>()
+
+  constructor(private readonly sqlite3: Sqlite3Static) {}
+
+  withWorkspaceLease<T>(operation: () => Promise<T>): Promise<T> {
+    return operation()
+  }
+
+  async withDatabase<T>(
+    filename: string,
+    schemaSql: string,
+    operation: (db: DatabaseAdapter) => T | Promise<T>
+  ): Promise<T> {
+    let entry = this.databases.get(filename)
+    if (!entry) {
+      const raw = new this.sqlite3.oo1.DB(':memory:', 'c')
+      entry = { raw, adapter: new SqliteWasmDatabaseAdapter(this.sqlite3, raw) }
+      entry.adapter.pragma('foreign_keys = ON')
+      this.databases.set(filename, entry)
+    }
+    entry.adapter.exec(schemaSql)
+    return operation(entry.adapter)
+  }
+
+  async deleteDatabase(filename: string): Promise<boolean> {
+    const entry = this.databases.get(filename)
+    if (!entry) return false
+    entry.adapter.close()
+    return this.databases.delete(filename)
+  }
+
+  async ensureCapacity(minimum: number): Promise<number> {
+    return minimum
+  }
+
+  async getDatabaseFilenames(): Promise<string[]> {
+    return [...this.databases.keys()]
+  }
+
+  dispose(): void {
+    for (const entry of this.databases.values()) entry.adapter.close()
+    this.databases.clear()
+  }
+}
+
+describe('BrowserAIConversationRepository', () => {
+  it('persists conversations, messages and progressive summaries and cascades deletion', async () => {
+    const sqlite3 = await sqlite3InitModule()
+    const database = new MemoryWorkspaceDatabase(sqlite3)
+    const repository = new BrowserAIConversationRepository(database)
+    try {
+      const conversation = await repository.createConversation('session-1', 'First')
+      const user = await repository.appendMessage({
+        conversationId: conversation.id,
+        role: 'user',
+        content: 'hello',
+      })
+      const assistant = await repository.appendMessage({
+        conversationId: conversation.id,
+        role: 'assistant',
+        content: 'world',
+        usage: { totalTokens: 3 },
+      })
+      const firstSummary = await repository.replaceSummary(conversation.id, {
+        content: 'summary one',
+        boundaryMessageId: user.id,
+      })
+      const secondSummary = await repository.replaceSummary(conversation.id, {
+        content: 'summary two',
+        boundaryMessageId: assistant.id,
+      })
+
+      assert.equal(firstSummary.id, secondSummary.id)
+      assert.equal((await repository.listConversations('session-1')).length, 1)
+      assert.deepEqual(
+        (await repository.getMessages(conversation.id)).map((message) => [message.role, message.content]),
+        [
+          ['summary', 'summary two'],
+          ['user', 'hello'],
+          ['assistant', 'world'],
+        ]
+      )
+      assert.equal(await repository.deleteBySession('session-1'), 1)
+      assert.equal(await repository.getConversation(conversation.id), null)
+      assert.deepEqual(await repository.getMessages(conversation.id), [])
+    } finally {
+      database.dispose()
+    }
+  })
+})
+
+describe('BrowserAIToolRuntime', () => {
+  it('binds tools to one session, redacts sensitive fields and rejects write SQL', async () => {
+    const sqlite3 = await sqlite3InitModule()
+    const database = new MemoryWorkspaceDatabase(sqlite3)
+    const tools = new BrowserAIToolRuntime(database)
+    try {
+      await database.withDatabase('/chatlab-sessions/session-1.db', CHAT_DB_TABLES, (db) => {
+        db.prepare(
+          `INSERT INTO meta (name, platform, type, imported_at, owner_id)
+           VALUES (?, ?, ?, ?, ?)`
+        ).run('Safe Test', 'wechat', 'group', 1, 'alice')
+        db.prepare(
+          `INSERT INTO member (platform_id, account_name, group_nickname)
+           VALUES (?, ?, ?)`
+        ).run('alice', 'Alice', 'Alice')
+        db.prepare(
+          `INSERT INTO message (sender_id, sender_account_name, sender_group_nickname, ts, type, content)
+           VALUES (1, ?, ?, 1, 0, ?)`
+        ).run('Alice', 'Alice', '联系 13800138000，邮箱 alice@example.com，密钥 sk-secretabcdefghijklmnop')
+      })
+
+      const search = await tools.execute('session-1', 'search_messages', {
+        keywords: ['联系'],
+        limit: 10,
+      })
+      const serialized = JSON.stringify(search)
+      assert.doesNotMatch(serialized, /13800138000|alice@example\.com|sk-secret/)
+      assert.match(serialized, /<PHONE>|<EMAIL>|<API_KEY>/)
+
+      const writeAttempt = await tools.execute('session-1', 'execute_sql', {
+        sql: "UPDATE meta SET name = 'Changed'",
+      })
+      assert.match(writeAttempt.content, /Only read-only statements are allowed/)
+      const overview = await tools.execute('session-1', 'get_chat_overview', {})
+      assert.match(overview.content, /Safe Test/)
+      assert.equal(
+        tools.listTools().some((tool) => tool.name === 'search_segments'),
+        true
+      )
+      await assert.rejects(tools.execute('session-2', 'unknown_tool', {}), /not available/)
+    } finally {
+      database.dispose()
+    }
+  })
+})
diff --git a/packages/web-runtime/src/ai/conversation-repository.ts b/packages/web-runtime/src/ai/conversation-repository.ts
new file mode 100644
index 00000000..5df2f264
--- /dev/null
+++ b/packages/web-runtime/src/ai/conversation-repository.ts
@@ -0,0 +1,244 @@
+import type {
+  AppendRuntimeMessageInput,
+  ConversationRepository,
+  RuntimeConversation,
+  RuntimeMessage,
+} from '@openchatlab/ai-runtime'
+import type { DatabaseAdapter } from '@openchatlab/core'
+
+import type { WorkspaceDatabasePort } from '../storage/workspace-database'
+
+export const WEB_AI_DATABASE_FILENAME = '/chatlab-ai.db'
+
+export const WEB_AI_SCHEMA = `
+  CREATE TABLE IF NOT EXISTS ai_conversation (
+    id TEXT PRIMARY KEY,
+    session_id TEXT NOT NULL,
+    title TEXT,
+    created_at INTEGER NOT NULL,
+    updated_at INTEGER NOT NULL
+  );
+  CREATE INDEX IF NOT EXISTS idx_ai_conversation_session_updated
+    ON ai_conversation(session_id, updated_at DESC);
+
+  CREATE TABLE IF NOT EXISTS ai_message (
+    id TEXT PRIMARY KEY,
+    conversation_id TEXT NOT NULL,
+    role TEXT NOT NULL CHECK (role IN ('user', 'assistant', 'summary')),
+    content TEXT NOT NULL,
+    created_at INTEGER NOT NULL,
+    blocks_json TEXT,
+    usage_json TEXT,
+    summary_boundary_message_id TEXT,
+    FOREIGN KEY(conversation_id) REFERENCES ai_conversation(id) ON DELETE CASCADE
+  );
+  CREATE INDEX IF NOT EXISTS idx_ai_message_conversation_created
+    ON ai_message(conversation_id, created_at ASC, id ASC);
+  CREATE UNIQUE INDEX IF NOT EXISTS idx_ai_message_single_summary
+    ON ai_message(conversation_id) WHERE role = 'summary';
+`
+
+interface ConversationRow {
+  id: string
+  session_id: string
+  title: string | null
+  created_at: number
+  updated_at: number
+}
+
+interface MessageRow {
+  id: string
+  conversation_id: string
+  role: RuntimeMessage['role']
+  content: string
+  created_at: number
+  blocks_json: string | null
+  usage_json: string | null
+}
+
+function createId(prefix: string): string {
+  return `${prefix}_${crypto.randomUUID()}`
+}
+
+function parseJson<T>(value: string | null): T | undefined {
+  if (!value) return undefined
+  try {
+    return JSON.parse(value) as T
+  } catch {
+    return undefined
+  }
+}
+
+function mapConversation(row: ConversationRow): RuntimeConversation {
+  return {
+    id: row.id,
+    sessionId: row.session_id,
+    title: row.title,
+    createdAt: row.created_at,
+    updatedAt: row.updated_at,
+  }
+}
+
+function mapMessage(row: MessageRow): RuntimeMessage {
+  return {
+    id: row.id,
+    conversationId: row.conversation_id,
+    role: row.role,
+    content: row.content,
+    createdAt: row.created_at,
+    blocks: parseJson(row.blocks_json),
+    usage: parseJson(row.usage_json),
+  }
+}
+
+export class BrowserAIConversationRepository implements ConversationRepository {
+  constructor(private readonly database: WorkspaceDatabasePort) {}
+
+  createConversation(sessionId: string, title: string | null = null): Promise<RuntimeConversation> {
+    const now = Date.now()
+    const conversation: RuntimeConversation = {
+      id: createId('conversation'),
+      sessionId,
+      title,
+      createdAt: now,
+      updatedAt: now,
+    }
+    return this.withDatabase((db) => {
+      db.prepare(
+        'INSERT INTO ai_conversation (id, session_id, title, created_at, updated_at) VALUES (?, ?, ?, ?, ?)'
+      ).run(conversation.id, sessionId, title, now, now)
+      return conversation
+    })
+  }
+
+  async getConversation(id: string): Promise<RuntimeConversation | null> {
+    return this.withDatabase((db) => {
+      const row = db.prepare('SELECT * FROM ai_conversation WHERE id = ?').get(id) as ConversationRow | undefined
+      return row ? mapConversation(row) : null
+    })
+  }
+
+  listConversations(sessionId: string): Promise<RuntimeConversation[]> {
+    return this.withDatabase((db) =>
+      (
+        db
+          .prepare('SELECT * FROM ai_conversation WHERE session_id = ? ORDER BY updated_at DESC, id DESC')
+          .all(sessionId) as unknown as ConversationRow[]
+      ).map(mapConversation)
+    )
+  }
+
+  renameConversation(id: string, title: string): Promise<boolean> {
+    return this.withDatabase(
+      (db) =>
+        db.prepare('UPDATE ai_conversation SET title = ?, updated_at = ? WHERE id = ?').run(title, Date.now(), id)
+          .changes > 0
+    )
+  }
+
+  deleteConversation(id: string): Promise<boolean> {
+    return this.withDatabase((db) => db.prepare('DELETE FROM ai_conversation WHERE id = ?').run(id).changes > 0)
+  }
+
+  deleteBySession(sessionId: string): Promise<number> {
+    return this.withDatabase(
+      (db) => db.prepare('DELETE FROM ai_conversation WHERE session_id = ?').run(sessionId).changes
+    )
+  }
+
+  getMessages(conversationId: string): Promise<RuntimeMessage[]> {
+    return this.withDatabase((db) =>
+      (
+        db
+          .prepare(
+            `SELECT * FROM ai_message
+             WHERE conversation_id = ?
+             ORDER BY CASE WHEN role = 'summary' THEN 0 ELSE 1 END, created_at ASC, id ASC`
+          )
+          .all(conversationId) as unknown as MessageRow[]
+      ).map(mapMessage)
+    )
+  }
+
+  appendMessage(input: AppendRuntimeMessageInput): Promise<RuntimeMessage> {
+    const message: RuntimeMessage = {
+      id: input.id ?? createId('message'),
+      conversationId: input.conversationId,
+      role: input.role,
+      content: input.content,
+      createdAt: input.createdAt ?? Date.now(),
+      blocks: input.blocks,
+      usage: input.usage,
+    }
+    return this.withDatabase((db) => {
+      db.transaction(() => {
+        db.prepare(
+          `INSERT INTO ai_message (
+             id, conversation_id, role, content, created_at, blocks_json, usage_json
+           ) VALUES (?, ?, ?, ?, ?, ?, ?)`
+        ).run(
+          message.id,
+          message.conversationId,
+          message.role,
+          message.content,
+          message.createdAt,
+          message.blocks ? JSON.stringify(message.blocks) : null,
+          message.usage ? JSON.stringify(message.usage) : null
+        )
+        db.prepare('UPDATE ai_conversation SET updated_at = ? WHERE id = ?').run(Date.now(), message.conversationId)
+      })
+      return message
+    })
+  }
+
+  updateMessage(id: string, patch: Pick<RuntimeMessage, 'content' | 'blocks' | 'usage'>): Promise<void> {
+    return this.withDatabase((db) => {
+      db.prepare('UPDATE ai_message SET content = ?, blocks_json = ?, usage_json = ? WHERE id = ?').run(
+        patch.content,
+        patch.blocks ? JSON.stringify(patch.blocks) : null,
+        patch.usage ? JSON.stringify(patch.usage) : null,
+        id
+      )
+    })
+  }
+
+  deleteMessage(id: string): Promise<boolean> {
+    return this.withDatabase((db) => db.prepare('DELETE FROM ai_message WHERE id = ?').run(id).changes > 0)
+  }
+
+  replaceSummary(
+    conversationId: string,
+    input: { content: string; boundaryMessageId: string }
+  ): Promise<RuntimeMessage> {
+    return this.withDatabase((db) => {
+      const existing = db
+        .prepare("SELECT * FROM ai_message WHERE conversation_id = ? AND role = 'summary'")
+        .get(conversationId) as MessageRow | undefined
+      const message: RuntimeMessage = {
+        id: existing?.id ?? createId('summary'),
+        conversationId,
+        role: 'summary',
+        content: input.content,
+        createdAt: Date.now(),
+      }
+      if (existing) {
+        db.prepare(
+          `UPDATE ai_message
+           SET content = ?, created_at = ?, blocks_json = NULL, usage_json = NULL, summary_boundary_message_id = ?
+           WHERE id = ?`
+        ).run(message.content, message.createdAt, input.boundaryMessageId, message.id)
+      } else {
+        db.prepare(
+          `INSERT INTO ai_message (
+             id, conversation_id, role, content, created_at, summary_boundary_message_id
+           ) VALUES (?, ?, 'summary', ?, ?, ?)`
+        ).run(message.id, conversationId, message.content, message.createdAt, input.boundaryMessageId)
+      }
+      return message
+    })
+  }
+
+  private withDatabase<T>(operation: (db: DatabaseAdapter) => T): Promise<T> {
+    return this.database.withDatabase(WEB_AI_DATABASE_FILENAME, WEB_AI_SCHEMA, operation)
+  }
+}
diff --git a/packages/web-runtime/src/ai/privacy.ts b/packages/web-runtime/src/ai/privacy.ts
new file mode 100644
index 00000000..b714bf8a
--- /dev/null
+++ b/packages/web-runtime/src/ai/privacy.ts
@@ -0,0 +1,32 @@
+import type { RawMessage } from '@openchatlab/tools'
+
+const SENSITIVE_PATTERNS: Array<[RegExp, string]> = [
+  [/[A-Za-z0-9._%+-]+@[A-Za-z0-9.-]+\.[A-Za-z]{2,}/g, '<EMAIL>'],
+  [/(?<!\d)1[3-9]\d{9}(?!\d)/g, '<PHONE>'],
+  [/(?<!\d)\d{17}[\dXx](?!\d)/g, '<ID_CARD>'],
+  [/(?<!\d)(?:\d[ -]?){16,19}(?!\d)/g, '<BANK_CARD>'],
+  [/(?:sk|pk|api)[-_][A-Za-z0-9_-]{16,}/gi, '<API_KEY>'],
+  [/Bearer\s+[A-Za-z0-9._~+/=-]{16,}/gi, 'Bearer <TOKEN>'],
+]
+
+export function redactSensitiveText(value: string): string {
+  return SENSITIVE_PATTERNS.reduce((text, [pattern, replacement]) => text.replace(pattern, replacement), value)
+}
+
+export function redactMessages(messages: RawMessage[]): RawMessage[] {
+  return messages.map((message) => ({
+    ...message,
+    content: message.content ? redactSensitiveText(message.content) : message.content,
+  }))
+}
+
+export function sanitizeToolValue<T>(value: T): T {
+  if (typeof value === 'string') return redactSensitiveText(value) as T
+  if (Array.isArray(value)) return value.map((item) => sanitizeToolValue(item)) as T
+  if (value && typeof value === 'object') {
+    return Object.fromEntries(
+      Object.entries(value as Record<string, unknown>).map(([key, item]) => [key, sanitizeToolValue(item)])
+    ) as T
+  }
+  return value
+}
diff --git a/packages/web-runtime/src/ai/tool-runtime.ts b/packages/web-runtime/src/ai/tool-runtime.ts
new file mode 100644
index 00000000..314abd87
--- /dev/null
+++ b/packages/web-runtime/src/ai/tool-runtime.ts
@@ -0,0 +1,96 @@
+import type { RuntimeToolDefinition, RuntimeToolResult } from '@openchatlab/ai-runtime'
+import { CHAT_DB_TABLES, generateSessionIndex, hasSessionIndex } from '@openchatlab/core'
+import {
+  CoreDataProvider,
+  executeToolForAgent,
+  getToolByName,
+  type RawMessage,
+  type ToolExecutionContext,
+} from '@openchatlab/tools'
+
+import { sessionDatabaseFilename, validateSessionId } from '../import/session-paths'
+import type { WorkspaceDatabasePort } from '../storage/workspace-database'
+import { redactMessages, redactSensitiveText, sanitizeToolValue } from './privacy'
+
+export const WEB_AI_TOOL_NAMES = [
+  'get_chat_overview',
+  'search_messages',
+  'deep_search_messages',
+  'get_recent_messages',
+  'get_message_context',
+  'search_segments',
+  'get_segment_messages',
+  'get_members',
+  'get_member_stats',
+  'get_time_stats',
+  'get_conversation_between',
+  'get_member_name_history',
+  'get_schema',
+  'execute_sql',
+  'render_chart',
+] as const
+
+const MAX_TOOL_RESULT_CHARACTERS = 24_000
+const WEB_AI_TOOL_SET = new Set<string>(WEB_AI_TOOL_NAMES)
+
+function getDefinitions() {
+  return WEB_AI_TOOL_NAMES.map((name) => getToolByName(name)).filter((tool) => tool !== undefined)
+}
+
+export class BrowserAIToolRuntime {
+  constructor(private readonly database: WorkspaceDatabasePort) {}
+
+  listTools(): RuntimeToolDefinition[] {
+    return getDefinitions().map((tool) => ({
+      name: tool.name,
+      description: tool.description,
+      inputSchema: tool.inputSchema,
+    }))
+  }
+
+  async execute(
+    sessionId: string,
+    name: string,
+    input: unknown,
+    options: { locale?: string; signal?: AbortSignal } = {}
+  ): Promise<RuntimeToolResult> {
+    validateSessionId(sessionId)
+    if (!WEB_AI_TOOL_SET.has(name)) throw new Error(`Tool is not available in Web WASM: ${name}`)
+    const definition = getToolByName(name)
+    if (!definition) throw new Error(`Unknown tool: ${name}`)
+    options.signal?.throwIfAborted()
+
+    return this.database.withDatabase(sessionDatabaseFilename(sessionId), CHAT_DB_TABLES, async (db) => {
+      if (name === 'search_segments' && !hasSessionIndex(db)) generateSessionIndex(db)
+      const context: ToolExecutionContext = {
+        db,
+        dataProvider: new CoreDataProvider(db),
+        sessionId,
+        locale: options.locale,
+        abortSignal: options.signal,
+        maxMessagesLimit: 1_000,
+        maxToolResultTokens: 8_000,
+        desensitizeMessages: redactMessages,
+      }
+      const result = await executeToolForAgent(definition, input, context)
+      const details = sanitizeToolValue(result.details)
+      const rawMessages =
+        details && typeof details === 'object' && Array.isArray((details as { rawMessages?: unknown }).rawMessages)
+          ? redactMessages((details as { rawMessages: RawMessage[] }).rawMessages)
+          : undefined
+      const safeDetails = rawMessages ? { ...(details as Record<string, unknown>), rawMessages } : details
+      const safeText = redactSensitiveText(result.content.map((part) => part.text).join('\n'))
+      const truncated = safeText.length > MAX_TOOL_RESULT_CHARACTERS
+      const content = truncated ? `${safeText.slice(0, MAX_TOOL_RESULT_CHARACTERS)}\n[truncated]` : safeText
+      const objectDetails =
+        safeDetails && typeof safeDetails === 'object' ? (safeDetails as Record<string, unknown>) : {}
+      return {
+        content,
+        data: safeDetails,
+        chart: objectDetails.chart ?? objectDetails.charts,
+        evidence: objectDetails.evidence,
+        truncated,
+      }
+    })
+  }
+}
diff --git a/packages/web-runtime/src/import/session-runtime.test.ts b/packages/web-runtime/src/import/session-runtime.test.ts
index 830a7b27..187cd8a7 100644
--- a/packages/web-runtime/src/import/session-runtime.test.ts
+++ b/packages/web-runtime/src/import/session-runtime.test.ts
@@ -36,7 +36,11 @@ class MemoryWorkspaceDatabase implements WorkspaceDatabasePort {
     }
   }
 
-  async withDatabase<T>(filename: string, schemaSql: string, operation: (db: DatabaseAdapter) => T): Promise<T> {
+  async withDatabase<T>(
+    filename: string,
+    schemaSql: string,
+    operation: (db: DatabaseAdapter) => T | Promise<T>
+  ): Promise<T> {
     this.assertWorkspaceLease()
     let entry = this.databases.get(filename)
     if (!entry) {
diff --git a/packages/web-runtime/src/index.ts b/packages/web-runtime/src/index.ts
index 6565213f..a8cc4f9b 100644
--- a/packages/web-runtime/src/index.ts
+++ b/packages/web-runtime/src/index.ts
@@ -24,6 +24,9 @@ export type {
   BrowserTimeFilter,
 } from './import/session-runtime'
 export { sessionDatabaseFilename } from './import/session-runtime'
+export { BrowserAIConversationRepository, WEB_AI_DATABASE_FILENAME, WEB_AI_SCHEMA } from './ai/conversation-repository'
+export { BrowserAIToolRuntime, WEB_AI_TOOL_NAMES } from './ai/tool-runtime'
+export { redactSensitiveText, redactMessages, sanitizeToolValue } from './ai/privacy'
 
 export function createWebRuntimeClient(options: WebRuntimeRpcClientOptions = {}): WebRuntimeRpcClient {
   if (typeof Worker !== 'function') {
diff --git a/packages/web-runtime/src/rpc/protocol.ts b/packages/web-runtime/src/rpc/protocol.ts
index 098bfc83..d8df3e70 100644
--- a/packages/web-runtime/src/rpc/protocol.ts
+++ b/packages/web-runtime/src/rpc/protocol.ts
@@ -1,5 +1,12 @@
 import type { BrowserImportFormatId, BrowserParseSource } from '../import/browser-parser'
 import type { BrowserSessionCatalogItem } from '../import/session-catalog'
+import type {
+  AppendRuntimeMessageInput,
+  RuntimeConversation,
+  RuntimeMessage,
+  RuntimeToolDefinition,
+  RuntimeToolResult,
+} from '@openchatlab/ai-runtime'
 import type {
   DailyActivity,
   HourlyActivity,
@@ -93,6 +100,54 @@ export interface WebRuntimeTaskMap {
     payload: { sessionId: string; name: string }
     result: { renamed: boolean }
   }
+  'ai.conversation.create': {
+    payload: { sessionId: string; title?: string | null }
+    result: RuntimeConversation
+  }
+  'ai.conversation.list': {
+    payload: { sessionId: string }
+    result: RuntimeConversation[]
+  }
+  'ai.conversation.get': {
+    payload: { conversationId: string }
+    result: RuntimeConversation | null
+  }
+  'ai.conversation.rename': {
+    payload: { conversationId: string; title: string }
+    result: { renamed: boolean }
+  }
+  'ai.conversation.delete': {
+    payload: { conversationId: string }
+    result: { deleted: boolean }
+  }
+  'ai.message.list': {
+    payload: { conversationId: string }
+    result: RuntimeMessage[]
+  }
+  'ai.message.append': {
+    payload: AppendRuntimeMessageInput
+    result: RuntimeMessage
+  }
+  'ai.message.update': {
+    payload: { messageId: string; patch: Pick<RuntimeMessage, 'content' | 'blocks' | 'usage'> }
+    result: { updated: true }
+  }
+  'ai.message.delete': {
+    payload: { messageId: string }
+    result: { deleted: boolean }
+  }
+  'ai.summary.replace': {
+    payload: { conversationId: string; content: string; boundaryMessageId: string }
+    result: RuntimeMessage
+  }
+  'ai.tool.list': {
+    payload: undefined
+    result: RuntimeToolDefinition[]
+  }
+  'ai.tool.execute': {
+    payload: { sessionId: string; name: string; input: unknown; locale?: string }
+    result: RuntimeToolResult
+  }
   'analysis.hourly': {
     payload: { sessionId: string; filter?: BrowserTimeFilter }
     result: HourlyActivity[]
@@ -285,6 +340,18 @@ const WEB_RUNTIME_TASK_TYPES: Record<WebRuntimeTaskType, true> = {
   'session.get': true,
   'session.delete': true,
   'session.rename': true,
+  'ai.conversation.create': true,
+  'ai.conversation.list': true,
+  'ai.conversation.get': true,
+  'ai.conversation.rename': true,
+  'ai.conversation.delete': true,
+  'ai.message.list': true,
+  'ai.message.append': true,
+  'ai.message.update': true,
+  'ai.message.delete': true,
+  'ai.summary.replace': true,
+  'ai.tool.list': true,
+  'ai.tool.execute': true,
   'analysis.hourly': true,
   'analysis.daily': true,
   'analysis.weekday': true,
diff --git a/packages/web-runtime/src/sqlite/database-runtime.ts b/packages/web-runtime/src/sqlite/database-runtime.ts
index 64689369..e90d1aa9 100644
--- a/packages/web-runtime/src/sqlite/database-runtime.ts
+++ b/packages/web-runtime/src/sqlite/database-runtime.ts
@@ -115,7 +115,7 @@ export class BrowserDatabaseRuntime {
   async withDatabase<T>(
     filename: string,
     schemaSql: string,
-    operation: (db: DatabaseAdapter) => T,
+    operation: (db: DatabaseAdapter) => T | Promise<T>,
     onStage?: (stage: WorkspaceDatabaseStage) => void
   ): Promise<T> {
     return this.withWorkspaceLease(async () => {
@@ -141,7 +141,7 @@ export class BrowserDatabaseRuntime {
         onStage?.('schema-initializing')
         database.exec(schemaSql)
         onStage?.('schema-ready')
-        result = operation(database)
+        result = await operation(database)
       } catch (error) {
         operationFailed = true
         operationError = error
diff --git a/packages/web-runtime/src/storage/workspace-database.ts b/packages/web-runtime/src/storage/workspace-database.ts
index d365969d..5c5abce8 100644
--- a/packages/web-runtime/src/storage/workspace-database.ts
+++ b/packages/web-runtime/src/storage/workspace-database.ts
@@ -26,7 +26,7 @@ export interface WorkspaceDatabasePort {
   withDatabase<T>(
     filename: string,
     schemaSql: string,
-    operation: (db: DatabaseAdapter) => T,
+    operation: (db: DatabaseAdapter) => T | Promise<T>,
     onStage?: (stage: WorkspaceDatabaseStage) => void
   ): Promise<T>
   deleteDatabase(filename: string): Promise<boolean>
diff --git a/packages/web-runtime/src/worker/controller.test.ts b/packages/web-runtime/src/worker/controller.test.ts
index f7f3b0fd..8c55e1f3 100644
--- a/packages/web-runtime/src/worker/controller.test.ts
+++ b/packages/web-runtime/src/worker/controller.test.ts
@@ -69,7 +69,11 @@ class FakeDatabaseRuntime implements WorkerDatabaseRuntime {
     return { closed: true }
   }
 
-  async withDatabase<T>(_filename: string, _schemaSql: string, _operation: never): Promise<T> {
+  async withDatabase<T>(
+    _filename: string,
+    _schemaSql: string,
+    _operation: (db: import('@openchatlab/core').DatabaseAdapter) => T | Promise<T>
+  ): Promise<T> {
     throw new Error('not used')
   }
 
diff --git a/packages/web-runtime/src/worker/controller.ts b/packages/web-runtime/src/worker/controller.ts
index fd239533..7581b867 100644
--- a/packages/web-runtime/src/worker/controller.ts
+++ b/packages/web-runtime/src/worker/controller.ts
@@ -14,6 +14,8 @@ import { WebRuntimeError } from '../runtime-error'
 import { BrowserDatabaseRuntime, type DatabaseOpenStage } from '../sqlite/database-runtime'
 import { BrowserSessionRuntime } from '../import/session-runtime'
 import type { WorkspaceDatabasePort } from '../storage/workspace-database'
+import { BrowserAIConversationRepository } from '../ai/conversation-repository'
+import { BrowserAIToolRuntime } from '../ai/tool-runtime'
 
 export interface WorkerMessageSink {
   postMessage(message: RpcResponseEnvelope): void
@@ -58,6 +60,23 @@ export type WorkerSessionRuntime = Pick<
   | 'getWordFrequency'
 >
 
+export type WorkerAIRepository = Pick<
+  BrowserAIConversationRepository,
+  | 'createConversation'
+  | 'listConversations'
+  | 'getConversation'
+  | 'renameConversation'
+  | 'deleteConversation'
+  | 'deleteBySession'
+  | 'getMessages'
+  | 'appendMessage'
+  | 'updateMessage'
+  | 'deleteMessage'
+  | 'replaceSummary'
+>
+
+export type WorkerAIToolRuntime = Pick<BrowserAIToolRuntime, 'listTools' | 'execute'>
+
 export class WebRuntimeWorkerController {
   private readonly abortControllers = new Map<string, AbortController>()
   private readonly cancelled = new Set<string>()
@@ -68,7 +87,9 @@ export class WebRuntimeWorkerController {
     private readonly sink: WorkerMessageSink,
     private readonly databaseRuntime: WorkerDatabaseRuntime = new BrowserDatabaseRuntime(),
     private readonly capabilityDetector: () => BrowserCapabilityReport = detectBrowserCapabilities,
-    private readonly sessionRuntime: WorkerSessionRuntime = new BrowserSessionRuntime(databaseRuntime)
+    private readonly sessionRuntime: WorkerSessionRuntime = new BrowserSessionRuntime(databaseRuntime),
+    private readonly aiRepository: WorkerAIRepository = new BrowserAIConversationRepository(databaseRuntime),
+    private readonly aiToolRuntime: WorkerAIToolRuntime = new BrowserAIToolRuntime(databaseRuntime)
   ) {}
 
   handleMessage(value: unknown): void {
@@ -230,12 +251,64 @@ export class WebRuntimeWorkerController {
       case 'session.get':
         this.assertSupportedBrowser()
         return this.sessionRuntime.getSession(request.payload.sessionId)
-      case 'session.delete':
+      case 'session.delete': {
         this.assertSupportedBrowser()
-        return { deleted: await this.sessionRuntime.deleteSession(request.payload.sessionId) }
+        const deleted = await this.sessionRuntime.deleteSession(request.payload.sessionId)
+        if (deleted) await this.aiRepository.deleteBySession(request.payload.sessionId)
+        return { deleted }
+      }
       case 'session.rename':
         this.assertSupportedBrowser()
         return { renamed: await this.sessionRuntime.renameSession(request.payload.sessionId, request.payload.name) }
+      case 'ai.conversation.create':
+        return this.aiRepository.createConversation(request.payload.sessionId, request.payload.title)
+      case 'ai.conversation.list':
+        return this.aiRepository.listConversations(request.payload.sessionId)
+      case 'ai.conversation.get':
+        return this.aiRepository.getConversation(request.payload.conversationId)
+      case 'ai.conversation.rename':
+        return {
+          renamed: await this.aiRepository.renameConversation(request.payload.conversationId, request.payload.title),
+        }
+      case 'ai.conversation.delete':
+        return { deleted: await this.aiRepository.deleteConversation(request.payload.conversationId) }
+      case 'ai.message.list':
+        return this.aiRepository.getMessages(request.payload.conversationId)
+      case 'ai.message.append':
+        return this.aiRepository.appendMessage(request.payload)
+      case 'ai.message.update':
+        await this.aiRepository.updateMessage(request.payload.messageId, request.payload.patch)
+        return { updated: true }
+      case 'ai.message.delete':
+        return { deleted: await this.aiRepository.deleteMessage(request.payload.messageId) }
+      case 'ai.summary.replace':
+        return this.aiRepository.replaceSummary(request.payload.conversationId, {
+          content: request.payload.content,
+          boundaryMessageId: request.payload.boundaryMessageId,
+        })
+      case 'ai.tool.list':
+        return this.aiToolRuntime.listTools()
+      case 'ai.tool.execute': {
+        const startedAt = performance.now()
+        const result = await this.aiToolRuntime.execute(
+          request.payload.sessionId,
+          request.payload.name,
+          request.payload.input,
+          { locale: request.payload.locale, signal }
+        )
+        this.emitLog(request.id, {
+          level: 'debug',
+          scope: 'web-runtime',
+          message: 'Browser AI tool execution completed',
+          data: {
+            toolName: request.payload.name,
+            sessionId: request.payload.sessionId,
+            truncated: result.truncated === true,
+            durationMs: Math.round(performance.now() - startedAt),
+          },
+        })
+        return result
+      }
       case 'analysis.hourly': {
         this.assertSupportedBrowser()
         const startedAt = performance.now()
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 0fe1830b..ace7a0a2 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -36,6 +36,12 @@ importers:
         specifier: ^11.2.8
         version: 11.2.8(vue@3.5.27(typescript@6.0.3))
     devDependencies:
+      '@ai-sdk/deepseek':
+        specifier: ^3.0.13
+        version: 3.0.13(zod@3.25.76)
+      '@ai-sdk/openai-compatible':
+        specifier: ^3.0.14
+        version: 3.0.14(zod@3.25.76)
       '@electron-toolkit/tsconfig':
         specifier: ^1.0.1
         version: 1.0.1(@types/node@25.2.2)
@@ -57,6 +63,9 @@ importers:
       '@nuxt/ui':
         specifier: ^4.9.0
         version: 4.9.0(s6g7ddwkwqprfo6zxngcqjtvte)
+      '@openchatlab/ai-runtime':
+        specifier: workspace:*
+        version: link:packages/ai-runtime
       '@openchatlab/core':
         specifier: workspace:*
         version: link:packages/core
@@ -69,6 +78,9 @@ importers:
       '@openchatlab/tools':
         specifier: workspace:*
         version: link:packages/tools
+      '@openchatlab/web-ai-runtime':
+        specifier: workspace:*
+        version: link:packages/web-ai-runtime
       '@openchatlab/web-runtime':
         specifier: workspace:*
         version: link:packages/web-runtime
@@ -90,6 +102,9 @@ importers:
       '@vueuse/core':
         specifier: ^13.9.0
         version: 13.9.0(vue@3.5.27(typescript@6.0.3))
+      ai:
+        specifier: ^7.0.37
+        version: 7.0.37(zod@3.25.76)
       dayjs:
         specifier: ^1.11.19
         version: 1.11.19
@@ -126,6 +141,9 @@ importers:
       vue-tsc:
         specifier: 3.2.6
         version: 3.2.6(typescript@6.0.3)
+      zod:
+        specifier: ^3.25.76
+        version: 3.25.76
 
   apps/cli:
     dependencies:
@@ -307,6 +325,21 @@ importers:
         specifier: ^3.5.25
         version: 3.5.27(typescript@6.0.3)
 
+  packages/ai-runtime:
+    dependencies:
+      '@openchatlab/core':
+        specifier: workspace:*
+        version: link:../core
+      '@openchatlab/shared-types':
+        specifier: workspace:*
+        version: link:../shared-types
+      ai:
+        specifier: ^7.0.37
+        version: 7.0.37(zod@3.25.76)
+      zod:
+        specifier: ^3.25.76
+        version: 3.25.76
+
   packages/config:
     dependencies:
       smol-toml:
@@ -382,10 +415,10 @@ importers:
     dependencies:
       '@earendil-works/pi-agent-core':
         specifier: 0.74.2
-        version: 0.74.2(@modelcontextprotocol/sdk@1.29.0(zod@3.25.76))(ws@8.19.0)(zod@3.25.76)
+        version: 0.74.2(@modelcontextprotocol/sdk@1.29.0(zod@4.4.3))(ws@8.19.0)(zod@4.4.3)
       '@earendil-works/pi-ai':
         specifier: 0.74.2
-        version: 0.74.2(@modelcontextprotocol/sdk@1.29.0(zod@3.25.76))(ws@8.19.0)(zod@3.25.76)
+        version: 0.74.2(@modelcontextprotocol/sdk@1.29.0(zod@4.4.3))(ws@8.19.0)(zod@4.4.3)
       '@huggingface/transformers':
         specifier: ^4.2.0
         version: 4.2.0
@@ -481,14 +514,35 @@ importers:
         specifier: workspace:*
         version: link:../shared-types
 
+  packages/web-ai-runtime:
+    dependencies:
+      '@ai-sdk/openai-compatible':
+        specifier: ^3.0.14
+        version: 3.0.14(zod@4.4.3)
+      '@openchatlab/ai-runtime':
+        specifier: workspace:*
+        version: link:../ai-runtime
+      '@openchatlab/web-runtime':
+        specifier: workspace:*
+        version: link:../web-runtime
+      ai:
+        specifier: ^7.0.37
+        version: 7.0.37(zod@4.4.3)
+
   packages/web-runtime:
     dependencies:
+      '@openchatlab/ai-runtime':
+        specifier: workspace:*
+        version: link:../ai-runtime
       '@openchatlab/core':
         specifier: workspace:*
         version: link:../core
       '@openchatlab/parser':
         specifier: workspace:*
         version: link:../parser
+      '@openchatlab/tools':
+        specifier: workspace:*
+        version: link:../tools
       '@sqlite.org/sqlite-wasm':
         specifier: 3.53.0-build1
         version: 3.53.0-build1
@@ -498,6 +552,34 @@ packages:
   7zip-bin@5.2.0:
     resolution: {integrity: sha512-ukTPVhqG4jNzMro2qA9HSCSSVJN3aN7tlb+hfqYCt3ER0yWroeA2VR38MNrOHLQ/cVj+DaIMad0kFCtWWowh/A==}
 
+  '@ai-sdk/deepseek@3.0.13':
+    resolution: {integrity: sha512-sX05lJncM1xvZ8PBi3Lq2ixl9RScMcX6w9YbmkCE5Fp28g9t+tVNATEFy8aVWEInH7yxvdEL4M15/9Uq63ECpg==}
+    engines: {node: '>=22'}
+    peerDependencies:
+      zod: ^3.25.76 || ^4.1.8
+
+  '@ai-sdk/gateway@4.0.28':
+    resolution: {integrity: sha512-ee9TsNO3mkgHDWmTmJ8Fvltr6PFh52zhrV2+FaKJY3F3iu7kWZi5tCRJCR1HVhhlpj6lHniUb28nLQdPHkA/1Q==}
+    engines: {node: '>=22'}
+    peerDependencies:
+      zod: ^3.25.76 || ^4.1.8
+
+  '@ai-sdk/openai-compatible@3.0.14':
+    resolution: {integrity: sha512-nUl7dBHUDTqcnuWGnEbKMwDDqL94BxRfibLwYv8uWp+kZn8Zqdxy7tUBt4sv2hpHQi+S2P6bUyqW18xmbykErw==}
+    engines: {node: '>=22'}
+    peerDependencies:
+      zod: ^3.25.76 || ^4.1.8
+
+  '@ai-sdk/provider-utils@5.0.12':
+    resolution: {integrity: sha512-bbhlOgHeYwrIGheLkM6fhS8hVger8uFPmcOLg+kxc9EFh7y30XYorWhthlYAgpadO3SJhFZrIcEknN7qEqEVvA==}
+    engines: {node: '>=22'}
+    peerDependencies:
+      zod: ^3.25.76 || ^4.1.8
+
+  '@ai-sdk/provider@4.0.3':
+    resolution: {integrity: sha512-e0CpNWJUY7OxAFAnCZkw+ri9QOHWwTs1tXP42782KFGCU07qt8NiXCrCVowyCB5dP2r5/Uls+g2oPd8kOJn9dw==}
+    engines: {node: '>=22'}
+
   '@algolia/abtesting@1.18.1':
     resolution: {integrity: sha512-aehCadlWOGvrT91KUIZpC0MbB8KBW9yUuvTJFd2xesR7le/IsT4nJUnjCCZ4ZqZCeTcPHPV5mo//fZ5oxcSVYw==}
     engines: {node: '>= 14.0.0'}
@@ -3227,6 +3309,10 @@ packages:
     peerDependencies:
       vue: '>=3.5.18'
 
+  '@vercel/oidc@3.2.0':
+    resolution: {integrity: sha512-UycprH3T6n3jH0k44NHMa7pnFHGu/N05MjojYr+Mc6I7obkoLIJujSWwin1pCvdy/eOxrI/l3uDLQsmcrOb4ug==}
+    engines: {node: '>= 20'}
+
   '@vitejs/plugin-vue@5.2.4':
     resolution: {integrity: sha512-7Yx/SXSOcQq5HiiV3orevHUFn+pmMB4cgbEkDYgnkUWb0WfeQ/wa2yFv6D5ICiCQOVpjA7vYDXrC7AGO8yjDHA==}
     engines: {node: ^18.0.0 || >=20.0.0}
@@ -3445,6 +3531,9 @@ packages:
   '@webgpu/types@0.1.71':
     resolution: {integrity: sha512-mMy8/ODcKhab808co15eW+yN+HgXoQxRQHTiBV9Mrvl1r0ufnid7YOcI+gi4eUWSWl9ezD6TW2KXccrL8HCh2A==}
 
+  '@workflow/serde@4.1.0':
+    resolution: {integrity: sha512-pav4F2BoirECWR7Nf1TKt+2eETcBj7jj4cBefQ8VXQCA6NPkaKeLfj/zMgi+3zYV5ZIBT4GuUiphsj0/b9hPQQ==}
+
   '@xmldom/xmldom@0.8.11':
     resolution: {integrity: sha512-cQzWCtO6C8TQiYl1ruKNn2U6Ao4o4WBBcbL61yJl84x+j5sOWWFU9X7DpND8XZG3daDppSsigMdfAIl2upQBRw==}
     engines: {node: '>=10.0.0'}
@@ -3491,6 +3580,12 @@ packages:
     resolution: {integrity: sha512-MnA+YT8fwfJPgBx3m60MNqakm30XOkyIoH1y6huTQvC0PwZG7ki8NacLBcrPbNoo8vEZy7Jpuk7+jMO+CUovTQ==}
     engines: {node: '>= 14'}
 
+  ai@7.0.37:
+    resolution: {integrity: sha512-stF+SEQJgKY3Qfe3FwNzqUrehHviOp2l7LemoI8YMOa0Zk5PxKsRNgUk3cHXz0RAue9RRyCAis2fz6LSCP6EKw==}
+    engines: {node: '>=22'}
+    peerDependencies:
+      zod: ^3.25.76 || ^4.1.8
+
   ajv-formats@3.0.1:
     resolution: {integrity: sha512-8iUql50EUR+uUcdRQ3HDqa6EVyo3docL8g5WJ3FNcWmu62IbkGUue/pEyLBW8VGKKucTPgqeks4fIU1DA4yowQ==}
     peerDependencies:
@@ -4951,6 +5046,9 @@ packages:
   json-schema-typed@8.0.2:
     resolution: {integrity: sha512-fQhoXdcvc3V28x7C7BMs4P5+kNlgUURe2jmUT1T//oBRMDrqy1QPelJimwZGo7Hg9VPV3EQV5Bnq4hbFy2vetA==}
 
+  json-schema@0.4.0:
+    resolution: {integrity: sha512-es94M3nTIfsEPisRafak+HDLfHXnKBhV3vU5eqPcS3flIWqcxJWgXHXiey3YrpaNsanY5ei1VoYEbOzijuq9BA==}
+
   json-stable-stringify-without-jsonify@1.0.1:
     resolution: {integrity: sha512-Bdboy+l7tA3OGW6FjyFHWkP5LuByj1Tk33Ljyq0axyzdk9//JSi2u3fP1QSmd1KNwq6VOKYGlAu87CisVir6Pw==}
 
@@ -7068,6 +7166,9 @@ packages:
   zod@3.25.76:
     resolution: {integrity: sha512-gzUt/qt81nXsFGKIFcC3YnfEAx5NkunCfnDlvuBSSFS02bcXu4Lmea0AFIUwbLWxWPx3d9p8S5QoaujKcNQxcQ==}
 
+  zod@4.4.3:
+    resolution: {integrity: sha512-ytENFjIJFl2UwYglde2jchW2Hwm4GJFLDiSXWdTrJQBIN9Fcyp7n4DhxJEiWNAJMV1/BqWfW/kkg71UDcHJyTQ==}
+
   zrender@6.0.0:
     resolution: {integrity: sha512-41dFXEEXuJpNecuUQq6JlbybmnHaqqpGlbH1yxnA5V9MMP4SbohSVZsJIwz+zdjQXSSlR1Vc34EgH1zxyTDvhg==}
 
@@ -7078,6 +7179,58 @@ snapshots:
 
   7zip-bin@5.2.0: {}
 
+  '@ai-sdk/deepseek@3.0.13(zod@3.25.76)':
+    dependencies:
+      '@ai-sdk/provider': 4.0.3
+      '@ai-sdk/provider-utils': 5.0.12(zod@3.25.76)
+      zod: 3.25.76
+
+  '@ai-sdk/gateway@4.0.28(zod@3.25.76)':
+    dependencies:
+      '@ai-sdk/provider': 4.0.3
+      '@ai-sdk/provider-utils': 5.0.12(zod@3.25.76)
+      '@vercel/oidc': 3.2.0
+      zod: 3.25.76
+
+  '@ai-sdk/gateway@4.0.28(zod@4.4.3)':
+    dependencies:
+      '@ai-sdk/provider': 4.0.3
+      '@ai-sdk/provider-utils': 5.0.12(zod@4.4.3)
+      '@vercel/oidc': 3.2.0
+      zod: 4.4.3
+
+  '@ai-sdk/openai-compatible@3.0.14(zod@3.25.76)':
+    dependencies:
+      '@ai-sdk/provider': 4.0.3
+      '@ai-sdk/provider-utils': 5.0.12(zod@3.25.76)
+      zod: 3.25.76
+
+  '@ai-sdk/openai-compatible@3.0.14(zod@4.4.3)':
+    dependencies:
+      '@ai-sdk/provider': 4.0.3
+      '@ai-sdk/provider-utils': 5.0.12(zod@4.4.3)
+      zod: 4.4.3
+
+  '@ai-sdk/provider-utils@5.0.12(zod@3.25.76)':
+    dependencies:
+      '@ai-sdk/provider': 4.0.3
+      '@standard-schema/spec': 1.1.0
+      '@workflow/serde': 4.1.0
+      eventsource-parser: 3.0.8
+      zod: 3.25.76
+
+  '@ai-sdk/provider-utils@5.0.12(zod@4.4.3)':
+    dependencies:
+      '@ai-sdk/provider': 4.0.3
+      '@standard-schema/spec': 1.1.0
+      '@workflow/serde': 4.1.0
+      eventsource-parser: 3.0.8
+      zod: 4.4.3
+
+  '@ai-sdk/provider@4.0.3':
+    dependencies:
+      json-schema: 0.4.0
+
   '@algolia/abtesting@1.18.1':
     dependencies:
       '@algolia/client-common': 5.52.1
@@ -7203,6 +7356,12 @@ snapshots:
     optionalDependencies:
       zod: 3.25.76
 
+  '@anthropic-ai/sdk@0.91.1(zod@4.4.3)':
+    dependencies:
+      json-schema-to-ts: 3.1.1
+    optionalDependencies:
+      zod: 4.4.3
+
   '@aws-crypto/crc32@5.2.0':
     dependencies:
       '@aws-crypto/util': 5.2.0
@@ -7584,6 +7743,20 @@ snapshots:
       - ws
       - zod
 
+  '@earendil-works/pi-agent-core@0.74.2(@modelcontextprotocol/sdk@1.29.0(zod@4.4.3))(ws@8.19.0)(zod@4.4.3)':
+    dependencies:
+      '@earendil-works/pi-ai': 0.74.2(@modelcontextprotocol/sdk@1.29.0(zod@4.4.3))(ws@8.19.0)(zod@4.4.3)
+      ignore: 7.0.5
+      typebox: 1.1.38
+      yaml: 2.8.2
+    transitivePeerDependencies:
+      - '@modelcontextprotocol/sdk'
+      - bufferutil
+      - supports-color
+      - utf-8-validate
+      - ws
+      - zod
+
   '@earendil-works/pi-ai@0.74.2(@modelcontextprotocol/sdk@1.29.0(zod@3.25.76))(ws@8.19.0)(zod@3.25.76)':
     dependencies:
       '@anthropic-ai/sdk': 0.91.1(zod@3.25.76)
@@ -7603,6 +7776,25 @@ snapshots:
       - ws
       - zod
 
+  '@earendil-works/pi-ai@0.74.2(@modelcontextprotocol/sdk@1.29.0(zod@4.4.3))(ws@8.19.0)(zod@4.4.3)':
+    dependencies:
+      '@anthropic-ai/sdk': 0.91.1(zod@4.4.3)
+      '@aws-sdk/client-bedrock-runtime': 3.1053.0
+      '@google/genai': 1.42.0(@modelcontextprotocol/sdk@1.29.0(zod@4.4.3))
+      '@mistralai/mistralai': 2.2.1
+      http-proxy-agent: 7.0.2
+      https-proxy-agent: 7.0.6
+      openai: 6.26.0(ws@8.19.0)(zod@4.4.3)
+      partial-json: 0.1.7
+      typebox: 1.1.38
+    transitivePeerDependencies:
+      - '@modelcontextprotocol/sdk'
+      - bufferutil
+      - supports-color
+      - utf-8-validate
+      - ws
+      - zod
+
   '@electron-toolkit/preload@3.0.2(electron@35.7.5)':
     dependencies:
       electron: 35.7.5
@@ -8084,6 +8276,19 @@ snapshots:
       - supports-color
       - utf-8-validate
 
+  '@google/genai@1.42.0(@modelcontextprotocol/sdk@1.29.0(zod@4.4.3))':
+    dependencies:
+      google-auth-library: 10.5.0
+      p-retry: 4.6.2
+      protobufjs: 7.5.4
+      ws: 8.19.0
+    optionalDependencies:
+      '@modelcontextprotocol/sdk': 1.29.0(zod@4.4.3)
+    transitivePeerDependencies:
+      - bufferutil
+      - supports-color
+      - utf-8-validate
+
   '@hono/node-server@1.19.14(hono@4.12.18)':
     dependencies:
       hono: 4.12.18
@@ -8453,6 +8658,29 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
+  '@modelcontextprotocol/sdk@1.29.0(zod@4.4.3)':
+    dependencies:
+      '@hono/node-server': 1.19.14(hono@4.12.18)
+      ajv: 8.18.0
+      ajv-formats: 3.0.1(ajv@8.18.0)
+      content-type: 1.0.5
+      cors: 2.8.6
+      cross-spawn: 7.0.6
+      eventsource: 3.0.7
+      eventsource-parser: 3.0.8
+      express: 5.2.1
+      express-rate-limit: 8.5.1(express@5.2.1)
+      hono: 4.12.18
+      jose: 6.2.3
+      json-schema-typed: 8.0.2
+      pkce-challenge: 5.0.1
+      raw-body: 3.0.2
+      zod: 4.4.3
+      zod-to-json-schema: 3.25.1(zod@4.4.3)
+    transitivePeerDependencies:
+      - supports-color
+    optional: true
+
   '@napi-rs/cli@3.7.2(@emnapi/core@1.8.1)(@emnapi/runtime@1.8.1)(@types/node@25.2.2)':
     dependencies:
       '@inquirer/prompts': 8.5.2(@types/node@25.2.2)
@@ -9918,6 +10146,8 @@ snapshots:
       unhead: 2.1.15
       vue: 3.5.27(typescript@6.0.3)
 
+  '@vercel/oidc@3.2.0': {}
+
   '@vitejs/plugin-vue@5.2.4(vite@5.4.21(@types/node@25.2.2)(lightningcss@1.32.0))(vue@3.5.27(typescript@6.0.3))':
     dependencies:
       vite: 5.4.21(@types/node@25.2.2)(lightningcss@1.32.0)
@@ -10135,6 +10365,8 @@ snapshots:
 
   '@webgpu/types@0.1.71': {}
 
+  '@workflow/serde@4.1.0': {}
+
   '@xmldom/xmldom@0.8.11': {}
 
   '@xmldom/xmldom@0.8.13': {}
@@ -10162,6 +10394,20 @@ snapshots:
 
   agent-base@7.1.4: {}
 
+  ai@7.0.37(zod@3.25.76):
+    dependencies:
+      '@ai-sdk/gateway': 4.0.28(zod@3.25.76)
+      '@ai-sdk/provider': 4.0.3
+      '@ai-sdk/provider-utils': 5.0.12(zod@3.25.76)
+      zod: 3.25.76
+
+  ai@7.0.37(zod@4.4.3):
+    dependencies:
+      '@ai-sdk/gateway': 4.0.28(zod@4.4.3)
+      '@ai-sdk/provider': 4.0.3
+      '@ai-sdk/provider-utils': 5.0.12(zod@4.4.3)
+      zod: 4.4.3
+
   ajv-formats@3.0.1(ajv@8.18.0):
     optionalDependencies:
       ajv: 8.18.0
@@ -11875,6 +12121,8 @@ snapshots:
 
   json-schema-typed@8.0.2: {}
 
+  json-schema@0.4.0: {}
+
   json-stable-stringify-without-jsonify@1.0.1: {}
 
   json-stringify-safe@5.0.1: {}
@@ -12440,6 +12688,11 @@ snapshots:
       ws: 8.19.0
       zod: 3.25.76
 
+  openai@6.26.0(ws@8.19.0)(zod@4.4.3):
+    optionalDependencies:
+      ws: 8.19.0
+      zod: 4.4.3
+
   optionator@0.9.4:
     dependencies:
       deep-is: 0.1.4
@@ -13925,8 +14178,15 @@ snapshots:
     dependencies:
       zod: 3.25.76
 
+  zod-to-json-schema@3.25.1(zod@4.4.3):
+    dependencies:
+      zod: 4.4.3
+    optional: true
+
   zod@3.25.76: {}
 
+  zod@4.4.3: {}
+
   zrender@6.0.0:
     dependencies:
       tslib: 2.3.0
diff --git a/src/i18n/locales/en-US/index.ts b/src/i18n/locales/en-US/index.ts
index a0dd9233..cca8faf3 100644
--- a/src/i18n/locales/en-US/index.ts
+++ b/src/i18n/locales/en-US/index.ts
@@ -15,6 +15,7 @@ import contacts from './contacts.json'
 import relationships from './relationships.json'
 import insight from './insight.json'
 import browser from './browser.json'
+import webAI from './webAI.json'
 
 export default {
   common,
@@ -34,4 +35,5 @@ export default {
   relationships,
   insight,
   browser,
+  webAI,
 }
diff --git a/src/i18n/locales/en-US/webAI.json b/src/i18n/locales/en-US/webAI.json
new file mode 100644
index 00000000..c56b28b8
--- /dev/null
+++ b/src/i18n/locales/en-US/webAI.json
@@ -0,0 +1,51 @@
+{
+  "defaultAssistant": "Default Assistant",
+  "emptyTitle": "Find answers in this chat",
+  "emptyDescription": "AI calls local analysis tools as needed and only sends the redacted data required for your current question to the model provider.",
+  "inputPlaceholder": "Ask about this chat…",
+  "send": "Send",
+  "stop": "Stop",
+  "regenerate": "Regenerate",
+  "footer": "AI can make mistakes. Verify important conclusions.",
+  "usingTool": "Using {name}",
+  "compressing": "Compressing conversation context",
+  "presets": {
+    "overview": "Summarize the main topics in this chat",
+    "topics": "What has everyone discussed recently?",
+    "activity": "Analyze changes in chat activity"
+  },
+  "conversations": {
+    "title": "Conversations",
+    "empty": "No AI conversations yet",
+    "new": "New conversation",
+    "rename": "Rename",
+    "delete": "Delete",
+    "untitled": "New conversation",
+    "deleteConfirm": "Delete this AI conversation?",
+    "renamePrompt": "Rename conversation"
+  },
+  "config": {
+    "title": "Configure Web AI",
+    "description": "Web WASM calls the model provider directly from your browser. Requests do not pass through a ChatLab server.",
+    "provider": "Provider",
+    "openAICompatible": "OpenAI-compatible API",
+    "baseURL": "API URL",
+    "model": "Model",
+    "apiKey": "API Key",
+    "apiKeyPlaceholder": "Enter API Key",
+    "apiKeyReplace": "Enter again to replace the saved key",
+    "required": "Enter an API URL, model, and API Key",
+    "keyStorageWarning": "The API Key is encrypted and stored in this browser across refreshes. Browser-local encryption cannot protect against malicious scripts that already control this page.",
+    "corsWarning": "Only OpenAI-compatible services that allow browser CORS requests are supported. A connection failure may mean the provider blocks direct browser access.",
+    "test": "Test connection",
+    "testSuccess": "Connected ({ms}ms)",
+    "saved": "Model configuration saved"
+  },
+  "errors": {
+    "AUTH": "The API Key is invalid or lacks permission.",
+    "RATE_LIMIT": "The request was rate-limited or has insufficient quota. Try again later.",
+    "MODEL_NOT_FOUND": "The model was not found. Check the model name.",
+    "TIMEOUT": "The model request timed out. Try again.",
+    "NETWORK_OR_CORS": "The request was blocked by the network or browser CORS policy. Confirm that the provider supports direct browser access."
+  }
+}
diff --git a/src/i18n/locales/ja-JP/index.ts b/src/i18n/locales/ja-JP/index.ts
index a0dd9233..cca8faf3 100644
--- a/src/i18n/locales/ja-JP/index.ts
+++ b/src/i18n/locales/ja-JP/index.ts
@@ -15,6 +15,7 @@ import contacts from './contacts.json'
 import relationships from './relationships.json'
 import insight from './insight.json'
 import browser from './browser.json'
+import webAI from './webAI.json'
 
 export default {
   common,
@@ -34,4 +35,5 @@ export default {
   relationships,
   insight,
   browser,
+  webAI,
 }
diff --git a/src/i18n/locales/ja-JP/webAI.json b/src/i18n/locales/ja-JP/webAI.json
new file mode 100644
index 00000000..fe507176
--- /dev/null
+++ b/src/i18n/locales/ja-JP/webAI.json
@@ -0,0 +1,51 @@
+{
+  "defaultAssistant": "デフォルトアシスタント",
+  "emptyTitle": "チャット履歴から答えを探す",
+  "emptyDescription": "AI は必要に応じてローカル分析ツールを呼び出し、現在の質問に必要な匿名化済みデータだけをモデル提供元へ送信します。",
+  "inputPlaceholder": "このチャットについて質問…",
+  "send": "送信",
+  "stop": "停止",
+  "regenerate": "再生成",
+  "footer": "AI は誤ることがあります。重要な結論は確認してください。",
+  "usingTool": "{name} を使用中",
+  "compressing": "会話コンテキストを圧縮中",
+  "presets": {
+    "overview": "このチャットの主な内容を要約して",
+    "topics": "最近は何について話している？",
+    "activity": "チャット活動の変化を分析して"
+  },
+  "conversations": {
+    "title": "会話",
+    "empty": "AI 会話はまだありません",
+    "new": "新しい会話",
+    "rename": "名前を変更",
+    "delete": "削除",
+    "untitled": "新しい会話",
+    "deleteConfirm": "この AI 会話を削除しますか？",
+    "renamePrompt": "会話名を変更"
+  },
+  "config": {
+    "title": "Web AI を設定",
+    "description": "Web WASM はブラウザからモデル提供元へ直接接続します。ChatLab サーバーは経由しません。",
+    "provider": "モデルサービス",
+    "openAICompatible": "OpenAI 互換 API",
+    "baseURL": "API URL",
+    "model": "モデル",
+    "apiKey": "API Key",
+    "apiKeyPlaceholder": "API Key を入力",
+    "apiKeyReplace": "保存済みの Key を置き換えるには再入力",
+    "required": "API URL、モデル、API Key を入力してください",
+    "keyStorageWarning": "API Key は暗号化してこのブラウザに保存され、更新後も使用されます。ブラウザ内の暗号化では、このページを制御する悪意あるスクリプトからは保護できません。",
+    "corsWarning": "ブラウザの CORS アクセスを許可する OpenAI 互換サービスだけを利用できます。接続失敗は提供元がブラウザ直結を禁止している場合もあります。",
+    "test": "接続テスト",
+    "testSuccess": "接続成功（{ms}ms）",
+    "saved": "モデル設定を保存しました"
+  },
+  "errors": {
+    "AUTH": "API Key が無効か、権限がありません。",
+    "RATE_LIMIT": "リクエスト制限または残高不足です。しばらくしてから再試行してください。",
+    "MODEL_NOT_FOUND": "モデルが見つかりません。モデル名を確認してください。",
+    "TIMEOUT": "モデルへのリクエストがタイムアウトしました。",
+    "NETWORK_OR_CORS": "ネットワークまたはブラウザの CORS ポリシーによりブロックされました。ブラウザ直結に対応しているか確認してください。"
+  }
+}
diff --git a/src/i18n/locales/zh-CN/index.ts b/src/i18n/locales/zh-CN/index.ts
index a0dd9233..cca8faf3 100644
--- a/src/i18n/locales/zh-CN/index.ts
+++ b/src/i18n/locales/zh-CN/index.ts
@@ -15,6 +15,7 @@ import contacts from './contacts.json'
 import relationships from './relationships.json'
 import insight from './insight.json'
 import browser from './browser.json'
+import webAI from './webAI.json'
 
 export default {
   common,
@@ -34,4 +35,5 @@ export default {
   relationships,
   insight,
   browser,
+  webAI,
 }
diff --git a/src/i18n/locales/zh-CN/webAI.json b/src/i18n/locales/zh-CN/webAI.json
new file mode 100644
index 00000000..9665cde1
--- /dev/null
+++ b/src/i18n/locales/zh-CN/webAI.json
@@ -0,0 +1,51 @@
+{
+  "defaultAssistant": "默认助手",
+  "emptyTitle": "从聊天记录中寻找答案",
+  "emptyDescription": "AI 会按需调用本地分析工具，只将当前问题所需且已脱敏的数据发送给模型服务商。",
+  "inputPlaceholder": "询问这段聊天记录…",
+  "send": "发送",
+  "stop": "停止",
+  "regenerate": "重新生成",
+  "footer": "AI 可能会犯错，请核对重要结论",
+  "usingTool": "正在调用 {name}",
+  "compressing": "正在整理对话上下文",
+  "presets": {
+    "overview": "概括这段聊天的主要内容",
+    "topics": "最近大家在聊什么？",
+    "activity": "分析聊天活跃度的变化"
+  },
+  "conversations": {
+    "title": "对话",
+    "empty": "还没有 AI 对话",
+    "new": "新建对话",
+    "rename": "重命名",
+    "delete": "删除",
+    "untitled": "新对话",
+    "deleteConfirm": "确定删除这条 AI 对话吗？",
+    "renamePrompt": "修改对话名称"
+  },
+  "config": {
+    "title": "配置 Web AI",
+    "description": "Web WASM 会直接从浏览器请求模型服务，不经过 ChatLab 服务器。",
+    "provider": "模型服务",
+    "openAICompatible": "OpenAI 兼容接口",
+    "baseURL": "API 地址",
+    "model": "模型",
+    "apiKey": "API Key",
+    "apiKeyPlaceholder": "输入 API Key",
+    "apiKeyReplace": "重新输入以替换已保存的 Key",
+    "required": "请完整填写 API 地址、模型和 API Key",
+    "keyStorageWarning": "API Key 会加密后保存在当前浏览器中，并在刷新后继续使用。浏览器本地加密无法防御已获得当前页面权限的恶意脚本。",
+    "corsWarning": "仅支持允许浏览器跨域访问（CORS）的 OpenAI 兼容服务。连接失败也可能是服务商禁止浏览器直连。",
+    "test": "测试连接",
+    "testSuccess": "连接成功（{ms}ms）",
+    "saved": "模型配置已保存"
+  },
+  "errors": {
+    "AUTH": "API Key 无效或没有访问权限。",
+    "RATE_LIMIT": "请求过于频繁或额度不足，请稍后重试。",
+    "MODEL_NOT_FOUND": "找不到这个模型，请检查模型名称。",
+    "TIMEOUT": "模型请求超时，请重试。",
+    "NETWORK_OR_CORS": "请求被网络或浏览器跨域策略阻止，请确认服务商支持浏览器直连。"
+  }
+}
diff --git a/src/i18n/locales/zh-TW/index.ts b/src/i18n/locales/zh-TW/index.ts
index a0dd9233..cca8faf3 100644
--- a/src/i18n/locales/zh-TW/index.ts
+++ b/src/i18n/locales/zh-TW/index.ts
@@ -15,6 +15,7 @@ import contacts from './contacts.json'
 import relationships from './relationships.json'
 import insight from './insight.json'
 import browser from './browser.json'
+import webAI from './webAI.json'
 
 export default {
   common,
@@ -34,4 +35,5 @@ export default {
   relationships,
   insight,
   browser,
+  webAI,
 }
diff --git a/src/i18n/locales/zh-TW/webAI.json b/src/i18n/locales/zh-TW/webAI.json
new file mode 100644
index 00000000..e82235aa
--- /dev/null
+++ b/src/i18n/locales/zh-TW/webAI.json
@@ -0,0 +1,51 @@
+{
+  "defaultAssistant": "預設助手",
+  "emptyTitle": "從聊天記錄中尋找答案",
+  "emptyDescription": "AI 會按需呼叫本機分析工具，只將目前問題所需且已脫敏的資料傳送給模型服務商。",
+  "inputPlaceholder": "詢問這段聊天記錄…",
+  "send": "傳送",
+  "stop": "停止",
+  "regenerate": "重新產生",
+  "footer": "AI 可能會出錯，請核對重要結論",
+  "usingTool": "正在呼叫 {name}",
+  "compressing": "正在整理對話上下文",
+  "presets": {
+    "overview": "概括這段聊天的主要內容",
+    "topics": "最近大家在聊什麼？",
+    "activity": "分析聊天活躍度的變化"
+  },
+  "conversations": {
+    "title": "對話",
+    "empty": "還沒有 AI 對話",
+    "new": "新增對話",
+    "rename": "重新命名",
+    "delete": "刪除",
+    "untitled": "新對話",
+    "deleteConfirm": "確定刪除這條 AI 對話嗎？",
+    "renamePrompt": "修改對話名稱"
+  },
+  "config": {
+    "title": "設定 Web AI",
+    "description": "Web WASM 會直接從瀏覽器請求模型服務，不經過 ChatLab 伺服器。",
+    "provider": "模型服務",
+    "openAICompatible": "OpenAI 相容介面",
+    "baseURL": "API 位址",
+    "model": "模型",
+    "apiKey": "API Key",
+    "apiKeyPlaceholder": "輸入 API Key",
+    "apiKeyReplace": "重新輸入以取代已儲存的 Key",
+    "required": "請完整填寫 API 位址、模型和 API Key",
+    "keyStorageWarning": "API Key 會加密後儲存在目前瀏覽器中，重新整理後仍會使用。瀏覽器本機加密無法防禦已取得目前頁面權限的惡意腳本。",
+    "corsWarning": "僅支援允許瀏覽器跨來源存取（CORS）的 OpenAI 相容服務。連線失敗也可能是服務商禁止瀏覽器直連。",
+    "test": "測試連線",
+    "testSuccess": "連線成功（{ms}ms）",
+    "saved": "模型設定已儲存"
+  },
+  "errors": {
+    "AUTH": "API Key 無效或沒有存取權限。",
+    "RATE_LIMIT": "請求過於頻繁或額度不足，請稍後重試。",
+    "MODEL_NOT_FOUND": "找不到這個模型，請檢查模型名稱。",
+    "TIMEOUT": "模型請求逾時，請重試。",
+    "NETWORK_OR_CORS": "請求被網路或瀏覽器跨來源策略阻擋，請確認服務商支援瀏覽器直連。"
+  }
+}
diff --git a/src/services/browser-runtime/register.test.ts b/src/services/browser-runtime/register.test.ts
index 51aa7713..079d3490 100644
--- a/src/services/browser-runtime/register.test.ts
+++ b/src/services/browser-runtime/register.test.ts
@@ -28,7 +28,11 @@ describe('registerWebWasmAdapters', () => {
       onWorkspaceChanged: (event) => workspaceChanges.push(`${event.type}:${event.sessionId}`),
     })
 
-    assert.deepEqual([...registrations.keys()], ['browser-runtime', 'import', 'data', 'platform', 'preferences'])
+    assert.deepEqual(
+      [...registrations.keys()],
+      ['browser-runtime-rpc', 'browser-runtime', 'import', 'data', 'platform', 'preferences']
+    )
+    assert.equal(registrations.get('browser-runtime-rpc'), client)
     assert.ok(registrations.get('browser-runtime') instanceof BrowserRuntimeAdapter)
     assert.ok(registrations.get('import') instanceof BrowserImportAdapter)
     assert.ok(registrations.get('platform') instanceof BrowserPlatformAdapter)
diff --git a/src/services/browser-runtime/register.ts b/src/services/browser-runtime/register.ts
index fb1ea6f5..999b8ba3 100644
--- a/src/services/browser-runtime/register.ts
+++ b/src/services/browser-runtime/register.ts
@@ -24,6 +24,8 @@ export function registerWebWasmAdapters(options: RegisterWebWasmAdaptersOptions)
   const createClient = options.createClient ?? createWebRuntimeClient
   const client = createClient({ onLog: reportLog, onWorkspaceChanged: options.onWorkspaceChanged })
 
+  // Web AI Runtime 与数据适配器复用同一个 Worker，避免打开第二份 OPFS 数据库句柄。
+  options.register('browser-runtime-rpc', client)
   options.register('browser-runtime', new BrowserRuntimeAdapter(client))
   options.register('import', new BrowserImportAdapter(client))
   options.register('data', createBrowserDataAdapter(client))
diff --git a/src/services/browser-runtime/service.ts b/src/services/browser-runtime/service.ts
index c916feca..fe3b2c12 100644
--- a/src/services/browser-runtime/service.ts
+++ b/src/services/browser-runtime/service.ts
@@ -1,6 +1,11 @@
 import { getRegisteredAdapter } from '../registry'
 import type { BrowserRuntimeServiceAdapter } from './types'
+import type { BrowserRuntimeRpcPort } from './types'
 
 export function useBrowserRuntimeService(): BrowserRuntimeServiceAdapter {
   return getRegisteredAdapter<BrowserRuntimeServiceAdapter>('browser-runtime')
 }
+
+export function useBrowserRuntimeRpc(): BrowserRuntimeRpcPort {
+  return getRegisteredAdapter<BrowserRuntimeRpcPort>('browser-runtime-rpc')
+}
diff --git a/tests/web-ai-sdk-spike/README.md b/tests/web-ai-sdk-spike/README.md
new file mode 100644
index 00000000..f4915248
--- /dev/null
+++ b/tests/web-ai-sdk-spike/README.md
@@ -0,0 +1,58 @@
+# Web AI SDK Spike
+
+隔离验证 AI SDK 在 ChatLab Web WASM 技术栈中的浏览器可行性，不接入正式产品路由。
+
+## 验证内容
+
+- `@ai-sdk/openai-compatible` 和 `@ai-sdk/deepseek` 可以被 Vite 浏览器构建。
+- 浏览器直连 Provider 的流式输出与 CORS。
+- `ToolLoopAgent` 的多步工具调用。
+- `AbortSignal` 中止与 `onAbort` 收口。
+- 相对空白入口的构建体积增量。
+
+## 运行
+
+```bash
+pnpm run dev:web-ai-spike
+pnpm run build:web-ai-spike
+```
+
+打开 `http://127.0.0.1:3131/`，在 password 输入框临时输入测试 Key。页面不使用 localStorage、IndexedDB、Cookie 或 URL 保存 Key，刷新即清空。
+
+不要把真实 Key 写入源码、环境文件、测试 fixture、截图或提交记录。
+
+## 2026-07-26 验证结论
+
+环境：AI SDK `7.0.37`、`@ai-sdk/deepseek` `3.0.13`、`@ai-sdk/openai-compatible` `3.0.14`、DeepSeek `deepseek-v4-flash`，由 `http://127.0.0.1:3131` 的真实浏览器页面直接请求 `https://api.deepseek.com`。
+
+| 验证项 | 结果 |
+| --- | --- |
+| 浏览器 CORS | 通过；携带 Bearer Token 的真实流式请求可从本地 origin 直连 DeepSeek，不需要 ChatLab 服务端代理 |
+| OpenAI-Compatible 流式 | 通过；reasoning delta 与 text delta 均可消费，样本首输出 593 ms |
+| OpenAI-Compatible 工具循环 | 通过；`get_chat_overview` 调用 1 次，工具结果自动回填并生成第二轮总结，样本首输出 511 ms |
+| DeepSeek 官方 Provider 流式 | 通过；reasoning delta 与 text delta 均可消费，样本首输出 658 ms |
+| DeepSeek 官方 Provider 工具循环 | 通过；`get_chat_overview` 调用 1 次并完成第二轮总结，样本首输出 580 ms |
+| AbortSignal | 通过；流式生成中途停止，收到 abort 事件并收口为正常的“已中止”状态 |
+| Key 生命周期 | 通过；仅存在 password 输入框和 JS 内存，页面刷新后为空，不使用浏览器持久化 |
+
+时间与 Token 数据只是单次网络样本，不作为性能承诺。
+
+AI SDK 7 在主动取消底层 `fetch` 时，Chromium DevTools 仍会记录一条 `AbortError`，即使业务代码已经消费异常并正确进入 `onAbort`。这不影响 UI 状态或继续请求，但正式 Runtime 的日志上报必须把预期取消从错误事件中排除。
+
+### Provider 兼容差异
+
+DeepSeek V4 默认思考模式不接受强制指定工具的 `tool_choice`，会返回 `Thinking mode does not support this tool_choice`。改用标准 `auto` 工具选择后，OpenAI-Compatible 和 DeepSeek 官方 Provider 都能完成工具循环。
+
+共享 Runtime 因此不能假设所有 OpenAI-Compatible Provider 都支持 `required` 或指定工具；Provider capability 应显式声明，默认使用 `auto`。
+
+### 构建体积
+
+Vite 生产构建结果：
+
+- 空白基线入口：`0.10 kB` gzip。
+- Spike 主入口（AI SDK Agent 核心与测试页逻辑）：约 `94.02 kB` gzip。
+- DeepSeek Provider 动态 chunk：约 `3.76 kB` gzip。
+- OpenAI-Compatible Provider 动态 chunk：约 `7.02 kB` gzip。
+- 测试页 CSS：约 `0.96 kB` gzip。
+
+Provider 使用动态导入，运行时只下载用户实际选择的一种。正式接入时 AI Tab 也必须整体懒加载，避免增加 Web WASM 首页首屏体积。
diff --git a/tests/web-ai-sdk-spike/baseline.html b/tests/web-ai-sdk-spike/baseline.html
new file mode 100644
index 00000000..a6f7e8c4
--- /dev/null
+++ b/tests/web-ai-sdk-spike/baseline.html
@@ -0,0 +1,12 @@
+<!doctype html>
+<html lang="zh-CN">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>ChatLab Web AI SDK Baseline</title>
+  </head>
+  <body>
+    <main>Web AI SDK bundle baseline</main>
+    <script type="module" src="/src/baseline.ts"></script>
+  </body>
+</html>
diff --git a/tests/web-ai-sdk-spike/index.html b/tests/web-ai-sdk-spike/index.html
new file mode 100644
index 00000000..bd37497a
--- /dev/null
+++ b/tests/web-ai-sdk-spike/index.html
@@ -0,0 +1,76 @@
+<!doctype html>
+<html lang="zh-CN">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>ChatLab Web AI SDK Spike</title>
+    <link rel="stylesheet" href="/src/style.css" />
+  </head>
+  <body>
+    <main>
+      <header>
+        <p class="eyebrow">ChatLab Web WASM</p>
+        <h1>AI SDK 浏览器可行性验证</h1>
+        <p>Key 只保存在当前页面内存中，刷新后立即清空。</p>
+      </header>
+
+      <section class="panel config-grid" aria-label="模型配置">
+        <label>
+          Provider Adapter
+          <select id="provider-kind">
+            <option value="openai-compatible">OpenAI Compatible</option>
+            <option value="deepseek">DeepSeek 官方 Provider</option>
+          </select>
+        </label>
+        <label>
+          Base URL
+          <input id="base-url" type="url" value="https://api.deepseek.com" autocomplete="off" />
+        </label>
+        <label>
+          Model
+          <input id="model" value="deepseek-v4-flash" autocomplete="off" />
+        </label>
+        <label>
+          临时 API Key
+          <input id="api-key" type="password" autocomplete="off" spellcheck="false" />
+        </label>
+      </section>
+
+      <section class="actions" aria-label="测试操作">
+        <button id="stream-test" type="button">1. 测试流式</button>
+        <button id="tool-test" type="button">2. 测试工具循环</button>
+        <button id="abort-test" type="button">3. 测试中止</button>
+        <button id="stop" type="button" class="secondary" disabled>停止当前请求</button>
+      </section>
+
+      <section class="result-grid" aria-live="polite">
+        <article class="panel metric">
+          <span>状态</span>
+          <strong id="status" data-testid="status">等待测试</strong>
+        </article>
+        <article class="panel metric">
+          <span>首个输出</span>
+          <strong id="ttfb" data-testid="ttfb">—</strong>
+        </article>
+        <article class="panel metric">
+          <span>工具调用</span>
+          <strong id="tool-count" data-testid="tool-count">0</strong>
+        </article>
+        <article class="panel metric">
+          <span>Token</span>
+          <strong id="usage" data-testid="usage">—</strong>
+        </article>
+      </section>
+
+      <section class="panel output-panel">
+        <div class="output-heading">
+          <h2>事件与输出</h2>
+          <button id="clear" type="button" class="text-button">清空</button>
+        </div>
+        <pre id="output" data-testid="output"></pre>
+      </section>
+    </main>
+
+    <script type="module" src="/src/main.ts"></script>
+  </body>
+</html>
diff --git a/tests/web-ai-sdk-spike/src/baseline.ts b/tests/web-ai-sdk-spike/src/baseline.ts
new file mode 100644
index 00000000..cb5caae4
--- /dev/null
+++ b/tests/web-ai-sdk-spike/src/baseline.ts
@@ -0,0 +1 @@
+document.documentElement.dataset.ready = 'true'
diff --git a/tests/web-ai-sdk-spike/src/main.ts b/tests/web-ai-sdk-spike/src/main.ts
new file mode 100644
index 00000000..35d276af
--- /dev/null
+++ b/tests/web-ai-sdk-spike/src/main.ts
@@ -0,0 +1,135 @@
+import type { LanguageModelUsage } from 'ai'
+import {
+  runAbortSpike,
+  runStreamSpike,
+  runToolLoopSpike,
+  type ProviderKind,
+  type SpikeConfig,
+  type SpikeEvent,
+  type SpikeRunResult,
+} from './runtime'
+
+function requiredElement<T extends HTMLElement>(id: string): T {
+  const element = document.getElementById(id)
+  if (!element) throw new Error(`Missing #${id}`)
+  return element as T
+}
+
+const providerKind = requiredElement<HTMLSelectElement>('provider-kind')
+const baseURL = requiredElement<HTMLInputElement>('base-url')
+const model = requiredElement<HTMLInputElement>('model')
+const apiKey = requiredElement<HTMLInputElement>('api-key')
+const streamButton = requiredElement<HTMLButtonElement>('stream-test')
+const toolButton = requiredElement<HTMLButtonElement>('tool-test')
+const abortButton = requiredElement<HTMLButtonElement>('abort-test')
+const stopButton = requiredElement<HTMLButtonElement>('stop')
+const clearButton = requiredElement<HTMLButtonElement>('clear')
+const status = requiredElement<HTMLElement>('status')
+const ttfb = requiredElement<HTMLElement>('ttfb')
+const toolCount = requiredElement<HTMLElement>('tool-count')
+const usage = requiredElement<HTMLElement>('usage')
+const output = requiredElement<HTMLPreElement>('output')
+
+let activeController: AbortController | null = null
+
+function readConfig(): SpikeConfig {
+  const key = apiKey.value.trim()
+  if (!key) throw new Error('请输入临时 API Key')
+  const url = baseURL.value.trim()
+  if (!url) throw new Error('请输入 Base URL')
+  const modelId = model.value.trim()
+  if (!modelId) throw new Error('请输入模型名称')
+  return {
+    providerKind: providerKind.value as ProviderKind,
+    baseURL: url,
+    apiKey: key,
+    model: modelId,
+  }
+}
+
+function append(value: string): void {
+  output.textContent += value
+  output.scrollTop = output.scrollHeight
+}
+
+function formatUsage(value: LanguageModelUsage): string {
+  return `${value.inputTokens ?? 0} / ${value.outputTokens ?? 0}`
+}
+
+function handleEvent(event: SpikeEvent): void {
+  switch (event.type) {
+    case 'text':
+      append(event.delta)
+      break
+    case 'reasoning':
+      append(`[reasoning] ${event.delta}`)
+      break
+    case 'tool-call':
+      append(`\n[tool-call] ${event.name}\n`)
+      break
+    case 'tool-result':
+      append(`[tool-result] ${event.name}\n`)
+      break
+    case 'usage':
+      usage.textContent = formatUsage(event.usage)
+      break
+    case 'aborted':
+      append('\n[aborted]\n')
+      break
+  }
+}
+
+function safeErrorMessage(error: unknown, key: string): string {
+  const message = error instanceof Error ? error.message : String(error)
+  return message.replaceAll(key, '[REDACTED]')
+}
+
+function setRunning(running: boolean): void {
+  streamButton.disabled = running
+  toolButton.disabled = running
+  abortButton.disabled = running
+  stopButton.disabled = !running
+}
+
+async function run(test: (config: SpikeConfig, signal: AbortSignal) => Promise<SpikeRunResult>): Promise<void> {
+  let config: SpikeConfig
+  try {
+    config = readConfig()
+  } catch (error) {
+    status.textContent = error instanceof Error ? error.message : String(error)
+    return
+  }
+
+  output.textContent = ''
+  status.textContent = '请求中'
+  ttfb.textContent = '—'
+  toolCount.textContent = '0'
+  usage.textContent = '—'
+  activeController = new AbortController()
+  setRunning(true)
+
+  try {
+    const result = await test(config, activeController.signal)
+    ttfb.textContent = result.firstOutputMs === null ? '—' : `${Math.round(result.firstOutputMs)} ms`
+    toolCount.textContent = String(result.toolCalls)
+    usage.textContent = formatUsage(result.usage)
+    status.textContent = result.aborted ? '已中止' : '通过'
+  } catch (error) {
+    const message = safeErrorMessage(error, config.apiKey)
+    status.textContent = activeController.signal.aborted ? '已中止' : '失败'
+    append(`\n[error] ${message}\n`)
+  } finally {
+    activeController = null
+    setRunning(false)
+  }
+}
+
+streamButton.addEventListener('click', () => void run((config, signal) => runStreamSpike(config, signal, handleEvent)))
+toolButton.addEventListener('click', () => void run((config, signal) => runToolLoopSpike(config, signal, handleEvent)))
+abortButton.addEventListener('click', () => void run((config, signal) => runAbortSpike(config, signal, handleEvent)))
+stopButton.addEventListener('click', () => activeController?.abort())
+clearButton.addEventListener('click', () => {
+  output.textContent = ''
+})
+
+document.documentElement.dataset.ready = 'true'
diff --git a/tests/web-ai-sdk-spike/src/runtime.ts b/tests/web-ai-sdk-spike/src/runtime.ts
new file mode 100644
index 00000000..a58a4d19
--- /dev/null
+++ b/tests/web-ai-sdk-spike/src/runtime.ts
@@ -0,0 +1,225 @@
+import type { LanguageModel, LanguageModelUsage, ToolSet } from 'ai'
+import { ToolLoopAgent, stepCountIs, streamText, tool } from 'ai'
+import { z } from 'zod'
+
+export type ProviderKind = 'openai-compatible' | 'deepseek'
+
+export interface SpikeConfig {
+  providerKind: ProviderKind
+  baseURL: string
+  apiKey: string
+  model: string
+}
+
+export type SpikeEvent =
+  | { type: 'text'; delta: string }
+  | { type: 'reasoning'; delta: string }
+  | { type: 'tool-call'; name: string }
+  | { type: 'tool-result'; name: string }
+  | { type: 'usage'; usage: LanguageModelUsage }
+  | { type: 'aborted' }
+
+export interface SpikeRunResult {
+  text: string
+  firstOutputMs: number | null
+  toolCalls: number
+  usage: LanguageModelUsage
+  aborted: boolean
+}
+
+function emptyUsage(): LanguageModelUsage {
+  return {
+    inputTokens: undefined,
+    inputTokenDetails: {
+      noCacheTokens: undefined,
+      cacheReadTokens: undefined,
+      cacheWriteTokens: undefined,
+    },
+    outputTokens: undefined,
+    outputTokenDetails: {
+      textTokens: undefined,
+      reasoningTokens: undefined,
+    },
+    totalTokens: undefined,
+  }
+}
+
+export async function createSpikeModel(config: SpikeConfig): Promise<LanguageModel> {
+  const common = {
+    apiKey: config.apiKey,
+    baseURL: config.baseURL.replace(/\/+$/, ''),
+  }
+
+  if (config.providerKind === 'deepseek') {
+    const { createDeepSeek } = await import('@ai-sdk/deepseek')
+    return createDeepSeek(common)(config.model)
+  }
+
+  const { createOpenAICompatible } = await import('@ai-sdk/openai-compatible')
+  return createOpenAICompatible({
+    ...common,
+    name: 'deepseek-browser-spike',
+  }).chatModel(config.model)
+}
+
+export async function runStreamSpike(
+  config: SpikeConfig,
+  signal: AbortSignal,
+  onEvent: (event: SpikeEvent) => void
+): Promise<SpikeRunResult> {
+  const model = await createSpikeModel(config)
+  const startedAt = performance.now()
+  let firstOutputMs: number | null = null
+  let text = ''
+  let aborted = false
+
+  const result = streamText({
+    model,
+    abortSignal: signal,
+    maxOutputTokens: 256,
+    prompt: '请用一句简短中文回复：ChatLab Web AI 流式请求成功。',
+  })
+
+  for await (const part of result.stream) {
+    if (part.type === 'text-delta') {
+      firstOutputMs ??= performance.now() - startedAt
+      text += part.text
+      onEvent({ type: 'text', delta: part.text })
+    } else if (part.type === 'reasoning-delta') {
+      firstOutputMs ??= performance.now() - startedAt
+      onEvent({ type: 'reasoning', delta: part.text })
+    } else if (part.type === 'abort') {
+      aborted = true
+      onEvent({ type: 'aborted' })
+    } else if (part.type === 'error') {
+      throw part.error
+    }
+  }
+
+  const usage = await result.usage
+  onEvent({ type: 'usage', usage })
+  return { text, firstOutputMs, toolCalls: 0, usage, aborted }
+}
+
+export async function runToolLoopSpike(
+  config: SpikeConfig,
+  signal: AbortSignal,
+  onEvent: (event: SpikeEvent) => void
+): Promise<SpikeRunResult> {
+  const model = await createSpikeModel(config)
+  const startedAt = performance.now()
+  let firstOutputMs: number | null = null
+  let text = ''
+  let toolCalls = 0
+  let aborted = false
+
+  const tools = {
+    get_chat_overview: tool({
+      description: '获取当前聊天的本地安全概览。测试中返回固定的无隐私数据。',
+      inputSchema: z.object({}),
+      execute: async () => {
+        toolCalls += 1
+        return {
+          name: '浏览器测试群',
+          type: 'group',
+          totalMessages: 128,
+          totalMembers: 4,
+        }
+      },
+    }),
+  } satisfies ToolSet
+
+  const agent = new ToolLoopAgent({
+    model,
+    instructions: '你是 ChatLab 测试助手。必须先调用工具，再根据工具结果用一句中文总结，不能猜测数据。',
+    tools,
+    stopWhen: stepCountIs(3),
+    maxOutputTokens: 256,
+  })
+
+  const result = await agent.stream({
+    abortSignal: signal,
+    prompt: '请先查询聊天概览，然后说明消息数和成员数。',
+  })
+
+  for await (const part of result.stream) {
+    if (part.type === 'text-delta') {
+      firstOutputMs ??= performance.now() - startedAt
+      text += part.text
+      onEvent({ type: 'text', delta: part.text })
+    } else if (part.type === 'reasoning-delta') {
+      firstOutputMs ??= performance.now() - startedAt
+      onEvent({ type: 'reasoning', delta: part.text })
+    } else if (part.type === 'tool-call') {
+      firstOutputMs ??= performance.now() - startedAt
+      onEvent({ type: 'tool-call', name: part.toolName })
+    } else if (part.type === 'tool-result') {
+      onEvent({ type: 'tool-result', name: part.toolName })
+    } else if (part.type === 'abort') {
+      aborted = true
+      onEvent({ type: 'aborted' })
+    } else if (part.type === 'error') {
+      throw part.error
+    }
+  }
+
+  const usage = await result.usage
+  onEvent({ type: 'usage', usage })
+  return { text, firstOutputMs, toolCalls, usage, aborted }
+}
+
+export async function runAbortSpike(
+  config: SpikeConfig,
+  signal: AbortSignal,
+  onEvent: (event: SpikeEvent) => void
+): Promise<SpikeRunResult> {
+  const model = await createSpikeModel(config)
+  const startedAt = performance.now()
+  let firstOutputMs: number | null = null
+  let text = ''
+  let aborted = false
+
+  const result = streamText({
+    model,
+    abortSignal: signal,
+    maxOutputTokens: 1000,
+    prompt: '请从 1 开始逐行输出整数，一直输出到 500，不要解释。',
+    // 显式接管流错误；主动中止会在下方归一化为 aborted，而不是业务失败。
+    onError: () => undefined,
+    onAbort: () => {
+      aborted = true
+      onEvent({ type: 'aborted' })
+    },
+  })
+
+  try {
+    for await (const part of result.stream) {
+      if (part.type === 'text-delta') {
+        firstOutputMs ??= performance.now() - startedAt
+        text += part.text
+        onEvent({ type: 'text', delta: part.text })
+      } else if (part.type === 'reasoning-delta') {
+        firstOutputMs ??= performance.now() - startedAt
+        onEvent({ type: 'reasoning', delta: part.text })
+      } else if (part.type === 'abort') {
+        aborted = true
+      } else if (part.type === 'error') {
+        if (!signal.aborted) throw part.error
+        aborted = true
+      }
+    }
+  } catch (error) {
+    if (!signal.aborted) throw error
+    aborted = true
+  }
+
+  let usage = emptyUsage()
+  try {
+    usage = await result.usage
+  } catch (error) {
+    // 即使中止后不展示 usage，也要消费它的 rejection，避免浏览器产生未处理异常。
+    if (!signal.aborted) throw error
+  }
+  onEvent({ type: 'usage', usage })
+  return { text, firstOutputMs, toolCalls: 0, usage, aborted }
+}
diff --git a/tests/web-ai-sdk-spike/src/style.css b/tests/web-ai-sdk-spike/src/style.css
new file mode 100644
index 00000000..b42ee075
--- /dev/null
+++ b/tests/web-ai-sdk-spike/src/style.css
@@ -0,0 +1,193 @@
+:root {
+  color: #18181b;
+  background: #f4f4f5;
+  font-family:
+    Inter,
+    ui-sans-serif,
+    system-ui,
+    -apple-system,
+    BlinkMacSystemFont,
+    'Segoe UI',
+    sans-serif;
+}
+
+* {
+  box-sizing: border-box;
+}
+
+body {
+  margin: 0;
+}
+
+main {
+  width: min(960px, calc(100% - 32px));
+  margin: 0 auto;
+  padding: 48px 0 80px;
+}
+
+header {
+  margin-bottom: 28px;
+}
+
+h1,
+h2,
+p {
+  margin: 0;
+}
+
+h1 {
+  margin: 6px 0 10px;
+  font-size: clamp(28px, 5vw, 44px);
+  letter-spacing: -0.04em;
+}
+
+h2 {
+  font-size: 16px;
+}
+
+header p:last-child,
+.eyebrow,
+label,
+.metric span {
+  color: #71717a;
+}
+
+.eyebrow {
+  font-size: 12px;
+  font-weight: 700;
+  letter-spacing: 0.14em;
+  text-transform: uppercase;
+}
+
+.panel {
+  border: 1px solid #e4e4e7;
+  border-radius: 16px;
+  background: #fff;
+  box-shadow: 0 12px 30px rgb(24 24 27 / 5%);
+}
+
+.config-grid {
+  display: grid;
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+  gap: 18px;
+  padding: 22px;
+}
+
+label {
+  display: grid;
+  gap: 8px;
+  font-size: 13px;
+  font-weight: 600;
+}
+
+input,
+select,
+button {
+  min-height: 42px;
+  border-radius: 10px;
+  font: inherit;
+}
+
+input,
+select {
+  width: 100%;
+  border: 1px solid #d4d4d8;
+  padding: 0 12px;
+  color: #18181b;
+  background: #fff;
+}
+
+.actions {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 10px;
+  margin: 18px 0;
+}
+
+button {
+  border: 0;
+  padding: 0 16px;
+  color: #fff;
+  background: #db2777;
+  cursor: pointer;
+  font-weight: 650;
+}
+
+button:hover:not(:disabled) {
+  background: #be185d;
+}
+
+button:disabled {
+  cursor: not-allowed;
+  opacity: 0.45;
+}
+
+button.secondary {
+  color: #3f3f46;
+  background: #e4e4e7;
+}
+
+.result-grid {
+  display: grid;
+  grid-template-columns: repeat(4, minmax(0, 1fr));
+  gap: 12px;
+  margin-bottom: 18px;
+}
+
+.metric {
+  display: grid;
+  gap: 6px;
+  padding: 16px;
+}
+
+.metric span {
+  font-size: 12px;
+}
+
+.metric strong {
+  font-variant-numeric: tabular-nums;
+}
+
+.output-panel {
+  overflow: hidden;
+}
+
+.output-heading {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  border-bottom: 1px solid #e4e4e7;
+  padding: 14px 18px;
+}
+
+button.text-button {
+  min-height: auto;
+  padding: 4px 8px;
+  color: #71717a;
+  background: transparent;
+  font-size: 12px;
+}
+
+pre {
+  min-height: 220px;
+  max-height: 440px;
+  overflow: auto;
+  margin: 0;
+  padding: 18px;
+  white-space: pre-wrap;
+  word-break: break-word;
+  font-family: 'SFMono-Regular', Consolas, monospace;
+  font-size: 13px;
+  line-height: 1.65;
+}
+
+@media (max-width: 680px) {
+  .config-grid,
+  .result-grid {
+    grid-template-columns: 1fr;
+  }
+
+  .actions button {
+    flex: 1 1 100%;
+  }
+}
diff --git a/tests/web-ai-sdk-spike/tsconfig.json b/tests/web-ai-sdk-spike/tsconfig.json
new file mode 100644
index 00000000..cc0d0ef5
--- /dev/null
+++ b/tests/web-ai-sdk-spike/tsconfig.json
@@ -0,0 +1,5 @@
+{
+  "extends": "../../tsconfig.web.json",
+  "include": ["src/**/*.ts", "vite.config.mts"],
+  "exclude": []
+}
diff --git a/tests/web-ai-sdk-spike/vite.config.mts b/tests/web-ai-sdk-spike/vite.config.mts
new file mode 100644
index 00000000..e956d17e
--- /dev/null
+++ b/tests/web-ai-sdk-spike/vite.config.mts
@@ -0,0 +1,25 @@
+import path from 'node:path'
+import { fileURLToPath } from 'node:url'
+import { defineConfig } from 'vite'
+
+const root = fileURLToPath(new URL('.', import.meta.url))
+
+export default defineConfig({
+  root,
+  build: {
+    target: 'esnext',
+    outDir: path.join(root, 'dist'),
+    emptyOutDir: true,
+    rollupOptions: {
+      input: {
+        baseline: path.join(root, 'baseline.html'),
+        spike: path.join(root, 'index.html'),
+      },
+    },
+  },
+  server: {
+    host: '127.0.0.1',
+    port: 3131,
+    strictPort: true,
+  },
+})