 id="x-cache-host-1">
  <template>
    <style>
    :host {
      display: block;
      --foo: blue;
      --bar: {
        border: 10px solid black;
      };
    }
    </style>
    <x-cache-child id="child"></x-bad-child>
  </template>
  <script>
  HTMLImports.whenReady(function() {
    Polymer({
      is: 'x-cache-host-1'
    });
  });
  </script>
</dom-module>

<dom-module id="x-cache-host-2">
  <template>
    <style>
    :host {
      display: block;
      --foo: blue;
      --bar: {
        border: 1px 