/* Common numeric update presentation for React screens and the original dashboard. */
.smt-number { display: inline-block; vertical-align: bottom; }
.smt-number > .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.smt-number-value { display: inline-flex; align-items: baseline; vertical-align: bottom; white-space: nowrap; font-variant-numeric: tabular-nums; }
.smt-number-value > span { white-space: pre; }
.smt-number-digit { position: relative; display: inline-grid; overflow: hidden; text-align: center; }
.smt-number-current { grid-area: 1 / 1; display: block; }
.smt-number-previous { position: absolute; inset: 0; display: block; opacity: 0; pointer-events: none; }
.smt-number-unit { font-size: max(12px, .84em); margin-left: .025em; }
.smt-number-value.is-value-changing { animation: smt-value-emphasis 3.2s ease-out both; }
.is-digit-changing .smt-number-current { animation: smt-number-in 1.6s cubic-bezier(.22, .61, .36, 1) both; }
.is-digit-changing .smt-number-previous { animation: smt-number-out 1.6s cubic-bezier(.22, .61, .36, 1) both; }
.smt-number-value.motion-down .is-digit-changing .smt-number-current { animation-name: smt-number-in-down; }
.smt-number-value.motion-down .is-digit-changing .smt-number-previous { animation-name: smt-number-out-down; }
@keyframes smt-number-in-down {
  0%, 12% { opacity: 0; transform: translateY(-115%); }
  100% { opacity: 1; transform: translateY(0); }
}
@keyframes smt-number-out-down {
  0%, 12% { opacity: 1; transform: translateY(0); }
  100% { opacity: 0; transform: translateY(115%); }
}
@keyframes smt-number-in {
  0%, 12% { opacity: 0; transform: translateY(115%); }
  100% { opacity: 1; transform: translateY(0); }
}
@keyframes smt-number-out {
  0%, 12% { opacity: 1; transform: translateY(0); }
  100% { opacity: 0; transform: translateY(-115%); }
}
@keyframes smt-value-emphasis {
  0%, 60% { color: var(--smt-number-accent, #247ECB); text-shadow: 0 0 .2em var(--smt-number-glow, #78b4ec30); }
  100% { color: inherit; text-shadow: none; }
}
@media (prefers-reduced-motion: reduce) {
  .smt-number-value.is-value-changing, .is-digit-changing .smt-number-current, .is-digit-changing .smt-number-previous { animation: none; }
  .smt-number-previous { display: none; }
  .smt-number-value.is-value-changing { color: var(--smt-number-accent, #247ECB); }
}
@media print {
  .smt-number-value.is-value-changing, .is-digit-changing .smt-number-current, .is-digit-changing .smt-number-previous { animation: none !important; color: inherit; text-shadow: none; }
  .smt-number-previous { display: none; }
}