dsh-theme-customizer 1.0.3 → 1.0.4

package/PATCH-CORDIS-BUTTON.md

@@ -1,4 +1,4 @@
-# 官方 Cordis 按钮常驻补丁说明（dsh-client-ui-cordis）
+# Cordis 按钮常驻补丁说明（dsh-client-ui-cordis）
 
 > 验证通过（2026-08-19，临时静态测试插件 v3 确认：无插件活动时按钮常驻、开关即时显隐、刷新持久）。
 > **推荐直接用随包脚本一键安装**：`node apply-patch.cjs`（自动备份 / `--check` 查状态 / `--undo` 撤销）。本文档记录补丁内容与手动重打方法。

package/README.en.md

@@ -12,7 +12,7 @@
 
 ## 🎨 Theme Gallery
 
-Four AI-generated wallpaper themes (alternating dark/bright), each with two main-UI "display area" modes: **include sidebar** (one full-screen background) and **exclude sidebar** (main area + independent portrait sidebar background), plus matching `.tczp` presets for one-click import (see "Asset Pack" below).
+Four AI-generated wallpaper themes, each with two main-UI "display area" modes: **include sidebar**  and **exclude sidebar**, plus matching `.tczp` presets for one-click import (see "Asset Pack" below).
 
 | 🌌 Aurora Nights (dark) | 🌇 Sunset Clouds (bright) |
 |:---:|:---:|
@@ -22,7 +22,7 @@ Four AI-generated wallpaper themes (alternating dark/bright), each with two main
 
 ## 📸 Screenshots
 
-Each theme has two modes (presets `-0` / `-1`): **display area includes sidebar** (one full-screen background) and **display area excludes sidebar** (main area + independent portrait sidebar background). Each mode has 3 shots: front-1 / front-2 / settings.
+Each theme has two modes (presets `-0` / `-1`): **display area includes sidebar**  and **display area excludes sidebar** . Each mode has 3 shots: front-1 / front-2 / settings.
 
 <details>
 <summary>🌌 Aurora Nights (dark)</summary>
@@ -98,6 +98,7 @@ Each theme has two modes (presets `-0` / `-1`): **display area includes sidebar*
   - Each area: None / Solid color / Image (with crop & selection) + opacity (**larger value = more transparent**) + base color (independent layer)
   - Main background supports "include sidebar / exclude sidebar" display area toggle
   - Sidebar image fades out directly via mask — never covers the top UI or the settings panel
+  - **Independent "when collapsed" settings** for both Main and Sidebar (applied when the sidebar is folded; cross-fade transition on toggle)
 - **Borders module**: color + opacity for all default UI borders/dividers, independently for 5 areas (Main incl. sidebar / Cordis / Composer / Settings / Floating panel)
 - **Text colors module**: 5 categories (Body / Process / Auxiliary / Faded / Accent), shared across light & dark themes, restorable to official defaults
 - **Brand color**: color + opacity for the top-left DeepSeek Harness logo; the "Harness" wordmark can be tinted separately
@@ -130,7 +131,7 @@ Then **restart dsh web** for it to take effect. Verify: Settings → Theme shoul
 
 ## Persistent Cordis button (optional)
 
