Design QA — mobile homepage refinement

Source screenshot: /workspace/scratch/0602e99abe62/upload/B8A916FF-C5EE-4E81-ADA7-57414BADFD9D.png
Implementation screenshot: /tmp/llmstudy-mobile-home-after.png
Companion desktop screenshot: /tmp/llmstudy-desktop-home-after.png
Target state: English, light theme, homepage
Mobile viewport: 390 × 844
Desktop viewport: 1440 × 1000

Comparison and corrections

The source showed a persistent dark strip on the left. The closed off-canvas sidebar now has no shadow; the shadow is applied only while the drawer is open.
The source page stopped short of the right viewport edge. The root, shell, main content, page, and hero containers now resolve to the full mobile viewport and horizontal overflow is clipped defensively.
The source top bar tried to fit a full search field, shortcut hint, language, theme, and account controls in one row. Mobile now uses menu and search icons, keeps language and account visible, and moves theme control into the drawer.
The English hero used a CJK-first font stack and aggressive tracking, creating an apparent break inside “Don’t.” English now uses the native system UI stack with moderated tracking and kerning.
The mobile hero was taller than necessary. Type, spacing, actions, and the signal map were reduced while preserving the visual hierarchy.
The mobile signal map now shows three legible milestones (Tokens, GPT, Agents); the full five-node map remains on desktop.
The signed-in account control now reads as a user control with a small sync-status indicator instead of a large cloud-state button.

final result: passed