@yfwu2020/dsh-selection-explain 0.12.0 → 0.13.0

package/lib/client.js

@@ -119,6 +119,9 @@ var HISTORY = "/selection-explain/api/history";
 var MODELS = "/selection-explain/api/models";
 var ATTACH = "/selection-explain/api/attach";
 var ATTACHMENT = "/selection-explain/api/attachment";
+var SHOT_START = "/selection-explain/api/shot/start";
+var SHOT_PENDING = "/selection-explain/api/shot/pending";
+var SHOT_IMAGE = "/selection-explain/api/shot/image";
 var ATTACH_MAX_ITEMS = 10;
 var ATTACH_MAX_ITEM_BYTES = 20 * 1024 * 1024;
 var SETTINGS = "/selection-explain/api/settings";
@@ -282,6 +285,9 @@ var CSS = [
   // 可以自动换行、超过 84px 内部滚动，但**不显示滚动条**。
   // ⚠️ flex:0 0 auto 不能省：滚动区是 flex 列，而 overflow 非 visible 的 flex 项目
   //    自动最小高度是 0 → 内容一多就被压扁，文字直接看不全（实测踩过）。
+  // 顶部那行是"生成的标题"时：两行封顶，超出用省略号（而不是出现滚动条）
+  '.dsh-sel-quote[data-title="1"]{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;',
+  "overflow:hidden;white-space:normal;max-height:none}",
   ".dsh-sel-quote{margin:0;padding:7px 11px;border-radius:10px;flex:0 0 auto;border-left:3px solid var(--sel-a1,#0d9488);",
   "background:var(--dsw-alias-interactive-bg-hover,rgba(140,140,140,.11));color:var(--dsw-alias-label-secondary,inherit);",
   "font-size:12.5px;line-height:1.6;box-sizing:border-box;max-width:100%;max-height:84px;",
@@ -458,6 +464,10 @@ var CSS = [
   "display:grid;place-items:center;color:var(--dsw-alias-label-secondary,inherit)}",
   ".dsh-sel-thumb img{width:100%;height:100%;object-fit:cover;display:block}",
   ".dsh-sel-thumb svg{width:15px;height:15px;opacity:.55}",
+  // 可预览的缩略图：放大镜光标 + 键盘焦点环（它是 role=button，能 Tab 到）
+  '.dsh-sel-thumb[data-preview="1"]{cursor:zoom-in}',
+  '.dsh-sel-thumb[data-preview="1"]:focus-visible{outline:2px solid var(--sel-a1,#0d9488);outline-offset:1px}',
+  '.dsh-sel-thumb[data-preview="1"]:hover img{filter:brightness(1.06)}',
   '.dsh-sel-thumb[data-state="error"]{border-color:color-mix(in srgb,var(--sel-bad,#e5534b) 70%,transparent)}',
   '.dsh-sel-thumb[data-state="error"] svg{opacity:.9;color:var(--sel-bad,#e5534b)}',
   // 转圈 + 不定态进度条：fetch 拿不到上传进度，所以**不假装知道百分比**
@@ -535,6 +545,50 @@ var CSS = [
   "border-radius:5px;line-height:15px;background:var(--sel-fill,#0f766e);color:var(--sel-fill-fg,#fff)}",
   ".dsh-sel-bqfilename{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:190px}",
   ".dsh-sel-bqfilemeta{flex:0 0 auto;font-size:10.5px;opacity:.6}",
+  // ── 图片预览（灯箱）──
+  // 挂在 layer 上、铺满整扇窗口：小窗只有 540 宽，把截图塞回小窗里预览等于没放大。
+  // 层级压过面板与语音卡；pointer-events 必须显式打开 —— layer 自己是穿透的，
+  // 不写这一行的话灯箱看得见却点不着。
+  ".dsh-sel-lightbox{position:fixed;inset:0;z-index:" + String(Z_PANEL + 2) + ";display:none;flex-direction:column;",
+  "align-items:center;justify-content:center;padding:48px 32px 34px;box-sizing:border-box;",
+  "background:rgba(9,11,13,.8);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);",
+  "pointer-events:auto;-webkit-app-region:no-drag;color:#fff;font:400 12.5px/1.5 " + FONT + "}",
+  '.dsh-sel-lightbox[data-open="1"]{display:flex;animation:dsh-sel-lightfade .12s ease}',
+  "@keyframes dsh-sel-lightfade{from{opacity:0}to{opacity:1}}",
+  // 顶栏：文件名（左，过长省略）+ 关闭键（右）。用 absolute 让它压在图片上方，
+  // 不用再给图片让出一条高度 —— 纵向空间本来就紧张。
+  ".dsh-sel-lightbox-bar{position:absolute;top:0;left:0;right:0;height:44px;display:flex;align-items:center;gap:12px;",
+  "padding:0 14px 0 20px;box-sizing:border-box;background:linear-gradient(rgba(0,0,0,.5),transparent)}",
+  ".dsh-sel-lightbox-name{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;",
+  "font-size:12.5px;opacity:.9}",
+  // 计数（3 / 7）：只在多图时出现，等宽数字 —— 翻页时数字不跟着左右抖。
+  ".dsh-sel-lightbox-count{flex:0 0 auto;font-size:11.5px;opacity:.62;font-variant-numeric:tabular-nums;letter-spacing:.3px}",
+  '.dsh-sel-lightbox[data-gallery="0"] .dsh-sel-lightbox-count{display:none}',
+  ".dsh-sel-lightbox-x{flex:0 0 auto;width:28px;height:28px;padding:0;border:0;border-radius:14px;cursor:pointer;",
+  "display:grid;place-items:center;background:rgba(255,255,255,.12);color:#fff;font:inherit;opacity:.9}",
+  ".dsh-sel-lightbox-x:hover{background:rgba(255,255,255,.22);opacity:1}",
+  ".dsh-sel-lightbox-x svg{width:14px;height:14px;display:block}",
+  ".dsh-sel-lightbox-x:focus-visible{outline:2px solid #fff;outline-offset:2px}",
+  // 左右翻页：贴两侧垂直居中，和 ✕ 同一套半透明白底。
+  // 「到头」用 disabled 表示（22% 不透明）—— 小窗/窗口里没有滑动手势，全靠这两个键 + 方向键。
+  ".dsh-sel-lightbox-nav{position:absolute;top:50%;margin-top:-20px;width:40px;height:40px;padding:0;border:0;border-radius:20px;",
+  "display:grid;place-items:center;cursor:pointer;background:rgba(255,255,255,.12);color:#fff;opacity:.9;",
+  "box-shadow:0 4px 16px rgba(0,0,0,.3);transition:background .12s ease,opacity .12s ease}",
+  ".dsh-sel-lightbox-nav:hover:not(:disabled){background:rgba(255,255,255,.24);opacity:1}",
+  ".dsh-sel-lightbox-nav:focus-visible{outline:2px solid #fff;outline-offset:2px}",
+  ".dsh-sel-lightbox-nav:disabled{opacity:.22;cursor:default}",
+  '.dsh-sel-lightbox-nav[data-dir="prev"]{left:12px}',
+  '.dsh-sel-lightbox-nav[data-dir="next"]{right:12px}',
+  '.dsh-sel-lightbox[data-gallery="0"] .dsh-sel-lightbox-nav{display:none}',
+  // 舞台：占满可用高度，图 contain 到最大；点击图片本身不算"点空白"，不会误关。
+  ".dsh-sel-lightbox-stage{flex:1 1 auto;width:100%;min-height:0;display:flex;align-items:center;justify-content:center}",
+  ".dsh-sel-lightbox-img{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;",
+  "border-radius:10px;background:rgba(255,255,255,.04);box-shadow:0 24px 64px rgba(0,0,0,.55);cursor:default}",
+  '.dsh-sel-lightbox[data-error="1"] .dsh-sel-lightbox-img{display:none}',
+  ".dsh-sel-lightbox-fail{display:none;margin:0;font-size:12.5px;opacity:.72}",
+  '.dsh-sel-lightbox[data-error="1"] .dsh-sel-lightbox-fail{display:block}',
+  ".dsh-sel-lightbox-hint{margin:0;font-size:11px;opacity:.5}",
+  '@media (prefers-reduced-motion:reduce){.dsh-sel-lightbox[data-open="1"]{animation:none}}',
   // 「引用整条」：贴在助手气泡末尾，**平时不出现**（正文优先），鼠标移到这条消息上才浮出来。
   // 键盘 Tab 也能到（:focus-visible 同样点亮），触屏上另有浮标那条路。
   ".dsh-sel-bubquote{margin-top:7px;display:inline-flex;align-items:center;gap:4px;padding:2px 9px;",
@@ -692,6 +746,7 @@ var CSS = [
   "background:var(--sel-warn-bg,rgba(255,166,87,.14));color:var(--sel-warn-fg,#b45309);font-size:11.5px;line-height:1.4}",
   ".dsh-sel-undo button{margin-left:auto;border:0;background:transparent;color:inherit;font:inherit;font-weight:600;cursor:pointer;text-decoration:underline}",
   ".dsh-sel-historytext{font-size:13px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}",
+  ".dsh-sel-historysub{font-size:10.5px;line-height:1.4;opacity:.62;margin-top:1px;}",
   ".dsh-sel-historymeta{display:flex;align-items:center;gap:6px;font-size:11px;opacity:.5;font-variant-numeric:tabular-nums;min-width:0}",
   ".dsh-sel-historymeta>span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}",
   ".dsh-sel-historymeta .dsh-sel-historypin{opacity:.9}",
@@ -956,6 +1011,32 @@ var CSS = [
   ".dsh-sel-uline{position:fixed;height:2px;border-radius:1px;pointer-events:none}",
   // 牵引线是 **SVG 贝塞尔**（原来是一根 2px 竖条 → 控制点和端点同 x，退化成直线，
   // 用户一眼看出"这不是贝塞尔"）。现在两端各给一个反向的横向控制量，做出可见的 S 形。
+  // ── 截图提问：选框（选区落在窗口内时）/ 贴边缩略图（落在窗口外时）──
+  ".dsh-sel-shotframe{position:fixed;z-index:2147482997;display:none;pointer-events:none;",
+  "border:2px solid var(--sel-a1,#0d9488);border-radius:3px;",
+  "box-shadow:0 0 0 1px rgba(255,255,255,.85),0 0 0 4px color-mix(in srgb,var(--sel-a1,#0d9488) 14%,transparent)}",
+  '.dsh-sel-shotframe[data-show="1"]{display:block}',
+  ".dsh-sel-shotframe-tag{position:absolute;left:-2px;bottom:-19px;padding:1px 6px;border-radius:5px;",
+  "background:var(--sel-fill,#0f766e);color:var(--sel-fill-fg,#fff);font-size:10px;line-height:1.6;white-space:nowrap}",
+  ".dsh-sel-shotchip{position:fixed;z-index:2147482997;display:none;align-items:center;gap:7px;box-sizing:border-box;",
+  "padding:5px 9px 5px 5px;border-radius:11px;background:var(--dsw-alias-bg-base,#fff);",
+  "border:.5px solid var(--dsw-alias-border-l3,rgba(140,140,140,.35));box-shadow:0 8px 22px rgba(0,0,0,.24)}",
+  '.dsh-sel-shotchip[data-show="1"]{display:flex}',
+  ".dsh-sel-shotchip img{display:block;width:56px;height:32px;object-fit:cover;border-radius:6px;",
+  "border:1.5px solid #e5484d;flex:0 0 auto;background:var(--dsw-alias-interactive-bg-hover,rgba(140,140,140,.14))}",
+  ".dsh-sel-shotchip-tx{display:flex;flex-direction:column;font-size:10.5px;line-height:1.35;white-space:nowrap;",
+  "color:var(--dsw-alias-label-secondary,rgba(90,90,90,.9))}",
+  ".dsh-sel-shotchip-tx b{font-size:10.5px;font-weight:600;color:var(--dsw-alias-label-primary,inherit)}",
+  // ── 截图失败的可见提示（Toast）──
+  // 以前所有失败都只写进 /shot/status 诊断，用户按了快捷键没反应。这条浮层是唯一的用户可见面：
+  // 位置放在底部中间（不挡卡片/面板），点击可立刻关掉，4.5 秒后自动消失。
+  ".dsh-sel-shot-toast{position:fixed;left:50%;bottom:76px;transform:translate(-50%,6px);z-index:2147483005;",
+  "box-sizing:border-box;max-width:min(82vw,460px);padding:9px 14px;border-radius:10px;",
+  "background:rgba(28,32,36,.95);color:#fff;font-size:12px;line-height:1.55;text-align:left;",
+  "box-shadow:0 10px 28px rgba(0,0,0,.28);opacity:0;pointer-events:none;",
+  "transition:opacity .16s ease,transform .16s ease}",
+  '.dsh-sel-shot-toast[data-show="1"]{opacity:1;pointer-events:auto;transform:translate(-50%,0)}',
+  '.dsh-sel-shot-toast[data-tone="error"]{background:rgba(153,27,27,.96)}',
   ".dsh-sel-thread{position:fixed;left:0;top:0;width:100%;height:100%;pointer-events:none;",
   "z-index:2147482998;overflow:visible;display:none;opacity:0;transition:opacity .14s ease}",
   ".dsh-sel-thread path{fill:none;stroke-width:1.6;stroke-dasharray:4 4;",
@@ -2106,7 +2187,17 @@ function createSettingsController(env) {
   var settingsRailButtons = [];
   var settingsPanes = [];
   var settingsSegs = [];
-  var SLOT_LABEL = { off: "\u5173", low: "\u4F4E", high: "\u9AD8", max: "\u6700\u9AD8" };
+  var SLOT_LABEL = {
+    off: "\u5173",
+    low: "\u4F4E",
+    high: "\u9AD8",
+    max: "\u6700\u9AD8",
+    // 截图取景范围（与推理档位共用 seg 标签表；值互不重叠）
+    screen: "\u5168\u5C4F",
+    window: "\u6574\u7A97",
+    margin: "\u9009\u533A+\u7559\u767D",
+    selection: "\u4EC5\u9009\u533A"
+  };
   var SLOT_ORDER = ["off", "low", "high", "max"];
   var settingsEffortHints = [];
   var settingsMenus = [];
@@ -3159,7 +3250,8 @@ function createVoiceCardController(env) {
   var vcardHandoff = null;
   var panelGrowTimer = null;
   var panelGrowHandler = null;
-  var quoteVoiceHandled = false;
+  var quoteVoiceHandled;
+  var voiceSeenSinceOpen = false;
   var selMark = null;
   var selThread = null;
   var selThreadPath = null;
@@ -3368,11 +3460,13 @@ function createVoiceCardController(env) {
   function openVCard() {
     if (vcardState.open || env.panelOpen) return;
     if (!env.state.selection) return;
-    if (!env.state.selection.range && env.state.selection.source !== "iframe") return;
-    if (!hasFocusEvidence(env.state.selection)) return;
-    if (env.isTypingTarget(document.activeElement)) return;
+    if (!env.state.selection.range && env.state.selection.source !== "iframe" && env.state.selection.source !== "shot") return;
+    if (env.state.selection.source !== "shot" && !hasFocusEvidence(env.state.selection)) return;
+    if (env.state.selection.source !== "shot" && env.isTypingTarget(document.activeElement)) return;
+    if (env.ensureLayer) env.ensureLayer();
     ensureVCard();
     if (vcardState.closing || vcardState.crtTimer) finishCrtOff();
+    voiceSeenSinceOpen = false;
     vcardState.range = env.state.selection.range || null;
     vcardState.anchorRect = env.state.selection.rect || null;
     var geo = vcardGeometry();
@@ -3417,7 +3511,7 @@ function createVoiceCardController(env) {
     vcard.setAttribute("data-voiced", on ? "1" : "0");
     if (!vcardBox) return;
     if (String(vcardBox.value || "").trim()) return;
-    vcardBox.placeholder = on ? "\u6B63\u5728\u542C\u2026" : env.settingsLive.voiceCancelOnSilence !== false ? "\u6B63\u5728\u5173\u95ED\u2026" : "\u76F4\u63A5\u6253\u5B57\u4E5F\u884C\u2026";
+    vcardBox.placeholder = on ? "\u6B63\u5728\u542C\u2026" : isShotSelection() ? "\u5C31\u8FD9\u5F20\u622A\u56FE\u63D0\u95EE\u2026" : env.settingsLive.voiceCancelOnSilence !== false ? "\u6B63\u5728\u5173\u95ED\u2026" : "\u76F4\u63A5\u6253\u5B57\u4E5F\u884C\u2026";
   }
   function focusVCard() {
     if (!vcardBox) return;
@@ -3650,14 +3744,22 @@ function createVoiceCardController(env) {
     vcardState.settleStableAt = 0;
     vcardState.settleDeadline = 0;
   }
+  function isShotSelection() {
+    var sel = env.state && env.state.selection;
+    return !!(sel && sel.source === "shot");
+  }
   function finishVoiceSettle(text) {
     if (!vcardState.open) return;
     var spoken = String(text || "").trim();
-    if (spoken && env.settingsLive.voiceAutoSend !== false) {
+    if (spoken && voiceSeenSinceOpen && env.settingsLive.voiceAutoSend !== false) {
       sendVCard();
       return;
     }
     if (!spoken && env.settingsLive.voiceCancelOnSilence !== false) {
+      if (isShotSelection()) {
+        markVCardListening(false);
+        return;
+      }
       closeVCard(true);
       return;
     }
@@ -3687,6 +3789,7 @@ function createVoiceCardController(env) {
   }
   function closeVCard(animate) {
     if (!vcardState.open) return;
+    if (isShotSelection() && env.clearShotMarkers) env.clearShotMarkers();
     vcardState.open = false;
     if (vcardBox && !String(vcardBox.value || "").trim()) vcardBox.placeholder = "\u6B63\u5728\u5173\u95ED\u2026";
     vcardState.range = null;
@@ -3714,6 +3817,36 @@ function createVoiceCardController(env) {
       closeVCard();
       return;
     }
+    if (selection.source === "shot") {
+      var shotRect = selection.rect;
+      var openShotPanel = function(ref) {
+        if (!env.state.selection || env.state.selection !== selection) return;
+        var why = env.shotFailed ? env.shotFailed() : "";
+        if (!ref && why) {
+          if (env.shotNotice) {
+            env.shotNotice(
+              why === "upload-failed" ? "\u622A\u56FE\u4E0A\u4F20\u5931\u8D25\uFF0C\u53EF\u4EE5\u518D\u6309\u4E00\u6B21\u53D1\u9001\u91CD\u8BD5" : "\u622A\u56FE\u6CA1\u6709\u751F\u6210\u6210\u529F\uFF0C\u8FD9\u6761\u5148\u4E0D\u53D1\u9001\uFF1B\u8BF7\u6309 Esc \u540E\u91CD\u65B0\u622A\u56FE"
+            );
+          }
+          return;
+        }
+        vcardHandoff = vcardRect();
+        closeVCard();
+        env.openPanelWith("", "", "\u622A\u56FE", shotRect, "", {
+          askFirst: asked,
+          shotRef: ref,
+          // 取景范围要跟着图一起进小窗：提示词要按"图里有没有红框 / 图是不是只有选区"换口径
+          shotScope: selection.shotScope || "",
+          shotFrame: selection.shotFrame !== false
+        });
+        if (env.clearShotMarkers) env.clearShotMarkers();
+        env.state.selection = null;
+        env.state.bridgeActive = false;
+      };
+      if (env.shotRefAsync) env.shotRefAsync().then(openShotPanel);
+      else openShotPanel(selection.ref || null);
+      return;
+    }
     var contextInfo = selection.source === "iframe" || !selection.range ? {
       context: String(selection.context || ""),
       keyContext: String(selection.keyContext || ""),
@@ -3794,6 +3927,7 @@ function createVoiceCardController(env) {
           return;
         }
         if (vcardState.suppress) return;
+        voiceSeenSinceOpen = true;
         stopVoiceSettle();
         if (!vcardState.open) openVCard();
         else markVCardListening(true);
@@ -3815,7 +3949,7 @@ function createVoiceCardController(env) {
     var selection = env.state.quoteSelection;
     if (!env.panelOpen || !selection) return;
     if (!hasFocusEvidence(selection)) return;
-    if (env.isTypingTarget(document.activeElement)) return;
+    if (env.state.selection.source !== "shot" && env.isTypingTarget(document.activeElement)) return;
     if (env.voice && env.voice.phase !== "idle") return;
     env.addQuote(selection.text, selection.label, env.quoteContextFor(selection));
     hideQuoteButton();
@@ -4168,6 +4302,20 @@ function createAttachController(env) {
     env.attachNote.textContent = env.state.attachNote || "";
     env.attachNote.setAttribute("data-show", env.state.attachNote ? "1" : "0");
   }
+  function ensureUploaded() {
+    var pending = items().filter(function(item) {
+      return !item.ref && item.file;
+    });
+    if (pending.length === 0) return Promise.resolve();
+    var chain = Promise.resolve();
+    pending.forEach(function(item) {
+      chain = chain.then(function() {
+        item.started = false;
+        return upload(item);
+      });
+    });
+    return chain;
+  }
   function busy() {
     var list = items();
     for (var i = 0; i < list.length; i += 1) if (list[i].status === "uploading") return true;
@@ -4244,15 +4392,6 @@ function createAttachController(env) {
     note(rejected.join("\uFF1B"));
     render();
     env.refreshAskState();
-    var pending = list.filter(function(item) {
-      return item.status === "uploading" && !item.started;
-    });
-    var chain = Promise.resolve();
-    pending.forEach(function(item) {
-      chain = chain.then(function() {
-        return upload(item);
-      });
-    });
   }
   function createItem(file) {
     var isImage = /^image\//.test(String(file.type || ""));
@@ -4265,8 +4404,10 @@ function createAttachController(env) {
       file,
       // 缩略图先用本地 object URL 显示（不必等上传完），失败时回落到图标
       url: isImage && typeof URL !== "undefined" && URL.createObjectURL ? URL.createObjectURL(file) : "",
-      status: "uploading",
-      started: false,
+      // 'local' = 只在内存里，还没落盘。用户要求：叉掉的不该在附件库留垃圾，
+      // 所以**点发送时才真正上传**（见 ensureUploaded）。
+      status: "local",
+      started: true,
       ref: null,
       error: ""
     };
@@ -4278,6 +4419,7 @@ function createAttachController(env) {
     item.status = "uploading";
     item.error = "";
     render();
+    env.refreshAskState();
     return fileToBase64(item.file).then(function(data) {
       return fetch(ATTACH, {
         method: "POST",
@@ -4347,10 +4489,44 @@ function createAttachController(env) {
     });
     return button;
   }
+  function previewItem(item) {
+    if (!item || item.status === "error") return;
+    var list = items();
+    var images = [];
+    var start = 0;
+    for (var i = 0; i < list.length; i += 1) {
+      var other = list[i];
+      if (!other || other.kind !== "image" || other.status === "error") continue;
+      var src = other.url || (other.ref ? attachmentUrl("image", other.ref) : "");
+      if (!src) continue;
+      if (other === item) start = images.length;
+      images.push({ src, name: other.name });
+    }
+    if (images.length === 0 || typeof env.previewImage !== "function") return;
+    env.previewImage({ images, index: start });
+  }
   function thumbNode(item) {
     var node = el("span", "dsh-sel-thumb");
     node.setAttribute("data-state", item.status);
-    node.title = item.name;
+    var previewable = item.status !== "error" && !!(item.url || item.ref);
+    if (previewable) {
+      node.setAttribute("data-preview", "1");
+      node.setAttribute("role", "button");
+      node.tabIndex = 0;
+      node.title = item.name + "\uFF08\u70B9\u51FB\u9884\u89C8\uFF09";
+      node.setAttribute("aria-label", "\u9884\u89C8\u56FE\u7247 " + item.name);
+      listen(node, "click", function() {
+        previewItem(item);
+      });
+      listen(node, "keydown", function(event) {
+        if (event.target !== node) return;
+        if (event.key !== "Enter" && event.key !== " ") return;
+        event.preventDefault();
+        previewItem(item);
+      });
+    } else {
+      node.title = item.name;
+    }
     if (item.url) {
       var img = document.createElement("img");
       img.src = item.url;
@@ -4481,6 +4657,7 @@ function createAttachController(env) {
     retry,
     render,
     busy,
+    ensureUploaded,
     payload,
     describe,
     note,
@@ -4490,6 +4667,891 @@ function createAttachController(env) {
   };
 }
 
+// src/client/lightbox.js
+var SVG_NS = "http://www.w3.org/2000/svg";
+function createLightboxController(env) {
+  var root = null;
+  var stage = null;
+  var img = null;
+  var nameEl = null;
+  var failEl = null;
+  var closeBtn = null;
+  var prevBtn = null;
+  var nextBtn = null;
+  var countEl = null;
+  var hintEl = null;
+  var built = false;
+  var open = false;
+  var gallery = [];
+  var index = 0;
+  var lastFocus = null;
+  function within(node, element) {
+    if (!node || !element) return false;
+    if (node === element) return true;
+    if (typeof element.contains !== "function") return false;
+    try {
+      return element.contains(
+        /** @type {Node} */
+        node
+      );
+    } catch (error) {
+      return false;
+    }
+  }
+  function chevron(dir) {
+    var svg = document.createElementNS(SVG_NS, "svg");
+    svg.setAttribute("viewBox", "0 0 16 16");
+    svg.setAttribute("width", "16");
+    svg.setAttribute("height", "16");
+    svg.setAttribute("fill", "none");
+    svg.setAttribute("stroke", "currentColor");
+    svg.setAttribute("stroke-width", "1.9");
+    svg.setAttribute("stroke-linecap", "round");
+    svg.setAttribute("stroke-linejoin", "round");
+    svg.setAttribute("aria-hidden", "true");
+    var path = document.createElementNS(SVG_NS, "path");
+    path.setAttribute("d", dir === "prev" ? "M10 3.5L5.5 8l4.5 4.5" : "M6 3.5L10.5 8 6 12.5");
+    svg.appendChild(path);
+    return svg;
+  }
+  function navButton(dir) {
+    var button = el("button", "dsh-sel-lightbox-nav");
+    button.type = "button";
+    button.setAttribute("data-dir", dir);
+    var label = dir === "prev" ? "\u4E0A\u4E00\u5F20\u56FE\u7247\uFF08\u2190\uFF09" : "\u4E0B\u4E00\u5F20\u56FE\u7247\uFF08\u2192\uFF09";
+    button.title = label;
+    button.setAttribute("aria-label", label);
+    button.appendChild(chevron(dir));
+    listen(button, "click", function() {
+      step(dir === "prev" ? -1 : 1);
+    });
+    return button;
+  }
+  function build() {
+    if (built) return;
+    built = true;
+    root = el("div", "dsh-sel-lightbox");
+    root.setAttribute("data-open", "0");
+    root.setAttribute("data-error", "0");
+    root.setAttribute("data-gallery", "0");
+    root.setAttribute("role", "dialog");
+    root.setAttribute("aria-label", "\u56FE\u7247\u9884\u89C8");
+    var bar = el("div", "dsh-sel-lightbox-bar");
+    nameEl = el("span", "dsh-sel-lightbox-name");
+    countEl = el("span", "dsh-sel-lightbox-count");
+    closeBtn = el("button", "dsh-sel-lightbox-x");
+    closeBtn.type = "button";
+    closeBtn.title = "\u5173\u95ED\u9884\u89C8\uFF08Esc\uFF09";
+    closeBtn.setAttribute("aria-label", "\u5173\u95ED\u56FE\u7247\u9884\u89C8");
+    closeBtn.appendChild(closeIcon());
+    listen(closeBtn, "click", function() {
+      close();
+    });
+    bar.appendChild(nameEl);
+    bar.appendChild(countEl);
+    bar.appendChild(closeBtn);
+    stage = el("div", "dsh-sel-lightbox-stage");
+    img = document.createElement("img");
+    img.className = "dsh-sel-lightbox-img";
+    img.alt = "";
+    img.decoding = "async";
+    img.draggable = false;
+    img.addEventListener("error", function() {
+      if (!open) return;
+      root.setAttribute("data-error", "1");
+      failEl.textContent = "\u8FD9\u5F20\u56FE\u6253\u4E0D\u5F00\u4E86\uFF08\u9644\u4EF6\u53EF\u80FD\u5DF2\u88AB\u6E05\u7406\uFF09";
+    });
+    stage.appendChild(img);
+    failEl = el("p", "dsh-sel-lightbox-fail");
+    prevBtn = navButton("prev");
+    nextBtn = navButton("next");
+    hintEl = el("p", "dsh-sel-lightbox-hint");
+    root.appendChild(bar);
+    root.appendChild(stage);
+    root.appendChild(failEl);
+    root.appendChild(prevBtn);
+    root.appendChild(nextBtn);
+    root.appendChild(hintEl);
+    listen(root, "click", function(event) {
+      if (!open) return;
+      var target = event.target;
+      if (target === img) return;
+      if (within(target, bar) || within(target, prevBtn) || within(target, nextBtn)) return;
+      close();
+    });
+    listen(root, "keydown", function(event) {
+      if (!open || event.key !== "Tab") return;
+      var order = [prevBtn, nextBtn, closeBtn].filter(function(button) {
+        return !button.disabled;
+      });
+      var current = order.indexOf(document.activeElement);
+      var next = event.shiftKey ? current - 1 : current + 1;
+      if (next < 0) next = order.length - 1;
+      if (next >= order.length) next = 0;
+      event.preventDefault();
+      if (order[next] && typeof order[next].focus === "function") order[next].focus();
+    });
+    env.layer.appendChild(root);
+  }
+  function paintImage() {
+    var item = gallery[index] || { src: "", name: "\u56FE\u7247" };
+    var many = gallery.length > 1;
+    root.setAttribute("data-error", "0");
+    root.setAttribute("data-gallery", many ? "1" : "0");
+    failEl.textContent = "";
+    nameEl.textContent = item.name || "\u56FE\u7247";
+    img.alt = nameEl.textContent;
+    img.src = item.src;
+    countEl.textContent = many ? index + 1 + " / " + gallery.length : "";
+    prevBtn.disabled = !many || index === 0;
+    nextBtn.disabled = !many || index === gallery.length - 1;
+    hintEl.textContent = many ? "\u2190 / \u2192 \u5207\u6362 \xB7 Esc \u6216\u70B9\u51FB\u7A7A\u767D\u5904\u5173\u95ED" : "Esc \u6216\u70B9\u51FB\u7A7A\u767D\u5904\u5173\u95ED";
+    root.setAttribute("aria-label", "\u56FE\u7247\u9884\u89C8" + (many ? "\uFF08" + (index + 1) + " / " + gallery.length + "\uFF09" : ""));
+  }
+  function step(delta) {
+    if (!open || gallery.length < 2) return;
+    var next = index + delta;
+    if (next < 0 || next >= gallery.length) return;
+    index = next;
+    paintImage();
+  }
+  function normalize(items, fallback) {
+    var list = [];
+    if (items && items.length) {
+      for (var i = 0; i < items.length; i += 1) {
+        var item = items[i] || {};
+        if (!item.src) continue;
+        list.push({ src: String(item.src), name: item.name ? String(item.name) : "\u56FE\u7247" });
+      }
+    }
+    if (list.length === 0 && fallback && fallback.src) {
+      list.push({ src: String(fallback.src), name: fallback.name ? String(fallback.name) : "\u56FE\u7247" });
+    }
+    return list;
+  }
+  function openImage(options) {
+    build();
+    var given = options && Array.isArray(options.images) ? options.images : null;
+    var list = normalize(given, options);
+    if (list.length === 0) return;
+    var start = options && typeof options.index === "number" ? Math.floor(options.index) : 0;
+    if (!(start >= 0 && start < list.length)) start = 0;
+    gallery = list;
+    index = start;
+    lastFocus = document.activeElement;
+    open = true;
+    root.setAttribute("data-open", "1");
+    root.setAttribute("aria-modal", "true");
+    paintImage();
+    if (typeof closeBtn.focus === "function") closeBtn.focus();
+  }
+  function close() {
+    if (!open || !built) return;
+    open = false;
+    gallery = [];
+    index = 0;
+    root.setAttribute("data-open", "0");
+    root.setAttribute("data-error", "0");
+    root.setAttribute("data-gallery", "0");
+    root.removeAttribute("aria-modal");
+    img.removeAttribute("src");
+    img.alt = "";
+    countEl.textContent = "";
+    prevBtn.disabled = true;
+    nextBtn.disabled = true;
+    var back = lastFocus;
+    lastFocus = null;
+    if (back && back.isConnected !== false && typeof back.focus === "function") {
+      try {
+        back.focus();
+      } catch (error) {
+      }
+    }
+  }
+  function foreignModalOpen() {
+    var modals = document.querySelectorAll('[role="dialog"][aria-modal="true"]');
+    for (var i = 0; i < modals.length; i += 1) if (modals[i] !== root) return true;
+    return false;
+  }
+  var offKey = listen(document, "keydown", function(event) {
+    if (!open) return;
+    if (event.defaultPrevented || event.isComposing || event.keyCode === 229) return;
+    if (event.key === "ArrowLeft" || event.key === "ArrowRight") {
+      if (gallery.length < 2 || foreignModalOpen()) return;
+      event.preventDefault();
+      event.stopPropagation();
+      step(event.key === "ArrowLeft" ? -1 : 1);
+      return;
+    }
+    if (event.key !== "Escape") return;
+    if (foreignModalOpen()) return;
+    event.preventDefault();
+    event.stopPropagation();
+    close();
+  }, true);
+  return {
+    open: openImage,
+    close,
+    get isOpen() {
+      return open;
+    },
+    /** 卸载时摘掉 document 上的监听（灯箱 DOM 随 layer 一起销毁）。 */
+    dispose: function() {
+      close();
+      offKey();
+    }
+  };
+}
+
+// src/client/shot.js
+var MAX_ANNOTATED = 2048;
+var FRAME_COLOR = "#e5484d";
+var FRAME_WIDTH_MIN_PX = 3;
+var SHOT_INSIDE_SLOP = 2;
+function pageRectOf(rect, origin) {
+  if (!rect) return null;
+  var sx = origin && typeof origin.screenX === "number" ? origin.screenX : 0;
+  var sy = origin && typeof origin.screenY === "number" ? origin.screenY : 0;
+  return asRect({
+    left: rect.x - sx,
+    top: rect.y - sy,
+    width: rect.width,
+    height: rect.height
+  });
+}
+function asRect(box) {
+  var left = typeof box.left === "number" ? box.left : 0;
+  var top = typeof box.top === "number" ? box.top : 0;
+  var width = typeof box.width === "number" ? box.width : 0;
+  var height = typeof box.height === "number" ? box.height : 0;
+  return { left, top, width, height, right: left + width, bottom: top + height, x: left, y: top };
+}
+function insideViewport(rect, viewport, slop) {
+  if (!rect || !viewport) return false;
+  var pad = typeof slop === "number" ? slop : SHOT_INSIDE_SLOP;
+  return rect.left >= -pad && rect.top >= -pad && rect.left + rect.width <= viewport.width + pad && rect.top + rect.height <= viewport.height + pad;
+}
+function nearestEdge(rect, viewport) {
+  var cx = rect.left + rect.width / 2;
+  var cy = rect.top + rect.height / 2;
+  var d = { left: Math.abs(cx), right: Math.abs(viewport.width - cx), top: Math.abs(cy), bottom: Math.abs(viewport.height - cy) };
+  var best = "left";
+  var bestValue = Infinity;
+  for (var key in d) {
+    if (!Object.prototype.hasOwnProperty.call(d, key)) continue;
+    if (d[key] < bestValue) {
+      bestValue = d[key];
+      best = key;
+    }
+  }
+  return best;
+}
+function chipRectFor(edge, anchorRect, viewport, size) {
+  var w = size && size.width || 158;
+  var h = size && size.height || 48;
+  var pad = 12;
+  var cx = anchorRect.left + anchorRect.width / 2;
+  var cy = anchorRect.top + anchorRect.height / 2;
+  var left;
+  var top;
+  if (edge === "left" || edge === "right") {
+    left = edge === "left" ? pad : viewport.width - w - pad;
+    top = Math.max(pad, Math.min(cy - h / 2, viewport.height - h - pad));
+  } else {
+    top = edge === "top" ? pad : viewport.height - h - pad;
+    left = Math.max(pad, Math.min(cx - w / 2, viewport.width - w - pad));
+  }
+  return { left, top, width: w, height: h };
+}
+function findContentBox(g, width, height) {
+  var probe = Math.min(400, width, height);
+  function hasOpaque(data, count, stride, offset) {
+    for (var i = 0; i < count; i += 1) {
+      if (data[i * stride + offset + 3] > 128) return true;
+    }
+    return false;
+  }
+  var box = { left: 0, top: 0, right: width, bottom: height };
+  var strip = g.getImageData(0, 0, width, probe);
+  for (var y = 0; y < probe; y += 1) {
+    if (hasOpaque(strip.data.subarray(y * width * 4), width, 4, 0)) {
+      box.top = y;
+      break;
+    }
+  }
+  strip = g.getImageData(0, Math.max(0, height - probe), width, probe);
+  for (var y2 = probe - 1; y2 >= 0; y2 -= 1) {
+    if (hasOpaque(strip.data.subarray(y2 * width * 4), width, 4, 0)) {
+      box.bottom = Math.max(0, height - probe) + y2 + 1;
+      break;
+    }
+  }
+  strip = g.getImageData(0, 0, probe, height);
+  for (var x = 0; x < probe; x += 1) {
+    if (hasOpaque(strip.data.subarray(x * 4), height, probe * 4, 0)) {
+      box.left = x;
+      break;
+    }
+  }
+  strip = g.getImageData(Math.max(0, width - probe), 0, probe, height);
+  for (var x2 = probe - 1; x2 >= 0; x2 -= 1) {
+    if (hasOpaque(strip.data.subarray(x2 * 4), height, probe * 4, 0)) {
+      box.right = Math.max(0, width - probe) + x2 + 1;
+      break;
+    }
+  }
+  if (box.right - box.left < 16 || box.bottom - box.top < 16) return null;
+  return box;
+}
+function annotate(image, rect, scale, shot) {
+  var iw = image.naturalWidth || image.width;
+  var ih = image.naturalHeight || image.height;
+  var k = iw > MAX_ANNOTATED ? MAX_ANNOTATED / iw : 1;
+  var canvas = document.createElement("canvas");
+  canvas.width = Math.max(1, Math.round(iw * k));
+  canvas.height = Math.max(1, Math.round(ih * k));
+  var g = canvas.getContext("2d");
+  var needContentBox = !shot || !shot.scope || shot.scope === "window";
+  var content = null;
+  if (needContentBox) {
+    g.imageSmoothingEnabled = false;
+    g.drawImage(image, 0, 0, canvas.width, canvas.height);
+    try {
+      content = findContentBox(g, canvas.width, canvas.height);
+    } catch (error) {
+      content = null;
+    }
+    g.clearRect(0, 0, canvas.width, canvas.height);
+  }
+  g.imageSmoothingEnabled = true;
+  g.drawImage(image, 0, 0, canvas.width, canvas.height);
+  if (content && shot && shot.windowRect && shot.selectionRect) {
+    var win = shot.windowRect;
+    var sel = shot.selectionRect;
+    var left = content.left / k;
+    var top = content.top / k;
+    var right = content.right / k;
+    var realScale = (right - left) / win.width;
+    if (realScale > 0.2 && realScale < 5) {
+      rect = {
+        x: left + (sel.x - win.x) * realScale,
+        y: top + (sel.y - win.y) * realScale,
+        width: sel.width * realScale,
+        height: sel.height * realScale
+      };
+      scale = realScale;
+    }
+  }
+  rect = { x: rect.x * k, y: rect.y * k, width: rect.width * k, height: rect.height * k };
+  var line = Math.max(FRAME_WIDTH_MIN_PX, Math.round(3 * (scale || 1) * k));
+  g.strokeStyle = FRAME_COLOR;
+  g.lineWidth = line;
+  var inset = line / 2;
+  g.strokeRect(rect.x + inset, rect.y + inset, Math.max(0, rect.width - line), Math.max(0, rect.height - line));
+  return new Promise(function(resolve) {
+    canvas.toBlob(function(blob) {
+      resolve(blob);
+    }, "image/png");
+  });
+}
+function report(payload) {
+  try {
+    fetch("/selection-explain/api/shot/hello", { method: "POST", body: JSON.stringify(payload) }).catch(function() {
+    });
+  } catch (error) {
+  }
+}
+function createShotController(env) {
+  var host = env.window || (typeof window !== "undefined" ? window : null) || {};
+  var myEpoch = 0;
+  try {
+    host.__dshSelShotEpoch = (host.__dshSelShotEpoch || 0) + 1;
+    myEpoch = host.__dshSelShotEpoch;
+  } catch (error) {
+    myEpoch = 1;
+  }
+  function superseded() {
+    try {
+      return host.__dshSelShotEpoch !== myEpoch;
+    } catch (error) {
+      return false;
+    }
+  }
+  var timer = 0;
+  var busy = false;
+  var lastId = "";
+  var current = null;
+  var frameEl = null;
+  var chipEl = null;
+  var chipImg = null;
+  var chipUrl = "";
+  var toastEl = null;
+  var toastTimer = 0;
+  function errorText(info) {
+    var code = info && (info.code || info.reason) ? String(info.code || info.reason) : "";
+    if (info && typeof info.message === "string" && info.message.trim()) return info.message;
+    if (code === "not-macos") return "\u622A\u56FE\u529F\u80FD\u76EE\u524D\u4EC5\u652F\u6301 macOS";
+    if (code === "no-screen-permission") return "\u6CA1\u6709\u5C4F\u5E55\u5F55\u5236\u6743\u9650\uFF1A\u8BF7\u5728 \u7CFB\u7EDF\u8BBE\u7F6E \u2192 \u9690\u79C1\u4E0E\u5B89\u5168\u6027 \u2192 \u5C4F\u5E55\u5F55\u5236 \u4E2D\u5141\u8BB8 DSH\uFF0C\u7136\u540E\u91CD\u8BD5";
+    if (code === "busy") return "\u6B63\u5728\u622A\u56FE\uFF0C\u8BF7\u7A0D\u5019";
+    if (code === "probe-missing") return "\u622A\u56FE\u7EC4\u4EF6\u7F3A\u5931\uFF0C\u8BF7\u91CD\u65B0\u6784\u5EFA\u63D2\u4EF6\u540E\u91CD\u8BD5";
+    if (code === "spawn-failed") return "\u7CFB\u7EDF\u622A\u56FE\u547D\u4EE4\u542F\u52A8\u5931\u8D25";
+    if (code === "timeout") return "\u6846\u9009\u8D85\u65F6\uFF0C\u5DF2\u53D6\u6D88\u8FD9\u6B21\u622A\u56FE";
+    if (code === "capture-failed") return "\u622A\u56FE\u5931\u8D25\uFF0C\u8BF7\u68C0\u67E5\u5C4F\u5E55\u5F55\u5236\u6743\u9650\u540E\u91CD\u8BD5";
+    if (code === "image-missing" || code === "finish-failed") return "\u622A\u56FE\u5DF2\u62CD\u4E0B\uFF0C\u4F46\u5904\u7406\u5931\u8D25\uFF0C\u8BF7\u91CD\u8BD5";
+    if (code.indexOf("tmp-failed") === 0) return "\u622A\u56FE\u4E34\u65F6\u76EE\u5F55\u4E0D\u53EF\u7528\uFF0C\u8BF7\u91CD\u8BD5";
+    if (code.indexOf("start-failed") === 0) return "\u622A\u56FE\u542F\u52A8\u5931\u8D25\uFF0C\u8BF7\u91CD\u8BD5";
+    return "\u622A\u56FE\u5931\u8D25\uFF0C\u8BF7\u91CD\u8BD5";
+  }
+  function ensureToast() {
+    if (toastEl) {
+      if (env.layer && toastEl.parentNode !== env.layer) env.layer.appendChild(toastEl);
+      return toastEl;
+    }
+    var d = doc();
+    toastEl = d.createElement("div");
+    toastEl.className = "dsh-sel-shot-toast";
+    toastEl.setAttribute("data-show", "0");
+    toastEl.setAttribute("role", "status");
+    toastEl.setAttribute("aria-live", "polite");
+    toastEl.addEventListener("click", function() {
+      hideNotice();
+    });
+    env.layer.appendChild(toastEl);
+    return toastEl;
+  }
+  function notice(text, tone) {
+    if (!text) return;
+    if (env.ensureLayer) env.ensureLayer();
+    var el2 = ensureToast();
+    el2.textContent = String(text);
+    el2.setAttribute("data-tone", tone || "error");
+    el2.setAttribute("data-show", "1");
+    if (toastTimer) clearTimeout(toastTimer);
+    toastTimer = setTimeout(function() {
+      toastTimer = 0;
+      hideNotice();
+    }, 4500);
+  }
+  function hideNotice() {
+    if (toastTimer) {
+      clearTimeout(toastTimer);
+      toastTimer = 0;
+    }
+    if (toastEl) toastEl.setAttribute("data-show", "0");
+  }
+  function doc() {
+    return env.document;
+  }
+  function viewport() {
+    var win = env.window || window;
+    return { width: win && win.innerWidth || 1200, height: win && win.innerHeight || 800 };
+  }
+  function origin() {
+    var win = env.window || window;
+    return { screenX: win && win.screenX ? win.screenX : 0, screenY: win && win.screenY ? win.screenY : 0 };
+  }
+  function ensureFrame() {
+    if (frameEl) return frameEl;
+    var d = doc();
+    frameEl = d.createElement("div");
+    frameEl.className = "dsh-sel-shotframe";
+    frameEl.setAttribute("data-show", "0");
+    var tag = d.createElement("span");
+    tag.className = "dsh-sel-shotframe-tag";
+    tag.textContent = "\u5DF2\u9009\u4E2D\u7684\u533A\u57DF";
+    frameEl.appendChild(tag);
+    env.layer.appendChild(frameEl);
+    return frameEl;
+  }
+  function ensureChip() {
+    if (chipEl) return chipEl;
+    var d = doc();
+    chipEl = d.createElement("div");
+    chipEl.className = "dsh-sel-shotchip";
+    chipEl.setAttribute("data-show", "0");
+    chipImg = d.createElement("img");
+    chipImg.alt = "\u622A\u56FE";
+    chipEl.appendChild(chipImg);
+    var tx = d.createElement("span");
+    tx.className = "dsh-sel-shotchip-tx";
+    var b = d.createElement("b");
+    b.textContent = "\u6574\u7A97 + \u7EA2\u6846";
+    var meta = d.createElement("span");
+    meta.className = "dsh-sel-shotchip-meta";
+    tx.appendChild(b);
+    tx.appendChild(meta);
+    chipEl.appendChild(tx);
+    env.layer.appendChild(chipEl);
+    return chipEl;
+  }
+  function scopeText(shot) {
+    var scope = shot && shot.scope;
+    if (!shot || shot.frame === false || scope === "selection") return "\u4EC5\u9009\u533A";
+    if (scope === "screen") return "\u5168\u5C4F + \u7EA2\u6846";
+    if (scope === "margin") return "\u9009\u533A + \u7559\u767D";
+    return "\u6574\u7A97 + \u7EA2\u6846";
+  }
+  function hideMarkers() {
+    if (frameEl) frameEl.setAttribute("data-show", "0");
+    if (chipEl) chipEl.setAttribute("data-show", "0");
+  }
+  function clearAll() {
+    hideNotice();
+    hideMarkers();
+    if (chipUrl) {
+      URL.revokeObjectURL(chipUrl);
+      chipUrl = "";
+    }
+    if (chipImg) chipImg.removeAttribute("src");
+    current = null;
+    if (env.state.selection && env.state.selection.source === "shot") env.state.selection = null;
+    if (env.vcardOpen && env.vcardOpen() && env.closeVCard) env.closeVCard(true);
+  }
+  var cancelBound = false;
+  function bindCancel() {
+    if (cancelBound) return;
+    var d = doc();
+    if (!d || !d.addEventListener) return;
+    cancelBound = true;
+    var showing = function() {
+      return !!current || frameEl && frameEl.getAttribute("data-show") === "1" || chipEl && chipEl.getAttribute("data-show") === "1" || toastEl && toastEl.getAttribute("data-show") === "1";
+    };
+    d.addEventListener("keydown", function(event) {
+      if (event.key === "Escape" && showing()) clearAll();
+    }, true);
+    d.addEventListener("pointerdown", function(event) {
+      if (!showing()) return;
+      var target = event.target;
+      var card = env.vcardElement && env.vcardElement();
+      if (card && target && card.contains && card.contains(target)) return;
+      if (chipEl && target && chipEl.contains && chipEl.contains(target)) return;
+      if (toastEl && target && toastEl.contains && toastEl.contains(target)) return;
+      clearAll();
+    }, true);
+  }
+  function startCapture() {
+    clearAll();
+    var mode = env.panelOpen ? "panel" : "card";
+    fetch(SHOT_START + "?mode=" + mode, { method: "POST", body: "" }).then(function(response) {
+      if (!response.ok) throw new Error("HTTP " + response.status);
+      return response.json();
+    }).then(function(info) {
+      if (!info || info.ok !== true) notice(errorText(info));
+    }).catch(function() {
+      notice("\u622A\u56FE\u670D\u52A1\u4E0D\u53EF\u7528\uFF0C\u8BF7\u7A0D\u540E\u91CD\u8BD5");
+    });
+  }
+  async function handle(shot) {
+    if (!shot || shot.id === lastId) return;
+    lastId = shot.id;
+    var t0 = Date.now();
+    current = { shot, file: null, blob: null, ref: null, refReady: null, uploading: null, error: "", t0 };
+    var mine = current;
+    var step = "geometry";
+    try {
+      if (env.ensureLayer) env.ensureLayer();
+      var page = pageRectOf(shot.selectionRect, origin());
+      var view = viewport();
+      var inside = !!(page && insideViewport(page, view));
+      var anchor = null;
+      var panelMode = !!env.panelOpen && (!shot.mode || shot.mode === "panel");
+      if (panelMode) {
+        if (frameEl) frameEl.setAttribute("data-show", "0");
+        if (chipEl) chipEl.setAttribute("data-show", "0");
+      } else if (inside) {
+        var frame = ensureFrame();
+        frame.style.left = Math.round(page.left) + "px";
+        frame.style.top = Math.round(page.top) + "px";
+        frame.style.width = Math.round(page.width) + "px";
+        frame.style.height = Math.round(page.height) + "px";
+        frame.setAttribute("data-show", "1");
+        if (chipEl) chipEl.setAttribute("data-show", "0");
+        anchor = page;
+      } else {
+        var chip = ensureChip();
+        var edge = nearestEdge(page || { left: 0, top: 0, width: 0, height: 0 }, view);
+        var box = chipRectFor(edge, page || { left: 0, top: 0, width: 0, height: 0 }, view);
+        chip.style.left = Math.round(box.left) + "px";
+        chip.style.top = Math.round(box.top) + "px";
+        var chipTitle = chip.querySelector(".dsh-sel-shotchip-tx b");
+        if (chipTitle) chipTitle.textContent = scopeText(shot);
+        var meta = chip.querySelector(".dsh-sel-shotchip-meta");
+        if (meta) meta.textContent = Math.round(shot.selectionRect.width) + " \xD7 " + Math.round(shot.selectionRect.height);
+        chip.setAttribute("data-show", "1");
+        if (frameEl) frameEl.setAttribute("data-show", "0");
+        anchor = asRect(box);
+      }
+      var md0 = Date.now();
+      step = "annotate";
+      var imageUrl = SHOT_IMAGE + "?id=" + encodeURIComponent(shot.id);
+      var applyBlob = function(blob) {
+        if (!blob) return null;
+        if (current !== mine) return null;
+        mine.blob = blob;
+        mine.file = new File([blob], "\u622A\u56FE.png", { type: blob.type || "image/png" });
+        mine.error = "";
+        if (chipImg) {
+          if (chipUrl) URL.revokeObjectURL(chipUrl);
+          chipUrl = URL.createObjectURL(blob);
+          chipImg.src = chipUrl;
+        }
+        report({ stage: "bg-done", ms: Date.now() - md0, frame: shot.frame !== false, scope: shot.scope || "" });
+        return null;
+      };
+      var markWorkFailed = function(message, error) {
+        if (current === mine) {
+          mine.error = "image-failed";
+          notice(message);
+        }
+        report({ stage: "bg-fail", ms: Date.now() - md0, error: String(error && error.message || error) });
+        return null;
+      };
+      var startWork = function() {
+        if (shot.frame === false) {
+          return fetch(imageUrl, { cache: "no-store" }).then(function(response) {
+            if (!response.ok) throw new Error("HTTP " + response.status);
+            return response.blob();
+          }).then(applyBlob).catch(function(error) {
+            return markWorkFailed("\u622A\u56FE\u5DF2\u62CD\u4E0B\uFF0C\u4F46\u8BFB\u53D6\u56FE\u7247\u5931\u8D25\uFF0C\u8BF7\u91CD\u8BD5", error);
+          });
+        }
+        return loadImage(imageUrl).then(function(img) {
+          return annotate(img, shot.rect, shot.scale, shot);
+        }).then(applyBlob).catch(function(error) {
+          return markWorkFailed("\u622A\u56FE\u5DF2\u62CD\u4E0B\uFF0C\u4F46\u5904\u7406\u56FE\u7247\u5931\u8D25\uFF0C\u8BF7\u91CD\u8BD5", error);
+        });
+      };
+      current.refReady = new Promise(function(resolve) {
+        var kick = function() {
+          resolve(startWork());
+        };
+        if (panelMode) {
+          kick();
+          return;
+        }
+        if (shot.frame === false) {
+          kick();
+          return;
+        }
+        if (typeof window !== "undefined" && window.requestIdleCallback) {
+          setTimeout(function() {
+            window.requestIdleCallback(kick, { timeout: 1200 });
+          }, 350);
+        } else {
+          setTimeout(kick, 350);
+        }
+      });
+      if (panelMode) {
+        var ready = current.refReady;
+        if (ready) ready.then(function() {
+          if (current !== mine) return;
+          if (mine.file) env.addFiles([mine.file]);
+          else if (!mine.error) notice("\u622A\u56FE\u6CA1\u6709\u751F\u6210\u6210\u529F\uFF0C\u8BF7\u91CD\u8BD5");
+          if (env.focusAskBox) env.focusAskBox();
+        });
+        report({ stage: "done", branch: "panel", scope: shot.scope || "", ms: Date.now() - t0 });
+        return;
+      }
+      env.state.selection = {
+        source: "shot",
+        text: "",
+        label: "\u622A\u56FE",
+        context: "",
+        keyContext: "",
+        range: null,
+        rect: anchor,
+        shot: current,
+        ref: null,
+        // 后续提示词要按取景范围换口径（仅选区没有红框，留白/全屏/整窗口径不同）
+        shotScope: shot.scope || "",
+        shotFrame: shot.frame !== false
+      };
+      step = "openVCard";
+      env.openVCard();
+      var opened = !env.vcardOpen || env.vcardOpen();
+      report({ stage: "done", branch: inside ? "frame" : "chip", opened, ms: Date.now() - t0 });
+      setTimeout(function() {
+        try {
+          var card = env.vcardElement && env.vcardElement();
+          var cinfo = null;
+          if (card) {
+            var cr = card.getBoundingClientRect();
+            var cs = getComputedStyle(card);
+            cinfo = { rect: [Math.round(cr.left), Math.round(cr.top), Math.round(cr.width), Math.round(cr.height)], display: cs.display, opacity: cs.opacity, z: cs.zIndex };
+          }
+          var layerEl = env.layer;
+          report({
+            stage: "probe",
+            open: env.vcardOpen ? !!env.vcardOpen() : null,
+            card: cinfo,
+            layer: layerEl ? { connected: !!layerEl.isConnected, parent: layerEl.parentNode ? layerEl.parentNode.className || layerEl.parentNode.nodeName : null } : null,
+            frame: frameEl ? { show: frameEl.getAttribute("data-show"), connected: !!frameEl.isConnected } : null,
+            vp: [window.innerWidth, window.innerHeight]
+          });
+        } catch (error) {
+          report({ stage: "probe", error: String(error && error.message || error) });
+        }
+      }, 500);
+      if (!opened) {
+        hideMarkers();
+        env.state.selection = null;
+        current = null;
+      }
+    } catch (error) {
+      report({ stage: step, error: String(error && error.stack || error && error.message || error) });
+    }
+  }
+  function uploadAnnotated(blob) {
+    return new Promise(function(resolve) {
+      var reader = new FileReader();
+      reader.onload = function() {
+        var data = String(reader.result || "");
+        var base64 = data.indexOf(",") >= 0 ? data.slice(data.indexOf(",") + 1) : data;
+        fetch(ATTACH, {
+          method: "POST",
+          headers: { "content-type": "application/json" },
+          body: JSON.stringify({ items: [{ kind: "image", name: "\u622A\u56FE.png", mediaType: "image/png", data: base64 }] })
+        }).then(function(r) {
+          return r.ok ? r.json() : null;
+        }).then(function(json) {
+          var item = json && json.items && json.items[0];
+          resolve(item && item.ref ? item.ref : null);
+        }).catch(function() {
+          resolve(null);
+        });
+      };
+      reader.onerror = function() {
+        resolve(null);
+      };
+      reader.readAsDataURL(blob);
+    });
+  }
+  function loadImage(src, attempt) {
+    var tries = attempt || 0;
+    return new Promise(function(resolve, reject) {
+      var img = new Image();
+      img.onload = function() {
+        resolve(img);
+      };
+      img.onerror = function(error) {
+        if (tries >= 8) {
+          reject(error);
+          return;
+        }
+        setTimeout(function() {
+          loadImage(src, tries + 1).then(resolve, reject);
+        }, 120);
+      };
+      img.src = src + (src.indexOf("?") >= 0 ? "&" : "?") + "r=" + tries;
+    });
+  }
+  async function poll() {
+    if (busy) return;
+    busy = true;
+    try {
+      var res = await fetch(SHOT_PENDING, { cache: "no-store" });
+      if (res.ok) {
+        var data = await res.json();
+        if (data && data.error) notice(errorText(data.error));
+        if (data && data.shot) await handle(data.shot);
+      }
+    } catch (error) {
+    } finally {
+      busy = false;
+    }
+  }
+  function loop() {
+    if (superseded()) return;
+    timer = setTimeout(function() {
+      timer = 0;
+      if (superseded()) return;
+      var d = doc();
+      if (d && d.visibilityState === "hidden") return loop();
+      poll().then(loop, loop);
+    }, 30);
+  }
+  return {
+    start: function() {
+      bindCancel();
+      if (timer) return;
+      loop();
+    },
+    stop: function() {
+      if (timer) clearTimeout(timer);
+      timer = 0;
+      hideNotice();
+    },
+    /** 快捷键按下时调用。 */
+    capture: startCapture,
+    clear: clearAll,
+    clearMarkers: hideMarkers,
+    /** 发送时用：当前这张已经画好红框的图（File 与持久引用）。 */
+    takeFile: function() {
+      return current ? current.file : null;
+    },
+    /**
+     * 发送时用：等后台把红框图画好，**此刻才上传**并返回持久引用。
+     *
+     * 为什么不在截完就传：附件库（~/.dsh/attachments）是内容寻址、**只增不删**，
+     * 没有 GC。用户按了 Esc / 点空白取消时，我们不该往里面塞一张永远不会被用到的图。
+     */
+    takeRefAsync: function() {
+      var here = current;
+      if (!here) return Promise.resolve(null);
+      if (here.error && here.error !== "upload-failed") return Promise.resolve(null);
+      if (here.ref) return Promise.resolve(here.ref);
+      if (here.uploading) return here.uploading;
+      if (!here.refReady) {
+        here.error = "image-failed";
+        notice("\u622A\u56FE\u5DF2\u62CD\u4E0B\uFF0C\u4F46\u8FD8\u6CA1\u6709\u51C6\u5907\u597D\uFF0C\u8BF7\u91CD\u8BD5");
+        return Promise.resolve(null);
+      }
+      here.uploading = here.refReady.then(function() {
+        if (here.ref) return here.ref;
+        if (!here.blob) {
+          if (!here.error) {
+            here.error = "image-failed";
+            notice("\u622A\u56FE\u5DF2\u62CD\u4E0B\uFF0C\u4F46\u8BFB\u53D6\u56FE\u7247\u5931\u8D25\uFF0C\u8BF7\u91CD\u8BD5");
+          }
+          return null;
+        }
+        return uploadAnnotated(here.blob).then(function(ref) {
+          if (!ref) {
+            here.error = "upload-failed";
+            here.uploading = null;
+            return null;
+          }
+          here.ref = ref;
+          here.blob = null;
+          here.error = "";
+          report({ stage: "uploaded", ref: true });
+          return ref;
+        });
+      });
+      return here.uploading;
+    },
+    /** 当前这张图是否已经失败（供语音卡在发送时决定"先别开小窗"）。 */
+    failed: function() {
+      return current && current.error ? String(current.error) : "";
+    },
+    /** 给语音卡/其它控制器用的提示入口。 */
+    notice,
+    takeRef: function() {
+      return current ? current.ref : null;
+    },
+    state: function() {
+      return {
+        polling: !!timer,
+        lastId,
+        hasFile: !!(current && current.file),
+        error: current && current.error ? String(current.error) : "",
+        frame: frameEl ? frameEl.getAttribute("data-show") === "1" : false,
+        chip: chipEl ? chipEl.getAttribute("data-show") === "1" : false
+      };
+    }
+  };
+}
+
 // src/client/bridge.js
 function bridgeBody() {
   if (window.__dshSelBridge) return;
@@ -4635,7 +5697,7 @@ function bridgeBody() {
     if (!now) return "";
     return now.text + "\0" + now.rect.x + "," + now.rect.y + "," + now.rect.bottom + "," + now.rect.right;
   }
-  function report(allowClear) {
+  function report2(allowClear) {
     var now = read();
     if (!now) {
       if (last && allowClear !== false) {
@@ -4681,10 +5743,10 @@ function bridgeBody() {
   }, true);
   window.addEventListener("mouseup", function() {
     pressed = false;
-    setTimeout(report, 0);
+    setTimeout(report2, 0);
   }, true);
   window.addEventListener("keyup", function() {
-    setTimeout(report, 0);
+    setTimeout(report2, 0);
   }, true);
   window.addEventListener("blur", function() {
     pressed = false;
@@ -4692,29 +5754,29 @@ function bridgeBody() {
   window.addEventListener("scroll", function() {
     if (pressed) return;
     setTimeout(function() {
-      report(false);
+      report2(false);
     }, 60);
   }, true);
   window.addEventListener("resize", function() {
-    if (!pressed) report(false);
+    if (!pressed) report2(false);
   });
   window.addEventListener("message", function(event) {
     var data = event && event.data;
     if (!data || data.__dshSel !== 1) return;
     if (data.kind === "ping") {
       send("hello", null);
-      report();
+      report2();
     }
-    if (data.kind === "rescan") report();
+    if (data.kind === "rescan") report2();
   });
   try {
     document.addEventListener("selectionchange", function() {
-      if (!pressed) report();
+      if (!pressed) report2();
     });
   } catch (error) {
   }
   setInterval(tick, 250);
-  setTimeout(report, 60);
+  setTimeout(report2, 60);
 }
 var BRIDGE_MARK = "data-dsh-sel-bridge";
 function bridgeIntoHtml(html) {
@@ -5036,7 +6098,82 @@ function createPanelController(env) {
     clearDocSelection();
     env.state.selection = null;
   }
+  function shotScopeLabel(scope, frame) {
+    if (frame === false || scope === "selection") return "\u4EC5\u9009\u533A";
+    if (scope === "screen") return "\u5168\u5C4F + \u7EA2\u6846";
+    if (scope === "margin") return "\u9009\u533A + \u7559\u767D";
+    return "\u6574\u7A97 + \u7EA2\u6846";
+  }
+  function setQuoteLine(text) {
+    if (!env.quote) return;
+    var title = env.state.shotTitle;
+    if (title) {
+      env.quote.textContent = String(title);
+      env.quote.setAttribute("data-title", "1");
+      return;
+    }
+    env.quote.removeAttribute("data-title");
+    env.quote.textContent = text;
+  }
+  function applyShotTitle(title) {
+    if (!title) return;
+    env.state.shotTitle = String(title);
+    setQuoteLine(String(title));
+    if (env.paintPill) env.paintPill();
+  }
+  function openPanelForShot(anchor, options) {
+    env.panelSessionId = currentSessionId();
+    env.state.contextState = null;
+    env.state.skipInterpretation = true;
+    env.state.payload = buildPayload(String(options.askFirst || ""), "", "\u622A\u56FE");
+    env.state.payload.kind = "shot";
+    env.state.shotScope = options.shotScope || "";
+    env.state.shotFrame = options.shotFrame !== false;
+    if (env.state.shotScope) {
+      env.state.payload.shotScope = env.state.shotScope;
+      env.state.payload.shotFrame = env.state.shotFrame;
+    }
+    env.state.kind = "shot";
+    var shotIdentity = "";
+    if (options && options.shotRef && typeof options.shotRef === "object") {
+      var ref = options.shotRef;
+      shotIdentity = String(ref.attachmentId || ref.id || ref.hash || "");
+    }
+    if (!shotIdentity) {
+      shotIdentity = "shot-" + Date.now().toString(36);
+    }
+    env.state.cacheKey = cacheKeyOf(String(options.askFirst || ""), "shot:" + shotIdentity);
+    env.hideButton();
+    showPanel(anchor);
+    env.state.shotTitle = "";
+    setQuoteLine("\u622A\u56FE \xB7 " + shotScopeLabel(env.state.shotScope, env.state.shotFrame));
+    if (env.paintPill) env.paintPill();
+    env.clearQuotes();
+    env.clearAttachments();
+    env.state.turns = [];
+    env.state.parts = { translation: "", detail: "" };
+    env.state.stage = "";
+    env.state.raw = "";
+    env.state.phase = "done";
+    env.state.chars = 0;
+    env.state.error = "";
+    env.state.fromCache = false;
+    env.state.sharedCache = false;
+    env.state.elapsed = 0;
+    env.state.toolBusy = false;
+    env.state.cacheState = "";
+    env.state.toolDigest = "";
+    env.renderTurns();
+    paint();
+    var refs = options.shotRef ? [{ kind: "image", ref: options.shotRef }] : [];
+    var note = options.shotRef ? "\u3010\u672C\u6761\u6D88\u606F\u5E26\u4E86\u9644\u4EF6\u3011\u622A\u56FE\uFF08\u56FE\u7247\uFF09" : "";
+    env.sendAsk(options.askFirst, null, refs, note);
+  }
   function openPanelWithInner(text, context, label, anchor, keyContext, options) {
+    if (options && options.shotRef !== void 0) {
+      openPanelForShot(anchor, options);
+      return;
+    }
     env.state.skipInterpretation = !!(options && options.askFirst);
     env.panelSessionId = currentSessionId();
     env.state.contextState = null;
@@ -5044,8 +6181,10 @@ function createPanelController(env) {
     env.state.kind = env.state.payload.kind;
     env.hideButton();
     showPanel(anchor);
-    env.quote.textContent = text.length > 240 ? text.slice(0, 240) + " \u2026" : text;
+    env.state.shotTitle = "";
+    setQuoteLine(text.length > 240 ? text.slice(0, 240) + " \u2026" : text);
     applySectionTitle(env.state.kind, text);
+    if (env.paintPill) env.paintPill();
     var cacheKey = cacheKeyOf(text, keyContext === void 0 ? context : keyContext);
     var cached = env.cache.get(cacheKey);
     env.state.cacheKey = cacheKey;
@@ -5329,6 +6468,7 @@ function createPanelController(env) {
   }
   function closePanel() {
     env.closeModelMenu();
+    if (typeof env.closeLightbox === "function") env.closeLightbox();
     env.closeSettings();
     env.panelOpen = false;
     env.panel.style.display = "none";
@@ -5348,9 +6488,11 @@ function createPanelController(env) {
     env.hideQuoteButton();
     env.state.quoteSelection = null;
     env.cancelVoice();
-    if (env.state.request) env.state.aborted = true;
-    if (env.state.request) env.state.request.abort();
-    env.state.request = null;
+    if (env.state.request) {
+      env.state.aborted = true;
+      env.state.request.abort();
+      env.state.request = null;
+    }
     if (env.state.askRequest) {
       env.state.stopped = true;
       env.state.askRequest.abort();
@@ -5596,6 +6738,7 @@ function createPanelController(env) {
     env.panel.style.top = Math.round(top) + "px";
   }
   return {
+    applyShotTitle,
     releaseRenderedContent,
     openForSelection,
     currentSessionId,
@@ -5648,7 +6791,9 @@ function createPanelController(env) {
 // src/client/pill.js
 function createPillController(env) {
   function pillSnippet() {
-    var text = env.state.payload && env.state.payload.text ? String(env.state.payload.text) : "";
+    var title = env.state.shotTitle ? String(env.state.shotTitle) : "";
+    title = title.replace(/\s+/g, " ").trim();
+    var text = title || (env.state.payload && env.state.payload.text ? String(env.state.payload.text) : "");
     text = text.replace(/\s+/g, " ").trim();
     if (!text) return "";
     return text.length > 12 ? text.slice(0, 12) + "\u2026" : text;
@@ -5684,7 +6829,7 @@ function createPillController(env) {
     var caret = env.panelOpen ? "\u25BE" : "\u25B4";
     if (env.pillCaret.textContent !== caret) env.pillCaret.textContent = caret;
     env.pill.title = [
-      snippet ? "\u6700\u8FD1\u4E00\u6B21\u5212\u8BCD\uFF1A" + snippet : "\u8FD8\u6CA1\u6709\u5212\u8FC7\u8BCD",
+      snippet ? (env.state.shotTitle ? "\u6700\u8FD1\u4E00\u6B21\u622A\u56FE\uFF1A" : "\u6700\u8FD1\u4E00\u6B21\u5212\u8BCD\uFF1A") + snippet : "\u8FD8\u6CA1\u6709\u5212\u8FC7\u8BCD",
       status.text,
       env.panelOpen ? "\u70B9\u51FB\u6536\u8D77\u5C0F\u7A97" : "\u70B9\u51FB\u56DE\u5230\u8FD9\u4E2A\u5C0F\u7A97",
       "\u53EF\u62D6\u52A8\uFF08\u62D6\u5230\u53F3\u4E0B\u89D2\u9644\u8FD1\u4F1A\u5438\u9644\u56DE\u53BB\uFF09"
@@ -6249,6 +7394,7 @@ function prepareChatHistory(turns, rawState) {
 // src/client/history.js
 function createHistoryController(env) {
   var foldCount = 0;
+  var shotTitlePendingKey = "";
   var HTML_VOID_TAGS = {
     area: 1,
     base: 1,
@@ -6583,30 +7729,40 @@ function createHistoryController(env) {
       } else return;
       renderTurns();
     }
+    var savedBody = {
+      key: env.state.cacheKey,
+      text: payload.text,
+      context: payload.context,
+      // 截图有标题时写进 label（旧列表/旧客户端也能显示）；标题本体另存 title
+      label: payload.kind === "shot" && String(env.state.shotTitle || "").trim() ? "\u622A\u56FE \xB7 " + String(env.state.shotTitle).trim() : payload.label,
+      ...payload.kind === "shot" && String(env.state.shotTitle || "").trim() ? { title: String(env.state.shotTitle).trim() } : {},
+      parts: env.state.parts,
+      turns,
+      toolDigest: env.state.toolDigest,
+      contextState: env.state.contextState || null,
+      pinned: !!(options && options.pinned),
+      // 这段对话有没有解读，必须跟着条目落盘：回放时靠它决定画不画「翻译」一节。
+      // 不落盘的话，语音卡那条"跳过翻译与详解、直接追问"的对话下次开出来，
+      // 会顶着一张空翻译卡片（"这次没有返回内容"）——用户实测。
+      skipped: env.state.skipInterpretation === true,
+      // 截图取景范围：标题那次请求要带上同样的 scope，才能得到同一个 SHOT_PROMPT 口径
+      ...payload.kind === "shot" && env.state.shotScope ? { shotScope: env.state.shotScope, shotFrame: env.state.shotFrame !== false } : {}
+    };
     try {
       fetch(HISTORY, {
         method: "POST",
         headers: { "content-type": "application/json" },
-        body: JSON.stringify({
-          key: env.state.cacheKey,
-          text: payload.text,
-          context: payload.context,
-          label: payload.label,
-          parts: env.state.parts,
-          turns,
-          toolDigest: env.state.toolDigest,
-          contextState: env.state.contextState || null,
-          pinned: !!(options && options.pinned),
-          // 这段对话有没有解读，必须跟着条目落盘：回放时靠它决定画不画「翻译」一节。
-          // 不落盘的话，语音卡那条"跳过翻译与详解、直接追问"的对话下次开出来，
-          // 会顶着一张空翻译卡片（"这次没有返回内容"）——用户实测。
-          skipped: env.state.skipInterpretation === true
-        })
+        body: JSON.stringify(savedBody)
       }).then(function(response) {
         if (!response.ok) throw new Error("HTTP " + response.status);
         return response.json();
       }).then(function(result) {
-        noteSaved(!result || result.ok !== true);
+        var failed = !result || result.ok !== true;
+        noteSaved(failed);
+        if (!failed && payload.kind === "shot" && !String(env.state.shotTitle || "").trim() && shotTitlePendingKey !== savedBody.key) {
+          shotTitlePendingKey = savedBody.key;
+          requestShotTitle(savedBody, payload.sessionId);
+        }
       }).catch(function() {
         noteSaved(true);
       });
@@ -6614,6 +7770,99 @@ function createHistoryController(env) {
       noteSaved(true);
     }
   }
+  function requestShotTitle(saved, sessionId, attempt) {
+    var tries = attempt || 0;
+    var userTurn = null;
+    var list = saved.turns || [];
+    for (var i = 0; i < list.length; i += 1) {
+      if (list[i] && list[i].role === "user" && list[i].attachments && list[i].attachments.length > 0) {
+        userTurn = list[i];
+        break;
+      }
+    }
+    if (!userTurn) return;
+    var savedKey = saved.key;
+    fetch(API, {
+      method: "POST",
+      headers: { "content-type": "application/json" },
+      body: JSON.stringify({
+        text: saved.text,
+        kind: "shot",
+        titleOnly: true,
+        label: "\u622A\u56FE",
+        attachments: userTurn.attachments,
+        // 与回答那次同一个取景口径：标题是最好的"红框/仅选区"措辞，换口径会问错东西
+        ...saved.shotScope ? { shotScope: saved.shotScope, shotFrame: saved.shotFrame !== false } : {},
+        // ⚠️ 必须带 sessionId：不带会被上游 400 拒绝（MissingSessionID），
+        // 而 `env.panelSessionId` 在历史模块里并不存在 —— 用的是保存时那份 payload 里的。
+        ...sessionId ? { sessionId } : {},
+        // ⚠️ 必须带上面板当前用的模型：不带的话 host 会退回"会话默认模型"，
+        // 那个路由可能不支持图片 → 上游报错 → 正文为空 → 标题永远写不回去（实测踩到）。
+        ...env.state.modelChoice ? { provider: env.state.modelChoice.provider, model: env.state.modelChoice.model } : {}
+      })
+    }).then(function(response) {
+      return response.ok ? response.text() : "";
+    }).then(function(raw) {
+      var title = cleanShotTitle(readSseText(raw));
+      if (!title) throw new Error("empty-title");
+      if (shotTitlePendingKey === savedKey) shotTitlePendingKey = "";
+      if (env.state.cacheKey === savedKey && env.applyShotTitle) env.applyShotTitle(title);
+      writeShotTitle(savedKey, title);
+    }).catch(function() {
+      if (tries >= 1) {
+        if (shotTitlePendingKey === savedKey) shotTitlePendingKey = "";
+        return;
+      }
+      setTimeout(function() {
+        requestShotTitle(saved, sessionId, tries + 1);
+      }, 2e3);
+    });
+  }
+  function writeShotTitle(key, title) {
+    fetch(HISTORY + "?key=" + encodeURIComponent(key)).then(function(response) {
+      return response.ok ? response.json() : null;
+    }).then(function(data) {
+      var entry = data && data.entry;
+      if (!entry) return;
+      return fetch(HISTORY, {
+        method: "POST",
+        headers: { "content-type": "application/json" },
+        // title 是权威字段；label 继续写成「截图 · 标题」兼容旧列表/旧版本
+        body: JSON.stringify(Object.assign({}, entry, { title, label: "\u622A\u56FE \xB7 " + title }))
+      });
+    }).then(function(response) {
+      if (!response || !response.ok) return;
+      if (env.historyList && env.historyList.style.display === "flex") openHistoryList();
+    }).catch(function() {
+    });
+  }
+  function readSseText(raw) {
+    var out = [];
+    var lines = String(raw || "").split("\n");
+    for (var i = 0; i < lines.length; i += 1) {
+      var line = lines[i].trim();
+      if (line.indexOf("data:") !== 0) continue;
+      var chunk = line.slice(5).trim();
+      if (!chunk || chunk === "[DONE]") continue;
+      try {
+        var obj = JSON.parse(chunk);
+        if (obj.type === "thought") continue;
+        if (typeof obj.delta === "string") out.push(obj.delta);
+        else if (obj.type === "delta" && typeof obj.text === "string") out.push(obj.text);
+      } catch (error) {
+      }
+    }
+    return out.join("");
+  }
+  function cleanShotTitle(raw) {
+    var title = String(raw || "").trim();
+    title = title.replace(/^标题[:：]\s*/, "");
+    title = title.replace(/^["'「『【]+|["'」』】]+$/g, "");
+    title = title.replace(/[。！？.!?,，、:：;；…]+$/g, "");
+    title = title.replace(/\s+/g, " ").trim();
+    if (!title) return "";
+    return title.length > 24 ? title.slice(0, 24) : title;
+  }
   function applyHistoryEntry(entry, source) {
     var parts = entry.parts || {};
     env.state.parts = { translation: parts.translation || "", detail: parts.detail || "" };
@@ -6647,10 +7896,26 @@ function createHistoryController(env) {
     env.state.toolBusy = false;
     env.state.cacheState = source === "local" ? "local" : "history";
     env.state.chars = (env.state.parts.translation || "").length + (env.state.parts.detail || "").length;
-    env.quote.textContent = entry.text.length > 240 ? entry.text.slice(0, 240) + " \u2026" : entry.text;
+    var replayTitle = typeof entry.title === "string" ? entry.title.trim() : "";
+    if (!replayTitle) {
+      var titleMatch = /^截图 · (.+)$/.exec(String(entry.label || ""));
+      if (titleMatch) replayTitle = titleMatch[1];
+    }
+    env.state.shotTitle = replayTitle;
+    if (replayTitle) {
+      if (env.applyShotTitle) env.applyShotTitle(replayTitle);
+      else {
+        env.quote.textContent = replayTitle;
+        env.quote.setAttribute("data-title", "1");
+      }
+    } else {
+      env.quote.textContent = entry.text.length > 240 ? entry.text.slice(0, 240) + " \u2026" : entry.text;
+      env.quote.removeAttribute("data-title");
+    }
     env.applySectionTitle(env.state.kind, entry.text);
     hideHistoryList();
     env.paint();
+    if (env.paintPill) env.paintPill();
     renderTurns();
   }
   function restoreFromHistory(cacheKey, onMiss) {
@@ -6757,8 +8022,11 @@ function createHistoryController(env) {
   }
   function historyRow(item) {
     var row = el("div", "dsh-sel-historyrow");
-    var title = String(item.text || "").trim();
-    row.appendChild(el("div", "dsh-sel-historytext", title || "\uFF08\u8FD9\u6B21\u6CA1\u9009\u4E2D\u6587\u5B57\uFF09"));
+    var shotTitle = typeof item.title === "string" ? item.title.trim() : "";
+    var shotMatch = /^截图 · (.+)$/.exec(String(item.label || ""));
+    var isShot = !!shotTitle || !!shotMatch;
+    var main = shotTitle || (shotMatch ? shotMatch[1] : String(item.text || "").trim());
+    row.appendChild(el("div", "dsh-sel-historytext", main || "\uFF08\u8FD9\u6B21\u6CA1\u9009\u4E2D\u6587\u5B57\uFF09"));
     var del = el("button", "dsh-sel-historydel", "\u2715");
     del.type = "button";
     del.title = "\u5220\u9664\u8FD9\u6761\u8BB0\u5F55";
@@ -6769,7 +8037,8 @@ function createHistoryController(env) {
       deleteHistoryEntry(item, row);
     });
     row.appendChild(del);
-    var meta = (item.label ? shortLabel(item.label) + " \xB7 " : "") + (item.turns > 0 ? item.turns + " \u8F6E \xB7 " : "") + formatWhen(item.at);
+    var metaLabel = isShot ? "\u622A\u56FE" : shortLabel(item.label);
+    var meta = (metaLabel ? metaLabel + " \xB7 " : "") + (item.turns > 0 ? item.turns + " \u8F6E \xB7 " : "") + formatWhen(item.at);
     var metaNode = el("div", "dsh-sel-historymeta");
     metaNode.appendChild(el("span", null, meta));
     if (item.pinned) metaNode.appendChild(el("span", "dsh-sel-historypin", "\u5DF2\u5347\u683C"));
@@ -7139,13 +8408,35 @@ function createHistoryController(env) {
     }
     return strip;
   }
+  function bubbleGallery(anchor) {
+    var log = env.chatLog;
+    var links = log && typeof log.querySelectorAll === "function" ? log.querySelectorAll(".dsh-sel-bqimgwrap") : [];
+    var images = [];
+    var index = 0;
+    for (var i = 0; i < links.length; i += 1) {
+      var wrap = links[i];
+      var thumb = wrap.querySelector ? wrap.querySelector("img") : null;
+      var src = String(wrap.getAttribute("href") || thumb && thumb.getAttribute("src") || "");
+      if (!src) continue;
+      if (wrap === anchor) index = images.length;
+      images.push({ src, name: thumb && thumb.alt || "\u56FE\u7247" });
+    }
+    if (images.length === 0 && anchor) images.push({ src: anchor.href, name: "\u56FE\u7247" });
+    return { images, index };
+  }
   function attachmentImage(ref) {
     var link = document.createElement("a");
     link.className = "dsh-sel-bqimgwrap";
     link.href = attachmentUrl("image", ref);
     link.target = "_blank";
     link.rel = "noreferrer noopener";
-    link.title = "\u70B9\u51FB\u67E5\u770B\u539F\u56FE" + (ref.name ? "\uFF1A" + ref.name : "");
+    link.title = "\u70B9\u51FB\u9884\u89C8" + (ref.name ? "\uFF1A" + ref.name : "");
+    listen(link, "click", function(event) {
+      if (event.button !== 0 || event.metaKey || event.ctrlKey || event.shiftKey || event.altKey) return;
+      if (typeof env.previewImage !== "function") return;
+      event.preventDefault();
+      env.previewImage(bubbleGallery(link));
+    });
     var img = document.createElement("img");
     img.className = "dsh-sel-bqimg";
     img.src = link.href;
@@ -7327,7 +8618,7 @@ function createConversationController(env) {
     }
     return false;
   }
-  function ask(question) {
+  async function ask(question) {
     var generating = env.state.asking || env.state.phase === "loading" || env.state.phase === "streaming";
     if (generating) {
       env.setStatus("\u8FD8\u5728\u751F\u6210\uFF0C\u8BF7\u7A0D\u5019\u2026\uFF08\u751F\u6210\u5B8C\u5C31\u80FD\u8FFD\u95EE\uFF09");
@@ -7337,6 +8628,17 @@ function createConversationController(env) {
       env.cancelVoice({ note: "\u5DF2\u505C\u6B62\u5F55\u97F3\uFF08\u8FD9\u6761\u5148\u53D1\u51FA\u53BB\uFF09" });
     }
     var asked = String(question || "").trim();
+    if (env.attachEnsureUploaded && env.state.uploadingAttachments) return;
+    if (env.attachEnsureUploaded) {
+      env.state.uploadingAttachments = true;
+      env.setStatus("\u6B63\u5728\u4E0A\u4F20\u9644\u4EF6\u2026");
+      try {
+        await env.attachEnsureUploaded();
+      } finally {
+        env.state.uploadingAttachments = false;
+      }
+      if (env.state.asking || env.state.phase === "loading" || env.state.phase === "streaming") return;
+    }
     var quotes = env.state.quotes.slice();
     var attachments = env.attachmentsPayload();
     if (!asked && quotes.length === 0 && attachments.length === 0 || !env.state.payload) return;
@@ -7375,6 +8677,7 @@ function createConversationController(env) {
   function sendAsk(asked, quotes, attachments, attachmentsNote) {
     var payload = env.state.payload;
     if (!payload) return;
+    var firstShot = payload.kind === "shot" && env.state.turns.length === 0;
     var withAttachments = attachments || [];
     var sent = env.composeQuestion(quotes, asked);
     if (attachmentsNote) sent = attachmentsNote + "\n" + sent;
@@ -7438,7 +8741,7 @@ function createConversationController(env) {
       answerTurn.asking = false;
       answerTurn.streaming = false;
       clearWaiting(env.chatLog);
-      env.saveHistory();
+      if (env.state.turns === requestTurns && env.state.cacheKey === requestKey) env.saveHistory();
       env.syncPanelStage();
       refreshAskState();
       env.state.askRequest = null;
@@ -7459,6 +8762,12 @@ function createConversationController(env) {
       text: payload.text,
       context: payload.context,
       label: payload.label,
+      // 截图首轮：host 靠它走独立的 SHOT_PROMPT（不是"选中文字"模板），
+      // 并据此描述图里到底是整窗、全屏、留白还是仅选区。
+      ...firstShot ? {
+        kind: "shot",
+        ...env.state.shotScope ? { shotScope: env.state.shotScope, shotFrame: env.state.shotFrame !== false } : {}
+      } : {},
       sessionId: env.panelOrCurrentSessionId(),
       question: sent,
       history,
@@ -7695,6 +9004,8 @@ function createConversationController(env) {
     }
   }
   function runRequest(payload, cacheKey, options) {
+    var requestTurns = env.state.turns;
+    var requestKey = cacheKey;
     env.state.cacheState = "miss";
     if (env.state.request) env.state.request.abort();
     var controller = new AbortController();
@@ -7763,7 +9074,7 @@ function createConversationController(env) {
       env.state.request = null;
       clearWaiting();
       if (cacheKey) env.cache.set(cacheKey, { parts: { ...env.state.parts }, turns: env.state.turns.slice() });
-      env.saveHistory();
+      if (env.state.turns === requestTurns && env.state.cacheKey === requestKey) env.saveHistory();
       env.paint();
     }
     var dirty = false;
@@ -9925,6 +11236,18 @@ function apply(ctx) {
     }
   });
   var voiceCardController = createVoiceCardController({
+    get shotRefAsync() {
+      return shotController.takeRefAsync;
+    },
+    get shotFailed() {
+      return shotController.failed;
+    },
+    get shotNotice() {
+      return shotController.notice;
+    },
+    get clearShotMarkers() {
+      return shotController.clearMarkers;
+    },
     get layer() {
       return layer;
     },
@@ -10044,6 +11367,11 @@ function apply(ctx) {
       return later;
     }
   });
+  var lightboxController = createLightboxController({
+    get layer() {
+      return layer;
+    }
+  });
   var panelController = createPanelController({
     get timerScope() {
       return timerScope;
@@ -10168,6 +11496,9 @@ function apply(ctx) {
     get closeSettings() {
       return settingsController.closeSettings;
     },
+    get closeLightbox() {
+      return lightboxController.close;
+    },
     get hideHistoryList() {
       return historyController.hideHistoryList;
     },
@@ -10352,12 +11683,18 @@ function apply(ctx) {
     set panelSessionId(value) {
       panelSessionId = value;
     },
+    get applyShotTitle() {
+      return panelController.applyShotTitle;
+    },
     get sentTextOf() {
       return quotesController.sentTextOf;
     },
     get panel() {
       return panel;
     },
+    get previewImage() {
+      return lightboxController.open;
+    },
     get state() {
       return state;
     },
@@ -10382,6 +11719,9 @@ function apply(ctx) {
     get paint() {
       return panelController.paint;
     },
+    get paintPill() {
+      return pillController.paintPill;
+    },
     get timerScope() {
       return timerScope;
     },
@@ -10483,6 +11823,9 @@ function apply(ctx) {
     get composeQuestion() {
       return quotesController.composeQuestion;
     },
+    get attachEnsureUploaded() {
+      return attachController.ensureUploaded;
+    },
     get attachmentsPayload() {
       return attachController.payload;
     },
@@ -10617,6 +11960,9 @@ function apply(ctx) {
     get attachInput() {
       return attachInput;
     },
+    get previewImage() {
+      return lightboxController.open;
+    },
     get setStatus() {
       return panelController.setStatus;
     },
@@ -10624,6 +11970,48 @@ function apply(ctx) {
       return conversationController.refreshAskState;
     }
   });
+  var shotController = createShotController({
+    get document() {
+      return document;
+    },
+    get window() {
+      return typeof window !== "undefined" ? window : null;
+    },
+    get layer() {
+      return layer;
+    },
+    get state() {
+      return state;
+    },
+    get panelOpen() {
+      return panelOpen;
+    },
+    get addFiles() {
+      return attachController.addFiles;
+    },
+    get focusAskBox() {
+      return panelController.focusAskBox;
+    },
+    get openVCard() {
+      return voiceCardController.openVCard;
+    },
+    get vcardOpen() {
+      return function() {
+        return voiceCardController.vcardState.open;
+      };
+    },
+    get vcardElement() {
+      return function() {
+        return voiceCardController.vcard;
+      };
+    },
+    get closeVCard() {
+      return voiceCardController.closeVCard;
+    },
+    get ensureLayer() {
+      return ensureLayer;
+    }
+  });
   var modelsController = createModelsController({
     get state() {
       return state;
@@ -10744,6 +12132,10 @@ function apply(ctx) {
       else layer.removeAttribute("data-full-view");
     }
   }
+  function ensureLayer() {
+    if (typeof document === "undefined" || !document.body) return;
+    if (layer.parentNode !== document.body) document.body.appendChild(layer);
+  }
   function mountFloatingLayer(node) {
     if (node) {
       if (layer.parentNode !== document.body) document.body.appendChild(layer);
@@ -11239,6 +12631,15 @@ function apply(ctx) {
     panelController.savePanelSize();
   });
   window.__dshSelectionExplain = {
+    /** 截图提问的状态（调试/自动化）。 */
+    shot: function() {
+      return shotController.state();
+    },
+    /** 手动起一次截图（等同按 ⌘⇧X）。 */
+    shotStart: function() {
+      shotController.capture();
+      return true;
+    },
     /**
      * 语音卡（选中文字 + 输入法正在语音输入 → 就地追问）的状态。
      * 给自动化验证用：能不能弹、有没有焦点、几何对不对，全在这里读。
@@ -11752,6 +13153,95 @@ function apply(ctx) {
       });
     }
   };
+  ctx.effect(function() {
+    if (typeof window === "undefined" || !window.addEventListener) return function() {
+    };
+    function send(payload) {
+      try {
+        fetch("/selection-explain/api/shot/hello", {
+          method: "POST",
+          body: JSON.stringify(Object.assign({ at: Date.now() }, payload))
+        }).catch(function() {
+        });
+      } catch (error) {
+      }
+    }
+    function onError(event) {
+      var err = event && (event.error || event);
+      send({
+        stage: "window-error",
+        message: String(err && err.message || event.message || ""),
+        stack: String(err && err.stack || "").slice(0, 2e3),
+        source: String(event && event.filename || ""),
+        line: event && event.lineno
+      });
+    }
+    function onRejection(event) {
+      var reason = event && event.reason;
+      send({
+        stage: "unhandled-rejection",
+        message: String(reason && reason.message || reason || ""),
+        stack: String(reason && reason.stack || "").slice(0, 2e3)
+      });
+    }
+    window.addEventListener("error", onError);
+    window.addEventListener("unhandledrejection", onRejection);
+    return function() {
+      window.removeEventListener("error", onError);
+      window.removeEventListener("unhandledrejection", onRejection);
+    };
+  }, "selection-explain: error reporter");
+  var shortcutsService = ctx.shortcuts;
+  var shortcutReport = { loaded: true, shortcuts: !!shortcutsService, registered: false, error: "" };
+  function reportShortcut() {
+    try {
+      fetch("/selection-explain/api/shot/hello", { method: "POST", body: JSON.stringify(shortcutReport) }).catch(function() {
+      });
+    } catch (error) {
+    }
+  }
+  reportShortcut();
+  if (shortcutsService && typeof shortcutsService.register === "function") {
+    ctx.effect(function() {
+      try {
+        var off = shortcutsService.register({
+          id: "selection-explain.screenshot",
+          label: function() {
+            return "\u622A\u56FE\u63D0\u95EE";
+          },
+          // ⚠️ 必须给数组：设置页渲染列表时会 `[...row.aliases]`，
+          // 留成 undefined 会直接抛 TypeError，整个快捷键弹窗打不开（实测踩到）。
+          aliases: [],
+          // 键位是**物理键 + 修饰键**的结构（不是 "Mod+Shift+X" 这种字符串）：
+          // code 必须是 KeyA-Z / Digit0-9 / F1-24 这类物理 code，modifiers 是 meta/control/alt/shift/primary
+          // （primary 在 macOS 上是 ⌘、Windows 上是 Ctrl）。
+          defaults: {
+            "desktop:macos": { code: "KeyX", modifiers: ["meta", "shift"] },
+            "web:macos": { code: "KeyX", modifiers: ["meta", "shift"] },
+            "desktop:windows": { code: "KeyX", modifiers: ["primary", "shift"] },
+            "web:windows": { code: "KeyX", modifiers: ["primary", "shift"] }
+          },
+          resolve: function() {
+            return {
+              status: "handled",
+              run: function() {
+                shotController.capture();
+              }
+            };
+          }
+        });
+        shortcutReport.registered = true;
+        reportShortcut();
+        return off;
+      } catch (error) {
+        shortcutReport.error = String(error && error.message || error);
+        reportShortcut();
+        return function() {
+        };
+      }
+    }, "selection-explain: screenshot shortcut");
+    shotController.start();
+  }
   ctx.effect(function() {
     if (typeof console !== "undefined" && console.log) {
       console.log("[dsh-selection-explain] \u5212\u8BCD\u89E3\u8BFB\u5DF2\u5C31\u7EEA\uFF08\u9009\u4E2D\u6587\u5B57\u8BD5\u8BD5\uFF09");
@@ -11761,7 +13251,10 @@ function apply(ctx) {
       timerScope.dispose();
       cache.dispose();
       voiceCardController.closeVCard(false);
+      lightboxController.dispose();
       attachController.clear();
+      shotController.stop();
+      shotController.clearMarkers();
       panelController.releaseRenderedContent();
       if (state.askRequest) state.askRequest.abort();
       offPopEnd();
@@ -11876,5 +13369,5 @@ function apply(ctx) {
     };
   }, "@yfwu2020/dsh-selection-explain: \u5212\u8BCD\u89E3\u8BFB UI");
 }
-var inject = ["slots"];
+var inject = ["slots", "shortcuts"];
 return module.exports;}})