> I think it was a mistake to combine styling and layout (...)

Anyone who ever did any work on UI development knows very well that styling and layout are coupled and interdependent. I mean, think about it. Text string length, text size, text overflowing/breaking/clipping, margins, etc. You change border sizes/padding/spacing and the space left for child content changes as well. How exactly do you uncouple something that's fundamentally coupled?

I think that's true, but I think there's a more fundamental mistake in thinking that you can uncouple the HTML structure from layout, particularly when the layout rules make explicit reference to "parents" and "siblings".

The dream of CSS was that you could decouple styling from semantics. Your HTML would tell you what the page meant, and then your CSS would let you present it in whatever format was prettiest, and you could swap out CSS to let different users view it differently. But in practice, what happened was that the page ended up meaning nothing - it was just an app, a way for the user to accomplish a task, so instead of <h1> through <h6> and <p> and <em> and <cite>, everything is a <div>. The very concept of CSS was flawed, because we still thought of websites as documents at the time it was invented, rather than as an app platform.

That's perhaps why newer reactive frameworks like React or Jetpack Compose ditch this separation. The style in React is to just include CSS inline on the components. In Compose, you have Modifiers that let you specify the styling as explicit attributes on the component. They admit that they're building a UI framework, not a document overlay, and get rid of the content/presentation separation as a result. It's all presentation.