docs(vi): 应用图标页改为 iPhone 18 Pro 主屏幕模拟

- 第 22 页右栏换成 iPhone 18 Pro 主屏幕效果图（黑色机身、Black 壁纸、4 行图标，第四行为股市和标博士），旁边是 Apple 连续曲率圆角裁切的两个尺寸图标；邮件签名移到左栏
- 新增 vi/mockup/：iphone-home.html 排版，fetch.sh 获取系统图标和壁纸，build.sh 量机身、生成遮罩并按 3 倍截图
- Apple 素材（机身、壁纸、系统图标）版权归 Apple，放在 mockup/apple/ 不进 git；机身需本人同意 Apple Design Resources 许可后手动放入，使用限制见 mockup/README.md
- 重新导出 VI 手册 PDF

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

docs/design/vi/mockup/build.sh

@@ -0,0 +1,44 @@
+#!/usr/bin/env bash
+# 生成 VI 手册用的 iPhone 桌面模拟图 apple/iphone-home.png（透明背景，3 倍分辨率）。
+# 前置：fetch.sh 已下载图标和壁纸；机身 PNG 已按 README.md 放到 apple/bezel.png；logo/.work/venv 可用。
+# 用法：docs/design/vi/mockup/build.sh
+set -euo pipefail
+cd "$(dirname "$0")"
+PORT=8799
+PY=../../logo/.work/venv/bin/python
+
+# 1. 量机身：与中心连通的透明区就是屏幕（圆角形状和机身完全一致）。
+#    输出屏幕遮罩 screen-mask.png，以及页面用的尺寸 geometry.css（机身 PNG 是 3 倍图，1pt = 3px）
+SIZE=$("$PY" -I - <<'EOF'
+import numpy as np
+from PIL import Image
+from scipy import ndimage
+a = np.asarray(Image.open("apple/bezel.png"))[..., 3]
+lab, _ = ndimage.label(a < 10)
+screen = lab == lab[a.shape[0] // 2, a.shape[1] // 2]
+ys, xs = np.where(screen)
+x, y, w, h = xs.min(), ys.min(), xs.max() + 1 - xs.min(), ys.max() + 1 - ys.min()
+# 向外扩 2px 压到机身黑边下面，避免抗锯齿露出白缝；CSS 遮罩读透明通道，所以存成 RGBA
+m = ndimage.binary_dilation(screen, iterations=2)[y:y + h, x:x + w]
+rgba = np.zeros(m.shape + (4,), np.uint8)
+rgba[..., 3] = m * 255
+Image.fromarray(rgba, "RGBA").save("apple/screen-mask.png")
+H, W = a.shape
+pt = lambda v: f"{v / 3:g}px"
+open("apple/geometry.css", "w").write(
+    f":root{{--dev-w:{pt(W)};--dev-h:{pt(H)};--scr-x:{pt(x)};--scr-y:{pt(y)};--scr-w:{pt(w)};--scr-h:{pt(h)}}}\n")
+print(f"{W // 3},{H // 3}")
+EOF
+)
+cat apple/geometry.css
+
+# 2. 临时起本地服务（file:// 下遮罩图片会被浏览器安全策略拦掉；根目录是 docs/design，页面要引用 logo/），按 3 倍截图
+python3 -m http.server $PORT --bind 127.0.0.1 --directory ../.. >/dev/null 2>&1 &
+SERVER=$!
+trap 'kill $SERVER' EXIT
+sleep 1
+"/Applications/Google Chrome.app/Contents/MacOS/Google Chrome" --headless=new --hide-scrollbars \
+  --default-background-color=00000000 --force-device-scale-factor=3 --window-size="$SIZE" \
+  --virtual-time-budget=5000 --screenshot="$PWD/apple/iphone-home.png" \
+  "http://127.0.0.1:$PORT/vi/mockup/iphone-home.html" 2>/dev/null
+magick identify apple/iphone-home.png