npm - @winspan/claude-forge - Versions diffs - 8.27.0 → 8.28.1 - Mend

@winspan/claude-forge 8.27.0 → 8.28.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 (53) hide show

package/dist/capability/index.d.ts +9 -0
package/dist/capability/index.d.ts.map +1 -0
package/dist/capability/index.js +9 -0
package/dist/capability/index.js.map +1 -0
package/dist/capability/methodologies/bmad.yaml +69 -0
package/dist/capability/methodologies/harness-engineering.yaml +69 -0
package/dist/capability/methodology-planner.d.ts +33 -0
package/dist/capability/methodology-planner.d.ts.map +1 -0
package/dist/capability/methodology-planner.js +178 -0
package/dist/capability/methodology-planner.js.map +1 -0
package/dist/capability/methodology-registry.d.ts +32 -0
package/dist/capability/methodology-registry.d.ts.map +1 -0
package/dist/capability/methodology-registry.js +97 -0
package/dist/capability/methodology-registry.js.map +1 -0
package/dist/capability/types.d.ts +68 -0
package/dist/capability/types.d.ts.map +1 -0
package/dist/capability/types.js +7 -0
package/dist/capability/types.js.map +1 -0
package/dist/core/storage/schema.sql +40 -0
package/dist/core/storage/sqlite.d.ts +25 -0
package/dist/core/storage/sqlite.d.ts.map +1 -1
package/dist/core/storage/sqlite.js +87 -0
package/dist/core/storage/sqlite.js.map +1 -1
package/dist/daemon/handlers/methodology-formatter.d.ts +9 -0
package/dist/daemon/handlers/methodology-formatter.d.ts.map +1 -0
package/dist/daemon/handlers/methodology-formatter.js +73 -0
package/dist/daemon/handlers/methodology-formatter.js.map +1 -0
package/dist/daemon/handlers/post-tool-use.d.ts +9 -1
package/dist/daemon/handlers/post-tool-use.d.ts.map +1 -1
package/dist/daemon/handlers/post-tool-use.js +94 -2
package/dist/daemon/handlers/post-tool-use.js.map +1 -1
package/dist/daemon/handlers/pre-tool-use.d.ts.map +1 -1
package/dist/daemon/handlers/pre-tool-use.js +3 -0
package/dist/daemon/handlers/pre-tool-use.js.map +1 -1
package/dist/daemon/handlers/user-prompt.d.ts +5 -1
package/dist/daemon/handlers/user-prompt.d.ts.map +1 -1
package/dist/daemon/handlers/user-prompt.js +85 -17
package/dist/daemon/handlers/user-prompt.js.map +1 -1
package/dist/daemon/index.d.ts.map +1 -1
package/dist/daemon/index.js +8 -2
package/dist/daemon/index.js.map +1 -1
package/dist/daemon/routing-state.d.ts +13 -1
package/dist/daemon/routing-state.d.ts.map +1 -1
package/dist/daemon/routing-state.js +154 -4
package/dist/daemon/routing-state.js.map +1 -1
package/dist/web/server.d.ts.map +1 -1
package/dist/web/server.js +123 -2
package/dist/web/server.js.map +1 -1
package/dist/web/static/assets/index-CtylfoaN.css +1 -0
package/dist/web/static/assets/index-DnaQt27h.js +388 -0
package/dist/web/static/assets/index-DnaQt27h.js.map +1 -0
package/dist/web/static/index.html +12 -2971
package/package.json +5 -2

package/dist/web/static/index.html CHANGED Viewed

