There are good designers out there who don't know HTML, CSS or JS. There are also good designers out there who know all three.

CSS-in-JS (or if not, BEM at the least) is a closer fit to the mental model of styling things in design software like Sketch and Figma. So having to use CSS in full utilising-the-cascade-and-complex-selectors mode could reasonably be seen as a bigger barrier to entry than just using something like Styled Components or Emotion. I've come across plenty of designers comfortable with CSS who felt more at home using Styled Components.

I'm not arguing that there won't be some people for whom CSS-in-JS creates barriers, but there will also be others for whom it knocks them down.

simple != reliable

What is so hard about writing CSS in JS?

Scoping. The way you style a large, complex application is going to be very different using CSS-In-JS vs pure CSS.

I think you're missing the point you can do both? If you want to load a global stylesheet for common theming and then provide component level CSS in JS then that's absolutely fine and even suggested. Having dealt with many styling solutions in my time I find using styled components with the style mentioned is one of the greatest developer experiences I've had in many years. Being able to interpolate your react state within your css is just great and opens up the doors to massively simplify dynamic layouts which the state of which are much better represented in JS

Yes, it is going to be safer and much simpler.

I don’t understand, simple things do tend to be reliable.