Hey! Is there a less-hacky way to achieve this?

.parent {
  color: red;
}
.parent > .child {
  margin: 0;
}

(garden.core/css
 [:.parent {:color 'red}
  [(gs/& :> :.child)
   {:margin 0}]])

.parent {
  color: red;
}
.parent>.child {
  margin: 0;
}

(garden.core/css
 [:.parent {:color 'red}
  [(gs/> (gs/&) :.child)
   {:margin 0}]])

.parent {
  color: red;
}
.parent & > .child {
  margin: 0;
}

@aisamu Does this feel less “hacky” to you?

[:.parent {:color :red}
 [:&> [:.child {:margin 0}]]]

It's definitely prettier and fixes half of the whitespace weirdness, thanks! (`.parent> .child`)

It's still a bit conceptually hazy, though.

which part is hazy for you?

I was expecting something more explicit (e.g. (gs/> :& :.child)) Your solution definitely profits from garden's execution model and CSS whitespace behavior, but that can also be seen as conceptual "overhead" for newcomers!

I’d be interested to hear alternative approaches or ways that’d help reduce that overhead. Keep in mind that Garden is not a priority for me currently and I’m pretty much open to working with anyone on any PR that’d improve the landscape.