[Bug]: CSS variables under nested media queries get purged

Describe the bug

With native CSS nesting, this is now valid CSS:

:root {
    --mobile-font-size: 1.5rem;
}

.selector {
    @media (max-width: 768px) {
        font-size: var(--mobile-font-size);
    }
}

If you enable variable purging however, the CSS variable definition will be purged, even though it is present in the file.

To Reproduce

Use a CSS variable / custom property as a direct descendant of a media query.

There is a repro available at https://github.com/fongandrew/purgecss-media-query-bug-repro.

Expected Behavior

The CSS variable definition should not be purged. That is, in the above example, var(--mobile-font-size) is a valid usage, so --mobile-font-size: 1.5rem should not be purged from the final output.

Environment

macOS, Node 23.5.0, PurgeCSS 7.0.2

Add any other context about the problem here

No response

Code of Conduct

• I agree to follow this project's Code of Conduct