The 'Stageshow playground' component, specifically its rendering and resizing logic for displaying AI agent skills.

## What happens

With classic, always-visible scrollbars, some playground examples shake hard. The stage rescales every frame, so the whole scene jitters back and forth. Which examples shake depends on the canvas width.

It happens with the macOS setting "Show scroll bars: Always", when a mouse is connected, and with the defaults on Windows and Linux. Overlay scrollbars hide it.

## Steps to reproduce

1. `npm install && npm run dev` in `stageshow/`.
2. Turn on always-visible scrollbars.
3. Open the playground, choose **AI answer** and switch to **Phone**.

Other examples I measured shaking, as iframe height and the iframe's inner width alternating every frame:

| Example | View | Iframe height | Inner width |
|---|---|---|---|
| AI answer (`ai-chat`) | Phone tab | 498 ↔ 520 | 343 ↔ 358 |
| Google Docs (`google-docs`) | Phone tab | 418 ↔ 436 | 343 ↔ 358 |
| Kit extras (`kit-extras`) | Phone tab | 1451 ↔ 1514 | 343 ↔ 358 |
| Wikipedia (`wikipedia`) | 800 px window | 460 ↔ 470 | 657 ↔ 672 |
| Payout flow (`payout-flow`) | 390 px window | 559 ↔ 584 | 328 ↔ 343 |

The inner width always changes by exactly the scrollbar's width, 15 px.

## Cause

`playground/main.tsx` reports the embed's height as `example.offsetHeight`:

```ts
new ResizeObserver(() => send({ height: example.offsetHeight })).observe(example)
```

A scaled stage's height is usually fractional (`designH * scale`, for example 485.33 px), and `offsetHeight` rounds it to the nearest pixel. When it rounds down, the cont...