dsh-codinput 0.3.8 → 0.4.0

package/src/client/prefs.ts

@@ -1,5 +1,7 @@
 /** 偏好存储：localStorage 持久化（技术决策：无宿主往返，升级宿主不影响）。 */
 
+import { isValidHotkey, normalizeHotkey } from './hotkey';
+
 /** 快捷键组合：规范化串（如 "mod+enter"、"ctrl+shift+k"），见 hotkey.ts。 */
 export type Hotkey = string;
 
@@ -21,6 +23,13 @@ export interface CodinputPrefs {
   userMarkdown: boolean;
   /** 显示行号（当前行与行号高亮常开）。 */
   lineNumbers: boolean;
+  /**
+   * Markdown 正文等宽连字字体（方案 A）：预览与用户消息的正文改用
+   * 'JetBrains Mono' 等宽连字字体，`->` / `=>` / `//` 等靠字体 calt/liga 连字
+   * 显示成箭头/连字（DOM 文本仍是原文，不做字符替换）。只影响 Markdown 显示面；
+   * 编辑器输入框保持字面（桌面 Chromium 152 的 CM 连字 shaping bug）。默认开。
+   */
+  markdownMono: boolean;
   /** 编辑器字体（默认 JetBrains Mono）。 */
   fontFamily: string;
   /** 发送快捷键（任意组合，默认 Cmd/Ctrl+Enter）。 */
@@ -47,6 +56,7 @@ export const DEFAULT_PREFS: CodinputPrefs = {
   enabled: true,
   userMarkdown: true,
   lineNumbers: true,
+  markdownMono: true,
   fontFamily: "'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace",
   sendHotkey: 'mod+enter',
   lineBreakHotkey: 'enter',
@@ -62,43 +72,216 @@ export const DEFAULT_PREFS: CodinputPrefs = {
 
 // v2：旧版（已移除的 v0.1.0）遗留的 'dsh-codinput.prefs' 形状不同且可能
 // enabled:false——换键避免被旧数据劫持接管开关。
-const KEY = 'dsh-codinput.prefs.v2';
+// v3：v2 清理 + 字段归一化迁移（B1/B2：坏 `shift-enter` 修复、旧字段删除）。
+// 此前曾把 `fontLigatures` 默认改为 true 并在 v3 里持久化；后续
+// **移除了字体连字功能**（桌面 Chromium 152 的 calt shaping bug 无法稳定规避），
+// 该字段从 v3 起被忽略、下次保存时自动丢弃；此处保留 v3 键名避免无谓地
+// 重放迁移。
+const KEY = 'dsh-codinput.prefs.v3';
+const LEGACY_KEY = 'dsh-codinput.prefs.v2';
 const PERM_KEY = 'dsh-codinput.permission-applied';
 
+/**
+ * 已废弃的旧字段：迁移时只读一次，随后从存储对象删除（B2）。留着它们
+ * 会让每次加载都重新迁移，把用户后来改过的快捷键覆盖回旧值。
+ * - `sendKey`：两态快捷键时代的发送键（'enter' | 'mod-enter'）；
+ * - `lineBreakKey`：同代换行键（当前无迁移值，仅随旧对象删除）；
+ * - `floating`：两态入口时代的悬浮标记（true → mode:'float'）。
+ */
+const LEGACY_KEYS = ['sendKey', 'lineBreakKey', 'floating'] as const;
+
+/** 数值字段允许区间：与 UI 的拖拽/缩放夹取一致，兼作脏数据兜底。 */
+const BODY_HEIGHT_MIN = 96;
+const BODY_HEIGHT_MAX = 4000;
+const FLOAT_W_MIN = 360;
+const FLOAT_H_MIN = 140;
+const FLOAT_SIZE_MAX = 10000;
+const FLOAT_POS_MAX = 100000;
+const FONT_FAMILY_MAX = 256;
+
 const listeners = new Set<() => void>();
 
+function isRecord(value: unknown): value is Record<string, unknown> {
+  return typeof value === 'object' && value !== null && !Array.isArray(value);
+}
+
+/** 布尔字段：缺失/非布尔回退默认。 */
+function readBoolean(value: unknown, fallback: boolean): boolean {
+  return typeof value === 'boolean' ? value : fallback;
+}
+
+/** 旧版组合串分隔符 `-` → 规范 `+`（B1：'shift-enter' → 'shift+enter'）。 */
+function repairHotkey(value: unknown): unknown {
+  if (typeof value !== 'string') return value;
+  const combo = value.trim();
+  return /^[a-z0-9]+(?:-[a-z0-9]+)+$/i.test(combo) ? combo.replace(/-/g, '+') : combo;
+}
+
+/** 快捷键字段：修复旧分隔符 → basic 校验 → 规范化；不合法回退默认。 */
+function readHotkey(value: unknown, fallback: Hotkey): Hotkey {
+  const repaired = repairHotkey(value);
+  return isValidHotkey(repaired) ? normalizeHotkey(repaired) : fallback;
+}
+
+/** 正数区间字段：非有限数/非正数、越界 → 夹取或 null。 */
+function readPositive(value: unknown, min: number, max: number): number | null {
+  if (typeof value !== 'number' || !Number.isFinite(value)) return null;
+  const rounded = Math.round(value);
+  if (rounded <= 0) return null;
+  return Math.min(max, Math.max(min, rounded));
+}
+
+/** 视口坐标字段：非有限数/负数 → null；其余夹取上限。 */
+function readPosition(value: unknown): number | null {
+  if (typeof value !== 'number' || !Number.isFinite(value)) return null;
+  const rounded = Math.round(value);
+  if (rounded < 0) return null;
+  return Math.min(FLOAT_POS_MAX, rounded);
+}
+
+/**
+ * 任意来源（localStorage / 调用方 patch）→ 合法 CodinputPrefs（B3）：
+ * 每个字段独立做类型/枚举/范围校验，缺失或脏值逐项回退默认；未知字段丢弃。
+ * 任意输入都不抛错；同时是「存储只写已知字段」的唯一出口（B2）。
+ */
+export function normalizePrefs(input: unknown): CodinputPrefs {
+  const raw = isRecord(input) ? input : {};
+  const prefs: CodinputPrefs = { ...DEFAULT_PREFS };
+
+  prefs.enabled = readBoolean(raw['enabled'], DEFAULT_PREFS.enabled);
+  prefs.userMarkdown = readBoolean(raw['userMarkdown'], DEFAULT_PREFS.userMarkdown);
+  prefs.lineNumbers = readBoolean(raw['lineNumbers'], DEFAULT_PREFS.lineNumbers);
+  // markdownMono 新字段：老用户存储里没有该键 → 合并式读取自动落到默认 true（v3 不升键）。
+  prefs.markdownMono = readBoolean(raw['markdownMono'], DEFAULT_PREFS.markdownMono);
+  const fontFamily = typeof raw['fontFamily'] === 'string' ? raw['fontFamily'].trim() : '';
+  if (fontFamily.length > 0 && fontFamily.length <= FONT_FAMILY_MAX) prefs.fontFamily = fontFamily;
+
+  prefs.sendHotkey = readHotkey(raw['sendHotkey'], DEFAULT_PREFS.sendHotkey);
+  prefs.lineBreakHotkey = readHotkey(raw['lineBreakHotkey'], DEFAULT_PREFS.lineBreakHotkey);
+  if (prefs.sendHotkey === prefs.lineBreakHotkey) {
+    // 冲突（含被写坏成同一键）：两枚都回退默认，保证 send ≠ lineBreak。
+    prefs.sendHotkey = DEFAULT_PREFS.sendHotkey;
+    prefs.lineBreakHotkey = DEFAULT_PREFS.lineBreakHotkey;
+  }
+
+  const defaultEdit = readBoolean(raw['defaultEdit'], DEFAULT_PREFS.defaultEdit);
+  const defaultPreview = readBoolean(raw['defaultPreview'], DEFAULT_PREFS.defaultPreview);
+  if (defaultEdit || defaultPreview) {
+    prefs.defaultEdit = defaultEdit;
+    prefs.defaultPreview = defaultPreview;
+  }
+
+  prefs.composerBodyHeight = readPositive(raw['composerBodyHeight'], BODY_HEIGHT_MIN, BODY_HEIGHT_MAX);
+  const mode = raw['mode'];
+  prefs.mode =
+    mode === 'float' || mode === 'normal' ? mode : raw['floating'] === true ? 'float' : DEFAULT_PREFS.mode;
+  prefs.floatX = readPosition(raw['floatX']);
+  prefs.floatY = readPosition(raw['floatY']);
+  prefs.floatW = readPositive(raw['floatW'], FLOAT_W_MIN, FLOAT_SIZE_MAX);
+  prefs.floatH = readPositive(raw['floatH'], FLOAT_H_MIN, FLOAT_SIZE_MAX);
+  return prefs;
+}
+
+/**
+ * 一次性迁移旧字段（B1/B2）：
+ * - `sendKey === 'enter'`（旧版 Enter 发送）→ send 'enter' + 换行 'shift+enter'
+ *   （旧代码错写成 'shift-enter'，分隔符不是 '+'，导致 Shift+Enter 换行失效）；
+ * - `sendKey` 为 mod-enter/ctrl-enter → 即新默认（Mod+Enter 发送、Enter 换行）；
+ * - 只有目标快捷键缺失/非法时才用旧值迁移：用户已经改过的新字段优先；
+ * - 迁移后删除全部旧字段，存储里不再有旧键，后续加载不会再被迁移逻辑覆盖。
+ */
+function migrateLegacy(raw: Record<string, unknown>): Record<string, unknown> {
+  if (!LEGACY_KEYS.some((key) => Object.prototype.hasOwnProperty.call(raw, key))) return raw;
+  const next: Record<string, unknown> = { ...raw };
+  const legacySend = typeof next['sendKey'] === 'string' ? next['sendKey'].trim().toLowerCase() : undefined;
+  if (next['mode'] !== 'float' && next['mode'] !== 'normal' && next['floating'] === true) {
+    next['mode'] = 'float';
+  }
+  if (!isValidHotkey(next['sendHotkey'])) {
+    if (legacySend === 'enter') {
+      next['sendHotkey'] = 'enter';
+      next['lineBreakHotkey'] = 'shift+enter';
+    } else if (
+      legacySend === 'mod-enter' ||
+      legacySend === 'mod+enter' ||
+      legacySend === 'ctrl-enter' ||
+      legacySend === 'ctrl+enter'
+    ) {
+      next['sendHotkey'] = 'mod+enter';
+      next['lineBreakHotkey'] = 'enter';
+    }
+  }
+  for (const key of LEGACY_KEYS) delete next[key];
+  return next;
+}
+
+/** 存储写/删的安全包装：返回是否成功（迁移删 v2 依赖写成功判断）。 */
+function safeSet(key: string, value: string): boolean {
+  try {
+    window.localStorage.setItem(key, value);
+    return true;
+  } catch {
+    return false;
+  }
+}
+
+function safeRemove(key: string): void {
+  try {
+    window.localStorage.removeItem(key);
+  } catch {
+    /* 删除失败无妨：新键已优先 */
+  }
+}
+
+/** 存储文本 → 合法偏好（坏 JSON/未知键/旧字段一并归一化，不写回）。 */
+function decodePrefs(raw: string): CodinputPrefs {
+  let parsed: unknown = null;
+  try {
+    parsed = JSON.parse(raw);
+  } catch {
+    /* 坏 JSON：按全默认处理 */
+  }
+  return normalizePrefs(isRecord(parsed) ? migrateLegacy(parsed) : null);
+}
+
+/**
+ * 读取偏好：任何脏数据（坏 JSON、错误类型、未知键、越界值）都不抛错，
+ * 全部逐字段归一化回退默认（B3）。迁移/修复/清脏后与规范化文本不一致时
+ * 一次性写回（B2：旧字段删除、坏值修复、未知键不出现在存储里）；之后的
+ * 加载 raw 与 canonical 相同，不再重复写入。
+ *
+ * v3 优先。v3 缺失而 v2 存在时做一次性升级迁移（v2 时代的坏值/旧字段在这里
+ * 归一化清理）：归一化后写 v3，只有 v3 写成功才删 v2——写失败时保留 v2 兜底，
+ * 下次加载重试。
+ */
 export function loadPrefs(): CodinputPrefs {
   try {
     const raw = window.localStorage.getItem(KEY);
-    if (!raw) return { ...DEFAULT_PREFS };
-    const parsed = JSON.parse(raw);
-    const merged: CodinputPrefs = { ...DEFAULT_PREFS, ...(parsed && typeof parsed === 'object' ? parsed : null) };
-    const legacy = parsed as { sendKey?: string; lineBreakKey?: string; mode?: unknown; floating?: boolean };
-    // 旧字段迁移：sendKey('mod-enter'|'enter') → sendHotkey/lineBreakHotkey。
-    if (legacy.sendKey === 'enter') {
-      merged.sendHotkey = 'enter';
-      merged.lineBreakHotkey = 'shift-enter';
+    if (raw !== null) {
+      const prefs = decodePrefs(raw);
+      const canonical = JSON.stringify(prefs);
+      if (raw !== canonical) safeSet(KEY, canonical);
+      return prefs;
     }
-    // 旧字段迁移：两态模型时代的 floating:true → mode:'float'。
-    merged.mode =
-      legacy.mode === 'float' || legacy.mode === 'normal'
-        ? legacy.mode
-        : legacy.floating === true
-          ? 'float'
-          : 'normal';
-    return merged;
+    const legacyRaw = window.localStorage.getItem(LEGACY_KEY);
+    if (legacyRaw === null) return { ...DEFAULT_PREFS };
+    const prefs = decodePrefs(legacyRaw);
+    const canonical = JSON.stringify(prefs);
+    if (safeSet(KEY, canonical)) safeRemove(LEGACY_KEY);
+    return prefs;
   } catch {
     return { ...DEFAULT_PREFS };
   }
 }
 
+/**
+ * 保存偏好：先与当前值合并再做同一套归一化（B3），只序列化已知字段（B2），
+ * 写入 v3。v3 写成功后再清掉可能残留的 v2（迁移写失败后由保存补上的场景；
+ * 写失败则保留 v2 兜底）。
+ */
 export function savePrefs(patch: Partial<CodinputPrefs>): CodinputPrefs {
-  const next = { ...loadPrefs(), ...patch };
-  try {
-    window.localStorage.setItem(KEY, JSON.stringify(next));
-  } catch {
-    /* 存储不可用时仅内存生效 */
-  }
+  const next = normalizePrefs({ ...loadPrefs(), ...(isRecord(patch) ? patch : {}) });
+  if (safeSet(KEY, JSON.stringify(next))) safeRemove(LEGACY_KEY);
   for (const fn of listeners) fn();
   return next;
 }

package/src/client/settings.tsx

@@ -109,7 +109,8 @@ function Selector(props: {
   const { value, options, onChange, ariaLabel } = props;
   const [open, setOpen] = useState(false);
   const btnRef = useRef<HTMLButtonElement | null>(null);
-  const [anchor, setAnchor] = useState<{ left: number; top: number; right: number; bottom: number } | null>(null);
+  const [anchor, setAnchor] = useState<HTMLElement | null>(null);
+  const [anchorRect, setAnchorRect] = useState<{ left: number; top: number; right: number; bottom: number } | null>(null);
   const current = options.find((o) => o.value === value);
   return (
     <>
@@ -121,7 +122,11 @@ function Selector(props: {
         aria-expanded={open}
         aria-label={ariaLabel}
         onClick={() => {
-          if (!open) setAnchor(btnRef.current?.getBoundingClientRect() ?? null);
+          if (!open) {
+            const el = btnRef.current ?? null;
+            setAnchor(el);
+            setAnchorRect(el ? el.getBoundingClientRect() : null);
+          }
           setOpen(!open);
         }}
       >
@@ -129,7 +134,7 @@ function Selector(props: {
         <IconChevronOfficial size={14} />
       </button>
       {open && anchor ? (
-        <MenuSurface anchor={anchor} side="bottom" alignEnd onClose={() => setOpen(false)} minWidth={200}>
+        <MenuSurface anchor={anchor} initialRect={anchorRect} side="bottom" alignEnd onClose={() => setOpen(false)} minWidth={200}>
           {options.map((opt) => (
             <button
               key={opt.value}
@@ -186,6 +191,13 @@ export function CodinputSettingsSection(): JSX.Element {
       <Row title={t("set.lineNumbers")} desc={t("set.lineNumbersDesc")}>
         <Switch on={prefs.lineNumbers} label={t("set.lineNumbers")} onToggle={() => update({ lineNumbers: !prefs.lineNumbers })} />
       </Row>
+      <Row title={t("set.markdownMono")} desc={t("set.markdownMonoDesc")}>
+        <Switch
+          on={prefs.markdownMono}
+          label={t("set.markdownMono")}
+          onToggle={() => update({ markdownMono: !prefs.markdownMono })}
+        />
+      </Row>
       <Row title={t("set.font")} desc={t("set.fontDesc")}>
         <input
           type="text"

package/src/client/stats.ts

@@ -157,30 +157,90 @@ export function deriveChatStats(nodes: unknown): ChatStats | undefined {
   return { turns: turns.size, steps, llmMs, toolMs, ttftMs, ttftSteps, decodeMs, decodeTokens };
 }
 
-/** 官方 formatTokensPerSecond：≥10 取整，<10 保留 1 位小数。 */
-export function formatTokensPerSecond(tps: number): string {
+/** 官方 formatTokensPerSecond：≥10 取整，<10 保留 1 位小数；NaN/Infinity → null。 */
+export function formatTokensPerSecond(tps: number): string | null {
+  if (!Number.isFinite(tps)) return null;
   const clamped = Math.max(0, tps);
   return clamped >= 10 ? String(Math.round(clamped)) : String(Math.round(clamped * 10) / 10);
 }
 
+/** 官方 roundedPercentUnits：把缓存占比四舍五入到精确百分比单位（正半分进位）。 */
+function roundedPercentUnits(cacheReadTokens: number, promptTokens: number, decimalPlaces: number): number {
+  const scale = (decimalPlaces === 0 ? 1 : 10) * 100;
+  const doubledScale = scale * 2;
+  const denominatorQuotient = Math.floor(promptTokens / doubledScale);
+  const denominatorRemainder = promptTokens % doubledScale;
+  let lower = 0;
+  let upper = scale;
+  while (lower < upper) {
+    const candidate = Math.floor((lower + upper + 1) / 2);
+    const factor = candidate * 2 - 1;
+    if (
+      cacheReadTokens >=
+      factor * denominatorQuotient + Math.ceil((factor * denominatorRemainder) / doubledScale)
+    ) {
+      lower = candidate;
+    } else {
+      upper = candidate - 1;
+    }
+  }
+  return lower;
+}
+
+/** 官方 displayPercentUnits：0 位 → 整数；>0 位 → 整数 + 一位小数（官方只支持 0/1）。 */
+function displayPercentUnits(units: number, decimalPlaces: number): string {
+  if (decimalPlaces === 0) return String(units);
+  const whole = Math.floor(units / 10);
+  const tenths = units % 10;
+  return tenths === 0 ? String(whole) : `${whole}.${tenths}`;
+}
+
 /**
- * 官方 formatCacheHitPercent 语义：整除 100 → "100"；整数舍入 <100 → 整数；
- * 否则递增小数位直到舍入仍 <100（99.9 / 99.99 …）。
+ * 官方 formatCacheHitPercent 完整算法（0.2.2-rc.1）：无计费输入 → null；
+ * 全命中 → "100"；整数舍入仍 <100 → 整数文本；否则按官方「区分精度」规则
+ * 返回 99.9…（不把部分命中断章取义成 99.99 或 100）。NaN/Infinity → null。
+ *
+ * @param decimalPlaces 官方只使用 0 / 1 两档；非 0 一律按 1 位处理。
  */
-export function formatCacheHitPercent(cacheReadTokens: number, promptTokens: number): string | null {
-  if (promptTokens <= 0) return null;
-  if (cacheReadTokens >= promptTokens) return '100';
-  for (let places = 0; places < 20; places++) {
-    const factor = 10 ** places;
-    const rounded = Math.round((cacheReadTokens / promptTokens) * 100 * factor) / factor;
-    if (rounded < 100) return places === 0 ? String(rounded) : rounded.toFixed(places);
+export function formatCacheHitPercent(
+  cacheReadTokens: number,
+  promptTokens: number,
+  decimalPlaces = 0,
+): string | null {
+  if (!Number.isFinite(cacheReadTokens) || !Number.isFinite(promptTokens)) return null;
+  const prompt = Math.trunc(promptTokens);
+  if (prompt <= 0) return null;
+  // 计数应为整数；脏值截断并夹到 [0, prompt]，保证算法整数语义且不越界。
+  const cacheRead = Math.min(Math.max(0, Math.trunc(cacheReadTokens)), prompt);
+  const missedInputTokens = prompt - cacheRead;
+  if (missedInputTokens === 0) return '100';
+  const places = decimalPlaces === 0 ? 0 : 1;
+  const roundedUnits = roundedPercentUnits(cacheRead, prompt, places);
+  if (roundedUnits < (places === 0 ? 100 : 1e3)) return displayPercentUnits(roundedUnits, places);
+  let distinguishingPlaces = 1;
+  let scaledDoubleGap = missedInputTokens * 200;
+  const denominatorTens = Math.floor(prompt / 10);
+  while (scaledDoubleGap <= denominatorTens) {
+    scaledDoubleGap *= 10;
+    distinguishingPlaces += 1;
   }
-  return '99.99';
+  const denominatorOnes = prompt % 10;
+  let roundedLoss = 5;
+  for (let loss = 1; loss < 5; loss += 1) {
+    const factor = loss * 2 + 1;
+    const threshold = factor * denominatorTens + Math.floor((factor * denominatorOnes) / 10);
+    if (scaledDoubleGap <= threshold) {
+      roundedLoss = loss;
+      break;
+    }
+  }
+  return `99.${'9'.repeat(distinguishingPlaces - 1)}${10 - roundedLoss}`;
 }
 
-/** 官方 formatDuration：<60s 一位小数秒，否则 分+秒。 */
-export function formatDuration(ms: number): string {
-  const s = ms / 1000;
+/** 官方 formatDuration：<60s 一位小数秒，否则 分+秒；NaN/Infinity → null。 */
+export function formatDuration(ms: number): string | null {
+  if (!Number.isFinite(ms)) return null;
+  const s = Math.max(0, ms) / 1000;
   if (s < 60) return `${Math.round(s * 10) / 10}s`;
   const whole = Math.round(s);
   return `${Math.floor(whole / 60)}分${whole % 60}秒`;
@@ -260,11 +320,23 @@ function readTurnsSteps(k2: unknown, k3: unknown): ChatStats | undefined {
   return pick(k2) ?? pick(k3);
 }
 
-/** 官方 formatTokens：<1e3 原值，否则 K/M（≥100 取整、<100 一位小数）。 */
-export function formatTokens(tokens: number): string {
+/**
+ * 官方紧凑 token 文本（517 / 12.2K / 1.2M，本地文案后缀 " tok"）：
+ * <1e3 原值；<1e6 用 K（≥100 取整、<100 一位小数）；≥1e6 用 M。
+ * K 位舍入到 1000 时进位到 M，永远不出现 "1000K"（如 999_950 → "1M"）。
+ * NaN/Infinity 不渲染（返回 null）。
+ */
+export function formatTokens(tokens: number): string | null {
+  if (!Number.isFinite(tokens)) return null;
+  const value = Math.max(0, tokens);
   const scaled = (candidate: number): string =>
     candidate >= 100 ? String(Math.round(candidate)) : String(Math.round(candidate * 10) / 10);
-  if (tokens < 1e3) return `${tokens} tok`;
-  if (tokens < 1e6) return `${scaled(tokens / 1e3)}K tok`;
-  return `${scaled(tokens / 1e6)}M tok`;
+  if (value < 1e3) return `${String(value)} tok`;
+  if (value < 1e6) {
+    const thousands = value / 1e3;
+    const roundedK = thousands >= 100 ? Math.round(thousands) : Math.round(thousands * 10) / 10;
+    if (roundedK < 1e3) return `${String(roundedK)}K tok`;
+    return `${scaled(value / 1e6)}M tok`;
+  }
+  return `${scaled(value / 1e6)}M tok`;
 }

package/src/client/styles.ts

@@ -8,6 +8,9 @@
  * 写死保持逐值对齐——多跟一分就会在换肤下与官方脱队。
  */
 
+import { markdownStyles } from './markdown';
+import { heavyMarkdownStyles } from './markdown/heavy';
+
 const STYLE_ID = 'dsh-codinput-styles';
 
 const CSS = `
@@ -69,40 +72,49 @@ const CSS = `
 .dci-pos { position: absolute; right: 10px; bottom: 6px; font-size: 11px; color: var(--dsw-alias-label-caption, currentColor); opacity: 0.75;
   pointer-events: none; font-variant-numeric: tabular-nums; z-index: 3; }
 
-.dci-preview { flex: 1 1 100%; min-width: 0; box-sizing: border-box; overflow-y: auto; padding: 8px 14px 10px; font-size: 13px; line-height: 1.65; }
-.dci-preview h1, .dci-preview h2, .dci-preview h3, .dci-preview h4 { margin: 0.7em 0 0.35em; line-height: 1.3; }
-.dci-preview h1 { font-size: 1.35em; } .dci-preview h2 { font-size: 1.2em; } .dci-preview h3 { font-size: 1.08em; }
-.dci-preview p { margin: 0.45em 0; } .dci-preview ul, .dci-preview ol { margin: 0.45em 0; padding-left: 1.5em; }
-.dci-preview code { font-family: inherit; background: color-mix(in srgb, currentColor 9%, transparent);
-  border-radius: 4px; padding: 0.1em 0.35em; font-size: 0.92em; }
-.dci-preview pre { background: color-mix(in srgb, currentColor 7%, transparent); border-radius: 8px;
-  padding: 10px 12px; overflow-x: auto; } .dci-preview pre code { background: transparent; padding: 0; }
-.dci-preview blockquote { margin: 0.5em 0; padding: 0.1em 0.9em; border-left: 3px solid color-mix(in srgb, currentColor 22%, transparent); opacity: 0.85; }
-.dci-preview table { border-collapse: collapse; margin: 0.6em 0; }
-.dci-preview th, .dci-preview td { border: 1px solid color-mix(in srgb, currentColor 18%, transparent); padding: 4px 9px; }
-/* 预览链接走官方 markdown 同款 alias-link token（官方 _markdown_ a 逐值核对）。 */
-.dci-preview a { color: var(--dsw-alias-link, #4c8dff); } .dci-preview img { max-width: 100%; } .dci-preview hr { border: none;
-  border-top: 1px solid color-mix(in srgb, currentColor 14%, transparent); }
-
-/* ===== 工具行（官方 InputBar .row / .tools / .trailing）===== */
-.dci-row { flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px; min-width: 0; padding: 2px 8px 6px; display: flex; }
-.dci-tools { align-items: center; min-width: 0; gap: 12px; display: flex; }
-.dci-trailing { align-items: center; flex: none; min-width: 0; gap: 12px; margin-left: auto; display: flex; }
+/* Markdown 排版（.dci-preview 预览排版 + .dci-md 扩展块）已迁到
+   src/client/markdown/styles.ts，由本文件末尾拼接 markdownStyles 注入。 */
+
+/* ===== 工具行（官方 0.2.2 InputBar .row / .tools / .modes / .trailing 逐值）=====
+   row 兼作容器查询容器（官方 container-type:inline-size）：模型紧凑态、权限
+   触发器 @container (width<=460px) 收起标签等官方子组件规则都按行宽求值。
+   --dci-model-icon = 官方 primitives IconDataOutlineRegular（regular 描边 1、
+   viewBox 16、fill+stroke 双 path，逐字取自宿主 app.asar 的 icon 表）。 */
+.dci-row { flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px; min-width: 0; padding: 2px 8px 6px;
+  display: flex; container-type: inline-size;
+  --dci-model-icon: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2016%2016'%20fill%3D'none'%20stroke-width%3D'1'%3E%3Cpath%20d%3D'M7.8667%200.349609C8.96906%200.349634%2010.0601%200.481272%2011.0317%200.735352C11.9973%200.987845%2012.8453%201.362%2013.4644%201.84766C14.0744%202.32629%2014.507%202.95539%2014.5161%203.69336H14.5171V8.53516C14.0843%208.32076%2013.6108%208.17679%2013.1108%208.11816C13.1831%207.96848%2013.2162%207.82856%2013.2163%207.70312V5.76758C12.6269%206.16618%2011.8739%206.47995%2011.0317%206.7002C10.0602%206.95423%208.96896%207.08494%207.8667%207.08496C6.76461%207.08493%205.67411%206.95415%204.70264%206.7002C3.85994%206.48006%203.10694%206.1662%202.51709%205.76758V7.70312L2.521%207.78418C2.56374%208.19554%202.93361%208.74414%203.91357%209.23145C4.9281%209.73585%206.35004%2010.0371%207.8667%2010.0371C8.26373%2010.0371%208.6543%2010.0141%209.03271%209.97461C8.75596%2010.3799%208.54664%2010.8349%208.42041%2011.3232C8.23666%2011.3313%208.0518%2011.3369%207.8667%2011.3369C6.20108%2011.3369%204.57025%2011.01%203.33447%2010.3955C3.04163%2010.2499%202.76658%2010.0836%202.51709%209.90039V11.6738C2.51728%2012.1379%202.88589%2012.7556%203.92236%2013.292C4.93457%2013.8157%206.35342%2014.1289%207.8667%2014.1289C8.12318%2014.1289%208.37694%2014.1161%208.62646%2014.0986C8.82021%2014.5535%209.08999%2014.9682%209.41943%2015.3271C8.91285%2015.3934%208.39149%2015.4287%207.8667%2015.4287C6.19761%2015.4287%204.56379%2015.0869%203.32568%2014.4463C2.11244%2013.8185%201.21649%2012.8562%201.21631%2011.6738V3.76367C1.21595%203.74853%201.21438%203.733%201.21436%203.71777C1.21436%202.96917%201.65103%202.33053%202.26807%201.84668C2.88747%201.36112%203.73675%200.987685%204.70264%200.735352C5.67413%200.481376%206.76457%200.349636%207.8667%200.349609ZM7.8667%201.65039C6.86269%201.65042%205.88326%201.77028%205.03076%201.99316C4.17183%202.2176%203.50421%202.52956%203.06982%202.87012C2.65043%203.19909%202.52622%203.48898%202.51709%203.69336V3.74414C2.52719%203.94845%202.65185%204.23772%203.06982%204.56543C3.50425%204.90601%204.17172%205.21795%205.03076%205.44238C5.88326%205.66527%206.8627%205.78513%207.8667%205.78516C8.8707%205.78513%209.85015%205.66525%2010.7026%205.44238C11.5611%205.21787%2012.2286%204.9049%2012.6626%204.56445C13.0982%204.22252%2013.2163%203.9231%2013.2163%203.71777L13.2104%203.63574C13.1818%203.43623%2013.044%203.16941%2012.6626%202.87012C12.2286%202.52957%2011.5614%202.21773%2010.7026%201.99316C9.85009%201.77025%208.8708%201.65041%207.8667%201.65039Z'%20fill%3D'%23fff'%2F%3E%3Cpath%20d%3D'M12.8936%2010.0361L13.2061%2010.5566C13.2296%2010.5959%2013.2651%2010.6562%2013.3027%2010.707C13.3469%2010.7666%2013.4148%2010.8431%2013.5195%2010.9023C13.6244%2010.9617%2013.725%2010.9801%2013.7988%2010.9873C13.8619%2010.9934%2013.9318%2010.9932%2013.9775%2010.9932H14.6162L14.8896%2011.4502L14.5947%2011.9443C14.5698%2011.9859%2014.5312%2012.0483%2014.5029%2012.1084C14.4781%2012.1611%2014.4514%2012.2312%2014.4395%2012.3164L14.4326%2012.4072L14.4395%2012.4971C14.4514%2012.5825%2014.4781%2012.6532%2014.5029%2012.7061C14.5312%2012.7661%2014.5689%2012.8287%2014.5938%2012.8701L14.8896%2013.3633L14.6162%2013.8213H13.9775C13.9318%2013.8213%2013.8619%2013.821%2013.7988%2013.8271C13.7433%2013.8326%2013.6728%2013.8442%2013.5967%2013.875L13.5195%2013.9121C13.4148%2013.9714%2013.3469%2014.0478%2013.3027%2014.1074C13.265%2014.1583%2013.2296%2014.2186%2013.2061%2014.2578L12.8936%2014.7783H12.3115L11.999%2014.2578C11.9755%2014.2186%2011.9401%2014.1583%2011.9023%2014.1074C11.8693%2014.0628%2011.823%2014.0083%2011.7578%2013.959L11.6855%2013.9121L11.6074%2013.875C11.5316%2013.8445%2011.4615%2013.8325%2011.4062%2013.8271C11.3432%2013.821%2011.2733%2013.8213%2011.2275%2013.8213H10.5889L10.3135%2013.3633L10.6104%2012.8701C10.6352%2012.8287%2010.6739%2012.7661%2010.7021%2012.7061C10.7352%2012.6357%2010.7724%2012.534%2010.7725%2012.4072C10.7724%2012.2804%2010.7352%2012.1788%2010.7021%2012.1084C10.6739%2012.0483%2010.6353%2011.9859%2010.6104%2011.9443L10.3135%2011.4502L10.5889%2010.9932H11.2275C11.2733%2010.9932%2011.3432%2010.9934%2011.4062%2010.9873C11.4801%2010.9801%2011.5808%2010.9616%2011.6855%2010.9023C11.7903%2010.843%2011.8582%2010.7666%2011.9023%2010.707C11.94%2010.6562%2011.9755%2010.5959%2011.999%2010.5566L12.3115%2010.0361H12.8936Z'%20stroke%3D'%23fff'%20stroke-miterlimit%3D'10'%2F%3E%3C%2Fsvg%3E"); }
+/* 官方 data-model-compact（observeControlRow）：隐藏模型文字/强度，显示图标。 */
+.dci-row[data-model-compact] .dci-trigger[data-model] .dci-triggerLabel,
+.dci-row[data-model-compact] .dci-trigger[data-model] .dci-triggerEffort { display: none; }
+.dci-row[data-model-compact] .dci-trigger[data-model]::before { content: ''; flex: none; width: 16px; height: 16px;
+  background-color: currentColor; -webkit-mask: var(--dci-model-icon) center / 16px 16px no-repeat;
+  mask: var(--dci-model-icon) center / 16px 16px no-repeat; }
+.dci-tools, .dci-modes, .dci-trailing { align-items: center; min-width: 0; display: flex; }
+.dci-tools, .dci-modes { gap: 12px; }
+.dci-trailing { flex: none; gap: 12px; margin-left: auto; }
+@container (max-width: 560px) { .dci-tools, .dci-modes, .dci-trailing { gap: 8px; } }
+/* 官方 [hidden] 兜底：.tools/.standardControls 的 display:flex 是类选择器，
+   会盖过 UA 的 [hidden]{display:none}，官方 CSS 显式补同款规则。 */
+.dci-tools[hidden], .dci-standard-controls[hidden] { display: none; }
+.dci-trailing-active { flex: 1; margin-left: 0; }
 
 /* ===== 语音输入座位（官方 .standardControls / .activity / .activityExpanded）=====
    按钮本体是官方 activity 槽位条目组件（Gyyz9a_* 样式由语音插件自带注入）；
-   这里只负责座位：展开时 capture 行接管整行、左侧工具与模型控件让位。 */
+   这里只负责座位：展开时 capture 行接管整行、左侧工具与模型控件让位
+   （官方 hidden 属性隐藏，见 Toolbar）。
+   注意：官方 renderSlot 即使槽位无占用者也会输出 data-slot 包装（display:contents），
+   所以官方 .activity 永远不会命中 :empty ——实测（0.2.2 隔离宿主）无 voice 时
+   activity 是 display:flex 的 0×0 flex item，仍占一个 row gap（官方 trailing=306.6；
+   若隐藏则 294.6，少 12px）。因此这里不能加 :empty{display:none}；「旧宿主没有
+   该槽位」的情况由 Toolbar 用 useSlotDeclaration 决定是否渲染座位。 */
 .dci-standard-controls { align-items: center; min-width: 0; gap: 12px; display: flex; }
 .dci-voice-seat { flex: none; align-items: center; display: flex; }
-.dci-voice-seat:empty { display: none; }
-.dci-row[data-voice-active] .dci-tools, .dci-row[data-voice-active] .dci-standard-controls { display: none; }
-.dci-row[data-voice-active] .dci-trailing { flex: 1; margin-left: 0; }
-.dci-row[data-voice-active] .dci-voice-seat { flex: 1; min-width: 0; }
+.dci-voice-seat-expanded { flex: 1; min-width: 0; }
 
 /* 圆形图标按钮（官方 .add）*/
 .dci-add { background: var(--dsw-specific-selector, color-mix(in srgb, currentColor 8%, transparent));
   width: 28px; height: 28px; color: var(--dsw-alias-label-primary, currentColor); cursor: pointer; border: none;
-  border-radius: 999px; flex: none; place-items: center; display: grid; }
+  border-radius: 999px; corner-shape: round; flex: none; place-items: center; display: grid; }
 .dci-add:hover:not(:disabled) { background: var(--dsw-alias-interactive-bg-hover-solid, color-mix(in srgb, currentColor 14%, transparent)); }
 .dci-add:disabled { opacity: 0.5; cursor: default; }
 
@@ -125,10 +137,15 @@ const CSS = `
 
 /* 发送（官方 .primary）*/
 .dci-send { background: var(--dsw-alias-button-info-fill, color-mix(in srgb, currentColor 85%, transparent)); color: #fff; cursor: pointer;
-  border: none; border-radius: 999px; flex: none; place-items: center; width: 34px; height: 34px;
+  border: none; border-radius: 999px; corner-shape: round; flex: none; place-items: center; width: 34px; height: 34px;
   transition: background-color 0.1s; display: grid; transform: translateY(-2px); }
 .dci-send:hover:not(:disabled) { background: var(--dsw-alias-button-info-hover, color-mix(in srgb, currentColor 70%, transparent)); }
 .dci-send:disabled { opacity: 0.4; cursor: default; }
+/* 官方 .primary[data-sending]:disabled —— sending spinner 态不降透明度、光标 progress。 */
+.dci-send[data-sending]:disabled { opacity: 1; cursor: progress; }
+.dci-sending-spinner { animation: 0.8s linear infinite dci-input-sending; }
+@media (prefers-reduced-motion: reduce) { .dci-sending-spinner { animation-duration: 2.4s; } }
+@keyframes dci-input-sending { to { transform: rotate(360deg); } }
 
 /* ===== 菜单（官方 primitives Menu / ModelSelect .menu 逐值复刻：r20 卡片 / item r10 / 上方弹出）
    卡片 overflow:hidden + max-height:min(360px,100vh-96px)（官方 .menu 同款），
@@ -168,6 +185,11 @@ const CSS = `
   max-height: 400px; box-shadow: var(--dsw-elevation-prominent, 0 10px 34px rgba(0, 0, 0, 0.35));
   border: 0; border-radius: var(--dsw-radius-lg, 20px); flex-direction: column; padding: 4px; display: flex; position: absolute;
   bottom: calc(100% + 4px); left: 0; right: 0; overflow: hidden; }
+/* dropdown（侧栏/悬浮形态）：portal 到 body 的自适应浮层——位置/宽度/最大高度由
+   SlashMenu 量卡片（.dci-card）与视口后内联注入；fixed 不受面板/卡片裁剪，层级盖过
+   悬浮卡（.dci-float z-index:940）但低于模态/灯箱（1000）。normal 形态仍走上面的
+   卡片顶锚定 absolute 规则，几何不变。 */
+.dci-slash-menu[data-dropdown] { position: fixed; z-index: 950; left: auto; right: auto; top: auto; bottom: auto; }
 .dci-slash-viewport { flex-direction: column; min-height: 0; display: flex; overflow-y: auto; }
 .dci-slash-item { cursor: pointer; width: 100%; min-height: 34px; color: var(--dsw-alias-label-primary, inherit);
   text-align: left; background: transparent; border: none; border-radius: var(--dsw-radius-md, 10px); align-items: center; gap: 6px;
@@ -391,8 +413,8 @@ button.dci-attach-body { color: inherit; font: inherit; text-align: left; backgr
 .dci-surface[data-side] .dci-body { flex: 1 1 auto; max-height: none; min-height: 0; }
 .dci-surface[data-side] .dci-row { padding: 6px 8px;
   border-top: 0.5px solid var(--dsw-alias-border-l1, transparent); }
-/* 候选菜单向下弹出（侧栏/悬浮形态：头部行下方），留在卡片边界内不被裁剪。 */
-.dci-surface[data-side] .dci-slash-menu, .dci-surface[data-float] .dci-slash-menu { bottom: auto; }
+/* 候选菜单的 side/float 形态已改为 portal 自适应浮层（见 .dci-slash-menu[data-dropdown]），
+   不再挂在 surface 下，故此处不再需要布局覆盖。 */
 
 /* ===== 设置分区（官方 T1PP 行结构 + 控件样式）===== */
 .dci-settings { display: flex; flex-direction: column; font-size: 14px; color: inherit; }
@@ -641,7 +663,10 @@ button.dci-attach-body { color: inherit; font: inherit; text-align: left; backgr
   border-radius: var(--dsw-radius-sm); padding: 0 5px; }
 .dci-umsg-md :where(h1, h2, h3, h4, h5, h6) code { font: inherit; font-family: var(--ds-font-family-code); }
 .dci-umsg-md input[type='checkbox'] { margin: 0 8px 0 0; accent-color: var(--dsw-alias-label-secondary); }
-.dci-umsg-md img { display: block; width: auto; max-width: 100%; height: auto; margin: 0;
+/* 用户消息图片：width 由统一管线按 Obsidian 尺寸语法（![alt|120](url)）写成
+   width 属性；这里不能写 width:auto（CSS 会覆盖 presentational hint，尺寸语法
+   在用户消息侧失效）。只保留 max-width 约束，未带 width 的图片行为不变。 */
+.dci-umsg-md img { display: block; max-width: 100%; height: auto; margin: 0;
   border-radius: var(--dsw-radius-md); background: var(--dsw-alias-bg-base); object-fit: contain; }
 .dci-umsg-tscroll { max-width: 100%; overflow-x: auto; overscroll-behavior-x: contain; }
 .dci-umsg-tscroll table { border-collapse: collapse; width: max-content; max-width: max-content; }
@@ -665,7 +690,7 @@ button.dci-umsg-chip:hover, button.dci-umsg-chip:focus { outline: none; text-dec
 button.dci-umsg-chip:focus-visible { box-shadow: 0 0 0 2px var(--dsw-focus-ring-color, var(--dsw-alias-state-business-primary)); }
 .dci-umsg-chip[data-chip="slash"] { font-family: var(--dsw-font-markdown-code-font-family); }
 .dci-umsg-chipicon { width: 1em; height: 1em; margin-right: 4px; vertical-align: -0.125em; }
-`;
+` + markdownStyles + heavyMarkdownStyles;
 
 export function injectStyles(): void {
   const el = document.getElementById(STYLE_ID);