Media query specificity order. Certian properties broken (`gridColumn`)

[predaytor]

Describe the issue

There seems to be a bug related to gridColumn specifically when defining <grid-line> values when mixing <integer> and span values for different media conditions, instead of using just one version of the syntax.

The error also occurs when using the value 1 / -1, not sure why. (1st test case in playground).

(it's hard to debug why this error occurs or if it might be related to other properties like gridArea).

Bug: '@media (max-width: 1024px)': '1 / 3' has higher specificity order then '@media (max-width: 768px)': '1 / -1'.

This happens only between intermediate conditions (those after the default case).

const styles = stylex.create({
  // ...

  x: {
    backgroundColor: 'pink',

    gridColumn: {
      default: '1 / 2',
      '@media (max-width: 1024px)': '1 / 3',
      '@media (max-width: 768px)': '1 / -1',
    },
  },
});

Expected behavior

'@media (max-width: 768px)': '1 / -1' should override previous condition '@media (max-width: 1024px)': '1 / 3'

Steps to reproduce

Inspect the order specificity on gridColumn property between media conditions.

Test case

https://stackblitz.com/edit/remix-run-remix-qzzvuu?file=app%2Froutes%2F_index.tsx

Additional comments

Also tested on the official Stylex + Next sandbox, this issue directly affects StyleX.