refactor: extract RemoveBgControls for DRY reuse in pipeline steps

Extract the settings controls (subject type, quality, background color)
from RemoveBgSettings into a shared RemoveBgControls component that
accepts settings + onChange props. Both the standalone tool page and the
pipeline step configurator now render the same component, so the UI is
identical and changes only need to be made in one place.

apps/web/src/components/tools/pipeline-step-settings.tsx

@@ -1,3 +1,5 @@
+import { RemoveBgControls } from "./remove-bg-settings";
+
 type FieldType = "number" | "select" | "boolean" | "text" | "color";
 
 interface FieldDef {
@@ -479,27 +481,7 @@ const TOOL_FIELDS: Record<string, FieldDef[]> = {
     { key: "background", label: "Background", type: "color", defaultValue: "#FFFFFF" },
   ],
 
-  "remove-background": [
-    {
-      key: "model",
-      label: "AI Model",
-      type: "select",
-      defaultValue: "birefnet-general-lite",
-      options: [
-        { value: "u2net", label: "Fast (u2net)" },
-        { value: "birefnet-general-lite", label: "Balanced (general)" },
-        { value: "birefnet-general", label: "Best (general)" },
-        { value: "birefnet-portrait", label: "Portrait / Passport" },
-        { value: "bria-rmbg", label: "Products (bria)" },
-      ],
-    },
-    {
-      key: "backgroundColor",
-      label: "Background color",
-      type: "color",
-      defaultValue: "",
-    },
-  ],
+  // remove-background uses its own shared controls component (DRY)
   favicon: [],
   "color-palette": [],
   "barcode-read": [],
@@ -514,6 +496,11 @@ interface PipelineStepSettingsProps {
 }
 
 export function PipelineStepSettings({ toolId, settings, onChange }: PipelineStepSettingsProps) {
+  // Tools with their own shared controls component (DRY - same UI as standalone page)
+  if (toolId === "remove-background") {
+    return <RemoveBgControls settings={settings} onChange={onChange} />;
+  }
+
   const fields = TOOL_FIELDS[toolId];
 
   if (!fields || fields.length === 0) {