1. 📐 布局 Layout ★☆☆☆☆
🌏 Web 网页规范
- 布局单位: rem / em / px / vw / %
- 核心视口: 1440px / 1920px (水平延展)
- 导航模式: 顶部导航栏 / 侧边树形菜单
- 核心交互: 悬浮鼠标 Hover、精确点击
📱 App 移动端规范
- 布局单位: dp / pt / rpx / vmin
- 核心视口: 375pt / 412dp (垂直单手)
- 导航模式: 底部 Tab 栏 / 侧滑抽屉
- 核心交互: 多点触控手势、物理震动反馈
网页端常在宽屏上使用 12栏对称网格、不对称侧边栏网格，并利用古腾堡视线规律（F型和Z型阅读流）规划核心视觉动线。
App 移动端受制于窄屏与单手拇指触达，设计核心关注 刘海/挖孔屏顶部安全区适配、底部 Tab Bar 导航栏 与 悬浮动作按钮 (FAB)。
LIVE PLAYGROUND: 页面结构与设备轨道布局适配
切换上方 Web/App 视角轨道，观察相同布局演示的形变
https://web.meta-ui.edu/layout
📱 顶部刘海安全区 (Notch Offset)
📋 大模型统一 Prompt (LLM Prompt)