SVG SMIL animation is it possible to organize a click count?

Question

Animation

Good afternoon dear ones. Can you please tell me if it is possible in SMIL animation to count the number of clicks? I'll give you an example.

<svg version="1.1" id="Ring" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
    viewBox="0 0 450 320" style="enable-background:new 0 0 450 320;" xml:space="preserve">
  
  <path id="innerRing" fill="none"; stroke="#F7DE4B"; stroke-width="10"; stroke-miterlimit="10"; d="M227.1,25.8c-43.4,0-78.6,8.6-78.6,19.4s35.2,19.4,78.6,19.4s78.6-8.6,78.6-19.4
    S270.6,25.8,227.1,25.8z"/>
 
 <animate xlink:href="#innerRing" attributeName="stroke-dasharray" from="0 168.409 0 168.409 " to="0 0 326.818 0" begin="0" dur="1"  repeatCount="1" /> 
 
    <path id="outerRingMin" fill="none"; stroke="#B2A31B"; stroke-width="0.9"; stroke-miterlimit="10";
    d="M227.1,59.8c-40.5,0-73.2-6.5-73.2-14.5s32.8-14.5,73.2-14.5c40.5,0,73.2,6.5,73.2,14.5
    S267.5,59.8,227.1,59.8"/>
 
    <animate xlink:href="#outerRingMin" attributeName="stroke-dasharray" from="0 153.693 0 153.693" to="0 0 307.386 0" begin="0" dur="1"  repeatCount="1" />
    
    <path id="outerRingMax" fill="none"; stroke="#B2A31B"; stroke-width="0.9"; stroke-miterlimit="10"; d="M227.1,69c46,0,83.4-10.7,83.4-24s-37.3-24-83.4-24c-46,0-83.4,10.7-83.4,24
    c0,13.2,36.7,23.8,82.1,24L227.1,69z"/>
 
    <animate xlink:href="#outerRingMax" attributeName="stroke-dasharray" from="0 181.92 0 181.92" to="0 0 363.84 0" begin="0" dur="1"  repeatCount="1" />
 
  </svg>

https://jsfiddle.net/BlackStar1991/ncaq5109/
It is necessary that with a non-pair number of clicks, the rings are drawn, and with a paired number of clicks, the animation goes in the opposite direction and they seem to disappear. Is it possible to implement without JS? PS. One more little question. Why does my largest ring grow in the opposite direction compared to the other two?