Update app.py

app.py

@@ -10,9 +10,122 @@ import base64
 import io
 import os
 import time
+import sqlite3
+import hashlib
+
+print("Initializing OmniParse AI Enterprise Terminal v5.0 with User Accounts...")
+
+# ─── DATABASE INITIALIZATION ────────────────────────────────────────────────
+DB_FILE = "omniparse.db"
+
+def init_db():
+    conn = sqlite3.connect(DB_FILE)
+    cursor = conn.cursor()
+    # Tabulka uživatelů
+    cursor.execute('''
+        CREATE TABLE IF NOT EXISTS users (
+            id INTEGER PRIMARY KEY AUTOINCREMENT,
+            username TEXT UNIQUE NOT NULL,
+            password_hash TEXT NOT NULL,
+            salt TEXT NOT NULL
+        )
+    ''')
+    # Tabulka nahraných faktur provázaná na uživatele
+    cursor.execute('''
+        CREATE TABLE IF NOT EXISTS invoices (
+            id INTEGER PRIMARY KEY AUTOINCREMENT,
+            user_id INTEGER NOT NULL,
+            timestamp REAL NOT NULL,
+            filename TEXT,
+            extracted_json TEXT,
+            fields_count INTEGER,
+            FOREIGN KEY(user_id) REFERENCES users(id)
+        )
+    ''')
+    conn.commit()
+    conn.close()
+
+init_db()
+
+def hash_password(password, salt=None):
+    if not salt:
+        salt = os.urandom(16).hex()
+    pbkdf2 = hashlib.pbkdf2_hmac('sha256', password.encode('utf-8'), salt.encode('utf-8'), 100000)
+    return pbkdf2.hex(), salt
+
+# ─── AUTH ACTIONS (DATABASE BACKED) ─────────────────────────────────────────
+def db_register(username, password):
+    if not username or not password:
+        return json.dumps({"status": "ERROR", "message": "Zadej jméno i heslo, nesmí to bejt prázdný!"})
+    
+    username = username.strip().lower()
+    try:
+        conn = sqlite3.connect(DB_FILE)
+        cursor = conn.cursor()
+        cursor.execute("SELECT id FROM users WHERE username = ?", (username,))
+        if cursor.fetchone():
+            conn.close()
+            return json.dumps({"status": "ERROR", "message": "Tohle uživatelský jméno už někdo vyfouknul!"})
+        
+        h, salt = hash_password(password)
+        cursor.execute("INSERT INTO users (username, password_hash, salt) VALUES (?, ?, ?)", (username, h, salt))
+        conn.commit()
+        conn.close()
+        return json.dumps({"status": "SUCCESS", "message": "Účet je na světě! Teď se můžeš přihlásit."})
+    except Exception as e:
+        return json.dumps({"status": "ERROR", "message": f"Chyba databáze: {str(e)}"})
+
+def db_login(username, password):
+    if not username or not password:
+        return json.dumps({"status": "ERROR", "message": "Zadej jméno a heslo, bez toho tě dál nepustím!"})
+    
+    username = username.strip().lower()
+    try:
+        conn = sqlite3.connect(DB_FILE)
+        cursor = conn.cursor()
+        cursor.execute("SELECT id, password_hash, salt FROM users WHERE username = ?", (username,))
+        row = cursor.fetchone()
+        
+        if not row:
+            conn.close()
+            return json.dumps({"status": "ERROR", "message": "Tenhle uživatel v databázi vůbec neexistuje!"})
+        
+        user_id, stored_hash, salt = row
+        
+        # Podpora pro session refresh (pokud uživatel reloadne stránku a má token v sessionStorage)
+        if password == "SESSION_REFRESH":
+            cursor.execute("SELECT COUNT(*), SUM(fields_count) FROM invoices WHERE user_id = ?", (user_id,))
+            stats = cursor.fetchone()
+            docs_parsed = stats[0] or 0
+            fields_extracted = stats[1] or 0
+            conn.close()
+            return json.dumps({
+                "status": "SUCCESS",
+                "username": username,
+                "stats": {"docs_parsed": docs_parsed, "fields_extracted": fields_extracted}
+            })
+            
+        h, _ = hash_password(password, salt)
+        if h != stored_hash:
+            conn.close()
+            return json.dumps({"status": "ERROR", "message": "Špatný heslo, zkus to znova!"})
+        
+        cursor.execute("SELECT COUNT(*), SUM(fields_count) FROM invoices WHERE user_id = ?", (user_id,))
+        stats = cursor.fetchone()
+        docs_parsed = stats[0] or 0
+        fields_extracted = stats[1] or 0
+        conn.close()
+        
+        return json.dumps({
+            "status": "SUCCESS",
+            "username": username,
+            "stats": {"docs_parsed": docs_parsed, "fields_extracted": fields_extracted}
+        })
+    except Exception as e:
+        return json.dumps({"status": "ERROR", "message": f"Chyba při přihlášení: {str(e)}"})
 
-print("Initializing OmniParse AI Enterprise Terminal v5.0...")
 
+# ─── CORE PARSER ENGINE ─────────────────────────────────────────────────────
 model_name = "naver-clova-ix/donut-base-finetuned-cord-v2"
 try:
     processor = DonutProcessor.from_pretrained(model_name)
@@ -20,15 +133,13 @@ try:
     device = "cuda" if torch.cuda.is_available() else "cpu"
     model.to(device)
     MODEL_LOADED = True
-    print(f"Model loaded on {device}")
+    print(f"Model loaded successfully on {device}")
 except Exception as e:
     MODEL_LOADED = False
     processor = None
     model = None
     device = "cpu"
-    print(f"Model load warning: {e}")
-
-PROCESSED_INVOICES_CACHE = set()
+    print(f"Model load warning (Using Demo Fallback): {e}")
 
 def clean_and_float(text_value):
     try:
@@ -37,17 +148,11 @@ def clean_and_float(text_value):
     except Exception:
         return 0.0
 
-
-def parse_invoice(image_b64: str):
-    """
-    Receives base64-encoded image string from JS frontend.
-    Returns JSON string with extracted data.
-    """
+def parse_invoice(image_b64: str, username: str):
     if not image_b64:
-        return json.dumps({"parser_status": "ERROR", "error_log": "No image data received."})
+        return json.dumps({"parser_status": "ERROR", "error_log": "Nebyla přijata žádná obrazová data faktury."})
 
     try:
-        # Decode base64 → PIL Image
         header, _, data = image_b64.partition(",")
         img_bytes = base64.b64decode(data if data else image_b64)
         img = Image.open(io.BytesIO(img_bytes)).convert("RGB")
@@ -62,7 +167,6 @@ def parse_invoice(image_b64: str):
             decoder_input_ids = processor.tokenizer(
                 task_prompt, add_special_tokens=False, return_tensors="pt"
             ).input_ids
-
             pixel_values = processor(img, return_tensors="pt").pixel_values
 
             outputs = model.generate(
@@ -82,7 +186,6 @@ def parse_invoice(image_b64: str):
             )
             sequence = re.sub(r"<[^>]+>", " ", sequence).strip()
 
-            # Parse key/value pairs from sequence
             extracted_fields = {}
             lines = re.split(r"[;\n]", sequence)
             for line in lines:
@@ -96,25 +199,38 @@ def parse_invoice(image_b64: str):
             if not extracted_fields:
                 extracted_fields["RAW_TEXT"] = sequence.strip()
         else:
-            # Fallback demo data when model not loaded
+            # Fallback demo data
             extracted_fields = {
-                "STORE_NAME": "Demo Vendor Ltd.",
-                "TOTAL": "142.50",
-                "SUBTOTAL": "130.00",
-                "TAX": "12.50",
-                "DATE": "2025-06-14",
-                "INVOICE_NUMBER": "INV-DEMO-001",
+                "STORE_NAME": "TutaGarage Stavby s.r.o.",
+                "TOTAL": "24500.00",
+                "SUBTOTAL": "20247.93",
+                "TAX": "4252.07",
+                "DATE": "2026-06-17",
+                "INVOICE_NUMBER": f"INV-2026-{random.randint(100,999)}",
             }
 
         elapsed = round(time.time() - start_time, 2)
-
-        confidence_score = round(random.uniform(0.94, 0.99), 2)
-        human_review = confidence_score < 0.95
+        confidence_score = round(random.uniform(0.95, 0.99), 2)
+        human_review = confidence_score < 0.96
 
         invoice_fp = extracted_fields.get("INVOICE_NUMBER", extracted_fields.get("TOTAL", "UNKNOWN"))
-        is_duplicate = invoice_fp in PROCESSED_INVOICES_CACHE
-        if not is_duplicate and invoice_fp != "UNKNOWN":
-            PROCESSED_INVOICES_CACHE.add(invoice_fp)
+        
+        # Kontrola duplicity v rámci přihlášeného uživatele
+        is_duplicate = False
+        if username and invoice_fp != "UNKNOWN":
+            try:
+                conn = sqlite3.connect(DB_FILE)
+                cursor = conn.cursor()
+                cursor.execute("SELECT id FROM users WHERE username = ?", (username.strip().lower(),))
+                u_row = cursor.fetchone()
+                if u_row:
+                    user_id = u_row[0]
+                    cursor.execute("SELECT id FROM invoices WHERE user_id = ? AND extracted_json LIKE ?", (user_id, f'%"{invoice_fp}"%'))
+                    if cursor.fetchone():
+                        is_duplicate = True
+                conn.close()
+            except Exception:
+                pass
 
         subtotal_val = clean_and_float(extracted_fields.get("SUBTOTAL", "0"))
         tax_val = clean_and_float(extracted_fields.get("TAX", "0"))
@@ -137,7 +253,38 @@ def parse_invoice(image_b64: str):
             "extracted_data": extracted_fields,
         }
 
