Fix pace sentinel, route map thumbnails, tiled segments, health/dashboard layout

- Pace: FIT 0xFFFF sentinel (65.535 m/s) was stored as avg_speed_ms on every
  activity and lap; add _sanitize_speed() to parser falling back to dist/dur,
  plus a startup SQL migration that fixed 120 activities and 688 laps in-place
- Records: remove swimming from Distance PRs; Route Records rows are clickable
  (navigate to activity), View button removed, small SVG route map per row;
  Segment Records uses same tiled route-card layout as Segments page
- Segments: replace route dropdown with responsive tile grid showing SVG map
  thumbnails; selecting a tile reveals the segment management panel below
- RouteMiniMap: new pure-SVG component (no Leaflet) for route thumbnails,
  decodes polyline and normalises coords into a fixed viewBox
- Health: rename "Avg Heart Rate (day)" → "Heart Rate"; weight chart now
  filters to non-null rows and enables connectNulls + dots for sparse data
- Dashboard: 4-col layout at lg breakpoint so Body Battery sits between weekly
  chart and Health Today; Body Battery card gains a 24-hr sparkline from the
  values[] already present in the health summary response

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

frontend/src/pages/HealthPage.jsx

@@ -432,7 +432,7 @@ function DailySnapshot({ day, avg30, intradayHr, bodyBattery, bbHires, onOlder,
 
 // ── Trend Charts ────────────────────────────────────────────────────────────
 
-function MetricChart({ data, dataKey, color, formatter, height = 140, selectedDate, onDayClick }) {
+function MetricChart({ data, dataKey, color, formatter, height = 140, selectedDate, onDayClick, connectNulls = false, showDots = false }) {
   const vals = data.filter(d => d[dataKey] != null)
   if (!vals.length) return (
     <div className="flex items-center justify-center text-gray-600 text-xs" style={{ height }}>No data</div>
@@ -465,7 +465,9 @@ function MetricChart({ data, dataKey, color, formatter, height = 140, selectedDa
           <ReferenceLine x={selectedDate} stroke="#60a5fa" strokeWidth={1.5} strokeDasharray="4 2" />
         )}
         <Area type="monotone" dataKey={dataKey} stroke={color} strokeWidth={2}
-          fill={`url(#grad-${dataKey})`} dot={false} connectNulls={false} isAnimationActive={false} />
+          fill={`url(#grad-${dataKey})`}
+          dot={showDots ? { fill: color, r: 3, strokeWidth: 0 } : false}
+          connectNulls={connectNulls} isAnimationActive={false} />
       </AreaChart>
     </ResponsiveContainer>
   )
@@ -657,9 +659,12 @@ export default function HealthPage() {
 
             <div className="bg-gray-900 rounded-xl border border-gray-800 p-4">
               <h3 className="text-sm font-medium text-gray-300 mb-3">Weight</h3>
-              <MetricChart data={metrics} dataKey="weight_kg" color="#34d399"
+              <MetricChart
+                data={metrics.filter(d => d.weight_kg != null)}
+                dataKey="weight_kg" color="#34d399"
                 formatter={v => `${v.toFixed(1)} kg`}
-                selectedDate={selDateForCharts} onDayClick={handleDayClick} />
+                selectedDate={selDateForCharts} onDayClick={handleDayClick}
+                connectNulls showDots />
             </div>
 
             <div className="bg-gray-900 rounded-xl border border-gray-800 p-4">
@@ -697,7 +702,7 @@ export default function HealthPage() {
             </div>
 
             <div className="bg-gray-900 rounded-xl border border-gray-800 p-4">
-              <h3 className="text-sm font-medium text-gray-300 mb-3">Avg Heart Rate (day)</h3>
+              <h3 className="text-sm font-medium text-gray-300 mb-3">Heart Rate</h3>
               <MetricChart data={metrics} dataKey="avg_hr_day" color="#f97316"
                 formatter={v => `${Math.round(v)} bpm`}
                 selectedDate={selDateForCharts} onDayClick={handleDayClick} />