[material-nextjs][system] Backport CSS layers to v5

[siriwatknp]

Docs

• docs/data/material/customization/css-layers/css-layers.md
• docs/data/material/integrations/nextjs/nextjs.md

Next.js Pages

• demo: https://mui5-nextjs-pages.vercel.app/
• repo: https://github.com/siriwatknp/mui5-nextjs-pages

Next.js App Router

• demo: https://mui5-nextjs-app.vercel.app/
• repo: https://github.com/siriwatknp/mui5-nextjs-app

Vite

• demo: https://mui5-vite.vercel.app/
• repo: https://github.com/siriwatknp/mui5-vite

---

This PR cherry pick 4 commits with manual adjustments for CSS layers:

• [system] Pre-serialize & cache styles to improve performance #43412: only the export serializeStyles function, not the optimization part.

• [styled-engine] Add enableCssLayer prop to StyledEngineProvider #45428: enable CSS layer for StyledEngineProvider

• [material-nextjs] Add option to enable CSS layers for pages router #45596: enable CSS layer for pages router

• [system] Add modularCssLayers theme flag to split styles into multiple CSS layers #46001: modular CSS Layers

• I have followed (at least) the PR section of the contributing guide.

[mui-bot]

Netlify deploy preview

• docs/data/material/customization/css-layers/css-layers.md
• docs/data/material/integrations/nextjs/nextjs.md

@material-ui/core: parsed: +0.45% , gzip: +0.55%
@material-ui/lab: parsed: +0.30% , gzip: +0.39%
@material-ui/system: parsed: +2.45% , gzip: +2.33%
@mui/joy: parsed: +0.35% , gzip: +0.18%

Bundle size report

Details of bundle changes (Toolpad)
Details of bundle changes

Generated by 🚫 dangerJS against 266d80a

[siriwatknp]

Added @sai6855 as a reviewer, in case you see anything missing/wrong.