fix(ui): clarify the Usage page hierarchy

[me2seeks]

Summary

The Usage page already rendered its controls and tables with Astryx primitives, but it still bypassed the shared Settings page rhythm. Its table also inherited the outer layout padding variables, so the Astryx scroll wrapper bled roughly 24 px outside the intended data region and visually collapsed into the tabs above it.

This PR:

• moves Usage onto the shared SettingsPage root and separates the range/summary overview from the tabs/current dataset at the standard page rhythm
• gives populated datasets one Astryx Card boundary while leaving column sizing, scrolling, density, dividers, and row semantics with Astryx Table
• keeps the existing range, refresh, filtering, tab, details, and session-opening behavior unchanged
• adds empty, single-provider, multi-model, long-tail, and narrow Storybook states

Closes #1903

中文说明

使用统计页虽然已经使用 Astryx 的控件与表格，但页面根仍未接入统一的 Settings 页面节奏。表格还会继承外层布局的 padding 变量，使 Astryx 的滚动容器向上、向左右越界约 24 px，视觉上与上方 Tabs 挤成同一条区域。

本 PR 将页面接入共享 SettingsPage，把范围/摘要与 Tabs/当前数据集分成两个层级；有数据时由 Astryx Card 提供明确的数据表面边界，列宽、滚动、密度、分隔线和行语义仍由 Astryx Table 负责。原有范围切换、刷新、筛选、详情开关和会话跳转行为不变，并补齐空状态、单供应商、多模型、长内容和窄窗口 Storybook 场景。

Verification

• npm --workspace @maka/desktop run build:workspace-deps
• npm --workspace @maka/desktop run typecheck
• npm run lint — 2,302 files checked
• Desktop console, accessibility, and copy checks
• Story annotation and dead-CSS checks
• focused Astryx component behavior suite — 8 passed
• npm --workspace @maka/desktop run build
• npm --workspace @maka/desktop run build-storybook
• npm --workspace @maka/desktop run smoke:storybook — 67 manifest checks and 78 catalog renders passed
• manually reviewed all five Usage states at 1440 × 900 and the long-content state at 480 × 720; the 480 px document stayed horizontally contained while tabs and the 864 px table scrolled within their own boundaries

Review focus

The Card around a populated table is the Astryx container boundary, not a second table implementation. It resets the inherited container-padding variables that caused the scroll wrapper to bleed outside the Usage panel; Table remains the sole owner of table geometry and semantics.

[Astro-Han]

Could you rebase onto current main? The branch base is 47 commits behind, and the e2e failure is the sidebar rename spec (sidebar-navigation.spec.ts:72), which races without the #2022 fix (2e30bd8) that landed after this branch forked. Not caused by this PR.

Review is done and it is a pass with no blocking findings: the padding bleed is correctly root-caused (the Astryx table wrapper inherits --container-padding-* from the outer LayoutContent padding={6} and the Card padding={3} now re-declares it locally), handlers are byte-identical modulo indentation, and the five Storybook states are real and distinct. Four non-blocking notes: the behavior test asserts class-attribute order (brittle against Astryx reordering); settingsUsagePage on the root is CSS-inert now (only a test anchor); the UsageNarrow comment overstates the viewport (320px is below the 480px floor); min-width: 0 on .settingsUsageTable is redundant. After a rebase, this is ready to merge.

[me2seeks]

Rebased as requested. The previously failing sidebar rename shard now passes, and all CI checks are green.