@wendongfly/myhi 1.3.197 → 1.3.199

package/dist/chat.html

@@ -11,6 +11,7 @@
   <title>myhi 会话</title>
   <script src="/lib/machine.js" data-session></script>
   <script src="/lib/prefs.js"></script>
+  <script src="/lib/attn.js"></script>
   <script src="/sio-client/socket.io.min.js"></script>
   <script src="/theme.js"></script>
   <script>
@@ -24,6 +25,9 @@
       if(em==='1') r.classList.add('embed');
       // 首页电脑端工作台右侧嵌入：保留本页顶栏，左侧已有任务列表 → 藏掉分屏/切换/返回；
       // 页面里的链接（如「首页 ⚙ 设置」）在整个窗口打开，别在右侧小框里再套一个首页
+      // 手机（触屏且窄屏，平板横屏 >768px 按电脑处理）且未关「移动端精简」→ 精简布局
+      var cs={};try{cs=JSON.parse(localStorage.getItem('myhi_chat_settings')||'{}')||{}}catch(e){}
+      if(!em&&cs.mobileCompact!==false&&matchMedia('(pointer: coarse) and (max-width: 768px)').matches) r.classList.add('m');
       if(em==='ws'){ r.classList.add('embed-ws'); var bs=document.createElement('base'); bs.target='_top'; document.head.appendChild(bs); }
     }catch(e){}})();
   </script>
@@ -77,6 +81,32 @@
     .top-btn:hover { background: var(--surface2); color: var(--text); }
     .top-btn:active { transform: scale(0.92); }
 
+    /* ── 移动端精简（html.m）：顶栏只留 ← / ●任务名▾ / ⋯，状态行收进 ⋯ ── */
+    #title-row { display: flex; align-items: center; gap: 0.35rem; min-width: 0; }
+    #m-dot, #m-back, #m-more, #m-ro { display: none; }
+    html.m #m-back, html.m #m-more { display: inline-flex; }
+    html.m #m-dot { display: inline-block; }
+    html.m #m-ro.show { display: inline-flex; }
+    html.m .top-hide-m, html.m #status-bar, html.m #session-cwd { display: none !important; }
+    html.m #title-group { cursor: pointer; }
+    html.m #session-title::after { content: ' ▾'; color: var(--muted); font-size: 0.7rem; font-weight: 400; }
+    html.m #ctx-chip:not(.hi) { display: none !important; }
+    html.m #sk-builtin-skills, html.m #sk-custom-skills { display: none !important; }
+    html.m #top-bar { transition: margin-top 0.2s ease; }
+    /* 安全区只在「添加到主屏幕」全屏运行时才需要；普通浏览器标签页上面已有地址栏，
+       部分国产浏览器仍报状态栏高度 → 顶栏上方白空一行，这里不留 */
+    @media (display-mode: browser) {
+      #top-bar { padding-top: 0.5rem; }
+      #m-toast { top: 3.2rem; }
+    }
+    #m-more { position: relative; font-size: 1.1rem; letter-spacing: 1px; }
+    #m-more.dot::after { content: ''; position: absolute; top: 6px; right: 5px; width: 7px; height: 7px; border-radius: 50%; background: var(--red); }
+    #m-ro { font-size: 0.68rem; color: var(--muted); border: 1px solid var(--border); border-radius: 10px; padding: 0.1rem 0.45rem; white-space: nowrap; flex-shrink: 0; cursor: pointer; }
+    /* 其他任务完成 / 等你回复的提醒条 */
+    #m-toast { position: fixed; left: 0.6rem; right: 0.6rem; top: calc(3.2rem + env(safe-area-inset-top)); z-index: 110; background: var(--surface2); color: var(--text); border: 1px solid var(--border); border-left: 4px solid var(--green); border-radius: 10px; padding: 0.6rem 0.8rem; font-size: 0.82rem; box-shadow: 0 6px 20px rgba(0,0,0,0.35); display: none; cursor: pointer; }
+    #m-toast.show { display: block; }
+    #m-toast .sub { font-size: 0.72rem; color: var(--muted); margin-top: 0.15rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+
     /* ── 状态栏 ─────────────────────────────── */
     #status-bar { display: flex; align-items: center; gap: 0.6rem; padding: 0.3rem 0.75rem; background: var(--bg); border-bottom: 1px solid var(--surface2); font-size: 0.72rem; overflow-x: auto; flex-shrink: 0; scrollbar-width: none; }
     #status-bar::-webkit-scrollbar { display: none; }
@@ -420,7 +450,10 @@
     #fedit-ta:focus { border-color: var(--purple); }
     /* 预览复用记忆面板的 .md 渲染样式，只解开它自带的 max-height/隐藏 */
     #fedit-preview { display: none; max-height: none; flex: 1; min-height: 0; border: 1px solid var(--border); border-radius: 8px; background: var(--bg); }
+    #fedit-preview.html { padding: 0; overflow: hidden; background: #fff; }
+    #fedit-preview.html iframe { width: 100%; height: 100%; border: 0; display: block; background: #fff; }
     .fedit-tab { flex-shrink: 0; }