@@ -1,2973 +1,14 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="zh-CN">
-<head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>Claude Forge 管理后台</title>
-  <script src="vendor/chart.umd.min.js"></script>
-  <!-- Monaco Editor CDN (Phase 4 Feature 1) -->
-  <script src="https://cdn.jsdelivr.net/npm/monaco-editor@0.45.0/min/vs/loader.js"></script>
-  <style>
-    /* === Reset & Theme === */
-    * { margin: 0; padding: 0; box-sizing: border-box; }
-    :root {
-      --bg: #f7f8fa;
-      --bg-card: #ffffff;
-      --bg-hover: #f1f3f7;
-      --bg-secondary: #f7f8fa;
-      --border: #e4e7ec;
-      --border-hover: #cfd4dc;
-      --text: #111827;
-      --text-muted: #4b5563;
-      --text-dim: #9ca3af;
-      --primary: #4f46e5;
-      --primary-hover: #4338ca;
-      --primary-soft: #eef2ff;
-      --primary-border: #c7d2fe;
-      --green: #16a34a; --green-soft: #dcfce7;
-      --yellow: #d97706; --yellow-soft: #fef3c7;
-      --red: #dc2626; --red-soft: #fee2e2;
-      --blue: #2563eb; --blue-soft: #dbeafe;
-      --purple: #7c3aed; --purple-soft: #ede9fe;
-      --radius: 10px;
-      --radius-sm: 6px;
-      --shadow-sm: 0 1px 2px rgba(16,24,40,0.04);
-      --shadow: 0 1px 3px rgba(16,24,40,0.06), 0 1px 2px rgba(16,24,40,0.04);
-      --shadow-lg: 0 4px 12px rgba(16,24,40,0.08);
-      --sidebar-width: 240px;
-      --drawer-width: 520px;
-    }
-    html, body { height: 100%; }
-    body {
-      font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', sans-serif;
-      background: var(--bg);
-      color: var(--text);
-      line-height: 1.55;
-      -webkit-font-smoothing: antialiased;
-    }
-    /* === Layout === */
-    .app { display: flex; min-height: 100vh; position: relative; }
-    /* Sidebar */
-    .sidebar {
-      width: var(--sidebar-width);
-      background: var(--bg-card);
-      border-right: 1px solid var(--border);
-      padding: 1.25rem 0.75rem;
-      position: fixed; top: 0; left: 0; bottom: 0;
-      display: flex; flex-direction: column;
-      overflow-y: auto;
-      z-index: 100;
-    }
-    .sidebar .brand {
-      display: flex; align-items: center; gap: 0.625rem;
-      padding: 0.5rem 0.75rem 1.25rem;
-      border-bottom: 1px solid var(--border);
-      margin-bottom: 1rem;
-    }
-    .sidebar .brand-icon {
-      width: 32px; height: 32px; border-radius: 8px;
-      background: linear-gradient(135deg, var(--primary), var(--purple));
-      display: flex; align-items: center; justify-content: center;
-      color: white; font-weight: 700; font-size: 0.95rem;
-      box-shadow: var(--shadow);
-    }
-    .sidebar .brand-text {
-      font-weight: 600; font-size: 0.95rem;
-      color: var(--text); letter-spacing: -0.01em;
-    }
-    .sidebar .nav-section-title {
-      font-size: 0.7rem; font-weight: 600; color: var(--text-dim);
-      text-transform: uppercase; letter-spacing: 0.06em;
-      padding: 0.75rem 0.875rem 0.375rem;
-    }
-    .sidebar a {
-      display: flex; align-items: center; gap: 0.625rem;
-      padding: 0.5rem 0.875rem; margin: 1px 0;
-      color: var(--text-muted); text-decoration: none;
-      border-radius: var(--radius-sm); cursor: pointer;
-      font-size: 0.875rem; font-weight: 500;
-      transition: background 0.15s, color 0.15s;
-    }
-    .sidebar a:hover { background: var(--bg-hover); color: var(--text); }
-    .sidebar a.active {
-      background: var(--primary-soft);
-      color: var(--primary);
-    }
-    .nav-icon { width: 18px; height: 18px; flex-shrink: 0; }
-    /* Main content */
-    .main {
-      flex: 1;
-      margin-left: var(--sidebar-width);
-      min-height: 100vh;
-    }
-    .topbar {
-      height: 60px;
-      background: var(--bg-card);
-      border-bottom: 1px solid var(--border);
-      display: flex;
-      align-items: center;
-      justify-content: space-between;
-      padding: 0 1.75rem;
-      position: sticky;
-      top: 0;
-      z-index: 50;
-    }
-    .topbar .page-title {
-      font-size: 1rem;
-      font-weight: 600;
-      color: var(--text);
-    }
-    .topbar .actions {
-      display: flex;
-      gap: 0.5rem;
-      align-items: center;
-    }
-    .container {
-      padding: 1.5rem 1.75rem;
-      max-width: 1400px;
-    }
-    .page {
-      display: none;
-    }
-    .page.active {
-      display: block;
-    }
-    /* Drawer (侧边抽屉) */
-    .drawer-overlay {
-      position: fixed;
-      top: 0;
-      left: 0;
-      right: 0;
-      bottom: 0;
-      background: rgba(0, 0, 0, 0.4);
-      z-index: 200;
-      opacity: 0;
-      visibility: hidden;
-      transition: opacity 0.2s, visibility 0.2s;
-    }
-    .drawer-overlay.active {
-      opacity: 1;
-      visibility: visible;
-    }
-    .drawer {
-      position: fixed;
-      top: 0;
-      right: 0;
-      bottom: 0;
-      width: var(--drawer-width);
-      background: var(--bg-card);
-      border-left: 1px solid var(--border);
-      box-shadow: var(--shadow-lg);
-      z-index: 201;
-      display: flex;
-      flex-direction: column;
-      transform: translateX(100%);
-      transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);
-    }
-    .drawer.active {
-      transform: translateX(0);
-    }
-    .drawer-header {
-      display: flex;
-      align-items: center;
-      justify-content: space-between;
-      padding: 1.25rem 1.5rem;
-      border-bottom: 1px solid var(--border);
-      flex-shrink: 0;
-    }
-    .drawer-title {
-      font-size: 1rem;
-      font-weight: 600;
-      color: var(--text);
-    }
-    .drawer-close {
-      width: 32px; height: 32px;
-      border-radius: var(--radius-sm);
-      border: 1px solid var(--border);
-      background: var(--bg-card);
-      cursor: pointer;
-      display: flex; align-items: center; justify-content: center;
-      color: var(--text-muted);
-      transition: all 0.15s;
-    }
-    .drawer-close:hover {
-      background: var(--bg-hover);
-      color: var(--text);
-    }
-    .drawer-body {
-      flex: 1;
-      overflow-y: auto;
-      padding: 1.5rem;
-    }
-    /* === Typography === */
-    h1 { font-size: 1.375rem; font-weight: 600; margin-bottom: 1.25rem; letter-spacing: -0.02em; }
-    h2 { font-size: 1.05rem; font-weight: 600; letter-spacing: -0.01em; }
-    h3 { font-size: 0.9rem; font-weight: 600; }
-    /* === Stat cards === */
-    .cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 1rem; margin-bottom: 1.5rem; }
-    .stat-card {
-      background: var(--bg-card);
-      border: 1px solid var(--border);
-      border-radius: var(--radius);
-      padding: 1.125rem 1.25rem;
-      box-shadow: var(--shadow-sm);
-    }
-    .stat-card .label { font-size: 0.75rem; color: var(--text-dim); text-transform: uppercase; letter-spacing: 0.04em; font-weight: 500; }
-    .stat-card .value { font-size: 1.75rem; font-weight: 700; margin-top: 0.25rem; color: var(--text); letter-spacing: -0.02em; }
-    /* === Grid layouts === */
-    .grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 1.25rem; }
-    .grid-3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 1.25rem; }
-    @media (max-width: 900px) { .grid-2, .grid-3 { grid-template-columns: 1fr; } }
-    /* === Panel (white box) === */
-    .panel {
-      background: var(--bg-card);
-      border: 1px solid var(--border);
-      border-radius: var(--radius);
-      box-shadow: var(--shadow-sm);
-      overflow: hidden;
-    }
-    .panel-header {
-      display: flex; align-items: center; justify-content: space-between;
-      padding: 1rem 1.25rem;
-      border-bottom: 1px solid var(--border);
-    }
-    .panel-title { font-size: 0.875rem; font-weight: 600; color: var(--text); }
-    .panel-body { padding: 1.25rem; }
-    /* === Table === */
-    table { width: 100%; border-collapse: collapse; }
-    th, td { padding: 0.75rem 1rem; text-align: left; border-bottom: 1px solid var(--border); }
-    th { background: var(--bg-secondary); color: var(--text-muted); font-weight: 600; font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.05em; }
-    td { font-size: 0.875rem; color: var(--text); }
-    tr:last-child td { border-bottom: none; }
-    tr:hover td { background: var(--bg-hover); cursor: pointer; }
-    /* === Badges === */
-    .badge { display: inline-flex; align-items: center; padding: 2px 8px; border-radius: 999px; font-size: 0.7rem; font-weight: 500; }
-    .badge-block { background: var(--red-soft); color: var(--red); }
-    .badge-warn { background: var(--yellow-soft); color: var(--yellow); }
-    .badge-allow { background: var(--green-soft); color: var(--green); }
-    .badge-info { background: var(--primary-soft); color: var(--primary); }
-    .badge-live { background: var(--red-soft); color: var(--red); animation: pulse 1.5s infinite; }
-    @keyframes pulse { 0%,100% { opacity: 1; } 50% { opacity: 0.5; } }
-    /* === Buttons === */
-    .btn { background: var(--bg-card); color: var(--text-muted); border: 1px solid var(--border); padding: 0.45rem 0.875rem; border-radius: var(--radius-sm); cursor: pointer; font-size: 0.8125rem; font-weight: 500; transition: all 0.15s; }
-    .btn:hover { border-color: var(--border-hover); color: var(--text); background: var(--bg-hover); }
-    .btn-primary { background: var(--primary); color: white; border-color: var(--primary); }
-    .btn-primary:hover { background: var(--primary-hover); border-color: var(--primary-hover); color: white; }
-    select.btn { appearance: none; padding-right: 1.75rem; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%234b5563' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 0.6rem center; }
-    /* === Search === */
-    .search-box { padding: 0.55rem 0.875rem; background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius-sm); color: var(--text); font-size: 0.875rem; transition: border-color 0.15s, box-shadow 0.15s; min-width: 240px; }
-    .search-box::placeholder { color: var(--text-dim); }
-    .search-box:focus { outline: none; border-color: var(--primary); box-shadow: 0 0 0 3px rgba(79,70,229,0.12); }
-    /* === Toolbar (above tables/lists) === */
-    .toolbar { display: flex; align-items: center; gap: 0.75rem; margin-bottom: 1rem; flex-wrap: wrap; }
-    /* === List items === */
-    .list-item {
-      display: flex; align-items: center; justify-content: space-between;
-      padding: 0.875rem 1.25rem;
-      border-bottom: 1px solid var(--border);
-      cursor: pointer;
-      transition: background 0.12s;
-    }
-    .list-item:last-child { border-bottom: none; }
-    .list-item:hover { background: var(--bg-hover); }
-    .list-item.selected { background: var(--primary-soft); }
-    /* === Empty state === */
-    .empty { text-align: center; padding: 3rem 1rem; color: var(--text-dim); }
-    .empty-icon { font-size: 2rem; margin-bottom: 0.75rem; }
-    .empty-text { font-size: 0.875rem; }
-    /* === Loading === */
-    .loading { text-align: center; padding: 2rem; color: var(--text-dim); font-size: 0.875rem; }
-    /* === Tags === */
-    .tag { display: inline-block; padding: 2px 8px; border-radius: 4px; font-size: 0.7rem; background: var(--bg-secondary); color: var(--text-muted); border: 1px solid var(--border); margin-right: 0.25rem; }
-    /* === Detail sections in drawer === */
-    .detail-section { margin-bottom: 1.5rem; }
-    .detail-label { font-size: 0.75rem; font-weight: 600; color: var(--text-dim); text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 0.375rem; }
-    .detail-value { font-size: 0.875rem; color: var(--text); }
-    pre.detail-code { font-family: ui-monospace, monospace; font-size: 0.8rem; background: var(--bg-secondary); border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 0.75rem; overflow-x: auto; white-space: pre-wrap; }
-    /* === Live log === */
-    .live-log { font-family: ui-monospace, monospace; font-size: 0.8rem; max-height: 65vh; overflow-y: auto; background: #0f172a; color: #e2e8f0; border-radius: var(--radius); padding: 1rem; }
-    .live-log-line { padding: 2px 0; border-bottom: 1px solid #1e293b; }
-    /* === Chart container === */
-    .chart-wrap { position: relative; height: 220px; }
-    /* === Animations === */
-    @keyframes fadeIn { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: translateY(0); } }
-    .fade-in { animation: fadeIn 0.2s ease-out; }
-    /* === Activity feed === */
-    .activity-item { display: flex; gap: 0.75rem; padding: 0.625rem 0; border-bottom: 1px solid var(--border); }
-    .activity-item:last-child { border-bottom: none; }
-    .activity-dot { width: 8px; height: 8px; border-radius: 50%; margin-top: 6px; flex-shrink: 0; }
-    .activity-dot-green { background: var(--green); }
-    .activity-dot-blue { background: var(--blue); }
-    .activity-dot-yellow { background: var(--yellow); }
-    .activity-dot-red { background: var(--red); }
-    .activity-content { flex: 1; min-width: 0; }
-    .activity-title { font-size: 0.8125rem; color: var(--text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
-    .activity-time { font-size: 0.75rem; color: var(--text-dim); margin-top: 1px; }
-  </style>
-</head>
-<body>
-<div class="app">
-  <!-- Sidebar -->
-  <aside class="sidebar">
-    <div class="brand">
-      <div class="brand-icon">CF</div>
-      <div class="brand-text">Claude Forge</div>
-    </div>
-    <div class="nav-section-title">总览</div>
-    <a onclick="nav('dashboard')" id="nav-dashboard" class="active">
-      <svg class="nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="3" y="3" width="7" height="7"/><rect x="14" y="3" width="7" height="7"/><rect x="14" y="14" width="7" height="7"/><rect x="3" y="14" width="7" height="7"/></svg>
-      仪表盘
-    </a>
-    <div class="nav-section-title">活动</div>
-    <a onclick="nav('sessions')" id="nav-sessions">
-      <svg class="nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"/></svg>
-      会话
-    </a>
-    <a onclick="nav('events')" id="nav-events">
-      <svg class="nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="22 12 18 12 15 21 9 3 6 12 2 12"/></svg>
-      事件
-    </a>
-    <a onclick="nav('injections')" id="nav-injections">
-      <svg class="nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M12 2L2 7l10 5 10-5-10-5z"/><path d="M2 17l10 5 10-5"/><path d="M2 12l10 5 10-5"/></svg>
-      注入
-    </a>
-    <a onclick="nav('execution-trace')" id="nav-execution-trace">
-      <svg class="nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="22 12 18 12 15 21 9 3 6 12 2 12"/></svg>
-      执行追踪
-    </a>
-    <div class="nav-section-title">配置</div>
-    <a onclick="nav('agents')" id="nav-agents">
-      <svg class="nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"/><circle cx="9" cy="7" r="4"/><path d="M23 21v-2a4 4 0 0 0-3-3.87"/><path d="M16 3.13a4 4 0 0 1 0 7.75"/></svg>
-      Agent 管理
-    </a>
-    <a onclick="nav('skills')" id="nav-skills">
-      <svg class="nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z"/></svg>
-      Skill 管理
-    </a>
-    <a onclick="nav('ai-config')" id="nav-ai-config">
-      <svg class="nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="3"/><path d="M12 1v6m0 6v6M5.6 5.6l4.2 4.2m4.2 4.2l4.2 4.2M1 12h6m6 0h6M5.6 18.4l4.2-4.2m4.2-4.2l4.2-4.2"/></svg>
-      AI 配置
-    </a>
-    <a onclick="nav('routing')" id="nav-routing">
-      <svg class="nav-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="6" cy="6" r="3"/><circle cx="18" cy="6" r="3"/><circle cx="6" cy="18" r="3"/><path d="M9 6h9M6 9v9"/></svg>
-      Agent 路由
-    </a>
-  </aside>
-  <!-- Main -->
-  <main class="main">
-    <div class="topbar">
-      <div class="page-title" id="topbar-title">仪表盘</div>
-      <div class="actions">
-        <span id="daemon-status" class="badge badge-allow" style="font-size:0.75rem">检查中...</span>
-        <button class="btn" onclick="refreshPage()">↻ 刷新</button>
-      </div>
-    </div>
-    <div class="container">
-      <!-- Dashboard -->
-      <div id="page-dashboard" class="page active">
-        <div class="cards" id="dash-stats"></div>
-        <div class="grid-2" style="margin-bottom:1.25rem">
-          <div class="panel">
-            <div class="panel-header">
-              <span class="panel-title">近 7 天活动</span>
-            </div>
-            <div class="panel-body"><div class="chart-wrap"><canvas id="chart-activity"></canvas></div></div>
-          </div>
-          <div class="panel">
-            <div class="panel-header">
-              <span class="panel-title">工具使用分布</span>
-            </div>
-            <div class="panel-body"><div class="chart-wrap"><canvas id="chart-tools"></canvas></div></div>
-          </div>
-        </div>
-        <div class="grid-2">
-          <div class="panel">
-            <div class="panel-header">
-              <span class="panel-title">最近会话</span>
-              <a onclick="nav('sessions')" style="font-size:0.8rem;color:var(--primary);cursor:pointer">查看全部 →</a>
-            </div>
-            <div id="dash-sessions"></div>
-          </div>
-          <div class="panel">
-            <div class="panel-header">
-              <span class="panel-title">最近活动</span>
-            </div>
-            <div class="panel-body" id="dash-activity"></div>
-          </div>
-        </div>
-      </div>
-      <!-- Sessions -->
-      <div id="page-sessions" class="page">
-        <div class="toolbar">
-          <input class="search-box" id="sessions-search" placeholder="搜索会话..." oninput="filterSessions()">
-        </div>
-        <div class="panel" id="sessions-panel">
-          <div id="sessions-list"></div>
-        </div>
-      </div>
-      <!-- Events -->
-      <div id="page-events" class="page">
-        <div class="toolbar">
-          <input class="search-box" id="events-search" placeholder="按类型、工具、项目搜索..." oninput="filterEvents()">
-          <select class="btn" id="events-type" onchange="filterEvents()">
-            <option value="">全部类型</option>
-            <option value="PreToolUse">PreToolUse</option>
-            <option value="PostToolUse">PostToolUse</option>
-            <option value="UserPromptSubmit">UserPromptSubmit</option>
-            <option value="Stop">Stop</option>
-          </select>
-        </div>
-        <div class="panel">
-          <table>
-            <thead><tr><th>时间</th><th>类型</th><th>工具</th><th>项目</th></tr></thead>
-            <tbody id="events-body"></tbody>
-          </table>
-        </div>
-      </div>
-      <!-- Injections -->
-      <div id="page-injections" class="page">
-        <div class="toolbar">
-          <input class="search-box" id="inj-search" placeholder="搜索注入内容..." oninput="filterInjections()">
-          <select class="btn" id="inj-handler" onchange="filterInjections()">
-            <option value="">全部 Handler</option>
-            <option value="UserPromptSubmitHandler">UserPromptSubmit</option>
-            <option value="PreToolUseHandler">PreToolUse</option>
-            <option value="PostToolUseHandler">PostToolUse</option>
-          </select>
-        </div>
-        <div class="panel" id="inj-panel">
-          <div id="inj-list"></div>
-        </div>
-      </div>
-      <!-- AI Config -->
-      <div id="page-ai-config" class="page">
-        <div class="panel">
-          <div class="panel-header">
-            <span class="panel-title">AI 配置</span>
-            <div style="display:flex;gap:0.5rem">
-              <button class="btn" onclick="testAIConnection()">🔌 测试连接</button>
-              <button class="btn btn-primary" onclick="saveAIConfig()">💾 保存</button>
-            </div>
-          </div>
-          <div class="panel-body">
-            <div style="max-width:600px">
-              <div style="margin-bottom:1rem">
-                <label style="display:block;margin-bottom:0.25rem;font-weight:500;font-size:0.875rem">API Key</label>
-                <div style="display:flex;gap:0.5rem">
-                  <input type="password" id="ai-api-key" class="search-box" style="flex:1" placeholder="sk-...">
-                  <button class="btn" onclick="toggleAPIKeyVisibility()" id="toggle-api-key-btn">👁️ 显示</button>
-                </div>
-              </div>
-              <div style="margin-bottom:1rem">
-                <label style="display:block;margin-bottom:0.25rem;font-weight:500;font-size:0.875rem">Base URL</label>
-                <input type="text" id="ai-base-url" class="search-box" placeholder="https://api.anthropic.com">
-              </div>
-              <div style="margin-bottom:1rem">
-                <label style="display:block;margin-bottom:0.25rem;font-weight:500;font-size:0.875rem">Provider</label>
-                <input type="text" id="ai-provider" class="search-box" value="anthropic" readonly style="background:var(--bg-secondary)">
-              </div>
-              <div style="margin-bottom:1rem">
-                <label style="display:block;margin-bottom:0.25rem;font-weight:500;font-size:0.875rem">Model</label>
-                <div style="display:flex;gap:0.5rem">
-                  <select id="ai-model" class="btn" style="flex:1">
-                    <option value="">加载中...</option>
-                  </select>
-                  <button class="btn" onclick="refreshAIModels()">↻ 刷新模型列表</button>
-                </div>
-                <div style="margin-top:0.25rem;font-size:0.75rem;color:var(--text-dim)">主模型：用于 Distiller（会话提炼）和 QualityGate（质量检查）</div>
-              </div>
-              <div style="margin-bottom:1rem">
-                <label style="display:block;margin-bottom:0.25rem;font-weight:500;font-size:0.875rem">意图分类模型</label>
-                <select id="ai-classifier-model" class="btn" style="width:100%">
-                  <option value="">(与主模型相同)</option>
-                </select>
-                <div style="margin-top:0.25rem;font-size:0.75rem;color:var(--text-dim)">用于 UserPromptSubmit 意图识别。建议选 haiku 类小模型（更快，10s 内完成）</div>
-              </div>
-              <div style="margin-bottom:1rem">
-                <label style="display:block;margin-bottom:0.25rem;font-weight:500;font-size:0.875rem">分类超时（毫秒）</label>
-                <input type="number" id="ai-classifier-timeout" class="search-box" placeholder="10000" min="1000" max="60000" step="1000">
-                <div style="margin-top:0.25rem;font-size:0.75rem;color:var(--text-dim)">超过此时间会降级为正则兜底。默认 10000ms</div>
-              </div>
-              <div id="ai-config-success" style="margin-top:1rem;padding:0.75rem;background:var(--primary);color:white;border-radius:var(--radius-sm);display:none"></div>
-              <div id="ai-config-error" style="margin-top:1rem;padding:0.75rem;background:var(--red);color:white;border-radius:var(--radius-sm);display:none"></div>
-              <div style="margin-top:1rem;padding:0.75rem;background:var(--bg-secondary);border-radius:var(--radius-sm);font-size:0.875rem;color:var(--text-muted)">
-                <strong>提示：</strong>配置保存后需要重启 daemon 才能生效。<br>
-                运行 <code style="background:var(--bg-card);padding:0.125rem 0.375rem;border-radius:4px">cf daemon stop && cf daemon start</code>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-      <!-- Execution Trace -->
-      <div id="page-execution-trace" class="page">
-        <div class="toolbar">
-          <input class="search-box" id="trace-search" placeholder="搜索 prompt..." oninput="filterTraces()">
-          <select class="btn" id="trace-agent-filter" onchange="loadExecutionTraces()">
-            <option value="">全部 Agent/Skill</option>
-          </select>
-          <select class="btn" id="trace-obeyed-filter" onchange="loadExecutionTraces()">
-            <option value="">全部状态</option>
-            <option value="true">✓ 已遵守</option>
-            <option value="false">✗ 违抗</option>
-          </select>
-          <button class="btn" onclick="loadExecutionTraces()">↻ 刷新</button>
-        </div>
-        <div class="panel" style="margin-bottom:1rem">
-          <div class="panel-header"><span class="panel-title">实时状态</span></div>
-          <div class="panel-body">
-            <div id="trace-live-status" style="max-height:200px;overflow-y:auto;font-size:0.875rem"></div>
-          </div>
-        </div>
-        <div class="panel">
-          <div class="panel-body">
-            <div id="trace-list"></div>
-          </div>
-        </div>
-      </div>
-      <!-- Agent Management -->
-      <div id="page-agents" class="page">
-        <div class="panel">
-          <div class="panel-header">
-            <span class="panel-title">Agent 管理</span>
-            <button class="btn" onclick="loadAgents()">↻ 刷新</button>
-          </div>
-          <div class="panel-body">
-            <table>
-              <thead>
-                <tr>
-                  <th>名称</th>
-                  <th>描述</th>
-                  <th>分类</th>
-                  <th>版本</th>
-                  <th>来源</th>
-                  <th>操作</th>
-                </tr>
-              </thead>
-              <tbody id="agents-body"></tbody>
-            </table>
-          </div>
-        </div>
-      </div>
-      <!-- Skill Management -->
-      <div id="page-skills" class="page">
-        <div class="panel">
-          <div class="panel-header">
-            <span class="panel-title">Skill 管理</span>
-            <button class="btn" onclick="loadSkills()">↻ 刷新</button>
-          </div>
-          <div class="panel-body">
-            <table>
-              <thead>
-                <tr>
-                  <th>名称</th>
-                  <th>描述</th>
-                  <th>版本</th>
-                  <th>来源</th>
-                  <th>操作</th>
-                </tr>
-              </thead>
-              <tbody id="skills-body"></tbody>
-            </table>
-          </div>
-        </div>
-      </div>
-      <!-- Agent Routing -->
-      <div id="page-routing" class="page">
-        <div class="toolbar" style="display:flex;gap:0.5rem;align-items:center">
-          <div style="display:inline-flex;border:1px solid var(--border);border-radius:var(--radius-sm);overflow:hidden">
-            <button class="btn" id="routing-tab-overview" onclick="routingTab('overview')" style="border-radius:0;border:none">总览</button>
-            <button class="btn" id="routing-tab-events" onclick="routingTab('events')" style="border-radius:0;border:none">决策明细</button>
-            <button class="btn" id="routing-tab-refusals" onclick="routingTab('refusals')" style="border-radius:0;border:none">违抗聚合</button>
-            <button class="btn" id="routing-tab-performance" onclick="routingTab('performance')" style="border-radius:0;border:none">性能分析</button>
-            <button class="btn" id="routing-tab-ai-optimization" onclick="routingTab('ai-optimization')" style="border-radius:0;border:none">AI 优化</button>
-            <button class="btn" id="routing-tab-editor" onclick="routingTab('editor')" style="border-radius:0;border:none">路由调优</button>
-            <button class="btn" id="routing-tab-experiments" onclick="routingTab('experiments')" style="border-radius:0;border:none">A/B 测试</button>
-            <button class="btn" id="routing-tab-recommendations" onclick="routingTab('recommendations')" style="border-radius:0;border:none">规则推荐</button>
-          </div>
-          <div style="flex:1"></div>
-          <select class="btn" id="routing-window" onchange="loadRouting()" style="display:none">
-            <option value="24">近 24 小时</option>
-            <option value="168" selected>近 7 天</option>
-            <option value="720">近 30 天</option>
-          </select>
-        </div>
-        <!-- Overview subpanel -->
-        <div id="routing-sub-overview">
-          <div class="cards" id="routing-cards"></div>
-          <div class="grid-2" style="margin-top:1.25rem">
-            <div class="panel">
-              <div class="panel-header"><span class="panel-title">按 Agent 听话率</span></div>
-              <div class="panel-body" id="routing-by-agent"></div>
-            </div>
-            <div class="panel">
-              <div class="panel-header"><span class="panel-title">注入话术版本 A/B</span></div>
-              <div class="panel-body" id="routing-by-version"></div>
-            </div>
-          </div>
-        </div>
-        <!-- Events subpanel -->
-        <div id="routing-sub-events" style="display:none">
-          <div class="toolbar" style="display:flex;gap:0.5rem">
-            <select class="btn" id="routing-filter-obeyed" onchange="loadRoutingEvents()">
-              <option value="">全部状态</option>
-              <option value="forced">已强路由</option>
-              <option value="1">遵守 (obeyed)</option>
-              <option value="0">违抗 (refused)</option>
-              <option value="null">待判定/未路由</option>
-            </select>
-            <input class="search-box" id="routing-filter-agent" placeholder="按 agent 名过滤..." oninput="loadRoutingEvents()">
-          </div>
-          <div class="panel">
-            <table>
-              <thead><tr><th>时间</th><th>Agent</th><th>状态</th><th>首个工具</th><th>Prompt 摘要</th></tr></thead>
-              <tbody id="routing-events-tbody"></tbody>
-            </table>
-          </div>
-        </div>
-        <!-- Refusals subpanel -->
-        <div id="routing-sub-refusals" style="display:none">
-          <div class="panel">
-            <div class="panel-header"><span class="panel-title">违抗聚合 (taskType × agent)</span></div>
-            <div class="panel-body" id="routing-refusals"></div>
-          </div>
-        </div>
-        <!-- Performance subpanel -->
-        <div id="routing-sub-performance" style="display:none">
-          <div class="cards" id="routing-performance-cards"></div>
-          <div class="grid-2" style="margin-top:1.25rem">
-            <div class="panel">
-              <div class="panel-header"><span class="panel-title">每日路由趋势</span></div>
-              <div class="panel-body"><div class="chart-wrap"><canvas id="chart-routing-trend"></canvas></div></div>
-            </div>
-            <div class="panel">
-              <div class="panel-header"><span class="panel-title">平均真实执行耗时趋势</span></div>
-              <div class="panel-body"><div class="chart-wrap"><canvas id="chart-routing-latency"></canvas></div></div>
-            </div>
-          </div>
-          <div class="grid-2" style="margin-top:1.25rem">
-            <div class="panel">
-              <div class="panel-header"><span class="panel-title">Per-agent 指标</span></div>
-              <div class="panel-body">
-                <table>
-                  <thead><tr><th>Agent</th><th>总次数</th><th>已判定</th><th>遵守率</th><th>违抗率</th><th>分类耗时</th><th>真实耗时</th></tr></thead>
-                  <tbody id="routing-performance-by-agent"></tbody>
-                </table>
-              </div>
-            </div>
-            <div class="panel">
-              <div class="panel-header"><span class="panel-title">高违抗率榜单</span></div>
-              <div class="panel-body" id="routing-high-refusal"></div>
-            </div>
-          </div>
-        </div>
-        <!-- AI optimization subpanel -->
-        <div id="routing-sub-ai-optimization" style="display:none">
-          <div class="panel">
-            <div class="panel-header">
-              <span class="panel-title">AI 优化建议</span>
-              <div style="display:flex;gap:0.5rem;align-items:center">
-                <label style="font-size:0.875rem;color:var(--text-dim)">最小样本
-                  <input id="ai-opt-min-attempts" type="number" value="10" min="1" max="100" style="width:72px;margin-left:0.25rem" class="btn">
-                </label>
-                <button class="btn" onclick="loadRoutingAIOptimization()">↻ 生成建议</button>
-              </div>
-            </div>
-            <div class="panel-body">
-              <div style="margin-bottom:0.75rem;font-size:0.875rem;color:var(--text-dim)">
-                基于高违抗率 agent、规则推荐、执行追踪证据，由 AI 生成针对 agent / skill / routing rule 的优化建议。
-              </div>
-              <div id="routing-ai-optimization"></div>
-            </div>
-          </div>
-        </div>
-        <!-- Editor subpanel (Phase 3 Feature 2, upgraded to Monaco in Phase 4 Feature 1) -->
-        <div id="routing-sub-editor" style="display:none">
-          <div class="panel">
-            <div class="panel-header">
-              <span class="panel-title">路由配置编辑器</span>
-              <div style="display:flex;gap:0.5rem">
-                <button class="btn" onclick="loadRoutingConfig()">↻ 重新加载</button>
-                <button class="btn btn-primary" onclick="saveRoutingConfig()">💾 保存</button>
-              </div>
-            </div>
-            <div class="panel-body">
-              <div style="margin-bottom:0.5rem;font-size:0.875rem;color:var(--text-dim)">
-                <span id="routing-config-source"></span>
-                <span id="routing-config-path" style="font-family:monospace;margin-left:0.5rem"></span>
-              </div>
-              <div id="routing-config-editor" style="width:100%;height:500px;border:1px solid var(--border);border-radius:var(--radius-sm)"></div>
-              <div id="routing-config-error" style="margin-top:0.5rem;padding:0.75rem;background:var(--danger,#dc2626);color:white;border-radius:var(--radius-sm);display:none"></div>
-              <div id="routing-config-success" style="margin-top:0.5rem;padding:0.75rem;background:var(--primary);color:white;border-radius:var(--radius-sm);display:none"></div>
-            </div>
-          </div>
-        </div>
-        <!-- Experiments subpanel (Phase 5 Feature 1) -->
-        <div id="routing-sub-experiments" style="display:none">
-          <div class="panel" style="margin-bottom:1rem">
-            <div class="panel-header">
-              <span class="panel-title">实验配置</span>
-              <div style="display:flex;gap:0.5rem">
-                <button class="btn" onclick="loadExperimentsConfig()">↻ 重新加载</button>
-                <button class="btn btn-primary" onclick="saveExperimentsConfig()">💾 保存</button>
-              </div>
-            </div>
-            <div class="panel-body">
-              <div style="margin-bottom:0.5rem;font-size:0.875rem;color:var(--text-dim)">
-                <span id="experiments-config-source"></span>
-                <span id="experiments-config-path" style="font-family:monospace;margin-left:0.5rem"></span>
-              </div>
-              <div id="experiments-config-editor" style="width:100%;height:400px;border:1px solid var(--border);border-radius:var(--radius-sm)"></div>
-              <div id="experiments-config-error" style="margin-top:0.5rem;padding:0.75rem;background:var(--danger,#dc2626);color:white;border-radius:var(--radius-sm);display:none"></div>
-              <div id="experiments-config-success" style="margin-top:0.5rem;padding:0.75rem;background:var(--primary);color:white;border-radius:var(--radius-sm);display:none"></div>
-            </div>
-          </div>
-          <div class="panel">
-            <div class="panel-header">
-              <span class="panel-title">分析对比</span>
-              <div style="display:flex;gap:0.5rem">
-                <button class="btn" onclick="loadExperimentsAnalysis()">↻ 刷新分析</button>
-              </div>
-            </div>
-            <div class="panel-body">
-              <div id="experiments-summary" style="margin-bottom:1rem;font-size:0.875rem"></div>
-              <div id="experiments-analysis"></div>
-              <div id="experiments-winner" style="margin-top:1rem;display:none"></div>
-            </div>
-          </div>
-        </div>
-        <!-- Recommendations subpanel (Phase 5 Feature 3) -->
-        <div id="routing-sub-recommendations" style="display:none">
-          <div class="panel">
-            <div class="panel-header">
-              <span class="panel-title">规则推荐</span>
-              <div style="display:flex;gap:0.5rem;align-items:center">
-                <label style="font-size:0.875rem;color:var(--text-dim)">窗口
-                  <select class="btn" id="recommendations-days" onchange="loadRecommendations()">
-                    <option value="1">1 天</option>
-                    <option value="7" selected>7 天</option>
-                    <option value="30">30 天</option>
-                  </select>
-                </label>
-                <button class="btn" onclick="loadRecommendations()">↻ 刷新</button>
-              </div>
-            </div>
-            <div class="panel-body">
-              <div style="margin-bottom:0.75rem;font-size:0.875rem;color:var(--text-dim)">
-                基于历史决策分析，对比"当前路由规则"与"Claude 实际使用的 agent"，
-                推荐更贴近实际行为的路由。<br>
-                样本阈值：单类任务 ≥ 10 条；挑战者使用率 &gt; 50%。
-              </div>
-              <div id="recommendations-list"></div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div><!-- /container -->
-  </main>
-  <!-- Drawer overlay -->
-  <div class="drawer-overlay" id="drawer-overlay" onclick="closeDrawer()"></div>
-  <!-- Drawer -->
-  <div class="drawer" id="drawer">
-    <div class="drawer-header">
-      <div class="drawer-title" id="drawer-title">详情</div>
-      <button class="drawer-close" onclick="closeDrawer()">
-        <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="18" y1="6" x2="6" y2="18"/><line x1="6" y1="6" x2="18" y2="18"/></svg>
-      </button>
-    </div>
-    <div class="drawer-body" id="drawer-body"></div>
-  </div>
-</div><!-- /app -->
-<script>
-const API = '';
-let allEvents = [], allSessions = [], allInjections = [];
-let charts = {};
-let traceStream = null;
-let traceRefreshTimer = null;
-let currentPatchPreview = null;
-let currentAIOptimizationData = null;
-// === Navigation ===
-function nav(page) {
-  document.querySelectorAll('.sidebar a').forEach(a => a.classList.remove('active'));
-  document.querySelectorAll('.page').forEach(p => p.classList.remove('active'));
-  const navEl = document.getElementById('nav-' + page);
-  const pageEl = document.getElementById('page-' + page);
-  if (navEl) navEl.classList.add('active');
-  if (pageEl) pageEl.classList.add('active');
-  const titles = { dashboard:'仪表盘', sessions:'会话', events:'事件', injections:'注入', 'execution-trace':'执行追踪', agents:'Agent 管理', skills:'Skill 管理', 'ai-config':'AI 配置', routing:'Agent 路由' };
-  document.getElementById('topbar-title').textContent = titles[page] || page;
-  closeDrawer();
-  if (page === 'dashboard') loadDashboard();
-  else if (page === 'sessions') loadSessions();
-  else if (page === 'events') loadEvents();
-  else if (page === 'injections') loadInjections();
-  else if (page === 'execution-trace') loadExecutionTraces();
-  else if (page === 'agents') loadAgents();
-  else if (page === 'skills') loadSkills();
-  else if (page === 'ai-config') loadAIConfig();
-  else if (page === 'routing') loadRouting();
-}
-function refreshPage() {
-  const active = document.querySelector('.page.active');
-  if (active) nav(active.id.replace('page-', ''));
-}
-// === Drawer ===
-function openDrawer(title, html) {
-  document.getElementById('drawer-title').textContent = title;
-  document.getElementById('drawer-body').innerHTML = html;
-  document.getElementById('drawer').classList.add('active');
-  document.getElementById('drawer-overlay').classList.add('active');
-}
-function closeDrawer() {
-  document.getElementById('drawer').classList.remove('active');
-  document.getElementById('drawer-overlay').classList.remove('active');
-}
-// === Helpers ===
-function fmt(ts) {
-  if (!ts) return '—';
-  const d = new Date(String(ts).endsWith('Z') ? ts : ts + 'Z');
-  return d.toLocaleString('zh-CN', { month:'2-digit', day:'2-digit', hour:'2-digit', minute:'2-digit' });
-}
-function fmtTime(ts) {
-  if (!ts) return '—';
-  const d = new Date(String(ts).endsWith('Z') ? ts : ts + 'Z');
-  return d.toLocaleTimeString('zh-CN', { hour:'2-digit', minute:'2-digit', second:'2-digit' });
-}
-function badgeHook(type) {
-  const m = { PreToolUse:'badge-info', PostToolUse:'badge-allow', UserPromptSubmit:'badge-warn', Stop:'badge-warn' };
-  return `<span class="badge ${m[type]||'badge-info'}">${type||'—'}</span>`;
-}
-function empty(msg) {
-  return `<div class="empty"><div class="empty-icon">📭</div><div class="empty-text">${msg}</div></div>`;
-}
-function loading() {
-  return `<div class="loading">加载中...</div>`;
-}
-// === Dashboard ===
-async function loadDashboard() {
-  document.getElementById('dash-stats').innerHTML = loading();
-  try {
-    const [statusRes, statsRes] = await Promise.all([
-      fetch(API + '/api/status'),
-      fetch(API + '/api/stats')
-    ]);
-    const status = await statusRes.json();
-    const stats = await statsRes.json();
-    // Stat cards
-    const uptime = Math.floor(status.uptime);
-    const uptimeStr = uptime < 60 ? uptime + ' 秒' : Math.floor(uptime/60) + ' 分钟';
-    const mem = Math.round(status.memory.heapUsed / 1024 / 1024);
-    document.getElementById('dash-stats').innerHTML = `
-      <div class="stat-card"><div class="label">进程 ID</div><div class="value">${status.pid}</div></div>
-      <div class="stat-card"><div class="label">运行时长</div><div class="value">${uptimeStr}</div></div>
-      <div class="stat-card"><div class="label">内存占用</div><div class="value">${mem}MB</div></div>
-      <div class="stat-card"><div class="label">事件总数</div><div class="value">${status.eventCount}</div></div>
-    `;
-    document.getElementById('daemon-status').textContent = '运行中';
-    document.getElementById('daemon-status').className = 'badge badge-allow';
-    // Charts
-    renderActivityChart(stats.dailyActivity || []);
-    renderToolChart(stats.toolUsage || {});
-  } catch {
-    document.getElementById('dash-stats').innerHTML = `<div class="stat-card"><div class="label">状态</div><div class="value" style="font-size:1rem;color:var(--red)">离线</div></div>`;
-    document.getElementById('daemon-status').textContent = '离线';
-    document.getElementById('daemon-status').className = 'badge badge-block';
-  }
-  // Recent sessions
-  try {
-    const res = await fetch(API + '/api/sessions?limit=5');
-    const sessions = await res.json();
-    document.getElementById('dash-sessions').innerHTML = sessions.length === 0
-      ? empty('暂无会话')
-      : sessions.map(s => sessionListItem(s)).join('');
-  } catch {
-    document.getElementById('dash-sessions').innerHTML = empty('加载失败');
-  }
-  // Recent activity
-  try {
-    const res = await fetch(API + '/api/events?limit=10');
-    const events = await res.json();
-    document.getElementById('dash-activity').innerHTML = events.length === 0
-      ? empty('暂无活动')
-      : events.map(e => `
-        <div class="activity-item">
-          <div class="activity-dot activity-dot-${hookColor(e.hook_type)}"></div>
-          <div class="activity-content">
-            <div class="activity-title">${e.hook_type} ${e.tool_name ? '· ' + e.tool_name : ''}</div>
-            <div class="activity-time">${fmtTime(e.timestamp)}</div>
-          </div>
-        </div>`).join('');
-  } catch {}
-}
-function hookColor(t) {
-  return { PreToolUse:'blue', PostToolUse:'green', UserPromptSubmit:'yellow', Stop:'red' }[t] || 'blue';
-}
-function renderActivityChart(data) {
-  const ctx = document.getElementById('chart-activity');
-  if (!ctx) return;
-  if (charts.activity) charts.activity.destroy();
-  charts.activity = new Chart(ctx, {
-    type: 'line',
-    data: {
-      labels: data.map(d => d.date),
-      datasets: [{ label: '事件数', data: data.map(d => d.count), borderColor: '#4f46e5', backgroundColor: 'rgba(79,70,229,0.08)', tension: 0.3, fill: true }]
-    },
-    options: { responsive: true, maintainAspectRatio: false, plugins: { legend: { display: false } }, scales: { y: { ticks: { color: '#9ca3af' }, grid: { color: '#e4e7ec' } }, x: { ticks: { color: '#9ca3af' }, grid: { color: '#e4e7ec' } } } }
-  });
-}
-function renderToolChart(data) {
-  const ctx = document.getElementById('chart-tools');
-  if (!ctx) return;
-  if (charts.tools) charts.tools.destroy();
-  const labels = Object.keys(data).slice(0, 8);
-  const values = labels.map(k => data[k]);
-  charts.tools = new Chart(ctx, {
-    type: 'doughnut',
-    data: { labels, datasets: [{ data: values, backgroundColor: ['#4f46e5','#16a34a','#d97706','#dc2626','#2563eb','#7c3aed','#0891b2','#db2777'] }] },
-    options: { responsive: true, maintainAspectRatio: false, plugins: { legend: { position: 'right', labels: { color: '#4b5563', boxWidth: 12, font: { size: 11 } } } } }
-  });
-}
-// === Sessions ===
-function sessionListItem(s) {
-  const prompt = (s.first_prompt || '(无提示词)').slice(0, 60);
-  return `<div class="list-item fade-in" onclick="openSessionDrawer('${s.session_id}')">
-    <div style="flex:1;min-width:0">
-      <div style="font-size:0.875rem;font-weight:500;margin-bottom:2px">${prompt}</div>
-      <div style="font-size:0.75rem;color:var(--text-dim)">${fmt(s.start_time)} · ${s.event_count} 个事件 · ${s.session_id.slice(0,8)}</div>
-    </div>
-    <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" style="color:var(--text-dim);flex-shrink:0"><polyline points="9 18 15 12 9 6"/></svg>
-  </div>`;
-}
-async function loadSessions() {
-  document.getElementById('sessions-list').innerHTML = loading();
-  try {
-    const res = await fetch(API + '/api/sessions?limit=50');
-    allSessions = await res.json();
-    renderSessions(allSessions);
-  } catch {
-    document.getElementById('sessions-list').innerHTML = empty('加载会话失败');
-  }
-}
-function renderSessions(list) {
-  document.getElementById('sessions-list').innerHTML = list.length === 0
-    ? empty('未找到会话')
-    : list.map(s => sessionListItem(s)).join('');
-}
-function filterSessions() {
-  const q = document.getElementById('sessions-search').value.toLowerCase();
-  renderSessions(allSessions.filter(s =>
-    (s.first_prompt || '').toLowerCase().includes(q) ||
-    s.session_id.toLowerCase().includes(q)
-  ));
-}
-let currentSessionData = null;
-async function openSessionDrawer(sessionId) {
-  openDrawer('会话详情', loading());
-  try {
-    const res = await fetch(API + '/api/sessions/' + sessionId + '/detail');
-    const data = await res.json();
-    currentSessionData = data;
-    const s = data.session;
-    let html = '<div class="detail-section"><div class="detail-label">会话 ID</div><div class="detail-value" style="font-family:monospace;font-size:0.8rem">' + s.session_id + '</div></div>';
-    html += '<div class="detail-section"><div class="detail-label">时间</div><div class="detail-value">' + fmt(s.start_time) + ' → ' + fmt(s.end_time) + '</div></div>';
-    html += '<div class="detail-section"><div class="detail-label">首条提示词</div><div class="detail-value">' + (s.first_prompt || '—') + '</div></div>';
-    html += '<div class="detail-section"><div class="detail-label">任务（' + data.tasks.length + '）</div>';
-    data.tasks.forEach((t, i) => {
-      const tools = t.events.filter(e => e.tool_name).length;
-      html += '<div onclick="openTaskDrawer(' + i + ')" style="padding:0.75rem;background:var(--bg-secondary);border-radius:var(--radius-sm);margin-bottom:0.5rem;border:1px solid var(--border);cursor:pointer;transition:all 0.15s" onmouseover="this.style.borderColor=\'var(--primary)\';this.style.background=\'var(--primary-soft)\'" onmouseout="this.style.borderColor=\'var(--border)\';this.style.background=\'var(--bg-secondary)\'">';
-      html += '<div style="display:flex;align-items:center;justify-content:space-between;margin-bottom:4px"><div style="font-weight:500;font-size:0.875rem;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-right:0.5rem">任务 ' + (i+1) + '：' + t.title + '</div><svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" style="color:var(--text-dim);flex-shrink:0"><polyline points="9 18 15 12 9 6"/></svg></div>';
-      html += '<div style="font-size:0.75rem;color:var(--text-dim)">' + fmtTime(t.start_time) + ' · ' + tools + ' 次工具调用 · ' + t.summary.filesChanged.length + ' 个文件</div>';
-      if (t.summary.commits.length > 0) html += '<div style="font-size:0.75rem;color:var(--green);margin-top:4px">✓ ' + t.summary.commits.length + ' 次提交</div>';
-      html += '</div>';
-    });
-    html += '</div>';
-    openDrawer('会话 · ' + s.session_id.slice(0,8), html);
-  } catch(e) {
-    openDrawer('会话详情', empty('加载失败：' + e.message));
-  }
-}
-function openTaskDrawer(taskIndex) {
-  if (!currentSessionData || !currentSessionData.tasks[taskIndex]) return;
-  const t = currentSessionData.tasks[taskIndex];
-  const tools = t.events.filter(e => e.tool_name).length;
-  let html = '<div class="detail-section"><div class="detail-label">标题</div><div class="detail-value" style="font-weight:600">' + t.title + '</div></div>';
-  html += '<div class="detail-section"><div class="detail-label">时间</div><div class="detail-value">' + fmt(t.start_time) + (t.end_time ? ' → ' + fmt(t.end_time) : '') + '</div></div>';
-  html += '<div class="detail-section"><div class="detail-label">统计</div><div class="detail-value">' + tools + ' 次工具调用 · ' + t.summary.filesChanged.length + ' 个文件变更 · ' + t.summary.commits.length + ' 次提交</div></div>';
-  // User prompts
-  if (t.prompts && t.prompts.length > 0) {
-    html += '<div class="detail-section"><div class="detail-label">用户提示词（' + t.prompts.length + '）</div>';
-    t.prompts.forEach(p => {
-      html += '<div style="padding:0.625rem;background:var(--bg-secondary);border-radius:var(--radius-sm);margin-bottom:0.375rem;border:1px solid var(--border);font-size:0.8rem">';
-      html += '<div style="color:var(--text-dim);font-size:0.7rem;margin-bottom:2px">' + fmtTime(p.timestamp) + '</div>';
-      html += '<div style="white-space:pre-wrap;word-break:break-word">' + (p.content || '—') + '</div>';
-      html += '</div>';
-    });
-    html += '</div>';
-  }
-  // Tool usage summary
-  if (t.summary.toolUsage && Object.keys(t.summary.toolUsage).length > 0) {
-    html += '<div class="detail-section"><div class="detail-label">工具使用分布</div><div class="detail-value">';
-    Object.entries(t.summary.toolUsage).sort((a,b) => b[1]-a[1]).forEach(([name, count]) => {
-      html += '<span class="tag" style="margin-bottom:4px">' + name + ' × ' + count + '</span>';
-    });
-    html += '</div></div>';
-  }
-  // Files changed
-  if (t.summary.filesChanged && t.summary.filesChanged.length > 0) {
-    html += '<div class="detail-section"><div class="detail-label">变更的文件（' + t.summary.filesChanged.length + '）</div>';
-    t.summary.filesChanged.forEach(f => {
-      const short = f.split('/').slice(-2).join('/');
-      html += '<div style="font-family:monospace;font-size:0.75rem;color:var(--text-muted);padding:2px 0" title="' + f + '">' + short + '</div>';
-    });
-    html += '</div>';
-  }
-  // Commits
-  if (t.summary.commits && t.summary.commits.length > 0) {
-    html += '<div class="detail-section"><div class="detail-label">提交记录（' + t.summary.commits.length + '）</div>';
-    t.summary.commits.forEach(c => {
-      html += '<div style="padding:0.5rem;background:var(--green-soft);border-radius:var(--radius-sm);margin-bottom:0.25rem;font-size:0.8rem;color:var(--text)"><span style="color:var(--green)">✓</span> ' + c.message + '</div>';
-    });
-    html += '</div>';
-  }
-  // Injections
-  if (t.injections && t.injections.length > 0) {
-    html += '<div class="detail-section"><div class="detail-label">注入内容（' + t.injections.length + '）</div>';
-    t.injections.forEach(inj => {
-      const escaped = inj.content.replace(/</g, '&lt;').replace(/>/g, '&gt;');
-      html += '<div style="padding:0.625rem;background:var(--primary-soft);border-radius:var(--radius-sm);margin-bottom:0.375rem;border:1px solid var(--primary-border)">';
-      html += '<div style="display:flex;align-items:center;gap:0.5rem;margin-bottom:4px"><span class="badge badge-info">' + inj.injection_type + '</span><span style="font-size:0.7rem;color:var(--text-dim)">' + inj.source_handler + ' · ' + fmtTime(inj.timestamp) + '</span></div>';
-      html += '<div style="font-size:0.75rem;color:var(--text);white-space:pre-wrap;word-break:break-word;max-height:200px;overflow-y:auto;font-family:ui-monospace,monospace">' + escaped + '</div>';
-      html += '</div>';
-    });
-    html += '</div>';
-  }
-  // Quality issues
-  if (t.qualityIssues && t.qualityIssues.length > 0) {
-    html += '<div class="detail-section"><div class="detail-label">质量问题（' + t.qualityIssues.length + '）</div>';
-    t.qualityIssues.forEach(q => {
-      const sev = q.severity || 'info';
-      const badgeClass = sev === 'must' ? 'badge-block' : sev === 'should' ? 'badge-warn' : 'badge-info';
-      const sevLabel = sev === 'must' ? '必须' : sev === 'should' ? '建议' : '提示';
-      html += '<div style="padding:0.5rem;background:var(--yellow-soft);border-radius:var(--radius-sm);margin-bottom:0.375rem;border:1px solid var(--border);font-size:0.8rem">';
-      html += '<div style="display:flex;gap:0.5rem;align-items:center;margin-bottom:2px"><span class="badge ' + badgeClass + '">' + sevLabel + '</span><span style="font-family:monospace;font-size:0.7rem;color:var(--text-dim)">' + (q.file_path || '').split('/').slice(-2).join('/') + '</span></div>';
-      html += '<div style="color:var(--text)">' + (q.description || q.message || '') + '</div>';
-      html += '</div>';
-    });
-    html += '</div>';
-  }
-  // Governance decisions
-  if (t.decisions && t.decisions.length > 0) {
-    html += '<div class="detail-section"><div class="detail-label">治理决策（' + t.decisions.length + '）</div>';
-    t.decisions.forEach(d => {
-      const lv = d.level || 'info';
-      const badgeClass = lv === 'block' ? 'badge-block' : lv === 'warn' ? 'badge-warn' : lv === 'allow' ? 'badge-allow' : 'badge-info';
-      const lvLabel = lv === 'block' ? '阻断' : lv === 'warn' ? '警告' : lv === 'allow' ? '放行' : lv === 'confirm' ? '确认' : lv;
-      html += '<div style="padding:0.5rem;background:var(--bg-secondary);border-radius:var(--radius-sm);margin-bottom:0.375rem;border:1px solid var(--border);font-size:0.8rem">';
-      html += '<div style="display:flex;gap:0.5rem;align-items:center;margin-bottom:2px"><span class="badge ' + badgeClass + '">' + lvLabel + '</span><span style="font-family:monospace;font-size:0.7rem;color:var(--text-dim)">' + (d.rule_id || '') + '</span></div>';
-      html += '<div style="color:var(--text-muted)">' + (d.reason || '—') + '</div>';
-      html += '</div>';
-    });
-    html += '</div>';
-  }
-  // Recent events
-  if (t.events && t.events.length > 0) {
-    html += '<div class="detail-section"><div class="detail-label">事件（展示 ' + Math.min(t.events.length, 30) + ' / ' + t.events.length + '）</div>';
-    t.events.slice(0, 30).forEach(e => {
-      const inputPreview = e.tool_input ? (JSON.stringify(e.tool_input).slice(0, 80) + (JSON.stringify(e.tool_input).length > 80 ? '...' : '')) : '';
-      html += '<div style="padding:0.5rem;border-bottom:1px solid var(--border);font-size:0.75rem">';
-      html += '<div style="display:flex;gap:0.5rem;align-items:center;margin-bottom:2px">';
-      html += '<span style="color:var(--text-dim)">' + fmtTime(e.timestamp) + '</span>';
-      html += badgeHook(e.hook_type);
-      if (e.tool_name) html += '<span style="font-family:monospace;color:var(--text-muted)">' + e.tool_name + '</span>';
-      html += '</div>';
-      if (inputPreview) html += '<div style="font-family:monospace;color:var(--text-dim);font-size:0.7rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap">' + inputPreview + '</div>';
-      html += '</div>';
-    });
-    html += '</div>';
-  }
-  // Back button
-  html = '<div style="margin-bottom:1rem"><button class="btn" onclick="openSessionDrawer(\'' + currentSessionData.session.session_id + '\')">← 返回会话</button></div>' + html;
-  openDrawer('任务：' + t.title.slice(0, 40), html);
-}
-// === Events ===
-async function loadEvents() {
-  document.getElementById('events-body').innerHTML = '<tr><td colspan="4" class="loading">加载中...</td></tr>';
-  try {
-    const res = await fetch(API + '/api/events?limit=100');
-    allEvents = await res.json();
-    renderEvents(allEvents);
-  } catch {
-    document.getElementById('events-body').innerHTML = '<tr><td colspan="4">' + empty('加载失败') + '</td></tr>';
-  }
-}
-function renderEvents(list) {
-  document.getElementById('events-body').innerHTML = list.length === 0
-    ? '<tr><td colspan="4">' + empty('暂无事件') + '</td></tr>'
-    : list.map(e => '<tr onclick="openEventDrawer(' + JSON.stringify(e).replace(/"/g,'&quot;') + ')"><td style="color:var(--text-dim);font-size:0.8rem">' + fmtTime(e.timestamp) + '</td><td>' + badgeHook(e.hook_type) + '</td><td style="font-family:monospace;font-size:0.8rem">' + (e.tool_name || '—') + '</td><td style="color:var(--text-dim);font-size:0.8rem">' + ((e.project_path||'').split('/').pop() || '—') + '</td></tr>').join('');
-}
-function filterEvents() {
-  const q = document.getElementById('events-search').value.toLowerCase();
-  const t = document.getElementById('events-type').value;
-  renderEvents(allEvents.filter(e =>
-    (!t || e.hook_type === t) &&
-    (!q || (e.hook_type||'').toLowerCase().includes(q) || (e.tool_name||'').toLowerCase().includes(q) || (e.project_path||'').toLowerCase().includes(q))
-  ));
-}
-function openEventDrawer(e) {
-  let html = '<div class="detail-section"><div class="detail-label">类型</div><div class="detail-value">' + badgeHook(e.hook_type) + '</div></div>';
-  html += '<div class="detail-section"><div class="detail-label">时间</div><div class="detail-value">' + fmt(e.timestamp) + '</div></div>';
-  html += '<div class="detail-section"><div class="detail-label">工具</div><div class="detail-value" style="font-family:monospace">' + (e.tool_name || '—') + '</div></div>';
-  html += '<div class="detail-section"><div class="detail-label">项目</div><div class="detail-value" style="font-family:monospace;font-size:0.8rem">' + (e.project_path || '—') + '</div></div>';
-  html += '<div class="detail-section"><div class="detail-label">会话</div><div class="detail-value" style="font-family:monospace;font-size:0.8rem">' + (e.session_id || '—') + '</div></div>';
-  if (e.tool_input) html += '<div class="detail-section"><div class="detail-label">输入参数</div><pre class="detail-code">' + JSON.stringify(e.tool_input, null, 2) + '</pre></div>';
-  openDrawer(e.hook_type + ' · ' + (e.tool_name || '事件'), html);
-}
-// === Injections ===
-async function loadInjections() {
-  document.getElementById('inj-list').innerHTML = loading();
-  try {
-    const res = await fetch(API + '/api/injections?limit=100');
-    allInjections = await res.json();
-    renderInjections(allInjections);
-  } catch {
-    document.getElementById('inj-list').innerHTML = empty('加载失败');
-  }
-}
-function renderInjections(list) {
-  document.getElementById('inj-list').innerHTML = list.length === 0 ? empty('暂无注入记录') : list.map(inj => '<div class="list-item fade-in" onclick="openInjDrawer(' + JSON.stringify(inj).replace(/"/g,'&quot;') + ')"><div style="flex:1;min-width:0"><div style="display:flex;align-items:center;gap:0.5rem;margin-bottom:2px"><span class="badge badge-info">' + inj.injection_type + '</span><span style="font-size:0.75rem;color:var(--text-dim)">' + inj.source_handler + '</span></div><div style="font-size:0.8rem;color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis">' + inj.content.slice(0,80) + '</div><div style="font-size:0.75rem;color:var(--text-dim);margin-top:2px">' + fmt(inj.timestamp) + ' · ' + inj.session_id.slice(0,8) + '</div></div><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" style="color:var(--text-dim);flex-shrink:0"><polyline points="9 18 15 12 9 6"/></svg></div>').join('');
-}
-function filterInjections() {
-  const q = document.getElementById('inj-search').value.toLowerCase();
-  const h = document.getElementById('inj-handler').value;
-  renderInjections(allInjections.filter(inj => (!h || inj.source_handler === h) && (!q || inj.content.toLowerCase().includes(q) || inj.injection_type.toLowerCase().includes(q))));
-}
-function openInjDrawer(inj) {
-  let html = '<div class="detail-section"><div class="detail-label">类型</div><div class="detail-value"><span class="badge badge-info">' + inj.injection_type + '</span></div></div>';
-  html += '<div class="detail-section"><div class="detail-label">Handler</div><div class="detail-value">' + inj.source_handler + '</div></div>';
-  html += '<div class="detail-section"><div class="detail-label">时间</div><div class="detail-value">' + fmt(inj.timestamp) + '</div></div>';
-  html += '<div class="detail-section"><div class="detail-label">会话</div><div class="detail-value" style="font-family:monospace;font-size:0.8rem">' + inj.session_id + '</div></div>';
-  html += '<div class="detail-section"><div class="detail-label">注入内容</div><pre class="detail-code">' + inj.content + '</pre></div>';
-  openDrawer(inj.injection_type, html);
-}
-// === Rules ===
-// === Agent Routing ===
-let routingCurrentTab = 'overview';
-function routingTab(tab) {
-  routingCurrentTab = tab;
-  ['overview', 'events', 'refusals', 'performance', 'ai-optimization', 'editor', 'experiments', 'recommendations'].forEach(t => {
-    const btn = document.getElementById('routing-tab-' + t);
-    const sub = document.getElementById('routing-sub-' + t);
-    if (btn) btn.classList.toggle('active', t === tab);
-    if (sub) sub.style.display = (t === tab) ? '' : 'none';
-  });
-  // Show/hide time window selector (not needed for editor/experiments/recommendations tabs)
-  const windowSelector = document.getElementById('routing-window');
-  if (windowSelector) {
-    windowSelector.style.display =
-      (tab === 'editor' || tab === 'experiments' || tab === 'recommendations') ? 'none' : '';
-  }
-  loadRouting();
-}
-async function loadRouting() {
-  if (routingCurrentTab === 'overview') return loadRoutingOverview();
-  if (routingCurrentTab === 'events') return loadRoutingEvents();
-  if (routingCurrentTab === 'refusals') return loadRoutingRefusals();
-  if (routingCurrentTab === 'performance') return loadRoutingPerformance();
-  if (routingCurrentTab === 'ai-optimization') return loadRoutingAIOptimization();
-  if (routingCurrentTab === 'editor') return loadRoutingConfig();
-  if (routingCurrentTab === 'experiments') {
-    await loadExperimentsConfig();
-    return loadExperimentsAnalysis();
-  }
-  if (routingCurrentTab === 'recommendations') return loadRecommendations();
-}
-// === AI Config ===
-let aiApiKeyMasked = true;
-let aiApiKeyOriginal = '';
-async function loadAIConfig() {
-  try {
-    const r = await fetch(API + '/api/config/ai');
-    if (!r.ok) throw new Error('Failed to load config');
-    const data = await r.json();
-    document.getElementById('ai-api-key').value = data.api_key || '';
-    document.getElementById('ai-base-url').value = data.base_url || '';
-    document.getElementById('ai-provider').value = data.provider || 'anthropic';
-    document.getElementById('ai-classifier-timeout').value = data.classifier_timeout || 10000;
-    aiApiKeyOriginal = data.api_key || '';
-    aiApiKeyMasked = true;
-    document.getElementById('ai-api-key').type = 'password';
-    document.getElementById('toggle-api-key-btn').textContent = '👁️ 显示';
-    // Pre-fill model dropdown with current model
-    const modelSelect = document.getElementById('ai-model');
-    modelSelect.innerHTML = `<option value="${data.model}">${data.model}</option>`;
-    // Pre-fill classifier model dropdown
-    const classifierSelect = document.getElementById('ai-classifier-model');
-    const classifierModel = data.classifier_model || '';
-    classifierSelect.innerHTML = classifierModel
-      ? `<option value="">(与主模型相同)</option><option value="${classifierModel}" selected>${classifierModel}</option>`
-      : `<option value="" selected>(与主模型相同)</option>`;
-  } catch (err) {
-    showAIError(`加载配置失败: ${err.message}`);
-  }
-}
-function toggleAPIKeyVisibility() {
-  const input = document.getElementById('ai-api-key');
-  const btn = document.getElementById('toggle-api-key-btn');
-  if (input.type === 'password') {
-    input.type = 'text';
-    btn.textContent = '🙈 隐藏';
-  } else {
-    input.type = 'password';
-    btn.textContent = '👁️ 显示';
-  }
-}
-async function refreshAIModels() {
-  const modelSelect = document.getElementById('ai-model');
-  const classifierSelect = document.getElementById('ai-classifier-model');
-  const currentValue = modelSelect.value;
-  const currentClassifier = classifierSelect.value;
-  modelSelect.innerHTML = '<option value="">加载中...</option>';
-  try {
-    // Pass current form values so user can refresh before saving
-    const apiKeyInput = document.getElementById('ai-api-key').value;
-    const baseUrl = document.getElementById('ai-base-url').value;
-    const params = new URLSearchParams();
-    // Only send api_key if user typed a fresh one (not the masked placeholder)
-    if (apiKeyInput && !apiKeyInput.includes('***')) params.set('api_key', apiKeyInput);
-    if (baseUrl) params.set('base_url', baseUrl);
-    const qs = params.toString() ? '?' + params.toString() : '';
-    const r = await fetch(API + '/api/ai/models' + qs);
-    if (!r.ok) {
-      const err = await r.json().catch(() => ({ error: r.statusText }));
-      throw new Error(err.error || r.statusText);
-    }
-    const data = await r.json();
-    const models = data.data || [];
-    if (models.length === 0) {
-      modelSelect.innerHTML = '<option value="">无可用模型</option>';
-      showAIError('未找到可用模型');
-      return;
-    }
-    modelSelect.innerHTML = models.map(m => {
-      const selected = m.id === currentValue ? 'selected' : '';
-      return `<option value="${m.id}" ${selected}>${m.id}</option>`;
-    }).join('');
-    // Also populate classifier model dropdown
-    classifierSelect.innerHTML = '<option value="">(与主模型相同)</option>' + models.map(m => {
-      const selected = m.id === currentClassifier ? 'selected' : '';
-      return `<option value="${m.id}" ${selected}>${m.id}</option>`;
-    }).join('');
-    showAISuccess(`已加载 ${models.length} 个模型`);
-  } catch (err) {
-    modelSelect.innerHTML = `<option value="${currentValue}">${currentValue}</option>`;
-    showAIError(`加载模型列表失败: ${err.message}`);
-  }
-}
-async function saveAIConfig() {
-  const apiKeyInput = document.getElementById('ai-api-key').value;
-  const baseUrl = document.getElementById('ai-base-url').value;
-  const provider = document.getElementById('ai-provider').value;
-  const model = document.getElementById('ai-model').value;
-  const classifierModel = document.getElementById('ai-classifier-model').value;
-  const classifierTimeout = parseInt(document.getElementById('ai-classifier-timeout').value) || undefined;
-  const body = { base_url: baseUrl, provider, model };
-  if (classifierModel) body.classifier_model = classifierModel;
-  if (classifierTimeout) body.classifier_timeout = classifierTimeout;
-  // Only send api_key if user changed it (not the masked placeholder)
-  if (apiKeyInput && apiKeyInput !== aiApiKeyOriginal && !apiKeyInput.includes('***')) {
-    body.api_key = apiKeyInput;
-  }
-  try {
-    const r = await fetch(API + '/api/config/ai', {
-      method: 'PUT',
-      headers: { 'Content-Type': 'application/json' },
-      body: JSON.stringify(body),
-    });
-    if (!r.ok) {
-      const err = await r.json().catch(() => ({ error: r.statusText }));
-      throw new Error(err.error || r.statusText);
-    }
-    showAISuccess('✓ 保存成功！重启 daemon 后生效');
-    loadAIConfig();
-  } catch (err) {
-    showAIError(`保存失败: ${err.message}`);
-  }
-}
-async function testAIConnection() {
-  showAISuccess('正在测试连接...');
-  try {
-    const apiKeyInput = document.getElementById('ai-api-key').value;
-    const baseUrl = document.getElementById('ai-base-url').value;
-    const model = document.getElementById('ai-model').value;
-    const body = {};
-    if (apiKeyInput && !apiKeyInput.includes('***')) body.api_key = apiKeyInput;
-    if (baseUrl) body.base_url = baseUrl;
-    if (model) body.model = model;
-    const r = await fetch(API + '/api/ai/test', {
-      method: 'POST',
-      headers: { 'Content-Type': 'application/json' },
-      body: JSON.stringify(body),
-    });
-    if (!r.ok) {
-      const err = await r.json().catch(() => ({ error: r.statusText }));
-      throw new Error(err.error || r.statusText);
-    }
-    const data = await r.json();
-    showAISuccess(`✓ 连接成功！模型: ${data.model || model}`);
-  } catch (err) {
-    showAIError(`连接失败: ${err.message}`);
-  }
-}
-function showAISuccess(msg) {
-  const el = document.getElementById('ai-config-success');
-  const errEl = document.getElementById('ai-config-error');
-  el.textContent = msg;
-  el.style.display = 'block';
-  errEl.style.display = 'none';
-  setTimeout(() => { el.style.display = 'none'; }, 5000);
-}
-function showAIError(msg) {
-  const el = document.getElementById('ai-config-error');
-  const okEl = document.getElementById('ai-config-success');
-  el.textContent = msg;
-  el.style.display = 'block';
-  okEl.style.display = 'none';
-}
-// === Agent Management ===
-async function loadAgents() {
-  try {
-    const r = await fetch(API + '/api/agents');
-    if (!r.ok) throw new Error('Failed to load agents');
-    const data = await r.json();
-    const tbody = document.getElementById('agents-body');
-    const rows = [];
-    data.official.forEach(a => {
-      rows.push(`<tr>
-        <td><strong>${a.name}</strong></td>
-        <td>${a.description}</td>
-        <td><span class="badge badge-info">${a.category}</span></td>
-        <td>${a.version}</td>
-        <td><span class="badge badge-allow">官方</span></td>
-        <td>
-          <button class="btn" onclick="viewAgent('${a.name}')">查看</button>
-          <button class="btn" onclick="editAgent('${a.name}')">编辑</button>
-        </td>
-      </tr>`);
-    });
-    data.user.forEach(a => {
-      rows.push(`<tr>
-        <td><strong>${a.name}</strong></td>
-        <td>${a.description}</td>
-        <td>—</td>
-        <td>${a.version || '—'}</td>
-        <td><span class="badge badge-warn">用户</span></td>
-        <td>
-          <button class="btn" onclick="viewAgent('${a.name}')">查看</button>
-          <button class="btn" onclick="editAgent('${a.name}')">编辑</button>
-        </td>
-      </tr>`);
-    });
-    tbody.innerHTML = rows.length > 0 ? rows.join('') : '<tr><td colspan="6" style="text-align:center;color:var(--text-dim)">暂无 Agent</td></tr>';
-  } catch (err) {
-    console.error('Failed to load agents:', err);
-  }
-}
-async function viewAgent(name) {
-  try {
-    const r = await fetch(API + `/api/agents/${name}`);
-    if (!r.ok) throw new Error('Failed to load agent');
-    const data = await r.json();
-    const html = `
-      <div style="margin-bottom:1rem">
-        <h3>${data.name}</h3>
-        <p style="color:var(--text-dim)">${data.description}</p>
-        <div style="margin-top:0.5rem">
-          <span class="badge badge-info">${data.version || 'v1.0.0'}</span>
-          ${data.tools ? `<span class="badge badge-allow">${data.tools}</span>` : ''}
-        </div>
-      </div>
-      <div style="margin-bottom:1rem;display:flex;gap:0.5rem">
-        <button class="btn" onclick="viewAgentVersions('${name}')">📜 版本历史</button>
-      </div>
-      <div style="background:var(--bg-secondary);padding:1rem;border-radius:var(--radius-sm);max-height:60vh;overflow-y:auto">
-        <pre style="margin:0;white-space:pre-wrap;font-size:0.875rem">${escapeHtml(data.content)}</pre>
-      </div>
-    `;
-    openDrawer(`Agent: ${name}`, html);
-  } catch (err) {
-    alert('加载失败: ' + err.message);
-  }
-}
-async function editAgent(name) {
-  try {
-    const r = await fetch(API + `/api/agents/${name}`);
-    if (!r.ok) throw new Error('Failed to load agent');
-    const data = await r.json();
-    const html = `
-      <div style="margin-bottom:1rem">
-        <h3>编辑 Agent: ${data.name}</h3>
-        <p style="color:var(--text-dim)">${data.description}</p>
-      </div>
-      <textarea id="edit-agent-content" style="width:100%;height:60vh;font-family:monospace;font-size:0.875rem;padding:0.5rem;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg-secondary)">${escapeHtml(data.content)}</textarea>
-      <div style="margin-top:1rem;display:flex;gap:0.5rem;justify-content:flex-end">
-        <button class="btn" onclick="closeDrawer()">取消</button>
-        <button class="btn btn-primary" onclick="saveAgent('${name}')">💾 保存</button>
-      </div>
-      <div id="edit-agent-msg" style="margin-top:0.5rem;padding:0.5rem;border-radius:var(--radius-sm);display:none"></div>
-    `;
-    openDrawer(`编辑 Agent: ${name}`, html);
-  } catch (err) {
-    alert('加载失败: ' + err.message);
-  }
-}
-async function saveAgent(name) {
-  const content = document.getElementById('edit-agent-content').value;
-  const msgEl = document.getElementById('edit-agent-msg');
-  try {
-    const r = await fetch(API + `/api/agents/${name}`, {
-      method: 'PUT',
-      headers: { 'Content-Type': 'application/json' },
-      body: JSON.stringify({ content }),
-    });
-    if (!r.ok) throw new Error('Failed to save agent');
-    const data = await r.json();
-    msgEl.textContent = `✓ 保存成功！备份: ${data.backup}`;
-    msgEl.style.background = 'var(--primary)';
-    msgEl.style.color = 'white';
-    msgEl.style.display = 'block';
-    setTimeout(() => { closeDrawer(); loadAgents(); }, 1500);
-  } catch (err) {
-    msgEl.textContent = `保存失败: ${err.message}`;
-    msgEl.style.background = 'var(--red)';
-    msgEl.style.color = 'white';
-    msgEl.style.display = 'block';
-  }
-}
-// === Skill Management ===
-async function loadSkills() {
-  try {
-    const r = await fetch(API + '/api/skills');
-    if (!r.ok) throw new Error('Failed to load skills');
-    const data = await r.json();
-    const tbody = document.getElementById('skills-body');
-    const rows = data.skills.map(s => `<tr>
-      <td><strong>${s.name}</strong></td>
-      <td>${s.description}</td>
-      <td>${s.version || '—'}</td>
-      <td><span class="badge ${s.source === 'official' ? 'badge-allow' : 'badge-warn'}">${s.source === 'official' ? '官方' : '用户'}</span></td>
-      <td>
-        <button class="btn" onclick="viewSkill('${s.name}')">查看</button>
-        <button class="btn" onclick="editSkill('${s.name}')">编辑</button>
-      </td>
-    </tr>`);
-    tbody.innerHTML = rows.length > 0 ? rows.join('') : '<tr><td colspan="5" style="text-align:center;color:var(--text-dim)">暂无 Skill</td></tr>';
-  } catch (err) {
-    console.error('Failed to load skills:', err);
-  }
-}
-async function viewAgentVersions(name) {
-  try {
-    const r = await fetch(API + `/api/agents/${name}/versions`);
-    if (!r.ok) throw new Error('Failed to load versions');
-    const data = await r.json();
-    if (data.versions.length === 0) {
-      alert('暂无版本历史');
-      return;
-    }
-    const html = `
-      <div style="margin-bottom:1rem">
-        <h3>版本历史: ${name}</h3>
-        <p style="color:var(--text-dim)">共 ${data.versions.length} 个备份版本</p>
-      </div>
-      <div style="max-height:60vh;overflow-y:auto">
-        ${data.versions.map(v => `
-          <div style="border:1px solid var(--border);border-radius:var(--radius-sm);padding:0.75rem;margin-bottom:0.5rem">
-            <div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:0.5rem">
-              <div>
-                <div style="font-weight:500">${new Date(v.mtime).toLocaleString('zh-CN')}</div>
-                <div style="font-size:0.75rem;color:var(--text-dim)">${(v.size / 1024).toFixed(1)} KB</div>
-              </div>
-              <div style="display:flex;gap:0.25rem">
-                <button class="btn" onclick="viewAgentVersion('${name}', '${v.timestamp}')">查看</button>
-                <button class="btn btn-primary" onclick="rollbackAgent('${name}', '${v.timestamp}')">回滚</button>
-              </div>
-            </div>
-          </div>
-        `).join('')}
-      </div>
-    `;
-    openDrawer(`版本历史: ${name}`, html);
-  } catch (err) {
-    alert('加载失败: ' + err.message);
-  }
-}
-async function viewAgentVersion(name, timestamp) {
-  try {
-    const r = await fetch(API + `/api/agents/${name}/versions/${encodeURIComponent(timestamp)}`);
-    if (!r.ok) throw new Error('Failed to load version');
-    const data = await r.json();
-    const html = `
-      <div style="margin-bottom:1rem">
-        <h3>历史版本: ${name}</h3>
-        <p style="color:var(--text-dim)">${new Date(timestamp).toLocaleString('zh-CN')}</p>
-      </div>
-      <div style="background:var(--bg-secondary);padding:1rem;border-radius:var(--radius-sm);max-height:60vh;overflow-y:auto">
-        <pre style="margin:0;white-space:pre-wrap;font-size:0.875rem">${escapeHtml(data.content)}</pre>
-      </div>
-    `;
-    openDrawer(`历史版本: ${name}`, html);
-  } catch (err) {
-    alert('加载失败: ' + err.message);
-  }
-}
-async function rollbackAgent(name, timestamp) {
-  if (!confirm(`确定要回滚到 ${new Date(timestamp).toLocaleString('zh-CN')} 的版本吗？\n\n当前版本会自动备份。`)) {
-    return;
-  }
-  try {
-    const r = await fetch(API + `/api/agents/${name}/rollback`, {
-      method: 'POST',
-      headers: { 'Content-Type': 'application/json' },
-      body: JSON.stringify({ timestamp }),
-    });
-    if (!r.ok) throw new Error('Failed to rollback');
-    const data = await r.json();
-    alert(`✓ 回滚成功！\n\n当前版本已备份到:\n${data.backup}`);
-    closeDrawer();
-    loadAgents();
-  } catch (err) {
-    alert('回滚失败: ' + err.message);
-  }
-}
-async function viewSkill(name) {
-  try {
-    const r = await fetch(API + `/api/skills/${name}`);
-    if (!r.ok) throw new Error('Failed to load skill');
-    const data = await r.json();
-    const html = `
-      <div style="margin-bottom:1rem">
-        <h3>${data.name}</h3>
-        <p style="color:var(--text-dim)">${data.description}</p>
-        <div style="margin-top:0.5rem">
-          <span class="badge badge-info">${data.version || 'v1.0.0'}</span>
-          <span class="badge ${data.source === 'official' ? 'badge-allow' : 'badge-warn'}">${data.source === 'official' ? '官方' : '用户'}</span>
-        </div>
-      </div>
-      <div style="margin-bottom:1rem;display:flex;gap:0.5rem">
-        <button class="btn" onclick="viewSkillVersions('${name}')">📜 版本历史</button>
-      </div>
-      <div style="background:var(--bg-secondary);padding:1rem;border-radius:var(--radius-sm);max-height:60vh;overflow-y:auto">
-        <pre style="margin:0;white-space:pre-wrap;font-size:0.875rem">${escapeHtml(data.content)}</pre>
-      </div>
-    `;
-    openDrawer(`Skill: ${name}`, html);
-  } catch (err) {
-    alert('加载失败: ' + err.message);
-  }
-}
-async function viewSkillVersions(name) {
-  try {
-    const r = await fetch(API + `/api/skills/${name}/versions`);
-    if (!r.ok) throw new Error('Failed to load versions');
-    const data = await r.json();
-    if (data.versions.length === 0) {
-      alert('暂无版本历史');
-      return;
-    }
-    const html = `
-      <div style="margin-bottom:1rem">
-        <h3>版本历史: ${name}</h3>
-        <p style="color:var(--text-dim)">共 ${data.versions.length} 个备份版本</p>
-      </div>
-      <div style="max-height:60vh;overflow-y:auto">
-        ${data.versions.map(v => `
-          <div style="border:1px solid var(--border);border-radius:var(--radius-sm);padding:0.75rem;margin-bottom:0.5rem">
-            <div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:0.5rem">
-              <div>
-                <div style="font-weight:500">${new Date(v.mtime).toLocaleString('zh-CN')}</div>
-                <div style="font-size:0.75rem;color:var(--text-dim)">${(v.size / 1024).toFixed(1)} KB</div>
-              </div>
-              <div style="display:flex;gap:0.25rem">
-                <button class="btn" onclick="viewSkillVersion('${name}', '${v.timestamp}')">查看</button>
-                <button class="btn btn-primary" onclick="rollbackSkill('${name}', '${v.timestamp}')">回滚</button>
-              </div>
-            </div>
-          </div>
-        `).join('')}
-      </div>
-    `;
-    openDrawer(`版本历史: ${name}`, html);
-  } catch (err) {
-    alert('加载失败: ' + err.message);
-  }
-}
-async function viewSkillVersion(name, timestamp) {
-  try {
-    const r = await fetch(API + `/api/skills/${name}/versions/${encodeURIComponent(timestamp)}`);
-    if (!r.ok) throw new Error('Failed to load version');
-    const data = await r.json();
-    const html = `
-      <div style="margin-bottom:1rem">
-        <h3>历史版本: ${name}</h3>
-        <p style="color:var(--text-dim)">${new Date(timestamp).toLocaleString('zh-CN')}</p>
-      </div>
-      <div style="background:var(--bg-secondary);padding:1rem;border-radius:var(--radius-sm);max-height:60vh;overflow-y:auto">
-        <pre style="margin:0;white-space:pre-wrap;font-size:0.875rem">${escapeHtml(data.content)}</pre>
-      </div>
-    `;
-    openDrawer(`历史版本: ${name}`, html);
-  } catch (err) {
-    alert('加载失败: ' + err.message);
-  }
-}
-async function rollbackSkill(name, timestamp) {
-  if (!confirm(`确定要回滚到 ${new Date(timestamp).toLocaleString('zh-CN')} 的版本吗？\n\n当前版本会自动备份。`)) {
-    return;
-  }
-  try {
-    const r = await fetch(API + `/api/skills/${name}/rollback`, {
-      method: 'POST',
-      headers: { 'Content-Type': 'application/json' },
-      body: JSON.stringify({ timestamp }),
-    });
-    if (!r.ok) throw new Error('Failed to rollback');
-    const data = await r.json();
-    alert(`✓ 回滚成功！\n\n当前版本已备份到:\n${data.backup}`);
-    closeDrawer();
-    loadSkills();
-  } catch (err) {
-    alert('回滚失败: ' + err.message);
-  }
-}
-async function editSkill(name) {
-  try {
-    const r = await fetch(API + `/api/skills/${name}`);
-    if (!r.ok) throw new Error('Failed to load skill');
-    const data = await r.json();
-    const html = `
-      <div style="margin-bottom:1rem">
-        <h3>编辑 Skill: ${data.name}</h3>
-        <p style="color:var(--text-dim)">${data.description}</p>
-      </div>
-      <textarea id="edit-skill-content" style="width:100%;height:60vh;font-family:monospace;font-size:0.875rem;padding:0.5rem;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg-secondary)">${escapeHtml(data.content)}</textarea>
-      <div style="margin-top:1rem;display:flex;gap:0.5rem;justify-content:flex-end">
-        <button class="btn" onclick="closeDrawer()">取消</button>
-        <button class="btn btn-primary" onclick="saveSkill('${name}')">💾 保存</button>
-      </div>
-      <div id="edit-skill-msg" style="margin-top:0.5rem;padding:0.5rem;border-radius:var(--radius-sm);display:none"></div>
-    `;
-    openDrawer(`编辑 Skill: ${name}`, html);
-  } catch (err) {
-    alert('加载失败: ' + err.message);
-  }
-}
-async function saveSkill(name) {
-  const content = document.getElementById('edit-skill-content').value;
-  const msgEl = document.getElementById('edit-skill-msg');
-  try {
-    const r = await fetch(API + `/api/skills/${name}`, {
-      method: 'PUT',
-      headers: { 'Content-Type': 'application/json' },
-      body: JSON.stringify({ content }),
-    });
-    if (!r.ok) throw new Error('Failed to save skill');
-    const data = await r.json();
-    msgEl.textContent = `✓ 保存成功！备份: ${data.backup}`;
-    msgEl.style.background = 'var(--primary)';
-    msgEl.style.color = 'white';
-    msgEl.style.display = 'block';
-    setTimeout(() => { closeDrawer(); loadSkills(); }, 1500);
-  } catch (err) {
-    msgEl.textContent = `保存失败: ${err.message}`;
-    msgEl.style.background = 'var(--red)';
-    msgEl.style.color = 'white';
-    msgEl.style.display = 'block';
-  }
-}
-function escapeHtml(text) {
-  const div = document.createElement('div');
-  div.textContent = text;
-  return div.innerHTML;
-}
-// === Execution Trace ===
-let allTraces = [];
-async function loadExecutionTraces() {
-  try {
-    const agentFilter = document.getElementById('trace-agent-filter').value;
-    const obeyedFilter = document.getElementById('trace-obeyed-filter').value;
-    const params = new URLSearchParams({ limit: '100' });
-    if (agentFilter) params.set('agent', agentFilter);
-    if (obeyedFilter) params.set('obeyed', obeyedFilter);
-    const r = await fetch(API + '/api/execution-trace?' + params.toString());
-    if (!r.ok) throw new Error('Failed to load traces');
-    const data = await r.json();
-    allTraces = data.traces;
-    // Populate agent filter dropdown
-    const agentSet = new Set();
-    allTraces.forEach(t => {
-      if (t.routedToName) agentSet.add(t.routedToName);
-    });
-    const agentSelect = document.getElementById('trace-agent-filter');
-    const currentAgent = agentSelect.value;
-    agentSelect.innerHTML = '<option value="">全部 Agent/Skill</option>' +
-      Array.from(agentSet).sort().map(a =>
-        `<option value="${a}" ${a === currentAgent ? 'selected' : ''}>${a}</option>`
-      ).join('');
-    renderTraces();
-    ensureTraceStream();
-  } catch (err) {
-    console.error('Failed to load traces:', err);
-  }
-}
-function ensureTraceStream() {
-  if (traceStream) return;
-  traceStream = new EventSource(API + '/api/execution-trace/stream');
-  traceStream.onmessage = (e) => {
-    try {
-      const data = JSON.parse(e.data);
-      if (data.type === 'execution-status') {
-        appendLiveStatus(data);
-        if (traceRefreshTimer) clearTimeout(traceRefreshTimer);
-        traceRefreshTimer = setTimeout(() => loadExecutionTraces(), 500);
-      }
-    } catch (err) {
-      console.error('Failed to parse SSE:', err);
-    }
-  };
-  traceStream.onerror = () => {
-    traceStream.close();
-    traceStream = null;
-  };
-}
-function appendLiveStatus(data) {
-  const statusBox = document.getElementById('trace-live-status');
-  if (!statusBox) return;
-  const time = new Date(data.timestamp).toLocaleTimeString('zh-CN');
-  const statusBadge = data.status === 'routing' ? '<span class="badge badge-info">正在路由</span>'
-    : data.status === 'executing' ? '<span class="badge badge-warn">正在执行</span>'
-    : data.status === 'completed' ? '<span class="badge badge-allow">已完成</span>'
-    : '<span class="badge badge-block">失败</span>';
-  const item = `<div style="padding:0.5rem;border-bottom:1px solid var(--border)">${time} · Session ${data.sessionId.slice(0,8)} · ${statusBadge}${data.tool ? ` · ${data.tool}` : ''}${data.error ? ` · ${data.error}` : ''}</div>`;
-  statusBox.innerHTML = item + statusBox.innerHTML;
-  const children = statusBox.children;
-  while (children.length > 20) statusBox.removeChild(children[children.length - 1]);
-}
-function renderTraces() {
-  const searchTerm = document.getElementById('trace-search').value.toLowerCase();
-  const filtered = allTraces.filter(t =>
-    !searchTerm || t.prompt.toLowerCase().includes(searchTerm)
-  );
-  const list = document.getElementById('trace-list');
-  if (filtered.length === 0) {
-    list.innerHTML = '<div style="text-align:center;padding:2rem;color:var(--text-dim)">暂无执行追踪记录</div>';
-    return;
-  }
-  const items = filtered.map(t => {
-    const time = new Date(t.timestamp).toLocaleString('zh-CN');
-    const obeyedBadge = !t.routedToType || !t.routedToName
-      ? '<span class="badge badge-info">— 未路由</span>'
-      : t.obeyed === 1
-      ? '<span class="badge badge-allow">✓ 遵守</span>'
-      : t.obeyed === 0
-      ? '<span class="badge badge-block">✗ 违抗</span>'
-      : t.completionReason === 'timeout'
-      ? '<span class="badge badge-warn">⏱ 已超时</span>'
-      : '<span class="badge badge-info">— 未判定</span>';
-    const routeBadge = t.routedToName
-      ? `<span class="badge badge-info">${t.routedToType === 'agent' ? '🤖' : '⚡'} ${t.routedToName}</span>`
-      : '<span class="badge badge-warn">无路由</span>';
-    const intentBadge = t.intent.taskType
-      ? `<span class="badge" style="background:var(--bg-secondary)">${t.intent.taskType}</span>`
-      : '';
-    const firstToolBadge = t.firstTool
-      ? `<span class="badge" style="background:var(--bg-secondary)">首工具: ${t.firstTool}</span>`
-      : '';
-    const classificationBadge = t.fallbackUsed
-      ? '<span class="badge badge-warn">正则兜底</span>'
-      : t.classificationMs
-      ? `<span class="badge badge-allow">AI 分类 (${t.classificationMs}ms)</span>`
-      : '';
-    const executionBadge = t.totalExecutionMs
-      ? `<span class="badge" style="background:var(--purple-soft);color:var(--purple)">真实耗时: ${t.totalExecutionMs}ms</span>`
-      : '';
-    const completionBadge = t.completionReason
-      ? `<span class="badge" style="background:var(--bg-secondary)">完成来源: ${t.completionReason}</span>`
-      : '';
-    return `
-      <div style="border:1px solid var(--border);border-radius:var(--radius-sm);padding:1rem;margin-bottom:0.75rem;cursor:pointer;transition:background 0.2s"
-           onclick="viewTraceDetails(${t.id})"
-           onmouseover="this.style.background='var(--bg-secondary)'"
-           onmouseout="this.style.background='transparent'">
-        <div style="display:flex;justify-content:space-between;align-items:start;margin-bottom:0.5rem">
-          <div style="flex:1">
-            <div style="font-weight:500;margin-bottom:0.25rem">${escapeHtml(t.prompt.slice(0, 100))}${t.prompt.length > 100 ? '...' : ''}</div>
-            <div style="font-size:0.75rem;color:var(--text-dim)">${time} · Session: ${t.sessionId.slice(0, 8)}</div>
-          </div>
-          <div style="display:flex;gap:0.25rem;flex-wrap:wrap;justify-content:flex-end">
-            ${obeyedBadge}
-            ${routeBadge}
-          </div>
-        </div>
-        <div style="display:flex;gap:0.5rem;flex-wrap:wrap;font-size:0.75rem">
-          ${intentBadge}
-          ${firstToolBadge}
-          ${classificationBadge}
-          ${executionBadge}
-          ${completionBadge}
-          ${t.taskChain.length > 0 ? `<span class="badge badge-info">子 Agent: ${t.taskChain.join(' → ')}</span>` : ''}
-        </div>
-      </div>
-    `;
-  }).join('');
-  list.innerHTML = items;
-}
-function filterTraces() {
-  renderTraces();
-}
-async function viewTraceDetails(traceId) {
-  try {
-    const r = await fetch(API + `/api/execution-trace/${traceId}`);
-    if (!r.ok) throw new Error('Failed to load trace details');
-    const data = await r.json();
-    const routing = data.routing;
-    const sessionId = routing.sessionId;
-    const obeyedText = !routing.routedToType || !routing.routedToName
-      ? '<span class="badge badge-info">— 未路由</span>'
-      : routing.obeyed === 1
-      ? '<span class="badge badge-allow">✓ 遵守</span>'
-      : routing.obeyed === 0
-      ? '<span class="badge badge-block">✗ 违抗</span>'
-      : routing.completionReason === 'timeout'
-      ? '<span class="badge badge-warn">⏱ 已超时</span>'
-      : '<span class="badge badge-info">— 未判定</span>';
-    const html = `
-      <div style="margin-bottom:1.5rem">
-        <h3>执行追踪详情</h3>
-        <div style="font-size:0.875rem;color:var(--text-dim);margin-top:0.5rem">Trace #${routing.id} · Session: ${sessionId}</div>
-      </div>
-      <div style="margin-bottom:1.5rem">
-        <h4 style="margin-bottom:0.5rem">用户 Prompt</h4>
-        <div style="background:var(--bg-secondary);padding:0.75rem;border-radius:var(--radius-sm);font-size:0.875rem">
-          ${escapeHtml(routing.prompt)}
-        </div>
-      </div>
-      <div style="margin-bottom:1.5rem">
-        <h4 style="margin-bottom:0.5rem">AI 意图分类</h4>
-        <div style="background:var(--bg-secondary);padding:0.75rem;border-radius:var(--radius-sm);font-size:0.875rem">
-          <div><strong>任务类型:</strong> ${routing.intent.taskType || '—'}</div>
-          <div><strong>复杂度:</strong> ${routing.intent.complexity || '—'}</div>
-          <div><strong>分类耗时:</strong> ${routing.classificationMs ? routing.classificationMs + 'ms' : '—'}</div>
-          <div><strong>分类方式:</strong> ${routing.fallbackUsed ? '<span class="badge badge-warn">正则兜底</span>' : '<span class="badge badge-allow">AI 分类</span>'}</div>
-          ${routing.intent.reasoning ? `<div style="margin-top:0.5rem"><strong>推理:</strong> ${escapeHtml(routing.intent.reasoning)}</div>` : ''}
-        </div>
-      </div>
-      <div style="margin-bottom:1.5rem">
-        <h4 style="margin-bottom:0.5rem">路由决策</h4>
-        <div style="background:var(--bg-secondary);padding:0.75rem;border-radius:var(--radius-sm);font-size:0.875rem">
-          <div><strong>路由类型:</strong> ${routing.routedToType || '无'}</div>
-          <div><strong>路由目标:</strong> ${routing.routedToName || '—'}</div>
-          <div><strong>执行状态:</strong> ${obeyedText}</div>
-          <div><strong>完成来源:</strong> ${routing.completionReason || '—'}</div>
-          ${routing.refusalReason ? `<div style="margin-top:0.5rem;color:var(--red)"><strong>违抗原因:</strong> ${escapeHtml(routing.refusalReason)}</div>` : ''}
-        </div>
-      </div>
-      <div style="margin-bottom:1.5rem">
-        <h4 style="margin-bottom:0.5rem">时间分解</h4>
-        <div style="background:var(--bg-secondary);padding:0.75rem;border-radius:var(--radius-sm);font-size:0.875rem">
-          <div><strong>路由开始:</strong> ${routing.timestamp ? new Date(routing.timestamp).toLocaleString('zh-CN') : '—'}</div>
-          <div><strong>首工具时间:</strong> ${routing.firstToolTs ? new Date(routing.firstToolTs).toLocaleString('zh-CN') : '—'}</div>
-          <div><strong>执行完成:</strong> ${routing.completedTs ? new Date(routing.completedTs).toLocaleString('zh-CN') : '—'}</div>
-          <div><strong>分类耗时:</strong> ${routing.classificationMs ? routing.classificationMs + 'ms' : '—'}</div>
-          <div><strong>首工具延迟:</strong> ${routing.firstToolTs ? (routing.firstToolTs - routing.timestamp) + 'ms' : '—'}</div>
-          <div><strong>真实执行耗时:</strong> ${routing.totalExecutionMs ? routing.totalExecutionMs + 'ms' : '—'}</div>
-        </div>
-      </div>
-      <div style="margin-bottom:1.5rem">
-        <h4 style="margin-bottom:0.5rem">执行证明链</h4>
-        <div style="background:var(--bg-secondary);padding:0.75rem;border-radius:var(--radius-sm);font-size:0.875rem">
-          <div style="margin-bottom:0.5rem;color:var(--text-dim);font-family:monospace">route_request_id: ${routing.routeRequestId || '—'}</div>
-          ${(data.agentCalls && data.agentCalls.length > 0) ? data.agentCalls.map(c => {
-            const statusBadge = c.status === 'completed'
-              ? '<span class="badge badge-allow">已完成</span>'
-              : '<span class="badge badge-warn">已开始</span>';
-            const started = c.startedTs ? new Date(c.startedTs).toLocaleTimeString('zh-CN') : '—';
-            const completed = c.completedTs ? new Date(c.completedTs).toLocaleTimeString('zh-CN') : '—';
-            return `<div style="padding:0.5rem 0;border-bottom:1px solid var(--border)">
-              <div><strong>${c.tool}${c.subagent ? ' → ' + c.subagent : ''}</strong> ${statusBadge}</div>
-              <div style="color:var(--text-dim);font-size:0.75rem">开始: ${started} · 完成: ${completed}${c.error ? ' · 错误: ' + escapeHtml(c.error) : ''}</div>
-            </div>`;
-          }).join('') : empty('本次路由暂无 Agent 调用证据')}
-        </div>
-      </div>
-      <div style="margin-bottom:1.5rem">
-        <h4 style="margin-bottom:0.5rem">实际执行</h4>
-        <div style="background:var(--bg-secondary);padding:0.75rem;border-radius:var(--radius-sm);font-size:0.875rem">
-          <div><strong>首个工具:</strong> ${routing.firstTool || '—'}</div>
-          ${routing.taskChain.length > 0 ? `<div><strong>子 Agent 链:</strong> ${routing.taskChain.join(' → ')}</div>` : ''}
-        </div>
-      </div>
-      <div style="margin-bottom:1.5rem">
-        <h4 style="margin-bottom:0.5rem">事件时间线 (${data.events.length} 个事件)</h4>
-        <div style="background:var(--bg-secondary);padding:0.75rem;border-radius:var(--radius-sm);max-height:300px;overflow-y:auto;font-size:0.875rem">
-          ${data.events.map(e => `
-            <div style="padding:0.25rem 0;border-bottom:1px solid var(--border)">
-              <span style="color:var(--text-dim)">${new Date(e.timestamp).toLocaleTimeString('zh-CN')}</span>
-              <span class="badge badge-info" style="margin:0 0.5rem">${e.hook_type}</span>
-              ${e.tool_name ? `<span class="badge">${e.tool_name}</span>` : ''}
-            </div>
-          `).join('')}
-        </div>
-      </div>
-      ${data.injections.length > 0 ? `
-        <div style="margin-bottom:1.5rem">
-          <h4 style="margin-bottom:0.5rem">注入内容 (${data.injections.length} 条)</h4>
-          <div style="background:var(--bg-secondary);padding:0.75rem;border-radius:var(--radius-sm);max-height:300px;overflow-y:auto;font-size:0.875rem">
-            ${data.injections.map(inj => `
-              <div style="padding:0.5rem 0;border-bottom:1px solid var(--border)">
-                <div><span class="badge badge-info">${inj.injection_type}</span></div>
-                <div style="margin-top:0.25rem;white-space:pre-wrap;font-family:monospace;font-size:0.8rem">${escapeHtml(inj.content.slice(0, 200))}${inj.content.length > 200 ? '...' : ''}</div>
-              </div>
-            `).join('')}
-          </div>
-        </div>
-      ` : ''}
-    `;
-    openDrawer('执行追踪详情', html);
-  } catch (err) {
-    alert('加载失败: ' + err.message);
-  }
-}
-function routingWindow() {
-  const el = document.getElementById('routing-window');
-  return el ? el.value : '168';
-}
-function pct(n) { return n == null ? '—' : (n * 100).toFixed(1) + '%'; }
-function ms(n) { return n == null ? '—' : n + 'ms'; }
-async function loadRoutingOverview() {
-  try {
-    const r = await fetch(API + '/api/routing/stats?window=' + routingWindow());
-    const data = await r.json();
-    const statusColor =
-      data.obedienceRate == null ? 'badge-info' :
-      data.obedienceRate >= 0.8 ? 'badge-allow' :
-      data.obedienceRate >= 0.6 ? 'badge-warn' : 'badge-block';
-    document.getElementById('routing-cards').innerHTML = [
-      card('事件总数', data.total),
-      card('强路由次数', data.forced),
-      card('听话率', pct(data.obedienceRate), statusColor),
-      card('违抗率', pct(data.refusalRate)),
-      card('兜底比例', pct(data.fallbackRate)),
-      card('AI 分类 p95', ms(data.latency.p95)),
-    ].join('');
-    const byAgent = Object.entries(data.byAgent || {})
-      .sort((a, b) => b[1].total - a[1].total);
-    document.getElementById('routing-by-agent').innerHTML = byAgent.length === 0
-      ? empty('暂无数据')
-      : '<table><thead><tr><th>Agent</th><th>总数</th><th>遵守</th><th>违抗</th><th>未判定</th><th>听话率</th></tr></thead><tbody>'
-        + byAgent.map(([name, b]) => {
-            const rate = (b.obeyed + b.refused) === 0 ? null : b.obeyed / (b.obeyed + b.refused);
-            return '<tr><td style="font-family:monospace">' + name + '</td><td>' + b.total + '</td>'
-              + '<td style="color:var(--primary)">' + b.obeyed + '</td>'
-              + '<td style="color:var(--danger,#dc2626)">' + b.refused + '</td>'
-              + '<td style="color:var(--text-dim)">' + b.unknown + '</td>'
-              + '<td>' + pct(rate) + '</td></tr>';
-          }).join('')
-        + '</tbody></table>';
-    const byVersion = Object.entries(data.byVersion || {});
-    document.getElementById('routing-by-version').innerHTML = byVersion.length === 0
-      ? empty('暂无版本数据')
-      : '<table><thead><tr><th>版本</th><th>总数</th><th>遵守</th><th>听话率</th></tr></thead><tbody>'
-        + byVersion.map(([v, b]) => '<tr><td style="font-family:monospace;font-size:0.8rem">' + v
-          + '</td><td>' + b.total + '</td><td>' + b.obeyed + '</td><td>'
-          + pct(b.total === 0 ? null : b.obeyed / b.total) + '</td></tr>').join('')
-        + '</tbody></table>';
-  } catch (err) {
-    document.getElementById('routing-cards').innerHTML = empty('加载失败: ' + err.message);
-  }
-}
-function card(label, value, color) {
-  return '<div class="panel" style="padding:1rem">'
-    + '<div style="font-size:0.75rem;color:var(--text-dim);margin-bottom:0.25rem">' + label + '</div>'
-    + '<div style="font-size:1.5rem;font-weight:600' + (color ? ';color:var(--primary)' : '') + '">' + value + '</div>'
-    + '</div>';
-}
-async function loadRoutingPerformance() {
-  try {
-    const r = await fetch(API + '/api/routing/performance?window=' + routingWindow() + '&minAttempts=10');
-    const data = await r.json();
-    document.getElementById('routing-performance-cards').innerHTML = [
-      card('总路由数', data.summary.totalRouted),
-      card('已判定', data.summary.totalJudged),
-      card('遵守率', pct(data.summary.obedienceRate)),
-      card('违抗率', pct(data.summary.refusalRate)),
-      card('平均分类耗时', ms(data.summary.avgClassificationMs)),
-      card('平均真实耗时', ms(data.summary.avgExecutionMs)),
-    ].join('');
-    const byAgentTbody = document.getElementById('routing-performance-by-agent');
-    byAgentTbody.innerHTML = (data.byAgent || []).length === 0
-      ? '<tr><td colspan="7">' + empty('暂无性能数据') + '</td></tr>'
-      : data.byAgent.map(a => '<tr>'
-          + '<td style="font-family:monospace">' + a.agent + '</td>'
-          + '<td>' + a.total + '</td>'
-          + '<td>' + a.judged + '</td>'
-          + '<td>' + pct(a.obedienceRate) + '</td>'
-          + '<td>' + pct(a.refusalRate) + '</td>'
-          + '<td>' + ms(a.avgClassificationMs) + '</td>'
-          + '<td>' + ms(a.avgExecutionMs) + '</td>'
-          + '</tr>').join('');
-    const highRefusal = document.getElementById('routing-high-refusal');
-    highRefusal.innerHTML = (data.highRefusalAgents || []).length === 0
-      ? empty('暂无达到阈值的高违抗率 Agent')
-      : '<table><thead><tr><th>Agent</th><th>样本</th><th>违抗率</th><th>分类耗时</th><th>真实耗时</th></tr></thead><tbody>'
-        + data.highRefusalAgents.map(a => '<tr>'
-          + '<td style="font-family:monospace">' + a.agent + '</td>'
-          + '<td>' + a.totalAttempts + '</td>'
-          + '<td>' + pct(a.refusalRate) + '</td>'
-          + '<td>' + ms(a.avgClassificationMs) + '</td>'
-          + '<td>' + ms(a.avgExecutionMs) + '</td>'
-          + '</tr>').join('')
-        + '</tbody></table>';
-    renderRoutingPerformanceCharts(data.dailyTrend || []);
-  } catch (err) {
-    document.getElementById('routing-performance-cards').innerHTML = empty('加载失败: ' + err.message);
-    document.getElementById('routing-performance-by-agent').innerHTML = '<tr><td colspan="7">' + empty('加载失败: ' + err.message) + '</td></tr>';
-    document.getElementById('routing-high-refusal').innerHTML = empty('加载失败: ' + err.message);
-  }
-}
-function renderRoutingPerformanceCharts(trend) {
-  const labels = trend.map(d => d.date.slice(5));
-  const total = trend.map(d => d.total);
-  const obeyed = trend.map(d => d.obeyed);
-  const refused = trend.map(d => d.refused);
-  const latency = trend.map(d => d.avgExecutionMs ?? 0);
-  if (charts.routingTrend) charts.routingTrend.destroy();
-  if (charts.routingLatency) charts.routingLatency.destroy();
-  const trendCtx = document.getElementById('chart-routing-trend');
-  if (trendCtx) {
-    charts.routingTrend = new Chart(trendCtx, {
-      type: 'line',
-      data: {
-        labels,
-        datasets: [
-          { label: '总路由', data: total, borderColor: '#4f46e5', backgroundColor: 'rgba(79,70,229,0.12)', tension: 0.25 },
-          { label: '遵守', data: obeyed, borderColor: '#16a34a', backgroundColor: 'rgba(22,163,74,0.12)', tension: 0.25 },
-          { label: '违抗', data: refused, borderColor: '#dc2626', backgroundColor: 'rgba(220,38,38,0.12)', tension: 0.25 },
-        ],
-      },
-      options: { responsive: true, maintainAspectRatio: false },
-    });
-  }
-  const latencyCtx = document.getElementById('chart-routing-latency');
-  if (latencyCtx) {
-    charts.routingLatency = new Chart(latencyCtx, {
-      type: 'bar',
-      data: {
-        labels,
-        datasets: [{ label: '平均真实执行耗时(ms)', data: latency, backgroundColor: 'rgba(37,99,235,0.65)' }],
-      },
-      options: { responsive: true, maintainAspectRatio: false },
-    });
-  }
-}
-async function loadRoutingAIOptimization() {
-  const container = document.getElementById('routing-ai-optimization');
-  container.innerHTML = loading();
-  try {
-    const minAttempts = parseInt(document.getElementById('ai-opt-min-attempts').value) || 10;
-    const r = await fetch(API + '/api/routing/ai-optimization?window=' + routingWindow() + '&minAttempts=' + minAttempts);
-    if (!r.ok) {
-      const err = await r.json().catch(() => ({ error: r.statusText }));
-      throw new Error(err.error || r.statusText);
-    }
-    const data = await r.json();
-    currentAIOptimizationData = data;
-    const priorities = (data.priorities || []).length === 0
-      ? empty('暂无优先级建议')
-      : (data.priorities || []).map((p, idx) => `
-          <div style="border:1px solid var(--border);border-radius:var(--radius-sm);padding:0.75rem;margin-bottom:0.5rem">
-            <div style="display:flex;justify-content:space-between;gap:0.5rem;align-items:center;margin-bottom:0.35rem">
-              <strong>#${idx + 1} ${escapeHtml(p.area || '优化项')}</strong>
-              <span class="badge badge-info">${Math.round((p.confidence || 0) * 100)}%</span>
-            </div>
-            <div style="font-size:0.875rem;margin-bottom:0.25rem"><strong>发现：</strong>${escapeHtml(p.finding || '')}</div>
-            <div style="font-size:0.875rem"><strong>影响：</strong>${escapeHtml(p.impact || '')}</div>
-          </div>
-        `).join('');
-    const changes = (data.suggestedChanges || []).length === 0
-      ? empty('暂无可执行改动建议')
-      : (data.suggestedChanges || []).map((c, idx) => `
-          <div style="border:1px solid var(--border);border-radius:var(--radius-sm);padding:0.75rem;margin-bottom:0.5rem">
-            <div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:0.35rem">
-              <strong>#${idx + 1} ${escapeHtml(c.targetType || '')}: ${escapeHtml(c.targetName || '—')}</strong>
-              <div style="display:flex;gap:0.5rem">
-                <span class="badge ${c.targetType === 'routing_rule' ? 'badge-warn' : 'badge-allow'}">${escapeHtml(c.targetType || '—')}</span>
-                <button class="btn" style="font-size:0.75rem;padding:0.25rem 0.5rem" onclick="previewPatch(${idx})">预览 Patch</button>
-              </div>
-            </div>
-            <div style="font-size:0.875rem;margin-bottom:0.25rem"><strong>建议：</strong>${escapeHtml(c.recommendation || '')}</div>
-            <div style="font-size:0.875rem;margin-bottom:0.25rem"><strong>理由：</strong>${escapeHtml(c.rationale || '')}</div>
-            <div style="font-size:0.875rem;color:var(--text-dim)"><strong>收益：</strong>${escapeHtml(c.expectedBenefit || '')}</div>
-          </div>
-        `).join('');
-    const evidence = data.evidence || {};
-    container.innerHTML = `
-      <div class="cards" style="margin-bottom:1rem">
-        ${card('高违抗率 Agent', (evidence.highRefusalAgents || []).length)}
-        ${card('违抗模式', (evidence.topViolations || []).length)}
-        ${card('规则建议', (evidence.ruleRecommendations || []).length)}
-      </div>
-      <div class="grid-2">
-        <div class="panel">
-          <div class="panel-header"><span class="panel-title">AI 摘要</span></div>
-          <div class="panel-body" style="white-space:pre-wrap;line-height:1.6">${escapeHtml(data.summary || '—')}</div>
-        </div>
-        <div class="panel">
-          <div class="panel-header"><span class="panel-title">优先级</span></div>
-          <div class="panel-body">${priorities}</div>
-        </div>
-      </div>
-      <div class="grid-2" style="margin-top:1rem">
-        <div class="panel">
-          <div class="panel-header"><span class="panel-title">可执行改动建议</span></div>
-          <div class="panel-body">${changes}</div>
-        </div>
-        <div class="panel">
-          <div class="panel-header"><span class="panel-title">证据</span></div>
-          <div class="panel-body">
-            <details open style="margin-bottom:0.5rem"><summary style="cursor:pointer;font-weight:600">高违抗率 Agent</summary><pre style="white-space:pre-wrap;font-size:0.8rem;background:var(--bg-secondary);padding:0.5rem;border-radius:4px">${escapeHtml(JSON.stringify(evidence.highRefusalAgents || [], null, 2))}</pre></details>
-            <details style="margin-bottom:0.5rem"><summary style="cursor:pointer;font-weight:600">违抗模式</summary><pre style="white-space:pre-wrap;font-size:0.8rem;background:var(--bg-secondary);padding:0.5rem;border-radius:4px">${escapeHtml(JSON.stringify(evidence.topViolations || [], null, 2))}</pre></details>
-            <details><summary style="cursor:pointer;font-weight:600">规则建议</summary><pre style="white-space:pre-wrap;font-size:0.8rem;background:var(--bg-secondary);padding:0.5rem;border-radius:4px">${escapeHtml(JSON.stringify(evidence.ruleRecommendations || [], null, 2))}</pre></details>
-          </div>
-        </div>
-      </div>
-    `;
-  } catch (err) {
-    container.innerHTML = empty('加载失败: ' + err.message);
-  }
-}
-// Patch preview and apply functions
-async function previewPatch(idx) {
-  if (!currentAIOptimizationData || !currentAIOptimizationData.suggestedChanges) {
-    alert('请先加载 AI 优化建议');
-    return;
-  }
-  const change = currentAIOptimizationData.suggestedChanges[idx];
-  if (!change) {
-    alert('建议不存在');
-    return;
-  }
-  const drawerTitle = document.getElementById('drawer-title');
-  const drawerBody = document.getElementById('drawer-body');
-  drawerTitle.textContent = 'Patch 预览';
-  drawerBody.innerHTML = '<div style="text-align:center;padding:2rem">正在生成 patch...</div>';
-  openDrawer();
-  try {
-    const r = await fetch(API + '/api/patch/preview', {
-      method: 'POST',
-      headers: { 'Content-Type': 'application/json' },
-      body: JSON.stringify({
-        targetType: change.targetType,
-        targetName: change.targetName,
-        recommendation: change.recommendation,
-        rationale: change.rationale,
-      }),
-    });
-    if (!r.ok) {
-      const err = await r.json().catch(() => ({ error: r.statusText }));
-      throw new Error(err.error || r.statusText);
-    }
-    const preview = await r.json();
-    currentPatchPreview = preview;
-    const riskBadge = preview.risk === 'low' ? '<span class="badge badge-allow">低风险</span>'
-      : preview.risk === 'high' ? '<span class="badge badge-block">高风险</span>'
-      : '<span class="badge badge-warn">中风险</span>';
-    drawerBody.innerHTML = `
-      <div style="margin-bottom:1rem">
-        <div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:0.5rem">
-          <strong>${preview.targetType}: ${preview.targetName}</strong>
-          ${riskBadge}
-        </div>
-        <div style="font-size:0.875rem;color:var(--text-dim);margin-bottom:0.5rem">${escapeHtml(preview.summary)}</div>
-        <div style="font-size:0.875rem;color:var(--text-dim)">文件: ${escapeHtml(preview.filePath)}</div>
-      </div>
-      <div style="margin-bottom:1rem">
-        <strong>变更前:</strong>
-        <pre style="background:var(--bg-secondary);padding:0.75rem;border-radius:var(--radius-sm);max-height:300px;overflow:auto;font-size:0.75rem">${escapeHtml(preview.before)}</pre>
-      </div>
-      <div style="margin-bottom:1rem">
-        <strong>变更后:</strong>
-        <pre style="background:var(--bg-secondary);padding:0.75rem;border-radius:var(--radius-sm);max-height:300px;overflow:auto;font-size:0.75rem">${escapeHtml(preview.after)}</pre>
-      </div>
-      <div style="display:flex;gap:0.5rem;justify-content:flex-end">
-        <button class="btn" onclick="closeDrawer()">取消</button>
-        <button class="btn btn-primary" onclick="applyPatch()">应用 Patch</button>
-      </div>
-    `;
-  } catch (err) {
-    drawerBody.innerHTML = `<div style="color:var(--red);padding:1rem">预览失败: ${escapeHtml(err.message)}</div>`;
-  }
-}
-async function applyPatch() {
-  if (!currentPatchPreview) {
-    alert('请先预览 patch');
-    return;
-  }
-  if (!confirm(`确定要应用此 patch 吗？\n\n目标: ${currentPatchPreview.targetType}/${currentPatchPreview.targetName}\n\n系统会自动备份当前版本。`)) {
-    return;
-  }
-  try {
-    const r = await fetch(API + '/api/patch/apply', {
-      method: 'POST',
-      headers: { 'Content-Type': 'application/json' },
-      body: JSON.stringify({
-        targetType: currentPatchPreview.targetType,
-        targetName: currentPatchPreview.targetName,
-        afterContent: currentPatchPreview.after,
-      }),
-    });
-    if (!r.ok) {
-      const err = await r.json().catch(() => ({ error: r.statusText }));
-      throw new Error(err.error || r.statusText);
-    }
-    const result = await r.json();
-    alert(`Patch 应用成功！\n\n备份路径: ${result.backupPath}\n\n请刷新相关页面查看结果。`);
-    closeDrawer();
-    const targetType = currentPatchPreview.targetType;
-    currentPatchPreview = null;
-    // Refresh relevant pages
-    if (targetType === 'agent') loadAgents();
-    else if (targetType === 'skill') loadSkills();
-    else if (targetType === 'routing_rule') loadRoutingConfig();
-  } catch (err) {
-    alert('应用失败: ' + err.message);
-  }
-}
-async function loadRoutingEvents() {
-  try {
-    const obeyed = document.getElementById('routing-filter-obeyed')?.value || '';
-    const agent = document.getElementById('routing-filter-agent')?.value || '';
-    const params = new URLSearchParams({ limit: '100' });
-    // 'forced' is a client-side filter: keep is_forced=1 rows regardless of obeyed.
-    if (obeyed !== '' && obeyed !== 'forced') params.set('obeyed', obeyed);
-    if (agent) params.set('agent', agent);
-    const r = await fetch(API + '/api/routing/events?' + params.toString());
-    let rows = await r.json();
-    if (obeyed === 'forced') rows = rows.filter(e => e.is_forced === 1);
-    const tbody = document.getElementById('routing-events-tbody');
-    if (!rows || rows.length === 0) {
-      tbody.innerHTML = '<tr><td colspan="5">' + empty('暂无路由事件') + '</td></tr>';
-      return;
-    }
-    tbody.innerHTML = rows.map(e => {
-      let status;
-      if (!e.is_forced) {
-        status = '<span class="badge" style="background:var(--bg-secondary);color:var(--text-dim)">未路由</span>';
-      } else if (e.obeyed === 1) {
-        status = '<span class="badge badge-allow">遵守</span>';
-      } else if (e.obeyed === 0) {
-        status = '<span class="badge badge-block">违抗</span>';
-      } else {
-        status = '<span class="badge badge-info">未判定</span>';
-      }
-      const ts = new Date(e.ts).toLocaleString('zh-CN', { month:'2-digit', day:'2-digit', hour:'2-digit', minute:'2-digit' });
-      return '<tr onclick="openRoutingEventDrawer(' + JSON.stringify(e).replace(/"/g,'&quot;') + ')">'
-        + '<td style="color:var(--text-dim);font-size:0.8rem">' + ts + '</td>'
-        + '<td style="font-family:monospace">' + (e.routed_to_name || '—') + '</td>'
-        + '<td>' + status + '</td>'
-        + '<td style="font-size:0.8rem;color:var(--text-dim)">' + (e.first_tool_name || '—') + '</td>'
-        + '<td style="font-size:0.8rem">' + (e.prompt || '').slice(0, 80) + '</td></tr>';
-    }).join('');
-  } catch (err) {
-    document.getElementById('routing-events-tbody').innerHTML = '<tr><td colspan="5">' + empty('加载失败: ' + err.message) + '</td></tr>';
-  }
-}
-function openRoutingEventDrawer(e) {
-  let intent = {};
-  try { intent = JSON.parse(e.intent_json || '{}'); } catch { /* ignore */ }
-  let chain = [];
-  try { chain = JSON.parse(e.downstream_task_chain || '[]'); } catch { /* ignore */ }
-  const html = [
-    '<div style="margin-bottom:1rem"><div style="font-size:0.75rem;color:var(--text-dim)">Prompt</div>',
-    '<div style="white-space:pre-wrap;font-size:0.875rem">' + (e.prompt || '—') + '</div></div>',
-    '<div style="margin-bottom:1rem"><div style="font-size:0.75rem;color:var(--text-dim)">Intent</div>',
-    '<pre style="font-size:0.75rem;background:var(--bg-secondary);padding:0.5rem;border-radius:4px;overflow:auto">'
-      + JSON.stringify(intent, null, 2) + '</pre></div>',
-    '<div style="margin-bottom:1rem"><div style="font-size:0.75rem;color:var(--text-dim)">路由</div>',
-    '<div>type=<b>' + (e.routed_to_type || '—') + '</b>, name=<b>' + (e.routed_to_name || '—')
-      + '</b>, is_forced=' + (e.is_forced ? 'yes' : 'no') + '</div></div>',
-    '<div style="margin-bottom:1rem"><div style="font-size:0.75rem;color:var(--text-dim)">判定</div>',
-    '<div>obeyed=<b>' + (e.obeyed === null || e.obeyed === undefined ? 'null' : e.obeyed)
-      + '</b>, first_tool=' + (e.first_tool_name || '—') + '</div></div>',
-    chain.length > 0 ? '<div style="margin-bottom:1rem"><div style="font-size:0.75rem;color:var(--text-dim)">下游 Task 链</div><code>'
-      + chain.join(' → ') + '</code></div>' : '',
-    e.refusal_reason ? '<div style="margin-bottom:1rem"><div style="font-size:0.75rem;color:var(--text-dim)">违抗原因</div>'
-      + '<div style="padding:0.5rem;background:var(--bg-secondary);border-left:3px solid var(--danger,#dc2626)">'
-      + e.refusal_reason + '</div></div>' : '',
-    '<div style="font-size:0.75rem;color:var(--text-dim)">classification_ms=' + (e.classification_ms || '—')
-      + ' · fallback_used=' + (e.fallback_used ? 'yes' : 'no')
-      + ' · injection_version=' + (e.injection_version || '—') + '</div>',
-  ].join('');
-  openDrawer('路由事件 #' + e.id, html);
-}
-async function loadRoutingRefusals() {
-  try {
-    // Load refusals, violations, and rule-states in parallel.
-    const [refusalsRes, violationsRes, rulesRes] = await Promise.all([
-      fetch(API + '/api/routing/refusals?window=' + routingWindow()),
-      fetch(API + '/api/routing/violations?window=' + routingWindow()),
-      fetch(API + '/api/routing/rule-states'),
-    ]);
-    const refusalsData = await refusalsRes.json();
-    const violationsData = await violationsRes.json();
-    const ruleStatesData = await rulesRes.json();
-    const disabledMap = new Map();
-    (ruleStatesData.ruleStates || []).forEach(s => {
-      disabledMap.set(s.task_type + '__' + s.agent, s);
-    });
-    const container = document.getElementById('routing-refusals');
-    // Show violations alerts first (Phase 3 Feature 3)
-    let html = '';
-    if (violationsData.violations && violationsData.violations.length > 0) {
-      const criticalViolations = violationsData.violations.filter(v => v.severity === 'critical' || v.severity === 'high');
-      if (criticalViolations.length > 0) {
-        html += '<div style="margin-bottom:1rem;padding:1rem;background:var(--danger,#dc2626);color:white;border-radius:var(--radius-sm)">';
-        html += '<div style="font-weight:600;margin-bottom:0.5rem">⚠️ 检测到 ' + criticalViolations.length + ' 个高风险违抗模式</div>';
-        html += '<div style="font-size:0.875rem">以下路由规则的违抗率过高，建议调整或禁用：</div>';
-        html += '<ul style="margin:0.5rem 0 0 1.5rem;padding:0">';
-        criticalViolations.forEach(v => {
-          html += '<li style="margin-bottom:0.25rem"><code>' + v.taskType + '</code> → <code>' + v.agent + '</code> ';
-          html += '(违抗率 ' + (v.refusalRate * 100).toFixed(0) + '%, ' + v.refusals + '/' + v.totalAttempts + ' 次)</li>';
-        });
-        html += '</ul></div>';
-      }
-      // Show all violations with severity badges
-      html += '<div style="margin-bottom:1rem"><div style="font-weight:600;margin-bottom:0.5rem">违抗模式分析</div>';
-      violationsData.violations.forEach(v => {
-        const severityColor = {
-          critical: 'background:#dc2626;color:white',
-          high: 'background:#f59e0b;color:white',
-          medium: 'background:#3b82f6;color:white',
-          low: 'background:var(--bg-secondary);color:var(--text-dim)',
-        }[v.severity];
-        const severityLabel = { critical: '严重', high: '高', medium: '中', low: '低' }[v.severity];
-        html += '<details style="margin-bottom:0.5rem;border:1px solid var(--border);border-radius:4px;padding:0.5rem">';
-        html += '<summary style="cursor:pointer;display:flex;gap:0.5rem;align-items:center">';
-        html += '<span style="padding:0.25rem 0.5rem;border-radius:4px;font-size:0.75rem;font-weight:600;' + severityColor + '">' + severityLabel + '</span>';
-        html += '<code>' + v.taskType + '</code> → <code>' + v.agent + '</code>';
-        const state = disabledMap.get(v.taskType + '__' + v.agent);
-        if (state && state.disabled === 1) {
-          const tag = state.auto_disabled === 1 ? '自动禁用' : '手动禁用';
-          html += '<span style="padding:0.25rem 0.5rem;border-radius:4px;font-size:0.75rem;background:var(--text-dim);color:white">' + tag + '</span>';
-        }
-        html += '<span style="margin-left:auto;font-size:0.875rem;color:var(--text-dim)">违抗率 ' + (v.refusalRate * 100).toFixed(0) + '% (' + v.refusals + '/' + v.totalAttempts + ')</span>';
-        const isDisabled = state && state.disabled === 1;
-        const btnLabel = isDisabled ? '启用' : '禁用';
-        html += '<button class="btn" style="margin-left:0.5rem;padding:0.25rem 0.5rem;font-size:0.75rem" onclick="event.preventDefault();event.stopPropagation();toggleRuleState(\'' + v.taskType + '\', \'' + v.agent + '\', ' + (!isDisabled) + ')">' + btnLabel + '</button>';
-        html += '</summary>';
-        html += '<div style="margin-top:0.5rem;padding:0.5rem;background:var(--bg-secondary);border-radius:4px;font-size:0.875rem">';
-        html += '<div style="margin-bottom:0.5rem">最近 5 次尝试中违抗 ' + v.recentRefusals + ' 次</div>';
-        if (v.samples.length > 0) {
-          html += '<div style="font-weight:600;margin-bottom:0.25rem">样例：</div><ul style="margin:0;padding:0 0 0 1rem">';
-          v.samples.forEach(s => {
-            html += '<li style="margin-bottom:0.5rem">';
-            html += '<div>' + s.prompt + '</div>';
-            if (s.refusal_reason) {
-              html += '<div style="font-size:0.75rem;color:var(--text-dim);margin-top:2px">↳ ' + s.refusal_reason + '</div>';
-            }
-            html += '</li>';
-          });
-          html += '</ul>';
-        }
-        html += '</div></details>';
-      });
-      html += '</div>';
-    }
-    // Show original refusals grouping (for backward compatibility)
-    if (!refusalsData.groups || refusalsData.groups.length === 0) {
-      if (html === '') {
-        container.innerHTML = empty('暂无违抗事件');
-      } else {
-        container.innerHTML = html;
-      }
-      return;
-    }
-    html += '<div style="margin-top:1rem;padding-top:1rem;border-top:1px solid var(--border)">';
-    html += '<div style="font-weight:600;margin-bottom:0.5rem">违抗事件列表</div>';
-    html += refusalsData.groups.map(g => {
-      const samples = g.samples.map(s =>
-        '<li style="margin-bottom:0.5rem">'
-        + '<div style="font-size:0.8rem">' + s.prompt + '</div>'
-        + (s.refusal_reason ? '<div style="font-size:0.75rem;color:var(--text-dim);margin-top:2px">↳ ' + s.refusal_reason + '</div>' : '')
-        + '</li>'
-      ).join('');
-      return '<details style="margin-bottom:0.5rem;border:1px solid var(--border);border-radius:4px;padding:0.5rem">'
-        + '<summary style="cursor:pointer;display:flex;gap:0.5rem;align-items:center">'
-        + '<span class="badge badge-block">' + g.count + '</span>'
-        + '<code>' + g.taskType + '</code> → <code>' + g.agent + '</code></summary>'
-        + '<ul style="margin:0.5rem 0 0 1rem;padding:0">' + samples + '</ul>'
-        + '</details>';
-    }).join('');
-    html += '</div>';
-    container.innerHTML = html;
-  } catch (err) {
-    document.getElementById('routing-refusals').innerHTML = empty('加载失败: ' + err.message);
-  }
-}
-async function toggleRuleState(taskType, agent, disabled) {
-  const verb = disabled ? '禁用' : '启用';
-  if (!confirm(verb + ' ' + taskType + ' → ' + agent + ' 的路由规则？')) return;
-  try {
-    const r = await fetch(API + '/api/routing/rule-states', {
-      method: 'PUT',
-      headers: { 'Content-Type': 'application/json' },
-      body: JSON.stringify({ taskType, agent, disabled, reason: disabled ? '手动禁用（Web UI）' : null }),
-    });
-    if (!r.ok) {
-      const err = await r.json();
-      throw new Error(err.error || 'Unknown error');
-    }
-    await loadRoutingRefusals();
-  } catch (err) {
-    alert(verb + '失败: ' + err.message);
-  }
-}
-// === Routing Config Editor (Phase 3 Feature 2, upgraded to Monaco in Phase 4 Feature 1) ===
-let monacoEditor = null;
-function initMonacoEditor() {
-  if (monacoEditor) return; // already initialized
-  require.config({ paths: { vs: 'https://cdn.jsdelivr.net/npm/monaco-editor@0.45.0/min/vs' } });
-  require(['vs/editor/editor.main'], function () {
-    monacoEditor = monaco.editor.create(document.getElementById('routing-config-editor'), {
-      value: '',
-      language: 'yaml',
-      theme: 'vs',
-      automaticLayout: true,
-      minimap: { enabled: false },
-      scrollBeyondLastLine: false,
-      fontSize: 14,
-      lineNumbers: 'on',
-      renderWhitespace: 'selection',
-      tabSize: 2,
-    });
-  });
-}
-async function loadRoutingConfig() {
-  try {
-    const r = await fetch(API + '/api/routing/config');
-    const data = await r.json();
-    // Initialize Monaco Editor if not already done
-    if (!monacoEditor) {
-      initMonacoEditor();
-      // Wait for Monaco to initialize
-      await new Promise(resolve => {
-        const checkInterval = setInterval(() => {
-          if (monacoEditor) {
-            clearInterval(checkInterval);
-            resolve();
-          }
-        }, 100);
-      });
-    }
-    // Set editor content
-    if (monacoEditor) {
-      monacoEditor.setValue(data.content || '');
-    }
-    const sourceLabel = data.source === 'user' ? '用户配置' : data.source === 'default' ? '默认配置' : '无配置';
-    document.getElementById('routing-config-source').textContent = sourceLabel;
-    document.getElementById('routing-config-path').textContent = data.source === 'user' ? data.userPath : data.defaultPath;
-    // Hide error/success messages
-    document.getElementById('routing-config-error').style.display = 'none';
-    document.getElementById('routing-config-success').style.display = 'none';
-  } catch (err) {
-    document.getElementById('routing-config-error').textContent = '加载失败: ' + err.message;
-    document.getElementById('routing-config-error').style.display = 'block';
-  }
-}
-async function saveRoutingConfig() {
-  if (!monacoEditor) {
-    alert('编辑器未初始化');
-    return;
-  }
-  const content = monacoEditor.getValue();
-  const errorEl = document.getElementById('routing-config-error');
-  const successEl = document.getElementById('routing-config-success');
-  errorEl.style.display = 'none';
-  successEl.style.display = 'none';
-  try {
-    const r = await fetch(API + '/api/routing/config', {
-      method: 'PUT',
-      headers: { 'Content-Type': 'application/json' },
-      body: JSON.stringify({ content }),
-    });
-    if (!r.ok) {
-      const err = await r.json();
-      throw new Error(err.error || 'Unknown error');
-    }
-    const result = await r.json();
-    successEl.textContent = '✓ 保存成功！配置已写入 ' + result.path + '（热加载将在几秒内生效）';
-    successEl.style.display = 'block';
-    // Reload to show updated source
-    setTimeout(() => loadRoutingConfig(), 1000);
-  } catch (err) {
-    errorEl.textContent = '保存失败: ' + err.message;
-    errorEl.style.display = 'block';
-  }
-}
-// === A/B Testing (Phase 5 Feature 1) ===
-let experimentsEditor = null;
-function initExperimentsEditor() {
-  if (experimentsEditor) return;
-  require.config({ paths: { vs: 'https://cdn.jsdelivr.net/npm/monaco-editor@0.45.0/min/vs' } });
-  require(['vs/editor/editor.main'], function () {
-    experimentsEditor = monaco.editor.create(document.getElementById('experiments-config-editor'), {
-      value: '',
-      language: 'yaml',
-      theme: 'vs',
-      automaticLayout: true,
-      minimap: { enabled: false },
-      scrollBeyondLastLine: false,
-      fontSize: 14,
-      lineNumbers: 'on',
-      renderWhitespace: 'selection',
-      tabSize: 2,
-    });
-  });
-}
-async function loadExperimentsConfig() {
-  try {
-    const r = await fetch(API + '/api/routing/experiments/config');
-    const data = await r.json();
-    if (!experimentsEditor) {
-      initExperimentsEditor();
-      await new Promise(resolve => {
-        const tick = setInterval(() => {
-          if (experimentsEditor) { clearInterval(tick); resolve(); }
-        }, 100);
-      });
-    }
-    experimentsEditor.setValue(data.content || '');
-    document.getElementById('experiments-config-source').textContent =
-      data.source === 'user' ? '用户配置' : '未配置（保存将创建新文件）';
-    document.getElementById('experiments-config-path').textContent = data.path || '';
-    document.getElementById('experiments-config-error').style.display = 'none';
-    document.getElementById('experiments-config-success').style.display = 'none';
-  } catch (err) {
-    document.getElementById('experiments-config-error').textContent = '加载失败: ' + err.message;
-    document.getElementById('experiments-config-error').style.display = 'block';
-  }
-}
-async function saveExperimentsConfig() {
-  if (!experimentsEditor) { alert('编辑器未初始化'); return; }
-  const content = experimentsEditor.getValue();
-  const errorEl = document.getElementById('experiments-config-error');
-  const successEl = document.getElementById('experiments-config-success');
-  errorEl.style.display = 'none';
-  successEl.style.display = 'none';
-  try {
-    const r = await fetch(API + '/api/routing/experiments/config', {
-      method: 'PUT',
-      headers: { 'Content-Type': 'application/json' },
-      body: JSON.stringify({ content }),
-    });
-    if (!r.ok) {
-      const err = await r.json();
-      throw new Error(err.error || 'Unknown error');
-    }
-    const result = await r.json();
-    successEl.textContent = '✓ 保存成功！配置已写入 ' + result.path;
-    successEl.style.display = 'block';
-    setTimeout(() => { loadExperimentsConfig(); loadExperimentsAnalysis(); }, 1000);
-  } catch (err) {
-    errorEl.textContent = '保存失败: ' + err.message;
-    errorEl.style.display = 'block';
-  }
-}
-async function loadExperimentsAnalysis() {
-  const summaryEl = document.getElementById('experiments-summary');
-  const tableEl = document.getElementById('experiments-analysis');
-  const winnerEl = document.getElementById('experiments-winner');
-  summaryEl.innerHTML = '';
-  tableEl.innerHTML = loading();
-  winnerEl.style.display = 'none';
-  winnerEl.innerHTML = '';
-  try {
-    const r = await fetch(API + '/api/routing/experiments/analysis');
-    const data = await r.json();
-    if (!data.experimentId) {
-      tableEl.innerHTML = empty('当前没有活跃实验。编辑上方 YAML 配置并保存后即可开始。');
-      return;
-    }
-    const endedLabel = data.endedAt ? ' · 已结束 ' + fmt(data.endedAt) : (data.enabled ? ' · 进行中' : ' · 未启用');
-    summaryEl.innerHTML =
-      '<strong>' + (data.experimentName || data.experimentId) + '</strong>' +
-      '<span style="color:var(--text-dim)"> (' + data.experimentId + ')</span>' +
-      '<span style="color:var(--text-dim)">' + endedLabel + '</span>' +
-      '<br><small style="color:var(--text-dim)">开始于 ' + fmt(data.startedAt) + '</small>';
-    const rows = (data.groups || []).map(g => {
-      const rate = g.obeyedRate == null ? '—' : (g.obeyedRate * 100).toFixed(1) + '%';
-      const avg = g.avgClassificationMs == null ? '—' : g.avgClassificationMs.toFixed(0) + 'ms';
-      return '<tr>' +
-        '<td><strong>' + g.id + '</strong> <span style="color:var(--text-dim)">(' + g.name + ')</span></td>' +
-        '<td>' + g.weight + '%</td>' +
-        '<td>' + g.total + '</td>' +
-        '<td>' + g.obeyed + '</td>' +
-        '<td>' + g.refused + '</td>' +
-        '<td>' + g.unknown + '</td>' +
-        '<td>' + rate + '</td>' +
-        '<td>' + avg + '</td>' +
-        '</tr>';
-    }).join('');
-    tableEl.innerHTML =
-      '<table>' +
-      '<thead><tr>' +
-      '<th>组</th><th>权重</th><th>样本</th><th>听话</th><th>违抗</th><th>未知</th><th>听话率</th><th>平均分类耗时</th>' +
-      '</tr></thead><tbody>' + rows + '</tbody></table>';
-    if (data.zScore !== null && data.zScore !== undefined) {
-      const zline =
-        '<div style="margin-top:0.5rem;font-size:0.875rem;color:var(--text-dim)">' +
-        'z-score = ' + data.zScore.toFixed(3) +
-        (data.sampleAdequate ? ' (样本充足)' : ' (样本不足，需每组 ≥ 50)') +
-        '</div>';
-      tableEl.insertAdjacentHTML('beforeend', zline);
-    }
-    if (data.suggestedWinner && !data.endedAt) {
-      winnerEl.style.display = 'block';
-      winnerEl.innerHTML =
-        '<div style="padding:1rem;background:var(--primary);color:white;border-radius:var(--radius-sm)">' +
-        '<div style="margin-bottom:0.5rem"><strong>建议获胜方案：' + data.suggestedWinner + '</strong> (z &gt; 1.96)</div>' +
-        '<button class="btn" style="background:white;color:var(--primary)" onclick="promoteExperiment(\'' + data.suggestedWinner + '\')">一键应用该组规则到 routing.yaml</button>' +
-        '</div>';
-    } else if (!data.endedAt && data.groups && data.groups.length >= 2) {
-      winnerEl.style.display = 'block';
-      const buttons = data.groups.map(g =>
-        '<button class="btn" onclick="promoteExperiment(\'' + g.id + '\')">手动晶升 ' + g.id + '</button>'
-      ).join(' ');
-      winnerEl.innerHTML =
-        '<div style="padding:1rem;background:var(--bg-alt);border:1px solid var(--border);border-radius:var(--radius-sm)">' +
-        '<div style="margin-bottom:0.5rem;color:var(--text-dim)">尚未达到显著差异。如确定要提前收尾实验：</div>' +
-        buttons + '</div>';
-    }
-  } catch (err) {
-    tableEl.innerHTML = empty('加载失败: ' + err.message);
-  }
-}
-async function promoteExperiment(groupId) {
-  if (!confirm('将 ' + groupId + ' 组的规则写入 routing.yaml 并结束当前实验？原 routing.yaml 会备份为 .bak 文件。')) return;
-  try {
-    const r = await fetch(API + '/api/routing/experiments/promote', {
-      method: 'POST',
-      headers: { 'Content-Type': 'application/json' },
-      body: JSON.stringify({ groupId }),
-    });
-    if (!r.ok) {
-      const err = await r.json();
-      throw new Error(err.error || 'Unknown error');
-    }
-    const result = await r.json();
-    alert('✓ 已晶升 ' + result.promoted + ' 组到 routing.yaml' +
-      (result.backupPath ? '\n备份：' + result.backupPath : '') +
-      '\n实验结束于 ' + result.endedAt);
-    await loadExperimentsConfig();
-    await loadExperimentsAnalysis();
-  } catch (err) {
-    alert('晶升失败: ' + err.message);
-  }
-}
-// === Rule Recommendations (Phase 5 Feature 3) ===
-async function loadRecommendations() {
-  const container = document.getElementById('recommendations-list');
-  container.innerHTML = loading();
-  const days = document.getElementById('recommendations-days')?.value || '7';
-  try {
-    const r = await fetch(API + '/api/routing/recommendations?days=' + days);
-    const data = await r.json();
-    const list = data.recommendations || [];
-    if (list.length === 0) {
-      container.innerHTML = empty('暂无推荐。样本量不足或当前规则已贴近实际行为。');
-      return;
-    }
-    let html = '<table>';
-    html += '<thead><tr>' +
-      '<th>任务类型</th><th>复杂度</th>' +
-      '<th>当前路由</th><th>建议路由</th>' +
-      '<th>样本</th><th>当前听话率</th><th>建议 agent 使用率</th>' +
-      '<th>置信度</th><th>说明</th>' +
-    '</tr></thead><tbody>';
-    list.forEach(rec => {
-      const pctFmt = v => (v * 100).toFixed(0) + '%';
-      const conf = (rec.confidence * 100).toFixed(0) + '%';
-      html += '<tr>' +
-        '<td><code>' + rec.taskType + '</code></td>' +
-        '<td>' + (rec.complexity || '—') + '</td>' +
-        '<td>' + (rec.currentAgent ? '<code>' + rec.currentAgent + '</code>' : '<span style="color:var(--text-dim)">(skill 回退)</span>') + '</td>' +
-        '<td><code style="color:var(--primary)">' + rec.recommendedAgent + '</code></td>' +
-        '<td>' + rec.sampleSize + '</td>' +
-        '<td>' + pctFmt(rec.currentObeyedRate) + '</td>' +
-        '<td>' + pctFmt(rec.recommendedUsageRate) + '</td>' +
-        '<td>' + conf + '</td>' +
-        '<td style="font-size:0.85rem;color:var(--text-dim)">' + rec.reason + '</td>' +
-      '</tr>';
-    });
-    html += '</tbody></table>';
-    html += '<div style="margin-top:0.75rem;font-size:0.85rem;color:var(--text-dim)">' +
-      '要应用某条推荐，打开"路由调优"tab，手动更新对应 when 块的 agent 名称并保存。' +
-      '</div>';
-    container.innerHTML = html;
-  } catch (err) {
-    container.innerHTML = empty('加载推荐失败: ' + err.message);
-  }
-}
-// === Init ===
-nav('dashboard');
-</script>
-</body>
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Claude Forge 管理后台</title>
+    <script type="module" crossorigin src="/assets/index-DnaQt27h.js"></script>
+    <link rel="stylesheet" crossorigin href="/assets/index-CtylfoaN.css">
+  </head>
+  <body>
+    <div id="root"></div>
+  </body>
 </html>