After reading the spec, I'm still not sure how CSS pseudo-class :fullscreen works in the context of shadow dom. See example below:

<style>
  :fullscreen { color: blue }
</style>
<my-web-component>
  #shadow-root
    <style>
      :fullscreen { color: green }
    </style>
    <video></video>
</my-web-component>

What happens after await video.requestFullscreen()?

• Is <video> element color green?
• Is <my-web-component> element color blue?

Note that I wasn't able to find web platform tests for this.