[system][docs] Add "dynamic values" section to sx prop page

[aarongarciah]

Resolves https://github.com/mui/material-ui/issues/42164

Adds a new "Dynamic values" section in the sx prop docs page with guidance on how to leverage CSS variables to handle highly dynamic values to avoid polluting the DOM with unnecessary style tags.

This PR will be cherry-picked to master.

Preview link: https://deploy-preview-42239--material-ui.netlify.app/system/getting-started/the-sx-prop/#dynamic-values

[mui-bot]

Netlify deploy preview

• docs/data/system/getting-started/the-sx-prop/the-sx-prop.md

Bundle size report

No bundle size changes (Toolpad) No bundle size changes

Generated by :no_entry_sign: dangerJS against 065f5663ddd20ce4a1a60f10442bcbc469364301

[aarongarciah]

~A visual regression test is failing but it's unrelated and it's also failing in other PRs e.g. https://github.com/mui/material-ui/pull/42236~

edit: this is resolved now