+    #fedit-sheet .fp-btn { white-space: nowrap; }
     .fedit-tab.on { border-color: var(--purple); background: var(--purple); color: #fff; }
     .fp-btn-warn { background: var(--yellow2); border-color: #d2992280; }
     .fp-btn-warn:active { background: var(--yellow2); }
@@ -651,21 +684,27 @@
 
   <div id="top-bar">
     <button id="grid-btn" class="top-btn" onclick="location.href='/grid'" title="分屏工作台（多任务并排）" style="font-size:1.05rem;padding:0 0.35rem;color:var(--blue2)">▦</button>
-    <div id="title-group">
-      <div id="session-title">加载中...</div>
+    <button id="m-back" class="top-btn" onclick="goHome()" title="首页">
+      <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M15 18l-6-6 6-6"/></svg>
+    </button>
+    <div id="title-group" onclick="if(document.documentElement.classList.contains('m'))openSwitchSheet()">
+      <div id="title-row"><span id="m-dot" class="sb-dot idle"></span><div id="session-title">加载中...</div></div>
       <div id="session-cwd"></div>
     </div>
-    <button class="top-btn" onclick="openChatHelp()" title="使用说明" style="font-size:0.7rem;color:var(--muted)">?</button>
-    <button class="top-btn" onclick="openSettings()" title="设置">
+    <span id="m-ro" onclick="toggleControl()"></span>
+    <button class="top-btn top-hide-m" onclick="openChatHelp()" title="使用说明" style="font-size:0.7rem;color:var(--muted)">?</button>
+    <button class="top-btn top-hide-m" onclick="openSettings()" title="设置">
       <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="3"/><path d="M19.4 15a1.65 1.65 0 00.33 1.82l.06.06a2 2 0 01-2.83 2.83l-.06-.06a1.65 1.65 0 00-1.82-.33 1.65 1.65 0 00-1 1.51V21a2 2 0 01-4 0v-.09A1.65 1.65 0 009 19.4a1.65 1.65 0 00-1.82.33l-.06.06a2 2 0 01-2.83-2.83l.06-.06A1.65 1.65 0 004.68 15a1.65 1.65 0 00-1.51-1H3a2 2 0 010-4h.09A1.65 1.65 0 004.6 9a1.65 1.65 0 00-.33-1.82l-.06-.06a2 2 0 012.83-2.83l.06.06A1.65 1.65 0 009 4.68a1.65 1.65 0 001-1.51V3a2 2 0 014 0v.09a1.65 1.65 0 001 1.51 1.65 1.65 0 001.82-.33l.06-.06a2 2 0 012.83 2.83l-.06.06A1.65 1.65 0 0019.4 9a1.65 1.65 0 001.51 1H21a2 2 0 010 4h-.09a1.65 1.65 0 00-1.51 1z"/></svg>
     </button>
     <button class="top-btn" id="ctx-chip" onclick="openCtxSheet()" title="会话数据：上下文水位 / 成本 / token 明细" style="display:none;width:auto;padding:0 0.5rem;white-space:nowrap;font-size:0.7rem;color:var(--muted)">◈ --</button>
-    <button class="top-btn" onclick="openFilePanel()" title="文件" style="font-size:0.7rem;color:var(--muted)">文件</button>
-    <button class="top-btn" onclick="openSwitchSheet()" title="切换会话" style="font-size:0.7rem;color:var(--muted)">切换</button>
-    <button class="top-btn" onclick="goBack()" title="返回">
+    <button class="top-btn top-hide-m" onclick="openFilePanel()" title="文件" style="font-size:0.7rem;color:var(--muted)">文件</button>
+    <button class="top-btn top-hide-m" onclick="openSwitchSheet()" title="切换会话" style="font-size:0.7rem;color:var(--muted)">切换</button>
+    <button class="top-btn top-hide-m" onclick="goBack()" title="返回">
       <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M9 18l6-6-6-6"/></svg>
     </button>
+    <button id="m-more" class="top-btn" onclick="openMobileMore()" title="更多">⋯</button>
   </div>
+  <div id="m-toast"></div>
 
   <div id="status-bar">
     <span class="sb-item" id="work-status"><span class="sb-dot idle"></span> 空闲</span>
@@ -770,7 +809,7 @@
       <button class="sk sk-claude" data-sk="followup" onclick="openFollowUpSheet()" style="color:var(--blue2)">🔄 跟进</button>
       <button class="sk sk-claude" data-sk="git" onclick="openGitSheet()" style="color:var(--green)">提交</button>
       <button class="sk sk-claude" data-sk="memory" onclick="showMemory()">记忆</button>
-      <button class="sk sk-claude" data-sk="skills" onclick="openSkillSheet()" style="color:var(--purple2)">技能</button>
+      <button class="sk sk-claude" data-sk="skills" onclick="skillBtnTap()" style="color:var(--purple2)">技能</button>
       <span id="sk-builtin-skills" data-sk="skills"></span>
       <span id="sk-custom-skills" data-sk="skills"></span>
     </div>
@@ -824,6 +863,7 @@
       <div class="set-line"><span>思考过程</span><div id="seg-think" class="seg-row"><button class="seg" data-v="hide">隐藏</button><button class="seg" data-v="fold">折叠</button><button class="seg" data-v="open">展开</button></div></div>
       <div class="set-line"><span>工具调用</span><div id="seg-tools" class="seg-row"><button class="seg" data-v="fold">折叠</button><button class="seg" data-v="open">展开</button></div></div>
       <div class="set-line"><span>工具输出<small>AI 执行命令/读文件的原始结果</small></span><div id="seg-toolout" class="seg-row"><button class="seg" data-v="hide">隐藏</button><button class="seg" data-v="clip">前8行</button><button class="seg" data-v="all">全部</button></div></div>
+      <div class="set-line"><span>手机布局<small>仅手机生效：精简只留任务名、状态与切换</small></span><div id="seg-mobile" class="seg-row"><button class="seg" data-v="on">精简</button><button class="seg" data-v="off">完整</button></div></div>
       <label class="setting-toggle" id="row-parse"><span>把终端里的 Claude 输出整理成聊天样式</span><input type="checkbox" id="set-parse" checked></label>
     </div>
     <div class="setting-group" data-stab="chat" style="display:none">
@@ -1140,10 +1180,13 @@
     <div class="action-sheet-backdrop" onclick="closeFileEditor()"></div>
     <div class="action-sheet-box" style="height:92vh;max-height:92vh;display:flex;flex-direction:column">
       <div class="action-sheet-title" style="display:flex;align-items:center;gap:0.5rem">
-        <span style="flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap">✏️ <span id="fedit-title">文件</span></span>
+        <span style="flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap"><span id="fedit-icon">✏️</span> <span id="fedit-title">文件</span></span>
         <span id="fedit-state" style="font-size:0.64rem;color:var(--muted);flex-shrink:0;font-weight:400"></span>
       </div>
-      <div id="fedit-path" style="font-size:0.66rem;color:var(--muted);padding:0 0.2rem 0.4rem;word-break:break-all"></div>
+      <div style="display:flex;align-items:flex-start;gap:0.4rem;padding:0 0.2rem 0.4rem">
+        <div id="fedit-path" style="flex:1;min-width:0;font-size:0.68rem;color:var(--muted);word-break:break-all;font-family:'SF Mono',Consolas,monospace" title="文件所在位置"></div>
+        <button class="fp-btn" onclick="feditCopyPath(this)" style="flex-shrink:0;font-size:0.66rem;padding:0.15rem 0.45rem" title="复制完整路径">📋 复制路径</button>
+      </div>
       <div style="flex:1;min-height:0;display:flex;flex-direction:column;gap:0.4rem;padding:0 0.2rem">
         <div id="fedit-loading" style="flex:1;display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:0.82rem">加载中...</div>
         <textarea id="fedit-ta" spellcheck="false"></textarea>
@@ -1152,6 +1195,7 @@
       <div style="display:flex;gap:0.4rem;padding:0.5rem 0.2rem 0;align-items:center">
         <button class="fp-btn fedit-tab" id="fedit-tab-edit" onclick="feditSetMode('edit')">✏️ 编辑</button>
         <button class="fp-btn fedit-tab" id="fedit-tab-preview" onclick="feditSetMode('preview')" style="display:none">👁 预览</button>
+        <button class="fp-btn" id="fedit-newtab" onclick="feditOpenTab()" style="display:none" title="在浏览器新标签页里全屏查看（已保存的版本）">↗ 全屏</button>
         <span style="flex:1"></span>
         <button class="fp-btn" onclick="feditReload()" title="放弃本地修改，重新读磁盘最新内容">🔄 重读</button>
         <button class="fp-btn" onclick="closeFileEditor()">关闭</button>
@@ -1167,7 +1211,7 @@
   <div id="cmd-sheet" class="action-sheet">
     <div class="action-sheet-backdrop" onclick="closeCmdSheet()"></div>
     <div class="action-sheet-box" style="max-height:75vh;display:flex;flex-direction:column">
-      <div class="action-sheet-title">自定义命令</div>
+      <div class="action-sheet-title" id="cmd-sheet-title">自定义命令</div>
       <div style="padding:0.3rem 0.2rem">
         <input id="cmd-filter" class="slash-inp" placeholder="搜索命令..." autocomplete="off">
       </div>
@@ -1739,6 +1783,7 @@
           if (h.start > last) frag.appendChild(document.createTextNode(s.slice(last, h.start)));
           const a = document.createElement('span');
           a.className = 'file-link';
+          a.title = /\.(html?|md|markdown)$/i.test(h.text) ? '点击查看（可切到编辑）' : '点击查看 / 编辑';
           a.textContent = h.text;
           a.dataset.path = h.text;
           frag.appendChild(a);
@@ -2798,6 +2843,7 @@
       };
       const s = STATES[state] || STATES.idle;
       el.innerHTML = `<span class="sb-dot ${s.dot}"></span> ${s.text}`;
+      const md = document.getElementById('m-dot'); if (md) { md.className = 'sb-dot ' + s.dot; md.title = s.text; }
       // 回归 idle 由 result / agent:busy false / session-exit 驱动，
       // 不做定时兜底——长工具调用期间兜底会让取消按钮提前消失。
       if (currentSession?.mode === 'agent') {
@@ -3442,12 +3488,13 @@
       if (tokens > 0) _lastCtxTokens = tokens;
       const chip = document.getElementById('ctx-chip');
       if (!chip) return;
-      if (!tokens || tokens <= 0) { chip.style.display = 'none'; return; }
+      if (!tokens || tokens <= 0) { chip.style.display = 'none'; chip.classList.remove('hi'); return; }
       const limit = ctxLimit(tokens);
       const pct = Math.min(100, Math.round(tokens / limit * 100));
       chip.style.display = '';
       chip.textContent = `◈ ${pct}%`;
       chip.style.color = pct >= 90 ? 'var(--red)' : pct >= 75 ? 'var(--yellow)' : 'var(--muted)';
+      chip.classList.toggle('hi', pct >= 75);   // 手机精简布局只在偏高时才露出来
       // 压缩快捷按钮同步高亮（agent 栏是 doSlashCmd('/compact')，PTY 栏是 doCompact()）
       for (const sel of [
         '#sk-claude-agent button[onclick*="/compact"]',
@@ -3938,6 +3985,9 @@
         document.querySelectorAll('.sk').forEach(b => b.disabled = !canTakeControl());
       }
       updateShortcutBar();
+      // 手机顶栏：没控制权时露出一个小标（只读 / 获取控制 / X 控制中），点了等同控制徽标
+      const ro = document.getElementById('m-ro');
+      if (ro) { ro.textContent = controlling ? '' : badge.textContent; ro.classList.toggle('show', !controlling); }
     }
 
     // ── 设置面板 ──────────────────────────────────
@@ -4205,14 +4255,19 @@
       const sheet = document.getElementById('fedit-sheet');
       sheet.classList.add('open');
       document.getElementById('fedit-title').textContent = rel.split('/').pop();
-      document.getElementById('fedit-path').textContent = rel;
+      document.getElementById('fedit-path').textContent = feditAbs(rel);
       document.getElementById('fedit-loading').style.display = 'flex';
       document.getElementById('fedit-loading').textContent = '加载中...';
       document.getElementById('fedit-ta').style.display = 'none';
       document.getElementById('fedit-preview').style.display = 'none';
       feditSetState('');
       try {
-        const r = await fetch(`/api/files/${SESSION_ID}/content?path=${encodeURIComponent(rel)}`);
+        let r = await fetch(`/api/files/${SESSION_ID}/content?path=${encodeURIComponent(rel)}`);
+        // AI 常只写文件名（不带目录）：根目录没有就在任务目录里按名字找，唯一命中就打开它
+        if (r.status === 404 && !rel.includes('/')) {
+          const hit = await feditFindByName(rel);
+          if (hit) { r = await fetch(`/api/files/${SESSION_ID}/content?path=${encodeURIComponent(hit)}`); document.getElementById('fedit-path').textContent = feditAbs(hit); }
+        }
         const d = await r.json().catch(() => ({}));
         if (!r.ok || !d.ok) {
           const map = { 404: '文件不存在（可能还没生成，或路径不对）', 403: '路径越界（不在会话目录内）', 413: '文件超过 2MB，请用下载' };
@@ -4220,26 +4275,82 @@
           sheet.classList.remove('open');
           return;
         }
-        _fedit = { path: d.path, name: d.name, mtime: d.mtime, md: !!d.md, mode: 'edit', loaded: d.content, dirty: false };
+        const html = /\.html?$/i.test(d.name || d.path || '');
+        _fedit = { path: d.path, name: d.name, mtime: d.mtime, md: !!d.md, html, mode: 'edit', loaded: d.content, dirty: false };
+        document.getElementById('fedit-path').textContent = feditAbs(d.path);
         document.getElementById('fedit-ta').value = d.content;
         document.getElementById('fedit-loading').style.display = 'none';
-        document.getElementById('fedit-tab-preview').style.display = _fedit.md ? '' : 'none';
-        feditSetMode('edit');
+        document.getElementById('fedit-tab-preview').style.display = (_fedit.md || html) ? '' : 'none';
+        document.getElementById('fedit-newtab').style.display = html ? '' : 'none';
+        // 文档类（md / html）默认「看」，要改再点 ✏️ 编辑
+        feditSetMode(_fedit.md || html ? 'preview' : 'edit');
       } catch (e) {
         addStatusMessage('打开出错: ' + e.message);
         sheet.classList.remove('open');
       }
     };
 
+    // 完整路径（任务目录 + 相对路径），方便知道文件在哪、复制给别的工具
+    function feditAbs(rel) {
+      rel = String(rel || '');
+      if (/^[A-Za-z]:[\\/]/.test(rel) || rel.startsWith('/')) return rel;
+      const cwd = String(currentSession?.cwd || '');
+      if (!cwd) return rel;
+      const sep = cwd.includes('\\') ? '\\' : '/';
+      return cwd.replace(/[\\/]+$/, '') + sep + rel.split('/').join(sep);
+    }
+    window.feditCopyPath = function(btn) {
+      const t = document.getElementById('fedit-path').textContent;
+      const done = () => { const o = btn.textContent; btn.textContent = '✓ 已复制'; setTimeout(() => { btn.textContent = o; }, 1200); };
+      (navigator.clipboard?.writeText(t) || Promise.reject()).then(done, () => { const x = document.createElement('textarea'); x.value = t; document.body.appendChild(x); x.select(); try { document.execCommand('copy'); done(); } catch {} x.remove(); });
+    };
+    async function feditFindByName(name) {
+      try {
+        const d = await (await fetch(`/api/files/${SESSION_ID}/search?q=${encodeURIComponent(name)}`)).json();
+        const hits = (d.files || []).filter(f => !f.dir && f.name.split('/').pop() === name);
+        return hits.length === 1 ? hits[0].name : null;
+      } catch { return null; }
+    }
+    // HTML 预览令牌（见 server /view/:token）：同一任务复用，过期前换新
+    let _viewTok = null;
+    async function feditViewBase() {
+      if (!_viewTok || _viewTok.exp < Date.now()) {
+        const d = await (await fetch(`/api/files/${SESSION_ID}/view-token`, { method: 'POST' })).json();
+        if (!d.ok) throw new Error(d.error || '预览不可用');
+        _viewTok = { token: d.token, exp: Date.now() + 3600_000 };
+      }
+      return '/view/' + _viewTok.token + '/';
+    }
+    const feditEncPath = (p) => String(p).split('/').map(encodeURIComponent).join('/');
+    window.feditOpenTab = async function() {
+      if (!_fedit) return;
+      try { window.open((await feditViewBase()) + feditEncPath(_fedit.path), '_blank'); } catch (e) { addStatusMessage('打开失败: ' + e.message); }
+    };
+    // HTML 渲染：沙箱 iframe（不同源，页面脚本碰不到 myhi）；内容用编辑框里的（没保存的修改也能看），
+    // 注入 <base> 让图片 / CSS 等相对路径资源走只读预览链接
+    async function feditRenderHtml(pv, src) {
+      pv.innerHTML = '';
+      let base;
+      try { base = (await feditViewBase()) + feditEncPath(_fedit.path.split('/').slice(0, -1).join('/')) + (_fedit.path.includes('/') ? '/' : ''); }
+      catch (e) { pv.textContent = '预览不可用：' + e.message; return; }
+      const f = document.createElement('iframe');
+      f.setAttribute('sandbox', 'allow-scripts allow-popups allow-forms allow-modals');
+      const tag = '<base href="' + location.origin + base + '">';
+      f.srcdoc = /<head[^>]*>/i.test(src) ? src.replace(/<head[^>]*>/i, (m) => m + tag) : tag + src;
+      pv.appendChild(f);
+    }
+
     window.feditSetMode = function(mode) {
       if (!_fedit) return;
-      if (mode === 'preview' && !_fedit.md) mode = 'edit';
+      if (mode === 'preview' && !_fedit.md && !_fedit.html) mode = 'edit';
       _fedit.mode = mode;
       const ta = document.getElementById('fedit-ta');
       const pv = document.getElementById('fedit-preview');
       ta.style.display = mode === 'edit' ? 'block' : 'none';
       pv.style.display = mode === 'preview' ? 'block' : 'none';
-      if (mode === 'preview') pv.innerHTML = renderMarkdown(ta.value);
+      pv.classList.toggle('html', mode === 'preview' && !!_fedit.html);
+      document.getElementById('fedit-icon').textContent = mode === 'preview' ? '📄' : '✏️';
+      if (mode === 'preview') { if (_fedit.html) feditRenderHtml(pv, ta.value); else pv.innerHTML = renderMarkdown(ta.value); }
       document.getElementById('fedit-tab-edit').classList.toggle('on', mode === 'edit');
       document.getElementById('fedit-tab-preview').classList.toggle('on', mode === 'preview');
     };
@@ -4575,6 +4686,14 @@
       if (b.dataset.v !== 'hide') settings.thinkCollapsed = b.dataset.v === 'fold';
       saveSettings(); syncDisplaySegs();
     }));
