diff --git a/web/app.py b/web/app.py
index 80bb096..51200dc 100644
--- a/web/app.py
+++ b/web/app.py
@@ -17,7 +17,7 @@ from uuid import UUID, uuid4
 # Allow importing legal_mcp from the MCP server source
 sys.path.insert(0, str(Path(__file__).resolve().parent.parent / "mcp-server" / "src"))
 
-from fastapi import FastAPI, File, HTTPException, UploadFile
+from fastapi import FastAPI, File, Form, HTTPException, UploadFile
 from fastapi.responses import FileResponse, StreamingResponse
 from fastapi.staticfiles import StaticFiles
 from pydantic import BaseModel
@@ -26,6 +26,12 @@ from legal_mcp import config
 from legal_mcp.services import chunker, db, embeddings, extractor, processor
 from legal_mcp.tools import cases as cases_tools, search as search_tools, workflow as workflow_tools, drafting as drafting_tools
 
+# Import integration clients (same directory)
+_web_dir = Path(__file__).resolve().parent
+sys.path.insert(0, str(_web_dir.parent))
+from web.gitea_client import create_repo, setup_remote_and_push
+from web.paperclip_client import create_project as pc_create_project, get_project_url
+
 
 logger = logging.getLogger(__name__)
 
@@ -178,17 +184,34 @@ async def health():
 
 
 @app.get("/api/cases")
-async def list_cases():
-    """List existing cases for the dropdown."""
+async def list_cases(detail: bool = False):
+    """List existing cases. With detail=true, includes doc counts and integration URLs."""
     cases = await db.list_cases()
-    return [
-        {
-            "case_number": c["case_number"],
-            "title": c["title"],
-            "status": c["status"],
-        }
-        for c in cases
-    ]
+    if not detail:
+        return [
+            {"case_number": c["case_number"], "title": c["title"], "status": c["status"]}
+            for c in cases
+        ]
+    # Enhanced listing with document counts
+    pool = await db.get_pool()
+    result = []
+    async with pool.acquire() as conn:
+        for c in cases:
+            case_id = UUID(c["id"])
+            doc_count = await conn.fetchval(
+                "SELECT count(*) FROM documents WHERE case_id = $1", case_id
+            )
+            result.append({
+                "case_number": c["case_number"],
+                "title": c["title"],
+                "status": c["status"],
+                "expected_outcome": c.get("expected_outcome", ""),
+                "committee_type": c.get("committee_type", ""),
+                "hearing_date": str(c["hearing_date"]) if c.get("hearing_date") else "",
+                "document_count": doc_count,
+                "gitea_url": f"https://gitea.nautilus.marcusgroup.org/cases/{c['case_number']}",
+            })
+    return result
 
 
 # ── Paperclip Integration API ─────────────────────────────────────
@@ -546,6 +569,187 @@ async def api_document_text(doc_id: str):
     return {"doc_id": doc_id, "text": text}
 
 
+# ── Integration Endpoints — Gitea & Paperclip ────────────────────
+
+
+DOC_TYPE_NAMES = {
+    "appeal": "כתב-ערר",
+    "response": "תשובת",
+    "protocol": "פרוטוקול-דיון",
+    "plan": "תכנית",
+    "decision": "החלטה",
+    "court_decision": "פסק-דין",
+    "permit": "היתר",
+    "appraisal": "שומה",
+    "exhibit": "נספח",
+    "objection": "התנגדות",
+    "reference": "מסמך-עזר",
+}
+
+
+def generate_doc_filename(doc_type: str, case_number: str, party_name: str = "", ext: str = ".pdf") -> str:
+    """Generate a clear Hebrew filename for a document."""
+    base = DOC_TYPE_NAMES.get(doc_type, doc_type)
+    parts = [base]
+    if party_name:
+        safe_party = re.sub(r"[^\w\u0590-\u05FF\s]", "", party_name).strip().replace(" ", "-")
+        parts.append(safe_party)
+    parts.append(case_number)
+    return "-".join(parts) + ext
+
+
+class GiteaRepoRequest(BaseModel):
+    case_number: str
+    title: str
+    description: str = ""
+
+
+@app.post("/api/integrations/gitea/create-repo")
+async def api_gitea_create_repo(req: GiteaRepoRequest):
+    """Create a Gitea repo in the 'cases' org and link it to the local case directory."""
+    try:
+        repo = await create_repo(req.case_number, req.title, req.description)
+    except Exception as e:
+        raise HTTPException(502, f"Gitea error: {e}")
+
+    clone_url = repo.get("clone_url") or repo.get("html_url", "")
+    case_dir = config.CASES_DIR / req.case_number
+
+    pushed = False
+    if case_dir.exists():
+        pushed = setup_remote_and_push(case_dir, clone_url)
+
+    return {
+        "repo_url": repo.get("html_url", ""),
+        "clone_url": clone_url,
+        "pushed": pushed,
+    }
+
+
+class PaperclipProjectRequest(BaseModel):
+    case_number: str
+    title: str
+    description: str = ""
+    appeal_type: str = "רישוי"
+
+
+@app.post("/api/integrations/paperclip/create-project")
+async def api_paperclip_create_project(req: PaperclipProjectRequest):
+    """Create a project in Paperclip's embedded DB."""
+    try:
+        project = await pc_create_project(
+            case_number=req.case_number,
+            title=req.title,
+            description=req.description,
+            appeal_type=req.appeal_type,
+        )
+    except Exception as e:
+        raise HTTPException(502, f"Paperclip error: {e}")
+    return project
+
+
+@app.post("/api/cases/{case_number}/documents/upload-tagged")
+async def api_upload_tagged_document(
+    case_number: str,
+    file: UploadFile = File(...),
+    doc_type: str = Form("auto"),
+    party_name: str = Form(""),
+    title: str = Form(""),
+):
+    """Upload a document to a case with tagging and auto-rename."""
+    case = await db.get_case_by_number(case_number)
+    if not case:
+        raise HTTPException(404, f"תיק {case_number} לא נמצא")
+
+    if not file.filename:
+        raise HTTPException(400, "No filename provided")
+
+    ext = Path(file.filename).suffix.lower()
+    if ext not in ALLOWED_EXTENSIONS:
+        raise HTTPException(400, f"סוג קובץ לא נתמך: {ext}")
+
+    content = await file.read()
+    if len(content) > MAX_FILE_SIZE:
+        raise HTTPException(400, f"קובץ גדול מדי. מקסימום: {MAX_FILE_SIZE // (1024*1024)}MB")
+
+    # Generate smart filename
+    new_filename = generate_doc_filename(doc_type, case_number, party_name, ext)
+
+    # Save to case directory
+    case_dir = config.CASES_DIR / case_number / "documents"
+    case_dir.mkdir(parents=True, exist_ok=True)
+    dest = case_dir / new_filename
+
+    # Handle duplicates
+    counter = 1
+    while dest.exists():
+        stem = new_filename.rsplit(".", 1)[0]
+        dest = case_dir / f"{stem}-{counter}{ext}"
+        counter += 1
+
+    dest.write_bytes(content)
+
+    # Create document record
+    case_id = UUID(case["id"])
+    doc_title = title or new_filename.rsplit(".", 1)[0].replace("-", " ")
+    doc = await db.create_document(
+        case_id=case_id,
+        doc_type=doc_type if doc_type != "auto" else "reference",
+        title=doc_title,
+        file_path=str(dest),
+    )
+
+    # Process in background
+    task_id = str(uuid4())
+    _progress[task_id] = {"status": "queued", "filename": new_filename}
+    asyncio.create_task(_process_tagged_document(task_id, dest, case_number, case_id, UUID(doc["id"]), doc_type, new_filename))
+
+    return {
+        "task_id": task_id,
+        "filename": new_filename,
+        "original_name": file.filename,
+        "doc_type": doc_type,
+    }
+
+
+async def _process_tagged_document(task_id: str, dest: Path, case_number: str, case_id: UUID, doc_id: UUID, doc_type: str, display_name: str):
+    """Process an uploaded tagged document in the background."""
+    try:
+        _progress[task_id] = {"status": "processing", "filename": display_name, "step": "extracting"}
+        result = await processor.process_document(doc_id, case_id)
+
+        # Git commit + push
+        repo_dir = config.CASES_DIR / case_number
+        if repo_dir.exists():
+            env = {
+                "GIT_AUTHOR_NAME": "Ezer Mishpati", "GIT_AUTHOR_EMAIL": "legal@local",
+                "GIT_COMMITTER_NAME": "Ezer Mishpati", "GIT_COMMITTER_EMAIL": "legal@local",
+                "PATH": "/usr/bin:/bin",
+            }
+            doc_type_hebrew = DOC_TYPE_NAMES.get(doc_type, doc_type)
+            subprocess.run(["git", "add", "."], cwd=repo_dir, capture_output=True)
+            subprocess.run(
+                ["git", "commit", "-m", f"הוספת {doc_type_hebrew}: {display_name}"],
+                cwd=repo_dir, capture_output=True, env=env,
+            )
+            # Try to push to Gitea (non-blocking)
+            subprocess.run(["git", "push"], cwd=repo_dir, capture_output=True, env={
+                **env,
+                "GIT_TERMINAL_PROMPT": "0",
+            })
+
+        _progress[task_id] = {
+            "status": "completed",
+            "filename": display_name,
+            "result": result,
+            "case_number": case_number,
+            "doc_type": doc_type,
+        }
+    except Exception as e:
+        logger.exception("Processing failed for %s", display_name)
+        _progress[task_id] = {"status": "failed", "error": str(e), "filename": display_name}
+
+
 # ── Background Processing ─────────────────────────────────────────
 
 
