.number-transition{display:inline-flex;align-items:baseline;position:relative;padding:0 .1rem;border-radius:.2rem;transition:background-color .2s ease}.number-transition:hover{background-color:rgba(59,130,246,.1);cursor:pointer}.number-transition:hover:before{content:"点击重放";position:absolute;bottom:-20px;left:50%;transform:translateX(-50%);font-size:10px;color:#3b82f6;white-space:nowrap;opacity:.8}.number-transition .decimal-part,.number-transition .decimal-point,.number-transition .integer-part{display:inline-block}.number-transition.value-increasing{animation:highlight-increase 1s ease-out}.number-transition.value-decreasing{animation:highlight-decrease 1s ease-out}@keyframes highlight-increase{0%{color:#16a34a;text-shadow:0 0 8px rgba(22,163,74,.6)}to{color:inherit;text-shadow:none}}@keyframes highlight-decrease{0%{color:#dc2626;text-shadow:0 0 8px rgba(220,38,38,.6)}to{color:inherit;text-shadow:none}}.number-transition.value-decreasing:after,.number-transition.value-increasing:after{content:"";position:absolute;right:-12px;width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;opacity:0;animation:show-indicator 1.5s ease-out forwards}.number-transition.value-increasing:after{bottom:40%;border-bottom:8px solid #16a34a}.number-transition.value-decreasing:after{top:40%;border-top:8px solid #dc2626}@keyframes show-indicator{0%{opacity:0;transform:translateX(-5px)}20%{opacity:1;transform:translateX(0)}80%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(5px)}}.circular-progress-container{width:100%;aspect-ratio:1/1;display:inline-block;position:relative}.circular-progress-svg{width:100%;height:100%;display:block;transform:rotate(-90deg)}.progress-circle-foreground{stroke:var(--stroke-color);stroke-linecap:round;stroke-dasharray:var(--stroke-circumference);stroke-dashoffset:var(--stroke-circumference);animation:circular-stroke-animation-stroke var(--stroke-animation-duration) linear forwards}.progress-circle-fill{stroke:var(--fill-color);stroke-dasharray:var(--fill-circumference);stroke-dashoffset:var(--fill-circumference);animation:circular-stroke-animation-fill var(--fill-animation-duration) linear forwards}@keyframes circular-stroke-animation-stroke{0%{stroke-dashoffset:var(--stroke-circumference)}to{stroke-dashoffset:0}}@keyframes circular-stroke-animation-fill{0%{stroke-dashoffset:var(--fill-circumference)}to{stroke-dashoffset:0}}