In my code (react) I have this autogenerated nested(!) theme rule from JSS MUI:

.MuiGrid-spacing-xs-4-348 > .MuiGrid-item-324 {
    padding: 16px;
}

I want to adress this rule using:

createTheme(theme, {
    overrides: {
      MuiGrid: {
        'spacing-xs-4': {
          width: "100%",
          margin: 0,

          // what to write here? This doesn't work:
          // '& .MuiGrid-item' : {
          //   border: 20px solid pink,
          // },
          },
        },
      },
    },
    
  });

What do I have to write?

Whenever some JSS/MuiDev is reading this:

I find it kind nonsense to switch key syntax to CSS-like Strings for the purpose to assign rules to MUI generated classes.

I have to write:

MuiGrid: {
        'spacing-xs-4': {

(Or is there any other way?) instead of e.g:

MuiGrid: {
        spacing: {
            xs: {
                4: {

Wouldn't that make much more sense?

Thank you for helpful comments!