API-based serving (api.1street.ai), English-only UI; identical UI to Darwin-9B-Opus space

.gitattributes

@@ -1,35 +1,35 @@
-*.7z filter=lfs diff=lfs merge=lfs -text
-*.arrow filter=lfs diff=lfs merge=lfs -text
-*.bin filter=lfs diff=lfs merge=lfs -text
-*.bz2 filter=lfs diff=lfs merge=lfs -text
-*.ckpt filter=lfs diff=lfs merge=lfs -text
-*.ftz filter=lfs diff=lfs merge=lfs -text
-*.gz filter=lfs diff=lfs merge=lfs -text
-*.h5 filter=lfs diff=lfs merge=lfs -text
-*.joblib filter=lfs diff=lfs merge=lfs -text
-*.lfs.* filter=lfs diff=lfs merge=lfs -text
-*.mlmodel filter=lfs diff=lfs merge=lfs -text
-*.model filter=lfs diff=lfs merge=lfs -text
-*.msgpack filter=lfs diff=lfs merge=lfs -text
-*.npy filter=lfs diff=lfs merge=lfs -text
-*.npz filter=lfs diff=lfs merge=lfs -text
-*.onnx filter=lfs diff=lfs merge=lfs -text
-*.ot filter=lfs diff=lfs merge=lfs -text
-*.parquet filter=lfs diff=lfs merge=lfs -text
-*.pb filter=lfs diff=lfs merge=lfs -text
-*.pickle filter=lfs diff=lfs merge=lfs -text
-*.pkl filter=lfs diff=lfs merge=lfs -text
-*.pt filter=lfs diff=lfs merge=lfs -text
-*.pth filter=lfs diff=lfs merge=lfs -text
-*.rar filter=lfs diff=lfs merge=lfs -text
-*.safetensors filter=lfs diff=lfs merge=lfs -text
-saved_model/**/* filter=lfs diff=lfs merge=lfs -text
-*.tar.* filter=lfs diff=lfs merge=lfs -text
-*.tar filter=lfs diff=lfs merge=lfs -text
-*.tflite filter=lfs diff=lfs merge=lfs -text
-*.tgz filter=lfs diff=lfs merge=lfs -text
-*.wasm filter=lfs diff=lfs merge=lfs -text
-*.xz filter=lfs diff=lfs merge=lfs -text
-*.zip filter=lfs diff=lfs merge=lfs -text
-*.zst filter=lfs diff=lfs merge=lfs -text
-*tfevents* filter=lfs diff=lfs merge=lfs -text
+*.7z filter=lfs diff=lfs merge=lfs -text
+*.arrow filter=lfs diff=lfs merge=lfs -text
+*.bin filter=lfs diff=lfs merge=lfs -text
+*.bz2 filter=lfs diff=lfs merge=lfs -text
+*.ckpt filter=lfs diff=lfs merge=lfs -text
+*.ftz filter=lfs diff=lfs merge=lfs -text
+*.gz filter=lfs diff=lfs merge=lfs -text
+*.h5 filter=lfs diff=lfs merge=lfs -text
+*.joblib filter=lfs diff=lfs merge=lfs -text
+*.lfs.* filter=lfs diff=lfs merge=lfs -text
+*.mlmodel filter=lfs diff=lfs merge=lfs -text
+*.model filter=lfs diff=lfs merge=lfs -text
+*.msgpack filter=lfs diff=lfs merge=lfs -text
+*.npy filter=lfs diff=lfs merge=lfs -text
+*.npz filter=lfs diff=lfs merge=lfs -text
+*.onnx filter=lfs diff=lfs merge=lfs -text
+*.ot filter=lfs diff=lfs merge=lfs -text
+*.parquet filter=lfs diff=lfs merge=lfs -text
+*.pb filter=lfs diff=lfs merge=lfs -text
+*.pickle filter=lfs diff=lfs merge=lfs -text
+*.pkl filter=lfs diff=lfs merge=lfs -text
+*.pt filter=lfs diff=lfs merge=lfs -text
+*.pth filter=lfs diff=lfs merge=lfs -text
+*.rar filter=lfs diff=lfs merge=lfs -text
+*.safetensors filter=lfs diff=lfs merge=lfs -text
+saved_model/**/* filter=lfs diff=lfs merge=lfs -text
+*.tar.* filter=lfs diff=lfs merge=lfs -text
+*.tar filter=lfs diff=lfs merge=lfs -text
+*.tflite filter=lfs diff=lfs merge=lfs -text
+*.tgz filter=lfs diff=lfs merge=lfs -text
+*.wasm filter=lfs diff=lfs merge=lfs -text
+*.xz filter=lfs diff=lfs merge=lfs -text
+*.zip filter=lfs diff=lfs merge=lfs -text
+*.zst filter=lfs diff=lfs merge=lfs -text
+*tfevents* filter=lfs diff=lfs merge=lfs -text

README.md

@@ -1,13 +1,26 @@
 ---
 title: Darwin 9B NEG
-emoji: 💻
-colorFrom: gray
-colorTo: purple
+emoji: 🧬
+colorFrom: indigo
+colorTo: pink
 sdk: gradio
-sdk_version: 6.14.0
-python_version: '3.13'
+sdk_version: 6.10.0
 app_file: app.py
 pinned: false
+license: apache-2.0
+short_description: Darwin-9B-NEG reasoning model — API-served chat demo
 ---
 
-Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
+# Darwin-9B-NEG — API Chat Demo
+
+A lightweight chat demo for **Darwin-9B-NEG**, served over an OpenAI-compatible
+API (no local GPU). The UI is identical to the Darwin-9B-Opus space; only the
+backend is API-based.
+
+- **Model**: [FINAL-Bench/Darwin-9B-NEG](https://huggingface.co/FINAL-Bench/Darwin-9B-NEG)
+- **GPQA Diamond**: #22 globally (84.34)
+- **Serving**: OpenAI-compatible streaming API
+- Introduced in [Darwin Family](https://arxiv.org/abs/2605.14386).
+
+Optional Space secrets: `VIDRAFT_API_BASE`, `VIDRAFT_API_MODEL`,
+`VIDRAFT_API_KEY`, `OAUTH_CLIENT_ID`, `OAUTH_CLIENT_SECRET`, `BRAVE_API_KEY`.

app.py

@@ -0,0 +1,390 @@
+"""
+🧬 Darwin-9B-NEG — API Serving (OpenAI-compatible)
+No local GPU. Streams from the VIDRAFT inference API (api.1street.ai).
+Custom frontend (index.html) preserved exactly — only the backend is API-based.
+"""
+import sys
+print(f"[BOOT] Python {sys.version}", flush=True)
+
+import base64, os, re, json
+from typing import Generator, Optional
+
+import gradio as gr
+print(f"[BOOT] gradio {gr.__version__}", flush=True)
+
+import requests, httpx, uvicorn
+from fastapi import FastAPI, Request
+from fastapi.responses import HTMLResponse, RedirectResponse, JSONResponse
+from urllib.parse import urlencode
+import pathlib, secrets
+
+import urllib3
+urllib3.disable_warnings(urllib3.exceptions.InsecureRequestWarning)
+
+# ══════════════════════════════════════════════════════════════════════════════
+# 1.  MODEL / API CONFIG
+# ══════════════════════════════════════════════════════════════════════════════
+API_BASE   = os.getenv("VIDRAFT_API_BASE", "https://api.1street.ai")
+API_MODEL  = os.getenv("VIDRAFT_API_MODEL", "vidraft/darwin-9b-neg")
+API_KEY    = os.getenv("VIDRAFT_API_KEY", "")   # optional bearer; empty = no auth
+
+MODEL_ID   = "FINAL-Bench/Darwin-9B-NEG"
+MODEL_NAME = "Darwin-9B-NEG"
+MODEL_CAP  = {
+    "arch": "Qwen3.5 Dense", "active": "9B",
+    "ctx": "131K", "thinking": True, "vision": False,
+    "max_tokens": 8192, "temp_max": 1.5,
+}
+
+PRESETS = {
+    "general":   "You are Darwin-9B-NEG, a highly capable reasoning model created by VIDRAFT via Negentropy distillation. Think step by step for complex questions.",
+    "code":      "You are an expert software engineer. Write clean, efficient, well-commented code. Explain your approach before writing. Use modern best practices.",
+    "math":      "You are a world-class mathematician. Break problems step-by-step. Show full working. Use LaTeX where helpful.",
+    "creative":  "You are a brilliant creative writer. Be imaginative, vivid, and engaging. Adapt tone and style to the request.",
+    "translate": "You are a professional translator. Provide accurate, natural-sounding translations with cultural context.",
+    "research":  "You are a rigorous research analyst. Provide structured, well-reasoned analysis. Identify assumptions and acknowledge uncertainty.",
+}
+
+print(f"[API] base={API_BASE} model={API_MODEL} auth={'yes' if API_KEY else 'no'}", flush=True)
+
+# ══════════════════════════════════════════════════════════════════════════════
+# 2.  THINKING MODE HELPERS  (unchanged — drives the reasoning-chain UI)
+# ══════════════════════════════════════════════════════════════════════════════
+def parse_think_blocks(text: str) -> tuple[str, str]:
+    m = re.search(r"<think>(.*?)</think>\s*", text, re.DOTALL)
+    return (m.group(1).strip(), text[m.end():].strip()) if m else ("", text)
+
+def _is_thinking_line(line: str) -> bool:
+    l = line.strip()
+    if not l:
+        return True
+    think_starts = [
+        "The user", "the user", "This is", "this is", "I should", "I need to",
+        "Let me", "let me", "My task", "my task", "I'll ", "I will",
+        "Since ", "since ", "Now,", "now,", "So,", "so,", "First,", "first,",
+        "Okay", "okay", "Alright", "Hmm", "Wait", "Actually",
+        "The question", "the question", "The input", "the input",
+        "The request", "the request", "The prompt", "the prompt",
+        "Thinking Process", "Thinking process", "**Thinking",
+        "Step ", "step ", "Approach:", "Analysis:", "Reasoning:",
+        "1. **", "2. **", "3. **", "4. **", "5. **",
+    ]
+    for s in think_starts:
+        if l.startswith(s):
+            return True
+    if l.startswith(("- ", "* ", "○ ")) and any(c.isascii() and c.isalpha() for c in l[:20]):
+        if not any(ord(c) > 0x1100 for c in l[:30]):
+            return True
+    return False
+
+def _split_thinking_answer(raw: str) -> tuple:
+    lines = raw.split("\n")
+    answer_start = -1
+    for i, line in enumerate(lines):
+        if not _is_thinking_line(line):
+            if any(ord(c) > 0x1100 for c in line.strip()[:10]):
+                answer_start = i
+                break
+            if i > 2 and not _is_thinking_line(line):
+                if all(not lines[j].strip() for j in range(max(0, i - 2), i)):
+                    answer_start = i
+                    break
+    if answer_start > 0:
+        return "\n".join(lines[:answer_start]).strip(), "\n".join(lines[answer_start:]).strip()
+    return "", raw
+
+def format_response(raw: str) -> str:
+    chain, answer = parse_think_blocks(raw)
+    if chain:
+        return (
+            "<details>\n<summary>🧠 Reasoning Chain — click to expand</summary>\n\n"
+            f"{chain}\n\n</details>\n\n{answer}"
+        )
+    if "<think>" in raw and "</think>" not in raw:
+        think_len = len(raw) - raw.index("<think>") - 7
+        return f"🧠 Reasoning... ({think_len} chars)"
+    first_line = raw.strip().split("\n")[0] if raw.strip() else ""
+    if _is_thinking_line(first_line) and len(raw) > 20:
+        thinking, answer = _split_thinking_answer(raw)
+        if thinking and answer:
+            return (
+                f"<details>\n<summary>🧠 Reasoning Chain ({len(thinking)} chars)</summary>\n\n"
+                f"{thinking}\n\n</details>\n\n{answer}"
+            )
+        elif thinking and not answer:
+            return f"🧠 Reasoning... ({len(raw)} chars)"
+    return raw
+
+# ══════════════════════════════════════════════════════════════════════════════
+# 3.  GENERATION — streamed from the VIDRAFT OpenAI-compatible API
+# ══════════════════════════════════════════════════════════════════════════════
+def generate_reply(
+    message:        str,
+    history:        list,
+    thinking_mode:  str,
+    image_input,
+    system_prompt:  str,
+    max_new_tokens: int,
+    temperature:    float,
+    top_p:          float,
+) -> Generator[str, None, None]:
+
+    max_new_tokens = min(int(max_new_tokens), MODEL_CAP["max_tokens"])
+    temperature    = min(float(temperature),  MODEL_CAP["temp_max"])
+
+    # ── Build the message list ──
+    messages: list[dict] = []
+    if system_prompt.strip():
+        messages.append({"role": "system", "content": system_prompt.strip()})
+
+    for turn in history:
+        if isinstance(turn, dict):
+            role = turn.get("role", "")
+            raw  = turn.get("content") or ""
+            text = (" ".join(p.get("text", "") for p in raw
+                              if isinstance(p, dict) and p.get("type") == "text")
+                    if isinstance(raw, list) else str(raw))
+            if role == "user":
+                messages.append({"role": "user", "content": text})
+            elif role == "assistant":
+                _, clean = parse_think_blocks(text)
+                messages.append({"role": "assistant", "content": clean})
+        else:
+            try:
+                u, a = (turn[0] or None), (turn[1] if len(turn) > 1 else None)
+            except (IndexError, TypeError):
+                continue
+            def _txt(v):
+                if v is None: return None
+                if isinstance(v, list):
+                    return " ".join(p.get("text", "") for p in v
+                                    if isinstance(p, dict) and p.get("type") == "text")
+                return str(v)
+            ut, at = _txt(u), _txt(a)
+            if ut: messages.append({"role": "user", "content": ut})
+            if at:
+                _, clean = parse_think_blocks(at)
+                messages.append({"role": "assistant", "content": clean})
+
+    messages.append({"role": "user", "content": message})
+
+    payload = {
+        "model": API_MODEL,
+        "messages": messages,
+        "max_tokens": max_new_tokens,
+        "temperature": max(float(temperature), 0.0),
+        "top_p": float(top_p),
+        "stream": True,
+        "stream_options": {"include_usage": True},
+    }
+    headers = {"Content-Type": "application/json"}
+    if API_KEY:
+        headers["Authorization"] = f"Bearer {API_KEY}"
+
+    print(f"[GEN] -> {API_BASE} model={API_MODEL} max_new={max_new_tokens} temp={temperature}", flush=True)
+
+    output = ""
+    try:
+        with httpx.Client(timeout=httpx.Timeout(300.0, connect=15.0)) as client:
+            with client.stream("POST", f"{API_BASE}/v1/chat/completions",
+                                json=payload, headers=headers) as r:
+                if r.status_code != 200:
+                    body = r.read().decode(errors="ignore")[:300]
+                    yield f"**❌ API error {r.status_code}:** `{body}`"
+                    return
+                for line in r.iter_lines():
+                    if not line:
+                        continue
+                    if line.startswith("data: "):
+                        line = line[6:]
+                    if line.strip() == "[DONE]":
+                        break
+                    try:
+                        chunk = json.loads(line)
+                    except Exception:
+                        continue
+                    choices = chunk.get("choices") or []
+                    if choices:
+                        delta = choices[0].get("delta") or {}
+                        piece = delta.get("content") or ""
+                        if piece:
+                            output += piece
+                            yield format_response(output)
+    except Exception as e:
+        if output:
+            yield format_response(output)
+        else:
+            yield f"**❌ Generation error:** `{e}`"
+        return
+
+    if output:
+        print(f"[GEN] Done — {len(output)} chars", flush=True)
+        yield format_response(output)
+    else:
+        yield "**⚠️ The model returned an empty response.** Please try again."
+
+
+# ══════════════════════════════════════════════════════════════════════════════
+# 4.  GRADIO BLOCKS  (api_name="chat" — index.html calls /gradio_api/call/chat)
+# ══════════════════════════════════════════════════════════════════════════════
+with gr.Blocks(title=MODEL_NAME) as gradio_demo:
+    thinking_toggle = gr.Radio(
+        choices=["⚡ Fast Mode  (direct answer)",
+                 "🧠 Thinking Mode  (chain-of-thought reasoning)"],
+        value="⚡ Fast Mode  (direct answer)",
+        visible=False,
+    )
+    image_input    = gr.Textbox(value="", visible=False)
+    system_prompt  = gr.Textbox(value=PRESETS["general"], visible=False)
+    max_new_tokens = gr.Slider(minimum=64, maximum=8192, value=4096, visible=False)
+    temperature    = gr.Slider(minimum=0.0, maximum=1.5, value=0.6,  visible=False)
+    top_p          = gr.Slider(minimum=0.1, maximum=1.0, value=0.9,  visible=False)
+
+    gr.ChatInterface(
+        fn=generate_reply,
+        api_name="chat",
+        additional_inputs=[
+            thinking_toggle, image_input,
+            system_prompt, max_new_tokens, temperature, top_p,
+        ],
+    )
+
+# ══════════════════════════════════════════════════════════════════════════════
+# 5.  FASTAPI — index.html + OAuth + utility APIs  (unchanged structure)
+# ══════════════════════════════════════════════════════════════════════════════
+fapp    = FastAPI()
+SESSIONS: dict[str, dict] = {}
+HTML    = pathlib.Path(__file__).parent / "index.html"
+
+CLIENT_ID     = os.getenv("OAUTH_CLIENT_ID", "")
+CLIENT_SECRET = os.getenv("OAUTH_CLIENT_SECRET", "")
+SPACE_HOST    = os.getenv("SPACE_HOST", "localhost:7860")
+REDIRECT_URI  = f"https://{SPACE_HOST}/login/callback"
+
+print(f"[OAuth] CLIENT_ID set: {bool(CLIENT_ID)}")
+print(f"[OAuth] SPACE_HOST: {SPACE_HOST}")
+HF_AUTH_URL   = "https://huggingface.co/oauth/authorize"
+HF_TOKEN_URL  = "https://huggingface.co/oauth/token"
+HF_USER_URL   = "https://huggingface.co/oauth/userinfo"
+SCOPES        = os.getenv("OAUTH_SCOPES", "openid profile")
+
+def _sid(req: Request) -> Optional[str]:
+    return req.cookies.get("mc_session")
+def _user(req: Request) -> Optional[dict]:
+    sid = _sid(req)
+    return SESSIONS.get(sid) if sid else None
+
+@fapp.get("/")
+async def root(request: Request):
+    html = HTML.read_text(encoding="utf-8") if HTML.exists() else "<h2>index.html missing</h2>"
+    return HTMLResponse(html)
+
+@fapp.get("/oauth/user")
+async def oauth_user(request: Request):
+    u = _user(request)
+    return JSONResponse(u) if u else JSONResponse({"logged_in": False}, status_code=401)
+
+@fapp.get("/oauth/login")
+async def oauth_login(request: Request):
+    if not CLIENT_ID:
+        return RedirectResponse("/?oauth_error=not_configured")
+    state = secrets.token_urlsafe(16)
+    params = {"response_type": "code", "client_id": CLIENT_ID, "redirect_uri": REDIRECT_URI, "scope": SCOPES, "state": state}
+    return RedirectResponse(f"{HF_AUTH_URL}?{urlencode(params)}", status_code=302)
+
+@fapp.get("/login/callback")
+async def oauth_callback(code: str = "", error: str = "", state: str = ""):
+    if error or not code:
+        return RedirectResponse("/?auth_error=1")
+    basic = base64.b64encode(f"{CLIENT_ID}:{CLIENT_SECRET}".encode()).decode()
+    async with httpx.AsyncClient() as client:
+        tok = await client.post(HF_TOKEN_URL, data={"grant_type": "authorization_code", "code": code, "redirect_uri": REDIRECT_URI},
+                                headers={"Accept": "application/json", "Authorization": f"Basic {basic}"})
+        if tok.status_code != 200:
+            return RedirectResponse("/?auth_error=1")
+        access_token = tok.json().get("access_token", "")
+        if not access_token:
+            return RedirectResponse("/?auth_error=1")
+        uinfo = await client.get(HF_USER_URL, headers={"Authorization": f"Bearer {access_token}"})
+        if uinfo.status_code != 200:
+            return RedirectResponse("/?auth_error=1")
+        user = uinfo.json()
+    sid = secrets.token_urlsafe(32)
+    SESSIONS[sid] = {
+        "logged_in": True,
+        "username": user.get("preferred_username", user.get("name", "User")),
+        "name": user.get("name", ""),
+        "avatar": user.get("picture", ""),
+        "profile": f"https://huggingface.co/{user.get('preferred_username', '')}",
+    }
+    resp = RedirectResponse("/")
+    resp.set_cookie("mc_session", sid, httponly=True, samesite="lax", secure=True, max_age=60 * 60 * 24 * 7)
+    return resp
+
+@fapp.get("/oauth/logout")
+async def oauth_logout(request: Request):
+    sid = _sid(request)
+    if sid and sid in SESSIONS: del SESSIONS[sid]
+    resp = RedirectResponse("/")
+    resp.delete_cookie("mc_session")
+    return resp
+
+@fapp.get("/health")
+async def health():
+    return {"status": "ok", "model": MODEL_ID, "serving": "api", "api_base": API_BASE}
+
+# ── Web Search API (Brave) ──
+BRAVE_API_KEY = os.getenv("BRAVE_API_KEY", "")
+
+@fapp.post("/api/search")
+async def api_search(request: Request):
+    body = await request.json()
+    query = body.get("query", "").strip()
+    if not query:
+        return JSONResponse({"error": "empty query"}, status_code=400)
+    if not BRAVE_API_KEY:
+        return JSONResponse({"error": "BRAVE_API_KEY not set"}, status_code=500)
+    try:
+        r = requests.get(
+            "https://api.search.brave.com/res/v1/web/search",
+            headers={"X-Subscription-Token": BRAVE_API_KEY, "Accept": "application/json"},
+            params={"q": query, "count": 5}, timeout=10,
+        )
+        r.raise_for_status()
+        results = r.json().get("web", {}).get("results", [])
+        items = [{"title": it.get("title", ""), "desc": it.get("description", ""), "url": it.get("url", "")} for it in results[:5]]
+        return JSONResponse({"results": items})
+    except Exception as e:
+        return JSONResponse({"error": str(e)}, status_code=500)
+
+# ── PDF Text Extraction ──
+@fapp.post("/api/extract-pdf")
+async def api_extract_pdf(request: Request):
+    try:
+        body = await request.json()
+        b64 = body.get("data", "")
+        if "," in b64:
+            b64 = b64.split(",", 1)[1]
+        pdf_bytes = base64.b64decode(b64)
+        text = ""
+        try:
+            import fitz
+            doc = fitz.open(stream=pdf_bytes, filetype="pdf")
+            for page in doc:
+                text += page.get_text() + "\n"
+        except ImportError:
+            content = pdf_bytes.decode("utf-8", errors="ignore")
+            text = re.sub(r'[^\x20-\x7E\n\r]', '', content)
+        text = text.strip()[:8000]
+        return JSONResponse({"text": text, "chars": len(text)})
+    except Exception as e:
+        return JSONResponse({"error": str(e)}, status_code=500)
+
+# ══════════════════════════════════════════════════════════════════════════════
+# 6.  MOUNT & RUN
+# ══════════════════════════════════════════════════════════════════════════════
+app = gr.mount_gradio_app(fapp, gradio_demo, path="/gradio")
+
+if __name__ == "__main__":
+    print(f"[BOOT] {MODEL_NAME} · API serving · Ready", flush=True)
+    uvicorn.run(app, host="0.0.0.0", port=7860)

index.html

@@ -0,0 +1,757 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+<meta charset="UTF-8">
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+<title>🧬 Darwin-9B-Opus</title>
+<link rel="preconnect" href="https://fonts.googleapis.com">
+<link href="https://fonts.googleapis.com/css2?family=Instrument+Serif:ital@0;1&family=Cabinet+Grotesk:wght@300;400;500;600;700;800&family=Geist+Mono:wght@300;400;500&display=swap" rel="stylesheet">
+<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/github-dark.min.css">
+<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/highlight.min.js"></script>
+<script src="https://cdnjs.cloudflare.com/ajax/libs/marked/12.0.1/marked.min.js"></script>
+<style>
+*{margin:0;padding:0;box-sizing:border-box;}
+:root{
+  --cream:#faf8f5;--paper:#f5f2ed;--white:#ffffff;--fog:#ede9e3;
+  --line:#e4dfd8;--line2:#d5cfc7;
+  --ink:#1c1917;--ink2:#44403c;--ink3:#78716c;--ink4:#a8a29e;
+  --v:#6d28d9;--v2:#7c3aed;--vg:rgba(109,40,217,.08);
+  --teal:#0d9488;--tg:rgba(13,148,136,.07);
+  --rose:#e11d48;--green:#16a34a;--amber:#d97706;
+  --r:20px;--r-sm:12px;--r-xs:8px;
+  --sh:0 2px 12px rgba(28,25,23,.06),0 1px 3px rgba(28,25,23,.04);
+  --sh2:0 8px 32px rgba(28,25,23,.08),0 2px 8px rgba(28,25,23,.04);
+  --sh3:0 20px 60px rgba(28,25,23,.10),0 4px 16px rgba(28,25,23,.06);
+  --fd:'Instrument Serif',serif;
+  --fb:'Cabinet Grotesk',sans-serif;
+  --fm:'Geist Mono',monospace;
+}
+html,body{height:100%;overflow:hidden;background:var(--cream);color:var(--ink);font-family:var(--fb);-webkit-font-smoothing:antialiased;}
+
+.bg{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none;}
+.orb{position:absolute;border-radius:50%;filter:blur(80px);opacity:.5;animation:drift linear infinite;}
+.orb1{width:500px;height:500px;background:radial-gradient(circle,rgba(109,40,217,.35),transparent 70%);top:-100px;left:-100px;animation-duration:22s;}
+.orb2{width:380px;height:380px;background:radial-gradient(circle,rgba(16,185,129,.28),transparent 70%);top:5%;right:-60px;animation-duration:28s;animation-delay:-9s;}
+.orb3{width:320px;height:320px;background:radial-gradient(circle,rgba(252,211,77,.22),transparent 70%);bottom:-60px;left:35%;animation-duration:19s;animation-delay:-5s;}
+@keyframes drift{0%{transform:translate(0,0) scale(1);}33%{transform:translate(40px,-30px) scale(1.05);}66%{transform:translate(-20px,20px) scale(.97);}100%{transform:translate(0,0) scale(1);}}
+.bg-grid{position:absolute;inset:0;background-image:radial-gradient(circle,rgba(28,25,23,.06) 1px,transparent 1px);background-size:28px 28px;}
+
+.shell{position:relative;z-index:1;display:grid;grid-template-columns:280px 1fr;height:100vh;}
+
+/* SIDEBAR */
+.sidebar{display:flex;flex-direction:column;background:rgba(255,255,255,.75);backdrop-filter:blur(24px);border-right:1px solid var(--line);overflow:hidden;}
+.logo-area{padding:20px 18px 14px;border-bottom:1px solid var(--line);}
+.logo-row{display:flex;align-items:center;gap:10px;margin-bottom:8px;}
+.logo-icon{width:42px;height:42px;border-radius:13px;flex-shrink:0;background:linear-gradient(135deg,#6d28d9,#a78bfa,#10b981);display:flex;align-items:center;justify-content:center;font-size:22px;box-shadow:0 4px 14px rgba(109,40,217,.3);}
+.logo-text{line-height:1.2;}
+.logo-name{font-family:var(--fd);font-size:20px;color:var(--ink);}
+.logo-name em{color:var(--v);font-style:italic;}
+.logo-sub{font-size:9px;font-weight:700;letter-spacing:2.5px;text-transform:uppercase;color:var(--ink4);}
+
+.model-card{margin:14px;padding:14px 16px;border-radius:var(--r-sm);border:1.5px solid rgba(109,40,217,.25);background:linear-gradient(135deg,rgba(109,40,217,.04),rgba(16,185,129,.03));box-shadow:var(--sh);}
+.mc-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;}
+.mc-name{font-size:13px;font-weight:700;color:var(--ink);}
+.mc-arch{font-size:9px;font-weight:700;letter-spacing:.4px;padding:2px 8px;border-radius:10px;background:var(--vg);color:var(--v);font-family:var(--fm);}
+.mc-stats{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:8px;}
+.mc-stat{font-size:9px;font-weight:600;padding:2px 7px;border-radius:6px;font-family:var(--fm);}
+.mc-ok{background:rgba(22,163,74,.09);color:#16a34a;}
+.mc-hl{background:rgba(109,40,217,.08);color:var(--v);}
+.mc-desc{font-size:10px;color:var(--ink3);line-height:1.6;}
+
+.settings{padding:14px;flex:1;overflow-y:auto;}
+.settings::-webkit-scrollbar{width:3px;}
+.settings::-webkit-scrollbar-thumb{background:var(--line2);border-radius:10px;}
+.field{margin-bottom:12px;}
+.field-lbl{font-size:9px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--ink4);margin-bottom:6px;display:block;}
+.field textarea{width:100%;background:var(--fog);border:1.5px solid var(--line);border-radius:var(--r-xs);color:var(--ink);font-family:var(--fb);font-size:12px;line-height:1.6;padding:8px 10px;resize:none;outline:none;transition:border-color .2s,box-shadow .2s;height:64px;}
+.field textarea:focus{border-color:rgba(109,40,217,.35);box-shadow:0 0 0 3px rgba(109,40,217,.08);}
+
+.toggle-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;}
+.toggle-info{flex:1;}
+.tl{font-size:11px;font-weight:600;color:var(--ink2);}
+.ts{font-size:9px;color:var(--ink4);margin-top:1px;}
+.toggle{position:relative;width:36px;height:20px;flex-shrink:0;}
+.toggle input{opacity:0;width:0;height:0;position:absolute;}
+.t-track{position:absolute;inset:0;border-radius:10px;background:var(--line2);cursor:pointer;transition:background .22s;}
+.toggle input:checked+.t-track{background:linear-gradient(135deg,var(--v),var(--v2));}
+.t-thumb{position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:var(--white);box-shadow:0 1px 4px rgba(0,0,0,.15);transition:transform .22s cubic-bezier(.4,0,.2,1);}
+.toggle input:checked~.t-thumb{transform:translateX(16px);}
+
+.presets{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:6px;}
+.chip{font-size:9px;font-weight:600;padding:3px 9px;border-radius:20px;background:var(--fog);border:1px solid var(--line);color:var(--ink3);cursor:pointer;transition:all .2s;white-space:nowrap;}
+.chip:hover{background:rgba(109,40,217,.08);border-color:rgba(109,40,217,.25);color:var(--v);}
+
+.sl-wrap{margin-bottom:10px;}
+.sl-meta{display:flex;justify-content:space-between;align-items:center;margin-bottom:5px;}
+.sl-title{font-size:11px;font-weight:600;color:var(--ink2);}
+.sl-val{font-size:10px;font-weight:700;font-family:var(--fm);background:var(--fog);color:var(--ink3);padding:1px 6px;border-radius:5px;border:1px solid var(--line);}
+input[type=range]{width:100%;height:4px;appearance:none;background:var(--line);border-radius:2px;outline:none;cursor:pointer;}
+input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:15px;height:15px;border-radius:50%;background:linear-gradient(135deg,var(--v),var(--v2));box-shadow:0 2px 6px rgba(109,40,217,.3);border:2px solid var(--white);cursor:pointer;transition:transform .2s;}
+input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.2);}
+
+.clear-btn{width:100%;padding:8px;border-radius:var(--r-xs);background:var(--fog);border:1.5px solid var(--line);color:var(--ink3);font-family:var(--fb);font-size:11px;font-weight:600;cursor:pointer;transition:all .2s;margin-top:4px;}
+.clear-btn:hover{border-color:rgba(225,29,72,.3);color:var(--rose);}
+
+.section-lbl{font-size:9px;font-weight:700;letter-spacing:2.5px;text-transform:uppercase;color:var(--ink4);margin-bottom:10px;padding:0 2px;}
+
+/* MAIN CHAT */
+.chat-main{display:flex;flex-direction:column;background:rgba(250,248,245,.5);overflow:hidden;}
+.chat-hdr{padding:14px 22px;border-bottom:1px solid var(--line);background:rgba(255,255,255,.82);backdrop-filter:blur(20px);display:flex;align-items:center;justify-content:space-between;flex-shrink:0;}
+.hdr-left{display:flex;align-items:center;gap:10px;}
+.model-pill{display:flex;align-items:center;gap:7px;padding:5px 13px;border-radius:30px;background:linear-gradient(135deg,rgba(109,40,217,.08),rgba(16,185,129,.06));border:1px solid rgba(109,40,217,.2);}
+.dot{width:7px;height:7px;border-radius:50%;background:linear-gradient(135deg,var(--v),#10b981);animation:pulse 2s ease-in-out infinite;}
+@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(109,40,217,.4);}50%{box-shadow:0 0 0 4px rgba(109,40,217,0);}}
+.model-name{font-size:12px;font-weight:700;color:var(--v);font-family:var(--fm);}
+.mode-tag{font-size:10px;font-weight:600;padding:4px 10px;border-radius:20px;background:var(--fog);border:1px solid var(--line);color:var(--ink3);font-family:var(--fm);transition:all .3s;}
+.mode-tag.thinking{background:rgba(13,148,136,.08);border-color:rgba(13,148,136,.25);color:var(--teal);}
+.hdr-stats{display:flex;gap:16px;}
+.hstat{text-align:center;}
+.hstat-n{font-size:17px;font-weight:800;color:var(--ink);font-family:var(--fd);}
+.hstat-l{font-size:9px;font-weight:600;letter-spacing:.8px;text-transform:uppercase;color:var(--ink4);}
+
+.hf-login-btn{display:inline-flex;align-items:center;gap:8px;padding:7px 14px;border-radius:22px;border:1.5px solid rgba(109,40,217,.25);background:linear-gradient(135deg,rgba(109,40,217,.1),rgba(139,92,246,.08));color:var(--v);font-family:var(--fb);font-size:12px;font-weight:700;cursor:pointer;text-decoration:none;transition:all .22s;white-space:nowrap;}
+.hf-login-btn:hover{background:linear-gradient(135deg,rgba(109,40,217,.18),rgba(139,92,246,.14));border-color:rgba(109,40,217,.45);box-shadow:0 4px 14px rgba(109,40,217,.18);transform:translateY(-1px);}
+.user-chip{display:inline-flex;align-items:center;gap:8px;padding:4px 12px 4px 5px;border-radius:22px;border:1.5px solid var(--line);background:rgba(255,255,255,.8);font-size:12px;font-weight:600;color:var(--ink2);cursor:pointer;text-decoration:none;transition:all .2s;}
+.user-chip:hover{border-color:rgba(109,40,217,.3);box-shadow:var(--sh);}
+.user-avatar{width:24px;height:24px;border-radius:50%;background:linear-gradient(135deg,var(--v),#a78bfa);display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;color:#fff;overflow:hidden;flex-shrink:0;}
+.user-avatar img{width:100%;height:100%;object-fit:cover;border-radius:50%;}
+.logout-btn{padding:5px 11px;border-radius:18px;border:1.5px solid var(--line);background:var(--fog);color:var(--ink4);font-size:11px;font-weight:600;cursor:pointer;transition:all .2s;font-family:var(--fb);}
+.logout-btn:hover{border-color:rgba(225,29,72,.3);color:var(--rose);}
+
+.messages{flex:1;overflow-y:auto;padding:22px 40px;display:flex;flex-direction:column;gap:18px;scroll-behavior:smooth;}
+.messages::-webkit-scrollbar{width:4px;}
+.messages::-webkit-scrollbar-thumb{background:var(--line2);border-radius:10px;}
+
+.welcome{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:30px 36px;gap:20px;flex:1;min-height:400px;}
+.welcome-icon{width:72px;height:72px;border-radius:20px;background:linear-gradient(135deg,#6d28d9,#a78bfa,#10b981);display:flex;align-items:center;justify-content:center;font-size:34px;box-shadow:0 8px 30px rgba(109,40,217,.25);animation:float 4s ease-in-out infinite;}
+@keyframes float{0%,100%{transform:translateY(0);}50%{transform:translateY(-8px);}}
+.welcome-title{font-family:var(--fd);font-size:34px;color:var(--ink);line-height:1.2;}
+.welcome-title em{font-style:italic;color:var(--v);}
+.welcome-sub{font-size:13px;color:var(--ink3);line-height:1.7;max-width:450px;}
+.welcome-badges{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;}
+.welcome-badge{font-size:11px;font-weight:600;padding:4px 12px;border-radius:20px;font-family:var(--fm);}
+.wb-purple{background:rgba(109,40,217,.08);color:var(--v);border:1px solid rgba(109,40,217,.15);}
+.wb-green{background:rgba(16,185,129,.08);color:#059669;border:1px solid rgba(16,185,129,.15);}
+.wb-amber{background:rgba(217,119,6,.08);color:var(--amber);border:1px solid rgba(217,119,6,.15);}
+.ex-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:9px;width:100%;max-width:500px;}
+.ex-card{background:var(--white);border:1.5px solid var(--line);border-radius:var(--r-sm);padding:12px 14px;cursor:pointer;text-align:left;transition:all .22s;}
+.ex-card:hover{border-color:rgba(109,40,217,.3);box-shadow:var(--sh);transform:translateY(-2px);}
+.ex-icon{font-size:16px;margin-bottom:5px;display:block;}
+.ex-title{font-size:11px;font-weight:700;color:var(--ink);margin-bottom:2px;}
+.ex-desc{font-size:10px;color:var(--ink3);line-height:1.5;}
+
+.msg{display:flex;gap:10px;animation:msgIn .32s cubic-bezier(.34,1.56,.64,1) both;}
+@keyframes msgIn{from{opacity:0;transform:translateY(10px) scale(.97);}to{opacity:1;transform:none;}}
+.msg.user{flex-direction:row-reverse;}
+.avatar{width:30px;height:30px;border-radius:9px;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:13px;margin-top:2px;}
+.msg.user .avatar{background:linear-gradient(135deg,var(--v),#a78bfa);color:#fff;}
+.msg.bot .avatar{background:linear-gradient(135deg,#f0fdf4,#dcfce7);border:1px solid #d1fae5;font-size:15px;}
+.body{max-width:82%;display:flex;flex-direction:column;gap:3px;}
+.msg.user .body{align-items:flex-end;}
+.bubble{padding:11px 15px;border-radius:17px;font-size:13.5px;line-height:1.7;color:var(--ink);}
+.msg.user .bubble{background:linear-gradient(135deg,#6d28d9,#7c3aed);color:#fff;border-radius:17px 3px 17px 17px;box-shadow:0 4px 16px rgba(109,40,217,.22);}
+.msg.bot .bubble{background:var(--white);border:1px solid var(--line);border-radius:3px 17px 17px 17px;box-shadow:var(--sh);margin-left:8px;padding:16px 22px;}
+.msg-time{font-size:9px;color:var(--ink4);padding:0 3px;font-family:var(--fm);}
+
+.think-blk{background:linear-gradient(135deg,rgba(13,148,136,.04),rgba(6,182,212,.04));border:1px solid rgba(13,148,136,.2);border-radius:9px;padding:8px 12px;margin-bottom:10px;}
+.think-hdr{display:flex;align-items:center;gap:6px;cursor:pointer;font-size:10px;font-weight:700;color:var(--teal);letter-spacing:.4px;text-transform:uppercase;user-select:none;}
+.think-hdr::before{content:'▶';font-size:8px;transition:transform .2s;}
+.think-blk.open .think-hdr::before{content:'▼';}
+.think-body{margin-top:7px;display:none;border-top:1px solid rgba(13,148,136,.15);padding-top:7px;font-size:12px;color:var(--ink3);line-height:1.6;}
+.think-blk.open .think-body{display:block;}
+
+.bubble pre{background:#0d1117;border:1px solid rgba(255,255,255,.08);border-radius:8px;padding:10px 12px;margin:7px 0;overflow-x:auto;font-family:var(--fm);font-size:11.5px;line-height:1.6;position:relative;}
+.bubble code{font-family:var(--fm);font-size:11.5px;background:var(--fog);padding:1px 5px;border-radius:4px;}
+.bubble pre code{background:transparent;padding:0;}
+
+/* Code copy button */
+.code-wrap{position:relative;margin:7px 0;}
+.code-wrap pre{margin:0;}
+.code-header{display:flex;justify-content:space-between;align-items:center;padding:6px 14px;background:#161b22;border-radius:8px 8px 0 0;border:1px solid rgba(255,255,255,.08);border-bottom:none;}
+.code-lang-tag{font-size:11px;font-weight:600;color:#8b949e;font-family:var(--fm);}
+.copy-btn{padding:3px 10px;border-radius:6px;border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.05);color:#8b949e;font-size:10px;font-weight:600;cursor:pointer;font-family:var(--fm);transition:all .2s;}
+.copy-btn:hover{background:rgba(255,255,255,.12);color:#c9d1d9;}
+.copy-btn.copied{background:rgba(22,163,74,.15);color:#16a34a;border-color:rgba(22,163,74,.3);}
+.code-wrap pre{border-radius:0 0 8px 8px;}
+
+/* Response speed badge */
+.speed-badge{display:inline-flex;align-items:center;gap:5px;margin-top:4px;padding:2px 8px;border-radius:12px;background:rgba(109,40,217,.06);border:1px solid rgba(109,40,217,.12);font-size:9px;font-weight:600;font-family:var(--fm);color:var(--v);}
+
+/* Reasoning depth badge */
+.reason-badge{display:inline-flex;align-items:center;gap:4px;margin-left:6px;padding:2px 8px;border-radius:12px;background:rgba(13,148,136,.06);border:1px solid rgba(13,148,136,.15);font-size:9px;font-weight:600;font-family:var(--fm);color:var(--teal);}
+
+/* Search bar */
+.search-bar{display:none;padding:8px 18px 0;}
+.search-bar.show{display:block;}
+.search-wrap{display:flex;gap:6px;align-items:center;}
+.search-input{flex:1;padding:7px 12px;border-radius:var(--r-xs);border:1.5px solid var(--line);background:var(--fog);font-family:var(--fb);font-size:12px;color:var(--ink);outline:none;transition:border-color .2s;}
+.search-input:focus{border-color:rgba(109,40,217,.35);}
+.search-go{padding:7px 14px;border-radius:var(--r-xs);border:none;background:linear-gradient(135deg,#6d28d9,#7c3aed);color:#fff;font-size:11px;font-weight:700;cursor:pointer;font-family:var(--fb);}
+.search-results{margin-top:6px;padding:8px 10px;background:var(--white);border:1px solid var(--line);border-radius:var(--r-xs);font-size:11px;max-height:150px;overflow-y:auto;display:none;}
+.search-results.show{display:block;}
+.sr-item{padding:4px 0;border-bottom:1px solid var(--fog);}
+.sr-item:last-child{border:none;}
+.sr-title{font-weight:700;color:var(--ink);font-size:11px;}
+.sr-desc{color:var(--ink3);font-size:10px;line-height:1.4;}
+.sr-url{color:var(--v);font-size:9px;text-decoration:none;}
+
+/* PDF indicator */
+.pdf-badge{display:inline-flex;align-items:center;gap:4px;padding:3px 8px;border-radius:6px;background:rgba(225,29,72,.06);border:1px solid rgba(225,29,72,.15);font-size:10px;font-weight:600;color:var(--rose);}
+
+.typing{display:flex;align-items:center;gap:5px;padding:12px 15px;}
+.typing span{width:6px;height:6px;border-radius:50%;background:var(--v2);opacity:.4;animation:bounce .8s ease-in-out infinite;}
+.typing span:nth-child(2){animation-delay:.15s;}
+.typing span:nth-child(3){animation-delay:.3s;}
+@keyframes bounce{0%,100%{transform:translateY(0);opacity:.4;}50%{transform:translateY(-5px);opacity:1;}}
+
+.img-prev{display:none;padding:8px 26px 0;}
+.img-prev.show{display:block;}
+.img-tw{display:inline-flex;align-items:center;gap:8px;background:var(--white);border:1.5px solid rgba(109,40,217,.2);border-radius:var(--r-xs);padding:5px 9px 5px 5px;}
+.img-th{width:44px;height:44px;object-fit:cover;border-radius:5px;}
+.img-nm{font-size:10px;font-weight:600;color:var(--ink2);}
+.img-sz{font-size:9px;color:var(--ink4);}
+.img-rm{width:17px;height:17px;border-radius:50%;background:var(--fog);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:9px;color:var(--ink3);transition:all .2s;margin-left:4px;}
+.img-rm:hover{background:rgba(225,29,72,.1);color:var(--rose);}
+
+.inputbar{padding:14px 18px 16px;border-top:1px solid var(--line);background:rgba(255,255,255,.88);backdrop-filter:blur(20px);flex-shrink:0;}
+.input-wrap{display:flex;align-items:flex-end;gap:8px;background:var(--white);border:1.5px solid var(--line2);border-radius:var(--r);padding:7px 9px 7px 13px;transition:border-color .22s,box-shadow .22s;box-shadow:var(--sh);}
+.input-wrap:focus-within{border-color:rgba(109,40,217,.32);box-shadow:var(--sh2),0 0 0 4px rgba(109,40,217,.06);}
+.chat-ta{flex:1;border:none;outline:none;background:transparent;font-family:var(--fb);font-size:13.5px;color:var(--ink);line-height:1.6;resize:none;max-height:150px;min-height:22px;overflow-y:auto;padding:3px 0;}
+.chat-ta::placeholder{color:var(--ink4);}
+.input-acts{display:flex;align-items:center;gap:5px;padding-bottom:3px;}
+.icon-btn{width:32px;height:32px;border-radius:9px;border:1.5px solid var(--line);background:var(--fog);display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--ink3);font-size:14px;transition:all .2s;flex-shrink:0;}
+.icon-btn:hover{background:rgba(109,40,217,.08);border-color:rgba(109,40,217,.25);color:var(--v);}
+.file-btn{position:relative;}
+.file-btn input{position:absolute;inset:0;opacity:0;cursor:pointer;font-size:0;}
+.send-btn{width:36px;height:36px;border-radius:11px;border:none;background:linear-gradient(135deg,#6d28d9,#7c3aed);color:#fff;font-size:15px;cursor:pointer;flex-shrink:0;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 14px rgba(109,40,217,.28);transition:all .22s cubic-bezier(.4,0,.2,1);}
+.send-btn:hover{transform:translateY(-2px) scale(1.06);box-shadow:0 6px 20px rgba(109,40,217,.38);}
+.send-btn:active{transform:scale(.96);}
+.send-btn:disabled{opacity:.4;cursor:not-allowed;transform:none;box-shadow:none;}
+.input-hint{font-size:10px;color:var(--ink4);padding:5px 3px 0;display:flex;align-items:center;gap:8px;}
+.kbd{background:var(--fog);border:1px solid var(--line);border-radius:4px;padding:1px 5px;font-family:var(--fm);font-size:9px;color:var(--ink3);}
+.model-hint{margin-left:auto;font-weight:700;color:var(--v);font-size:10px;}
+
+.toast{position:fixed;bottom:20px;right:20px;z-index:9999;background:var(--ink);color:#fff;font-size:11px;font-weight:600;padding:9px 16px;border-radius:var(--r-sm);box-shadow:var(--sh3);transform:translateY(50px);opacity:0;transition:all .35s cubic-bezier(.34,1.56,.64,1);pointer-events:none;}
+.toast.show{transform:translateY(0);opacity:1;}
+
+@media(max-width:768px){
+  .shell{grid-template-columns:1fr;}
+  .sidebar{display:none;}
+}
+</style>
+</head>
+<body>
+
+<div class="bg">
+  <div class="orb orb1"></div><div class="orb orb2"></div><div class="orb orb3"></div>
+  <div class="bg-grid"></div>
+</div>
+
+<div class="shell">
+  <!-- SIDEBAR -->
+  <aside class="sidebar">
+    <div class="logo-area">
+      <div class="logo-row">
+        <div class="logo-icon">🧬</div>
+        <div class="logo-text">
+          <div class="logo-name"><em>Darwin</em>-9B</div>
+          <div class="logo-sub">Evolutionary Merge</div>
+        </div>
+      </div>
+    </div>
+
+    <!-- Single Model Card -->
+    <div class="model-card">
+      <div class="mc-top">
+        <span class="mc-name">Darwin-9B-Opus</span>
+        <span class="mc-arch">Dense 9B</span>
+      </div>
+      <div class="mc-stats">
+        <span class="mc-stat mc-hl">Qwen3.5 Dense</span>
+        <span class="mc-stat mc-ok">Reasoning ✓</span>
+        <span class="mc-stat mc-ok">BF16</span>
+        <span class="mc-stat mc-ok">9B params</span>
+      </div>
+      <div class="mc-desc">Evolutionary merge · Qwen3.5 architecture · Reasoning · 131K context</div>
+      <a href="https://huggingface.co/FINAL-Bench/Darwin-9B-Opus" target="_blank" style="display:inline-flex;align-items:center;gap:5px;margin-top:8px;font-size:10px;font-weight:700;color:var(--v);text-decoration:none;padding:4px 10px;border-radius:16px;background:var(--vg);border:1px solid rgba(109,40,217,.15);transition:all .2s;">🤗 Model Card ↗</a>
+      <div style="display:flex;flex-wrap:wrap;gap:4px;margin-top:6px;">
+        <a href="https://huggingface.co/spaces/FINAL-Bench/Leaderboard" target="_blank" style="display:inline-flex;align-items:center;gap:3px;font-size:8px;font-weight:700;color:#059669;text-decoration:none;padding:3px 8px;border-radius:12px;background:rgba(16,185,129,.08);border:1px solid rgba(16,185,129,.15);transition:all .2s;">🏆 FINAL Bench</a>
+        <a href="https://huggingface.co/spaces/FINAL-Bench/all-bench-leaderboard" target="_blank" style="display:inline-flex;align-items:center;gap:3px;font-size:8px;font-weight:700;color:var(--amber);text-decoration:none;padding:3px 8px;border-radius:12px;background:rgba(217,119,6,.08);border:1px solid rgba(217,119,6,.15);transition:all .2s;">📊 ALL Bench</a>
+        <a href="https://huggingface.co/spaces/MAYA-AI/all-leaderboard" target="_blank" style="display:inline-flex;align-items:center;gap:3px;font-size:8px;font-weight:700;color:var(--v);text-decoration:none;padding:3px 8px;border-radius:12px;background:rgba(109,40,217,.06);border:1px solid rgba(109,40,217,.12);transition:all .2s;">🌐 MAYA LB</a>
+      </div>
+      <div style="display:flex;flex-wrap:wrap;gap:4px;margin-top:6px;">
+        <a href="https://huggingface.co/spaces/FINAL-Bench/Leaderboard" target="_blank" style="font-size:8px;font-weight:700;padding:2px 7px;border-radius:10px;background:rgba(22,163,74,.08);border:1px solid rgba(22,163,74,.18);color:#16a34a;text-decoration:none;transition:all .2s;">🏆 FINAL Bench</a>
+        <a href="https://huggingface.co/spaces/FINAL-Bench/all-bench-leaderboard" target="_blank" style="font-size:8px;font-weight:700;padding:2px 7px;border-radius:10px;background:rgba(217,119,6,.08);border:1px solid rgba(217,119,6,.18);color:#d97706;text-decoration:none;transition:all .2s;">📊 ALL Bench</a>
+        <a href="https://huggingface.co/spaces/MAYA-AI/all-leaderboard" target="_blank" style="font-size:8px;font-weight:700;padding:2px 7px;border-radius:10px;background:rgba(109,40,217,.08);border:1px solid rgba(109,40,217,.18);color:var(--v);text-decoration:none;transition:all .2s;">🌐 MAYA LB</a>
+      </div>
+    </div>
+
+    <!-- Settings -->
+    <div class="settings">
+      <div class="section-lbl">Settings</div>
+
+      <div class="toggle-row">
+        <div class="toggle-info"><div class="tl">👁️ Vision</div><div class="ts">Image understanding</div></div>
+        <label class="toggle"><input type="checkbox" id="visionToggle" checked><span class="t-track"></span><span class="t-thumb"></span></label>
+      </div>
+
+      <div class="field">
+        <span class="field-lbl">System Prompt</span>
+        <div class="presets">
+          <span class="chip" onclick="setPreset('general')">General</span>
+          <span class="chip" onclick="setPreset('code')">Code</span>
+          <span class="chip" onclick="setPreset('math')">Math</span>
+          <span class="chip" onclick="setPreset('creative')">Creative</span>
+          <span class="chip" onclick="setPreset('translate')">Translate</span>
+          <span class="chip" onclick="setPreset('research')">Research</span>
+        </div>
+        <textarea id="sysPrompt">You are Darwin-9B-Opus, a highly capable reasoning model created by VIDRAFT via evolutionary merge. Think step by step for complex questions.</textarea>
+      </div>
+
+      <div class="sl-wrap">
+        <div class="sl-meta"><span class="sl-title">Max Tokens</span><span class="sl-val" id="tokVal">4096</span></div>
+        <input type="range" id="tokSl" min="64" max="16384" value="4096" step="64" oninput="document.getElementById('tokVal').textContent=this.value">
+      </div>
+
+      <div class="sl-wrap">
+        <div class="sl-meta"><span class="sl-title">Temperature</span><span class="sl-val" id="tempVal">0.60</span></div>
+        <input type="range" id="tempSl" min="0" max="1.5" value="0.6" step="0.05" oninput="document.getElementById('tempVal').textContent=parseFloat(this.value).toFixed(2)">
+      </div>
+
+      <div class="sl-wrap">
+        <div class="sl-meta"><span class="sl-title">Top-P</span><span class="sl-val" id="topPVal">0.90</span></div>
+        <input type="range" id="topPSl" min="0.1" max="1.0" value="0.9" step="0.05" oninput="document.getElementById('topPVal').textContent=parseFloat(this.value).toFixed(2)">
+      </div>
+
+      <button class="clear-btn" onclick="clearChat()">🗑️ Clear conversation</button>
+    </div>
+  </aside>
+
+  <!-- MAIN -->
+  <main class="chat-main">
+    <header class="chat-hdr">
+      <div class="hdr-left">
+        <div class="model-pill"><div class="dot"></div><span class="model-name" id="hdrModel">Darwin-9B-Opus</span></div>
+      </div>
+      <div style="display:flex;align-items:center;gap:12px;">
+        <a href="https://huggingface.co/FINAL-Bench/Darwin-9B-Opus" target="_blank" style="display:inline-flex;align-items:center;gap:6px;padding:5px 14px;border-radius:22px;background:linear-gradient(135deg,rgba(109,40,217,.1),rgba(16,185,129,.08));border:1.5px solid rgba(109,40,217,.25);color:var(--v);font-size:12px;font-weight:700;text-decoration:none;transition:all .22s;font-family:var(--fm);">🤗 Model Card ↗</a>
+        <a href="https://huggingface.co/spaces/FINAL-Bench/Leaderboard" target="_blank" style="padding:4px 9px;border-radius:14px;background:rgba(22,163,74,.08);border:1px solid rgba(22,163,74,.18);color:#16a34a;font-size:9px;font-weight:700;text-decoration:none;font-family:var(--fm);">🏆 FINAL</a>
+        <a href="https://huggingface.co/spaces/FINAL-Bench/all-bench-leaderboard" target="_blank" style="padding:4px 9px;border-radius:14px;background:rgba(217,119,6,.08);border:1px solid rgba(217,119,6,.18);color:#d97706;font-size:9px;font-weight:700;text-decoration:none;font-family:var(--fm);">📊 ALL</a>
+        <a href="https://huggingface.co/spaces/MAYA-AI/all-leaderboard" target="_blank" style="padding:4px 9px;border-radius:14px;background:rgba(109,40,217,.08);border:1px solid rgba(109,40,217,.18);color:var(--v);font-size:9px;font-weight:700;text-decoration:none;font-family:var(--fm);">🌐 MAYA</a>
+        <a class="hf-login-btn" id="loginBtn" href="/oauth/login">
+          <svg viewBox="0 0 120 120" width="16" height="16"><path fill="currentColor" d="M41.7 56.6c-5 0-8.8 4-8.8 9s3.8 9 8.8 9 8.8-4 8.8-9-3.8-9-8.8-9zm36.6 0c-5 0-8.8 4-8.8 9s3.8 9 8.8 9 8.8-4 8.8-9-3.8-9-8.8-9z"/></svg>
+          Sign in with HF
+        </a>
+        <div id="userArea" style="display:none;align-items:center;gap:8px;">
+          <a class="user-chip" id="userChip" href="#"><div class="user-avatar" id="userAvatar"><span id="userInitial">U</span></div><span id="userName">User</span></a>
+          <button class="logout-btn" onclick="location.href='/oauth/logout'">Log out</button>
+        </div>
+        <div class="hdr-stats">
+          <div class="hstat"><div class="hstat-n" id="stMsgs">0</div><div class="hstat-l">Messages</div></div>
+          <div class="hstat"><div class="hstat-n" id="stTok">0</div><div class="hstat-l">Tokens</div></div>
+        </div>
+      </div>
+    </header>
+
+    <div class="img-prev" id="imgPrev">
+      <div class="img-tw">
+        <img class="img-th" id="imgThumb" src="">
+        <div><div class="img-nm" id="imgName">image.jpg</div><div class="img-sz" id="imgSize">—</div></div>
+        <button class="img-rm" onclick="removeImg()">✕</button>
+      </div>
+    </div>
+
+    <div class="messages" id="msgs">
+      <div class="welcome" id="welcome">
+        <div class="welcome-icon">🧬</div>
+        <div class="welcome-title">Hello, I'm <em>Darwin</em></div>
+        <div class="welcome-sub">The child that surpassed both parents — built by VIDRAFT with evolutionary merge + Model MRI. Upload an image or ask anything.</div>
+        <div class="welcome-badges">
+          <span class="welcome-badge wb-purple">Qwen3.5 Dense</span>
+          <span class="welcome-badge wb-green">Reasoning ✓</span>
+          <span class="welcome-badge wb-amber">147.8 tok/s</span>
+          <a href="https://huggingface.co/FINAL-Bench/Darwin-9B-Opus" target="_blank" style="font-size:11px;font-weight:600;padding:4px 12px;border-radius:20px;background:rgba(109,40,217,.08);color:var(--v);border:1px solid rgba(109,40,217,.15);text-decoration:none;transition:all .2s;">🤗 Model Card ↗</a>
+        </div>
+        <div class="ex-grid">
+          <div class="ex-card" onclick="sendEx('Explain how Darwin V5 evolutionary merge with Model MRI works, and why it surpasses both parent models.')"><span class="ex-icon">🧬</span><div class="ex-title">Darwin Architecture</div><div class="ex-desc">How evolutionary merge works</div></div>
+          <div class="ex-card" onclick="sendEx('Write a Python async web scraper with retry logic and rate limiting. Include type hints.')"><span class="ex-icon">💻</span><div class="ex-title">Code Generation</div><div class="ex-desc">Production-quality code</div></div>
+          <div class="ex-card" onclick="trySampleVision()"><span class="ex-icon">👁️</span><div class="ex-title">Vision Demo</div><div class="ex-desc">Try image analysis now</div></div>
+          <div class="ex-card" onclick="sendEx('Analyze why Korean K-pop became a global phenomenon, from both cultural and economic perspectives.')"><span class="ex-icon">🌐</span><div class="ex-title">201 Languages</div><div class="ex-desc">Korean, Japanese, Arabic…</div></div>
+        </div>
+      </div>
+    </div>
+
+    <!-- Search Bar -->
+    <div class="search-bar" id="searchBar">
+      <div class="search-wrap">
+        <input class="search-input" id="searchInput" placeholder="Search the web..." onkeydown="if(event.key==='Enter')doSearch()">
+        <button class="search-go" onclick="doSearch()">🔍 Search</button>
+        <button class="icon-btn" onclick="toggleSearch()" style="font-size:12px;">✕</button>
+      </div>
+      <div class="search-results" id="searchResults"></div>
+    </div>
+
+    <div class="inputbar">
+      <div class="input-wrap">
+        <textarea class="chat-ta" id="chatInput" placeholder="Message Darwin…" rows="1" onkeydown="handleKey(event)" oninput="autoGrow(this)"></textarea>
+        <div class="input-acts">
+          <label class="icon-btn file-btn" id="fileLabel" title="Upload image or PDF">🖼<input type="file" accept="image/*,.pdf" onchange="handleFile(this)" id="fileInput"></label>
+          <button class="icon-btn" id="searchToggleBtn" onclick="toggleSearch()" title="Web search">🔍</button>
+          <button class="icon-btn" onclick="clearChat()" title="New chat" style="font-size:16px;">🧬</button>
+          <button class="send-btn" id="sendBtn" onclick="sendMsg()">➤</button>
+        </div>
+      </div>
+      <div class="input-hint">
+        <span><span class="kbd">Enter</span> send</span>
+        <span><span class="kbd">Shift+Enter</span> new line</span>
+        <span class="model-hint" id="modelHint">9B Dense · BF16 · 131K ctx</span>
+      </div>
+    </div>
+  </main>
+</div>
+
+<div class="toast" id="toast"></div>
+
+<script>
+const S={vision:false,history:[],msgCount:0,totalTok:0,pending:null,busy:false,searchResults:null,
+  presets:{
+    general:'You are Darwin-9B-Opus, a highly capable reasoning model created by VIDRAFT via evolutionary merge. Think step by step for complex questions.',
+    code:'You are an expert software engineer. Write clean, efficient, well-commented code. Explain your approach before writing.',
+    math:'You are a world-class mathematician. Break problems step-by-step. Show full working.',
+    creative:'You are a brilliant creative writer. Be imaginative, vivid, and engaging.',
+    translate:'You are a professional translator fluent in 201 languages. Provide accurate translations with cultural context.',
+    research:'You are a rigorous research analyst. Provide structured, well-reasoned analysis.',
+  }
+};
+
+function apiBase(){return'/gradio';}
+
+// Toggles
+document.getElementById('visionToggle').addEventListener('change',function(){
+  S.vision=false;
+  const l=document.getElementById('fileLabel');
+  l.style.opacity=this.checked?'1':'.35';
+  l.style.pointerEvents=this.checked?'auto':'none';
+  if(!this.checked)removeImg();
+});
+
+function setPreset(k){document.getElementById('sysPrompt').value=S.presets[k];showToast('Preset applied ✓');}
+
+// File handling (image + PDF)
+function handleFile(input){
+  const f=input.files[0];if(!f)return;
+  if(f.type==='application/pdf'){
+    // PDF handling
+    const r=new FileReader();
+    r.onload=async e=>{
+      S.pending={type:'pdf',data:e.target.result,name:f.name,size:fmtSz(f.size)};
+      document.getElementById('imgThumb').src='';
+      document.getElementById('imgThumb').style.display='none';
+      document.getElementById('imgName').textContent='📄 '+f.name;
+      document.getElementById('imgSize').textContent=fmtSz(f.size);
+      document.getElementById('imgPrev').classList.add('show');
+      // Extract text
+      try{
+        const res=await fetch('/api/extract-pdf',{method:'POST',headers:{'Content-Type':'application/json'},body:JSON.stringify({data:e.target.result})});
+        const data=await res.json();
+        if(data.text){S.pending.text=data.text;document.getElementById('imgSize').textContent=`${fmtSz(f.size)} · ${data.chars} chars extracted`;}
+      }catch(err){console.error('PDF extract failed:',err);}
+    };
+    r.readAsDataURL(f);
+  }else{
+    // Image handling
+    const r=new FileReader();
+    r.onload=e=>{
+      S.pending={type:'image',data:e.target.result,name:f.name,size:fmtSz(f.size)};
+      document.getElementById('imgThumb').src=e.target.result;
+      document.getElementById('imgThumb').style.display='block';
+      document.getElementById('imgName').textContent=f.name;
+      document.getElementById('imgSize').textContent=fmtSz(f.size);
+      document.getElementById('imgPrev').classList.add('show');
+    };
+    r.readAsDataURL(f);
+  }
+}
+function removeImg(){S.pending=null;document.getElementById('imgPrev').classList.remove('show');document.getElementById('fileInput').value='';document.getElementById('imgThumb').style.display='block';}
+function fmtSz(b){return b<1048576?`${(b/1024).toFixed(0)} KB`:`${(b/1048576).toFixed(1)} MB`;}
+
+// Vision sample
+function trySampleVision(){ showToast('Vision not supported on 9B model'); return;
+  const sampleUrl='https://huggingface.co/datasets/huggingface/documentation-images/resolve/main/transformers/rabbit.png';
+  S.pending={type:'image',data:sampleUrl,name:'sample_rabbit.png',size:'sample',isUrl:true};
+  document.getElementById('chatInput').value='Describe this image in detail. What story does it tell?';
+  sendMsg();
+}
+
+// Search
+function toggleSearch(){
+  const bar=document.getElementById('searchBar');
+  bar.classList.toggle('show');
+  if(bar.classList.contains('show'))document.getElementById('searchInput').focus();
+}
+async function doSearch(){
+  const q=document.getElementById('searchInput').value.trim();
+  if(!q)return;
+  const res=document.getElementById('searchResults');
+  res.innerHTML='<div style="color:var(--ink4);font-size:10px;">🔍 Searching...</div>';
+  res.classList.add('show');
+  try{
+    const r=await fetch('/api/search',{method:'POST',headers:{'Content-Type':'application/json'},body:JSON.stringify({query:q})});
+    const data=await r.json();
+    if(data.error){res.innerHTML=`<div style="color:var(--rose);font-size:10px;">❌ ${data.error}</div>`;return;}
+    if(!data.results||data.results.length===0){res.innerHTML='<div style="color:var(--ink4);">No results found</div>';return;}
+    let html=data.results.map(r=>`<div class="sr-item"><div class="sr-title">${esc(r.title)}</div><div class="sr-desc">${esc(r.desc)}</div><a class="sr-url" href="${r.url}" target="_blank">${r.url}</a></div>`).join('');
+    html+=`<button style="margin-top:6px;padding:4px 10px;border-radius:6px;border:1px solid var(--line);background:var(--vg);color:var(--v);font-size:10px;font-weight:600;cursor:pointer;font-family:var(--fb);" onclick="injectSearch()">📎 Inject into chat</button>`;
+    res.innerHTML=html;
+    S.searchResults=data.results;
+  }catch(e){res.innerHTML=`<div style="color:var(--rose);">Error: ${e.message}</div>`;}
+}
+function injectSearch(){
+  if(!S.searchResults)return;
+  const ctx=S.searchResults.map(r=>`• ${r.title}: ${r.desc}`).join('\n');
+  const inp=document.getElementById('chatInput');
+  const q=document.getElementById('searchInput').value.trim();
+  inp.value=`Based on the following web search results for "${q}":\n\n${ctx}\n\nPlease answer: ${q}`;
+  document.getElementById('searchBar').classList.remove('show');
+  document.getElementById('searchResults').classList.remove('show');
+  autoGrow(inp);
+  showToast('Search results injected ✓');
+}
+
+// Send
+function handleKey(e){if(e.key==='Enter'&&!e.shiftKey){e.preventDefault();sendMsg();}}
+function autoGrow(el){el.style.height='auto';el.style.height=Math.min(el.scrollHeight,150)+'px';}
+
+async function sendMsg(){
+  if(S.busy)return;
+  const inp=document.getElementById('chatInput');
+  const msg=inp.value.trim();if(!msg)return;
+  inp.value='';inp.style.height='auto';
+  document.getElementById('sendBtn').disabled=true;
+  S.busy=true;
+  hideWelcome();
+
+  const imgSnap=S.pending?{...S.pending}:null;
+  removeImg();
+
+  // PDF: prepend extracted text to message
+  let finalMsg=msg;
+  let imgData=null;
+  if(imgSnap&&imgSnap.type==='pdf'&&imgSnap.text){
+    finalMsg=`[Document: ${imgSnap.name}]\n\n${imgSnap.text}\n\n---\n\n${msg}`;
+    appendUser(msg,null,'📄 '+imgSnap.name);
+  }else if(imgSnap&&imgSnap.type==='image'){
+    imgData=imgSnap.isUrl?null:imgSnap.data;  // URL images handled differently
+    appendUser(msg,imgSnap);
+  }else{
+    appendUser(msg);
+  }
+
+  const startTime=performance.now();
+
+  const payload=[
+    finalMsg,S.history,'⚡ Fast Mode  (direct answer)',
+    imgData,
+    document.getElementById('sysPrompt').value.trim()||S.presets.general,
+    parseInt(document.getElementById('tokSl').value),
+    parseFloat(document.getElementById('tempSl').value),
+    parseFloat(document.getElementById('topPSl').value),
+  ];
+
+  const botDiv=appendBot();
+
+  try{
+    const base=apiBase();
+    const postRes=await fetch(`${base}/gradio_api/call/chat`,{
+      method:'POST',headers:{'Content-Type':'application/json'},
+      body:JSON.stringify({data:payload}),
+    });
+    if(!postRes.ok)throw new Error(`HTTP ${postRes.status}: ${await postRes.text()}`);
+    const{event_id}=await postRes.json();
+    if(!event_id)throw new Error('No event_id from Gradio');
+
+    await new Promise((resolve,reject)=>{
+      const es=new EventSource(`${base}/gradio_api/call/chat/${event_id}`);
+      let raw='',done=false;
+
+      const finish=text=>{
+        if(done)return;done=true;es.close();
+        const elapsed=(performance.now()-startTime)/1000;
+        const tokens=Math.round(text.length/4);
+        const speed=tokens/elapsed;
+        renderBot(botDiv,text,elapsed,tokens,speed);
+        S.history.push([msg,stripThink(text)]);
+        S.msgCount+=2;S.totalTok+=tokens;
+        updateStats();
+        resolve();
+      };
+
+      es.addEventListener('generating',e=>{
+        try{const d=JSON.parse(e.data);if(Array.isArray(d)&&d[0]!=null){raw=String(d[0]);renderBot(botDiv,raw);}}catch{}
+      });
+      es.addEventListener('complete',e=>{try{const d=JSON.parse(e.data);finish(Array.isArray(d)?String(d[0]??raw):raw);}catch{finish(raw);}});
+      es.addEventListener('process_completed',e=>{try{const d=JSON.parse(e.data);finish(String(d?.output?.data?.[0]??raw));}catch{finish(raw);}});
+      es.onmessage=e=>{
+        if(done)return;
+        try{const d=JSON.parse(e.data);if(d&&d.msg==='process_completed')finish(String(d?.output?.data?.[0]??raw));else if(Array.isArray(d)&&d[0]!=null){raw=String(d[0]);renderBot(botDiv,raw);}}catch{}
+      };
+      es.onerror=()=>{if(done)return;if(raw&&raw.length>0){finish(raw);}else{done=true;es.close();reject(new Error('SSE stream ended'));}};
+      setTimeout(()=>{if(!done){done=true;es.close();reject(new Error('Request timed out'));}},300000);
+    });
+  }catch(err){
+    renderBot(botDiv,`**Error:** ${esc(err.message)}\n\n_Check if SGLang server is running._`);
+  }
+
+  S.busy=false;
+  document.getElementById('sendBtn').disabled=false;
+  scrollDown();
+}
+
+function sendEx(t){document.getElementById('chatInput').value=t;sendMsg();}
+function hideWelcome(){const w=document.getElementById('welcome');if(w){w.style.transition='opacity .25s';w.style.opacity='0';setTimeout(()=>w.remove(),260);}}
+
+function appendUser(text,img,pdfLabel){
+  const t=new Date().toLocaleTimeString('en',{hour:'2-digit',minute:'2-digit'});
+  let extra='';
+  if(img&&img.type==='image')extra=`<img src="${img.data}" style="max-width:180px;border-radius:9px;margin-bottom:6px;display:block;">`;
+  if(pdfLabel)extra=`<span class="pdf-badge">${esc(pdfLabel)}</span><br>`;
+  const el=document.createElement('div');
+  el.className='msg user';
+  el.innerHTML=`<div class="avatar">U</div><div class="body">${extra}<div class="bubble">${esc(text)}</div><div class="msg-time">${t}</div></div>`;
+  document.getElementById('msgs').appendChild(el);
+  scrollDown();
+}
+function appendBot(){
+  const el=document.createElement('div');
+  el.className='msg bot';
+  el.innerHTML='<div class="avatar">🧬</div><div class="body"><div class="bubble"><div class="typing"><span></span><span></span><span></span></div></div><div class="msg-time">—</div><div class="msg-badges"></div></div>';
+  document.getElementById('msgs').appendChild(el);
+  scrollDown();return el;
+}
+function isThinkLine(l){
+  l=l.trim();
+  if(!l)return true;
+  const starts=['The user','the user','This is','this is','I should','I need to','Let me','let me',
+    'My task','my task',"I'll ",'I will','Since ','since ','Now,','now,','So,','so,','First,','first,',
+    'Okay','okay','Alright','Hmm','Wait','Actually','The question','the question','The input',
+    'The request','The prompt','Thinking Process','**Thinking','Step ','step ','Approach:','Analysis:',
+    'Reasoning:','1. **','2. **','3. **','4. **','5. **'];
+  for(const s of starts)if(l.startsWith(s))return true;
+  if((l.startsWith('- ')||l.startsWith('* ')||l.startsWith('○ '))&&!/[\u1100-\uD7AF\uAC00-\uD7A3]/.test(l.slice(0,30)))return true;
+  return false;
+}
+
+function splitThinkAnswer(raw){
+  const lines=raw.split('\n');
+  for(let i=0;i<lines.length;i++){
+    const l=lines[i].trim();
+    if(!isThinkLine(lines[i])){
+      if(/[\uAC00-\uD7A3]/.test(l.slice(0,10))){return[lines.slice(0,i).join('\n').trim(),lines.slice(i).join('\n').trim()];}
+      if(i>2&&lines.slice(Math.max(0,i-2),i).every(x=>!x.trim())){return[lines.slice(0,i).join('\n').trim(),lines.slice(i).join('\n').trim()];}
+    }
+  }
+  return['',raw];
+}
+
+function renderBot(el,raw,elapsed,tokens,speed){
+  const t=new Date().toLocaleTimeString('en',{hour:'2-digit',minute:'2-digit'});
+  el.querySelector('.msg-time').textContent=t;
+  const b=el.querySelector('.bubble');
+  const badges=el.querySelector('.msg-badges');
+  let thinkHtml='',ans=raw,thinkChars=0;
+  const tOpen=raw.indexOf('<think>'),tClose=raw.indexOf('</think>');
+  const dOpen=raw.indexOf('<details>'),sClose=raw.indexOf('</summary>'),dClose=raw.indexOf('</details>');
+
+  if(tOpen>=0&&tClose>tOpen){
+    const chain=raw.slice(tOpen+7,tClose).trim();ans=raw.slice(tClose+8).trim();
+    thinkHtml=buildThink(chain);thinkChars=chain.length;
+  }else if(tOpen>=0){
+    const thinkLen=raw.length-tOpen-7;ans='';
+    thinkHtml=`<div class="think-blk"><div class="think-hdr" style="cursor:default;">🧠 REASONING (${thinkLen} CHARS) <span class="typing" style="display:inline-flex;gap:4px;vertical-align:middle;margin-left:6px;"><span></span><span></span><span></span></span></div></div>`;
+  }else if(dOpen>=0&&sClose>dOpen){
+    const body=dClose>sClose?raw.slice(sClose+10,dClose):raw.slice(sClose+10);
+    const chain=body.replace(/^> ?/gm,'').replace(/<[^>]+>/g,'').trim();
+    ans=dClose>0?raw.slice(dClose+10).trim():'';thinkHtml=buildThink(chain);thinkChars=chain.length;
+  }else{
+    const firstLine=raw.trim().split('\n')[0]||'';
+    if(isThinkLine(firstLine)&&raw.length>20){
+      const[think,answer]=splitThinkAnswer(raw);
+      if(think&&answer){thinkHtml=buildThink(think);ans=answer;thinkChars=think.length;}
+      else if(think&&!answer){
+        ans='';
+        thinkHtml=`<div class="think-blk"><div class="think-hdr" style="cursor:default;">🧠 REASONING (${raw.length} CHARS) <span class="typing" style="display:inline-flex;gap:4px;vertical-align:middle;margin-left:6px;"><span></span><span></span><span></span></span></div></div>`;
+      }
+    }
+  }
+  b.innerHTML=thinkHtml+md(ans);
+
+  // Speed + reasoning badges (only on final render)
+  if(elapsed&&badges){
+    let bh=`<span class="speed-badge">⚡ ${elapsed.toFixed(1)}s · ${tokens} tok · ${speed.toFixed(0)} tok/s</span>`;
+    if(thinkChars>0)bh+=`<span class="reason-badge">🧠 Deep Reasoning · ${thinkChars.toLocaleString()} chars analyzed</span>`;
+    badges.innerHTML=bh;
+  }
+}
+function buildThink(chain){
+  if(!chain)return'';
+  return`<div class="think-blk" onclick="this.classList.toggle('open')"><div class="think-hdr">🧠 Reasoning Chain (${chain.length} chars)</div><div class="think-body">${esc(chain)}</div></div>`;
+}
+function stripThink(t){
+  t=t.replace(/^<details>[\s\S]*?<\/details>\n\n/,'').replace(/^<think>[\s\S]*?<\/think>\s*/,'');
+  // Strip plain-text thinking
+  t=t.replace(/^🧠 Reasoning.*?\n?/,'');
+  return t;
+}
+
+// Marked.js + code copy
+(function setupMarked(){
+  if(typeof marked==='undefined')return;
+  const renderer=new marked.Renderer();
+  renderer.code=(code,lang)=>{
+    const language=lang&&hljs.getLanguage(lang)?lang:'plaintext';
+    const codeText=typeof code==='object'?code.text:code;
+    const highlighted=hljs.highlight(codeText,{language}).value;
+    const langLabel=language!=='plaintext'?language:'code';
+    const escaped=codeText.replace(/'/g,"\\'").replace(/\n/g,"\\n");
+    return`<div class="code-wrap"><div class="code-header"><span class="code-lang-tag">${langLabel}</span><button class="copy-btn" onclick="copyCode(this,'${escaped}')">📋 Copy</button></div><pre style="border-radius:0 0 8px 8px;margin:0;border-top:none;"><code class="hljs language-${language}">${highlighted}</code></pre></div>`;
+  };
+  renderer.codespan=code=>`<code style="background:var(--fog);padding:1px 5px;border-radius:4px;font-family:var(--fm);font-size:11.5px">${code}</code>`;
+  renderer.link=(href,title,text)=>`<a href="${typeof href==='object'?href.href:href}" target="_blank" rel="noopener">${text}</a>`;
+  marked.setOptions({renderer,breaks:true,gfm:true});
+})();
+
+function copyCode(btn,code){
+  const text=code.replace(/\\n/g,'\n').replace(/\\'/g,"'");
+  navigator.clipboard.writeText(text).then(()=>{
+    btn.textContent='✅ Copied!';btn.classList.add('copied');
+    setTimeout(()=>{btn.textContent='📋 Copy';btn.classList.remove('copied');},2000);
+  });
+}
+
+function md(t){if(!t)return'';if(typeof marked!=='undefined'){try{return marked.parse(t);}catch(e){}}return t.replace(/&/g,'&amp;').replace(/</g,'&lt;').replace(/>/g,'&gt;').replace(/`([^`]+)`/g,'<code>$1</code>').replace(/\*\*(.+?)\*\*/g,'<strong>$1</strong>').replace(/\n/g,'<br>');}
+function esc(t){return t?t.replace(/&/g,'&amp;').replace(/</g,'&lt;').replace(/>/g,'&gt;'):'';}
+function scrollDown(){const m=document.getElementById('msgs');m.scrollTop=m.scrollHeight;}
+function updateStats(){document.getElementById('stMsgs').textContent=S.msgCount;const t=S.totalTok;document.getElementById('stTok').textContent=t>999?(t/1000).toFixed(1)+'k':t;}
+function clearChat(){
+  S.history=[];S.msgCount=0;S.totalTok=0;updateStats();
+  document.getElementById('msgs').innerHTML='<div class="welcome" id="welcome" style="display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1;min-height:400px;text-align:center;padding:30px 36px;gap:20px;"><div class="welcome-icon" style="width:72px;height:72px;border-radius:20px;background:linear-gradient(135deg,#6d28d9,#a78bfa,#10b981);display:flex;align-items:center;justify-content:center;font-size:34px;box-shadow:0 8px 30px rgba(109,40,217,.25)">🧬</div><div class="welcome-title" style="font-family:var(--fd);font-size:34px">Hello, I\'m <em>Darwin</em></div></div>';
+}
+function showToast(msg,dur=2200){const t=document.getElementById('toast');t.textContent=msg;t.classList.add('show');setTimeout(()=>t.classList.remove('show'),dur);}
+
+// HF OAuth
+async function checkAuth(){try{const res=await fetch('/oauth/user');if(res.ok){const u=await res.json();if(u.logged_in){showLoggedIn(u);return;}}}catch(e){}showLoggedOut();}
+document.addEventListener('visibilitychange',()=>{if(!document.hidden)checkAuth();});
+function showLoggedIn(u){
+  document.getElementById('loginBtn').style.display='none';
+  const ua=document.getElementById('userArea');ua.style.display='flex';
+  document.getElementById('userName').textContent=u.username||u.name||'User';
+  document.getElementById('userChip').href=u.profile||'https://huggingface.co';
+  const av=document.getElementById('userAvatar');
+  if(u.avatar){av.innerHTML='<img src="'+u.avatar+'" alt="av">';}
+  else{document.getElementById('userInitial').textContent=(u.username||'U')[0].toUpperCase();}
+}
+function showLoggedOut(){document.getElementById('loginBtn').style.display='inline-flex';document.getElementById('userArea').style.display='none';}
+checkAuth();
+</script>
+</body>
+</html>

requirements.txt

@@ -0,0 +1,8 @@
+gradio>=5.0
+huggingface_hub
+httpx
+Pillow
+uvicorn
+fastapi
+requests
+PyMuPDF