Tailwind CSS v4 で CSS が効かないときの対処法【Vite + React】

Tailwind CSS v4 にしてから @tailwind base; と書いても CSS が反映されず困ったので、原因と解決法をまとめます。

💥 症状

Tailwind CSS v4 からは、@tailwind base; などのディレクティブが使えなくなりました。
代わりに @import "tailwindcss"; を使う必要があります。

src/index.css を以下のように修正：

- @tailwind base;
- @tailwind components;
- @tailwind utilities;

+ @import "tailwindcss";