@property --n {
  syntax: "<integer>";
  initial-value: 0;
  inherits: false;
}

/* body {
  display: flex;
} */

.number {
  animation: animate var(--duration) forwards var(--timing, linear);
  counter-reset: num var(--n);
  /* font-weight: bold; */
  /* font-size: 3rem; */
  font-family: sans-serif;
  /* padding: 2rem; */
}
.number::before {
  content: counter(num);
}

@keyframes animate {
  from {
    --n: var(--from);
  }
  to {
    --n: var(--to);
  }
}