+    const syncMobileSeg = () => document.querySelectorAll('#seg-mobile .seg').forEach(b => b.classList.toggle('active', b.dataset.v === (settings.mobileCompact === false ? 'off' : 'on')));
+    syncMobileSeg();
+    document.querySelectorAll('#seg-mobile .seg').forEach(b => b.addEventListener('click', () => {
+      const v = b.dataset.v !== 'off';
+      if ((settings.mobileCompact !== false) === v) return;
+      settings.mobileCompact = v; saveSettings(); syncMobileSeg();
+      location.reload();   // 布局类在页面头部就定了，切换后重载最干净
+    }));
     document.querySelectorAll('#seg-tools .seg').forEach(b => b.addEventListener('click', () => {
       settings.collapseTools = b.dataset.v === 'fold'; saveSettings(); syncDisplaySegs();
     }));
@@ -4603,6 +4722,104 @@
     window.goHome = goHome;
     window.goBack = function() { goHome(); };
 
+    // ── 手机精简布局：⋯ 更多菜单 / 技能按钮 / 未读标记 / 其他任务提醒 ──────────
+    const IS_M = document.documentElement.classList.contains('m');
+    // 技能按钮：手机上快捷栏不平铺技能，点「技能」直接出可运行列表（底部有「管理技能」）
+    window.skillBtnTap = function() { if (IS_M) openCmdSheet(); else openSkillSheet(); };
+
+    // ⋯ 菜单：状态行（在线/控制、项目说明、升级提示）和顶栏低频按钮都收在这；有待处理提示时 ⋯ 带红点
+    const _shown = (id) => { const e = document.getElementById(id); return e && e.style.display !== 'none' && e.textContent.trim() ? e : null; };
+    function mMoreDot() {
+      const g = _shown('guide-chip');
+      document.getElementById('m-more')?.classList.toggle('dot', !!(_shown('update-badge') || _shown('claude-update-badge') || (g && g.textContent.includes('偏长'))));
+    }
+    if (IS_M) new MutationObserver(mMoreDot).observe(document.getElementById('status-bar'), { subtree: true, childList: true, attributes: true, characterData: true });
+    window.openMobileMore = function() {
+      const items = [];
+      const add = (icon, text, fn, color) => items.push({ icon, text, fn, color });
+      add('📁', '文件', () => openFilePanel());
+      const ctx = _shown('ctx-chip'); if (ctx) add('◈', '会话数据（上下文 ' + ctx.textContent.replace(/[^\d%]/g, '') + '）', () => openCtxSheet());
+      const vc = _shown('viewer-count'), cb = _shown('control-badge');
+      if (vc || cb) add('👥', [vc?.textContent, cb?.textContent].filter(Boolean).join(' · '), () => cb && toggleControl());
+      const g = _shown('guide-chip'); if (g) add('', g.textContent, () => showMemory('project'), g.textContent.includes('偏长') ? 'var(--yellow)' : '');
+      const u = _shown('update-badge'); if (u) add('', 'myhi 有更新：' + u.textContent.replace('⬆', '').trim(), () => doUpdate(), 'var(--yellow)');
+      const cu = _shown('claude-update-badge'); if (cu) add('', 'Claude 有更新：' + cu.textContent.replace('⬆', '').trim(), () => doClaudeUpdate(), 'var(--blue)');
+      add('⚙', '设置', () => openSettings());
+      add('❓', '使用说明', () => openChatHelp());
+      const ov = document.createElement('div');
+      ov.style.cssText = 'position:fixed;inset:0;z-index:120;background:rgba(0,0,0,0.5);display:flex;align-items:flex-end';
+      const esc2 = (t) => { const d = document.createElement('div'); d.textContent = t; return d.innerHTML; };
+      ov.innerHTML = '<div style="background:var(--surface);border-radius:18px 18px 0 0;width:100%;padding:0.4rem 0 max(0.8rem,env(safe-area-inset-bottom))">' +
+        '<div style="padding:0.5rem 1.1rem 0.3rem;font-size:0.72rem;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap">' + esc2(document.getElementById('session-cwd')?.textContent || '') + '</div>' +
+        items.map((it, i) => '<div data-i="' + i + '" style="padding:0.8rem 1.1rem;border-top:1px solid var(--surface2);font-size:0.9rem;cursor:pointer;color:' + (it.color || 'var(--text)') + '">' + (it.icon ? it.icon + '&nbsp; ' : '') + esc2(it.text) + '</div>').join('') +
+        '</div>';
+      ov.onclick = (e) => { const r = e.target.closest('[data-i]'); ov.remove(); if (r) items[+r.dataset.i].fn(); };
+      document.body.appendChild(ov);
+    };
+
+    // 手机：手指往上推（往下看内容）收起顶栏，往下拉再出现；只跟手势走，AI 输出时的自动滚底不触发
+    if (IS_M) {
+      const bar = document.getElementById('top-bar');
+      let y0 = null, hidden = false;
+      const setHidden = (h) => {
+        if (h === hidden) return; hidden = h;
+        bar.style.marginTop = h ? -bar.offsetHeight + 'px' : '';
+      };
+      chatArea.addEventListener('touchstart', (e) => { y0 = e.touches[0].clientY; }, { passive: true });
+      chatArea.addEventListener('touchmove', (e) => {
+        if (y0 == null) return;
+        const dy = e.touches[0].clientY - y0;
+        if (Math.abs(dy) < 12) return;
+        setHidden(dy < 0 && chatArea.scrollTop > 40);
+        y0 = e.touches[0].clientY;
+      }, { passive: true });
+      chatArea.addEventListener('touchend', () => { y0 = null; }, { passive: true });
+      chatArea.addEventListener('scroll', () => { if (chatArea.scrollTop < 10) setHidden(false); }, { passive: true });
+    }
+
+    // 本页在看 = 本任务已读（切换面板 / 首页据此算「新完成」）
+    let _seenAt = 0;
+    function markSeenNow(force) {
+      if (document.hidden || !window.myhiAttn) return;
+      if (!force && Date.now() - _seenAt < 2000) return;
+      _seenAt = Date.now(); myhiAttn.markSeen(SESSION_ID);
+    }
+    markSeenNow(true);
+    document.addEventListener('visibilitychange', () => markSeenNow(true));
+    window.addEventListener('pagehide', () => markSeenNow(true));
+    socket.on('agent:message', () => markSeenNow());
+
+    // 其他任务的提醒：手机上每 8 秒拉一次列表（页面可见时），有任务转为「等你回复」或刚跑完就弹提示条，点了直接切过去
+    let _attnSnap = null, _toastTimer = null;
+    function mToast(s, kind) {
+      const el = document.getElementById('m-toast'); if (!el) return;
+      const esc2 = (t) => { const d = document.createElement('div'); d.textContent = t || ''; return d.innerHTML; };
+      el.style.borderLeftColor = myhiAttn.color[kind] || 'var(--green)';
+      el.innerHTML = '<div>「' + esc2(s.title || '(无标题)') + '」' + (kind === 'wait' ? '在等你回复' : '已完成') + ' <span style="color:var(--muted);font-size:0.72rem">点此切换</span></div>' +
+        (s.lastText ? '<div class="sub">' + esc2(s.lastText) + '</div>' : '');
+      el.onclick = () => { window.location.href = '/terminal/' + s.id; };
+      el.classList.add('show');
+      clearTimeout(_toastTimer); _toastTimer = setTimeout(() => el.classList.remove('show'), 8000);
+    }
+    function attnCheck(list) {
+      if (!IS_M || !window.myhiAttn || !Array.isArray(list)) return;
+      myhiAttn.init(list);
+      const me = list.find(x => x.id === SESSION_ID)?.owner;
+      const snap = {};
+      for (const s of list) {
+        const st = s.pending > 0 ? 'wait' : s.busy ? 'busy' : '';
+        snap[s.id] = st;
+        // 只提醒自己的任务（管理员的列表里有别人的任务，别人的完成不该弹给你）
+        if (!_attnSnap || s.id === SESSION_ID || !(s.id in _attnSnap) || (me && s.owner && s.owner !== me)) continue;
+        const was = _attnSnap[s.id];
+        if (st === 'wait' && was !== 'wait') mToast(s, 'wait');
+        else if (was === 'busy' && st === '') mToast(s, 'done');
+      }
+      _attnSnap = snap;
+    }
+    socket.on('sessions', attnCheck);
+    if (IS_M) setInterval(() => { if (!document.hidden && socket.connected) socket.emit('list'); }, 8000);
+
     // ── 快速切换会话（免退出到首页）──────────────────────────
     function switchRelTime(ms) {
       if (!ms) return '';
@@ -4624,6 +4841,8 @@
         sessions = await res.json();
       } catch { addStatusMessage && addStatusMessage('会话列表加载失败'); return; }
       sessions.sort((a, b) => switchSessTime(b) - switchSessTime(a)); // 最新在前