diff --git a/web/gitea_client.py b/web/gitea_client.py
new file mode 100644
index 0000000..580b438
--- /dev/null
+++ b/web/gitea_client.py
@@ -0,0 +1,98 @@
+"""Gitea REST API client — create repos in the 'cases' org and push."""
+
+from __future__ import annotations
+
+import logging
+import os
+import subprocess
+from pathlib import Path
+
+import httpx
+
+logger = logging.getLogger(__name__)
+
+GITEA_ORG = "cases"
+
+
+def _host() -> str:
+    return os.environ.get("GITEA_HOST", "https://gitea.nautilus.marcusgroup.org")
+
+
+def _token() -> str:
+    return os.environ.get("GITEA_ACCESS_TOKEN", "")
+
+
+async def create_repo(case_number: str, title: str, description: str = "") -> dict:
+    """Create a private repo in the 'cases' org on Gitea."""
+    repo_name = case_number  # e.g. "1130-25"
+    async with httpx.AsyncClient(verify=False, timeout=30) as client:
+        resp = await client.post(
+            f"{_host()}/api/v1/orgs/{GITEA_ORG}/repos",
+            headers={"Authorization": f"token {_token()}"},
+            json={
+                "name": repo_name,
+                "description": f"ערר {case_number} — {title}"[:255],
+                "private": True,
+                "auto_init": False,
+            },
+        )
+        if resp.status_code == 409:
+            # Repo already exists — fetch it
+            resp2 = await client.get(
+                f"{_host()}/api/v1/repos/{GITEA_ORG}/{repo_name}",
+                headers={"Authorization": f"token {_token()}"},
+            )
+            resp2.raise_for_status()
+            return resp2.json()
+        resp.raise_for_status()
+        return resp.json()
+
+
+def setup_remote_and_push(case_dir: str | Path, repo_clone_url: str) -> bool:
+    """Add Gitea as remote 'origin' (or update it) and push."""
+    case_dir = Path(case_dir)
+    if not (case_dir / ".git").exists():
+        return False
+
+    env = {
+        "GIT_AUTHOR_NAME": "Ezer Mishpati",
+        "GIT_AUTHOR_EMAIL": "legal@local",
+        "GIT_COMMITTER_NAME": "Ezer Mishpati",
+        "GIT_COMMITTER_EMAIL": "legal@local",
+        "PATH": os.environ.get("PATH", "/usr/bin:/bin"),
+    }
+
+    # Inject token into clone URL for auth
+    auth_url = repo_clone_url.replace("https://", f"https://chaim:{_token()}@")
+
+    # Check if remote exists
+    result = subprocess.run(
+        ["git", "remote", "get-url", "origin"],
+        cwd=case_dir, capture_output=True, text=True,
+    )
+    if result.returncode == 0:
+        subprocess.run(
+            ["git", "remote", "set-url", "origin", auth_url],
+            cwd=case_dir, capture_output=True, env=env,
+        )
+    else:
+        subprocess.run(
+            ["git", "remote", "add", "origin", auth_url],
+            cwd=case_dir, capture_output=True, env=env,
+        )
+
+    # Push
+    push_result = subprocess.run(
+        ["git", "push", "-u", "origin", "main"],
+        cwd=case_dir, capture_output=True, text=True, env=env,
+    )
+    if push_result.returncode != 0:
+        # Try master branch
+        push_result = subprocess.run(
+            ["git", "push", "-u", "origin", "master"],
+            cwd=case_dir, capture_output=True, text=True, env=env,
+        )
+    if push_result.returncode != 0:
+        logger.warning("Git push failed: %s", push_result.stderr)
+        return False
+    return True
diff --git a/web/paperclip_client.py b/web/paperclip_client.py
new file mode 100644
index 0000000..7d45ee3
--- /dev/null
+++ b/web/paperclip_client.py
@@ -0,0 +1,77 @@
+"""Paperclip project creation via direct DB access (embedded PostgreSQL)."""
+
+from __future__ import annotations
+
+import logging
+import uuid
+
+import asyncpg
+
+logger = logging.getLogger(__name__)
+
+PAPERCLIP_DB_URL = "postgresql://paperclip:paperclip@127.0.0.1:54329/paperclip"
+
+# Company IDs from Paperclip DB
+COMPANIES = {
+    "licensing": "42a7acd0-30c5-4cbd-ac97-7424f65df294",   # CMP — רישוי ובניה
+    "betterment": "8639e837-4c9d-47fa-a76b-95788d651896",  # CMPA — היטלי השבחה
+}
+
+APPEAL_TYPE_TO_COMPANY = {
+    "רישוי": "licensing",
+    "licensing": "licensing",
+    "היטל השבחה": "betterment",
+    "betterment_levy": "betterment",
+    "פיצויים": "betterment",
+    "compensation": "betterment",
+}
+
+
+def _get_company_id(appeal_type: str) -> str:
+    key = APPEAL_TYPE_TO_COMPANY.get(appeal_type, "licensing")
+    return COMPANIES[key]
+
+
+async def create_project(
+    case_number: str,
+    title: str,
+    description: str = "",
+    appeal_type: str = "רישוי",
+    color: str = "#6366f1",
+) -> dict:
+    """Create a project in the Paperclip embedded DB."""
+    company_id = _get_company_id(appeal_type)
+    project_id = str(uuid.uuid4())
+
+    conn = await asyncpg.connect(PAPERCLIP_DB_URL)
+    try:
+        await conn.execute(
+            """INSERT INTO projects (id, company_id, name, description, status, color)
+               VALUES ($1, $2::uuid, $3, $4, 'backlog', $5)
+               ON CONFLICT DO NOTHING""",
+            project_id, company_id, f"ערר {case_number} — {title}"[:200], description[:500] if description else "", color,
+        )
+        return {
+            "id": project_id,
+            "company_id": company_id,
+            "name": f"ערר {case_number} — {title}",
+            "url": f"https://pc.nautilus.marcusgroup.org/{'CMP' if 'licensing' in appeal_type or appeal_type == 'רישוי' else 'CMPA'}/projects/{project_id}/issues",
+        }
+    finally:
+        await conn.close()
+
+
+async def get_project_url(case_number: str) -> str | None:
+    """Find existing Paperclip project for a case number."""
+    conn = await asyncpg.connect(PAPERCLIP_DB_URL)
+    try:
+        row = await conn.fetchrow(
+            "SELECT id, company_id FROM projects WHERE name LIKE $1",
+            f"%{case_number}%",
+        )
+        if row:
+            prefix = "CMP" if row["company_id"] == uuid.UUID(COMPANIES["licensing"]) else "CMPA"
+            return f"https://pc.nautilus.marcusgroup.org/{prefix}/projects/{row['id']}/issues"
+        return None
+    finally:
+        await conn.close()
diff --git a/web/static/index.html b/web/static/index.html
index 3f056e9..6bb1f24 100644
--- a/web/static/index.html
+++ b/web/static/index.html
@@ -3,7 +3,7 @@
 <head>
 <meta charset="UTF-8">
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
-<title>עוזר משפטי — העלאת מסמכים</title>
+<title>עוזר משפטי — ניהול תיקים</title>
 <style>
 * { box-sizing: border-box; margin: 0; padding: 0; }
 body {
@@ -20,433 +20,414 @@ body {
 header {
   background: #1a1a2e;
   color: #ffffff;
-  padding: 18px 32px;
+  padding: 14px 32px;
   display: flex;
   align-items: center;
   gap: 12px;
 }
-header h1 {
-  font-size: 1.25em;
-  font-weight: 600;
-  letter-spacing: -0.01em;
-}
-header .sep {
-  width: 2px;
-  height: 20px;
-  background: rgba(255,255,255,0.2);
-  border-radius: 1px;
-}
-header .subtitle {
-  font-size: 0.85em;
-  opacity: 0.6;
+header h1 { font-size: 1.25em; font-weight: 600; cursor: pointer; }
+header .sep { width: 2px; height: 20px; background: rgba(255,255,255,0.2); border-radius: 1px; }
+header .subtitle { font-size: 0.85em; opacity: 0.6; }
+header nav { margin-right: auto; display: flex; gap: 8px; }
+header nav a {
+  color: rgba(255,255,255,0.7); text-decoration: none; font-size: 0.82em;
+  padding: 4px 12px; border-radius: 4px; transition: all 0.15s;
 }
+header nav a:hover, header nav a.active { color: #fff; background: rgba(255,255,255,0.1); }
 
-/* Main Layout */
-.main {
-  flex: 1;
-  max-width: 1200px;
-  width: 100%;
-  margin: 0 auto;
-  padding: 28px 24px;
-  display: grid;
-  grid-template-columns: 1fr 1fr;
-  gap: 24px;
-  align-items: start;
-}
+/* Main */
+.main { flex: 1; max-width: 1200px; width: 100%; margin: 0 auto; padding: 28px 24px; }
+.page { display: none; }
+.page.active { display: block; }
 
 /* Cards */
 .card {
-  background: #ffffff;
-  border-radius: 10px;
+  background: #ffffff; border-radius: 10px;
   box-shadow: 0 1px 4px rgba(0,0,0,0.06), 0 0 1px rgba(0,0,0,0.08);
-  overflow: hidden;
+  overflow: hidden; margin-bottom: 16px;
 }
 .card-header {
-  padding: 14px 20px;
-  font-size: 0.9em;
-  font-weight: 600;
-  color: #1a1a2e;
-  border-bottom: 1px solid #eee;
-  display: flex;
-  align-items: center;
-  gap: 8px;
-}
-.card-header .icon {
-  font-size: 1.1em;
-}
-.card-body {
-  padding: 20px;
-}
-
-/* Upload Zone */
-.upload-zone {
-  border: 2px dashed #ccc;
-  border-radius: 10px;
-  padding: 60px 24px;
-  text-align: center;
-  cursor: pointer;
-  transition: border-color 0.2s, background 0.2s;
-  background: #fafafa;
-}
-.upload-zone:hover,
-.upload-zone.dragover {
-  border-color: #e94560;
-  background: #fff5f7;
-}
-.upload-zone .upload-icon {
-  font-size: 3em;
-  color: #ccc;
-  margin-bottom: 16px;
-  transition: color 0.2s;
-}
-.upload-zone:hover .upload-icon,
-.upload-zone.dragover .upload-icon {
-  color: #e94560;
-}
-.upload-zone h2 {
-  font-size: 1em;
-  font-weight: 500;
-  color: #555;
-  margin-bottom: 6px;
-}
-.upload-zone p {
-  font-size: 0.8em;
-  color: #aaa;
-}
-.upload-zone input[type="file"] { display: none; }
-
-.upload-progress {
-  margin-top: 16px;
-  display: none;
-}
-.upload-progress .bar {
-  height: 4px;
-  background: #eee;
-  border-radius: 2px;
-  overflow: hidden;
-}
-.upload-progress .bar-fill {
-  height: 100%;
-  background: #e94560;
-  width: 0;
-  transition: width 0.3s;
-}
-
-/* Pending Files */
-.pending-file {
-  border: 1px solid #eee;
-  border-radius: 8px;
-  padding: 16px;
-  margin-bottom: 12px;
-  background: #fafafa;
-  transition: border-color 0.2s;
-}
-.pending-file:hover {
-  border-color: #ddd;
-}
-.pending-file .file-info {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  margin-bottom: 12px;
-}
-.pending-file .file-name {
-  font-weight: 600;
-  font-size: 0.9em;
-  word-break: break-all;
-  color: #1a1a2e;
-}
-.pending-file .file-size {
-  color: #999;
-  font-size: 0.78em;
-  white-space: nowrap;
-  margin-right: 12px;
-}
-.pending-file .file-actions {
-  display: flex;
-  gap: 8px;
-  align-items: center;
-}
-
-/* Empty State */
-.empty {
-  text-align: center;
-  color: #bbb;
-  padding: 40px 20px;
-  font-size: 0.88em;
-  line-height: 1.6;
-}
-
-/* Radio Group */
-.radio-group {
-  display: flex;
-  gap: 4px;
-  margin-bottom: 12px;
-  flex-wrap: wrap;
-}
-.radio-group label {
-  display: flex;
-  align-items: center;
-  gap: 6px;
-  font-size: 0.82em;
-  cursor: pointer;
-  padding: 6px 12px;
-  border-radius: 6px;
-  border: 1px solid #eee;
-  background: #fff;
-  transition: all 0.15s;
-}
-.radio-group label:hover {
-  border-color: #e94560;
-}
-.radio-group input[type="radio"] {
-  accent-color: #e94560;
-}
-.conditional { display: none; }
-.conditional.active { display: block; }
-
-/* Form Elements */
-.form-row {
-  display: flex;
-  gap: 12px;
-  flex-wrap: wrap;
-  align-items: end;
-  margin-bottom: 10px;
-}
-.form-group {
-  flex: 1;
-  min-width: 140px;
-}
-.form-group label {
-  display: block;
-  font-size: 0.78em;
-  color: #888;
-  margin-bottom: 4px;
-  font-weight: 500;
-}
-.form-group select,
-.form-group input[type="text"],
-.form-group input[type="date"] {
-  width: 100%;
-  padding: 8px 10px;
-  border: 1px solid #ddd;
-  border-radius: 6px;
-  font-size: 0.88em;
-  font-family: inherit;
-  direction: rtl;
-  background: #fff;
-  transition: border-color 0.15s;
-}
-.form-group select:focus,
-.form-group input:focus {
-  outline: none;
-  border-color: #e94560;
-}
-
-/* Subject Grid */
-.subject-grid {
-  display: grid;
-  grid-template-columns: repeat(3, 1fr);
-  gap: 6px;
-}
-.subject-grid label {
-  font-size: 0.78em;
-  display: flex;
-  align-items: center;
-  gap: 4px;
-  cursor: pointer;
-}
-.subject-grid input[type="checkbox"] {
-  accent-color: #e94560;
+  padding: 14px 20px; font-size: 0.9em; font-weight: 600; color: #1a1a2e;
+  border-bottom: 1px solid #eee; display: flex; align-items: center; gap: 8px;
 }
+.card-body { padding: 20px; }
 
 /* Buttons */
 .btn {
-  padding: 8px 20px;
-  border: none;
-  border-radius: 6px;
-  font-size: 0.88em;
-  font-family: inherit;
-  cursor: pointer;
-  transition: all 0.15s;
-  font-weight: 500;
+  padding: 8px 20px; border: none; border-radius: 6px; font-size: 0.88em;
+  font-family: inherit; cursor: pointer; transition: all 0.15s; font-weight: 500;
 }
-.btn-primary {
-  background: #e94560;
-  color: #fff;
+.btn-primary { background: #e94560; color: #fff; }
+.btn-primary:hover { background: #d6304a; }
+.btn-secondary { background: #eee; color: #1a1a2e; }
+.btn-secondary:hover { background: #ddd; }
+.btn-outline { background: transparent; color: #e94560; border: 1px solid #e94560; }
+.btn-outline:hover { background: #fff0f3; }
+.btn-sm { padding: 4px 12px; font-size: 0.78em; }
+.btn:disabled { opacity: 0.4; cursor: not-allowed; }
+.btn-success { background: #27ae60; color: #fff; }
+
+/* Form Elements */
+.form-row { display: flex; gap: 12px; flex-wrap: wrap; align-items: end; margin-bottom: 14px; }
+.form-group { flex: 1; min-width: 160px; }
+.form-group label { display: block; font-size: 0.78em; color: #888; margin-bottom: 4px; font-weight: 500; }
+.form-group select, .form-group input[type="text"], .form-group input[type="date"], .form-group textarea {
+  width: 100%; padding: 8px 10px; border: 1px solid #ddd; border-radius: 6px;
+  font-size: 0.88em; font-family: inherit; direction: rtl; background: #fff; transition: border-color 0.15s;
 }
-.btn-primary:hover {
-  background: #d6304a;
+.form-group textarea { resize: vertical; min-height: 60px; }
+.form-group select:focus, .form-group input:focus, .form-group textarea:focus { outline: none; border-color: #e94560; }
+
+/* ── Case List ─────────────────────────────────────────── */
+.case-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 16px; }
+.case-card {
+  background: #fff; border-radius: 10px; padding: 20px; cursor: pointer;
+  box-shadow: 0 1px 4px rgba(0,0,0,0.06); transition: box-shadow 0.2s, transform 0.15s;
+  border-right: 4px solid #e94560;
 }
-.btn-danger {
-  background: transparent;
-  color: #e94560;
-  border: 1px solid #e94560;
-  font-size: 0.78em;
-  padding: 4px 10px;
+.case-card:hover { box-shadow: 0 4px 16px rgba(0,0,0,0.1); transform: translateY(-2px); }
+.case-card .case-number { font-size: 1.1em; font-weight: 700; color: #e94560; }
+.case-card .case-title { font-size: 0.9em; color: #555; margin: 6px 0; line-height: 1.4; }
+.case-card .case-meta { font-size: 0.78em; color: #999; display: flex; gap: 16px; flex-wrap: wrap; }
+.case-card .badge {
+  display: inline-block; padding: 2px 8px; border-radius: 4px;
+  font-size: 0.72em; font-weight: 600; background: #f0f0f0; color: #666;
 }
-.btn-danger:hover {
-  background: #fff0f3;
+.case-card .badge.new { background: #e3f2fd; color: #1976d2; }
+.case-card .badge.in_progress { background: #fff3e0; color: #f57c00; }
+.case-card .badge.drafted { background: #e8f5e9; color: #388e3c; }
+
+.page-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; }
+.page-header h2 { font-size: 1.2em; font-weight: 600; }
+
+/* ── Wizard ────────────────────────────────────────────── */
+.wizard-steps {
+  display: flex; gap: 0; margin-bottom: 24px;
+  background: #fff; border-radius: 10px; overflow: hidden;
+  box-shadow: 0 1px 4px rgba(0,0,0,0.06);
 }
-.btn:disabled {
-  opacity: 0.4;
-  cursor: not-allowed;
+.wizard-step {
+  flex: 1; padding: 12px 16px; text-align: center; font-size: 0.82em; color: #999;
+  border-bottom: 3px solid transparent; transition: all 0.2s;
+}
+.wizard-step.active { color: #e94560; border-bottom-color: #e94560; font-weight: 600; }
+.wizard-step.done { color: #27ae60; border-bottom-color: #27ae60; }
+.wizard-panel { display: none; }
+.wizard-panel.active { display: block; }
+.wizard-nav { display: flex; justify-content: space-between; margin-top: 20px; }
+
+/* Dynamic list (appellants/respondents) */
+.dynamic-list { margin-bottom: 12px; }
+.dynamic-list .item { display: flex; gap: 8px; align-items: center; margin-bottom: 6px; }
+.dynamic-list .item input { flex: 1; }
+.dynamic-list .remove-btn {
+  background: none; border: none; color: #e94560; cursor: pointer; font-size: 1.1em; padding: 4px;
 }
 
-/* Task Items */
+/* ── Case View ─────────────────────────────────────────── */
+.case-header-bar {
+  background: #fff; border-radius: 10px; padding: 20px; margin-bottom: 16px;
+  box-shadow: 0 1px 4px rgba(0,0,0,0.06);
+  display: flex; justify-content: space-between; align-items: start; gap: 20px;
+}
+.case-header-bar .info h2 { font-size: 1.15em; margin-bottom: 6px; }
+.case-header-bar .info .meta { font-size: 0.82em; color: #888; display: flex; gap: 16px; flex-wrap: wrap; }
+.case-header-bar .links { display: flex; gap: 8px; flex-shrink: 0; }
+.case-header-bar .links a {
+  font-size: 0.78em; padding: 4px 10px; border-radius: 4px;
+  text-decoration: none; border: 1px solid #ddd; color: #555; transition: all 0.15s;
+}
+.case-header-bar .links a:hover { border-color: #e94560; color: #e94560; }
+
+.doc-group { margin-bottom: 16px; }
+.doc-group-header {
+  font-size: 0.85em; font-weight: 600; color: #555; padding: 8px 0;
+  border-bottom: 1px solid #eee; margin-bottom: 8px;
+  display: flex; justify-content: space-between;
+}
+.doc-group-header .count { font-weight: 400; color: #999; }
+.doc-item {
+  display: flex; align-items: center; gap: 10px; padding: 8px 12px;
+  border-radius: 6px; transition: background 0.15s; font-size: 0.85em;
+}
+.doc-item:hover { background: #f8f8f8; }
+.doc-item .doc-icon { color: #999; }
+.doc-item .doc-name { flex: 1; }
+.doc-item .doc-status { font-size: 0.75em; color: #999; }
+
+/* Upload zone (reusable) */
+.upload-zone {
+  border: 2px dashed #ccc; border-radius: 10px; padding: 40px 24px;
+  text-align: center; cursor: pointer; transition: border-color 0.2s, background 0.2s; background: #fafafa;
+}
+.upload-zone:hover, .upload-zone.dragover { border-color: #e94560; background: #fff5f7; }
+.upload-zone h3 { font-size: 0.95em; font-weight: 500; color: #555; margin-bottom: 4px; }
+.upload-zone p { font-size: 0.78em; color: #aaa; }
+.upload-zone input[type="file"] { display: none; }
+
+/* Pending upload items in case view */
+.pending-upload {
+  border: 1px solid #eee; border-radius: 8px; padding: 14px; margin-bottom: 10px; background: #fafafa;
+}
+.pending-upload .file-row { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; }
+.pending-upload .file-name { font-weight: 600; font-size: 0.88em; word-break: break-all; }
+.pending-upload .tag-row { display: flex; gap: 10px; align-items: end; flex-wrap: wrap; }
+.pending-upload .tag-row .form-group { min-width: 120px; }
+
+/* Processing tasks */
 .task-item {
-  display: flex;
-  align-items: center;
-  gap: 12px;
-  padding: 12px;
-  border: 1px solid #eee;
-  border-radius: 8px;
-  margin-bottom: 8px;
-  background: #fafafa;
+  display: flex; align-items: center; gap: 12px; padding: 12px;
+  border: 1px solid #eee; border-radius: 8px; margin-bottom: 8px; background: #fafafa;
 }
 .task-item .spinner {
-  width: 20px;
-  height: 20px;
-  border: 2.5px solid #eee;
-  border-top-color: #e94560;
-  border-radius: 50%;
-  animation: spin 0.8s linear infinite;
-  flex-shrink: 0;
-}
-.task-item.done .spinner {
-  border-color: #27ae60;
-  border-top-color: #27ae60;
-  animation: none;
-}
-.task-item.failed .spinner {
-  border-color: #e94560;
-  border-top-color: #e94560;
-  animation: none;
+  width: 20px; height: 20px; border: 2.5px solid #eee; border-top-color: #e94560;
+  border-radius: 50%; animation: spin 0.8s linear infinite; flex-shrink: 0;
 }
+.task-item.done .spinner { border-color: #27ae60; border-top-color: #27ae60; animation: none; }
+.task-item.failed .spinner { border-color: #e94560; border-top-color: #e94560; animation: none; }
 @keyframes spin { to { transform: rotate(360deg); } }
 .task-info { flex: 1; min-width: 0; }
-.task-info .task-name {
-  font-size: 0.88em;
-  font-weight: 500;
-  color: #1a1a2e;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-}
-.task-info .task-status {
-  font-size: 0.78em;
-  color: #999;
-  margin-top: 2px;
-}
+.task-info .task-name { font-size: 0.85em; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
+.task-info .task-status { font-size: 0.75em; color: #999; margin-top: 2px; }
+
+/* Creation progress in wizard */
+.creation-steps { list-style: none; }
+.creation-steps li { padding: 8px 0; font-size: 0.88em; display: flex; align-items: center; gap: 8px; }
+.creation-steps li .step-icon { width: 20px; text-align: center; }
+.creation-steps li.pending .step-icon { color: #ccc; }
+.creation-steps li.running .step-icon { color: #e94560; }
+.creation-steps li.done .step-icon { color: #27ae60; }
+.creation-steps li.error .step-icon { color: #e94560; }
 
 /* Status Bar */
 .status-bar {
-  background: #1a1a2e;
-  color: rgba(255,255,255,0.5);
-  font-size: 0.75em;
-  padding: 8px 32px;
-  display: flex;
-  gap: 24px;
-  align-items: center;
-}
-.status-bar .stat {
-  display: flex;
-  align-items: center;
-  gap: 6px;
-}
-.status-bar .stat-value {
-  color: rgba(255,255,255,0.85);
-  font-weight: 600;
+  background: #1a1a2e; color: rgba(255,255,255,0.5); font-size: 0.75em;
+  padding: 8px 32px; display: flex; gap: 24px; align-items: center;
 }
+.status-bar .stat { display: flex; align-items: center; gap: 6px; }
+.status-bar .stat-value { color: rgba(255,255,255,0.85); font-weight: 600; }
 
 /* Toast */
 .toast {
-  position: fixed;
-  bottom: 60px;
-  left: 50%;
-  transform: translateX(-50%) translateY(10px);
-  background: #1a1a2e;
-  color: white;
-  padding: 10px 24px;
-  border-radius: 8px;
-  font-size: 0.85em;
-  z-index: 1000;
-  opacity: 0;
-  transition: opacity 0.3s, transform 0.3s;
-  pointer-events: none;
-}
-.toast.show {
-  opacity: 1;
-  transform: translateX(-50%) translateY(0);
+  position: fixed; bottom: 60px; left: 50%; transform: translateX(-50%) translateY(10px);
+  background: #1a1a2e; color: white; padding: 10px 24px; border-radius: 8px;
+  font-size: 0.85em; z-index: 1000; opacity: 0; transition: opacity 0.3s, transform 0.3s; pointer-events: none;
 }
+.toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }
 .toast.error { background: #e94560; }
 .toast.success { background: #27ae60; }
 
-/* Responsive */
+.empty { text-align: center; color: #bbb; padding: 40px 20px; font-size: 0.88em; line-height: 1.6; }
+
 @media (max-width: 800px) {
-  .main {
-    grid-template-columns: 1fr;
-    padding: 16px;
-  }
+  .main { padding: 16px; }
   header { padding: 14px 16px; }
   .status-bar { padding: 8px 16px; flex-wrap: wrap; gap: 12px; }
+  .case-grid { grid-template-columns: 1fr; }
+  .wizard-steps { flex-wrap: wrap; }
 }
 </style>
 </head>
 <body>
 
 <header>
-  <h1>עוזר משפטי</h1>
+  <h1 onclick="navigate('/')">עוזר משפטי</h1>
   <div class="sep"></div>
-  <span class="subtitle">העלאת מסמכים</span>
+  <span class="subtitle" id="pageSubtitle">ניהול תיקים</span>
+  <nav>
+    <a href="#/" id="navHome">תיקים</a>
+    <a href="#/new" id="navNew">+ תיק חדש</a>
+    <a href="#/upload" id="navUpload">העלאה</a>
+  </nav>
 </header>
 
 <div class="main">
-  <!-- Right Column (visually) — Upload -->
-  <div>
-    <div class="card">
-      <div class="card-body">
-        <div class="upload-zone" id="dropZone">
-          <div class="upload-icon">&#128196;</div>
-          <h2>גרור קבצים לכאן או לחץ לבחירה</h2>
-          <p>PDF, DOCX, RTF, TXT — עד 50MB</p>
-          <input type="file" id="fileInput" multiple accept=".pdf,.docx,.rtf,.txt">
-          <div class="upload-progress" id="uploadProgress">
-            <div class="bar"><div class="bar-fill" id="uploadBar"></div></div>
-          </div>
-        </div>
-      </div>
+  <!-- ══ Page: Case List ══ -->
+  <div class="page" id="page-home">
+    <div class="page-header">
+      <h2>תיקי ערר</h2>
+      <button class="btn btn-primary" onclick="navigate('/new')">+ תיק חדש</button>
     </div>
-
-    <!-- Processing Tasks -->
-    <div class="card" id="tasksCard" style="display:none; margin-top: 16px;">
-      <div class="card-header">עיבוד</div>
-      <div class="card-body" id="tasksList"></div>
+    <div class="case-grid" id="caseGrid">
+      <div class="empty">טוען תיקים...</div>
     </div>
   </div>
 
-  <!-- Left Column (visually) — Pending Files -->
-  <div>
-    <div class="card" id="pendingCard" style="display:none">
-      <div class="card-header">קבצים ממתינים לסיווג</div>
-      <div class="card-body" id="pendingList">
-        <div class="empty">אין קבצים ממתינים</div>
+  <!-- ══ Page: New Case Wizard ══ -->
+  <div class="page" id="page-new">
+    <div class="wizard-steps">
+      <div class="wizard-step active" data-step="1">1. פרטי תיק</div>
+      <div class="wizard-step" data-step="2">2. צדדים</div>
+      <div class="wizard-step" data-step="3">3. לוח זמנים</div>
+      <div class="wizard-step" data-step="4">4. סיכום ויצירה</div>
+    </div>
+
+    <!-- Step 1: Case Details -->
+    <div class="wizard-panel active" id="wiz-step-1">
+      <div class="card"><div class="card-body">
+        <div class="form-row">
+          <div class="form-group" style="max-width:180px">
+            <label>מספר תיק *</label>
+            <input type="text" id="wiz-case-number" placeholder="1130-25" dir="ltr">
+          </div>
+          <div class="form-group">
+            <label>כותרת *</label>
+            <input type="text" id="wiz-title" placeholder="ערר על אישור תכנית להוספת קומה">
+          </div>
+        </div>
+        <div class="form-row">
+          <div class="form-group">
+            <label>סוג ערר</label>
+            <select id="wiz-committee-type">
+              <option value="רישוי">רישוי ובניה</option>
+              <option value="היטל השבחה">היטל השבחה</option>
+              <option value="פיצויים">פיצויים (ס' 197)</option>
+            </select>
+          </div>
+          <div class="form-group">
+            <label>כתובת נכס</label>
+            <input type="text" id="wiz-address" placeholder="רח' אבינדב 23, קריית יערים">
+          </div>
+          <div class="form-group" style="max-width:180px">
+            <label>מספר היתר/תכנית</label>
+            <input type="text" id="wiz-permit" placeholder="152-1257682" dir="ltr">
+          </div>
+        </div>
+      </div></div>
+      <div class="wizard-nav">
+        <span></span>
+        <button class="btn btn-primary" onclick="wizNext()">הבא &larr;</button>
       </div>
     </div>
 
-    <div class="card" id="emptyCard">
-      <div class="card-body">
-        <div class="empty">
-          העלה מסמכים באמצעות אזור הגרירה<br>
-          הקבצים יופיעו כאן לסיווג ועיבוד
+    <!-- Step 2: Parties -->
+    <div class="wizard-panel" id="wiz-step-2">
+      <div class="card"><div class="card-header">עוררים</div><div class="card-body">
+        <div class="dynamic-list" id="appellantsList">
+          <div class="item"><input type="text" placeholder="שם עורר"><button class="remove-btn" onclick="removeItem(this)">&times;</button></div>
         </div>
+        <button class="btn btn-sm btn-secondary" onclick="addItem('appellantsList')">+ הוסף עורר</button>
+      </div></div>
+      <div class="card"><div class="card-header">משיבים</div><div class="card-body">
+        <div class="dynamic-list" id="respondentsList">
+          <div class="item"><input type="text" placeholder="שם משיב"><button class="remove-btn" onclick="removeItem(this)">&times;</button></div>
+        </div>
+        <button class="btn btn-sm btn-secondary" onclick="addItem('respondentsList')">+ הוסף משיב</button>
+      </div></div>
+      <div class="wizard-nav">
+        <button class="btn btn-secondary" onclick="wizPrev()">&rarr; הקודם</button>
+        <button class="btn btn-primary" onclick="wizNext()">הבא &larr;</button>
       </div>
     </div>
+
+    <!-- Step 3: Schedule -->
+    <div class="wizard-panel" id="wiz-step-3">
+      <div class="card"><div class="card-body">
+        <div class="form-row">
+          <div class="form-group" style="max-width:200px">
+            <label>תאריך דיון</label>
+            <input type="date" id="wiz-hearing-date">
+          </div>
+          <div class="form-group">
+            <label>תוצאה צפויה</label>
+            <select id="wiz-outcome">
+              <option value="">לא הוגדר</option>
+              <option value="rejection">דחייה</option>
+              <option value="partial_acceptance">קבלה חלקית</option>
+              <option value="full_acceptance">קבלה מלאה</option>
+              <option value="betterment_levy">היטל השבחה</option>
+            </select>
+          </div>
+        </div>
+        <div class="form-group">
+          <label>הערות</label>
+          <textarea id="wiz-notes" rows="3" placeholder="הערות חופשיות..."></textarea>
+        </div>
+      </div></div>
+      <div class="wizard-nav">
+        <button class="btn btn-secondary" onclick="wizPrev()">&rarr; הקודם</button>
+        <button class="btn btn-primary" onclick="wizNext()">הבא &larr;</button>
+      </div>
+    </div>
+
+    <!-- Step 4: Review & Create -->
+    <div class="wizard-panel" id="wiz-step-4">
+      <div class="card"><div class="card-header">סיכום</div><div class="card-body">
+        <div id="wizSummary"></div>
+      </div></div>
+      <div class="card"><div class="card-header">יצירה אוטומטית</div><div class="card-body">
+        <ul class="creation-steps" id="creationSteps">
+          <li class="pending" id="cs-db"><span class="step-icon">&#9711;</span> יצירת תיק במסד הנתונים</li>
+          <li class="pending" id="cs-gitea"><span class="step-icon">&#9711;</span> יצירת Repository ב-Gitea</li>
+          <li class="pending" id="cs-paperclip"><span class="step-icon">&#9711;</span> יצירת פרויקט ב-Paperclip</li>
+        </ul>
+        <div style="margin-top:16px">
+          <button class="btn btn-success" id="createCaseBtn" onclick="createCase()">צור תיק</button>
+        </div>
+      </div></div>
+      <div class="wizard-nav">
+        <button class="btn btn-secondary" onclick="wizPrev()">&rarr; הקודם</button>
+        <span></span>
+      </div>
+    </div>
+  </div>
+
+  <!-- ══ Page: Case View ══ -->
+  <div class="page" id="page-case">
+    <div class="case-header-bar" id="caseHeaderBar">
+      <div class="info">
+        <h2 id="caseViewTitle">טוען...</h2>
+        <div class="meta" id="caseViewMeta"></div>
+      </div>
+      <div class="links" id="caseViewLinks"></div>
+    </div>
+
+    <!-- Upload to case -->
+    <div class="card">
+      <div class="card-header">העלאת מסמכים</div>
+      <div class="card-body">
+        <div class="upload-zone" id="caseDropZone">
+          <h3>גרור קבצים לכאן או לחץ לבחירה</h3>
+          <p>PDF, DOCX, RTF, TXT — עד 50MB</p>
+          <input type="file" id="caseFileInput" multiple accept=".pdf,.docx,.rtf,.txt">
+        </div>
+        <div id="casePendingUploads" style="margin-top: 12px"></div>
+        <div id="caseTasks" style="margin-top: 12px"></div>
+      </div>
+    </div>
+
+    <!-- Documents list -->
+    <div class="card">
+      <div class="card-header">מסמכים בתיק</div>
+      <div class="card-body" id="caseDocsList">
+        <div class="empty">אין מסמכים</div>
+      </div>
+    </div>
+  </div>
+
+  <!-- ══ Page: Legacy Upload ══ -->
+  <div class="page" id="page-upload">
+    <div class="card"><div class="card-body">
+      <div class="upload-zone" id="legacyDropZone">
+        <div style="font-size:3em;color:#ccc;margin-bottom:16px">&#128196;</div>
+        <h3>גרור קבצים לכאן או לחץ לבחירה</h3>
+        <p>PDF, DOCX, RTF, TXT — עד 50MB</p>
+        <input type="file" id="legacyFileInput" multiple accept=".pdf,.docx,.rtf,.txt">
+      </div>
+    </div></div>
+    <div class="card" id="legacyPendingCard" style="display:none">
+      <div class="card-header">קבצים ממתינים לסיווג</div>
+      <div class="card-body" id="legacyPendingList"></div>
+    </div>
+    <div class="card" id="legacyTasksCard" style="display:none">
+      <div class="card-header">עיבוד</div>
+      <div class="card-body" id="legacyTasksList"></div>
+    </div>
   </div>
 </div>
 
 <!-- Status Bar -->
-<div class="status-bar" id="statusBar">
+<div class="status-bar">
   <div class="stat">תיקים: <span class="stat-value" id="statCases">—</span></div>
   <div class="stat">מסמכים: <span class="stat-value" id="statDocs">—</span></div>
   <div class="stat">קטעים: <span class="stat-value" id="statChunks">—</span></div>
@@ -456,317 +437,588 @@ header .subtitle {
 
 <script>
 const API = '/api';
+let currentCaseNumber = '';
 
-// ── Upload Zone ───────────────────────────────────────────────
-const dropZone = document.getElementById('dropZone');
-const fileInput = document.getElementById('fileInput');
-const uploadProgress = document.getElementById('uploadProgress');
-const uploadBar = document.getElementById('uploadBar');
+// ── Router ───────────────────────────────────────────────
+function navigate(path) {
+  window.location.hash = path;
+}
 
-dropZone.addEventListener('click', () => fileInput.click());
-dropZone.addEventListener('dragover', e => { e.preventDefault(); dropZone.classList.add('dragover'); });
-dropZone.addEventListener('dragleave', () => dropZone.classList.remove('dragover'));
-dropZone.addEventListener('drop', e => {
-  e.preventDefault();
-  dropZone.classList.remove('dragover');
-  handleFiles(e.dataTransfer.files);
-});
-fileInput.addEventListener('change', () => {
-  if (fileInput.files.length) handleFiles(fileInput.files);
-  fileInput.value = '';
-});
+function handleRoute() {
+  const hash = window.location.hash || '#/';
+  const pages = document.querySelectorAll('.page');
+  pages.forEach(p => p.classList.remove('active'));
 
-async function handleFiles(files) {
-  for (const file of files) {
-    await uploadFile(file);
+  // Nav links
+  document.querySelectorAll('header nav a').forEach(a => a.classList.remove('active'));
+
+  let subtitle = 'ניהול תיקים';
+
+  if (hash === '#/' || hash === '#') {
+    document.getElementById('page-home').classList.add('active');
+    document.getElementById('navHome').classList.add('active');
+    loadCaseList();
+  } else if (hash === '#/new') {
+    document.getElementById('page-new').classList.add('active');
+    document.getElementById('navNew').classList.add('active');
+    subtitle = 'תיק חדש';
+    resetWizard();
+  } else if (hash.startsWith('#/case/')) {
+    const caseNum = hash.replace('#/case/', '');
+    document.getElementById('page-case').classList.add('active');
+    subtitle = 'ערר ' + caseNum;
+    currentCaseNumber = caseNum;
+    loadCaseView(caseNum);
+  } else if (hash === '#/upload') {
+    document.getElementById('page-upload').classList.add('active');
+    document.getElementById('navUpload').classList.add('active');
+    subtitle = 'העלאת מסמכים';
+    loadLegacyPending();
   }
-  loadPending();
+
+  document.getElementById('pageSubtitle').textContent = subtitle;
 }
 
-function uploadFile(file) {
-  return new Promise((resolve, reject) => {
-    const formData = new FormData();
-    formData.append('file', file);
+window.addEventListener('hashchange', handleRoute);
+window.addEventListener('load', () => { handleRoute(); loadStatus(); });
 
-    const xhr = new XMLHttpRequest();
-    uploadProgress.style.display = 'block';
-
-    xhr.upload.onprogress = e => {
-      if (e.lengthComputable) {
-        uploadBar.style.width = (e.loaded / e.total * 100) + '%';
-      }
-    };
-    xhr.onload = () => {
-      uploadProgress.style.display = 'none';
-      uploadBar.style.width = '0';
-      if (xhr.status === 200) {
-        toast('הקובץ הועלה בהצלחה', 'success');
-        resolve();
-      } else {
-        const err = JSON.parse(xhr.responseText);
-        toast(err.detail || 'שגיאה בהעלאה', 'error');
-        reject();
-      }
-    };
-    xhr.onerror = () => {
-      uploadProgress.style.display = 'none';
-      toast('שגיאת רשת', 'error');
-      reject();
-    };
-    xhr.open('POST', API + '/upload');
-    xhr.send(formData);
-  });
-}
-
-// ── Pending Files ─────────────────────────────────────────────
-let cases = [];
-
-async function loadCases() {
+// ── Case List ────────────────────────────────────────────
+async function loadCaseList() {
+  const grid = document.getElementById('caseGrid');
   try {
-    const res = await fetch(API + '/cases');
-    cases = await res.json();
-  } catch (e) {
-    cases = [];
-  }
-}
-
-async function loadPending() {
-  const res = await fetch(API + '/uploads');
-  const files = await res.json();
-  const card = document.getElementById('pendingCard');
-  const emptyCard = document.getElementById('emptyCard');
-  const list = document.getElementById('pendingList');
-
-  if (!files.length) {
-    card.style.display = 'none';
-    emptyCard.style.display = 'block';
-    return;
-  }
-
-  card.style.display = 'block';
-  emptyCard.style.display = 'none';
-  await loadCases();
-
-  list.innerHTML = files.map(f => `
-    <div class="pending-file" data-filename="${esc(f.filename)}">
-      <div class="file-info">
-        <span class="file-name">${esc(f.filename.replace(/^\d+_/, ''))}</span>
-        <div class="file-actions">
-          <span class="file-size">${formatSize(f.size)}</span>
-          <button class="btn btn-danger" onclick="deleteFile('${esc(f.filename)}')">מחק</button>
-        </div>
-      </div>
-      <div class="radio-group">
-        <label><input type="radio" name="cat_${esc(f.filename)}" value="case" onchange="showFields(this)"> מסמך תיק</label>
-        <label><input type="radio" name="cat_${esc(f.filename)}" value="training" onchange="showFields(this)"> החלטה לאימון</label>
-        <label><input type="radio" name="cat_${esc(f.filename)}" value="dinleumi" onchange="showFields(this)"> דין לאומי</label>
-      </div>
-      <div class="conditional case-fields" id="case_${esc(f.filename)}">
-        <div class="form-row">
-          <div class="form-group">
-            <label>תיק</label>
-            <select class="case-select">
-              <option value="">בחר תיק...</option>
-              ${cases.map(c => `<option value="${esc(c.case_number)}">${esc(c.case_number)} — ${esc(c.title)}</option>`).join('')}
-            </select>
-          </div>
-          <div class="form-group">
-            <label>סוג מסמך</label>
-            <select class="doctype-select">
-              <option value="appeal">כתב ערר</option>
-              <option value="response">תשובה</option>
-              <option value="decision">החלטה</option>
-              <option value="exhibit">נספח</option>
-              <option value="reference">מסמך עזר</option>
-            </select>
-          </div>
-        </div>
-      </div>
-      <div class="conditional training-fields" id="train_${esc(f.filename)}">
-        <div class="form-row">
-          <div class="form-group">
-            <label>מספר החלטה</label>
-            <input type="text" class="decision-number" placeholder="לדוגמה: 1180+1181">
-          </div>
-          <div class="form-group">
-            <label>תאריך החלטה</label>
-            <input type="date" class="decision-date">
-          </div>
-        </div>
-        <div class="form-group" style="margin-top:8px">
-          <label>קטגוריות</label>
-          <div class="subject-grid">
-            ${['בנייה','שימוש חורג','תכנית','היתר','הקלה','חלוקה','תמ"א 38','היטל השבחה','פיצויים 197'].map(s =>
-              `<label><input type="checkbox" value="${s}"> ${s}</label>`
-            ).join('')}
-          </div>
-        </div>
-      </div>
-      <div class="conditional dinleumi-fields" id="dinleumi_${esc(f.filename)}">
-        <p style="font-size:0.82em;color:#999;margin:4px 0 8px">המטאדאטא (בית משפט, שופט, תאריך, נושא, תוצאה) תחולץ אוטומטית מתוך פסק הדין</p>
-      </div>
-      <div style="margin-top:12px">
-        <div class="form-group" style="max-width:300px;margin-bottom:10px">
-          <label>כותרת (אופציונלי)</label>
-          <input type="text" class="doc-title" placeholder="שם המסמך">
-        </div>
-        <button class="btn btn-primary process-btn" onclick="classifyFile('${esc(f.filename)}')" disabled>עבד</button>
-      </div>
-    </div>
-  `).join('');
-}
-
-function showFields(radio) {
-  const container = radio.closest('.pending-file');
-  const val = radio.value;
-
-  container.querySelector('.case-fields').classList.toggle('active', val === 'case');
-  container.querySelector('.training-fields').classList.toggle('active', val === 'training');
-  container.querySelector('.dinleumi-fields').classList.toggle('active', val === 'dinleumi');
-  container.querySelector('.process-btn').disabled = false;
-}
-
-async function deleteFile(filename) {
-  await fetch(API + '/uploads/' + encodeURIComponent(filename), { method: 'DELETE' });
-  loadPending();
-  toast('הקובץ נמחק');
-}
-
-async function classifyFile(filename) {
-  const container = document.querySelector(`.pending-file[data-filename="${filename}"]`);
-  const category = container.querySelector('input[type="radio"]:checked')?.value;
-  if (!category) return toast('יש לבחור סיווג', 'error');
-
-  let endpoint = API + '/classify';
-  let body;
-
-  if (category === 'dinleumi') {
-    endpoint = API + '/classify-dinleumi';
-    body = {
-      filename,
-      title: container.querySelector('.doc-title').value,
-    };
-  } else {
-    body = {
-      filename,
-      category,
-      title: container.querySelector('.doc-title').value,
-    };
-    if (category === 'case') {
-      body.case_number = container.querySelector('.case-select').value;
-      body.doc_type = container.querySelector('.doctype-select').value;
-      if (!body.case_number) return toast('יש לבחור תיק', 'error');
-    } else {
-      body.decision_number = container.querySelector('.decision-number').value;
-      body.decision_date = container.querySelector('.decision-date').value;
-      body.subject_categories = Array.from(container.querySelectorAll('.subject-grid input:checked')).map(cb => cb.value);
-    }
-  }
-
-  // Disable button
-  container.querySelector('.process-btn').disabled = true;
-  container.querySelector('.process-btn').textContent = 'מעבד...';
-
-  try {
-    const res = await fetch(endpoint, {
-      method: 'POST',
-      headers: { 'Content-Type': 'application/json' },
-      body: JSON.stringify(body),
-    });
-    if (!res.ok) {
-      const err = await res.json();
-      toast(err.detail || 'שגיאה', 'error');
-      container.querySelector('.process-btn').disabled = false;
-      container.querySelector('.process-btn').textContent = 'עבד';
+    const res = await fetch(API + '/cases?detail=true');
+    const cases = await res.json();
+    if (!cases.length) {
+      grid.innerHTML = '<div class="empty">אין תיקים עדיין.<br>לחץ "+ תיק חדש" כדי להתחיל.</div>';
       return;
     }
-    const data = await res.json();
-    trackTask(data.task_id, filename.replace(/^\d+_/, ''));
-    // Remove from pending after a short delay
-    setTimeout(loadPending, 500);
+    const STATUS_LABELS = {
+      new: 'חדש', in_progress: 'בתהליך', documents_ready: 'מסמכים מוכנים',
+      outcome_set: 'תוצאה נקבעה', direction_approved: 'כיוון אושר',
+      drafting: 'בכתיבה', drafted: 'טיוטה', qa_review: 'QA', reviewed: 'נבדק', final: 'סופי',
+    };
+    grid.innerHTML = cases.map(c => `
+      <div class="case-card" onclick="navigate('/case/${esc(c.case_number)}')">
+        <div style="display:flex;justify-content:space-between;align-items:center">
+          <span class="case-number">ערר ${esc(c.case_number)}</span>
+          <span class="badge ${c.status}">${STATUS_LABELS[c.status] || c.status}</span>
+        </div>
+        <div class="case-title">${esc(c.title)}</div>
+        <div class="case-meta">
+          ${c.document_count !== undefined ? `<span>${c.document_count} מסמכים</span>` : ''}
+          ${c.committee_type ? `<span>${esc(c.committee_type)}</span>` : ''}
+          ${c.hearing_date ? `<span>דיון: ${esc(c.hearing_date)}</span>` : ''}
+        </div>
+      </div>
+    `).join('');
   } catch (e) {
-    toast('שגיאת רשת', 'error');
+    grid.innerHTML = '<div class="empty">שגיאה בטעינת תיקים</div>';
   }
 }
 
-// ── Task Tracking ─────────────────────────────────────────────
-const activeTasks = new Map();
+// ── Wizard ────────────────────────────────────────────────
+let wizStep = 1;
 
-function trackTask(taskId, displayName) {
-  const card = document.getElementById('tasksCard');
-  const list = document.getElementById('tasksList');
-  card.style.display = 'block';
+function resetWizard() {
+  wizStep = 1;
+  updateWizardUI();
+  // Reset creation steps
+  document.querySelectorAll('.creation-steps li').forEach(li => {
+    li.className = 'pending';
+    li.querySelector('.step-icon').innerHTML = '&#9711;';
+  });
+  document.getElementById('createCaseBtn').disabled = false;
+}
 
-  const STATUS_LABELS = {
-    queued: 'בתור...',
-    validating: 'מאמת...',
-    copying: 'מעתיק...',
-    registering: 'רושם...',
-    processing: 'מעבד...',
-    completed: 'הושלם',
-    failed: 'נכשל',
+function updateWizardUI() {
+  document.querySelectorAll('.wizard-step').forEach(s => {
+    const step = parseInt(s.dataset.step);
+    s.classList.toggle('active', step === wizStep);
+    s.classList.toggle('done', step < wizStep);
+  });
+  document.querySelectorAll('.wizard-panel').forEach((p, i) => {
+    p.classList.toggle('active', i + 1 === wizStep);
+  });
+  if (wizStep === 4) buildSummary();
+}
+
+function wizNext() {
+  if (wizStep === 1) {
+    if (!document.getElementById('wiz-case-number').value.trim() || !document.getElementById('wiz-title').value.trim()) {
+      return toast('יש למלא מספר תיק וכותרת', 'error');
+    }
+  }
+  if (wizStep < 4) { wizStep++; updateWizardUI(); }
+}
+
+function wizPrev() {
+  if (wizStep > 1) { wizStep--; updateWizardUI(); }
+}
+
+function addItem(listId) {
+  const list = document.getElementById(listId);
+  const div = document.createElement('div');
+  div.className = 'item';
+  div.innerHTML = `<input type="text" placeholder="שם"><button class="remove-btn" onclick="removeItem(this)">&times;</button>`;
+  list.appendChild(div);
+  div.querySelector('input').focus();
+}
+
+function removeItem(btn) {
+  const list = btn.closest('.dynamic-list');
+  btn.closest('.item').remove();
+  if (!list.children.length) addItem(list.id);
+}
+
+function getListValues(listId) {
+  return Array.from(document.querySelectorAll(`#${listId} .item input`))
+    .map(i => i.value.trim()).filter(Boolean);
+}
+
+function buildSummary() {
+  const data = getWizardData();
+  const OUTCOME_LABELS = { rejection: 'דחייה', partial_acceptance: 'קבלה חלקית', full_acceptance: 'קבלה מלאה', betterment_levy: 'היטל השבחה' };
+  document.getElementById('wizSummary').innerHTML = `
+    <table style="width:100%;font-size:0.88em;border-collapse:collapse">
+      <tr><td style="padding:6px;color:#888;width:120px">מספר תיק</td><td style="padding:6px;font-weight:600">${esc(data.case_number)}</td></tr>
+      <tr><td style="padding:6px;color:#888">כותרת</td><td style="padding:6px">${esc(data.title)}</td></tr>
+      <tr><td style="padding:6px;color:#888">סוג</td><td style="padding:6px">${esc(data.committee_type)}</td></tr>
+      <tr><td style="padding:6px;color:#888">כתובת</td><td style="padding:6px">${esc(data.property_address || '—')}</td></tr>
+      <tr><td style="padding:6px;color:#888">עוררים</td><td style="padding:6px">${data.appellants.length ? data.appellants.map(esc).join(', ') : '—'}</td></tr>
+      <tr><td style="padding:6px;color:#888">משיבים</td><td style="padding:6px">${data.respondents.length ? data.respondents.map(esc).join(', ') : '—'}</td></tr>
+      <tr><td style="padding:6px;color:#888">תוצאה צפויה</td><td style="padding:6px">${OUTCOME_LABELS[data.expected_outcome] || '—'}</td></tr>
+    </table>
+  `;
+}
+
+function getWizardData() {
+  return {
+    case_number: document.getElementById('wiz-case-number').value.trim(),
+    title: document.getElementById('wiz-title').value.trim(),
+    committee_type: document.getElementById('wiz-committee-type').value,
+    property_address: document.getElementById('wiz-address').value.trim(),
+    permit_number: document.getElementById('wiz-permit').value.trim(),
+    appellants: getListValues('appellantsList'),
+    respondents: getListValues('respondentsList'),
+    hearing_date: document.getElementById('wiz-hearing-date').value,
+    expected_outcome: document.getElementById('wiz-outcome').value,
+    notes: document.getElementById('wiz-notes').value.trim(),
+  };
+}
+
+async function createCase() {
+  const data = getWizardData();
+  const btn = document.getElementById('createCaseBtn');
+  btn.disabled = true;
+  btn.textContent = 'יוצר...';
+
+  const setStep = (id, state, icon) => {
+    const li = document.getElementById(id);
+    li.className = state;
+    li.querySelector('.step-icon').innerHTML = icon;
   };
 
-  const STEP_LABELS = {
-    extracting: 'מחלץ טקסט',
-    extracting_metadata: 'מחלץ מטאדאטא מפסק הדין',
-    corpus: 'מוסיף לקורפוס',
-    chunking: 'מפצל לקטעים',
-    embedding: 'יוצר embeddings',
-  };
+  try {
+    // Step 1: Create in DB
+    setStep('cs-db', 'running', '&#9881;');
+    const dbRes = await fetch(API + '/cases/create', {
+      method: 'POST', headers: {'Content-Type': 'application/json'},
+      body: JSON.stringify(data),
+    });
+    if (!dbRes.ok) { const e = await dbRes.json(); throw new Error(e.detail || 'DB error'); }
+    setStep('cs-db', 'done', '&#10003;');
 
+    // Step 2: Gitea repo
+    setStep('cs-gitea', 'running', '&#9881;');
+    try {
+      const giteaRes = await fetch(API + '/integrations/gitea/create-repo', {
+        method: 'POST', headers: {'Content-Type': 'application/json'},
+        body: JSON.stringify({ case_number: data.case_number, title: data.title }),
+      });
+      if (giteaRes.ok) {
+        setStep('cs-gitea', 'done', '&#10003;');
+      } else {
+        setStep('cs-gitea', 'error', '&#10007;');
+      }
+    } catch (e) {
+      setStep('cs-gitea', 'error', '&#10007;');
+    }
+
+    // Step 3: Paperclip project
+    setStep('cs-paperclip', 'running', '&#9881;');
+    try {
+      const pcRes = await fetch(API + '/integrations/paperclip/create-project', {
+        method: 'POST', headers: {'Content-Type': 'application/json'},
+        body: JSON.stringify({
+          case_number: data.case_number, title: data.title,
+          appeal_type: data.committee_type,
+          description: `${data.appellants.join(', ')} נ' ${data.respondents.join(', ')}`,
+        }),
+      });
+      if (pcRes.ok) {
+        setStep('cs-paperclip', 'done', '&#10003;');
+      } else {
+        setStep('cs-paperclip', 'error', '&#10007;');
+      }
+    } catch (e) {
+      setStep('cs-paperclip', 'error', '&#10007;');
+    }
+
+    toast('התיק נוצר בהצלחה!', 'success');
+    setTimeout(() => navigate('/case/' + data.case_number), 1000);
+
+  } catch (err) {
+    setStep('cs-db', 'error', '&#10007;');
+    toast(err.message, 'error');
+    btn.disabled = false;
+    btn.textContent = 'צור תיק';
+  }
+}
+
+// ── Case View ────────────────────────────────────────────
+const DOC_TYPE_LABELS = {
+  appeal: 'כתבי ערר', response: 'כתבי תשובה', protocol: 'פרוטוקולים',
+  plan: 'תכניות', decision: 'החלטות', court_decision: 'פסקי דין',
+  permit: 'היתרים', appraisal: 'שומות', exhibit: 'נספחים',
+  objection: 'התנגדויות', reference: 'מסמכי עזר', auto: 'לא מסווג',
+};
+
+async function loadCaseView(caseNumber) {
+  try {
+    const res = await fetch(API + '/cases/' + encodeURIComponent(caseNumber) + '/details');
+    if (!res.ok) throw new Error('Case not found');
+    const data = await res.json();
+
+    document.getElementById('caseViewTitle').textContent = `ערר ${caseNumber} — ${data.title || ''}`;
+
+    const STATUS_LABELS = {
+      new: 'חדש', in_progress: 'בתהליך', documents_ready: 'מסמכים מוכנים',
+      drafted: 'טיוטה', final: 'סופי',
+    };
+    const meta = [];
+    meta.push(`<span class="badge ${data.status}">${STATUS_LABELS[data.status] || data.status}</span>`);
+    if (data.committee_type) meta.push(data.committee_type);
+    if (data.property_address) meta.push(data.property_address);
+    if (data.appellants?.length) meta.push('עוררים: ' + data.appellants.join(', '));
+    document.getElementById('caseViewMeta').innerHTML = meta.map(m => `<span>${m}</span>`).join('');
+
+    // Links
+    const links = [];
+    links.push(`<a href="https://gitea.nautilus.marcusgroup.org/cases/${caseNumber}" target="_blank">Gitea</a>`);
+    links.push(`<a href="#" onclick="openPaperclip('${esc(caseNumber)}');return false">Paperclip</a>`);
+    document.getElementById('caseViewLinks').innerHTML = links.join('');
+
+    // Documents grouped by type
+    const docs = data.documents || [];
+    if (!docs.length) {
+      document.getElementById('caseDocsList').innerHTML = '<div class="empty">אין מסמכים עדיין — העלה קבצים למעלה</div>';
+    } else {
+      const groups = {};
+      docs.forEach(d => {
+        const t = d.doc_type || 'reference';
+        if (!groups[t]) groups[t] = [];
+        groups[t].push(d);
+      });
+      const order = ['appeal','response','protocol','plan','decision','court_decision','permit','appraisal','exhibit','objection','reference'];
+      let html = '';
+      for (const type of order) {
+        if (!groups[type]) continue;
+        html += `<div class="doc-group">
+          <div class="doc-group-header">
+            <span>${DOC_TYPE_LABELS[type] || type}</span>
+            <span class="count">${groups[type].length}</span>
+          </div>`;
+        for (const doc of groups[type]) {
+          const statusIcon = doc.extraction_status === 'completed' ? '&#10003;' : '&#9711;';
+          html += `<div class="doc-item">
+            <span class="doc-icon">&#128196;</span>
+            <span class="doc-name">${esc(doc.title)}</span>
+            <span class="doc-status">${statusIcon}</span>
+          </div>`;
+        }
+        html += '</div>';
+      }
+      document.getElementById('caseDocsList').innerHTML = html;
+    }
+  } catch (e) {
+    document.getElementById('caseViewTitle').textContent = 'שגיאה בטעינת תיק';
+  }
+
+  setupCaseUpload(caseNumber);
+}
+
+async function openPaperclip(caseNumber) {
+  // Try to find the Paperclip project URL
+  try {
+    const res = await fetch(API + '/cases/' + encodeURIComponent(caseNumber) + '/details');
+    const data = await res.json();
+    // Determine company prefix from committee_type
+    const prefix = (data.committee_type === 'היטל השבחה' || data.committee_type === 'פיצויים') ? 'CMPA' : 'CMP';
+    window.open(`https://pc.nautilus.marcusgroup.org/${prefix}/projects`, '_blank');
+  } catch (e) {
+    window.open('https://pc.nautilus.marcusgroup.org', '_blank');
+  }
+}
+
+// ── Case Document Upload ─────────────────────────────────
+let casePendingFiles = [];
+
+function setupCaseUpload(caseNumber) {
+  const dropZone = document.getElementById('caseDropZone');
+  const fileInput = document.getElementById('caseFileInput');
+
+  // Remove old listeners by cloning
+  const newDrop = dropZone.cloneNode(true);
+  dropZone.parentNode.replaceChild(newDrop, dropZone);
+  const newInput = newDrop.querySelector('input[type="file"]');
+
+  newDrop.addEventListener('click', () => newInput.click());
+  newDrop.addEventListener('dragover', e => { e.preventDefault(); newDrop.classList.add('dragover'); });
+  newDrop.addEventListener('dragleave', () => newDrop.classList.remove('dragover'));
+  newDrop.addEventListener('drop', e => {
+    e.preventDefault();
+    newDrop.classList.remove('dragover');
+    addFilesToCase(e.dataTransfer.files, caseNumber);
+  });
+  newInput.addEventListener('change', () => {
+    if (newInput.files.length) addFilesToCase(newInput.files, caseNumber);
+    newInput.value = '';
+  });
+
+  casePendingFiles = [];
+  renderCasePending(caseNumber);
+}
+
+function addFilesToCase(files, caseNumber) {
+  for (const file of files) {
+    casePendingFiles.push({ file, doc_type: 'auto', party_name: '' });
+  }
+  renderCasePending(caseNumber);
+}
+
+function renderCasePending(caseNumber) {
+  const container = document.getElementById('casePendingUploads');
+  if (!casePendingFiles.length) { container.innerHTML = ''; return; }
+
+  container.innerHTML = casePendingFiles.map((pf, i) => `
+    <div class="pending-upload" data-idx="${i}">
+      <div class="file-row">
+        <span class="file-name">${esc(pf.file.name)}</span>
+        <span style="font-size:0.78em;color:#999">${formatSize(pf.file.size)}</span>
+      </div>
+      <div class="tag-row">
+        <div class="form-group" style="min-width:140px">
+          <label>סוג מסמך</label>
+          <select onchange="casePendingFiles[${i}].doc_type=this.value">
+            <option value="auto">אוטומטי</option>
+            <option value="appeal">כתב ערר</option>
+            <option value="response">תשובה</option>
+            <option value="protocol">פרוטוקול</option>
+            <option value="plan">תכנית</option>
+            <option value="decision">החלטה</option>
+            <option value="court_decision">פסק דין</option>
+            <option value="permit">היתר</option>
+            <option value="appraisal">שומה</option>
+            <option value="exhibit">נספח</option>
+            <option value="objection">התנגדות</option>
+            <option value="reference">מסמך עזר</option>
+          </select>
+        </div>
+        <div class="form-group" style="min-width:140px">
+          <label>שם צד (אופציונלי)</label>
+          <input type="text" placeholder="לדוגמה: ועדת הראל" onchange="casePendingFiles[${i}].party_name=this.value">
+        </div>
+        <button class="btn btn-sm btn-outline" onclick="removeCasePending(${i},'${esc(caseNumber)}')">&times;</button>
+      </div>
+    </div>
+  `).join('') + `
+    <div style="margin-top:12px">
+      <button class="btn btn-primary" onclick="uploadAllCaseDocs('${esc(caseNumber)}')">שייך לתיק (${casePendingFiles.length} קבצים)</button>
+    </div>
+  `;
+}
+
+function removeCasePending(idx, caseNumber) {
+  casePendingFiles.splice(idx, 1);
+  renderCasePending(caseNumber);
+}
+
+async function uploadAllCaseDocs(caseNumber) {
+  const tasksContainer = document.getElementById('caseTasks');
+  for (const pf of casePendingFiles) {
+    const formData = new FormData();
+    formData.append('file', pf.file);
+    formData.append('doc_type', pf.doc_type);
+    formData.append('party_name', pf.party_name);
+
+    try {
+      const res = await fetch(API + '/cases/' + encodeURIComponent(caseNumber) + '/documents/upload-tagged', {
+        method: 'POST', body: formData,
+      });
+      if (!res.ok) {
+        const err = await res.json();
+        toast(err.detail || 'שגיאה', 'error');
+        continue;
+      }
+      const data = await res.json();
+      trackCaseTask(data.task_id, data.filename, tasksContainer, caseNumber);
+    } catch (e) {
+      toast('שגיאת רשת', 'error');
+    }
+  }
+  casePendingFiles = [];
+  document.getElementById('casePendingUploads').innerHTML = '';
+}
+
+function trackCaseTask(taskId, displayName, container, caseNumber) {
+  const STEP_LABELS = { extracting: 'מחלץ טקסט', chunking: 'מפצל לקטעים', embedding: 'יוצר embeddings' };
   const div = document.createElement('div');
   div.className = 'task-item';
-  div.id = 'task_' + taskId;
   div.innerHTML = `
     <div class="spinner"></div>
     <div class="task-info">
       <div class="task-name">${esc(displayName)}</div>
       <div class="task-status">בתור...</div>
-    </div>
-  `;
-  list.prepend(div);
+    </div>`;
+  container.prepend(div);
 
   const es = new EventSource(API + '/progress/' + taskId);
   es.onmessage = e => {
     const data = JSON.parse(e.data);
     const statusEl = div.querySelector('.task-status');
-    let label = STATUS_LABELS[data.status] || data.status;
+    let label = { queued: 'בתור...', processing: 'מעבד...', completed: 'הושלם', failed: 'נכשל' }[data.status] || data.status;
     if (data.step) label += ' — ' + (STEP_LABELS[data.step] || data.step);
     statusEl.textContent = label;
-
     if (data.status === 'completed') {
       div.classList.add('done');
       es.close();
-      const r = data.result || {};
-      const m = data.metadata;
-      if (m && data.system === 'din-leumi') {
-        // Show extracted metadata for din-leumi
-        let metaHtml = `הושלם — ${r.chunks || 0} קטעים, ${r.pages || '?'} עמודים`;
-        const parts = [];
-        if (m.court) parts.push(m.court);
-        if (m.judge) parts.push('שופט: ' + m.judge);
-        if (m.decision_date) parts.push(m.decision_date);
-        if (m.outcome) parts.push({accepted:'התקבלה',rejected:'נדחתה',partial:'חלקית',remanded:'הוחזרה'}[m.outcome] || m.outcome);
-        if (parts.length) metaHtml += '<br><small style="color:#999">' + esc(parts.join(' | ')) + '</small>';
-        if (m.topics && m.topics.length) metaHtml += '<br><small style="color:#e94560">' + m.topics.map(t => esc(t)).join(', ') + '</small>';
-        statusEl.innerHTML = metaHtml;
-      } else if (r.chunks !== undefined) {
-        statusEl.textContent = `הושלם — ${r.chunks} קטעים, ${r.pages || '?'} עמודים`;
-      }
-      toast('העיבוד הושלם: ' + esc(displayName), 'success');
+      toast('הועלה: ' + displayName, 'success');
+      loadCaseView(caseNumber);
       loadStatus();
     } else if (data.status === 'failed') {
       div.classList.add('failed');
       es.close();
-      statusEl.textContent = 'נכשל: ' + (data.error || 'שגיאה לא ידועה');
-      toast('העיבוד נכשל', 'error');
+      statusEl.textContent = 'נכשל: ' + (data.error || 'שגיאה');
     }
   };
-  es.onerror = () => { es.close(); };
+  es.onerror = () => es.close();
 }
 
-// ── Status Bar ────────────────────────────────────────────────
+// ── Legacy Upload Page ───────────────────────────────────
+// (Simplified version of original upload functionality)
+let legacyCases = [];
+
+function setupLegacyUpload() {
+  const dropZone = document.getElementById('legacyDropZone');
+  const fileInput = document.getElementById('legacyFileInput');
+  dropZone.addEventListener('click', () => fileInput.click());
+  dropZone.addEventListener('dragover', e => { e.preventDefault(); dropZone.classList.add('dragover'); });
+  dropZone.addEventListener('dragleave', () => dropZone.classList.remove('dragover'));
+  dropZone.addEventListener('drop', e => {
+    e.preventDefault(); dropZone.classList.remove('dragover');
+    handleLegacyFiles(e.dataTransfer.files);
+  });
+  fileInput.addEventListener('change', () => {
+    if (fileInput.files.length) handleLegacyFiles(fileInput.files);
+    fileInput.value = '';
+  });
+}
+
+async function handleLegacyFiles(files) {
+  for (const file of files) {
+    const formData = new FormData();
+    formData.append('file', file);
+    try {
+      const res = await fetch(API + '/upload', { method: 'POST', body: formData });
+      if (res.ok) toast('הקובץ הועלה', 'success');
+    } catch (e) { toast('שגיאה', 'error'); }
+  }
+  loadLegacyPending();
+}
+
+async function loadLegacyPending() {
+  const res = await fetch(API + '/uploads');
+  const files = await res.json();
+  const card = document.getElementById('legacyPendingCard');
+  const list = document.getElementById('legacyPendingList');
+
+  if (!files.length) { card.style.display = 'none'; return; }
+  card.style.display = 'block';
+
+  try {
+    const casesRes = await fetch(API + '/cases');
+    legacyCases = await casesRes.json();
+  } catch (e) { legacyCases = []; }
+
+  list.innerHTML = files.map(f => `
+    <div class="pending-upload" data-filename="${esc(f.filename)}">
+      <div class="file-row">
+        <span class="file-name">${esc(f.filename.replace(/^\d+_/, ''))}</span>
+        <span style="font-size:0.78em;color:#999">${formatSize(f.size)}</span>
+      </div>
+      <div class="tag-row">
+        <div class="form-group">
+          <label>סיווג</label>
+          <select class="legacy-category" onchange="toggleLegacyFields(this)">
+            <option value="">בחר...</option>
+            <option value="case">מסמך תיק</option>
+            <option value="training">החלטה לאימון</option>
+          </select>
+        </div>
+        <div class="form-group legacy-case-field" style="display:none">
+          <label>תיק</label>
+          <select class="legacy-case-select">
+            <option value="">בחר תיק...</option>
+            ${legacyCases.map(c => `<option value="${esc(c.case_number)}">${esc(c.case_number)} — ${esc(c.title)}</option>`).join('')}
+          </select>
+        </div>
+        <div class="form-group legacy-case-field" style="display:none">
+          <label>סוג מסמך</label>
+          <select class="legacy-doctype-select">
+            <option value="appeal">כתב ערר</option>
+            <option value="response">תשובה</option>
+            <option value="decision">החלטה</option>
+            <option value="exhibit">נספח</option>
+            <option value="reference">מסמך עזר</option>
+          </select>
+        </div>
+        <button class="btn btn-sm btn-primary" onclick="processLegacyFile('${esc(f.filename)}')" disabled>עבד</button>
+      </div>
+    </div>
+  `).join('');
+}
+
+function toggleLegacyFields(select) {
+  const container = select.closest('.pending-upload');
+  const show = select.value === 'case';
+  container.querySelectorAll('.legacy-case-field').forEach(el => el.style.display = show ? 'block' : 'none');
+  container.querySelector('.btn-primary').disabled = !select.value;
+}
+
+async function processLegacyFile(filename) {
+  const container = document.querySelector(`.pending-upload[data-filename="${filename}"]`);
+  const category = container.querySelector('.legacy-category').value;
+  const body = { filename, category, title: '' };
+  if (category === 'case') {
+    body.case_number = container.querySelector('.legacy-case-select').value;
+    body.doc_type = container.querySelector('.legacy-doctype-select').value;
+    if (!body.case_number) return toast('יש לבחור תיק', 'error');
+  }
+
+  const res = await fetch(API + '/classify', {
+    method: 'POST', headers: {'Content-Type': 'application/json'}, body: JSON.stringify(body),
+  });
+  if (!res.ok) { toast('שגיאה', 'error'); return; }
+  const data = await res.json();
+
+  const tasksCard = document.getElementById('legacyTasksCard');
+  const tasksList = document.getElementById('legacyTasksList');
+  tasksCard.style.display = 'block';
+  trackCaseTask(data.task_id, filename.replace(/^\d+_/, ''), tasksList, body.case_number || '');
+  setTimeout(loadLegacyPending, 500);
+}
+
+// ── Status Bar ───────────────────────────────────────────
 async function loadStatus() {
   try {
     const res = await fetch(API + '/processing-status');
@@ -774,24 +1026,21 @@ async function loadStatus() {
     document.getElementById('statCases').textContent = data.cases ?? '—';
     document.getElementById('statDocs').textContent = data.documents ?? '—';
     document.getElementById('statChunks').textContent = data.chunks ?? '—';
-  } catch (e) {
-    // Silently ignore — status bar stays at default
-  }
+  } catch (e) {}
 }
 
-// ── Helpers ───────────────────────────────────────────────────
+// ── Helpers ──────────────────────────────────────────────
 function esc(s) {
+  if (!s) return '';
   const d = document.createElement('div');
-  d.textContent = s;
+  d.textContent = String(s);
   return d.innerHTML;
 }
-
 function formatSize(bytes) {
   if (bytes < 1024) return bytes + ' B';
   if (bytes < 1024 * 1024) return (bytes / 1024).toFixed(1) + ' KB';
   return (bytes / (1024 * 1024)).toFixed(1) + ' MB';
 }
-
 function toast(msg, type = '') {
   const el = document.getElementById('toast');
   el.textContent = msg;
@@ -799,9 +1048,8 @@ function toast(msg, type = '') {
   setTimeout(() => el.className = 'toast', 3000);
 }
 
-// Initial load
-loadPending();
-loadStatus();
+// Init legacy upload listeners
+setupLegacyUpload();
 </script>
 </body>
 </html>