Mobile loading and scroll-away controls

Scope

Restore the loading/footer fix independently of the rejected capsule treatment. On phone Discover and Community, move the existing header out of view while scrolling and bring it back after scrolling stops. Keep desktop and contained chat/editor layouts unchanged. User authorization includes deployment to main.

Evidence

• The user confirmed the black footer disappears when loading completes, and confirmed the startup change in 92b410fed fixed it. Rolling back that whole commit in 75d361dbc also removed the working startup fix.
• PostHog identifies the authenticated official account as username yumina, role admin. Its affected Safari session includes Discover/Community switches at 07:37–07:42 UTC on September 9. Pageviews report Mobile Safari 26.6, width 440, height 796 or 836. The reported iOS 18.7 OS string is not proof of actual OS version: Safari freezes it. Recording metadata contains zero console errors; event counts include four dead swipes. These do not establish a particular rendering failure.
• Inspected recording metadata and analytics events, not a visual playback. PostHog's web recorder serializes the DOM; the user's screenshots are the evidence for the native status/address bars outside the page.
• The old resting header separately applied brightness(0.4), while the root canvas had its own ambient color. This creates different page/header tones.

Changes

• Restored the pre-React reading bootstrap, render-blocking canvas stylesheet, transparent non-fixed splash, redirect cleanup, and viewport handoff from the user-confirmed loading fix. The panel CSS excludes native reading roots.
• No capsule grouping around menu or account controls. Resting header uses the same ambient color as the document canvas and a soft lower mask; removed the independent brightness/filter layer. This is a simple matching surface, not an attempt to recreate Apple's native glass renderer.
• After 8px of document movement beyond the top 24px, animate the header away using transform/opacity only. Keep its document footprint. Reveal 240ms after the last movement, followed by a 180ms transition. Do not reveal during a held touch or momentum scrolling. Browser toolbar height-only resizes do not reset this state; width changes, resume, and route cleanup do.
• Search/reply focus, keyboard navigation, open header menus, preview and scroll-locked dialogs keep navigation stable. Hidden controls are inert and omitted from the accessibility tree. Reduced motion removes transitions.

Verification

• Regression tests first failed for missing behavior and the later panel overflow collision; all targeted checks pass after the restoration.
• Reviewer reproduced a height-only resize revealing the header mid-swipe. Added a failing regression, fixed width-only resets, and confirmed it passes.
• pnpm build: 5/5 tasks passed. pnpm typecheck: 8/8 tasks passed.
• 49 targeted tests passed (header, bootstrap, canvas, viewport, page scrolling, route restoration and story return).
• Full app suite: 751 tests, 748 passed. Three existing drawer geometry tests still fail (row height, close-button size, and item gap); no new failures.
• Local dev server HTTP checks: homepage, Discover, deep Community path and critical stylesheet return 200. No local browser opened, per AGENTS.md.
• Independent code review: no remaining blockers after the resize correction.
• Physical iPhone native chrome and animation appearance remain unverified. Matching our edge colors cannot guarantee Safari's compositor behavior.

Primary references

• WebKit: fixed/sticky edge color extension
• WebKit: soft-navigation status-bar regression
• Safari 26.2 release notes and frozen OS user-agent version
• PostHog web replay architecture