用途：该技能面向 Tailwind CSS v4，整理组件样式、响应式设计与常见 UI 模式，帮助在项目中快速套用一致的样式写法。
主要能力：
- Tailwind v4 初始化：在 app.css 中通过 @import "tailwindcss" 引入，并用 @theme 定义品牌色、字体、间距等设计令牌。
- 组件模式：给出按钮变体（primary、secondary、outline、ghost、destructive）与尺寸（sm、md、lg、icon），以及 Card、CardHeader、CardContent、CardFooter、FormField、Input 等组件示例，配合 cn() 合并类名。
- 响应式：移动优先网格（grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4）、响应式排版，以及 @container 容器查询（@md、@lg）。
- 动画：transition-colors、transition-transform、hover:scale-105 等过渡，以及通过 @theme 定义 --animate-fade-in、--animate-slide-up 等关键帧动画。
- 暗色模式：使用 dark: 前缀，或通过 @theme 与 prefers-color-scheme 定义语义色变量。
- 布局：粘性头部、侧边栏布局、居中最大宽度内容等。
使用方式：按资料中的类名与组件写法直接组合使用；重复三次以上的模式建议抽取为组件；优先使用语义色（brand、surface、error）而非原始色值。
适用场景：使用 Tailwind CSS v4 的前端项目，需要统一组件样式、响应式布局与暗色主题时。
限制：资料未提供安装命令、依赖版本、收费或平台信息；示例基于 React 与 cn() 工具函数，其他框架需自行适配。