goober Bug when extending styles

First of all, thanks for this lib, I'm amazed by how much it can do while being less than 1kb. I have reduced my bundle size by a lot using this with preact.

Unfortunately I have run into a bug while extending styles. Here is a minimal code sample to reproduce the bug:

import React from 'react'
import { render } from 'react-dom'
import { styled, setup } from "goober"

setup(React.createElement)

const RedBase = styled('div')`color: red;`
const Orange = styled(RedBase)`color: orange;`
const Blue = styled(RedBase)`color: blue;`
const UnderlinedBlue = styled(Blue)`text-decoration: underline;`

const App = () => {
	return <div>
		<Orange>Orange</Orange>
		<UnderlinedBlue>UnderlinedBlue</UnderlinedBlue>
	</div>
};

render(<App />, document.getElementById('app'))

In this situation the text in UnderlinedBlue should be blue, but it's red ~because of a wrong order of the class names in the class attribute. In that case, the classname of RedBase is after the classname of Blue and overwrite it.~ Sorry the class names are actually in the right order. The problem most likely comes from the order in which the classes are declared in the generated CSS.

However if I remove <Orange>Orange</Orange>, it is blue as expected.

I am using goober 2.0.19-next.1 I will try to find some time to fix it.

happy new year !