@counter-style circled {
  system: fixed;
  symbols: "\2460" "\2461" "\2462" "\2463" "\2464" "\2465" "\2466" "\2467"
           "\2468" "\2469" "\246A" "\246B" "\246C" "\246D" "\246E" "\246F"
           "\2470" "\2471" "\2472" "\2473";
  speak-as: numbers;
  suffix: " ";
}

@counter-style inv-circled {
  system: fixed;
  symbols: "\278A" "\278B" "\278C" "\278D" "\278E" "\278F" "\2790" "\2791"
           "\2792" "\2793" "\24EB" "\24EC" "\24ED" "\24EE" "\24EF" "\24F0"
           "\24F1" "\24F2" "\24F3" "\24F4";
  speak-as: numbers;
  suffix: " ";
}

main :is(h1, h2, h3, h4, h5, h6):not(.unnumbered)::before {
  padding-right: 1ex;
}

main h1:not(.unnumbered) { counter-increment: h1; }
main h1 { counter-reset: h2 h3 h4 h5 h6; }
main h1:not(.unnumbered)::before {
  content: counter(h1, inv-circled);
}
main h1.unnumbered::before {
  content: "\2B8A  ";
}

/*

main h2:not(.unnumbered) { counter-increment: h2; }
main h2:not(.unnumbered)::before {
  content: counter(h1) '.' counter(h2);
}
main h2 { counter-reset: h3 h4 h5 h6; }

main h3:not(.unnumbered) { counter-increment: h3; }
main h3 { counter-reset: h4 h5 h6; }
main h3:not(.unnumbered)::before {
  content: counter(h1) '.' counter(h2) '.' counter(h3);
}

main h4:not(.unnumbered) { counter-increment: h4; }
main h4 { counter-reset: h5 h6; }
main h4:not(.unnumbered)::before {
  content:
    counter(h1) '.' counter(h2) '.' counter(h3) '.' counter(h4);
}

main h5:not(.unnumbered) { counter-increment: h5; }
main h5 { counter-reset: h6; }
main h5:not(.unnumbered)::before {
  content:
    counter(h1) '.' counter(h2) '.' counter(h3) '.' counter(h4) '.'
    counter(h5);
}

main h6:not(.unnumbered) { counter-increment: h6; }
main h6:not(.unnumbered)::before {
  content:
    counter(h1) '.' counter(h2) '.' counter(h3) '.' counter(h4) '.'
    counter(h5) '.' counter(h6);
}

*/