shadow and style

shadowAndStyle.html

<!--
Gist for discussing https://twitter.com/ryosukeniwa/status/547131291527704576 thread in a better format...

My perspective:
Shadow root can be created on any element, regardless of whether it is a custom element... 
This creates a piercable membrane which allows the CSS for the page to not worry about the stuff inside the shadow root, until it wants to.
This allows the stuff inside to work within the page and let certain safe things through, when it wants to.
Style element can use @import to share stylesheet information across many instances.
The design allows numerous means of possible 'import' optimizations, but locks you into none (in theory)
This allows DOM inside and outside the shadow root to answer selector matching the same way as CSS.

Please explain what is broken about these particular aspects of shadow dom?  Something?
-->
<section>
  #shadow-root
      <style>...</style>
      <div>...</div>
</section>