.ticker-view {
  height: auto;
  margin: auto;
  display: flex;
  flex-direction: row-reverse;
  overflow: hidden;
  position: relative;
}

.number-placeholder {
  visibility: hidden;
}

.ticker-column-container {
  position: relative;
}

.ticker-column {
  position: absolute;
  height: 1000%;
  bottom: 0;
  font-feature-settings: 'tnum';
  will-change: transform;
  backface-visibility: hidden;
}

.ticker-digit {
  width: auto;
  height: 10%;
}

.ticker-column .ticker-digit span {
  transition: color 160ms cubic-bezier(0.4, 0, 0.6, 1);
}

.ticker-column.increase .ticker-digit span {
  animation: pulseIncrement 500ms cubic-bezier(0.4, 0, 0.6, 1) 1;
}

.ticker-column.decrease .ticker-digit span {
  animation: pulseDecrement 500ms cubic-bezier(0.4, 0, 0.6, 1) 1;
}

@keyframes pulseIncrement {
  0%,
  100% {
    color: inherit;
  }
  50% {
    color: var(--increment-color);
  }
}

@keyframes pulseDecrement {
  0%,
  100% {
    color: inherit;
  }
  50% {
    color: var(--decrement-color);
  }
}
