How to use js variables in “old” MUI syntax

I have recently revised my very old app where styling with MUI is like this

const filterStyle = {
    width: "320px !important",
    margin: "0 auto",
    "@media(maxWidth: 780px)": {
        width: "80%",
    },
};

and this object is consumed in sx like this

<Stack
            role="form"
            sx={{ ...filterStyle }}
            direction="row"
            spacing={2}
            
        >

I want to use variable breakpoint VERY_SMALL_BREAKPOINT -without using theme – like this:

const filterStyle = {
    width: "320px !important",
    margin: "0 auto",
    "@media(maxWidth: VERY_SMALL_BREAKPOINT)": {
        width: "80%",
    },
};

Obviously, it does not work; but is there a way to make it work? I would not use .matches etc, would rather solve the issue with code similar to existing one. Is that possible?