Yep, the only even kinda maintainable CSS ends up being tailwind but in another file.

   <div class="unique-component-name">
      <input class="unique-component-name-input" />
      <p class="unique-component-name-text">Blah</p>
   </div>

   <div class="unique-component-name unique-component-name-variant1">
      ...

   .unique-component-name {
      ...

The cascading in HTML makes the thing that should be easy, creating variants with slight tweaks the most painful thing.