feat: 毛菜验收秤PAD外壳改造 + 后厨补餐屏首版设计 + 配送H5流程降噪 + 营养档案检索录入强化

- 毛菜验收秤全页面 PAD 居中外壳(grid方案) + 验收列表动态列(有订单10列/无订单8列) + 返回导航referer统一
- 加工提示屏更名后厨补餐屏并完成首版设计(16格菜品余量监控四态看板 + 补餐/食谱来源标签)
- 配送H5: 移除派单倒计时与异常按钮; 配送中页新增商家联系条/备注展示/清单卡片化
- 营养管理: 餐品库高级搜索+筛选汇总条+操作历史; 食材录入改行内选择器+净菜包毛利率; 食材详情操作历史; 进货明细补金额单价

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>

.claude/memory/decisions.md

@@ -47,12 +47,13 @@
 ```css
 body {
   background: #05080f;             /* 全屏深色画布 */
-  min-height: 100vh; min-width: 1280px;
-  display: flex; align-items: center; justify-content: center;
+  min-height: 760px; min-width: 1320px;  /* PAD(720+40padding)×(1280+40padding) */
+  display: grid; place-items: center;    /* 用 grid 居中,不用 flex(见下文 Why) */
   padding: 20px;
 }
 .device-frame {
   width: 1280px; height: 720px;    /* PAD 横屏逻辑画布 */
+  flex-shrink: 0;                  /* 兜底保护:即使在 flex 容器中也禁止被压缩 */
   border-radius: 24px;             /* 硬件外壳圆角 */
   box-shadow: 0 24px 64px rgba(0,0,0,0.6), 0 0 0 1px rgba(255,255,255,0.04);
   overflow: hidden;                /* 防止内容溢出滚动条 */
@@ -67,7 +68,15 @@ body {
 - 所有 1280×720 主屏页面（餐线营养秤、档口营养秤、配比秤、净菜柜、毛菜秤等）均按此模板改造
 - 副屏（如 480×320 双屏小屏）复用现有 `.screen-frame` 并升级阴影/圆角即可，无需新增 `.device-frame`
 - 内部 `height: calc(100vh - X)` 必须改为 `height: calc(100% - X)`，避免视口与外壳尺寸耦合
+- **body 用 `display: grid; place-items: center`,不要用 flex**。2026-08-14 毛菜秤改造严重踩坑:`body { display:flex; justify-content:center; align-items:center; min-width:1280px; padding:20px }` 配合 `.device-frame { width:1280px; flex-shrink:0 }` 时,flex 算法在主轴计算上把 device-frame 的 hypothetical main size 算成 1648px(1280 + 神秘 368px),导致 `justify-content:center` 把 device-frame 反向定位到 offsetLeft=-48,横向滚动条出现,视觉上"完全偏左不居中"。即使 `flex-shrink:0` 也救不了——这只防止压缩,不防止 flex 容器对 item 尺寸的错误估算。改用 grid 后,scrollWidth=1600=viewport、offsetLeft=160 完美居中。**这跟之前 commit 2373704 餐线营养秤的 flex 方案表现不同**,怀疑与 Chromium 版本/页面其他元素 min-content 计算有关,但 grid 方案在所有页面都稳定。
+- **`.device-frame` 仍要加 `flex-shrink: 0`** 作为兜底(虽然 body 已改 grid,但留作子项保护不会出错)
+- **body `min-width` / `min-height` 必须把 padding 算进去**:`min-width: 1320px` (= 1280 + 40 padding),`min-height: 760px` (= 720 + 40 padding)。注意 `* { box-sizing: border-box }` 下 min-width 作用在 border-box,所以 padding 已包含在 1320 内,不会重复加。
 - PAD 内禁止可见滚动条（见 [[feedback.md#PAD 终端页面内禁止可见滚动条]]）
+- **PAD 外壳改造的强制验证步骤**:改造完成后必须用浏览器实测
+  1. `document.querySelector('.device-frame').clientWidth === 1280`
+  2. `document.querySelector('.device-frame').getBoundingClientRect().left === (window.innerWidth - 1280) / 2`(居中验证)
+  3. `document.body.scrollWidth === window.innerWidth`(无横向溢出)
+  不能只靠代码审查。CSS flex/grid 子项宽度行为反直觉,代码看着对但实际塌缩/偏移很常见。
 
 **See Also**：
 - [[feedback.md#PAD 终端页面内禁止可见滚动条]]