Auto-deploy from GitHub: c0251c0c13ce2d12b1caaed44a4b14140e5f6dca

.gitattributes

@@ -1,35 +0,0 @@
-*.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

Dockerfile

@@ -0,0 +1,21 @@
+FROM python:3.10-slim
+
+WORKDIR /app
+
+RUN apt-get update && apt-get install -y \
+    git \
+    curl \
+    build-essential \
+    && rm -rf /var/lib/apt/lists/*
+
+COPY requirements.txt .
+
+RUN pip install --no-cache-dir -r requirements.txt
+
+COPY . .
+
+RUN mkdir -p temp_dir
+
+EXPOSE 7860
+
+CMD ["python", "app.py"]

README.md

@@ -1,10 +1,31 @@
 ---
-title: TTT
-emoji: 😻
-colorFrom: purple
-colorTo: gray
+title: TTT Text-to-Text Generator
+emoji: 🤖
+colorFrom: green
+colorTo: blue
 sdk: docker
 pinned: false
+license: mit
 ---
 
-Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
+# Text-to-Text Generator
+
+A Python-based text generation service powered by Qwen/Qwen3.5-4B with a neobrutalist web interface.
+
+## Features
+- 📝 Submit text prompts via REST API or web UI
+- 🤖 Automatic generation using Qwen/Qwen3.5-4B
+- 💾 SQLite database for queue management with task IDs
+- 🎨 Neobrutalist UI with real-time progress updates
+- 🔄 Queue position and estimated wait time
+
+## Usage
+Access the web interface at the Space URL above.
+
+## API Endpoints
+- POST `/api/submit` - Submit text task
+- GET `/api/tasks` - Get all tasks
+- GET `/api/tasks/<id>` - Get specific task
+
+---
+*Auto-deployed from GitHub*

app.py

@@ -0,0 +1,312 @@
+from flask import Flask, request, jsonify, send_from_directory
+from flask_cors import CORS
+import sqlite3
+import os
+import uuid
+from datetime import datetime, timedelta
+import threading
+import time
+
+app = Flask(__name__)
+CORS(app)
+
+# Worker state
+worker_thread = None
+worker_running = False
+
+def init_db():
+    conn = sqlite3.connect('text_tasks.db')
+    c = conn.cursor()
+    c.execute('''CREATE TABLE IF NOT EXISTS text_tasks
+                 (id TEXT PRIMARY KEY,
+                  input_text TEXT NOT NULL,
+                  system_prompt TEXT,
+                  status TEXT NOT NULL,
+                  result TEXT,
+                  created_at TEXT NOT NULL,
+                  processed_at TEXT,
+                  progress INTEGER DEFAULT 0,
+                  progress_text TEXT,
+                  hide_from_ui INTEGER DEFAULT 0)'''
+    )
+    conn.commit()
+    conn.close()
+
+def start_worker():
+    global worker_thread, worker_running
+    if not worker_running:
+        worker_running = True
+        worker_thread = threading.Thread(target=worker_loop, daemon=True)
+        worker_thread.start()
+        print("✅ Worker thread started")
+
+def cleanup_old_entries():
+    try:
+        conn = sqlite3.connect('text_tasks.db')
+        c = conn.cursor()
+        cutoff_date = (datetime.now() - timedelta(days=10)).isoformat()
+        c.execute('DELETE FROM text_tasks WHERE created_at < ?', (cutoff_date,))
+        deleted = c.rowcount
+        conn.commit()
+        conn.close()
+        if deleted > 0:
+            print(f"🧹 Cleanup: Deleted {deleted} old task entries")
+    except Exception as e:
+        print(f"⚠️  Cleanup error: {e}")
+
+def update_progress(task_id, progress, progress_text=None):
+    conn = sqlite3.connect('text_tasks.db')
+    c = conn.cursor()
+    c.execute('UPDATE text_tasks SET progress = ?, progress_text = ? WHERE id = ?',
+              (progress, progress_text, task_id))
+    conn.commit()
+    conn.close()
+
+def update_status(task_id, status, result=None, error=None):
+    conn = sqlite3.connect('text_tasks.db')
+    c = conn.cursor()
+    if status == 'completed':
+        c.execute('''UPDATE text_tasks
+                     SET status = ?, result = ?, processed_at = ?, progress = 100, progress_text = 'Completed'
+                     WHERE id = ?''',
+                  (status, result, datetime.now().isoformat(), task_id))
+    elif status == 'failed':
+        c.execute('''UPDATE text_tasks
+                     SET status = ?, result = ?, processed_at = ?, progress_text = 'Failed'
+                     WHERE id = ?''',
+                  (status, f"Error: {error}", datetime.now().isoformat(), task_id))
+    else:
+        c.execute('UPDATE text_tasks SET status = ? WHERE id = ?', (status, task_id))
+    conn.commit()
+    conn.close()
+
+def worker_loop():
+    """Worker loop: loads Qwen model once, then processes queued tasks."""
+    print("🤖 TTT Worker starting — importing ttt package...")
+
+    POLL_INTERVAL = 3
+
+    try:
+        from ttt.runner import initiate
+        # Warm up: load the engine by doing a tiny call (model load happens inside initiate)
+        print("📥 Loading Qwen model (this may take a few minutes)...")
+        initiate({'text': 'Hi', 'model': 'qwen', 'max_new_tokens': 1})
+        print("✅ Qwen model ready")
+    except Exception as e:
+        print(f"❌ Failed to load model: {e}")
+        return
+
+    from ttt.runner import initiate
+
+    print("🤖 TTT Worker ready. Monitoring for new tasks...")
+
+    while worker_running:
+        cleanup_old_entries()
+        try:
+            conn = sqlite3.connect('text_tasks.db')
+            conn.row_factory = sqlite3.Row
+            c = conn.cursor()
+            c.execute('''SELECT * FROM text_tasks
+                         WHERE status = 'not_started'
+                         ORDER BY created_at ASC
+                         LIMIT 1''')
+            row = c.fetchone()
+            conn.close()
+
+            if row:
+                task_id = row['id']
+                input_text = row['input_text']
+                system_prompt = row['system_prompt'] or "You are a helpful assistant."
+
+                print(f"\n{'='*60}")
+                print(f"📝 Processing task: {task_id}")
+                print(f"📌 Input: {input_text[:100]}{'...' if len(input_text) > 100 else ''}")
+                print(f"{'='*60}")
+
+                update_status(task_id, 'processing')
+
+                def make_progress_cb(tid):
+                    def cb(percent, text):
+                        update_progress(tid, percent, text)
+                    return cb
+
+                try:
+                    result = initiate(
+                        {
+                            'text': input_text,
+                            'system_prompt': system_prompt,
+                            'model': 'qwen',
+                        },
+                        progress_callback=make_progress_cb(task_id)
+                    )
+
+                    if result:
+                        import json
+                        print(f"✅ Task completed: {task_id}")
+                        print(f"📄 Output preview: {result.get('text', '')[:100]}...")
+                        update_status(task_id, 'completed', result=json.dumps(result))
+                    else:
+                        raise Exception("initiate() returned empty result")
+
+                except Exception as e:
+                    print(f"❌ Task failed: {task_id} — {e}")
+                    update_status(task_id, 'failed', error=str(e))
+            else:
+                time.sleep(POLL_INTERVAL)
+
+        except Exception as e:
+            print(f"⚠️  Worker error: {e}")
+            time.sleep(POLL_INTERVAL)
+
+@app.route('/')
+def index():
+    return send_from_directory('.', 'index.html')
+
+@app.route('/api/submit', methods=['POST'])
+def submit_task():
+    data = request.get_json()
+    if not data or not data.get('text', '').strip():
+        return jsonify({'error': 'No input text provided'}), 400
+
+    task_id = str(uuid.uuid4())
+    input_text = data['text'].strip()
+    system_prompt = data.get('system_prompt', '').strip() or None
+    hide_from_ui = 1 if data.get('hide_from_ui') else 0
+
+    conn = sqlite3.connect('text_tasks.db')
+    c = conn.cursor()
+    c.execute('''INSERT INTO text_tasks
+                 (id, input_text, system_prompt, status, created_at, hide_from_ui)
+                 VALUES (?, ?, ?, ?, ?, ?)''',
+              (task_id, input_text, system_prompt, 'not_started', datetime.now().isoformat(), hide_from_ui))
+    conn.commit()
+    conn.close()
+
+    start_worker()
+
+    return jsonify({
+        'id': task_id,
+        'status': 'not_started',
+        'message': 'Task submitted successfully'
+    }), 201
+
+def get_average_processing_time(cursor):
+    cursor.execute('''SELECT created_at, processed_at FROM text_tasks
+                      WHERE status = 'completed' AND processed_at IS NOT NULL
+                      ORDER BY processed_at DESC LIMIT 20''')
+    rows = cursor.fetchall()
+    if not rows:
+        return 120.0  # default: 2 min per task
+
+    total, count = 0, 0
+    for r in rows:
+        try:
+            duration = (datetime.fromisoformat(r['processed_at']) -
+                        datetime.fromisoformat(r['created_at'])).total_seconds()
+            if duration > 0:
+                total += duration
+                count += 1
+        except:
+            continue
+    return total / count if count else 120.0
+
+@app.route('/api/tasks', methods=['GET'])
+def get_tasks():
+    conn = sqlite3.connect('text_tasks.db')
+    conn.row_factory = sqlite3.Row
+    c = conn.cursor()
+
+    avg_time = get_average_processing_time(c)
+
+    c.execute("SELECT id FROM text_tasks WHERE status = 'not_started' ORDER BY created_at ASC")
+    queue_ids = [r['id'] for r in c.fetchall()]
+
+    c.execute("SELECT COUNT(*) as cnt FROM text_tasks WHERE status = 'processing'")
+    processing_count = c.fetchone()['cnt']
+
+    c.execute('SELECT * FROM text_tasks WHERE hide_from_ui = 0 OR hide_from_ui IS NULL ORDER BY created_at DESC')
+    rows = c.fetchall()
+    conn.close()
+
+    tasks = []
+    for row in rows:
+        queue_position = None
+        estimated_start_seconds = None
+
+        if row['status'] == 'not_started' and row['id'] in queue_ids:
+            queue_position = queue_ids.index(row['id']) + 1
+            files_ahead = queue_position - 1 + processing_count
+            estimated_start_seconds = round(files_ahead * avg_time)
+
+        tasks.append({
+            'id': row['id'],
+            'input_text': row['input_text'][:200] + ('...' if len(row['input_text']) > 200 else ''),
+            'status': row['status'],
+            'result': "HIDDEN_IN_LIST_VIEW",
+            'created_at': row['created_at'],
+            'processed_at': row['processed_at'],
+            'progress': row['progress'] or 0,
+            'progress_text': row['progress_text'],
+            'queue_position': queue_position,
+            'estimated_start_seconds': estimated_start_seconds
+        })
+
+    return jsonify(tasks)
+
+@app.route('/api/tasks/<task_id>', methods=['GET'])
+def get_task(task_id):
+    conn = sqlite3.connect('text_tasks.db')
+    conn.row_factory = sqlite3.Row
+    c = conn.cursor()
+    c.execute('SELECT * FROM text_tasks WHERE id = ?', (task_id,))
+    row = c.fetchone()
+
+    if row is None:
+        conn.close()
+        return jsonify({'error': 'Task not found'}), 404
+
+    queue_position = None
+    estimated_start_seconds = None
+
+    if row['status'] == 'not_started':
+        avg_time = get_average_processing_time(c)
+        c.execute("SELECT COUNT(*) as pos FROM text_tasks WHERE status = 'not_started' AND created_at < ?",
+                  (row['created_at'],))
+        queue_position = c.fetchone()['pos'] + 1
+        c.execute("SELECT COUNT(*) as cnt FROM text_tasks WHERE status = 'processing'")
+        processing_count = c.fetchone()['cnt']
+        estimated_start_seconds = round((queue_position - 1 + processing_count) * avg_time)
+
+    conn.close()
+
+    return jsonify({
+        'id': row['id'],
+        'input_text': row['input_text'],
+        'status': row['status'],
+        'result': row['result'],
+        'created_at': row['created_at'],
+        'processed_at': row['processed_at'],
+        'progress': row['progress'] or 0,
+        'progress_text': row['progress_text'],
+        'queue_position': queue_position,
+        'estimated_start_seconds': estimated_start_seconds
+    })
+
+@app.route('/health', methods=['GET'])
+def health():
+    return jsonify({
+        'status': 'healthy',
+        'service': 'text-to-text-generator',
+        'worker_running': worker_running
+    })
+
+if __name__ == '__main__':
+    init_db()
+    print("\n" + "="*60)
+    print("🚀 Text-to-Text Generator API Server (Qwen/Qwen3.5-4B)")
+    print("="*60)
+    print("📌 Worker + model load on first task submission")
+    print("="*60 + "\n")
+
+    port = int(os.environ.get('PORT', 7860))
+    app.run(debug=False, host='0.0.0.0', port=port)

index.html

@@ -0,0 +1,716 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Text-to-Text Generator</title>
+    <style>
+        * {
+            margin: 0;
+            padding: 0;
+            box-sizing: border-box;
+        }
+
+        :root {
+            --bg: #0a0e27;
+            --surface: #141b3d;
+            --primary: #00ff88;
+            --secondary: #ff00ff;
+            --accent: #00d4ff;
+            --error: #ff1744;
+            --text: #ffffff;
+            --border: 4px;
+        }
+
+        body {
+            font-family: 'Space Grotesk', 'Courier New', monospace;
+            background: var(--bg);
+            color: var(--text);
+            min-height: 100vh;
+            overflow-x: hidden;
+            position: relative;
+        }
+
+        body::before {
+            content: '';
+            position: fixed;
+            top: 0;
+            left: 0;
+            width: 100%;
+            height: 100%;
+            background:
+                radial-gradient(circle at 20% 50%, rgba(0, 255, 136, 0.1) 0%, transparent 50%),
+                radial-gradient(circle at 80% 80%, rgba(255, 0, 255, 0.1) 0%, transparent 50%),
+                radial-gradient(circle at 40% 20%, rgba(0, 212, 255, 0.1) 0%, transparent 50%);
+            pointer-events: none;
+            z-index: 0;
+        }
+
+        .container {
+            max-width: 1400px;
+            margin: 0 auto;
+            padding: 2rem;
+            position: relative;
+            z-index: 1;
+        }
+
+        header {
+            text-align: center;
+            margin-bottom: 3rem;
+            animation: slideDown 0.6s cubic-bezier(0.68, -0.55, 0.265, 1.55);
+        }
+
+        @keyframes slideDown {
+            from { opacity: 0; transform: translateY(-50px); }
+            to { opacity: 1; transform: translateY(0); }
+        }
+
+        h1 {
+            font-size: clamp(2rem, 5vw, 4rem);
+            font-weight: 900;
+            background: linear-gradient(135deg, var(--primary) 0%, var(--accent) 50%, var(--secondary) 100%);
+            -webkit-background-clip: text;
+            -webkit-text-fill-color: transparent;
+            background-clip: text;
+            text-transform: uppercase;
+            letter-spacing: -2px;
+            margin-bottom: 1rem;
+            position: relative;
+            display: inline-block;
+        }
+
+        h1::after {
+            content: '';
+            position: absolute;
+            bottom: -10px;
+            left: 50%;
+            transform: translateX(-50%);
+            width: 60%;
+            height: 6px;
+            background: linear-gradient(90deg, transparent, var(--primary), transparent);
+            animation: glow 2s ease-in-out infinite;
+        }
+
+        @keyframes glow {
+            0%, 100% { opacity: 0.5; }
+            50% { opacity: 1; }
+        }
+
+        .subtitle {
+            font-size: 1.2rem;
+            color: var(--accent);
+            letter-spacing: 2px;
+        }
+
+        .input-section {
+            background: var(--surface);
+            border: var(--border) solid var(--primary);
+            box-shadow: 8px 8px 0 var(--primary);
+            padding: 2rem;
+            margin-bottom: 3rem;
+            animation: slideUp 0.6s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0.2s both;
+        }
+
+        .input-section:hover {
+            transform: translate(-2px, -2px);
+            box-shadow: 12px 12px 0 var(--primary);
+            transition: all 0.3s ease;
+        }
+
+        @keyframes slideUp {
+            from { opacity: 0; transform: translateY(50px); }
+            to { opacity: 1; transform: translateY(0); }
+        }
+
+        .field-label {
+            color: var(--accent);
+            font-weight: 900;
+            text-transform: uppercase;
+            letter-spacing: 1px;
+            margin-bottom: 0.5rem;
+            font-size: 0.9rem;
+        }
+
+        textarea {
+            width: 100%;
+            background: var(--bg);
+            border: 3px solid var(--accent);
+            color: var(--text);
+            padding: 1rem;
+            font-family: 'Courier New', monospace;
+            font-size: 1rem;
+            line-height: 1.6;
+            resize: vertical;
+            margin-bottom: 1.5rem;
+            outline: none;
+            transition: border-color 0.3s ease;
+        }
+
+        textarea:focus {
+            border-color: var(--primary);
+        }
+
+        #inputText {
+            min-height: 150px;
+        }
+
+        #systemPrompt {
+            min-height: 80px;
+        }
+
+        .btn {
+            background: var(--primary);
+            color: var(--bg);
+            border: var(--border) solid var(--bg);
+            padding: 1rem 2rem;
+            font-size: 1.1rem;
+            font-weight: 900;
+            text-transform: uppercase;
+            cursor: pointer;
+            transition: all 0.2s ease;
+            box-shadow: 4px 4px 0 var(--bg);
+            letter-spacing: 1px;
+        }
+
+        .btn:hover:not(:disabled) {
+            transform: translate(-2px, -2px);
+            box-shadow: 6px 6px 0 var(--bg);
+        }
+
+        .btn:active:not(:disabled) {
+            transform: translate(2px, 2px);
+            box-shadow: 2px 2px 0 var(--bg);
+        }
+
+        .btn:disabled {
+            opacity: 0.6;
+            cursor: not-allowed;
+        }
+
+        .btn-secondary {
+            background: var(--accent);
+        }
+
+        .btn-small {
+            padding: 0.5rem 1rem;
+            font-size: 0.85rem;
+            box-shadow: 3px 3px 0 var(--bg);
+        }
+
+        .btn-small:hover:not(:disabled) {
+            box-shadow: 4px 4px 0 var(--bg);
+        }
+
+        .table-section {
+            animation: slideUp 0.6s cubic-bezier(0.68, -0.55, 0.265, 1.55) 0.4s both;
+        }
+
+        .table-wrapper {
+            overflow-x: auto;
+            background: var(--surface);
+            border: var(--border) solid var(--secondary);
+            box-shadow: 8px 8px 0 var(--secondary);
+        }
+
+        table {
+            width: 100%;
+            border-collapse: collapse;
+        }
+
+        thead {
+            background: linear-gradient(135deg, var(--primary), var(--accent));
+        }
+
+        th {
+            padding: 1.5rem 1rem;
+            text-align: left;
+            font-weight: 900;
+            text-transform: uppercase;
+            letter-spacing: 1px;
+            color: var(--bg);
+            border-right: 3px solid var(--bg);
+        }
+
+        th:last-child { border-right: none; }
+
+        tbody tr {
+            border-bottom: 2px solid rgba(0, 212, 255, 0.2);
+            transition: all 0.3s ease;
+            animation: fadeIn 0.5s ease;
+        }
+
+        @keyframes fadeIn {
+            from { opacity: 0; }
+            to { opacity: 1; }
+        }
+
+        tbody tr:hover { background: rgba(0, 255, 136, 0.1); }
+
+        td { padding: 1.5rem 1rem; color: var(--text); }
+
+        .status {
+            display: inline-block;
+            padding: 0.5rem 1rem;
+            border: 3px solid;
+            font-weight: 900;
+            text-transform: uppercase;
+            font-size: 0.85rem;
+            letter-spacing: 1px;
+        }
+
+        .status-not_started {
+            background: var(--bg);
+            border-color: var(--accent);
+            color: var(--accent);
+        }
+
+        .status-processing {
+            background: var(--bg);
+            border-color: var(--primary);
+            color: var(--primary);
+            animation: pulse 1.5s ease-in-out infinite;
+        }
+
+        @keyframes pulse {
+            0%, 100% { opacity: 1; }
+            50% { opacity: 0.6; }
+        }
+
+        .status-completed {
+            background: var(--primary);
+            border-color: var(--primary);
+            color: var(--bg);
+        }
+
+        .status-failed {
+            background: var(--error);
+            border-color: var(--error);
+            color: var(--text);
+        }
+
+        .empty-state {
+            text-align: center;
+            padding: 4rem 2rem;
+            color: var(--accent);
+            font-size: 1.2rem;
+        }
+
+        .progress-bar-wrap {
+            background: rgba(0,212,255,0.1);
+            border: 2px solid var(--accent);
+            height: 8px;
+            margin-top: 6px;
+            width: 120px;
+        }
+
+        .progress-bar-fill {
+            height: 100%;
+            background: var(--primary);
+            transition: width 0.4s ease;
+        }
+
+        .refresh-btn {
+            position: fixed;
+            bottom: 2rem;
+            right: 2rem;
+            width: 60px;
+            height: 60px;
+            border-radius: 50%;
+            background: var(--secondary);
+            border: var(--border) solid var(--bg);
+            box-shadow: 4px 4px 0 var(--bg);
+            cursor: pointer;
+            transition: all 0.3s ease;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            font-size: 1.5rem;
+            z-index: 1000;
+        }
+
+        .refresh-btn:hover {
+            transform: rotate(180deg) scale(1.1);
+            box-shadow: 6px 6px 0 var(--bg);
+        }
+
+        /* Modal */
+        .modal {
+            display: none;
+            position: fixed;
+            top: 0; left: 0;
+            width: 100%; height: 100%;
+            background: rgba(10, 14, 39, 0.95);
+            z-index: 2000;
+            animation: fadeIn 0.3s ease;
+            overflow-y: auto;
+        }
+
+        .modal.active {
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            padding: 2rem;
+        }
+
+        .modal-content {
+            background: var(--surface);
+            border: var(--border) solid var(--primary);
+            box-shadow: 12px 12px 0 var(--primary);
+            max-width: 900px;
+            width: 100%;
+            max-height: 85vh;
+            position: relative;
+            animation: modalSlideIn 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);
+            display: flex;
+            flex-direction: column;
+        }
+
+        @keyframes modalSlideIn {
+            from { opacity: 0; transform: translateY(-50px) scale(0.9); }
+            to { opacity: 1; transform: translateY(0) scale(1); }
+        }
+
+        .modal-header {
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+            padding: 2rem 2rem 1rem 2rem;
+            border-bottom: 3px solid var(--primary);
+            background: var(--surface);
+            position: sticky;
+            top: 0;
+            z-index: 10;
+        }
+
+        .modal-title {
+            font-size: 1.5rem;
+            font-weight: 900;
+            color: var(--primary);
+            text-transform: uppercase;
+        }
+
+        .modal-close {
+            background: var(--error);
+            color: var(--text);
+            border: 3px solid var(--bg);
+            width: 40px;
+            height: 40px;
+            cursor: pointer;
+            font-size: 1.5rem;
+            font-weight: 900;
+            transition: all 0.2s ease;
+            box-shadow: 3px 3px 0 var(--bg);
+        }
+
+        .modal-close:hover {
+            transform: translate(-2px, -2px);
+            box-shadow: 5px 5px 0 var(--bg);
+        }
+
+        .code-block {
+            background: var(--bg);
+            border: 3px solid var(--accent);
+            padding: 1.5rem;
+            overflow-y: auto;
+            margin: 1.5rem 2rem 2rem 2rem;
+            position: relative;
+            flex: 1;
+        }
+
+        .code-block code {
+            font-family: 'Courier New', monospace;
+            color: var(--primary);
+            font-size: 0.95rem;
+            line-height: 1.6;
+            white-space: pre-wrap;
+            word-break: break-word;
+        }
+
+        .copy-btn {
+            position: sticky;
+            top: 0.5rem;
+            float: right;
+            background: var(--accent);
+            color: var(--bg);
+            border: 3px solid var(--bg);
+            padding: 0.5rem 1rem;
+            font-size: 0.8rem;
+            font-weight: 900;
+            cursor: pointer;
+            transition: all 0.2s ease;
+            box-shadow: 3px 3px 0 var(--bg);
+            z-index: 5;
+        }
+
+        .copy-btn:hover { transform: translate(-2px, -2px); box-shadow: 4px 4px 0 var(--bg); }
+        .copy-btn.copied { background: var(--primary); }
+
+        .notification {
+            position: fixed;
+            top: 2rem;
+            right: 2rem;
+            padding: 1.5rem 2rem;
+            background: var(--primary);
+            color: var(--bg);
+            border: var(--border) solid var(--bg);
+            box-shadow: 6px 6px 0 var(--bg);
+            font-weight: 900;
+            z-index: 2000;
+            animation: slideInRight 0.5s ease, slideOutRight 0.5s ease 3.5s;
+        }
+
+        @keyframes slideInRight {
+            from { transform: translateX(400px); opacity: 0; }
+            to { transform: translateX(0); opacity: 1; }
+        }
+
+        @keyframes slideOutRight {
+            to { transform: translateX(400px); opacity: 0; }
+        }
+
+        @media (max-width: 768px) {
+            .container { padding: 1rem; }
+            .input-section, .table-wrapper { box-shadow: 4px 4px 0 var(--primary); }
+            th, td { padding: 1rem 0.5rem; font-size: 0.9rem; }
+            .modal-content { padding: 0; }
+            .code-block { margin: 1rem; }
+        }
+    </style>
+</head>
+
+<body>
+    <div class="container">
+        <header>
+            <h1>Text-to-Text Generator</h1>
+            <p class="subtitle">Qwen3.5-9B &bull; Submit &bull; Queue &bull; Generate</p>
+        </header>
+
+        <div class="input-section">
+            <h2 style="margin-bottom: 1.5rem; color: var(--primary);">Submit Text Task</h2>
+
+            <div class="field-label">System Prompt (optional)</div>
+            <textarea id="systemPrompt" placeholder="You are a helpful assistant."></textarea>
+
+            <div class="field-label">Input Text *</div>
+            <textarea id="inputText" placeholder="Enter your prompt or text here..."></textarea>
+
+            <button class="btn" id="submitBtn" style="width: 100%;">
+                🚀 Submit &amp; Process
+            </button>
+        </div>
+
+        <div class="table-section">
+            <h2 style="margin-bottom: 1.5rem; color: var(--secondary);">Processing Queue</h2>
+            <div class="table-wrapper">
+                <table>
+                    <thead>
+                        <tr>
+                            <th>Input</th>
+                            <th>Status</th>
+                            <th>Progress</th>
+                            <th>Est. Wait</th>
+                            <th>Result</th>
+                            <th>Created</th>
+                            <th>Processed</th>
+                        </tr>
+                    </thead>
+                    <tbody id="tasksTable">
+                        <tr>
+                            <td colspan="7" class="empty-state">No tasks submitted yet. Enter some text above!</td>
+                        </tr>
+                    </tbody>
+                </table>
+            </div>
+        </div>
+    </div>
+
+    <button class="refresh-btn" id="refreshBtn" title="Refresh">🔄</button>
+
+    <!-- Modal -->
+    <div class="modal" id="resultModal">
+        <div class="modal-content">
+            <div class="modal-header">
+                <div class="modal-title">📄 Result</div>
+                <button class="modal-close" onclick="closeModal()">×</button>
+            </div>
+            <div class="code-block">
+                <button class="copy-btn" onclick="copyResult()">📋 Copy</button>
+                <code id="resultCode"></code>
+            </div>
+        </div>
+    </div>
+
+    <script>
+        const API_URL = '/api';
+        const resultStore = new Map();
+
+        const submitBtn = document.getElementById('submitBtn');
+        const inputText = document.getElementById('inputText');
+        const systemPrompt = document.getElementById('systemPrompt');
+
+        async function submitTask() {
+            const text = inputText.value.trim();
+            if (!text) {
+                showNotification('Please enter some input text.', 'error');
+                return;
+            }
+
+            submitBtn.disabled = true;
+            submitBtn.textContent = '⏳ Submitting...';
+
+            try {
+                const response = await fetch(`${API_URL}/submit`, {
+                    method: 'POST',
+                    headers: { 'Content-Type': 'application/json' },
+                    body: JSON.stringify({
+                        text: text,
+                        system_prompt: systemPrompt.value.trim() || undefined
+                    })
+                });
+
+                const data = await response.json();
+
+                if (response.ok) {
+                    showNotification(`Task submitted! ID: ${data.id.slice(0, 8)}...`);
+                    inputText.value = '';
+                    loadTasks();
+                } else {
+                    showNotification(data.error || 'Submission failed', 'error');
+                }
+            } catch (error) {
+                showNotification('Network error: ' + error.message, 'error');
+            } finally {
+                submitBtn.disabled = false;
+                submitBtn.textContent = '🚀 Submit & Process';
+            }
+        }
+
+        submitBtn.addEventListener('click', submitTask);
+
+        inputText.addEventListener('keydown', (e) => {
+            if (e.ctrlKey && e.key === 'Enter') submitTask();
+        });
+
+        async function loadTasks() {
+            try {
+                const response = await fetch(`${API_URL}/tasks`);
+                const tasks = await response.json();
+
+                const tbody = document.getElementById('tasksTable');
+                resultStore.clear();
+
+                if (tasks.length === 0) {
+                    tbody.innerHTML = '<tr><td colspan="7" class="empty-state">No tasks submitted yet. Enter some text above!</td></tr>';
+                    return;
+                }
+
+                tbody.innerHTML = tasks.map(task => {
+                    if (task.result && task.result !== 'HIDDEN_IN_LIST_VIEW') {
+                        resultStore.set(task.id, task.result);
+                    }
+
+                    const inputPreview = task.input_text.length > 60
+                        ? task.input_text.slice(0, 60) + '...'
+                        : task.input_text;
+
+                    let estWait = '—';
+                    if (task.status === 'not_started' && task.estimated_start_seconds !== null) {
+                        const s = task.estimated_start_seconds;
+                        if (s < 60) estWait = `${s}s`;
+                        else if (s < 3600) {
+                            const m = Math.floor(s / 60), sec = s % 60;
+                            estWait = sec > 0 ? `${m}m ${sec}s` : `${m}m`;
+                        } else {
+                            const h = Math.floor(s / 3600), m = Math.floor((s % 3600) / 60);
+                            estWait = m > 0 ? `${h}h ${m}m` : `${h}h`;
+                        }
+                        if (task.queue_position) estWait = `#${task.queue_position} (${estWait})`;
+                    } else if (task.status === 'processing') {
+                        estWait = '⏳ Processing...';
+                    }
+
+                    const progress = task.progress || 0;
+                    const progressHtml = task.status === 'processing' || (task.status === 'not_started' && progress > 0)
+                        ? `<div>${progress}%</div>
+                           <div class="progress-bar-wrap">
+                             <div class="progress-bar-fill" style="width:${progress}%"></div>
+                           </div>
+                           <div style="font-size:0.75rem;color:var(--accent);margin-top:4px">${task.progress_text || ''}</div>`
+                        : task.status === 'completed' ? '✅ 100%' : '—';
+
+                    const resultHtml = task.status === 'completed'
+                        ? `<button class="btn btn-small btn-secondary" onclick="showResult('${task.id}')">Show</button>`
+                        : task.status === 'failed'
+                            ? `<button class="btn btn-small" style="background:var(--error)" onclick="showResult('${task.id}')">Error</button>`
+                            : '—';
+
+                    return `
+                        <tr>
+                            <td><strong>${inputPreview}</strong></td>
+                            <td><span class="status status-${task.status}">${task.status.replace('_', ' ')}</span></td>
+                            <td>${progressHtml}</td>
+                            <td>${estWait}</td>
+                            <td>${resultHtml}</td>
+                            <td>${new Date(task.created_at).toLocaleString()}</td>
+                            <td>${task.processed_at ? new Date(task.processed_at).toLocaleString() : '—'}</td>
+                        </tr>`;
+                }).join('');
+            } catch (error) {
+                console.error('Error loading tasks:', error);
+            }
+        }
+
+        async function showResult(taskId) {
+            // Fetch full result from individual endpoint
+            try {
+                const response = await fetch(`${API_URL}/tasks/${taskId}`);
+                const task = await response.json();
+
+                const modal = document.getElementById('resultModal');
+                const code = document.getElementById('resultCode');
+                code.textContent = task.result || '(no result)';
+                resultStore.set(taskId, task.result || '');
+                modal.classList.add('active');
+            } catch (e) {
+                showNotification('Failed to load result', 'error');
+            }
+        }
+
+        function closeModal() {
+            document.getElementById('resultModal').classList.remove('active');
+        }
+
+        function copyResult() {
+            const code = document.getElementById('resultCode');
+            const btn = event.target;
+            navigator.clipboard.writeText(code.textContent).then(() => {
+                const orig = btn.textContent;
+                btn.textContent = '✓ Copied!';
+                btn.classList.add('copied');
+                setTimeout(() => { btn.textContent = orig; btn.classList.remove('copied'); }, 2000);
+            });
+        }
+
+        document.getElementById('resultModal').addEventListener('click', (e) => {
+            if (e.target.id === 'resultModal') closeModal();
+        });
+
+        document.addEventListener('keydown', (e) => {
+            if (e.key === 'Escape') closeModal();
+        });
+
+        document.getElementById('refreshBtn').addEventListener('click', loadTasks);
+
+        // Auto-refresh every 5 seconds when tasks are processing
+        setInterval(async () => {
+            const rows = document.querySelectorAll('.status-processing, .status-not_started');
+            if (rows.length > 0) loadTasks();
+        }, 5000);
+
+        // Initial load
+        loadTasks();
+    </script>
+</body>
+
+</html>

requirements.txt

@@ -0,0 +1,6 @@
+Flask==3.0.0
+flask-cors==4.0.0
+werkzeug==3.0.1
+
+# TTT - Qwen model
+git+https://github.com/jebin2/TTT.git#egg=ttt-runner[qwen]