npm - @wendongfly/myhi - Versions diffs - 1.3.130 → 1.3.138 - Mend

@wendongfly/myhi 1.3.130 → 1.3.138

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 (7) hide show

package/dist/chat.html +379 -15
package/dist/index.html +1501 -1294
package/dist/index.js +1 -1
package/dist/index.min.js +145 -145
package/installer/README.md +1 -1
package/installer/install-myhi.ps1 +14 -0
package/package.json +1 -1

package/dist/index.html CHANGED Viewed

@@ -1,1294 +1,1501 @@
-<!DOCTYPE html>
-<html lang="zh-CN">
-<head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, viewport-fit=cover">
-  <meta name="theme-color" content="#0d1117">
-  <meta name="apple-mobile-web-app-capable" content="yes">
-  <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
-  <meta name="apple-mobile-web-app-title" content="myhi">
-  <link rel="manifest" href="/manifest.json">
-  <link rel="apple-touch-icon" href="/icon.png">
-  <title>myhi</title>
-  <script src="/sio-client/socket.io.min.js"></script>
-  <script>
-    (function(){try{var t=localStorage.getItem('myhi_theme')||'dark',f=localStorage.getItem('myhi_font')||'medium',r=document.documentElement;if(t&&t!=='dark')r.setAttribute('data-theme',t);r.setAttribute('data-font',f);}catch(e){}})();
-  </script>
-  <style>
-    :root {
-      --bg:#0d1117; --surface:#161b22; --border:#21262d; --border2:#30363d;
-      --text:#e6edf3; --text2:#b1bac4; --muted:#8b949e; --dim:#6e7681;
-      --accent:#7c3aed; --accent2:#9d5cf5; --red:#f85149; --redbg:#3d1515;
-      --green:#3fb950; --yellow:#d29922; --orange:#f0883e;
-    }
-    :root[data-theme="light"] { --bg:#ffffff; --surface:#f6f8fa; --border:#d0d7de; --border2:#d0d7de;
-      --text:#1f2328; --text2:#57606a; --muted:#656d76; --dim:#818b98;
-      --accent:#8250df; --accent2:#8250df; --red:#cf222e; --redbg:#ffebe9;
-      --green:#1a7f37; --yellow:#9a6700; --orange:#bc4c00; }
-    :root[data-theme="black"] { --bg:#000000; --surface:#0a0a0a; --border:#161616; --border2:#262626; }
-    @media (prefers-color-scheme: light) { :root[data-theme="system"] { --bg:#ffffff; --surface:#f6f8fa; --border:#d0d7de; --border2:#d0d7de;
-      --text:#1f2328; --text2:#57606a; --muted:#656d76; --dim:#818b98;
-      --accent:#8250df; --accent2:#8250df; --red:#cf222e; --redbg:#ffebe9;
-      --green:#1a7f37; --yellow:#9a6700; --orange:#bc4c00; } }
-    html { font-size: 16px; }
-    html[data-font="small"]{font-size:15px;} html[data-font="medium"]{font-size:17px;} html[data-font="large"]{font-size:19.5px;}
-    * { box-sizing: border-box; margin: 0; padding: 0; -webkit-tap-highlight-color: transparent; }
-    html, body {
-      height: 100%;
-      background: var(--bg);
-      color: var(--text);
-      font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
-      overscroll-behavior: none;
-    }
-    /* ── Layout ── */
-    #app {
-      display: flex;
-      flex-direction: column;
-      height: 100%;
-      max-width: 640px;
-      margin: 0 auto;
-    }
-    /* ── Header ── */
-    #header {
-      display: flex;
-      align-items: center;
-      justify-content: space-between;
-      padding: 0 1rem;
-      padding-top: max(1rem, env(safe-area-inset-top));
-      padding-bottom: 0.75rem;
-      background: var(--bg);
-      position: sticky;
-      top: 0;
-      z-index: 10;
-      border-bottom: 1px solid var(--border);
-    }
-    .logo {
-      font-size: 1.35rem;
-      font-weight: 700;
-      letter-spacing: -0.5px;
-    }
-    .logo span { color: var(--accent); }
-    #conn-dot {
-      width: 8px; height: 8px;
-      border-radius: 50%;
-      background: var(--muted);
-      transition: background 0.3s;
-      flex-shrink: 0;
-    }
-    #conn-dot.on  { background: var(--green); box-shadow: 0 0 6px var(--green); }
-    #conn-dot.off { background: var(--red); }
-    /* ── Session list ── */
-    #list {
-      flex: 1;
-      overflow-y: auto;
-      -webkit-overflow-scrolling: touch;
-      padding: 0.75rem 0.75rem 6rem;
-    }
-    .empty-state {
-      display: flex;
-      flex-direction: column;
-      align-items: center;
-      justify-content: center;
-      gap: 0.75rem;
-      height: 60%;
-      color: var(--muted);
-    }
-    .empty-state svg { opacity: 0.3; }
-    .empty-state p { font-size: 0.95rem; }
-    /* ── Session card ── */
-    .card {
-      display: flex;
-      align-items: center;
-      gap: 0.85rem;
-      padding: 0.85rem 0.9rem;
-      background: var(--surface);
-      border: 1px solid var(--border);
-      border-radius: 12px;
-      margin-bottom: 0.6rem;
-      cursor: pointer;
-      transition: border-color 0.15s, background 0.15s;
-      user-select: none;
-      -webkit-user-select: none;
-    }
-    .card:active { background: #1c2230; }
-    .avatar {
-      width: 44px; height: 44px;
-      border-radius: 10px;
-      display: flex; align-items: center; justify-content: center;
-      font-size: 1.3rem;
-      font-weight: 700;
-      flex-shrink: 0;
-      font-family: 'SF Mono', Consolas, monospace;
-      color: #fff;
-    }
-    .card-body {
-      flex: 1;
-      min-width: 0;
-    }
-    .card-title {
-      font-size: 0.95rem;
-      font-weight: 600;
-      white-space: nowrap;
-      overflow: hidden;
-      text-overflow: ellipsis;
-    }
-    .card-sub {
-      font-size: 0.75rem;
-      color: var(--muted);
-      margin-top: 0.2rem;
-      white-space: nowrap;
-      overflow: hidden;
-      text-overflow: ellipsis;
-    }
-    .tag-chip {
-      display: inline-block;
-      font-size: 0.66rem;
-      color: var(--text2);
-      background: rgba(124,58,237,0.14);
-      border: 1px solid rgba(124,58,237,0.35);
-      border-radius: 999px;
-      padding: 0.05rem 0.45rem;
-      line-height: 1.5;
-    }
-    .card-right {
-      display: flex;
-      flex-direction: column;
-      align-items: flex-end;
-      gap: 0.35rem;
-      flex-shrink: 0;
-    }
-    .status-dot {
-      width: 8px; height: 8px;
-      border-radius: 50%;
-    }
-    .status-dot.alive { background: var(--green); box-shadow: 0 0 5px var(--green); }
-    .status-dot.dead  { background: var(--red); }
-    .viewers {
-      font-size: 0.7rem;
-      color: var(--muted);
-    }
-    /* ── FAB ── */
-    #fab {
-      position: fixed;
-      bottom: max(1.5rem, calc(env(safe-area-inset-bottom) + 1rem));
-      right: max(1.5rem, calc(env(safe-area-inset-right) + 1rem));
-      width: 56px; height: 56px;
-      border-radius: 28px;
-      background: var(--accent);
-      color: #fff;
-      border: none;
-      font-size: 1.6rem;
-      line-height: 1;
-      cursor: pointer;
-      box-shadow: 0 4px 20px rgba(124,58,237,0.5);
-      display: flex; align-items: center; justify-content: center;
-      transition: background 0.15s, transform 0.15s;
-      z-index: 20;
-    }
-    #fab:active { background: var(--accent2); transform: scale(0.93); }
-    /* ── Bottom sheet ── */
-    #sheet-backdrop {
-      display: none;
-      position: fixed; inset: 0;
-      background: rgba(0,0,0,0.55);
-      z-index: 30;
-    }
-    #sheet-backdrop.open { display: block; }
-    #sheet {
-      position: fixed;
-      bottom: 0; left: 0; right: 0;
-      background: var(--surface);
-      border-radius: 20px 20px 0 0;
-      padding: 0 1.25rem;
-      padding-bottom: max(1.5rem, env(safe-area-inset-bottom));
-      z-index: 31;
-      transform: translateY(100%);
-      transition: transform 0.28s cubic-bezier(0.32, 0.72, 0, 1);
-      max-width: 640px;
-      margin: 0 auto;
-    }
-    #sheet.open { transform: translateY(0); }
-    .sheet-handle {
-      width: 36px; height: 4px;
-      background: var(--border);
-      border-radius: 2px;
-      margin: 0.75rem auto 1.25rem;
-    }
-    .sheet-title {
-      font-size: 1rem;
-      font-weight: 600;
-      margin-bottom: 1rem;
-    }
-    /* ── Preset chips ── */
-    .presets {
-      display: flex;
-      gap: 0.5rem;
-      overflow-x: auto;
-      padding-bottom: 0.75rem;
-      margin-bottom: 0.75rem;
-      border-bottom: 1px solid var(--border);
-      scrollbar-width: none;
-      -webkit-overflow-scrolling: touch;
-    }
-    .presets::-webkit-scrollbar { display: none; }
-    .chip {
-      display: flex;
-      flex-direction: column;
-      align-items: center;
-      gap: 0.3rem;
-      flex-shrink: 0;
-      width: 76px;
-      padding: 0.6rem 0.4rem;
-      background: var(--bg);
-      border: 1.5px solid var(--border);
-      border-radius: 12px;
-      cursor: pointer;
-      transition: border-color 0.15s, background 0.15s;
-      user-select: none;
-      -webkit-user-select: none;
-    }
-    .chip:active, .chip.selected {
-      border-color: var(--accent);
-      background: rgba(124,58,237,0.12);
-    }
-    .chip-icon { font-size: 1.4rem; line-height: 1; }
-    .chip-label {
-      font-size: 0.65rem;
-      color: var(--muted);
-      text-align: center;
-      white-space: nowrap;
-      overflow: hidden;
-      text-overflow: ellipsis;
-      width: 100%;
-    }
-    .chip.selected .chip-label { color: var(--accent2); }
-    .field { margin-bottom: 0.9rem; }
-    .field label {
-      display: block;
-      font-size: 0.75rem;
-      color: var(--muted);
-      margin-bottom: 0.35rem;
-      font-weight: 500;
-      text-transform: uppercase;
-      letter-spacing: 0.04em;
-    }
-    .field input {
-      width: 100%;
-      background: var(--bg);
-      border: 1px solid var(--border);
-      border-radius: 8px;
-      padding: 0.65rem 0.8rem;
-      color: var(--text);
-      font-size: 0.95rem;
-      font-family: inherit;
-      outline: none;
-      transition: border-color 0.15s;
-    }
-    .field input:focus { border-color: var(--accent); }
-    .field input::placeholder { color: var(--dim); }
-    #btn-create {
-      width: 100%;
-      background: var(--accent);
-      color: #fff;
-      border: none;
-      border-radius: 10px;
-      padding: 0.8rem;
-      font-size: 0.95rem;
-      font-weight: 600;
-      cursor: pointer;
-      margin-top: 0.25rem;
-      transition: background 0.15s;
-    }
-    #btn-create:active { background: var(--accent2); }
-    /* ── Dir picker ── */
-    #dir-picker {
-      display: none; position: fixed; inset: 0; z-index: 50;
-      align-items: flex-end; justify-content: center;
-    }
-    #dir-picker.open { display: flex; }
-    #dir-backdrop2 { position: absolute; inset: 0; background: rgba(0,0,0,0.6); }
-    #dir-box {
-      position: relative; z-index: 1;
-      background: var(--surface);
-      border-radius: 20px 20px 0 0;
-      width: 100%; max-width: 640px;
-      padding: 0 1.25rem;
-      padding-bottom: max(1.5rem, env(safe-area-inset-bottom));
-      max-height: 70vh; display: flex; flex-direction: column;
-    }
-    #dir-current {
-      font-size: 0.72rem; color: var(--muted);
-      font-family: 'SF Mono', Consolas, monospace;
-      padding: 0.9rem 0 0.5rem;
-      border-bottom: 1px solid var(--border);
-      word-break: break-all;
-    }
-    #dir-list {
-      flex: 1; overflow-y: auto; padding: 0.4rem 0;
-      -webkit-overflow-scrolling: touch;
-    }
-    .dir-item {
-      display: flex; align-items: center; gap: 0.6rem;
-      padding: 0.65rem 0.2rem;
-      border-bottom: 1px solid var(--border);
-      cursor: pointer; font-size: 0.9rem;
-    }
-    .dir-item:active { background: var(--border); border-radius: 6px; }
-    .dir-item .di { font-size: 1rem; }
-    .dir-item .dn { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
-    #dir-actions {
-      display: flex; gap: 0.6rem; padding: 0.75rem 0;
-      border-top: 1px solid var(--border);
-    }
-    .dir-btn {
-      flex: 1; padding: 0.7rem; border-radius: 10px;
-      border: none; font-size: 0.9rem; font-weight: 600; cursor: pointer;
-    }
-    .dir-btn.primary { background: var(--accent); color: #fff; }
-    .dir-btn.cancel  { background: var(--bg); color: var(--text); }
-    /* ── Kill confirm ── */
-    #kill-menu {
-      display: none;
-      position: fixed; inset: 0;
-      z-index: 40;
-      align-items: flex-end;
-      justify-content: center;
-    }
-    #kill-menu.open { display: flex; }
-    #kill-backdrop { position: absolute; inset: 0; background: rgba(0,0,0,0.55); }
-    #kill-box {
-      position: relative;
-      background: var(--surface);
-      border-radius: 16px 16px 0 0;
-      width: 100%;
-      max-width: 640px;
-      padding: 1.25rem;
-      padding-bottom: max(1.5rem, env(safe-area-inset-bottom));
-      z-index: 1;
-    }
-    #kill-box h3 { font-size: 0.95rem; margin-bottom: 0.3rem; }
-    #kill-box p { font-size: 0.8rem; color: var(--muted); margin-bottom: 1rem; }
-    .kill-btn {
-      display: block; width: 100%;
-      padding: 0.75rem; border-radius: 10px;
-      border: none; font-size: 0.95rem; font-weight: 600;
-      cursor: pointer; margin-bottom: 0.5rem;
-    }
-    .kill-btn.danger { background: var(--redbg); color: var(--red); }
-    .kill-btn.cancel { background: var(--bg); color: var(--text); }
-    /* ── 导入会话 ── */
-    #import-menu {
-      display: none; position: fixed; inset: 0; z-index: 40;
-      align-items: flex-end; justify-content: center;
-    }
-    #import-menu.open { display: flex; }
-    .import-item {
-      display: flex; align-items: center; gap: 0.6rem;
-      padding: 0.7rem 0.2rem; border-bottom: 1px solid var(--border);
-      cursor: pointer; font-size: 0.85rem;
-    }
-    .import-item:active { background: var(--border); border-radius: 6px; }
-    .import-item .ii-icon { font-size: 1.1rem; }
-    .import-item .ii-body { flex: 1; min-width: 0; }
-    .import-item .ii-id { font-size: 0.82rem; color: var(--text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
-    .import-item .ii-info { font-size: 0.72rem; color: var(--muted); }
-    /* ── 盘符选择栏 ── */
-    #drive-bar {
-      display: flex; gap: 0.5rem; padding: 0.6rem 0; border-bottom: 1px solid var(--border);
-      overflow-x: auto; scrollbar-width: none;
-    }
-    #drive-bar::-webkit-scrollbar { display: none; }
-    .drive-btn {
-      padding: 0.5rem 1rem; border-radius: 8px; font-size: 1rem; font-weight: 600;
-      background: var(--bg); border: 1.5px solid var(--border); color: var(--text);
-      cursor: pointer; white-space: nowrap; flex-shrink: 0;
-      min-width: 3rem; text-align: center;
-    }
-    .drive-btn:active, .drive-btn.active { border-color: var(--accent); color: var(--accent); background: rgba(124,58,237,0.12); }
-    #update-btn { background: var(--yellow); color: #000; border: none; border-radius: 6px; padding: 0.35rem 0.75rem; font-size: 0.75rem; font-weight: 600; cursor: pointer; white-space: nowrap; }
-    #update-btn:active { opacity: 0.7; }
-    #update-btn:disabled { opacity: 0.5; cursor: not-allowed; }
-    /* 分屏是 PC 大屏功能，手机端(触屏)隐藏入口 */
-    @media (pointer: coarse) { #grid-btn { display: none !important; } }
-  </style>
-</head>
-<body>
-<div id="app">
-  <div id="header">
-    <div class="logo">my<span>hi</span></div>
-    <div style="display:flex;align-items:center;gap:0.6rem">
-      <span id="user-name" style="font-size:0.8rem;color:var(--muted)"></span>
-      <button id="grid-btn" onclick="location.href='/grid'" title="分屏工作台（多任务并排）" style="background:none;border:1px solid var(--border);color:var(--muted);font-size:0.75rem;padding:0.3rem 0.6rem;border-radius:6px;cursor:pointer;width:auto">▦ 分屏</button>
-      <button id="appearance-btn" onclick="openAppearance()" title="外观" style="background:none;border:1px solid var(--border);color:var(--muted);font-size:0.75rem;padding:0.3rem 0.55rem;border-radius:6px;cursor:pointer;width:auto">🎨</button>
-      <button id="doctor-btn" onclick="openDoctor()" style="background:none;border:1px solid var(--border);color:var(--muted);font-size:0.75rem;padding:0.3rem 0.6rem;border-radius:6px;cursor:pointer;width:auto">🩺 体检</button>
-      <button id="usage-btn" onclick="showUsage()" style="background:none;border:1px solid var(--border);color:var(--muted);font-size:0.75rem;padding:0.3rem 0.6rem;border-radius:6px;cursor:pointer;width:auto">用量</button>
-      <button id="logout-btn" onclick="doLogout()" style="display:none;background:none;border:1px solid var(--border);color:var(--muted);font-size:0.75rem;padding:0.3rem 0.6rem;border-radius:6px;cursor:pointer;width:auto">退出</button>
-      <div id="conn-dot"></div>
-    </div>
-  </div>
-  <!-- 升级管理已移至 /admin -->
-  <div id="view-controls" style="display:flex;flex-direction:column;gap:0.5rem;margin-bottom:0.75rem">
-    <div id="group-seg" style="display:inline-flex;align-self:flex-start;background:var(--bg,var(--bg));border:1px solid var(--border,var(--border));border-radius:8px;overflow:hidden">
-      <button class="grp-btn" data-group="time"    style="background:none;border:none;color:var(--muted,var(--muted));font-size:0.78rem;padding:0.35rem 0.8rem;cursor:pointer">最近</button>
-      <button class="grp-btn" data-group="project" style="background:none;border:none;color:var(--muted,var(--muted));font-size:0.78rem;padding:0.35rem 0.8rem;cursor:pointer;border-left:1px solid var(--border,var(--border))">项目</button>
-      <button class="grp-btn" data-group="tag"     style="background:none;border:none;color:var(--muted,var(--muted));font-size:0.78rem;padding:0.35rem 0.8rem;cursor:pointer;border-left:1px solid var(--border,var(--border))">标签</button>
-    </div>
-    <div id="tag-filter" style="display:none;flex-wrap:wrap;gap:0.35rem"></div>
-  </div>
-  <div id="list">
-    <div class="empty-state">
-      <svg width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
-        <rect x="2" y="4" width="20" height="16" rx="2"/>
-        <path d="M8 9l4 3-4 3M13 15h3"/>
-      </svg>
-      <p>还没有终端会话</p>
-    </div>
-  </div>
-</div>
-<!-- FAB -->
-<button id="fab" onclick="openSheet()">+</button>
-<!-- Create sheet -->
-<div id="sheet-backdrop" onclick="closeSheet()"></div>
-<div id="sheet">
-  <div class="sheet-handle"></div>
-  <div class="sheet-title">新建终端会话</div>
-  <!-- Preset chips -->
-  <div class="presets" id="presets"></div>
-  <div class="field">
-    <label>名称 <span style="font-weight:400;text-transform:none;color:var(--red,var(--red))">必填</span></label>
-    <input id="inp-title" type="text" placeholder="请输入任务名称" autocomplete="off" spellcheck="false">
-  </div>
-  <div class="field">
-    <label>启动命令 <span style="font-weight:400;text-transform:none">(可选)</span></label>
-    <input id="inp-cmd" type="text" placeholder="留空仅打开 shell" autocomplete="off" spellcheck="false" style="font-family:'SF Mono',Consolas,monospace;font-size:0.85rem">
-  </div>
-  <div class="field">
-    <label>工作目录 <span style="font-weight:400;text-transform:none">(可选)</span></label>
-    <div style="display:flex;gap:0.5rem">
-      <input id="inp-cwd" type="text" placeholder="留空使用默认目录" autocomplete="off" spellcheck="false" style="flex:1">
-      <button onclick="openDirPicker()" style="flex-shrink:0;background:var(--bg);border:1px solid var(--border);border-radius:8px;padding:0 0.75rem;color:var(--text);font-size:1.1rem;cursor:pointer">📁</button>
-    </div>
-    <div id="recent-dirs" style="display:flex;flex-wrap:wrap;gap:0.35rem;margin-top:0.4rem"></div>
-  </div>
-  <button id="btn-create" onclick="createSession()">创建</button>
-  <button id="btn-import" onclick="openImportSheet()" style="width:100%;background:var(--bg);color:var(--accent);border:1.5px solid var(--accent);border-radius:10px;padding:0.7rem;font-size:0.85rem;font-weight:600;cursor:pointer;margin-top:0.5rem">导入已有 Claude 会话</button>
-</div>
-<!-- Dir picker -->
-<div id="dir-picker">
-  <div id="dir-backdrop2" onclick="closeDirPicker()"></div>
-  <div id="dir-box">
-    <div class="sheet-handle"></div>
-    <div id="drive-bar"></div>
-    <div id="dir-current"></div>
-    <div id="dir-list"></div>
-    <div id="dir-actions">
-      <button class="dir-btn cancel" onclick="closeDirPicker()">取消</button>
-      <button class="dir-btn primary" onclick="selectDir()">选择此目录</button>
-    </div>
-  </div>
-</div>
-<!-- Kill confirm sheet -->
-<div id="kill-menu">
-  <div id="kill-backdrop" onclick="closeKill()"></div>
-  <div id="kill-box">
-    <h3 id="kill-title"></h3>
-    <p>终止后会话将无法恢复</p>
-    <button class="kill-btn danger" onclick="confirmKill()">终止会话</button>
-    <button class="kill-btn cancel" onclick="closeKill()">取消</button>
-  </div>
-</div>
-<!-- 会话体检 sheet -->
-<div id="doctor-menu" style="position:fixed;inset:0;z-index:60;display:none">
-  <div onclick="closeDoctor()" style="position:absolute;inset:0;background:rgba(0,0,0,0.55)"></div>
-  <div style="position:absolute;left:0;right:0;bottom:0;background:var(--surface);border-radius:20px 20px 0 0;width:100%;max-width:640px;margin:0 auto;padding:0 1.25rem 1.25rem;max-height:80vh;display:flex;flex-direction:column">
-    <div class="sheet-handle"></div>
-    <div style="display:flex;align-items:center;justify-content:space-between;margin-bottom:0.5rem">
-      <div class="sheet-title" style="margin:0">🩺 会话体检</div>
-      <button onclick="refreshDoctor()" style="background:none;border:1px solid var(--border);color:var(--muted);font-size:0.72rem;padding:0.25rem 0.55rem;border-radius:6px;cursor:pointer">刷新</button>
-    </div>
-    <div style="font-size:0.72rem;color:var(--muted);margin-bottom:0.5rem">「中毒」= 该会话恢复后实际非 bypass，写/删会被拦且无法运行时提权，需重开。</div>
-    <div id="doctor-list" style="flex:1;overflow-y:auto;scrollbar-width:thin"></div>
-  </div>
-</div>
-<!-- 导入已有会话 -->
-<div id="import-menu">
-  <div id="import-backdrop" onclick="closeImportSheet()" style="position:absolute;inset:0;background:rgba(0,0,0,0.55)"></div>
-  <div id="import-box" style="position:relative;background:var(--surface);border-radius:20px 20px 0 0;width:100%;max-width:640px;padding:0 1.25rem;padding-bottom:max(1.5rem,env(safe-area-inset-bottom));max-height:70vh;display:flex;flex-direction:column;z-index:1">
-    <div class="sheet-handle"></div>
-    <div class="sheet-title">导入已有 Claude 会话</div>
-    <div id="import-list" style="flex:1;overflow-y:auto;padding:0.4rem 0;-webkit-overflow-scrolling:touch"></div>
-    <div style="padding:0.75rem 0;border-top:1px solid var(--border)">
-      <button class="dir-btn cancel" onclick="closeImportSheet()" style="width:100%">取消</button>
-    </div>
-  </div>
-</div>
-<script>
-  const socket = io({
-    transports: ['websocket', 'polling'],
-    reconnection: true,
-    reconnectionAttempts: Infinity,
-    reconnectionDelay: 1000,
-    reconnectionDelayMax: 10000,
-    timeout: 30000,
-  });
-  const connDot = document.getElementById('conn-dot');
-  const list    = document.getElementById('list');
-  // 加载当前用户信息（独占模式显示用户名、退出按钮、锁定目录）
-  let _userDir = null;
-  fetch('/api/me').then(r => r.json()).then(data => {
-    if ((data.exclusive || data.hasUsers) && data.name) {
-      document.getElementById('user-name').textContent = data.name;
-      document.getElementById('logout-btn').style.display = '';
-    }
-    if (data.dir) {
-      _userDir = data.dir;
-      // 默认填入绑定目录，隐藏盘符栏，保留最近目录
-      document.getElementById('inp-cwd').value = data.dir;
-      document.getElementById('drive-bar').style.display = 'none';
-      renderRecentDirs();
-    }
-  }).catch(() => {});
-  async function showUsage() {
-    try {
-      const res = await fetch('/api/usage');
-      const data = await res.json();
-      const C = 'style="margin-bottom:1rem;padding:0.8rem 1rem;background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.1);border-radius:10px"';
-      const H = 'style="font-size:0.9rem;font-weight:700;margin-bottom:0.5rem;color:var(--text)"';
-      const T = 'style="font-size:0.82rem;color:var(--text2);line-height:1.6"';
-      let html = '<div style="padding:1.5rem">';
-      html += '<h3 style="margin:0 0 1.2rem;font-size:1.1rem;color:#fff;text-align:center">Claude 用量</h3>';
-      if (data.rateLimit) {
-        const rl = data.rateLimit;
-        const resetTime = new Date(rl.resetsAt * 1000);
-        const remaining = Math.max(0, Math.ceil((resetTime - Date.now()) / 60000));
-        const hours = Math.floor(remaining / 60);
-        const mins = remaining % 60;
-        const timeStr = hours > 0 ? `${hours}小时${mins}分钟` : `${mins}分钟`;
-        const statusColor = rl.status === 'allowed' ? 'var(--green)' : 'var(--red)';
-        const statusText = rl.status === 'allowed' ? '正常可用' : '已达上限';
-        html += `<div ${C}>`;
-        html += `<div ${H}>5 小时配额窗口</div>`;
-        html += `<div ${T}><span style="color:${statusColor};font-weight:700;font-size:0.95rem">● ${statusText}</span></div>`;
-        html += `<div ${T}>窗口重置: <b style="color:var(--text)">${timeStr}后</b>（${resetTime.toLocaleTimeString('zh-CN', {hour:'2-digit',minute:'2-digit'})}）</div>`;
-        html += '</div>';
-      } else {
-        html += `<div ${C}><div ${H}>5 小时配额窗口</div><div ${T}>发送一条 Agent 消息后可查看</div></div>`;
-      }
-      if (data.activeSessions?.length) {
-        html += `<div ${C}><div ${H}>当前会话</div>`;
-        for (const s of data.activeSessions) {
-          if (!s.usage) continue;
-          const u = s.usage;
-          html += `<div ${T}><b style="color:var(--text)">${s.title}</b> (${s.owner || '管理员'})</div>`;
-          html += `<div style="font-size:0.78rem;color:var(--muted);margin:0.2rem 0 0.3rem;line-height:1.5">查询 <b style="color:var(--text2)">${u.queryCount}</b>次　输入 <b style="color:var(--text2)">${((u.totalInputTokens+u.totalCacheReadTokens)/1000).toFixed(0)}K</b>　输出 <b style="color:var(--text2)">${(u.totalOutputTokens/1000).toFixed(0)}K</b>　费用 <b style="color:var(--text2)">$${u.totalCostUSD.toFixed(4)}</b></div>`;
-          if (u.modelUsage) { for (const [m, mu] of Object.entries(u.modelUsage)) { html += `<div style="font-size:0.72rem;color:var(--dim);line-height:1.4">　${m.replace(/claude-/,'').replace(/-\d{8}$/,'').replace(/\[.*\]/,'')} ${(mu.inputTokens/1000).toFixed(0)}K/${(mu.outputTokens/1000).toFixed(0)}K $${mu.costUSD.toFixed(4)}</div>`; } }
-        }
-        html += '</div>';
-      }
-      html += '<button onclick="this.closest(\'[data-usage-overlay]\').remove()" style="margin-top:0.8rem;width:100%;padding:0.7rem;background:var(--accent);color:#fff;border:none;border-radius:10px;cursor:pointer;font-size:0.9rem;font-weight:600">关闭</button></div>';
-      const overlay = document.createElement('div');
-      overlay.setAttribute('data-usage-overlay', '');
-      overlay.style.cssText = 'position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.6);z-index:999;display:flex;align-items:center;justify-content:center;backdrop-filter:blur(4px)';
-      overlay.onclick = (e) => { if (e.target === overlay) overlay.remove(); };
-      const box = document.createElement('div');
-      box.style.cssText = 'background:var(--surface);border:1px solid rgba(255,255,255,0.12);border-radius:16px;max-height:80vh;overflow-y:auto;width:90%;max-width:420px;box-shadow:0 16px 48px rgba(0,0,0,0.4)';
-      box.innerHTML = html;
-      overlay.appendChild(box);
-      document.body.appendChild(overlay);
-    } catch (err) {
-      alert('获取用量失败: ' + err.message);
-    }
-  }
-  function doLogout() {
-    if (!confirm('确定退出登录？')) return;
-    fetch('/logout', { method: 'POST' }).finally(() => {
-      socket.disconnect();
-      location.href = '/login';
-    });
-  }
-  // ── 外观：主题 & 字号（与会话页共用 localStorage myhi_theme / myhi_font）──
-  const THEME_META = { dark: '#0d1117', light: '#ffffff', black: '#000000', system: '#0d1117' };
-  function applyAppearance() {
-    const t = localStorage.getItem('myhi_theme') || 'dark';
-    const f = localStorage.getItem('myhi_font') || 'medium';
-    const r = document.documentElement;
-    if (!t || t === 'dark') r.removeAttribute('data-theme'); else r.setAttribute('data-theme', t);
-    r.setAttribute('data-font', f);
-    const meta = document.querySelector('meta[name="theme-color"]');
-    if (meta) meta.setAttribute('content', THEME_META[t] || '#0d1117');
-  }
-  window.openAppearance = function() {
-    const t = localStorage.getItem('myhi_theme') || 'dark';
-    const f = localStorage.getItem('myhi_font') || 'medium';
-    const overlay = document.createElement('div');
-    overlay.style.cssText = 'position:fixed;inset:0;z-index:80;background:rgba(0,0,0,0.55);display:flex;align-items:flex-end;justify-content:center';
-    const seg = (group, val, cur, label) => `<button data-g="${group}" data-v="${val}" style="flex:1;min-width:3rem;background:${val===cur?'var(--accent)':'var(--bg)'};color:${val===cur?'#fff':'var(--muted)'};border:1px solid ${val===cur?'var(--accent)':'var(--border)'};border-radius:8px;padding:0.5rem 0.3rem;font-size:0.82rem;cursor:pointer;white-space:nowrap">${label}</button>`;
-    const box = document.createElement('div');
-    box.style.cssText = 'background:var(--surface);border-radius:18px 18px 0 0;width:100%;max-width:640px;padding:0.5rem 1.1rem max(1rem,env(safe-area-inset-bottom))';
-    box.innerHTML = `<div class="sheet-handle"></div>
-      <div style="font-size:0.95rem;font-weight:600;margin-bottom:0.6rem">外观</div>
-      <div style="font-size:0.8rem;color:var(--text2);margin-bottom:0.35rem">主题</div>
-      <div style="display:flex;gap:0.35rem;flex-wrap:wrap">${seg('theme','system',t,'跟随系统')}${seg('theme','dark',t,'深色')}${seg('theme','light',t,'浅色')}${seg('theme','black',t,'纯黑')}</div>
-      <div style="font-size:0.8rem;color:var(--text2);margin:0.7rem 0 0.35rem">字号</div>
-      <div style="display:flex;gap:0.35rem">${seg('font','small',f,'小')}${seg('font','medium',f,'中')}${seg('font','large',f,'大')}</div>
-      <button id="ap-close" style="margin-top:0.9rem;width:100%;background:var(--bg);border:1px solid var(--border);color:var(--muted);font-size:0.85rem;padding:0.6rem;border-radius:10px;cursor:pointer">完成</button>`;
-    overlay.appendChild(box);
-    const close = () => overlay.remove();
-    overlay.addEventListener('click', (e) => { if (e.target === overlay) close(); });
-    box.querySelector('#ap-close').onclick = close;
-    box.querySelectorAll('button[data-g]').forEach(b => b.onclick = () => {
-      localStorage.setItem(b.dataset.g === 'theme' ? 'myhi_theme' : 'myhi_font', b.dataset.v);
-      applyAppearance();
-      close(); openAppearance();
-    });
-    document.body.appendChild(overlay);
-  };
-  // HTML 转义，防止 XSS
-  function esc(s) {
-    const d = document.createElement('div');
-    d.textContent = s;
-    return d.innerHTML;
-  }
-  // ── Connection ──────────────────────────────────────────────
-  socket.on('connect', () => {
-    connDot.className = 'on';
-    socket.emit('list');
-  });
-  socket.on('disconnect', () => { connDot.className = 'off'; });
-  socket.on('sessions', renderSessions);
-  // Refresh periodically
-  setInterval(() => { if (socket.connected) socket.emit('list'); }, 5000);
-  // ── 移动端连接保活 ──────────────────────────────
-  document.addEventListener('visibilitychange', () => {
-    if (!document.hidden) {
-      if (!socket.connected) socket.connect();
-      else socket.emit('list');
-    }
-  });
-  window.addEventListener('online', () => { if (!socket.connected) socket.connect(); });
-  setInterval(() => { if (!document.hidden && !socket.connected) socket.connect(); }, 15000);
-  // ── Render ──────────────────────────────────────────────────
-  const PALETTE = ['#7c3aed','#2563eb','#059669','#b45309','#db2777','#0891b2'];
-  function avatarColor(title) {
-    let h = 0;
-    for (const c of (title || '?')) h = (h * 31 + c.charCodeAt(0)) & 0xff;
-    return PALETTE[h % PALETTE.length];
-  }
-  function fmtCwd(cwd) {
-    if (!cwd) return '';
-    // Show last 2 path segments
-    const parts = cwd.replace(/\\/g, '/').split('/').filter(Boolean);
-    return parts.slice(-2).join('/');
-  }
-  function fmtTime(iso) {
-    const d = new Date(iso);
-    return d.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' });
-  }
-  // 会话的「最后任务时间」：优先最后活动时间，回退创建时间。ms 数或 ISO 皆可。
-  function sessionTime(s) {
-    const v = s.lastActivityAt || s.createdAt || 0;
-    const ms = typeof v === 'number' ? v : new Date(v).getTime();
-    return isNaN(ms) ? 0 : ms;
-  }
-  // 相对时间：刚刚 / N分钟前 / N小时前 / 昨天 HH:MM / M月D日
-  function fmtRelTime(ms) {
-    if (!ms) return '';
-    const now = Date.now();
-    const diff = now - ms;
-    if (diff < 60_000) return '刚刚';
-    if (diff < 3_600_000) return Math.floor(diff / 60_000) + '分钟前';
-    if (diff < 86_400_000) return Math.floor(diff / 3_600_000) + '小时前';
-    const d = new Date(ms);
-    const hm = d.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' });
-    if (diff < 172_800_000) return '昨天 ' + hm;
-    return (d.getMonth() + 1) + '月' + d.getDate() + '日';
-  }
-  // 项目名 = cwd 最后一段
-  function projectName(cwd) {
-    if (!cwd) return '(默认目录)';
-    const parts = cwd.replace(/\\/g, '/').split('/').filter(Boolean);
-    return parts[parts.length - 1] || '(根)';
-  }
-  // 视图状态：分组方式 + 标签筛选
-  let _allSessions = [];
-  let _groupMode = localStorage.getItem('myhi_group_mode') || 'time'; // time | project | tag
-  let _tagFilter = null; // 仅 tag 模式下：只看某标签
-  const EMPTY_HTML = `<div class="empty-state">
-      <svg width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
-        <rect x="2" y="4" width="20" height="16" rx="2"/>
-        <path d="M8 9l4 3-4 3M13 15h3"/>
-      </svg>
-      <p>还没有终端会话</p>
-    </div>`;
-  function cardHTML(s) {
-    const safeTitle = esc(s.title || '');
-    const safeId    = esc(s.id);
-    const color  = avatarColor(s.title);
-    const letter = esc((s.title || '?')[0].toUpperCase());
-    const sub    = esc([fmtCwd(s.cwd), fmtRelTime(sessionTime(s)), s.viewers > 0 ? `${s.viewers} 在线` : '', s.controlHolderName ? `${s.controlHolderName} 控制中` : ''].filter(Boolean).join('  ·  '));
-    const tags = (s.tags || []).map(t => `<span class="tag-chip">${esc(t)}</span>`).join('');
-    return `
-      <div class="card" data-id="${safeId}" data-title="${safeTitle}">
-        <div class="avatar" style="background:${color}">${letter}</div>
-        <div class="card-body">
-          <div class="card-title">${safeTitle}</div>
-          <div class="card-sub">${sub}</div>
-          ${tags ? `<div class="card-tags" style="display:flex;flex-wrap:wrap;gap:0.3rem;margin-top:0.3rem">${tags}</div>` : ''}
-        </div>
-        <div class="card-right">
-          <div class="status-dot ${s.alive ? 'alive' : 'dead'}"></div>
-          ${s.viewers > 1 ? `<div class="viewers">👁 ${s.viewers}</div>` : ''}
-        </div>
-      </div>`;
-  }
-  function groupHeaderHTML(label, count) {
-    return `<div class="group-header" style="display:flex;align-items:center;gap:0.5rem;margin:0.85rem 0.2rem 0.4rem;color:var(--muted,var(--muted));font-size:0.75rem;font-weight:600">
-      <span>${esc(label)}</span>
-      <span style="color:var(--border,var(--border2))">·</span>
-      <span style="font-weight:400">${count}</span>
-    </div>`;
-  }
-  function renderSessions(sessions) {
-    if (Array.isArray(sessions)) _allSessions = sessions;
-    renderTagFilter();
-    updateGroupSeg();
-    const items = [..._allSessions].sort((a, b) => sessionTime(b) - sessionTime(a)); // 最新在前
-    if (!items.length) { list.innerHTML = EMPTY_HTML; return; }
-    let html = '';
-    if (_groupMode === 'project') {
-      const groups = new Map();
-      for (const s of items) {
-        const k = projectName(s.cwd);
-        if (!groups.has(k)) groups.set(k, []);
-        groups.get(k).push(s);
-      }
-      // 组按组内最新会话时间排序
-      const ordered = [...groups.entries()].sort((a, b) => sessionTime(b[1][0]) - sessionTime(a[1][0]));
-      for (const [name, arr] of ordered) {
-        html += groupHeaderHTML('📁 ' + name, arr.length);
-        html += arr.map(cardHTML).join('');
-      }
-    } else if (_groupMode === 'tag') {
-      let shown = items;
-      if (_tagFilter) shown = items.filter(s => (s.tags || []).includes(_tagFilter));
-      const tagged = new Map();
-      const untagged = [];
-      for (const s of shown) {
-        const tags = s.tags || [];
-        if (!tags.length) { untagged.push(s); continue; }
-        for (const t of tags) {
-          if (_tagFilter && t !== _tagFilter) continue;
-          if (!tagged.has(t)) tagged.set(t, []);
-          tagged.get(t).push(s);
-        }
-      }
-      const ordered = [...tagged.entries()].sort((a, b) => sessionTime(b[1][0]) - sessionTime(a[1][0]));
-      for (const [name, arr] of ordered) {
-        html += groupHeaderHTML('🏷 ' + name, arr.length);
-        html += arr.map(cardHTML).join('');
-      }
-      if (!_tagFilter && untagged.length) {
-        html += groupHeaderHTML('未分类', untagged.length);
-        html += untagged.map(cardHTML).join('');
-      }
-    } else {
-      html = items.map(cardHTML).join('');
-    }
-    list.innerHTML = html;
-    // 事件委托：点击打开、右键/长按出菜单
-    list.querySelectorAll('.card').forEach(card => {
-      const id = card.dataset.id;
-      const title = card.dataset.title;
-      card.addEventListener('click', () => openSession(id));
-      card.addEventListener('contextmenu', (e) => showActions(e, id, title));
-      // 移动端长按
-      let lpTimer = null;
-      card.addEventListener('touchstart', (e) => { lpTimer = setTimeout(() => showActions(e, id, title), 550); }, { passive: true });
-      card.addEventListener('touchend', () => clearTimeout(lpTimer));
-      card.addEventListener('touchmove', () => clearTimeout(lpTimer));
-    });
-  }
-  function renderTagFilter() {
-    const bar = document.getElementById('tag-filter');
-    if (_groupMode !== 'tag') { bar.style.display = 'none'; return; }
-    const allTags = [...new Set(_allSessions.flatMap(s => s.tags || []))].sort();
-    if (!allTags.length) { bar.style.display = 'none'; return; }
-    bar.style.display = 'flex';
-    const mk = (label, val, active) =>
-      `<button class="tagf-btn" data-tag="${val === null ? '' : esc(val)}" style="background:${active ? 'var(--accent,var(--accent))' : 'var(--bg,var(--bg))'};color:${active ? '#fff' : 'var(--muted,var(--muted))'};border:1px solid ${active ? 'var(--accent,var(--accent))' : 'var(--border,var(--border))'};border-radius:999px;font-size:0.72rem;padding:0.2rem 0.6rem;cursor:pointer">${esc(label)}</button>`;
-    bar.innerHTML = mk('全部', null, !_tagFilter) + allTags.map(t => mk(t, t, _tagFilter === t)).join('');
-    bar.querySelectorAll('.tagf-btn').forEach(b => b.addEventListener('click', () => {
-      _tagFilter = b.dataset.tag || null;
-      renderSessions();
-    }));
-  }
-  function updateGroupSeg() {
-    document.querySelectorAll('.grp-btn').forEach(b => {
-      const on = b.dataset.group === _groupMode;
-      b.style.background = on ? 'var(--accent,var(--accent))' : 'none';
-      b.style.color = on ? '#fff' : 'var(--muted,var(--muted))';
-    });
-  }
-  document.querySelectorAll('.grp-btn').forEach(b => b.addEventListener('click', () => {
-    _groupMode = b.dataset.group;
-    _tagFilter = null;
-    localStorage.setItem('myhi_group_mode', _groupMode);
-    renderSessions();
-  }));
-  // ── Navigation ──────────────────────────────────────────────
-  function openSession(id) {
-    window.location.href = `/terminal/${id}`;
-  }
-  // ── 会话体检 ────────────────────────────────────────────────
-  window.openDoctor = function() {
-    document.getElementById('doctor-menu').style.display = 'block';
-    refreshDoctor();
-  };
-  window.closeDoctor = function() {
-    document.getElementById('doctor-menu').style.display = 'none';
-  };
-  window.refreshDoctor = async function() {
-    const box = document.getElementById('doctor-list');
-    box.innerHTML = '<div style="color:var(--muted);font-size:0.8rem;padding:1rem 0.2rem">加载中…</div>';
-    try {
-      const res = await fetch('/api/sessions/health', { credentials: 'same-origin' });
-      const data = await res.json();
-      renderDoctor(data.sessions || []);
-    } catch (e) {
-      box.innerHTML = '<div style="color:var(--red);font-size:0.8rem;padding:1rem 0.2rem">加载失败：' + esc(e.message) + '</div>';
-    }
-  };
-  function pill(text, color, bg) {
-    return `<span style="font-size:0.65rem;padding:0.1rem 0.4rem;border-radius:5px;color:${color};background:${bg};white-space:nowrap">${text}</span>`;
-  }
-  function renderDoctor(sessions) {
-    const box = document.getElementById('doctor-list');
-    if (!sessions.length) {
-      box.innerHTML = '<div style="color:var(--muted);font-size:0.8rem;padding:1rem 0.2rem">没有 agent 会话</div>';
-      return;
-    }
-    // 中毒的排前面
-    sessions.sort((a, b) => (b.health?.poisoned ? 1 : 0) - (a.health?.poisoned ? 1 : 0));
-    box.innerHTML = sessions.map(s => {
-      const h = s.health || {};
-      const poisoned = h.poisoned;
-      const badges = [];
-      if (poisoned) badges.push(pill('⚠ 中毒 · ' + esc(h.persistedMode || '非bypass'), '#fff', '#a11'));
-      else if (h.persistedMode) badges.push(pill(esc(h.persistedMode), 'var(--muted)', 'var(--bg)'));
-      badges.push(pill(s.alive ? '运行中' : '已停', s.alive ? 'var(--green)' : 'var(--muted)', 'var(--bg)'));
-      if (s.busy) badges.push(pill('忙', 'var(--orange)', 'var(--bg)'));
-      if (h.transcriptKB) badges.push(pill(h.transcriptKB + 'KB', 'var(--muted)', 'var(--bg)'));
-      if (h.imageCount) badges.push(pill('🖼 ' + h.imageCount, 'var(--muted)', 'var(--bg)'));
-      const border = poisoned ? '#a11' : 'var(--border)';
-      return `
-        <div style="border:1px solid ${border};border-radius:10px;padding:0.6rem 0.7rem;margin-bottom:0.5rem">
-          <div style="display:flex;align-items:center;gap:0.4rem;flex-wrap:wrap;margin-bottom:0.35rem">
-            <span style="font-weight:600;font-size:0.85rem">${esc(s.title || '(无标题)')}</span>
-            ${badges.join('')}
-          </div>
-          <div style="font-size:0.68rem;color:var(--muted);margin-bottom:0.5rem;word-break:break-all">${esc(s.cwd || '')}</div>
-          <div style="display:flex;gap:0.4rem">
-            <button onclick="openSession('${esc(s.id)}')" style="flex:1;background:var(--bg);border:1px solid var(--border);color:var(--text);font-size:0.72rem;padding:0.35rem;border-radius:6px;cursor:pointer">打开</button>
-            <button onclick="doctorReset('${esc(s.id)}','${esc(s.title || '')}')" style="flex:1;background:${poisoned ? '#1c3a2b' : 'var(--bg)'};border:1px solid ${poisoned ? 'var(--green)' : 'var(--border)'};color:${poisoned ? 'var(--green)' : 'var(--text)'};font-size:0.72rem;padding:0.35rem;border-radius:6px;cursor:pointer">重开为干净会话</button>
-            <button onclick="doctorDelete('${esc(s.id)}','${esc(s.title || '')}')" style="background:var(--redbg);border:none;color:var(--red);font-size:0.72rem;padding:0.35rem 0.6rem;border-radius:6px;cursor:pointer">删除</button>
-          </div>
-        </div>`;
-    }).join('');
-  }
-  window.doctorReset = async function(id, title) {
-    if (!confirm(`重开「${title}」为干净会话？\n会断开旧对话上下文（磁盘上的文件不受影响），下次提问开启全新会话。`)) return;
-    try {
-      const res = await fetch(`/api/sessions/${id}/reset`, { method: 'POST', credentials: 'same-origin' });
-      if (!res.ok) throw new Error((await res.json().catch(() => ({}))).error || res.status);
-      refreshDoctor();
-    } catch (e) { alert('重开失败：' + e.message); }
-  };
-  window.doctorDelete = async function(id, title) {
-    if (!confirm(`删除会话「${title}」？此操作不可恢复。`)) return;
-    try {
-      const res = await fetch(`/api/sessions/${id}`, { method: 'DELETE', credentials: 'same-origin' });
-      if (!res.ok && res.status !== 204) throw new Error(res.status);
-      refreshDoctor();
-    } catch (e) { alert('删除失败：' + e.message); }
-  };
-  // ── Presets ───────────────────────────────────────────────────
-  const PRESETS = [
-    // Agent 模式
-    { icon: '🤖', label: 'Claude',    title: 'claude', type: 'agent', cmd: 'claude' },
-    // PTY 模式（终端）
-    { icon: '✨', label: 'Gemini',    title: 'gemini', type: 'pty',   cmd: 'gemini' },
-    { icon: '🐚', label: 'Shell',     title: 'shell',  type: 'pty',   cmd: '' },
-  ];
-  let selectedPreset = null;
-  function renderPresets() {
-    const el = document.getElementById('presets');
-    el.innerHTML = PRESETS.map((p, i) => `
-      <div class="chip" id="chip-${i}" onclick="selectPreset(${i})">
-        <span class="chip-icon">${p.icon}</span>
-        <span class="chip-label">${p.label}</span>
-      </div>`).join('');
-  }
-  renderPresets();
-  function selectPreset(i) {
-    selectedPreset = i;
-    document.querySelectorAll('.chip').forEach((c, j) =>
-      c.classList.toggle('selected', j === i));
-    const p = PRESETS[i];
-    // 不再自动把名称填成 claude/gemini/shell —— 名称必填、留给用户输入任务名
-    document.getElementById('inp-cmd').value   = p.cmd || '';
-  }
-  // ── Create sheet ─────────────────────────────────────────────
-  function openSheet() {
-    document.getElementById('sheet-backdrop').classList.add('open');
-    document.getElementById('sheet').classList.add('open');
-    // Default to first preset
-    selectPreset(0);
-    setTimeout(() => document.getElementById('inp-title').focus(), 300);
-  }
-  function closeSheet() {
-    document.getElementById('sheet-backdrop').classList.remove('open');
-    document.getElementById('sheet').classList.remove('open');
-    selectedPreset = null;
-    document.querySelectorAll('.chip').forEach(c => c.classList.remove('selected'));
-  }
-  document.getElementById('inp-title').addEventListener('keydown', e => {
-    if (e.key === 'Enter') createSession();
-  });
-  function createSession() {
-    const titleInput = document.getElementById('inp-title');
-    const title   = titleInput.value.trim();
-    if (!title) {
-      alert('请输入任务名称');
-      titleInput.focus();
-      return;
-    }
-    const initCmd = document.getElementById('inp-cmd').value.trim()   || undefined;
-    const cwd     = document.getElementById('inp-cwd').value.trim()   || undefined;
-    if (cwd) recordDir(cwd);
-    const preset = selectedPreset != null ? PRESETS[selectedPreset] : null;
-    closeSheet();
-    document.getElementById('inp-title').value = '';
-    document.getElementById('inp-cmd').value   = '';
-    document.getElementById('inp-cwd').value   = '';
-    if (preset?.type === 'agent') {
-      // Agent 模式：使用 Claude SDK
-      socket.emit('create-agent', {
-        title,
-        cwd,
-      }, (res) => {
-        if (res?.ok) openSession(res.session.id);
-        else alert('创建失败: ' + (res?.error || '未知错误'));
-      });
-    } else {
-      // PTY 模式：创建终端会话
-      socket.emit('create', { title, initCmd, cwd }, (res) => {
-        if (res?.ok) openSession(res.session.id);
-        else alert('创建失败: ' + (res?.error || '未知错误'));
-      });
-    }
-  }
-  // ── Dir picker ───────────────────────────────────────────────
-  let _dirCurrent = '';
-  const RECENT_DIRS_KEY = 'myhi_recent_dirs'; // { path: count } 频次记录
-  const RECENT_DIRS_MAX = 5;
-  function getRecentDirs() {
-    try { return JSON.parse(localStorage.getItem(RECENT_DIRS_KEY)) || {}; } catch { return {}; }
-  }
-  function recordDir(dir) {
-    if (!dir) return;
-    const dirs = getRecentDirs();
-    dirs[dir] = (dirs[dir] || 0) + 1;
-    // 只保留使用最多的若干条
-    const sorted = Object.entries(dirs).sort((a, b) => b[1] - a[1]);
-    const trimmed = Object.fromEntries(sorted.slice(0, RECENT_DIRS_MAX));
-    localStorage.setItem(RECENT_DIRS_KEY, JSON.stringify(trimmed));
-    renderRecentDirs();
-  }
-  function renderRecentDirs() {
-    const container = document.getElementById('recent-dirs');
-    container.innerHTML = '';
-    const dirs = getRecentDirs();
-    const sorted = Object.entries(dirs).sort((a, b) => b[1] - a[1]);
-    const filtered = _userDir ? sorted.filter(([path]) => path.startsWith(_userDir)) : sorted;
-    if (!filtered.length) return;
-    filtered.forEach(([path]) => {
-      const btn = document.createElement('button');
-      // 只显示最后一级目录名
-      const short = path.replace(/[\\/]$/, '').split(/[\\/]/).pop() || path;
-      btn.textContent = short;
-      btn.title = path;
-      btn.style.cssText = 'background:var(--bg);color:var(--accent);border:1px solid var(--border);border-radius:6px;padding:0.2rem 0.5rem;font-size:0.72rem;cursor:pointer;font-family:"SF Mono",Consolas,monospace;max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap';
-      btn.onclick = () => { document.getElementById('inp-cwd').value = path; };
-      container.appendChild(btn);
-    });
-  }
-  renderRecentDirs();
-  function openDirPicker() {
-    document.getElementById('dir-picker').classList.add('open');
-    const dirs = getRecentDirs();
-    const topDir = Object.entries(dirs).sort((a, b) => b[1] - a[1])[0]?.[0] || '';
-    const initial = document.getElementById('inp-cwd').value.trim() || topDir || '';
-    loadDirs(initial);
-    loadDrives();
-  }
-  function closeDirPicker() {
-    document.getElementById('dir-picker').classList.remove('open');
-  }
-  function selectDir() {
-    document.getElementById('inp-cwd').value = _dirCurrent;
-    recordDir(_dirCurrent);
-    closeDirPicker();
-  }
-  // Windows 盘符检测和切换
-  function loadDrives() {
-    const bar = document.getElementById('drive-bar');
-    if (!bar) return;
-    // 通过尝试访问常见盘符来检测
-    const letters = ['C', 'D', 'E', 'F', 'G', 'H'];
-    bar.innerHTML = '';
-    let found = 0;
-    for (const letter of letters) {
-      const path = letter + ':\\';
-      socket.emit('dirs', path, (data) => {
-        if (data.ok) {
-          found++;
-          const btn = document.createElement('button');
-          btn.className = 'drive-btn';
-          btn.textContent = letter + ':';
-          btn.onclick = () => {
-            loadDirs(path);
-            bar.querySelectorAll('.drive-btn').forEach(b => b.classList.remove('active'));
-            btn.classList.add('active');
-          };
-          // 高亮当前盘符
-          if (_dirCurrent && _dirCurrent.toUpperCase().startsWith(letter + ':')) {
-            btn.classList.add('active');
-          }
-          bar.appendChild(btn);
-        }
-      });
-    }
-  }
-  function loadDirs(path) {
-    document.getElementById('dir-list').innerHTML = '<div style="padding:1rem;color:var(--muted);font-size:0.85rem">加载中...</div>';
-    socket.emit('dirs', path || '', (data) => {
-      if (!data.ok) {
-        document.getElementById('dir-list').innerHTML = `<div style="padding:1rem;color:var(--red);font-size:0.85rem">${escH(data.error)}</div>`;
-        return;
-      }
-      _dirCurrent = data.current;
-      document.getElementById('dir-current').textContent = data.current;
-      // 更新盘符高亮
-      document.querySelectorAll('.drive-btn').forEach(btn => {
-        btn.classList.toggle('active', _dirCurrent.toUpperCase().startsWith(btn.textContent.toUpperCase()));
-      });
-      const dirList = document.getElementById('dir-list');
-      dirList.innerHTML = '';
-      if (data.parent) {
-        const el = document.createElement('div');
-        el.className = 'dir-item';
-        el.dataset.path = data.parent;
-        el.innerHTML = '<span class="di">↩</span><span class="dn">..</span>';
-        dirList.appendChild(el);
-      }
-      for (const d of data.dirs) {
-        const el = document.createElement('div');
-        el.className = 'dir-item';
-        el.dataset.path = d.path;
-        el.innerHTML = `<span class="di">📁</span><span class="dn">${escH(d.name)}</span>`;
-        dirList.appendChild(el);
-      }
-      if (!dirList.children.length) {
-        dirList.innerHTML = '<div style="padding:1rem;color:var(--muted);font-size:0.85rem">无子目录</div>';
-      }
-    });
-  }
-  document.getElementById('dir-list').addEventListener('click', e => {
-    const item = e.target.closest('.dir-item');
-    if (item?.dataset.path) loadDirs(item.dataset.path);
-  });
-  function escH(s) { return s.replace(/&/g,'&amp;').replace(/</g,'&lt;').replace(/>/g,'&gt;'); }
-  // ── 导入已有 Claude 会话 ───────────────────────────────────
-  function openImportSheet() {
-    closeSheet(); // 关闭创建面板
-    document.getElementById('import-menu').classList.add('open');
-    document.getElementById('import-list').innerHTML = '<div style="padding:1rem;color:var(--muted);font-size:0.85rem">加载中...</div>';
-    // 通过 REST API 获取本地 Claude 会话列表
-    fetch('/api/claude-sessions')
-      .then(r => r.json())
-      .then(sessions => {
-        const el = document.getElementById('import-list');
-        if (!sessions.length) {
-          el.innerHTML = '<div style="padding:1rem;color:var(--muted);font-size:0.85rem">未找到本地 Claude 会话<br><span style="font-size:0.72rem">会话数据存储在 ~/.claude/projects/ 目录</span></div>';
-          return;
-        }
-        el.innerHTML = '';
-        for (const s of sessions) {
-          const item = document.createElement('div');
-          item.className = 'import-item';
-          item.onclick = () => importSession(s);
-          const time = s.updatedAt ? new Date(s.updatedAt).toLocaleString('zh-CN', { month:'numeric', day:'numeric', hour:'2-digit', minute:'2-digit' }) : '';
-          const proj = s.projectDir ? decodeURIComponent(s.projectDir).split(/[\\/]/).pop() : '';
-          const name = s.summary || s.sessionId.slice(0, 12);
-          item.innerHTML = `
-            <span class="ii-icon">🤖</span>
-            <div class="ii-body">
-              <div class="ii-id">${escH(name)}</div>
-              <div class="ii-info">${time ? time + ' · ' : ''}${s.messageCount} 条消息${proj ? ' · ' + escH(proj) : ''}</div>
-            </div>`;
-          el.appendChild(item);
-        }
-      })
-      .catch(err => {
-        document.getElementById('import-list').innerHTML = `<div style="padding:1rem;color:var(--red);font-size:0.85rem">加载失败: ${escH(err.message)}</div>`;
-      });
-  }
-  function closeImportSheet() {
-    document.getElementById('import-menu').classList.remove('open');
-  }
-  function importSession(session) {
-    closeImportSheet();
-    const cwd = session.projectPath || document.getElementById('inp-cwd').value.trim() || undefined;
-    const title = session.summary ? session.summary.slice(0, 30) : 'claude (导入)';
-    socket.emit('create-agent', {
-      title,
-      cwd,
-      resumeSessionId: session.sessionId,
-    }, (res) => {
-      if (res?.ok) openSession(res.session.id);
-      else alert('导入失败: ' + (res?.error || '未知错误'));
-    });
-  }
-  // ── Kill ─────────────────────────────────────────────────────
-  let _killId = null;
-  // 会话操作菜单：打开 / 重命名 / 设置标签 / 终止
-  function showActions(e, id, title) {
-    e.preventDefault();
-    const s = _allSessions.find(x => x.id === id);
-    const curTags = (s?.tags || []).join(', ');
-    const overlay = document.createElement('div');
-    overlay.style.cssText = 'position:fixed;inset:0;z-index:80;background:rgba(0,0,0,0.55);display:flex;align-items:flex-end;justify-content:center';
-    const box = document.createElement('div');
-    box.style.cssText = 'background:var(--surface,var(--surface));border-radius:18px 18px 0 0;width:100%;max-width:640px;padding:0.5rem 0 max(1rem,env(safe-area-inset-bottom))';
-    const mkBtn = (label, color) => `<button style="display:block;width:100%;text-align:left;background:none;border:none;border-top:1px solid var(--border,var(--border));color:${color || 'var(--text,var(--text))'};font-size:0.95rem;padding:0.9rem 1.25rem;cursor:pointer">${label}</button>`;
-    box.innerHTML =
-      `<div style="padding:0.6rem 1.25rem 0.4rem;color:var(--muted,var(--muted));font-size:0.8rem;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap">${esc(title)}</div>` +
-      mkBtn('打开') + mkBtn('重命名') + mkBtn('设置标签') + mkBtn('终止会话', 'var(--red,var(--red))') +
-      `<button style="display:block;width:100%;background:none;border:none;border-top:6px solid var(--bg,var(--bg));color:var(--muted,var(--muted));font-size:0.9rem;padding:0.85rem;cursor:pointer">取消</button>`;
-    overlay.appendChild(box);
-    const close = () => overlay.remove();
-    overlay.addEventListener('click', (ev) => { if (ev.target === overlay) close(); });
-    const btns = box.querySelectorAll('button');
-    btns[0].onclick = () => { close(); openSession(id); };
-    btns[1].onclick = () => {
-      close();
-      const nv = prompt('重命名会话', title);
-      if (nv && nv.trim()) socket.emit('rename', { sessionId: id, title: nv.trim() });
-    };
-    btns[2].onclick = () => {
-      close();
-      const nv = prompt('设置标签（多个用逗号分隔，留空清除）', curTags);
-      if (nv !== null) socket.emit('set-tags', { sessionId: id, tags: nv.split(/[,，]/).map(t => t.trim()).filter(Boolean) });
-    };
-    btns[3].onclick = () => { close(); showKill(e, id, title); };
-    btns[4].onclick = close;
-    document.body.appendChild(overlay);
-  }
-  function showKill(e, id, title) {
-    if (e && e.preventDefault) e.preventDefault();
-    _killId = id;
-    document.getElementById('kill-title').textContent = title;
-    document.getElementById('kill-menu').classList.add('open');
-  }
-  function closeKill() {
-    document.getElementById('kill-menu').classList.remove('open');
-    _killId = null;
-  }
-  function confirmKill() {
-    if (_killId) socket.emit('kill', _killId);
-    closeKill();
-  }
-  // ── 版本更新 ──────────────────────────────────────────────
-</script>
-</body>
-</html>
+<!DOCTYPE html>
+<html lang="zh-CN">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, viewport-fit=cover">
+  <meta name="theme-color" content="#0d1117">
+  <meta name="apple-mobile-web-app-capable" content="yes">
+  <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
+  <meta name="apple-mobile-web-app-title" content="myhi">
+  <link rel="manifest" href="/manifest.json">
+  <link rel="apple-touch-icon" href="/icon.png">
+  <title>myhi</title>
+  <script src="/sio-client/socket.io.min.js"></script>
+  <script>
+    (function(){try{var t=localStorage.getItem('myhi_theme')||'dark',f=localStorage.getItem('myhi_font')||'medium',r=document.documentElement;if(t&&t!=='dark')r.setAttribute('data-theme',t);r.setAttribute('data-font',f);}catch(e){}})();
+  </script>
+  <style>
+    :root {
+      --bg:#0d1117; --surface:#161b22; --border:#21262d; --border2:#30363d;
+      --text:#e6edf3; --text2:#b1bac4; --muted:#8b949e; --dim:#6e7681;
+      --accent:#7c3aed; --accent2:#9d5cf5; --red:#f85149; --redbg:#3d1515;
+      --green:#3fb950; --yellow:#d29922; --orange:#f0883e;
+    }
+    :root[data-theme="light"] { --bg:#ffffff; --surface:#f6f8fa; --border:#d0d7de; --border2:#d0d7de;
+      --text:#1f2328; --text2:#57606a; --muted:#656d76; --dim:#818b98;
+      --accent:#8250df; --accent2:#8250df; --red:#cf222e; --redbg:#ffebe9;
+      --green:#1a7f37; --yellow:#9a6700; --orange:#bc4c00; }
+    :root[data-theme="black"] { --bg:#000000; --surface:#0a0a0a; --border:#161616; --border2:#262626; }
+    @media (prefers-color-scheme: light) { :root[data-theme="system"] { --bg:#ffffff; --surface:#f6f8fa; --border:#d0d7de; --border2:#d0d7de;
+      --text:#1f2328; --text2:#57606a; --muted:#656d76; --dim:#818b98;
+      --accent:#8250df; --accent2:#8250df; --red:#cf222e; --redbg:#ffebe9;
+      --green:#1a7f37; --yellow:#9a6700; --orange:#bc4c00; } }
+    html { font-size: 16px; }
+    html[data-font="small"]{font-size:15px;} html[data-font="medium"]{font-size:17px;} html[data-font="large"]{font-size:19.5px;}
+    * { box-sizing: border-box; margin: 0; padding: 0; -webkit-tap-highlight-color: transparent; }
+    html, body {
+      height: 100%;
+      background: var(--bg);
+      color: var(--text);
+      font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
+      overscroll-behavior: none;
+    }
+    /* ── Layout ── */
+    #app {
+      display: flex;
+      flex-direction: column;
+      height: 100%;
+      max-width: 640px;
+      margin: 0 auto;
+    }
+    /* ── Header ── */
+    #header {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      padding: 0 1rem;
+      padding-top: max(1rem, env(safe-area-inset-top));
+      padding-bottom: 0.75rem;
+      background: var(--bg);
+      position: sticky;
+      top: 0;
+      z-index: 10;
+      border-bottom: 1px solid var(--border);
+    }
+    .logo {
+      font-size: 1.35rem;
+      font-weight: 700;
+      letter-spacing: -0.5px;
+    }
+    .logo span { color: var(--accent); }
+    #conn-dot {
+      width: 8px; height: 8px;
+      border-radius: 50%;
+      background: var(--muted);
+      transition: background 0.3s;
+      flex-shrink: 0;
+    }
+    #conn-dot.on  { background: var(--green); box-shadow: 0 0 6px var(--green); }
+    #conn-dot.off { background: var(--red); }
+    /* ── Session list ── */
+    #list {
+      flex: 1;
+      overflow-y: auto;
+      -webkit-overflow-scrolling: touch;
+      padding: 0.75rem 0.75rem 6rem;
+    }
+    .empty-state {
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      justify-content: center;
+      gap: 0.75rem;
+      height: 60%;
+      color: var(--muted);
+    }
+    .empty-state svg { opacity: 0.3; }
+    .empty-state p { font-size: 0.95rem; }
+    /* ── Session card ── */
+    .card {
+      display: flex;
+      align-items: center;
+      gap: 0.85rem;
+      padding: 0.85rem 0.9rem;
+      background: var(--surface);
+      border: 1px solid var(--border);
+      border-radius: 12px;
+      margin-bottom: 0.6rem;
+      cursor: pointer;
+      transition: border-color 0.15s, background 0.15s;
+      user-select: none;
+      -webkit-user-select: none;
+    }
+    .card:active { background: #1c2230; }
+    .avatar {
+      width: 44px; height: 44px;
+      border-radius: 10px;
+      display: flex; align-items: center; justify-content: center;
+      font-size: 1.3rem;
+      font-weight: 700;
+      flex-shrink: 0;
+      font-family: 'SF Mono', Consolas, monospace;
+      color: #fff;
+    }
+    .card-body {
+      flex: 1;
+      min-width: 0;
+    }
+    .card-title {
+      font-size: 0.95rem;
+      font-weight: 600;
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+    }
+    .card-sub {
+      font-size: 0.75rem;
+      color: var(--muted);
+      margin-top: 0.2rem;
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+    }
+    .tag-chip {
+      display: inline-block;
+      font-size: 0.66rem;
+      color: var(--text2);
+      background: rgba(124,58,237,0.14);
+      border: 1px solid rgba(124,58,237,0.35);
+      border-radius: 999px;
+      padding: 0.05rem 0.45rem;
+      line-height: 1.5;
+    }
+    .card-right {
+      display: flex;
+      flex-direction: column;
+      align-items: flex-end;
+      gap: 0.35rem;
+      flex-shrink: 0;
+    }
+    .status-dot {
+      width: 8px; height: 8px;
+      border-radius: 50%;
+    }
+    .status-dot.alive { background: var(--green); box-shadow: 0 0 5px var(--green); }
+    .status-dot.dead  { background: var(--red); }
+    .viewers {
+      font-size: 0.7rem;
+      color: var(--muted);
+    }
+    /* ── FAB ── */
+    #fab {
+      position: fixed;
+      bottom: max(1.5rem, calc(env(safe-area-inset-bottom) + 1rem));
+      right: max(1.5rem, calc(env(safe-area-inset-right) + 1rem));
+      width: 56px; height: 56px;
+      border-radius: 28px;
+      background: var(--accent);
+      color: #fff;
+      border: none;
+      font-size: 1.6rem;
+      line-height: 1;
+      cursor: pointer;
+      box-shadow: 0 4px 20px rgba(124,58,237,0.5);
+      display: flex; align-items: center; justify-content: center;
+      transition: background 0.15s, transform 0.15s;
+      z-index: 20;
+    }
+    #fab:active { background: var(--accent2); transform: scale(0.93); }
+    /* 随手记 FAB：灵感常常在你不在任何会话页的时候冒出来，首页也得能记 */
+    #fab-note {
+      position: fixed;
+      bottom: max(5.3rem, calc(env(safe-area-inset-bottom) + 4.8rem));
+      right: max(1.75rem, calc(env(safe-area-inset-right) + 1.25rem));
+      width: 46px; height: 46px;
+      border-radius: 23px;
+      background: #d29922;
+      color: #1a1a1a;
+      border: none;
+      font-size: 1.15rem;
+      line-height: 1;
+      cursor: pointer;
+      box-shadow: 0 4px 16px rgba(210,153,34,0.45);
+      display: flex; align-items: center; justify-content: center;
+      transition: background 0.15s, transform 0.15s;
+      z-index: 20;
+    }
+    #fab-note:active { transform: scale(0.93); }
+    /* ── Bottom sheet ── */
+    #sheet-backdrop {
+      display: none;
+      position: fixed; inset: 0;
+      background: rgba(0,0,0,0.55);
+      z-index: 30;
+    }
+    #sheet-backdrop.open { display: block; }
+    #sheet {
+      position: fixed;
+      bottom: 0; left: 0; right: 0;
+      background: var(--surface);
+      border-radius: 20px 20px 0 0;
+      padding: 0 1.25rem;
+      padding-bottom: max(1.5rem, env(safe-area-inset-bottom));
+      z-index: 31;
+      transform: translateY(100%);
+      transition: transform 0.28s cubic-bezier(0.32, 0.72, 0, 1);
+      max-width: 640px;
+      margin: 0 auto;
+    }
+    #sheet.open { transform: translateY(0); }
+    .sheet-handle {
+      width: 36px; height: 4px;
+      background: var(--border);
+      border-radius: 2px;
+      margin: 0.75rem auto 1.25rem;
+    }
+    .sheet-title {
+      font-size: 1rem;
+      font-weight: 600;
+      margin-bottom: 1rem;
+    }
+    /* ── Preset chips ── */
+    .presets {
+      display: flex;
+      gap: 0.5rem;
+      overflow-x: auto;
+      padding-bottom: 0.75rem;
+      margin-bottom: 0.75rem;
+      border-bottom: 1px solid var(--border);
+      scrollbar-width: none;
+      -webkit-overflow-scrolling: touch;
+    }
+    .presets::-webkit-scrollbar { display: none; }
+    .chip {
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      gap: 0.3rem;
+      flex-shrink: 0;
+      width: 76px;
+      padding: 0.6rem 0.4rem;
+      background: var(--bg);
+      border: 1.5px solid var(--border);
+      border-radius: 12px;
+      cursor: pointer;
+      transition: border-color 0.15s, background 0.15s;
+      user-select: none;
+      -webkit-user-select: none;
+    }
+    .chip:active, .chip.selected {
+      border-color: var(--accent);
+      background: rgba(124,58,237,0.12);
+    }
+    .chip-icon { font-size: 1.4rem; line-height: 1; }
+    .chip-label {
+      font-size: 0.65rem;
+      color: var(--muted);
+      text-align: center;
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      width: 100%;
+    }
+    .chip.selected .chip-label { color: var(--accent2); }
+    .field { margin-bottom: 0.9rem; }
+    .field label {
+      display: block;
+      font-size: 0.75rem;
+      color: var(--muted);
+      margin-bottom: 0.35rem;
+      font-weight: 500;
+      text-transform: uppercase;
+      letter-spacing: 0.04em;
+    }
+    .field input {
+      width: 100%;
+      background: var(--bg);
+      border: 1px solid var(--border);
+      border-radius: 8px;
+      padding: 0.65rem 0.8rem;
+      color: var(--text);
+      font-size: 0.95rem;
+      font-family: inherit;
+      outline: none;
+      transition: border-color 0.15s;
+    }
+    .field input:focus { border-color: var(--accent); }
+    .field input::placeholder { color: var(--dim); }
+    #btn-create {
+      width: 100%;
+      background: var(--accent);
+      color: #fff;
+      border: none;
+      border-radius: 10px;
+      padding: 0.8rem;
+      font-size: 0.95rem;
+      font-weight: 600;
+      cursor: pointer;
+      margin-top: 0.25rem;
+      transition: background 0.15s;
+    }
+    #btn-create:active { background: var(--accent2); }
+    /* ── Dir picker ── */
+    #dir-picker {
+      display: none; position: fixed; inset: 0; z-index: 50;
+      align-items: flex-end; justify-content: center;
+    }
+    #dir-picker.open { display: flex; }
+    #dir-backdrop2 { position: absolute; inset: 0; background: rgba(0,0,0,0.6); }
+    #dir-box {
+      position: relative; z-index: 1;
+      background: var(--surface);
+      border-radius: 20px 20px 0 0;
+      width: 100%; max-width: 640px;
+      padding: 0 1.25rem;
+      padding-bottom: max(1.5rem, env(safe-area-inset-bottom));
+      max-height: 70vh; display: flex; flex-direction: column;
+    }
+    #dir-current {
+      font-size: 0.72rem; color: var(--muted);
+      font-family: 'SF Mono', Consolas, monospace;
+      padding: 0.9rem 0 0.5rem;
+      border-bottom: 1px solid var(--border);
+      word-break: break-all;
+    }
+    #dir-list {
+      flex: 1; overflow-y: auto; padding: 0.4rem 0;
+      -webkit-overflow-scrolling: touch;
+    }
+    .dir-item {
+      display: flex; align-items: center; gap: 0.6rem;
+      padding: 0.65rem 0.2rem;
+      border-bottom: 1px solid var(--border);
+      cursor: pointer; font-size: 0.9rem;
+    }
+    .dir-item:active { background: var(--border); border-radius: 6px; }
+    .dir-item .di { font-size: 1rem; }
+    .dir-item .dn { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+    #dir-actions {
+      display: flex; gap: 0.6rem; padding: 0.75rem 0;
+      border-top: 1px solid var(--border);
+    }
+    .dir-btn {
+      flex: 1; padding: 0.7rem; border-radius: 10px;
+      border: none; font-size: 0.9rem; font-weight: 600; cursor: pointer;
+    }
+    .dir-btn.primary { background: var(--accent); color: #fff; }
+    .dir-btn.cancel  { background: var(--bg); color: var(--text); }
+    /* ── Kill confirm ── */
+    #kill-menu {
+      display: none;
+      position: fixed; inset: 0;
+      z-index: 40;
+      align-items: flex-end;
+      justify-content: center;
+    }
+    #kill-menu.open { display: flex; }
+    #kill-backdrop { position: absolute; inset: 0; background: rgba(0,0,0,0.55); }
+    #kill-box {
+      position: relative;
+      background: var(--surface);
+      border-radius: 16px 16px 0 0;
+      width: 100%;
+      max-width: 640px;
+      padding: 1.25rem;
+      padding-bottom: max(1.5rem, env(safe-area-inset-bottom));
+      z-index: 1;
+    }
+    #kill-box h3 { font-size: 0.95rem; margin-bottom: 0.3rem; }
+    #kill-box p { font-size: 0.8rem; color: var(--muted); margin-bottom: 1rem; }
+    .kill-btn {
+      display: block; width: 100%;
+      padding: 0.75rem; border-radius: 10px;
+      border: none; font-size: 0.95rem; font-weight: 600;
+      cursor: pointer; margin-bottom: 0.5rem;
+    }
+    .kill-btn.danger { background: var(--redbg); color: var(--red); }
+    .kill-btn.cancel { background: var(--bg); color: var(--text); }
+    /* ── 导入会话 ── */
+    #import-menu {
+      display: none; position: fixed; inset: 0; z-index: 40;
+      align-items: flex-end; justify-content: center;
+    }
+    #import-menu.open { display: flex; }
+    .import-item {
+      display: flex; align-items: center; gap: 0.6rem;
+      padding: 0.7rem 0.2rem; border-bottom: 1px solid var(--border);
+      cursor: pointer; font-size: 0.85rem;
+    }
+    .import-item:active { background: var(--border); border-radius: 6px; }
+    .import-item .ii-icon { font-size: 1.1rem; }
+    .import-item .ii-body { flex: 1; min-width: 0; }
+    .import-item .ii-id { font-size: 0.82rem; color: var(--text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+    .import-item .ii-info { font-size: 0.72rem; color: var(--muted); }
+    /* ── 盘符选择栏 ── */
+    #drive-bar {
+      display: flex; gap: 0.5rem; padding: 0.6rem 0; border-bottom: 1px solid var(--border);
+      overflow-x: auto; scrollbar-width: none;
+    }
+    #drive-bar::-webkit-scrollbar { display: none; }
+    .drive-btn {
+      padding: 0.5rem 1rem; border-radius: 8px; font-size: 1rem; font-weight: 600;
+      background: var(--bg); border: 1.5px solid var(--border); color: var(--text);
+      cursor: pointer; white-space: nowrap; flex-shrink: 0;
+      min-width: 3rem; text-align: center;
+    }
+    .drive-btn:active, .drive-btn.active { border-color: var(--accent); color: var(--accent); background: rgba(124,58,237,0.12); }
+    #update-btn { background: var(--yellow); color: #000; border: none; border-radius: 6px; padding: 0.35rem 0.75rem; font-size: 0.75rem; font-weight: 600; cursor: pointer; white-space: nowrap; }
+    #update-btn:active { opacity: 0.7; }
+    #update-btn:disabled { opacity: 0.5; cursor: not-allowed; }
+    /* 分屏是 PC 大屏功能，手机端(触屏)隐藏入口 */
+    @media (pointer: coarse) { #grid-btn { display: none !important; } }
+  </style>
+</head>
+<body>
+<div id="app">
+  <div id="header">
+    <div class="logo">my<span>hi</span></div>
+    <div style="display:flex;align-items:center;gap:0.6rem">
+      <span id="user-name" style="font-size:0.8rem;color:var(--muted)"></span>
+      <button id="grid-btn" onclick="location.href='/grid'" title="分屏工作台（多任务并排）" style="background:none;border:1px solid var(--border);color:var(--muted);font-size:0.75rem;padding:0.3rem 0.6rem;border-radius:6px;cursor:pointer;width:auto">▦ 分屏</button>
+      <button id="appearance-btn" onclick="openAppearance()" title="外观" style="background:none;border:1px solid var(--border);color:var(--muted);font-size:0.75rem;padding:0.3rem 0.55rem;border-radius:6px;cursor:pointer;width:auto">🎨</button>
+      <button id="doctor-btn" onclick="openDoctor()" style="background:none;border:1px solid var(--border);color:var(--muted);font-size:0.75rem;padding:0.3rem 0.6rem;border-radius:6px;cursor:pointer;width:auto">🩺 体检</button>
+      <button id="usage-btn" onclick="showUsage()" style="background:none;border:1px solid var(--border);color:var(--muted);font-size:0.75rem;padding:0.3rem 0.6rem;border-radius:6px;cursor:pointer;width:auto">用量</button>
+      <button id="logout-btn" onclick="doLogout()" style="display:none;background:none;border:1px solid var(--border);color:var(--muted);font-size:0.75rem;padding:0.3rem 0.6rem;border-radius:6px;cursor:pointer;width:auto">退出</button>
+      <div id="conn-dot"></div>
+    </div>
+  </div>
+  <!-- 升级管理已移至 /admin -->
+  <div id="view-controls" style="display:flex;flex-direction:column;gap:0.5rem;margin-bottom:0.75rem">
+    <!-- 会话搜索：任务多了光看标题认不出，连首条消息/目录/标签一起搜 -->
+    <div style="display:flex;align-items:center;gap:0.4rem">
+      <input id="sess-search" type="search" placeholder="搜任务：标题 / 首条需求 / 目录 / 标签"
+             autocomplete="off" spellcheck="false"
+             style="flex:1;background:var(--bg,var(--bg));border:1px solid var(--border,var(--border));border-radius:8px;color:var(--text,var(--text));font-size:0.8rem;padding:0.4rem 0.7rem;outline:none">
+      <span id="search-count" style="font-size:0.72rem;color:var(--muted,var(--muted));white-space:nowrap"></span>
+    </div>
+    <div id="group-seg" style="display:inline-flex;align-self:flex-start;background:var(--bg,var(--bg));border:1px solid var(--border,var(--border));border-radius:8px;overflow:hidden">
+      <button class="grp-btn" data-group="time"    style="background:none;border:none;color:var(--muted,var(--muted));font-size:0.78rem;padding:0.35rem 0.8rem;cursor:pointer">最近</button>
+      <button class="grp-btn" data-group="project" style="background:none;border:none;color:var(--muted,var(--muted));font-size:0.78rem;padding:0.35rem 0.8rem;cursor:pointer;border-left:1px solid var(--border,var(--border))">项目</button>
+      <button class="grp-btn" data-group="tag"     style="background:none;border:none;color:var(--muted,var(--muted));font-size:0.78rem;padding:0.35rem 0.8rem;cursor:pointer;border-left:1px solid var(--border,var(--border))">标签</button>
+    </div>
+    <div id="tag-filter" style="display:none;flex-wrap:wrap;gap:0.35rem"></div>
+  </div>
+  <div id="list">
+    <div class="empty-state">
+      <svg width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
+        <rect x="2" y="4" width="20" height="16" rx="2"/>
+        <path d="M8 9l4 3-4 3M13 15h3"/>
+      </svg>
+      <p>还没有终端会话</p>
+    </div>
+  </div>
+</div>
+<!-- FAB -->
+<button id="fab" onclick="openSheet()">+</button>
+<button id="fab-note" onclick="openNoteSheet()" title="随手记：把想法先记进某个任务的草稿箱">📥</button>
+<!-- 随手记：不进会话也能记一条草稿，但必须指定归属任务 -->
+<div id="note-backdrop" onclick="closeNoteSheet()" style="display:none;position:fixed;inset:0;background:rgba(0,0,0,0.55);z-index:30"></div>
+<div id="note-sheet" style="display:none;position:fixed;left:0;right:0;bottom:0;z-index:31;background:var(--surface,var(--surface));border-radius:16px 16px 0 0;padding:1rem 1rem calc(1rem + env(safe-area-inset-bottom));max-height:88vh;overflow-y:auto">
+  <div class="sheet-handle"></div>
+  <div class="sheet-title">📥 随手记</div>
+  <div style="font-size:0.7rem;color:var(--muted,var(--muted));line-height:1.55;margin-bottom:0.6rem">
+    临时冒出的需求先记下来，等那个任务干完再发。<b>必须选归属任务</b>——不记归属的话，过几天翻到这条也想不起是哪个项目的事。
+  </div>
+  <div class="field">
+    <label>归属任务 <span style="font-weight:400;text-transform:none;color:var(--red,var(--red))">必填</span></label>
+    <select id="note-session" style="width:100%;background:var(--bg,var(--bg));border:1px solid var(--border,var(--border));border-radius:8px;color:var(--text,var(--text));padding:0.6rem;font-size:0.85rem"></select>
+  </div>
+  <div class="field">
+    <label>想法 / 需求</label>
+    <textarea id="note-text" rows="4" placeholder="例如：导出接口改成异步，顺便把超时时间提到 60s" spellcheck="false"
+              style="width:100%;box-sizing:border-box;background:var(--bg,var(--bg));border:1px solid var(--border,var(--border));border-radius:8px;color:var(--text,var(--text));padding:0.6rem;font-size:0.85rem;resize:vertical"></textarea>
+  </div>
+  <div class="field">
+    <label>图片 <span style="font-weight:400;text-transform:none">(可选)</span></label>
+    <input type="file" id="note-image" accept="image/*" style="font-size:0.78rem;color:var(--muted,var(--muted))">
+    <div id="note-image-status" style="font-size:0.7rem;color:var(--muted,var(--muted));margin-top:0.25rem"></div>
+  </div>
+  <label style="display:flex;align-items:center;gap:0.45rem;font-size:0.8rem;color:var(--text,var(--text));margin:0.3rem 0 0.7rem;cursor:pointer">
+    <input type="checkbox" id="note-autosend" style="width:1.05rem;height:1.05rem">
+    自动接力：那个任务一干完就自动发出（默认关）
+  </label>
+  <button onclick="saveNote()" style="width:100%;background:#d29922;color:#1a1a1a;border:none;border-radius:10px;padding:0.75rem;font-size:0.9rem;font-weight:700;cursor:pointer">存进草稿箱</button>
+  <button onclick="closeNoteSheet()" style="width:100%;background:var(--bg,var(--bg));color:var(--muted,var(--muted));border:1px solid var(--border,var(--border));border-radius:10px;padding:0.65rem;font-size:0.85rem;cursor:pointer;margin-top:0.5rem">取消</button>
+</div>
+<!-- Create sheet -->
+<div id="sheet-backdrop" onclick="closeSheet()"></div>
+<div id="sheet">
+  <div class="sheet-handle"></div>
+  <div class="sheet-title">新建终端会话</div>
+  <!-- Preset chips -->
+  <div class="presets" id="presets"></div>
+  <div class="field">
+    <label>名称 <span style="font-weight:400;text-transform:none;color:var(--red,var(--red))">必填</span></label>
+    <input id="inp-title" type="text" placeholder="请输入任务名称" autocomplete="off" spellcheck="false">
+  </div>
+  <div class="field">
+    <label>启动命令 <span style="font-weight:400;text-transform:none">(可选)</span></label>
+    <input id="inp-cmd" type="text" placeholder="留空仅打开 shell" autocomplete="off" spellcheck="false" style="font-family:'SF Mono',Consolas,monospace;font-size:0.85rem">
+  </div>
+  <div class="field">
+    <label>工作目录 <span style="font-weight:400;text-transform:none">(可选)</span></label>
+    <div style="display:flex;gap:0.5rem">
+      <input id="inp-cwd" type="text" placeholder="留空使用默认目录" autocomplete="off" spellcheck="false" style="flex:1">
+      <button onclick="openDirPicker()" style="flex-shrink:0;background:var(--bg);border:1px solid var(--border);border-radius:8px;padding:0 0.75rem;color:var(--text);font-size:1.1rem;cursor:pointer">📁</button>
+    </div>
+    <div id="recent-dirs" style="display:flex;flex-wrap:wrap;gap:0.35rem;margin-top:0.4rem"></div>
+  </div>
+  <button id="btn-create" onclick="createSession()">创建</button>
+  <button id="btn-import" onclick="openImportSheet()" style="width:100%;background:var(--bg);color:var(--accent);border:1.5px solid var(--accent);border-radius:10px;padding:0.7rem;font-size:0.85rem;font-weight:600;cursor:pointer;margin-top:0.5rem">导入已有 Claude 会话</button>
+</div>
+<!-- Dir picker -->
+<div id="dir-picker">
+  <div id="dir-backdrop2" onclick="closeDirPicker()"></div>
+  <div id="dir-box">
+    <div class="sheet-handle"></div>
+    <div id="drive-bar"></div>
+    <div id="dir-current"></div>
+    <div id="dir-list"></div>
+    <div id="dir-actions">
+      <button class="dir-btn cancel" onclick="closeDirPicker()">取消</button>
+      <button class="dir-btn primary" onclick="selectDir()">选择此目录</button>
+    </div>
+  </div>
+</div>
+<!-- Kill confirm sheet -->
+<div id="kill-menu">
+  <div id="kill-backdrop" onclick="closeKill()"></div>
+  <div id="kill-box">
+    <h3 id="kill-title"></h3>
+    <p>终止后会话将无法恢复</p>
+    <button class="kill-btn danger" onclick="confirmKill()">终止会话</button>
+    <button class="kill-btn cancel" onclick="closeKill()">取消</button>
+  </div>
+</div>
+<!-- 会话体检 sheet -->
+<div id="doctor-menu" style="position:fixed;inset:0;z-index:60;display:none">
+  <div onclick="closeDoctor()" style="position:absolute;inset:0;background:rgba(0,0,0,0.55)"></div>
+  <div style="position:absolute;left:0;right:0;bottom:0;background:var(--surface);border-radius:20px 20px 0 0;width:100%;max-width:640px;margin:0 auto;padding:0 1.25rem 1.25rem;max-height:80vh;display:flex;flex-direction:column">
+    <div class="sheet-handle"></div>
+    <div style="display:flex;align-items:center;justify-content:space-between;margin-bottom:0.5rem">
+      <div class="sheet-title" style="margin:0">🩺 会话体检</div>
+      <button onclick="refreshDoctor()" style="background:none;border:1px solid var(--border);color:var(--muted);font-size:0.72rem;padding:0.25rem 0.55rem;border-radius:6px;cursor:pointer">刷新</button>
+    </div>
+    <div style="font-size:0.72rem;color:var(--muted);margin-bottom:0.5rem">「中毒」= 该会话恢复后实际非 bypass，写/删会被拦且无法运行时提权，需重开。</div>
+    <div id="doctor-list" style="flex:1;overflow-y:auto;scrollbar-width:thin"></div>
+  </div>
+</div>
+<!-- 导入已有会话 -->
+<div id="import-menu">
+  <div id="import-backdrop" onclick="closeImportSheet()" style="position:absolute;inset:0;background:rgba(0,0,0,0.55)"></div>
+  <div id="import-box" style="position:relative;background:var(--surface);border-radius:20px 20px 0 0;width:100%;max-width:640px;padding:0 1.25rem;padding-bottom:max(1.5rem,env(safe-area-inset-bottom));max-height:70vh;display:flex;flex-direction:column;z-index:1">
+    <div class="sheet-handle"></div>
+    <div class="sheet-title">导入已有 Claude 会话</div>
+    <div id="import-list" style="flex:1;overflow-y:auto;padding:0.4rem 0;-webkit-overflow-scrolling:touch"></div>
+    <div style="padding:0.75rem 0;border-top:1px solid var(--border)">
+      <button class="dir-btn cancel" onclick="closeImportSheet()" style="width:100%">取消</button>
+    </div>
+  </div>
+</div>
+<script>
+  const socket = io({
+    transports: ['websocket', 'polling'],
+    reconnection: true,
+    reconnectionAttempts: Infinity,
+    reconnectionDelay: 1000,
+    reconnectionDelayMax: 10000,
+    timeout: 30000,
+  });
+  const connDot = document.getElementById('conn-dot');
+  const list    = document.getElementById('list');
+  // 加载当前用户信息（独占模式显示用户名、退出按钮、锁定目录）
+  let _userDir = null;
+  fetch('/api/me').then(r => r.json()).then(data => {
+    if ((data.exclusive || data.hasUsers) && data.name) {
+      document.getElementById('user-name').textContent = data.name;
+      document.getElementById('logout-btn').style.display = '';
+    }
+    if (data.dir) {
+      _userDir = data.dir;
+      // 默认填入绑定目录，隐藏盘符栏，保留最近目录
+      document.getElementById('inp-cwd').value = data.dir;
+      document.getElementById('drive-bar').style.display = 'none';
+      renderRecentDirs();
+    }
+  }).catch(() => {});
+  async function showUsage() {
+    try {
+      const res = await fetch('/api/usage');
+      const data = await res.json();
+      const C = 'style="margin-bottom:1rem;padding:0.8rem 1rem;background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.1);border-radius:10px"';
+      const H = 'style="font-size:0.9rem;font-weight:700;margin-bottom:0.5rem;color:var(--text)"';
+      const T = 'style="font-size:0.82rem;color:var(--text2);line-height:1.6"';
+      let html = '<div style="padding:1.5rem">';
+      html += '<h3 style="margin:0 0 1.2rem;font-size:1.1rem;color:#fff;text-align:center">Claude 用量</h3>';
+      if (data.rateLimit) {
+        const rl = data.rateLimit;
+        const resetTime = new Date(rl.resetsAt * 1000);
+        const remaining = Math.max(0, Math.ceil((resetTime - Date.now()) / 60000));
+        const hours = Math.floor(remaining / 60);
+        const mins = remaining % 60;
+        const timeStr = hours > 0 ? `${hours}小时${mins}分钟` : `${mins}分钟`;
+        const statusColor = rl.status === 'allowed' ? 'var(--green)' : 'var(--red)';
+        const statusText = rl.status === 'allowed' ? '正常可用' : '已达上限';
+        html += `<div ${C}>`;
+        html += `<div ${H}>5 小时配额窗口</div>`;
+        html += `<div ${T}><span style="color:${statusColor};font-weight:700;font-size:0.95rem">● ${statusText}</span></div>`;
+        html += `<div ${T}>窗口重置: <b style="color:var(--text)">${timeStr}后</b>（${resetTime.toLocaleTimeString('zh-CN', {hour:'2-digit',minute:'2-digit'})}）</div>`;
+        html += '</div>';
+      } else {
+        html += `<div ${C}><div ${H}>5 小时配额窗口</div><div ${T}>发送一条 Agent 消息后可查看</div></div>`;
+      }
+      if (data.activeSessions?.length) {
+        html += `<div ${C}><div ${H}>当前会话</div>`;
+        for (const s of data.activeSessions) {
+          if (!s.usage) continue;
+          const u = s.usage;
+          html += `<div ${T}><b style="color:var(--text)">${s.title}</b> (${s.owner || '管理员'})</div>`;
+          html += `<div style="font-size:0.78rem;color:var(--muted);margin:0.2rem 0 0.3rem;line-height:1.5">查询 <b style="color:var(--text2)">${u.queryCount}</b>次　输入 <b style="color:var(--text2)">${((u.totalInputTokens+u.totalCacheReadTokens)/1000).toFixed(0)}K</b>　输出 <b style="color:var(--text2)">${(u.totalOutputTokens/1000).toFixed(0)}K</b>　费用 <b style="color:var(--text2)">$${u.totalCostUSD.toFixed(4)}</b></div>`;
+          if (u.modelUsage) { for (const [m, mu] of Object.entries(u.modelUsage)) { html += `<div style="font-size:0.72rem;color:var(--dim);line-height:1.4">　${m.replace(/claude-/,'').replace(/-\d{8}$/,'').replace(/\[.*\]/,'')} ${(mu.inputTokens/1000).toFixed(0)}K/${(mu.outputTokens/1000).toFixed(0)}K $${mu.costUSD.toFixed(4)}</div>`; } }
+        }
+        html += '</div>';
+      }
+      html += '<button onclick="this.closest(\'[data-usage-overlay]\').remove()" style="margin-top:0.8rem;width:100%;padding:0.7rem;background:var(--accent);color:#fff;border:none;border-radius:10px;cursor:pointer;font-size:0.9rem;font-weight:600">关闭</button></div>';
+      const overlay = document.createElement('div');
+      overlay.setAttribute('data-usage-overlay', '');
+      overlay.style.cssText = 'position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.6);z-index:999;display:flex;align-items:center;justify-content:center;backdrop-filter:blur(4px)';
+      overlay.onclick = (e) => { if (e.target === overlay) overlay.remove(); };
+      const box = document.createElement('div');
+      box.style.cssText = 'background:var(--surface);border:1px solid rgba(255,255,255,0.12);border-radius:16px;max-height:80vh;overflow-y:auto;width:90%;max-width:420px;box-shadow:0 16px 48px rgba(0,0,0,0.4)';
+      box.innerHTML = html;
+      overlay.appendChild(box);
+      document.body.appendChild(overlay);
+    } catch (err) {
+      alert('获取用量失败: ' + err.message);
+    }
+  }
+  function doLogout() {
+    if (!confirm('确定退出登录？')) return;
+    fetch('/logout', { method: 'POST' }).finally(() => {
+      socket.disconnect();
+      location.href = '/login';
+    });
+  }
+  // ── 外观：主题 & 字号（与会话页共用 localStorage myhi_theme / myhi_font）──
+  const THEME_META = { dark: '#0d1117', light: '#ffffff', black: '#000000', system: '#0d1117' };
+  function applyAppearance() {
+    const t = localStorage.getItem('myhi_theme') || 'dark';
+    const f = localStorage.getItem('myhi_font') || 'medium';
+    const r = document.documentElement;
+    if (!t || t === 'dark') r.removeAttribute('data-theme'); else r.setAttribute('data-theme', t);
+    r.setAttribute('data-font', f);
+    const meta = document.querySelector('meta[name="theme-color"]');
+    if (meta) meta.setAttribute('content', THEME_META[t] || '#0d1117');
+  }
+  window.openAppearance = function() {
+    const t = localStorage.getItem('myhi_theme') || 'dark';
+    const f = localStorage.getItem('myhi_font') || 'medium';
+    const overlay = document.createElement('div');
+    overlay.style.cssText = 'position:fixed;inset:0;z-index:80;background:rgba(0,0,0,0.55);display:flex;align-items:flex-end;justify-content:center';
+    const seg = (group, val, cur, label) => `<button data-g="${group}" data-v="${val}" style="flex:1;min-width:3rem;background:${val===cur?'var(--accent)':'var(--bg)'};color:${val===cur?'#fff':'var(--muted)'};border:1px solid ${val===cur?'var(--accent)':'var(--border)'};border-radius:8px;padding:0.5rem 0.3rem;font-size:0.82rem;cursor:pointer;white-space:nowrap">${label}</button>`;
+    const box = document.createElement('div');
+    box.style.cssText = 'background:var(--surface);border-radius:18px 18px 0 0;width:100%;max-width:640px;padding:0.5rem 1.1rem max(1rem,env(safe-area-inset-bottom))';
+    box.innerHTML = `<div class="sheet-handle"></div>
+      <div style="font-size:0.95rem;font-weight:600;margin-bottom:0.6rem">外观</div>
+      <div style="font-size:0.8rem;color:var(--text2);margin-bottom:0.35rem">主题</div>
+      <div style="display:flex;gap:0.35rem;flex-wrap:wrap">${seg('theme','system',t,'跟随系统')}${seg('theme','dark',t,'深色')}${seg('theme','light',t,'浅色')}${seg('theme','black',t,'纯黑')}</div>
+      <div style="font-size:0.8rem;color:var(--text2);margin:0.7rem 0 0.35rem">字号</div>
+      <div style="display:flex;gap:0.35rem">${seg('font','small',f,'小')}${seg('font','medium',f,'中')}${seg('font','large',f,'大')}</div>
+      <button id="ap-close" style="margin-top:0.9rem;width:100%;background:var(--bg);border:1px solid var(--border);color:var(--muted);font-size:0.85rem;padding:0.6rem;border-radius:10px;cursor:pointer">完成</button>`;
+    overlay.appendChild(box);
+    const close = () => overlay.remove();
+    overlay.addEventListener('click', (e) => { if (e.target === overlay) close(); });
+    box.querySelector('#ap-close').onclick = close;
+    box.querySelectorAll('button[data-g]').forEach(b => b.onclick = () => {
+      localStorage.setItem(b.dataset.g === 'theme' ? 'myhi_theme' : 'myhi_font', b.dataset.v);
+      applyAppearance();
+      close(); openAppearance();
+    });
+    document.body.appendChild(overlay);
+  };
+  // HTML 转义，防止 XSS
+  function esc(s) {
+    const d = document.createElement('div');
+    d.textContent = s;
+    return d.innerHTML;
+  }
+  // ── Connection ──────────────────────────────────────────────
+  socket.on('connect', () => {
+    connDot.className = 'on';
+    socket.emit('list');
+  });
+  socket.on('disconnect', () => { connDot.className = 'off'; });
+  socket.on('sessions', renderSessions);
+  // Refresh periodically
+  setInterval(() => { if (socket.connected) socket.emit('list'); }, 5000);
+  // ── 移动端连接保活 ──────────────────────────────
+  document.addEventListener('visibilitychange', () => {
+    if (!document.hidden) {
+      if (!socket.connected) socket.connect();
+      else socket.emit('list');
+    }
+  });
+  window.addEventListener('online', () => { if (!socket.connected) socket.connect(); });
+  setInterval(() => { if (!document.hidden && !socket.connected) socket.connect(); }, 15000);
+  // ── Render ──────────────────────────────────────────────────
+  const PALETTE = ['#7c3aed','#2563eb','#059669','#b45309','#db2777','#0891b2'];
+  function avatarColor(title) {
+    let h = 0;
+    for (const c of (title || '?')) h = (h * 31 + c.charCodeAt(0)) & 0xff;
+    return PALETTE[h % PALETTE.length];
+  }
+  function fmtCwd(cwd) {
+    if (!cwd) return '';
+    // Show last 2 path segments
+    const parts = cwd.replace(/\\/g, '/').split('/').filter(Boolean);
+    return parts.slice(-2).join('/');
+  }
+  function fmtTime(iso) {
+    const d = new Date(iso);
+    return d.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' });
+  }
+  // 会话的「最后任务时间」：优先最后活动时间，回退创建时间。ms 数或 ISO 皆可。
+  function sessionTime(s) {
+    const v = s.lastActivityAt || s.createdAt || 0;
+    const ms = typeof v === 'number' ? v : new Date(v).getTime();
+    return isNaN(ms) ? 0 : ms;
+  }
+  // 相对时间：刚刚 / N分钟前 / N小时前 / 昨天 HH:MM / M月D日
+  function fmtRelTime(ms) {
+    if (!ms) return '';
+    const now = Date.now();
+    const diff = now - ms;
+    if (diff < 60_000) return '刚刚';
+    if (diff < 3_600_000) return Math.floor(diff / 60_000) + '分钟前';
+    if (diff < 86_400_000) return Math.floor(diff / 3_600_000) + '小时前';
+    const d = new Date(ms);
+    const hm = d.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' });
+    if (diff < 172_800_000) return '昨天 ' + hm;
+    return (d.getMonth() + 1) + '月' + d.getDate() + '日';
+  }
+  // 项目名 = cwd 最后一段
+  function projectName(cwd) {
+    if (!cwd) return '(默认目录)';
+    const parts = cwd.replace(/\\/g, '/').split('/').filter(Boolean);
+    return parts[parts.length - 1] || '(根)';
+  }
+  // 视图状态：分组方式 + 标签筛选
+  let _allSessions = [];
+  let _groupMode = localStorage.getItem('myhi_group_mode') || 'time'; // time | project | tag
+  let _tagFilter = null; // 仅 tag 模式下：只看某标签
+  let _search = '';      // 会话搜索关键词（标题/首条需求/目录/标签）
+  let _draftCounts = {}; // { sessionId: 待发草稿数 }，给卡片打角标
+  // 关键词匹配：任务多了要靠「当初说过什么」找回来，所以首条消息也进搜索范围
+  function matchSession(s, q) {
+    if (!q) return true;
+    const hay = [s.title, s.firstUserText, s.cwd, ...(s.tags || [])]
+      .filter(Boolean).join(' ').toLowerCase();
+    return q.split(/\s+/).filter(Boolean).every(w => hay.includes(w));
+  }
+  async function refreshDraftCounts() {
+    try {
+      const r = await fetch('/api/inbox');
+      const d = await r.json();
+      _draftCounts = d.counts || {};
+      renderSessions();
+    } catch { /* 收件箱不可用不影响列表 */ }
+  }
+  const EMPTY_HTML = `<div class="empty-state">
+      <svg width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
+        <rect x="2" y="4" width="20" height="16" rx="2"/>
+        <path d="M8 9l4 3-4 3M13 15h3"/>
+      </svg>
+      <p>还没有终端会话</p>
+    </div>`;
+  function cardHTML(s) {
+    const safeTitle = esc(s.title || '');
+    const safeId    = esc(s.id);
+    const color  = avatarColor(s.title);
+    const letter = esc((s.title || '?')[0].toUpperCase());
+    const sub    = esc([fmtCwd(s.cwd), fmtRelTime(sessionTime(s)), s.viewers > 0 ? `${s.viewers} 在线` : '', s.controlHolderName ? `${s.controlHolderName} 控制中` : ''].filter(Boolean).join('  ·  '));
+    const tags = (s.tags || []).map(t => `<span class="tag-chip">${esc(t)}</span>`).join('');
+    // 会话名片：一堆会话都叫 claude，靠第一条真人消息认出「这个任务当初是干啥的」
+    const gist = s.firstUserText
+      ? `<div class="card-gist" style="font-size:0.72rem;color:var(--muted,var(--muted));margin-top:0.18rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;opacity:0.85">💬 ${esc(s.firstUserText)}</div>`
+      : '';
+    const nDraft = _draftCounts[s.id] || 0;
+    const draftChip = nDraft
+      ? `<div style="font-size:0.66rem;color:#d29922;margin-top:0.2rem">📥 ${nDraft} 条待发草稿</div>`
+      : '';
+    return `
+      <div class="card" data-id="${safeId}" data-title="${safeTitle}">
+        <div class="avatar" style="background:${color}">${letter}</div>
+        <div class="card-body">
+          <div class="card-title">${safeTitle}</div>
+          <div class="card-sub">${sub}</div>
+          ${gist}
+          ${draftChip}
+          ${tags ? `<div class="card-tags" style="display:flex;flex-wrap:wrap;gap:0.3rem;margin-top:0.3rem">${tags}</div>` : ''}
+        </div>
+        <div class="card-right">
+          <div class="status-dot ${s.alive ? 'alive' : 'dead'}"></div>
+          ${s.viewers > 1 ? `<div class="viewers">👁 ${s.viewers}</div>` : ''}
+        </div>
+      </div>`;
+  }
+  // 分组折叠状态（项目多了列表很长，收起不关心的项目）
+  let _collapsed = new Set(JSON.parse(localStorage.getItem('myhi_collapsed_groups') || '[]'));
+  function saveCollapsed() {
+    localStorage.setItem('myhi_collapsed_groups', JSON.stringify([..._collapsed]));
+  }
+  function isCollapsed(key) { return _collapsed.has(key); }
+  function groupHeaderHTML(label, count, key) {
+    const foldable = key !== undefined;
+    const off = foldable && isCollapsed(key);
+    const attrs = foldable ? ` data-gkey="${esc(key)}"` : '';
+    const style = 'display:flex;align-items:center;gap:0.5rem;margin:0.85rem 0.2rem 0.4rem;'
+      + 'color:var(--muted,var(--muted));font-size:0.75rem;font-weight:600;user-select:none'
+      + (foldable ? ';cursor:pointer' : '');
+    return `<div class="group-header"${attrs} style="${style}">
+      ${foldable ? `<span style="display:inline-block;width:0.7rem">${off ? '▸' : '▾'}</span>` : ''}
+      <span>${esc(label)}</span>
+      <span style="color:var(--border,var(--border2))">·</span>
+      <span style="font-weight:400">${count}</span>
+    </div>`;
+  }
+  function renderSessions(sessions) {
+    if (Array.isArray(sessions)) _allSessions = sessions;
+    renderTagFilter();
+    updateGroupSeg();
+    const q = _search.trim().toLowerCase();
+    const items = [..._allSessions]
+      .filter(s => matchSession(s, q))
+      .sort((a, b) => sessionTime(b) - sessionTime(a)); // 最新在前
+    const cntEl = document.getElementById('search-count');
+    if (cntEl) cntEl.textContent = q ? `${items.length}/${_allSessions.length}` : '';
+    if (!items.length) {
+      list.innerHTML = q
+        ? `<div class="empty-state"><p>没有匹配「${esc(_search)}」的任务</p></div>`
+        : EMPTY_HTML;
+      return;
+    }
+    let html = '';
+    if (_groupMode === 'project') {
+      const groups = new Map();
+      for (const s of items) {
+        const k = projectName(s.cwd);
+        if (!groups.has(k)) groups.set(k, []);
+        groups.get(k).push(s);
+      }
+      // 组按组内最新会话时间排序
+      const ordered = [...groups.entries()].sort((a, b) => sessionTime(b[1][0]) - sessionTime(a[1][0]));
+      for (const [name, arr] of ordered) {
+        const key = 'p:' + name;
+        html += groupHeaderHTML('📁 ' + name, arr.length, key);
+        // 搜索时强制展开，否则会出现「明明搜到了却看不见」
+        if (!isCollapsed(key) || q) html += arr.map(cardHTML).join('');
+      }
+    } else if (_groupMode === 'tag') {
+      let shown = items;
+      if (_tagFilter) shown = items.filter(s => (s.tags || []).includes(_tagFilter));
+      const tagged = new Map();
+      const untagged = [];
+      for (const s of shown) {
+        const tags = s.tags || [];
+        if (!tags.length) { untagged.push(s); continue; }
+        for (const t of tags) {
+          if (_tagFilter && t !== _tagFilter) continue;
+          if (!tagged.has(t)) tagged.set(t, []);
+          tagged.get(t).push(s);
+        }
+      }
+      const ordered = [...tagged.entries()].sort((a, b) => sessionTime(b[1][0]) - sessionTime(a[1][0]));
+      for (const [name, arr] of ordered) {
+        const key = 't:' + name;
+        html += groupHeaderHTML('🏷 ' + name, arr.length, key);
+        if (!isCollapsed(key) || q) html += arr.map(cardHTML).join('');
+      }
+      if (!_tagFilter && untagged.length) {
+        html += groupHeaderHTML('未分类', untagged.length, 't:__none__');
+        if (!isCollapsed('t:__none__') || q) html += untagged.map(cardHTML).join('');
+      }
+    } else {
+      html = items.map(cardHTML).join('');
+    }
+    list.innerHTML = html;
+    // 组头点击折叠/展开（项目多了列表很长）
+    list.querySelectorAll('.group-header[data-gkey]').forEach(h => {
+      h.addEventListener('click', () => {
+        const k = h.dataset.gkey;
+        if (_collapsed.has(k)) _collapsed.delete(k); else _collapsed.add(k);
+        saveCollapsed();
+        renderSessions();
+      });
+    });
+    // 事件委托：点击打开、右键/长按出菜单
+    list.querySelectorAll('.card').forEach(card => {
+      const id = card.dataset.id;
+      const title = card.dataset.title;
+      card.addEventListener('click', () => openSession(id));
+      card.addEventListener('contextmenu', (e) => showActions(e, id, title));
+      // 移动端长按
+      let lpTimer = null;
+      card.addEventListener('touchstart', (e) => { lpTimer = setTimeout(() => showActions(e, id, title), 550); }, { passive: true });
+      card.addEventListener('touchend', () => clearTimeout(lpTimer));
+      card.addEventListener('touchmove', () => clearTimeout(lpTimer));
+    });
+  }
+  function renderTagFilter() {
+    const bar = document.getElementById('tag-filter');
+    if (_groupMode !== 'tag') { bar.style.display = 'none'; return; }
+    const allTags = [...new Set(_allSessions.flatMap(s => s.tags || []))].sort();
+    if (!allTags.length) { bar.style.display = 'none'; return; }
+    bar.style.display = 'flex';
+    const mk = (label, val, active) =>
+      `<button class="tagf-btn" data-tag="${val === null ? '' : esc(val)}" style="background:${active ? 'var(--accent,var(--accent))' : 'var(--bg,var(--bg))'};color:${active ? '#fff' : 'var(--muted,var(--muted))'};border:1px solid ${active ? 'var(--accent,var(--accent))' : 'var(--border,var(--border))'};border-radius:999px;font-size:0.72rem;padding:0.2rem 0.6rem;cursor:pointer">${esc(label)}</button>`;
+    bar.innerHTML = mk('全部', null, !_tagFilter) + allTags.map(t => mk(t, t, _tagFilter === t)).join('');
+    bar.querySelectorAll('.tagf-btn').forEach(b => b.addEventListener('click', () => {
+      _tagFilter = b.dataset.tag || null;
+      renderSessions();
+    }));
+  }
+  function updateGroupSeg() {
+    document.querySelectorAll('.grp-btn').forEach(b => {
+      const on = b.dataset.group === _groupMode;
+      b.style.background = on ? 'var(--accent,var(--accent))' : 'none';
+      b.style.color = on ? '#fff' : 'var(--muted,var(--muted))';
+    });
+  }
+  document.querySelectorAll('.grp-btn').forEach(b => b.addEventListener('click', () => {
+    _groupMode = b.dataset.group;
+    _tagFilter = null;
+    localStorage.setItem('myhi_group_mode', _groupMode);
+    renderSessions();
+  }));
+  // 搜索：边打边过滤
+  (() => {
+    const box = document.getElementById('sess-search');
+    if (!box) return;
+    box.addEventListener('input', () => { _search = box.value; renderSessions(); });
+    box.addEventListener('keydown', (e) => {
+      if (e.key === 'Escape') { box.value = ''; _search = ''; renderSessions(); box.blur(); }
+    });
+  })();
+  // 草稿角标：进页面拉一次，之后跟着会话列表推送刷新
+  refreshDraftCounts();
+  setInterval(refreshDraftCounts, 60_000);
+  // ── 随手记：不在会话页也能记一条草稿 ──────────────────────────
+  let _notePendingImage = null; // { path }
+  window.openNoteSheet = function() {
+    const sel = document.getElementById('note-session');
+    // AI 会话排前面（草稿最终是发给 AI 的），同项目的按最近活跃排
+    const items = [..._allSessions].sort((a, b) =>
+      (b.mode === 'agent') - (a.mode === 'agent') || sessionTime(b) - sessionTime(a));
+    if (!items.length) { alert('还没有任何会话——草稿必须归属一个任务，先建一个吧'); return; }
+    sel.innerHTML = items.map(s =>
+      `<option value="${esc(s.id)}">${esc(s.title)} · ${esc(projectName(s.cwd))}${s.mode === 'agent' ? '' : '（终端）'}</option>`
+    ).join('');
+    document.getElementById('note-text').value = '';
+    document.getElementById('note-autosend').checked = false;
+    document.getElementById('note-image').value = '';
+    document.getElementById('note-image-status').textContent = '';
+    _notePendingImage = null;
+    document.getElementById('note-backdrop').style.display = 'block';
+    document.getElementById('note-sheet').style.display = 'block';
+  };
+  window.closeNoteSheet = function() {
+    document.getElementById('note-backdrop').style.display = 'none';
+    document.getElementById('note-sheet').style.display = 'none';
+  };
+  document.getElementById('note-image')?.addEventListener('change', async (e) => {
+    const file = e.target.files?.[0];
+    const status = document.getElementById('note-image-status');
+    if (!file) { _notePendingImage = null; status.textContent = ''; return; }
+    const sid = document.getElementById('note-session').value;
+    status.textContent = '上传中…';
+    try {
+      const form = new FormData();
+      form.append('image', file, file.name);
+      const r = await fetch(`/upload?sessionId=${encodeURIComponent(sid)}`, { method: 'POST', body: form });
+      const d = await r.json();
+      if (d.path) { _notePendingImage = { path: d.path }; status.textContent = '✅ 已上传：' + file.name; }
+      else { _notePendingImage = null; status.textContent = '上传失败：' + (d.error || '未知'); }
+    } catch (err) {
+      _notePendingImage = null;
+      status.textContent = '上传出错：' + err.message;
+    }
+  });
+  window.saveNote = async function() {
+    const sid = document.getElementById('note-session').value;
+    const text = document.getElementById('note-text').value.trim();
+    if (!sid) { alert('请选择归属任务'); return; }
+    if (!text && !_notePendingImage) { alert('写点什么或传张图'); return; }
+    try {
+      const r = await fetch('/api/inbox', {
+        method: 'POST', headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({
+          text, sessionId: sid, source: 'home',
+          autoSend: document.getElementById('note-autosend').checked,
+          images: _notePendingImage ? [{ path: _notePendingImage.path, name: '图片' }] : [],
+        }),
+      });
+      const d = await r.json();
+      if (d.error) { alert('存草稿失败：' + d.error); return; }
+      closeNoteSheet();
+      refreshDraftCounts();
+    } catch (e) {
+      alert('存草稿失败：' + e.message);
+    }
+  };
+  // ── Navigation ──────────────────────────────────────────────
+  function openSession(id) {
+    window.location.href = `/terminal/${id}`;
+  }
+  // ── 会话体检 ────────────────────────────────────────────────
+  window.openDoctor = function() {
+    document.getElementById('doctor-menu').style.display = 'block';
+    refreshDoctor();
+  };
+  window.closeDoctor = function() {
+    document.getElementById('doctor-menu').style.display = 'none';
+  };
+  window.refreshDoctor = async function() {
+    const box = document.getElementById('doctor-list');
+    box.innerHTML = '<div style="color:var(--muted);font-size:0.8rem;padding:1rem 0.2rem">加载中…</div>';
+    try {
+      const res = await fetch('/api/sessions/health', { credentials: 'same-origin' });
+      const data = await res.json();
+      renderDoctor(data.sessions || []);
+    } catch (e) {
+      box.innerHTML = '<div style="color:var(--red);font-size:0.8rem;padding:1rem 0.2rem">加载失败：' + esc(e.message) + '</div>';
+    }
+  };
+  function pill(text, color, bg) {
+    return `<span style="font-size:0.65rem;padding:0.1rem 0.4rem;border-radius:5px;color:${color};background:${bg};white-space:nowrap">${text}</span>`;
+  }
+  function renderDoctor(sessions) {
+    const box = document.getElementById('doctor-list');
+    if (!sessions.length) {
+      box.innerHTML = '<div style="color:var(--muted);font-size:0.8rem;padding:1rem 0.2rem">没有 agent 会话</div>';
+      return;
+    }
+    // 中毒的排前面
+    sessions.sort((a, b) => (b.health?.poisoned ? 1 : 0) - (a.health?.poisoned ? 1 : 0));
+    box.innerHTML = sessions.map(s => {
+      const h = s.health || {};
+      const poisoned = h.poisoned;
+      const badges = [];
+      if (poisoned) badges.push(pill('⚠ 中毒 · ' + esc(h.persistedMode || '非bypass'), '#fff', '#a11'));
+      else if (h.persistedMode) badges.push(pill(esc(h.persistedMode), 'var(--muted)', 'var(--bg)'));
+      badges.push(pill(s.alive ? '运行中' : '已停', s.alive ? 'var(--green)' : 'var(--muted)', 'var(--bg)'));
+      if (s.busy) badges.push(pill('忙', 'var(--orange)', 'var(--bg)'));
+      if (h.transcriptKB) badges.push(pill(h.transcriptKB + 'KB', 'var(--muted)', 'var(--bg)'));
+      if (h.imageCount) badges.push(pill('🖼 ' + h.imageCount, 'var(--muted)', 'var(--bg)'));
+      const border = poisoned ? '#a11' : 'var(--border)';
+      return `
+        <div style="border:1px solid ${border};border-radius:10px;padding:0.6rem 0.7rem;margin-bottom:0.5rem">
+          <div style="display:flex;align-items:center;gap:0.4rem;flex-wrap:wrap;margin-bottom:0.35rem">
+            <span style="font-weight:600;font-size:0.85rem">${esc(s.title || '(无标题)')}</span>
+            ${badges.join('')}
+          </div>
+          <div style="font-size:0.68rem;color:var(--muted);margin-bottom:0.5rem;word-break:break-all">${esc(s.cwd || '')}</div>
+          <div style="display:flex;gap:0.4rem">
+            <button onclick="openSession('${esc(s.id)}')" style="flex:1;background:var(--bg);border:1px solid var(--border);color:var(--text);font-size:0.72rem;padding:0.35rem;border-radius:6px;cursor:pointer">打开</button>
+            <button onclick="doctorReset('${esc(s.id)}','${esc(s.title || '')}')" style="flex:1;background:${poisoned ? '#1c3a2b' : 'var(--bg)'};border:1px solid ${poisoned ? 'var(--green)' : 'var(--border)'};color:${poisoned ? 'var(--green)' : 'var(--text)'};font-size:0.72rem;padding:0.35rem;border-radius:6px;cursor:pointer">重开为干净会话</button>
+            <button onclick="doctorDelete('${esc(s.id)}','${esc(s.title || '')}')" style="background:var(--redbg);border:none;color:var(--red);font-size:0.72rem;padding:0.35rem 0.6rem;border-radius:6px;cursor:pointer">删除</button>
+          </div>
+        </div>`;
+    }).join('');
+  }
+  window.doctorReset = async function(id, title) {
+    if (!confirm(`重开「${title}」为干净会话？\n会断开旧对话上下文（磁盘上的文件不受影响），下次提问开启全新会话。`)) return;
+    try {
+      const res = await fetch(`/api/sessions/${id}/reset`, { method: 'POST', credentials: 'same-origin' });
+      if (!res.ok) throw new Error((await res.json().catch(() => ({}))).error || res.status);
+      refreshDoctor();
+    } catch (e) { alert('重开失败：' + e.message); }
+  };
+  window.doctorDelete = async function(id, title) {
+    if (!confirm(`删除会话「${title}」？此操作不可恢复。`)) return;
+    try {
+      const res = await fetch(`/api/sessions/${id}`, { method: 'DELETE', credentials: 'same-origin' });
+      if (!res.ok && res.status !== 204) throw new Error(res.status);
+      refreshDoctor();
+    } catch (e) { alert('删除失败：' + e.message); }
+  };
+  // ── Presets ───────────────────────────────────────────────────
+  const PRESETS = [
+    // Agent 模式
+    { icon: '🤖', label: 'Claude',    title: 'claude', type: 'agent', cmd: 'claude' },
+    // PTY 模式（终端）
+    { icon: '✨', label: 'Gemini',    title: 'gemini', type: 'pty',   cmd: 'gemini' },
+    { icon: '🐚', label: 'Shell',     title: 'shell',  type: 'pty',   cmd: '' },
+  ];
+  let selectedPreset = null;
+  function renderPresets() {
+    const el = document.getElementById('presets');
+    el.innerHTML = PRESETS.map((p, i) => `
+      <div class="chip" id="chip-${i}" onclick="selectPreset(${i})">
+        <span class="chip-icon">${p.icon}</span>
+        <span class="chip-label">${p.label}</span>
+      </div>`).join('');
+  }
+  renderPresets();
+  function selectPreset(i) {
+    selectedPreset = i;
+    document.querySelectorAll('.chip').forEach((c, j) =>
+      c.classList.toggle('selected', j === i));
+    const p = PRESETS[i];
+    // 不再自动把名称填成 claude/gemini/shell —— 名称必填、留给用户输入任务名
+    document.getElementById('inp-cmd').value   = p.cmd || '';
+  }
+  // ── Create sheet ─────────────────────────────────────────────
+  function openSheet() {
+    document.getElementById('sheet-backdrop').classList.add('open');
+    document.getElementById('sheet').classList.add('open');
+    // Default to first preset
+    selectPreset(0);
+    setTimeout(() => document.getElementById('inp-title').focus(), 300);
+  }
+  function closeSheet() {
+    document.getElementById('sheet-backdrop').classList.remove('open');
+    document.getElementById('sheet').classList.remove('open');
+    selectedPreset = null;
+    document.querySelectorAll('.chip').forEach(c => c.classList.remove('selected'));
+  }
+  document.getElementById('inp-title').addEventListener('keydown', e => {
+    if (e.key === 'Enter') createSession();
+  });
+  function createSession() {
+    const titleInput = document.getElementById('inp-title');
+    const title   = titleInput.value.trim();
+    if (!title) {
+      alert('请输入任务名称');
+      titleInput.focus();
+      return;
+    }
+    const initCmd = document.getElementById('inp-cmd').value.trim()   || undefined;
+    const cwd     = document.getElementById('inp-cwd').value.trim()   || undefined;
+    if (cwd) recordDir(cwd);
+    const preset = selectedPreset != null ? PRESETS[selectedPreset] : null;
+    closeSheet();
+    document.getElementById('inp-title').value = '';
+    document.getElementById('inp-cmd').value   = '';
+    document.getElementById('inp-cwd').value   = '';
+    if (preset?.type === 'agent') {
+      // Agent 模式：使用 Claude SDK
+      socket.emit('create-agent', {
+        title,
+        cwd,
+      }, (res) => {
+        if (res?.ok) openSession(res.session.id);
+        else alert('创建失败: ' + (res?.error || '未知错误'));
+      });
+    } else {
+      // PTY 模式：创建终端会话
+      socket.emit('create', { title, initCmd, cwd }, (res) => {
+        if (res?.ok) openSession(res.session.id);
+        else alert('创建失败: ' + (res?.error || '未知错误'));
+      });
+    }
+  }
+  // ── Dir picker ───────────────────────────────────────────────
+  let _dirCurrent = '';
+  const RECENT_DIRS_KEY = 'myhi_recent_dirs'; // { path: count } 频次记录
+  const RECENT_DIRS_MAX = 5;
+  function getRecentDirs() {
+    try { return JSON.parse(localStorage.getItem(RECENT_DIRS_KEY)) || {}; } catch { return {}; }
+  }
+  function recordDir(dir) {
+    if (!dir) return;
+    const dirs = getRecentDirs();
+    dirs[dir] = (dirs[dir] || 0) + 1;
+    // 只保留使用最多的若干条
+    const sorted = Object.entries(dirs).sort((a, b) => b[1] - a[1]);
+    const trimmed = Object.fromEntries(sorted.slice(0, RECENT_DIRS_MAX));
+    localStorage.setItem(RECENT_DIRS_KEY, JSON.stringify(trimmed));
+    renderRecentDirs();
+  }
+  function renderRecentDirs() {
+    const container = document.getElementById('recent-dirs');
+    container.innerHTML = '';
+    const dirs = getRecentDirs();
+    const sorted = Object.entries(dirs).sort((a, b) => b[1] - a[1]);
+    const filtered = _userDir ? sorted.filter(([path]) => path.startsWith(_userDir)) : sorted;
+    if (!filtered.length) return;
+    filtered.forEach(([path]) => {
+      const btn = document.createElement('button');
+      // 只显示最后一级目录名
+      const short = path.replace(/[\\/]$/, '').split(/[\\/]/).pop() || path;
+      btn.textContent = short;
+      btn.title = path;
+      btn.style.cssText = 'background:var(--bg);color:var(--accent);border:1px solid var(--border);border-radius:6px;padding:0.2rem 0.5rem;font-size:0.72rem;cursor:pointer;font-family:"SF Mono",Consolas,monospace;max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap';
+      btn.onclick = () => { document.getElementById('inp-cwd').value = path; };
+      container.appendChild(btn);
+    });
+  }
+  renderRecentDirs();
+  function openDirPicker() {
+    document.getElementById('dir-picker').classList.add('open');
+    const dirs = getRecentDirs();
+    const topDir = Object.entries(dirs).sort((a, b) => b[1] - a[1])[0]?.[0] || '';
+    const initial = document.getElementById('inp-cwd').value.trim() || topDir || '';
+    loadDirs(initial);
+    loadDrives();
+  }
+  function closeDirPicker() {
+    document.getElementById('dir-picker').classList.remove('open');
+  }
+  function selectDir() {
+    document.getElementById('inp-cwd').value = _dirCurrent;
+    recordDir(_dirCurrent);
+    closeDirPicker();
+  }
+  // Windows 盘符检测和切换
+  function loadDrives() {
+    const bar = document.getElementById('drive-bar');
+    if (!bar) return;
+    // 通过尝试访问常见盘符来检测
+    const letters = ['C', 'D', 'E', 'F', 'G', 'H'];
+    bar.innerHTML = '';
+    let found = 0;
+    for (const letter of letters) {
+      const path = letter + ':\\';
+      socket.emit('dirs', path, (data) => {
+        if (data.ok) {
+          found++;
+          const btn = document.createElement('button');
+          btn.className = 'drive-btn';
+          btn.textContent = letter + ':';
+          btn.onclick = () => {
+            loadDirs(path);
+            bar.querySelectorAll('.drive-btn').forEach(b => b.classList.remove('active'));
+            btn.classList.add('active');
+          };
+          // 高亮当前盘符
+          if (_dirCurrent && _dirCurrent.toUpperCase().startsWith(letter + ':')) {
+            btn.classList.add('active');
+          }
+          bar.appendChild(btn);
+        }
+      });
+    }
+  }
+  function loadDirs(path) {
+    document.getElementById('dir-list').innerHTML = '<div style="padding:1rem;color:var(--muted);font-size:0.85rem">加载中...</div>';
+    socket.emit('dirs', path || '', (data) => {
+      if (!data.ok) {
+        document.getElementById('dir-list').innerHTML = `<div style="padding:1rem;color:var(--red);font-size:0.85rem">${escH(data.error)}</div>`;
+        return;
+      }
+      _dirCurrent = data.current;
+      document.getElementById('dir-current').textContent = data.current;
+      // 更新盘符高亮
+      document.querySelectorAll('.drive-btn').forEach(btn => {
+        btn.classList.toggle('active', _dirCurrent.toUpperCase().startsWith(btn.textContent.toUpperCase()));
+      });
+      const dirList = document.getElementById('dir-list');
+      dirList.innerHTML = '';
+      if (data.parent) {
+        const el = document.createElement('div');
+        el.className = 'dir-item';
+        el.dataset.path = data.parent;
+        el.innerHTML = '<span class="di">↩</span><span class="dn">..</span>';
+        dirList.appendChild(el);
+      }
+      for (const d of data.dirs) {
+        const el = document.createElement('div');
+        el.className = 'dir-item';
+        el.dataset.path = d.path;
+        el.innerHTML = `<span class="di">📁</span><span class="dn">${escH(d.name)}</span>`;
+        dirList.appendChild(el);
+      }
+      if (!dirList.children.length) {
+        dirList.innerHTML = '<div style="padding:1rem;color:var(--muted);font-size:0.85rem">无子目录</div>';
+      }
+    });
+  }
+  document.getElementById('dir-list').addEventListener('click', e => {
+    const item = e.target.closest('.dir-item');
+    if (item?.dataset.path) loadDirs(item.dataset.path);
+  });
+  function escH(s) { return s.replace(/&/g,'&amp;').replace(/</g,'&lt;').replace(/>/g,'&gt;'); }
+  // ── 导入已有 Claude 会话 ───────────────────────────────────
+  function openImportSheet() {
+    closeSheet(); // 关闭创建面板
+    document.getElementById('import-menu').classList.add('open');
+    document.getElementById('import-list').innerHTML = '<div style="padding:1rem;color:var(--muted);font-size:0.85rem">加载中...</div>';
+    // 通过 REST API 获取本地 Claude 会话列表
+    fetch('/api/claude-sessions')
+      .then(r => r.json())
+      .then(sessions => {
+        const el = document.getElementById('import-list');
+        if (!sessions.length) {
+          el.innerHTML = '<div style="padding:1rem;color:var(--muted);font-size:0.85rem">未找到本地 Claude 会话<br><span style="font-size:0.72rem">会话数据存储在 ~/.claude/projects/ 目录</span></div>';
+          return;
+        }
+        el.innerHTML = '';
+        for (const s of sessions) {
+          const item = document.createElement('div');
+          item.className = 'import-item';
+          item.onclick = () => importSession(s);
+          const time = s.updatedAt ? new Date(s.updatedAt).toLocaleString('zh-CN', { month:'numeric', day:'numeric', hour:'2-digit', minute:'2-digit' }) : '';
+          const proj = s.projectDir ? decodeURIComponent(s.projectDir).split(/[\\/]/).pop() : '';
+          const name = s.summary || s.sessionId.slice(0, 12);
+          item.innerHTML = `
+            <span class="ii-icon">🤖</span>
+            <div class="ii-body">
+              <div class="ii-id">${escH(name)}</div>
+              <div class="ii-info">${time ? time + ' · ' : ''}${s.messageCount} 条消息${proj ? ' · ' + escH(proj) : ''}</div>
+            </div>`;
+          el.appendChild(item);
+        }
+      })
+      .catch(err => {
+        document.getElementById('import-list').innerHTML = `<div style="padding:1rem;color:var(--red);font-size:0.85rem">加载失败: ${escH(err.message)}</div>`;
+      });
+  }
+  function closeImportSheet() {
+    document.getElementById('import-menu').classList.remove('open');
+  }
+  function importSession(session) {
+    closeImportSheet();
+    const cwd = session.projectPath || document.getElementById('inp-cwd').value.trim() || undefined;
+    const title = session.summary ? session.summary.slice(0, 30) : 'claude (导入)';
+    socket.emit('create-agent', {
+      title,
+      cwd,
+      resumeSessionId: session.sessionId,
+    }, (res) => {
+      if (res?.ok) openSession(res.session.id);
+      else alert('导入失败: ' + (res?.error || '未知错误'));
+    });
+  }
+  // ── Kill ─────────────────────────────────────────────────────
+  let _killId = null;
+  // 会话操作菜单：打开 / 重命名 / 设置标签 / 终止
+  function showActions(e, id, title) {
+    e.preventDefault();
+    const s = _allSessions.find(x => x.id === id);
+    const curTags = (s?.tags || []).join(', ');
+    const overlay = document.createElement('div');
+    overlay.style.cssText = 'position:fixed;inset:0;z-index:80;background:rgba(0,0,0,0.55);display:flex;align-items:flex-end;justify-content:center';
+    const box = document.createElement('div');
+    box.style.cssText = 'background:var(--surface,var(--surface));border-radius:18px 18px 0 0;width:100%;max-width:640px;padding:0.5rem 0 max(1rem,env(safe-area-inset-bottom))';
+    const mkBtn = (label, color) => `<button style="display:block;width:100%;text-align:left;background:none;border:none;border-top:1px solid var(--border,var(--border));color:${color || 'var(--text,var(--text))'};font-size:0.95rem;padding:0.9rem 1.25rem;cursor:pointer">${label}</button>`;
+    box.innerHTML =
+      `<div style="padding:0.6rem 1.25rem 0.4rem;color:var(--muted,var(--muted));font-size:0.8rem;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap">${esc(title)}</div>` +
+      mkBtn('打开') + mkBtn('重命名') + mkBtn('设置标签') + mkBtn('终止会话', 'var(--red,var(--red))') +
+      `<button style="display:block;width:100%;background:none;border:none;border-top:6px solid var(--bg,var(--bg));color:var(--muted,var(--muted));font-size:0.9rem;padding:0.85rem;cursor:pointer">取消</button>`;
+    overlay.appendChild(box);
+    const close = () => overlay.remove();
+    overlay.addEventListener('click', (ev) => { if (ev.target === overlay) close(); });
+    const btns = box.querySelectorAll('button');
+    btns[0].onclick = () => { close(); openSession(id); };
+    btns[1].onclick = () => {
+      close();
+      const nv = prompt('重命名会话', title);
+      if (nv && nv.trim()) socket.emit('rename', { sessionId: id, title: nv.trim() });
+    };
+    btns[2].onclick = () => {
+      close();
+      const nv = prompt('设置标签（多个用逗号分隔，留空清除）', curTags);
+      if (nv !== null) socket.emit('set-tags', { sessionId: id, tags: nv.split(/[,，]/).map(t => t.trim()).filter(Boolean) });
+    };
+    btns[3].onclick = () => { close(); showKill(e, id, title); };
+    btns[4].onclick = close;
+    document.body.appendChild(overlay);
+  }
+  function showKill(e, id, title) {
+    if (e && e.preventDefault) e.preventDefault();
+    _killId = id;
+    document.getElementById('kill-title').textContent = title;
+    document.getElementById('kill-menu').classList.add('open');
+  }
+  function closeKill() {
+    document.getElementById('kill-menu').classList.remove('open');
+    _killId = null;
+  }
+  function confirmKill() {
+    if (_killId) socket.emit('kill', _killId);
+    closeKill();
+  }
+  // ── 版本更新 ──────────────────────────────────────────────
+</script>
+</body>
+</html>