存档:首页 tab/黑边阶段改动 + 自适应规范文档

- home-page: 底部 tab 贴屏幕底、全新系列角标归位、画布铺满宽修左侧黑边
  (首页仍是过程态,后续按「540容器 + 流式」最简方案重构)
- AGENTS.md: 自适应规范(给 codex / 同事,三规则 + 三不要 + 验证法)
- README.md(外层): 项目总览 + 启动 + 当前进度

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

README.md

@@ -0,0 +1,70 @@
+# VTuber Mini
+
+540px 宽的移动端 H5 —— 单 VTuber 粉丝养成 app(养宠物、抽卡、纪念日提醒、商城兑换)。一套模板服务一个 VTuber,可换皮。
+
+## 技术栈
+
+React 19 + Vite 8 + Tailwind CSS 4 + TypeScript;Capacitor 8 打包 Android。包管理用 **pnpm**。
+
+## 目录结构
+
+```
+.
+├── vtubermini/              # 前端主工程(代码都在这)
+│   ├── src/                 # 源码(pages / components / lib / services)
+│   ├── docs/                # 工程文档(Android 构建、接口契约等)
+│   ├── AGENTS.md            # ⭐ 自适应布局规范(给 codex/AI 调页面用,改 UI 前必读)
+│   ├── android/             # Capacitor Android 工程
+│   └── package.json
+├── design/                  # 设计稿
+├── assets/                  # 素材
+├── Product-Spec.md          # 产品规格
+├── DEV-PLAN.md              # 开发计划
+├── *-Breakdown.md / *.mmd   # 需求拆解 / UX 流程图
+└── .codex-logs/             # codex 运行日志
+```
+
+## 快速启动(本地预览)
+
+```bash
+cd vtubermini
+pnpm install        # 首次需要
+pnpm dev            # 启动,浏览器打开终端显示的 http://localhost:5173/
+```
+
+- 打开后先是登录页 → 点 **「进入花园」** 进首页。
+- 看不同手机宽度:Chrome 按 `F12` → 设备工具栏 → 选 360 / 390 / 414。
+- 桌面不开设备模拟时,页面是一个 **540 宽的竖条居中**显示(已去掉手机外壳)。
+
+## 构建 / Android 打包
+
+```bash
+cd vtubermini
+pnpm build          # 类型检查 + 产出 dist/
+pnpm cap:sync       # 把 web 资源同步到 Android 工程
+```
+
+Android 打 APK 需要 JDK 17 + Android Studio + `ANDROID_HOME`,详细步骤见 `vtubermini/docs/android-build.md`。
+
+## 当前进度(自适应改造)
+
+正在把全站从「固定比例画布 + 百分比绝对定位」改造为「540 宽标准移动布局」,解决**手机宽度变化导致布局错乱**的问题。
+
+- ✅ **首页** `src/pages/home-page.tsx`:540 容器居中、去手机外壳、底部 tab 贴屏幕底
+  - ⚠️ 首页 tab 样式仍在和需求对齐中(早期方案绕复杂了,正收敛到最简逻辑)
+- ✅ **自适应规范**已沉淀到 `vtubermini/AGENTS.md`(三条规则 + 两个亲测的坑 + 验证方法)——后续同事用 codex 调其他页照此执行,保证全站做法统一
+- ⬜ **其他页面**(anniversary / shop / my / album / pet …)待逐页按规范调整
+
+核心规则(详见 `vtubermini/AGENTS.md`):
+1. 容器宽 `min(100vw, 540px)` 居中;
+2. **不用百分比绝对定位**(宽度一变就乱)——用 flex / 文档流 + 贴边;
+3. 导航 tab 贴屏幕底。
+
+## 关键文档
+
+| 文档 | 用途 |
+|---|---|
+| `vtubermini/AGENTS.md` | 自适应布局规范(改任何页面 UI 前必读) |
+| `vtubermini/docs/android-build.md` | Android 构建步骤 |
+| `vtubermini/docs/api-contract.md` | 前后端接口契约 |
+| `Product-Spec.md` / `DEV-PLAN.md` | 产品规格 / 开发计划 |