refactor(frontend): migrate JS modules to TypeScript

Wholesale JS -> TS migration of the frontend — stores, utils, actions,
and all Svelte component scripts adopt type annotations. Compile-time
surfaces (app.d.ts, lib/types/) added for shared DTO types.

Build plumbing:
  - package.json: dev:frontend script that runs svelte-kit sync first
  - tauri.conf.json: beforeDevCommand points at dev:frontend
  - run.sh: dropped the sed-hack that temporarily blanked beforeDevCommand;
    now relies on npm run dev:frontend to avoid double-Vite
  - jsconfig.json: allowImportingTsExtensions

Preserves all Group 1 behaviour:
  - page.svelte.ts keeps loadHistory / loadTasks Tauri-first, no
    localStorage; saveTranscriptMeta + mapTranscriptRow + mapTaskRow
    intact; update_task_cmd and update_transcript_meta_cmd invocations
    carry the correct payload shape.
  - Toasts, preferences stores typed without behaviour change.
  - Viewer still routes segment edits through saveTranscriptMeta; the
    Task 1.5 TODO markers are gone.

taskExtractor.ts is functionally improved during the migration:
  - multi-task matches in the same sentence
  - list-style shopping-verb expansion (get bread, milk, and cheese)

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

src/lib/stores/preferences.svelte.ts

