.home-stats .stats-flap {
  display: inline-flex;
  align-items: baseline;
  vertical-align: baseline;
  gap: 2px;
  margin: 0;
  color: #aee68f;
  font-family: var(--sans);
  font-size: 1.2em;
  font-weight: inherit;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}

.home-stats .stats-flap::after {
  content: '\200b';
  width: 0;
  height: 1.08em;
  font-size: inherit;
  line-height: 1.08;
}

.home-stats .stats-flap-tile {
  position: relative;
  display: inline-block;
  width: 0.64em;
  height: 1.08em;
  margin: 0;
  overflow: hidden;
  perspective: 8em;
  align-self: center;
  border-radius: 2px;
  font-size: inherit;
  font-weight: inherit;
  line-height: 1;
  color: inherit;
}

.home-stats .stats-flap-tile > span {
  position: absolute;
  left: 0;
  width: 100%;
  height: 50%;
  margin: 0;
  overflow: hidden;
  background: #0e3020;
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: 1;
  backface-visibility: hidden;
}

.stats-flap-top,
.stats-flap-front { top: 0; }
.stats-flap-bottom,
.stats-flap-back { bottom: 0; }

.home-stats .stats-flap-char {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 200%;
  margin: 0;
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: 1;
}

.stats-flap-top .stats-flap-char,
.stats-flap-front .stats-flap-char { top: 0; }
.stats-flap-bottom .stats-flap-char,
.stats-flap-back .stats-flap-char { bottom: 0; }

.home-stats .stats-flap-front {
  z-index: 2;
  transform-origin: center bottom;
  animation: stats-flap-front 200ms linear both;
}

.home-stats .stats-flap-back {
  z-index: 3;
  transform-origin: center top;
  animation: stats-flap-back 200ms linear both;
}

@keyframes stats-flap-front {
  0% { transform: rotateX(0); filter: brightness(1); }
  50%, 100% { transform: rotateX(-90deg); filter: brightness(0.6); }
}

@keyframes stats-flap-back {
  0%, 50% { transform: rotateX(90deg); filter: brightness(0.6); }
  100% { transform: rotateX(0); filter: brightness(1); }
}

@media (prefers-reduced-motion: reduce) {
  .home-stats .stats-flap-tile > span { animation: none; }
}