Shadow DOM's style scoping is very intentional, and brings sanity to styling. Cross-scope styling is possible via CSS custom properties in a much more principled way than letting styles leak all over the entire document.
CSS selectors allow for a pretty wide breadth of targets -- they can be as narrowly specific or as broadly general ("leaky") as the author likes.
What's the exact problem that another layer/mechanism of scoping solves that being thoughtful about your selectors doesn't?
You can kind of fake it with build steps and some luck, but it will always have holes and problems with dynamically updated DOM.
Faking lower bounds also keeps the browser from knowing that it doesn't have to invalidate the isolated scopes when properties above them changes.
vs
One-thousand `regular` DOM Elements with 1000 CSS selectors.
It's a simple math. 10 times faster.
Shadowdom allows for specific targeting within a component; is that necessary faster than a query using another element / class name for targeting a component in "regular" usage? I'm curious on the numbers here as I don't know that you're necessary right or wrong here.