Счетчики CSS - Демо работает, не работает в браузере

Question

При попытке реализовать удивительный пример CSS-счетчиков Hugo Giraudel, все не получается, когда я пытаюсь настроить его в браузере.

Я не пользуюсь counter-reset или же increment, поэтому я не уверен, какие ссылки должны быть изменены. В моем примере у меня есть только две ссылки, которые необходимо сосчитать - ссылки кажутся правильными, но счетчик не меняется с 1 на 2.

Короткий пример ниже...

Low level <a href="#features" aria-describedby="footnote-label" id="features-ref">features</a> don't come into existence in the span of a year.

<a href="#criticism" aria-describedby="footnote-label" id="criticism-ref">criticism</a> they receive for this stance.

<footer>
  <h2 class="visually-hidden" id="footnote-label">Footnotes</h2>
  <ol>
    <li id="features">
      Swift took 4 years. LLVM reached the 1.0 milestone in 2003. <a href="#features-ref" aria-label="Back to content">↩</a>
    </li>
    <li id="criticism">
      In Apple's case, it might be, "Damn the investors and pundits!" <a href="#criticism-ref" aria-label="Back to content">↩</a>
    </li>
  </ol>
</footer>