用途：为 FiveM 资源构建 NUI 界面（菜单、HUD、通知、进度条、面板、制作与对话框等），技术栈为 React 18 + TypeScript + Vite + Tailwind CSS v3.4.17 + Zustand。
主要能力与规则：vite.config.ts 中必须设置 base: "./"，否则 FiveM 中资源无法加载；rollupOptions.output 文件名必须保留 [hash]，避免 CEF 缓存导致部分玩家加载旧 CSS。透明 html 上的覆盖层/外壳填充需用不透明十六进制色加 background-image: linear-gradient(#111,#111)，避免 rgba()、Tailwind bg-*/70 或 opacity 与面板填充同处一个圆角元素（部分核显 CEF 存在缺陷）；屏幕变暗用无 border-radius 的兄弟层（::before inset-0），切换用 display: flex|none，不要用 jQuery fadeIn/fadeOut。所有尺寸使用 rem，禁止 px 布局。禁止 backdrop-filter: blur()、filter: blur()、filter: drop-shadow()，以及 framer-motion、GSAP、react-spring，改用纯 CSS 过渡/关键帧。全局 overflow: hidden 与 user-select: none。
架构与通信：独立模块（Notify、Progress、HUD）放在 VisibilityProvider 之外；主界面（面板、制作、对话框）放在 VisibilityProvider 内并配合 SetNuiFocus。开发时用 isEnvBrowser() 模拟数据。前端用 observe() 监听 NUI 消息、Post.create() 发送回调；Lua 端用 SendNUIMessage 与 SetNuiFocus 打开，RegisterNUICallback 处理关闭回调。fxmanifest.lua 中设置 ui_page "src/ui/build/index.html" 并包含构建产物。
依赖建议：react ^18、react-dom ^18、react-router-dom ^7、zustand ^4、clsx ^2、tailwind-merge ^3、lucide-react ^0.5、tailwindcss ^3、autoprefixer ^10、postcss ^8；开发依赖 @vitejs/plugin-react-swc ^3、typescript ^5、vite ^5。避免 MUI、Chakra UI、Ant Design、framer-motion、styled-components 等过重库。
调试：可用 fxmind 代理的 NUI dump 流程，先 fxmind_fivem_nui_wire { resource } 注入探针，再 fxmind_fivem_nui_dump 获取结构化状态，完成后必须 fxmind_fivem_nui_unwire 清理。
限制：Tailwind v4 使用 OKLCH，FiveM CEF 不支持，故须用 v3.4.17；边框渲染异常时可按 ui-guide.md §6 的方向性边框回退处理，并在 CEF 中目视验证，不要全局替换 solid 边框。完整实现指南见 ui-guide.md。