Создание кнопки воспроизведения / паузы с чистым HTML / CSS?

Question

Вот что у меня сейчас:

#player:checked + label + div { display: none;}
#player + label:after { content: "▶" ;}
#player:checked + label:after { content: "❚❚";}

label {
    cursor: pointer;
    color: #FD749B;
}

<audio><source src="INSERT AUDIO.MP3" type="audio/mpeg"></audio>



<input type="checkbox" 
style='display: none' 
id=player 
onclick=
'var a = document.getElementsByTagName("audio")[0];
if(a.paused)a.play();else a.pause()'>
<label for=player></label>  

Это работает нормально, однако сайту, на котором я пытаюсь использовать это, не нравится этот раздел:

var a = document.getElementsByTagName("audio")[0];
if(a.paused) a.play();
else a.pause()

И поэтому кнопка не будет воспроизводить звук.

Я пытаюсь найти способ сохранить этот код относительно неизменным, но устранить необходимость в этом разделе var javascript

Имеет кто-нибудь знает какие-либо методы, которые будут использовать только HTML и CSS?