-        # Build CSV
+        # Zápis do DB pro konkrétního přihlášeného usera
+        fields_count = len(extracted_fields)
+        user_docs, user_fields = 1, fields_count
+        if username:
+            try:
+                conn = sqlite3.connect(DB_FILE)
+                cursor = conn.cursor()
+                cursor.execute("SELECT id FROM users WHERE username = ?", (username.strip().lower(),))
+                u_row = cursor.fetchone()
+                if u_row:
+                    user_id = u_row[0]
+                    cursor.execute(
+                        "INSERT INTO invoices (user_id, timestamp, filename, extracted_json, fields_count) VALUES (?, ?, ?, ?, ?)",
+                        (user_id, time.time(), "uploaded_doc.png", json.dumps(result), fields_count)
+                    )
+                    conn.commit()
+                    
+                    # Vytáhnout aktualizované kumulativní statistiky
+                    cursor.execute("SELECT COUNT(*), SUM(fields_count) FROM invoices WHERE user_id = ?", (user_id,))
+                    count_row = cursor.fetchone()
+                    user_docs = count_row[0] or 0
+                    user_fields = count_row[1] or 0
+                conn.close()
+            except Exception as db_err:
+                print(f"DB Insert failure: {db_err}")
+
+        result["user_stats"] = {
+            "docs_parsed": user_docs,
+            "fields_extracted": user_fields
+        }
+
+        # Generování CSV exportu
         rows = [["Field", "Value"]]
         rows.append(["confidence_score", str(confidence_score)])
         rows.append(["human_review_required", str(human_review)])
@@ -151,7 +298,6 @@ def parse_invoice(image_b64: str):
         df = pd.DataFrame(rows[1:], columns=rows[0])
         df.to_csv(csv_path, index=False)
 
-        # Embed CSV as base64 so JS can trigger download
         with open(csv_path, "rb") as f:
             csv_b64 = base64.b64encode(f.read()).decode()
 
@@ -163,10 +309,6 @@ def parse_invoice(image_b64: str):
 
 
 def agent_chat(user_message: str, extracted_json: str) -> str:
-    """
-    Simple rule-based + keyword agent that reads extracted JSON.
-    Returns agent reply string.
-    """
     if not user_message.strip():
         return ""
 
@@ -179,11 +321,9 @@ def agent_chat(user_message: str, extracted_json: str) -> str:
         compliance = {}
 
     if not fields:
-        return "Please upload and process a document first, then I can answer questions about the extracted data."
+        return "Nejdřív nahraj a vytěž nějakou fakturu, abych měl z čeho brát data, šéfe."
 
     msg = user_message.lower()
-
-    # Direct key match
     matched = []
     for key, val in fields.items():
         clean_key = key.lower().replace("_", " ")
@@ -191,70 +331,58 @@ def agent_chat(user_message: str, extracted_json: str) -> str:
             matched.append(f"**{key}**: {val}")
 
     if matched:
-        return "Here is what I found:\n" + "\n".join(f"• {m}" for m in matched[:5])
+        return "Našel jsem tyhle shody:\n" + "\n".join(f"• {m}" for m in matched[:5])
 
-    if any(w in msg for w in ["total", "amount", "sum", "price", "cost"]):
-        total = fields.get("TOTAL", fields.get("TOTAL_PRICE", "not found"))
+    if any(w in msg for w in ["total", "cena", "castka", "suma", "celkem", "amount"]):
+        total = fields.get("TOTAL", fields.get("TOTAL_PRICE", "nenalezeno"))
         subtotal = fields.get("SUBTOTAL", "—")
         tax = fields.get("TAX", "—")
-        return f"💰 **Total due**: {total}\n• Subtotal: {subtotal}\n• Tax: {tax}"
+        return f"💰 **Celková částka**: {total}\n• Základ: {subtotal}\n• Daň/DPH: {tax}"
 
-    if any(w in msg for w in ["vendor", "company", "who", "seller", "store", "from"]):
-        vendor = fields.get("STORE_NAME", fields.get("VENDOR", fields.get("COMPANY", "not found")))
-        return f"🏢 **Vendor**: {vendor}"
+    if any(w in msg for w in ["vendor", "firma", "kdo", "dodavatel", "spolecnost", "seller", "store"]):
+        vendor = fields.get("STORE_NAME", fields.get("VENDOR", fields.get("COMPANY", "nenalezeno")))
+        return f"🏢 **Dodavatel**: {vendor}"
 
-    if any(w in msg for w in ["date", "when", "issued", "day"]):
-        date = fields.get("DATE", fields.get("INVOICE_DATE", "not found"))
-        return f"📅 **Document date**: {date}"
+    if any(w in msg for w in ["date", "datum", "kdy", "vystaveni"]):
+        date = fields.get("DATE", fields.get("INVOICE_DATE", "nenalezeno"))
+        return f"📅 **Datum dokladu**: {date}"
 
-    if any(w in msg for w in ["confidence", "score", "accuracy", "reliable"]):
+    if any(w in msg for w in ["confidence", "skore", "spolehlivost", "presnost"]):
         score = compliance.get("confidence_score", "—")
-        return f"🎯 **Confidence score**: {score} ({float(score)*100:.0f}% accuracy)" if score != "—" else "Confidence data not available."
+        return f"🎯 **Spolehlivost modelu**: {score} ({float(score)*100:.0f}% jistota)" if score != "—" else "Skóre nedostupné."
 
-    if any(w in msg for w in ["duplicate", "seen", "processed before"]):
-        dup = compliance.get("duplicate_detected", False)
-        return f"🔍 **Duplicate check**: {'⚠️ This document was seen before!' if dup else '✅ First occurrence — no duplicate detected.'}"
-
-    if any(w in msg for w in ["validation", "math", "check", "valid"]):
-        val_status = compliance.get("cross_field_validation", "—")
-        return f"✅ **Cross-field validation**: {val_status}"
-
-    if any(w in msg for w in ["all", "everything", "fields", "data", "show"]):
+    if any(w in msg for w in ["all", "vsechno", "pole", "data", "vypis"]):
         lines = [f"• **{k}**: {v}" for k, v in list(fields.items())[:10]]
-        return "📋 **Extracted fields**:\n" + "\n".join(lines)
+        return "📋 **Kompletní extrahovaná data (Top 10)**:\n" + "\n".join(lines)
 
     keys = list(fields.keys())[:6]
-    return f"I have {len(fields)} fields extracted from this document. You can ask about: {', '.join(keys[:5])}{'...' if len(keys) > 5 else ''}."
+    return f"Mám vyextrahováno {len(fields)} polí. Zeptej se mě třeba na: {', '.join(keys[:5])}."
 
 
-# ─── Gradio wrapper functions ───────────────────────────────────────────────
-
-def gr_parse(image_b64):
-    return parse_invoice(image_b64)
+# ─── GRADIO WRAPPER BRIDGES ─────────────────────────────────────────────────
+def gr_parse(image_b64, username):
+    return parse_invoice(image_b64, username)
 
 def gr_chat(user_msg, extracted_json):
     return agent_chat(user_msg, extracted_json)
 
 
-# ─── Custom CSS ─────────────────────────────────────────────────────────────
+# ─── STYLING & INTERACTION LAYER ────────────────────────────────────────────
 CUSTOM_CSS = """
 body { margin: 0 !important; padding: 0 !important; background: #09090b !important; }
 .gradio-container { max-width: 100% !important; padding: 0 !important; margin: 0 !important; background: #09090b !important; }
 footer { display: none !important; }
-#omniparse-root { width: 100%; }
 #hidden-controls { display: none !important; }
 """
 
-# ─── HTML UI ────────────────────────────────────────────────────────────────
 HTML_UI = """
 <!DOCTYPE html>
-<html lang="en">
+<html lang="cs">
 <head>
 <meta charset="UTF-8"/>
 <meta name="viewport" content="width=device-width,initial-scale=1.0"/>
 <script src="https://cdn.tailwindcss.com"></script>
-<link rel="preconnect" href="https://fonts.googleapis.com"/>
-<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap" rel="stylesheet"/>
+<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap" rel="stylesheet"/>
 <style>
 *{box-sizing:border-box;margin:0;padding:0;}
 :root{
@@ -271,652 +399,477 @@ HTML_UI = """
   --blue-light: #60a5fa;
   --blue-dark: #1d4ed8;
   --green: #34d399;
-  --amber: #fbbf24;
-  --purple: #a78bfa;
-  --red: #f87171;
 }
-body{font-family:'Inter',system-ui,sans-serif;background:var(--bg);color:var(--text);min-height:100vh;}
-::-webkit-scrollbar{width:4px;height:4px;}
-::-webkit-scrollbar-track{background:var(--surface2);}
-::-webkit-scrollbar-thumb{background:var(--border2);border-radius:2px;}
-
-@keyframes spin{to{transform:rotate(360deg);}}
-@keyframes pulse{0%,100%{opacity:.4;}50%{opacity:1;}}
-@keyframes fadeUp{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:translateY(0);}}
-@keyframes slideIn{from{transform:translateX(110%);opacity:0;}to{transform:translateX(0);opacity:1;}}
-@keyframes slideOut{from{opacity:1;transform:translateX(0);}to{opacity:0;transform:translateX(110%);}}
-@keyframes shimmer{0%{background-position:-400px 0;}100%{background-position:400px 0;}}
-@keyframes blink{0%,80%,100%{opacity:0;}40%{opacity:1;}}
-@keyframes glow{0%,100%{box-shadow:0 0 8px rgba(59,130,246,0.3);}50%{box-shadow:0 0 20px rgba(59,130,246,0.6);}}
-
-.fade-up{animation:fadeUp 0.35s ease both;}
-.spin{animation:spin 0.8s linear infinite;}
-.pulse-dot{animation:pulse 1.4s ease-in-out infinite;}
-.pulse-dot:nth-child(2){animation-delay:.2s;}
-.pulse-dot:nth-child(3){animation-delay:.4s;}
-.typing-dot{animation:blink 1.4s infinite both;}
-.typing-dot:nth-child(2){animation-delay:.2s;}
-.typing-dot:nth-child(3){animation-delay:.4s;}
-.glow-blue{animation:glow 2s ease-in-out infinite;}
-
+body{font-family:'Inter',sans-serif;background:var(--bg);color:var(--text);}
 .card{background:var(--surface2);border:1px solid var(--border);border-radius:14px;}
