[ISSUE-0038] 城市列表右侧被截 + 滚轮无效¶

用户反馈（截图 1 + 2）： - 截图 1：Germany Hamburg 105 城市，底部一行被裁切 - 截图 2：Canada ON 351 城市，右侧第 4 列文字被截，且鼠标滚轮无法往下翻

用户感知¶

[选择 Canada / ON]
全选整州「ON」（351 个城市）

┌─ Acton ────────┬─ Ajax East ──────┬─ Algoma South ──┬─ Aja  ← 截断
│ Amherstview    │ Ancaster East   │ ...             │ Anc  ← 截断
│ ...            │ ...             │ ...             │ Bad  ← 截断
└────────────────┴─────────────────┴─────────────────┴─ ↓ 鼠标滚轮无效

右侧第 4 列文字只显示前 3-4 字符，且滚轮往下没反应。

根因¶

location-picker-dialog.tsx:1000 城市 grid：

gridTemplateColumns: { xs: '1fr 1fr', sm: '1fr 1fr 1fr', md: '1fr 1fr 1fr 1fr' }  // ❌ 4 列

Dialog maxWidth="md" ≈ 900px，内部 DialogContent padding 后 ~860px。 4 列每列 ~215px，减去 checkbox + padding，文字可用宽度 ~170px —— 装不下 "Cambridge Northwest" / "Algoma, Sudbury District and Greater Sudbury" 等长名。

虽然 cell 内已有 noWrap，整行宽度合计超过容器，触发横向溢出：

overflow: 'auto'  // ❌ 同时允许横向+纵向

链条： 1. grid 内容横向溢出 2. overflow: 'auto' 启用了横向滚动条（在底部） 3. 容器内部 scrollbar 占空间 + 横向溢出区域接收鼠标 wheel 事件 4. 用户鼠标 hover 在被裁切的右侧区域 → wheel 事件被横向滚动逻辑吃掉 5. 用户感觉"滚不动"

修复（3 处同款）¶

// 容器：分轴控制 overflow
sx={{
  flex: 1,
  minHeight: 0,
  overflowX: 'hidden',  // ✅ 强制截断横向（不显示水平滚动条）
  overflowY: 'auto',    // ✅ 只允许纵向滚动
  pb: 0.5,              // ✅ 底部留 4px 防最后一行紧贴边被裁
  ...
}}

// city grid：4 列 → 3 列
gridTemplateColumns: { xs: '1fr', sm: '1fr 1fr', md: '1fr 1fr 1fr' }

3 列每列 ~285px，文字可用 ~245px，绝大多数城市名能完整显示（长名 ellipsis 显示 + 已有 title tooltip）。

修复后¶

[ON 351 城市]
┌── Acton ─────────────┬── Ajax East ────────┬── Algoma Southwest ──┐
│ Amherstview          │ Ancaster East       │ Aurora               │
│ ...                  │ ...                 │ ...                  │
└──────────────────────┴─────────────────────┴──────────────────────┘
                                                                  ↕ 鼠标滚轮正常

改动文件¶

文件	改了什么
`src/components/locations-select/location-picker-dialog.tsx`	city grid 4→3 列 + 3 处 overflow:auto → overflowX:hidden + overflowY:auto + pb:0.5
`package.json`	0.10.55 → 0.10.56

验证¶

✅ pnpm compile 0 错
✅ pnpm build 8.49s
📋 实测：
Canada / ON → 应 3 列布局 + 鼠标滚轮往下滚正常
Germany / Hamburg → 底部一行完整显示（不被裁）
极长城市名（如 "Algoma, Sudbury District..."）→ 内部 ellipsis + hover 显示完整

如何避免再犯¶

Dialog 内 grid 列数考虑 maxWidth — md (900px) 装 4 列 ~200px/列文字易溢出
container overflow 用分轴 — overflow: auto 会同时允许 X/Y 滚，长行触发横向滚条吃滚轮
list 底部留 padding — 防最后一行紧贴 dialog 边界视觉截断

元-观察：第 5 个用户使用反馈¶

v0.10.52 ISSUE-0034: chrome 错误页 Failed to fetch
v0.10.53 ISSUE-0035: 按钮无反应
v0.10.54 ISSUE-0036: toast 成功但任务未入列表
v0.10.55 ISSUE-0037: 加载失败误报"无数据"
v0.10.56 ISSUE-0038: 城市列表右截+滚轮无效（本 issue）

前 4 个是「错误传播 / 静默吞错」家族，本次 ISSUE-0038 是布局 / overflow 配置问题，不同家族。

继续印证：5 轮 agent + 6 工具 + 5 rule 收敛后，真实用户使用仍能稳定找 bug — UI 操作类问题（按钮、滚动、显示）audit 工具天然看不到。