+      const A = window.myhiAttn; if (A) A.init(sessions);
+      const attnOf = (s) => (A && s.id !== SESSION_ID ? A.of(s) : (s.pending > 0 ? 'wait' : s.busy ? 'busy' : ''));
       const esc2 = (s) => { const d = document.createElement('div'); d.textContent = s == null ? '' : s; return d.innerHTML; };
       let mode = localStorage.getItem('myhi_group_mode') || 'time'; // 与首页共用记忆
 
@@ -4631,12 +4850,15 @@
         const cur = s.id === SESSION_ID;
         const proj = (s.cwd || '').replace(/\\/g, '/').split('/').filter(Boolean).slice(-1)[0] || '';
         const tags = (s.tags || []).map(x => '<span style="font-size:0.62rem;color:var(--text3);background:rgba(124,58,237,0.14);border:1px solid rgba(124,58,237,0.35);border-radius:999px;padding:0 0.4rem">' + esc2(x) + '</span>').join(' ');
-        const sub = [proj, switchRelTime(switchSessTime(s)), s.busy ? '运行中' : '', s.controlHolderName ? (s.controlHolderName + ' 控制中') : ''].filter(Boolean).join(' · ');
+        const at = attnOf(s);
+        const sub = [A && at ? A.label[at] : (s.busy ? '运行中' : ''), proj, switchRelTime(switchSessTime(s)), s.controlHolderName ? (s.controlHolderName + ' 控制中') : ''].filter(Boolean).join(' · ');
+        const dotC = at && A ? A.color[at] : (s.alive ? 'var(--green)' : 'var(--dim)');
         return '<div data-sid="' + esc2(s.id) + '" style="display:flex;align-items:center;gap:0.6rem;padding:0.7rem 1.1rem;border-top:1px solid var(--surface2);cursor:pointer;' + (cur ? 'background:rgba(124,58,237,0.12)' : '') + '">' +