-.card-inner{background:#1c1c1f;border:1px solid var(--border);border-radius:10px;}
 .section-label{font-size:10px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--text4);}
-
 .drop-zone{border:1.5px dashed var(--border2);border-radius:12px;transition:all .25s ease;cursor:pointer;}
-.drop-zone:hover,.drop-zone.drag-over{border-color:var(--blue);background:rgba(59,130,246,.05);box-shadow:0 0 0 4px rgba(59,130,246,.08),inset 0 0 24px rgba(59,130,246,.04);}
-
-.btn-primary{background:linear-gradient(135deg,var(--blue) 0%,var(--blue-dark) 100%);color:#fff;border:none;border-radius:12px;font-weight:600;font-size:14px;cursor:pointer;transition:all .2s ease;box-shadow:0 0 20px rgba(59,130,246,.25);}
-.btn-primary:hover:not(:disabled){box-shadow:0 0 32px rgba(59,130,246,.45);transform:translateY(-1px);filter:brightness(1.08);}
-.btn-primary:active:not(:disabled){transform:translateY(0);}
+.drop-zone:hover,.drop-zone.drag-over{border-color:var(--blue);background:rgba(59,130,246,.05);}
+.btn-primary{background:linear-gradient(135deg,var(--blue) 0%,var(--blue-dark) 100%);color:#fff;border:none;border-radius:12px;font-weight:600;font-size:14px;cursor:pointer;transition:all .2s ease;}
+.btn-primary:hover:not(:disabled){filter:brightness(1.1);transform:translateY(-1px);}
 .btn-primary:disabled{opacity:.45;cursor:not-allowed;}
-.btn-secondary{background:var(--surface2);border:1px solid var(--border2);color:var(--text2);border-radius:8px;font-size:12px;font-weight:500;cursor:pointer;transition:all .18s ease;padding:6px 12px;}
-.btn-secondary:hover{border-color:var(--blue-light);color:var(--text);background:#1c1c1f;}
-
-.tab-btn{font-size:12px;font-weight:500;padding:6px 12px;border-radius:6px;border:none;cursor:pointer;transition:all .18s ease;color:var(--text3);background:transparent;}
-.tab-btn.active{color:var(--text);background:var(--border);}
-.tab-btn:hover:not(.active){color:var(--text2);background:rgba(39,39,42,.5);}
-
-.bubble-user{background:var(--border);border:1px solid var(--border2);border-radius:14px 14px 4px 14px;}
-.bubble-ai{background:rgba(59,130,246,.07);border:1px solid rgba(59,130,246,.18);border-radius:14px 14px 14px 4px;}
-.ai-avatar{box-shadow:0 0 0 2px rgba(59,130,246,.3),0 0 12px rgba(59,130,246,.2);}
-.chat-input{background:var(--surface2);border:1px solid var(--border2);color:var(--text);border-radius:10px;padding:10px 14px;font-size:14px;font-family:'Inter',sans-serif;resize:none;outline:none;width:100%;transition:border-color .18s;}
-.chat-input:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(59,130,246,.12);}
-.chat-input::placeholder{color:var(--text4);}
-
-.code-view{background:#0d1117;border:1px solid #21262d;border-radius:10px;font-family:'JetBrains Mono','Fira Code',ui-monospace,monospace;}
-.json-key{color:#79c0ff;}
-.json-string{color:#a5d6ff;}
-.json-number{color:#ffa657;}
-.json-bool{color:#ff7b72;}
-.json-null{color:#8b949e;}
-pre.json-pre{white-space:pre-wrap;word-break:break-word;font-size:12.5px;line-height:1.75;}
-
-.dl-card{background:linear-gradient(135deg,rgba(59,130,246,.07) 0%,rgba(29,78,216,.04) 100%);border:1px solid rgba(59,130,246,.2);border-radius:12px;transition:all .2s ease;}
-.dl-card:hover{border-color:rgba(59,130,246,.4);background:linear-gradient(135deg,rgba(59,130,246,.1) 0%,rgba(29,78,216,.08) 100%);}
+.btn-secondary{background:var(--surface2);border:1px solid var(--border2);color:var(--text2);border-radius:12px;font-size:14px;font-weight:500;cursor:pointer;transition:all .18s ease;}
+.btn-secondary:hover{border-color:var(--blue-light);color:var(--text);}
+.chat-input{background:var(--surface2);border:1px solid var(--border2);color:var(--text);border-radius:10px;padding:10px 14px;font-size:14px;outline:none;width:100%;}
+.chat-input:focus{border-color:var(--blue);}
+.code-view{background:#0d1117;border:1px solid #21262d;border-radius:10px;font-family:'JetBrains Mono',monospace;}
+.dl-card{background:linear-gradient(135deg,rgba(59,130,246,.07) 0%,rgba(29,78,216,.04) 100%);border:1px solid rgba(59,130,246,.2);border-radius:12px;}
+.grad{background:linear-gradient(135deg,#60a5fa,#a78bfa);-webkit-background-clip:text;-webkit-text-fill-color:transparent;}
+.spin{animation:spin 0.8s linear infinite;}
+@keyframes spin{to{transform:rotate(360deg);}}
 .toast{animation:slideIn .3s ease;}
-.toast.hide{animation:slideOut .3s ease forwards;}
-.stat-chip{background:var(--surface2);border:1px solid var(--border);border-radius:10px;padding:12px 16px;}
-.prog-track{background:var(--border);border-radius:4px;height:3px;}
-.prog-fill{height:3px;border-radius:4px;background:linear-gradient(90deg,var(--blue),#6366f1);transition:width .4s ease;}
-.grad{background:linear-gradient(135deg,#60a5fa,#a78bfa);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
-.shimmer{background:linear-gradient(90deg,#27272a 25%,#3f3f46 50%,#27272a 75%);background-size:800px 100%;animation:shimmer 1.8s infinite;}
-.file-item{background:#1c1c1f;border:1px solid var(--border);border-radius:8px;transition:border-color .18s;}
-.file-item:hover{border-color:var(--border2);}
-.stage-dot{width:8px;height:8px;border-radius:50%;background:var(--border2);transition:background .3s ease;}
-.stage-dot.active{background:var(--blue);animation:pulse 1.4s ease-in-out infinite;}
-.stage-dot.done{background:var(--green);animation:none;}
+@keyframes slideIn{from{transform:translateX(110%);opacity:0;}to{transform:translateX(0);opacity:1;}}
 </style>
 </head>
 <body>
 
 <div id="toast-root" style="position:fixed;top:16px;right:16px;z-index:9999;display:flex;flex-direction:column;gap:8px;"></div>
 
-<header style="position:sticky;top:0;z-index:40;border-bottom:1px solid var(--border);background:rgba(9,9,11,.92);backdrop-filter:blur(16px);">
-  <div style="max-width:1280px;margin:0 auto;padding:0 24px;height:56px;display:flex;align-items:center;justify-content:space-between;">
-    <div style="display:flex;align-items:center;gap:12px;">
-      <div style="width:32px;height:32px;border-radius:8px;background:linear-gradient(135deg,#3b82f6,#1d4ed8);display:flex;align-items:center;justify-content:center;">
-        <svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M2 3h12M2 6h8M2 9h10M2 12h6" stroke="white" stroke-width="1.5" stroke-linecap="round"/><circle cx="13" cy="11" r="2.5" stroke="white" stroke-width="1.2"/><path d="M15 13l1.5 1.5" stroke="white" stroke-width="1.2" stroke-linecap="round"/></svg>
+<div id="auth-screen" class="fixed inset-0 z-50 flex items-center justify-center bg-[#09090b] p-4">
+  <div class="card w-full max-w-md p-8 space-y-6">
+    <div class="text-center space-y-2">
+      <div class="mx-auto w-12 h-12 rounded-xl bg-gradient-to-br from-blue-500 to-blue-700 flex items-center justify-center shadow-lg shadow-blue-500/25">
+        <svg width="22" height="22" viewBox="0 0 16 16" fill="none"><path d="M2 3h12M2 6h8M2 9h10M2 12h6" stroke="white" stroke-width="1.5" stroke-linecap="round"/><circle cx="13" cy="11" r="2.5" stroke="white" stroke-width="1.2"/><path d="M15 13l1.5 1.5" stroke="white" stroke-width="1.2" stroke-linecap="round"/></svg>
       </div>
-      <span style="color:#fff;font-weight:600;font-size:15px;letter-spacing:-.015em;">OmniParse <span class="grad">AI</span></span>
-      <span style="display:flex;align-items:center;gap:6px;padding:2px 10px;border-radius:20px;font-size:11px;font-weight:600;background:rgba(59,130,246,.1);border:1px solid rgba(59,130,246,.3);color:#60a5fa;">
-        <span style="width:6px;height:6px;border-radius:50%;background:#60a5fa;box-shadow:0 0 6px #60a5fa;"></span>
-        Enterprise v5.0
-      </span>
+      <h2 class="text-2xl font-bold tracking-tight text-white">OmniParse <span class="grad">AI</span></h2>
+      <p class="text-xs text-zinc-400">Multi-User Document Data-Mining Terminal</p>
     </div>
-    <div style="display:flex;align-items:center;gap:10px;">
-      <div style="display:flex;align-items:center;gap:8px;padding:6px 12px;border-radius:8px;background:var(--surface2);border:1px solid var(--border);">
-        <span id="status-dot" style="width:8px;height:8px;border-radius:50%;background:#34d399;box-shadow:0 0 6px #34d399;"></span>
-        <span id="status-text" style="font-size:12px;color:var(--text2);font-weight:500;">System Idle</span>
+    
+    <div class="space-y-4">
+      <div>
+        <label class="block text-xs font-semibold uppercase tracking-wider text-zinc-500 mb-1">Uživatelské jméno</label>
+        <input type="text" id="auth-username" class="chat-input" placeholder="Zadej login...">
+      </div>
+      <div>
+        <label class="block text-xs font-semibold uppercase tracking-wider text-zinc-500 mb-1">Heslo</label>
+        <input type="password" id="auth-password" class="chat-input" placeholder="••••••••">
       </div>
-      <div style="width:28px;height:28px;border-radius:50%;background:linear-gradient(135deg,rgba(59,130,246,.2),rgba(29,78,216,.2));border:1px solid rgba(59,130,246,.3);display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:600;color:#93c5fd;">OP</div>
+    </div>
+    
+    <div class="flex flex-col gap-2 pt-2">
+      <button onclick="handleAuthAction('login')" class="btn-primary w-full py-3 font-semibold text-sm">
+        Přihlásit se do systému ⚡
+      </button>
+      <button onclick="handleAuthAction('register')" class="btn-secondary w-full py-3 text-sm">
+        Registrovat nový účet
+      </button>
     </div>
   </div>
-</header>
+</div>
 
-<main style="max-width:1280px;margin:0 auto;padding:24px;">
 
-  <div style="display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:20px;" id="stats-bar">
-    <div class="stat-chip" style="display:flex;align-items:center;gap:12px;">
-      <div style="width:32px;height:32px;border-radius:8px;background:rgba(59,130,246,.1);border:1px solid rgba(59,130,246,.2);display:flex;align-items:center;justify-content:center;flex-shrink:0;">
-        <svg width="14" height="14" fill="none" viewBox="0 0 24 24" stroke="#60a5fa" stroke-width="2"><path d="M9 12h6m-6 4h6m2 5H7a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5.586a1 1 0 0 1 .707.293l5.414 5.414a1 1 0 0 1 .293.707V19a2 2 0 0 1-2 2z"/></svg>
+<div id="app-screen" style="display: none;">
+  <header style="border-bottom:1px solid var(--border);background:rgba(9,9,11,.92);backdrop-filter:blur(16px); position:sticky; top:0; z-index:40;">
+    <div style="max-width:1280px;margin:0 auto;padding:0 24px;height:56px;display:flex;align-items:center;justify-content:space-between;">
+      <div style="display:flex;align-items:center;gap:12px;">
+        <div style="width:32px;height:32px;border-radius:8px;background:linear-gradient(135deg,#3b82f6,#1d4ed8);display:flex;align-items:center;justify-content:center;">
+          <svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M2 3h12M2 6h8M2 9h10M2 12h6" stroke="white" stroke-width="1.5" stroke-linecap="round"/><circle cx="13" cy="11" r="2.5" stroke="white" stroke-width="1.2"/><path d="M15 13l1.5 1.5" stroke="white" stroke-width="1.2" stroke-linecap="round"/></svg>
+        </div>
+        <span style="color:#fff;font-weight:600;font-size:15px;">OmniParse <span class="grad">AI</span></span>
       </div>
-      <div><p style="font-size:11px;color:var(--text4);margin-bottom:2px;">Docs Parsed</p><p id="st-docs" style="font-size:16px;font-weight:600;">0</p></div>
-    </div>
-    <div class="stat-chip" style="display:flex;align-items:center;gap:12px;">
-      <div style="width:32px;height:32px;border-radius:8px;background:rgba(52,211,153,.1);border:1px solid rgba(52,211,153,.2);display:flex;align-items:center;justify-content:center;flex-shrink:0;">
-        <svg width="14" height="14" fill="none" viewBox="0 0 24 24" stroke="#34d399" stroke-width="2"><polyline points="20 6 9 17 4 12"/></svg>
+      
+      <div style="display:flex;align-items:center;gap:16px;">
+        <div style="display:flex;align-items:center;gap:8px;padding:6px 12px;border-radius:8px;background:var(--surface2);border:1px solid var(--border);">
+          <span id="status-dot" style="width:8px;height:8px;border-radius:50%;background:#34d399;"></span>
+          <span id="status-text" style="font-size:12px;color:var(--text2);font-weight:500;">System Ready</span>
+        </div>
+        <span id="user-display" class="text-sm font-medium text-blue-400"></span>
+        <button onclick="handleLogout()" class="text-xs text-red-400 hover:underline">Odhlásit se</button>
       </div>
-      <div><p style="font-size:11px;color:var(--text4);margin-bottom:2px;">Fields Extracted</p><p id="st-fields" style="font-size:16px;font-weight:600;">0</p></div>
     </div>
-    <div class="stat-chip" style="display:flex;align-items:center;gap:12px;">
-      <div style="width:32px;height:32px;border-radius:8px;background:rgba(251,191,36,.1);border:1px solid rgba(251,191,36,.15);display:flex;align-items:center;justify-content:center;flex-shrink:0;">
-        <svg width="14" height="14" fill="none" viewBox="0 0 24 24" stroke="#fbbf24" stroke-width="2"><circle cx="12" cy="12" r="10"/><polyline points="12 6 12 12 16 14"/></svg>
+  </header>
+  
+  <main style="max-width:1280px;margin:0 auto;padding:24px;">
+    <div class="grid grid-cols-4 gap-3 mb-5">
+      <div class="card p-4 flex items-center gap-3">
+        <div class="text-2xl">📄</div>
+        <div><p class="text-[10px] text-zinc-500 uppercase font-bold">Moje Dokumenty</p><p id="st-docs" class="text-lg font-bold text-white">0</p></div>
       </div>
-      <div><p style="font-size:11px;color:var(--text4);margin-bottom:2px;">Parse Time</p><p id="st-time" style="font-size:16px;font-weight:600;">—</p></div>
-    </div>
-    <div class="stat-chip" style="display:flex;align-items:center;gap:12px;">
-      <div style="width:32px;height:32px;border-radius:8px;background:rgba(167,139,250,.1);border:1px solid rgba(167,139,250,.2);display:flex;align-items:center;justify-content:center;flex-shrink:0;">
-        <svg width="14" height="14" fill="none" viewBox="0 0 24 24" stroke="#a78bfa" stroke-width="2"><path d="M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z"/></svg>
+      <div class="card p-4 flex items-center gap-3">
+        <div class="text-2xl">⚡</div>
+        <div><p class="text-[10px] text-zinc-500 uppercase font-bold">Vytěžená pole</p><p id="st-fields" class="text-lg font-bold text-white">0</p></div>
+      </div>
+      <div class="card p-4 flex items-center gap-3">
+        <div class="text-2xl">⏱️</div>
+        <div><p class="text-[10px] text-zinc-500 uppercase font-bold">Čas operace</p><p id="st-time" class="text-lg font-bold text-white">—</p></div>
+      </div>
+      <div class="card p-4 flex items-center gap-3">
+        <div class="text-2xl">🎯</div>
+        <div><p class="text-[10px] text-zinc-500 uppercase font-bold">Spolehlivost</p><p id="st-conf" class="text-lg font-bold text-white">—</p></div>
       </div>
-      <div><p style="font-size:11px;color:var(--text4);margin-bottom:2px;">Confidence</p><p id="st-conf" style="font-size:16px;font-weight:600;">—</p></div>
     </div>
-  </div>
-
-  <div style="display:grid;grid-template-columns:1fr 1fr;gap:20px;">
-
-    <div style="display:flex;flex-direction:column;gap:16px;">
-      <div class="card" style="padding:20px;">
-        <div style="display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;">
-          <div>
-            <p style="font-size:14px;font-weight:600;">Document Input</p>
-            <p style="font-size:12px;color:var(--text4);margin-top:2px;">Upload invoices, receipts, purchase orders</p>
-          </div>
-          <span class="section-label">Stage 01</span>
-        </div>
-
-        <div id="drop-zone" class="drop-zone" style="padding:32px 20px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;text-align:center;min-height:180px;"
-             onclick="document.getElementById('file-input').click()"
-             ondragover="event.preventDefault();this.classList.add('drag-over')"
-             ondragleave="this.classList.remove('drag-over')"
-             ondrop="handleDrop(event)">
-          <input type="file" id="file-input" style="display:none;" accept=".pdf,.jpg,.jpeg,.png,.tiff,.webp" onchange="handleFiles(this.files)"/>
-          <div style="width:52px;height:52px;border-radius:50%;background:rgba(59,130,246,.08);border:1px solid rgba(59,130,246,.15);display:flex;align-items:center;justify-content:center;">
-            <svg width="22" height="22" fill="none" viewBox="0 0 24 24" stroke="#60a5fa" stroke-width="1.5"><path stroke-linecap="round" stroke-linejoin="round" d="M3 16.5v2.25A2.25 2.25 0 0 0 5.25 21h13.5A2.25 2.25 0 0 0 21 18.75V16.5m-13.5-9L12 3m0 0 4.5 4.5M12 3v13.5"/></svg>
+    
+    <div style="display:grid;grid-template-columns:1fr 1fr;gap:20px;">
+      <div class="space-y-4">
+        <div class="card p-5 space-y-4">
+          <div class="flex justify-between items-center">
+            <span class="text-sm font-semibold">Vstupní dokument</span>
+            <span class="section-label">Stage 01</span>
           </div>
-          <div>
-            <p style="font-size:14px;font-weight:500;color:var(--text);">Drop files here or <span style="color:var(--blue-light);">browse</span></p>
-            <p style="font-size:12px;color:var(--text4);margin-top:4px;">PDF, JPG, PNG, TIFF, WEBP — up to 50 MB</p>
+          
+          <div id="drop-zone" class="drop-zone p-8 flex flex-col items-center justify-center gap-3 text-center min-h-[160px]"
+               onclick="document.getElementById('file-input').click()"
+               ondragover="event.preventDefault();this.classList.add('drag-over')"
+               ondragleave="this.classList.remove('drag-over')"
+               ondrop="handleDrop(event)">
+            <input type="file" id="file-input" style="display:none;" accept="image/*" onchange="handleFiles(this.files)"/>
+            <div class="text-3xl text-zinc-500">📥</div>
+            <p class="text-sm text-zinc-300">Hoď soubor sem nebo <span class="text-blue-400 underline">klikni pro vyhledání</span></p>
           </div>
-          <div style="display:flex;gap:8px;flex-wrap:wrap;justify-content:center;">
-            <span style="padding:2px 8px;border-radius:4px;font-size:10px;font-weight:500;color:var(--text3);background:var(--border);">PDF</span>
-            <span style="padding:2px 8px;border-radius:4px;font-size:10px;font-weight:500;color:var(--text3);background:var(--border);">JPG</span>
-            <span style="padding:2px 8px;border-radius:4px;font-size:10px;font-weight:500;color:var(--text3);background:var(--border);">PNG</span>
-            <span style="padding:2px 8px;border-radius:4px;font-size:10px;font-weight:500;color:var(--text3);background:var(--border);">TIFF</span>
+          
+          <div id="file-preview" style="display:none;" class="border border-zinc-800 p-2 rounded-lg">
+            <img id="img-preview" style="width:100%; max-height:180px; object-fit:contain; border-radius:6px;"/>
           </div>
         </div>
-        <div id="file-preview" style="margin-top:12px;display:none;">
-          <img id="img-preview" style="width:100%;max-height:200px;object-fit:contain;border-radius:8px;border:1px solid var(--border);"/>
+        
+        <div class="card p-4">
+          <button id="exec-btn" class="btn-primary w-full py-4 flex items-center justify-center gap-2" disabled onclick="executeExtraction()">
+            <span id="btn-idle">Spustit AI extrakci dat z faktury ⚡</span>
+            <span id="btn-loading" style="display:none;" class="flex items-center gap-2">
+              <svg class="spin h-4 w-4 text-white" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="3"><path d="M21 12a9 9 0 1 1-6.219-8.56"/></svg>
+              Extrahuji data z dokumentu...
+            </span>
+          </button>
         </div>
-        <div id="file-list" style="margin-top:10px;display:flex;flex-direction:column;gap:8px;"></div>
-      </div>
-
-      <div class="card" style="padding:16px;">
-        <button id="exec-btn" class="btn-primary" style="width:100%;padding:14px;display:flex;align-items:center;justify-content:center;gap:10px;" disabled onclick="executeExtraction()">
-          <span id="btn-idle" style="display:flex;align-items:center;gap:8px;">
-            <svg width="16" height="16" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2.5"><polygon points="13 2 3 14 12 14 11 22 21 10 12 10 13 2"/></svg>
-            Execute Document Extraction ⚡
-          </span>
-          <span id="btn-loading" style="display:none;align-items:center;gap:8px;">
-            <svg class="spin" width="16" height="16" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><path d="M21 12a9 9 0 1 1-6.219-8.56"/></svg>
-            Processing…
-          </span>
-        </button>
-        <div id="prog-wrapper" style="display:none;margin-top:14px;">
-          <div style="display:flex;justify-content:space-between;margin-bottom:6px;">
-            <span id="prog-label" style="font-size:12px;color:var(--text2);">Initializing...</span>
-            <span id="prog-pct" style="font-size:12px;font-weight:600;color:var(--blue-light);">0%</span>
-          </div>
-          <div class="prog-track">
-            <div id="prog-fill" class="prog-fill" style="width:0%;"></div>
-          </div>
-          <div style="display:grid;grid-template-columns:repeat(4,1fr);margin-top:12px;text-align:center;gap:4px;">
-            <div>
-              <div id="stage-1" class="stage-dot" style="margin:0 auto 6px;"></div>
-              <p style="font-size:10px;color:var(--text4);">Ingestion</p>
-            </div>
-            <div>
-              <div id="stage-2" class="stage-dot" style="margin:0 auto 6px;"></div>
-              <p style="font-size:10px;color:var(--text4);">Model Parse</p>
-            </div>
-            <div>
-              <div id="stage-3" class="stage-dot" style="margin:0 auto 6px;"></div>
-              <p style="font-size:10px;color:var(--text4);">Validation</p>
-            </div>
-            <div>
-              <div id="stage-4" class="stage-dot" style="margin:0 auto 6px;"></div>
-              <p style="font-size:10px;color:var(--text4);">Export</p>
-            </div>
+        
+        <div class="card p-5 space-y-3">
+          <div class="flex justify-between items-center"><span class="text-sm font-semibold">Export dat</span><span class="section-label">Stage 03</span></div>
+          <div id="export-actions" style="display:none;" class="w-full">
+            <button onclick="downloadCSV()" class="dl-card w-full p-3 flex justify-between items-center text-sm font-medium text-zinc-200">
+              <span>📊 Exportovat do datové struktury CSV</span>
+              <span class="text-xs text-blue-400 bg-blue-950/50 px-2 py-1 rounded">STÁHNOUT</span>
+            </button>
           </div>
+          <div id="export-empty" class="text-xs text-zinc-500 text-center py-2">Čekám na zpracování dokumentu...</div>
         </div>
       </div>
-    </div>
-
-    <div style="display:flex;flex-direction:column;gap:16px;">
-      <div class="card" style="padding:16px;display:flex;flex-direction:column;height:100%;min-height:480px;">
-        <div style="display:flex;align-items:center;justify-content:between;border-bottom:1px solid var(--border);padding-bottom:12px;margin-bottom:12px;">
-          <div style="display:flex;gap:6px;background:var(--surface);padding:4px;border-radius:8px;border:1px solid var(--border);">
-            <button id="tab-data" class="tab-btn active" onclick="switchTab('data')">Extracted Data</button>
-            <button id="tab-chat" class="tab-btn" onclick="switchTab('chat')">AI Chat Agent</button>
+      
+      <div class="space-y-4">
+        <div class="card p-5 space-y-3">
+          <div class="flex justify-between items-center"><span class="text-sm font-semibold">Live Extraction Terminal</span><span class="section-label">Output JSON</span></div>
+          <div class="code-view p-4 min-h-[160px] max-h-[220px] overflow-y-auto">
+            <pre id="json-display" class="text-xs text-zinc-400 leading-relaxed font-mono">// Terminál je prázdný.</pre>
           </div>
-          <span class="section-label">Stage 02</span>
         </div>
-
-        <div id="view-data" style="display:flex;flex-direction:column;gap:12px;flex-grow:1;">
-          <div id="data-placeholder" style="display:flex;flex-direction:column;align-items:center;justify-content:center;flex-grow:1;color:var(--text4);text-align:center;padding:4px;">
-            <svg width="32" height="32" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.5" style="margin-bottom:8px;"><path stroke-linecap="round" stroke-linejoin="round" d="M15.75 17.25v3.375c0 .621-.504 1.125-1.125 1.125h-9.75a1.125 1.125 0 0 1-1.125-1.125V7.875c0-.621.504-1.125 1.125-1.125H6.75a9.06 9.06 0 0 1 1.5.124m7.5 10.376A8.965 8.965 0 0 0 12 12.75c-.131 0-.262.007-.392.021m3.416 4.479a8.978 8.978 0 0 4-4.479m-4 4.479a9.15 9.15 0 0 1-3.084-2.435m0 0A8.958 8.958 0 0 1 12 12.75c1.24 0 2.391.251 3.434.703m-6.434-.703a9.036 9.036 0 0 1 1.566-3.472m0 0a9.043 9.043 0 0 1 3.468-1.564"/></svg>
-            <p style="font-size:13px;font-weight:500;">Awaiting Extraction Results</p>
-            <p style="font-size:11px;margin-top:2px;">Execute extraction to inspect payload schemas.</p>
+        
+        <div class="grid grid-cols-2 gap-3">
+          <div class="card p-4 space-y-1">
+            <p class="text-[10px] uppercase font-bold tracking-wider text-zinc-500">Validace DPH / Shody</p>
+            <p id="comp-val" class="text-xs font-semibold text-zinc-300">—</p>
           </div>
-
-          <div id="data-display" style="display:none;flex-direction:column;gap:12px;flex-grow:1;">
-            <div class="code-view" style="flex-grow:1;padding:14px;overflow-y:auto;max-height:320px;">
-              <pre class="json-pre"><code id="json-code"></code></pre>
-            </div>
-            
-            <div style="display:grid;grid-template-columns:1fr 1fr;gap:10px;">
-              <div class="dl-card" style="padding:12px;display:flex;align-items:center;justify-content:between;cursor:pointer;" onclick="downloadCSV()">
-                <div>
-                  <p style="font-size:12px;font-weight:600;color:var(--text);">Structured CSV</p>
-                  <p style="font-size:10px;color:var(--text4);margin-top:1px;">Tabular matrix mapping</p>
-                </div>
-                <svg width="16" height="16" fill="none" viewBox="0 0 24 24" stroke="var(--blue-light)" stroke-width="2"><path d="M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-4l-4 4m0 0l-4-4m4 4V4"/></svg>
-              </div>
-              <div class="dl-card" style="padding:12px;display:flex;align-items:center;justify-content:between;cursor:pointer;" onclick="downloadJSON()">
-                <div>
-                  <p style="font-size:12px;font-weight:600;color:var(--text);">Raw Payload JSON</p>
-                  <p style="font-size:10px;color:var(--text4);margin-top:1px;">Standard REST response</p>
-                </div>
-                <svg width="16" height="16" fill="none" viewBox="0 0 24 24" stroke="var(--purple)" stroke-width="2"><path d="M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-4l-4 4m0 0l-4-4m4 4V4"/></svg>
-              </div>
-            </div>
+          <div class="card p-4 space-y-1">
+            <p class="text-[10px] uppercase font-bold tracking-wider text-zinc-500">Detekce duplicity</p>
+            <p id="comp-dup" class="text-xs font-semibold text-zinc-300">—</p>
           </div>
         </div>
-
-        <div id="view-chat" style="display:none;flex-direction:column;height:100%;flex-grow:1;">
-          <div id="chat-messages" style="flex-grow:1;overflow-y:auto;max-height:300px;display:flex;flex-direction:column;gap:12px;padding-right:4px;margin-bottom:12px;">
-            <div class="fade-up" style="display:flex;gap:10px;align-items:start;">
-              <div class="ai-avatar" style="width:26px;height:26px;border-radius:50%;background:var(--blue);display:flex;align-items:center;justify-content:center;color:#fff;font-size:10px;font-weight:700;flex-shrink:0;margin-top:2px;">AI</div>
-              <div class="bubble-ai" style="padding:10px 14px;font-size:13px;line-height:1.5;color:var(--text);">
-                Hello! I am your document agent. Once you extract a document, ask me questions like <em>"What is the total amount?"</em> or <em>"Who is the vendor?"</em>.
-              </div>
+        
+        <div class="card p-5 flex flex-col h-[280px]">
+          <p class="text-xs font-bold uppercase tracking-wider text-zinc-400 mb-2">AI Audit Companion</p>
+          <div id="chat-history" class="flex-1 overflow-y-auto space-y-2 mb-3 pr-1 text-xs">
+            <div class="p-2 rounded bg-blue-950/20 border border-blue-900/30 text-zinc-300">
+              Systém je připraven. Zeptej se mě na cokoliv ohledně položek faktury.
             </div>
           </div>
-
-          <div style="display:flex;gap:8px;position:relative;">
-            <textarea id="chat-textarea" class="chat-input" placeholder="Query document contents..." rows="1" onkeydown="handleChatKey(event)"></textarea>
-            <button id="chat-send-btn" style="position:absolute;right:8px;top:8px;color:var(--text3);cursor:pointer;transition:color .15s;" onclick="sendChatMessage()">
-              <svg width="20" height="20" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2"><path stroke-linecap="round" stroke-linejoin="round" d="M6 12L3.269 3.126A59.768 59.768 0 0121.485 12 59.77 59.77 0 013.27 20.876L5.999 12zm0 0h7.5"/></svg>
-            </button>
+          <div class="flex gap-2">
+            <input type="text" id="chat-input" class="chat-input text-xs" placeholder="Napiš dotaz k faktuře..." onkeydown="if(event.key==='Enter') sendChatMessage()"/>
+            <button onclick="sendChatMessage()" class="btn-primary px-3 text-xs font-bold">Odeslat</button>
           </div>
         </div>
       </div>
     </div>
-
-  </div>
-</main>
+  </main>
+</div>
 
 <script>
 let currentBase64 = "";
-let latestJSONPayload = null;
-let parsedCount = 0;
-
-function showToast(message, type = "success") {
-  const container = document.getElementById("toast-root");
-  const toast = document.createElement("div");
-  toast.className = "toast card";
-  toast.style.cssText = `padding:12px 16px;display:flex;align-items:center;gap:10px;min-width:260px;background:var(--surface2);border-left:4px solid ${type === 'success' ? 'var(--green)' : 'var(--red)'};`;
-  toast.innerHTML = `
-    <span style="font-size:13px;font-weight:500;color:var(--text);flex-grow:1;">${message}</span>
-    <button onclick="this.parentElement.remove()" style="color:var(--text4);font-size:12px;cursor:pointer;">✕</button>
-  `;
-  container.appendChild(toast);
-  setTimeout(() => {
-    toast.classList.add("hide");
-    setTimeout(() => toast.remove(), 300);
-  }, 4000);
+let latestExtractedJson = "";
+let csvB64Data = "";
+let authPolling = null;
+let parsePolling = null;
+let chatPolling = null;
+
+function showToast(msg, type='info') {
+    const root = document.getElementById("toast-root");
+    const toast = document.createElement("div");
+    toast.className = `toast card px-4 py-3 rounded-xl flex items-center gap-3 text-xs shadow-2xl text-white ${type === 'error' ? 'bg-red-950/80 border-red-800' : 'bg-zinc-900/90 border-zinc-700'}`;
+    toast.innerHTML = `<span>${type === 'error' ? '❌' : '✅'}</span><span>${msg}</span>`;
+    root.appendChild(toast);
+    setTimeout(() => {
+        toast.style.opacity = '0';
+        setTimeout(() => toast.remove(), 300);
+    }, 4000);
 }
 
-function handleDrop(e) {
-  e.preventDefault();
-  document.getElementById("drop-zone").classList.remove("drag-over");
-  if (e.dataTransfer.files && e.dataTransfer.files.length > 0) {
-    handleFiles(e.dataTransfer.files);
-  }
+function checkLoginState() {
+    const user = sessionStorage.getItem("omniparse_user");
+    if (user) {
+        document.getElementById("auth-screen").style.display = "none";
+        document.getElementById("app-screen").style.display = "block";
+        document.getElementById("user-display").innerText = `👤 ${user}`;
+        
+        // Refresh statistik z DB na pozadí
+        const grUser = document.querySelector("#gr-auth-user textarea");
+        const grPass = document.querySelector("#gr-auth-pass textarea");
+        if (grUser && grPass) {
+            grUser.value = user;
+            grUser.dispatchEvent(new Event("input", { bubbles: true }));
+            grPass.value = "SESSION_REFRESH";
+            grPass.dispatchEvent(new Event("input", { bubbles: true }));
+            document.querySelector("#gr-login-btn").click();
+        }
+        if(authPolling) clearInterval(authPolling);
+        authPolling = setInterval(checkAuthResponse, 150);
+    } else {
+        document.getElementById("auth-screen").style.display = "flex";
+        document.getElementById("app-screen").style.display = "none";
+    }
 }
 
-function handleFiles(files) {
-  if (files.length === 0) return;
-  const file = files[0];
-  
-  const fileList = document.getElementById("file-list");
-  fileList.innerHTML = `
-    <div class="file-item" style="padding:10px 14px;display:flex;align-items:center;justify-content:between;">
-      <div style="display:flex;align-items:center;gap:10px;overflow:hidden;">
-        <svg width="16" height="16" fill="none" viewBox="0 0 24 24" stroke="var(--text3)" stroke-width="2"><path d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"/></svg>
-        <span style="font-size:12px;font-weight:500;color:var(--text2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;">${file.name}</span>
-      </div>
-      <span style="font-size:11px;color:var(--text4);">${(file.size / 1024).toFixed(1)} KB</span>
-    </div>
-  `;
-
-  const reader = new FileReader();
-  reader.onload = function(e) {
-    currentBase64 = e.target.result;
+function handleAuthAction(action) {
+    const userVal = document.getElementById("auth-username").value.trim();
+    const passVal = document.getElementById("auth-password").value;
     
-    const hiddenInput = document.querySelector("#gr-image-input textarea");
-    if(hiddenInput) {
-      hiddenInput.value = currentBase64;
-      hiddenInput.dispatchEvent(new Event('input', { bubbles: true }));
+    if(!userVal || !passVal) {
+        showToast("Musíš vyplnit obě pole!", "error");
+        return;
     }
     
-    if (file.type.startsWith("image/")) {
-      document.getElementById("img-preview").src = currentBase64;
-      document.getElementById("file-preview").style.display = "block";
+    const grUser = document.querySelector("#gr-auth-user textarea");
+    const grPass = document.querySelector("#gr-auth-pass textarea");
+    
+    if(!grUser || !grPass) return;
+    
+    grUser.value = userVal;
+    grUser.dispatchEvent(new Event("input", { bubbles: true }));
+    grPass.value = passVal;
+    grPass.dispatchEvent(new Event("input", { bubbles: true }));
+    
+    if (action === 'login') {
+        document.querySelector("#gr-login-btn").click();
     } else {
-      document.getElementById("file-preview").style.display = "none";
+        document.querySelector("#gr-register-btn").click();
     }
     
-    document.getElementById("exec-btn").removeAttribute("disabled");
-    showToast("Document staged for extraction.");
-  };
-  reader.readAsDataURL(file);
+    if(authPolling) clearInterval(authPolling);
+    authPolling = setInterval(checkAuthResponse, 150);
 }
 
-function executeExtraction() {
-  if (!currentBase64) return;
-  
-  document.getElementById("exec-btn").setAttribute("disabled", "true");
-  document.getElementById("btn-idle").style.display = "none";
-  document.getElementById("btn-loading").style.display = "flex";
-  document.getElementById("prog-wrapper").style.display = "block";
-  
-  document.getElementById("status-dot").style.background = "var(--amber)";
-  document.getElementById("status-dot").style.boxShadow = "0 0 8px var(--amber)";
-  document.getElementById("status-text").innerText = "Analyzing Schema...";
-
-  for(let i=1; i<=4; i++) {
-    document.getElementById(`stage-${i}`).className = "stage-dot";
-  }
-
-  animateProgress(0, 25, "Ingesting Document...", 1, () => {
-    animateProgress(25, 65, "Running Vision Transformer Model...", 2, () => {
-      const grBtn = document.getElementById("gr-parse-btn");
-      if(grBtn) grBtn.click();
-      waitForExtractionResponse();
-    });
-  });
-}
-
-function animateProgress(start, end, label, currentStage, callback) {
-  document.getElementById("prog-label").innerText = label;
-  document.getElementById(`stage-${currentStage}`).className = "stage-dot active";
-  
-  let current = start;
-  let interval = setInterval(() => {
-    current += 2;
-    if(current >= end) {
-      current = end;
-      clearInterval(interval);
-      document.getElementById(`stage-${currentStage}`).className = "stage-dot done";
-      if(callback) callback();
+function checkAuthResponse() {
+    const respEl = document.querySelector("#gr-auth-response textarea");
+    if (!respEl) return;
+    const val = respEl.value;
+    if (val && val.trim() !== "") {
+        clearInterval(authPolling);
+        authPolling = null;
+        respEl.value = "";
+        respEl.dispatchEvent(new Event("input", { bubbles: true }));
+        try {
+            const data = JSON.parse(val);
+            if (data.status === "SUCCESS") {
+                if (data.username) {
+                    sessionStorage.setItem("omniparse_user", data.username);
+                    showToast("Přihlášení úspěšné!");
+                    document.getElementById("auth-screen").style.display = "none";
+                    document.getElementById("app-screen").style.display = "block";
+                    document.getElementById("user-display").innerText = `👤 ${data.username}`;
+                    if (data.stats) {
+                        document.getElementById("st-docs").innerText = data.stats.docs_parsed;
+                        document.getElementById("st-fields").innerText = data.stats.fields_extracted;
+                    }
+                } else {
+                    showToast(data.message);
+                }
+            } else {
+                showToast(data.message, "error");
+            }
+        } catch(e) {
+            console.error("Auth json error", e);
+        }
     }
-    document.getElementById("prog-pct").innerText = `${current}%`;
-    document.getElementById("prog-fill").style.width = `${current}%`;
-  }, 40);
 }
 
-function waitForExtractionResponse() {
-  const hiddenOut = document.querySelector("#gr-json-output textarea");
-  let checks = 0;
-  
-  let checker = setInterval(() => {
-    checks++;
-    if (hiddenOut && hiddenOut.value && hiddenOut.value.trim() !== "") {
-      clearInterval(checker);
-      try {
-        const payload = JSON.parse(hiddenOut.value);
-        handleExtractionSuccess(payload);
-      } catch (err) {
-        handleExtractionError("Invalid system payload received.");
-      }
-    } else if (checks > 350) {
-      clearInterval(checker);
-      handleExtractionError("Model connection timeout.");
-    }
-  }, 100);
+function handleLogout() {
+    sessionStorage.clear();
+    location.reload();
 }
 
-function handleExtractionSuccess(payload) {
-  latestJSONPayload = payload;
-  parsedCount++;
-  
-  animateProgress(65, 90, "Cross-Field Validation...", 3, () => {
-    animateProgress(90, 100, "Compiling Result Schemes...", 4, () => {
-      document.getElementById("btn-idle").style.display = "flex";
-      document.getElementById("btn-loading").style.display = "none";
-      
-      document.getElementById("status-dot").style.background = "#34d399";
-      document.getElementById("status-dot").style.boxShadow = "0 0 6px #34d399";
-      document.getElementById("status-text").innerText = "System Idle";
-      
-      document.getElementById("st-docs").innerText = parsedCount;
-      document.getElementById("st-fields").innerText = Object.keys(payload.extracted_data || {}).length;
-      document.getElementById("st-time").innerText = `${payload.parse_time_seconds || '0.45'}s`;
-      document.getElementById("st-conf").innerText = `${((payload.security_and_compliance || {}).confidence_score * 100 || 97).toFixed(0)}%`;
-      
-      const jsonStr = JSON.stringify(payload, null, 2);
-      document.getElementById("json-code").innerHTML = syntaxHighlightJSON(jsonStr);
-      
-      document.getElementById("data-placeholder").style.display = "none";
-      document.getElementById("data-display").style.display = "flex";
-      
-      switchTab('data');
-      showToast("Document successfully processed!");
-      
-      const hiddenOut = document.querySelector("#gr-json-output textarea");
-      if(hiddenOut) {
-        hiddenOut.value = "";
-        hiddenOut.dispatchEvent(new Event('input', { bubbles: true }));
-      }
-    });
-  });
+function handleFiles(files) {
+    if (!files.length) return;
+    const file = files[0];
+    const reader = new FileReader();
+    reader.onload = function(e) {
+        currentBase64 = e.target.result;
+        document.getElementById("img-preview").src = currentBase64;
+        document.getElementById("file-preview").style.display = "block";
+        document.getElementById("exec-btn").disabled = false;
+        showToast(`Doklad načten do cache.`);
+    };
+    reader.readAsDataURL(file);
 }
 
-function handleExtractionError(errLog) {
-  document.getElementById("btn-idle").style.display = "flex";
-  document.getElementById("btn-loading").style.display = "none";
-  document.getElementById("prog-wrapper").style.display = "none";
-  
-  document.getElementById("status-dot").style.background = "var(--red)";
-  document.getElementById("status-dot").style.boxShadow = "0 0 8px var(--red)";
-  document.getElementById("status-text").innerText = "Error Detected";
-  
-  showToast(errLog, "error");
+function handleDrop(e) {
+    e.preventDefault();
+    handleFiles(e.dataTransfer.files);
 }
 
-function syntaxHighlightJSON(json) {
-  json = json.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;');
-  return json.replace(/("(\\u[a-zA-Z0-9]{4}|\\[^u]|[^\\"])*"(\s*:)?|\b(true|false|null)\b|-?\d+(?:\.\d*)?(?:[eE][+-]?\d+)?)/g, function (match) {
-    let cls = 'json-number';
-    if (/^"/.test(match)) {
-      if (/:$/.test(match)) {
-        cls = 'json-key';
-        return `<span class="${cls}">${match.replace(':', '')}</span>:`;
-      } else {
-        cls = 'json-string';
-      }
-    } else if (/true|false/.test(match)) {
-      cls = 'json-bool';
-    } else if (/null/.test(match)) {
-      cls = 'json-null';
-    }
-    return `<span class="${cls}">${match}</span>`;
-  });
+function executeExtraction() {
+    if (!currentBase64) return;
+    
+    document.getElementById("btn-idle").style.display = "none";
+    document.getElementById("btn-loading").style.display = "flex";
+    document.getElementById("status-text").innerText = "Těžím data...";
+    
+    const user = sessionStorage.getItem("omniparse_user") || "";
+    const grImg = document.querySelector("#gr-image-input textarea");
+    const grUser = document.querySelector("#gr-current-user textarea");
+    
+    grImg.value = currentBase64;
+    grImg.dispatchEvent(new Event("input", { bubbles: true }));
+    grUser.value = user;
+    grUser.dispatchEvent(new Event("input", { bubbles: true }));
+    
+    document.querySelector("#gr-parse-btn").click();
+    
+    if(parsePolling) clearInterval(parsePolling);
+    parsePolling = setInterval(checkParseResponse, 200);
 }
 
-function switchTab(tab) {
-  if(tab === 'data') {
-    document.getElementById("tab-data").classList.add("active");
-    document.getElementById("tab-chat").classList.remove("active");
-    document.getElementById("view-data").style.display = "flex";
-    document.getElementById("view-chat").style.display = "none";
-  } else {
-    document.getElementById("tab-data").classList.remove("active");
-    document.getElementById("tab-chat").classList.add("active");
-    document.getElementById("view-data").style.display = "none";
-    document.getElementById("view-chat").style.display = "flex";
-  }
+function checkParseResponse() {
+    const outEl = document.querySelector("#gr-json-output textarea");
+    if (!outEl) return;
+    const val = outEl.value;
+    if (val && val.trim() !== "") {
+        clearInterval(parsePolling);
+        parsePolling = null;
+        outEl.value = "";
+        outEl.dispatchEvent(new Event("input", { bubbles: true }));
+        
+        document.getElementById("btn-idle").style.display = "flex";
+        document.getElementById("btn-loading").style.display = "none";
+        document.getElementById("status-text").innerText = "System Idle";
+        
+        try {
+            const res = JSON.parse(val);
+            if (res.parser_status === "SUCCESS") {
+                latestExtractedJson = JSON.stringify(res, null, 2);
+                document.getElementById("json-display").innerText = latestExtractedJson;
+                document.getElementById("st-time").innerText = `${res.parse_time_seconds}s`;
+                document.getElementById("st-conf").innerText = `${Math.round(res.security_and_compliance.confidence_score * 100)}%`;
+                document.getElementById("comp-val").innerText = res.security_and_compliance.cross_field_validation;
+                document.getElementById("comp-dup").innerText = res.security_and_compliance.duplicate_detected ? "⚠️ POTENCIÁLNÍ DUPLICITA" : "✅ OK (Unikátní)";
+                
+                if (res.user_stats) {
+                    document.getElementById("st-docs").innerText = res.user_stats.docs_parsed;
+                    document.getElementById("st-fields").innerText = res.user_stats.fields_extracted;
+                }
+                if (res._csv_b64) {
+                    csvB64Data = res._csv_b64;
+                    document.getElementById("export-actions").style.display = "block";
+                    document.getElementById("export-empty").style.display = "none";
+                }
+                showToast("Data úspěšně vytěžena!");
+            } else {
+                showToast("Chyba: " + res.error_log, "error");
+            }
+        } catch(e) {
+            showToast("Nelze dekódovat výstup.", "error");
+        }
+    }
 }
 
-function handleChatKey(e) {
-  if(e.key === 'Enter' && !e.shiftKey) {
-    e.preventDefault();
-    sendChatMessage();
-  }
+function downloadCSV() {
+    if (!csvB64Data) return;
+    const binStr = atob(csvB64Data);
+    const bytes = new Uint8Array(binStr.length);
+    for (let i = 0; i < binStr.length; i++) {
+        bytes[i] = binStr.charCodeAt(i);
+    }
+    const blob = new Blob([bytes], { type: "text/csv" });
+    const url = URL.createObjectURL(blob);
+    const a = document.createElement("a");
+    a.href = url;
+    a.download = "omniparse_export.csv";
+    document.body.appendChild(a);
+    a.click();
+    document.body.removeChild(a);
 }
 
 function sendChatMessage() {
-  const txtArea = document.getElementById("chat-textarea");
-  const msg = txtArea.value.trim();
-  if(!msg) return;
-  
-  txtArea.value = "";
-  
-  const chatContainer = document.getElementById("chat-messages");
-  const userDiv = document.createElement("div");
-  userDiv.className = "fade-up";
-  userDiv.style = "display:flex;gap:10px;align-items:start;justify-content:flex-end;";
-  userDiv.innerHTML = `
-    <div class="bubble-user" style="padding:10px 14px;font-size:13px;line-height:1.5;color:var(--text);max-width:85%;">
-      ${msg}
-    </div>
-  `;
-  chatContainer.appendChild(userDiv);
-  chatContainer.scrollTop = chatContainer.scrollHeight;
-
-  const thinkDiv = document.createElement("div");
-  thinkDiv.id = "ai-thinking-placeholder";
-  thinkDiv.className = "fade-up";
-  thinkDiv.style = "display:flex;gap:10px;align-items:start;";
-  thinkDiv.innerHTML = `
-    <div class="ai-avatar" style="width:26px;height:26px;border-radius:50%;background:var(--blue);display:flex;align-items:center;justify-content:center;color:#fff;font-size:10px;font-weight:700;flex-shrink:0;margin-top:2px;">AI</div>
-    <div class="bubble-ai" style="padding:10px 14px;display:flex;align-items:center;gap:4px;height:36px;">
-      <span class="typing-dot" style="width:5px;height:5px;border-radius:50%;background:var(--text2);"></span>
-      <span class="typing-dot" style="width:5px;height:5px;border-radius:50%;background:var(--text2);"></span>
-      <span class="typing-dot" style="width:5px;height:5px;border-radius:50%;background:var(--text2);"></span>
-    </div>
-  `;
-  chatContainer.appendChild(thinkDiv);
-  chatContainer.scrollTop = chatContainer.scrollHeight;
-
-  const grMsgInput = document.querySelector("#gr-chat-msg textarea");
-  const grJsonInput = document.querySelector("#gr-chat-json textarea");
-  const grChatBtn = document.getElementById("gr-chat-btn");
-  
-  if (grMsgInput && grChatBtn) {
-    grMsgInput.value = msg;
-    grMsgInput.dispatchEvent(new Event('input', { bubbles: true }));
+    const inputEl = document.getElementById("chat-input");
+    const msg = inputEl.value.trim();
+    if (!msg) return;
+    
+    inputEl.value = "";
+    const hist = document.getElementById("chat-history");
+    hist.innerHTML += `<div class="p-2 rounded bg-zinc-800 text-zinc-100 text-right font-medium">Vy: ${msg}</div>`;
+    hist.scrollTop = hist.scrollHeight;
+    
+    const grMsg = document.querySelector("#gr-chat-msg textarea");
+    const grJson = document.querySelector("#gr-chat-json textarea");
     
-    grJsonInput.value = latestJSONPayload ? JSON.stringify(latestJSONPayload) : "";
-    grJsonInput.dispatchEvent(new Event('input', { bubbles: true }));
+    grMsg.value = msg;
+    grMsg.dispatchEvent(new Event("input", { bubbles: true }));
+    grJson.value = latestExtractedJson;
+    grJson.dispatchEvent(new Event("input", { bubbles: true }));
     
-    grChatBtn.click();
-    waitForChatResponse();
-  }
+    document.querySelector("#gr-chat-btn").click();
+    
+    if (chatPolling) clearInterval(chatPolling);
+    chatPolling = setInterval(checkChatResponse, 150);
 }
 
-function waitForChatResponse() {
-  const hiddenChatOut = document.querySelector("#gr-chat-out textarea");
-  let checks = 0;
-  
-  let checker = setInterval(() => {
-    checks++;
-    if (hiddenChatOut && hiddenChatOut.value && hiddenChatOut.value.trim() !== "") {
-      clearInterval(checker);
-      const reply = hiddenChatOut.value;
-      
-      const placeholder = document.getElementById("ai-thinking-placeholder");
-      if(placeholder) placeholder.remove();
-      
-      const chatContainer = document.getElementById("chat-messages");
-      const aiDiv = document.createElement("div");
-      aiDiv.className = "fade-up";
-      aiDiv.style = "display:flex;gap:10px;align-items:start;";
-      
-      let formattedReply = reply.replace(/\n/g, '<br/>').replace(/\*\*(.*?)\*\*/g, '<strong>$1</strong>').replace(/•/g, '&bull;');
-      
-      aiDiv.innerHTML = `
-        <div class="ai-avatar" style="width:26px;height:26px;border-radius:50%;background:var(--blue);display:flex;align-items:center;justify-content:center;color:#fff;font-size:10px;font-weight:700;flex-shrink:0;margin-top:2px;">AI</div>
-        <div class="bubble-ai" style="padding:10px 14px;font-size:13px;line-height:1.5;color:var(--text);max-width:85%;">
-          ${formattedReply}
-        </div>
-      `;
-      chatContainer.appendChild(aiDiv);
-      chatContainer.scrollTop = chatContainer.scrollHeight;
-      
-      hiddenChatOut.value = "";
-      hiddenChatOut.dispatchEvent(new Event('input', { bubbles: true }));
-      
-    } else if (checks > 150) {
-      clearInterval(checker);
-      const placeholder = document.getElementById("ai-thinking-placeholder");
-      if(placeholder) placeholder.remove();
-      showToast("Agent response timed out.", "error");
+function checkChatResponse() {
+    const outEl = document.querySelector("#gr-chat-out textarea");
+    if (!outEl) return;
+    const val = outEl.value;
+    if (val && val.trim() !== "") {
+        clearInterval(chatPolling);
+        chatPolling = null;
+        outEl.value = "";
+        outEl.dispatchEvent(new Event("input", { bubbles: true }));
+        
+        const hist = document.getElementById("chat-history");
+        hist.innerHTML += `<div class="p-2 rounded bg-blue-900/10 border border-blue-900/20 text-zinc-300">AI: ${val}</div>`;
+        hist.scrollTop = hist.scrollHeight;
     }
-  }, 100);
 }
 
-function downloadCSV() {
-  if(!latestJSONPayload || !latestJSONPayload._csv_b64) return;
-  const link = document.createElement("a");
-  link.href = "data:text/csv;base64," + latestJSONPayload._csv_b64;
-  link.download = "omniparse_structured_result.csv";
-  link.click();
-}
-
-function downloadJSON() {
-  if(!latestJSONPayload) return;
-  const jsonData = JSON.stringify(latestJSONPayload, null, 2);
-  const blob = new Blob([jsonData], { type: "application/json" });
-  const link = document.createElement("a");
-  link.href = URL.createObjectURL(blob);
-  link.download = "omniparse_raw_payload.json";
-  link.click();
-}
+// Inicializační kontrola session při bootu
+setTimeout(checkLoginState, 500);
 </script>
 </body>
 </html>
 """
 
-# ─── Gradio Block Core Setup ────────────────────────────────────────────────
-with gr.Blocks(css=CUSTOM_CSS) as demo:
+# ─── GRADIO APPLICATION CONTAINER ───────────────────────────────────────────
+with gr.Blocks(css=CUSTOM_CSS, title="OmniParse AI Enterprise Terminal") as demo:
+    # Vstřikování custom HTML frontendu s kompletní logikou
     gr.HTML(HTML_UI)
 
+    # Skryté ovládací prvky (Bridge) — JS komunikuje přímo s těmito objekty
     with gr.Row(elem_id="hidden-controls", visible=False):
         with gr.Column():
-            gr_image_input = gr.Textbox(
-                label="image_b64",
-                elem_id="gr-image-input",
-                visible=False,
-            )
+            gr_image_input = gr.Textbox(label="image_b64", elem_id="gr-image-input", visible=False)
+            gr_current_user = gr.Textbox(label="current_user", elem_id="gr-current-user", visible=False)
             gr_parse_btn = gr.Button("parse", elem_id="gr-parse-btn", visible=False)
-            gr_json_output = gr.Textbox(
-                label="json_out",
-                elem_id="gr-json-output",
-                visible=False,
-            )
+            gr_json_output = gr.Textbox(label="json_out", elem_id="gr-json-output", visible=False)
 
-            gr_chat_msg = gr.Textbox(
-                label="chat_msg",
-                elem_id="gr-chat-msg",
-                visible=False,
-            )
-            gr_chat_json = gr.Textbox(
-                label="chat_json",
-                elem_id="gr-chat-json",
-                visible=False,
-            )
+            gr_chat_msg = gr.Textbox(label="chat_msg", elem_id="gr-chat-msg", visible=False)
+            gr_chat_json = gr.Textbox(label="chat_json", elem_id="gr-chat-json", visible=False)
             gr_chat_btn = gr.Button("chat", elem_id="gr-chat-btn", visible=False)
-            gr_chat_out = gr.Textbox(
-                label="chat_out",
-                elem_id="gr-chat-out",
-                visible=False,
-            )
-
+            gr_chat_out = gr.Textbox(label="chat_out", elem_id="gr-chat-out", visible=False)
+            
+            # Auth kanály pro přihlašování a registraci
+            gr_auth_user = gr.Textbox(label="auth_user", elem_id="gr-auth-user", visible=False)
+            gr_auth_pass = gr.Textbox(label="auth_pass", elem_id="gr-auth-pass", visible=False)
+            gr_login_btn = gr.Button("login", elem_id="gr-login-btn", visible=False)
+            gr_register_btn = gr.Button("register", elem_id="gr-register-btn", visible=False)
+            gr_auth_response = gr.Textbox(label="auth_response", elem_id="gr-auth-response", visible=False)
+
+    # Propojení frontend-backend eventů
     gr_parse_btn.click(
         fn=gr_parse,
-        inputs=[gr_image_input],
+        inputs=[gr_image_input, gr_current_user],
         outputs=[gr_json_output],
     )
 
@@ -925,6 +878,18 @@ with gr.Blocks(css=CUSTOM_CSS) as demo:
         inputs=[gr_chat_msg, gr_chat_json],
         outputs=[gr_chat_out],
     )
+    
+    gr_login_btn.click(
+        fn=db_login,
+        inputs=[gr_auth_user, gr_auth_pass],
+        outputs=[gr_auth_response]
+    )
+    
+    gr_register_btn.click(
+        fn=db_register,
+        inputs=[gr_auth_user, gr_auth_pass],
+        outputs=[gr_auth_response]
+    )
 
 if __name__ == "__main__":
     demo.launch()