@@ -0,0 +1,172 @@
+// src/lib/stores/preferences.svelte.js
+import { invoke } from "@tauri-apps/api/core";
+import { emit } from "@tauri-apps/api/event";
+import { getCurrentWindow } from "@tauri-apps/api/window";
+import type { AccessibilityPreferences, Preferences } from "$lib/types/app";
+import { errorMessage } from "$lib/utils/errors.js";
+import { toasts } from "./toasts.svelte.ts";
+
+export const PREFERENCES_CHANGED_EVENT = "kon:preferences-changed";
+
+type FontFamilies = Record<AccessibilityPreferences["fontFamily"], string>;
+
+function currentWindowLabel() {
+  try {
+    return getCurrentWindow().label;
+  } catch {
+    return null;
+  }
+}
+
+function broadcastPreferences(prefs: Preferences) {
+  const source = currentWindowLabel();
+  if (source === null) return;
+  // Fire-and-forget — cross-window sync must never block the local apply path.
+  emit(PREFERENCES_CHANGED_EVENT, { source, prefs: JSON.parse(JSON.stringify(prefs)) })
+    .catch(() => {});
+}
+
+const DEFAULTS: Preferences = {
+  theme: "dark",
+  zone: "default",
+  accessibility: {
+    fontFamily: "lexend",
+    fontSize: 16,
+    letterSpacing: 0,
+    lineHeight: 1.5,
+    transcriptSize: 16,
+    bionicReading: false,
+    reduceMotion: "system",
+  },
+};
+
+const FONT_FAMILIES: FontFamilies = {
+  lexend: "'Lexend', system-ui, sans-serif",
+  atkinson: "'Atkinson Hyperlegible Next', system-ui, sans-serif",
+  opendyslexic: "'OpenDyslexic', system-ui, sans-serif",
+};
+
+function readFromDOM(): Preferences {
+  const el = document.documentElement;
+  return {
+    theme: (el.dataset.theme || DEFAULTS.theme) as Preferences["theme"],
+    zone: el.dataset.zone || DEFAULTS.zone,
+    accessibility: {
+      fontFamily: (el.dataset.fontFamily || DEFAULTS.accessibility.fontFamily) as AccessibilityPreferences["fontFamily"],
+      fontSize: parseFloat(el.style.getPropertyValue('--font-size-body')) || DEFAULTS.accessibility.fontSize,
+      letterSpacing: parseFloat(el.style.getPropertyValue('--letter-spacing-body')) || DEFAULTS.accessibility.letterSpacing,
+      lineHeight: parseFloat(el.style.getPropertyValue('--line-height-body')) || DEFAULTS.accessibility.lineHeight,
+      transcriptSize: DEFAULTS.accessibility.transcriptSize,
+      bionicReading: el.dataset.bionicReading === "true",
+      reduceMotion: (el.dataset.reduceMotion || DEFAULTS.accessibility.reduceMotion) as AccessibilityPreferences["reduceMotion"],
+    },
+  };
+}
+
+function applyToDOM(prefs: Preferences) {
+  const el = document.documentElement;
+
+  // Theme — resolve 'system' to actual value
+  el.dataset.theme = prefs.theme === "system"
+    ? (window.matchMedia("(prefers-color-scheme: light)").matches ? "light" : "dark")
+    : prefs.theme;
+
+  // Zone
+  if (prefs.zone === "default") {
+    delete el.dataset.zone;
+  } else {
+    el.dataset.zone = prefs.zone;
+  }
+
+  // Accessibility — inline styles for highest specificity
+  const a = prefs.accessibility;
+  el.style.setProperty('--font-family-body', FONT_FAMILIES[a.fontFamily] || FONT_FAMILIES.lexend);
+  el.style.setProperty('--font-size-body', `${a.fontSize}px`);
+  el.style.setProperty('--letter-spacing-body', `${a.letterSpacing}em`);
+  el.style.setProperty('--line-height-body', String(a.lineHeight));
+
+  el.dataset.bionicReading = String(a.bionicReading);
+  el.dataset.fontFamily = a.fontFamily;
+
+  // Reduce motion — three-value resolution
+  const motionReduced = a.reduceMotion === "on"
+    || (a.reduceMotion === "system" && window.matchMedia("(prefers-reduced-motion: reduce)").matches);
+  if (motionReduced) {
+    el.dataset.reduceMotion = "true";
+  } else {
+    delete el.dataset.reduceMotion;
+  }
+}
+
+let saveTimeout: ReturnType<typeof setTimeout> | undefined;
+// Show the failure toast at most once per process so a stuck SQLite path
+// doesn't spam the user every time they nudge a slider.
+let saveFailureToastShown = false;
+function persistToSQLite(prefs: Preferences) {
+  clearTimeout(saveTimeout);
+  saveTimeout = setTimeout(async () => {
+    try {
+      await invoke("save_preferences", { preferences: JSON.stringify(prefs) });
+      saveFailureToastShown = false;
+    } catch (e) {
+      console.error("Failed to save preferences:", e);
+      if (!saveFailureToastShown) {
+        toasts.warn(
+          "Could not save preferences",
+          `${errorMessage(e)}. Your changes still apply for this session.`,
+        );
+        saveFailureToastShown = true;
+      }
+    }
+  }, 500);
+}
+
+// Export as const so it is never reassigned — consumers hold a stable reference
+// and mutations are tracked by Svelte 5's deep reactivity.
+export const preferences = $state(readFromDOM());
+
+// Ensure data-theme and zone attributes are always present on the DOM, even
+// when there is no Tauri webview injection script (e.g. browser dev mode).
+if (typeof window !== 'undefined') {
+  applyToDOM(preferences);
+}
+
+/** @deprecated Use `preferences` directly — kept for backwards compatibility */
+export function getPreferences() {
+  return preferences;
+}
+
+export function updatePreferences(updates: Partial<Preferences>) {
+  Object.assign(preferences, updates);
+  applyToDOM(preferences);
+  persistToSQLite(preferences);
+  broadcastPreferences(preferences);
+}
+
+export function updateAccessibility(updates: Partial<AccessibilityPreferences>) {
+  Object.assign(preferences.accessibility, updates);
+  applyToDOM(preferences);
+  persistToSQLite(preferences);
+  broadcastPreferences(preferences);
+}
+
+// Apply preferences received from another Tauri window. Mutates local state
+// and DOM only — never persists or re-broadcasts, so there is no echo loop.
+export function applyExternalPreferences(prefs: Partial<Preferences> | null | undefined) {
+  if (!prefs || typeof prefs !== "object") return;
+  Object.assign(preferences, prefs);
+  if (prefs.accessibility) {
+    Object.assign(preferences.accessibility, prefs.accessibility);
+  }
+  applyToDOM(preferences);
+}
+
+// Re-resolve when OS preferences change
+if (typeof window !== "undefined") {
+  window.matchMedia("(prefers-color-scheme: light)").addEventListener("change", () => {
+    if (preferences.theme === "system") applyToDOM(preferences);
+  });
+  window.matchMedia("(prefers-reduced-motion: reduce)").addEventListener("change", () => {
+    if (preferences.accessibility.reduceMotion === "system") applyToDOM(preferences);
+  });
+}