npm - feihong-code - Versions diffs - 0.2.2 → 0.5.1 - Mend

feihong-code 0.2.2 → 0.5.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (152) hide show

package/.github/FUNDING.yml +4 -0
package/.github/ISSUE_TEMPLATE/bug_report.md +37 -37
package/.github/ISSUE_TEMPLATE/config.yml +14 -14
package/.github/ISSUE_TEMPLATE/feature_request.md +28 -28
package/.github/PULL_REQUEST_TEMPLATE.md +46 -46
package/.github/SECURITY.md +67 -67
package/.github/dependabot.yml +16 -0
package/.github/workflows/ci.yml +1 -1
package/AGENT-GUIDE.md +382 -237
package/CHANGELOG.md +405 -73
package/CODE_OF_CONDUCT.md +56 -56
package/CONTRIBUTING.md +68 -68
package/LICENSE +22 -22
package/README.md +31 -25
package/README.self-evolve.md +274 -0
package/dist/agent/code-review.js +2 -0
package/dist/agent/code-review.js.map +1 -1
package/dist/agent/code-writer.js +70 -17
package/dist/agent/code-writer.js.map +1 -1
package/dist/agent/context-compactor.js +13 -4
package/dist/agent/context-compactor.js.map +1 -1
package/dist/agent/experience.js +262 -62
package/dist/agent/experience.js.map +1 -1
package/dist/agent/orchestrator.js +148 -68
package/dist/agent/orchestrator.js.map +1 -1
package/dist/agent/quality-gate.js +10 -4
package/dist/agent/quality-gate.js.map +1 -1
package/dist/agent/repo-context.js +181 -0
package/dist/agent/repo-context.js.map +1 -0
package/dist/agent/repo-reader.js +92 -99
package/dist/agent/repo-reader.js.map +1 -1
package/dist/agent/self-heal.js +38 -48
package/dist/agent/self-heal.js.map +1 -1
package/dist/agent/self-improver.js +65 -61
package/dist/agent/self-improver.js.map +1 -1
package/dist/agent/subagent-summary.js +31 -0
package/dist/agent/subagent-summary.js.map +1 -0
package/dist/agent/subagent.js +52 -2
package/dist/agent/subagent.js.map +1 -1
package/dist/agent/symbol-index.js +160 -0
package/dist/agent/symbol-index.js.map +1 -0
package/dist/agent/team.js +193 -0
package/dist/agent/team.js.map +1 -0
package/dist/cli/commands.js +124 -143
package/dist/cli/commands.js.map +1 -1
package/dist/cli/index.js +113 -106
package/dist/cli/index.js.map +1 -1
package/dist/cli/repl.js +82 -7
package/dist/cli/repl.js.map +1 -1
package/dist/cli/run.js +601 -95
package/dist/cli/run.js.map +1 -1
package/dist/cli/tui.js +145 -0
package/dist/cli/tui.js.map +1 -0
package/dist/cli/version.js +1 -1
package/dist/enterprise/audit.js +75 -12
package/dist/enterprise/audit.js.map +1 -1
package/dist/enterprise/index.js +14 -11
package/dist/enterprise/index.js.map +1 -1
package/dist/enterprise/policy.js +22 -10
package/dist/enterprise/policy.js.map +1 -1
package/dist/harness/executor.js +127 -0
package/dist/harness/executor.js.map +1 -0
package/dist/harness/harness.js +87 -0
package/dist/harness/harness.js.map +1 -0
package/dist/harness/index.js +31 -0
package/dist/harness/index.js.map +1 -0
package/dist/harness/loader.js +138 -0
package/dist/harness/loader.js.map +1 -0
package/dist/harness/reporter.js +34 -0
package/dist/harness/reporter.js.map +1 -0
package/dist/harness/types.js +10 -0
package/dist/harness/types.js.map +1 -0
package/dist/harness/verifier.js +48 -0
package/dist/harness/verifier.js.map +1 -0
package/dist/hello.js +14 -0
package/dist/hello.js.map +1 -0
package/dist/memory/auto-summarize.js +208 -0
package/dist/memory/auto-summarize.js.map +1 -0
package/dist/memory/index.js +228 -0
package/dist/memory/index.js.map +1 -0
package/dist/models/model-router.js +23 -10
package/dist/models/model-router.js.map +1 -1
package/dist/plugins/plugin-loader.js +179 -0
package/dist/plugins/plugin-loader.js.map +1 -0
package/dist/runtime/event-log.js.map +1 -1
package/dist/runtime/hooks.js +80 -0
package/dist/runtime/hooks.js.map +1 -0
package/dist/self-evolve/hook.js +60 -0
package/dist/self-evolve/hook.js.map +1 -0
package/dist/shared/config.js +35 -3
package/dist/shared/config.js.map +1 -1
package/dist/shared/i18n.js +535 -0
package/dist/shared/i18n.js.map +1 -0
package/dist/skills/grill.js +2 -1
package/dist/skills/grill.js.map +1 -1
package/dist/skills/self-heal.js +73 -0
package/dist/skills/self-heal.js.map +1 -0
package/dist/skills/skill-loader.js +131 -0
package/dist/skills/skill-loader.js.map +1 -0
package/dist/skills/skill-market.js +195 -0
package/dist/skills/skill-market.js.map +1 -0
package/dist/tools/analysis/code-analyzer.js +45 -18
package/dist/tools/analysis/code-analyzer.js.map +1 -1
package/dist/tools/index.js +5 -0
package/dist/tools/index.js.map +1 -1
package/dist/tools/mcp/index.js +84 -0
package/dist/tools/mcp/index.js.map +1 -0
package/dist/tools/mcp/mcp-client.js +172 -0
package/dist/tools/mcp/mcp-client.js.map +1 -0
package/dist/tools/sandbox.js +126 -0
package/dist/tools/sandbox.js.map +1 -0
package/dist/tools/shell/exec.js +25 -0
package/dist/tools/shell/exec.js.map +1 -1
package/dist/tools/shell/run-shell.tool.js +4 -1
package/dist/tools/shell/run-shell.tool.js.map +1 -1
package/dist/tools/skills/load-skill.tool.js +36 -0
package/dist/tools/skills/load-skill.tool.js.map +1 -0
package/dist/tools/tool.interface.js.map +1 -1
package/dist/tools/tool.registry.js +37 -1
package/dist/tools/tool.registry.js.map +1 -1
package/dist/tools/web/web.tool.js +139 -0
package/dist/tools/web/web.tool.js.map +1 -0
package/dist/web/auth.js +42 -3
package/dist/web/auth.js.map +1 -1
package/dist/web/channels.js +171 -0
package/dist/web/channels.js.map +1 -0
package/dist/web/public/index.html +3253 -39
package/dist/web/public/index.html.tmp +3117 -0
package/dist/web/public/index_new.html +3196 -0
package/dist/web/server.js +790 -11
package/dist/web/server.js.map +1 -1
package/dist/web/task-queue.js +352 -0
package/dist/web/task-queue.js.map +1 -0
package/dist/web/web-config.js +143 -0
package/dist/web/web-config.js.map +1 -0
package/docs/Deployment_Guide_EN.md +288 -0
package/docs/Technical_Manual_EN.md +216 -0
package/docs/User_Manual_EN.md +314 -0
package/docs/self-evolve-implementation.md +165 -0
package/docs/self-evolve.md +166 -0
package/docs//344/272/247/345/223/201/345/274/200/345/217/221/346/226/207/346/241/243.md +614 -614
package/docs//344/274/201/344/270/232/351/203/250/347/275/262/344/270/216/345/220/210/350/247/204.md +267 -267
package/docs//344/275/277/347/224/250/350/257/264/346/230/216/344/271/246.md +318 -358
package/docs//345/270/270/350/247/201/351/227/256/351/242/230/344/270/216/346/225/205/351/232/234/346/216/222/346/237/245.md +130 -130
package/docs//346/212/200/346/234/257/350/257/264/346/230/216/344/271/246.md +216 -303
package/docs//346/236/266/346/236/204/344/270/216API.md +238 -238
package/docs//347/224/250/346/210/267/346/211/213/345/206/214.md +196 -196
package/docs//351/203/250/347/275/262/346/214/207/345/215/227.md +165 -165
package/docs//351/203/250/347/275/262/350/257/264/346/230/216/344/271/246.md +288 -0
package/docs//351/205/215/347/275/256/345/217/202/350/200/203.md +127 -127
package/package.json +114 -109
package/tool-schema.json +127 -127

package/dist/web/public/index_new.html ADDED Viewed

