Strange behaviour in the Next.js setup.

[reutenkoivan]

Can someone tell me why opening dev tools affects the computation of the target CSS file?
I've checked the compiled CSS file, and some CSS classes are missing.

Repo for reproducing the issue

Screen.Recording.2025-05-04.at.19.33.05.mov

[wongjn]

You have an warning sign next to your Network tab:

This usually means there is some sort of modification/override active relating to that tab. From the symptoms in your screencast that you helpfully provided, I would posit it could be that you have overridden the CSS content from within devtools. This would mean that the when you open devtools, the overrides apply to the CSS file, causing different styling to occur.

You should be able to mouse over the warning sign to see what it means. For example, when overriding network content: