本技能用于 Latitude 的 apps/web 前端开发，覆盖路由、@repo/ui 组件、TanStack Start 服务端函数与集合、导航（Link 与 useNavigate）、表单（useForm + createFormSubmitHandler，Zod 校验错误用 fieldErrorsAsStrings 呈现在字段上）、Tailwind 布局规则、设计系统更新以及 useEffect / useMountEffect 策略。
用途与前提：在改动任何面向用户的 UI 前，先阅读根目录 design.md，其中定义复用优先的发现、组合、层级、间距、操作、响应式及路由/模态/抽屉选择规则。组件、token、apps/design-system 与相邻路由为实现事实来源，创建新组件或新 token 前先搜索已有组件与同类模式。
主要能力与约束：项目概览有严格默认层级，指标用 Text.H5，面板用静音 Text.H6 标签，行与议题标题用紧凑 Text.H6B，不用 H3/H4/H5 作面板标题。React 19 下不用 forwardRef、ElementRef，也不滥用 useMemo/useCallback/React.memo。文本统一用 @repo/ui 的 Text，按钮用 Button 且不嵌套 Text。Modal 默认短形式，仅在必要时用组合形式。路由支持组件放在路由目录的 -components/ 下。状态管理走服务端函数（createServerFn）、集合（queryCollectionOptions）和 useState，无全局 store。导航规则：用户点击用 Link，程序化跳转、同路由仅改搜索参数、变更后跳转与认证流用 useNavigate。表格行跳转用 renderRowLink，仅同路由交互才用 onRowClick。命令面板需与新增 UI 保持同步。
限制：以上规则针对 Latitude 现有代码库，需配合具体项目环境；官方文本未提供，部分细节以仓库内文档和现有实现为准。