-          '<span style="width:8px;height:8px;border-radius:50%;flex-shrink:0;background:' + (s.alive ? 'var(--green)' : 'var(--dim)') + '"></span>' +
+          '<span style="width:8px;height:8px;border-radius:50%;flex-shrink:0;background:' + dotC + (at === 'wait' || at === 'busy' ? ';animation:pulse 1s infinite' : '') + '"></span>' +
           '<div style="flex:1;min-width:0">' +
             '<div style="font-size:0.9rem;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap">' + esc2(s.title || '(无标题)') + ' ' + (cur ? '<span style="font-size:0.68rem;color:var(--purple)">· 当前</span>' : '') + '</div>' +
             '<div style="font-size:0.72rem;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap">' + esc2(sub) + '</div>' +
+            (s.lastText ? '<div style="font-size:0.72rem;color:var(--text2, var(--muted));opacity:0.85;overflow:hidden;text-overflow:ellipsis;white-space:nowrap">🤖 ' + esc2(s.lastText) + '</div>' : '') +
             (tags ? '<div style="display:flex;flex-wrap:wrap;gap:0.25rem;margin-top:0.25rem">' + tags + '</div>' : '') +
           '</div></div>';
       };
@@ -4659,7 +4881,12 @@
           if (untag.length) h += groupHdr('未分类', untag.length) + untag.map(rowHTML).join('');
           return h;
         }
