feat(theme): retune the container scale to one geometric rhythm

[gabriel-lisboa-azion]

Summary

The container scale was two grids spliced together: it stepped +32, then +64, then +96, then +128. Neighbouring sizes sat 12% apart at the bottom and 11% apart at the top with a visible seam in the middle, so picking a container size meant knowing where you were on the list rather than how much wider you wanted.

It is now anchored at both ends — 3xs stays 256px (the narrowest useful field rail), 7xl becomes 1620px (the widest page measure) — with the eleven slots between them at 256 × r^n, r = (1620 / 256)^(1/12) ≈ 1.1662. Every neighbouring pair sits ~+16.6% apart, so one step always means the same relative jump. Ratio between neighbours ranges 1.157–1.172.

Values round to the 4px grid rather than 8px because 1620 is not a multiple of 8 and the anchor defines the grid; 4xl is nudged 4px to land on 1024, a landmark worth keeping.

Tests

Full webkit suite green (83 files / 1692 passing, 6 skipped), eslint + vue-tsc clean, catalog:check in sync. No unit assertion changes: the unit DOM is unstyled, so container values cannot be observed there by construction — this change is verified in the visual layer.

Visual regression

Baselines are regenerated and committed (ubuntu-latest, via the app-storybook-generate-baseline dispatch).

I expected this to be the widest-reaching change in the batch. It is not: 42 of 1,945 baselines moved, none added, none orphaned. Every one is a story wrapper or a trigger sized off the scale:

component	what moved	token
Textarea (20)	story wrapper	max-w-sm 384 → 408
PickList (12)	story wrapper	container-xl 576 → 644
Calendar (6)	two-part trigger	container-xs 320 → 348
ScrollArea (4)	story wrapper	container-md 448 → 472

⚠️ Why only 42 — the overlays are unverified

Popover, Dropdown, Tooltip, Panel, Dialog, Table.Filter and Table.ColumnSelector all size their panels from container tokens, so this PR changes their rendered widths. Not one of them moved — because every one of those stories snapshots its trigger closed. The panels are never rendered, so nothing compares them.

Concretely: this PR widens the Popover width presets from 320/384/448 to 348/408/472, the change its own doc-text edit describes, and no check anywhere verifies that. The same is true for six other overlay components.

That gap is pre-existing — the overlay stories have always shot closed triggers — and closing it means adding open-state stories across seven components, well outside a token retune. I did not widen this PR to do it. Recommend a follow-up; on this branch the honest statement is that the token change is verified where it is verifiable (wrappers and triggers) and unverified in every overlay.

Notes

• packages/theme/dist/v4/globals.{css,scss} is regenerated with pnpm --filter @aziontech/theme build:tokens, not hand-edited. feat/theme-placeholder-tokens regenerates the same files; whichever merges second needs a rebase plus a rebuild.
• The drawer size summaries annotated each width with a container token ("384px (container-sm)"), but a drawer is sized against the viewport it covers, not a reading measure — its widths are literals that do not move with the scale, and after the retune the annotation was simply wrong (container-sm is now 408px). The annotation is dropped; the values are untouched, so drawer widths do not change.
• The Popover width story quotes the container tokens it genuinely uses, so those px figures are refreshed.
• No new dependency. Not marked breaking — the token names and count are unchanged and no public API moves — but it does change rendered widths for any consumer on these tokens, so it is worth calling out in the release notes.