dsh-compact-relay 0.3.6 → 0.4.1

package/lib/client.js

@@ -742,6 +742,59 @@ window.__ModuleLoader__.load({
       );
     };
 
+    /**
+     * 0.4.1：原生自动压缩线「配置阈值 vs 实际触发线」。
+     * DSH 按 token 预算触发：min(窗口×配置阈值, 窗口−输出预留−余量)，
+     * 所以实际触发点常比配置比例更早（deepseek-flash 配置 80%、实际 67.85%）。
+     * autoEnabled=false 时 effective/percentText 为空（未开启），但 actualText 仍给出
+     * 「开启后实际会触发多少」，供关闭态文案使用。
+     * @param {object|null} native readState 下发的 native 字段
+     * @returns {{configured:number|null,configuredText:string|null,actual:number|null,actualText:string,effective:number|null,percentText:string,differs:boolean,autoOff:boolean,why:string}}
+     */
+    const nativeLineInfo = (native) => {
+      const num = (value) => (typeof value === 'number' && Number.isFinite(value) ? value : null);
+      const ratioOf = (value) => {
+        const n = num(value);
+        return n !== null && n > 0 && n < 1 ? n : null;
+      };
+      const src = native === null || native === undefined ? null : native;
+      const configured = ratioOf(src === null ? null : src.thresholdRatio);
+      const actual = ratioOf(src === null ? null : src.ratio);
+      const autoOff = src !== null && src.autoEnabled === false;
+      const effective = autoOff ? null : actual !== null ? actual : configured;
+      const pctText = (value) => {
+        const p = value * 100;
+        return Math.abs(p - Math.round(p)) < 0.05 ? String(Math.round(p)) : p.toFixed(1);
+      };
+      const configuredText = configured === null ? null : pctText(configured);
+      const actualText = actual === null ? '' : pctText(actual);
+      const percentText = effective === null ? '' : pctText(effective);
+      const differs = configured !== null && effective !== null && Math.abs(effective - configured) >= 0.005;
+      let why = '';
+      if (differs) {
+        const overridden = src.overridden === true;
+        const windowTokens = num(src.contextWindow);
+        const reserved = num(src.reservedCompletionTokens);
+        const headroom = num(src.headroomTokens);
+        // 只有「预算分支确实更小」时，才能把差异归因为输出预留/余量。
+        const budgetTokens = windowTokens !== null ? windowTokens - (reserved ?? 0) - (headroom ?? 0) : null;
+        const budgetBinding = budgetTokens !== null && configured !== null && budgetTokens < windowTokens * configured;
+        const parts = [];
+        if (reserved !== null && reserved > 0) parts.push(`模型输出要预留 ${fmt(reserved)}`);
+        if (headroom !== null && headroom > 0) parts.push(`DSH 自己还要留 ${fmt(headroom)} 余量`);
+        if (overridden) {
+          why = `这个模型单独配了阈值（按路由覆盖），实际触发是 ${actualText}%（全局配置 ${configuredText}%）。`;
+        } else if (budgetBinding && parts.length > 0) {
+          why = `配置阈值 ${configuredText}% 只是理论上限；${parts.join('、')}，所以实际打到 ${percentText}% 就会自动压。`;
+        } else if (actual !== null && configured !== null && actual > configured) {
+          why = `这个路由的输出预留更小，实际触发晚于配置阈值 ${configuredText}%（实际 ${actualText}%）。`;
+        } else {
+          why = `实际触发 ${actualText}% 与配置阈值 ${configuredText}% 不同，按宿主 token 预算算的。`;
+        }
+      }
+      return { configured, configuredText, actual, actualText, effective, percentText, differs, autoOff, why };
+    };
+
     const sleep = (ms) => new Promise((resolve) => setTimeout(resolve, ms));
 
     /**
@@ -818,6 +871,14 @@ window.__ModuleLoader__.load({
       const { sessionId, waitAndOpen } = props;
       const hasSession = typeof sessionId === 'string' && sessionId.length > 0;
       const [state, setState] = useState({ advice: 'none', pressure: null, window: null, summaries: 0, colors: null, compactRange: undefined, busy: false, pins: { count: 0, seqs: [], marks: [] }, compressHint: null, native: null });
+      // 0.4 P2-3：原生自动压缩的「有效线」——优先真实触发线（thresholdTokens/window），
+      // 老宿主/算不出时回落 thresholdRatio（窗口比例）。
+      const effectiveNativeRatio = (native) => {
+        if (native === null || native === undefined || native.autoEnabled === false) return null;
+        if (typeof native.ratio === 'number' && Number.isFinite(native.ratio) && native.ratio > 0 && native.ratio < 1) return native.ratio;
+        if (typeof native.thresholdRatio === 'number' && Number.isFinite(native.thresholdRatio) && native.thresholdRatio > 0) return native.thresholdRatio;
+        return null;
+      };
       const [open, setOpen] = useState(false);
       const [busy, setBusy] = useState(false);
       const [hover, setHover] = useState(false);
@@ -877,6 +938,8 @@ window.__ModuleLoader__.load({
       }, []);
       // A1b：交接预览（九段草稿 + 就绪清单），只读不落盘。
       const [handoffPreview, setHandoffPreview] = useState(null);
+      /** 0.4 P2-1：交接预览里「约束 / 下一步」两段的编辑值（键=段标题；空值回落原文）。 */
+      const [handoffEditValues, setHandoffEditValues] = useState({});
       const handoffPreviewRef = useRef(null);
       const handoffPreviewAbortRef = useRef(null);
       const closeHandoffPreview = useCallback(() => {
@@ -936,13 +999,20 @@ window.__ModuleLoader__.load({
           : '/api/compact-relay-state';
 
       const applierRef = useRef(() => {});
+      // 0.3.7：最后一帧（SSE 帧或轮询响应）的到达时间。远程/代理链路可能让 SSE
+      // 「onopen 已连上、之后却一帧都不来」地静默挂住，表现为压缩后界面不刷新
+      // （Win 远程客户端实测：手动刷新才变）。帧静默超时后由兜底轮询补拉。
+      const lastFrameAtRef = useRef(0);
       const fetchState = useCallback(async () => {
         if (!hasSession) return;
           try {
             const res = await fetch(url, { cache: 'no-store' });
             if (!res.ok) return;
             const data = await res.json();
-            if (data && typeof data === 'object') applierRef.current(data);
+            if (data && typeof data === 'object') {
+              lastFrameAtRef.current = Date.now();
+              applierRef.current(data);
+            }
           } catch {
             /* host 不在就保持上一次状态 */
           }
@@ -999,6 +1069,33 @@ window.__ModuleLoader__.load({
                     typeof data.native.thresholdRatio === 'number' && Number.isFinite(data.native.thresholdRatio)
                       ? Math.max(0, Math.min(1, data.native.thresholdRatio))
                       : 0.8,
+                  // 0.4 P2-3：真实触发线（thresholdTokens/window）；宿主算不出时为 null。
+                  ratio:
+                    typeof data.native.ratio === 'number' && Number.isFinite(data.native.ratio)
+                      ? Math.max(0, Math.min(1, data.native.ratio))
+                      : null,
+                  thresholdTokens:
+                    typeof data.native.thresholdTokens === 'number' && Number.isFinite(data.native.thresholdTokens)
+                      ? data.native.thresholdTokens
+                      : null,
+                  contextWindow:
+                    typeof data.native.contextWindow === 'number' && Number.isFinite(data.native.contextWindow)
+                      ? data.native.contextWindow
+                      : null,
+                  headroomTokens:
+                    typeof data.native.headroomTokens === 'number' && Number.isFinite(data.native.headroomTokens)
+                      ? data.native.headroomTokens
+                      : null,
+                  // 0.4.1：悬停卡解释「为什么实际触发比配置阈值早」要用到输出预留。
+                  reservedCompletionTokens:
+                    typeof data.native.reservedCompletionTokens === 'number' && Number.isFinite(data.native.reservedCompletionTokens)
+                      ? data.native.reservedCompletionTokens
+                      : null,
+                  overridden: data.native.overridden === true,
+                  route:
+                    data.native.route && typeof data.native.route === 'object' && typeof data.native.route.model === 'string'
+                      ? { provider: String(data.native.route.provider ?? ''), model: data.native.route.model }
+                      : null,
                 }
               : null,
           colors: data.colors && typeof data.colors === 'object' ? data.colors : null,
@@ -1040,8 +1137,12 @@ window.__ModuleLoader__.load({
           if (dead) return;
           streamLiveRef.current = true;
           setStreamLive(true);
+          lastFrameAtRef.current = Date.now();
+          // 0.3.7：刚连上先拉一次，补齐「断开期间错过的帧」（重连场景）。
+          void fetchState();
         };
         source.onmessage = (event) => {
+          lastFrameAtRef.current = Date.now();
           try {
             applyState(JSON.parse(event.data));
           } catch {
@@ -1073,14 +1174,17 @@ window.__ModuleLoader__.load({
       // 兜底轮询：
       //  - 还没就绪（会话刚打开 / 没有 agent）→ 1.5s 快轮询（修「重启后停在上下文未知」）；
       //  - 已就绪但 SSE 没连上 → 5s 轮询兜底；
-      //  - 已就绪且 SSE 活着 → 不主动发请求，只留 5s 计时器。
+      //  - 已就绪且 SSE 活着 → 5s 计时器只检查「帧是否静默超时」；
+      //  - 0.3.7：SSE 活着但 30s 没来帧（远程/代理链路静默挂住）→ 补拉一次，
+      //    修「压缩后远程客户端不刷新、要手动刷新才变」。
       useEffect(() => {
         if (!hasSession) return;
         let timer;
         let dead = false;
         const tick = () => {
           if (dead) return;
-          if (!readyRef.current || !streamLiveRef.current) void fetchState();
+          const sseSilent = streamLiveRef.current && Date.now() - lastFrameAtRef.current > 30000;
+          if (!readyRef.current || !streamLiveRef.current || sseSilent) void fetchState();
           timer = setTimeout(tick, readyRef.current ? 5000 : 1500);
         };
         tick();
@@ -1090,6 +1194,24 @@ window.__ModuleLoader__.load({
         };
       }, [fetchState, hasSession]);
 
+      // 0.3.7：窗口重新可见 / 重新获得焦点 / 网络恢复时拉一次——覆盖「页面被挂起后
+      // 计时器被节流、SSE 断流」的场景（远程客户端切走再切回来也会走到这里）。
+      useEffect(() => {
+        if (!hasSession) return;
+        const refresh = () => {
+          if (typeof document !== 'undefined' && document.visibilityState === 'hidden') return;
+          void fetchState();
+        };
+        document.addEventListener('visibilitychange', refresh);
+        window.addEventListener('focus', refresh);
+        window.addEventListener('online', refresh);
+        return () => {
+          document.removeEventListener('visibilitychange', refresh);
+          window.removeEventListener('focus', refresh);
+          window.removeEventListener('online', refresh);
+        };
+      }, [fetchState, hasSession]);
+
 
       // 点外面 / Esc 关闭菜单、压缩确认卡与交接单面板。
       useEffect(() => {
@@ -1188,7 +1310,7 @@ window.__ModuleLoader__.load({
       // DSH 原生自动压缩线（报警最高阈值）：开着时在环上画一个「径向刻度」（不是沿环的弧），
       // 用紫色 + 主题底色描边——刻意不用五级配色里的颜色，保证在任何分段颜色上都看得清。
       // 越过原生线后：整环红色闪烁（作者 2026-10-20 反馈）。
-      const nativeAuto = state.native !== null && state.native.autoEnabled ? state.native.thresholdRatio : null;
+      const nativeAuto = effectiveNativeRatio(state.native);
       const nativeValid = nativeAuto !== null && nativeAuto > 0.02 && nativeAuto < 1;
       const nativeCrossed = nativeValid && ratio > nativeAuto;
       // 断点缺口：0.9 SVG 单位（≈6.4°），折算成比例；段太短时缺口会吃掉整段，就跳过该段。
@@ -1310,11 +1432,11 @@ window.__ModuleLoader__.load({
       // 配合指示灯呼吸光晕，解决「指示灯太安静、新用户不知道这里有个菜单」。
       // 设置页「再看一次初次引导」按钮通过 window 事件重播（两个组件同页，用事件解耦）。
       const onboardingText = useCallback(() => {
-        const nativeRatio = state.native !== null && state.native.autoEnabled !== false ? state.native.thresholdRatio : null;
+        const nativeRatio = effectiveNativeRatio(state.native);
         const nativePart =
           nativeRatio === null
             ? 'DSH 原生自动压缩已关闭'
-            : `DSH 原生自动压缩线在 ${(nativeRatio * 100).toFixed(0)}%，到那之前先压缩或交接更稳`;
+            : `DSH 原生自动压缩线在 ${(nativeRatio * 100).toFixed(1)}%，到那之前先压缩或交接更稳`;
         return `这是上下文指示灯：点它压缩旧会话、锁定重要消息、交接新会话。${nativePart}。环上的小缺口是我判断「该压缩」的位置（模型判断或到线自动出现）。重要的结论/路径先锁定，压缩时才不会被压掉。`;
       }, [state.native]);
 
@@ -1437,6 +1559,7 @@ window.__ModuleLoader__.load({
         setPreview(null);
         closeDocs();
         closeDiff();
+        setHandoffEditValues({});
         setHandoffPreview({ loading: true });
         const controller = typeof AbortController === 'function' ? new AbortController() : null;
         handoffPreviewAbortRef.current = controller;
@@ -1626,7 +1749,7 @@ window.__ModuleLoader__.load({
       }, [effectiveBusy, sessionId]);
 
       const run = useCallback(
-        async (action) => {
+        async (action, extra) => {
           // A3：确认必须带预览时拿到的 planId，宿主重算不一致会以 changed 拒绝。
           const expected =
             action === 'compact' && preview !== null && preview.loading !== true && typeof preview.data?.planId === 'string'
@@ -1651,6 +1774,8 @@ window.__ModuleLoader__.load({
               body: JSON.stringify({
                 action,
                 ...(expected === undefined ? {} : { expected }),
+                // 0.4 P2-1：`extra.edits` = 只含用户真正改过的「约束/下一步」两段。
+                ...(extra !== undefined && extra !== null && typeof extra === 'object' ? extra : {}),
                 ...(typeof sessionId === 'string' && sessionId.length > 0 ? { sessionId } : {}),
               }),
               ...(controller === null ? {} : { signal: controller.signal }),
@@ -1690,11 +1815,19 @@ window.__ModuleLoader__.load({
         state.compressHint !== null && typeof state.compressHint.ratio === 'number'
           ? `压缩判断点 ${(state.compressHint.ratio * 100).toFixed(0)}%`
           : '';
+      const nativeEffective = effectiveNativeRatio(state.native);
+      const nativeDetail =
+        state.native !== null && state.native.thresholdTokens !== null && state.native.contextWindow !== null
+          ? `（${fmt(state.native.thresholdTokens)} / ${fmt(state.native.contextWindow)}${
+              state.native.route !== null ? `，${state.native.route.provider}/${state.native.route.model}` : ''
+            }${state.native.overridden ? '，按路由覆盖' : ''}）`
+          : '';
+      const nativeInfo = nativeLineInfo(state.native);
       const nativeLineText =
-        state.native !== null && state.native.autoEnabled !== false && typeof state.native.thresholdRatio === 'number'
-          ? `原生自动压缩线 ${(state.native.thresholdRatio * 100).toFixed(0)}%${
-              ratio > state.native.thresholdRatio ? '（已越过：整环红色闪烁）' : ''
-            }`
+        nativeEffective !== null
+          ? `原生自动压缩线 ${(nativeEffective * 100).toFixed(1)}%${nativeDetail}${
+              nativeInfo.differs ? `；${nativeInfo.why}` : ''
+            }${ratio > nativeEffective ? '（已越过：整环红色闪烁）' : ''}`
           : 'DSH 原生自动压缩已关闭';
       const pressureKnown = pressureValue !== null;
       const title =
@@ -2030,6 +2163,12 @@ window.__ModuleLoader__.load({
       const previewRange = preview?.data?.preview ?? null;
       // 0.3.1：范围太小时预览阶段就拦下（服务端已按 800 tokens 判定），不让用户白确认一次。
       const previewTooSmall = previewRange !== null && previewRange.tooSmall === true;
+      // 0.4 P1-1/P1-2：建议锁定候选 + pin 命中数（宿主已算好，客户端只渲染；不自动锁）。
+      const pinSuggest =
+        previewRange !== null && previewRange.pinSuggest !== null && typeof previewRange.pinSuggest === 'object' && Array.isArray(previewRange.pinSuggest.items)
+          ? previewRange.pinSuggest
+          : null;
+      const pinHits = previewRange !== null && previewRange.pinHits !== null && typeof previewRange.pinHits === 'object' ? previewRange.pinHits : null;
       const confirmPanel =
         preview === null
           ? null
@@ -2047,6 +2186,8 @@ window.__ModuleLoader__.load({
                   maxWidth: 'calc(100vw - 16px)',
                   padding: '10px 12px',
                   borderRadius: 12,
+                  maxHeight: 'min(70vh, 440px)',
+                  overflowY: 'auto',
                   ...panelChrome(theme),
                   color: theme.panelFg,
                   zIndex: 42,
@@ -2077,6 +2218,45 @@ window.__ModuleLoader__.load({
                       h('br'),
                       '只估算范围和容量；摘要内容确认后才生成，不在这里展示。压缩后旧会话将替换为摘要，无法还原为原文。',
                     ),
+                    pinSuggest !== null && pinSuggest.items.length > 0
+                      ? h(
+                          'div',
+                          {
+                            'data-cr-pin-suggest': '1',
+                            style: {
+                              display: 'flex',
+                              flexDirection: 'column',
+                              gap: 2,
+                              padding: '6px 8px',
+                              borderRadius: 8,
+                              border: `1px solid ${theme.panelBorder}`,
+                              background: theme.hover,
+                            },
+                          },
+                          h('div', { style: { fontSize: 11, fontWeight: 700, color: theme.panelFg } }, `建议锁定 ${pinSuggest.items.length} 条（先 /pin 再压）`),
+                          ...pinSuggest.items.map((item) =>
+                            h(
+                              'div',
+                              { key: `pin-suggest-${item.seq}`, style: { fontSize: 11, lineHeight: '16px', color: theme.subText } },
+                              `${item.role} · ${item.reason}：${item.snippet}`,
+                            ),
+                          ),
+                          h(
+                            'div',
+                            { style: { fontSize: 10, lineHeight: '14px', color: theme.subText } },
+                            '只建议、不自动锁定；锁定后这些消息会原样保留（/pin list 可按序号挑）。',
+                          ),
+                        )
+                      : null,
+                    pinHits !== null && pinHits.total > 0
+                      ? h(
+                          'div',
+                          { 'data-cr-pin-hits': '1', style: { fontSize: 11, lineHeight: '16px', color: theme.subText } },
+                          pinHits.inRange > 0
+                            ? `pin 命中 ${pinHits.inRange} 条：本次范围里被锁定的消息已跳过（会话共 ${pinHits.total} 条锁定）。`
+                            : `pin 命中 0 条：本次范围内没有锁定消息（会话共 ${pinHits.total} 条锁定，均在范围外）。`,
+                        )
+                      : null,
                     h(
                       'div',
                       { style: { display: 'flex', justifyContent: 'flex-end', gap: 6 } },
@@ -2214,6 +2394,46 @@ window.__ModuleLoader__.load({
                           : handoffDraft,
                       ),
                     ),
+                    // 0.4 P2-1：只允许编辑「约束」「下一步」两段；其余段由模型/程序生成，UI 不给入口。
+                    handoffData !== null && typeof handoffData === 'object' && handoffData.editable !== null && typeof handoffData.editable === 'object'
+                      ? h(
+                          'div',
+                          { 'data-cr-handoff-editable': '1', style: { display: 'flex', flexDirection: 'column', gap: 6 } },
+                          h('div', { style: { fontSize: 11, fontWeight: 600 } }, '可编辑两段（改完点「确认交接」才生效）'),
+                          ...(Array.isArray(handoffData.editable.titles) ? handoffData.editable.titles : []).map((title) => {
+                            const original = typeof handoffData.editable.sections?.[title] === 'string' ? handoffData.editable.sections[title] : '';
+                            return h(
+                              'label',
+                              { key: `handoff-edit-${title}`, style: { display: 'flex', flexDirection: 'column', gap: 3, fontSize: 11 } },
+                              h('span', { style: { color: theme.subText } }, `${title}（留空 = 使用原文）`),
+                              h('textarea', {
+                                'data-cr-handoff-edit': title,
+                                value: typeof handoffEditValues[title] === 'string' ? handoffEditValues[title] : original,
+                                rows: 3,
+                                maxLength: Number.isInteger(handoffData.editable.maxChars) ? handoffData.editable.maxChars : 4000,
+                                onChange: (event) => {
+                                  const value = event.target.value;
+                                  setHandoffEditValues((previous) => ({ ...previous, [title]: value }));
+                                },
+                                style: {
+                                  width: '100%',
+                                  boxSizing: 'border-box',
+                                  resize: 'vertical',
+                                  fontFamily: 'inherit',
+                                  fontSize: 11,
+                                  lineHeight: '16px',
+                                  color: 'inherit',
+                                  background: 'transparent',
+                                  border: `1px solid ${theme.panelBorder}`,
+                                  borderRadius: 6,
+                                  padding: '4px 6px',
+                                },
+                              }),
+                            );
+                          }),
+                          h('div', { style: { fontSize: 10, lineHeight: '14px', color: theme.subText } }, handoffData.editable.note ?? '程序生成的段不可改。'),
+                        )
+                      : null,
                     h('div', { style: { fontSize: 11, color: theme.subText } }, '确认后会先压缩旧会话，再按压缩后的历史生成最终交接单；预览不落盘。'),
                     h(
                       'div',
@@ -2234,8 +2454,18 @@ window.__ModuleLoader__.load({
                           type: 'button',
                           'data-cr-handoff-run': '1',
                           onClick: () => {
+                            // P2-1：只把「用户真的改过、且非空」的两段发给宿主；空值/未改 = 用重新生成的原文。
+                            const editable = handoffData !== null && typeof handoffData === 'object' ? handoffData.editable : null;
+                            const edits = {};
+                            if (editable !== null && typeof editable === 'object' && Array.isArray(editable.titles)) {
+                              for (const title of editable.titles) {
+                                const original = typeof editable.sections?.[title] === 'string' ? editable.sections[title].trim() : '';
+                                const current = typeof handoffEditValues[title] === 'string' ? handoffEditValues[title].trim() : '';
+                                if (current.length > 0 && current !== original) edits[title] = current;
+                              }
+                            }
                             closeHandoffPreview();
-                            void run('handoff');
+                            void run('handoff', Object.keys(edits).length > 0 ? { edits } : undefined);
                           },
                           style: {
                             border: 'none',
@@ -2837,6 +3067,8 @@ window.__ModuleLoader__.load({
       const [native, setNative] = useState(null);
       /** UI-002：设置文件路径（「关于与危险操作」区块展示）。 */
       const [settingsPath, setSettingsPath] = useState('');
+      /** 0.4 P1-3：轻账本累计数字（独立账本文件算出来的；null = 没有数据/读不到，显示引导文案）。 */
+      const [ledger, setLedger] = useState(null);
       const [confirmNative, setConfirmNative] = useState(null); // null | 'disable' | 'enable'
       const [nativeBusy, setNativeBusy] = useState(false);
       /** UI-003：结果提示就地显示在开关旁（以前只写页面底部，用户看不到）。 */
@@ -2844,22 +3076,78 @@ window.__ModuleLoader__.load({
       /** 作者 2026-10-20：设置页「再看一次初次引导」的就地提示。 */
       const [onboardingNotice, setOnboardingNotice] = useState(null);
       const nativeConfirmRef = useRef(null);
+      /**
+       * 0.4 P0-2：诊断信息（只在本机生成；可预览/复制，插件不会把它发到任何地方）。
+       * diagData 是端点返回的 {schema,version,generatedAt,markdown,json,issueUrl}。
+       */
+      const [diagData, setDiagData] = useState(null);
+      const [diagLoading, setDiagLoading] = useState(false);
+      const [diagOpen, setDiagOpen] = useState(false);
+      /** 弹层顶部说明卡：只在本会话第一次生成时出现一次。 */
+      const [diagIntroSeen, setDiagIntroSeen] = useState(false);
+      const [diagStatus, setDiagStatus] = useState(null);
+      /** 复制/打开结果的小 toast 计时器（A4：成功与失败都要有 toast 反馈）。 */
+      const diagToastTimer = useRef(null);
+
+      /** 就地提示 + 4.2 秒后自动消失的 toast。 */
+      const flashDiagStatus = useCallback((next) => {
+        setDiagStatus(next);
+        if (diagToastTimer.current !== null) clearTimeout(diagToastTimer.current);
+        diagToastTimer.current = setTimeout(() => setDiagStatus(null), 4200);
+      }, []);
+
+      useEffect(
+        () => () => {
+          if (diagToastTimer.current !== null) clearTimeout(diagToastTimer.current);
+        },
+        [],
+      );
+
+      /** 0.4.1：设置接口只给「配置阈值」，实际触发线要从 state 接口补（同一套 readState 数据）。 */
+      const nativeLineExtra = useRef(null);
+      const mergeNative = useCallback((view) => {
+        if (view === null || view === undefined) return null;
+        const extra = nativeLineExtra.current;
+        return extra === null ? view : { ...view, ...extra };
+      }, []);
 
       /** 把服务端返回的 view 落到表单：同时更新「已保存」快照和设置文件错误。 */
       const applyLoaded = useCallback((data) => {
         setForm(data.config);
         setSavedSnapshot(JSON.stringify(data.config));
         setSettingsError(data.settingsError ?? null);
-        setNative(data.native && typeof data.native === 'object' ? data.native : null);
+        setNative(mergeNative(data.native && typeof data.native === 'object' ? data.native : null));
         if (typeof data.version === 'string') setVersion(data.version);
         if (typeof data.path === 'string') setSettingsPath(data.path);
-      }, []);
+        setLedger(data.ledger !== null && typeof data.ledger === 'object' ? data.ledger : null);
+      }, [mergeNative]);
 
       const load = useCallback(async () => {
         try {
-          const res = await fetch('/api/compact-relay-settings', { cache: 'no-store' });
-          const data = await res.json().catch(() => ({}));
-          if (!res.ok || data.ok === false) throw new Error(data && data.message ? String(data.message) : '读取设置失败');
+          const [settingsRes, stateRes] = await Promise.all([
+            fetch('/api/compact-relay-settings', { cache: 'no-store' }),
+            fetch('/api/compact-relay-state', { cache: 'no-store' }).catch(() => null),
+          ]);
+          const data = await settingsRes.json().catch(() => ({}));
+          if (!settingsRes.ok || data.ok === false) throw new Error(data && data.message ? String(data.message) : '读取设置失败');
+          // 0.4.1：补上实际触发线相关字段（配置接口没有这些，只有 state 接口有）。
+          let extra = null;
+          if (stateRes !== null && stateRes.ok) {
+            const stateData = await stateRes.json().catch(() => ({}));
+            const sn = stateData !== null && stateData.native !== null && typeof stateData.native === 'object' ? stateData.native : null;
+            if (sn !== null) {
+              extra = {
+                ratio: typeof sn.ratio === 'number' ? sn.ratio : null,
+                thresholdTokens: typeof sn.thresholdTokens === 'number' ? sn.thresholdTokens : null,
+                contextWindow: typeof sn.contextWindow === 'number' ? sn.contextWindow : null,
+                reservedCompletionTokens: typeof sn.reservedCompletionTokens === 'number' ? sn.reservedCompletionTokens : null,
+                headroomTokens: typeof sn.headroomTokens === 'number' ? sn.headroomTokens : null,
+                overridden: sn.overridden === true,
+                route: sn.route !== null && typeof sn.route === 'object' ? sn.route : null,
+              };
+            }
+          }
+          nativeLineExtra.current = extra;
           applyLoaded(data);
           setStatus(null);
         } catch (error) {
@@ -2957,6 +3245,77 @@ window.__ModuleLoader__.load({
         }
       }, [confirmNative]);
 
+      /**
+       * 0.4 P0-2：生成诊断信息。
+       *
+       * 唯一的网络调用是同源只读 GET（`/api/compact-relay-diagnostics`，仅此一次）；
+       * 产物由宿主生成（白名单 + 已脱敏），这里只负责展示/复制。
+       */
+      const generateDiagnostics = useCallback(
+        async ({ openPreview = true } = {}) => {
+          if (diagLoading) return null;
+          setDiagLoading(true);
+          setDiagStatus(null);
+          try {
+            const res = await fetch('/api/compact-relay-diagnostics', { cache: 'no-store' });
+            const data = await res.json().catch(() => ({}));
+            if (!res.ok || data.ok === false) throw new Error(data && data.message ? String(data.message) : '生成失败');
+            setDiagData(data);
+            if (openPreview) setDiagOpen(true);
+            return data;
+          } catch (error) {
+            setDiagStatus({ error: true, text: `生成失败：${error && error.message ? error.message : '未知错误'}` });
+            return null;
+          } finally {
+            setDiagLoading(false);
+          }
+        },
+        [diagLoading],
+      );
+
+      /** 「打开问题报告页」：没生成就先生成，再打开宿主拼好的短字段 URL（不碰诊断正文）。 */
+      const openIssueReport = useCallback(async () => {
+        let data = diagData;
+        if (data === null || typeof data.issueUrl !== 'string') data = await generateDiagnostics({ openPreview: false });
+        if (data === null || typeof data.issueUrl !== 'string') return;
+        try {
+          window.open(data.issueUrl, '_blank', 'noopener');
+        } catch {
+          flashDiagStatus({ error: true, text: '打开问题报告页失败：新窗口被浏览器拦截了' });
+        }
+      }, [diagData, generateDiagnostics, flashDiagStatus]);
+
+      /** 复制 Markdown / JSON：统一走 navigator.clipboard?.writeText，失败就地提示。 */
+      const copyDiagnostics = useCallback(
+        (format) => {
+          if (diagData === null) {
+            flashDiagStatus({ error: true, text: '还没有可复制的诊断信息，请先生成' });
+            return;
+          }
+          const text =
+            format === 'json' ? JSON.stringify(diagData.json, null, 2) : typeof diagData.markdown === 'string' ? diagData.markdown : '';
+          if (typeof text !== 'string' || text.length === 0) {
+            flashDiagStatus({ error: true, text: '还没有可复制的诊断信息，请先生成' });
+            return;
+          }
+          const done = () => flashDiagStatus({ text: '已复制诊断信息（脱敏）' });
+          const failed = () => flashDiagStatus({ error: true, text: '复制失败：浏览器不允许访问剪贴板，可手动选中预览文本' });
+          try {
+            const written = navigator.clipboard?.writeText(text);
+            if (written !== undefined && typeof written.then === 'function') written.then(done, failed);
+            else done();
+          } catch {
+            failed();
+          }
+        },
+        [diagData, flashDiagStatus],
+      );
+
+      const closeDiagnosticsPreview = useCallback(() => {
+        setDiagOpen(false);
+        setDiagIntroSeen(true);
+      }, []);
+
       if (form === null) {
         return h(
           'div',
@@ -2969,11 +3328,30 @@ window.__ModuleLoader__.load({
       const compactPercent = percent(form.thresholds.compactRatio);
       const handoffPercent = percent(form.thresholds.handoffRatio);
       const count = (value) => (Number.isFinite(value) ? value : 0);
+      // 0.4 P1-3：轻账本一行累计数字（只读；数据来自宿主账本，与账本文件同源）。
+      const ledgerLine = (() => {
+        if (ledger === null) return '累计：暂无记录（完成一次压缩/交接后开始统计）';
+        const freed = count(ledger.freedTokens);
+        const freedText = freed >= 1_000_000 ? `${(freed / 1_000_000).toFixed(1)}M` : freed >= 1000 ? `${(freed / 1000).toFixed(1)}K` : String(freed);
+        const avg = ledger.avgDurationMs !== null && Number.isFinite(ledger.avgDurationMs) ? `${(ledger.avgDurationMs / 1000).toFixed(1)}s` : '—';
+        return `累计：已压缩 ${count(ledger.compactCount)} 次 · 交接 ${count(ledger.handoffCount)} 次 · 腾出约 ${freedText} tokens · 平均耗时 ${avg}`;
+      })();
 
       const autoOnNative = native !== null && native.autoEnabled !== false;
-      const nativePercent = native !== null && typeof native.thresholdRatio === 'number' ? Math.round(native.thresholdRatio * 100) : 80;
+      // 0.4.1：配置阈值（thresholdRatio）只是理论上限；实际触发线由宿主按 token 预算算。
+      const nativeInfo = nativeLineInfo(native);
+      const nativePercent = nativeInfo.configured !== null ? Math.round(nativeInfo.configured * 100) : 80;
+      const nativeCapRatio = nativeInfo.effective !== null ? nativeInfo.effective : nativeInfo.configured !== null ? nativeInfo.configured : 0.8;
+      // 交接线可设上限：按实际触发线向下取整，输入框 max 与 onChange 用同一个数。
+      const nativeCapPercent = Math.max(5, Math.floor(nativeCapRatio * 100 - 1));
+      // 原生压缩已关闭时 effective/percentText 为空：回落到「开启后实际会触发多少」，再回落配置阈值。
+      const nativeActualText = nativeInfo.percentText !== '' ? nativeInfo.percentText : nativeInfo.actualText !== '' ? nativeInfo.actualText : nativeInfo.configuredText !== null ? nativeInfo.configuredText : String(nativePercent);
+      const handoffOverNative = nativeInfo.effective !== null && form !== null && typeof form.thresholds === 'object' && typeof form.thresholds.handoffRatio === 'number' && form.thresholds.handoffRatio > nativeInfo.effective + 1e-9;
+      const handoffNativeWarning = handoffOverNative ? `当前交接线 ${Math.round(form.thresholds.handoffRatio * 100)}% 高于原生实际触发线 ${nativeInfo.percentText}%：DSH 会先自己压历史，这条提醒可能来不及。建议调到 ${nativeInfo.percentText}% 以下（改完立即生效）。` : '';
       const previewLight = paletteForScheme(form.colors, 'light');
       const previewDark = paletteForScheme(form.colors, 'dark');
+      // 0.4 P0-2：诊断预览弹层复用指示灯那套浮层材质（15-shared.panelChrome）。
+      const theme = detectTheme();
       const banner = settingsError === null ? null : h(
         'div',
         { style: { marginBottom: 14, padding: '8px 10px', borderRadius: 6, border: '1px solid var(--dsw-alias-state-warning-primary, #d97706)', background: 'var(--dsw-alias-bg-layer-2, rgba(127,127,127,0.08))' } },
@@ -3041,19 +3419,19 @@ window.__ModuleLoader__.load({
           settingsRow(
             '交接提醒线',
             '到这条线内圆亮红点，菜单建议「交接新会话」。',
-            '调高 → 更晚换会话、单会话更久；调低 → 更早换会话、单会话更短。必须大于压缩线。',
+            `调高 → 更晚换会话、单会话更久；调低 → 更早换会话、单会话更短。必须大于压缩线。${handoffNativeWarning}`,
             h('div', { style: { display: 'flex', alignItems: 'center', gap: 8 } },
               h('input', {
                 type: 'number',
                 min: 5,
-                max: native !== null && native.autoEnabled !== false ? Math.max(5, Math.round(native.thresholdRatio * 100) - 1) : 99,
+                max: native !== null && native.autoEnabled !== false ? nativeCapPercent : 99,
                 step: 1,
                 value: handoffPercent,
                 'aria-label': '交接提醒线（百分比）',
                 style: { ...settingsInputStyle, width: 90 },
                 onChange: (event) => {
                   const raw = Math.max(0.05, Number(event.target.value) / 100);
-                  const cap = native !== null && native.autoEnabled !== false ? Math.max(0.05, native.thresholdRatio - 0.01) : 0.99;
+                  const cap = native !== null && native.autoEnabled !== false ? nativeCapPercent / 100 : 0.99;
                   patch(['thresholds', 'handoffRatio'], Math.min(cap, raw));
                 },
               }),
@@ -3106,10 +3484,10 @@ window.__ModuleLoader__.load({
             native === null
               ? '正在读取 DSH 配置…'
               : autoOnNative
-                ? `当前开启：容量到 ${nativePercent}% 时，DSH 会自己把历史压成摘要（不读本插件的锁定）。`
+                ? `当前开启：容量到 ${nativeActualText}% 时，DSH 会自己把历史压成摘要（不读本插件的锁定）。`
                 : '当前已关闭：DSH 不再自动压历史，只有你主动压缩/交接才会动历史。',
             autoOnNative
-              ? `开启时：容量到 ${nativePercent}% DSH 会自己压历史（不读锁定）；关闭后：只在你主动压缩/交接时才动历史。`
+              ? `开启时：容量到 ${nativeActualText}% DSH 会自己压历史（不读锁定）；关闭后：只在你主动压缩/交接时才动历史。${nativeInfo.differs ? `（${nativeInfo.why}）` : ''}`
               : '开启后：DSH 会在容量到原生阈值时自动压历史，可能压掉锁定的消息；本插件的提醒照常。',
             h(
               'div',
@@ -3156,7 +3534,13 @@ window.__ModuleLoader__.load({
                 }),
               ),
               h('span', { style: { fontSize: 12, fontWeight: 600, minWidth: 44 } }, native === null ? '读取中…' : nativeBusy ? '处理中…' : autoOnNative ? '已开启' : '已关闭'),
-              h('span', { style: settingsHintStyle }, native !== null ? `原生阈值 ${nativePercent}%` : ''),
+              h('span', { style: settingsHintStyle }, native !== null
+                ? (nativeInfo.autoOff
+                  ? (nativeInfo.actualText !== ''
+                    ? `原生阈值 配置 ${nativeInfo.configuredText ?? nativePercent}%（已关闭；开启后实际触发 ${nativeInfo.actualText}%）`
+                    : `原生阈值 配置 ${nativeInfo.configuredText ?? nativePercent}%（已关闭）`)
+                  : (nativeInfo.differs ? `原生阈值 配置 ${nativeInfo.configuredText}%（实际触发 ${nativeInfo.percentText}%）` : `原生阈值 ${nativeActualText}%`))
+                : ''),
               nativeStatus === null
                 ? null
                 : h(
@@ -3193,9 +3577,9 @@ window.__ModuleLoader__.load({
                   { style: { ...settingsHintStyle, marginBottom: 8 } },
                   confirmNative === 'disable'
                     ? `操作内容：在 DSH profile 的 cordis.patch.yml 里把 compaction-basic 的 auto 改为 false（写前备份原文件，可回滚）。` +
-                      `改变：DSH 不再在容量到 ${nativePercent}% 时自动压缩历史；锁定的消息不会被压掉；本插件的提醒和手动压缩照常。需要重启 DSH 生效。`
+                      `改变：DSH 不再在容量到 ${nativeActualText}% 时自动压缩历史；锁定的消息不会被压掉；本插件的提醒和手动压缩照常。需要重启 DSH 生效。`
                     : `操作内容：在 DSH profile 的 cordis.patch.yml 里把 compaction-basic 的 auto 改回 true（写前备份，可回滚）。` +
-                      `改变：DSH 重新在容量到 ${nativePercent}% 时自动压历史，可能压掉锁定的消息。需要重启 DSH 生效。`,
+                      `改变：DSH 重新在容量到 ${nativeActualText}% 时自动压历史，可能压掉锁定的消息。需要重启 DSH 生效。`,
                 ),
                 h(
                   'div',
@@ -3383,13 +3767,15 @@ window.__ModuleLoader__.load({
               { ratio: compactRatio + 0.08, hint: null, title: '进入压缩区', text: '琥珀：建议压缩旧会话' },
               { ratio: handoffRatio + 0.15, hint: null, title: '越过交接线', text: '红：建议交接新会话' },
             ];
-            if (native !== null && native.autoEnabled !== false) {
+            if (native !== null && native.autoEnabled !== false && nativeInfo.effective !== null) {
               legend.push({
-                ratio: native.thresholdRatio + 0.06,
+                ratio: Math.min(0.95, nativeInfo.effective + 0.06),
                 hint: null,
-                nativeAt: native.thresholdRatio,
+                nativeAt: nativeInfo.effective,
                 title: '原生自动压缩线',
-                text: `${Math.round(native.thresholdRatio * 100)}%：DSH 会自己压历史（越过整环红色闪烁）`,
+                text: nativeInfo.differs
+                  ? `实际 ${nativeInfo.percentText}%：DSH 会自己压历史（配置阈值 ${nativeInfo.configuredText}%，越过整环红色闪烁）`
+                  : `${nativeInfo.percentText}%：DSH 会自己压历史（越过整环红色闪烁）`,
               });
             }
             return h(
@@ -3448,12 +3834,60 @@ window.__ModuleLoader__.load({
             // 2026-10-20：0.3.1 已发布到 npm，帮助区直接给包页面入口。
             githubLink('npm 包页面', 'https://www.npmjs.com/package/dsh-compact-relay', ''),
           ),
+          // 0.4 P0-2：诊断信息 —— 本机生成、白名单、已脱敏；只提供「生成/预览/复制」。
+          h(
+            'div',
+            { style: { marginBottom: 18, paddingTop: 12, borderTop: '1px dashed var(--dsw-alias-border-l2, rgba(127,127,127,0.25))' }, 'data-cr-diagnostics': '1' },
+            h('div', { style: { fontSize: 13, fontWeight: 600, marginBottom: 4 } }, '诊断信息'),
+            h('p', { style: { ...settingsHintStyle, margin: '0 0 2px' } }, '只在本机生成，不会自动外发；生成后可以先预览，再决定把哪部分粘贴到哪里。'),
+            h(
+              'p',
+              { style: settingsHintStyle },
+              '内容只有版本、平台、配置数值、状态摘要、计数、耗时与错误码；不含聊天内容、摘要、交接单正文、文件路径、用户名、会话 id、密钥或 cookie。',
+            ),
+            h(
+              'div',
+              { style: { display: 'flex', alignItems: 'center', gap: 8, flexWrap: 'wrap', marginTop: 8 } },
+              h(
+                'button',
+                {
+                  type: 'button',
+                  'data-cr-diagnostics-generate': '1',
+                  style: settingsButtonStyle,
+                  disabled: diagLoading,
+                  onClick: () => void generateDiagnostics(),
+                },
+                diagLoading ? '生成中…' : '生成并预览',
+              ),
+              h(
+                'button',
+                { type: 'button', 'data-cr-diagnostics-issue': '1', style: settingsButtonStyle, onClick: () => void openIssueReport() },
+                '打开问题报告页',
+              ),
+              diagStatus === null
+                ? null
+                : h(
+                    'span',
+                    {
+                      'data-cr-diagnostics-status': diagStatus.error ? 'error' : 'ok',
+                      style: {
+                        fontSize: 11,
+                        lineHeight: '16px',
+                        color: diagStatus.error ? 'var(--dsw-alias-state-error-primary, #D92D20)' : 'var(--dsw-alias-state-success-primary, #15803D)',
+                      },
+                    },
+                    diagStatus.text,
+                  ),
+            ),
+            h('p', { style: { ...settingsHintStyle, marginTop: 6 } }, 'issue 页是公开的；粘贴前请自己再看一眼。'),
+          ),
         ),
         sectionHeading('关于与危险操作'),
         h(
           'div',
           { style: { display: 'flex', flexDirection: 'column', paddingLeft: 16, borderLeft: '1px solid var(--dsw-alias-border-l2, rgba(127,127,127,0.2))' }, 'data-cr-group': '关于与危险操作' },
           h('p', { style: settingsHintStyle }, `版本：${version || '—'}`),
+          h('p', { style: settingsHintStyle, 'data-cr-ledger': '1' }, ledgerLine),
           h('p', { style: settingsHintStyle }, `设置文件：${settingsPath || '—'}`),
           h('p', { style: { ...settingsHintStyle, marginTop: 8 } }, '输入框左侧的上下文指示灯：看容量、提醒压缩/交接、锁住重要消息；到线了用 /bc 或 /handoff，重要内容用 /pin 锁住。'),
           h('p', { style: settingsHintStyle }, '遇到 bug 或想提改进：走上面「帮助」里的 GitHub Issues；也欢迎直接发邮件。'),
@@ -3470,8 +3904,151 @@ window.__ModuleLoader__.load({
                 )
               : h('button', { type: 'button', style: settingsButtonStyle, disabled: saving, onClick: () => setConfirmReset(true) }, '恢复默认'),
           ),
-        )
-
+        ),
+        // 0.4 P0-2：诊断信息预览弹层（只读等宽文本 + 复制 Markdown/JSON）。
+        // 只有用户点了「生成并预览」/「打开问题报告页」才会出现；关掉后本次会话不再显示首次说明卡。
+        diagOpen && diagData !== null
+          ? h(
+              'div',
+              {
+                'data-cr-diagnostics-modal': '1',
+                style: {
+                  position: 'fixed',
+                  inset: 0,
+                  zIndex: 60,
+                  display: 'flex',
+                  alignItems: 'center',
+                  justifyContent: 'center',
+                  padding: 24,
+                  background: 'rgba(0,0,0,0.36)',
+                },
+              },
+              h(
+                'div',
+                {
+                  role: 'dialog',
+                  'aria-modal': 'true',
+                  'aria-label': '诊断信息预览（脱敏）',
+                  style: {
+                    ...panelChrome(theme),
+                    display: 'flex',
+                    flexDirection: 'column',
+                    width: '100%',
+                    maxWidth: 760,
+                    maxHeight: '80vh',
+                    borderRadius: 12,
+                    padding: '14px 16px',
+                  },
+                },
+                h(
+                  'div',
+                  { style: { display: 'flex', alignItems: 'center', justifyContent: 'space-between', gap: 12 } },
+                  h('div', { style: { fontSize: 13, fontWeight: 700, color: 'var(--dsw-alias-label-primary, inherit)' } }, '诊断信息预览（脱敏）'),
+                  h('button', { type: 'button', style: settingsButtonStyle, onClick: closeDiagnosticsPreview }, '关闭'),
+                ),
+                diagIntroSeen
+                  ? null
+                  : h(
+                      'div',
+                      {
+                        style: {
+                          marginTop: 10,
+                          padding: '8px 10px',
+                          borderRadius: 8,
+                          border: '1px solid var(--dsw-alias-border-secondary, rgba(127,127,127,0.25))',
+                          background: 'var(--dsw-alias-bg-layer-1, rgba(127,127,127,0.06))',
+                        },
+                      },
+                      h('div', { style: { fontSize: 12, fontWeight: 600, marginBottom: 4 } }, '第一次生成：先看三点'),
+                      h(
+                        'p',
+                        { style: settingsHintStyle },
+                        '① 只在本机生成，插件不会自己发到任何地方；② 只有数值、枚举与错误码，不含聊天内容与文件路径；③ issue 页是公开的，粘贴前请自己再看一眼。',
+                      ),
+                    ),
+                h(
+                  'pre',
+                  {
+                    'data-cr-diagnostics-preview': '1',
+                    'aria-label': '诊断信息 Markdown 预览（只读）',
+                    style: {
+                      flex: 1,
+                      minHeight: 120,
+                      overflow: 'auto',
+                      margin: '10px 0',
+                      padding: 10,
+                      borderRadius: 8,
+                      border: '1px solid var(--dsw-alias-border-l2, rgba(127,127,127,0.2))',
+                      background: 'var(--dsw-alias-bg-layer-1, rgba(127,127,127,0.06))',
+                      color: 'inherit',
+                      fontFamily: 'ui-monospace, SFMono-Regular, Menlo, Consolas, monospace',
+                      fontSize: 11,
+                      lineHeight: '16px',
+                      whiteSpace: 'pre-wrap',
+                      wordBreak: 'break-word',
+                      userSelect: 'text',
+                    },
+                  },
+                  typeof diagData.markdown === 'string' && diagData.markdown.length > 0 ? diagData.markdown : '（没有内容）',
+                ),
+                h(
+                  'div',
+                  { style: { display: 'flex', alignItems: 'center', gap: 8, flexWrap: 'wrap' } },
+                  h(
+                    'button',
+                    { type: 'button', 'data-cr-diagnostics-copy': 'markdown', style: settingsButtonStyle, onClick: () => copyDiagnostics('markdown') },
+                    '复制 Markdown',
+                  ),
+                  h(
+                    'button',
+                    { type: 'button', 'data-cr-diagnostics-copy': 'json', style: settingsButtonStyle, onClick: () => copyDiagnostics('json') },
+                    '复制 JSON',
+                  ),
+                  h('span', { style: settingsHintStyle }, 'issue 是公开的；粘贴前请自己再看一眼。'),
+                  diagStatus === null
+                    ? null
+                    : h(
+                        'span',
+                        {
+                          'data-cr-diagnostics-copy-status': diagStatus.error ? 'error' : 'ok',
+                          style: {
+                            fontSize: 11,
+                            lineHeight: '16px',
+                            color: diagStatus.error
+                              ? 'var(--dsw-alias-state-error-primary, #D92D20)'
+                              : 'var(--dsw-alias-state-success-primary, #15803D)',
+                          },
+                        },
+                        diagStatus.text,
+                      ),
+                ),
+              ),
+            )
+          : null,
+        // A4：复制/打开结果的短 toast（成功与失败都提示；自动消失，不挡操作）。
+        diagStatus === null
+          ? null
+          : h(
+              'div',
+              {
+                'data-cr-diagnostics-toast': diagStatus.error ? 'error' : 'ok',
+                role: 'status',
+                style: {
+                  ...panelChrome(theme),
+                  position: 'fixed',
+                  right: 24,
+                  bottom: 24,
+                  zIndex: 70,
+                  maxWidth: 360,
+                  padding: '8px 12px',
+                  borderRadius: 8,
+                  fontSize: 12,
+                  lineHeight: '17px',
+                  color: diagStatus.error ? 'var(--dsw-alias-state-error-primary, #D92D20)' : 'var(--dsw-alias-label-primary, inherit)',
+                },
+              },
+              diagStatus.text,
+            ),
       );
     }