Performance: stop iPhone freezes (blur over live map, runaway animation, eager charts)

Main app
- No backdrop-filter over the live map, animated sky, or sticky headings (it re-blurs every
  frame; on iPhone that is a classic stutter/lock-up); top/bottom bars keep a light 8px blur
- Sky effect only draws while the hero is on screen and the Now tab is active, ~30fps cap,
  fewer particles on phones; fixed a stale animation-frame id that could stop restarts

Dashboard
- Charts are built only when the Charts tab is opened (was ~11 charts on every page load),
  and the 2-minute refresh no longer rebuilds them in the background
- On phones: max 360 points per chart (was 720), no entry animation, device pixel ratio capped at 2
- Lighter header blur, none on small buttons/cards

Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>

app/public/app-ui.css

@@ -330,3 +330,15 @@ body.map-fs #tab-unified-map { padding: 0; }
 .geo-status.hidden { display: none; }
 .geo-status.ok { color: #22c55e; }
 .geo-status.warn { color: var(--ink); background: color-mix(in srgb, #ef4444 14%, var(--paper-darker)); border: 1px solid color-mix(in srgb, #ef4444 45%, transparent); }
+
+/* ── Performance on phones ──
+   backdrop-filter re-blurs everything behind it on every frame. Over a live WebGL map, an animated sky
+   or sticky headings that is what makes iPhones stutter and lock up, so those use solid translucent fills. */
+.hero-hilo, .sticky-head, .glass, .hud-btn, #tab-unified-map .map-readout-chip,
+.map-layer-menu-panel, .map-timeline-wrap, .map-data-panel, .install-banner {
+  -webkit-backdrop-filter: none !important; backdrop-filter: none !important;
+}
+.glass, .hud-btn, #tab-unified-map .map-readout-chip { background: color-mix(in srgb, var(--paper-dark) 92%, transparent) !important; }
+.sticky-head { background: color-mix(in srgb, var(--paper) 96%, transparent) !important; }
+.hero-hilo { background: rgba(0, 0, 0, 0.24) !important; }
+.topbar, .bottom-nav { -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }