Add job tracking with PostgreSQL, image storage, and review workflow

- Add PostgreSQL service to docker-compose with health check and postgres_data volume
- Mount ./ocr_images as bind volume for persistent image storage
- Add backend/database.py with schema init and get_db() context manager
- Add 5 new API endpoints: POST /api/jobs, GET /api/jobs (search), GET /api/jobs/{id},
  GET /api/jobs/{id}/image, PUT /api/jobs/{id}/review
- Jobs are saved with author/book/chapter/page metadata, auto UUID, and submitted_at timestamp
- Jobs start as 'unreviewed'; review captures edited text, reviewer name, and reviewed_at
- Add MetadataForm.jsx (author/book/chapter/page inputs) to the New Job panel
- Add JobsPanel.jsx with search/filter, paginated list, and detail pane with review form
- Add "Commit Job" button to ResultPanel (plain_ocr mode only) with success/error feedback
- Add "New Job" / "Browse Jobs" navigation to the app header

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

frontend/src/components/ResultPanel.jsx

@@ -1,10 +1,10 @@
 import { useEffect, useRef, useState, useCallback } from 'react'
 import { motion, AnimatePresence } from 'framer-motion'
-import { Copy, Download, Sparkles, Loader2, CheckCircle2, ChevronDown } from 'lucide-react'
+import { Copy, Download, Sparkles, Loader2, CheckCircle2, ChevronDown, Database } from 'lucide-react'
 import ReactMarkdown from 'react-markdown'
 import DOMPurify from 'dompurify'
 
-export default function ResultPanel({ result, loading, imagePreview, onCopy, onDownload }) {
+export default function ResultPanel({ result, loading, imagePreview, onCopy, onDownload, onCommitJob, commitLoading, commitResult }) {
   const canvasRef = useRef(null)
   const imgRef = useRef(null)
   const [showAdvanced, setShowAdvanced] = useState(false)
@@ -313,6 +313,44 @@ export default function ResultPanel({ result, loading, imagePreview, onCopy, onD
               </div>
             </details>
 
+            {/* Commit Job button (plain_ocr only) */}
+            {onCommitJob && (
+              <div className="space-y-2">
+                <motion.button
+                  onClick={onCommitJob}
+                  disabled={commitLoading || commitResult?.success}
+                  className={`w-full flex items-center justify-center gap-2 px-4 py-3 rounded-xl font-medium text-sm transition-all ${
+                    commitLoading || commitResult?.success
+                      ? 'opacity-50 cursor-not-allowed bg-white/5'
+                      : 'bg-gradient-to-r from-blue-600 to-indigo-600 hover:from-blue-500 hover:to-indigo-500'
+                  }`}
+                  whileHover={!commitLoading && !commitResult?.success ? { scale: 1.02 } : {}}
+                  whileTap={!commitLoading && !commitResult?.success ? { scale: 0.98 } : {}}
+                >
+                  {commitLoading ? (
+                    <><Loader2 className="w-4 h-4 animate-spin" /> Committing Job...</>
+                  ) : commitResult?.success ? (
+                    <><CheckCircle2 className="w-4 h-4" /> Job Committed</>
+                  ) : (
+                    <><Database className="w-4 h-4" /> Commit Job</>
+                  )}
+                </motion.button>
+
+                {commitResult?.success && (
+                  <div className="glass p-3 rounded-xl bg-green-500/10 border border-green-500/20">
+                    <p className="text-xs text-green-400">
+                      Job saved &mdash; ID: <span className="font-mono">{commitResult.job?.id}</span>
+                    </p>
+                  </div>
+                )}
+                {commitResult && !commitResult.success && (
+                  <div className="glass p-3 rounded-xl bg-red-500/10 border border-red-500/20">
+                    <p className="text-xs text-red-400">{commitResult.error}</p>
+                  </div>
+                )}
+              </div>
+            )}
+
             {/* Success indicator */}
             <motion.div
               initial={{ scale: 0.9, opacity: 0 }}