[BUG] RollingChar key strategy skips rolling animation when digit count changes (e.g. 99 → 100)

[nightmare0329]

Description

In src/components/dashboard/StatsPanel.tsx, RollingValue renders each character with a key that encodes the string length:

{chars.map((c, i) => (
  <RollingChar key={`${chars.length}-${i}`} char={c} />
))}

When the displayed value crosses a digit boundary (e.g. 99 → 100, 999 → 1 000, 1 000 → 999), chars.length changes, every key changes, and React unmounts and remounts all RollingChar components simultaneously. The slide-in / slide-out animation defined in the component never runs because there is no update — only a fresh mount.

Steps to Reproduce

1. Open the dashboard stats panel while a live counter is near a digit boundary (or simulate a stats update that takes the value from two to three digits).
2. Observe the counter transition.
3. With same-length updates (e.g. 42 → 43) the rolling animation plays correctly.
4. With a length-changing update (e.g. 99 → 100) all digits flash instantly with no animation.

Expected Behavior

The rolling animation should play for every character transition, including when the total number of digits changes.

Actual Behavior

When the number of digits changes, all RollingChar instances remount simultaneously and the animation is skipped entirely — the number just pops to the new value.

File

src/components/dashboard/StatsPanel.tsx, RollingValue component (line ~82–91)