/deep/combinator视频范围蓝色css未正确显示

我正试图使用/dept/组合子使我的视频控件上的范围显示为蓝色。目前一切都没有改变。我有没有犯过任何人注意到的语法错误？我正在使用Chrome来正常工作。

http://plnkr.co/edit/Qyjb1Q33DoFGSdUVLv9p?p=preview

var CarList = Object.create(HTMLElement.prototype);
      
      CarList.createdCallback = function() {
        var template = document.querySelector('#car');
        var templateClone = document.importNode(template.content, true);
        this.createShadowRoot().appendChild(templateClone);
      }
      
      document.registerElement('car-list', {
        prototype: CarList
      });
      
      var DealerList = Object.create(HTMLElement.prototype);
      
      //Nested Custom Element
      DealerList.createdCallback = function() {
        var template = document.querySelector('#dealer');
        var templateClone = document.importNode(template.content, true);
        this.createShadowRoot().appendChild(templateClone);
      }
      
      document.registerElement('dealer-list', {
        prototype: DealerList
      });

car-list /deep/ li {
        color: red;
      }
      
      video /deep/ input[type="range"] { background-color:blue;}

<video controls></video>
    <car-list>
      <dealer-list></dealer-list>
    </car-list>
    
    <template id="car">
      <ul>
        <li>Ferrari Enzo</li>
        <li>Porsche 91l Turbo</li>
        <li>Dodge Caravan</li>
      </ul>
      <shadow></shadow>
    </template>
    
    <template id="dealer">
      <ul>
        <li>Beverly Hills Ferrari</li>
        <li>Beverly Hills Dodge</li>
      </ul>
    </template>