dsh-wisp 1.30.0 → 1.31.0

package/README.md

@@ -448,6 +448,66 @@ node tools/audit-log.mjs --confirm <manifest>     # 生成后：并入代理登
 
 ## 变更
 
+### 1.31.0
+
+**菜单重做。** 上一版只是"把 19 个条目收进三个分组" —— 那是分类，不是交互设计。
+这一版按交互本身重做。
+
+**问题（先认下来）**：
+
+- 信息和动作混在一起：「关于她…」「动作一览…」「版本与更新」和「专注 25 分钟」并列，
+  而版本号在「关于她」里还有一份 —— 同一件事出现在两个地方；
+- 三个分组**只看得到名字**：收起时不知道里面是什么、当前是什么状态；
+- 开关是「✓ 自己溜达」这种**带勾的文字**，而且点完菜单就关 —— 拨开关时菜单消失是最烦人的交互之一；
+- 「放大一点／缩小一点」把**连续量**做成了两个离散按钮；
+- 四个角落是四个**文字条目** —— 空间的事没有用空间的形式表达；
+- 最常用的「专注」埋在二级；专注中菜单里**看不出还剩多久**；
+- 7 行长得一模一样，没有分隔、没有层次、没有键盘提示。
+
+**现在**：
+
+```
+DeepSeek娘                          ← 头部：名字 + 版本 + 当前皮肤 +（专注中）
+v1.31.0 · 深海女仆
+─────────────────────────────
+专注 25 分钟                        ← 常用动作置顶；进行中时这一行就是状态 + 结束
+专注 45 分钟
+─────────────────────────────
+外观                 深海女仆 ▸     ← 摘要行：收起时也知道里面是什么、现在是什么
+行为                   4/5 开 ▸
+位置                 右下角 ▸
+大小   ──────●──────   100%        ← 滑块：拖动即时改；键盘 ←→ 各 0.25 档
+─────────────────────────────
+动作一览…
+关于她…                             ← 检查更新移到这里（版本号已在头部）
+─────────────────────────────
+先躲起来
+↑↓ 选择 · ←→ 调大小 · Esc 关闭
+```
+
+- **开关是真开关**：`role="menuitemcheckbox"` + `aria-checked` + 可见的滑轨，
+  点完**不关菜单**，原地更新（摘要里的「N/M 开」也跟着变）；
+- **大小是滑块**：`role="slider"` + `aria-valuenow`，指针拖、键盘调都可以，同样不关菜单；
+- **位置是 2×2 罗盘**：四个方位按钮，当前所在的那个有标记；
+- **版本与更新收进「关于她」**：菜单头部直接显示版本号，检查更新是弹窗里的一个按钮
+  （上下文才对得上）；
+- **三段式**：动作在上、设置在中间、信息在下，段间有分隔线；底部一行键盘提示。
+
+预检 473 → **502 项**，冒烟 53 项（真浏览器里新增：分组展开后菜单仍在视口内、
+关于弹窗真的在屏幕上、动作一览八张图真的解码 8/8）。
+
+**替身（简化 DOM）这次修了三处"不忠实"** —— 它们让真代码在测试里表现不对：
+
+1. 元素级 `querySelector`/`querySelectorAll` 与替身的 `all()`/`find()` 原来是**类名精确相等**，
+   而真实 DOM 的 `.a` 是**按类名列表**匹配 —— 于是 `wisp-menu-item wisp-menu-row` 这类行
+   在替身里"不存在"。这个坑前后踩过两次，这次统一成类名列表；
+2. 只支持**单个类名或标签**选择器（属性选择器、复合选择器都不行）→ 于是给滑块数值与角落按钮
+   各配了一个类名，测试不再依赖替身不支持的选择器；
+3. 测试里判断"焦点在滑块上"要**重新取当前元素**：菜单每次重画都换新元素，
+   拿之前抓到的做同一性比较会假失败。
+
+### 1.30.0
+
 ### 1.30.0
 
 这一版是**功能**，不是台词。

