Production-ready setup for Tailwind CSS v4 with shadcn/ui, dark mode, and CSS variable architecture.

• Four-step architecture: define CSS variables at root level with hsl() wrapper, map to Tailwind utilities via @theme inline, apply base styles, and enable automatic dark mode switching
• Vite plugin-based configuration (no PostCSS or tailwind.config.ts needed); requires @tailwindcss/vite and empty "config" in components.json
• Semantic color tokens for destructive, success, warning, and info states; dark mode via ThemeProvider with localStorage persistence
• Common gotchas documented: deprecated tailwindcss-animate package, duplicate @layer base blocks, double-wrapped hsl() values, and wrong plugin syntax using @import instead of @plugin directive