@@ -0,0 +1,3196 @@
+<!DOCTYPE html>
+<html lang="zh">
+<head>
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+  <title>飞虹 Code 控制台 / fhcode Console</title>
+  <style>
+    :root {
+      --bg: #f5f7fa;
+      --card: #ffffff;
+      --ink: #1f2933;
+      --ink-2: #475569;
+      --muted: #6b7785;
+      --brand: #2563eb;
+      --brand-soft: #eff4ff;
+      --ok: #16a34a;
+      --err: #dc2626;
+      --warn: #d97706;
+      --border: #e3e8ef;
+      --line: #e3e8ef;
+      --sidebar-width: 56px;
+      --topbar-height: 48px;
+    }
+    .dark {
+      --bg: #0f172a;
+      --card: #1e293b;
+      --ink: #f1f5f9;
+      --ink-2: #cbd5e1;
+      --muted: #94a3b8;
+      --brand: #3b82f6;
+      --brand-soft: #1e3a8a;
+      --border: #334155;
+      --line: #334155;
+    }
+    * { box-sizing: border-box; }
+    body {
+      margin: 0;
+      font-family: -apple-system, "Segoe UI", "PingFang SC", "Microsoft YaHei", Roboto, Helvetica, Arial, sans-serif;
+      background: var(--bg);
+      color: var(--ink);
+      height: 100vh;
+      overflow: hidden;
+    }
+    /* ========== 登录遮罩 ========== */
+    #loginOverlay {
+      position: fixed; inset: 0; background: var(--bg); z-index: 50;
+      display: flex; align-items: center; justify-content: center;
+    }
+    #loginOverlay .login-card {
+      background: var(--card); border: 1px solid var(--border); border-radius: 16px;
+      padding: 32px; width: 360px; box-shadow: 0 10px 30px rgba(31,41,51,0.08);
+    }
+    #loginOverlay h2 { margin: 0 0 4px; font-size: 20px; }
+    #loginOverlay p { margin: 0 0 20px; color: var(--muted); font-size: 13px; }
+    #loginOverlay input {
+      width: 100%; border: 1px solid var(--border); border-radius: 10px;
+      padding: 10px 12px; font-size: 14px; margin-bottom: 12px; font-family: inherit;
+      background: var(--card); color: var(--ink);
+    }
+    #loginOverlay button {
+      width: 100%; border: none; background: var(--brand); color: #fff;
+      border-radius: 10px; padding: 10px; font-size: 14px; cursor: pointer;
+    }
+    #loginOverlay .login-status { font-size: 13px; margin-top: 10px; min-height: 18px; }
+    #loginOverlay .login-status.err { color: var(--err); }
+    /* ========== 主布局 ========== */
+    .app-layout {
+      display: flex;
+      flex-direction: column;
+      height: 100vh;
+      display: none;
+    }
+    .app-layout.show { display: flex; }
+    /* ========== 顶部导航栏 ========== */
+    .topbar {
+      height: var(--topbar-height);
+      background: var(--card);
+      border-bottom: 1px solid var(--border);
+      display: flex;
+      align-items: center;
+      padding: 0 16px;
+      gap: 12px;
+      flex-shrink: 0;
+    }
+    .topbar-brand {
+      font-weight: 700;
+      font-size: 15px;
+      color: var(--brand);
+      display: flex;
+      align-items: center;
+      gap: 8px;
+    }
+    .topbar-brand .logo {
+      width: 28px;
+      height: 28px;
+      background: var(--brand);
+      color: #fff;
+      border-radius: 8px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      font-size: 14px;
+    }
+    .topbar-nav {
+      display: flex;
+      gap: 4px;
+      margin-left: 24px;
+    }
+    .topbar-nav-item {
+      padding: 6px 12px;
+      border-radius: 8px;
+      font-size: 13px;
+      color: var(--ink-2);
+      cursor: pointer;
+      display: flex;
+      align-items: center;
+      gap: 6px;
+      transition: all 0.15s;
+    }
+    .topbar-nav-item:hover {
+      background: var(--bg);
+      color: var(--ink);
+    }
+    .topbar-nav-item.active {
+      background: var(--brand-soft);
+      color: var(--brand);
+      font-weight: 600;
+    }
+    .topbar-spacer { flex: 1; }
+    .topbar-user {
+      display: flex;
+      align-items: center;
+      gap: 10px;
+      padding: 6px 10px;
+      border-radius: 10px;
+      cursor: pointer;
+      transition: background 0.15s;
+    }
+    .topbar-user:hover { background: var(--bg); }
+    .topbar-avatar {
+      width: 32px;
+      height: 32px;
+      background: var(--brand-soft);
+      border-radius: 50%;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      font-size: 16px;
+    }
+    .topbar-phone { font-size: 13px; font-weight: 500; color: var(--ink); }
+    /* ========== 主体内容区 ========== */
+    .main-area {
+      flex: 1;
+      display: flex;
+      overflow: hidden;
+    }
+    /* ========== 左侧侧边栏 ========== */
+    .sidebar {
+      width: 200px;
+      background: var(--card);
+      border-right: 1px solid var(--border);
+      display: flex;
+      flex-direction: column;
+      padding: 12px 8px;
+      gap: 2px;
+      flex-shrink: 0;
+      overflow-y: auto;
+    }
+    .sidebar-section {
+      margin-bottom: 8px;
+      padding-bottom: 8px;
+      border-bottom: 1px solid var(--border);
+    }
+    .sidebar-section-title {
+      font-size: 11px;
+      color: var(--muted);
+      text-transform: uppercase;
+      letter-spacing: 0.5px;
+      padding: 4px 8px;
+      margin-bottom: 4px;
+    }
+    .sidebar-icon {
+      width: 100%;
+      height: 36px;
+      border-radius: 8px;
+      display: flex;
+      align-items: center;
+      gap: 10px;
+      padding: 0 8px;
+      cursor: pointer;
+      color: var(--ink-2);
+      transition: all 0.15s;
+      position: relative;
+      font-size: 13px;
+    }
+    .sidebar-icon .icon {
+      font-size: 16px;
+      width: 20px;
+      text-align: center;
+      flex-shrink: 0;
+    }
+    .sidebar-icon .label {
+      flex: 1;
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+    }
+    .sidebar-icon .badge {
+      font-size: 10px;
+      padding: 2px 6px;
+      border-radius: 10px;
+      background: var(--brand-soft);
+      color: var(--brand);
+      font-weight: 600;
+      flex-shrink: 0;
+    }
+    .sidebar-icon:hover {
+      background: var(--bg);
+      color: var(--ink);
+    }
+    .sidebar-icon.active {
+      background: var(--brand-soft);
+      color: var(--brand);
+      font-weight: 600;
+    }
+    .sidebar-icon.active::before {
+      content: '';
+      position: absolute;
+      left: 0;
+      top: 50%;
+      transform: translateY(-50%);
+      width: 3px;
+      height: 20px;
+      background: var(--brand);
+      border-radius: 0 2px 2px 0;
+    }
+    .sidebar-spacer { flex: 1; }
+    .sidebar-pin {
+      font-size: 10px;
+      color: var(--warn);
+      flex-shrink: 0;
+    }
+    .task-item {
+      display: flex;
+      align-items: center;
+      gap: 8px;
+      padding: 8px;
+      border-radius: 6px;
+      cursor: pointer;
+      font-size: 12px;
+      transition: background 0.15s;
+    }
+    .task-item:hover { background: var(--bg); }
+    .task-item.active { background: var(--brand-soft); }
+    .task-item .task-icon { font-size: 14px; }
+    .task-item .task-title {
+      flex: 1;
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      color: var(--ink-2);
+    }
+    .task-item.active .task-title { color: var(--brand); }
+    .task-item .task-actions {
+      display: none;
+      gap: 4px;
+      font-size: 11px;
+    }
+    .task-item:hover .task-actions { display: flex; }
+    .task-item .task-actions button {
+      padding: 2px 4px;
+      border: none;
+      background: transparent;
+      cursor: pointer;
+      border-radius: 4px;
+      font-size: 10px;
+    }
+    .task-item .task-actions button:hover { background: var(--border); }
+    .task-item .task-actions .delete-btn:hover { background: #fee2e2; color: var(--err); }
+    .task-pinned { color: var(--warn); }
+    /* ========== 中间对话区 ========== */
+    .chat-area {
+      flex: 1;
+      display: flex;
+      flex-direction: column;
+      min-width: 0;
+      background: var(--bg);
+    }
+    /* ========== 任务上下文头部 ========== */
+    .task-context-header {
+      display: flex;
+      align-items: center;
+      gap: 12px;
+      padding: 12px 16px;
+      background: var(--card);
+      border-bottom: 1px solid var(--border);
+      flex-shrink: 0;
+    }
+    .tch-left { flex: 1; min-width: 0; }
+    .tch-title { font-size: 15px; font-weight: 700; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
+    .tch-sub { font-size: 12px; color: var(--muted); margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
+    .tch-right { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
+    .tch-time { font-size: 12px; color: var(--muted); }
+    /* ========== 思维链路线程 ========== */
+    .messages { flex: 1; overflow-y: auto; display: flex; flex-direction: column; gap: 10px; padding: 16px; padding-right: 4px; }
+    .step { max-width: 92%; font-size: 13.5px; line-height: 1.6; word-break: break-word; }
+    .step.created {
+      align-self: stretch; background: var(--bg); border: 1px dashed var(--border);
+      border-radius: 10px; padding: 8px 12px; color: var(--muted); font-size: 12.5px;
+    }
+    .step.reasoning {
+      align-self: flex-start; background: var(--card); border: 1px solid var(--border);
+      border-left: 3px solid var(--brand); border-radius: 10px; padding: 10px 14px;
+      white-space: pre-wrap; color: var(--ink-2);
+    }
+    .step.reasoning .reasoning-head { font-size: 11px; color: var(--brand); font-weight: 600; margin-bottom: 4px; display: flex; align-items: center; gap: 6px; }
+    .step.toolcall {
+      align-self: flex-start; background: #fffbeb; border: 1px solid #fde68a;
+      border-radius: 10px; padding: 8px 12px; color: #92400e; font-size: 12.5px;
+    }
+    .dark .step.toolcall { background: #3a2f12; color: #fcd34d; border-color: #5b4a1f; }
+    .step.toolcall .tc-name { font-weight: 600; }
+    .step.toolcall .tc-args {
+      color: var(--muted); font-size: 12px; margin-top: 2px; white-space: pre-wrap; word-break: break-word;
+      font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
+    }
+    .step.result {
+      align-self: flex-start; background: var(--card); border: 1px solid var(--border);
+      border-radius: 10px; padding: 8px 12px; color: var(--ink-2); font-size: 12.5px; max-width: 92%;
+    }
+    .step.result .res-head { font-weight: 600; display: flex; align-items: center; gap: 6px; }
+    .step.result.ok .res-head { color: var(--ok); }
+    .step.result.fail .res-head { color: var(--err); }
+    .step.result .res-out {
+      margin-top: 4px; white-space: pre-wrap; word-break: break-word; max-height: 160px; overflow-y: auto;
+      font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace; font-size: 12px; color: var(--muted);
+    }
+    .step.note { align-self: stretch; background: var(--bg); border-radius: 8px; padding: 6px 12px; color: var(--muted); font-size: 12px; }
+    /* 对话流与思维链路分隔标题 */
+    .conv-divider {
+      align-self: stretch; text-align: center; font-size: 11px; color: var(--muted);
+      border-top: 1px solid var(--line); padding-top: 8px; margin-top: 4px;
+    }
+    .step.final {
+      align-self: flex-end; background: var(--ok); color: #fff; border-radius: 12px;
+      padding: 12px 16px; white-space: pre-wrap; word-break: break-word; max-width: 92%;
+      position: relative;
+    }
+    .step.final .final-head { font-size: 11px; opacity: 0.85; margin-bottom: 4px; font-weight: 600; }
+    .step.final .final-actions {
+      position: absolute; top: 8px; right: 8px; display: flex; gap: 4px;
+      opacity: 0; transition: opacity 0.2s;
+    }
+    .step.final:hover .final-actions { opacity: 1; }
+    .step.final .final-actions button {
+      background: rgba(255,255,255,0.2); border: none; color: #fff;
+      border-radius: 6px; padding: 3px 8px; font-size: 11px; cursor: pointer;
+      transition: background 0.15s;
+    }
+    .step.final .final-actions button:hover { background: rgba(255,255,255,0.35); }
+    .step.error {
+      align-self: flex-end; background: var(--err); color: #fff; border-radius: 12px;
+      padding: 12px 16px; white-space: pre-wrap; word-break: break-word; max-width: 92%;
+    }
+    /* 对话消息区 */
+    .conv {
+      flex: 1;
+      display: flex;
+      flex-direction: column;
+      padding: 16px;
+      gap: 12px;
+      overflow: hidden;
+    }
+    .messages {
+      flex: 1;
+      overflow-y: auto;
+      display: flex;
+      flex-direction: column;
+      gap: 10px;
+      padding-right: 4px;
+    }
+    .msg {
+      padding: 10px 14px;
+      border-radius: 12px;
+      font-size: 13.5px;
+      line-height: 1.6;
+      max-width: 85%;
+      white-space: pre-wrap;
+      word-break: break-word;
+    }
+    .msg.user {
+      background: var(--brand-soft);
+      align-self: flex-end;
+    }
+    .msg.assistant {
+      background: var(--card);
+      border: 1px solid var(--border);
+      align-self: flex-start;
+    }
+    .dark .msg.assistant { background: #1e293b; }
+    .msg.sys {
+      background: #f1f5f9;
+      align-self: flex-start;
+      color: var(--ink-2);
+    }
+    .dark .msg.sys { background: #334155; }
+    .msg .artifact { color: var(--brand); text-decoration: underline; cursor: pointer; }
+    .msg .artifact:hover { opacity: 0.8; }
+    /* 输入栏 */
+    .input-area {
+      padding: 0 16px 16px;
+      flex-shrink: 0;
+    }
+    .input-bar {
+      border: 1px solid var(--border);
+      border-radius: 14px;
+      padding: 12px;
+      background: var(--card);
+      box-shadow: 0 4px 12px rgba(0,0,0,0.04);
+    }
+    .input-bar textarea {
+      width: 100%;
+      border: none;
+      margin: 0;
+      min-height: 60px;
+      resize: none;
+      background: transparent;
+      color: var(--ink);
+      font-size: 14px;
+      font-family: inherit;
+    }
+    .input-bar textarea:focus { outline: none; }
+    .input-toolbar {
+      display: flex;
+      align-items: center;
+      gap: 8px;
+      margin-top: 10px;
+      flex-wrap: wrap;
+    }
+    .input-toolbar .spacer { flex: 1; }
+    .pill {
+      border: 1px solid var(--border);
+      border-radius: 8px;
+      padding: 5px 10px;
+      font-size: 12.5px;
+      background: var(--card);
+      color: var(--ink-2);
+      cursor: pointer;
+      user-select: none;
+    }
+    .pill:hover { border-color: var(--brand); }
+    .voice-badge { display: inline-flex; align-items: center; gap: 6px; color: var(--err); font-size: 12px; }
+    /* 工作区条 */
+    .workspace-bar {
+      display: flex;
+      align-items: center;
+      gap: 8px;
+      padding: 8px 0;
+      font-size: 13px;
+      color: var(--muted);
+    }
+    .wb-select {
+      display: flex;
+      align-items: center;
+      gap: 6px;
+      cursor: pointer;
+      padding: 5px 10px;
+      border-radius: 8px;
+      background: var(--bg);
+      border: 1px solid var(--border);
+      font-size: 13px;
+      color: var(--ink);
+      max-width: 320px;
+      transition: border-color 0.15s;
+    }
+    .wb-select:hover { border-color: var(--brand); }
+    .wb-icon { font-size: 15px; }
+    .wb-label {
+      flex: 1;
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+    }
+    .wb-arrow { font-size: 10px; color: var(--muted); }
+    .wb-perm {
+      display: flex;
+      align-items: center;
+      gap: 5px;
+      cursor: pointer;
+      padding: 5px 10px;
+      border-radius: 8px;
+      background: var(--bg);
+      border: 1px solid var(--border);
+      font-size: 13px;
+      color: var(--ink);
+      transition: border-color 0.15s;
+    }
+    .wb-perm:hover { border-color: var(--brand); }
+    /* 通话栏 */
+    .call-bar {
+      display: flex;
+      align-items: center;
+      gap: 10px;
+      padding: 10px 0;
+      border-top: 1px solid var(--border);
+      margin-top: 8px;
+    }
+    .call-hint { font-size: 12px; color: var(--muted); text-transform: uppercase; letter-spacing: 0.5px; }
+    .call-btn {
+      border: 1px solid var(--border);
+      background: var(--brand-soft);
+      color: var(--brand);
+      border-radius: 8px;
+      padding: 7px 12px;
+      cursor: pointer;
+      font-size: 13px;
+      font-weight: 600;
+    }
+    .call-btn:hover { filter: brightness(0.97); }
+    .call-btn.hangup { background: #fee2e2; color: var(--err); border-color: #fecaca; }
+    .call-status { font-size: 12px; color: var(--muted); margin-left: auto; }
+    /* 底部工具栏 */
+    .chat-footbar {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      padding: 8px 16px;
+      background: var(--card);
+      border-top: 1px solid var(--border);
+      font-size: 13px;
+    }
+    .model-label { font-size: 13px; color: var(--muted); }
+    .model-select {
+      padding: 6px 10px;
+      border: 1px solid var(--border);
+      border-radius: 8px;
+      background: var(--card);
+      color: var(--ink);
+      font-size: 13px;
+    }
+    .ghost-btn {
+      border: 1px solid var(--border);
+      background: var(--card);
+      color: var(--ink-2);
+      border-radius: 8px;
+      padding: 6px 9px;
+      cursor: pointer;
+      font-size: 14px;
+    }
+    .ghost-btn:hover { background: var(--brand-soft); }
+    /* 新建任务按钮（侧边栏） */
+    .new-task-btn {
+      border: 1px solid var(--border);
+      background: var(--brand);
+      color: #fff;
+      border-radius: 8px;
+      padding: 3px 8px;
+      cursor: pointer;
+      font-size: 11px;
+      font-weight: 600;
+      line-height: 1.6;
+    }
+    .new-task-btn:hover { opacity: 0.88; }
+    /* 新建对话任务弹窗 */
+    .nt-form { display: flex; flex-direction: column; gap: 12px; margin-top: 4px; }
+    .nt-label { font-size: 12.5px; font-weight: 600; color: var(--ink-2); display: block; margin-bottom: 4px; }
+    .nt-form textarea, .nt-form select {
+      width: 100%; box-sizing: border-box; padding: 8px 10px; font-size: 13px;
+      border: 1px solid var(--border); border-radius: 10px; background: var(--bg);
+      color: var(--ink); resize: vertical; font-family: inherit;
+    }
+    .nt-form select { cursor: pointer; }
+    .nt-row { display: flex; gap: 12px; }
+    .nt-row > div { flex: 1; }
+    .nt-hint { font-size: 12px; color: var(--muted); }
+    /* ========== 右侧面板 ========== */
+    .right-panel {
+      width: 320px;
+      background: var(--card);
+      border-left: 1px solid var(--border);
+      display: flex;
+      flex-direction: column;
+      flex-shrink: 0;
+      overflow: hidden;
+    }
+    .right-panel.collapsed { width: 0; border: none; }
+    .right-tabs {
+      display: flex;
+      gap: 4px;
+      padding: 12px 12px 0;
+      border-bottom: 1px solid var(--line);
+    }
+    .right-tab {
+      padding: 8px 14px;
+      font-size: 13px;
+      color: var(--muted);
+      cursor: pointer;
+      border-bottom: 2px solid transparent;
+    }
+    .right-tab.active { color: var(--brand); border-bottom-color: var(--brand); font-weight: 600; }
+    .right-body { flex: 1; overflow-y: auto; padding: 12px; }
+    .preview-panel { display: none; }
+    .preview-panel.active { display: block; }
+    .preview-title { font-size: 13px; font-weight: 600; margin-bottom: 8px; color: var(--ink); }
+    .preview-content {
+      background: var(--bg);
+      border: 1px solid var(--border);
+      border-radius: 10px;
+      padding: 12px;
+      font-size: 12.5px;
+      overflow-x: auto;
+    }
+    .preview-content pre { margin: 0; white-space: pre-wrap; word-break: break-word; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace; }
+    /* 任务详情 */
+    .detail-ops {
+      display: grid;
+      grid-template-columns: 1fr 1fr;
+      gap: 8px;
+      margin-bottom: 14px;
+    }
+    .detail-ops .secondary {
+      border: 1px solid var(--border);
+      background: var(--brand-soft);
+      color: var(--brand);
+      border-radius: 8px;
+      padding: 7px 11px;
+      cursor: pointer;
+      font-size: 12.5px;
+      font-weight: 600;
+    }
+    .detail-ops .secondary:hover { filter: brightness(0.97); }
+    .artifact-list { display: flex; flex-direction: column; gap: 4px; }
+    .artifact-file {
+      padding: 6px 8px;
+      border: 1px solid var(--border);
+      border-radius: 6px;
+      font-size: 12.5px;
+      color: var(--ink-2);
+      cursor: pointer;
+      background: var(--bg);
+    }
+    .artifact-file:hover { background: var(--brand-soft); color: var(--brand); }
+    /* ========== 功能页面 ========== */
+    .page-view {
+      flex: 1;
+      display: none;
+      flex-direction: column;
+      padding: 24px;
+      overflow-y: auto;
+    }
+    .page-view.active { display: flex; }
+    .page-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; }
+    .page-head h2 { margin: 0; font-size: 20px; }
+    .page-head .sub { color: var(--muted); font-size: 13px; margin-top: 4px; }
+    .grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 12px; }
+    .tile {
+      border: 1px solid var(--border);
+      border-radius: 12px;
+      padding: 16px;
+      cursor: pointer;
+      background: var(--card);
+      transition: all 0.15s;
+    }
+    .tile:hover { border-color: var(--brand); box-shadow: 0 6px 18px rgba(37,99,235,0.12); }
+    .tile .icon { font-size: 24px; }
+    .tile .title { font-weight: 600; margin: 8px 0 4px; font-size: 14px; }
+    .tile .desc { color: var(--muted); font-size: 12px; line-height: 1.5; }
+    .tile .ops { display: flex; gap: 6px; margin-top: 12px; }
+    .tile .ops button { padding: 6px 12px; font-size: 12px; flex: 1; }
+    /* ========== 通用样式 ========== */
+    .card {
+      background: var(--card);
+      border: 1px solid var(--border);
+      border-radius: 16px;
+      padding: 20px;
+      box-shadow: 0 8px 24px rgba(31,41,51,0.06);
+    }
+    label { font-size: 13px; color: var(--muted); display: block; margin-bottom: 6px; }
+    input[type="text"], textarea, select {
+      width: 100%;
+      border: 1px solid var(--border);
+      border-radius: 10px;
+      padding: 10px 12px;
+      font-size: 14px;
+      font-family: inherit;
+      margin-bottom: 12px;
+      background: var(--card);
+      color: var(--ink);
+    }
+    textarea { min-height: 80px; resize: vertical; }
+    button {
+      border: none;
+      background: var(--brand);
+      color: #fff;
+      border-radius: 10px;
+      padding: 9px 16px;
+      font-size: 14px;
+      cursor: pointer;
+    }
+    button:hover { filter: brightness(1.05); }
+    button.secondary { background: #fff; color: var(--ink); border: 1px solid var(--border); }
+    button.ghost { background: transparent; color: var(--ink-2); border: 1px solid var(--border); }
+    button.danger { background: var(--err); }
+    button:disabled { opacity: 0.5; cursor: not-allowed; }
+    .row { display: flex; gap: 8px; }
+    .row > * { flex: 1; }
+    .muted { color: var(--muted); font-size: 12.5px; }
+    .empty { color: var(--muted); font-size: 13px; text-align: center; padding: 18px; }
+    .badge { display: inline-block; padding: 2px 8px; border-radius: 999px; font-size: 11px; font-weight: 600; }
+    .badge.queued { background: #eef2f7; color: var(--muted); }
+    .badge.running { background: var(--brand-soft); color: var(--brand); }
+    .badge.done { background: #f0fdf4; color: var(--ok); }
+    .badge.failed { background: #fef2f2; color: var(--err); }
+    /* ========== 模态框 ========== */
+    .mask {
+      position: fixed;
+      inset: 0;
+      background: rgba(15,23,42,0.45);
+      z-index: 60;
+      display: none;
+      align-items: center;
+      justify-content: center;
+    }
+    .mask.show { display: flex; }
+    .modal {
+      background: var(--card);
+      border-radius: 16px;
+      padding: 24px;
+      width: 520px;
+      max-width: 92vw;
+      max-height: 88vh;
+      overflow-y: auto;
+      box-shadow: 0 20px 60px rgba(0,0,0,0.25);
+    }
+    .modal h3 { margin: 0 0 6px; font-size: 18px; }
+    .modal .hint { color: var(--muted); font-size: 12.5px; margin: 0 0 16px; }
+    .modal .footer { display: flex; gap: 8px; justify-content: flex-end; margin-top: 16px; }
+    .close-x { float: right; cursor: pointer; color: var(--muted); font-size: 18px; }
+    /* ========== 下拉菜单 ========== */
+    .dropdown { position: relative; }
+    .dropdown-menu {
+      position: absolute;
+      bottom: 100%;
+      left: 0;
+      margin-bottom: 6px;
+      background: var(--card);
+      border: 1px solid var(--border);
+      border-radius: 12px;
+      box-shadow: 0 10px 30px rgba(0,0,0,0.12);
+      min-width: 180px;
+      display: none;
+      z-index: 55;
+      padding: 6px 0;
+    }
+    .dropdown-menu.show { display: block; }
+    .dropdown-item { padding: 9px 14px; font-size: 13px; color: var(--ink-2); cursor: pointer; display: flex; align-items: center; gap: 8px; }
+    .dropdown-item:hover { background: var(--bg); }
+    .dropdown-divider { height: 1px; background: var(--line); margin: 6px 0; }
+    /* ========== 权限窗口 ========== */
+    .perm-section { margin-bottom: 14px; }
+    .perm-title { font-size: 13px; font-weight: 600; margin-bottom: 8px; }
+    .perm-row { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; font-size: 13px; }
+    .perm-row input[type="checkbox"] { width: auto; margin: 0; }
+    .perm-row label { margin: 0; color: var(--ink-2); }
+    /* ========== 智能体选择 ========== */
+    .agent-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
+    .agent-card { border: 1px solid var(--border); border-radius: 12px; padding: 14px; text-align: center; cursor: pointer; }
+    .agent-card:hover, .agent-card.selected { border-color: var(--brand); background: var(--brand-soft); }
+    .agent-card .icon { font-size: 24px; }
+    .agent-card .title { font-size: 13px; font-weight: 600; margin-top: 6px; }
+    /* ========== 大模型管理 ========== */
+    .model-list { display: flex; flex-direction: column; gap: 8px; margin-bottom: 14px; max-height: 200px; overflow-y: auto; }
+    .model-item {
+      border: 1px solid var(--border);
+      border-radius: 10px;
+      padding: 10px 12px;
+      display: flex;
+      align-items: center;
+      gap: 10px;
+      background: var(--bg);
+    }
+    .model-item .mi-name { font-weight: 600; color: var(--ink); font-size: 13px; }
+    .model-item .mi-base { font-size: 11px; color: var(--muted); word-break: break-all; }
+    .model-item .mi-default { font-size: 11px; color: var(--ok); border: 1px solid #bbf7d0; background: #f0fdf4; border-radius: 6px; padding: 1px 6px; }
+    .model-item .mi-actions { margin-left: auto; display: flex; gap: 6px; }
+    .model-item .mi-actions button {
+      border: 1px solid var(--border);
+      background: var(--card);
+      color: var(--ink-2);
+      border-radius: 6px;
+      padding: 4px 8px;
+      cursor: pointer;
+      font-size: 12px;
+    }
+    .model-item .mi-actions button:hover { background: var(--brand-soft); }
+    .model-item .mi-actions button.danger { color: var(--err); }
+    .model-form { border-top: 1px solid var(--line); padding-top: 14px; }
+    .form-row { display: flex; gap: 10px; }
+    .form-row .form-field { flex: 1; }
+    .form-field { margin-bottom: 10px; }
+    .form-field label { font-size: 12px; color: var(--muted); display: block; margin-bottom: 5px; }
+    .form-field input {
+      width: 100%;
+      padding: 8px 10px;
+      border: 1px solid var(--border);
+      border-radius: 8px;
+      background: var(--card);
+      color: var(--ink);
+      font-size: 13px;
+      box-sizing: border-box;
+      margin: 0;
+    }
+    .form-actions { display: flex; align-items: center; gap: 10px; margin-top: 4px; }
+    .model-form-msg { font-size: 12px; color: var(--ok); }
+    .model-form-msg.err { color: var(--err); }
+    .primary { background: var(--brand); color: #fff; border: none; border-radius: 8px; padding: 8px 16px; cursor: pointer; font-size: 13px; font-weight: 600; }
+    .ghost { background: var(--card); color: var(--ink-2); border: 1px solid var(--border); border-radius: 8px; padding: 8px 16px; cursor: pointer; font-size: 13px; }
+    .primary.sm, .ghost.sm { padding: 5px 12px; font-size: 12px; }
+    /* ========== 设置面板 ========== */
+    .settings-layout { display: flex; gap: 0; min-height: 360px; }
+    .settings-nav { flex: 0 0 130px; border-right: 1px solid var(--line); padding-right: 8px; }
+    .settings-cat { padding: 9px 10px; border-radius: 8px; cursor: pointer; font-size: 13px; color: var(--ink-2); }
+    .settings-cat:hover { background: var(--bg); }
+    .settings-cat.active { background: var(--brand-soft); color: var(--brand); font-weight: 600; }
+    .settings-body { flex: 1; padding: 4px 4px 4px 16px; overflow-y: auto; }
+    .settings-item {
+      display: flex;
+      align-items: center;
+      gap: 12px;
+      padding: 12px;
+      border: 1px solid var(--border);
+      border-radius: 10px;
+      margin-bottom: 10px;
+      cursor: pointer;
+      background: var(--card);
+    }
+    .settings-item:hover { background: var(--brand-soft); }
+    .settings-item .si-icon { font-size: 18px; }
+    .settings-item .si-main { flex: 1; }
+    .settings-item .si-title { font-weight: 600; font-size: 13.5px; color: var(--ink); }
+    .settings-item .si-desc { font-size: 12px; color: var(--muted); }
+    .settings-item .si-arrow { color: var(--muted); }
+    /* ========== 底部上拉菜单 ========== */
+    .bottom-sheet-mask {
+      position: fixed;
+      inset: 0;
+      background: rgba(15,23,42,0.35);
+      z-index: 70;
+      display: none;
+      flex-direction: column;
+      justify-content: flex-end;
+    }
+    .bottom-sheet-mask.show { display: flex; }
+    .bottom-sheet {
+      background: var(--card);
+      border-radius: 20px 20px 0 0;
+      max-height: 80vh;
+      overflow-y: auto;
+      padding: 16px 0;
+      box-shadow: 0 -10px 40px rgba(0,0,0,0.15);
+      transform: translateY(100%);
+      transition: transform 0.25s ease;
+    }
+    .bottom-sheet-mask.show .bottom-sheet { transform: translateY(0); }
+    .sheet-header { padding: 8px 20px 16px; display: flex; align-items: center; gap: 12px; border-bottom: 1px solid var(--line); margin-bottom: 6px; }
+    .sheet-item { padding: 12px 20px; display: flex; align-items: center; gap: 12px; cursor: pointer; font-size: 14px; color: var(--ink-2); }
+    .sheet-item:hover { background: var(--bg); }
+    .sheet-item .icon { width: 22px; text-align: center; }
+    .sheet-item .right { margin-left: auto; font-size: 12px; color: var(--muted); }
+    /* ========== 工作区 ========== */
+    .workspace-box { border: 1px solid var(--border); border-radius: 10px; padding: 10px; background: var(--bg); }
+    .workspace-cwd { font-size: 12px; color: var(--ink-2); word-break: break-all; margin-bottom: 8px; }
+    .workspace-input { display: flex; gap: 6px; }
+    .workspace-input input { flex: 1; margin: 0; font-size: 12px; padding: 6px 8px; }
+    .workspace-input button { padding: 6px 10px; font-size: 12px; }
+    .file-tree { margin-top: 8px; display: flex; flex-direction: column; gap: 2px; max-height: 220px; overflow-y: auto; }
+    .file-item { padding: 5px 8px; border-radius: 6px; cursor: pointer; font-size: 12px; display: flex; align-items: center; gap: 6px; color: var(--ink-2); }
+    .file-item:hover { background: var(--brand-soft); }
+    .file-item.dir { font-weight: 500; }
+    .file-item.drive-switcher { flex-direction: column; align-items: flex-start; padding: 8px; background: var(--bg); border: 1px dashed var(--border); }
+    .drive-option { padding: 3px 10px; margin-top: 4px; border-radius: 4px; font-size: 11px; cursor: pointer; color: var(--ink-2); }
+    .drive-option:hover { background: var(--brand-soft); color: var(--brand); }
+    /* ========== 文件芯片 ========== */
+    .file-chip { display: inline-flex; align-items: center; gap: 6px; background: var(--brand-soft); color: var(--brand); padding: 4px 8px; border-radius: 6px; font-size: 12px; cursor: pointer; }
+    .file-chip:hover { opacity: 0.85; }
+    /* ========== 截图遮罩 ========== */
+    .crop-overlay { position: fixed; inset: 0; z-index: 9999; background: rgba(0,0,0,0.35); cursor: crosshair; }
+    .crop-tip { position: fixed; top: 16px; left: 50%; transform: translateX(-50%); background: rgba(0,0,0,0.7); color: #fff; padding: 6px 14px; border-radius: 20px; font-size: 13px; pointer-events: none; }
+    .crop-selection { position: fixed; border: 2px dashed #fff; background: rgba(255,255,255,0.12); box-shadow: 0 0 0 9999px rgba(0,0,0,0.25); pointer-events: none; }
+    /* ========== Toast ========== */
+    .toast {
+      position: fixed;
+      bottom: 24px;
+      left: 50%;
+      transform: translateX(-50%);
+      background: #1f2933;
+      color: #fff;
+      padding: 10px 18px;
+      border-radius: 10px;
+      font-size: 13px;
+      z-index: 80;
+      opacity: 0;
+      transition: 0.25s;
+      pointer-events: none;
+    }
+    .toast.show { opacity: 1; }
+    /* ========== 隐藏文件输入 ========== */
+    input[type="file"] { display: none; }
+    /* ========== 记忆系统 ========== */
+    .stat-card { text-align: center; padding: 16px; }
+    .stat-label { font-size: 12px; color: var(--muted); margin-bottom: 8px; }
+    .stat-value { font-size: 24px; font-weight: 700; color: var(--brand); }
+    .stat-date { font-size: 13px; color: var(--ink-2); font-weight: 400; }
+    .memory-content { max-height: 60vh; overflow-y: auto; white-space: pre-wrap; font-family: "SF Mono", Monaco, monospace; font-size: 12.5px; line-height: 1.7; }
+    .memory-content h1, .memory-content h2, .memory-content h3 { color: var(--brand); margin-top: 0; }
+    .memory-content pre { background: var(--bg); padding: 12px; border-radius: 8px; overflow-x: auto; }
+    .memory-content code { background: var(--bg); padding: 2px 6px; border-radius: 4px; font-size: 12px; }
+  </style>
+</head>
+<body>
+  <div id="loginOverlay">
+    <div class="login-card">
+      <h2>飞虹 Code 控制台</h2>
+      <p>请输入手机号码直接登录</p>
+      <label for="loginPhone">手机号码</label>
+      <input type="text" id="loginPhone" autocomplete="off" placeholder="如 13800138000" />
+      <button id="loginBtn">手机号登录</button>
+      <div class="login-status" id="loginStatus"></div>
+    </div>
+  </div>
+  <div class="app-layout" id="appLayout">
+    <!-- 顶部导航栏 -->
+    <header class="topbar">
+      <div class="topbar-brand">
+        <div class="logo">🦞</div>
+        <span>飞虹 Code</span>
+      </div>
+      <nav class="topbar-nav">
+        <div class="topbar-nav-item active" data-nav="chat">💬 对话</div>
+        <div class="topbar-nav-item" data-nav="automations">⚡ 自动化</div>
+        <div class="topbar-nav-item" data-nav="templates">📚 模板库</div>
+        <div class="topbar-nav-item" data-nav="market">🧩 插件</div>
+        <div class="topbar-nav-item" data-nav="office">📎 办公</div>
+        <div class="topbar-nav-item" data-nav="memory">🧠 记忆</div>
+      </nav>
+      <div class="topbar-spacer"></div>
+      <div class="topbar-user" id="topbarUser">
+        <div class="topbar-avatar">🦐</div>
+        <span class="topbar-phone" id="topbarPhone">未登录</span>
+      </div>
+    </header>
+    <!-- 主体区 -->
+    <div class="main-area">
+      <!-- 左侧图标导航 -->
+      <aside class="sidebar">
+        <!-- 导航菜单 -->
+        <div class="sidebar-section">
+          <div class="sidebar-section-title">导航</div>
+          <div class="sidebar-icon active" data-nav="chat" title="对话任务">
+            <span class="icon">💬</span>
+            <span class="label">对话任务</span>
+          </div>
+          <div class="sidebar-icon" data-nav="automations" title="自动化">
+            <span class="icon">⚡</span>
+            <span class="label">自动化</span>
+          </div>
+          <div class="sidebar-icon" data-nav="templates" title="模板库">
+            <span class="icon">📚</span>
+            <span class="label">模板库</span>
+          </div>
+          <div class="sidebar-icon" data-nav="market" title="插件市场">
+            <span class="icon">🧩</span>
+            <span class="label">插件市场</span>
+          </div>
+          <div class="sidebar-icon" data-nav="office" title="办公助理">
+            <span class="icon">📎</span>
+            <span class="label">办公助理</span>
+          </div>
+          <div class="sidebar-icon" data-nav="memory" title="记忆系统">
+            <span class="icon">🧠</span>
+            <span class="label">记忆系统</span>
+          </div>
+        </div>
+        <!-- 任务列表 -->
+        <div class="sidebar-section" id="taskListSection" style="display:none;">
+          <div class="sidebar-section-title" style="display:flex;align-items:center;justify-content:space-between;">
+            <span>任务列表 <span class="badge" id="taskCountBadge" style="margin-left:4px;">0</span></span>
+            <button class="new-task-btn" id="newTaskBtn" title="新建对话任务">＋ 新建任务</button>
+          </div>
+          <div id="taskListContainer" style="max-height:300px;overflow-y:auto;">
+            <div class="empty" style="font-size:11px;padding:8px;">暂无任务</div>
+          </div>
+        </div>
+        <div class="sidebar-spacer"></div>
+        <!-- 用户和设置 -->
+        <div class="sidebar-section">
+          <div class="sidebar-icon" id="sidebarUser" title="用户菜单">
+            <span class="icon">👤</span>
+            <span class="label">用户</span>
+          </div>
+          <div class="sidebar-icon" id="sidebarSettings" title="设置">
+            <span class="icon">⚙️</span>
+            <span class="label">设置</span>
+          </div>
+        </div>
+      </aside>
+      <!-- 中间内容区 -->
+      <main class="chat-area" id="chatArea">
+        <!-- 任务上下文头部 -->
+        <div class="task-context-header" id="taskContextHeader">
+          <div class="tch-left">
+            <div class="tch-title" id="tchTitle">未选择任务</div>
+            <div class="tch-sub" id="tchSub">从左侧任务列表选择，或在下方输入指令发起新任务</div>
+          </div>
+          <div class="tch-right">
+            <button class="ghost-btn" id="tchNewTask" title="新建对话任务">＋ 新建任务</button>
+            <span class="badge" id="tchStatus">—</span>
+            <span class="tch-time" id="tchTime"></span>
+            <button class="ghost-btn" id="tchRefresh" title="刷新当前任务">⟳</button>
+          </div>
+        </div>
+        <!-- 对话视图 -->
+        <div class="conv view active" data-view="chat">
+          <div class="messages" id="messages">
+            <div class="msg sys">点击「＋ 新建任务」开启一个新任务，或直接在下方向当前任务发送消息——所有对话都会归属同一个任务运行。</div>
+          </div>
+          <div class="input-area">
+            <div class="input-bar">
+              <textarea id="goalInput" placeholder="输入指令，消息将归属当前任务持续对话；点上方「＋ 新建任务」可开启新任务（创建 → 推理 → 工具验证 → 闭环全程追踪）"></textarea>
+              <div class="input-toolbar">
+                <div class="dropdown" id="convMenuWrap">
+                  <span class="pill" id="convMenuBtn" title="更多操作">＋ 菜单</span>
+                  <div class="dropdown-menu" id="convMenu">
+                    <div class="dropdown-item" data-action="screenshot">📷 截图</div>
+                    <div class="dropdown-item" data-action="upload-file">📄 上传文件</div>
+                    <div class="dropdown-item" data-action="upload-image">🖼 上传图片</div>
+                    <div class="dropdown-item" data-action="direct-mode">🖥 直接操作电脑</div>
+                    <div class="dropdown-item" data-action="voice">🎤 语音输入</div>
+                    <div class="dropdown-divider"></div>
+                    <div class="dropdown-item" data-action="agent-type">🤖 选择智能体类型</div>
+                  </div>
+                </div>
+                <button class="pill" id="screenshotBtn" title="截图（框选屏幕区域发给 AI）">📷 截图</button>
+                <span class="pill" id="skillPill" title="当前智能体">🤖 通用助手</span>
+                <span class="pill" id="directModePill" style="display:none;" title="直接操作电脑模式已开启">🖥 直接操作电脑</span>
+                <span id="voiceBadge" class="voice-badge" style="display:none;">● 正在听…</span>
+                <span class="spacer"></span>
+                <button id="sendBtn">▶ 发送</button>
+              </div>
+            </div>
+            <div class="workspace-bar">
+              <button class="wb-select" id="workspacePickBtn" title="选择工作区文件夹">
+                <span class="wb-icon">📂</span>
+                <span class="wb-label" id="workspaceCwdBottom">加载中…</span>
+                <span class="wb-arrow">▾</span>
+              </button>
+              <div class="wb-perm" id="workspacePermBadge" title="点击配置权限">
+                <span>🛡️</span>
+                <span id="workspacePermLabel">默认权限</span>
+              </div>
+            </div>
+            <div class="call-bar">
+              <span class="call-hint">通话</span>
+              <button id="voiceCallBtn" class="call-btn">📞 语音</button>
+              <button id="videoCallBtn" class="call-btn">🎥 视频</button>
+              <button id="hangupCallBtn" class="call-btn hangup" style="display:none;">⛔ 挂断</button>
+              <span id="callStatus" class="call-status"></span>
+            </div>
+          </div>
+        </div>
+        <!-- 自动化页面 -->
+        <div class="page-view" data-view="automations">
+          <div class="page-head">
+            <div><h2>⚡ 自动化</h2><div class="sub">把常用目标存成指令，一键发起任务</div></div>
+            <button id="newAutoBtn">+ 新建指令</button>
+          </div>
+          <div class="grid" id="autoGrid"><div class="empty">还没有快捷指令</div></div>
+        </div>
+        <!-- 模板库页面 -->
+        <div class="page-view" data-view="templates">
+          <div class="page-head">
+            <div><h2>📚 模板库</h2><div class="sub">点击模板即可填充到输入框</div></div>
+            <button id="newTplBtn">+ 保存当前为模板</button>
+          </div>
+          <div class="section-title">内置模板</div>
+          <div class="grid" id="builtinGrid"></div>
+          <div class="section-title" style="margin-top:20px;">我的模板</div>
+          <div class="grid" id="userTplGrid"><div class="empty">暂无自定义模板</div></div>
+        </div>
+        <!-- 插件市场页面 -->
+        <div class="page-view" data-view="market">
+          <div class="page-head">
+            <div><h2>🧩 插件市场</h2><div class="sub">聚合 ClawHub 与 Agent-Foundry 技能生态</div></div>
+            <div class="row" style="flex:0 0 auto; gap:8px;">
+              <input type="text" id="marketSearch" placeholder="搜索…" style="margin:0;width:160px;" />
+              <select id="marketSource" style="margin:0;width:130px;">
+                <option value="all">全部来源</option>
+                <option value="clawhub">ClawHub</option>
+                <option value="agent-foundry">Agent-Foundry</option>
+              </select>
+              <button id="marketRefresh">刷新</button>
+            </div>
+          </div>
+          <div class="grid" id="marketGrid"><div class="empty">加载中…</div></div>
+          <div class="section-title" style="margin-top:20px;">已安装</div>
+          <div class="grid" id="installedGrid"><div class="empty">暂无已安装技能</div></div>
+        </div>
+        <!-- 办公助理页面 -->
+        <div class="page-view" data-view="office">
+          <div class="page-head">
+            <div><h2>📎 办公助理</h2><div class="sub">文档处理快捷入口，点击即生成提示词</div></div>
+          </div>
+          <div class="grid" id="officeGrid"><div class="empty">加载中…</div></div>
+        </div>
+        <!-- 记忆系统页面 -->
+        <div class="page-view" data-view="memory">
+          <div class="page-head">
+            <div><h2>🧠 记忆系统</h2><div class="sub">短期记忆每日自动整理，沉淀长期知识</div></div>
+            <div class="row">
+              <button id="memRefreshBtn" class="ghost">🔄 刷新</button>
+              <button id="memSummarizeBtn">✨ 立即总结</button>
+            </div>
+          </div>
+          <!-- 统计卡片 -->
+          <div class="memory-stats" id="memoryStats" style="display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;margin-bottom:20px;">
+            <div class="card stat-card">
+              <div class="stat-label">短期记忆天数</div>
+              <div class="stat-value" id="statShortDays">-</div>
+            </div>
+            <div class="card stat-card">
+              <div class="stat-label">长期记忆条目</div>
+              <div class="stat-value" id="statLongNotes">-</div>
+            </div>
+            <div class="card stat-card">
+              <div class="stat-label">上次总结</div>
+              <div class="stat-value stat-date" id="statLastSum">-</div>
+            </div>
+            <div class="card stat-card">
+              <div class="stat-label">下次自动总结</div>
+              <div class="stat-value stat-date" id="statNextSum">-</div>
+            </div>
+          </div>
+          <!-- Tab 切换 -->
+          <div class="memory-tabs" style="display:flex;gap:8px;margin-bottom:16px;border-bottom:1px solid var(--border);padding-bottom:8px;">
+            <button class="mem-tab active" data-memtab="short" style="padding:6px 14px;border-radius:8px;border:1px solid var(--border);background:var(--card);cursor:pointer;font-size:13px;">📅 短期记忆</button>
+            <button class="mem-tab" data-memtab="long" style="padding:6px 14px;border-radius:8px;border:1px solid var(--border);background:var(--card);cursor:pointer;font-size:13px;">💾 长期记忆</button>
+            <button class="mem-tab" data-memtab="history" style="padding:6px 14px;border-radius:8px;border:1px solid var(--border);background:var(--card);cursor:pointer;font-size:13px;">📜 总结历史</button>
+          </div>
+          <!-- 短期记忆面板 -->
+          <div class="mem-panel active" id="memShortPanel">
+            <div class="row" style="margin-bottom:16px;align-items:center;">
+              <input type="date" id="memDateInput" style="margin:0;width:160px;" />
+              <button id="memLoadDay" style="margin:0;">查看</button>
+              <span class="muted" id="memDateLabel" style="margin-left:8px;"></span>
+            </div>
+            <div class="card memory-content" id="memShortContent">
+              <div class="empty">选择日期查看短期记忆</div>
+            </div>
+          </div>
+          <!-- 长期记忆面板 -->
+          <div class="mem-panel" id="memLongPanel" style="display:none;">
+            <div class="card memory-content" id="memLongContent">
+              <div class="empty">加载中…</div>
+            </div>
+          </div>
+          <!-- 总结历史面板 -->
+          <div class="mem-panel" id="memHistoryPanel" style="display:none;">
+            <div class="card memory-content" id="memHistoryContent">
+              <div class="empty">暂无总结记录</div>
+            </div>
+          </div>
+        </div>
+        <!-- 底部工具栏 -->
+        <div class="chat-footbar" id="chatFootbar">
+          <div><strong>对话任务</strong><span class="muted"> · 提交自然语言需求，云端静默执行并回传结果</span></div>
+          <div class="row" style="flex:0 0 auto; gap:8px; align-items:center;">
+            <label class="model-label" for="modelSelect">大模型</label>
+            <select id="modelSelect" class="model-select" title="切换当前使用的大模型">
+              <option value="">默认（系统路由）</option>
+            </select>
+            <button id="modelSettingsShortcut" class="ghost-btn" title="大模型设置">🧠</button>
+          </div>
+        </div>
+      </main>
+      <!-- 右侧面板 -->
+      <aside class="right-panel" id="rightPanel">
+        <div class="right-tabs">
+          <div class="right-tab active" data-tab="detail">📦 任务详情</div>
+          <div class="right-tab" data-tab="preview">👁 产物预览</div>
+        </div>
+        <div class="right-body">
+          <div class="preview-panel active" id="detailPanel">
+            <div id="taskDetail"><div class="muted">从顶部选择一个任务查看详情。</div></div>
+          </div>
+          <div class="preview-panel" id="previewPanel">
+            <div class="preview-title" id="previewTitle">预览</div>
+            <div class="preview-content" id="previewContent"><div class="muted">点击任务或对话中的文件/代码进行预览。</div></div>
+          </div>
+        </div>
+      </aside>
+    </div>
+  </div>
+  <!-- 模态框区域 -->
+  <div class="mask" id="autoModal">
+    <div class="modal">
+      <span class="close-x" data-close="autoModal">✕</span>
+      <h3>新建快捷指令</h3>
+      <p class="hint">保存后可在「自动化」页一键发起任务。</p>
+      <label for="autoName">指令名称</label>
+      <input type="text" id="autoName" placeholder="如：每日构建检查" />
+      <label for="autoGoal">目标（提交给模型的需求）</label>
+      <textarea id="autoGoal" placeholder="运行 npm test 并汇总失败用例…"></textarea>
+      <div class="footer">
+        <button class="ghost" data-close="autoModal">取消</button>
+        <button id="autoSaveBtn">保存</button>
+      </div>
+    </div>
+  </div>
+  <div class="mask" id="tplModal">
+    <div class="modal">
+      <span class="close-x" data-close="tplModal">✕</span>
+      <h3>保存为模板</h3>
+      <label for="tplTitle">模板标题</label>
+      <input type="text" id="tplTitle" placeholder="如：SQL 优化" />
+      <label for="tplCategory">分类</label>
+      <input type="text" id="tplCategory" placeholder="自定义" />
+      <label for="tplGoal">目标内容</label>
+      <textarea id="tplGoal" placeholder="粘贴要保存的需求文本…"></textarea>
+      <div class="footer">
+        <button class="ghost" data-close="tplModal">取消</button>
+        <button id="tplSaveBtn">保存</button>
+      </div>
+    </div>
+  </div>
+  <div class="mask" id="permModal">
+    <div class="modal" style="width:480px;">
+      <span class="close-x" data-close="permModal">✕</span>
+      <h3>🔒 权限处理窗口</h3>
+      <p class="hint">配置工作期间 AI 可读范围及可操作权限。</p>
+      <div class="perm-section">
+        <div class="perm-title">可读范围</div>
+        <div class="perm-row">
+          <input type="radio" name="readScope" id="scopeWorkspace" value="workspace" checked />
+          <label for="scopeWorkspace">仅当前工作区</label>
+        </div>
+        <div class="perm-row">
+          <input type="radio" name="readScope" id="scopeSpecified" value="specified" />
+          <label for="scopeSpecified">指定目录</label>
+        </div>
+        <div class="perm-row">
+          <input type="text" id="permReadPath" placeholder="输入允许的目录路径" style="margin:0;" />
+        </div>
+        <div class="perm-row">
+          <input type="radio" name="readScope" id="scopeAll" value="all" />
+          <label for="scopeAll">全部文件</label>
+        </div>
+      </div>
+      <div class="perm-section">
+        <div class="perm-title">操作权限</div>
+        <div class="perm-row">
+          <input type="checkbox" id="permRead" checked />
+          <label for="permRead">读取文件</label>
+        </div>
+        <div class="perm-row">
+          <input type="checkbox" id="permWrite" />
+          <label for="permWrite">写入文件</label>
+        </div>
+        <div class="perm-row">
+          <input type="checkbox" id="permShell" />
+          <label for="permShell">执行命令</label>
+        </div>
+        <div class="perm-row">
+          <input type="checkbox" id="permNetwork" checked />
+          <label for="permNetwork">访问网络</label>
+        </div>
+        <div class="perm-row">
+          <input type="checkbox" id="permBrowser" />
+          <label for="permBrowser">浏览器控制</label>
+        </div>
+      </div>
+      <div class="footer">
+        <button class="ghost" data-close="permModal">取消</button>
+        <button id="permSaveBtn">保存</button>
+      </div>
+    </div>
+  </div>
+  <div class="mask" id="agentModal">
+    <div class="modal" style="width:420px;">
+      <span class="close-x" data-close="agentModal">✕</span>
+      <h3>🤖 选择智能体类型</h3>
+      <p class="hint">不同智能体会自动调整提示词与执行策略。</p>
+      <div class="agent-grid" id="agentGrid"></div>
+      <div class="footer">
+        <button class="ghost" data-close="agentModal">取消</button>
+      </div>
+    </div>
+  </div>
+  <div class="crop-overlay" id="cropOverlay" style="display:none;">
+    <div class="crop-tip" id="cropTip">按住鼠标拖拽选择截图区域 · 松开确认 · ESC 取消</div>
+    <div class="crop-selection" id="cropSelection"></div>
+    <video id="cropVideo" style="display:none;"></video>
+  </div>
+  <div class="mask" id="folderPickerModal">
+    <div class="modal" style="width:520px;">
+      <span class="close-x" data-close="folderPickerModal">✕</span>
+      <h3>📂 选择工作区文件夹</h3>
+      <div class="fp-path" id="fpPath" style="font-size:12px;color:var(--ink-2);word-break:break-all;padding:8px;background:var(--bg);border-radius:8px;">—</div>
+      <div class="file-tree" id="fpTree" style="max-height:280px;overflow:auto;margin:10px 0;"></div>
+      <div class="footer">
+        <button class="ghost" id="fpCancel" data-close="folderPickerModal">取消</button>
+        <button class="primary" id="fpConfirm">选择此文件夹</button>
+      </div>
+    </div>
+  </div>
+  <div class="mask" id="modelModal">
+    <div class="modal" style="width:520px;">
+      <span class="close-x" data-close="modelModal">✕</span>
+      <h3>🧠 大模型设置</h3>
+      <p class="hint">配置自定义大模型，可保存多个并在对话中随时切换。勾选「默认」的项将作为对话默认模型。</p>
+      <div class="model-list" id="modelList"></div>
+      <div class="model-form">
+        <div class="form-row">
+          <div class="form-field">
+            <label>模型名称 *</label>
+            <input type="text" id="modelName" placeholder="如 GPT-4o / 通义千问 / 自建模型" />
+          </div>
+          <div class="form-field">
+            <label>API 地址</label>
+            <input type="text" id="modelApiBase" placeholder="https://api.openai.com/v1" />
+          </div>
+        </div>
+        <div class="form-field">
+          <label>密钥（API Key）</label>
+          <input type="password" id="modelApiKey" placeholder="sk-..." autocomplete="off" />
+        </div>
+        <div class="form-field">
+          <label>推理过程运行内容（中间环节）</label>
+          <textarea id="modelReasoning" rows="3" placeholder="配置该模型在中间推理环节的运行内容，例如：先列出需求拆解，再给出实现方案，最后输出代码。"></textarea>
+        </div>
+        <div class="form-actions">
+          <button id="modelSaveBtn" class="primary">保存配置</button>
+          <button id="modelResetBtn" class="ghost">清空表单</button>
+          <span id="modelFormMsg" class="model-form-msg"></span>
+        </div>
+      </div>
+      <div class="footer">
+        <button class="ghost" data-close="modelModal">关闭</button>
+      </div>
+    </div>
+  </div>
+  <div class="mask" id="newTaskModal">
+    <div class="modal" style="width:560px;">
+      <span class="close-x" data-close="newTaskModal">✕</span>
+      <h3>＋ 新建对话任务</h3>
+      <p class="hint">创建一个全新任务，中部对话栏的所有消息都将归属该任务运行（支持多轮连续对话）。</p>
+      <div class="nt-form">
+        <label class="nt-label">任务描述 <span style="color:var(--err)">*</span></label>
+        <textarea id="ntGoal" rows="5" placeholder="例如：请读取当前工作区 package.json，告诉我其中的 name 与 version 字段"></textarea>
+        <div class="nt-row">
+          <div>
+            <label class="nt-label">智能体类型</label>
+            <select id="ntAgentType"></select>
+          </div>
+          <div>
+            <label class="nt-label">工作区</label>
+            <select id="ntWorkspaceDir"></select>
+          </div>
+        </div>
+        <div class="nt-hint">工作区默认使用底部当前所选目录；若选择「默认」，则沿用服务器工作区。</div>
+      </div>
+      <div class="footer">
+        <button class="ghost" data-close="newTaskModal">取消</button>
+        <button class="primary" id="ntCreateBtn">创建任务</button>
+      </div>
+    </div>
+  </div>
+  <div class="mask" id="settingsModal">
+    <div class="modal" style="width:560px;">
+      <span class="close-x" data-close="settingsModal">✕</span>
+      <h3>⚙️ 设置</h3>
+      <div class="settings-layout">
+        <div class="settings-nav">
+          <div class="settings-cat active" data-cat="general">通用</div>
+          <div class="settings-cat" data-cat="internal">栏目配置</div>
+        </div>
+        <div class="settings-body" id="settingsBody">
+          <div class="settings-group" data-group="general">
+            <div class="settings-item" data-action="perm">
+              <span class="si-icon">🔒</span>
+              <div class="si-main"><div class="si-title">权限处理</div><div class="si-desc">配置工作期间可读范围与操作权限</div></div>
+              <span class="si-arrow">›</span>
+            </div>
+            <div class="settings-item" data-action="theme">
+              <span class="si-icon">🎨</span>
+              <div class="si-main"><div class="si-title">外观</div><div class="si-desc">切换浅色 / 深色主题</div></div>
+              <span class="si-arrow">›</span>
+            </div>
+          </div>
+          <div class="settings-group" data-group="internal" style="display:none;">
+            <div class="settings-item" data-action="model-custom" id="modelCustomItem">
+              <span class="si-icon">🧠</span>
+              <div class="si-main">
+                <div class="si-title">大模型自定义设置</div>
+                <div class="si-desc">自由添加并配置自定义大模型，提供大模型选择列表，可设为默认</div>
+              </div>
+              <span class="si-arrow">›</span>
+            </div>
+            <div class="model-manage" id="modelManage" style="display:none;">
+              <div class="mm-list" id="modelListInline"></div>
+              <div class="mm-add">
+                <div class="mm-hint">添加新大模型（名称、API 地址、密钥、推理内容）：</div>
+                <div class="model-form-inline">
+                  <input type="text" id="imName" placeholder="模型名称 *" />
+                  <input type="text" id="imBase" placeholder="API 地址" />
+                  <input type="password" id="imKey" placeholder="密钥 API Key" autocomplete="off" />
+                  <textarea id="imReasoning" rows="2" placeholder="推理过程运行内容（中间环节，可选）"></textarea>
+                  <div class="mm-actions">
+                    <button id="imSave" class="primary sm">保存配置</button>
+                    <button id="imReset" class="ghost sm">清空</button>
+                    <span id="imMsg" class="model-form-msg"></span>
+                  </div>
+                </div>
+              </div>
+              <div class="mm-foot">
+                <button class="ghost sm" id="modelManageClose">收起</button>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="footer">
+        <button class="ghost" data-close="settingsModal">关闭</button>
+      </div>
+    </div>
+  </div>
+  <div class="bottom-sheet-mask" id="userMenuMask">
+    <div class="bottom-sheet" id="userMenu">
+      <div class="sheet-header">
+        <div class="topbar-avatar" style="width:40px;height:40px;border-radius:50%;background:var(--brand-soft);display:flex;align-items:center;justify-content:center;font-size:20px;">🦐</div>
+        <div>
+          <div class="topbar-phone" id="sheetPhone">未登录</div>
+          <div class="muted">免费版</div>
+        </div>
+      </div>
+      <div class="sheet-item" data-action="version"><span class="icon">🎖</span>体验版<span class="right">当前</span></div>
+      <div class="sheet-item" data-action="buddy"><span class="icon">⛽</span>Buddy 加油站</div>
+      <div class="sheet-item" data-action="invite"><span class="icon">👥</span>去邀约<span class="right">最高得会员</span></div>
+      <div class="sheet-item" data-action="points"><span class="icon">💎</span>积分余额</div>
+      <div class="sheet-item" data-action="growth"><span class="icon">🌱</span>成长计划<span class="right">连登有奖</span></div>
+      <div class="sheet-item" data-action="settings"><span class="icon">⚙️</span>设置</div>
+      <div class="sheet-item" data-action="theme"><span class="icon">🎨</span>外观</div>
+      <div class="sheet-item" data-action="help"><span class="icon">❓</span>帮助与反馈</div>
+      <div class="sheet-item" data-action="update"><span class="icon">🔄</span>检查更新</div>
+      <div class="sheet-item" data-action="logout"><span class="icon">↩️</span>退出登录</div>
+    </div>
+  </div>
+  <input type="file" id="fileInput" />
+  <input type="file" id="imageInput" accept="image/*" />
+  <div class="toast" id="toast"></div>
+  <script>
+    const AGENT_TYPES = {
+      general: { label: '通用助手', icon: '🤖' },
+      'fix-code': { label: '修复代码', icon: '🐛' },
+      'write-code': { label: '编写代码', icon: '✍️' },
+      'exec-command': { label: '执行命令', icon: '⚡' },
+    };
+    const state = {
+      token: '',
+      phone: '',
+      tasks: [],
+      currentTaskId: null,
+      submittedTaskIds: new Set(),
+      completedTaskIds: new Set(),
+      pinnedTasks: new Set(), // 置顶任务ID集合
+      market: [],
+      installed: new Set(),
+      agentType: 'general',
+      directMode: false,
+      permissions: {
+        readScope: 'workspace',
+        readPath: '',
+        allowRead: true,
+        allowWrite: false,
+        allowShell: false,
+        allowNetwork: true,
+        allowBrowser: false,
+      },
+      workspaceDir: '',
+      rightTab: 'detail',
+      models: [],
+      defaultModelId: null,
+      modelId: '',
+    };
+    (function initSession() {
+      const urlToken = new URLSearchParams(location.search).get('token');
+      if (urlToken) localStorage.setItem('fhcode.token', urlToken);
+      const savedModel = localStorage.getItem('fhcode.model');
+      if (savedModel !== null) state.modelId = savedModel;
+      state.token = localStorage.getItem('fhcode.token') || '';
+      state.phone = localStorage.getItem('fhcode.phone') || '';
+      try {
+        const p = JSON.parse(localStorage.getItem('fhcode.permissions') || '{}');
+        if (p) Object.assign(state.permissions, p);
+      } catch {}
+    })();
+    function authHeaders() {
+      return state.token ? { 'Authorization': 'Bearer ' + state.token, 'Content-Type': 'application/json' } : { 'Content-Type': 'application/json' };
+    }
+    async function api(path, method = 'GET', body) {
+      const res = await fetch(path, { method, headers: authHeaders(), body: body ? JSON.stringify(body) : undefined });
+      if (!res.ok) {
+        const d = await res.json().catch(() => ({}));
+        // 401 时自动清除无效 token，跳转到登录
+        if (res.status === 401 && d.error === 'unauthorized') {
+          console.warn('[api] token 已失效，清除并跳转登录');
+          localStorage.removeItem('fhcode.token');
+          state.token = '';
+          document.getElementById('loginOverlay').style.display = 'flex';
+          throw new Error('登录已过期，请重新登录');
+        }
+        throw new Error(d.error || ('HTTP ' + res.status));
+      }
+      return res.json();
+    }
+    function escapeHtml(s) { return String(s ?? '').replace(/[&<>"']/g, (c) => ({ '&': '&amp;', '<': '&lt;', '>': '&gt;', '"': '&quot;', "'": '&#39;' }[c])); }
+    function fmtTime(iso) { try { return new Date(iso).toLocaleString(); } catch { return iso || ''; } }
+    function toast(msg) {
+      const el = document.getElementById('toast');
+      el.textContent = msg; el.classList.add('show');
+      clearTimeout(el._t); el._t = setTimeout(() => el.classList.remove('show'), 2200);
+    }
+    function openModal(id) { document.getElementById(id).classList.add('show'); }
+    function closeModal(id) { document.getElementById(id).classList.remove('show'); }
+    // 消息气泡通用操作：复制 / 编辑 / 分享 / 创建文档
+    function bubbleActions(e, content) {
+      e.stopPropagation();
+      const menu = document.getElementById('bubbleMenu');
+      if (menu) menu.remove();
+      const m = document.createElement('div');
+      m.id = 'bubbleMenu';
+      m.style.cssText = 'position:fixed;z-index:10001;background:var(--card);border:1px solid var(--border);border-radius:8px;box-shadow:0 4px 16px rgba(0,0,0,0.18);padding:4px 0;min-width:140px;font-size:13px;';
+      const items = [
+        { label: '📋 复制', action: 'copy' },
+        { label: '✏️ 编辑', action: 'edit' },
+        { label: '🔗 分享链接', action: 'share' },
+        { label: '📄 创建文档', action: 'doc' },
+      ];
+      items.forEach((it) => {
+        const el = document.createElement('div');
+        el.className = 'dropdown-item';
+        el.textContent = it.label;
+        el.style.cssText = 'padding:7px 16px;cursor:pointer;';
+        el.addEventListener('mouseenter', () => { el.style.background = 'var(--brand-soft)'; });
+        el.addEventListener('mouseleave', () => { el.style.background = ''; });
+        el.addEventListener('click', () => {
+          m.remove();
+          handleBubbleAction(it.action, content);
+        });
+        m.appendChild(el);
+      });
+      document.body.appendChild(m);
+      const rect = e.target.getBoundingClientRect();
+      m.style.right = (window.innerWidth - rect.right + 4) + 'px';
+      m.style.top = rect.top + 'px';
+    }
+    async function handleBubbleAction(action, content) {
+      if (action === 'copy') {
+        try { await navigator.clipboard.writeText(content); toast('已复制到剪贴板'); }
+        catch { document.execCommand('copy'); toast('已复制'); }
+      } else if (action === 'edit') {
+        const edited = prompt('编辑内容：', content);
+        if (edited != null && edited.trim()) {
+          toast('已更新（本地预览）');
+        }
+      } else if (action === 'share') {
+        const payload = btoa(unescape(encodeURIComponent(content.slice(0, 2000))));
+        const url = location.origin + location.pathname + '#share/' + payload;
+        try { await navigator.clipboard.writeText(url); toast('分享链接已复制'); }
+        catch { prompt('复制以下链接分享给他人：', url); }
+      } else if (action === 'doc') {
+        const title = prompt('文档标题（默认： fhcode-回复）：', 'fhcode-回复-' + Date.now());
+        if (!title) return;
+        const blob = new Blob([content], { type: 'text/markdown;charset=utf-8' });
+        const a = document.createElement('a');
+        a.href = URL.createObjectURL(blob);
+        a.download = title.replace(/[^\u4e00-\u9fa5a-zA-Z0-9_\-]/g, '_') + '.md';
+        a.click();
+        URL.revokeObjectURL(a.href);
+        toast('文档已下载');
+      }
+    }
+    /* ========== 登录 ========== */
+    async function doLogin() {
+      const input = document.getElementById('loginPhone');
+      const status = document.getElementById('loginStatus');
+      const btn = document.getElementById('loginBtn');
+      const phone = (input.value || '').trim();
+      if (!/^\d{6,20}$/.test(phone)) { status.textContent = '请输入有效的手机号码'; status.classList.add('err'); return; }
+      btn.disabled = true;
+      status.textContent = '登录中…';
+      status.classList.remove('err');
+      try {
+        const d = await api('/api/auth/login', 'POST', { phone });
+        if (!d || !d.token) throw new Error('服务端未返回令牌');
+        state.token = d.token;
+        state.phone = d.phone || phone;
+        localStorage.setItem('fhcode.token', state.token);
+        localStorage.setItem('fhcode.phone', state.phone);
+        status.classList.remove('err');
+        document.getElementById('loginOverlay').style.display = 'none';
+        document.getElementById('appLayout').classList.add('show');
+        await afterLogin();
+      } catch (e) {
+        status.textContent = '登录失败：' + e.message;
+        status.classList.add('err');
+      } finally {
+        btn.disabled = false;
+      }
+    }
+    document.getElementById('loginBtn').addEventListener('click', doLogin);
+    document.getElementById('loginPhone').addEventListener('keydown', (e) => { if (e.key === 'Enter') doLogin(); });
+    async function afterLogin() {
+      updateUserBar();
+      await Promise.allSettled([loadTasks(), loadAutomations(), loadTemplates(), loadMarket(), loadOffice(), loadWorkspace(), loadModels(), loadMemoryStats()]);
+      startRefresh();
+    }
+    function updateUserBar() {
+      document.getElementById('topbarPhone').textContent = state.phone || '未登录';
+      document.getElementById('sheetPhone').textContent = state.phone || '未登录';
+      const a = AGENT_TYPES[state.agentType];
+      document.getElementById('skillPill').textContent = (a?.icon || '🤖') + ' ' + (a?.label || '通用助手');
+    }
+    /* ========== 导航切换 ========== */
+    function switchView(nav) {
+      document.querySelectorAll('.topbar-nav-item').forEach((n) => n.classList.toggle('active', n.getAttribute('data-nav') === nav));
+      document.querySelectorAll('.sidebar-icon').forEach((n) => n.classList.toggle('active', n.getAttribute('data-nav') === nav));
+      document.querySelectorAll('.view, .page-view').forEach((v) => v.classList.toggle('active', v.getAttribute('data-view') === nav));
+      // 切换时显示/隐藏底部工具栏（任务上下文头部始终可见）
+      const isChat = nav === 'chat';
+      document.getElementById('chatFootbar').style.display = isChat ? 'flex' : 'none';
+    }
+    document.querySelectorAll('.topbar-nav-item').forEach((el) => {
+      el.addEventListener('click', () => switchView(el.getAttribute('data-nav')));
+    });
+    document.querySelectorAll('.sidebar-icon[data-nav]').forEach((el) => {
+      el.addEventListener('click', () => switchView(el.getAttribute('data-nav')));
+    });
+    /* ========== 用户菜单 ========== */
+    const userMenuMask = document.getElementById('userMenuMask');
+    document.getElementById('topbarUser').addEventListener('click', () => userMenuMask.classList.add('show'));
+    document.getElementById('sidebarUser').addEventListener('click', () => userMenuMask.classList.add('show'));
+    userMenuMask.addEventListener('click', (e) => { if (e.target === userMenuMask) userMenuMask.classList.remove('show'); });
+    document.querySelectorAll('#userMenu .sheet-item').forEach((el) => {
+      el.addEventListener('click', () => {
+        const action = el.getAttribute('data-action');
+        userMenuMask.classList.remove('show');
+        switch (action) {
+          case 'settings': openModal('settingsModal'); break;
+          case 'models': openModels(); break;
+          case 'theme': toggleTheme(); break;
+          case 'help': openBrowser('https://github.com/wch887292/feihong-code/issues'); break;
+          case 'buddy': openBrowser('https://www.klai.top'); break;
+          case 'invite': toast('邀请链接已复制（演示）'); break;
+          case 'points': toast('积分余额：0（演示）'); break;
+          case 'growth': toast('连续登录 1 天（演示）'); break;
+          case 'version': toast('当前为体验版'); break;
+          case 'update': checkUpdate(); break;
+          case 'logout':
+            localStorage.removeItem('fhcode.token');
+            localStorage.removeItem('fhcode.phone');
+            location.reload();
+            break;
+        }
+      });
+    });
+    document.getElementById('sidebarSettings').addEventListener('click', () => {
+      userMenuMask.classList.remove('show');
+      openModal('settingsModal');
+    });
+    function openBrowser(url) {
+      api('/api/open/browser', 'POST', { url }).then(() => toast('已在系统浏览器打开')).catch((e) => toast('打开失败：' + e.message));
+    }
+    async function checkUpdate() {
+      try {
+        const d = await api('/api/health');
+        toast('当前版本 ' + d.version + '，已是最新（演示）');
+      } catch (e) { toast('检查失败：' + e.message); }
+    }
+    function toggleTheme() {
+      document.documentElement.classList.toggle('dark');
+      toast('已切换外观');
+    }
+    /* ========== 任务列表与详情 ========== */
+    function statusBadge(s) { return '<span class="badge ' + s + '">' + s + '</span>'; }
+    async function loadTasks() {
+      if (!state.token) return;
+      try {
+        const d = await api('/api/tasks');
+        state.tasks = d.tasks || [];
+        renderSidebarTaskList();
+        // 首次进入自动选中最新任务（列表已按创建时间倒序）
+        if (!state.currentTaskId && state.tasks.length) {
+          state.currentTaskId = state.tasks[0].id;
+          renderSidebarTaskList();
+        }
+        if (state.currentTaskId) {
+          await refreshCurrentThread();
+        } else {
+          renderTaskThread(null);
+        }
+      }
+      catch (e) { console.warn('加载任务失败', e); }
+    }
+    async function selectTask(id) {
+      state.currentTaskId = id;
+      renderSidebarTaskList();
+      renderTaskDetail(id);
+      await refreshCurrentThread();
+      switchRightTab('detail');
+    }
+    function renderSidebarTaskList() {
+      const container = document.getElementById('taskListContainer');
+      const section = document.getElementById('taskListSection');
+      const badge = document.getElementById('taskCountBadge');
+      if (!container || !section) return;
+      // 置顶任务排在前面，其余按时间倒序
+      const sortedTasks = [...state.tasks].sort((a, b) => {
+        if (state.pinnedTasks.has(a.id) && !state.pinnedTasks.has(b.id)) return -1;
+        if (!state.pinnedTasks.has(a.id) && state.pinnedTasks.has(b.id)) return 1;
+        return new Date(b.createdAt) - new Date(a.createdAt);
+      });
+      const activeTasks = sortedTasks.filter(t => t.status === 'queued' || t.status === 'running' || t.status === 'done' || t.status === 'failed');
+      if (activeTasks.length === 0) {
+        section.style.display = 'none';
+        return;
+      }
+      section.style.display = 'block';
+      badge.textContent = activeTasks.length;
+      let html = '';
+      activeTasks.slice(0, 15).forEach(t => {
+        const icon = t.status === 'running' ? '⏳' : t.status === 'queued' ? '📥' : t.error ? '❌' : '✅';
+        const title = t.goal.slice(0, 18) + (t.goal.length > 18 ? '…' : '');
+        const isPinned = state.pinnedTasks.has(t.id);
+        const activeClass = state.currentTaskId === t.id ? 'active' : '';
+        html += `<div class="task-item ${activeClass}" data-task-id="${t.id}" data-pinned="${isPinned}">
+          <span class="task-icon">${icon}</span>
+          <span class="task-title">${title}</span>
+          ${isPinned ? '<span class="task-pinned">📌</span>' : ''}
+          <div class="task-actions">
+            <button class="pin-btn" data-id="${t.id}" data-pinned="${isPinned}" title="${isPinned ? '取消置顶' : '置顶'}">${isPinned ? '📌' : '📍'}</button>
+            ${t.status === 'done' || t.status === 'failed' ? '<button class="delete-btn" data-id="' + t.id + '" title="删除任务">🗑️</button>' : ''}
+          </div>
+        </div>`;
+      });
+      container.innerHTML = html;
+      // 绑定点击事件
+      container.querySelectorAll('.task-item[data-task-id]').forEach(el => {
+        el.addEventListener('click', (e) => {
+          // 如果是点击pin按钮，不切换任务
+          if (e.target.classList.contains('pin-btn')) return;
+          const id = el.getAttribute('data-task-id');
+          selectTask(id);
+        });
+        // 右键菜单 - 置顶/取消置顶
+        el.addEventListener('contextmenu', (e) => {
+          e.preventDefault();
+          const id = el.getAttribute('data-task-id');
+          togglePinTask(id);
+        });
+      });
+      // 绑定pin按钮
+      container.querySelectorAll('.pin-btn').forEach(btn => {
+        btn.addEventListener('click', (e) => {
+          e.stopPropagation();
+          const id = btn.getAttribute('data-id');
+          togglePinTask(id);
+        });
+      });
+      // 绑定删除按钮
+      container.querySelectorAll('.delete-btn').forEach(btn => {
+        btn.addEventListener('click', (e) => {
+          e.stopPropagation();
+          const id = btn.getAttribute('data-id');
+          deleteTask(id);
+        });
+      });
+    }
+    // 切换置顶状态
+    function togglePinTask(taskId) {
+      if (state.pinnedTasks.has(taskId)) {
+        state.pinnedTasks.delete(taskId);
+        toast('已取消置顶');
+      } else {
+        state.pinnedTasks.add(taskId);
+        toast('已置顶');
+      }
+      renderSidebarTaskList();
+    }
+    // 删除任务
+    async function deleteTask(taskId) {
+      if (!confirm('确定要删除这个任务吗？')) return;
+      try {
+        await api('/api/tasks/' + taskId, 'DELETE');
+        toast('任务已删除');
+        renderSidebarTaskList();
+      } catch (e) {
+        toast('删除失败：' + e.message);
+      }
+    }
+    function renderTaskDetail(id) {
+      const t = state.tasks.find((x) => x.id === id);
+      const box = document.getElementById('taskDetail');
+      if (!t) { box.innerHTML = '<div class="muted">任务不存在。</div>'; return; }
+      const r = t.result;
+      let ops = '';
+      if (t.workspaceDir) {
+        ops = '<div class="detail-ops">' +
+          '<button class="secondary" data-op="browser">🌐 打开浏览器</button>' +
+          '<button class="secondary" data-op="folder" data-path="' + escapeHtml(t.workspaceDir) + '">📂 打开资源管理器</button>' +
+          '<button class="secondary" data-op="artifacts" data-path="' + escapeHtml(t.workspaceDir) + '">📑 查看产物文件</button>' +
+          '</div>';
+      }
+      const rows = [
+        ops,
+        '<div><b>目标</b><br>' + escapeHtml(t.goal) + '</div>',
+        '<div><b>状态</b> ' + statusBadge(t.status) + '</div>',
+        t.agentType ? '<div><b>智能体</b> ' + escapeHtml(AGENT_TYPES[t.agentType]?.label || t.agentType) + '</div>' : '',
+        r ? '<div><b>迭代</b> ' + r.iterations + ' · <b>成本</b> $' + r.costUsd.toFixed(6) + '</div>' : '',
+        r && r.logFile ? '<div><b>日志</b> <code>' + escapeHtml(r.logFile) + '</code></div>' : '',
+        r && r.finalAnswer ? '<div><b>结果</b><br><pre style="white-space:pre-wrap;word-break:break-word;">' + escapeHtml(r.finalAnswer) + '</pre></div>' : '',
+        t.error ? '<div style="color:var(--err)"><b>错误</b><br>' + escapeHtml(t.error) + '</div>' : '',
+      ].filter(Boolean).join('<hr style="border:none;border-top:1px solid var(--line);margin:10px 0;">');
+      box.innerHTML = rows || '<div class="muted">无详情</div>';
+      box.querySelectorAll('[data-op]').forEach((b) => b.addEventListener('click', () => handleDetailOp(t, b.getAttribute('data-op'), b.getAttribute('data-path'))));
+    }
+    async function handleDetailOp(task, op, path) {
+      if (op === 'folder') {
+        try { await api('/api/open/folder', 'POST', { path: path || task.workspaceDir }); toast('已打开资源管理器'); }
+        catch (e) { toast('打开失败：' + e.message); }
+      } else if (op === 'browser') {
+        const url = extractUrl(task.result?.finalAnswer) || 'https://www.klai.top';
+        openBrowser(url);
+      } else if (op === 'artifacts') {
+        await showArtifacts(path || task.workspaceDir);
+      } else if (op === 'preview' || op === 'code') {
+        const text = task.result?.finalAnswer || '';
+        showPreview('任务产物', linkifyArtifacts(text), 'text');
+        switchRightTab('preview');
+      }
+    }
+    /* ========== 任务思维链路渲染 ========== */
+    // 拉取当前选中任务的完整详情（含思维链路步骤）并渲染
+    async function refreshCurrentThread() {
+      if (!state.currentTaskId) { renderTaskThread(null); return; }
+      try {
+        const d = await api('/api/tasks/' + state.currentTaskId);
+        const t = d.task;
+        const idx = state.tasks.findIndex((x) => x.id === t.id);
+        if (idx >= 0) state.tasks[idx] = t; else state.tasks.push(t);
+        renderTaskThread(t);
+      } catch (e) { console.warn('刷新当前任务线程失败', e); renderTaskThread(null); }
+    }
+    function renderTaskHeader(task) {
+      const titleEl = document.getElementById('tchTitle');
+      const statusEl = document.getElementById('tchStatus');
+      const timeEl = document.getElementById('tchTime');
+      const subEl = document.getElementById('tchSub');
+      if (!task) {
+        titleEl.textContent = '未选择任务';
+        statusEl.className = 'badge'; statusEl.textContent = '—';
+        timeEl.textContent = '';
+        subEl.textContent = '从左侧任务列表选择，或在下方输入指令发起新任务';
+        return;
+      }
+      titleEl.textContent = task.goal.length > 60 ? task.goal.slice(0, 60) + '…' : task.goal;
+      statusEl.className = 'badge ' + task.status;
+      statusEl.textContent = task.status;
+      timeEl.textContent = '创建于 ' + fmtTime(task.createdAt);
+      subEl.textContent = '思维链路全程追踪 · 共 ' + (task.steps ? task.steps.length : 0) + ' 个步骤';
+    }
+    // 将单个任务的思维链路渲染为对话流：创建时间 → 逐步推理 → 工具验证 → 最终回复
+    function renderTaskThread(task) {
+      const box = document.getElementById('messages');
+      const nearBottom = box.scrollHeight - box.scrollTop - box.clientHeight < 80;
+      renderTaskHeader(task);
+      if (!task) {
+        box.innerHTML = '<div class="msg sys">从左侧任务列表选择任务，或在下方输入指令发起新任务。中部仅展示当前选中任务的完整思维链路（创建时间、逐步推理、工具验证、最终回复）。</div>';
+        return;
+      }
+      const steps = task.steps || [];
+      let html = '';
+      // 对话流：该任务下所有多轮对话气泡（user 提问 / assistant 回复）
+      const conv = Array.isArray(task.conversation) ? task.conversation : [];
+      const convVisible = conv.filter((m) => m && (m.role === 'user' || m.role === 'assistant') && (m.content || '').trim());
+      if (convVisible.length) {
+        html += '<div class="conv-divider">🗨 对话流</div>';
+        for (const m of convVisible) {
+          if (m.role === 'user') html += '<div class="msg user">' + linkifyArtifacts(m.content) + '</div>';
+          else html += '<div class="msg assistant">' + linkifyArtifacts(m.content) + '</div>';
+        }
+      }
+      html += '<div class="conv-divider">🧠 思维链路</div>';
+      html += '<div class="step created">📌 <b>任务创建</b> · ' + escapeHtml(fmtTime(task.createdAt)) + ' · 状态 <b>' + escapeHtml(task.status) + '</b></div>';
+      for (const step of steps) {
+        const d = step.data || {};
+        if (step.type === 'model.response') {
+          const content = (d.content || '').toString();
+          const toolCalls = Array.isArray(d.toolCalls) ? d.toolCalls : [];
+          let inner = '<div class="reasoning-head">🧠 模型推理 · ' + escapeHtml(d.model || '') + '</div>';
+          if (content) inner += escapeHtml(content);
+          if (toolCalls.length) inner += '<div class="muted" style="margin-top:6px;">↳ 计划调用工具：' + toolCalls.map((t) => '<code>' + escapeHtml(t) + '</code>').join('、') + '</div>';
+          html += '<div class="step reasoning">' + inner + '</div>';
+        } else if (step.type === 'tool.call') {
+          const args = d.args ? JSON.stringify(d.args, null, 2) : '';
+          html += '<div class="step toolcall"><div class="tc-name">🔧 调用 ' + escapeHtml(d.name || '') + '</div>' + (args ? '<div class="tc-args">' + escapeHtml(args) + '</div>' : '') + '</div>';
+        } else if (step.type === 'tool.result') {
+          const ok = !!d.ok;
+          const out = (d.output || '').toString();
+          html += '<div class="step result ' + (ok ? 'ok' : 'fail') + '"><div class="res-head">' + (ok ? '✅' : '❌') + ' ' + escapeHtml(d.name || '') + ' ' + (ok ? '验证通过' : '验证失败') + '</div>' + (out ? '<div class="res-out">' + escapeHtml(out) + '</div>' : '') + '</div>';
+        } else if (step.type === 'self-heal') {
+          html += '<div class="step note">🩹 进入自愈：检测到 <b>' + escapeHtml(d.category || '') + '</b> 类错误，已注入反思重试（第 ' + (d.iteration != null ? d.iteration : '?') + ' 轮）</div>';
+        } else if (step.type === 'context.compact') {
+          html += '<div class="step note">📦 上下文压缩：从 ' + (d.originalLength != null ? d.originalLength : '?') + ' 条压缩至 ' + (d.compressedLength != null ? d.compressedLength : '?') + ' 条，保留首条目标与近期对话</div>';
+        }
+      }
+      // 终态：最终回复 / 失败
+      if (task.status === 'done') {
+        if (task.result && task.result.finalAnswer) {
+          const answerId = 'final-' + task.runId;
+          html += '<div class="step final" id="' + answerId + '">'
+            + '<div class="final-head">📬 最终回复</div>'
+            + '<div style="margin-top:8px;text-align:right;">'
+            + '<button onclick="bubbleActions(event, ' + JS.stringify(task.result.finalAnswer).replace(/'/g, "\\'") + ')" style="background:rgba(255,255,255,0.2);border:none;color:#fff;border-radius:6px;padding:3px 8px;font-size:11px;cursor:pointer;">⚙️ 操作</button>'
+            + '</div>'
+            + '<div style="margin-top:4px;">' + escapeHtml(task.result.finalAnswer) + '</div>'
+            + '</div>';
+        }
+      } else if (task.status === 'failed') {
+        if (task.result && task.result.finalAnswer) html += '<div class="step final"><div class="final-head">📬 部分回复</div>' + escapeHtml(task.result.finalAnswer) + '</div>';
+        html += '<div class="step error"><div class="final-head">⛔ 任务失败</div>' + escapeHtml(task.error || '未知错误') + '</div>';
+      } else if (task.status === 'running') {
+        html += '<div class="step note">⏳ 任务进行中，思维链路实时刷新…</div>';
+      } else if (task.status === 'queued') {
+        html += '<div class="step note">📥 任务已入队，等待执行…</div>';
+      }
+      box.innerHTML = html;
+      if (nearBottom) box.scrollTop = box.scrollHeight;
+    }
+    async function showArtifacts(dir) {
+      try {
+        const d = await api('/api/workspace/list?path=' + encodeURIComponent(dir));
+        const files = (d.entries || []).filter((e) => e.type !== 'dir');
+        const box = document.getElementById('taskDetail');
+        const listHtml = files.length
+          ? files.map((f) => '<div class="artifact-file" data-path="' + escapeHtml(f.path) + '">📄 ' + escapeHtml(f.name) + '</div>').join('')
+          : '<div class="muted">该目录暂无文件产物。</div>';
+        const hint = '<div class="muted" style="margin-bottom:8px;">产物文件（来自：' + escapeHtml(dir) + '），点击在右侧预览：</div>';
+        const cur = box.innerHTML;
+        box.innerHTML = cur + '<hr style="border:none;border-top:1px solid var(--line);margin:10px 0;">' + hint + '<div class="artifact-list">' + listHtml + '</div>';
+        box.querySelectorAll('.artifact-file').forEach((el) => el.addEventListener('click', () => {
+          previewFile(el.getAttribute('data-path'));
+          toast('已打开：' + el.getAttribute('data-path'));
+        }));
+        switchRightTab('detail');
+      } catch (e) { toast('读取产物失败：' + e.message); }
+    }
+    /* ========== 右侧 Tab ========== */
+    document.querySelectorAll('.right-tab').forEach((tab) => {
+      tab.addEventListener('click', () => switchRightTab(tab.getAttribute('data-tab')));
+    });
+    function switchRightTab(name) {
+      state.rightTab = name;
+      document.querySelectorAll('.right-tab').forEach((t) => t.classList.toggle('active', t.getAttribute('data-tab') === name));
+      document.getElementById('detailPanel').classList.toggle('active', name === 'detail');
+      document.getElementById('previewPanel').classList.toggle('active', name === 'preview');
+    }
+    function showPreview(title, content, mode) {
+      document.getElementById('previewTitle').textContent = title;
+      const box = document.getElementById('previewContent');
+      if (mode === 'code' || mode === 'file') {
+        box.innerHTML = '<pre>' + escapeHtml(content) + '</pre>';
+      } else {
+        box.innerHTML = '<div style="white-space:pre-wrap;word-break:break-word;">' + content + '</div>';
+      }
+    }
+    /* ========== 对话与发送 ========== */
+    async function sendTask() {
+      const input = document.getElementById('goalInput');
+      let goal = input.value.trim();
+      if (!goal) return;
+      if (!state.token) { toast('请先登录'); return; }
+      if (state.directMode) goal = '[直接操作电脑] ' + goal;
+      const btn = document.getElementById('sendBtn');
+      btn.disabled = true;
+      try {
+        // 已有当前任务 → 多轮续接：消息归属同一任务生命周期
+        if (state.currentTaskId) {
+          const cur = state.tasks.find((t) => t.id === state.currentTaskId);
+          if (cur && (cur.status === 'queued' || cur.status === 'running')) {
+            toast('当前任务执行中，请等待完成后再继续对话');
+            return;
+          }
+          const d = await api('/api/tasks/' + state.currentTaskId + '/messages', 'POST', { message: goal });
+          input.value = '';
+          renderSidebarTaskList();
+          renderTaskDetail(d.task.id);
+          renderTaskThread(d.task);
+          await loadTasks();
+          toast('已发送，继续当前任务对话');
+          return;
+        }
+        const d = await api('/api/tasks', 'POST', {
+          goal,
+          agentType: state.agentType,
+          permissions: state.permissions,
+          workspaceDir: state.workspaceDir || undefined,
+          modelId: state.modelId || undefined,
+        });
+        input.value = '';
+        // 新任务即成为当前任务，中部围绕其单一生命周期可视化追踪
+        state.currentTaskId = d.task.id;
+        const taskListSection = document.getElementById('taskListSection');
+        if (taskListSection) taskListSection.style.display = 'block';
+        renderSidebarTaskList();
+        renderTaskDetail(d.task.id);
+        renderTaskThread({ id: d.task.id, goal, status: 'queued', createdAt: new Date().toISOString(), steps: [], conversation: [{ role: 'user', content: goal }] });
+        await loadTasks();
+        toast('任务已提交，开始追踪思维链路');
+      } catch (e) { toast('提交失败：' + e.message); }
+      finally { btn.disabled = false; }
+    }
+    function appendMsg(role, text, extras = {}) {
+      const box = document.getElementById('messages');
+      const el = document.createElement('div');
+      el.className = 'msg ' + role;
+      if (extras.html) el.innerHTML = extras.html;
+      else if (extras.file) {
+        el.innerHTML = '<span class="file-chip" data-path="' + escapeHtml(extras.file) + '" data-type="' + escapeHtml(extras.mime || 'file') + '">📎 ' + escapeHtml(extras.name) + '</span>';
+      } else {
+        el.innerHTML = linkifyArtifacts(text);
+      }
+      box.appendChild(el);
+      box.scrollTop = box.scrollHeight;
+      bindArtifacts(el);
+    }
+    document.getElementById('sendBtn').addEventListener('click', sendTask);
+    document.getElementById('goalInput').addEventListener('keydown', (e) => { if (e.key === 'Enter' && (e.ctrlKey || e.metaKey)) sendTask(); });
+    document.getElementById('tchRefresh').addEventListener('click', () => { refreshCurrentThread(); toast('已刷新当前任务'); });
+    document.getElementById('screenshotBtn').addEventListener('click', takeScreenshot);
+    /* ========== 输入框右键菜单 ========== */
+    const goalInput = document.getElementById('goalInput');
+    goalInput.addEventListener('contextmenu', (e) => {
+      e.preventDefault();
+      // 移除旧菜单
+      const old = document.getElementById('textCtxMenu');
+      if (old) old.remove();
+      // 创建右键菜单
+      const menu = document.createElement('div');
+      menu.id = 'textCtxMenu';
+      menu.style.cssText = 'position:fixed;z-index:10000;background:var(--card);border:1px solid var(--border);border-radius:8px;box-shadow:0 4px 12px rgba(0,0,0,0.15);padding:4px 0;min-width:160px;';
+      const items = [
+        { label: '📋 复制', action: 'copy' },
+        { label: '✂️ 剪切', action: 'cut' },
+        { label: '📌 粘贴', action: 'paste' },
+        { label: '⬛ 全选', action: 'selectall' },
+      ];
+      items.forEach((it) => {
+        const el = document.createElement('div');
+        el.className = 'dropdown-item';
+        el.textContent = it.label;
+        el.style.cssText = 'padding:6px 16px;cursor:pointer;font-size:13px;';
+        el.addEventListener('mouseenter', () => { el.style.background = 'var(--brand-soft)'; });
+        el.addEventListener('mouseleave', () => { el.style.background = ''; });
+        el.addEventListener('click', () => {
+          menu.remove();
+          if (it.action === 'copy') document.execCommand('copy');
+          else if (it.action === 'cut') document.execCommand('cut');
+          else if (it.action === 'paste') navigator.clipboard.readText().then(t => { document.execCommand('insertText', false, t); });
+          else if (it.action === 'selectall') { goalInput.select(); }
+        });
+        menu.appendChild(el);
+      });
+      document.body.appendChild(menu);
+      menu.style.left = e.clientX + 'px';
+      menu.style.top = e.clientY + 'px';
+    });
+    // 点击其他地方关闭右键菜单
+    document.addEventListener('click', (e) => {
+      const menu = document.getElementById('textCtxMenu');
+      if (menu && !menu.contains(e.target)) menu.remove();
+    });
+    /* ========== 新建对话任务 ========== */
+    async function openNewTaskModal() {
+      // 智能体类型下拉
+      const agentSel = document.getElementById('ntAgentType');
+      agentSel.innerHTML = Object.entries(AGENT_TYPES)
+        .map(([k, v]) => '<option value="' + k + '"' + (state.agentType === k ? ' selected' : '') + '>' + v.icon + ' ' + v.label + '</option>')
+        .join('');
+      // 工作区下拉：默认（沿用当前底部所选）+ 磁盘根目录
+      const wsSel = document.getElementById('ntWorkspaceDir');
+      const cur = state.workspaceDir || '';
+      wsSel.innerHTML = '<option value="">默认（' + (cur || '服务器工作区') + '）</option>';
+      try {
+        const d = await api('/api/drives');
+        (d.drives || []).forEach((dr) => {
+          if (dr !== cur) wsSel.innerHTML += '<option value="' + escapeHtml(dr) + '">' + escapeHtml(dr) + '</option>';
+        });
+      } catch {}
+      document.getElementById('ntGoal').value = '';
+      openModal('newTaskModal');
+      setTimeout(() => document.getElementById('ntGoal').focus(), 60);
+    }
+    async function createNewTask() {
+      const goal = document.getElementById('ntGoal').value.trim();
+      if (!goal) { toast('请填写任务描述'); return; }
+      const btn = document.getElementById('ntCreateBtn');
+      btn.disabled = true;
+      try {
+        const wsVal = document.getElementById('ntWorkspaceDir').value;
+        const payload = {
+          goal,
+          agentType: document.getElementById('ntAgentType').value || state.agentType,
+          permissions: state.permissions,
+          modelId: state.modelId || undefined,
+        };
+        // 工作区：仅在明确选择了目录时覆盖
+        const d = await api('/api/tasks', 'POST', wsVal ? Object.assign(payload, { workspaceDir: wsVal }) : payload);
+        document.getElementById('goalInput').value = '';
+        state.currentTaskId = d.task.id;
+        const taskListSection = document.getElementById('taskListSection');
+        if (taskListSection) taskListSection.style.display = 'block';
+        renderSidebarTaskList();
+        renderTaskDetail(d.task.id);
+        renderTaskThread({ id: d.task.id, goal, status: 'queued', createdAt: new Date().toISOString(), steps: [], conversation: [{ role: 'user', content: goal }] });
+        switchView('chat');
+        closeModal('newTaskModal');
+        await loadTasks();
+        toast('新任务已创建，所有对话将归属该任务');
+      } catch (e) { toast('创建失败：' + e.message); }
+      finally { btn.disabled = false; }
+    }
+    document.getElementById('newTaskBtn')?.addEventListener('click', openNewTaskModal);
+    document.getElementById('tchNewTask')?.addEventListener('click', openNewTaskModal);
+    document.getElementById('ntCreateBtn')?.addEventListener('click', createNewTask);
+    document.getElementById('ntGoal')?.addEventListener('keydown', (e) => { if (e.key === 'Enter' && (e.ctrlKey || e.metaKey)) createNewTask(); });
+    /* ========== 产物链接化 ========== */
+    function linkifyArtifacts(text) {
+      let html = escapeHtml(text);
+      html = html.replace(/(https?:\/\/[^\s]+)/g, '<span class="artifact" data-kind="url" data-path="$1">$1</span>');
+      html = html.replace(/([A-Za-z]:\\[\\\w\-.\s]+)/g, '<span class="artifact" data-kind="file" data-path="$1">$1</span>');
+      html = html.replace(/(\/[\w\-.\/\s]+)/g, '<span class="artifact" data-kind="file" data-path="$1">$1</span>');
+      return html;
+    }
+    function bindArtifacts(container) {
+      container.querySelectorAll('.artifact').forEach((el) => {
+        el.addEventListener('click', () => {
+          const kind = el.getAttribute('data-kind');
+          const path = el.getAttribute('data-path');
+          if (kind === 'url') openBrowser(path);
+          else previewFile(path);
+        });
+      });
+      container.querySelectorAll('.file-chip').forEach((el) => {
+        el.addEventListener('click', () => {
+          const path = el.getAttribute('data-path');
+          const mime = el.getAttribute('data-type') || '';
+          if (mime.startsWith('image/')) previewImage(path);
+          else previewFile(path);
+        });
+      });
+    }
+    async function previewFile(path) {
+      try {
+        const d = await api('/api/files/read', 'POST', { path });
+        showPreview('文件: ' + path, d.content, 'file');
+        switchRightTab('preview');
+      } catch (e) { toast('预览失败：' + e.message); }
+    }
+    function previewImage(path) {
+      document.getElementById('previewTitle').textContent = '图片: ' + path;
+      const box = document.getElementById('previewContent');
+      const img = document.createElement('img');
+      img.src = 'file://' + path;
+      img.style.maxWidth = '100%';
+      img.style.borderRadius = '8px';
+      img.addEventListener('error', () => {
+        box.innerHTML = '<div class="muted">无法直接显示本地图片，请用系统相册打开</div>';
+      });
+      box.innerHTML = '';
+      box.appendChild(img);
+      switchRightTab('preview');
+    }
+    function extractUrl(text) {
+      if (!text) return '';
+      const m = text.match(/(https?:\/\/[^\s]+)/);
+      return m ? m[1] : '';
+    }
+    /* ========== 中间菜单 ========== */
+    const convMenuWrap = document.getElementById('convMenuWrap');
+    const convMenu = document.getElementById('convMenu');
+    document.getElementById('convMenuBtn').addEventListener('click', (e) => {
+      e.stopPropagation();
+      convMenu.classList.toggle('show');
+    });
+    document.addEventListener('click', (e) => { if (!convMenuWrap.contains(e.target)) convMenu.classList.remove('show'); });
+    convMenu.querySelectorAll('.dropdown-item').forEach((el) => {
+      el.addEventListener('click', () => {
+        convMenu.classList.remove('show');
+        const action = el.getAttribute('data-action');
+        if (action === 'screenshot') takeScreenshot();
+        else if (action === 'upload-file') document.getElementById('fileInput').click();
+        else if (action === 'upload-image') document.getElementById('imageInput').click();
+        else if (action === 'direct-mode') toggleDirectMode();
+        else if (action === 'voice') startVoice();
+        else if (action === 'agent-type') openAgentSelector();
+      });
+    });
+    function toggleDirectMode() {
+      state.directMode = !state.directMode;
+      document.getElementById('directModePill').style.display = state.directMode ? 'inline-flex' : 'none';
+      toast(state.directMode ? '已开启「直接操作电脑」模式' : '已关闭「直接操作电脑」模式');
+    }
+    async function takeScreenshot() {
+      try {
+        const overlay = document.getElementById('cropOverlay');
+        const selection = document.getElementById('cropSelection');
+        const video = document.getElementById('cropVideo');
+        const stream = await navigator.mediaDevices.getDisplayMedia({ video: true });
+        video.srcObject = stream;
+        await video.play();
+        overlay.style.display = 'block';
+        selection.style.display = 'none';
+        let startX = 0, startY = 0, drawing = false;
+        const onDown = (e) => {
+          drawing = true;
+          startX = e.clientX; startY = e.clientY;
+          selection.style.display = 'block';
+          selection.style.left = startX + 'px';
+          selection.style.top = startY + 'px';
+          selection.style.width = '0px';
+          selection.style.height = '0px';
+        };
+        const onMove = (e) => {
+          if (!drawing) return;
+          const x = Math.min(e.clientX, startX), y = Math.min(e.clientY, startY);
+          const w = Math.abs(e.clientX - startX), h = Math.abs(e.clientY - startY);
+          selection.style.left = x + 'px';
+          selection.style.top = y + 'px';
+          selection.style.width = w + 'px';
+          selection.style.height = h + 'px';
+        };
+        const finish = async (e) => {
+          if (!drawing) return;
+          drawing = false;
+          window.removeEventListener('mousedown', onDown);
+          window.removeEventListener('mousemove', onMove);
+          window.removeEventListener('mouseup', finish);
+          const x = Math.min(e.clientX, startX), y = Math.min(e.clientY, startY);
+          const w = Math.abs(e.clientX - startX), h = Math.abs(e.clientY - startY);
+          overlay.style.display = 'none';
+          if (w < 8 || h < 8) { stream.getTracks().forEach((t) => t.stop()); return; }
+          try {
+            const srcW = video.videoWidth, srcH = video.videoHeight;
+            const scaleX = srcW / window.innerWidth, scaleY = srcH / window.innerHeight;
+            const sx = Math.round(x * scaleX), sy = Math.round(y * scaleY);
+            const sw = Math.round(w * scaleX), sh = Math.round(h * scaleY);
+            const canvas = document.createElement('canvas');
+            canvas.width = sw; canvas.height = sh;
+            canvas.getContext('2d').drawImage(video, sx, sy, sw, sh, 0, 0, sw, sh);
+            stream.getTracks().forEach((t) => t.stop());
+            const base64 = canvas.toDataURL('image/png').split(',')[1];
+            const d = await api('/api/upload', 'POST', { name: 'screenshot.png', mime: 'image/png', dataBase64: base64 });
+            appendMsg('user', '', { file: d.path, name: 'screenshot.png', mime: 'image/png' });
+            toast('截图已上传');
+          } catch (err) { toast('截图失败：' + err.message); }
+        };
+        const onKey = (e) => {
+          if (e.key === 'Escape') {
+            overlay.style.display = 'none';
+            stream.getTracks().forEach((t) => t.stop());
+            window.removeEventListener('mousedown', onDown);
+            window.removeEventListener('mousemove', onMove);
+            window.removeEventListener('mouseup', finish);
+            window.removeEventListener('keydown', onKey);
+          }
+        };
+        window.addEventListener('mousedown', onDown);
+        window.addEventListener('mousemove', onMove);
+        window.addEventListener('mouseup', finish);
+        window.addEventListener('keydown', onKey);
+      } catch (e) { toast('截图失败：' + e.message); }
+    }
+    function handleUpload(input, mimePrefix) {
+      const file = input.files[0];
+      if (!file) return;
+      const reader = new FileReader();
+      reader.onload = async () => {
+        try {
+          const base64 = String(reader.result).split(',')[1];
+          const d = await api('/api/upload', 'POST', { name: file.name, mime: file.type || mimePrefix, dataBase64: base64 });
+          appendMsg('user', '', { file: d.path, name: file.name, mime: file.type || mimePrefix });
+          toast('已上传：' + file.name);
+        } catch (e) { toast('上传失败：' + e.message); }
+      };
+      reader.readAsDataURL(file);
+      input.value = '';
+    }
+    document.getElementById('fileInput').addEventListener('change', function() { handleUpload(this, 'application/octet-stream'); });
+    document.getElementById('imageInput').addEventListener('change', function() { handleUpload(this, 'image/png'); });
+    /* ========== 大模型配置 ========== */
+    async function loadModels() {
+      try {
+        const d = await api('/api/models');
+        state.models = d.models || [];
+        state.defaultModelId = d.defaultId || null;
+        const manual = localStorage.getItem('fhcode.model');
+        if (manual !== null && manual !== '') {
+          state.modelId = manual;
+        } else {
+          state.modelId = state.defaultModelId || '';
+        }
+        renderModelSelect();
+      } catch (e) { console.warn('加载大模型失败', e); }
+    }
+    function renderModelSelect() {
+      const sel = document.getElementById('modelSelect');
+      const opts = ['<option value="">默认（系统路由）</option>'];
+      state.models.forEach((m) => {
+        opts.push('<option value="' + escapeHtml(m.id) + '">' + escapeHtml(m.name) + (m.default ? ' ★' : '') + '</option>');
+      });
+      sel.innerHTML = opts.join('');
+      sel.value = state.modelId || '';
+    }
+    function openModels() {
+      renderModelList();
+      resetModelForm();
+      openModal('modelModal');
+    }
+    function renderModelList() {
+      const list = document.getElementById('modelList');
+      if (!state.models.length) {
+        list.innerHTML = '<div class="empty">还没有大模型配置，请在下方添加。</div>';
+        return;
+      }
+      list.innerHTML = state.models.map((m) => (
+        '<div class="model-item" data-id="' + escapeHtml(m.id) + '">' +
+          '<div><div class="mi-name">' + escapeHtml(m.name) + '</div>' +
+          '<div class="mi-base">' + escapeHtml(m.apiBase || '（未填写 API 地址）') + (m.reasoning ? ' · 已配推理内容' : '') + '</div></div>' +
+          (m.default ? '<span class="mi-default">默认</span>' : '') +
+          '<div class="mi-actions">' +
+            (m.default ? '' : '<button data-act="default">设为默认</button>') +
+            '<button data-act="edit">编辑</button>' +
+            '<button class="danger" data-act="del">删除</button>' +
+          '</div>' +
+        '</div>'
+      )).join('');
+      list.querySelectorAll('.model-item').forEach((el) => {
+        const id = el.getAttribute('data-id');
+        el.querySelectorAll('button').forEach((b) => {
+          b.addEventListener('click', (e) => {
+            e.stopPropagation();
+            const act = b.getAttribute('data-act');
+            if (act === 'default') setDefaultModel(id);
+            else if (act === 'edit') editModel(id);
+            else if (act === 'del') deleteModel(id);
+          });
+        });
+      });
+    }
+    function resetModelForm() {
+      document.getElementById('modelName').value = '';
+      document.getElementById('modelApiBase').value = '';
+      document.getElementById('modelApiKey').value = '';
+      document.getElementById('modelReasoning').value = '';
+      document.getElementById('modelFormMsg').textContent = '';
+      document.getElementById('modelFormMsg').classList.remove('err');
+      document.getElementById('modelSaveBtn').dataset.editing = '';
+    }
+    function editModel(id) {
+      const m = state.models.find((x) => x.id === id);
+      if (!m) return;
+      document.getElementById('modelName').value = m.name;
+      document.getElementById('modelApiBase').value = m.apiBase || '';
+      document.getElementById('modelApiKey').value = m.apiKey || '';
+      document.getElementById('modelReasoning').value = m.reasoning || '';
+      document.getElementById('modelFormMsg').textContent = '正在编辑：' + m.name;
+      document.getElementById('modelFormMsg').classList.remove('err');
+      document.getElementById('modelSaveBtn').dataset.editing = id;
+    }
+    async function saveModel() {
+      const name = document.getElementById('modelName').value.trim();
+      const apiBase = document.getElementById('modelApiBase').value.trim();
+      const apiKey = document.getElementById('modelApiKey').value;
+      const reasoning = document.getElementById('modelReasoning').value;
+      const msg = document.getElementById('modelFormMsg');
+      if (!name) { msg.textContent = '请填写模型名称'; msg.classList.add('err'); return; }
+      const editing = document.getElementById('modelSaveBtn').dataset.editing;
+      try {
+        const body = { name, apiBase, apiKey, reasoning };
+        if (editing) body.id = editing;
+        const d = await api('/api/models', 'POST', body);
+        msg.textContent = '已保存：' + d.model.name;
+        msg.classList.remove('err');
+        await loadModels();
+        renderModelList();
+        resetModelForm();
+      } catch (e) { msg.textContent = '保存失败：' + e.message; msg.classList.add('err'); }
+    }
+    async function deleteModel(id) {
+      try {
+        await api('/api/models/' + encodeURIComponent(id), 'DELETE');
+        toast('已删除配置');
+        await loadModels();
+        renderModelList();
+      } catch (e) { toast('删除失败：' + e.message); }
+    }
+    async function setDefaultModel(id) {
+      try {
+        const d = await api('/api/models/' + encodeURIComponent(id) + '/default', 'POST');
+        state.defaultModelId = d.defaultId;
+        state.modelId = d.defaultId;
+        localStorage.setItem('fhcode.model', '');
+        renderModelSelect();
+        renderModelList();
+        renderModelListInline();
+        toast('已设为默认大模型');
+      } catch (e) { toast('设置失败：' + e.message); }
+    }
+    document.getElementById('modelSaveBtn').addEventListener('click', saveModel);
+    document.getElementById('modelResetBtn').addEventListener('click', resetModelForm);
+    document.getElementById('modelSettingsShortcut').addEventListener('click', openModels);
+    document.getElementById('modelSelect').addEventListener('change', (e) => {
+      state.modelId = e.target.value || '';
+      localStorage.setItem('fhcode.model', state.modelId);
+      const m = state.models.find((x) => x.id === state.modelId);
+      toast(m ? ('已切换：' + m.name) : '已切换：系统默认路由');
+    });
+    /* ========== 设置面板 ========== */
+    function openSettings() { openModal('settingsModal'); }
+    document.querySelectorAll('#settingsModal .settings-cat').forEach((c) => {
+      c.addEventListener('click', () => {
+        const cat = c.getAttribute('data-cat');
+        document.querySelectorAll('#settingsModal .settings-cat').forEach((x) => x.classList.toggle('active', x === c));
+        document.querySelectorAll('#settingsModal .settings-group').forEach((g) => {
+          g.style.display = g.getAttribute('data-group') === cat ? '' : 'none';
+        });
+      });
+    });
+    document.querySelectorAll('#settingsModal .settings-item').forEach((it) => {
+      it.addEventListener('click', () => {
+        const act = it.getAttribute('data-action');
+        if (act === 'perm') { closeModal('settingsModal'); openPermissions(); }
+        else if (act === 'theme') { closeModal('settingsModal'); toggleTheme(); }
+        else if (act === 'model-custom') { toggleModelManage(); }
+      });
+    });
+    function toggleModelManage() {
+      const box = document.getElementById('modelManage');
+      const open = box.style.display === 'none' || !box.style.display;
+      box.style.display = open ? '' : 'none';
+      if (open) { renderModelListInline(); resetInlineForm(); }
+    }
+    function renderModelListInline() {
+      const list = document.getElementById('modelListInline');
+      if (!state.models.length) {
+        list.innerHTML = '<div class="empty">还没有大模型配置，请在下方添加。</div>';
+        return;
+      }
+      list.innerHTML = state.models.map((m) => (
+        '<div class="mm-model" data-id="' + escapeHtml(m.id) + '">' +
+          '<span class="mm-name">' + escapeHtml(m.name) + '</span>' +
+          '<span class="mm-base">' + escapeHtml(m.apiBase || '（未填写 API 地址）') + (m.reasoning ? ' · 已配推理内容' : '') + '</span>' +
+          (m.default ? '<span class="mm-tag">默认</span>' : '') +
+          (m.default ? '' : '<button data-act="default">设为默认</button>') +
+          '<button data-act="edit">编辑</button>' +
+          '<button class="danger" data-act="del">删除</button>' +
+        '</div>'
+      )).join('');
+      list.querySelectorAll('.mm-model').forEach((el) => {
+        const id = el.getAttribute('data-id');
+        el.querySelectorAll('button').forEach((b) => {
+          b.addEventListener('click', (e) => {
+            e.stopPropagation();
+            const act = b.getAttribute('data-act');
+            if (act === 'default') setDefaultModel(id);
+            else if (act === 'edit') fillInlineForm(id);
+            else if (act === 'del') deleteModel(id);
+          });
+        });
+      });
+    }
+    function resetInlineForm() {
+      document.getElementById('imName').value = '';
+      document.getElementById('imBase').value = '';
+      document.getElementById('imKey').value = '';
+      document.getElementById('imReasoning').value = '';
+      document.getElementById('imMsg').textContent = '';
+      document.getElementById('imMsg').classList.remove('err');
+      document.getElementById('imSave').dataset.editing = '';
+    }
+    function fillInlineForm(id) {
+      const m = state.models.find((x) => x.id === id);
+      if (!m) return;
+      document.getElementById('imName').value = m.name;
+      document.getElementById('imBase').value = m.apiBase || '';
+      document.getElementById('imKey').value = m.apiKey || '';
+      document.getElementById('imReasoning').value = m.reasoning || '';
+      document.getElementById('imMsg').textContent = '正在编辑：' + m.name;
+      document.getElementById('imMsg').classList.remove('err');
+      document.getElementById('imSave').dataset.editing = id;
+    }
+    async function saveInlineModel() {
+      const name = document.getElementById('imName').value.trim();
+      const apiBase = document.getElementById('imBase').value.trim();
+      const apiKey = document.getElementById('imKey').value;
+      const reasoning = document.getElementById('imReasoning').value;
+      const msg = document.getElementById('imMsg');
+      if (!name) { msg.textContent = '请填写模型名称'; msg.classList.add('err'); return; }
+      const editing = document.getElementById('imSave').dataset.editing;
+      try {
+        const body = { name, apiBase, apiKey, reasoning };
+        if (editing) body.id = editing;
+        const d = await api('/api/models', 'POST', body);
+        msg.textContent = '已保存：' + d.model.name;
+        msg.classList.remove('err');
+        await loadModels();
+        renderModelListInline();
+        resetInlineForm();
+      } catch (e) { msg.textContent = '保存失败：' + e.message; msg.classList.add('err'); }
+    }
+    document.getElementById('imSave').addEventListener('click', saveInlineModel);
+    document.getElementById('imReset').addEventListener('click', resetInlineForm);
+    document.getElementById('modelManageClose').addEventListener('click', () => { document.getElementById('modelManage').style.display = 'none'; });
+    /* ========== 通话控件 ========== */
+    let callStream = null;
+    async function startCall(kind) {
+      const status = document.getElementById('callStatus');
+      try {
+        const constraints = kind === 'video' ? { audio: true, video: true } : { audio: true };
+        callStream = await navigator.mediaDevices.getUserMedia(constraints);
+        status.textContent = (kind === 'video' ? '视频通话中' : '语音通话中') + '…';
+        document.getElementById('hangupCallBtn').style.display = 'inline-block';
+        toast('已发起' + (kind === 'video' ? '视频' : '语音') + '通话（演示）');
+      } catch (e) {
+        status.textContent = '';
+        toast('无法发起通话：' + e.message);
+      }
+    }
+    function hangupCall() {
+      if (callStream) { callStream.getTracks().forEach((t) => t.stop()); callStream = null; }
+      document.getElementById('callStatus').textContent = '';
+      document.getElementById('hangupCallBtn').style.display = 'none';
+      toast('已挂断');
+    }
+    document.getElementById('voiceCallBtn').addEventListener('click', () => startCall('voice'));
+    document.getElementById('videoCallBtn').addEventListener('click', () => startCall('video'));
+    document.getElementById('hangupCallBtn').addEventListener('click', hangupCall);
+    function startVoice() {
+      const SpeechRecognition = window.SpeechRecognition || window.webkitSpeechRecognition;
+      if (!SpeechRecognition) { toast('当前浏览器不支持语音输入'); return; }
+      const rec = new SpeechRecognition();
+      rec.lang = 'zh-CN';
+      rec.continuous = false;
+      rec.interimResults = false;
+      const badge = document.getElementById('voiceBadge');
+      badge.style.display = 'inline-flex';
+      rec.onresult = (e) => {
+        const text = e.results[0][0].transcript;
+        const input = document.getElementById('goalInput');
+        input.value = (input.value ? input.value + ' ' : '') + text;
+      };
+      rec.onerror = (e) => { toast('语音识别失败：' + e.error); badge.style.display = 'none'; };
+      rec.onend = () => { badge.style.display = 'none'; };
+      rec.start();
+    }
+    /* ========== 智能体选择 ========== */
+    function openAgentSelector() {
+      const grid = document.getElementById('agentGrid');
+      grid.innerHTML = Object.entries(AGENT_TYPES).map(([k, v]) =>
+        '<div class="agent-card ' + (state.agentType === k ? 'selected' : '') + '" data-type="' + k + '"><div class="icon">' + v.icon + '</div><div class="title">' + v.label + '</div></div>'
+      ).join('');
+      grid.querySelectorAll('.agent-card').forEach((c) => c.addEventListener('click', () => {
+        state.agentType = c.getAttribute('data-type');
+        updateUserBar();
+        closeModal('agentModal');
+        toast('已切换：' + AGENT_TYPES[state.agentType].label);
+      }));
+      openModal('agentModal');
+    }
+    document.getElementById('skillPill').addEventListener('click', openAgentSelector);
+    /* ========== 权限窗口 ========== */
+    function openPermissions() {
+      const p = state.permissions;
+      document.querySelector('input[name="readScope"][value="' + p.readScope + '"]').checked = true;
+      document.getElementById('permReadPath').value = p.readPath || '';
+      document.getElementById('permRead').checked = p.allowRead;
+      document.getElementById('permWrite').checked = p.allowWrite;
+      document.getElementById('permShell').checked = p.allowShell;
+      document.getElementById('permNetwork').checked = p.allowNetwork;
+      document.getElementById('permBrowser').checked = p.allowBrowser;
+      openModal('permModal');
+    }
+    document.getElementById('permSaveBtn').addEventListener('click', () => {
+      const scope = document.querySelector('input[name="readScope"]:checked')?.value || 'workspace';
+      state.permissions = {
+        readScope: scope,
+        readPath: document.getElementById('permReadPath').value.trim(),
+        allowRead: document.getElementById('permRead').checked,
+        allowWrite: document.getElementById('permWrite').checked,
+        allowShell: document.getElementById('permShell').checked,
+        allowNetwork: document.getElementById('permNetwork').checked,
+        allowBrowser: document.getElementById('permBrowser').checked,
+      };
+      localStorage.setItem('fhcode.permissions', JSON.stringify(state.permissions));
+      closeModal('permModal');
+      toast('权限配置已保存');
+    });
+    /* ========== 工作区 ========== */
+    async function loadWorkspace() {
+      if (!state.token) {
+        console.warn('[workspace] 未登录，跳过加载');
+        return;
+      }
+      try {
+        const d = await api('/api/workspace');
+        state.workspaceDir = d.cwd;
+        // 持久化到 localStorage
+        localStorage.setItem('fhcode.workspaceDir', d.cwd);
+        renderWorkspaceBar();
+        console.log('[workspace] 加载成功:', d.cwd);
+      } catch (e) {
+        console.error('[workspace] 加载失败:', e.message);
+        toast('工作区加载失败，请检查登录状态');
+      }
+    }
+    async function loadWorkspaceTree(dir) {
+      // 已废弃：左侧工作区树已移除，保留此函数仅供兼容
+      return;
+    }
+    // 工作区跳转功能已移除（旧布局左侧工作区树）
+    function renderWorkspaceBar() {
+      const el = document.getElementById('workspaceCwdBottom');
+      if (el) el.textContent = state.workspaceDir || '（未设置）';
+    }
+    document.getElementById('workspacePermBadge')?.addEventListener('click', () => openPermissions());
+    document.getElementById('workspacePickBtn')?.addEventListener('click', () => {
+      openFolderPicker();
+    });
+    let fpCurrent = '';
+    function getDirectoryName(path) {
+      console.log('[getDirectoryName] input:', path);
+      // 处理 Windows 驱动器根目录: C:, D:, H: 等
+      if (!path || path === '' || path === '/') return '/';
+      // 检查是否是纯驱动器字母（如 H:）
+      if (/^[A-Za-z]:$/.test(path)) { const r = path + '\\'; console.log('[getDirectoryName] result:', r); return r; }
+      // 检查是否是驱动器根目录（如 H:\）
+      if (/^[A-Za-z]:\\$/.test(path)) { console.log('[getDirectoryName] result:', path); return path; }
+      const parts = path.split(/[/\\]/).filter(Boolean);
+      console.log('[getDirectoryName] parts:', parts);
+      if (parts.length <= 1) {
+        const driveMatch = parts[0].match(/^([A-Za-z]):$/);
+        if (driveMatch) { const r = driveMatch[1] + ':' + '\\'; console.log('[getDirectoryName] result:', r); return r; }
+        return parts[0] || '/';
+      }
+      const parentParts = parts.slice(0, -1);
+      const firstPart = parentParts[0];
+      if (/^[A-Za-z]:$/.test(firstPart)) {
+        // Windows 驱动器根目录特殊处理
+        const r = firstPart + '\\' + parentParts.slice(1).join('\\');
+        console.log('[getDirectoryName] result:', r, '(parentParts:', parentParts + ')');
+        return r;
+      }
+      const r = parentParts.join('\\');
+      console.log('[getDirectoryName] result:', r);
+      return r;
+    }
+    async function openFolderPicker() {
+      console.log('[folderPicker] 打开文件夹选择器');
+      console.log('[folderPicker] 当前 state.workspaceDir:', state.workspaceDir);
+      console.log('[folderPicker] 当前 state.token:', state.token ? '已登录' : '未登录');
+      // 如果 workspaceDir 为空，尝试从 localStorage 恢复或询问用户
+      let initialDir = state.workspaceDir;
+      if (!initialDir) {
+        // 尝试从 localStorage 恢复
+        const savedCwd = localStorage.getItem('fhcode.workspaceDir');
+        if (savedCwd) {
+          initialDir = savedCwd;
+          console.log('[folderPicker] 从 localStorage 恢复工作区:', initialDir);
+        } else {
+          // 使用默认路径
+          initialDir = '.';
+          console.log('[folderPicker] 使用默认路径:', initialDir);
+        }
+      }
+      fpCurrent = initialDir || '.';
+      const fpPathEl = document.getElementById('fpPath');
+      if (fpPathEl) fpPathEl.textContent = fpCurrent || '（根目录）';
+      try {
+        console.log('[folderPicker] 加载目录列表:', fpCurrent);
+        await loadFolderPicker(fpCurrent);
+        console.log('[folderPicker] 目录加载成功');
+      } catch (e) {
+        console.error('[folderPicker] 加载失败:', e);
+        toast('读取目录失败：' + e.message);
+        return;
+      }
+      openModal('folderPickerModal');
+      console.log('[folderPicker] 模态框已打开');
+    }
+    async function loadFolderPicker(dir) {
+      console.log('[folderPicker] 加载:', dir);
+      const d = await api('/api/workspace/list?path=' + encodeURIComponent(dir));
+      fpCurrent = d.cwd;
+      const fpPathEl = document.getElementById('fpPath');
+      if (fpPathEl) fpPathEl.textContent = fpCurrent;
+      const tree = document.getElementById('fpTree');
+      if (!tree) {
+        console.error('[folderPicker] fpTree 元素不存在');
+        return;
+      }
+      const parentPath = getDirectoryName(d.cwd);
+      // 如果在驱动器根目录，不显示".."，改为显示驱动器列表
+      const isDriveRoot = /^[A-Za-z]:\\$/.test(d.cwd);
+      let upButtonHtml = '';
+      if (!isDriveRoot && parentPath && parentPath !== d.cwd) {
+        upButtonHtml = '<div class="file-item" data-path="' + escapeHtml(parentPath) + '" data-type="up">⬆ ..</div>';
+      } else if (isDriveRoot) {
+        // 动态获取可用驱动器列表
+        const drives = await getDrivesList();
+        upButtonHtml = '<div class="file-item drive-switcher">' +
+          '<span>🖥 切换驱动器</span>' +
+          drives.map(d => '<div class="drive-option" data-drive="' + d + '">' + d + '</div>').join('') +
+          '</div>';
+      }
+      tree.innerHTML = upButtonHtml +
+        d.entries.map((e) => '<div class="file-item ' + (e.type === 'dir' ? 'dir' : '') + '" data-path="' + escapeHtml(e.path) + '" data-type="' + e.type + '">' + (e.type === 'dir' ? '📁' : '📄') + ' ' + escapeHtml(e.name) + '</div>').join('');
+      console.log('[folderPicker] 目录渲染完成, 条目数:', d.entries.length);
+    }
+    // 驱动器列表缓存
+    let _drivesCache = null;
+    async function getDrivesList() {
+      if (_drivesCache) return _drivesCache;
+      try {
+        const d = await api('/api/drives');
+        _drivesCache = d.drives || [];
+        return _drivesCache;
+      } catch {
+        return ['C:\\', 'D:\\', 'E:\\', 'F:\\', 'H:\\'];
+      }
+    }
+    document.getElementById('fpConfirm')?.addEventListener('click', async () => {
+      console.log('[folderPicker] 点击确认, 当前选择:', fpCurrent);
+      try {
+        console.log('[folderPicker] 提交切换工作区...');
+        const result = await api('/api/workspace', 'POST', { cwd: fpCurrent });
+        console.log('[folderPicker] API 返回:', result);
+        state.workspaceDir = fpCurrent;
+        // 持久化到 localStorage
+        localStorage.setItem('fhcode.workspaceDir', fpCurrent);
+        renderWorkspaceBar();
+        closeModal('folderPickerModal');
+        toast('已切换工作区：' + fpCurrent);
+      } catch (e) {
+        console.error('[folderPicker] 切换失败:', e);
+        toast('设置失败：' + e.message);
+      }
+    });
+    /* ========== 自动化、模板、市场、办公助理 ========== */
+    async function loadAutomations() {
+      try { const d = await api('/api/automations'); renderAutoGrid(d.automations || []); }
+      catch (e) { console.warn('加载自动化失败', e); }
+    }
+    function renderAutoGrid(list) {
+      const grid = document.getElementById('autoGrid');
+      if (!list.length) { grid.innerHTML = '<div class="empty">还没有快捷指令</div>'; return; }
+      grid.innerHTML = list.map((a) => '<div class="tile" data-id="' + a.id + '"><div class="icon">⚡</div><div class="title">' + escapeHtml(a.name) + '</div><div class="desc">' + escapeHtml(a.goal).slice(0, 60) + (a.goal.length > 60 ? '…' : '') + '<br>已运行 ' + a.runCount + ' 次</div><div class="ops"><button class="run" data-id="' + a.id + '">▶ 运行</button><button class="ghost del" data-id="' + a.id + '">删除</button></div></div>').join('');
+      grid.querySelectorAll('button.run').forEach((b) => b.addEventListener('click', (e) => { e.stopPropagation(); runAuto(b.getAttribute('data-id')); }));
+      grid.querySelectorAll('button.del').forEach((b) => b.addEventListener('click', (e) => { e.stopPropagation(); delAuto(b.getAttribute('data-id')); }));
+    }
+    async function runAuto(id) {
+      try { const d = await api('/api/automations/' + id + '/run', 'POST'); toast('已发起任务，运行次数 ' + d.runCount); await loadTasks(); }
+      catch (e) { toast('运行失败：' + e.message); }
+    }
+    async function delAuto(id) {
+      try { await api('/api/automations/' + id, 'DELETE'); await loadAutomations(); toast('已删除'); }
+      catch (e) { toast('删除失败：' + e.message); }
+    }
+    document.getElementById('newAutoBtn')?.addEventListener('click', () => openModal('autoModal'));
+    document.getElementById('autoSaveBtn')?.addEventListener('click', async () => {
+      const name = document.getElementById('autoName').value.trim();
+      const goal = document.getElementById('autoGoal').value.trim();
+      if (!name || !goal) { toast('请填写名称与目标'); return; }
+      try { await api('/api/automations', 'POST', { name, goal }); closeModal('autoModal');
+        const n = document.getElementById('autoName');
+        const g = document.getElementById('autoGoal');
+        if (n) n.value = ''; if (g) g.value = '';
+        await loadAutomations(); toast('已保存'); }
+      catch (e) { toast('保存失败：' + e.message); }
+    });
+    async function loadTemplates() {
+      try { const d = await api('/api/templates'); renderBuiltin(d.builtin || []); renderUserTpl(d.user || []); }
+      catch (e) { console.warn('加载模板失败', e); }
+    }
+    function tplCard(t, deletable) {
+      return '<div class="tile" data-goal="' + encodeURIComponent(t.goal) + '"><div class="icon">' + (t.icon || '📄') + '</div><div class="title">' + escapeHtml(t.title) + '</div><div class="desc">' + escapeHtml(t.category || '') + ' · ' + escapeHtml(t.goal).slice(0, 40) + '…</div><div class="ops"><button class="use" data-goal="' + encodeURIComponent(t.goal) + '">填入输入框</button>' + (deletable ? '<button class="ghost del" data-id="' + t.id + '">删除</button>' : '') + '</div></div>';
+    }
+    function renderBuiltin(list) {
+      const grid = document.getElementById('builtinGrid');
+      if (!list.length) { grid.innerHTML = '<div class="empty">无内置模板</div>'; return; }
+      grid.innerHTML = list.map((t) => tplCard(t, false)).join('');
+      bindTplCards(grid);
+    }
+    function renderUserTpl(list) {
+      const grid = document.getElementById('userTplGrid');
+      if (!list.length) { grid.innerHTML = '<div class="empty">暂无自定义模板</div>'; return; }
+      grid.innerHTML = list.map((t) => tplCard(t, true)).join('');
+      bindTplCards(grid);
+    }
+    function bindTplCards(grid) {
+      grid.querySelectorAll('button.use').forEach((b) => b.addEventListener('click', (e) => {
+        e.stopPropagation();
+        const inp = document.getElementById('goalInput');
+        if (inp) inp.value = decodeURIComponent(b.getAttribute('data-goal'));
+        switchView('chat');
+        if (inp) inp.focus();
+        toast('已填入输入框，去发送吧');
+      }));
+      grid.querySelectorAll('button.del').forEach((b) => b.addEventListener('click', async (e) => {
+        e.stopPropagation();
+        try { await api('/api/templates/' + b.getAttribute('data-id'), 'DELETE'); await loadTemplates(); toast('已删除'); }
+        catch (err) { toast('删除失败：' + err.message); }
+      }));
+    }
+    document.getElementById('newTplBtn')?.addEventListener('click', () => {
+      const goal = document.getElementById('goalInput')?.value?.trim() || '';
+      const inp = document.getElementById('tplGoal');
+      if (inp) inp.value = goal;
+      openModal('tplModal');
+    });
+    document.getElementById('tplSaveBtn')?.addEventListener('click', async () => {
+      const title = document.getElementById('tplTitle').value.trim();
+      const goal = document.getElementById('tplGoal').value.trim();
+      const category = document.getElementById('tplCategory').value.trim();
+      if (!title || !goal) { toast('请填写标题与内容'); return; }
+      try { await api('/api/templates', 'POST', { title, goal, category }); closeModal('tplModal');
+        const t = document.getElementById('tplTitle');
+        const g = document.getElementById('tplGoal');
+        const c = document.getElementById('tplCategory');
+        if (t) t.value = ''; if (g) g.value = ''; if (c) c.value = '';
+        await loadTemplates(); toast('已保存模板'); }
+      catch (e) { toast('保存失败：' + e.message); }
+    });
+    async function loadMarket() {
+      const q = document.getElementById('marketSearch').value.trim();
+      const source = document.getElementById('marketSource').value;
+      const grid = document.getElementById('marketGrid');
+      grid.innerHTML = '<div class="empty">加载中…</div>';
+      try {
+        const params = new URLSearchParams({ source });
+        if (q) params.set('q', q);
+        const d = await api('/api/skills/market?' + params.toString());
+        state.market = d.skills || [];
+        renderMarketGrid();
+        await loadInstalled();
+      } catch (e) { grid.innerHTML = '<div class="empty" style="color:var(--err)">加载失败：' + escapeHtml(e.message) + '</div>'; }
+    }
+    function renderMarketGrid() {
+      const grid = document.getElementById('marketGrid');
+      if (!state.market.length) { grid.innerHTML = '<div class="empty">没有找到技能</div>'; return; }
+      grid.innerHTML = state.market.map((s) => '<div class="tile"><div class="icon">' + (s.source === 'clawhub' ? '🧩' : '🛠') + '</div><div class="title">' + escapeHtml(s.name) + '</div><div class="desc">' + escapeHtml(s.description).slice(0, 70) + '…<br><span class="muted">' + (s.source === 'clawhub' ? 'ClawHub' : 'Agent-Foundry') + ' · 下载 ' + (s.downloads || 0) + '</span></div><div class="ops"><button class="install" data-id="' + encodeURIComponent(s.id) + '" data-name="' + encodeURIComponent(s.name) + '" data-source="' + s.source + '">安装</button></div></div>').join('');
+      grid.querySelectorAll('button.install').forEach((b) => b.addEventListener('click', (e) => {
+        e.stopPropagation();
+        installSkill(b.getAttribute('data-id'), b.getAttribute('data-name'), b.getAttribute('data-source'));
+      }));
+    }
+    async function installSkill(idEnc, nameEnc, source) {
+      const id = decodeURIComponent(idEnc);
+      const name = decodeURIComponent(nameEnc);
+      try { await api('/api/skills/install', 'POST', { id, name, source }); toast('已安装：' + name); await loadInstalled(); }
+      catch (e) { toast('安装失败：' + e.message); }
+    }
+    async function loadInstalled() {
+      try {
+        const d = await api('/api/skills/installed');
+        state.installed = new Set((d.skills || []).map((s) => s.id));
+        const grid = document.getElementById('installedGrid');
+        if (!d.skills || !d.skills.length) { grid.innerHTML = '<div class="empty">暂无已安装技能</div>'; return; }
+        grid.innerHTML = d.skills.map((s) => '<div class="tile"><div class="icon">✅</div><div class="title">' + escapeHtml(s.name) + '</div><div class="desc">' + escapeHtml(s.description || '').slice(0, 60) + '…</div></div>').join('');
+      } catch (e) { console.warn('加载已安装失败', e); }
+    }
+    document.getElementById('marketRefresh')?.addEventListener('click', loadMarket);
+    let marketTimer;
+    document.getElementById('marketSearch')?.addEventListener('input', () => { clearTimeout(marketTimer); marketTimer = setTimeout(loadMarket, 400); });
+    document.getElementById('marketSource')?.addEventListener('change', loadMarket);
+    async function loadOffice() {
+      try {
+        const d = await api('/api/office/capabilities');
+        const grid = document.getElementById('officeGrid');
+        grid.innerHTML = (d.capabilities || []).map((c) => '<div class="tile" data-prompt="' + encodeURIComponent(c.prompt) + '"><div class="icon">' + c.icon + '</div><div class="title">' + escapeHtml(c.title) + '</div><div class="desc">' + escapeHtml(c.desc) + '</div><div class="ops"><button class="use" data-prompt="' + encodeURIComponent(c.prompt) + '">生成提示词</button></div></div>').join('');
+        grid.querySelectorAll('button.use').forEach((b) => b.addEventListener('click', (e) => {
+          e.stopPropagation();
+          const inp = document.getElementById('goalInput');
+          if (inp) inp.value = decodeURIComponent(b.getAttribute('data-prompt'));
+          switchView('chat');
+          if (inp) inp.focus();
+          toast('已填入提示词');
+        }));
+      } catch (e) { document.getElementById('officeGrid').innerHTML = '<div class="empty" style="color:var(--err)">加载失败：' + escapeHtml(e.message) + '</div>'; }
+    }
+    document.querySelectorAll('[data-close]').forEach((el) => el.addEventListener('click', () => closeModal(el.getAttribute('data-close'))));
+    document.querySelectorAll('.mask').forEach((m) => m.addEventListener('click', (e) => { if (e.target === m) m.classList.remove('show'); }));
+    // 文件夹选择器点击事件（只绑定一次，避免累积）
+    document.getElementById('fpTree')?.addEventListener('click', async (e) => {
+      const driveOption = e.target.closest('.drive-option');
+      if (driveOption) {
+        e.stopPropagation();
+        const drive = driveOption.getAttribute('data-drive');
+        console.log('[folderPicker] 选择驱动器:', drive);
+        try { await loadFolderPicker(drive); } catch (err) { toast('读取失败：' + err.message); }
+        return;
+      }
+      const item = e.target.closest('.file-item');
+      if (!item) return;
+      const type = item.getAttribute('data-type');
+      const path = item.getAttribute('data-path');
+      console.log('[folderPicker] 点击:', type, path);
+      if (type === 'dir' || type === 'up') {
+        try { await loadFolderPicker(path); } catch (e) { toast('读取失败：' + e.message); }
+      } else if (type) {
+        previewFile(path);
+      }
+    });
+    function startRefresh() { setInterval(loadTasks, 5000); }
+    /* ========== 记忆系统 ========== */
+    async function loadMemoryStats() {
+      try {
+        const d = await api('/api/memory/stats');
+        document.getElementById('statShortDays').textContent = d.shortTermFiles + ' 天';
+        document.getElementById('statLongNotes').textContent = d.longTermNotes + ' 条';
+        document.getElementById('statLastSum').textContent = d.lastSummarize || '暂无';
+        // 计算下次自动总结时间（今晚24:00）
+        const now = new Date();
+        const next = new Date(now.getFullYear(), now.getMonth(), now.getDate() + 1, 0, 0, 0);
+        document.getElementById('statNextSum').textContent = next.toLocaleString('zh-CN', { hour12: false });
+      } catch (e) { console.warn('加载记忆统计失败', e); }
+    }
+    async function loadMemoryContent(dateStr) {
+      try {
+        const d = await api('/api/memory/short?date=' + dateStr);
+        const content = document.getElementById('memShortContent');
+        if (!d || !d.content) {
+          content.innerHTML = '<div class="empty">当天暂无记录</div>';
+          return;
+        }
+        content.innerHTML = formatMarkdown(d.content);
+        document.getElementById('memDateLabel').textContent = '📅 ' + dateStr;
+      } catch (e) { toast('加载失败：' + e.message); }
+    }
+    async function loadLongTermMemory() {
+      try {
+        const d = await api('/api/memory/long');
+        const content = document.getElementById('memLongContent');
+        if (!d || !d.content) {
+          content.innerHTML = '<div class="empty">长期记忆为空</div>';
+          return;
+        }
+        content.innerHTML = formatMarkdown(d.content);
+      } catch (e) { toast('加载失败：' + e.message); }
+    }
+    async function loadSummaryHistory() {
+      try {
+        const d = await api('/api/memory/history?limit=20');
+        const content = document.getElementById('memHistoryContent');
+        const list = d.history || [];
+        if (!list.length) {
+          content.innerHTML = '<div class="empty">暂无总结历史</div>';
+          return;
+        }
+        content.innerHTML = list.map(h =>
+          '<div style="padding:8px 0;border-bottom:1px solid var(--border);font-size:13px;">' +
+          '<strong>' + h.date + '</strong> → ' + h.newEntries + ' 条新增, ' + h.updatedEntries + ' 条更新<br>' +
+          '<span class="muted">' + h.timestamp + '</span>' +
+          '</div>'
+        ).join('');
+      } catch (e) { toast('加载失败：' + e.message); }
+    }
+    function formatMarkdown(text) {
+      // 简单 Markdown 转换
+      return text
+        .replace(/&/g, '&amp;')
+        .replace(/</g, '&lt;')
+        .replace(/>/g, '&gt;')
+        .replace(/^### (.*$)/gm, '<h3>$1</h3>')
+        .replace(/^## (.*$)/gm, '<h2>$1</h2>')
+        .replace(/^# (.*$)/gm, '<h1>$1</h1>')
+        .replace(/\*\*(.*?)\*\*/g, '<strong>$1</strong>')
+        .replace(/\*(.*?)\*/g, '<em>$1</em>')
+        .replace(/`(.*?)`/g, '<code>$1</code>')
+        .replace(/\n/g, '<br>');
+    }
+    function initMemoryUI() {
+      // 设置默认日期为今天
+      const today = new Date().toISOString().split('T')[0];
+      document.getElementById('memDateInput').value = today;
+      loadMemoryContent(today);
+      // Tab 切换
+      document.querySelectorAll('.mem-tab').forEach(tab => {
+        tab.addEventListener('click', () => {
+          document.querySelectorAll('.mem-tab').forEach(t => t.classList.remove('active'));
+          document.querySelectorAll('.mem-panel').forEach(p => p.classList.toggle('active', false));
+          tab.classList.add('active');
+          const panelId = tab.getAttribute('data-memtab') + 'Panel';
+          document.getElementById(panelId)?.classList.add('active');
+        });
+      });
+      // 查看按钮
+      document.getElementById('memLoadDay')?.addEventListener('click', () => {
+        const dateStr = document.getElementById('memDateInput').value;
+        if (dateStr) loadMemoryContent(dateStr);
+      });
+      // 刷新按钮
+      document.getElementById('memRefreshBtn')?.addEventListener('click', () => {
+        loadMemoryStats();
+        const dateStr = document.getElementById('memDateInput').value;
+        if (dateStr) loadMemoryContent(dateStr);
+        loadLongTermMemory();
+      });
+      // 立即总结按钮
+      document.getElementById('memSummarizeBtn')?.addEventListener('click', async () => {
+        const btn = document.getElementById('memSummarizeBtn');
+        btn.disabled = true;
+        btn.textContent = '⏳ 总结中...';
+        try {
+          const dateStr = document.getElementById('memDateInput').value || today;
+          const d = await api('/api/memory/summarize', 'POST', { date: dateStr });
+          toast('✅ ' + (d.message || '总结完成'));
+          loadMemoryStats();
+          loadSummaryHistory();
+        } catch (e) {
+          toast('总结失败：' + e.message);
+        } finally {
+          btn.disabled = false;
+          btn.textContent = '✨ 立即总结';
+        }
+      });
+      // 初始加载
+      loadMemoryStats();
+      loadLongTermMemory();
+      loadSummaryHistory();
+    }
+    // 当切换到记忆页面时初始化
+    const origSwitchView = switchView;
+    window.switchView = function(nav) {
+      origSwitchView(nav);
+      if (nav === 'memory') {
+        setTimeout(initMemoryUI, 100);
+      }
+    };
+    if (state.token && state.phone) {
+      document.getElementById('loginOverlay').style.display = 'none';
+      document.getElementById('appLayout').classList.add('show');
+      afterLogin();
+    }
+  </script>
+</body>
+</html>