Selector de CSS para raíz raíz o todos los elementos de nivel superior en raíz raíz

Necesito un selector para usar en CSS dentro de una raíz de sombra, que selecciona a todos los hijos (pero no a los nietos) de la raíz de sombra, sin importar qué etiqueta sean y sin darles una identificación.

En el siguiente ejemplo, SPAN, A, P y DIV deberían tener un borde rojo, pero SPAN IN DIV no.

<my-element>
  #shadow-root
    <span>SPAN</span>
    <a>A</a>
    <p>P</p>
    <div>
      DIV
      <span>SPAN IN DIV</span>
    </div>
    <style>
      :root>*{border:1px red solid;}
    </style>
</my-element>

Esperaba que el:root-Selector haría el trabajo dentro de un dom de sombra, pero ese no es el caso.

También sería una posible solución si alguien muestra cómo establecer una ID en la raíz oculta.

Actualizar:

Intenté usar#shadow-root > * como selector:

Parece que no funciona. Probablemente son solo las herramientas de desarrollador de Google Chrome que visualizan el elemento raíz de sombra de esa manera.

Respuestas a la pregunta(1)

Su respuesta a la pregunta