fix: consistent mobile surface dimming and overlay scrim

Use a dark scrim for MobileOverlayPanel instead of a translucent background so
it dims the rest of the screen like the sessions sheet.

Rework MobileSurfaceShell to mirror that structure: the scrim is the fixed
parent's background with a quick fade (keeping it on a compositing layer iOS
Safari clips to the viewport), and the sheet is a flex child sized to leave the
top safe area dimmed — dropping the old top shadow that pooled at the corners.

Mount Files/Changes/Settings only while open so each recomputes its
safe-area layout fresh, fixing intermittent top-inset dimming, and drop the
dim behind the header overflow menu to avoid a scrim-to-scrim flicker on
select.

packages/ui/src/components/ui/MobileOverlayPanel.tsx

@@ -70,7 +70,7 @@ export const MobileOverlayPanel: React.FC<MobileOverlayPanelProps> = ({
 
   const content = (
     <div
-      className="fixed inset-0 z-50 flex flex-col bg-background/70"
+      className="fixed inset-0 z-50 flex flex-col bg-[rgb(0_0_0_/_0.45)]"
       role="dialog"
       aria-modal="true"
       onClick={onClose}