feat(ui): dark-mode token sweep, mobile nav safe-area and a11y polish

- Convert hardcoded light surfaces/borders/text in index.css to theme tokens
- Token-driven status cards, semantic colors, elevation shadows
- Mobile bottom nav: 20px icons, aria-current, safe-area inset padding
- Neutral dark pre-mount canvas fallback

src/components/StatusRail.tsx

@@ -18,13 +18,13 @@ export function StatusRail({ busyAction, syncError, setupStatus }: StatusRailPro
         </div>
       )}
       {syncError && (
-        <div className="status-card" style={{ borderColor: "#ffc9c2", background: "#fff3f1", color: "#9f1c16" }}>
+        <div className="status-card status-card--error">
           <AlertTriangle size={17} aria-hidden="true" />
           {syncError}
         </div>
       )}
       {setupStatus.state === "error" && (
-        <div className="status-card" style={{ borderColor: "#f9e3b0", background: "#fff8e8", color: "#7a4e00" }}>
+        <div className="status-card status-card--warning">
           <AlertTriangle size={17} aria-hidden="true" />
           {setupStatus.message}
         </div>