Repository: next.js
Issue: CSS Styles from Shared Files Are Mixed and Broken Across Multiple Layouts in Production Server (Standalone Mode) in NextJS v.14.2.3
Labels: bug,Output (export/standalone),Webpack

### Link to the code that reproduces this issue

[CODE TO REPRODUCE](https://codesandbox.io/p/devbox/next-14-2-css-optimisation-issue-mgds9g?layout=%257B%2522sidebarPanel%2522%253A%2522EXPLORER%2522%252C%2522rootPanelGroup%2522%253A%257B%2522direction%2522%253A%2522horizontal%2522%252C%2522contentType%2522%253A%2522UNKNOWN%2522%252C%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522id%2522%253A%2522ROOT_LAYOUT%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522UNKNOWN%2522%252C%2522direction%2522%253A%2522vertical%2522%252C%2522id%2522%253A%2522clycp5xa100063b6md64d22t8%2522%252C%2522sizes%2522%253A%255B80.20591189553738%252C19.794088104462617%255D%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522EDITOR%2522%252C%2522direction%2522%253A%2522horizontal%2522%252C%2522id%2522%253A%2522EDITOR%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL%2522%252C%2522contentType%2522%253A%2522EDITOR%2522%252C%2522id%2522%253A%2522clycp5xa000023b6mh55o9og9%2522%257D%255D%257D%252C%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522SHELLS%2522%252C%2522direction%2522%253A%2522horizontal%2522%252C%2522id%2522%253A%2522SHELLS%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL%2522%252C%2522contentType%2522%253A%2522SHELLS%2522%252C%2522id%2522%253A%2522clycp5xa000043b6moof3dop4%2522%257D%255D%252C%2522sizes%2522%253A%255B100%255D%257D%255D%257D%252C%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522DEVTOOLS%2522%252C%2522direction%2522%253A%2522vertical%2522%252C%2522id%2522%253A%2522DEVTOOLS%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL%2522%252C%2522contentType%2522%253A%2522DEVTOOLS%2522%252C%2522id%2522%253A%2522clycp5xa000053b6mxyvu81cs%2522%257D%255D%252C%2522sizes%2522%253A%255B100%255D%257D%255D%252C%2522sizes%2522%253A%255B60%252C40%255D%257D%252C%2522tabbedPanels%2522%253A%257B%2522clycp5xa000023b6mh55o9og9%2522%253A%257B%2522tabs%2522%253A%255B%257B%2522id%2522%253A%2522clycp5xa000013b6m6bfzwjg0%2522%252C%2522mode%2522%253A%2522permanent%2522%252C%2522type%2522%253A%2522FILE%2522%252C%2522filepath%2522%253A%2522%252FREADME.md%2522%252C%2522state%2522%253A%2522IDLE%2522%257D%252C%257B%2522id%2522%253A%2522clyct4pdv00023b6memxlsda8%2522%252C%2522mode%2522%253A%2522permanent%2522%252C%2522type%2522%253A%2522FILE%2522%252C%2522initialSelections%2522%253A%255B%257B%2522startLineNumber%2522%253A11%252C%2522startColumn%2522%253A2%252C%2522endLineNumber%2522%253A11%252C%2522endColumn%2522%253A2%257D%255D%252C%2522filepath%2522%253A%2522%252Fapp%252F%28group-route-a%29%252Flayout.tsx%2522%252C%2522state%2522%253A%2522IDLE%2522%257D%252C%257B%2522id%2522%253A%2522clyctidhj00023b6mem6m5dkc%2522%252C%2522mode%2522%253A%2522permanent%2522%252C%2522type%2522%253A%2522FILE%2522%252C%2522initialSelections%2522%253A%255B%257B%2522startLineNumber%2522%253A1%252C%2522startColumn%2522%253A31%252C%2522endLineNumber%2522%253A1%252C%2522endColumn%2522%253A31%257D%255D%252C%2522filepath%2522%253A%2522%252F.next%252Fstatic%252Fcss%252Fdd70c07133e5b379.css%2522%252C%2522state%2522%253A%2522IDLE%2522%257D%252C%257B%2522id%2522%253A%2522clyctoar700023b6maryyaa53%2522%252C%2522mode%2522%253A%2522permanent%2522%252C%2522type%2522%253A%2522FILE%2522%252C%2522filepath%2522%253A%2522%252Fpnpm-lock.yaml%2522%252C%2522state%2522%253A%2522IDLE%2522%257D%252C%257B%2522id%2522%253A%2522clycv5thm00023b6mh3k31roo%2522%252C%2522mode%2522%253A%2522permanent%2522%252C%2522type%2522%253A%2522FILE%2522%252C%2522initialSelections%2522%253A%255B%257B%2522startLineNumber%2522%253A5%252C%2522startColumn%2522%253A1%252C%2522endLineNumber%2522%253A5%252C%2522endColumn%2522%253A1%257D%255D%252C%2522filepath%2522%253A%2522%252Fapp%252Fglobals.css%2522%252C%2522state%2522%253A%2522IDLE%2522%257D%252C%257B%2522id%2522%253A%2522clycwbqgr00023b6ms932i0og%2522%252C%2522mode%2522%253A%2522permanent%2522%252C%2522type%2522%253A%2522FILE%2522%252C%2522initialSelections%2522%253A%255B%257B%2522startLineNumber%2522%253A32%252C%2522startColumn%2522%253A33%252C%2522endLineNumber%2522%253A32%252C%2522endColumn%2522%253A33%257D%255D%252C%2522filepath%2522%253A%2522%252F.next%252Fstandalone%252F.next%252Fapp-build-manifest.json%2522%252C%2522state%2522%253A%2522IDLE%2522%257D%255D%252C%2522id%2522%253A%2522clycp5xa000023b6mh55o9og9%2522%252C%2522activeTabId%2522%253A%2522clycwbqgr00023b6ms932i0og%2522%257D%252C%2522clycp5xa000053b6mxyvu81cs%2522%253A%257B%2522id%2522%253A%2522clycp5xa000053b6mxyvu81cs%2522%252C%2522activeTabId%2522%253A%2522clycv667l00383b6m2826t4e1%2522%252C%2522tabs%2522%253A%255B%257B%2522type%2522%253A%2522UNASSIGNED_PORT%2522%252C%2522port%2522%253A3000%252C%2522id%2522%253A%2522clycv667l00383b6m2826t4e1%2522%252C%2522mode%2522%253A%2522permanent%2522%252C%2522path%2522%253A%2522%252Fapp%2522%257D%255D%257D%252C%2522clycp5xa000043b6moof3dop4%2522%253A%257B%2522id%2522%253A%2522clycp5xa000043b6moof3dop4%2522%252C%2522tabs%2522%253A%255B%257B%2522id%2522%253A%2522clyctsbva00k03b6mm7xtsvfl%2522%252C%2522mode%2522%253A%2522permanent%2522%252C%2522type%2522%253A%2522TERMINAL%2522%252C%2522shellId%2522%253A%2522clyctsbzi00mbdkgl8ip813gx%2522%257D%255D%252C%2522activeTabId%2522%253A%2522clyctsbva00k03b6mm7xtsvfl%2522%257D%257D%252C%2522showDevtools%2522%253Atrue%252C%2522showShells%2522%253Atrue%252C%2522showSidebar%2522%253Atrue%252C%2522sidebarPanelSize%2522%253A25.185185185185176%257D)

### To Reproduce

1. Create a NextJS project with version 14.2.3.
2. Set up [multiple root layouts](https://nextjs.org/docs/app/building-your-application/routing/route-groups#creating-multiple-root-layouts), e.g., Layout1 and Layout2.
3. Import a common CSS file in both layouts, e.g., globals.css.
4. Ensure that each layout has its own specific styles in addition to the common styles.
5. Start the development server (pnpm dev) and verify that the styles are applied correctly.
6. Build the project for production in standalone mode (next build).
7. Copy `.next/static` folder inside `.next/standalone/.next` folder 
8. Start the production server (node .next/standalone/server.js).
9. Observe that the styles from globals.css and specific styles are mixed or overridden across layouts, causing unexpected and broken styling.

### Current vs. Expected behavior

### Current Behavior

On the production server, styles from the common CSS file are mixed and applied across multiple layouts even if the CSS was not imported in those layouts. This results in unintentional style overrides and broken layouts.

### Expected Behavior

Each layout should apply its own specific styles along with the common styles without affecting the other layouts. The behavior should be consistent between development and production servers.

### Provide environment information

```bash
Operating System:
  Platform: darwin
  Arch: arm64
  Version: Darwin Kernel Version 23.5.0: Wed May  1 20:14:38 PDT 2024; root:xnu-10063.121.3~5/RELEASE_ARM64_T6020
  Available memory (MB): 32768
  Available CPU cores: 12
Binaries:
  Node: 20.12.2
  npm: 10.5.0
  Yarn: 1.22.21
  pnpm: 9.4.0
Relevant Packages:
  next: 14.2.3 // Latest available version is detected (14.2.4).
  eslint-config-next: 14.1.3
  react: 18.3.1
  react-dom: 18.3.1
  typescript: 5.5.3
Next.js Config:
  output: standalone
```


### Which area(s) are affected? (Select all that apply)

Output (export/standalone), Webpack

### Which stage(s) are affected? (Select all that apply)

Vercel (Deployed), Other (Deployed)

### Additional context

In NextJS version 14.2.3, when using [multiple layouts](https://nextjs.org/docs/app/building-your-application/routing/route-groups#creating-multiple-root-layouts) with a common CSS file imported in both layouts, the CSS works correctly on the development server but encounters issues on the production server. Specifically, when bundling using standalone mode, the CSS from one layout is applied to another layout unintentionally, even if the CSS file was not imported in that layout. This results in mixed, broken, or overridden styles.

I found [this](https://nextjs.org/blog/next-14-2#css) related to css optimisation. It could be the reason that I am facing the issue on v.14.2.3 but not on version 14.1.

Please use the provided codesandbox examples to reproduce the issue.
- [Example with the issue](https://codesandbox.io/p/devbox/epic-swirles-mgds9g?layout=%257B%2522sidebarPanel%2522%253A%2522EXPLORER%2522%252C%2522rootPanelGroup%2522%253A%257B%2522direction%2522%253A%2522horizontal%2522%252C%2522contentType%2522%253A%2522UNKNOWN%2522%252C%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522id%2522%253A%2522ROOT_LAYOUT%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522UNKNOWN%2522%252C%2522direction%2522%253A%2522vertical%2522%252C%2522id%2522%253A%2522clycp5xa100063b6md64d22t8%2522%252C%2522sizes%2522%253A%255B80.20591189553738%252C19.794088104462617%255D%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522EDITOR%2522%252C%2522direction%2522%253A%2522horizontal%2522%252C%2522id%2522%253A%2522EDITOR%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL%2522%252C%2522contentType%2522%253A%2522EDITOR%2522%252C%2522id%2522%253A%2522clycp5xa000023b6mh55o9og9%2522%257D%255D%257D%252C%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522SHELLS%2522%252C%2522direction%2522%253A%2522horizontal%2522%252C%2522id%2522%253A%2522SHELLS%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL%2522%252C%2522contentType%2522%253A%2522SHELLS%2522%252C%2522id%2522%253A%2522clycp5xa000043b6moof3dop4%2522%257D%255D%252C%2522sizes%2522%253A%255B100%255D%257D%255D%257D%252C%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522DEVTOOLS%2522%252C%2522direction%2522%253A%2522vertical%2522%252C%2522id%2522%253A%2522DEVTOOLS%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL%2522%252C%2522contentType%2522%253A%2522DEVTOOLS%2522%252C%2522id%2522%253A%2522clycp5xa000053b6mxyvu81cs%2522%257D%255D%252C%2522sizes%2522%253A%255B100%255D%257D%255D%252C%2522sizes%2522%253A%255B60%252C40%255D%257D%252C%2522tabbedPanels%2522%253A%257B%2522clycp5xa000023b6mh55o9og9%2522%253A%257B%2522tabs%2522%253A%255B%257B%2522id%2522%253A%2522clycp5xa000013b6m6bfzwjg0%2522%252C%2522mode%2522%253A%2522permanent%2522%252C%2522type%2522%253A%2522FILE%2522%252C%2522filepath%2522%253A%2522%252FREADME.md%2522%252C%2522state%2522%253A%2522IDLE%2522%257D%252C%257B%2522id%2522%253A%2522clyct4pdv00023b6memxlsda8%2522%252C%2522mode%2522%253A%2522permanent%2522%252C%2522type%2522%253A%2522FILE%2522%252C%2522initialSelections%2522%253A%255B%257B%2522startLineNumber%2522%253A11%252C%2522startColumn%2522%253A2%252C%2522endLineNumber%2522%253A11%252C%2522endColumn%2522%253A2%257D%255D%252C%2522filepath%2522%253A%2522%252Fapp%252F%28group-route-a%29%252Flayout.tsx%2522%252C%2522state%2522%253A%2522IDLE%2522%257D%252C%257B%2522id%2522%253A%2522clyctidhj00023b6mem6m5dkc%2522%252C%2522mode%2522%253A%2522permanent%2522%252C%2522type%2522%253A%2522FILE%2522%252C%2522initialSelections%2522%253A%255B%257B%2522startLineNumber%2522%253A1%252C%2522startColumn%2522%253A31%252C%2522endLineNumber%2522%253A1%252C%2522endColumn%2522%253A31%257D%255D%252C%2522filepath%2522%253A%2522%252F.next%252Fstatic%252Fcss%252Fdd70c07133e5b379.css%2522%252C%2522state%2522%253A%2522IDLE%2522%257D%252C%257B%2522id%2522%253A%2522clyctoar700023b6maryyaa53%2522%252C%2522mode%2522%253A%2522permanent%2522%252C%2522type%2522%253A%2522FILE%2522%252C%2522filepath%2522%253A%2522%252Fpnpm-lock.yaml%2522%252C%2522state%2522%253A%2522IDLE%2522%257D%252C%257B%2522id%2522%253A%2522clycv5thm00023b6mh3k31roo%2522%252C%2522mode%2522%253A%2522permanent%2522%252C%2522type%2522%253A%2522FILE%2522%252C%2522initialSelections%2522%253A%255B%257B%2522startLineNumber%2522%253A5%252C%2522startColumn%2522%253A1%252C%2522endLineNumber%2522%253A5%252C%2522endColumn%2522%253A1%257D%255D%252C%2522filepath%2522%253A%2522%252Fapp%252Fglobals.css%2522%252C%2522state%2522%253A%2522IDLE%2522%257D%255D%252C%2522id%2522%253A%2522clycp5xa000023b6mh55o9og9%2522%252C%2522activeTabId%2522%253A%2522clycv5thm00023b6mh3k31roo%2522%257D%252C%2522clycp5xa000053b6mxyvu81cs%2522%253A%257B%2522id%2522%253A%2522clycp5xa000053b6mxyvu81cs%2522%252C%2522activeTabId%2522%253A%2522clycv667l00383b6m2826t4e1%2522%252C%2522tabs%2522%253A%255B%257B%2522type%2522%253A%2522UNASSIGNED_PORT%2522%252C%2522port%2522%253A3000%252C%2522id%2522%253A%2522clycv667l00383b6m2826t4e1%2522%252C%2522mode%2522%253A%2522permanent%2522%252C%2522path%2522%253A%2522%252Fapp%2522%257D%255D%257D%252C%2522clycp5xa000043b6moof3dop4%2522%253A%257B%2522id%2522%253A%2522clycp5xa000043b6moof3dop4%2522%252C%2522tabs%2522%253A%255B%257B%2522id%2522%253A%2522clyctsbva00k03b6mm7xtsvfl%2522%252C%2522mode%2522%253A%2522permanent%2522%252C%2522type%2522%253A%2522TERMINAL%2522%252C%2522shellId%2522%253A%2522clyctsbzi00mbdkgl8ip813gx%2522%257D%255D%252C%2522activeTabId%2522%253A%2522clyctsbva00k03b6mm7xtsvfl%2522%257D%257D%252C%2522showDevtools%2522%253Atrue%252C%2522showShells%2522%253Atrue%252C%2522showSidebar%2522%253Atrue%252C%2522sidebarPanelSize%2522%253A25.185185185185176%257D) ( use this one to reproduce the issue )
- [Example with a fix](https://codesandbox.io/p/devbox/heuristic-darwin-qt9nys?file=%2Fpackage.json%3A9%2C22&layout=%257B%2522sidebarPanel%2522%253A%2522EXPLORER%2522%252C%2522rootPanelGroup%2522%253A%257B%2522direction%2522%253A%2522horizontal%2522%252C%2522contentType%2522%253A%2522UNKNOWN%2522%252C%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522id%2522%253A%2522ROOT_LAYOUT%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522UNKNOWN%2522%252C%2522direction%2522%253A%2522vertical%2522%252C%2522id%2522%253A%2522clycvsxmg00073b6m6gjbr07q%2522%252C%2522sizes%2522%253A%255B53.910891089108915%252C46.089108910891085%255D%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522EDITOR%2522%252C%2522direction%2522%253A%2522horizontal%2522%252C%2522id%2522%253A%2522EDITOR%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL%2522%252C%2522contentType%2522%253A%2522EDITOR%2522%252C%2522id%2522%253A%2522clycvsxmf00023b6mwip5pqf5%2522%257D%255D%257D%252C%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522SHELLS%2522%252C%2522direction%2522%253A%2522horizontal%2522%252C%2522id%2522%253A%2522SHELLS%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL%2522%252C%2522contentType%2522%253A%2522SHELLS%2522%252C%2522id%2522%253A%2522clycvsxmg00053b6m8tz2qjvw%2522%257D%255D%252C%2522sizes%2522%253A%255B100%255D%257D%255D%257D%252C%257B%2522type%2522%253A%2522PANEL_GROUP%2522%252C%2522contentType%2522%253A%2522DEVTOOLS%2522%252C%2522direction%2522%253A%2522vertical%2522%252C%2522id%2522%253A%2522DEVTOOLS%2522%252C%2522panels%2522%253A%255B%257B%2522type%2522%253A%2522PANEL%2522%252C%2522contentType%2522%253A%2522DEVTOOLS%2522%252C%2522id%2522%253A%2522clycvsxmg00063b6mcxjklxj9%2522%257D%255D%252C%2522sizes%2522%253A%255B100%255D%257D%255D%252C%2522sizes%2522%253A%255B63.167739039353584%252C36.832260960646416%255D%257D%252C%2522tabbedPanels%2522%253A%257B%2522clycvsxmf00023b6mwip5pqf5%2522%253A%257B%2522tabs%2522%253A%255B%257B%2522id%2522%253A%2522clycvsxmd00013b6m4p47sug9%2522%252C%2522mode%2522%253A%2522permanent%2522%252C%2522type%2522%253A%2522FILE%2522%252C%2522filepath%2522%253A%2522%252FREADME.md%2522%252C%2522state%2522%253A%2522IDLE%2522%257D%252C%257B%2522id%2522%253A%2522clycvw1m000023b6mgh6b5num%2522%252C%2522mode%2522%253A%2522permanent%2522%252C%2522type%2522%253A%2522FILE%2522%252C%2522initialSelections%2522%253A%255B%257B%2522startLineNumber%2522%253A9%252C%2522startColumn%2522%253A22%252C%2522endLineNumber%2522%253A9%252C%2522endColumn%2522%253A22%257D%255D%252C%2522filepath%2522%253A%2522%252Fpackage.json%2522%252C%2522state%2522%253A%2522IDLE%2522%257D%255D%252C%2522id%2522%253A%2522clycvsxmf00023b6mwip5pqf5%2522%252C%2522activeTabId%2522%253A%2522clycvw1m000023b6mgh6b5num%2522%257D%252C%2522clycvsxmg00063b6mcxjklxj9%2522%253A%257B%2522id%2522%253A%2522clycvsxmg00063b6mcxjklxj9%2522%252C%2522activeTabId%2522%253A%2522clycw10ou00du3b6mq0ihdg14%2522%252C%2522tabs%2522%253A%255B%257B%2522type%2522%253A%2522UNASSIGNED_PORT%2522%252C%2522port%2522%253A3000%252C%2522id%2522%253A%2522clycw10ou00du3b6mq0ihdg14%2522%252C%2522mode%2522%253A%2522permanent%2522%252C%2522path%2522%253A%2522%252F%2522%257D%255D%257D%252C%2522clycvsxmg00053b6m8tz2qjvw%2522%253A%257B%2522id%2522%253A%2522clycvsxmg00053b6m8tz2qjvw%2522%252C%2522tabs%2522%253A%255B%257B%2522id%2522%253A%2522clycvsxmg00043b6mqzix9uta%2522%252C%2522mode%2522%253A%2522permanent%2522%252C%2522type%2522%253A%2522TERMINAL%2522%252C%2522shellId%2522%253A%2522clyctsbzi00mbdkgl8ip813gx%2522%257D%255D%252C%2522activeTabId%2522%253A%2522clycvsxmg00043b6mqzix9uta%2522%257D%257D%252C%2522showDevtools%2522%253Atrue%252C%2522showShells%2522%253Atrue%252C%2522showSidebar%2522%253Atrue%252C%2522sidebarPanelSize%2522%253A26.592505854800933%257D) ( fixed the issue by removing the common import of the `globals.css` from both layouts )