Prod SASS mixin results in different CSS then dev.

The idea is pretty straightforward: it's a util mixin that'll be put inside a container and will specify how many columns each of its children will take up. In the example below, I have two columns, with 8px gap, with 8 elements each taking one column for desktop up and down, and for tablet-portrait down they'll take two columns.

It works very well and is super easy to use, so much so that I was even thinking about creating something similar for container-queries (or expading this one), but.... when I build this for prod (VueJS + Vite project) just the last query gets compiled (sometimes the last two), and the other ones simply don't; and I have zero ideas why. That's I come to you, in search for help, please. I really don't understand this problem and haven't been able to debug it.

Code below.
Was this page helpful?