<nn-input-text>
  <style slot="style">
   #native {
     color: blue;
   }
  </style>
</nn-input-text>

That allows developers to pierce the shadow DOM and override all of the elements styles using familiar syntax.

export const StyleableMixin = (base) => {
  return class Base extends base {
    static get styles () {
      return []
    }

    firstUpdated () {
      super.firstUpdated()

Add the equivalent of To the shadow DOM

      const styleSlot = document.createElement('slot')
      styleSlot.setAttribute('name', 'style')
      styleSlot.setAttribute('id', 'style-slot')
      this.shadowRoot.appendChild(styleSlot)

If an element has one or more in its light DOM, the newly added styleSlot will have them as an assigned element. Clone over all of the ones where any-tag is style. So, any