[BUG]: OrbitImages flashes oversized on mount/refresh when responsive is enabled

[achelie]

Describe the issue

When responsive={true}, OrbitImages briefly renders at full design size (scale=1) before shrinking to fit the container. This happens on initial page load and when remounting the component (e.g. clicking Refresh on the demo page).
The visual effect looks like a quick zoom-in then zoom-out.

Expected behavior

The component should render at the correct scale immediately, with no visible size flash.

Root cause

scale is initialized to 1 and measured in useEffect (after paint). Before measurement completes, the 1400px design canvas is shown at scale(1).

Reproduction Link

No response

Steps to reproduce

1. Open /animations/orbit-images (demo uses responsive={true})
2. Click the “Refresh” button, reload the page (press F5), or adjust the parameters.
3. Observe the orbit briefly appearing too large, then snapping to the correct size

Validations

• I have checked other issues to see if my issue was already reported or addressed