Yes, that bad side is what I meant with "cascading disaster". My wording was bad, so let me fix that: by separate places, I mean more like Svelte's CSS blocks in comparison to JSX's inline styling. Proposing inline-css as a part of their library/framework workflow is not only bad engineering with zero regards to the underlying platform but also ugly (makes reading the code very hard). In comparison, Svelte users define their styles in the same component (same file) but in a separate place. That makes tooling and the whole authoring experience incomparably better than writing styles where you also define structure and also the behavior.
The C of CSS, our cascading problem, is due to the lack of a design for good encapsulation. An intern thought that he was making that cancel button red and now so many red elements are scattered around on many screens where nobody expected... I totally agree with you that such a situation is unacceptable. Ability to set global rules is great to have coherence in the language and style of communication the application has (⩬ design system), however, those global rules shouldn't be set by accident and this by itself is one of the challenges that can make the library that you describe very successful if solved well.