-The "Cordis button always visible" toggle in Theme settings **requires a patch to the official dsh-client-ui-cordis package**; without the patch the toggle has no effect. One-click install:
+The "Cordis button always visible" toggle in Theme settings **requires patching the dsh-client-ui-cordis package** (provided by this plugin's `apply-patch.cjs`); without the patch the toggle has no effect. Install:
 
 ```bash
 node apply-patch.cjs           # apply patch (auto backup)
@@ -162,7 +163,7 @@ Presets panel → "Import preset" and pick a `.tczp` file to restore a whole con
 
 ## 📦 Asset Pack
 
-The **full assets** for all four themes (original wallpapers + 8 `.tczp` presets + all showcase screenshots) are packed in `展示.zip` attached to [GitHub Releases](https://github.com/lxxz1918/dsh-theme-customizer/releases). Download and extract with 7-Zip:
+The **full assets** for all four themes (original wallpapers + 8 `.tczp` presets + all showcase screenshots) are packed in `assets.7z` attached to [GitHub Releases](https://github.com/lxxz1918/dsh-theme-customizer/releases). Download and extract with 7-Zip:
 
 ```
 展示/

package/README.md

@@ -12,7 +12,7 @@
 
 ## 🎨 主题展示
 
-四套 AI 生成壁纸主题（亮暗交替排列），每套含两种主界面「显示区域」模式：**包含侧边栏**（整屏一体）与**不包含侧边栏**（主体独立 + 侧边栏独立竖版壁纸），配套 `.tczp` 预设一键导入（见下方「素材包」）。
+四套 AI 生成的壁纸作为主题的示例，每套含两种主界面「显示区域」模式：**包含侧边栏**与**不包含侧边栏**，配套 `.tczp` 预设一键导入。（详见下方“资源包”）
 
 | 🌌 星空极光（暗） | 🌇 黄昏云海（亮） |
 |:---:|:---:|
@@ -22,7 +22,7 @@
 
 ## 📸 界面截图
 
-每套主题两种模式（对应预设 `-0` / `-1`）：**显示区域包含侧边栏**（整屏一体背景）与**显示区域不包含侧边栏**（主体独立 + 侧边栏独立竖版壁纸）。每种模式 3 张：正面-1 / 正面-2 / 设置面。
+每套主题两种模式（对应预设 `-0` / `-1`）：**显示区域包含侧边栏**与**显示区域不包含侧边栏**。每种模式 3 张：正面-1 / 正面-2 / 设置面。
 
 <details>
 <summary>🌌 星空极光（暗）</summary>
@@ -98,6 +98,7 @@
   - 每区域：无 / 纯色 / 图片（选区裁剪）+ 透明度（**数值越大越透明**）+ 底色（独立层）
   - 主界面支持「包含侧边栏 / 不包含侧边栏」显示区域切换
   - 侧边栏图片用 mask 直接淡出，不盖顶部 UI、不挡设置面板
+  - **侧边栏收起后独立配置**：主界面 / 侧边栏各有一份「收起后」设置（折叠侧边栏时生效，切换淡入淡出）
 - **框线板块**：所有界面默认边框/分隔线颜色 + 透明度，主界面（含侧边栏）/ Cordis / 输入区 / 设置界面 / 浮窗 5 区域独立
 - **字体颜色板块**：正文 / 过程 / 辅助 / 弱化 / 强调 5 类文字颜色（亮暗主题共用，可恢复官方默认）
 - **标志调色**：左上角 DeepSeek Harness 标志颜色 + 透明度；「Harness」文字部分可单独调色
@@ -130,7 +131,7 @@ dsh plugin --profile web add <本仓库路径>
 
 ## Cordis 按钮常驻（可选）
 
-主题设置里「Cordis 按钮常驻」开关**依赖官方 dsh-client-ui-cordis 补丁**，未打补丁时开关不生效。一键安装：
+主题设置里「Cordis 按钮常驻」开关**依赖 dsh-client-ui-cordis 补丁**（本插件随包提供 `apply-patch.cjs` 一键打补丁），未打补丁时开关不生效。安装：
 
 ```bash
 node apply-patch.cjs           # 打补丁（自动备份）
@@ -162,7 +163,7 @@ dsh plugin --profile web add <本仓库路径>
 
 ## 📦 素材包
 
-四套主题的**完整素材**（壁纸原图 + 8 个 `.tczp` 预设 + 全部展示截图）打包在 [GitHub Releases 附件](https://github.com/lxxz1918/dsh-theme-customizer/releases) 的 `展示.zip` 中，下载后 7-Zip 解压即可：
+四套主题的**完整素材**（壁纸原图 + 8 个 `.tczp` 预设 + 全部展示截图）打包在 [GitHub Releases 附件](https://github.com/lxxz1918/dsh-theme-customizer/releases) 的 `assets.7z` 中，下载后 7-Zip 解压即可：
 
 ```
 展示/

package/apply-patch.cjs

@@ -1,4 +1,4 @@
-// apply-patch.cjs —— 官方 Cordis 按钮常驻补丁一键安装/撤销（dsh-theme-customizer 随包脚本）
+// apply-patch.cjs —— Cordis 按钮常驻补丁一键安装/撤销（dsh-theme-customizer 随包脚本）
 // 背景：官方 dsh-client-ui-cordis 在"没有任何动态插件活动"时 return null（按钮隐藏）。
 //       本补丁让按钮显隐受 window.__TCZ_HIDE_OFFICIAL_CORDIS 控制（主题插件「Cordis 按钮常驻」开关使用）。
 // ⚠️  DSH 升级会覆盖官方包 → 升级后需重跑本脚本。

package/lib/client.js

@@ -80,8 +80,10 @@ window.__ModuleLoader__.load({
         // 透明度语义统一：数值大 = 透明（主界面与侧边栏一致）；默认 0 = 不透明（实/清晰）
         // 主界面底色：默认开启白色（bottomEnabled/bottomColor/bottomOpacity，复用 emptyArea 字段，逻辑同侧边栏）
         // 作用是主界面最底层垫色：模式"无"时显示白底；纯色/图片盖在底色之上
-        app: { ...emptyArea(), opacity: 0, bottomEnabled: true, bottomColor: '#ffffff', bottomOpacity: 0 },
-        sidebar: { ...emptyArea(), opacity: 0 },
+        // v1.0.4 侧边栏收起态：app.collapsedSidebar = 主界面「侧边栏收起后」独立配置（默认 mode:'none' 官方原样）
+        app: { ...emptyArea(), opacity: 0, bottomEnabled: true, bottomColor: '#ffffff', bottomOpacity: 0, collapsedSidebar: emptyArea() },
+        // v1.0.4 侧边栏收起态：sidebar.collapsed = 侧边栏「收起后」独立配置（默认 mode:'none' 官方原样）
+        sidebar: { ...emptyArea(), opacity: 0, collapsed: emptyArea() },
         // 输入区（composer）：像主界面——默认白底常驻（bottomEnabled:true/color:#fff），背景作用在 [data-composer-seat]
         composer: { ...emptyArea(), opacity: 0, bottomEnabled: true, bottomColor: '#ffffff', bottomOpacity: 0 },
         // 设置界面（details，v0.9.12）：像主界面——默认白底常驻，背景作用在官方设置面板 [class*="VOzbGW_panel"]
@@ -307,7 +309,11 @@ window.__ModuleLoader__.load({
       function detectSidebar() {
         try {
           if (typeof document === 'undefined') return null
-          const candidates = ['[class*="sidebar"]', '[class*="Sidebar"]', '[class*="sideBar"]', 'nav']
+          // v1.0.4 折叠态检测（先行）：官方收起时根容器带 hHd-Xa_collapsed class（F12 实测稳定后缀）。
+          // ⚠️ 选择器必须稳定：展开/折叠返回同一个容器（优先外层列容器），否则 buildSidebarCss 的
+          // 展开/收起规则用不同选择器 → 折叠后展开规则残留（图片未被隐藏）。列容器折叠后宽度通常仍 >50。
+          const collapsed = !!document.querySelector('[class*="_collapsed"]')
+          const candidates = ['[class*="sidebar"]', '[class*="Sidebar"]', '[class*="sideBar"]', 'nav', '[class*="hHd-Xa_root"]']
           for (const sel of candidates) {
             const els = document.querySelectorAll(sel)
             for (const el of els) {
@@ -315,10 +321,21 @@ window.__ModuleLoader__.load({
               if (r.width > 50 && r.height > 100 && r.left === 0 && r.top === 0) {
                 const cls = typeof el.className === 'string' ? el.className.split(/\s+/).filter(Boolean)[0] : ''
                 const selector = cls ? '.' + cls.replace(/[^a-zA-Z0-9_-]/g, '\\$&') : el.tagName.toLowerCase()
-                return { selector, ratio: r.width / r.height, width: r.width, height: r.height }
+                return { selector, ratio: r.width / r.height, width: r.width, height: r.height, collapsed }
               }
             }
           }
+          // 折叠态兜底（窄栏 <50px 列容器不匹配）：量 hHd-Xa_root。⚠️ 此时 selector 可能与展开态不同，
+          // buildSidebarCss 用 :has() 双选择器兜底（自身含 collapsed 或后代含），见 07
+          if (collapsed) {
+            const root = document.querySelector('[class*="hHd-Xa_root"]')
+            if (root) {
+              const r = root.getBoundingClientRect()
+              const cls = typeof root.className === 'string' ? root.className.split(/\s+/).filter(Boolean)[0] : ''
+              const selector = cls ? '.' + cls.replace(/[^a-zA-Z0-9_-]/g, '\\$&') : 'nav'
+              return { selector, ratio: r.width / Math.max(1, r.height), width: r.width, height: r.height, collapsed }
+            }
+          }
           return null
         } catch (e) { /* 忽略 */ }
         return null
@@ -391,8 +408,9 @@ window.__ModuleLoader__.load({
       function setDetailsDragEnabled(v) { detailsDragEnabled = v; notify(); saveNow() }
       // ⚠️ 值未变跳过（2026-08-22 梳理修复）：resize/observer 每触发都调用，值没变也 notify 会全量重渲染
       //   （Cordis 面板 MutationObserver 监听整个 body 节点增删 → 对话流每挂载一条消息都触发一次）
+      // v1.0.4：collapsed 折叠态也参与比较（折叠切换触发 CSS 重建）
       function setSidebarInfo(next) {
-        if (sidebarInfo && next && sidebarInfo.selector === next.selector && sidebarInfo.ratio === next.ratio && sidebarInfo.width === next.width && sidebarInfo.height === next.height) return
+        if (sidebarInfo && next && sidebarInfo.selector === next.selector && sidebarInfo.ratio === next.ratio && sidebarInfo.width === next.width && sidebarInfo.height === next.height && sidebarInfo.collapsed === next.collapsed) return
         sidebarInfo = next
         notify()
       }
@@ -447,8 +465,8 @@ window.__ModuleLoader__.load({
         cordisEntry = true
         applyCordisEntryFlag()
         areas = {
-          app: { ...emptyArea(), opacity: 0, bottomEnabled: true, bottomColor: '#ffffff', bottomOpacity: 0 },
-          sidebar: { ...emptyArea(), opacity: 0 },
+          app: { ...emptyArea(), opacity: 0, bottomEnabled: true, bottomColor: '#ffffff', bottomOpacity: 0, collapsedSidebar: emptyArea() },
+          sidebar: { ...emptyArea(), opacity: 0, collapsed: emptyArea() },
           composer: { ...emptyArea(), opacity: 0, bottomEnabled: true, bottomColor: '#ffffff', bottomOpacity: 0 },
           details: { ...emptyArea(), opacity: 0, bottomEnabled: true, bottomColor: '#ffffff', bottomOpacity: 0 },
           float: { ...emptyArea(), opacity: 0, bottomEnabled: true, bottomColor: '#ffffff', bottomOpacity: 0 },
@@ -576,6 +594,14 @@ window.__ModuleLoader__.load({
           } else if (areas.cordis.bottomColor == null) {
             areas.cordis = { ...areas.cordis, bottomEnabled: true, bottomColor: '#ffffff', bottomOpacity: 0 }
           }
+          // v1.0.4 侧边栏收起态：app.collapsedSidebar / sidebar.collapsed 嵌套配置（默认 mode:'none' 官方原样）。
+          // 旧配置无此键 → 无条件补 emptyArea（防 buildSidebarCss/buildAppCss 读 undefined.mode 崩溃）
+          if (areas.app && typeof areas.app === 'object' && (areas.app.collapsedSidebar === undefined || areas.app.collapsedSidebar.mode === undefined)) {
+            areas.app = { ...areas.app, collapsedSidebar: emptyArea() }
+          }
+          if (areas.sidebar && typeof areas.sidebar === 'object' && (areas.sidebar.collapsed === undefined || areas.sidebar.collapsed.mode === undefined)) {
+            areas.sidebar = { ...areas.sidebar, collapsed: emptyArea() }
+          }
           if (c.colors && typeof c.colors === 'object') colors = { main: null, process: null, aux: null, faded: null, accent: null, ...c.colors }
           if (c.newSession && typeof c.newSession === 'object') {
             // 兼容旧数据：无 bottomEnabled 字段时，旧 bottomColor 有值 = 底色已开启；
@@ -786,6 +812,9 @@ window.__ModuleLoader__.load({
           }
           nextAreas[a.id] = area
         }
+        // v1.0.4 侧边栏收起态：预设缺 collapsedSidebar/collapsed 字段（或字段异常缺 mode）→ 补默认（防读 undefined.mode 崩溃）
+        if (nextAreas.app && (!nextAreas.app.collapsedSidebar || nextAreas.app.collapsedSidebar.mode === undefined)) nextAreas.app = { ...nextAreas.app, collapsedSidebar: emptyArea() }
+        if (nextAreas.sidebar && (!nextAreas.sidebar.collapsed || nextAreas.sidebar.collapsed.mode === undefined)) nextAreas.sidebar = { ...nextAreas.sidebar, collapsed: emptyArea() }
         areas = nextAreas
         // ── 文字颜色：完整覆盖（null=恢复官方）──
         colors = { main: null, process: null, aux: null, faded: null, accent: null }
@@ -876,6 +905,13 @@ window.__ModuleLoader__.load({
         if (areas.sidebar.mode === 'image' && areas.sidebar.image && sidebarInfo && sidebarInfo.selector) {
           parts.push(sidebarInfo.selector + ' { --tcz-sidebar-img: url("' + areas.sidebar.image.dataURI + '"); }')
         }
+        // v1.0.4 收起态侧边栏图片变量：用收起态选择器（自身含 collapsed class 或后代含）
+        const sc = areas.sidebar.collapsed
+        if (sc && sc.mode === 'image' && sc.image && sidebarInfo && sidebarInfo.selector) {
+          const sel = sidebarInfo.selector
+          parts.push(sel + '[class*="_collapsed"] { --tcz-sidebar-img: url("' + sc.image.dataURI + '"); }')
+          parts.push(sel + ':has([class*="_collapsed"]) { --tcz-sidebar-img: url("' + sc.image.dataURI + '"); }')
+        }
         if (areas.composer.mode === 'image' && areas.composer.image) {
           parts.push('[data-composer-card] { --tcz-composer-img: url("' + areas.composer.image.dataURI + '"); }')
         }
@@ -900,33 +936,41 @@ window.__ModuleLoader__.load({
       function buildAppCss() {
         // 主界面（html,body 背景）。底色 = 最底层垫色（常驻仅颜色）；模式内容（纯色渐变/图片）叠在其上。
         // 图片直接拼 dataURI（不用 var()：多层 background-image 里 var() 替换失效 → 图片不显示）；图片已在选图时 downscale 体积小
+        // v1.0.4 收起态：侧边栏折叠（hHd-Xa_collapsed）时用 areas.app.collapsedSidebar 独立配置（默认 none 官方原样）；
+        //   折叠 class 在侧边栏内层 → 主界面用 :has() 从根选择。展开态用 areas.app + includeSidebar 偏移逻辑（不变）
         const cssParts = []
+        // 折叠判定：html 内存在 collapsed 侧边栏（收起时切换）
+        const collapsedNow = sidebarInfo && sidebarInfo.collapsed
+        const appArea = collapsedNow ? (areas.app.collapsedSidebar || { mode: 'none', opacity: 0 }) : areas.app
+        const useInclude = appArea.includeSidebar !== false
+        // 收起态宽度 = 侧边栏收起后的实测宽度（默认窄栏 ~50px；未检测到时用 52 近似）
+        const sbW = collapsedNow
+          ? (sidebarInfo.width > 0 && sidebarInfo.width < 120 ? Math.round(sidebarInfo.width) : 52)
+          : (sidebarInfo && sidebarInfo.width ? Math.round(sidebarInfo.width) : 0)
         let appBottom = null
-        if (areas.app.bottomColor) {
-          const abRgb = parseRgb(areas.app.bottomColor)
+        if (appArea.bottomColor) {
+          const abRgb = parseRgb(appArea.bottomColor)
           appBottom = 'rgb(' + abRgb[0] + ',' + abRgb[1] + ',' + abRgb[2] + ')'
         }
-        const appImg = areas.app.image
-        const appInclude = areas.app.includeSidebar !== false
-        if (areas.app.mode === 'image' && appImg) {
-          const op = areas.app.opacity == null ? 0 : areas.app.opacity
-          const layerRgb = appBottom ? parseRgb(areas.app.bottomColor) : parseRgb(baseBg)
+        const appImg = appArea.image
+        const appInclude = useInclude
+        if (appArea.mode === 'image' && appImg) {
+          const op = appArea.opacity == null ? 0 : appArea.opacity
+          const layerRgb = appBottom ? parseRgb(appArea.bottomColor) : parseRgb(baseBg)
           const grad = 'linear-gradient(rgba(' + layerRgb[0] + ',' + layerRgb[1] + ',' + layerRgb[2] + ',' + op + '), rgba(' + layerRgb[0] + ',' + layerRgb[1] + ',' + layerRgb[2] + ',' + op + '))'
           const url = 'url("' + appImg.dataURI + '")'
-          if (!appInclude && sidebarInfo && sidebarInfo.width) {
-            const sbW = Math.round(sidebarInfo.width)
+          if (!appInclude && sbW > 0) {
             const mainW = Math.max(100, Math.round(window.innerWidth - sbW))
             cssParts.push('html, body { background-color: ' + (appBottom || baseBg) + ' !important; background-image: ' + grad + ', ' + url + ' !important; background-size: ' + mainW + 'px 100%, ' + mainW + 'px 100% !important; background-position: ' + sbW + 'px center, ' + sbW + 'px center !important; background-repeat: no-repeat, no-repeat !important; }')
           } else {
             cssParts.push('html, body { background-color: ' + (appBottom || 'transparent') + ' !important; background-image: ' + grad + ', ' + url + ' !important; background-size: cover, cover !important; background-position: center !important; background-repeat: no-repeat !important; background-attachment: fixed !important; }')
           }
-        } else if (areas.app.mode === 'color') {
-          const a = 1 - (areas.app.opacity == null ? 0 : areas.app.opacity)
-          const rgbC = parseRgb(areas.app.color)
+        } else if (appArea.mode === 'color') {
+          const a = 1 - (appArea.opacity == null ? 0 : appArea.opacity)
+          const rgbC = parseRgb(appArea.color)
           const bg = appBottom || baseBg
           const grad = 'linear-gradient(rgba(' + rgbC[0] + ',' + rgbC[1] + ',' + rgbC[2] + ',' + a + '), rgba(' + rgbC[0] + ',' + rgbC[1] + ',' + rgbC[2] + ',' + a + '))'
-          if (!appInclude && sidebarInfo && sidebarInfo.width) {
-            const sbW = Math.round(sidebarInfo.width)
+          if (!appInclude && sbW > 0) {
             const mainW = Math.max(100, Math.round(window.innerWidth - sbW))
             cssParts.push('html, body { background-color: ' + bg + ' !important; background-image: ' + grad + ' !important; background-size: ' + mainW + 'px 100% !important; background-position: ' + sbW + 'px center !important; background-repeat: no-repeat !important; }')
           } else {
@@ -937,6 +981,7 @@ window.__ModuleLoader__.load({
           // 曾做 html,body 垫色（v0.9.2），但官方 _frame/三列等容器自带不透明背景盖住垫色看不到，
           // 且侧边栏「无」模式透出下层会透出垫色 → "侧边栏变红"（连锁问题）。
           // 主界面「无」模式已不显示底色选项（09 AreaEditor）；旧配置残留 bottomColor 也不再垫色。
+          // v1.0.4 收起态 none：同样零注入（官方原样）——但收起态无垫色会露出官方白底（无主界面图时正常）
         }
         return cssParts.join(' ')
       }
@@ -1009,28 +1054,46 @@ window.__ModuleLoader__.load({
       }
       function buildSidebarCss() {
         // 侧边栏（底色 + 图片/纯色/无）；三层独立架构（层1 body / 层2 底色 / 层3 ::before 图片）
+        // v1.0.4 收起态：折叠（官方 hHd-Xa_collapsed class，F12 实测）时用 areas.sidebar.collapsed 独立配置；
+        //   默认 mode:'none' = 官方原样（背景层 opacity:0）。切换用 transition 淡入淡出（容器/伪元素 opacity 过渡）。
+        //   折叠 class 在内层 hHd-Xa_root 上（sidebarInfo.selector 是外层列容器）→ 用 :has() 区分两态
         const cssParts = []
-        let bottomColor = null
-        if (areas.sidebar.bottomEnabled && areas.sidebar.bottomColor) {
-          const ba = 1 - (areas.sidebar.bottomOpacity == null ? 0 : areas.sidebar.bottomOpacity)
-          const [br, bg, bb] = parseRgb(areas.sidebar.bottomColor)
-          bottomColor = 'rgba(' + br + ',' + bg + ',' + bb + ',' + ba + ')'
-        }
-        if (areas.sidebar.mode === 'image' && areas.sidebar.image && sidebarInfo && sidebarInfo.selector) {
-          const maskAlpha = 1 - (areas.sidebar.opacity == null ? 0 : areas.sidebar.opacity)
+        const sel = sidebarInfo && sidebarInfo.selector ? sidebarInfo.selector : null
+        // 收起态选择器：collapsed class 可能在容器自身（兜底分支选中 hHd-Xa_root）或后代（列容器选中 _sidebarCol）
+        const colSel = sel ? sel + '[class*="_collapsed"], ' + sel + ':has([class*="_collapsed"])' : null
+        // 展开态选择器：非折叠才生效（:not 双条件）——与收起规则互斥，防折叠后展开规则残留
+        const expSel = sel ? sel + ':not([class*="_collapsed"]):not(:has([class*="_collapsed"]))' : null
+        if (!sel) return cssParts.join(' ')
+        const mk = (area, isCollapsed) => {
+          const out = []
+          const bottomColor = (() => {
+            if (!area.bottomEnabled || !area.bottomColor) return null
+            const ba = 1 - (area.bottomOpacity == null ? 0 : area.bottomOpacity)
+            const [br, bg, bb] = parseRgb(area.bottomColor)
+            return 'rgba(' + br + ',' + bg + ',' + bb + ',' + ba + ')'
+          })()
+          // 容器：底色 + 过渡（背景色淡入淡出；收起态默认官方原样 = 透明底）
           const bottom = bottomColor || 'transparent'
-          cssParts.push(sidebarInfo.selector + ' { position: relative !important; background-color: ' + bottom + ' !important; }')
-          cssParts.push(sidebarInfo.selector + '::before { content: "" !important; position: absolute !important; inset: 0 !important; pointer-events: none !important; background-image: var(--tcz-sidebar-img) !important; background-size: cover !important; background-position: center !important; background-repeat: no-repeat !important; -webkit-mask-image: linear-gradient(rgba(0,0,0,' + maskAlpha + '), rgba(0,0,0,' + maskAlpha + ')) !important; mask-image: linear-gradient(rgba(0,0,0,' + maskAlpha + '), rgba(0,0,0,' + maskAlpha + ')) !important; }')
-        }
-        if (areas.sidebar.mode === 'color' && sidebarInfo && sidebarInfo.selector) {
-          const a = 1 - (areas.sidebar.opacity == null ? 0 : areas.sidebar.opacity)
-          const [r, g, b] = parseRgb(areas.sidebar.color)
-          const bottom = bottomColor || 'transparent'
-          cssParts.push(sidebarInfo.selector + ' { background-color: ' + bottom + ' !important; background-image: linear-gradient(rgba(' + r + ',' + g + ',' + b + ',' + a + '), rgba(' + r + ',' + g + ',' + b + ',' + a + ')) !important; background-size: cover !important; background-position: center !important; background-repeat: no-repeat !important; }')
-        }
-        if ((areas.sidebar.mode === 'transparent' || (areas.sidebar.mode === 'image' && !areas.sidebar.image)) && bottomColor && sidebarInfo && sidebarInfo.selector) {
-          cssParts.push(sidebarInfo.selector + ' { background-color: ' + bottomColor + ' !important; }')
+          out.push((isCollapsed ? colSel : expSel) + ' { position: relative !important; background-color: ' + bottom + ' !important; transition: background-color 0.35s ease !important; }')
+          if (area.mode === 'image' && area.image) {
+            const maskAlpha = 1 - (area.opacity == null ? 0 : area.opacity)
+            out.push((isCollapsed ? colSel : expSel) + '::before { content: "" !important; position: absolute !important; inset: 0 !important; pointer-events: none !important; background-image: var(--tcz-sidebar-img) !important; background-size: cover !important; background-position: center !important; background-repeat: no-repeat !important; -webkit-mask-image: linear-gradient(rgba(0,0,0,' + maskAlpha + '), rgba(0,0,0,' + maskAlpha + ')) !important; mask-image: linear-gradient(rgba(0,0,0,' + maskAlpha + '), rgba(0,0,0,' + maskAlpha + ')) !important; opacity: 1 !important; transition: opacity 0.35s ease !important; }')
+          } else if (area.mode === 'color') {
+            // ⚠️ 纯色用**容器 background**（不用 ::before）：容器背景天然在内容之下，永不盖 UI（v20 架构）。
+            // v1.0.4 重构曾改 ::before → 盖住所有 UI（回归，用户反馈"纯色模式上边 UI 在颜色层下"）→ 改回容器背景。
+            const a = 1 - (area.opacity == null ? 0 : area.opacity)
+            const [r, g, b] = parseRgb(area.color)
+            out.push((isCollapsed ? colSel : expSel) + ' { background-color: ' + bottom + ' !important; background-image: linear-gradient(rgba(' + r + ',' + g + ',' + b + ',' + a + '), rgba(' + r + ',' + g + ',' + b + ',' + a + ')) !important; background-size: cover !important; background-position: center !important; background-repeat: no-repeat !important; }')
+          } else {
+            // 无/透明：背景层淡出（opacity 0），官方原样透出
+            out.push((isCollapsed ? colSel : expSel) + '::before { content: "" !important; position: absolute !important; inset: 0 !important; pointer-events: none !important; opacity: 0 !important; transition: opacity 0.35s ease !important; }')
+          }
+          return out
         }
+        // 展开态（默认）规则
+        cssParts.push.apply(cssParts, mk(areas.sidebar, false))
+        // 收起态规则（若配置了收起模式；默认 none → 淡出）
+        cssParts.push.apply(cssParts, mk(areas.sidebar.collapsed || { mode: 'none', opacity: 0 }, true))
         return cssParts.join(' ')
       }
       function buildBrandCss() {
@@ -1129,11 +1192,26 @@ window.__ModuleLoader__.load({
         return cssParts.join(' ')
       }
       function buildLiftCss() {
-        // 侧边栏图片模式下顶部 UI 提升（v20 铁律：只提升具体 UI 元素本身；须渲染在 ns 之后覆盖其 z-index:0）
+        // 侧边栏图片模式下内容提升（v20 铁律：任何会包住官方设置面板的祖先都不得建层叠上下文）。
+        // v1.0.4 修正（两次迭代）：
+        //  · 第一版：regionArea/footArea 加 z-index:1（建 mini 上下文）→ **盖住设置面板**（面板 DOM 在侧边栏内，
+        //    settingsArea 是兄弟，z-index:1 > auto 把面板压住，用户反馈"上方那一栏覆盖设置界面上层"）。
+        //  · 正确方案：用 `position: relative`（**不加 z-index**）——relative + z-index:auto **不建层叠上下文**
+        //    （面板不受影响），且内容 DOM 顺序在 ::before（伪元素，渲染为第一个子）之后 → 自然绘制在图片层之上。
+        //  · logoRow/新会话保持 z-index:1（v20 已验证安全：内部无 fixed 面板）。
+        //  · settingsArea 也加 position:relative（让设置按钮可见于图片层之上，且不关面板——relative 不建上下文）。
+        // 收起态图片（areas.sidebar.collapsed mode image）同样需要提升。
         const cssParts = []
-        if (areas.sidebar.mode === 'image' && areas.sidebar.image && sidebarInfo && sidebarInfo.selector) {
+        const hasExpandImg = areas.sidebar.mode === 'image' && areas.sidebar.image && sidebarInfo && sidebarInfo.selector
+        const sc = areas.sidebar.collapsed
+        const hasCollapsedImg = sc && sc.mode === 'image' && sc.image && sidebarInfo && sidebarInfo.selector
+        if (hasExpandImg || hasCollapsedImg) {
           cssParts.push(sidebarInfo.selector + ' [class*="_logoRow"] { position: relative !important; z-index: 1 !important; }')
           cssParts.push('[class*="_newSession"]:not([class*="_newSessionLabel"]) { position: relative !important; z-index: 1 !important; }')
+          // 内容区提升（不建上下文）：relative 无 z-index → DOM 顺序盖住 ::before，且不影响设置面板
+          cssParts.push(sidebarInfo.selector + ' [class*="_regionArea"] { position: relative !important; }')
+          cssParts.push(sidebarInfo.selector + ' [class*="_footArea"] { position: relative !important; }')
+          cssParts.push(sidebarInfo.selector + ' [class*="_settingsArea"] { position: relative !important; }')
         }
         return cssParts.join(' ')
       }
@@ -1292,11 +1370,20 @@ window.__ModuleLoader__.load({
       function buildThemeTokens() {
         const tokens = {}
         const app = areas.app, sb = areas.sidebar
-        if (app.mode === 'color' || app.mode === 'image') {
+        // v1.0.4：主界面 bg-base 透明化按当前折叠态判定（收起态 none → 不含该 token = 官方默认；
+        // ⚠️ 勿设 null——官方 validateOverrides 拒绝 null（必须 {light,dark} 字符串对），同名 source
+        // 整层替换，新层不含 bg-base 即恢复官方）
+        const collapsedNow = sidebarInfo && sidebarInfo.collapsed
+        const appArea = collapsedNow ? (areas.app.collapsedSidebar || {}) : app
+        if (appArea.mode === 'color' || appArea.mode === 'image') {
           tokens['--dsw-alias-bg-base'] = { light: 'transparent', dark: 'transparent' }
-          if (app.includeSidebar !== false) tokens['--dsw-specific-sidebar-fill'] = { light: 'transparent', dark: 'transparent' }
+          if (appArea.includeSidebar !== false) tokens['--dsw-specific-sidebar-fill'] = { light: 'transparent', dark: 'transparent' }
         }
-        if (sb.mode === 'transparent' || sb.mode === 'image' || sb.mode === 'color') tokens['--dsw-specific-sidebar-fill'] = { light: 'transparent', dark: 'transparent' }
+        // v1.0.4：侧边栏 fill 透明化按当前折叠态判定——收起态用 areas.sidebar.collapsed 配置
+        //   （有背景才透明化 fill，否则保留官方白 = 官方原样，符合"收起后默认官方原样"语义）
+        const sbCollapsed = sidebarInfo && sidebarInfo.collapsed
+        const sbArea = sbCollapsed ? (areas.sidebar.collapsed || {}) : sb
+        if (sbArea.mode === 'transparent' || sbArea.mode === 'image' || sbArea.mode === 'color') tokens['--dsw-specific-sidebar-fill'] = { light: 'transparent', dark: 'transparent' }
         for (const it of COLOR_ITEMS) {
           const v = colors[it.key]
           if (!v) continue
@@ -1399,7 +1486,25 @@ window.__ModuleLoader__.load({
           if (!sidebarInfo) refresh()
           // 网页变化（窗口缩放/布局变动）时重新检测侧边栏比例，保证选区比例始终跟手
           window.addEventListener('resize', refresh)
-          return () => window.removeEventListener('resize', refresh)
+          // v1.0.4 折叠态监听：官方折叠/展开会增删 hHd-Xa_collapsed class（F12 实测稳定后缀）。
+          // MutationObserver 监听 body 子树 class 变化 → 折叠切换时重新检测（collapsed + 宽度），
+          // setSidebarInfo 值比较保证零冗余重渲染。零定时器（事件驱动）
+          let collapseObserver = null
+          try {
+            let lastCollapsed = !!(document.querySelector('[class*="_collapsed"]'))
+            collapseObserver = new MutationObserver(() => {
+              const nowCollapsed = !!(document.querySelector('[class*="_collapsed"]'))
+              if (nowCollapsed !== lastCollapsed) {
+                lastCollapsed = nowCollapsed
+                refresh()
+              }
+            })
+            collapseObserver.observe(document.body, { attributes: true, attributeFilter: ['class'], subtree: true, childList: true })
+          } catch (e) { /* 忽略（observer 不可用时只在 resize 时重检） */ }
+          return () => {
+            window.removeEventListener('resize', refresh)
+            if (collapseObserver) { try { collapseObserver.disconnect() } catch (e) { /* 忽略 */ } }
+          }
         }, [])
 
         // 输入区固定高度：卡片实测宽高比缓存。
@@ -1520,8 +1625,11 @@ window.__ModuleLoader__.load({
         React.useEffect(() => {
           const cleanup = () => document.querySelectorAll('[data-thmcz-details-reset]').forEach((el) => { try { el.remove() } catch (e) { /* 忽略 */ } })
           if (!detailsDragEnabled) { cleanup(); return undefined }
+          // v1.0.4：侧边栏折叠态不注入复位按钮（收起后 trigger 变窄，两文字挤在一起——用户要求收起后不显示）
+          const isCollapsed = () => !!document.querySelector('[class*="_collapsed"]')
           let btn = null
           const ensure = () => {
+            if (isCollapsed()) { if (btn) { try { btn.remove() } catch (e) { /* 忽略 */ } btn = null } return }
             if (btn) return
             const t = document.querySelector('[class*="VOzbGW_trigger"]')
             if (!t) return
@@ -1537,8 +1645,8 @@ window.__ModuleLoader__.load({
           ensure()
           let obs = null
           try {
-            obs = new MutationObserver(ensure)
-            obs.observe(document.body, { childList: true, subtree: true })
+            obs = new MutationObserver(() => { ensure() })
+            obs.observe(document.body, { childList: true, subtree: true, attributes: true, attributeFilter: ['class'] })
           } catch (e) { /* 忽略 */ }
           window.addEventListener('resize', ensure)
           return () => {
@@ -1558,18 +1666,21 @@ window.__ModuleLoader__.load({
           if (!theme || typeof theme.overrideTokens !== 'function') return undefined
           const tokens = buildThemeTokens()
           let disposer
-          if (Object.keys(tokens).length) {
-            try { disposer = theme.overrideTokens('theme-customizer', tokens) } catch (e) { /* 忽略 */ }
-          }
+          // v1.0.4：tokens 为空也调用（空对象整层替换 → 清除旧透明覆盖，恢复官方）——
+          // 折叠态 none 需把展开态设置的 bg-base transparent 清掉；旧逻辑空对象直接跳过会残留
+          try { disposer = theme.overrideTokens('theme-customizer', tokens) } catch (e) { /* 忽略 */ }
           return () => { if (typeof disposer === 'function') disposer() }
-        }, [areas.app.mode, areas.app.includeSidebar, areas.app.image, areas.sidebar.mode, areas.sidebar.image, colors, convBgs])
+        }, [areas.app, areas.sidebar, sidebarInfo, colors, convBgs])
 
         // 各模块 CSS 用缓存（依赖只含本模块状态；拖动中 manualCssRefresh 已直更 style，这里保证 React 状态一致）
         // ⚠️ 防御：areas.float/details/cordis 可能 undefined（旧配置整体替换后缺键），依赖数组用兜底访问（v0.9.13 事故修复）
         const flDep = areas.float || {}
         const detDep = areas.details || {}
         const corDep = areas.cordis || {}
-        const imgVars = React.useMemo(() => buildImgVars(), [areas.sidebar.mode, areas.sidebar.image, areas.composer.mode, areas.composer.image, newSession.mode, newSession.image, detDep.mode, detDep.image, flDep.mode, flDep.image, corDep.mode, corDep.image, sidebarInfo])
+        // v1.0.4：imgVars 依赖必须含收起态图片（areas.sidebar.collapsed.image 引用）——只设「收起后」图片时
+        // areas.sidebar.mode/image（展开态）不变，缺依赖 → useMemo 不重算 → --tcz-sidebar-img 变量不生成 → 图片不显示
+        const scImg = areas.sidebar && areas.sidebar.collapsed && areas.sidebar.collapsed.image
+        const imgVars = React.useMemo(() => buildImgVars(), [areas.sidebar.mode, areas.sidebar.image, scImg, areas.composer.mode, areas.composer.image, newSession.mode, newSession.image, detDep.mode, detDep.image, flDep.mode, flDep.image, corDep.mode, corDep.image, sidebarInfo])
         const appCss = React.useMemo(() => buildAppCss(), [areas.app, sidebarInfo, baseBg])
         const composerCss = React.useMemo(() => buildComposerCss(), [areas.composer, composerFixedHeight, composerRows, baseBg])
         const detailsCss = React.useMemo(() => buildDetailsCss(), [areas.details, baseBg, detailsPos])
@@ -1577,7 +1688,8 @@ window.__ModuleLoader__.load({
         const brandCss = React.useMemo(() => buildBrandCss(), [brand, brandHarness])
         const bordersCss = React.useMemo(() => buildBordersCss(), [borders])
         const newSessionCss = React.useMemo(() => buildNewSessionCss(), [newSession])
-        const liftCss = React.useMemo(() => buildLiftCss(), [areas.sidebar.mode, areas.sidebar.image, sidebarInfo])
+        // v1.0.4：liftCss 依赖同加收起态图片（收起态图片时 logoRow 提升）
+        const liftCss = React.useMemo(() => buildLiftCss(), [areas.sidebar.mode, areas.sidebar.image, scImg, sidebarInfo])
         const cordisCss = React.useMemo(() => buildCordisCss(), [areas.cordis, baseBg])
         const floatCss = React.useMemo(() => buildFloatCss(), [floatVisible, areas.float])
         const convCss = React.useMemo(() => buildConvCss(), [convBgs.scrollbar, convBgs.chatScroll, convBgs.todoCollapsed, convBgs.todoExpanded, convBgs.addBtn, convBgs.cmdMenu, convBgs.addBtnOpacity, convBgs.cmdMenuOpacity, convBgs.toBottom, convBgs.sliderColor, convBgs.sliderOpacity, convBgs.sliderTrackColor, convBgs.sliderTrackOpacity, convBgs.scrollColor, convBgs.scrollOpacity, convBgs.scrollbarOpacity, convBgs.chatScrollOpacity, convBgs.todoCollapsedOpacity, convBgs.todoExpandedOpacity, convBgs.toBottomOpacity, convBgs.bubbleOpacity, convBgs.inlineOpacity, convBgs.codeOpacity])
@@ -1987,6 +2099,15 @@ window.__ModuleLoader__.load({
         }
         return 16 / 9
       }
+      // v1.0.4 侧边栏收起后子版块裁剪比例：窄栏极窄（宽 ~52-70px / 高 ~视口），与展开侧边栏/视口比例完全不同。
+      // 折叠时用 sidebarInfo 实测窄栏比例；展开时用官方窄栏宽度近似（rail 模式 ~60px）/ 视口高度
+      function getCollapsedRatio() {
+        if (sidebarInfo && sidebarInfo.collapsed && sidebarInfo.width > 0 && sidebarInfo.height > 0) {
+          return sidebarInfo.width / sidebarInfo.height
+        }
+        const vh = typeof window !== 'undefined' ? window.innerHeight : 800
+        return 60 / vh
+      }
 
       // ════════ 09_background.js ════════
       // ┌─ 片段 09_background ────────────────────────────
@@ -2040,7 +2161,9 @@ window.__ModuleLoader__.load({
                   modes.map((m) => React.createElement('option', { key: m.id, value: m.id }, m.label)))
               : null,
           ),
-          area.id === 'app'
+          // v1.0.4：collapsedSubApp（主界面收起后）也显示区域开关——与 app 同布局
+          // （「主界面」标签行 → 显示区域 → 模式内容，用户定位置）
+          (area.id === 'app' || area.id === 'collapsedSubApp')
             ? React.createElement('div', { style: { display: 'flex', alignItems: 'center', gap: '8px', marginTop: '4px', marginBottom: '4px', flexWrap: 'wrap' } },
                 React.createElement('span', { style: { fontSize: '12px', color: 'var(--dsw-alias-label-secondary)', flex: 'none' } }, '显示区域：'),
                 React.createElement('button', { type: 'button', onClick: () => onChange({ ...value, includeSidebar: true }), style: { padding: '4px 10px', borderRadius: '6px', cursor: 'pointer', border: '1px solid ' + (value.includeSidebar === false ? 'var(--dsw-alias-border-l2)' : 'var(--dsw-alias-brand-primary)'), background: value.includeSidebar === false ? 'transparent' : 'var(--dsw-alias-brand-primary)', color: value.includeSidebar === false ? 'var(--dsw-alias-label-primary)' : '#fff', fontSize: '12px' } }, '包含侧边栏'),
@@ -2082,8 +2205,10 @@ window.__ModuleLoader__.load({
           // ⚠️ v1.0.1（2026-08-22 用户定）：主界面「无」模式不显示底色——无模式下官方原样、不做垫色
           //   （此前「无」模式垫色被官方 _frame/三列不透明背景盖住看不到，且透出到侧边栏导致"侧边栏变红"连锁问题）；
           //   纯色/图片模式的底层垫色保留（appBottom 仍参与 color/image 分支）
-          (area.id !== 'app' || value.mode !== 'none') && (area.id === 'app' || area.id === 'sidebar' || area.id === 'composer' || area.id === 'details' || area.id === 'float' || area.id === 'cordis')
-            ? React.createElement(BottomRow, { value: value, onChange: (next) => onChange({ ...value, ...next }), style: { marginTop: '4px', marginBottom: '4px' }, title: '底色', hideOpacity: area.id === 'app', noSwitch: area.id !== 'sidebar' })
+          // v1.0.4：collapsedSub（侧边栏收起后）支持底色（同 sidebar：可开关 + 透明度）；
+          // collapsedSubApp（主界面收起后）= app 式（无开关、无透明度、仅颜色）
+          (area.id !== 'app' || value.mode !== 'none') && (area.id === 'app' || area.id === 'sidebar' || area.id === 'composer' || area.id === 'details' || area.id === 'float' || area.id === 'cordis' || area.id === 'collapsedSub' || area.id === 'collapsedSubApp')
+            ? React.createElement(BottomRow, { value: value, onChange: (next) => onChange({ ...value, ...next }), style: { marginTop: '4px', marginBottom: '4px' }, title: '底色', hideOpacity: area.id === 'app' || area.id === 'collapsedSubApp', noSwitch: area.id !== 'sidebar' && area.id !== 'collapsedSub' })
             : null,
           children,
         )
@@ -2232,7 +2357,7 @@ window.__ModuleLoader__.load({
 
       // 「Cordis 按钮常驻」勾选（v0.9.14 起在 Cordis 插件界面区域卡片内，原独立卡片已删）：
       // 自身订阅 store（main 通道），childModules useMemo 闭包不捕获旧值。
-      // v1.0.0 开源：开关旁加小字——此开关依赖官方 dsh-client-ui-cordis 补丁，未打补丁时不生效（用户定"留着，标明要打补丁"）
+      // v1.0.0 开源：开关旁加小字——此开关依赖 dsh-client-ui-cordis 补丁（本插件自带的 apply-patch.cjs 补丁），未打补丁时不生效（用户定"留着，标明要打补丁"）
       function CordisEntryToggle() {
         const { cordisEntry } = useStore(['main'])
         // 开关仅勾选框触发（v0.9.20）
@@ -2242,7 +2367,7 @@ window.__ModuleLoader__.load({
             React.createElement('span', null, 'Cordis 按钮常驻'),
           ),
           React.createElement('div', { style: { fontSize: '11px', color: 'var(--dsw-alias-label-caption)', marginTop: '4px', marginLeft: '22px' } },
-            '需安装官方 Cordis 按钮补丁才生效（见 PATCH-CORDIS-BUTTON.md）'),
+            '需安装 Cordis 按钮补丁才生效（见 PATCH-CORDIS-BUTTON.md）'),
         )
       }
 
@@ -2331,9 +2456,25 @@ window.__ModuleLoader__.load({
         )
       }
 
+      // 「侧边栏收起后 / 主界面侧边栏收起后」子版块（v1.0.4）：
+      // 复用 AreaEditor 渲染嵌套配置（areas.sidebar.collapsed / areas.app.collapsedSidebar，默认 mode:'none' 官方原样）。
+      // 简化：收起态无「无/透明」区分（模式列表去 transparent）；用独立 AreaEditor 实例 + 独立 area 描述。
+      // v1.0.4 补充：主界面收起后的「显示区域」开关由 AreaEditor 内部渲染（area.id === 'collapsedSubApp'，
+      // 与 app 同布局：标签行 → 显示区域 → 模式内容）；appLike=true 底色 = 主界面式（无开关、无透明度）
+      function CollapsedAreaEditor({ label, value, onChange, ratio, appLike }) {
+        // 收起态子版块的区域描述：mode 列表 = color/image/none（默认官方原样，无 transparent）
+        // id：侧边栏收起后 = collapsedSub（sidebar 式底色）；主界面收起后 = collapsedSubApp（app 式底色，AreaEditor 按 id 区分）
+        const innerId = appLike ? 'collapsedSubApp' : 'collapsedSub'
+        const innerArea = React.useMemo(() => ({ id: innerId, label, supported: true, modes: ['none', 'color', 'image'] }), [innerId, label])
+        return React.createElement('div', { style: { marginTop: '6px', borderTop: '1px dashed var(--dsw-alias-border-l2)', paddingTop: '6px' } },
+          React.createElement('div', { style: { fontSize: '12px', color: 'var(--dsw-alias-label-secondary)', marginBottom: '4px' } }, '侧边栏收起后'),
+          React.createElement(AreaEditor, { area: innerArea, value: value, onChange: onChange, ratio: ratio }),
+        )
+      }
+
       // 「界面」模块外壳（原 ModuleContent background 分支）：透明度说明 → 全部 AREAS 区域卡片（主界面/侧边栏/对话区/输入区/设置界面/浮窗面板/Cordis 插件界面）
       function BackgroundModule() {
-        const { areas, sidebarInfo, cordisEntry, showOpacityHint, convBgs } = useStore()
+        const { areas, sidebarInfo, showOpacityHint } = useStore()
         // 性能优化 2026-08-21：AreaEditor 已 memo 化 → onChange/children 必须稳定引用，
         // 否则父级每次重渲染都新建闭包/元素，memo 浅比较失效（所有区域跟着全量重渲染）
         const changeArea = React.useMemo(() => {
@@ -2341,13 +2482,23 @@ window.__ModuleLoader__.load({
           for (const a of AREAS) m[a.id] = (v) => setArea(a.id, v)
           return m
         }, [])
+        // v1.0.4 收起态子版块 onChange（写回嵌套字段，触发 areas 引用变化 → AreaCss 重算）：
+        // 稳定引用（useMemo），避免父级重渲染破坏 AreaEditor memo
+        const changeCollapsed = React.useMemo(() => ({
+          sidebar: (v) => setArea('sidebar', { ...areas.sidebar, collapsed: v }),
+          app: (v) => setArea('app', { ...areas.app, collapsedSidebar: v }),
+        }), [areas.sidebar, areas.app])
         const childModules = React.useMemo(() => ({
           // 「新会话」是侧边栏区块的一部分；「统计条/命令」是输入区区块的一部分（渲染在对应卡片内部末尾）；
           // 「对话区背景」是对话区区块的一部分（渲染在对话区卡片内部末尾）
           // 输入区卡片内部结构（v0.9.11 用户定）：底色（AreaEditor 内）→ 输入框高度（ComposerHeightRow，板块直属）→ 统计条/命令（ComposerEditor 子版块）
           // 浮窗面板卡片（v0.9.13）：背景调整（AreaEditor）+ 显示透明度说明勾选（children）
           // 各子版块自身订阅 store → store 变化时自行重渲染，不受父级跳过影响
+          // v1.0.4：主界面/侧边栏卡片加「收起后」子版块（CollapsedAreaEditor 内部用独立 AreaEditor，自有 state）；
+          // 侧边栏卡片的「侧边栏收起后」在最上方（用户定：在标志 BrandEditor 上面）
           sidebar: React.createElement(React.Fragment, null,
+            // v1.0.4 收起后子版块：ratio 用窄栏实测比例（getCollapsedRatio，折叠时实测 / 展开时 ~60px 近似）
+            React.createElement(CollapsedAreaEditor, { label: '侧边栏', value: (areas.sidebar && areas.sidebar.collapsed) || { mode: 'none', opacity: 0 }, onChange: changeCollapsed.sidebar, ratio: getCollapsedRatio() }),
             React.createElement(BrandEditor, null),
             React.createElement(NewSessionEditor, null),
           ),
@@ -2362,7 +2513,7 @@ window.__ModuleLoader__.load({
           ),
           cordis: React.createElement(CordisEntryToggle, null),
           details: React.createElement(DetailsResetPos, null),
-        }), [])
+        }), [areas.sidebar, areas.app, changeCollapsed, sidebarInfo])
         return React.createElement('div', null,
           showOpacityHint
             ? React.createElement('div', { style: { fontSize: '12px', color: 'var(--dsw-alias-label-secondary)', marginBottom: '8px', whiteSpace: 'pre-line' } },
@@ -2373,7 +2524,27 @@ window.__ModuleLoader__.load({
             // ⚠️ 防御：旧配置整体替换后新区域（float/details/cordis）可能缺失 → emptyArea 兜底（v0.9.13 事故修复）
             area: a, value: areas[a.id] && typeof areas[a.id] === 'object' ? areas[a.id] : emptyArea(), onChange: changeArea[a.id],
             ratio: getCropRatio(a),
-            children: childModules[a.id] || null,
+            children: a.id === 'app'
+              ? React.createElement(React.Fragment, null,
+                  React.createElement(CollapsedAreaEditor, {
+                    label: '主界面', appLike: true,
+                    value: (areas.app && areas.app.collapsedSidebar) || { mode: 'none', opacity: 0 },
+                    onChange: changeCollapsed.app,
+                    // 收起后主界面选区比例：不包含侧边栏时 = (视口宽-窄栏宽)/高；包含时 = 整屏
+                    ratio: (() => {
+                      const vw = typeof window !== 'undefined' ? window.innerWidth : 1280
+                      const vh = typeof window !== 'undefined' ? window.innerHeight : 800
+                      const cs = (areas.app && areas.app.collapsedSidebar) || {}
+                      if (cs.includeSidebar === false) {
+                        const sbw = sidebarInfo && sidebarInfo.width < 120 ? sidebarInfo.width : 60
+                        return Math.max(0.1, (vw - sbw) / vh)
+                      }
+                      return vw / vh
+                    })(),
+                  }),
+                  childModules[a.id] || null,
+                )
+              : (childModules[a.id] || null),
           })),
         )
       }
@@ -2924,9 +3095,9 @@ window.__ModuleLoader__.load({
       // ✅ 最终方案：侧边栏复位按钮改用**原生 DOM 注入**（07 AreaCss useEffect：VOzbGW_trigger 右半注入），
       // 不再注册任何 sidebar 槽位。
 
-      // ── Cordis 常驻：官方按钮已由官方包补丁支持常驻（window.__TCZ_HIDE_OFFICIAL_CORDIS 控制开关）──
+      // ── Cordis 常驻：官方按钮已由 dsh-client-ui-cordis 补丁（apply-patch.cjs）支持常驻（window.__TCZ_HIDE_OFFICIAL_CORDIS 控制开关）──
       // 开关状态同步到 window 变量（官方组件渲染时读取）；false=常驻，true=恢复官方逻辑
-      // 官方包补丁已监听 'tcz:cordis-visibility' 事件 → 切换后立即重渲染（无需刷新页面）
+      // 补丁已监听 'tcz:cordis-visibility' 事件 → 切换后立即重渲染（无需刷新页面）
       function applyCordisEntryFlag() {
         try { window.__TCZ_HIDE_OFFICIAL_CORDIS = !cordisEntry } catch (e) { /* 忽略 */ }
         try { window.dispatchEvent(new Event('tcz:cordis-visibility')) } catch (e) { /* 忽略 */ }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dsh-theme-customizer",
-  "version": "1.0.3",
+  "version": "1.0.4",
   "description": "DeepSeek Harness (DSH) Web 界面自定义主题插件：七区域背景（主界面/侧边栏/输入区/设置界面/浮窗/Cordis，纯色/图片/选区裁剪/透明度）、文字颜色 5 类、框线颜色、标志调色、对话区细节定制、输入区统计条接管、浮动主题面板、预设导入导出（.tczp 含图）、localStorage 持久化。",
   "license": "MIT",
   "type": "module",