diff --git "a/app.py" "b/app.py"
deleted file mode 100644--- "a/app.py"
+++ /dev/null
@@ -1,2875 +0,0 @@
-import asyncio
-import base64
-import json
-from pathlib import Path
-import os
-import numpy as np
-import openai
-from dotenv import load_dotenv
-from fastapi import FastAPI, Request, UploadFile, File, Form
-from fastapi.responses import HTMLResponse, StreamingResponse, JSONResponse
-from fastrtc import (
-    AdditionalOutputs,
-    AsyncStreamHandler,
-    Stream,
-    get_twilio_turn_credentials,
-    wait_for_item,
-)
-from gradio.utils import get_space
-from openai.types.beta.realtime import ResponseAudioTranscriptDoneEvent
-import httpx
-from typing import Optional, List, Dict
-import gradio as gr
-import io
-from scipy import signal
-import wave
-import torch
-from transformers import pipeline
-import tempfile
-import subprocess
-import pdfplumber
-import scipy.signal as sps
-from datetime import datetime
-from zoneinfo import ZoneInfo
-import concurrent.futures
-
-load_dotenv()
-
-SAMPLE_RATE = 24000
-WHISPER_SAMPLE_RATE = 16000
-SEOUL_TZ = ZoneInfo("Asia/Seoul")
-
-# Whisper model settings
-WHISPER_MODEL_NAME = "openai/whisper-large-v3-turbo"
-WHISPER_BATCH_SIZE = 8
-
-# Real-time segmentation parameters
-MIN_SEG_SEC = 10
-MAX_SEG_SEC = 15
-SILENCE_SEC = 0.6
-SILENCE_THRESH = 1e-4
-
-# CPU-side pool for Whisper tasks
-whisper_executor = concurrent.futures.ThreadPoolExecutor(max_workers=3)
-whisper_futures_queue: list[concurrent.futures.Future] = []
-
-# Supported languages for OpenAI Realtime API
-SUPPORTED_LANGUAGES = {
-    "ko": "한국어 (Korean)",
-    "en": "English",
-    "es": "Español (Spanish)",
-    "fr": "Français (French)",
-    "de": "Deutsch (German)",
-    "it": "Italiano (Italian)",
-    "pt": "Português (Portuguese)",
-    "ru": "Русский (Russian)",
-    "ja": "日本語 (Japanese)",
-    "zh": "中文 (Chinese)",
-    "ar": "العربية (Arabic)",
-    "hi": "हिन्दी (Hindi)",
-    "nl": "Nederlands (Dutch)",
-    "pl": "Polski (Polish)",
-    "tr": "Türkçe (Turkish)",
-    "vi": "Tiếng Việt (Vietnamese)",
-    "th": "ไทย (Thai)",
-    "id": "Bahasa Indonesia",
-    "sv": "Svenska (Swedish)",
-    "da": "Dansk (Danish)",
-    "no": "Norsk (Norwegian)",
-    "fi": "Suomi (Finnish)",
-    "he": "עברית (Hebrew)",
-    "uk": "Українська (Ukrainian)",
-    "cs": "Čeština (Czech)",
-    "el": "Ελληνικά (Greek)",
-    "ro": "Română (Romanian)",
-    "hu": "Magyar (Hungarian)",
-    "ms": "Bahasa Melayu (Malay)"
-}
-
-# HTML content embedded as a string (extended with new tabs)
-HTML_CONTENT = """<!DOCTYPE html>
-<html lang="ko">
-
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Mouth of 'MOUSE' - Extended</title>
-    <style>
-        :root {
-            --primary-color: #6f42c1;
-            --secondary-color: #563d7c;
-            --dark-bg: #121212;
-            --card-bg: #1e1e1e;
-            --text-color: #f8f9fa;
-            --border-color: #333;
-            --hover-color: #8a5cf6;
-        }
-        body {
-            font-family: "SF Pro Display", -apple-system, BlinkMacSystemFont, sans-serif;
-            background-color: var(--dark-bg);
-            color: var(--text-color);
-            margin: 0;
-            padding: 0;
-            height: 100vh;
-            display: flex;
-            flex-direction: column;
-            overflow: hidden;
-        }
-        .container {
-            max-width: 1400px;
-            margin: 0 auto;
-            padding: 20px;
-            flex-grow: 1;
-            display: flex;
-            flex-direction: column;
-            width: 100%;
-            height: 100vh;
-            box-sizing: border-box;
-            overflow: hidden;
-        }
-        .header {
-            text-align: center;
-            padding: 15px 0;
-            border-bottom: 1px solid var(--border-color);
-            margin-bottom: 20px;
-            flex-shrink: 0;
-            background-color: var(--card-bg);
-        }
-        .tabs-container {
-            display: flex;
-            gap: 10px;
-            margin-bottom: 20px;
-            border-bottom: 2px solid var(--border-color);
-            padding-bottom: 10px;
-            overflow-x: auto;
-            scrollbar-width: thin;
-            scrollbar-color: var(--primary-color) var(--card-bg);
-        }
-        .tab-button {
-            padding: 10px 20px;
-            background-color: var(--card-bg);
-            color: var(--text-color);
-            border: 1px solid var(--border-color);
-            border-radius: 8px 8px 0 0;
-            cursor: pointer;
-            transition: all 0.3s;
-            white-space: nowrap;
-            font-size: 14px;
-        }
-        .tab-button:hover {
-            background-color: var(--secondary-color);
-        }
-        .tab-button.active {
-            background-color: var(--primary-color);
-            border-bottom: 2px solid var(--primary-color);
-        }
-        .tab-content {
-            display: none;
-            flex-grow: 1;
-            overflow: hidden;
-            flex-direction: column;
-        }
-        .tab-content.active {
-            display: flex;
-        }
-        .main-content {
-            display: flex;
-            gap: 20px;
-            flex-grow: 1;
-            min-height: 0;
-            overflow: hidden;
-        }
-        .sidebar {
-            width: 350px;
-            flex-shrink: 0;
-            display: flex;
-            flex-direction: column;
-            gap: 20px;
-            overflow-y: auto;
-            max-height: calc(100vh - 120px);
-        }
-        .chat-section {
-            flex-grow: 1;
-            display: flex;
-            flex-direction: column;
-            min-width: 0;
-        }
-        .logo {
-            display: flex;
-            align-items: center;
-            justify-content: center;
-            gap: 10px;
-        }
-        .logo h1 {
-            margin: 0;
-            background: linear-gradient(135deg, var(--primary-color), #a78bfa);
-            -webkit-background-clip: text;
-            background-clip: text;
-            color: transparent;
-            font-size: 32px;
-            letter-spacing: 1px;
-        }
-        /* Settings section */
-        .settings-section {
-            background-color: var(--card-bg);
-            border-radius: 12px;
-            padding: 20px;
-            border: 1px solid var(--border-color);
-            overflow-y: auto;
-            flex-grow: 1;
-        }
-        .settings-grid {
-            display: flex;
-            flex-direction: column;
-            gap: 15px;
-            margin-bottom: 15px;
-        }
-        .setting-item {
-            display: flex;
-            align-items: center;
-            justify-content: space-between;
-            gap: 10px;
-        }
-        .setting-label {
-            font-size: 14px;
-            color: #aaa;
-            min-width: 60px;
-        }
-        /* Toggle switch */
-        .toggle-switch {
-            position: relative;
-            width: 50px;
-            height: 26px;
-            background-color: #ccc;
-            border-radius: 13px;
-            cursor: pointer;
-            transition: background-color 0.3s;
-        }
-        .toggle-switch.active {
-            background-color: var(--primary-color);
-        }
-        .toggle-slider {
-            position: absolute;
-            top: 3px;
-            left: 3px;
-            width: 20px;
-            height: 20px;
-            background-color: white;
-            border-radius: 50%;
-            transition: transform 0.3s;
-        }
-        .toggle-switch.active .toggle-slider {
-            transform: translateX(24px);
-        }
-        /* Select dropdown */
-        select {
-            background-color: var(--card-bg);
-            color: var(--text-color);
-            border: 1px solid var(--border-color);
-            padding: 8px 12px;
-            border-radius: 6px;
-            font-size: 14px;
-            cursor: pointer;
-            min-width: 120px;
-            max-width: 200px;
-        }
-        select:focus {
-            outline: none;
-            border-color: var(--primary-color);
-        }
-        /* Text inputs */
-        .text-input-section {
-            margin-top: 15px;
-        }
-        input[type="text"], input[type="file"], textarea {
-            width: 100%;
-            background-color: var(--dark-bg);
-            color: var(--text-color);
-            border: 1px solid var(--border-color);
-            padding: 10px;
-            border-radius: 6px;
-            font-size: 14px;
-            box-sizing: border-box;
-            margin-top: 5px;
-        }
-        input[type="text"]:focus, textarea:focus {
-            outline: none;
-            border-color: var(--primary-color);
-        }
-        textarea {
-            resize: vertical;
-            min-height: 80px;
-        }
-        .chat-container {
-            border-radius: 12px;
-            background-color: var(--card-bg);
-            box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
-            padding: 20px;
-            flex-grow: 1;
-            display: flex;
-            flex-direction: column;
-            border: 1px solid var(--border-color);
-            overflow: hidden;
-            min-height: 0;
-            height: 100%;
-        }
-        .chat-messages {
-            flex-grow: 1;
-            overflow-y: auto;
-            padding: 15px;
-            scrollbar-width: thin;
-            scrollbar-color: var(--primary-color) var(--card-bg);
-            min-height: 0;
-            max-height: calc(100vh - 250px);
-        }
-        .chat-messages::-webkit-scrollbar {
-            width: 6px;
-        }
-        .chat-messages::-webkit-scrollbar-thumb {
-            background-color: var(--primary-color);
-            border-radius: 6px;
-        }
-        .message {
-            margin-bottom: 15px;
-            padding: 12px 16px;
-            border-radius: 8px;
-            font-size: 15px;
-            line-height: 1.5;
-            position: relative;
-            max-width: 85%;
-            animation: fade-in 0.3s ease-out;
-            word-wrap: break-word;
-        }
-        @keyframes fade-in {
-            from {
-                opacity: 0;
-                transform: translateY(10px);
-            }
-            to {
-                opacity: 1;
-                transform: translateY(0);
-            }
-        }
-        .message.user {
-            background: linear-gradient(135deg, #2c3e50, #34495e);
-            margin-left: auto;
-            border-bottom-right-radius: 2px;
-        }
-        .message.assistant {
-            background: linear-gradient(135deg, var(--secondary-color), var(--primary-color));
-            margin-right: auto;
-            border-bottom-left-radius: 2px;
-        }
-        .message.search-result {
-            background: linear-gradient(135deg, #1a5a3e, #2e7d32);
-            font-size: 14px;
-            padding: 10px;
-            margin-bottom: 10px;
-        }
-        .language-info {
-            font-size: 12px;
-            color: #888;
-            margin-left: 5px;
-        }
-        .controls {
-            text-align: center;
-            margin-top: auto;
-            display: flex;
-            justify-content: center;
-            gap: 10px;
-            flex-shrink: 0;
-            padding-top: 20px;
-        }
-        /* Whisper Tab Styles */
-        .whisper-container {
-            padding: 20px;
-            background-color: var(--card-bg);
-            border-radius: 12px;
-            border: 1px solid var(--border-color);
-            margin: 20px auto;
-            max-width: 800px;
-            width: 100%;
-        }
-        .whisper-input-section {
-            margin-bottom: 20px;
-        }
-        .whisper-output-section {
-            display: grid;
-            grid-template-columns: 1fr 1fr;
-            gap: 20px;
-            margin-top: 20px;
-        }
-        .whisper-output {
-            background-color: var(--dark-bg);
-            padding: 15px;
-            border-radius: 8px;
-            border: 1px solid var(--border-color);
-            max-height: 300px;
-            overflow-y: auto;
-        }
-        .whisper-output h4 {
-            margin-top: 0;
-            color: var(--primary-color);
-        }
-        .file-upload-area {
-            border: 2px dashed var(--border-color);
-            border-radius: 8px;
-            padding: 30px;
-            text-align: center;
-            cursor: pointer;
-            transition: all 0.3s;
-        }
-        .file-upload-area:hover {
-            border-color: var(--primary-color);
-            background-color: rgba(111, 66, 193, 0.1);
-        }
-        .file-upload-area.drag-over {
-            border-color: var(--primary-color);
-            background-color: rgba(111, 66, 193, 0.2);
-        }
-        .realtime-output {
-            background-color: var(--dark-bg);
-            padding: 20px;
-            border-radius: 8px;
-            margin-top: 20px;
-            min-height: 200px;
-            max-height: 400px;
-            overflow-y: auto;
-        }
-        .recording-indicator {
-            display: inline-flex;
-            align-items: center;
-            gap: 10px;
-            padding: 10px 20px;
-            background-color: #f44336;
-            color: white;
-            border-radius: 20px;
-            animation: pulse 1.5s infinite;
-        }
-        .recording-dot {
-            width: 10px;
-            height: 10px;
-            background-color: white;
-            border-radius: 50%;
-            animation: blink 1s infinite;
-        }
-        @keyframes blink {
-            0%, 50% { opacity: 1; }
-            51%, 100% { opacity: 0; }
-        }
-        /* Responsive design */
-        @media (max-width: 1024px) {
-            .sidebar {
-                width: 300px;
-            }
-            .whisper-output-section {
-                grid-template-columns: 1fr;
-            }
-        }
-        @media (max-width: 768px) {
-            .main-content {
-                flex-direction: column;
-            }
-            .sidebar {
-                width: 100%;
-                margin-bottom: 20px;
-            }
-            .chat-section {
-                height: 400px;
-            }
-            .tabs-container {
-                flex-wrap: wrap;
-            }
-        }
-        button {
-            background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
-            color: white;
-            border: none;
-            padding: 14px 28px;
-            font-family: inherit;
-            font-size: 16px;
-            cursor: pointer;
-            transition: all 0.3s;
-            text-transform: uppercase;
-            letter-spacing: 1px;
-            border-radius: 50px;
-            display: flex;
-            align-items: center;
-            justify-content: center;
-            gap: 10px;
-            box-shadow: 0 4px 10px rgba(111, 66, 193, 0.3);
-        }
-        button:hover {
-            transform: translateY(-2px);
-            box-shadow: 0 6px 15px rgba(111, 66, 193, 0.5);
-            background: linear-gradient(135deg, var(--hover-color), var(--primary-color));
-        }
-        button:active {
-            transform: translateY(1px);
-        }
-        #send-button {
-            background: linear-gradient(135deg, #2ecc71, #27ae60);
-            padding: 10px 20px;
-            font-size: 14px;
-            flex-shrink: 0;
-        }
-        #send-button:hover {
-            background: linear-gradient(135deg, #27ae60, #229954);
-        }
-        #audio-output {
-            display: none;
-        }
-        .icon-with-spinner {
-            display: flex;
-            align-items: center;
-            justify-content: center;
-            gap: 12px;
-            min-width: 180px;
-        }
-        .spinner {
-            width: 20px;
-            height: 20px;
-            border: 2px solid #ffffff;
-            border-top-color: transparent;
-            border-radius: 50%;
-            animation: spin 1s linear infinite;
-            flex-shrink: 0;
-        }
-        @keyframes spin {
-            to {
-                transform: rotate(360deg);
-            }
-        }
-        .audio-visualizer {
-            display: flex;
-            align-items: center;
-            justify-content: center;
-            gap: 5px;
-            min-width: 80px;
-            height: 25px;
-        }
-        .visualizer-bar {
-            width: 4px;
-            height: 100%;
-            background-color: rgba(255, 255, 255, 0.7);
-            border-radius: 2px;
-            transform-origin: bottom;
-            transform: scaleY(0.1);
-            transition: transform 0.1s ease;
-        }
-        .toast {
-            position: fixed;
-            top: 20px;
-            left: 50%;
-            transform: translateX(-50%);
-            padding: 16px 24px;
-            border-radius: 8px;
-            font-size: 14px;
-            z-index: 1000;
-            display: none;
-            box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
-        }
-        .toast.error {
-            background-color: #f44336;
-            color: white;
-        }
-        .toast.warning {
-            background-color: #ff9800;
-            color: white;
-        }
-        .toast.success {
-            background-color: #4caf50;
-            color: white;
-        }
-        .status-indicator {
-            display: inline-flex;
-            align-items: center;
-            margin-top: 10px;
-            font-size: 14px;
-            color: #aaa;
-        }
-        .status-dot {
-            width: 8px;
-            height: 8px;
-            border-radius: 50%;
-            margin-right: 8px;
-        }
-        .status-dot.connected {
-            background-color: #4caf50;
-        }
-        .status-dot.disconnected {
-            background-color: #f44336;
-        }
-        .status-dot.connecting {
-            background-color: #ff9800;
-            animation: pulse 1.5s infinite;
-        }
-        @keyframes pulse {
-            0% {
-                opacity: 0.6;
-            }
-            50% {
-                opacity: 1;
-            }
-            100% {
-                opacity: 0.6;
-            }
-        }
-        .mouse-logo {
-            position: relative;
-            width: 40px;
-            height: 40px;
-        }
-        .mouse-ears {
-            position: absolute;
-            width: 15px;
-            height: 15px;
-            background-color: var(--primary-color);
-            border-radius: 50%;
-        }
-        .mouse-ear-left {
-            top: 0;
-            left: 5px;
-        }
-        .mouse-ear-right {
-            top: 0;
-            right: 5px;
-        }
-        .mouse-face {
-            position: absolute;
-            top: 10px;
-            left: 5px;
-            width: 30px;
-            height: 30px;
-            background-color: var(--secondary-color);
-            border-radius: 50%;
-        }
-    </style>
-</head>
-
-<body>
-    <div id="error-toast" class="toast"></div>
-    <div class="container">
-        <div class="header">
-            <div class="logo">
-                <div class="mouse-logo">
-                    <div class="mouse-ears mouse-ear-left"></div>
-                    <div class="mouse-ears mouse-ear-right"></div>
-                    <div class="mouse-face"></div>
-                </div>
-                <h1>MOUSE Extended</h1>
-            </div>
-            <div class="status-indicator">
-                <div id="status-dot" class="status-dot disconnected"></div>
-                <span id="status-text">연결 대기 중</span>
-            </div>
-        </div>
-        
-        <div class="tabs-container">
-            <button class="tab-button active" onclick="switchTab('voice-chat')">음성 채팅</button>
-            <button class="tab-button" onclick="switchTab('mic-whisper')">마이크 전사</button>
-            <button class="tab-button" onclick="switchTab('audio-whisper')">오디오 파일</button>
-            <button class="tab-button" onclick="switchTab('video-whisper')">비디오 파일</button>
-            <button class="tab-button" onclick="switchTab('pdf-whisper')">PDF 번역</button>
-            <button class="tab-button" onclick="switchTab('realtime-whisper')">실시간 통역</button>
-        </div>
-        
-        <!-- Voice Chat Tab (Original) -->
-        <div id="voice-chat" class="tab-content active">
-            <div class="main-content">
-                <div class="sidebar">
-                    <div class="settings-section">
-                        <h3 style="margin: 0 0 15px 0; color: var(--primary-color);">설정(텍스트 채팅에만 적용)</h3>
-                        <div class="settings-grid">
-                            <div class="setting-item">
-                                <span class="setting-label">웹 검색</span>
-                                <div id="search-toggle" class="toggle-switch">
-                                    <div class="toggle-slider"></div>
-                                </div>
-                            </div>
-                            <div class="setting-item">
-                                <span class="setting-label">다국어 번역 채팅</span>
-                                <select id="language-select">
-                                    <option value="">비활성화</option>
-                                    <option value="ko">한국어 (Korean)</option>
-                                    <option value="en">English</option>
-                                    <option value="es">Español (Spanish)</option>
-                                    <option value="fr">Français (French)</option>
-                                    <option value="de">Deutsch (German)</option>
-                                    <option value="it">Italiano (Italian)</option>
-                                    <option value="pt">Português (Portuguese)</option>
-                                    <option value="ru">Русский (Russian)</option>
-                                    <option value="ja">日本語 (Japanese)</option>
-                                    <option value="zh">中文 (Chinese)</option>
-                                    <option value="ar">العربية (Arabic)</option>
-                                    <option value="hi">हिन्दी (Hindi)</option>
-                                    <option value="nl">Nederlands (Dutch)</option>
-                                    <option value="pl">Polski (Polish)</option>
-                                    <option value="tr">Türkçe (Turkish)</option>
-                                    <option value="vi">Tiếng Việt (Vietnamese)</option>
-                                    <option value="th">ไทย (Thai)</option>
-                                    <option value="id">Bahasa Indonesia</option>
-                                    <option value="sv">Svenska (Swedish)</option>
-                                    <option value="da">Dansk (Danish)</option>
-                                    <option value="no">Norsk (Norwegian)</option>
-                                    <option value="fi">Suomi (Finnish)</option>
-                                    <option value="he">עברית (Hebrew)</option>
-                                    <option value="uk">Українська (Ukrainian)</option>
-                                    <option value="cs">Čeština (Czech)</option>
-                                    <option value="el">Ελληνικά (Greek)</option>
-                                    <option value="ro">Română (Romanian)</option>
-                                    <option value="hu">Magyar (Hungarian)</option>
-                                    <option value="ms">Bahasa Melayu (Malay)</option>
-                                </select>
-                            </div>
-                        </div>
-                        <div class="text-input-section">
-                            <label for="system-prompt" class="setting-label">시스템 프롬프트:</label>
-                            <textarea id="system-prompt" placeholder="AI 어시스턴트의 성격, 역할, 행동 방식을 정의하세요...">You are a helpful assistant. Respond in a friendly and professional manner.</textarea>
-                        </div>
-                    </div>
-                    
-                    <div class="controls">
-                        <button id="start-button">대화 시작</button>
-                    </div>
-                </div>
-                
-                <div class="chat-section">
-                    <div class="chat-container">
-                        <h3 style="margin: 0 0 15px 0; color: var(--primary-color);">대화</h3>
-                        <div class="chat-messages" id="chat-messages"></div>
-                        <div class="text-input-section" style="margin-top: 10px;">
-                            <div style="display: flex; gap: 10px;">
-                                <input type="text" id="text-input" placeholder="텍스트 메시지를 입력하세요..." style="flex-grow: 1;" />
-                                <button id="send-button" style="display: none;">전송</button>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-        
-        <!-- Microphone Whisper Tab -->
-        <div id="mic-whisper" class="tab-content">
-            <div class="whisper-container">
-                <h3>마이크 녹음 → 전사 및 4개 언어 번역</h3>
-                <div class="whisper-input-section">
-                    <button id="mic-record-btn" onclick="toggleMicRecording()">녹음 시작</button>
-                    <div id="mic-status" style="margin-top: 10px;"></div>
-                </div>
-                <div class="whisper-output-section">
-                    <div class="whisper-output">
-                        <h4>원문</h4>
-                        <div id="mic-original"></div>
-                    </div>
-                    <div class="whisper-output">
-                        <h4>번역 (EN/ZH/TH/RU)</h4>
-                        <div id="mic-translation"></div>
-                    </div>
-                </div>
-            </div>
-        </div>
-        
-        <!-- Audio File Whisper Tab -->
-        <div id="audio-whisper" class="tab-content">
-            <div class="whisper-container">
-                <h3>오디오 파일 → 전사 및 4개 언어 번역</h3>
-                <div class="whisper-input-section">
-                    <div class="file-upload-area" id="audio-upload-area">
-                        <p>오디오 파일을 드래그하거나 클릭하여 업로드</p>
-                        <input type="file" id="audio-file-input" accept="audio/*" style="display: none;">
-                    </div>
-                </div>
-                <div class="whisper-output-section">
-                    <div class="whisper-output">
-                        <h4>원문</h4>
-                        <div id="audio-original"></div>
-                    </div>
-                    <div class="whisper-output">
-                        <h4>번역 (EN/ZH/TH/RU)</h4>
-                        <div id="audio-translation"></div>
-                    </div>
-                </div>
-            </div>
-        </div>
-        
-        <!-- Video File Whisper Tab -->
-        <div id="video-whisper" class="tab-content">
-            <div class="whisper-container">
-                <h3>비디오 파일 → 오디오 추출 → 전사 및 4개 언어 번역</h3>
-                <div class="whisper-input-section">
-                    <div class="file-upload-area" id="video-upload-area">
-                        <p>비디오 파일을 드래그하거나 클릭하여 업로드</p>
-                        <input type="file" id="video-file-input" accept="video/*" style="display: none;">
-                    </div>
-                </div>
-                <div class="whisper-output-section">
-                    <div class="whisper-output">
-                        <h4>원문</h4>
-                        <div id="video-original"></div>
-                    </div>
-                    <div class="whisper-output">
-                        <h4>번역 (EN/ZH/TH/RU)</h4>
-                        <div id="video-translation"></div>
-                    </div>
-                </div>
-            </div>
-        </div>
-        
-        <!-- PDF Whisper Tab -->
-        <div id="pdf-whisper" class="tab-content">
-            <div class="whisper-container">
-                <h3>PDF 파일 → 텍스트 추출 → 4개 언어 번역</h3>
-                <div class="whisper-input-section">
-                    <div class="file-upload-area" id="pdf-upload-area">
-                        <p>PDF 파일을 드래그하거나 클릭하여 업로드</p>
-                        <input type="file" id="pdf-file-input" accept=".pdf" style="display: none;">
-                    </div>
-                    <div class="setting-item" style="margin-top: 15px;">
-                        <span class="setting-label">최대 페이지:</span>
-                        <input type="number" id="pdf-max-pages" value="10" min="1" max="50" style="width: 80px;">
-                    </div>
-                </div>
-                <div class="whisper-output-section">
-                    <div class="whisper-output">
-                        <h4>추출된 텍스트</h4>
-                        <div id="pdf-original"></div>
-                    </div>
-                    <div class="whisper-output">
-                        <h4>번역 (EN/ZH/TH/RU)</h4>
-                        <div id="pdf-translation"></div>
-                    </div>
-                </div>
-            </div>
-        </div>
-        
-        <!-- Realtime Whisper Tab -->
-        <div id="realtime-whisper" class="tab-content">
-            <div class="whisper-container">
-                <h3>실시간 통역 (Korean → EN/ZH/TH/RU)</h3>
-                <p>10-15초 문장 단위로 자동 전환 — 최신 내용이 위에 표시됩니다.</p>
-                <div class="whisper-input-section">
-                    <button id="realtime-start-btn" onclick="toggleRealtimeRecording()">실시간 통역 시작</button>
-                    <div id="realtime-status" style="margin-top: 10px;"></div>
-                </div>
-                <div class="realtime-output" id="realtime-output"></div>
-            </div>
-        </div>
-    </div>
-    <audio id="audio-output"></audio>
-
-    <script>
-        // Tab switching functionality - 맨 앞에 배치
-        function switchTab(tabName) {
-            console.log('Switching to tab:', tabName);
-            
-            // Hide all tabs
-            document.querySelectorAll('.tab-content').forEach(tab => {
-                tab.style.display = 'none';
-                tab.classList.remove('active');
-            });
-            
-            console.log('All initialized!');
-            
-            // Remove active from all buttons
-            document.querySelectorAll('.tab-button').forEach(btn => {
-                btn.classList.remove('active');
-            });
-            
-            // Show selected tab
-            const selectedTab = document.getElementById(tabName);
-            if (selectedTab) {
-                selectedTab.style.display = 'flex';
-                selectedTab.classList.add('active');
-            }
-            
-            // Mark button as active
-            event.target.classList.add('active');
-        }
-        
-        // Global variables
-        let peerConnection = null;
-        let webrtc_id = null;
-        let webSearchEnabled = false;
-        let selectedLanguage = "";
-        let systemPrompt = "You are a helpful assistant. Respond in a friendly and professional manner.";
-        let audioLevel = 0;
-        let animationFrame = null;
-        let audioContext = null;
-        let analyser = null;
-        let audioSource = null;
-        let dataChannel = null;
-        let isVoiceActive = false;
-        
-        // Whisper variables
-        let micRecorder = null;
-        let isRecording = false;
-        let realtimeRecorder = null;
-        let isRealtimeRecording = false;
-        let realtimeStream = null;
-        
-        async function sendTextMessage() {
-            const textInput = document.getElementById('text-input');
-            const chatMessages = document.getElementById('chat-messages');
-            const message = textInput.value.trim();
-            if (!message) return;
-            
-            // Add user message to chat
-            addMessage('user', message);
-            textInput.value = '';
-            
-            // Show sending indicator
-            const typingIndicator = document.createElement('div');
-            typingIndicator.classList.add('message', 'assistant');
-            typingIndicator.textContent = '입력 중...';
-            typingIndicator.id = 'typing-indicator';
-            chatMessages.appendChild(typingIndicator);
-            chatMessages.scrollTop = chatMessages.scrollHeight;
-            
-            try {
-                // Send to text chat endpoint
-                const response = await fetch('/chat/text', {
-                    method: 'POST',
-                    headers: { 'Content-Type': 'application/json' },
-                    body: JSON.stringify({
-                        message: message,
-                        web_search_enabled: webSearchEnabled,
-                        target_language: selectedLanguage,
-                        system_prompt: systemPrompt
-                    })
-                });
-                
-                const data = await response.json();
-                
-                // Remove typing indicator
-                const indicator = document.getElementById('typing-indicator');
-                if (indicator) indicator.remove();
-                
-                if (data.error) {
-                    showError(data.error);
-                } else {
-                    // Add assistant response
-                    let content = data.response;
-                    if (selectedLanguage && data.language) {
-                        content += ` <span class="language-info">[${data.language}]</span>`;
-                    }
-                    addMessage('assistant', content);
-                }
-            } catch (error) {
-                console.error('Error sending text message:', error);
-                const indicator = document.getElementById('typing-indicator');
-                if (indicator) indicator.remove();
-                showError('메시지 전송 중 오류가 발생했습니다.');
-            }
-        }
-        
-        function updateStatus(state) {
-            const statusDot = document.getElementById('status-dot');
-            const statusText = document.getElementById('status-text');
-            const sendButton = document.getElementById('send-button');
-            
-            statusDot.className = 'status-dot ' + state;
-            if (state === 'connected') {
-                statusText.textContent = '연결됨';
-                if (sendButton) sendButton.style.display = 'block';
-                isVoiceActive = true;
-            } else if (state === 'connecting') {
-                statusText.textContent = '연결 중...';
-                if (sendButton) sendButton.style.display = 'none';
-            } else {
-                statusText.textContent = '연결 대기 중';
-                if (sendButton) sendButton.style.display = 'block';  // Show send button even when disconnected for text chat
-                isVoiceActive = false;
-            }
-        }
-        
-        function updateButtonState() {
-            const button = document.getElementById('start-button');
-            if (peerConnection && (peerConnection.connectionState === 'connecting' || peerConnection.connectionState === 'new')) {
-                button.innerHTML = `
-                    <div class="icon-with-spinner">
-                        <div class="spinner"></div>
-                        <span>연결 중...</span>
-                    </div>
-                `;
-                updateStatus('connecting');
-            } else if (peerConnection && peerConnection.connectionState === 'connected') {
-                button.innerHTML = `
-                    <div class="icon-with-spinner">
-                        <div class="audio-visualizer" id="audio-visualizer">
-                            <div class="visualizer-bar"></div>
-                            <div class="visualizer-bar"></div>
-                            <div class="visualizer-bar"></div>
-                            <div class="visualizer-bar"></div>
-                            <div class="visualizer-bar"></div>
-                        </div>
-                        <span>대화 종료</span>
-                    </div>
-                `;
-                updateStatus('connected');
-            } else {
-                button.innerHTML = '대화 시작';
-                updateStatus('disconnected');
-            }
-        }
-        
-        function setupAudioVisualization(stream) {
-            audioContext = new (window.AudioContext || window.webkitAudioContext)();
-            analyser = audioContext.createAnalyser();
-            audioSource = audioContext.createMediaStreamSource(stream);
-            audioSource.connect(analyser);
-            analyser.fftSize = 256;
-            const bufferLength = analyser.frequencyBinCount;
-            const dataArray = new Uint8Array(bufferLength);
-            
-            const visualizerBars = document.querySelectorAll('.visualizer-bar');
-            const barCount = visualizerBars.length;
-            
-            function updateAudioLevel() {
-                analyser.getByteFrequencyData(dataArray);
-                
-                for (let i = 0; i < barCount; i++) {
-                    const start = Math.floor(i * (bufferLength / barCount));
-                    const end = Math.floor((i + 1) * (bufferLength / barCount));
-                    
-                    let sum = 0;
-                    for (let j = start; j < end; j++) {
-                        sum += dataArray[j];
-                    }
-                    
-                    const average = sum / (end - start) / 255;
-                    const scaleY = 0.1 + average * 0.9;
-                    visualizerBars[i].style.transform = `scaleY(${scaleY})`;
-                }
-                
-                animationFrame = requestAnimationFrame(updateAudioLevel);
-            }
-            
-            updateAudioLevel();
-        }
-        
-        function showError(message) {
-            const toast = document.getElementById('error-toast');
-            toast.textContent = message;
-            toast.className = 'toast error';
-            toast.style.display = 'block';
-            setTimeout(() => {
-                toast.style.display = 'none';
-            }, 5000);
-        }
-        
-        function showSuccess(message) {
-            const toast = document.getElementById('error-toast');
-            toast.textContent = message;
-            toast.className = 'toast success';
-            toast.style.display = 'block';
-            setTimeout(() => {
-                toast.style.display = 'none';
-            }, 3000);
-        }
-        
-        async function setupWebRTC() {
-            const audioOutput = document.getElementById('audio-output');
-            const config = typeof __RTC_CONFIGURATION__ !== 'undefined' ? __RTC_CONFIGURATION__ : {iceServers: [{urls: 'stun:stun.l.google.com:19302'}]};
-            peerConnection = new RTCPeerConnection(config);
-            const timeoutId = setTimeout(() => {
-                const toast = document.getElementById('error-toast');
-                toast.textContent = "연결이 평소보다 오래 걸리고 있습니다. VPN을 사용 중이신가요?";
-                toast.className = 'toast warning';
-                toast.style.display = 'block';
-                setTimeout(() => {
-                    toast.style.display = 'none';
-                }, 5000);
-            }, 5000);
-            try {
-                const stream = await navigator.mediaDevices.getUserMedia({
-                    audio: true
-                });
-                setupAudioVisualization(stream);
-                stream.getTracks().forEach(track => {
-                    peerConnection.addTrack(track, stream);
-                });
-                peerConnection.addEventListener('track', (evt) => {
-                    if (audioOutput.srcObject !== evt.streams[0]) {
-                        audioOutput.srcObject = evt.streams[0];
-                        audioOutput.play();
-                    }
-                });
-                
-                // Create data channel for text messages
-                dataChannel = peerConnection.createDataChannel('text');
-                dataChannel.onopen = () => {
-                    console.log('Data channel opened');
-                };
-                dataChannel.onmessage = (event) => {
-                    const eventJson = JSON.parse(event.data);
-                    if (eventJson.type === "error") {
-                        showError(eventJson.message);
-                    }
-                };
-                
-                const offer = await peerConnection.createOffer();
-                await peerConnection.setLocalDescription(offer);
-                await new Promise((resolve) => {
-                    if (peerConnection.iceGatheringState === "complete") {
-                        resolve();
-                    } else {
-                        const checkState = () => {
-                            if (peerConnection.iceGatheringState === "complete") {
-                                peerConnection.removeEventListener("icegatheringstatechange", checkState);
-                                resolve();
-                            }
-                        };
-                        peerConnection.addEventListener("icegatheringstatechange", checkState);
-                    }
-                });
-                peerConnection.addEventListener('connectionstatechange', () => {
-                    console.log('connectionstatechange', peerConnection.connectionState);
-                    if (peerConnection.connectionState === 'connected') {
-                        clearTimeout(timeoutId);
-                        const toast = document.getElementById('error-toast');
-                        toast.style.display = 'none';
-                    }
-                    updateButtonState();
-                });
-                webrtc_id = Math.random().toString(36).substring(7);
-                
-                const response = await fetch('/webrtc/offer', {
-                    method: 'POST',
-                    headers: { 'Content-Type': 'application/json' },
-                    body: JSON.stringify({
-                        sdp: peerConnection.localDescription.sdp,
-                        type: peerConnection.localDescription.type,
-                        webrtc_id: webrtc_id,
-                        web_search_enabled: webSearchEnabled,
-                        target_language: selectedLanguage,
-                        system_prompt: systemPrompt
-                    })
-                });
-                const serverResponse = await response.json();
-                if (serverResponse.status === 'failed') {
-                    showError(serverResponse.meta.error === 'concurrency_limit_reached'
-                        ? `너무 많은 연결입니다. 최대 한도는 ${serverResponse.meta.limit} 입니다.`
-                        : serverResponse.meta.error);
-                    stop();
-                    return;
-                }
-                await peerConnection.setRemoteDescription(serverResponse);
-                const eventSource = new EventSource('/outputs?webrtc_id=' + webrtc_id);
-                eventSource.addEventListener("output", (event) => {
-                    const eventJson = JSON.parse(event.data);
-                    let content = eventJson.content;
-                    
-                    if (selectedLanguage && eventJson.language) {
-                        content += ` <span class="language-info">[${eventJson.language}]</span>`;
-                    }
-                    addMessage("assistant", content);
-                });
-                eventSource.addEventListener("search", (event) => {
-                    const eventJson = JSON.parse(event.data);
-                    if (eventJson.query) {
-                        addMessage("search-result", `웹 검색 중: "${eventJson.query}"`);
-                    }
-                });
-            } catch (err) {
-                clearTimeout(timeoutId);
-                console.error('Error setting up WebRTC:', err);
-                showError('연결을 설정하지 못했습니다. 다시 시도해 주세요.');
-                stop();
-            }
-        }
-        
-        function addMessage(role, content) {
-            const chatMessages = document.getElementById('chat-messages');
-            const messageDiv = document.createElement('div');
-            messageDiv.classList.add('message', role);
-            
-            if (content.includes('<span')) {
-                messageDiv.innerHTML = content;
-            } else {
-                messageDiv.textContent = content;
-            }
-            chatMessages.appendChild(messageDiv);
-            chatMessages.scrollTop = chatMessages.scrollHeight;
-        }
-        
-        function stop() {
-            console.log('[STOP] Stopping connection...');
-            
-            // Cancel animation frame first
-            if (animationFrame) {
-                cancelAnimationFrame(animationFrame);
-                animationFrame = null;
-            }
-            
-            // Close audio context
-            if (audioContext) {
-                audioContext.close();
-                audioContext = null;
-                analyser = null;
-                audioSource = null;
-            }
-            
-            // Close data channel
-            if (dataChannel) {
-                dataChannel.close();
-                dataChannel = null;
-            }
-            
-            // Close peer connection
-            if (peerConnection) {
-                console.log('[STOP] Current connection state:', peerConnection.connectionState);
-                
-                // Stop all transceivers
-                if (peerConnection.getTransceivers) {
-                    peerConnection.getTransceivers().forEach(transceiver => {
-                        if (transceiver.stop) {
-                            transceiver.stop();
-                        }
-                    });
-                }
-                
-                // Stop all senders
-                if (peerConnection.getSenders) {
-                    peerConnection.getSenders().forEach(sender => {
-                        if (sender.track) {
-                            sender.track.stop();
-                        }
-                    });
-                }
-                
-                // Stop all receivers
-                if (peerConnection.getReceivers) {
-                    peerConnection.getReceivers().forEach(receiver => {
-                        if (receiver.track) {
-                            receiver.track.stop();
-                        }
-                    });
-                }
-                
-                // Close the connection
-                peerConnection.close();
-                
-                // Clear the reference
-                peerConnection = null;
-                
-                console.log('[STOP] Connection closed');
-            }
-            
-            // Reset audio level
-            audioLevel = 0;
-            isVoiceActive = false;
-            
-            // Update UI
-            updateButtonState();
-            
-            // Clear any existing webrtc_id
-            if (webrtc_id) {
-                console.log('[STOP] Clearing webrtc_id:', webrtc_id);
-                webrtc_id = null;
-            }
-        }
-        
-        // Whisper Tab Functions
-        
-        // Microphone recording
-        async function toggleMicRecording() {
-            const btn = document.getElementById('mic-record-btn');
-            const status = document.getElementById('mic-status');
-            
-            if (!isRecording) {
-                try {
-                    const stream = await navigator.mediaDevices.getUserMedia({ audio: true });
-                    micRecorder = new MediaRecorder(stream);
-                    const chunks = [];
-                    
-                    micRecorder.ondataavailable = (e) => chunks.push(e.data);
-                    micRecorder.onstop = async () => {
-                        const blob = new Blob(chunks, { type: 'audio/webm' });
-                        await processAudioBlob(blob, 'mic');
-                        stream.getTracks().forEach(track => track.stop());
-                    };
-                    
-                    micRecorder.start();
-                    isRecording = true;
-                    btn.textContent = '녹음 중지';
-                    status.innerHTML = '<div class="recording-indicator"><div class="recording-dot"></div>녹음 중...</div>';
-                } catch (err) {
-                    showError('마이크 접근 권한이 필요합니다.');
-                }
-            } else {
-                micRecorder.stop();
-                isRecording = false;
-                btn.textContent = '녹음 시작';
-                status.textContent = '처리 중...';
-            }
-        }
-        
-        // Process audio blob (for microphone recording)
-        async function processAudioBlob(blob, type) {
-            const formData = new FormData();
-            formData.append('audio', blob, 'recording.webm');
-            
-            try {
-                const response = await fetch('/whisper/transcribe', {
-                    method: 'POST',
-                    body: formData
-                });
-                
-                const result = await response.json();
-                if (result.error) {
-                    showError(result.error);
-                } else {
-                    document.getElementById(`${type}-original`).textContent = result.text;
-                    document.getElementById(`${type}-translation`).innerHTML = result.translation.replace(/\n/g, '<br>');
-                    document.getElementById(`${type}-status`).textContent = '';
-                }
-            } catch (error) {
-                showError('처리 중 오류가 발생했습니다.');
-                document.getElementById(`${type}-status`).textContent = '';
-            }
-        }
-        
-        // Process audio file
-        async function processAudioFile(file) {
-            const formData = new FormData();
-            formData.append('audio', file);
-            
-            try {
-                showSuccess('오디오 파일 처리 중...');
-                const response = await fetch('/whisper/audio', {
-                    method: 'POST',
-                    body: formData
-                });
-                
-                const result = await response.json();
-                if (result.error) {
-                    showError(result.error);
-                } else {
-                    document.getElementById('audio-original').textContent = result.text;
-                    document.getElementById('audio-translation').innerHTML = result.translation.replace(/\n/g, '<br>');
-                }
-            } catch (error) {
-                showError('오디오 파일 처리 중 오류가 발생했습니다.');
-            }
-        }
-        
-        // Process video file
-        async function processVideoFile(file) {
-            const formData = new FormData();
-            formData.append('video', file);
-            
-            try {
-                showSuccess('비디오 파일 처리 중... (시간이 걸릴 수 있습니다)');
-                const response = await fetch('/whisper/video', {
-                    method: 'POST',
-                    body: formData
-                });
-                
-                const result = await response.json();
-                if (result.error) {
-                    showError(result.error);
-                } else {
-                    document.getElementById('video-original').textContent = result.text;
-                    document.getElementById('video-translation').innerHTML = result.translation.replace(/\n/g, '<br>');
-                }
-            } catch (error) {
-                showError('비디오 파일 처리 중 오류가 발생했습니다.');
-            }
-        }
-        
-        // Process PDF file
-        async function processPDFFile(file) {
-            const formData = new FormData();
-            formData.append('pdf', file);
-            formData.append('max_pages', document.getElementById('pdf-max-pages').value);
-            
-            try {
-                showSuccess('PDF 파일 처리 중...');
-                const response = await fetch('/whisper/pdf', {
-                    method: 'POST',
-                    body: formData
-                });
-                
-                const result = await response.json();
-                if (result.error) {
-                    showError(result.error);
-                } else {
-                    document.getElementById('pdf-original').textContent = result.text;
-                    document.getElementById('pdf-translation').innerHTML = result.translation.replace(/\n/g, '<br>');
-                }
-            } catch (error) {
-                showError('PDF 파일 처리 중 오류가 발생했습니다.');
-            }
-        }
-        
-        // Realtime recording
-        let realtimeEventSource = null;
-        
-        async function toggleRealtimeRecording() {
-            const btn = document.getElementById('realtime-start-btn');
-            const status = document.getElementById('realtime-status');
-            const output = document.getElementById('realtime-output');
-            
-            if (!isRealtimeRecording) {
-                try {
-                    const response = await fetch('/whisper/realtime/start', {
-                        method: 'POST'
-                    });
-                    
-                    const result = await response.json();
-                    if (result.session_id) {
-                        // Start listening for results
-                        realtimeEventSource = new EventSource(`/whisper/realtime/stream?session_id=${result.session_id}`);
-                        
-                        realtimeEventSource.onmessage = (event) => {
-                            const data = JSON.parse(event.data);
-                            if (data.timestamp) {
-                                const segment = document.createElement('div');
-                                segment.style.borderBottom = '1px solid #333';
-                                segment.style.paddingBottom = '15px';
-                                segment.style.marginBottom = '15px';
-                                segment.innerHTML = `
-                                    <strong>[${data.timestamp}]</strong><br>
-                                    <strong>[KO]</strong> ${data.text}<br>
-                                    ${data.translation.replace(/\n/g, '<br>')}
-                                `;
-                                output.insertBefore(segment, output.firstChild);
-                            }
-                        };
-                        
-                        realtimeEventSource.onerror = () => {
-                            stopRealtimeRecording();
-                            showError('실시간 통역 연결이 끊어졌습니다.');
-                        };
-                        
-                        // Start recording
-                        realtimeStream = await navigator.mediaDevices.getUserMedia({ audio: true });
-                        
-                        isRealtimeRecording = true;
-                        btn.textContent = '통역 중지';
-                        status.innerHTML = '<div class="recording-indicator"><div class="recording-dot"></div>실시간 통역 중...</div>';
-                        
-                        // Send audio data periodically
-                        startRealtimeAudioCapture(result.session_id);
-                    }
-                } catch (err) {
-                    showError('실시간 통역을 시작할 수 없습니다.');
-                }
-            } else {
-                stopRealtimeRecording();
-            }
-        }
-        
-        function stopRealtimeRecording() {
-            if (realtimeEventSource) {
-                realtimeEventSource.close();
-                realtimeEventSource = null;
-            }
-            
-            if (realtimeStream) {
-                realtimeStream.getTracks().forEach(track => track.stop());
-                realtimeStream = null;
-            }
-            
-            isRealtimeRecording = false;
-            document.getElementById('realtime-start-btn').textContent = '실시간 통역 시작';
-            document.getElementById('realtime-status').textContent = '';
-        }
-        
-        async function startRealtimeAudioCapture(sessionId) {
-            const audioContext = new AudioContext({ sampleRate: 16000 });
-            const source = audioContext.createMediaStreamSource(realtimeStream);
-            const processor = audioContext.createScriptProcessor(4096, 1, 1);
-            
-            let audioBuffer = [];
-            let silenceFrames = 0;
-            const SILENCE_THRESHOLD = 0.01;
-            const MIN_BUFFER_SIZE = 16000 * 2; // 2 seconds minimum
-            const MAX_BUFFER_SIZE = 16000 * 15; // 15 seconds maximum
-            
-            processor.onaudioprocess = async (e) => {
-                if (!isRealtimeRecording) return;
-                
-                const inputData = e.inputBuffer.getChannelData(0);
-                audioBuffer.push(...inputData);
-                
-                // Simple voice activity detection
-                const rms = Math.sqrt(inputData.reduce((sum, val) => sum + val * val, 0) / inputData.length);
-                
-                if (rms < SILENCE_THRESHOLD) {
-                    silenceFrames++;
-                } else {
-                    silenceFrames = 0;
-                }
-                
-                // Send audio when we have enough silence or max buffer reached
-                if ((silenceFrames > 20 && audioBuffer.length > MIN_BUFFER_SIZE) || 
-                    audioBuffer.length > MAX_BUFFER_SIZE) {
-                    
-                    const audioData = new Float32Array(audioBuffer);
-                    audioBuffer = [];
-                    silenceFrames = 0;
-                    
-                    // Convert to 16-bit PCM
-                    const pcmData = new Int16Array(audioData.length);
-                    for (let i = 0; i < audioData.length; i++) {
-                        pcmData[i] = Math.max(-32768, Math.min(32767, audioData[i] * 32768));
-                    }
-                    
-                    // Send to server
-                    const formData = new FormData();
-                    formData.append('audio', new Blob([pcmData.buffer], { type: 'audio/pcm' }));
-                    formData.append('session_id', sessionId);
-                    
-                    fetch('/whisper/realtime/process', {
-                        method: 'POST',
-                        body: formData
-                    }).catch(err => console.error('Error sending audio:', err));
-                }
-            };
-            
-            source.connect(processor);
-            processor.connect(audioContext.destination);
-        }
-        
-        // Simple initialization
-        window.onload = function() {
-            console.log('Page loaded!');
-            
-            // Web search toggle
-            document.getElementById('search-toggle').onclick = function() {
-                webSearchEnabled = !webSearchEnabled;
-                this.classList.toggle('active', webSearchEnabled);
-                console.log('Web search:', webSearchEnabled);
-            };
-            
-            // Language select
-            document.getElementById('language-select').onchange = function() {
-                selectedLanguage = this.value;
-                console.log('Language:', selectedLanguage);
-            };
-            
-            // System prompt
-            document.getElementById('system-prompt').oninput = function() {
-                systemPrompt = this.value || "You are a helpful assistant. Respond in a friendly and professional manner.";
-            };
-            
-            // Text input enter key
-            document.getElementById('text-input').onkeypress = function(e) {
-                if (e.key === 'Enter' && !e.shiftKey) {
-                    e.preventDefault();
-                    sendTextMessage();
-                }
-            };
-            
-            // Send button
-            document.getElementById('send-button').onclick = sendTextMessage;
-            document.getElementById('send-button').style.display = 'block';
-            
-            // Start button
-            document.getElementById('start-button').onclick = function() {
-                if (!peerConnection || peerConnection.connectionState !== 'connected') {
-                    setupWebRTC();
-                } else {
-                    stop();
-                }
-            };
-            
-            // File upload areas
-            const audioUploadArea = document.getElementById('audio-upload-area');
-            if (audioUploadArea) {
-                audioUploadArea.onclick = function() {
-                    document.getElementById('audio-file-input').click();
-                };
-            }
-            
-            const videoUploadArea = document.getElementById('video-upload-area');
-            if (videoUploadArea) {
-                videoUploadArea.onclick = function() {
-                    document.getElementById('video-file-input').click();
-                };
-            }
-            
-            const pdfUploadArea = document.getElementById('pdf-upload-area');
-            if (pdfUploadArea) {
-                pdfUploadArea.onclick = function() {
-                    document.getElementById('pdf-file-input').click();
-                };
-            }
-            
-            // File input handlers
-            const audioFileInput = document.getElementById('audio-file-input');
-            if (audioFileInput) {
-                audioFileInput.onchange = function(e) {
-                    if (e.target.files[0]) processAudioFile(e.target.files[0]);
-                };
-            }
-            
-            const videoFileInput = document.getElementById('video-file-input');
-            if (videoFileInput) {
-                videoFileInput.onchange = function(e) {
-                    if (e.target.files[0]) processVideoFile(e.target.files[0]);
-                };
-            }
-            
-            const pdfFileInput = document.getElementById('pdf-file-input');
-            if (pdfFileInput) {
-                pdfFileInput.onchange = function(e) {
-                    if (e.target.files[0]) processPDFFile(e.target.files[0]);
-                };
-            }
-            
-            // Drag and drop handlers
-            ['audio', 'video', 'pdf'].forEach(type => {
-                const area = document.getElementById(`${type}-upload-area`);
-                if (area) {
-                    area.ondragover = function(e) {
-                        e.preventDefault();
-                        area.classList.add('drag-over');
-                    };
-                    
-                    area.ondragleave = function() {
-                        area.classList.remove('drag-over');
-                    };
-                    
-                    area.ondrop = function(e) {
-                        e.preventDefault();
-                        area.classList.remove('drag-over');
-                        const file = e.dataTransfer.files[0];
-                        if (file) {
-                            if (type === 'audio') processAudioFile(file);
-                            else if (type === 'video') processVideoFile(file);
-                            else if (type === 'pdf') processPDFFile(file);
-                        }
-                    };
-                }
-            });
-        };
-    </script>
-</body>
-
-</html>"""
-
-# Whisper model loader
-def _get_whisper_pipe():
-    """Lazy load Whisper pipeline"""
-    if not hasattr(_get_whisper_pipe, "pipe"):
-        device = 0 if torch.cuda.is_available() else "cpu"
-        _get_whisper_pipe.pipe = pipeline(
-            task="automatic-speech-recognition",
-            model=WHISPER_MODEL_NAME,
-            chunk_length_s=30,
-            device=device,
-        )
-    return _get_whisper_pipe.pipe
-
-# Audio helpers for Whisper
-def _ensure_16k_whisper(y: np.ndarray, sr: int) -> tuple[np.ndarray, int]:
-    """Resample audio to 16kHz for Whisper"""
-    if sr == WHISPER_SAMPLE_RATE:
-        return y.astype(np.float32), WHISPER_SAMPLE_RATE
-    g = np.gcd(sr, WHISPER_SAMPLE_RATE)
-    y = sps.resample_poly(y, WHISPER_SAMPLE_RATE // g, sr // g).astype(np.float32)
-    return y, WHISPER_SAMPLE_RATE
-
-def _should_flush_whisper(buffer: np.ndarray, sr: int) -> bool:
-    """Check if audio buffer should be flushed for processing"""
-    dur = len(buffer) / sr
-    if dur < MIN_SEG_SEC:
-        return False
-    tail_len = int(SILENCE_SEC * sr)
-    tail = buffer[-tail_len:]
-    rms = np.sqrt(np.mean(tail ** 2)) if len(tail) else 1.0
-    end_of_sentence = rms < SILENCE_THRESH
-    return end_of_sentence or dur >= MAX_SEG_SEC
-
-# Translation helper
-def _translate_text_4langs(text: str) -> str:
-    """Translate text to 4 languages using OpenAI"""
-    try:
-        client = openai.OpenAI()
-        prompt = (
-            "Translate the following text into English (EN), Chinese (ZH), Thai (TH) and Russian (RU).\n"
-            "Return ONLY the translations in this format (one per line):\n"
-            "EN: <english>\nZH: <chinese>\nTH: <thai>\nRU: <russian>\n\n"
-            f"Text: {text}"
-        )
-        
-        response = client.chat.completions.create(
-            model="gpt-4o-mini",
-            messages=[
-                {"role": "system", "content": "You are a professional translator."},
-                {"role": "user", "content": prompt}
-            ],
-            temperature=0.7,
-            max_tokens=512
-        )
-        
-        return response.choices[0].message.content.strip()
-    except Exception as e:
-        print(f"Translation error: {e}")
-        return f"Translation error: {str(e)}"
-
-# ffmpeg check
-def _check_ffmpeg() -> bool:
-    try:
-        subprocess.run(["ffmpeg", "-version"], capture_output=True, check=True)
-        return True
-    except Exception:
-        return False
-
-_HAS_FFMPEG = _check_ffmpeg()
-
-def extract_audio_from_video(video_path: str) -> str:
-    """Extract audio from video file"""
-    tmp = tempfile.NamedTemporaryFile(delete=False, suffix=".wav")
-    tmp.close()
-    
-    if _HAS_FFMPEG:
-        cmd = [
-            "ffmpeg", "-i", video_path, "-vn",
-            "-acodec", "pcm_s16le", "-ar", "16000", "-ac", "1", "-y", tmp.name
-        ]
-        result = subprocess.run(cmd, capture_output=True)
-        if result.returncode != 0:
-            os.unlink(tmp.name)
-            raise RuntimeError("ffmpeg error extracting audio")
-        return tmp.name
-    else:
-        raise RuntimeError("ffmpeg is required for video processing")
-
-# GPU workers for Whisper
-def gpu_transcribe_whisper(audio_path: str) -> str:
-    """Transcribe audio using Whisper on GPU"""
-    pipe = _get_whisper_pipe()
-    result = pipe(audio_path, batch_size=WHISPER_BATCH_SIZE, generate_kwargs={"task": "transcribe"}, return_timestamps=True)
-    return result["text"].strip()
-
-def gpu_asr_translate_whisper(audio: np.ndarray, sr: int) -> str:
-    """Transcribe and translate audio for realtime"""
-    pipe = _get_whisper_pipe()
-    ko = pipe({"array": audio, "sampling_rate": sr}, batch_size=WHISPER_BATCH_SIZE)["text"].strip()
-    trans = _translate_text_4langs(ko).replace("\n", "<br>")
-    ts = datetime.now(SEOUL_TZ).strftime("%Y-%m-%d %H:%M:%S")
-    return f"[{ts}]<br>[KO] {ko}<br>{trans}<br>{'-'*40}<br>"
-
-class BraveSearchClient:
-    """Brave Search API client"""
-    def __init__(self, api_key: str):
-        self.api_key = api_key
-        self.base_url = "https://api.search.brave.com/res/v1/web/search"
-    
-    async def search(self, query: str, count: int = 10) -> List[Dict]:
-        """Perform a web search using Brave Search API"""
-        if not self.api_key:
-            return []
-        
-        headers = {
-            "Accept": "application/json",
-            "X-Subscription-Token": self.api_key
-        }
-        params = {
-            "q": query,
-            "count": count,
-            "lang": "ko"
-        }
-        
-        async with httpx.AsyncClient() as client:
-            try:
-                response = await client.get(self.base_url, headers=headers, params=params)
-                response.raise_for_status()
-                data = response.json()
-                
-                results = []
-                if "web" in data and "results" in data["web"]:
-                    for result in data["web"]["results"][:count]:
-                        results.append({
-                            "title": result.get("title", ""),
-                            "url": result.get("url", ""),
-                            "description": result.get("description", "")
-                        })
-                return results
-            except Exception as e:
-                print(f"Brave Search error: {e}")
-                return []
-
-
-# Initialize search client globally
-brave_api_key = os.getenv("BSEARCH_API")
-search_client = BraveSearchClient(brave_api_key) if brave_api_key else None
-print(f"Search client initialized: {search_client is not None}, API key present: {bool(brave_api_key)}")
-
-# Store connection settings
-connection_settings = {}
-
-# Store realtime sessions
-realtime_sessions = {}
-
-# Initialize OpenAI client for text chat
-client = openai.AsyncOpenAI()
-
-def get_translation_instructions(target_language: str) -> str:
-    """Get instructions for translation based on target language"""
-    if not target_language:
-        return ""
-    
-    language_name = SUPPORTED_LANGUAGES.get(target_language, target_language)
-    return (
-        f"\n\nIMPORTANT: You must respond in {language_name} ({target_language}). "
-        f"Translate all your responses to {language_name}."
-    )
-
-def update_chatbot(chatbot: list[dict], response: ResponseAudioTranscriptDoneEvent):
-    chatbot.append({"role": "assistant", "content": response.transcript})
-    return chatbot
-
-
-async def process_text_chat(message: str, web_search_enabled: bool, target_language: str, 
-                          system_prompt: str) -> Dict[str, str]:
-    """Process text chat using GPT-4o-mini model"""
-    try:
-        # If target language is set, override system prompt completely
-        if target_language:
-            language_name = SUPPORTED_LANGUAGES.get(target_language, target_language)
-            
-            # Create system prompt in target language
-            if target_language == "en":
-                base_instructions = f"You are a helpful assistant. You speak ONLY English. Never use Korean or any other language. {system_prompt}"
-                user_prefix = "Please respond in English: "
-            elif target_language == "ja":
-                base_instructions = f"あなたは親切なアシスタントです。日本語のみを話します。韓国語や他の言語は絶対に使用しません。{system_prompt}"
-                user_prefix = "日本語で答えてください: "
-            elif target_language == "zh":
-                base_instructions = f"你是一个乐于助人的助手。你只说中文。绝不使用韩语或其他语言。{system_prompt}"
-                user_prefix = "请用中文回答: "
-            elif target_language == "es":
-                base_instructions = f"Eres un asistente útil. Solo hablas español. Nunca uses coreano u otros idiomas. {system_prompt}"
-                user_prefix = "Por favor responde en español: "
-            else:
-                base_instructions = f"You are a helpful assistant that speaks ONLY {language_name}. {system_prompt}"
-                user_prefix = f"Please respond in {language_name}: "
-        else:
-            base_instructions = system_prompt or "You are a helpful assistant."
-            user_prefix = ""
-        
-        messages = [
-            {"role": "system", "content": base_instructions}
-        ]
-        
-        # Handle web search if enabled
-        if web_search_enabled and search_client:
-            # Check if the message requires web search
-            search_keywords = ["날씨", "기온", "비", "눈", "뉴스", "소식", "현재", "최근", 
-                             "오늘", "지금", "가격", "환율", "주가", "weather", "news", 
-                             "current", "today", "price", "2024", "2025"]
-            
-            should_search = any(keyword in message.lower() for keyword in search_keywords)
-            
-            if should_search:
-                # Perform web search
-                search_results = await search_client.search(message)
-                if search_results:
-                    search_context = "웹 검색 결과:\n\n"
-                    for i, result in enumerate(search_results[:5], 1):
-                        search_context += f"{i}. {result['title']}\n{result['description']}\n\n"
-                    
-                    # Add search context in target language if set
-                    if target_language:
-                        search_instruction = f"Use this search information but respond in {SUPPORTED_LANGUAGES.get(target_language, target_language)} only: "
-                    else:
-                        search_instruction = "다음 웹 검색 결과를 참고하여 답변하세요: "
-                    
-                    messages.append({
-                        "role": "system", 
-                        "content": search_instruction + "\n\n" + search_context
-                    })
-        
-        # Add user message with language prefix
-        messages.append({"role": "user", "content": user_prefix + message})
-        
-        # Call GPT-4o-mini
-        response = await client.chat.completions.create(
-            model="gpt-4o-mini",
-            messages=messages,
-            temperature=0.7,
-            max_tokens=2000
-        )
-        
-        response_text = response.choices[0].message.content
-        
-        # Final check - remove any Korean if target language is not Korean
-        if target_language and target_language != "ko":
-            import re
-            if re.search(r'[가-힣]', response_text):
-                print(f"[TEXT CHAT] WARNING: Korean detected in response for {target_language}")
-                # Try again with stronger prompt
-                messages[-1] = {"role": "user", "content": f"ONLY {SUPPORTED_LANGUAGES.get(target_language, target_language)}, NO KOREAN: {message}"}
-                retry_response = await client.chat.completions.create(
-                    model="gpt-4o-mini",
-                    messages=messages,
-                    temperature=0.3,
-                    max_tokens=2000
-                )
-                response_text = retry_response.choices[0].message.content
-        
-        print(f"[TEXT CHAT] Target language: {target_language}")
-        print(f"[TEXT CHAT] Response preview: {response_text[:100]}...")
-        
-        return {
-            "response": response_text,
-            "language": SUPPORTED_LANGUAGES.get(target_language, "") if target_language else ""
-        }
-        
-    except Exception as e:
-        print(f"Error in text chat: {e}")
-        return {"error": str(e)}
-
-
-class OpenAIHandler(AsyncStreamHandler):
-    def __init__(self, web_search_enabled: bool = False, target_language: str = "", 
-                 system_prompt: str = "", webrtc_id: str = None) -> None:
-        super().__init__(
-            expected_layout="mono",
-            output_sample_rate=SAMPLE_RATE,
-            output_frame_size=480,
-            input_sample_rate=SAMPLE_RATE,
-        )
-        self.connection = None
-        self.output_queue = asyncio.Queue()
-        self.search_client = search_client
-        self.function_call_in_progress = False
-        self.current_function_args = ""
-        self.current_call_id = None
-        self.webrtc_id = webrtc_id
-        self.web_search_enabled = web_search_enabled
-        self.target_language = target_language
-        self.system_prompt = system_prompt
-        
-        print(f"[INIT] Handler created with web_search={web_search_enabled}, "
-              f"target_language={target_language}")
-
-    def copy(self):
-        # Get the most recent settings
-        if connection_settings:
-            # Get the most recent webrtc_id
-            recent_ids = sorted(connection_settings.keys(), 
-                              key=lambda k: connection_settings[k].get('timestamp', 0), 
-                              reverse=True)
-            if recent_ids:
-                recent_id = recent_ids[0]
-                settings = connection_settings[recent_id]
-                
-                # Log the settings being copied
-                print(f"[COPY] Copying settings from {recent_id}:")
-                
-                return OpenAIHandler(
-                    web_search_enabled=settings.get('web_search_enabled', False),
-                    target_language=settings.get('target_language', ''),
-                    system_prompt=settings.get('system_prompt', ''),
-                    webrtc_id=recent_id
-                )
-        
-        print(f"[COPY] No settings found, creating default handler")
-        return OpenAIHandler(web_search_enabled=False)
-
-    async def search_web(self, query: str) -> str:
-        """Perform web search and return formatted results"""
-        if not self.search_client or not self.web_search_enabled:
-            return "웹 검색이 비활성화되어 있습니다."
-        
-        print(f"Searching web for: {query}")
-        results = await self.search_client.search(query)
-        if not results:
-            return f"'{query}'에 대한 검색 결과를 찾을 수 없습니다."
-        
-        # Format search results
-        formatted_results = []
-        for i, result in enumerate(results, 1):
-            formatted_results.append(
-                f"{i}. {result['title']}\n"
-                f"   URL: {result['url']}\n"
-                f"   {result['description']}\n"
-            )
-        
-        return f"웹 검색 결과 '{query}':\n\n" + "\n".join(formatted_results)
-
-    async def process_text_message(self, message: str):
-        """Process text message from user"""
-        if self.connection:
-            await self.connection.conversation.item.create(
-                item={
-                    "type": "message",
-                    "role": "user",
-                    "content": [{"type": "input_text", "text": message}]
-                }
-            )
-            await self.connection.response.create()
-
-    def get_translation_instructions(self):
-        """Get instructions for translation based on target language"""
-        if not self.target_language:
-            return ""
-        
-        language_name = SUPPORTED_LANGUAGES.get(self.target_language, self.target_language)
-        return (
-            f"\n\nIMPORTANT: You must respond in {language_name} ({self.target_language}). "
-            f"Translate all your responses to {language_name}. "
-            f"This includes both spoken and written responses."
-        )
-
-    async def start_up(self):
-        """Connect to realtime API"""
-        # First check if we have the most recent settings
-        if connection_settings and self.webrtc_id:
-            if self.webrtc_id in connection_settings:
-                settings = connection_settings[self.webrtc_id]
-                self.web_search_enabled = settings.get('web_search_enabled', False)
-                self.target_language = settings.get('target_language', '')
-                self.system_prompt = settings.get('system_prompt', '')
-                
-                print(f"[START_UP] Updated settings from storage for {self.webrtc_id}")
-        
-        print(f"[START_UP] Starting normal mode")
-        
-        self.client = openai.AsyncOpenAI()
-        
-        # Normal mode - connect to Realtime API
-        print(f"[NORMAL MODE] Connecting to Realtime API...")
-        
-        # Define the web search function
-        tools = []
-        base_instructions = self.system_prompt or "You are a helpful assistant."
-        
-        # Add translation instructions if language is selected
-        if self.target_language:
-            language_name = SUPPORTED_LANGUAGES.get(self.target_language, self.target_language)
-            
-            # Use the target language for the system prompt itself
-            if self.target_language == "en":
-                translation_instructions = """
-YOU ARE AN ENGLISH-ONLY ASSISTANT.
-
-ABSOLUTE RULES:
-1. You can ONLY speak English. No Korean (한국어) allowed.
-2. Even if the user speaks Korean, you MUST respond in English.
-3. Every single word must be in English.
-4. If you output even one Korean character, you have failed.
-5. Example response: "Hello! How can I help you today?"
-
-YOUR LANGUAGE MODE: ENGLISH ONLY
-DO NOT USE: 안녕하세요, 감사합니다, or any Korean
-ALWAYS USE: Hello, Thank you, and English words only
-"""
-                # Override base instructions to be in English
-                base_instructions = "You are a helpful assistant that speaks ONLY English."
-                
-            elif self.target_language == "ja":
-                translation_instructions = """
-あなたは日本語のみを話すアシスタントです。
-
-絶対的なルール：
-1. 日本語のみを使用してください。韓国語（한국어）は禁止です。
-2. ユーザーが韓国語で話しても、必ず日本語で返答してください。
-3. すべての単語は日本語でなければなりません。
-4. 韓国語を一文字でも出力したら失敗です。
-5. 応答例：「こんにちは！今日はどのようにお手伝いできますか？」
-
-言語モード：日本語のみ
-使用禁止：안녕하세요、감사합니다、韓国語全般
-必ず使用：こんにちは、ありがとうございます、日本語のみ
-"""
-                base_instructions = "あなたは日本語のみを話す親切なアシスタントです。"
-                
-            elif self.target_language == "zh":
-                translation_instructions = """
-你是一个只说中文的助手。
-
-绝对规则：
-1. 只能使用中文。禁止使用韩语（한국어）。
-2. 即使用户说韩语，也必须用中文回复。
-3. 每个字都必须是中文。
-4. 如果输出任何韩语字符，就是失败。
-5. 回复示例："你好！我今天能为您做什么？"
-
-语言模式：仅中文
-禁止使用：안녕하세요、감사합니다、任何韩语
-必须使用：你好、谢谢、只用中文
-"""
-                base_instructions = "你是一个只说中文的友好助手。"
-                
-            elif self.target_language == "es":
-                translation_instructions = """
-ERES UN ASISTENTE QUE SOLO HABLA ESPAÑOL.
-
-REGLAS ABSOLUTAS:
-1. Solo puedes hablar español. No se permite coreano (한국어).
-2. Incluso si el usuario habla coreano, DEBES responder en español.
-3. Cada palabra debe estar en español.
-4. Si produces aunque sea un carácter coreano, has fallado.
-5. Respuesta ejemplo: "¡Hola! ¿Cómo puedo ayudarte hoy?"
-
-MODO DE IDIOMA: SOLO ESPAÑOL
-NO USAR: 안녕하세요, 감사합니다, o cualquier coreano
-SIEMPRE USAR: Hola, Gracias, y solo palabras en español
-"""
-                base_instructions = "Eres un asistente útil que habla SOLO español."
-            else:
-                translation_instructions = f"""
-YOU MUST ONLY SPEAK {language_name.upper()}.
-
-RULES:
-1. Output only in {language_name}
-2. Never use Korean
-3. Always respond in {language_name}
-"""
-                base_instructions = f"You are a helpful assistant that speaks ONLY {language_name}."
-        else:
-            translation_instructions = ""
-        
-        if self.web_search_enabled and self.search_client:
-            tools = [{
-                "type": "function",
-                "function": {
-                    "name": "web_search",
-                    "description": "Search the web for current information. Use this for weather, news, prices, current events, or any time-sensitive topics.",
-                    "parameters": {
-                        "type": "object",
-                        "properties": {
-                            "query": {
-                                "type": "string",
-                                "description": "The search query"
-                            }
-                        },
-                        "required": ["query"]
-                    }
-                }
-            }]
-            print("Web search function added to tools")
-            
-            search_instructions = (
-                "\n\nYou have web search capabilities. "
-                "IMPORTANT: You MUST use the web_search function for ANY of these topics:\n"
-                "- Weather (날씨, 기온, 비, 눈)\n"
-                "- News (뉴스, 소식)\n"
-                "- Current events (현재, 최근, 오늘, 지금)\n"
-                "- Prices (가격, 환율, 주가)\n"
-                "- Sports scores or results\n"
-                "- Any question about 2024 or 2025\n"
-                "- Any time-sensitive information\n\n"
-                "When in doubt, USE web_search. It's better to search and provide accurate information "
-                "than to guess or use outdated information."
-            )
-            
-            # Combine all instructions
-            if translation_instructions:
-                # Translation instructions already include base_instructions
-                instructions = translation_instructions + search_instructions
-            else:
-                instructions = base_instructions + search_instructions
-        else:
-            # No web search
-            if translation_instructions:
-                instructions = translation_instructions
-            else:
-                instructions = base_instructions
-        
-        print(f"[NORMAL MODE] Base instructions: {base_instructions[:100]}...")
-        print(f"[NORMAL MODE] Translation instructions: {translation_instructions[:200] if translation_instructions else 'None'}...")
-        print(f"[NORMAL MODE] Combined instructions length: {len(instructions)}")
-        print(f"[NORMAL MODE] Target language: {self.target_language}")
-        
-        async with self.client.beta.realtime.connect(
-            model="gpt-4o-mini-realtime-preview-2024-12-17"
-        ) as conn:
-            # Update session with tools
-            session_update = {
-                "turn_detection": {"type": "server_vad"},
-                "instructions": instructions,
-                "tools": tools,
-                "tool_choice": "auto" if tools else "none",
-                "temperature": 0.7,
-                "max_response_output_tokens": 4096,
-                "modalities": ["text", "audio"],
-                "voice": "alloy"  # Default voice
-            }
-            
-            # Use appropriate voice for the language
-            if self.target_language:
-                # Force language through multiple mechanisms
-                # 1. Use voice that's known to work well with the language
-                voice_map = {
-                    "en": "nova",      # Nova has clearer English
-                    "es": "nova",      # Nova works for Spanish
-                    "fr": "shimmer",   # Shimmer for French
-                    "de": "echo",      # Echo for German  
-                    "ja": "alloy",     # Alloy can do Japanese
-                    "zh": "alloy",     # Alloy can do Chinese
-                    "ko": "nova",      # Nova for Korean
-                }
-                session_update["voice"] = voice_map.get(self.target_language, "nova")
-                
-                # 2. Add language to modalities (experimental)
-                session_update["modalities"] = ["text", "audio"]
-                
-                # 3. Set output format
-                session_update["output_audio_format"] = "pcm16"
-                
-                # 4. Add language hint to the system (if supported by API)
-                if self.target_language in ["en", "es", "fr", "de", "ja", "zh"]:
-                    session_update["language"] = self.target_language  # Try setting language directly
-                
-                print(f"[TRANSLATION MODE] Session update: {json.dumps(session_update, indent=2)}")
-            
-            await conn.session.update(session=session_update)
-            self.connection = conn
-            print(f"Connected with tools: {len(tools)} functions, voice: {session_update.get('voice', 'default')}")
-            
-            async for event in self.connection:
-                # Debug logging for function calls
-                if event.type.startswith("response.function_call"):
-                    print(f"Function event: {event.type}")
-                
-                if event.type == "response.audio_transcript.done":
-                    print(f"[RESPONSE] Transcript: {event.transcript[:100]}...")
-                    print(f"[RESPONSE] Expected language: {self.target_language}")
-                    
-                    output_data = {
-                        "event": event,
-                        "language": SUPPORTED_LANGUAGES.get(self.target_language, "") if self.target_language else ""
-                    }
-                    await self.output_queue.put(AdditionalOutputs(output_data))
-                
-                elif event.type == "response.audio.delta":
-                    await self.output_queue.put(
-                        (
-                            self.output_sample_rate,
-                            np.frombuffer(
-                                base64.b64decode(event.delta), dtype=np.int16
-                            ).reshape(1, -1),
-                        ),
-                    )
-                
-                # Handle function calls
-                elif event.type == "response.function_call_arguments.start":
-                    print(f"Function call started")
-                    self.function_call_in_progress = True
-                    self.current_function_args = ""
-                    self.current_call_id = getattr(event, 'call_id', None)
-                
-                elif event.type == "response.function_call_arguments.delta":
-                    if self.function_call_in_progress:
-                        self.current_function_args += event.delta
-                
-                elif event.type == "response.function_call_arguments.done":
-                    if self.function_call_in_progress:
-                        print(f"Function call done, args: {self.current_function_args}")
-                        try:
-                            args = json.loads(self.current_function_args)
-                            query = args.get("query", "")
-                            
-                            # Emit search event to client
-                            await self.output_queue.put(AdditionalOutputs({
-                                "type": "search",
-                                "query": query
-                            }))
-                            
-                            # Perform the search
-                            search_results = await self.search_web(query)
-                            print(f"Search results length: {len(search_results)}")
-                            
-                            # Send function result back to the model
-                            if self.connection and self.current_call_id:
-                                await self.connection.conversation.item.create(
-                                    item={
-                                        "type": "function_call_output",
-                                        "call_id": self.current_call_id,
-                                        "output": search_results
-                                    }
-                                )
-                                await self.connection.response.create()
-                        
-                        except Exception as e:
-                            print(f"Function call error: {e}")
-                        finally:
-                            self.function_call_in_progress = False
-                            self.current_function_args = ""
-                            self.current_call_id = None
-
-    async def receive(self, frame: tuple[int, np.ndarray]) -> None:
-        # Normal mode - use Realtime API
-        if not self.connection:
-            print(f"[RECEIVE] No connection in normal mode, skipping")
-            return
-        try:
-            _, array = frame
-            array = array.squeeze()
-            audio_message = base64.b64encode(array.tobytes()).decode("utf-8")
-            await self.connection.input_audio_buffer.append(audio=audio_message)
-        except Exception as e:
-            print(f"Error in receive: {e}")
-
-    async def emit(self) -> tuple[int, np.ndarray] | AdditionalOutputs | None:
-        # Normal mode
-        item = await wait_for_item(self.output_queue)
-        
-        # Check if it's a dict with text message
-        if isinstance(item, dict) and item.get('type') == 'text_message':
-            await self.process_text_message(item['content'])
-            return None
-        
-        return item
-
-    async def shutdown(self) -> None:
-        print(f"[SHUTDOWN] Called")
-        
-        # Normal mode - close Realtime API connection
-        if self.connection:
-            await self.connection.close()
-            self.connection = None
-            print("[NORMAL MODE] Connection closed")
-
-
-# Create initial handler instance
-handler = OpenAIHandler(web_search_enabled=False)
-
-# Create components
-chatbot = gr.Chatbot(type="messages")
-
-# Create stream with handler instance
-stream = Stream(
-    handler,  # Pass instance, not factory
-    mode="send-receive",
-    modality="audio",
-    additional_inputs=[chatbot],
-    additional_outputs=[chatbot],
-    additional_outputs_handler=update_chatbot,
-    rtc_configuration=get_twilio_turn_credentials() if get_space() else None,
-    concurrency_limit=5 if get_space() else None,
-    time_limit=300 if get_space() else None,
-)
-
-app = FastAPI()
-
-# Mount stream
-stream.mount(app)
-
-# Intercept offer to capture settings
-@app.post("/webrtc/offer", include_in_schema=False)
-async def custom_offer(request: Request):
-    """Intercept offer to capture settings"""
-    body = await request.json()
-    
-    webrtc_id = body.get("webrtc_id")
-    web_search_enabled = body.get("web_search_enabled", False)
-    target_language = body.get("target_language", "")
-    system_prompt = body.get("system_prompt", "")
-    
-    print(f"[OFFER] Received offer with webrtc_id: {webrtc_id}")
-    print(f"[OFFER] web_search_enabled: {web_search_enabled}")
-    print(f"[OFFER] target_language: {target_language}")
-    
-    # Store settings with timestamp
-    if webrtc_id:
-        connection_settings[webrtc_id] = {
-            'web_search_enabled': web_search_enabled,
-            'target_language': target_language,
-            'system_prompt': system_prompt,
-            'timestamp': asyncio.get_event_loop().time()
-        }
-        
-        print(f"[OFFER] Stored settings for {webrtc_id}:")
-        print(f"[OFFER] {connection_settings[webrtc_id]}")
-    
-    # Remove our custom route temporarily
-    custom_route = None
-    for i, route in enumerate(app.routes):
-        if hasattr(route, 'path') and route.path == "/webrtc/offer" and route.endpoint == custom_offer:
-            custom_route = app.routes.pop(i)
-            break
-    
-    # Forward to stream's offer handler
-    print(f"[OFFER] Forwarding to stream.offer()")
-    response = await stream.offer(body)
-    
-    # Re-add our custom route
-    if custom_route:
-        app.routes.insert(0, custom_route)
-    
-    print(f"[OFFER] Response status: {response.get('status', 'unknown') if isinstance(response, dict) else 'OK'}")
-    
-    return response
-
-
-@app.post("/chat/text")
-async def chat_text(request: Request):
-    """Handle text chat messages using GPT-4o-mini"""
-    try:
-        body = await request.json()
-        message = body.get("message", "")
-        web_search_enabled = body.get("web_search_enabled", False)
-        target_language = body.get("target_language", "")
-        system_prompt = body.get("system_prompt", "")
-        
-        if not message:
-            return {"error": "메시지가 비어있습니다."}
-        
-        # Process text chat
-        result = await process_text_chat(message, web_search_enabled, target_language, system_prompt)
-        
-        return result
-        
-    except Exception as e:
-        print(f"Error in chat_text endpoint: {e}")
-        return {"error": "채팅 처리 중 오류가 발생했습니다."}
-
-
-@app.post("/text_message/{webrtc_id}")
-async def receive_text_message(webrtc_id: str, request: Request):
-    """Receive text message from client"""
-    body = await request.json()
-    message = body.get("content", "")
-    
-    # Find the handler for this connection
-    if webrtc_id in stream.handlers:
-        handler = stream.handlers[webrtc_id]
-        # Queue the text message for processing
-        await handler.output_queue.put({
-            'type': 'text_message',
-            'content': message
-        })
-    
-    return {"status": "ok"}
-
-
-@app.get("/outputs")
-async def outputs(webrtc_id: str):
-    """Stream outputs including search events"""
-    async def output_stream():
-        async for output in stream.output_stream(webrtc_id):
-            if hasattr(output, 'args') and output.args:
-                # Check if it's a search event
-                if isinstance(output.args[0], dict) and output.args[0].get('type') == 'search':
-                    yield f"event: search\ndata: {json.dumps(output.args[0])}\n\n"
-                # Regular transcript event with language info
-                elif isinstance(output.args[0], dict) and 'event' in output.args[0]:
-                    event_data = output.args[0]
-                    if 'event' in event_data and hasattr(event_data['event'], 'transcript'):
-                        data = {
-                            "role": "assistant", 
-                            "content": event_data['event'].transcript,
-                            "language": event_data.get('language', '')
-                        }
-                        yield f"event: output\ndata: {json.dumps(data)}\n\n"
-
-    return StreamingResponse(output_stream(), media_type="text/event-stream")
-
-
-# Whisper endpoints
-@app.post("/whisper/transcribe")
-async def whisper_transcribe(audio: UploadFile = File(...)):
-    """Transcribe audio using Whisper"""
-    try:
-        # Save uploaded file temporarily
-        with tempfile.NamedTemporaryFile(delete=False, suffix=".webm") as tmp:
-            content = await audio.read()
-            tmp.write(content)
-            tmp_path = tmp.name
-        
-        # Transcribe
-        text = await asyncio.get_event_loop().run_in_executor(
-            whisper_executor, gpu_transcribe_whisper, tmp_path
-        )
-        
-        # Translate
-        translation = _translate_text_4langs(text)
-        
-        # Clean up
-        os.unlink(tmp_path)
-        
-        return {"text": text, "translation": translation}
-        
-    except Exception as e:
-        print(f"Whisper transcribe error: {e}")
-        return {"error": str(e)}
-
-
-@app.post("/whisper/audio")
-async def whisper_audio(audio: UploadFile = File(...)):
-    """Process audio file"""
-    try:
-        # Save uploaded file temporarily
-        with tempfile.NamedTemporaryFile(delete=False, suffix=Path(audio.filename).suffix) as tmp:
-            content = await audio.read()
-            tmp.write(content)
-            tmp_path = tmp.name
-        
-        # Transcribe
-        text = await asyncio.get_event_loop().run_in_executor(
-            whisper_executor, gpu_transcribe_whisper, tmp_path
-        )
-        
-        # Translate
-        translation = _translate_text_4langs(text)
-        
-        # Clean up
-        os.unlink(tmp_path)
-        
-        return {"text": text, "translation": translation}
-        
-    except Exception as e:
-        print(f"Whisper audio error: {e}")
-        return {"error": str(e)}
-
-
-@app.post("/whisper/video")
-async def whisper_video(video: UploadFile = File(...)):
-    """Process video file"""
-    try:
-        # Save uploaded file temporarily
-        with tempfile.NamedTemporaryFile(delete=False, suffix=Path(video.filename).suffix) as tmp:
-            content = await video.read()
-            tmp.write(content)
-            tmp_path = tmp.name
-        
-        # Extract audio
-        audio_path = await asyncio.get_event_loop().run_in_executor(
-            None, extract_audio_from_video, tmp_path
-        )
-        
-        # Transcribe
-        text = await asyncio.get_event_loop().run_in_executor(
-            whisper_executor, gpu_transcribe_whisper, audio_path
-        )
-        
-        # Translate
-        translation = _translate_text_4langs(text)
-        
-        # Clean up
-        os.unlink(tmp_path)
-        os.unlink(audio_path)
-        
-        return {"text": text, "translation": translation}
-        
-    except Exception as e:
-        print(f"Whisper video error: {e}")
-        return {"error": str(e)}
-
-
-@app.post("/whisper/pdf")
-async def whisper_pdf(pdf: UploadFile = File(...), max_pages: int = Form(10)):
-    """Process PDF file"""
-    try:
-        # Save uploaded file temporarily
-        with tempfile.NamedTemporaryFile(delete=False, suffix=".pdf") as tmp:
-            content = await pdf.read()
-            tmp.write(content)
-            tmp_path = tmp.name
-        
-        # Extract text
-        extracted = []
-        with pdfplumber.open(tmp_path) as pdf_doc:
-            pages = pdf_doc.pages[:max_pages]
-            for idx, pg in enumerate(pages, start=1):
-                txt = pg.extract_text() or ""
-                if txt.strip():
-                    extracted.append(f"[Page {idx}]\n{txt}")
-        
-        full_text = "\n\n".join(extracted)
-        
-        # Translate each page
-        translated = []
-        for page_text in extracted:
-            trans = _translate_text_4langs(page_text.split('\n', 1)[1])  # Skip page header
-            translated.append(page_text.split('\n')[0] + "\n" + trans)
-        
-        # Clean up
-        os.unlink(tmp_path)
-        
-        return {"text": full_text, "translation": "\n\n".join(translated)}
-        
-    except Exception as e:
-        print(f"Whisper PDF error: {e}")
-        return {"error": str(e)}
-
-
-@app.post("/whisper/realtime/start")
-async def whisper_realtime_start():
-    """Start realtime transcription session"""
-    session_id = os.urandom(16).hex()
-    realtime_sessions[session_id] = {
-        "buffer": [],
-        "queue": asyncio.Queue(),
-        "active": True
-    }
-    return {"session_id": session_id}
-
-
-@app.post("/whisper/realtime/process")
-async def whisper_realtime_process(
-    audio: UploadFile = File(...),
-    session_id: str = Form(...)
-):
-    """Process realtime audio chunk"""
-    if session_id not in realtime_sessions:
-        return {"error": "Invalid session"}
-    
-    try:
-        # Read audio data
-        content = await audio.read()
-        audio_array = np.frombuffer(content, dtype=np.int16).astype(np.float32) / 32768.0
-        
-        # Process in executor
-        result = await asyncio.get_event_loop().run_in_executor(
-            whisper_executor, gpu_asr_translate_whisper, audio_array, WHISPER_SAMPLE_RATE
-        )
-        
-        # Parse result
-        lines = result.split('<br>')
-        timestamp = lines[0].strip('[]') if lines else ""
-        text = lines[1].replace('[KO]', '').strip() if len(lines) > 1 else ""
-        translation = '<br>'.join(lines[2:-2]) if len(lines) > 3 else ""
-        
-        # Queue result
-        await realtime_sessions[session_id]["queue"].put({
-            "timestamp": timestamp,
-            "text": text,
-            "translation": translation
-        })
-        
-        return {"status": "ok"}
-        
-    except Exception as e:
-        print(f"Realtime process error: {e}")
-        return {"error": str(e)}
-
-
-@app.get("/whisper/realtime/stream")
-async def whisper_realtime_stream(session_id: str):
-    """Stream realtime results"""
-    if session_id not in realtime_sessions:
-        return JSONResponse({"error": "Invalid session"}, status_code=404)
-    
-    async def stream_results():
-        session = realtime_sessions[session_id]
-        try:
-            while session["active"]:
-                try:
-                    result = await asyncio.wait_for(session["queue"].get(), timeout=1.0)
-                    yield f"data: {json.dumps(result)}\n\n"
-                except asyncio.TimeoutError:
-                    yield f"data: {json.dumps({'keepalive': True})}\n\n"
-        except Exception as e:
-            print(f"Stream error: {e}")
-        finally:
-            # Cleanup session
-            if session_id in realtime_sessions:
-                del realtime_sessions[session_id]
-    
-    return StreamingResponse(stream_results(), media_type="text/event-stream")
-
-
-@app.get("/")
-async def index():
-    """Serve the HTML page"""
-    rtc_config = get_twilio_turn_credentials() if get_space() else None
-    
-    # Step 1: 원래 HTML의 기본 구조로 시작
-    test_html = """<!DOCTYPE html>
-<html lang="ko">
-<head>
-    <meta charset="UTF-8">
-    <title>MOUSE Extended</title>
-    <style>
-        :root {
-            --primary-color: #6f42c1;
-            --secondary-color: #563d7c;
-            --dark-bg: #121212;
-            --card-bg: #1e1e1e;
-            --text-color: #f8f9fa;
-            --border-color: #333;
-        }
-        body {
-            background-color: var(--dark-bg);
-            color: var(--text-color);
-            font-family: Arial, sans-serif;
-            margin: 0;
-            padding: 20px;
-        }
-        .tab-button {
-            padding: 10px 20px;
-            margin: 5px;
-            cursor: pointer;
-            background: var(--card-bg);
-            border: 1px solid var(--border-color);
-            color: var(--text-color);
-        }
-        .tab-button.active {
-            background: var(--primary-color);
-        }
-        .tab-content {
-            display: none;
-            padding: 20px;
-            background: var(--card-bg);
-            margin-top: 20px;
-        }
-        .tab-content.active {
-            display: block;
-        }
-        .toggle-switch {
-            width: 50px;
-            height: 26px;
-            background: #ccc;
-            cursor: pointer;
-            display: inline-block;
-        }
-        .toggle-switch.active {
-            background: var(--primary-color);
-        }
-    </style>
-</head>
-<body>
-    <h1>MOUSE Extended - Step 1</h1>
-    
-    <div class="tabs-container">
-        <button class="tab-button active" onclick="switchTab('voice-chat')">음성 채팅</button>
-        <button class="tab-button" onclick="switchTab('mic-whisper')">마이크 전사</button>
-        <button class="tab-button" onclick="switchTab('audio-whisper')">오디오 파일</button>
-    </div>
-    
-    <div id="voice-chat" class="tab-content active">
-        <h2>Voice Chat Tab</h2>
-        <div>
-            <label>웹 검색:</label>
-            <div id="search-toggle" class="toggle-switch"></div>
-        </div>
-        <div>
-            <label>언어 선택:</label>
-            <select id="language-select">
-                <option value="">비활성화</option>
-                <option value="ko">한국어</option>
-                <option value="en">English</option>
-            </select>
-        </div>
-        <button id="start-button">대화 시작</button>
-        <input type="text" id="text-input" placeholder="메시지 입력...">
-        <button id="send-button">전송</button>
-    </div>
-    
-    <div id="mic-whisper" class="tab-content">
-        <h2>마이크 전사</h2>
-        <button onclick="toggleMicRecording()">녹음 시작</button>
-    </div>
-    
-    <div id="audio-whisper" class="tab-content">
-        <h2>오디오 파일</h2>
-        <div id="audio-upload-area" style="border: 2px dashed #666; padding: 20px; cursor: pointer;">
-            클릭하여 업로드
-        </div>
-    </div>
-
-    <script>
-        console.log('=== Script Start ===');
-        
-        // Global variables
-        let webSearchEnabled = false;
-        let selectedLanguage = "";
-        
-        // Tab switching
-        function switchTab(tabName) {
-            console.log('Switching to:', tabName);
-            
-            document.querySelectorAll('.tab-content').forEach(tab => {
-                tab.style.display = 'none';
-                tab.classList.remove('active');
-            });
-            
-            document.querySelectorAll('.tab-button').forEach(btn => {
-                btn.classList.remove('active');
-            });
-            
-            const selectedTab = document.getElementById(tabName);
-            if (selectedTab) {
-                selectedTab.style.display = 'block';
-                selectedTab.classList.add('active');
-            }
-            
-            event.target.classList.add('active');
-        }
-        
-        // Mock functions
-        function toggleMicRecording() {
-            alert('Mic recording toggle');
-        }
-        
-        function setupWebRTC() {
-            alert('WebRTC setup');
-        }
-        
-        function stop() {
-            alert('Stop');
-        }
-        
-        function sendTextMessage() {
-            const input = document.getElementById('text-input');
-            alert('Send: ' + input.value);
-        }
-        
-        // Initialize
-        window.onload = function() {
-            console.log('=== Window loaded ===');
-            
-            // Search toggle
-            document.getElementById('search-toggle').onclick = function() {
-                webSearchEnabled = !webSearchEnabled;
-                this.classList.toggle('active');
-                console.log('Search enabled:', webSearchEnabled);
-            };
-            
-            // Language select
-            document.getElementById('language-select').onchange = function() {
-                selectedLanguage = this.value;
-                console.log('Language:', selectedLanguage);
-            };
-            
-            // Start button
-            document.getElementById('start-button').onclick = function() {
-                setupWebRTC();
-            };
-            
-            // Send button
-            document.getElementById('send-button').onclick = sendTextMessage;
-            
-            // Text input
-            document.getElementById('text-input').onkeypress = function(e) {
-                if (e.key === 'Enter') {
-                    sendTextMessage();
-                }
-            };
-            
-            // File upload
-            document.getElementById('audio-upload-area').onclick = function() {
-                alert('Audio upload clicked');
-            };
-            
-            console.log('=== All initialized ===');
-        };
-        
-        console.log('=== Script End ===');
-    </script>
-</body>
-</html>"""
-    
-    return HTMLResponse(content=test_html)
-
-
-if __name__ == "__main__":
-    import uvicorn
-    
-    mode = os.getenv("MODE")
-    if mode == "UI":
-        stream.ui.launch(server_port=7860)
-    elif mode == "PHONE":
-        stream.fastphone(host="0.0.0.0", port=7860)
-    else:
-        uvicorn.run(app, host="0.0.0.0", port=7860)
\ No newline at end of file
