Right now we sort media queries by alphanumeric order, leading to unexpected media query ordering and behaviour for overlapping breakpoints. The config enableMediaQueryOrder exists to tackle this properly but it has some unresolved bugs and does not yet work with defineConsts. We can improve media query ordering by sorting queries in a way that smaller breakpoints (covering less range) win over larger ones.

For example, as a starting point:

• For max-width, sort from smallest number to largest
• For min-width, the inverse

Steps:

• Modify block here https://github.com/facebook/stylex/blob/main/packages/%40stylexjs/babel-plugin/src/index.js#L459-L482
• Look for @media rules and sort as above