I have also face the same issue in my Nextjs project. So what i have done - instead of using this

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

i use this in global.css

    @import "tailwindcss/preflight";
    @import "tailwindcss/utilities";
    @import 'tailwindcss';

then =>install tailwind css

npm install -D tailwindcss postcss autoprefixer

=>check postcss.config for correct configuration

const config = {
  plugins: ["@tailwindcss/postcss"],
};
export default config;

If tailwind.config.js is missing, generate it using:

npx tailwindcss init

Now import the css file into your main page

import './globals.css';

Add tailwind classes for demo purpose

<p className="text-blue-600 dark:text-sky-400">The quick brown fox...</p>

run it

npm run dev