fix: use toggle component with single pattern

web/src/lib/components/schema/SchemaPreview.svelte

@@ -25,7 +25,6 @@
 		running?: boolean;
 		error?: string;
 		aligned?: boolean;
-		ontogglealign?: () => void;
 		head: PreviewHeadModel;
 		source: PreviewSourceModel;
 		steps?: PreviewStepsModel;
@@ -37,8 +36,7 @@
 		toolId,
 		running = false,
 		error = "",
-		aligned = false,
-		ontogglealign,
+		aligned = $bindable(false),
 		head,
 		source,
 		steps = {},
@@ -66,11 +64,7 @@
 	<span class="label">{t("resultCard.previewPanel")}</span>
 	{#if stepResults.length > 1}
 		<label class="align-toggle">
-			<Toggle
-				checked={aligned}
-				label={t("chain.alignToggle")}
-				onchange={() => ontogglealign?.()}
-			/>
+			<Toggle bind:checked={aligned} label={t("chain.alignToggle")} />
 			<span>{t("chain.alignToggle")}</span>
 		</label>
 	{/if}

web/src/lib/components/schema/SchemaToolView.svelte

@@ -503,8 +503,7 @@
 						resultKind={displayResultKind}
 						running={busy}
 						error={errorText}
-						{aligned}
-						ontogglealign={() => (aligned = !aligned)}
+						bind:aligned
 						head={{
 							format,
 							quality: currentQuality,

web/src/lib/components/ui/Toggle.svelte

@@ -1,7 +1,9 @@
 <script lang="ts">
 	interface Props {
+		/** Primary pattern: bind:checked. */
 		checked: boolean;
 		label?: string;
+		/** Only for side effects beyond the value flip. */
 		onchange?: (checked: boolean) => void;
 	}
 	let { checked = $bindable(), label, onchange }: Props = $props();