> Specificity

:where() gives you zero specificity.

> Future pathing

Sounds like premature optimization. And I say this as someone who has been using custom elements and web components in production since 2016. In fact one of my products offers WCs for our customers:

https://docs.wavekit.app/web-components-wavekit-audio/

> Cleaner

Debatable. Personally I find it cleaner to simply rely on CSS to solve something rather a combination of CSS, JS, and some custom markup.

1. ... I do not understand what you mean.

2. One person's "premature optimization" is someone else's "this was literally something I dealt with this week."

3. This method relies on CSS and HTML, just as any other styling solution would.