fix(ui): prevent white screen when the app mounts invisible

[charlesvien]

Problem

Users hit a "white screen of death": the app goes blank but is still alive (Cmd+K opens and navigating via it restores the screen). Logs from a report show the renderer isn't crashing at that moment. The whole authenticated app is wrapped in a framer-motion motion.div that fades from opacity: 0 to 1. If that JS-driven enter animation never completes (a stalled frameloop, or the renderer auto-reloading after a crash without repainting), the entire subtree stays at opacity: 0. The command menu is a Radix dialog portaled to document.body, so it still shows over the invisible app. The console's aria-hidden warning on <div#root> plus a still-focused tiptap editor confirm the app is mounted, just not visible.

Changes

• Replace the framer opacity animation on the main app wrapper with a CSS fade-in (.app-fade-in) whose resting opacity is 1. CSS animations run on the compositor independent of framer's JS frameloop, and a dropped or stalled animation can never leave the element below its base opacity, so the app can no longer get stranded invisible. The dark-mode entrance is unchanged (the separate LoginTransition overlay owns it).
• Add useAppVisibilityWatchdog: a one-shot check that, ~3s after the main app is shown, reports (scoped log plus captured exception) if the wrapper is still invisible (opacity ~0 or zero size). It fires only on failure, so it stays quiet normally and gives us a signal if this class of bug recurs from any cause.

How did you test this?

• New unit tests for the watchdog (invisible, zero-size, visible, inactive): 4 pass.
• packages/ui typecheck, Biome check, and the existing src/shell tests (48) pass.
• I could not deterministically reproduce the animation stall locally; the fix removes the failure mode structurally (visible resting state) rather than patching a single trigger.

Automatic notifications

• Publish to changelog?
• Alert Sales and Marketing teams?

[trunk-io]

Merging to main in this repository is managed by Trunk.

• To merge this pull request, check the box to the left or comment /trunk merge below.

After your PR is submitted to the merge queue, this comment will be automatically updated with its status. If the PR fails, failure details will also be posted here

[github-actions]

React Doctor found no issues in the changed files. 🎉

_{Reviewed by React Doctor for commit e63a6f3.}

[greptile-apps]

_{Reviews (1): Last reviewed commit: "prevent white screen when app mounts inv..." | Re-trigger Greptile}

[github-actions]

Swapping Framer Motion's animated opacity for a CSS keyframe is a sound fix for the window-blur/animation-pause white screen. The watchdog hook is well-tested and only reports — no state mutations. Both bot comments are resolved.