Snackbar background color is not as expected with CssVarProvider

[michael-land]

Steps to reproduce

Link to live example: (required)

Steps:
1.
2.
3.

Current behavior

Expected behavior

Context

the resolved background color for ThemeProvider is rgb(50, 50, 50)
the resolved background color for Experimental_CssVarsProvider is #fff

https://github.com/mui/material-ui/blob/next/packages/mui-system/src/colorManipulator/colorManipulator.js#L341-L350

Looks like private_safeEmphasize created an infinity loop, is it suppose be

export function private_safeEmphasize(color, coefficient, warning) {
  try {
    //    return private_safeEmphasize(color, coefficient);
    return emphasize(color, coefficient);
  } catch (error) {
    if (warning && process.env.NODE_ENV !== 'production') {
      console.warn(warning);
    }
    return color;
  }
}

Your environment

npx @mui/envinfo

  Don't forget to mention which browser you used.
  Output from `npx @mui/envinfo` goes here.

Search keywords: snackbar