jiapuapp/docs/superpowers/specs/2026-07-20-t01-vertical-lineage-baseline-design.md

T01 纵向世系轴基准设计

目标

将 T01 从“横向大画布上的独立成员卡”调整为可直接读懂亲缘关系的纵向世系轴，并作为后续世系树页面的视觉基准。本轮仅使用页面内模拟数据，不接接口。

已确认方向

• 始祖置于顶部中央，后代按世代向下分层。
• 同一世代横向排列；只有分支超过当前宽度时才横向拖动。
• 首屏必须完整看到始祖和主要下一代，不能以裁切节点暗示结构。
• 祖先到子代之间显示连续、清晰的关系线；选中成员以红色节点框和文字强调。
• 世代标题采用横向分层标签，不再使用分散的竖排小字。
• 选中成员信息放在底部透明信息栏中，保留“查看资料”“添加亲属”。
• 加载、阅读提示、空、失败继续由 T01 同页状态承载。

视觉资产

• 页面背景继续使用 T 系列 ModulePageBackground。
• 成员节点复用现有透明卷框资产，树状态面板与底部信息栏复用现有透明金线框资产，并复制到 tree 模块命名空间。
• 移除 T01 对 g03-create-flow-panel.png、g06-search-input-wide.png、application-status-card.png 三个不透明表面资产的引用。
• 关系线属于数据关系可视化，可由布局元素绘制；不使用 CSS 仿造装饰图案、SVG 或表情符号。

状态与交互

• loading：保留 AppLoading 动画。
• tree：展示纵向三代世系，默认选中始祖；点击节点更新底部信息栏。
• landscape：说明“上下看世代、左右看同代分支”，操作后回到树态。
• empty：引导录入首代成员并跳转 T04。
• error：说明读取失败，重试后回到树态。
• 保留 T03、T04、T06、T07 路由入口。

响应式与验收

• 内部检查 320×568、360×640、360×800、412×915，不把响应式尺寸逐档交给用户确认。
• 412×915 作为当前正常树态的首个视觉审批证据。
• H5 截图仅作内部候选；Android/HBuilderX 真机或模拟器验证仍未完成。