dsh-bridge-gateway 0.1.3 → 0.1.5

package/CHANGELOG.md

@@ -2,6 +2,26 @@
 
 本项目 `dsh-bridge-gateway` 是基于 [dsh-bridge](https://github.com/wenbin-wb/dsh-bridge) 的移植增强分支，在保留原版能力之外，重点新增「公网直连网关」。
 
+## [0.1.5] - 2026-09-12
+
+### 变更
+- 适配 DSH 0.1.5：RPC 通道从 `connection.rpc.handle` 迁到 webServer 直注册 + `connection.requestRejection` 鉴权（0.1.5 inject 守卫使旧入口不可用，wire 格式不变）。
+
+### 修复（移动端深度适配批次，基于 390px/320px 真机实测坐标）
+- 顶栏「标准模式」与「对话管理」水平重叠（390px 下重叠 11px）：titleRow 允许换行，titleCluster/headerActions/headerUtilities 各自可收缩并限宽（45vw/50vw），内部按钮限宽省略号。
+- 输入框被撑到 780px 而消息列仅 318px：从会话根节点收窄 `--dsh-chat-content-width`/`--dsh-composer-card-max-width` 变量，并补上此前遗漏的 `uV2eYG_root` 约束层，输入框祖先链整体不超视口。
+- 320px 下 git 分支 chip 溢出屏幕右侧 39px 被裁切：chip 限宽 `min(120px, 30vw)`，其 `position:absolute` 浮层锚点改用 `right: 8px` 覆盖内联 `left`。
+- 主要控件（模型/权限/工作区/分支 chip/会话操作等 10 类按钮）点击热区经伪元素 `inset: -8px` 扩至约 44px，视觉尺寸不变。
+- 侧边栏关闭时仅被 transform 移出屏幕、内部 7 个按钮仍可被 Tab 聚焦：改用 `visibility: hidden` + `pointer-events: none`，抽屉打开时恢复。
+- 隐藏 dsh-better-sidebar 注入的全屏 `panel-host` 遮罩（z-index 25 压住输入框并拦截点击）与主题装饰性 `glass-fade` 渐变条（右下角小方块）。
+- 输入框底部工具栏（权限选择器/模型选择器/添加命令/发送）弹性自适应互不重叠。
+- 侧边栏抽屉底部溢出屏幕 38px：`box-sizing: border-box` + `100dvh` 高度约束。
+
+## [0.1.4] - 2026-08-30
+
+### 修复
+- 修复「远程访问」面板在宿主连接未建立时无限卡在「加载中」的问题：为状态拉取增加兜底超时（15s），超时后释放 in-flight 锁并给出可用的「🔄 重试」按钮，避免面板永远无法自行恢复。
+
 ## [0.1.3] - 待发布
 
 ### 修复

package/README.md

@@ -1,47 +1,82 @@
 # dsh-bridge-gateway
 
-DeepSeek Harness 远程访问插件：以 [dsh-bridge](https://github.com/wenbin-wb/dsh-bridge) 为基础，额外加入 **「公网直连网关」**，让手机/外网设备能直接访问操作电脑上的 Harness。
+English | [简体中文](./README.zh.md)
 
-局域网、Cloudflare 隧道、自建隧道、IM 机器人等原有能力保持不变。
+Remote-access plugin for DeepSeek Harness (DSH). Built on top of [dsh-bridge](https://github.com/wenbin-wb/dsh-bridge), it adds a **public direct-connect gateway** so phones and other out-of-network devices can open and operate the Harness running on your computer — no tunnel required.
 
-## 一键安装
+LAN access, Cloudflare tunnels, custom tunnels, and the IM bots all keep working exactly as before. The plugin is fully inert until you enable the features you want.
 
-```bash
+## Features
+
+- **Public direct-connect gateway.** The computer listens on `0.0.0.0:<port>` with its own HTTPS self-signed certificate and a forced login gate, so outside devices connect straight to your machine. The link is terminated at the gateway and proxied to the DSH loopback, so plugin pages and RPC channels work unchanged.
+- **LAN access.** Scan a QR code from the remote-access panel on the same Wi-Fi and you are in.
+- **Public tunnels.** Cloudflare (temporary or fixed hostname) or a self-built tunnel, selectable per need alongside the direct gateway.
+- **Remote workspace.** Browse the host's directory tree and pick workspace conversations from the phone.
+- **Security.** Password gate + QR-based password-free token + admin unlock/lock for sensitive config + rate limiting against brute force. Client-claimed `isLocalhost` is never trusted.
+- **IM bots.** WeChat / QQ / Feishu / Telegram bots connect through their own gateway links — no public IP needed. Per-platform guides live in [docs/](./docs).
+- **Mobile-friendly web.** The remote web UI is deeply adapted for phone screens: drawer sidebar (fully hidden when closed, removing keyboard/screen-reader focus traps), top-bar mode and conversation-management controls that wrap instead of overlapping, git branch chips anchored to the viewport edge instead of being clipped, composer width aligned with the conversation column and stuck to the bottom, ~44px touch targets on the main controls via pseudo-element hit areas, and removal of full-screen overlays and decorative gradient strips that covered the input box.
+- **All configuration in the UI.** Every feature above is configured from DSH Web's remote-access panel; nothing is edited by hand.
+
+## Requirements
+
+- Node `^22.19.0 || >=24.0.0`.
+- DSH with a web profile (built and tested against `0.1.5-rc.2`; adapted for the 0.1.5 RPC/webServer entry points).
+
+## Install
+
+```sh
+# Preferred: install straight from GitHub (no npm involved)
+dsh plugin --profile web add github:lament-z/dsh-bridge-gateway
+
+# Alternative: from npm
 dsh plugin --profile web add dsh-bridge-gateway
+
+# From a local clone / working copy
+dsh plugin --profile web add link:<this directory>
 ```
 
-> 源码安装：`git clone https://github.com/lament-z/dsh-bridge-gateway && dsh plugin --profile web add ./dsh-bridge-gateway`
+Upgrade to the newest build: `dsh plugin --profile web add github:lament-z/dsh-bridge-gateway` again (or append `@latest` for the npm source). Then restart `dsh web`.
+
+Nothing changes on install: the gateway is off by default and the original LAN/tunnel/IM behavior is untouched.
+
+## Usage
+
+### Public direct-connect gateway (core feature)
+
+No tunnel needed — the computer exposes a port itself and outside devices connect directly.
+
+1. Install, then open DSH Web -> Settings -> **Public Access** tab.
+2. In the **Direct Gateway** card, set the port (default `7443`) and click save.
+3. Click **Enable Direct Gateway**.
+4. Map that port to this machine on your router / cloud server, then open `https://<public-IP-or-domain>:<port>` from outside.
+
+First visit shows a certificate warning because the HTTPS certificate is self-signed — choose "always allow" to continue. External visitors must pass the login gate configured under **Security**; the gate policy is independent of your LAN settings.
+
+### LAN access
 
-升级到最新版：`dsh plugin --profile web add dsh-bridge-gateway@latest`
+Open the remote-access panel in DSH Web and scan the QR code with the phone on the same Wi-Fi.
 
-## 核心功能：公网直连网关
+### Public tunnel
 
-不需要隧道，让电脑直接监听公网端口，外网直连访问。
+In the same panel choose Cloudflare (temporary or fixed hostname) or a self-built tunnel. See [docs/custom-tunnel.md](./docs/custom-tunnel.md) for the custom-tunnel protocol.
 
-- **HTTPS 自签证书**：本机自动生成，公网传输加密。
-- **强制登录门禁**：外部访问必须输入你在「安全认证」里设置的密码，与局域网策略相互独立。
-- **全界面配置**：端口、随 DSH 自动启动等，都在「公网访问」设置页里配置。
+### Security configuration
 
-### 开启方式
+Settings -> Security: enable protection, set the password, manage the password-free token, and unlock/lock the admin surface. Unauthorized visitors are rejected before any page content is served.
 
-1. 安装后进入 DSH Web 设置 → 「公网访问」Tab。
-2. 在「直连网关」卡片设置端口（默认 `7443`），点「保存端口」。
-3. 点击「开启直连网关」。
-4. 在路由器/云服务器把该端口映射到本机，即可通过 `https://<公网IP或域名>:端口` 访问。
+### IM bots
 
-浏览器首次访问会提示证书不安全，勾选「始终允许」即可继续。
+WeChat / QQ / Feishu / Telegram guides: [docs/wechat-usage.md](./docs/wechat-usage.md), [docs/qq-usage.md](./docs/qq-usage.md), [docs/feishu-usage.md](./docs/feishu-usage.md), [docs/telegram-usage.md](./docs/telegram-usage.md).
 
-## 其他能力
+## Security notes
 
-- **局域网访问**：同一 Wi-Fi 扫码即可。
-- **公网隧道**：Cloudflare（临时/固定域名）或自建隧道二选一，与直连网关按需选用。
-- **远程工作区**：手机端网页目录树直接浏览并选择工作区对话。
-- **安全认证**：密码 + 扫码免密 Token + 管理后台防篡改 + 防暴力破解。
-- **IM 机器人**：微信 / QQ / 飞书 / Telegram 扫码直连，无需公网。
+- The direct gateway always enforces `public_only`-style gating: external visitors authenticate through the same AuthManager as LAN access, and loopback-only resources stay loopback-only.
+- RPC channels are registered through the host web server and pass request-rejection authentication, so forged or unauthenticated channel calls are dropped at the entry.
+- The self-signed certificate encrypts transport; it does not add identity. Anyone with the password can log in — keep the password strong and enable admin lock.
 
-## 开发
+## Development
 
-```bash
+```sh
 git clone https://github.com/lament-z/dsh-bridge-gateway
 cd dsh-bridge-gateway
 npm install
@@ -50,10 +85,10 @@ npm test
 dsh plugin --profile web add .
 ```
 
-## 发布说明
+## Release notes
 
-打 `v*` 标签推送到 GitHub 即自动 `npm publish`（GitHub Actions，需仓库配置 `NPM_TOKEN` secret）。
+Pushing a `v*` tag to GitHub triggers automatic `npm publish` (GitHub Actions; the repository needs an `NPM_TOKEN` secret).
 
-## 开源协议
+## License
 
-[MIT](./LICENSE)
+[MIT](./LICENSE)

package/README.zh.md

@@ -0,0 +1,110 @@
+# dsh-bridge-gateway
+
+[English](./README.md) | 简体中文
+
+DeepSeek Harness（DSH）远程访问插件。以 [dsh-bridge](https://github.com/wenbin-wb/dsh-bridge)
+为根基，额外加入**「公网直连网关」**，让手机等外网设备不借助隧道就能直接访问、操作电脑上的
+Harness。
+
+局域网访问、Cloudflare 隧道、自建隧道、IM 机器人等原有能力保持不变；插件默认完全不启用，
+装上后原有行为零改动，需要什么再开什么。
+
+## 功能
+
+- **公网直连网关。** 电脑直接监听 `0.0.0.0:<端口>`，自带 HTTPS 自签证书与强制登录门禁，
+  外网设备直连访问。链路在网关处终结并转发到 DSH loopback，插件页面与 RPC 通道原样可用。
+- **局域网访问。** 同一 Wi-Fi 下用手机扫远程访问面板里的二维码即可进入。
+- **公网隧道。** Cloudflare（临时/固定域名）或自建隧道，与直连网关按需二选一或并存。
+- **远程工作区。** 手机端网页目录树直接浏览并选择工作区对话。
+- **安全认证。** 密码门禁 + 扫码免密 Token + 敏感配置的管理员解锁/锁定 + 防暴力破解限频；
+  永不信任客户端自称的 `isLocalhost`。
+- **IM 机器人。** 微信 / QQ / 飞书 / Telegram 机器人走各自网关链路，无需公网 IP；
+  分平台指南见 [docs/](./docs)。
+- **移动端适配。** 远程网页 UI 针对手机屏幕深度适配：抽屉化侧边栏（隐藏后消除键盘/读屏
+  焦点陷阱）、顶栏「标准模式/对话管理」换行不再重叠、git 分支 chip 按视口右边界锚定不再
+  被裁切、输入框宽度与对话列对齐且 sticky 固定于底部、主要控件以伪元素把点击热区扩到
+  约 44px、隐藏会遮挡输入框的全屏遮罩与装饰性渐变条。
+- **全界面配置。** 以上全部功能都在 DSH Web 远程访问面板里配置，无需手改任何文件。
+
+## 要求
+
+- Node `^22.19.0 || >=24.0.0`。
+- DSH web profile（构建与测试基于 `0.1.5-rc.2`，已适配 0.1.5 的 RPC/webServer 入口）。
+
+## 安装
+
+```sh
+# 推荐：直接从 GitHub 安装（不经 npm）
+dsh plugin --profile web add github:lament-z/dsh-bridge-gateway
+
+# 备选：从 npm 安装
+dsh plugin --profile web add dsh-bridge-gateway
+
+# 从本地 clone / 工作副本安装
+dsh plugin --profile web add link:<本目录>
+```
+
+升级到最新版：再次执行上面的 GitHub 安装命令（npm 来源可加 `@latest`）。然后重启 `dsh web`。
+
+安装后默认不启用：直连网关关闭，原有局域网/隧道/IM 行为完全不变。
+
+## 使用方法
+
+### 公网直连网关（核心功能）
+
+不需要隧道，让电脑直接监听公网端口，外网直连访问。
+
+1. 安装后进入 DSH Web 设置 -> **公网访问** Tab。
+2. 在**直连网关**卡片设置端口（默认 `7443`），点「保存端口」。
+3. 点击「开启直连网关」。
+4. 在路由器/云服务器把该端口映射到本机，即可通过 `https://<公网IP或域名>:端口` 访问。
+
+HTTPS 证书为自签，浏览器首次访问会提示不安全，勾选「始终允许」即可继续。外部访客必须通过
+**安全认证**里配置的登录门禁；门禁策略与局域网设置相互独立。
+
+### 局域网访问
+
+在 DSH Web 打开远程访问面板，用同一 Wi-Fi 下的手机扫二维码。
+
+### 公网隧道
+
+同一面板里选择 Cloudflare（临时/固定域名）或自建隧道。自建隧道协议见
+[docs/custom-tunnel.md](./docs/custom-tunnel.md)。
+
+### 安全配置
+
+设置 -> 安全认证：开启防护、设置密码、管理免密 Token、解锁/锁定管理面。未认证访客在
+任何页面内容返回之前就会被拒绝。
+
+### IM 机器人
+
+微信 / QQ / 飞书 / Telegram 使用指南：
+[docs/wechat-usage.md](./docs/wechat-usage.md)、[docs/qq-usage.md](./docs/qq-usage.md)、
+[docs/feishu-usage.md](./docs/feishu-usage.md)、[docs/telegram-usage.md](./docs/telegram-usage.md)。
+
+## 安全说明
+
+- 直连网关始终强制 `public_only` 式门禁：外部访客与局域网访问共用同一 AuthManager 认证，
+  仅限 loopback 的资源绝不经网关暴露。
+- RPC 通道经由宿主 web server 注册并通过请求拒绝（requestRejection）鉴权，
+  伪造或未认证的通道调用在入口即被丢弃。
+- 自签证书只加密传输、不提供身份：拿到密码的人就能登录——请设置强密码并开启管理员锁定。
+
+## 开发
+
+```sh
+git clone https://github.com/lament-z/dsh-bridge-gateway
+cd dsh-bridge-gateway
+npm install
+npm run build:client
+npm test
+dsh plugin --profile web add .
+```
+
+## 发布说明
+
+打 `v*` 标签推送到 GitHub 即自动 `npm publish`（GitHub Actions，需仓库配置 `NPM_TOKEN` secret）。
+
+## 开源协议
+
+[MIT](./LICENSE)

package/client/client.js

@@ -2920,18 +2920,29 @@ function BridgePanel({ rpcCall }) {
   }, [rpcCall, adminToken]);
   const loadInFlightRef = React.useRef(false);
   const loadSeqRef = React.useRef(0);
+  const LOAD_TIMEOUT_MS = 15e3;
   const load = React.useCallback(async (quiet = false) => {
     if (loadInFlightRef.current) return;
     loadInFlightRef.current = true;
     const currentSeq = ++loadSeqRef.current;
+    const timedOut = { done: false };
     try {
-      const r = await authRpcCall(BRIDGE_ENDPOINTS.getStatus, {});
+      const result = await Promise.race([
+        authRpcCall(BRIDGE_ENDPOINTS.getStatus, {}),
+        new Promise((resolve) => {
+          setTimeout(() => {
+            timedOut.done = true;
+            resolve(null);
+          }, LOAD_TIMEOUT_MS);
+        })
+      ]);
+      if (timedOut.done) throw new Error("\u52A0\u8F7D\u8D85\u65F6\uFF08\u5BBF\u4E3B\u8FDE\u63A5\u53EF\u80FD\u5728\u5207\u6362\u6216\u672A\u5EFA\u7ACB\uFF09\u3002\u8BF7\u70B9\u51FB\u300C\u{1F504} \u91CD\u8BD5\u300D\u5237\u65B0\u3002");
       if (currentSeq !== loadSeqRef.current) return;
-      if (!r?.ok) throw new Error(r?.error?.message ?? "RPC failed");
-      setStatus(r.value);
+      if (!result?.ok) throw new Error(result?.error?.message ?? "RPC failed");
+      setStatus(result.value);
       if (!quiet) setErr(null);
     } catch (e) {
-      if (currentSeq === loadSeqRef.current) setErr(e.message);
+      if (currentSeq === loadSeqRef.current) setErr(e.message || "\u52A0\u8F7D\u5931\u8D25");
     } finally {
       loadInFlightRef.current = false;
     }
@@ -3345,6 +3356,11 @@ function BridgePanel({ rpcCall }) {
         }
       },
       React.createElement("span", { style: { flex: "1 1 auto" } }, err),
+      !isInterceptionErr && React.createElement("button", {
+        type: "button",
+        style: { ...s.btnGhost, height: 26, fontSize: 12, padding: "0 10px", flexShrink: 0 },
+        onClick: () => load()
+      }, "\u{1F504} \u91CD\u8BD5"),
       isInterceptionErr && React.createElement("button", {
         type: "button",
         style: { ...s.btnPri, background: "#dc2626", color: "#ffffff", height: 26, fontSize: 12, padding: "0 10px", flexShrink: 0 },
@@ -3813,6 +3829,54 @@ function injectMobileStyles() {
         display: none !important;
       }
 
+      /* ---- \u9876\u680F\u300C\u6807\u51C6\u6A21\u5F0F\u300D\u4E0E\u300C\u5BF9\u8BDD\u7BA1\u7406\u300D\u91CD\u53E0\u4FEE\u590D ----
+         \u5B9E\u6D4B\uFF08390px\uFF09\uFF1A\u6807\u51C6\u6A21\u5F0F(\u5728 titleCluster \u5185) \u53F3\u8FB9\u754C 102\uFF0C
+         \u5BF9\u8BDD\u7BA1\u7406(\u5728 headerUtilities \u5185) \u5DE6\u8FB9\u754C 91 \u2192 \u6C34\u5E73\u91CD\u53E0 11px\u3002
+         \u6839\u56E0\uFF1AtitleCluster \u53EA\u6709 46px \u5BBD\uFF08[33,79]\uFF09\uFF0C\u4F46\u5185\u90E8\u7684\u300C\u6807\u51C6\u6A21\u5F0F\u300D\u80F6\u56CA\u56FA\u5B9A 69px\uFF0C
+         \u6491\u7834\u7236\u5BB9\u5668\u540E\u4E0E\u53F3\u4FA7 headerUtilities \u76F8\u649E\u3002
+         \u4FEE\u590D\uFF1A\u5141\u8BB8 titleRow \u6362\u884C + \u8BA9\u4E24\u4FA7\u5404\u81EA\u53EF\u6536\u7F29\u5E76\u9650\u5BBD\u3002 */
+      div[class*="wSkVaW_titleRow"],
+      div[class*="_titleRow"] {
+        flex-wrap: wrap !important;
+        row-gap: 6px !important;
+        column-gap: 8px !important;
+        overflow: visible !important;
+      }
+      div[class*="wSkVaW_titleCluster"],
+      div[class*="_titleCluster"] {
+        flex: 1 1 auto !important;
+        min-width: 0 !important;
+        max-width: 100% !important;
+      }
+      div[class*="wSkVaW_headerActions"],
+      div[class*="_headerActions"] {
+        flex: 0 0 auto !important;
+        min-width: 0 !important;
+        max-width: 45vw !important;
+        overflow: hidden !important;
+      }
+      div[class*="wSkVaW_headerUtilities"],
+      div[class*="_headerUtilities"] {
+        flex: 0 0 auto !important;
+        min-width: 0 !important;
+        max-width: 50vw !important;
+        margin-left: auto !important;
+        overflow: hidden !important;
+      }
+      /* \u4E24\u8005\u5185\u90E8\u7684\u65E0 class \u6309\u94AE\uFF08\u6A21\u5F0F\u80F6\u56CA / \u5BF9\u8BDD\u7BA1\u7406 / \u5220\u9664\u672C\u5BF9\u8BDD\uFF09\u7EDF\u4E00\u9650\u5BBD\u5E76\u5141\u8BB8\u6536\u7F29 */
+      div[class*="wSkVaW_headerActions"] > *,
+      div[class*="wSkVaW_headerActions"] button,
+      div[class*="wSkVaW_headerActions"] span,
+      div[class*="wSkVaW_headerUtilities"] > *,
+      div[class*="wSkVaW_headerUtilities"] button,
+      div[class*="wSkVaW_headerUtilities"] span {
+        max-width: 100% !important;
+        min-width: 0 !important;
+        overflow: hidden !important;
+        text-overflow: ellipsis !important;
+        white-space: nowrap !important;
+      }
+
       /* \u5B50\u4EE3\u7406/\u667A\u80FD\u4F53\u6A21\u5F0F\u80F6\u56CA (Actions)\uFF1A\u7D27\u51D1\u5706\u89D2\u80F6\u56CA */
       div[class*="wSkVaW_headerActions"],
       div[class*="headerActions"] {
@@ -3923,6 +3987,136 @@ function injectMobileStyles() {
         box-sizing: border-box !important;
       }
 
+      /* ---- \u8F93\u5165\u6846\u5BBD\u5EA6\u4E0E\u5BF9\u8BDD\u5217\u5BF9\u9F50\u4FEE\u590D ----
+         \u95EE\u9898\uFF1A\u8FDB\u5165\u771F\u5B9E\u5BF9\u8BDD\u540E\u8F93\u5165\u6846\u88AB\u6491\u5230 780px\uFF08= 748px \u5185\u5BB9\u5BBD + 32px\uFF09\uFF0C
+         \u800C\u6D88\u606F\u5217\u4EC5 318px\uFF0C\u8F93\u5165\u6846\u6BD4\u5BF9\u8BDD\u5185\u5BB9\u5BBD\u7EA6 2.45 \u500D\u3002
+         \u6839\u56E0\uFF1A\u5361\u7247\u7684\u7236\u7EA7 uV2eYG_root \u81EA\u5E26 max-width: var(--dsh-composer-card-max-width)\uFF0C
+         \u5361\u7247\u81EA\u8EAB\u7684 max-width:100% \u662F\u76F8\u5BF9\u7236\u7EA7 780px \u8BA1\u7B97\u7684\uFF0C\u56E0\u6B64\u4ECD\u662F 780px\u3002
+         \u4FEE\u590D\uFF1A\u4ECE\u6839\u53D8\u91CF\u6536\u7A84 + \u8865\u4E0A uV2eYG_root \u8FD9\u4E00\u5C42\u7EA6\u675F\u3002 */
+
+      /* 1. \u4ECE\u4F1A\u8BDD\u6839\u8282\u70B9\u6536\u7A84\u5185\u5BB9\u5BBD\u5EA6\u53D8\u91CF\uFF08\u540C\u65F6\u7EA6\u675F\u6D88\u606F\u5217\u4E0E\u8F93\u5165\u6846\uFF09 */
+      div[class*="wSkVaW_root"] {
+        --dsh-chat-content-width: min(748px, 100vw - 32px) !important;
+        --dsh-composer-card-max-width: min(780px, 100vw - 24px) !important;
+      }
+
+      /* 2. \u8865\u4E0A\u63D2\u4EF6\u6B64\u524D\u9057\u6F0F\u7684 uV2eYG_root\uFF08\u8F93\u5165\u6846\u7684\u76F4\u63A5\u7F29\u5BB9\u5668\uFF09 */
+      div[class*="uV2eYG_root"] {
+        max-width: 100% !important;
+        min-width: 0 !important;
+        box-sizing: border-box !important;
+      }
+
+      /* 3. \u8F93\u5165\u6846\u7956\u5148\u94FE\u6574\u4F53\u4E0D\u8D85\u51FA\u89C6\u53E3 */
+      div[class*="wSkVaW_composerStack"],
+      div[class*="wSkVaW_composerSeat"],
+      div[class*="uV2eYG_scroll"],
+      div[class*="uV2eYG_grow"] {
+        max-width: 100% !important;
+        min-width: 0 !important;
+        box-sizing: border-box !important;
+      }
+
+      /* ---- \u9876\u90E8\u63A7\u4EF6\u9632\u6EA2\u51FA\u88C1\u5207\uFF08320px \u4E0B main \u5206\u652F chip \u6EA2\u51FA 39px \u88AB\u88C1\uFF09 ---- */
+      div[class*="wSkVaW_titleRow"],
+      div[class*="_titleRow"] {
+        flex-wrap: wrap !important;
+        row-gap: 6px !important;
+        overflow: visible !important;
+      }
+      button[class*="_7rgC5q_chip"],
+      button[class*="cubgiG_seat"],
+      div[class*="_7rgC5q_chipWrap"] {
+        max-width: min(120px, 30vw) !important;
+        min-width: 0 !important;
+        overflow: hidden !important;
+        text-overflow: ellipsis !important;
+      }
+
+      /* git-graph \u7684\u5206\u652F chip \u5916\u5C42\u662F position:absolute \u6D6E\u5C42\uFF08_7rgC5q_anchor / _7rgC5q_anchorHero\uFF09\uFF0C
+         \u4E14\u901A\u8FC7\u5185\u8054\u6837\u5F0F\u5199\u6B7B left\uFF08\u5982 left: 271.484px\uFF09\uFF0C\u8131\u79BB flex \u6D41\u4E14\u4E0D\u53D7\u7236\u5BB9\u5668\u9650\u5BBD\u7EA6\u675F\uFF0C
+         \u5728 320px \u4E0B\u6EA2\u51FA\u5C4F\u5E55\u53F3\u4FA7\u88AB\u88C1\u5207\uFF08\u53F3\u8FB9\u754C 351 > \u89C6\u53E3 320\uFF09\u3002
+         \u5185\u8054\u6837\u5F0F\u4F18\u5148\u7EA7\u9AD8\u4E8E\u666E\u901A CSS\uFF0C\u5FC5\u987B\u7528 !important \u8986\u76D6 left\uFF0C\u6539\u4E3A\u6309\u89C6\u53E3\u53F3\u8FB9\u754C\u951A\u5B9A\u3002 */
+      div[class*="_7rgC5q_anchor"] {
+        left: auto !important;
+        right: 8px !important;
+        max-width: calc(100vw - 16px) !important;
+        min-width: 0 !important;
+        overflow: hidden !important;
+      }
+      button[class*="_7rgC5q_chip"],
+      div[class*="_7rgC5q_chipWrap"] {
+        width: auto !important;
+        max-width: 100% !important;
+      }
+
+      /* ---- \u70B9\u51FB\u76EE\u6807\u6269\u5230 44px\uFF08\u4F2A\u5143\u7D20\u6269\u70ED\u533A\uFF0C\u89C6\u89C9\u5C3A\u5BF8\u4E0D\u53D8\uFF09 ---- */
+      button[class*="cubgiG_seat"],
+      button[class*="_7rgC5q_chip"],
+      button[class*="pXSMma_workspace"],
+      button[class*="Sh0Q9G_trigger"],
+      button[class*="_7KE1Ra_trigger"],
+      button[class*="uV2eYG_add"],
+      button[class*="qDHVXG_iconButton"],
+      button[class*="qDHVXG_searchButton"],
+      button[class*="hHd-Xa_iconButton"],
+      button[class*="YDXeBa_iconButton"] {
+        position: relative !important;
+      }
+      button[class*="cubgiG_seat"]::after,
+      button[class*="_7rgC5q_chip"]::after,
+      button[class*="pXSMma_workspace"]::after,
+      button[class*="Sh0Q9G_trigger"]::after,
+      button[class*="_7KE1Ra_trigger"]::after,
+      button[class*="uV2eYG_add"]::after,
+      button[class*="qDHVXG_iconButton"]::after,
+      button[class*="qDHVXG_searchButton"]::after,
+      button[class*="hHd-Xa_iconButton"]::after,
+      button[class*="YDXeBa_iconButton"]::after {
+        content: "" !important;
+        position: absolute !important;
+        inset: -8px !important;
+        z-index: 1 !important;
+      }
+
+      /* ---- \u4FA7\u8FB9\u680F\u771F\u6B63\u9690\u85CF\uFF0C\u6D88\u9664\u952E\u76D8/\u8BFB\u5C4F\u7126\u70B9\u9677\u9631 ----
+         \u6B64\u524D\u4FA7\u8FB9\u680F\u4EC5\u88AB transform \u79FB\u5230\u5C4F\u5E55\u5916\uFF08visibility \u4ECD\u4E3A visible\uFF09\uFF0C
+         \u5185\u90E8 7 \u4E2A\u6309\u94AE\u4ECD\u53EF\u88AB Tab \u805A\u7126\u3002 */
+      div[class*="_sidebarCol"] {
+        visibility: hidden !important;
+        pointer-events: none !important;
+      }
+      body.dsh-drawer-open div[class*="_sidebarCol"] {
+        visibility: visible !important;
+        pointer-events: auto !important;
+      }
+
+      /* ---- \u8F93\u5165\u6846 sticky \u5B9A\u4F4D\u4E0E\u906E\u6321\u4FEE\u590D ----
+         \u73B0\u8C61\uFF1A\u53D1\u9001\u540E\u8F93\u5165\u6846\u8DF3\u5230 tabs(\u5BF9\u8BDD/\u8F68\u8FF9/\u4E0A\u4E0B\u6587/\u8BB0\u5FC6) \u4E0B\u65B9\uFF0C\u4E0B\u65B9\u7559\u51FA\u5927\u7247\u7A7A\u767D\uFF1B
+               \u6EDA\u52A8\u65F6\u53F3\u4E0B\u89D2\u51FA\u73B0\u4E00\u4E2A\u5C0F\u65B9\u5757\u3002
+         \u6839\u56E0\uFF1A
+           1) dsh-better-sidebar \u63D2\u4EF6\u6CE8\u5165\u7684 div[data-dsh-panel-host] \u662F\u5168\u5C4F fixed \u906E\u7F69
+              \uFF08390x844\uFF0Cz-index 25\uFF09\uFF0C\u5728\u79FB\u52A8\u7AEF\u672A\u88AB\u9690\u85CF\uFF0C\u538B\u5728 composerSeat(z-index 7) \u4E4B\u4E0A\uFF1B
+           2) \u4E3B\u9898\u88C5\u9970\u5C42 span[data-dsh-glass-fade="bottom"] \u662F\u5168\u5BBD fixed \u6761\uFF08390x13\uFF0Cz-index 7\uFF09\uFF0C
+              \u5E38\u9A7B\u5C4F\u5E55\u53F3\u4E0B\u89D2\uFF0C\u89C6\u89C9\u4E0A\u5C31\u662F\u90A3\u4E2A"\u5C0F\u65B9\u5757"\u3002
+         \u4FEE\u590D\uFF1A\u79FB\u52A8\u7AEF\u9690\u85CF panel-host \u906E\u7F69\u4E0E glass \u6E10\u53D8\u88C5\u9970\u6761\uFF0C\u5E76\u9501\u5B9A\u8F93\u5165\u6846 sticky \u4E8E\u5E95\u90E8\u3002 */
+
+      /* \u9690\u85CF better-sidebar \u7684\u5168\u5C4F\u906E\u7F69\uFF08\u907F\u514D\u8986\u76D6\u8F93\u5165\u6846\u5E76\u62E6\u622A\u70B9\u51FB\uFF09 */
+      div[data-dsh-panel-host],
+      div[data-dsh-better-sidebar] {
+        display: none !important;
+      }
+      /* \u9690\u85CF\u4E3B\u9898\u88C5\u9970\u6027\u6E10\u53D8\u6761\uFF08\u53F3\u4E0B\u89D2\u5C0F\u65B9\u5757\uFF09 */
+      span[data-dsh-glass-fade] {
+        display: none !important;
+      }
+      /* \u6CE8\u610F\uFF1A\u4EE5\u4E0B\u4E24\u5904\u6539\u52A8\u5747\u5DF2\u5B9E\u6D4B\u5931\u8D25\u5E76\u64A4\u56DE\uFF0C\u5207\u52FF\u91CD\u8BD5\u2014\u2014
+         (1) \u628A viewArea \u6539\u4E3A\u53EF\u6536\u7F29\uFF08flex:1 1 auto / min-height:0\uFF09\uFF1A
+             sticky \u5931\u53BB\u6B63\u786E\u6EDA\u52A8\u4E0A\u4E0B\u6587\uFF0C\u8F93\u5165\u6846\u88AB\u9876\u5230\u6574\u4E2A\u5BF9\u8BDD\u5386\u53F2\u6700\u4E0A\u65B9\u3002
+         (2) \u628A composerSeat \u6539\u4E3A absolute\uFF08\u4EFF\u6E90\u7801 composer-overlay \u5206\u652F\uFF09\uFF1A
+             absolute \u8131\u79BB\u6587\u6863\u6D41\u540E\u968F\u6EDA\u52A8\u5185\u5BB9\u79FB\u52A8\uFF0C\u5B9E\u6D4B\u8F93\u5165\u6846\u8DD1\u5230 y=-8972\u3002
+         \u7ED3\u8BBA\uFF1A\u4FDD\u7559\u6E90\u7801\u7684 sticky \u673A\u5236\uFF0C\u4E0D\u505A\u7ED3\u6784\u6027\u6539\u52A8\u3002 */
+
       /* \u8F93\u5165\u6846\u5E95\u90E8\u5DE5\u5177\u680F\uFF1A\u5F39\u6027\u81EA\u9002\u5E94\uFF0C\u5F7B\u5E95\u675C\u7EDD\u6743\u9650\u9009\u62E9\u5668(Full access)\u4E0E\u6A21\u578B\u9009\u62E9\u5668\u91CD\u53E0\u78B0\u649E */
       div[class*="uV2eYG_row"] {
         display: flex !important;
@@ -4017,8 +4211,16 @@ function injectMobileStyles() {
         position: fixed !important;
         left: 0 !important;
         top: 0 !important;
-        bottom: 0 !important;
+        bottom: auto !important;
+        /* \u4FA7\u8FB9\u680F\u5E95\u90E8\u6EA2\u51FA\u5C4F\u5E55\u4FEE\u590D\uFF1A
+           \u5B9E\u6D4B 390x844 \u4E0B\uFF0C\u4FA7\u8FB9\u680F\u5B9E\u9645\u76D2\u5B50\u4E3A T=12 B=882\uFF08\u9AD8\u5EA6 870 > \u89C6\u53E3 844\uFF09\uFF0C\u5E95\u90E8\u6EA2\u51FA 38px\u3002
+           \u6839\u56E0\u662F\u63D2\u4EF6\u6B64\u524D\u672A\u58F0\u660E box-sizing\uFF0C\u5143\u7D20\u7EE7\u627F\u4E3A content-box\uFF0C
+           \u4E8E\u662F padding(10px+14px) \u4E0E margin(12px) \u88AB\u52A0\u5728 height:100dvh \u4E4B\u5916\u3002
+           \u6539\u4E3A border-box \u5E76\u7528 100dvh \u76F4\u63A5\u7EA6\u675F\u9AD8\u5EA6\uFF0Cpadding \u5373\u88AB\u5305\u542B\u5728\u9AD8\u5EA6\u5185\u3002 */
+        box-sizing: border-box !important;
         height: 100dvh !important;
+        max-height: 100dvh !important;
+        margin: 0 !important;
         width: 290px !important;
         max-width: 82vw !important;
         z-index: 10000 !important;
@@ -4536,6 +4738,9 @@ function setupMobileExperience(rpcCall, ctx) {
       }
       const sessionRow = e.target.closest('a, div[class*="sessionRow"], div[role="treeitem"]');
       if (sessionRow) {
+        if (sessionRow.hasAttribute("aria-expanded")) {
+          return;
+        }
         setTimeout(() => {
           if (document.body.classList.contains("dsh-drawer-open")) {
             document.body.classList.remove("dsh-drawer-open");
@@ -4546,6 +4751,31 @@ function setupMobileExperience(rpcCall, ctx) {
       document.body.classList.remove("dsh-drawer-open");
     }
   }, true);
+  const syncSidebarInert = () => {
+    const sidebar = document.querySelector('div[class*="_sidebarCol"]');
+    if (!sidebar) return;
+    const open = document.body.classList.contains("dsh-drawer-open");
+    const wantInert = window.innerWidth <= 768 && !open;
+    if (wantInert) {
+      if (!sidebar.hasAttribute("inert")) sidebar.setAttribute("inert", "");
+    } else if (sidebar.hasAttribute("inert")) {
+      sidebar.removeAttribute("inert");
+    }
+  };
+  new MutationObserver(syncSidebarInert).observe(document.body, {
+    attributes: true,
+    attributeFilter: ["class"],
+    childList: true,
+    subtree: true
+  });
+  window.addEventListener("resize", syncSidebarInert);
+  let inertRetry = 0;
+  const inertTimer = setInterval(() => {
+    syncSidebarInert();
+    const sb = document.querySelector('div[class*="_sidebarCol"]');
+    if (sb && sb.hasAttribute("inert") || ++inertRetry > 40) clearInterval(inertTimer);
+  }, 250);
+  syncSidebarInert();
   let longPressTimer = null;
   let touchStartX = 0;
   let touchStartY = 0;