feat(#404): add speech settings page with provider config

Implements the SpeechSettings component with four sections:
- STT settings (enable/disable, language preference)
- TTS settings (enable/disable, voice selector, tier preference, auto-play, speed control)
- Voice preview with test button
- Provider status with health indicators

Also adds Slider UI component and getHealthStatus API client function.
30 unit tests covering all sections, toggles, voice loading, and PDA-friendly design.

Fixes #404

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

apps/web/src/components/ui/slider.tsx

@@ -0,0 +1,55 @@
+import * as React from "react";
+
+export interface SliderProps {
+  id?: string;
+  min?: number;
+  max?: number;
+  step?: number;
+  value?: number[];
+  defaultValue?: number[];
+  onValueChange?: (value: number[]) => void;
+  disabled?: boolean;
+  className?: string;
+}
+
+export const Slider = React.forwardRef<HTMLInputElement, SliderProps>(
+  (
+    {
+      id,
+      min = 0,
+      max = 100,
+      step = 1,
+      value,
+      defaultValue,
+      onValueChange,
+      disabled,
+      className = "",
+    },
+    ref
+  ) => {
+    const currentValue = value?.[0] ?? defaultValue?.[0] ?? min;
+
+    return (
+      <input
+        type="range"
+        role="slider"
+        ref={ref}
+        id={id}
+        min={min}
+        max={max}
+        step={step}
+        value={currentValue}
+        onChange={(e) => {
+          onValueChange?.([parseFloat(e.target.value)]);
+        }}
+        disabled={disabled}
+        aria-valuemin={min}
+        aria-valuemax={max}
+        aria-valuenow={currentValue}
+        className={`w-full h-2 rounded-lg appearance-none cursor-pointer bg-gray-200 accent-blue-500 ${className}`}
+      />
+    );
+  }
+);
+
+Slider.displayName = "Slider";