package/lib/client.js

@@ -51,7 +51,7 @@ window.__ModuleLoader__.load({
     var exports = module.exports
     Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' })
 
-    const VERSION = '1.30.0'
+    const VERSION = '1.31.0'
 
 /* 每一版一句话。**必须写当前版本** —— 预检里有一条断言盯着它，
    忘了更新就会红，不会静默过期。 */
@@ -71,6 +71,7 @@ const WHATS_NEW = {
   '1.28.0': '菜单分成折叠分组，另外多了「关于她」和「动作一览」两个弹窗。',
   '1.29.0': '夜深了她会劝你去睡；你走开再回来她记得；连续来了几天她也记着。',
   '1.30.0': '会陪你专注计时了；页面藏起来时她会安静下来，不再空转。',
+  '1.31.0': '菜单重做：状态一目了然，开关是开关，大小能直接拖。',
 }
 
 /* 更新这件事**这个插件自己做不到**，如实写在代码里，免得以后有人以为能：
@@ -689,10 +690,33 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
 .wisp-root[data-mood="attn"] .wisp-body{animation-name:wisp-nudge;animation-duration:1.5s;animation-iteration-count:4}
 @keyframes wisp-nudge{0%,100%{transform:translate3d(0,0,0)}25%{transform:translate3d(-7px,0,0)}75%{transform:translate3d(7px,0,0)}}
 @keyframes wisp-hop{0%,100%{transform:translate3d(0,0,0)}45%{transform:translate3d(0,-16px,0)}}
-.wisp-menu{position:absolute;min-width:150px;padding:5px;border-radius:11px;font-size:12px;line-height:1.2;color:var(--dsw-alias-label-primary,var(--wisp-say-fg));background:var(--dsw-alias-bg-overlay,var(--wisp-say-bg));border:1px solid var(--dsw-alias-border-l1,var(--wisp-say-line));box-shadow:0 10px 30px rgba(0,0,0,.28);-webkit-backdrop-filter:blur(14px) saturate(160%);backdrop-filter:blur(14px) saturate(160%);pointer-events:auto;animation:wisp-menu .14s ease}
+.wisp-menu{position:absolute;min-width:198px;max-width:240px;padding:6px;border-radius:12px;font-size:12px;line-height:1.25;color:var(--dsw-alias-label-primary,var(--wisp-say-fg));background:var(--dsw-alias-bg-overlay,var(--wisp-say-bg));border:1px solid var(--dsw-alias-border-l1,var(--wisp-say-line));box-shadow:0 12px 34px rgba(0,0,0,.3);-webkit-backdrop-filter:blur(14px) saturate(160%);backdrop-filter:blur(14px) saturate(160%);pointer-events:auto;animation:wisp-menu .14s ease}
 .wisp-menu-item{display:block;width:100%;padding:7px 10px;border:0;border-radius:7px;background:none;color:inherit;font:inherit;text-align:left;cursor:pointer;white-space:nowrap}
 .wisp-menu-item:hover{background:var(--dsw-alias-bg-layer-2,rgba(120,170,255,.22))}
-.wisp-menu-head{padding:7px 10px 3px;font-size:11px;opacity:.62;letter-spacing:.04em}
+.wisp-menu-head{padding:5px 9px 7px}
+.wisp-menu-title{font-size:12.5px;font-weight:600}
+.wisp-menu-sub{font-size:10.5px;opacity:.6;margin-top:1px}
+.wisp-menu-sep{height:1px;margin:4px 6px;background:var(--dsw-alias-border-l1,var(--wisp-say-line));opacity:.45}
+.wisp-menu-hint{padding:5px 9px 3px;font-size:10.5px;opacity:.45}
+.wisp-menu-row{display:flex;align-items:center;justify-content:space-between;gap:10px}
+.wisp-menu-sum{flex:0 1 auto;min-width:0;font-size:11px;opacity:.55;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
+.wisp-menu-item[data-accent="true"]{font-weight:600;color:var(--dsw-alias-brand-primary,inherit)}
+.wisp-menu-item[data-muted="true"]{opacity:.78}
+.wisp-switch{flex:0 0 auto;width:26px;height:14px;border-radius:8px;background:rgba(140,160,190,.35);position:relative;transition:background .15s ease}
+.wisp-switch[data-on="true"]{background:var(--dsw-alias-brand-primary,#4a7cf7)}
+.wisp-switch i{position:absolute;top:2px;left:2px;width:10px;height:10px;border-radius:50%;background:#fff;transition:transform .15s ease}
+.wisp-switch[data-on="true"] i{transform:translateX(12px)}
+.wisp-slider-row{padding:6px 10px 8px}
+.wisp-slider-top{display:flex;justify-content:space-between;font-size:11px;opacity:.8;margin-bottom:3px}
+.wisp-slider{position:relative;height:16px;cursor:pointer;outline:none;touch-action:none}
+.wisp-slider-track{position:absolute;left:0;right:0;top:7px;height:3px;border-radius:2px;background:rgba(140,160,190,.35)}
+.wisp-slider-fill{position:absolute;left:0;top:7px;height:3px;border-radius:2px;background:var(--dsw-alias-brand-primary,#4a7cf7)}
+.wisp-slider-knob{position:absolute;top:3px;width:11px;height:11px;margin-left:-5px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.35)}
+.wisp-slider:focus-visible .wisp-slider-knob{outline:2px solid var(--dsw-alias-brand-primary,#4a7cf7);outline-offset:1px}
+.wisp-grid2{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:2px 8px 4px}
+.wisp-grid2 button,.wisp-corner{padding:6px 4px;border:1px solid transparent;border-radius:7px;background:none;color:inherit;font:inherit;font-size:11px;cursor:pointer}
+.wisp-grid2 button:hover,.wisp-corner:hover{background:var(--dsw-alias-bg-layer-2,rgba(120,170,255,.22))}
+.wisp-grid2 button[data-current="true"],.wisp-corner[data-current="true"]{border-color:var(--dsw-alias-brand-primary,#4a7cf7);font-weight:600}
 .wisp-root[data-hidden="true"]{display:none}
 .wisp-tab{position:absolute;width:56px;height:56px;padding:0;display:flex;align-items:center;justify-content:center;overflow:hidden;border-radius:16px;border:1px solid var(--dsw-alias-border-l1,var(--wisp-say-line));background:var(--dsw-alias-bg-overlay,var(--wisp-say-bg));box-shadow:0 6px 18px rgba(0,0,0,.22);cursor:pointer;pointer-events:auto;animation:wisp-menu .16s ease;transition:transform .16s ease}
 .wisp-tab:hover{transform:translateY(-2px)}
@@ -715,6 +739,8 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
 .wisp-cell:hover{border-color:var(--dsw-alias-border-l1,var(--wisp-say-line));background:var(--dsw-alias-bg-layer-2,rgba(120,170,255,.18))}
 .wisp-cell img{width:100%;height:52px;object-fit:contain;object-position:bottom center;pointer-events:none}
 .wisp-credits{font-size:11px;opacity:.8;margin:6px 0 0}
+.wisp-dialog-action{display:block;width:100%;margin:4px 0 2px;padding:7px 10px;border:1px solid var(--dsw-alias-border-l1,var(--wisp-say-line));border-radius:8px;background:none;color:inherit;font:inherit;cursor:pointer}
+.wisp-dialog-action:hover{background:var(--dsw-alias-bg-layer-2,rgba(120,170,255,.2))}
 @media (prefers-reduced-motion:reduce){.wisp-body{animation:none!important}}`
 
     const installStyles = (styles) => {
@@ -2175,6 +2201,17 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
 
       const aboutDialog = () => {
         const note = WHATS_NEW[VERSION]
+        /* 菜单里那条「版本与更新」已经收掉了（版本号现在直接显示在菜单头部），
+           所以检查更新必须有新的入口 —— 放在这里，上下文正合适。 */
+        const checkBtn = document.createElement('button')
+        checkBtn.className = 'wisp-dialog-action'
+        checkBtn.setAttribute('type', 'button')
+        checkBtn.textContent = '检查更新'
+        checkBtn.addEventListener('click', (ev) => {
+          ev.preventDefault()
+          closeDialog()
+          showUpdate()
+        })
         return openDialog('about', '关于她', [
           para('DeepSeek娘 —— DSH 界面上的浮动桌宠。她会跟着你的状态换表情：你打字她在忙，你闲着她在晃，你跑完一轮她替你高兴。'),
           para('她的样子照社区规范来：深蓝色渐变长直发、头顶一个大圆环呆毛、两片鲸鳍耳、女仆装。'),
@@ -2182,16 +2219,39 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
           para('她还能陪你专注计时：菜单里开一段 25 或 45 分钟，期间她保持"干活中"，戳她一下是问还剩多久，到点她替你收工。'),
           para('这一版：' + (note || VERSION)),
           para('形象与设定参考社区项目 Neko3000/deepseek-whalechan（设定文档 CC BY-NC-SA 4.0，原作者 B站 ZipZipPipe、上善无形）。'),
+          checkBtn,
           dialogFoot('非官方同人作品，与 DeepSeek 官方无关', 'v' + VERSION),
         ])
       }
 
-      /* 顶层只放"做什么"，外观/行为/位置收进可折叠的分组 —— 19 个同级条目等于没有结构。 */
+      /* 菜单的结构 ------------------------------------------------------------
+         三段：**动作在上**（专注是最常用的，置顶）、**设置在中间**（三个可折叠分组 +
+         大小滑块）、**信息在下**（动作一览 / 关于她）。每段之间有空行。
+         分组的标题行直接显示当前状态（皮肤名 / 几个开关开着 / 哪个角落），
+         所以收起时也知道里面是什么 —— 这是它和"一个写着外观的按钮"的区别。 */
+      const onToggleCount = () => TOGGLES.filter((t) => cfg[t.key] === true).length
+      const currentCorner = () => {
+        const bw = boxW()
+        const bh = boxH()
+        const hit = CORNERS.find((c) => {
+          const want = c.at(vw(), vh(), bw, bh, cfg)
+          return Math.abs(want.x - coords.x) < 2 && Math.abs(want.y - coords.y) < 2
+        })
+        return hit ? hit.label : '自由'
+      }
       const menuItems = () => [
-        { label: '关于她…', run: () => aboutDialog() },
-        { label: '动作一览…', run: () => actionsDialog() },
+        { kind: 'head' },
+        { kind: 'sep' },
+        /* 专注：最常用的动作，放最上面；进行中时这一行本身就是状态 + 结束 */
+        ...(focusUntil > 0
+          ? [{ label: '专注中 · 还剩 ' + Math.max(1, Math.ceil(focusLeftMs() / 60000)) + ' 分钟', run: () => stopFocus(false), accent: true }]
+          : [
+              { label: '专注 ' + cfg.focusMinutes + ' 分钟', run: () => startFocus(cfg.focusMinutes), accent: true },
+              { label: '专注 45 分钟', run: () => startFocus(45) },
+            ]),
+        { kind: 'sep' },
         {
-          group: '外观',
+          group: '外观', summary: skinLabel(activeSkin),
           children: [
             ...SKIN_IDS.map((id) => ({
               label: (id === activeSkin ? '✓ ' : '　') + skinLabel(id),
@@ -2208,26 +2268,27 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
         },
         {
           group: '行为',
+          summary: onToggleCount() + '/' + TOGGLES.length + ' 开',
           children: [
             { label: '说句话', run: () => { wake(true); say(pick(LINES.click)) } },
             { label: '睡一会儿', run: () => setMood('sleep') },
-            { label: '专注 ' + cfg.focusMinutes + ' 分钟', run: () => startFocus(cfg.focusMinutes) },
-            { label: '专注 45 分钟', run: () => startFocus(45) },
-            /* 只有专注中才出现"结束专注" —— 平时的菜单不该多一个按不动的条目 */
-            ...(focusUntil > 0 ? [{ label: '结束专注', run: () => stopFocus(false) }] : []),
-            ...TOGGLES.map((t) => ({
-              label: (cfg[t.key] === true ? '✓ ' : '　') + t.label,
-              run: () => applyConfig({ [t.key]: cfg[t.key] !== true }),
-            })),
+            /* 开关是**真正的开关行**：带 aria-checked，点完菜单不关（就在原地更新） */
+            ...TOGGLES.map((t) => ({ kind: 'switch', key: t.key, label: t.label })),
           ],
         },
         {
           group: '位置',
-          children: CORNERS.map((c) => ({ label: c.label, run: () => goCorner(c.label) })),
+          summary: currentCorner(),
+          children: [{ kind: 'corners' }],
         },
-        { label: '版本与更新', run: () => showUpdate() },
+        { kind: 'slider' },
+        { kind: 'sep' },
+        { label: '动作一览…', run: () => actionsDialog() },
+        { label: '关于她…', run: () => aboutDialog() },
+        { kind: 'sep' },
         /* 一个开关，不是一个单向动作：从迷你按钮右键打开菜单时，它必须能把她叫回来。 */
-        { label: hidden ? '回来吧' : '先躲起来', run: () => setHidden(!hidden) },
+        { label: hidden ? '回来吧' : '先躲起来', run: () => setHidden(!hidden), muted: true },
+        { kind: 'hint' },
       ]
 
       /* ---- 菜单的键盘驱动 ----
@@ -2275,13 +2336,16 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
         menu.className = 'wisp-menu'
         menu.setAttribute('role', 'menu')
         menu.style.position = 'absolute'
-        let heads = 0
-        const addItem = (spec, sub) => {
+        let extras = 0
+        /* 动作行：点了就执行、然后关菜单。 */
+        const actionRow = (spec, into) => {
           const btn = document.createElement('button')
           btn.className = 'wisp-menu-item'
           btn.setAttribute('type', 'button')
           btn.setAttribute('role', 'menuitem')
           btn.setAttribute('tabindex', '-1')
+          if (spec.accent === true) btn.dataset.accent = 'true'
+          if (spec.muted === true) btn.dataset.muted = 'true'
           btn.textContent = spec.label
           // 菜单自己吞掉 pointerdown，否则会被下面那个"点外面就关"的监听判成外部点击
           btn.addEventListener('pointerdown', (ev) => ev.stopPropagation())
@@ -2290,26 +2354,197 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
             closeMenu()
             try { spec.run() } catch (err) { /* 单个动作失败不该带塌整个菜单 */ }
           })
-          menu.appendChild(btn)
+          into.appendChild(btn)
+          menuButtons.push(btn)
+          return btn
+        }
+
+        /* 开关行：真开关的样子 + role=menuitemcheckbox + aria-checked。
+           点完**不关菜单** —— 拨开关时菜单消失是最烦人的交互之一。 */
+        const switchRow = (spec, into) => {
+          const on = cfg[spec.key] === true
+          const btn = document.createElement('button')
+          btn.className = 'wisp-menu-item wisp-menu-row'
+          btn.setAttribute('type', 'button')
+          btn.setAttribute('role', 'menuitemcheckbox')
+          btn.setAttribute('aria-checked', on ? 'true' : 'false')
+          btn.setAttribute('tabindex', '-1')
+          btn.dataset.switchKey = spec.key
+          const label = document.createElement('span')
+          label.textContent = spec.label
+          const toggle = document.createElement('span')
+          toggle.className = 'wisp-switch'
+          toggle.dataset.on = on ? 'true' : 'false'
+          toggle.appendChild(document.createElement('i'))
+          btn.appendChild(label)
+          btn.appendChild(toggle)
+          btn.addEventListener('pointerdown', (ev) => ev.stopPropagation())
+          btn.addEventListener('click', (ev) => {
+            ev.preventDefault(); ev.stopPropagation()
+            try { applyConfig({ [spec.key]: cfg[spec.key] !== true }) } catch (err) { /* ignore */ }
+            /* 原地重画：开着的那一组保持开着，菜单不跳走 */
+            openMenu(menuAtX, menuAtY, true)
+          })
+          into.appendChild(btn)
           menuButtons.push(btn)
           return btn
         }
+
+        /* 大小滑块：连续量就该直接拖，而不是一次次点"放大一点"。
+           键盘也能调（←/→ 各 0.25 档）—— 所以它自己是可聚焦的。
+           替身里没有布局，getBoundingClientRect 全是 0，所以宽度为 0 时用固定跨度兜底；
+           测试一律走方向键那条路，不依赖像素。 */
+        const sliderRow = (into) => {
+          const SPEC = CONFIG_SPEC.size
+          const row = document.createElement('div')
+          row.className = 'wisp-slider-row'
+          const top = document.createElement('div')
+          top.className = 'wisp-slider-top'
+          const name = document.createElement('span')
+          name.textContent = '大小'
+          const value = document.createElement('span')
+          value.className = 'wisp-slider-value'
+          value.dataset.sliderValue = '1'
+          value.textContent = Math.round(cfg.size * 100) + '%'
+          top.appendChild(name)
+          top.appendChild(value)
+          row.appendChild(top)
+          const track = document.createElement('div')
+          track.className = 'wisp-slider'
+          track.setAttribute('role', 'slider')
+          track.setAttribute('tabindex', '-1')
+          track.setAttribute('aria-label', '大小')
+          track.dataset.slider = '1'
+          track.setAttribute('aria-valuemin', String(SPEC.lo))
+          track.setAttribute('aria-valuemax', String(SPEC.hi))
+          track.setAttribute('aria-valuenow', String(cfg.size))
+          const bg = document.createElement('div')
+          bg.className = 'wisp-slider-track'
+          const fill = document.createElement('div')
+          fill.className = 'wisp-slider-fill'
+          const knob = document.createElement('div')
+          knob.className = 'wisp-slider-knob'
+          track.appendChild(bg)
+          track.appendChild(fill)
+          track.appendChild(knob)
+          const paintSlider = () => {
+            const ratio = clamp((cfg.size - SPEC.lo) / (SPEC.hi - SPEC.lo), 0, 1)
+            fill.style.width = Math.round(ratio * 100) + '%'
+            knob.style.left = Math.round(ratio * 100) + '%'
+            value.textContent = Math.round(cfg.size * 100) + '%'
+            track.setAttribute('aria-valuenow', String(cfg.size))
+          }
+          paintSlider()
+          const setFromClientX = (clientX) => {
+            let rect = { left: 0, width: 0 }
+            try { rect = track.getBoundingClientRect() } catch (e) { rect = { left: 0, width: 0 } }
+            const span = rect.width > 0 ? rect.width : 120
+            const ratio = clamp((clientX - rect.left) / span, 0, 1)
+            const next = Math.round((SPEC.lo + ratio * (SPEC.hi - SPEC.lo)) * 4) / 4
+            applyConfig({ size: next })
+            paintSlider()
+          }
+          track.addEventListener('pointerdown', (ev) => {
+            ev.preventDefault(); ev.stopPropagation()
+            setFromClientX(ev.clientX)
+            const move = (e) => setFromClientX(e.clientX)
+            const up = () => {
+              window.removeEventListener('pointermove', move)
+              window.removeEventListener('pointerup', up)
+            }
+            window.addEventListener('pointermove', move)
+            window.addEventListener('pointerup', up)
+          })
+          row.appendChild(track)
+          into.appendChild(row)
+          menuButtons.push(track)
+          extras++
+          return track
+        }
+
+        /* 四个角落用 2×2 的方位控件，而不是四个文字条目 —— 空间的事用空间的形式表达。 */
+        const cornerGrid = (into) => {
+          const grid = document.createElement('div')
+          grid.className = 'wisp-grid2'
+          for (const corner of CORNERS) {
+            const b = document.createElement('button')
+            b.className = 'wisp-corner'
+            b.setAttribute('type', 'button')
+            b.setAttribute('tabindex', '-1')
+            b.dataset.corner = corner.label
+            b.textContent = corner.label
+            if (corner.label === currentCorner()) b.dataset.current = 'true'
+            b.addEventListener('pointerdown', (ev) => ev.stopPropagation())
+            b.addEventListener('click', (ev) => {
+              ev.preventDefault(); ev.stopPropagation()
+              closeMenu()
+              try { goCorner(corner.label) } catch (err) { /* ignore */ }
+            })
+            grid.appendChild(b)
+            menuButtons.push(b)
+          }
+          into.appendChild(grid)
+          extras++
+        }
+
+        const renderChildren = (children, into) => {
+          for (const child of children) {
+            if (child.kind === 'switch') { switchRow(child, into); continue }
+            if (child.kind === 'corners') { cornerGrid(into); continue }
+            actionRow(child, into)
+          }
+        }
+
         for (let i = 0; i < items.length; i++) {
           const spec = items[i]
+          if (spec.kind === 'head') {
+            /* 头部：她是谁、哪一版、现在什么状态。不可聚焦 —— 它不是动作。 */
+            const head = document.createElement('div')
+            head.className = 'wisp-menu-head'
+            const title = document.createElement('div')
+            title.className = 'wisp-menu-title'
+            title.textContent = 'DeepSeek娘'
+            const subline = document.createElement('div')
+            subline.className = 'wisp-menu-sub'
+            const bits = ['v' + VERSION, skinLabel(activeSkin)]
+            if (focusUntil > 0) bits.push('专注中')
+            subline.textContent = bits.join(' · ')
+            head.appendChild(title)
+            head.appendChild(subline)
+            menu.appendChild(head)
+            extras++
+            continue
+          }
+          if (spec.kind === 'sep') {
+            const sep = document.createElement('div')
+            sep.className = 'wisp-menu-sep'
+            menu.appendChild(sep)
+            extras++
+            continue
+          }
+          if (spec.kind === 'hint') {
+            const hint = document.createElement('div')
+            hint.className = 'wisp-menu-hint'
+            hint.textContent = '↑↓ 选择 · ←→ 调大小 · Esc 关闭'
+            menu.appendChild(hint)
+            extras++
+            continue
+          }
+          if (spec.kind === 'slider') { sliderRow(menu); continue }
           if (spec.header !== undefined) {
             // 小标题是分组标签，不是菜单项 —— 不能被聚焦，否则键盘用户会停在一个按不动的东西上
             const head = document.createElement('div')
             head.className = 'wisp-menu-head'
             head.textContent = spec.header
             menu.appendChild(head)
-            heads++
+            extras++
             continue
           }
           if (spec.group !== undefined) {
-            /* 折叠分组：一行标题，点一下在原地展开/收起（重开同一个坐标，不是新开一个菜单）。 */
+            /* 折叠分组：标题行带上当前状态摘要，点一下在原地展开/收起。 */
             const open = activeGroup === spec.group
             const btn = document.createElement('button')
-            btn.className = 'wisp-menu-item'
+            btn.className = 'wisp-menu-item wisp-menu-row'
             btn.setAttribute('type', 'button')
             btn.setAttribute('role', 'menuitem')
             btn.setAttribute('tabindex', '-1')
@@ -2319,6 +2554,13 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
             /* 文字直接写在按钮上，不拆成子 span：真 DOM 会汇总子节点的 textContent，
                但简化 DOM（预检的替身）不会 —— 依赖那种汇总会让分组名在替身里变成空串。 */
             btn.textContent = (open ? '▾ ' : '▸ ') + spec.group
+            if (spec.summary !== undefined) {
+              const sum = document.createElement('span')
+              sum.className = 'wisp-menu-sum'
+              sum.dataset.summary = '1'
+              sum.textContent = spec.summary
+              btn.appendChild(sum)
+            }
             btn.addEventListener('pointerdown', (ev) => ev.stopPropagation())
             btn.addEventListener('click', (ev) => {
               ev.preventDefault(); ev.stopPropagation()
@@ -2330,33 +2572,19 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
             if (!open) continue
             const wrap = document.createElement('div')
             wrap.className = 'wisp-menu-sub'
-            for (const child of spec.children) {
-              const cb = document.createElement('button')
-              cb.className = 'wisp-menu-item'
-              cb.setAttribute('type', 'button')
-              cb.setAttribute('role', 'menuitem')
-              cb.setAttribute('tabindex', '-1')
-              cb.textContent = child.label
-              cb.addEventListener('pointerdown', (ev) => ev.stopPropagation())
-              cb.addEventListener('click', (ev) => {
-                ev.preventDefault(); ev.stopPropagation()
-                closeMenu()
-                try { child.run() } catch (err) { /* 同上 */ }
-              })
-              wrap.appendChild(cb)
-              menuButtons.push(cb)
-            }
+            renderChildren(spec.children, wrap)
             menu.appendChild(wrap)
             continue
           }
-          addItem(spec, false)
+          actionRow(spec, menu)
         }
+
         // 先挂上去再定位：定位要用最终尺寸，而尺寸只有渲染后才知道
         layer.appendChild(menu)
         menuEl = menu
         const w = MENU_W
         // 高度只用于夹取落点，所以按**实际渲染出来的行数**估算即可（假 DOM 里没有布局可测）
-        const hs = MENU_PAD + heads * 22 + menuButtons.length * MENU_ITEM_H
+        const hs = MENU_PAD + extras * 24 + menuButtons.length * MENU_ITEM_H
         menu.style.left = Math.round(clamp(x, 8, Math.max(8, vw() - w - 8))) + 'px'
         menu.style.top = Math.round(clamp(y, 8, Math.max(8, vh() - hs - 8))) + 'px'
 
@@ -2368,6 +2596,28 @@ body[data-ds-dark-theme] .wisp-layer{--wisp-say-fg:#eaf2f8;--wisp-say-bg:rgba(20
             return
           }
           if (menuButtons.length === 0) return
+          /* 焦点在滑块上：←/→ 调大小，不移动焦点（这是滑块的常规键盘交互）。 */
+          const focused = menuFocusAt >= 0 ? menuButtons[menuFocusAt] : null
+          if (focused && focused.dataset && focused.dataset.slider === '1'
+            && (ev.key === 'ArrowLeft' || ev.key === 'ArrowRight')) {
+            if (typeof ev.preventDefault === 'function') ev.preventDefault()
+            const step = ev.shiftKey ? 1 : 0.25
+            applyConfig({ size: cfg.size + (ev.key === 'ArrowRight' ? step : -step) })
+            /* 只更新滑块自身，不重画整张菜单 —— 焦点和展开状态都不动 */
+            try {
+              const SPEC = CONFIG_SPEC.size
+              const ratio = clamp((cfg.size - SPEC.lo) / (SPEC.hi - SPEC.lo), 0, 1)
+              const knob = focused.querySelector('.wisp-slider-knob')
+              const fill = focused.querySelector('.wisp-slider-fill')
+              if (knob) knob.style.left = Math.round(ratio * 100) + '%'
+              if (fill) fill.style.width = Math.round(ratio * 100) + '%'
+              focused.setAttribute('aria-valuenow', String(cfg.size))
+              const row = focused.parentNode
+              const label = row && row.querySelector ? row.querySelector('[data-slider-value]') : null
+              if (label) label.textContent = Math.round(cfg.size * 100) + '%'
+            } catch (err) { /* 画不出来也不该挡住改大小 */ }
+            return
+          }
           let at = menuFocusAt
           if (ev.key === 'ArrowDown') at = at < 0 ? 0 : at + 1
           else if (ev.key === 'ArrowUp') at = at < 0 ? menuButtons.length - 1 : at - 1