@property --thousands{syntax:"<integer>";initial-value:0;inherits:true}@property --num{syntax:"<integer>";initial-value:0;inherits:true}@property --float{syntax:"<integer>";initial-value:0;inherits:true}.animate-number-trigger{view-timeline-name:--subjectReveal;animation-timeline:--subjectReveal;animation-timeline:view();animation-direction:forwards;animation-duration:1ms;animation-name:trigger;animation-timing-function:ease-out}.has-trigger{--thousands:0;--num:0;--float:0}.has-trigger[data-run=true]{--thousands:var(--newthousands);--num:var(--newnum);--float:var(--newfloat)}@keyframes trigger{0%,5.9%{--thousands:0;--num:0;--float:0}6%,to{--thousands:var(--newthousands);--num:var(--newnum);--float:var(--newfloat)}}.animate-number{counter-reset:thousands var(--thousands) num var(--num) float var(--float);transition:--num 1.5s cubic-bezier(0,0,0,1),--float 3s cubic-bezier(0,0,0,1),--thousands 1s cubic-bezier(0,0,0,1);transition-timing-function:cubic-bezier(0,0,0,1)}.animate-number:after{content:counter(num)}.animate-number-float:after{content:counter(num) "," counter(float)}.animate-number-float-thousands:after{content:counter(thousands) " " counter(num) "," counter(float)}.animate-number-thousands:after{content:counter(thousands) " " counter(num)}@supports not (animation-timeline:view()){.animate-number{--thousands:var(--newthousands);--num:var(--newnum);--float:var(--newfloat)}}
