title: CSS style <audio>
body: <p>is there a way how to style timeline thumb (seeker) of an <code>&lt;audio&gt;</code> tag? I'm able to target and style most of the element using <code>audio::-webkit-</code> shadow DOM pseudo selectors. </p>
  
  <p>However, I was unlucky finding a selector to match the playback timeline thumb. It's done by <code>&lt;input type="range"&gt;</code>, another shadow DOM element. So basically I'm trying to target shadow DOM pseudo element inside another shadow DOM pseudo element. </p>
  
  <p><a href="https://i.stack.imgur.com/acGnL.png" rel="noreferrer"><img src="https://i.stack.imgur.com/acGnL.png" alt="enter image description here"></a></p>
  
  <p>My playground is on <a href="https://jsfiddle.net/cLwwwyh5/" rel="noreferrer">https://jsfiddle.net/cLwwwyh5/</a>.</p>
  
  <p><a href="https://i.stack.imgur.com/HsTQH.png" rel="noreferrer"><img src="https://i.stack.imgur.com/HsTQH.png" alt="audio player shadow DOM structure"></a></p>
  
  <p>I just need this to work in Chrome (Chrome App)</p>