用途：为使用 React 19、Next.js 16 App Router 和 Tailwind CSS 4 的 Web 应用提供严格的设计与 UX 规则参考，共 34 条规则、6 个类别，每条以 Always/Never 指令给出，并附量化影响、错误示例与正确示例。适用于构建面向用户的页面、布局与组件，评审 PR 中的设计、UX 与无障碍回归，选择交互模态，以及实现表单、加载与错误边界、引导与设置流程。
技术栈约定：React 19 默认使用 Server Components，仅在需要交互时在顶部写 'use client'；Next.js 16 App Router（app/、layout.tsx、page.tsx、loading.tsx、error.tsx、not-found.tsx、并行路由、拦截路由）；变更使用 Server Actions（'use server'），禁止用 useEffect 取数；Tailwind CSS 4 搭配 @theme、dark: 变体、容器查询与 4pt 间距；图标用 lucide-react；不使用 CSS-in-JS，条件类名用 clsx + tailwind-merge 的 cn()；对话框等优先用 shadcn/ui（基于 Radix）。
规则类别与优先级：导航（CRITICAL）、交互设计（CRITICAL）、无障碍（CRITICAL）、用户反馈（HIGH）、UX 模式（HIGH）、视觉设计（HIGH）。导航含顶部导航或侧边栏、App Router 布局与 Link、主操作放页头；交互含 44×44px 触控目标、标准指针模式、100ms 内视觉反馈、键盘可达、拖拽键盘替代、变更后 revalidatePath/revalidateTag、列表统一行操作模式、搜索防抖 200-300ms 且查询反映到 URL；无障碍含可访问名称、200% 缩放、WCAG AA 对比度、prefers-reduced-motion、不单靠颜色、可见焦点环与模态内焦点陷阱、rem 单位、320px 宽度可用；用户反馈含 loading.tsx 或 Suspense 骨架、error.tsx 与重试、toast 仅用于非阻塞确认、破坏性操作显式反馈、空状态说明原因与下一步；UX 模式含引导不超过 3 屏且可跳过、按需请求浏览器权限、按内容轻重选模态且不叠加、破坏性操作需输入确认或撤销窗口、Server Actions 渐进增强且输入时不禁用提交、日常操作用撤销代替确认、设置变更即自动保存；视觉设计含暗色模式用 CSS 变量与 dark: 变体、lucide-react 1.5px 描边与 size-4/size-5、4pt 间距与容器查询。
使用方式：按规则分类阅读各参考文件获取详细说明与代码示例，类别定义与优先级见 references/_sections.md，新增规则模板见 assets/templates/_template.md。该资料未提供安装命令、收费与价格信息。