Incorrect output and duplication when defining a variable relative to another

Nobody has claimed this yet.

Inputting the code
```css
@media screen and (min-width: 500px) {
:root {
--defaultFontSize: 2.8vw;
--specialFontSize: var(--defaultFontSize);
}
}

@media screen and (min-width: 600px) {
:root {
--defaultFontSize: 3.8vw;
}
}

body {
font-size: var(--specialFontSize)
}
```

outputs

```css
body {
font-size: undefined
}

@media screen and (min-width: 600px) {

body {
font-size: undefined
}
}

@media screen and (min-width: 500px) {

body {
font-size: 2.8vw
}
}

@media screen and (min-width: 500px) {

body {
font-size: 2.8vw
}
}
```

Note the font-size:undefined in the second declaration. That should be a 3.8vw.

Use the CSS example in the issue as the reproduction case; inspect the plugin's custom-property resolution and media-query generation paths. Done means the later media query resolves --specialFontSize to 3.8vw and the generated 500px rule is emitted only once, with no undefined value.

Written by the indexing model from the issue text.