I did try to implement this originally using CSS only.  It "looks" correct but the mouse controls for the ring don't line up with the display.  It's not an SVG issue, it's that mouse input coordinates are not scaled by CSS scale commands, and the ring is performing `atan2` calculations to get angles from those coordinates.  It needs to know `centerX` to make this work correctly.