Hot reload broken on Angular 20 with Tailwind CSS v4 + `@reference '#theme.css';`

[lemonCMS]

What version of Tailwind CSS are you using?

v4.1.7

What build tool (or framework if it abstracts the build tool) are you using?

Angular: v20.3.11
@tailwindcss/postcss: c4.1.17

What version of Node.js are you using?

For example: v24.2

What browser are you using?

Chrome

What operating system are you using?

Windows

Reproduction URL

https://github.com/lemonCMS/angular-20-tailwind-4

Describe your issue

Clone the repository:

When @reference '#theme.css'; is used in a scss file.

Then the hot reload is broken for stylesheets.

npm install --force 
npm run start

Open the file libs/common-ui/theme/src/lib/components/_interactive-list.scss

try to change the background color, then nothing is updated in the browser.

remove the @reference '#theme.css';, then the style will be updated.

To use @apply, then we need to restart the application to see any changes.

I don't know if i this issue is caused by tailwind or perhaps Angular.