feat: reactive tool flow, with debounce

web/src/lib/components/tool/ParamsCard.svelte

@@ -1,23 +1,19 @@
 <script lang="ts">
-	import type { ParamDef } from '$lib/registry';
 	import ParamForm from '../ParamForm.svelte';
-	import Button from '../ui/Button.svelte';
+	import type { ParamDef } from '$lib/registry';
 
 	interface Props {
 		params: ParamDef[];
 		values: Record<string, any>;
-		busy: boolean;
-		onApply: () => void;
 	}
 
-	let { params, values = $bindable(), busy, onApply }: Props = $props();
+	let { params, values = $bindable() }: Props = $props();
 </script>
 
 <div class="panel root">
 	<h2 class="heading-section">Параметры</h2>
 	{#if params.length > 0}
 		<ParamForm {params} bind:values />
-		<Button onclick={onApply} {busy} busyText="Обработка…" fullWidth>Применить</Button>
 	{:else}
 		<p class="hint text-caption text-muted">
 			У этого инструмента нет параметров — результат уже готов.

web/src/lib/components/tool/ResultCard.svelte

@@ -57,6 +57,9 @@
 	{:else}
 		<div class="media">
 			<Preview image={result} />
+			{#if status === 'processing'}
+				<span class="recalc" aria-live="polite">Пересчёт…</span>
+			{/if}
 		</div>
 		<DownloadButton
 			image={result}
@@ -88,5 +91,17 @@
 		align-items: center;
 		justify-content: center;
 		min-height: 16rem;
+		position: relative;
+	}
+
+	.recalc {
+		position: absolute;
+		top: var(--space-2);
+		right: var(--space-2);
+		padding: 2px var(--space-2);
+		border-radius: var(--radius-s);
+		background: color-mix(in srgb, var(--accent) 12%, var(--surface));
+		color: var(--accent);
+		font-size: var(--text-xs);
 	}
 </style>