-        return sessions.map(rowHTML).join('');
+        // 最近：需要你关注的排前面（等你回复 > 执行中 > 新完成），其余按时间
+        const buckets = { wait: [], busy: [], done: [], '': [] };
+        for (const s of sessions) buckets[attnOf(s)].push(s);
+        if (!buckets.wait.length && !buckets.busy.length && !buckets.done.length) return sessions.map(rowHTML).join('');
+        return ['wait', 'busy', 'done', ''].filter(k => buckets[k].length)
+          .map(k => groupHdr(k ? ({ wait: '🟠 等你回复', busy: '🔵 执行中', done: '🟢 新完成' })[k] : '其他', buckets[k].length) + buckets[k].map(rowHTML).join('')).join('');
       };
 
       const overlay = document.createElement('div');
@@ -6147,19 +6374,23 @@
       filterInp.value = '';
       const render = (keyword = '') => {
         const kw = keyword.toLowerCase();
-        // 命令面板只列用户/项目技能（内置技能始终在快捷栏直接显示）
+        // 命令面板只列用户/项目技能（内置技能在快捷栏直接显示）；手机精简布局快捷栏不平铺技能 → 内置也列进来
+        const mob = document.documentElement.classList.contains('m');
+        document.getElementById('cmd-sheet-title').textContent = mob ? '技能' : '自定义命令';
         const filtered = _customSkills.filter(s =>
-          s.source !== 'builtin' && (!kw || s.name.toLowerCase().includes(kw) || (s.desc || '').toLowerCase().includes(kw)));
-        listEl.innerHTML = filtered.length
+          (mob || s.source !== 'builtin') && (!kw || s.name.toLowerCase().includes(kw) || (s.desc || '').toLowerCase().includes(kw)));
+        filtered.sort((a, b) => (a.source === 'builtin') - (b.source === 'builtin'));
+        listEl.innerHTML = (filtered.length
           ? filtered.map(s => `<div class="action-sheet-item" onclick="runSkillAndClose('${escHtml(s.name)}', '${s.kind || 'command'}')">
-              <div><div style="color:var(--purple3)">${s.kind === 'skill' ? '🧠 ' : '/'}${escHtml(s.name)}</div>${s.desc ? `<div class="desc">${escHtml(s.desc)}</div>` : ''}</div>
+              <div><div style="color:${s.source === 'builtin' ? 'var(--teal)' : 'var(--purple3)'}">${s.kind === 'skill' ? '🧠 ' : '/'}${escHtml(s.name)}</div>${s.desc ? `<div class="desc">${escHtml(s.desc)}</div>` : ''}</div>
             </div>`).join('')
-          : '<div style="text-align:center;color:var(--muted);padding:1.5rem 0;font-size:0.82rem">无匹配命令</div>';
+          : '<div style="text-align:center;color:var(--muted);padding:1.5rem 0;font-size:0.82rem">无匹配命令</div>')
+          + (mob ? `<div class="action-sheet-item" onclick="closeCmdSheet();openSkillSheet()"><div><div style="color:var(--muted)">⚙ 管理技能（生成 / 编辑 / 分享 / 导入）</div></div></div>` : '');
       };
       render();
       filterInp.oninput = (e) => render(e.target.value);
       sheet.classList.add('open');
-      setTimeout(() => filterInp.focus(), 100);
+      if (!document.documentElement.classList.contains('m')) setTimeout(() => filterInp.focus(), 100);   // 手机上自动聚焦会弹键盘挡住列表
     };
     window.closeCmdSheet = function() {
       document.getElementById('cmd-sheet').classList.remove('open');