https://developer.mozilla.org/en-US/docs/Web/Web_Components/Using_shadow_DOM
<link rel="stylesheet" href="reset.css">
webpack を使って @import 'reset.css';
all: initial;
all: unset;
<x-foo>
#shadow-root
<div part="some-box"><span>...</span></div>
<input part="some-input">
<div>...</div> /* not styleable
</x-foo>
x-foo::part(some-box) {
/* ... */
}
https://meowni.ca/posts/part-theme-explainer/