feat: add real-time preprocessing preview with side-by-side comparison

- Create PreprocessingPreview component with debounced config updates
- Show original vs preprocessed images side-by-side
- Display image quality metrics (contrast, sharpness) with quality indicators
- Add zoom controls and fullscreen view for detailed inspection
- Show auto-detected configuration when in auto mode
- Integrate preview toggle with PreprocessingSettings component
- Add i18n translations for preview panel UI

🤖 Generated with [Claude Code](https://claude.com/claude-code)

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

frontend/src/pages/ProcessingPage.tsx

@@ -11,6 +11,7 @@ import { apiClientV2 } from '@/services/apiV2'
 import { Play, CheckCircle, FileText, AlertCircle, Clock, Activity, Loader2 } from 'lucide-react'
 import LayoutModelSelector from '@/components/LayoutModelSelector'
 import PreprocessingSettings from '@/components/PreprocessingSettings'
+import PreprocessingPreview from '@/components/PreprocessingPreview'
 import TaskNotFound from '@/components/TaskNotFound'
 import { useTaskValidation } from '@/hooks/useTaskValidation'
 import type { LayoutModel, ProcessingOptions, PreprocessingMode, PreprocessingConfig } from '@/types/apiV2'
@@ -44,6 +45,7 @@ export default function ProcessingPage() {
     sharpen_strength: 1.0,
     binarize: false,
   })
+  const [showPreview, setShowPreview] = useState(false)
 
   // Start OCR processing
   const processOCRMutation = useMutation({
@@ -371,8 +373,24 @@ export default function ProcessingPage() {
             config={preprocessingConfig}
             onModeChange={setPreprocessingMode}
             onConfigChange={setPreprocessingConfig}
+            onPreview={() => setShowPreview(!showPreview)}
             disabled={processOCRMutation.isPending}
           />
+
+          {/* Preprocessing Preview */}
+          {showPreview && taskId && (
+            <PreprocessingPreview
+              taskId={taskId}
+              mode={preprocessingMode}
+              config={preprocessingConfig}
+              onAutoConfigReceived={(autoConfig) => {
+                // Only update if user hasn't switched to manual mode
+                if (preprocessingMode === 'auto') {
+                  setPreprocessingConfig(autoConfig)
+                }
+              }}
+            />
+          )}
         </div>
       )}
     </div>