@property --sb-counter-number {
  syntax: '<integer>';
  inherits: false;
  initial-value: 0;
}
.sb-counter { display: inline-block; position: relative; }
.sb-counter-visual { display: none; }
@media (prefers-reduced-motion: no-preference) {
  @layer site-builder {
    .sb-enter { animation: sb-enter 450ms ease-out both; }
  }
  @supports (counter-reset: sb-value var(--sb-counter-number)) {
    .sb-counter-value { opacity: 0; }
    .sb-counter-visual {
      display: block;
      position: absolute;
      inset: 0;
      --sb-counter-number: var(--sb-counter-end);
      counter-reset: sb-value var(--sb-counter-number);
      animation: sb-count 1100ms cubic-bezier(.16, 1, .3, 1) both;
    }
    .sb-counter-visual::after { content: counter(sb-value); }
  }
}
@keyframes sb-enter { from { opacity: .35; } to { opacity: 1; } }
@keyframes sb-count { from { --sb-counter-number: 0; } to { --sb-counter-number: var(--sb-counter-end); } }