That you can't have inline pseudo elements, state selectors etc. There's a lot of stuff thats just possible with a proper css file / tags.

Right - I mention this at the end of the article. By inline I'm not talking only about literally the style attribute but the inline, component-scoped pattern. For instance things like styled-components allow the full feature power of CSS classes, just inline rather than in the 'global' style.

Ah, so you mean a scoped stylesheet included in the same file as the rest of your component markup. Agreed this is a useful pattern in the right circumstances! Depending on your build process (and how you're using components), in the old days this method just saw a global stylesheet deployed as usual, except with automated / custom scoping applied via data attributes. Do web components use shadow-dom style scoping now?

> so you mean a scoped stylesheet included in the same file

Exactly - perhaps 'colocated styles' might be a better term than 'inline styles'.

> Do web components use shadow-dom style scoping now

Not sure, I don't use or know much about Web Components (the technology) - by 'component' I just mean the web framework pattern of modularising a bunch of markup/behaviour (and styles if you agree with the arguments in the article!)

Yes, as mentioned in another comment I meant you can't do anything beyond styling the element in its current state. Consider a wild state-based rule along the lines of: `input:checked ~ output[data-i="0"] + section > div:empty ~ div:last-of-type:focus-within::before` .. for that you would need a stylesheet.