@supports (and other similar selectors) get injected at the end of the CSS blob

@supports and @media selectors do not actually have greater specificity than their non-wrapped counterparts. As such, if I have the following code:
```
const styles = StyleSheet.create({
container: {
background: 'white',
['@supports(--custom: properties)']: {
background: 'red',
},
},
container_inverse: {
background: 'blue',
},
});

function Foo() {
return

;
};
```
I would expect the background to be blue, but because all special selectors are injected at the end of the css blob, the div's background is actually red. @-selectors should be injected into the CSS immediately after the rule for which they are defined.

to: @garrettberg @lencioni

Start by tracing how the CSS blob is generated and where @supports and @media rules are injected; the issue provides a reproduction using StyleSheet.create and css. Reproduce the example and verify that each special selector is emitted immediately after its owning rule, so the later container_inverse rule determines the background.

Written by the indexing model from the issue text.