한국어 TTS 아레나 - Docker Space 배포

- 채널톡 TTS API 통합
- 한국어 UI/UX
- Conversational 기능 제거, TTS 전용
- Docker 배포 설정 추가
- About 페이지 한국어 TTS 벤치마크 설명 추가

.dockerignore

@@ -0,0 +1,34 @@
+# Git
+.git
+.gitignore
+
+# Python
+__pycache__
+*.py[cod]
+*$py.class
+*.so
+.Python
+env/
+venv/
+.env
+*.egg-info/
+dist/
+build/
+
+# IDE
+.vscode/
+.idea/
+*.swp
+*.swo
+
+# Local files
+instance/
+*.db
+*.sqlite
+tts_cache/
+audio_cache/
+
+# Misc
+.DS_Store
+*.log
+

Dockerfile

@@ -0,0 +1,33 @@
+# Hugging Face Spaces Docker
+FROM python:3.11-slim
+
+# Create non-root user
+RUN useradd -m -u 1000 user
+USER user
+
+ENV PATH="/home/user/.local/bin:$PATH"
+ENV HOME="/home/user"
+
+WORKDIR /app
+
+# Copy requirements first for better caching
+COPY --chown=user ./requirements.txt requirements.txt
+RUN pip install --no-cache-dir --upgrade -r requirements.txt
+
+# Copy application files
+COPY --chown=user . /app
+
+# Create necessary directories
+RUN mkdir -p /app/instance /app/tts_cache /app/audio_cache
+
+# Set environment variables for HF Spaces
+ENV FLASK_ENV=production
+ENV IS_SPACES=true
+ENV PORT=7860
+
+# Expose port
+EXPOSE 7860
+
+# Run with waitress (already in requirements.txt)
+CMD ["python", "app.py"]
+

README.md

@@ -1,16 +1,41 @@
 ---
-title: TTS Arena V2
-emoji: 🏆
-colorFrom: blue
+title: 한국어 TTS 아레나
+emoji: 🎤
+colorFrom: purple
 colorTo: blue
-sdk: gradio
-app_file: app.py
-short_description: Vote on the latest TTS models!
+sdk: docker
+app_port: 7860
+short_description: 한국어 TTS 모델을 블라인드 테스트로 비교 평가하세요!
 pinned: true
-
 hf_oauth: true
+hf_oauth_scopes:
+  - read-repos
+  - write-repos
+  - manage-repos
+  - inference-api
 ---
 
-Please see the [GitHub repo](https://github.com/TTS-AGI/TTS-Arena-V2) for information.
+# 🎤 한국어 TTS 아레나
+
+한국어 TTS 모델을 블라인드 테스트로 비교 평가하는 커뮤니티 기반 플랫폼입니다.
+
+## 왜 한국어 TTS 벤치마크가 필요한가?
+
+- **WER (Word Error Rate)**: 한국어의 복잡한 발화 패턴을 제대로 반영하지 못함
+- **MOS (Mean Opinion Score)**: 소규모 참가자 대상의 주관적 평가로 한계 존재
+- **글로벌 TTS 모델의 한국어 한계**: 운율(Prosody) 부자연스러움, 숫자/날짜/전화번호 발화 취약
+
+## 사용 방법
+
+1. 텍스트를 입력하거나 랜덤 문장을 선택
+2. 두 TTS 모델의 음성을 듣고 비교
+3. 더 자연스러운 음성에 투표
+4. 리더보드에서 모델 순위 확인
+
+## Supported by
+
+[채널톡](https://channel.io/ko) AI Team
+
+## 참고 자료
 
-Join the [Discord server](https://discord.gg/HB8fMR6GTr) for updates and support.
+- [Channel TTS: Towards Real-World Prosody for Conversational Agents](https://tts.ch.dev/)

app.py

@@ -5,12 +5,11 @@ from concurrent.futures import ThreadPoolExecutor
 from datetime import datetime
 import threading # Added for locking
 from sqlalchemy import or_ # Added for vote counting query
-from datasets import load_dataset
 
 year = datetime.now().year
 month = datetime.now().month
 
-# Check if running in a Huggin Face Space
+# Check if running in a Hugging Face Space
 IS_SPACES = False
 if os.getenv("SPACE_REPO_NAME"):
     print("Running in a Hugging Face Space 🤗")
@@ -22,7 +21,7 @@ if os.getenv("SPACE_REPO_NAME"):
         try:
             print("Database not found, downloading from HF dataset...")
             hf_hub_download(
-                repo_id="TTS-AGI/database-arena-v2",
+                repo_id="channelcorp/ko-tts-arena-db",
                 filename="tts_arena.db",
                 repo_type="dataset",
                 local_dir="instance",
@@ -68,29 +67,6 @@ from flask_migrate import Migrate
 import requests
 import functools
 import time # Added for potential retries
-from langdetect import detect, DetectorFactory
-
-# Set random seed for consistent language detection results
-DetectorFactory.seed = 0
-
-
-def is_english_text(text):
-    """
-    Detect if the given text is in English.
-    Returns True if English, False otherwise.
-    """
-    try:
-        # Remove leading/trailing whitespace and check if text is not empty
-        text = text.strip()
-        if not text:
-            return False
-        
-        # Detect language
-        detected_language = detect(text)
-        return detected_language == 'en'
-    except Exception:
-        # If detection fails, assume it's not English for safety
-        return False
 
 
 def get_client_ip():
@@ -177,10 +153,6 @@ os.makedirs(CACHE_AUDIO_DIR, exist_ok=True) # Ensure cache subdir exists
 app.tts_sessions = {}
 tts_sessions = app.tts_sessions
 
-# Store active conversational sessions
-app.conversational_sessions = {}
-conversational_sessions = app.conversational_sessions
-
 # Register blueprints
 app.register_blueprint(auth, url_prefix="/auth")
 app.register_blueprint(admin)
@@ -332,12 +304,13 @@ def verify_turnstile():
         # Otherwise redirect back to turnstile page
         return redirect(url_for("turnstile_page", redirect_url=redirect_url))
 
-# Load sentences from the TTS-AGI/arena-prompts dataset
-print("Loading TTS-AGI/arena-prompts dataset...")
-dataset = load_dataset("TTS-AGI/arena-prompts", split="train")
-# Extract the text column and clean up
-all_harvard_sentences = [item['text'].strip() for item in dataset if item['text'] and item['text'].strip()]
-print(f"Loaded {len(all_harvard_sentences)} sentences from dataset")
+# Load Korean prompts from local JSON file
+print("Loading Korean TTS prompts from ko_prompts.json...")
+_prompts_path = os.path.join(os.path.dirname(__file__), "ko_prompts.json")
+with open(_prompts_path, "r", encoding="utf-8") as f:
+    _prompts_data = json.load(f)
+all_harvard_sentences = _prompts_data.get("prompts", [])
+print(f"Loaded {len(all_harvard_sentences)} Korean prompts")
 
 # Initialize initial_sentences as empty - will be populated with unconsumed sentences only
 initial_sentences = []
@@ -351,42 +324,29 @@ def arena():
 @app.route("/leaderboard")
 def leaderboard():
     tts_leaderboard = get_leaderboard_data(ModelType.TTS)
-    conversational_leaderboard = get_leaderboard_data(ModelType.CONVERSATIONAL)
     top_voters = get_top_voters(10)  # Get top 10 voters
 
     # Initialize personal leaderboard data
     tts_personal_leaderboard = None
-    conversational_personal_leaderboard = None
     user_leaderboard_visibility = None
 
     # If user is logged in, get their personal leaderboard and visibility setting
     if current_user.is_authenticated:
         tts_personal_leaderboard = get_user_leaderboard(current_user.id, ModelType.TTS)
-        conversational_personal_leaderboard = get_user_leaderboard(
-            current_user.id, ModelType.CONVERSATIONAL
-        )
         user_leaderboard_visibility = current_user.show_in_leaderboard
 
     # Get key dates for the timeline
     tts_key_dates = get_key_historical_dates(ModelType.TTS)
-    conversational_key_dates = get_key_historical_dates(ModelType.CONVERSATIONAL)
 
     # Format dates for display in the dropdown
     formatted_tts_dates = [date.strftime("%B %Y") for date in tts_key_dates]
-    formatted_conversational_dates = [
-        date.strftime("%B %Y") for date in conversational_key_dates
-    ]
 
     return render_template(
         "leaderboard.html",
         tts_leaderboard=tts_leaderboard,
-        conversational_leaderboard=conversational_leaderboard,
         tts_personal_leaderboard=tts_personal_leaderboard,
-        conversational_personal_leaderboard=conversational_personal_leaderboard,
         tts_key_dates=tts_key_dates,
-        conversational_key_dates=conversational_key_dates,
         formatted_tts_dates=formatted_tts_dates,
-        formatted_conversational_dates=formatted_conversational_dates,
         top_voters=top_voters,
         user_leaderboard_visibility=user_leaderboard_visibility
     )
@@ -395,7 +355,7 @@ def leaderboard():
 @app.route("/api/historical-leaderboard/<model_type>")
 def historical_leaderboard(model_type):
     """Get historical leaderboard data for a specific date"""
-    if model_type not in [ModelType.TTS, ModelType.CONVERSATIONAL]:
+    if model_type != ModelType.TTS:
         return jsonify({"error": "Invalid model type"}), 400
 
     # Get date from query parameter
@@ -939,303 +899,6 @@ def cleanup_session(session_id):
         del app.tts_sessions[session_id]
 
 
-@app.route("/api/conversational/generate", methods=["POST"])
-@limiter.limit("5 per minute")
-def generate_podcast():
-    # If verification not setup, handle it first
-    if app.config["TURNSTILE_ENABLED"] and not session.get("turnstile_verified"):
-        return jsonify({"error": "Turnstile verification required"}), 403
-
-    # Require user to be logged in to generate audio
-    if not current_user.is_authenticated:
-        return jsonify({"error": "You must be logged in to generate audio"}), 401
-
-    data = request.json
-    script = data.get("script")
-
-    if not script or not isinstance(script, list) or len(script) < 2:
-        return jsonify({"error": "Invalid script format or too short"}), 400
-
-    # Validate script format
-    for line in script:
-        if not isinstance(line, dict) or "text" not in line or "speaker_id" not in line:
-            return (
-                jsonify(
-                    {
-                        "error": "Invalid script line format. Each line must have text and speaker_id"
-                    }
-                ),
-                400,
-            )
-        if (
-            not line["text"]
-            or not isinstance(line["speaker_id"], int)
-            or line["speaker_id"] not in [0, 1]
-        ):
-            return (
-                jsonify({"error": "Invalid script content. Speaker ID must be 0 or 1"}),
-                400,
-            )
-
-    # Get two conversational models (currently only CSM and PlayDialog)
-    available_models = Model.query.filter_by(
-        model_type=ModelType.CONVERSATIONAL, is_active=True
-    ).all()
-
-    if len(available_models) < 2:
-        return jsonify({"error": "Not enough conversational models available"}), 500
-
-    selected_models = get_weighted_random_models(available_models, 2, ModelType.CONVERSATIONAL)
-
-    try:
-        # Generate audio for both models concurrently
-        audio_files = []
-        model_ids = []
-
-        # Function to process a single model
-        def process_model(model):
-            # Call conversational TTS service
-            audio_content = predict_tts(script, model.id)
-
-            # Save to temp file with unique name
-            file_uuid = str(uuid.uuid4())
-            dest_path = os.path.join(TEMP_AUDIO_DIR, f"{file_uuid}.wav")
-
-            with open(dest_path, "wb") as f:
-                f.write(audio_content)
-
-            return {"model_id": model.id, "audio_path": dest_path}
-
-        # Use ThreadPoolExecutor to process models concurrently
-        with ThreadPoolExecutor(max_workers=2) as executor:
-            results = list(executor.map(process_model, selected_models))
-
-        # Extract results
-        for result in results:
-            model_ids.append(result["model_id"])
-            audio_files.append(result["audio_path"])
-
-        # Create session
-        session_id = str(uuid.uuid4())
-        script_text = " ".join([line["text"] for line in script])
-        app.conversational_sessions[session_id] = {
-            "model_a": model_ids[0],
-            "model_b": model_ids[1],
-            "audio_a": audio_files[0],
-            "audio_b": audio_files[1],
-            "text": script_text[:1000],  # Limit text length
-            "created_at": datetime.utcnow(),
-            "expires_at": datetime.utcnow() + timedelta(minutes=30),
-            "voted": False,
-            "script": script,
-            "cache_hit": False,  # Conversational is always generated on-demand
-        }
-
-        # Return audio file paths and session
-        return jsonify(
-            {
-                "session_id": session_id,
-                "audio_a": f"/api/conversational/audio/{session_id}/a",
-                "audio_b": f"/api/conversational/audio/{session_id}/b",
-                "expires_in": 1800,  # 30 minutes in seconds
-            }
-        )
-
-    except Exception as e:
-        app.logger.error(f"Conversational generation error: {str(e)}")
-        return jsonify({"error": f"Failed to generate podcast: {str(e)}"}), 500
-
-
-@app.route("/api/conversational/audio/<session_id>/<model_key>")
-def get_podcast_audio(session_id, model_key):
-    # If verification not setup, handle it first
-    if app.config["TURNSTILE_ENABLED"] and not session.get("turnstile_verified"):
-        return jsonify({"error": "Turnstile verification required"}), 403
-
-    if session_id not in app.conversational_sessions:
-        return jsonify({"error": "Invalid or expired session"}), 404
-
-    session_data = app.conversational_sessions[session_id]
-
-    # Check if session expired
-    if datetime.utcnow() > session_data["expires_at"]:
-        cleanup_conversational_session(session_id)
-        return jsonify({"error": "Session expired"}), 410
-
-    if model_key == "a":
-        audio_path = session_data["audio_a"]
-    elif model_key == "b":
-        audio_path = session_data["audio_b"]
-    else:
-        return jsonify({"error": "Invalid model key"}), 400
-
-    # Check if file exists
-    if not os.path.exists(audio_path):
-        return jsonify({"error": "Audio file not found"}), 404
-
-    return send_file(audio_path, mimetype="audio/wav")
-
-
-@app.route("/api/conversational/vote", methods=["POST"])
-@limiter.limit("30 per minute")
-def submit_podcast_vote():
-    # If verification not setup, handle it first
-    if app.config["TURNSTILE_ENABLED"] and not session.get("turnstile_verified"):
-        return jsonify({"error": "Turnstile verification required"}), 403
-
-    # Require user to be logged in to vote
-    if not current_user.is_authenticated:
-        return jsonify({"error": "You must be logged in to vote"}), 401
-
-    # Security checks for vote manipulation prevention
-    client_ip = get_client_ip()
-    vote_allowed, security_reason, security_score = is_vote_allowed(current_user.id, client_ip)
-    
-    if not vote_allowed:
-        app.logger.warning(f"Conversational vote blocked for user {current_user.username} (ID: {current_user.id}): {security_reason} (Score: {security_score})")
-        return jsonify({"error": f"Vote not allowed: {security_reason}"}), 403
-
-    data = request.json
-    session_id = data.get("session_id")
-    chosen_model_key = data.get("chosen_model")  # "a" or "b"
-
-    if not session_id or session_id not in app.conversational_sessions:
-        return jsonify({"error": "Invalid or expired session"}), 404
-
-    if not chosen_model_key or chosen_model_key not in ["a", "b"]:
-        return jsonify({"error": "Invalid chosen model"}), 400
-
-    session_data = app.conversational_sessions[session_id]
-
-    # Check if session expired
-    if datetime.utcnow() > session_data["expires_at"]:
-        cleanup_conversational_session(session_id)
-        return jsonify({"error": "Session expired"}), 410
-
-    # Check if already voted
-    if session_data["voted"]:
-        return jsonify({"error": "Vote already submitted for this session"}), 400
-
-    # Get model IDs and audio paths
-    chosen_id = (
-        session_data["model_a"] if chosen_model_key == "a" else session_data["model_b"]
-    )
-    rejected_id = (
-        session_data["model_b"] if chosen_model_key == "a" else session_data["model_a"]
-    )
-    chosen_audio_path = (
-        session_data["audio_a"] if chosen_model_key == "a" else session_data["audio_b"]
-    )
-    rejected_audio_path = (
-        session_data["audio_b"] if chosen_model_key == "a" else session_data["audio_a"]
-    )
-
-    # Calculate session duration and gather analytics data
-    vote_time = datetime.utcnow()
-    session_duration = (vote_time - session_data["created_at"]).total_seconds()
-    client_ip = get_client_ip()
-    user_agent = request.headers.get('User-Agent')
-    cache_hit = session_data.get("cache_hit", False)
-
-    # Record vote in database with analytics data
-    vote, error = record_vote(
-        current_user.id, 
-        session_data["text"], 
-        chosen_id, 
-        rejected_id, 
-        ModelType.CONVERSATIONAL,
-        session_duration=session_duration,
-        ip_address=client_ip,
-        user_agent=user_agent,
-        generation_date=session_data["created_at"],
-        cache_hit=cache_hit,
-        all_dataset_sentences=all_harvard_sentences  # Note: conversational uses scripts, not sentences
-    )
-
-    if error:
-        return jsonify({"error": error}), 500
-
-    # Sentence consumption is now handled within record_vote function
-
-    # --- Save preference data ---\
-    try:
-        vote_uuid = str(uuid.uuid4())
-        vote_dir = os.path.join("./votes", vote_uuid)
-        os.makedirs(vote_dir, exist_ok=True)
-
-        # Copy audio files
-        shutil.copy(chosen_audio_path, os.path.join(vote_dir, "chosen.wav"))
-        shutil.copy(rejected_audio_path, os.path.join(vote_dir, "rejected.wav"))
-
-        # Create metadata
-        chosen_model_obj = Model.query.get(chosen_id)
-        rejected_model_obj = Model.query.get(rejected_id)
-        metadata = {
-            "script": session_data["script"], # Save the full script
-            "chosen_model": chosen_model_obj.name if chosen_model_obj else "Unknown",
-            "chosen_model_id": chosen_model_obj.id if chosen_model_obj else "Unknown",
-            "rejected_model": rejected_model_obj.name if rejected_model_obj else "Unknown",
-            "rejected_model_id": rejected_model_obj.id if rejected_model_obj else "Unknown",
-            "session_id": session_id,
-            "timestamp": datetime.utcnow().isoformat(),
-            "username": current_user.username,
-            "model_type": "CONVERSATIONAL"
-        }
-        with open(os.path.join(vote_dir, "metadata.json"), "w") as f:
-            json.dump(metadata, f, indent=2)
-
-    except Exception as e:
-        app.logger.error(f"Error saving preference data for conversational vote {session_id}: {str(e)}")
-        # Continue even if saving preference data fails, vote is already recorded
-
-    # Mark session as voted
-    session_data["voted"] = True
-
-    # Check for coordinated voting campaigns (async to not slow down response)
-    try:
-        from threading import Thread
-        campaign_check_thread = Thread(target=check_for_coordinated_campaigns)
-        campaign_check_thread.daemon = True
-        campaign_check_thread.start()
-    except Exception as e:
-        app.logger.error(f"Error starting coordinated campaign check thread: {str(e)}")
-
-    # Return updated models (use previously fetched objects)
-    return jsonify(
-        {
-            "success": True,
-            "chosen_model": {"id": chosen_id, "name": chosen_model_obj.name if chosen_model_obj else "Unknown"},
-            "rejected_model": {
-                "id": rejected_id,
-                "name": rejected_model_obj.name if rejected_model_obj else "Unknown",
-            },
-            "names": {
-                "a": Model.query.get(session_data["model_a"]).name,
-                "b": Model.query.get(session_data["model_b"]).name,
-            },
-        }
-    )
-
-
-def cleanup_conversational_session(session_id):
-    """Remove conversational session and its audio files"""
-    if session_id in app.conversational_sessions:
-        session = app.conversational_sessions[session_id]
-
-        # Remove audio files
-        for audio_file in [session["audio_a"], session["audio_b"]]:
-            if os.path.exists(audio_file):
-                try:
-                    os.remove(audio_file)
-                except Exception as e:
-                    app.logger.error(
-                        f"Error removing conversational audio file: {str(e)}"
-                    )
-
-        # Remove session
-        del app.conversational_sessions[session_id]
-
-
 # Schedule periodic cleanup
 def setup_cleanup():
     def cleanup_expired_sessions():
@@ -1249,16 +912,7 @@ def setup_cleanup():
             ]
             for sid in expired_tts_sessions:
                 cleanup_session(sid)
-
-            # Cleanup conversational sessions
-            expired_conv_sessions = [
-                sid
-                for sid, session_data in app.conversational_sessions.items()
-                if current_time > session_data["expires_at"]
-            ]
-            for sid in expired_conv_sessions:
-                cleanup_conversational_session(sid)
-            app.logger.info(f"Cleaned up {len(expired_tts_sessions)} TTS and {len(expired_conv_sessions)} conversational sessions.")
+            app.logger.info(f"Cleaned up {len(expired_tts_sessions)} TTS sessions.")
 
     # Also cleanup potentially expired cache entries (e.g., > 1 hour old)
     # This prevents stale cache entries if generation is slow or failing
@@ -1593,14 +1247,6 @@ def check_for_coordinated_campaigns():
                 detect_coordinated_voting(model.id)
             except Exception as e:
                 app.logger.error(f"Error checking coordinated voting for TTS model {model.id}: {str(e)}")
-        
-        # Check conversational models
-        conv_models = Model.query.filter_by(model_type=ModelType.CONVERSATIONAL, is_active=True).all()
-        for model in conv_models:
-            try:
-                detect_coordinated_voting(model.id)
-            except Exception as e:
-                app.logger.error(f"Error checking coordinated voting for conversational model {model.id}: {str(e)}")
                 
     except Exception as e:
         app.logger.error(f"Error in coordinated campaign check: {str(e)}")
@@ -1682,13 +1328,14 @@ if __name__ == "__main__":
             url_scheme='https'
         )
     else:
-        print(f"Starting Waitress server with {threads} threads")
+        port = int(os.environ.get("PORT", 5001))
+        print(f"Starting Waitress server with {threads} threads on port {port}")
         serve(
             app,
             host="0.0.0.0",
-            port=5000,
+            port=port,
             threads=threads,
             connection_limit=100,
             channel_timeout=30,
-            url_scheme='https' # Keep https for local dev if using proxy/tunnel
+            url_scheme='http'  # Local dev uses http
         )

ko_prompts.json

@@ -0,0 +1,55 @@
+{
+  "prompts": [
+    "안녕하세요, 오늘 날씨가 정말 좋네요.",
+    "지금 몇 시예요? 약속 시간에 늦을 것 같아요.",
+    "오늘 저녁에 뭐 먹을까요? 치킨이 땡기는데.",
+    "주말에 시간 되시면 같이 영화 보러 갈래요?",
+    "커피 한 잔 하실래요? 제가 살게요.",
+    "회의는 오후 세 시에 시작합니다. 자료 준비해 주세요.",
+    "이번 분기 매출이 전년 대비 이십 퍼센트 증가했습니다.",
+    "고객님, 문의하신 내용 확인 후 답변드리겠습니다.",
+    "프로젝트 마감일이 다음 주 금요일입니다.",
+    "미팅 일정을 조율하고 싶은데, 언제가 편하신가요?",
+    "채널톡 고객센터입니다. 무엇을 도와드릴까요?",
+    "주문하신 상품은 내일 오전 중으로 배송될 예정입니다.",
+    "불편을 드려 죄송합니다. 바로 처리해 드리겠습니다.",
+    "결제가 정상적으로 완료되었습니다. 감사합니다.",
+    "반품 신청이 접수되었습니다. 삼 영업일 내에 처리됩니다.",
+    "서울의 현재 기온은 섭씨 이십오 도입니다.",
+    "다음 정류장은 강남역입니다. 내리실 분은 준비해 주세요.",
+    "오늘의 환율은 달러당 천삼백원입니다.",
+    "이 제품의 가격은 삼만구천원입니다.",
+    "영업시간은 오전 아홉 시부터 오후 여섯 시까지입니다.",
+    "정말 기쁜 소식이에요! 축하드려요!",
+    "걱정하지 마세요, 다 잘 될 거예요.",
+    "오랜만이에요! 그동안 잘 지내셨어요?",
+    "정말 감사합니다. 덕분에 큰 도움이 됐어요.",
+    "아쉽지만 다음 기회에 뵙겠습니다.",
+    "문을 열려면 버튼을 눌러주세요.",
+    "왼쪽으로 돌아서 직진하시면 됩니다.",
+    "앱을 설치하고 회원가입을 진행해 주세요.",
+    "비밀번호는 여덟 자리 이상으로 설정해 주세요.",
+    "첨부파일을 확인하시고 서명해 주세요.",
+    "오늘 주요 뉴스를 전해드리겠습니다.",
+    "정부가 새로운 정책을 발표했습니다.",
+    "국내 반도체 수출이 사상 최대치를 기록했습니다.",
+    "내일 전국적으로 비가 내릴 예정입니다.",
+    "올해 출생률이 역대 최저를 기록했습니다.",
+    "오늘 수업에서는 인공지능의 기초를 배워보겠습니다.",
+    "이 문제의 정답은 삼번입니다.",
+    "다음 시간까지 과제를 제출해 주세요.",
+    "질문이 있으시면 언제든지 물어보세요.",
+    "복습은 학습의 가장 중요한 부분입니다.",
+    "이번 주 인기 영화 순위를 알려드릴게요.",
+    "새 앨범이 음원 차트 일위를 차지했습니다.",
+    "오늘 경기에서 한국팀이 이겼습니다!",
+    "다음 에피소드가 정말 기대돼요.",
+    "이 노래 가사가 정말 마음에 들어요.",
+    "인공지능 기술이 빠르게 발전하고 있습니다.",
+    "스마트폰 배터리를 절약하는 방법을 알려드릴게요.",
+    "이 앱은 무료로 다운로드할 수 있습니다.",
+    "시스템 업데이트가 완료되었습니다.",
+    "클라우드에 파일이 자동으로 저장됩니다."
+  ]
+}
+

models.py

@@ -566,235 +566,70 @@ def get_key_historical_dates(model_type):
 
 
 def insert_initial_models():
-    """Insert initial models into the database."""
+    """Insert initial models into the database (한국어 TTS 전용)."""
+    import os
+    
+    # 환경 변수로 API 키 확인하여 활성화 여부 결정
+    has_openai = bool(os.getenv("OPENAI_API_KEY"))
+    has_elevenlabs = bool(os.getenv("ELEVENLABS_API_KEY"))
+    has_google = bool(os.getenv("GOOGLE_API_KEY"))
+    
     tts_models = [
+        # 채널톡 TTS (한국어 특화) - 항상 활성화
         Model(
-            id="eleven-multilingual-v2",
-            name="Eleven Multilingual v2",
-            model_type=ModelType.TTS,
-            is_open=False,
-            model_url="https://elevenlabs.io/",
-        ),
-        Model(
-            id="eleven-turbo-v2.5",
-            name="Eleven Turbo v2.5",
-            model_type=ModelType.TTS,
-            is_open=False,
-            model_url="https://elevenlabs.io/",
-        ),
-        Model(
-            id="eleven-flash-v2.5",
-            name="Eleven Flash v2.5",
-            model_type=ModelType.TTS,
-            is_open=False,
-            model_url="https://elevenlabs.io/",
-        ),
-        Model(
-            id="cartesia-sonic-2",
-            name="Cartesia Sonic 2",
-            model_type=ModelType.TTS,
-            is_open=False,
-            is_active=False, # ran out of credits
-            model_url="https://cartesia.ai/",
-        ),
-        Model(
-            id="spark-tts",
-            name="Spark TTS",
-            model_type=ModelType.TTS,
-            is_open=False,
-            is_active=False, # API stopped working
-            model_url="https://github.com/SparkAudio/Spark-TTS",
-        ),
-        Model(
-            id="playht-2.0",
-            name="PlayHT 2.0",
-            model_type=ModelType.TTS,
-            is_open=False,
-            is_active=False,
-            model_url="https://play.ht/",
-        ),
-        Model(
-            id="styletts2",
-            name="StyleTTS 2",
-            model_type=ModelType.TTS,
-            is_open=False,
-            is_active=False,
-            model_url="https://github.com/yl4579/StyleTTS2",
-        ),
-        Model(
-            id="kokoro-v1",
-            name="Kokoro v1.0",
-            model_type=ModelType.TTS,
-            is_open=True,
-            model_url="https://huggingface.co/hexgrad/Kokoro-82M",
-        ),
-        Model(
-            id="cosyvoice-2.0",
-            name="CosyVoice 2.0",
-            model_type=ModelType.TTS,
-            is_open=True,
-            model_url="https://github.com/FunAudioLLM/CosyVoice",
-        ),
-        Model(
-            id="papla-p1",
-            name="Papla P1",
-            model_type=ModelType.TTS,
-            is_open=False,
-            model_url="https://papla.media/",
-        ),
-        Model(
-            id="hume-octave",
-            name="Hume Octave",
-            model_type=ModelType.TTS,
-            is_open=False,
-            model_url="https://hume.ai/",
-        ),
-        Model(
-            id="megatts3",
-            name="MegaTTS 3",
-            model_type=ModelType.TTS,
-            is_active=False,
-            is_open=True,
-            model_url="https://github.com/bytedance/MegaTTS3",
-        ),
-        Model(
-            id="minimax-02-hd",
-            name="MiniMax Speech-02-HD",
-            model_type=ModelType.TTS,
-            is_open=False,
-            model_url="http://minimax.io/",
-        ),
-        Model(
-            id="minimax-02-turbo",
-            name="MiniMax Speech-02-Turbo",
-            model_type=ModelType.TTS,
-            is_open=False,
-            model_url="http://minimax.io/",
-        ),
-        Model(
-            id="lanternfish-1",
-            name="OpenAudio S1",
-            model_type=ModelType.TTS,
-            is_open=False,
-            is_active=False, # NOTE: Waiting to receive a pool of voices
-            model_url="https://fish.audio/",
-        ),
-        Model(
-            id="chatterbox",
-            name="Chatterbox",
-            model_type=ModelType.TTS,
-            is_open=False,
-            is_active=True,
-            model_url="https://www.resemble.ai/chatterbox/",
-        ),
-        Model(
-            id="inworld",
-            name="Inworld TTS",
-            model_type=ModelType.TTS,
-            is_open=False,
-            is_active=True,
-            model_url="https://inworld.ai/tts",
-        ),
-        Model(
-            id="inworld-max",
-            name="Inworld TTS MAX",
-            model_type=ModelType.TTS,
-            is_open=False,
-            is_active=True,
-            model_url="https://inworld.ai/tts",
-        ),
-        Model(
-            id="async-1",
-            name="CastleFlow v1.0",
+            id="channel-hana",
+            name="채널톡 하나",
             model_type=ModelType.TTS,
             is_open=False,
             is_active=True,
-            model_url="https://async.ai/",
+            model_url="https://channel.io/",
         ),
+        # ElevenLabs (다국어 지원) - API 키 있을 때만 활성화
         Model(
-            id="nls-pre-v1",
-            name="NLS Pre V1",
+            id="eleven-multilingual-v2",
+            name="ElevenLabs Multilingual v2",
             model_type=ModelType.TTS,
             is_open=False,
-            is_active=True,
-            model_url="https://ttsarena.org/",
+            is_active=has_elevenlabs,
+            model_url="https://elevenlabs.io/",
         ),
+        # OpenAI TTS - API 키 있을 때만 활성화
         Model(
-            id="wordcab",
-            name="Wordcab TTS",
+            id="openai-tts-1",
+            name="OpenAI TTS-1",
             model_type=ModelType.TTS,
             is_open=False,
-            is_active=True,
-            model_url="https://wordcab.com/",
+            is_active=has_openai,
+            model_url="https://platform.openai.com/docs/guides/text-to-speech",
         ),
         Model(
-            id="veena",
-            name="Veena",
-            model_type=ModelType.TTS,
-            is_open=True,
-            is_active=True,
-            model_url="https://mayaresearch.ai/",
-        ),
-        Model(
-            id="maya1",
-            name="Maya 1",
+            id="openai-tts-1-hd",
+            name="OpenAI TTS-1-HD",
             model_type=ModelType.TTS,
             is_open=False,
-            is_active=True,
-            model_url="https://mayaresearch.ai/",
+            is_active=has_openai,
+            model_url="https://platform.openai.com/docs/guides/text-to-speech",
         ),
+        # Google Cloud TTS - API 키 있을 때만 활성화
         Model(
-            id="magpie",
-            name="Magpie Multilingual",
+            id="google-wavenet",
+            name="Google Wavenet (ko-KR)",
             model_type=ModelType.TTS,
             is_open=False,
-            is_active=True,
-            model_url="https://build.nvidia.com/nvidia/magpie-tts-multilingual",
+            is_active=has_google,
+            model_url="https://cloud.google.com/text-to-speech",
         ),
         Model(
-            id="parmesan",
-            name="Parmesan",
+            id="google-neural2",
+            name="Google Neural2 (ko-KR)",
             model_type=ModelType.TTS,
             is_open=False,
-            is_active=True,
-            model_url="https://ttsarena.org/",
-        ),
-        Model(
-            id="vocu",
-            name="Vocu V3.0",
-            model_type=ModelType.TTS,
-            is_open=False,
-            is_active=True,
-            model_url="https://vocu.ai/",
-        ),
-    ]
-    conversational_models = [
-        Model(
-            id="csm-1b",
-            name="CSM 1B",
-            model_type=ModelType.CONVERSATIONAL,
-            is_open=True,
-            model_url="https://huggingface.co/sesame/csm-1b",
-        ),
-        Model(
-            id="playdialog-1.0",
-            name="PlayDialog 1.0",
-            model_type=ModelType.CONVERSATIONAL,
-            is_open=False,
-            model_url="https://play.ht/",
-        ),
-        Model(
-            id="dia-1.6b",
-            name="Dia 1.6B",
-            model_type=ModelType.CONVERSATIONAL,
-            is_open=True,
-            model_url="https://huggingface.co/nari-labs/Dia-1.6B",
+            is_active=has_google,
+            model_url="https://cloud.google.com/text-to-speech",
         ),
     ]
 
-    all_models = tts_models + conversational_models
-
-    for model in all_models:
+    for model in tts_models:
         existing = Model.query.filter_by(
             id=model.id, model_type=model.model_type
         ).first()

requirements.txt

@@ -10,7 +10,4 @@ apscheduler
 flask-migrate
 gunicorn
 waitress
-fal-client
-git+https://github.com/playht/pyht
-datasets
-langdetect
+huggingface-hub

templates/about.html

@@ -1,6 +1,6 @@
 {% extends "base.html" %}
 
-{% block title %}About - TTS Arena{% endblock %}
+{% block title %}About - 한국어 TTS 아레나{% endblock %}
 
 {% block current_page %}About{% endblock %}
 
@@ -25,9 +25,16 @@
         font-size: 24px;
     }
 
+    .about-section h3 {
+        color: var(--text-color);
+        margin-top: 20px;
+        margin-bottom: 12px;
+        font-size: 18px;
+    }
+
     .about-section p {
         margin-bottom: 16px;
-        line-height: 1.6;
+        line-height: 1.7;
         color: #444;
     }
 
@@ -35,6 +42,40 @@
         margin-bottom: 0;
     }
 
+    .highlight-box {
+        background: linear-gradient(135deg, #f5f3ff 0%, #ede9fe 100%);
+        border-left: 4px solid var(--primary-color);
+        padding: 16px 20px;
+        border-radius: 0 var(--radius) var(--radius) 0;
+        margin: 20px 0;
+    }
+
+    .highlight-box p {
+        margin: 0;
+        color: #4c1d95;
+        font-weight: 500;
+    }
+
+    .problem-list {
+        list-style: none;
+        padding: 0;
+        margin: 16px 0;
+    }
+
+    .problem-list li {
+        margin-bottom: 16px;
+        padding-left: 32px;
+        position: relative;
+        line-height: 1.6;
+    }
+
+    .problem-list li::before {
+        content: "⚠️";
+        position: absolute;
+        left: 0;
+        top: 0;
+    }
+
     .feature-list {
         list-style: none;
         padding: 0;
@@ -44,86 +85,111 @@
         margin-bottom: 12px;
         padding-left: 28px;
         position: relative;
+        line-height: 1.6;
     }
 
     .feature-list li::before {
-        content: "•";
+        content: "✓";
         color: var(--primary-color);
-        font-size: 24px;
+        font-weight: bold;
         position: absolute;
         left: 8px;
-        top: -4px;
+        top: 0;
     }
 
-    .credits-list {
+    .metric-comparison {
         display: grid;
-        grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
-        gap: 24px;
-        margin-top: 16px;
+        grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
+        gap: 16px;
+        margin: 20px 0;
     }
 
-    .credit-item {
-        display: flex;
-        align-items: center;
-        justify-content: space-between;
-        padding-bottom: 8px;
-        border-bottom: 1px solid var(--border-color);
+    .metric-card {
+        background: var(--light-gray);
+        border-radius: var(--radius);
+        padding: 20px;
+        border: 1px solid var(--border-color);
     }
 
-    .credit-item a {
+    .metric-card h4 {
         color: var(--primary-color);
-        text-decoration: none;
+        margin-bottom: 8px;
+        font-size: 16px;
     }
 
-    .credit-item a:hover {
-        text-decoration: underline;
+    .metric-card .status {
+        font-size: 12px;
+        padding: 4px 8px;
+        border-radius: 4px;
+        display: inline-block;
+        margin-bottom: 8px;
     }
 
-    .social-links {
-        display: flex;
-        gap: 12px;
+    .metric-card .status.problem {
+        background: #fee2e2;
+        color: #dc2626;
     }
-    
-    .social-icon {
-        width: 20px;
-        height: 20px;
+
+    .metric-card .status.solution {
+        background: #dcfce7;
+        color: #16a34a;
     }
 
-    .citation-box {
-        background-color: var(--light-gray);
-        border-radius: var(--radius);
-        padding: 16px;
-        margin-top: 16px;
-        position: relative;
-        font-family: monospace;
-        white-space: pre-wrap;
-        word-break: break-word;
+    .metric-card p {
         font-size: 14px;
-        line-height: 1.5;
+        margin: 0;
+        color: #666;
     }
 
-    .copy-citation {
-        position: absolute;
-        top: 8px;
-        right: 8px;
-        background-color: white;
-        border: 1px solid var(--border-color);
-        border-radius: var(--radius);
-        width: 36px;
-        height: 36px;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        cursor: pointer;
-        transition: background-color 0.2s;
+    .team-section {
+        margin-top: 20px;
+    }
+
+    .team-grid {
+        display: grid;
+        grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
+        gap: 16px;
+        margin-top: 16px;
     }
 
-    .copy-citation:hover {
-        background-color: var(--light-gray);
+    .team-member {
+        background: var(--light-gray);
+        border-radius: var(--radius);
+        padding: 16px;
+        text-align: center;
+        border: 1px solid var(--border-color);
     }
 
-    .copy-citation svg {
+    .team-member .name {
+        font-weight: 600;
         color: var(--text-color);
+        margin-bottom: 4px;
+    }
+
+    .team-member .role {
+        font-size: 13px;
+        color: #666;
+    }
+
+    .reference-link {
+        display: inline-flex;
+        align-items: center;
+        gap: 8px;
+        background: var(--light-gray);
+        padding: 12px 20px;
+        border-radius: var(--radius);
+        text-decoration: none;
+        color: var(--primary-color);
+        font-weight: 500;
+        border: 1px solid var(--border-color);
+        transition: all 0.2s;
+        margin-top: 12px;
+    }
+
+    .reference-link:hover {
+        background: var(--primary-color);
+        color: white;
+        border-color: var(--primary-color);
     }
 
     .faq-item {
@@ -139,6 +205,7 @@
     .faq-answer {
         line-height: 1.6;
     }
+
     /* Dark mode styles */
     @media (prefers-color-scheme: dark) {
         .about-section {
@@ -150,266 +217,214 @@
             color: var(--text-color);
         }
 
-        .citation-box {
+        .highlight-box {
+            background: linear-gradient(135deg, rgba(91, 94, 255, 0.1) 0%, rgba(91, 94, 255, 0.05) 100%);
+        }
+
+        .highlight-box p {
+            color: #a5b4fc;
+        }
+
+        .metric-card {
             background-color: var(--secondary-color);
-            border-color: var(--border-color);
         }
 
-        .copy-citation {
-            background-color: var(--light-gray);
-            border-color: var(--border-color);
+        .metric-card p {
+            color: #aaa;
         }
 
-        .copy-citation:hover {
-            background-color: rgba(255, 255, 255, 0.1);
+        .team-member {
+            background-color: var(--secondary-color);
         }
 
-        .copy-citation svg {
-            color: var(--text-color);
+        .team-member .role {
+            color: #aaa;
         }
 
-        .faq-question {
-            color: var(--primary-color);
+        .reference-link {
+            background-color: var(--secondary-color);
         }
 
-        .social-icon.icon-x {
-            filter: invert(1);
+        .faq-question {
+            color: var(--primary-color);
         }
     }
-
 </style>
 {% endblock %}
 
 {% block content %}
 <div class="about-container">
     <div class="about-section">
-        <h2>Welcome to TTS Arena 2.0</h2>
+        <h2>🎤 한국어 TTS 아레나에 오신 것을 환영합니다</h2>
         <p>
-            TTS Arena evaluates leading speech synthesis models in an interactive, community-driven platform. 
-            Inspired by LMsys's <a href="https://chat.lmsys.org/" target="_blank" rel="noopener">Chatbot Arena</a>, we've created 
-            a space where anyone can compare and rank text-to-speech technologies through direct, side-by-side evaluation.
-        </p>
-        <p>
-            Our second version now supports conversational models for podcast-like content generation, expanding the arena's scope to reflect the diverse applications of modern speech synthesis.
+            한국어 TTS 아레나는 다양한 음성 합성(TTS) 모델을 <strong>블라인드 테스트</strong>로 비교 평가하는 
+            커뮤니티 기반 플랫폼입니다. LMsys의 
+            <a href="https://chat.lmsys.org/" target="_blank" rel="noopener">Chatbot Arena</a>에서 영감을 받아, 
+            누구나 한국어 TTS 모델의 품질을 직접 비교하고 평가할 수 있는 공간을 만들었습니다.
         </p>
+        <div class="highlight-box">
+            <p>💡 두 모델의 음성을 듣고 더 자연스러운 쪽에 투표하세요. 모델 이름은 투표 후에 공개됩니다.</p>
+        </div>
     </div>
 
     <div class="about-section">
-        <h2>Motivation</h2>
+        <h2>🤔 왜 한국어 TTS 벤치마크가 필요한가?</h2>
         <p>
-            The field of speech synthesis has long lacked reliable methods to measure model quality. Traditional 
-            metrics like WER (word error rate) often fail to capture the nuances of natural speech, while subjective 
-            measures such as MOS (mean opinion score) typically involve small-scale experiments with limited participants.
+            여러 상용 TTS가 이미 존재하지만, <strong>한국어에 특화된 신뢰할 수 있는 벤치마크</strong>는 
+            부재한 상황입니다. 글로벌 TTS 모델들은 한국어 처리에서 여러 한계를 보이고 있습니다.
         </p>
+        
+        <h3>기존 평가 방식의 한계</h3>
+        <div class="metric-comparison">
+            <div class="metric-card">
+                <h4>WER (Word Error Rate)</h4>
+                <span class="status problem">문제 있음</span>
+                <p>한국어의 복잡한 발화 패턴(숫자, 날짜, 전화번호, 주문번호 등)을 STT로 평가할 때 
+                정확도가 떨어져 실제 발화 품질을 제대로 반영하지 못합니다.</p>
+            </div>
+            <div class="metric-card">
+                <h4>MOS (Mean Opinion Score)</h4>
+                <span class="status problem">한계 존재</span>
+                <p>소규모 참가자를 대상으로 한 주관적 평가로, 비용이 많이 들고 
+                대규모 커뮤니티의 다양한 의견을 반영하기 어렵습니다.</p>
+            </div>
+            <div class="metric-card">
+                <h4>Arena 방식</h4>
+                <span class="status solution">해결��</span>
+                <p>커뮤니티 전체가 참여하는 블라인드 A/B 테스트로, 
+                Elo 레이팅 시스템을 통해 객관적인 순위를 도출합니다.</p>
+            </div>
+        </div>
+
+        <h3>글로벌 TTS 모델의 한국어 한계</h3>
+        <ul class="problem-list">
+            <li>
+                <strong>운율(Prosody)의 부자연스러움</strong><br>
+                상담사처럼 자연스러운 억양과 톤을 구현하지 못하고, 단조로운(monotone) 발화가 생성됩니다.
+            </li>
+            <li>
+                <strong>한국어 상식 기반 발화 처리 취약</strong><br>
+                한·영 혼용, 날짜·시간, 주문/고유번호, URL·이메일 등 한국어 특유의 발화 패턴을 
+                제대로 처리하지 못합니다.
+            </li>
+            <li>
+                <strong>숫자 발화의 어려움</strong><br>
+                "19,992원"을 "만 구천 구백 구십 이원"으로 자연스럽게 읽거나, 
+                전화번호 형식(011-1234-1234)을 올바르게 발화하는 것이 어렵습니다.
+            </li>
+            <li>
+                <strong>전문 용어 및 약어 처리</strong><br>
+                "%p"를 "퍼센트포인트"로 읽는 등의 상식 기반 추론이 필요한 발화에 취약합니다.
+            </li>
+        </ul>
+    </div>
+
+    <div class="about-section">
+        <h2>⚙️ 아레나 작동 방식</h2>
         <p>
-            TTS Arena addresses these limitations by inviting the entire community to participate in the evaluation 
-            process, making both the opportunity to rank models and the resulting insights accessible to everyone.
+            평가 방식은 간단합니다. 텍스트를 입력하면 두 개의 TTS 모델이 각각 음성을 생성합니다. 
+            두 샘플을 듣고 더 자연스러운 쪽에 투표하세요. 편향을 방지하기 위해 모델 이름은 
+            투표 후에만 공개됩니다.
         </p>
+        <ul class="feature-list">
+            <li>직접 텍스트를 입력하거나 랜덤 문장을 선택할 수 있습니다</li>
+            <li>동일한 텍스트로 생성된 두 TTS 모델의 음성을 비교합니다</li>
+            <li>더 자연스럽고, 명확하며, 표현력 있는 음성에 투표합니다</li>
+            <li>리더보드에서 모델 순위를 확인할 수 있습니다</li>
+            <li>Elo 레이팅 시스템으로 객관적인 순위가 산출됩니다</li>
+        </ul>
     </div>
 
     <div class="about-section">
-        <h2>How The Arena Works</h2>
+        <h2>📊 평가 대상 모델</h2>
         <p>
-            The concept is straightforward: enter text that will be synthesized by two competing models. After 
-            listening to both samples, vote for the one that sounds more natural and engaging. To prevent bias, 
-            model names are revealed only after your vote is submitted.
+            현재 아레나에서는 다음과 같은 한국어 지원 TTS 모델들을 평가하고 있습니다:
         </p>
         <ul class="feature-list">
-            <li>Enter your own text or select a random sentence</li>
-            <li>Listen to two different TTS models synthesize the same content</li>
-            <li>Compare conversational models for podcast-like content</li>
-            <li>Vote for the model that sounds more natural, clear, and expressive</li>
-            <li>Track model rankings on our leaderboard</li>
+            <li><strong>채널톡 TTS</strong> - 상담사향 프로소디에 최적화된 한국어 TTS</li>
+            <li><strong>OpenAI TTS</strong> - GPT 기반 다국어 TTS</li>
+            <li><strong>ElevenLabs</strong> - Multilingual v2 모델</li>
+            <li><strong>Google Cloud TTS</strong> - WaveNet/Neural2 한국어 음성</li>
         </ul>
+        <p>
+            더 많은 모델이 지속적으로 추가될 예정입니다. 
+            새로운 모델 추가를 원하시면 문의해 주세요.
+        </p>
     </div>
 
     <div class="about-section">
-        <h2>Frequently Asked Questions</h2>
-        <div class="faq-item">
-            <div class="faq-question">What happened to the TTS Arena V1 leaderboard?</div>
-            <div class="faq-answer">
-                The TTS Arena V1 leaderboard is now deprecated. While you can no longer vote on it, the results and leaderboard are still available for reference at <a href="https://huggingface.co/spaces/TTS-AGI/TTS-Arena" target="_blank" rel="noopener">TTS Arena V1</a>. The leaderboard is static and will not change.
-            </div>
-        </div>
-        <div class="faq-item">
-            <div class="faq-question">How are models ranked in TTS Arena?</div>
-            <div class="faq-answer">
-                Models are ranked using an Elo rating system, similar to chess rankings. When you vote for a model, its rating increases while the other model's rating decreases. The amount of change depends on the current ratings of both models.
-            </div>
-        </div>
+        <h2>❓ 자주 묻는 질문</h2>
         <div class="faq-item">
-            <div class="faq-question">Is the TTS Arena V2 leaderboard affected by votes from V1?</div>
+            <div class="faq-question">모델 순위는 어떻게 결정되나요?</div>
             <div class="faq-answer">
-                No, the TTS Arena V2 leaderboard is a completely fresh start. Votes from V1 do not affect the V2 leaderboard in any way. All models in V2 start with a clean slate.
+                체스 랭킹과 유사한 Elo 레이팅 시스템을 사용합니다. 투표를 받은 모델의 점수가 올라가고, 
+                상대 모델의 점수는 내려갑니다. 변동 폭은 두 모델의 현재 레이팅에 따라 달라집니다.
             </div>
         </div>
         <div class="faq-item">
-            <div class="faq-question">Can I suggest a model to be added to the arena?</div>
+            <div class="faq-question">로그인이 필요한가요?</div>
             <div class="faq-answer">
-                Yes! We welcome suggestions for new models. Please reach out to us through the Hugging Face community or create an issue in our GitHub repository. If you are developing a new model and wish for it to be added anonymously for pre-release evaluation, please <a href="mailto:me@mrfake.name" target="_blank" rel="noopener">reach out to us to discuss</a>.
+                투표를 위해서는 Hugging Face 로그인이 필요합니다. 로그인하면 투표 기록을 추적하고 
+                개인 리더보드에서 선호하는 모델을 확인할 수 있습니다.
             </div>
         </div>
         <div class="faq-item">
-            <div class="faq-question">How can I contribute to the project?</div>
+            <div class="faq-question">새로운 모델을 추가하고 싶어요.</div>
             <div class="faq-answer">
-                You can contribute by voting on models, suggesting improvements, reporting bugs, or even contributing code. Check our GitHub repository for more information on how to get involved.
+                새로운 TTS 모델 추가 요청은 언제든 환영합니다. 
+                출시 전 익명 평가를 원하시는 경우에도 문의해 주세요.
             </div>
         </div>
         <div class="faq-item">
-            <div class="faq-question">What's new in TTS Arena 2.0?</div>
+            <div class="faq-question">어떤 기준으로 투표해야 하나요?</div>
             <div class="faq-answer">
-                TTS Arena 2.0 introduces support for conversational models (for podcast-like content), improved UI/UX, and a more robust backend infrastructure for handling more models and votes.
-            </div>
-        </div>
-        <div class="faq-item">
-            <div class="faq-question">Do I need to login to use TTS Arena?</div>
-            <div class="faq-answer">
-                Login is optional and not required to vote. If you choose to login (with Hugging Face), texts you enter will be associated with your account, and you'll have access to a personal leaderboard showing the models you favor the most.
+                자연스러움, 발음 정확도, 억양, 감정 표현 등을 종합적으로 고려해서 
+                더 "사람 같은" 음성에 투표해 주세요.
             </div>
         </div>
     </div>
 
     <div class="about-section">
-        <h2>Citation</h2>
+        <h2>🔗 참고 자료</h2>
         <p>
-            If you use TTS Arena in your research, please cite it as follows:
+            채널톡 TTS 팀의 연구 내용과 기술적 접근 방식에 대해 더 알아보세요:
         </p>
-        <div class="citation-box" id="citation-text">@misc{tts-arena-v2,
-        title        = {TTS Arena 2.0: Benchmarking Text-to-Speech Models in the Wild},
-        author       = {mrfakename and Srivastav, Vaibhav and Fourrier, Clémentine and Pouget, Lucain and Lacombe, Yoach and main and Gandhi, Sanchit and Passos, Apolinário and Cuenca, Pedro},
-        year         = 2025,
-        publisher    = {Hugging Face},
-        howpublished = "\url{https://huggingface.co/spaces/TTS-AGI/TTS-Arena-V2}"
-}<button class="copy-citation" onclick="copyToClipboard()" title="Copy citation"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-copy-icon lucide-copy"><rect width="14" height="14" x="8" y="8" rx="2" ry="2"/><path d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"/></svg></button></div>
-        <script>
-            function copyToClipboard() {
-                const text = document.getElementById('citation-text').innerText;
-                navigator.clipboard.writeText(text).then(() => {
-                    const btn = document.querySelector('.copy-citation');
-                    const originalContent = btn.innerHTML;
-                    btn.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M20 6 9 17l-5-5"/></svg>';
-                    setTimeout(() => {
-                        btn.innerHTML = originalContent;
-                    }, 2000);
-                });
-            }
-        </script>
+        <a href="https://tts.ch.dev/" target="_blank" rel="noopener" class="reference-link">
+            <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+                <path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6"/>
+                <polyline points="15 3 21 3 21 9"/>
+                <line x1="10" y1="14" x2="21" y2="3"/>
+            </svg>
+            Channel TTS: Towards Real-World Prosody for Conversational Agents
+        </a>
     </div>
 
     <div class="about-section">
-        <h2>Credits</h2>
+        <h2>👥 만든 사람들</h2>
         <p>
-            Thank you to the following individuals who helped make this project possible:
+            이 프로젝트는 <a href="https://channel.io/ko" target="_blank" rel="noopener">채널톡</a> AI팀에서 제작했습니다.
         </p>
-        <div class="credits-list">
-            <div class="credit-item">
-                <span>Vaibhav (VB) Srivastav</span>
-                <div class="social-links">
-                    <a href="https://twitter.com/reach_vb" target="_blank" rel="noopener" title="Twitter">
-                        <img src="{{ url_for('static', filename='twitter.svg') }}" alt="Twitter" class="social-icon icon-x">
-                    </a>
-                    <a href="https://huggingface.co/reach-vb" target="_blank" rel="noopener" title="Hugging Face">
-                        <img src="{{ url_for('static', filename='huggingface.svg') }}" alt="Hugging Face" class="social-icon">
-                    </a>
-                </div>
-            </div>
-            <div class="credit-item">
-                <span>Clémentine Fourrier</span>
-                <div class="social-links">
-                    <a href="https://twitter.com/clefourrier" target="_blank" rel="noopener" title="Twitter">
-                        <img src="{{ url_for('static', filename='twitter.svg') }}" alt="Twitter" class="social-icon icon-x">
-                    </a>
-                    <a href="https://huggingface.co/clefourrier" target="_blank" rel="noopener" title="Hugging Face">
-                        <img src="{{ url_for('static', filename='huggingface.svg') }}" alt="Hugging Face" class="social-icon">
-                    </a>
-                </div>
-            </div>
-            <div class="credit-item">
-                <span>Lucain Pouget</span>
-                <div class="social-links">
-                    <a href="https://twitter.com/Wauplin" target="_blank" rel="noopener" title="Twitter">
-                        <img src="{{ url_for('static', filename='twitter.svg') }}" alt="Twitter" class="social-icon icon-x">
-                    </a>
-                    <a href="https://huggingface.co/Wauplin" target="_blank" rel="noopener" title="Hugging Face">
-                        <img src="{{ url_for('static', filename='huggingface.svg') }}" alt="Hugging Face" class="social-icon">
-                    </a>
-                </div>
-            </div>
-            <div class="credit-item">
-                <span>Yoach Lacombe</span>
-                <div class="social-links">
-                    <a href="https://twitter.com/yoachlacombe" target="_blank" rel="noopener" title="Twitter">
-                        <img src="{{ url_for('static', filename='twitter.svg') }}" alt="Twitter" class="social-icon icon-x">
-                    </a>
-                    <a href="https://huggingface.co/ylacombe" target="_blank" rel="noopener" title="Hugging Face">
-                        <img src="{{ url_for('static', filename='huggingface.svg') }}" alt="Hugging Face" class="social-icon">
-                    </a>
-                </div>
+        <div class="team-grid">
+            <div class="team-member">
+                <div class="name">Robin (신승윤)</div>
+                <div class="role">AI Team - Speech</div>
             </div>
-            <div class="credit-item">
-                <span>Main Horse</span>
-                <div class="social-links">
-                    <a href="https://twitter.com/main_horse" target="_blank" rel="noopener" title="Twitter">
-                        <img src="{{ url_for('static', filename='twitter.svg') }}" alt="Twitter" class="social-icon icon-x">
-                    </a>
-                    <a href="https://huggingface.co/main-horse" target="_blank" rel="noopener" title="Hugging Face">
-                        <img src="{{ url_for('static', filename='huggingface.svg') }}" alt="Hugging Face" class="social-icon">
-                    </a>
-                </div>
-            </div>
-            <div class="credit-item">
-                <span>Sanchit Gandhi</span>
-                <div class="social-links">
-                    <a href="https://twitter.com/sanchitgandhi99" target="_blank" rel="noopener" title="Twitter">
-                        <img src="{{ url_for('static', filename='twitter.svg') }}" alt="Twitter" class="social-icon icon-x">
-                    </a>
-                    <a href="https://huggingface.co/sanchit-gandhi" target="_blank" rel="noopener" title="Hugging Face">
-                        <img src="{{ url_for('static', filename='huggingface.svg') }}" alt="Hugging Face" class="social-icon">
-                    </a>
-                </div>
-            </div>
-            <div class="credit-item">
-                <span>Apolinário Passos</span>
-                <div class="social-links">
-                    <a href="https://twitter.com/multimodalart" target="_blank" rel="noopener" title="Twitter">
-                        <img src="{{ url_for('static', filename='twitter.svg') }}" alt="Twitter" class="social-icon icon-x">
-                    </a>
-                    <a href="https://huggingface.co/multimodalart" target="_blank" rel="noopener" title="Hugging Face">
-                        <img src="{{ url_for('static', filename='huggingface.svg') }}" alt="Hugging Face" class="social-icon">
-                    </a>
-                </div>
-            </div>
-            <div class="credit-item">
-                <span>Pedro Cuenca</span>
-                <div class="social-links">
-                    <a href="https://twitter.com/pcuenq" target="_blank" rel="noopener" title="Twitter">
-                        <img src="{{ url_for('static', filename='twitter.svg') }}" alt="Twitter" class="social-icon icon-x">
-                    </a>
-                    <a href="https://huggingface.co/pcuenq" target="_blank" rel="noopener" title="Hugging Face">
-                        <img src="{{ url_for('static', filename='huggingface.svg') }}" alt="Hugging Face" class="social-icon">
-                    </a>
-                </div>
+            <div class="team-member">
+                <div class="name">Jake (황정인)</div>
+                <div class="role">AI Team Lead</div>
             </div>
         </div>
     </div>
 
     <div class="about-section">
-        <h2>Privacy Statement</h2>
+        <h2>📜 개인정보 및 라이선스</h2>
         <p>
-            We may store text you enter and generated audio. If you are logged in, we may associate your votes with your Hugging Face username. 
-            You agree that we may collect, share, and/or publish any data you input for research and/or 
-            commercial purposes.
+            입력하신 텍스트와 생성된 오디오는 연구 목적으로 저장될 수 있습니다. 
+            로그인한 경우 투표 기록이 계정과 연결됩니다.
         </p>
-    </div>
-
-    <div class="about-section">
-        <h2>License</h2>
         <p>
-            Generated audio clips cannot be redistributed and may be used for personal, non-commercial use only.
-            The code for the Arena is licensed under the Zlib license.
-            Random sentences are sourced from a filtered subset of the 
-            <a href="https://www.cs.columbia.edu/~hgs/audio/harvard.html" target="_blank" rel="noopener">Harvard Sentences</a>.
+            생성된 오디오 클립은 개인적, 비상업적 용도로만 사용할 수 있으며 재배포할 수 없습니다.
         </p>
     </div>
 </div>
-{% endblock %}
+{% endblock %}

templates/arena.html

@@ -1,6 +1,6 @@
 {% extends "base.html" %}
 
-{% block title %}Arena - TTS Arena{% endblock %}
+{% block title %}한국어 TTS Arena{% endblock %}
 
 {% block current_page %}Arena{% endblock %}
 
@@ -12,25 +12,20 @@
 <!-- Login prompt overlay -->
 <div id="login-prompt-overlay" class="login-prompt-overlay" style="display: none;">
     <div class="login-prompt-content">
-        <h3>Login Required</h3>
-        <p>You need to be logged in to use TTS Arena. Login to generate audio and vote on models!</p>
+        <h3>로그인 필요</h3>
+        <p>TTS Arena를 사용하려면 로그인이 필요합니다. 로그인하여 음성을 생성하고 투표하세요!</p>
         <div class="login-prompt-actions">
-            <button class="login-prompt-close">Maybe later</button>
-            <a href="{{ url_for('auth.login', next=request.path) }}" class="login-prompt-btn">Login with Hugging Face</a>
+            <button class="login-prompt-close">나중에</button>
+            <a href="{{ url_for('auth.login', next=request.path) }}" class="login-prompt-btn">Hugging Face로 로그인</a>
         </div>
     </div>
 </div>
 {% endif %}
 
-<div class="tabs">
-    <div class="tab active" data-tab="tts">TTS</div>
-    <div class="tab" data-tab="conversational">Conversational</div>
-</div>
-
 <div id="tts-tab" class="tab-content active">
     <form class="input-container">
         <div class="input-group">
-            <button type="button" class="segmented-btn random-btn" title="Roll random text">
+            <button type="button" class="segmented-btn random-btn" title="랜덤 텍스트">
                 <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-shuffle-icon lucide-shuffle">
                     <path d="m18 14 4 4-4 4" />
                     <path d="m18 2 4 4-4 4" />
@@ -39,14 +34,14 @@
                     <path d="M22 18h-6.041a4 4 0 0 1-3.3-1.8l-.359-.45" />
                 </svg>
             </button>
-            <input type="text" class="text-input" placeholder="Enter text to synthesize...">
-            <button type="submit" class="segmented-btn synth-btn">Synthesize</button>
+            <input type="text" class="text-input" placeholder="합성할 텍스트를 입력하세요...">
+            <button type="submit" class="segmented-btn synth-btn">합성</button>
         </div>
-        <button type="submit" class="mobile-synth-btn">Synthesize</button>
+        <button type="submit" class="mobile-synth-btn">합성</button>
     </form>
 
     <div id="initial-keyboard-hint" class="keyboard-hint">
-        Press <kbd>R</kbd> for random text, <kbd>N</kbd> for next random round, <kbd>Enter</kbd> to generate
+        <kbd>R</kbd> 랜덤 텍스트, <kbd>N</kbd> 다음 랜덤 라운드, <kbd>Enter</kbd> 생성
     </div>
 
     <div class="loading-container" style="display: none;">
@@ -61,18 +56,18 @@
                     <span></span>
                 </div>
             </div>
-            <div class="loader-text">Generating audio samples...</div>
-            <div class="loader-subtext">This may take up to 30 seconds</div>
+            <div class="loader-text">오디오 샘플 생성 중...</div>
+            <div class="loader-subtext">최대 30초가 소요될 수 있습니다</div>
         </div>
     </div>
 
     <div class="players-container" style="display: none;">
         <div class="players-row">
             <div class="player">
-                <div class="player-label">Model A <span class="model-name-display"></span></div>
+                <div class="player-label">모델 A <span class="model-name-display"></span></div>
                 <div class="wave-player-container" data-model="a"></div>
                 <button class="vote-btn" data-model="a" disabled>
-                    Vote for A
+                    A에 투표
                     <span class="shortcut-key">A</span>
                     <span class="vote-loader" style="display: none;">
                         <div class="vote-spinner"></div>
@@ -81,10 +76,10 @@
             </div>
     
             <div class="player">
-                <div class="player-label">Model B <span class="model-name-display"></span></div>
+                <div class="player-label">모델 B <span class="model-name-display"></span></div>
                 <div class="wave-player-container" data-model="b"></div>
                 <button class="vote-btn" data-model="b" disabled>
-                    Vote for B
+                    B에 투표
                     <span class="shortcut-key">B</span>
                     <span class="vote-loader" style="display: none;">
                         <div class="vote-spinner"></div>
@@ -95,114 +90,23 @@
     </div>
 
     <div class="vote-results" style="display: none;">
-        <h3 class="results-heading">Vote Recorded!</h3>
+        <h3 class="results-heading">투표 완료!</h3>
         <div class="results-content">
             <div class="chosen-model">
-                <strong>You chose:</strong> <span class="chosen-model-name"></span>
+                <strong>선택:</strong> <span class="chosen-model-name"></span>
             </div>
             <div class="rejected-model">
-                <strong>Over:</strong> <span class="rejected-model-name"></span>
+                <strong>비교 대상:</strong> <span class="rejected-model-name"></span>
             </div>
         </div>
     </div>
 
     <div class="next-round-container" style="display: none;">
-        <button class="next-round-btn">Next Round</button>
+        <button class="next-round-btn">다음 라운드</button>
     </div>
 
     <div id="playback-keyboard-hint" class="keyboard-hint" style="display: none;">
-        Press <kbd>Space</kbd> to play/pause, <kbd>A</kbd>/<kbd>B</kbd> to vote, <kbd>R</kbd> for random text, <kbd>N</kbd> for next random round
-    </div>
-</div>
-
-<div id="conversational-tab" class="tab-content">
-    <div class="podcast-container">
-        <div class="podcast-controls">
-            <button type="button" class="segmented-btn random-script-btn" title="Load random script">
-                <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-shuffle-icon lucide-shuffle">
-                    <path d="m18 14 4 4-4 4" />
-                    <path d="m18 2 4 4-4 4" />
-                    <path d="M2 18h1.973a4 4 0 0 0 3.3-1.7l5.454-8.6a4 4 0 0 1 3.3-1.7H22" />
-                    <path d="M2 6h1.972a4 4 0 0 1 3.6 2.2" />
-                    <path d="M22 18h-6.041a4 4 0 0 1-3.3-1.8l-.359-.45" />
-                </svg>
-                Random Script
-            </button>
-            <button type="button" class="podcast-synth-btn">Generate Podcast</button>
-        </div>
-        
-        <div class="podcast-script-container">
-            <div class="podcast-lines">
-                <!-- Script lines will be added here -->
-            </div>
-            
-            <button type="button" class="add-line-btn">+ Add Line</button>
-            
-            <div class="keyboard-hint podcast-keyboard-hint">
-                Press <kbd>Ctrl</kbd>+<kbd>Enter</kbd> or <kbd>Alt</kbd>+<kbd>Enter</kbd> to add a new line
-            </div>
-        </div>
-        
-        <div class="podcast-loading-container" style="display: none;">
-            <div class="loader-wrapper">
-                <div class="loader-animation">
-                    <div class="sound-wave">
-                        <span></span>
-                        <span></span>
-                        <span></span>
-                        <span></span>
-                        <span></span>
-                        <span></span>
-                    </div>
-                </div>
-                <div class="loader-text">Generating podcast...</div>
-                <div class="loader-subtext">This may take up to a minute</div>
-            </div>
-        </div>
-
-        <div class="podcast-player-container" style="display: none;">
-            <div class="players-row">
-                <div class="player">
-                    <div class="player-label">Model A <span class="model-name-display"></span></div>
-                    <div class="podcast-wave-player-a"></div>
-                    <button class="vote-btn" data-model="a" disabled>
-                        Vote for A
-                        <span class="shortcut-key">A</span>
-                        <span class="vote-loader" style="display: none;">
-                            <div class="vote-spinner"></div>
-                        </span>
-                    </button>
-                </div>
-        
-                <div class="player">
-                    <div class="player-label">Model B <span class="model-name-display"></span></div>
-                    <div class="podcast-wave-player-b"></div>
-                    <button class="vote-btn" data-model="b" disabled>
-                        Vote for B
-                        <span class="shortcut-key">B</span>
-                        <span class="vote-loader" style="display: none;">
-                            <div class="vote-spinner"></div>
-                        </span>
-                    </button>
-                </div>
-            </div>
-
-            <div class="podcast-vote-results vote-results" style="display: none;">
-                <h3 class="results-heading">Vote Recorded!</h3>
-                <div class="results-content">
-                    <div class="chosen-model">
-                        <strong>You chose:</strong> <span class="chosen-model-name"></span>
-                    </div>
-                    <div class="rejected-model">
-                        <strong>Over:</strong> <span class="rejected-model-name"></span>
-                    </div>
-                </div>
-            </div>
-            
-            <div class="podcast-next-round-container next-round-container" style="display: none;">
-                <button class="podcast-next-round-btn next-round-btn">Next Round <span class="shortcut-key">N</span></button>
-            </div>
-        </div>
+        <kbd>Space</kbd> 재생/일시정지, <kbd>A</kbd>/<kbd>B</kbd> 투표, <kbd>R</kbd> 랜덤 텍스트, <kbd>N</kbd> 다음 랜덤 라운드
     </div>
 </div>
 
@@ -455,34 +359,6 @@
         }
     }
     
-    /* Tab styling */
-    .tabs {
-        display: flex;
-        border-bottom: 1px solid var(--border-color);
-        margin-bottom: 24px;
-    }
-    
-    .tab {
-        padding: 12px 24px;
-        cursor: pointer;
-        position: relative;
-        font-weight: 500;
-    }
-    
-    .tab.active {
-        color: var(--primary-color);
-    }
-    
-    .tab.active::after {
-        content: '';
-        position: absolute;
-        bottom: -1px;
-        left: 0;
-        width: 100%;
-        height: 2px;
-        background-color: var(--primary-color);
-    }
-    
     .tab-content {
         display: none;
     }
@@ -491,38 +367,6 @@
         display: block;
     }
     
-    /* Coming soon styling */
-    .coming-soon-container {
-        display: flex;
-        flex-direction: column;
-        align-items: center;
-        justify-content: center;
-        text-align: center;
-        padding: 60px 20px;
-        background-color: var(--light-gray);
-        border-radius: var(--radius);
-        margin: 20px 0;
-    }
-    
-    .coming-soon-icon {
-        color: var(--primary-color);
-        margin-bottom: 20px;
-    }
-    
-    .coming-soon-title {
-        font-size: 24px;
-        font-weight: 600;
-        margin-bottom: 16px;
-        color: var(--text-color);
-    }
-    
-    .coming-soon-text {
-        font-size: 16px;
-        color: #666;
-        max-width: 500px;
-        line-height: 1.5;
-    }
-    
     .model-name-display {
         font-size: 0.9em;
         color: #666;
@@ -581,14 +425,6 @@
     }
     /* Dark mode styles */
     @media (prefers-color-scheme: dark) {
-        .coming-soon-container {
-            background-color: var(--light-gray);
-        }
-        
-        .coming-soon-text {
-            color: #aaa;
-        }
-        
         .model-name-display {
             color: #aaa;
         }
@@ -658,347 +494,30 @@
         }
         
         .random-btn:hover {
-            background-color: rgba(255, 255, 255, 0.1);
-        }
-        
-        .vote-recorded {
-            background-color: var(--light-gray);
-            border-color: var(--border-color);
-        }
-        
-        /* Ensure border-radius is maintained during loading state */
-        .vote-btn.loading {
-            border-radius: var(--radius);
-        }
-
-        /* Dark mode keyboard hint */
-        .keyboard-hint {
-            color: #aaa;
-        }
-
-        .keyboard-hint kbd {
-            color: #ddd;
-            background-color: #333;
-            border-color: #555;
-            box-shadow: 0 1px 0 rgba(255,255,255,0.1);
-        }
-    }
-    
-    /* Podcast UI styles */
-    .podcast-container {
-        width: 100%;
-    }
-    
-    .podcast-controls {
-        display: flex;
-        gap: 12px;
-        margin-bottom: 24px;
-    }
-    
-    .random-script-btn {
-        display: flex;
-        align-items: center;
-        gap: 8px;
-        padding: 0 16px;
-        height: 40px;
-        background-color: white;
-        border: 1px solid var(--border-color);
-        border-radius: var(--radius);
-        cursor: pointer;
-        transition: background-color 0.2s;
-    }
-    
-    .random-script-btn:hover {
-        background-color: var(--light-gray);
-    }
-    
-    .podcast-synth-btn {
-        padding: 0 24px;
-        height: 40px;
-        background-color: var(--primary-color);
-        color: white;
-        border: none;
-        border-radius: var(--radius);
-        font-weight: 500;
-        cursor: pointer;
-        transition: background-color 0.2s;
-    }
-    
-    .podcast-synth-btn:hover {
-        background-color: #4038c7;
-    }
-    
-    .podcast-script-container {
-        border: 1px solid var(--border-color);
-        border-radius: var(--radius);
-        overflow: hidden;
-        margin-bottom: 24px;
-    }
-    
-    .podcast-lines {
-        max-height: 500px;
-        overflow-y: auto;
-    }
-    
-    .podcast-line {
-        display: flex;
-        border-bottom: 1px solid var(--border-color);
-    }
-    
-    .speaker-label {
-        width: 120px;
-        padding: 12px;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        font-weight: 500;
-        border-right: 1px solid var(--border-color);
-        background-color: var(--light-gray);
-        white-space: nowrap;
-    }
-    
-    .speaker-1 {
-        color: #3b82f6;
-    }
-    
-    .speaker-2 {
-        color: #ef4444;
-    }
-    
-    .line-input {
-        flex: 1;
-        padding: 12px;
-        border: none;
-        outline: none;
-        font-size: 1em;
-    }
-    
-    .line-input:focus {
-        background-color: rgba(80, 70, 229, 0.03);
-    }
-    
-    .remove-line-btn {
-        width: 40px;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        background: none;
-        border: none;
-        border-left: 1px solid var(--border-color);
-        cursor: pointer;
-        color: #888;
-        transition: color 0.2s, background-color 0.2s;
-    }
-    
-    .remove-line-btn:hover {
-        color: #ef4444;
-        background-color: rgba(239, 68, 68, 0.1);
-    }
-    
-    .add-line-btn {
-        width: 100%;
-        padding: 12px;
-        border: none;
-        background-color: var(--light-gray);
-        cursor: pointer;
-        font-weight: 500;
-        transition: background-color 0.2s;
-        margin-bottom: 0;
-        border-bottom: 1px solid var(--border-color);
-    }
-    
-    .add-line-btn:hover {
-        background-color: rgba(80, 70, 229, 0.1);
-    }
-    
-    .podcast-keyboard-hint {
-        padding: 10px;
-        text-align: center;
-        background-color: var(--light-gray);
-        border-top: 1px solid var(--border-color);
-        margin-top: 0;
-        font-size: 13px;
-    }
-    
-    .podcast-player {
-        border: 1px solid var(--border-color);
-        border-radius: var(--radius);
-        padding: 20px;
-        margin-bottom: 24px;
-    }
-    
-    .podcast-wave-player {
-        margin: 20px 0;
-    }
-    
-    .podcast-transcript-container {
-        margin-top: 20px;
-        padding-top: 20px;
-        border-top: 1px solid var(--border-color);
-    }
-    
-    .podcast-transcript {
-        margin-top: 12px;
-        line-height: 1.6;
-    }
-    
-    .transcript-line {
-        margin-bottom: 12px;
-    }
-    
-    .transcript-speaker {
-        font-weight: 600;
-        margin-right: 8px;
-    }
-    
-    .transcript-speaker.speaker-1 {
-        color: #3b82f6;
-    }
-    
-    .transcript-speaker.speaker-2 {
-        color: #ef4444;
-    }
-    
-    /* Responsive styles for podcast UI */
-    @media (max-width: 768px) {
-        .podcast-controls {
-            flex-direction: column;
-        }
-        
-        .random-script-btn,
-        .podcast-synth-btn {
-            width: 100%;
-            height: 48px;
-        }
-        
-        /* Stack podcast players vertically on mobile */
-        .podcast-player-container .players-row {
-            flex-direction: column;
-            gap: 16px;
-        }
-        
-        .podcast-line {
-            flex-direction: column;
-            padding-bottom: 0;
-            margin-bottom: 0;
-        }
-        
-        .speaker-label {
-            width: 100%;
-            border-right: none;
-            border-bottom: 1px solid var(--border-color);
-            padding: 8px 10px;
-            justify-content: flex-start;
-        }
-        
-        .line-input {
-            width: 100%;
-            padding: 8px 10px;
-        }
-        
-        .remove-line-btn {
-            position: absolute;
-            top: 6px;
-            right: 10px;
-            border-left: none;
-            background-color: rgba(255, 255, 255, 0.5);
-            border-radius: 4px;
-            width: 30px;
-            height: 30px;
-        }
-        
-        .podcast-line {
-            position: relative;
-        }
-        
-        /* Dark mode adjustments for mobile */
-        @media (prefers-color-scheme: dark) {
-            .remove-line-btn {
-                background-color: rgba(50, 50, 60, 0.7);
-            }
-        }
-    }
-    
-    /* Dark mode styles for podcast UI */
-    @media (prefers-color-scheme: dark) {
-        .random-script-btn {
-            background-color: var(--light-gray);
-            color: var(--text-color);
-            border-color: var(--border-color);
-        }
-
-        .add-line-btn {
-            background-color: var(--light-gray);
-            color: var(--text-color);
-            border-color: var(--border-color);
-        }
-        
-        .line-input {
-            background-color: var(--light-gray);
-            color: var(--text-color);
-        }
-        
-        .line-input:focus {
-            background-color: rgba(108, 99, 255, 0.1);
-        }
-    }
-
-    .podcast-loading-container {
-        display: flex;
-        justify-content: center;
-        align-items: center;
-        position: fixed;
-        top: 0;
-        left: 0;
-        width: 100%;
-        height: 100vh;
-        background-color: rgba(255, 255, 255, 0.9);
-        z-index: 1000;
-    }
-    
-    @media (prefers-color-scheme: dark) {
-        .podcast-loading-container {
-            background-color: rgba(18, 18, 24, 0.9);
-        }
-    }
-
-    .podcast-vote-results {
-        background-color: #f0f4ff;
-        border: 1px solid #d0d7f7;
-        border-radius: var(--radius);
-        padding: 16px;
-        margin: 24px 0;
-    }
-    
-    .podcast-next-round-container {
-        margin-top: 24px;
-        text-align: center;
-    }
-    
-    .podcast-next-round-btn {
-        padding: 12px 24px;
-        background-color: var(--primary-color);
-        color: white;
-        border: none;
-        border-radius: var(--radius);
-        font-weight: 500;
-        cursor: pointer;
-        position: relative;
-        width: 100%;
-        font-size: 1rem;
-        transition: background-color 0.2s;
-    }
-    
-    .podcast-next-round-btn:hover {
-        background-color: #4038c7;
-    }
-    
-    /* Dark mode adjustments */
-    @media (prefers-color-scheme: dark) {
-        .podcast-vote-results {
+            background-color: rgba(255, 255, 255, 0.1);
+        }
+        
+        .vote-recorded {
             background-color: var(--light-gray);
             border-color: var(--border-color);
         }
+        
+        /* Ensure border-radius is maintained during loading state */
+        .vote-btn.loading {
+            border-radius: var(--radius);
+        }
+
+        /* Dark mode keyboard hint */
+        .keyboard-hint {
+            color: #aaa;
+        }
+
+        .keyboard-hint kbd {
+            color: #ddd;
+            background-color: #333;
+            border-color: #555;
+            box-shadow: 0 1px 0 rgba(255,255,255,0.1);
+        }
     }
 
     /* Login prompt overlay styles */
@@ -1134,8 +653,6 @@
         const nextRoundBtn = document.querySelector('.next-round-btn');
         const nextRoundContainer = document.querySelector('.next-round-container');
         const randomBtn = document.querySelector('.random-btn');
-        const tabs = document.querySelectorAll('.tab');
-        const tabContents = document.querySelectorAll('.tab-content');
         const voteResultsContainer = document.querySelector('.vote-results');
         const chosenModelNameElement = document.querySelector('.chosen-model-name');
         const rejectedModelNameElement = document.querySelector('.rejected-model-name');
@@ -1182,55 +699,6 @@
                 });
         }
         
-        // Check URL hash for direct tab access
-        function checkHashAndSetTab() {
-            const hash = window.location.hash.toLowerCase();
-            if (hash === '#conversational') {
-                // Switch to conversational tab
-                tabs.forEach(t => t.classList.remove('active'));
-                tabContents.forEach(c => c.classList.remove('active'));
-                
-                document.querySelector('.tab[data-tab="conversational"]').classList.add('active');
-                document.getElementById('conversational-tab').classList.add('active');
-            } else if (hash === '#tts') {
-                // Switch to TTS tab (explicit)
-                tabs.forEach(t => t.classList.remove('active'));
-                tabContents.forEach(c => c.classList.remove('active'));
-                
-                document.querySelector('.tab[data-tab="tts"]').classList.add('active');
-                document.getElementById('tts-tab').classList.add('active');
-            }
-        }
-        
-        // Check hash on page load
-        checkHashAndSetTab();
-        
-        // Listen for hash changes
-        window.addEventListener('hashchange', checkHashAndSetTab);
-        
-        // Tab switching functionality
-        tabs.forEach(tab => {
-            tab.addEventListener('click', function() {
-                const tabId = this.dataset.tab;
-                
-                // Update URL hash without page reload
-                history.replaceState(null, null, `#${tabId}`);
-                
-                // Remove active class from all tabs and contents
-                tabs.forEach(t => t.classList.remove('active'));
-                tabContents.forEach(c => c.classList.remove('active'));
-                
-                // Add active class to clicked tab and corresponding content
-                this.classList.add('active');
-                document.getElementById(`${tabId}-tab`).classList.add('active');
-                
-                // Reset TTS tab state if switching away from it
-                if (tabId !== 'tts') {
-                    resetToInitialState();
-                }
-            });
-        });
-        
         function handleSynthesize(e) {
             if (e) {
                 e.preventDefault();
@@ -1244,12 +712,12 @@
 
             const text = textInput.value.trim();
             if (!text) {
-                openToast("Please enter some text to synthesize", "warning");
+                openToast("텍스트를 입력해주세요", "warning");
                 return;
             }
             
             if (text.length > 1000) {
-                openToast("Text is too long. Please keep it under 1000 characters.", "warning");
+                openToast("텍스트가 너무 깁니다. 1000자 이하로 입력해주세요.", "warning");
                 return;
             }
 
@@ -1289,7 +757,7 @@
             .then(response => {
                 if (!response.ok) {
                     return response.json().then(err => {
-                        throw new Error(err.error || 'Failed to generate TTS');
+                        throw new Error(err.error || 'TTS 생성에 실패했습니다');
                     });
                 }
                 return response.json();
@@ -1336,7 +804,7 @@
                 
                 // Handle authentication errors specially
                 if (error.message.includes('logged in to generate') || error.message.includes('logged in to vote')) {
-                    openToast("Please log in to use TTS Arena. <a href='{{ url_for('auth.login', next=request.path) }}' style='color: white; text-decoration: underline;'>Login now</a>", "error");
+                    openToast("로그인이 필요합니다. <a href='{{ url_for('auth.login', next=request.path) }}' style='color: white; text-decoration: underline;'>지금 로그인</a>", "error");
                 } else {
                     openToast(error.message, "error");
                 }
@@ -1367,7 +835,7 @@
             .then(response => {
                 if (!response.ok) {
                     return response.json().then(err => {
-                        throw new Error(err.error || 'Failed to submit vote');
+                        throw new Error(err.error || '투표 제출에 실패했습니다');
                     });
                 }
                 return response.json();
@@ -1403,7 +871,7 @@
                 nextRoundContainer.style.display = 'block';
                 
                 // Show success toast
-                openToast("Vote recorded successfully!", "success");
+                openToast("투표가 기록되었습니다!", "success");
             })
             .catch(error => {
                 // Re-enable vote buttons
@@ -1414,7 +882,7 @@
                 
                 // Handle authentication errors specially
                 if (error.message.includes('logged in to vote')) {
-                    openToast("Please log in to vote. <a href='{{ url_for('auth.login', next=request.path) }}' style='color: white; text-decoration: underline;'>Login now</a>", "error");
+                    openToast("로그인이 필요합니다. <a href='{{ url_for('auth.login', next=request.path) }}' style='color: white; text-decoration: underline;'>지금 로그인</a>", "error");
                 } else {
                     openToast(error.message, "error");
                 }
@@ -1470,10 +938,13 @@
                 // Select a random text from the unconsumed sentences
                 selectedText = cachedSentences[Math.floor(Math.random() * cachedSentences.length)];
                 console.log("Using random sentence from unconsumed sentences.");
+            } else if (fallbackRandomTexts && fallbackRandomTexts.length > 0) {
+                // Fallback to harvard sentences
+                selectedText = fallbackRandomTexts[Math.floor(Math.random() * fallbackRandomTexts.length)];
+                console.log("Using fallback random text.");
             } else {
-                // No fallback to consumed sentences for security reasons
-                console.error("No unconsumed sentences available. All sentences may have been used.");
-                openToast("No unused sentences available. All sentences from the dataset may have been consumed.", "error");
+                console.error("No sentences available.");
+                openToast("사용 가능한 문장이 없습니다.", "error");
                 return;
             }
             textInput.value = selectedText;
@@ -1481,7 +952,7 @@
         }
         
         function showListenToastMessage() {
-            openToast("Please listen to both audio samples before voting", "info");
+            openToast("투표하기 전에 두 오디오 샘플을 모두 들어주세요", "info");
         }
         
         // New function for N shortcut: Random + Synthesize
@@ -1589,562 +1060,4 @@
         fetchCachedSentences();
     });
 </script>
-
-<script>
-    document.addEventListener('DOMContentLoaded', function() {
-        // Variables for podcast UI
-        const podcastContainer = document.querySelector('.podcast-container');
-        const podcastLinesContainer = document.querySelector('.podcast-lines');
-        const addLineBtn = document.querySelector('.add-line-btn');
-        const randomScriptBtn = document.querySelector('.random-script-btn');
-        const podcastSynthBtn = document.querySelector('.podcast-synth-btn');
-        const podcastLoadingContainer = document.querySelector('.podcast-loading-container');
-        const podcastPlayerContainer = document.querySelector('.podcast-player-container');
-        const podcastWavePlayerA = document.querySelector('.podcast-wave-player-a');
-        const podcastWavePlayerB = document.querySelector('.podcast-wave-player-b');
-        const podcastVoteButtons = podcastPlayerContainer.querySelectorAll('.vote-btn');
-        const podcastVoteResults = podcastPlayerContainer.querySelector('.vote-results');
-        const podcastNextRoundContainer = podcastPlayerContainer.querySelector('.next-round-container');
-        const podcastNextRoundBtn = podcastPlayerContainer.querySelector('.next-round-btn');
-        const chosenModelNameElement = podcastVoteResults.querySelector('.chosen-model-name');
-        const rejectedModelNameElement = podcastVoteResults.querySelector('.rejected-model-name');
-        
-        let podcastWavePlayers = { a: null, b: null };
-        let bothPodcastSamplesPlayed = false;
-        let currentPodcastSessionId = null;
-        let podcastModelNames = { a: 'Model A', b: 'Model B' };
-        
-        // Sample random scripts for the podcast
-        const randomScripts = [
-            [
-                { speaker: 1, text: "Welcome to our podcast about artificial intelligence. Today we're discussing the latest advances in text-to-speech technology." },
-                { speaker: 2, text: "That's right! Text-to-speech has come a long way in recent years. The voices sound increasingly natural." },
-                { speaker: 1, text: "What do you think are the most impressive recent developments?" },
-                { speaker: 2, text: "I'd say the emotion and inflection that modern TTS systems can convey is truly remarkable." }
-            ],
-            [
-                { speaker: 1, text: "So today we're talking about climate change and its effects on our planet." },
-                { speaker: 2, text: "It's such an important topic. We're seeing more extreme weather events every year." },
-                { speaker: 1, text: "Absolutely. And the science is clear that human activity is the primary driver." },
-                { speaker: 2, text: "What can individuals do to help address this global challenge?" }
-            ],
-            [
-                { speaker: 1, text: "In today's episode, we're exploring the world of modern cinema." },
-                { speaker: 2, text: "Film has evolved so much since its early days. What's your favorite era of movies?" },
-                { speaker: 1, text: "I'm particularly fond of the 1970s New Hollywood movement. Films like The Godfather and Taxi Driver really pushed boundaries." },
-                { speaker: 2, text: "Interesting choice! I'm more drawn to contemporary international cinema, especially from directors like Bong Joon-ho and Park Chan-wook." }
-            ],
-            [
-                { speaker: 1, text: "Today we're discussing the future of remote work. How do you think it's changed the workplace?" },
-                { speaker: 2, text: "I believe it's revolutionized how we think about productivity and work-life balance." },
-                { speaker: 1, text: "Do you think companies will continue to offer remote options post-pandemic?" },
-                { speaker: 2, text: "Absolutely. Companies that don't embrace flexibility will struggle to attract top talent." }
-            ],
-            [
-                { speaker: 1, text: "Let's talk about the latest developments in renewable energy." },
-                { speaker: 2, text: "Solar and wind have become increasingly cost-effective in recent years." },
-                { speaker: 1, text: "What about emerging technologies like green hydrogen?" },
-                { speaker: 2, text: "That's a fascinating area with huge potential, especially for industries that are difficult to electrify." }
-            ],
-            [
-                { speaker: 1, text: "The world of cryptocurrency has seen massive changes lately. What's your take?" },
-                { speaker: 2, text: "It's certainly volatile, but I think blockchain technology has applications beyond just digital currency." },
-                { speaker: 1, text: "Do you see it becoming mainstream in the financial sector?" },
-                { speaker: 2, text: "Parts of it already are. Central banks are exploring digital currencies, and major companies are investing in blockchain." }
-            ],
-            [
-                { speaker: 1, text: "Mental health awareness has grown significantly in recent years." },
-                { speaker: 2, text: "Yes, and it's about time. The stigma around seeking help is finally starting to diminish." },
-                { speaker: 1, text: "What do you think has driven this change?" },
-                { speaker: 2, text: "I think social media has played a role, with more people openly sharing their experiences." }
-            ],
-            [
-                { speaker: 1, text: "Space exploration is entering an exciting new era with private companies leading the charge." },
-                { speaker: 2, text: "The commercialization of space has definitely accelerated innovation in the field." },
-                { speaker: 1, text: "Do you think we'll see humans on Mars in our lifetime?" },
-                { speaker: 2, text: "I'm optimistic. The technology is advancing rapidly, and there's strong motivation from both public and private sectors." }
-            ],
-            [
-                { speaker: 1, text: "Today's topic is sustainable fashion. How can consumers make more ethical choices?" },
-                { speaker: 2, text: "It starts with buying less and choosing quality items that last longer." },
-                { speaker: 1, text: "What about the responsibility of fashion brands themselves?" },
-                { speaker: 2, text: "They need to be transparent about their supply chains and commit to reducing their environmental impact." }
-            ],
-            [
-                { speaker: 1, text: "Let's discuss the evolution of social media and its impact on society." },
-                { speaker: 2, text: "It's transformed how we connect, but also created new challenges like misinformation and privacy concerns." },
-                { speaker: 1, text: "Do you think regulation is the answer?" },
-                { speaker: 2, text: "Partly, but digital literacy education is equally important so people can navigate these platforms responsibly." }
-            ],
-            [
-                { speaker: 1, text: "The field of genomics has seen remarkable progress. What excites you most about it?" },
-                { speaker: 2, text: "Personalized medicine is fascinating - the idea that treatments can be tailored to an individual's genetic makeup." },
-                { speaker: 1, text: "What about the ethical considerations?" },
-                { speaker: 2, text: "Those are crucial. We need robust frameworks to ensure these technologies are used responsibly." }
-            ],
-            [
-                { speaker: 1, text: "Urban planning is facing new challenges in the 21st century. What trends are you seeing?" },
-                { speaker: 2, text: "There's a growing focus on creating walkable, mixed-use neighborhoods that reduce car dependency." },
-                { speaker: 1, text: "How are cities adapting to climate change?" },
-                { speaker: 2, text: "Many are implementing green infrastructure like parks and permeable surfaces to manage flooding and reduce heat islands." }
-            ],
-            [
-                { speaker: 1, text: "The gaming industry has grown enormously in recent years. What's driving this expansion?" },
-                { speaker: 2, text: "Gaming has become much more accessible across different platforms, and the pandemic certainly accelerated adoption." },
-                { speaker: 1, text: "What do you think about the rise of esports?" },
-                { speaker: 2, text: "It's fascinating to see competitive gaming achieve mainstream recognition and create new career opportunities." }
-            ],
-            [
-                { speaker: 1, text: "Let's talk about the future of transportation. How will we get around in 20 years?" },
-                { speaker: 2, text: "Electric vehicles will be dominant, and autonomous driving technology will be much more widespread." },
-                { speaker: 1, text: "What about public transit and alternative modes?" },
-                { speaker: 2, text: "I think we'll see more integrated systems where bikes, scooters, and public transit work seamlessly together." }
-            ]
-        ];
-        
-        // Initialize with 2 empty lines
-        function initializePodcastLines() {
-            podcastLinesContainer.innerHTML = '';
-            addPodcastLine(1);
-            addPodcastLine(2);
-        }
-        
-        // Add a new podcast line
-        function addPodcastLine(speakerNum = null) {
-            const lineCount = podcastLinesContainer.querySelectorAll('.podcast-line').length;
-            
-            // If speaker number isn't specified, alternate between 1 and 2
-            if (speakerNum === null) {
-                speakerNum = (lineCount % 2) + 1;
-            }
-            
-            const lineElement = document.createElement('div');
-            lineElement.className = 'podcast-line';
-            
-            lineElement.innerHTML = `
-                <div class="speaker-label speaker-${speakerNum}">Speaker ${speakerNum}</div>
-                <input type="text" class="line-input" placeholder="Enter dialog...">
-                <button type="button" class="remove-line-btn" tabindex="-1">
-                    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" 
-                        stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
-                        <line x1="18" y1="6" x2="6" y2="18"></line>
-                        <line x1="6" y1="6" x2="18" y2="18"></line>
-                    </svg>
-                </button>
-            `;
-            
-            podcastLinesContainer.appendChild(lineElement);
-            
-            // Add event listener to remove button
-            const removeBtn = lineElement.querySelector('.remove-line-btn');
-            removeBtn.addEventListener('click', function() {
-                // Don't allow removing if there are only 2 lines
-                if (podcastLinesContainer.querySelectorAll('.podcast-line').length > 2) {
-                    lineElement.remove();
-                } else {
-                    openToast("At least 2 lines are required", "warning");
-                }
-            });
-            
-            // Add event listener for keyboard navigation in the input field
-            const inputField = lineElement.querySelector('.line-input');
-            inputField.addEventListener('keydown', function(e) {
-                // Alt+Enter or Ctrl+Enter to add new line
-                if (e.key === 'Enter' && (e.altKey || e.ctrlKey)) {
-                    e.preventDefault();
-                    addPodcastLine();
-                    
-                    // Focus the new line's input field
-                    setTimeout(() => {
-                        const inputs = podcastLinesContainer.querySelectorAll('.line-input');
-                        inputs[inputs.length - 1].focus();
-                    }, 10);
-                }
-            });
-            
-            return lineElement;
-        }
-        
-        // Load a random script
-        function loadRandomScript() {
-            // Clear existing lines
-            podcastLinesContainer.innerHTML = '';
-            
-            // Select a random script
-            const randomScript = randomScripts[Math.floor(Math.random() * randomScripts.length)];
-            
-            // Add each line from the script
-            randomScript.forEach(line => {
-                const lineElement = addPodcastLine(line.speaker);
-                lineElement.querySelector('.line-input').value = line.text;
-            });
-        }
-        
-        // Generate podcast (mock functionality)
-        function generatePodcast() {
-            // Get all lines
-            const lines = [];
-            podcastLinesContainer.querySelectorAll('.podcast-line').forEach(line => {
-                const speaker_id = line.querySelector('.speaker-label').textContent.includes('1') ? 0 : 1;
-                const text = line.querySelector('.line-input').value.trim();
-                
-                if (text) {
-                    lines.push({ speaker_id, text });
-                }
-            });
-            
-            // Validate that we have at least 2 lines with content
-            if (lines.length < 2) {
-                openToast("Please enter at least 2 lines of dialog", "warning");
-                return;
-            }
-            
-            // Reset vote buttons and hide results
-            podcastVoteButtons.forEach(btn => {
-                btn.disabled = true;
-                btn.classList.remove('selected');
-                btn.querySelector('.vote-loader').style.display = 'none';
-            });
-            
-            // Clear model name displays
-            const modelNameDisplays = podcastPlayerContainer.querySelectorAll('.model-name-display');
-            modelNameDisplays.forEach(display => {
-                display.textContent = '';
-            });
-
-            podcastVoteResults.style.display = 'none';
-            podcastNextRoundContainer.style.display = 'none';
-            
-            // Reset the flag for both samples played
-            bothPodcastSamplesPlayed = false;
-            
-            // Show loading animation
-            podcastLoadingContainer.style.display = 'flex';
-            podcastPlayerContainer.style.display = 'none';
-            
-            // Call API to generate podcast
-            fetch('/api/conversational/generate', {
-                method: 'POST',
-                headers: {
-                    'Content-Type': 'application/json',
-                },
-                body: JSON.stringify({ script: lines }),
-            })
-            .then(response => {
-                if (!response.ok) {
-                    return response.json().then(err => {
-                        throw new Error(err.error || 'Failed to generate podcast');
-                    });
-                }
-                return response.json();
-            })
-            .then(data => {
-                currentPodcastSessionId = data.session_id;
-                
-                // Hide loading
-                podcastLoadingContainer.style.display = 'none';
-                
-                // Show player
-                podcastPlayerContainer.style.display = 'block';
-                
-                // Initialize WavePlayers if not already done
-                if (!podcastWavePlayers.a) {
-                    podcastWavePlayers.a = new WavePlayer(podcastWavePlayerA, {
-                        // Add mobile-friendly options but hide native controls
-                        backend: 'MediaElement',
-                        mediaControls: false // Hide native audio controls
-                    });
-                    podcastWavePlayers.b = new WavePlayer(podcastWavePlayerB, {
-                        // Add mobile-friendly options but hide native controls
-                        backend: 'MediaElement',
-                        mediaControls: false // Hide native audio controls
-                    });
-                    
-                    // Load audio in waveplayers
-                    podcastWavePlayers.a.loadAudio(data.audio_a);
-                    podcastWavePlayers.b.loadAudio(data.audio_b);
-                    
-                    // Force hide loading indicators after 5 seconds as a fallback
-                    setTimeout(() => {
-                        if (podcastWavePlayers.a && podcastWavePlayers.a.hideLoading) {
-                            podcastWavePlayers.a.hideLoading();
-                        }
-                        if (podcastWavePlayers.b && podcastWavePlayers.b.hideLoading) {
-                            podcastWavePlayers.b.hideLoading();
-                        }
-                        console.log('Forced hiding of podcast loading indicators (safety timeout - existing players)');
-                    }, 5000);
-                } else {
-                    // Reset and reload for existing players
-                    try {
-                        podcastWavePlayers.a.wavesurfer.empty();
-                        podcastWavePlayers.b.wavesurfer.empty();
-                        
-                        // Make sure loading indicators are reset
-                        podcastWavePlayers.a.hideLoading();
-                        podcastWavePlayers.b.hideLoading();
-                        
-                        podcastWavePlayers.a.loadAudio(data.audio_a);
-                        podcastWavePlayers.b.loadAudio(data.audio_b);
-                        
-                        // Force hide loading indicators after 5 seconds as a fallback
-                        setTimeout(() => {
-                            if (podcastWavePlayers.a && podcastWavePlayers.a.hideLoading) {
-                                podcastWavePlayers.a.hideLoading();
-                            }
-                            if (podcastWavePlayers.b && podcastWavePlayers.b.hideLoading) {
-                                podcastWavePlayers.b.hideLoading();
-                            }
-                            console.log('Forced hiding of podcast loading indicators (safety timeout - existing players)');
-                        }, 5000);
-                    } catch (err) {
-                        console.error('Error resetting podcast waveplayers:', err);
-                        
-                        // Recreate the players if there was an error
-                        podcastWavePlayers.a = new WavePlayer(podcastWavePlayerA, {
-                            backend: 'MediaElement',
-                            mediaControls: false
-                        });
-                        podcastWavePlayers.b = new WavePlayer(podcastWavePlayerB, {
-                            backend: 'MediaElement',
-                            mediaControls: false
-                        });
-                        
-                        podcastWavePlayers.a.loadAudio(data.audio_a);
-                        podcastWavePlayers.b.loadAudio(data.audio_b);
-
-                        // Force hide loading indicators after 5 seconds as a fallback
-                        setTimeout(() => {
-                            if (podcastWavePlayers.a && podcastWavePlayers.a.hideLoading) {
-                                podcastWavePlayers.a.hideLoading();
-                            }
-                            if (podcastWavePlayers.b && podcastWavePlayers.b.hideLoading) {
-                                podcastWavePlayers.b.hideLoading();
-                            }
-                            console.log('Forced hiding of podcast loading indicators (fallback case)');
-                        }, 5000);
-                    }
-                }
-                
-                // Setup automatic sequential playback
-                podcastWavePlayers.a.wavesurfer.once('ready', function() {
-                    podcastWavePlayers.a.play();
-                    
-                    // When audio A ends, play audio B
-                    podcastWavePlayers.a.wavesurfer.once('finish', function() {
-                        // Wait a short moment before playing B
-                        setTimeout(() => {
-                            podcastWavePlayers.b.play();
-                            
-                            // When audio B ends, enable voting
-                            podcastWavePlayers.b.wavesurfer.once('finish', function() {
-                                bothPodcastSamplesPlayed = true;
-                                podcastVoteButtons.forEach(btn => {
-                                    btn.disabled = false;
-                                });
-                            });
-                        }, 500);
-                    });
-                });
-            })
-            .catch(error => {
-                podcastLoadingContainer.style.display = 'none';
-                
-                // Handle authentication errors specially
-                if (error.message.includes('logged in to generate') || error.message.includes('logged in to vote')) {
-                    openToast("Please log in to use TTS Arena. <a href='{{ url_for('auth.login', next=request.path) }}' style='color: white; text-decoration: underline;'>Login now</a>", "error");
-                } else {
-                    openToast(error.message, "error");
-                }
-                console.error('Error:', error);
-            });
-        }
-        
-        // Handle vote for a podcast model
-        function handlePodcastVote(model) {
-            // Disable both vote buttons
-            podcastVoteButtons.forEach(btn => {
-                btn.disabled = true;
-                if (btn.dataset.model === model) {
-                    btn.querySelector('.vote-loader').style.display = 'flex';
-                }
-            });
-            
-            // Send vote to server
-            fetch('/api/conversational/vote', {
-                method: 'POST',
-                headers: {
-                    'Content-Type': 'application/json',
-                },
-                body: JSON.stringify({
-                    session_id: currentPodcastSessionId,
-                    chosen_model: model
-                }),
-            })
-            .then(response => {
-                if (!response.ok) {
-                    return response.json().then(err => {
-                        throw new Error(err.error || 'Failed to submit vote');
-                    });
-                }
-                return response.json();
-            })
-            .then(data => {
-                // Hide loaders
-                podcastVoteButtons.forEach(btn => {
-                    btn.querySelector('.vote-loader').style.display = 'none';
-                    
-                    // Highlight the selected button
-                    if (btn.dataset.model === model) {
-                        btn.classList.add('selected');
-                    }
-                });
-                
-                // Store model names from vote response
-                podcastModelNames.a = data.names.a;
-                podcastModelNames.b = data.names.b;
-                
-                // Show model names after voting
-                const modelNameDisplays = podcastPlayerContainer.querySelectorAll('.model-name-display');
-                modelNameDisplays[0].textContent = data.names.a ? `(${data.names.a})` : '';
-                modelNameDisplays[1].textContent = data.names.b ? `(${data.names.b})` : '';
-                
-                // Show vote results
-                chosenModelNameElement.textContent = data.chosen_model.name;
-                rejectedModelNameElement.textContent = data.rejected_model.name;
-                podcastVoteResults.style.display = 'block';
-                
-                // Show next round button
-                podcastNextRoundContainer.style.display = 'block';
-                
-                // Show success toast
-                openToast("Vote recorded successfully!", "success");
-            })
-            .catch(error => {
-                // Re-enable vote buttons
-                podcastVoteButtons.forEach(btn => {
-                    btn.disabled = false;
-                    btn.querySelector('.vote-loader').style.display = 'none';
-                });
-                
-                // Handle authentication errors specially
-                if (error.message.includes('logged in to vote')) {
-                    openToast("Please log in to vote. <a href='{{ url_for('auth.login', next=request.path) }}' style='color: white; text-decoration: underline;'>Login now</a>", "error");
-                } else {
-                    openToast(error.message, "error");
-                }
-                console.error('Error:', error);
-            });
-        }
-        
-        // Reset podcast UI to initial state
-        function resetPodcastState() {
-            // Hide players, results, and next round button
-            podcastPlayerContainer.style.display = 'none';
-            podcastVoteResults.style.display = 'none';
-            podcastNextRoundContainer.style.display = 'none';
-            
-            // Reset vote buttons
-            podcastVoteButtons.forEach(btn => {
-                btn.disabled = true;
-                btn.classList.remove('selected');
-                btn.querySelector('.vote-loader').style.display = 'none';
-            });
-            
-            // Clear model name displays
-            const modelNameDisplays = podcastPlayerContainer.querySelectorAll('.model-name-display');
-            modelNameDisplays.forEach(display => {
-                display.textContent = '';
-            });
-            
-            // Stop any playing audio
-            if (podcastWavePlayers.a) podcastWavePlayers.a.stop();
-            if (podcastWavePlayers.b) podcastWavePlayers.b.stop();
-            
-            // Reset session
-            currentPodcastSessionId = null;
-            
-            // Reset the flag for both samples played
-            bothPodcastSamplesPlayed = false;
-        }
-        
-        // Add keyboard shortcut listeners for podcast voting
-        document.addEventListener('keydown', function(e) {
-            // Check if we're in the podcast tab and it's active
-            const podcastTab = document.getElementById('conversational-tab');
-            if (!podcastTab.classList.contains('active')) return;
-            
-            // Only process if input fields are not focused
-            if (document.activeElement.tagName === 'INPUT' || 
-                document.activeElement.tagName === 'TEXTAREA') {
-                return;
-            }
-            
-            if (e.key.toLowerCase() === 'a') {
-                if (bothPodcastSamplesPlayed && !podcastVoteButtons[0].disabled) {
-                    handlePodcastVote('a');
-                } else if (podcastPlayerContainer.style.display !== 'none' && !bothPodcastSamplesPlayed) {
-                    openToast("Please listen to both audio samples before voting", "info");
-                }
-            } else if (e.key.toLowerCase() === 'b') {
-                if (bothPodcastSamplesPlayed && !podcastVoteButtons[1].disabled) {
-                    handlePodcastVote('b');
-                } else if (podcastPlayerContainer.style.display !== 'none' && !bothPodcastSamplesPlayed) {
-                    openToast("Please listen to both audio samples before voting", "info");
-                }
-            } else if (e.key.toLowerCase() === 'n') {
-                if (podcastNextRoundContainer.style.display === 'block') {
-                    if (!e.ctrlKey && !e.metaKey) {
-                        e.preventDefault();
-                    }
-                    resetPodcastState();
-                }
-            } else if (e.key === ' ') {
-                // Space to play/pause current audio
-                if (podcastPlayerContainer.style.display !== 'none') {
-                    e.preventDefault();
-                    // If A is playing, toggle A, else if B is playing, toggle B, else play A
-                    if (podcastWavePlayers.a && podcastWavePlayers.a.isPlaying) {
-                        podcastWavePlayers.a.togglePlayPause();
-                    } else if (podcastWavePlayers.b && podcastWavePlayers.b.isPlaying) {
-                        podcastWavePlayers.b.togglePlayPause();
-                    } else if (podcastWavePlayers.a) {
-                        podcastWavePlayers.a.play();
-                    }
-                }
-            }
-        });
-        
-        // Event listeners
-        addLineBtn.addEventListener('click', function() {
-            addPodcastLine();
-        });
-        
-        randomScriptBtn.addEventListener('click', function() {
-            loadRandomScript();
-        });
-        
-        podcastSynthBtn.addEventListener('click', function() {
-            generatePodcast();
-        });
-        
-        // Add event listeners to vote buttons
-        podcastVoteButtons.forEach(btn => {
-            btn.addEventListener('click', function() {
-                if (bothPodcastSamplesPlayed) {
-                    const model = this.dataset.model;
-                    handlePodcastVote(model);
-                } else {
-                    openToast("Please listen to both audio samples before voting", "info");
-                }
-            });
-        });
-        
-        // Add event listener for next round button
-        podcastNextRoundBtn.addEventListener('click', resetPodcastState);
-        
-        // Initialize with 2 empty lines
-        initializePodcastLines();
-    });
-</script>
-{% endblock %}
+{% endblock %}

templates/base.html

@@ -1,10 +1,10 @@
 <!DOCTYPE html>
-<html lang="en">
+<html lang="ko">
 
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>{% block title %}TTS Arena{% endblock %}</title>
+    <title>{% block title %}한국어 TTS Arena{% endblock %}</title>
     <link rel="preconnect" href="https://fonts.googleapis.com">
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
     <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
@@ -56,11 +56,43 @@
             flex-shrink: 0;
         }
 
+        .logo-container {
+            margin-bottom: 32px;
+        }
+
         .logo {
-            font-size: 24px;
+            font-size: 22px;
             font-weight: 700;
-            margin-bottom: 32px;
             color: var(--primary-color);
+            margin-bottom: 8px;
+        }
+
+        .supported-by {
+            display: flex;
+            align-items: center;
+            gap: 6px;
+            font-size: 11px;
+            color: #888;
+        }
+
+        .supported-by span {
+            opacity: 0.8;
+        }
+
+        .channel-link {
+            display: flex;
+            align-items: center;
+            text-decoration: none;
+        }
+
+        .channel-logo-img {
+            height: 20px;
+            width: auto;
+            transition: opacity 0.2s;
+        }
+
+        .channel-link:hover .channel-logo-img {
+            opacity: 0.8;
         }
 
         .nav-item {
@@ -1061,7 +1093,15 @@
                 <path d="M18 6L6 18M6 6L18 18" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" />
             </svg>
         </div>
-        <div class="logo">TTS Arena</div>
+        <div class="logo-container">
+            <div class="logo">한국어 TTS 아레나</div>
+            <div class="supported-by">
+                <span>supported by</span>
+                <a href="https://channel.io/ko" target="_blank" rel="noopener noreferrer" class="channel-link">
+                    <img src="{{ url_for('static', filename='channeltalk-logo-kr.svg') }}" alt="채널톡" class="channel-logo-img">
+                </a>
+            </div>
+        </div>
         <nav>
             <a href="{{ url_for('arena') }}" class="nav-item {% if request.path == '/' %}active{% endif %}">
                 <svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-dices"><rect width="12" height="12" x="2" y="10" rx="2" ry="2"/><path d="m17.92 14 3.5-3.5a2.24 2.24 0 0 0 0-3l-5-4.92a2.24 2.24 0 0 0-3 0L10 6"/><path d="M6 18h.01"/><path d="M10 14h.01"/><path d="M15 6h.01"/><path d="M18 9h.01"/></svg>

tts.py

@@ -1,298 +1,218 @@
-# TODO: V2 of TTS Router
-# Currently just use current TTS router.
+# 한국어 TTS Arena - TTS Router
 import os
 import json
-from dotenv import load_dotenv
-import fal_client
-import requests
-import time
-import io
-from pyht import Client as PyhtClient
-from pyht.client import TTSOptions
 import base64
 import tempfile
-import random
+import requests
+from dotenv import load_dotenv
 
 load_dotenv()
 
-ZEROGPU_TOKENS = os.getenv("ZEROGPU_TOKENS", "").split(",")
-
+# 한국어 지원 TTS 제공자 매핑
+# - 채널톡: 자체 API
+# - ElevenLabs: 직접 API
+# - OpenAI: API
+# - Google: API
 
-def get_zerogpu_token():
-    return random.choice(ZEROGPU_TOKENS)
+CHANNEL_TTS_URL = os.getenv(
+    "CHANNEL_TTS_URL",
+    "https://ch-tts-streaming-demo.channel.io/v1/text-to-speech"
+)
 
+ELEVENLABS_API_KEY = os.getenv("ELEVENLABS_API_KEY")
+ELEVENLABS_VOICE_ID = os.getenv("ELEVENLABS_VOICE_ID", "21m00Tcm4TlvDq8ikWAM")  # Rachel (기본)
 
 model_mapping = {
+    # 채널톡 TTS (한국어 특화)
+    "channel-hana": {
+        "provider": "channel",
+        "voice": "hana",
+    },
+    # ElevenLabs (다국어 지원) - 직접 API 호출
     "eleven-multilingual-v2": {
         "provider": "elevenlabs",
         "model": "eleven_multilingual_v2",
     },
-    "async-1": {
-        "provider": "async",
-        "model": "async-1",
-    },
-    "eleven-turbo-v2.5": {
-        "provider": "elevenlabs",
-        "model": "eleven_turbo_v2_5",
-    },
-    "eleven-flash-v2.5": {
-        "provider": "elevenlabs",
-        "model": "eleven_flash_v2_5",
-    },
-    "cartesia-sonic-2": {
-        "provider": "cartesia",
-        "model": "sonic-2",
-    },
-    "spark-tts": {
-        "provider": "spark",
-        "model": "spark-tts",
-    },
-    "playht-2.0": {
-        "provider": "playht",
-        "model": "PlayHT2.0",
-    },
-    "styletts2": {
-        "provider": "styletts",
-        "model": "styletts2",
-    },
-    "kokoro-v1": {
-        "provider": "kokoro",
-        "model": "kokoro_v1",
-    },
-    "cosyvoice-2.0": {
-        "provider": "cosyvoice",
-        "model": "cosyvoice_2_0",
-    },
-    "papla-p1": {
-        "provider": "papla",
-        "model": "papla_p1",
+    # OpenAI TTS
+    "openai-tts-1": {
+        "provider": "openai",
+        "model": "tts-1",
+        "voice": "alloy",
     },
-    "hume-octave": {
-        "provider": "hume",
-        "model": "octave",
+    "openai-tts-1-hd": {
+        "provider": "openai",
+        "model": "tts-1-hd",
+        "voice": "alloy",
     },
-    "megatts3": {
-        "provider": "megatts3",
-        "model": "megatts3",
+    # Google Cloud TTS
+    "google-wavenet": {
+        "provider": "google",
+        "voice": "ko-KR-Wavenet-A",
     },
-    "minimax-02-hd": {
-        "provider": "minimax",
-        "model": "speech-02-hd",
+    "google-neural2": {
+        "provider": "google",
+        "voice": "ko-KR-Neural2-A",
     },
-    "minimax-02-turbo": {
-        "provider": "minimax",
-        "model": "speech-02-turbo",
-    },
-    "lanternfish-1": {
-        "provider": "lanternfish",
-        "model": "lanternfish-1",
-    },
-    "nls-pre-v1": {
-        "provider": "nls",
-        "model": "nls-1",
-    },
-    "chatterbox": {
-        "provider": "chatterbox",
-        "model": "chatterbox",
-    },
-    "inworld": {
-        "provider": "inworld",
-        "model": "inworld-tts-1",
-    },
-    "inworld-max": {
-        "provider": "inworld",
-        "model": "inworld-tts-1-max",
-    },
-    "wordcab": {
-        "provider": "wordcab",
-        "model": "wordcab",
-    },
-    "veena": {
-        "provider": "veena",
-        "model": "veena",
-    },
-    "maya1": {
-        "provider": "maya1",
-        "model": "maya1",
-    },
-    "magpie": {
-        "provider": "magpie",
-        "model": "magpie",
-    },
-    "parmesan": {
-        "provider": "parmesan",
-        "model": "parmesan",
-    },
-    "vocu": {
-        "provider": "vocu",
-        "model": "vocu-balance",
-    },
-}
-url = "https://tts-agi-tts-router-v2.hf.space/tts"
-headers = {
-    "accept": "application/json",
-    "Content-Type": "application/json",
-    "Authorization": f'Bearer {os.getenv("HF_TOKEN")}',
 }
-data = {"text": "string", "provider": "string", "model": "string"}
-
-
-def predict_csm(script):
-    result = fal_client.subscribe(
-        "fal-ai/csm-1b",
-        arguments={
-            # "scene": [{
-            #     "text": "Hey how are you doing.",
-            #     "speaker_id": 0
-            # }, {
-            #     "text": "Pretty good, pretty good.",
-            #     "speaker_id": 1
-            # }, {
-            #     "text": "I'm great, so happy to be speaking to you.",
-            #     "speaker_id": 0
-            # }]
-            "scene": script
-        },
-        with_logs=True,
-    )
-    return requests.get(result["audio"]["url"]).content
 
 
-def predict_playdialog(script):
-    # Initialize the PyHT client
-    pyht_client = PyhtClient(
-        user_id=os.getenv("PLAY_USERID"),
-        api_key=os.getenv("PLAY_SECRETKEY"),
+def predict_channel_tts(text: str, voice: str = "hana") -> str:
+    """채널톡 TTS API 호출"""
+    url = f"{CHANNEL_TTS_URL}/{voice}"
+    
+    response = requests.post(
+        url,
+        headers={"Content-Type": "application/json"},
+        json={"text": text, "output_format": "wav_24000"},
+        timeout=30,
     )
-
-    # Define the voices
-    voice_1 = "s3://voice-cloning-zero-shot/baf1ef41-36b6-428c-9bdf-50ba54682bd8/original/manifest.json"
-    voice_2 = "s3://voice-cloning-zero-shot/e040bd1b-f190-4bdb-83f0-75ef85b18f84/original/manifest.json"
-
-    # Convert script format from CSM to PlayDialog format
-    if isinstance(script, list):
-        # Process script in CSM format (list of dictionaries)
-        text = ""
-        for turn in script:
-            speaker_id = turn.get("speaker_id", 0)
-            prefix = "Host 1:" if speaker_id == 0 else "Host 2:"
-            text += f"{prefix} {turn['text']}\n"
-    else:
-        # If it's already a string, use as is
-        text = script
-
-    # Set up TTSOptions
-    options = TTSOptions(
-        voice=voice_1, voice_2=voice_2, turn_prefix="Host 1:", turn_prefix_2="Host 2:"
+    response.raise_for_status()
+    
+    # 임시 파일에 저장
+    with tempfile.NamedTemporaryFile(delete=False, suffix=".wav") as f:
+        f.write(response.content)
+        return f.name
+
+
+def predict_elevenlabs_tts(text: str, model: str = "eleven_multilingual_v2") -> str:
+    """ElevenLabs TTS API 직접 호출"""
+    api_key = ELEVENLABS_API_KEY
+    if not api_key:
+        raise ValueError("ELEVENLABS_API_KEY 환경 변수가 설정되지 않았습니다.")
+    
+    voice_id = ELEVENLABS_VOICE_ID
+    
+    response = requests.post(
+        f"https://api.elevenlabs.io/v1/text-to-speech/{voice_id}",
+        headers={
+            "xi-api-key": api_key,
+            "Content-Type": "application/json",
+            "Accept": "audio/mpeg",
+        },
+        json={
+            "text": text,
+            "model_id": model,
+            "voice_settings": {
+                "stability": 0.5,
+                "similarity_boost": 0.75,
+            },
+        },
+        timeout=60,
     )
-
-    # Generate audio using PlayDialog
-    audio_chunks = []
-    for chunk in pyht_client.tts(text, options, voice_engine="PlayDialog"):
-        audio_chunks.append(chunk)
-
-    # Combine all chunks into a single audio file
-    return b"".join(audio_chunks)
-
-
-def predict_dia(script):
-    # Convert script to the required format for Dia
-    if isinstance(script, list):
-        # Convert from list of dictionaries to formatted string
-        formatted_text = ""
-        for turn in script:
-            speaker_id = turn.get("speaker_id", 0)
-            speaker_tag = "[S1]" if speaker_id == 0 else "[S2]"
-            text = turn.get("text", "").strip().replace("[S1]", "").replace("[S2]", "")
-            formatted_text += f"{speaker_tag} {text} "
-        text = formatted_text.strip()
-    else:
-        # If it's already a string, use as is
-        text = script
-    # Make a POST request to initiate the dialogue generation
-    headers = {
-        # "Content-Type": "application/json",
-        "Authorization": f"Bearer {get_zerogpu_token()}"
-    }
-
+    response.raise_for_status()
+    
+    with tempfile.NamedTemporaryFile(delete=False, suffix=".mp3") as f:
+        f.write(response.content)
+        return f.name
+
+
+def predict_openai_tts(text: str, model: str = "tts-1", voice: str = "alloy") -> str:
+    """OpenAI TTS API 호출"""
+    api_key = os.getenv("OPENAI_API_KEY")
+    if not api_key:
+        raise ValueError("OPENAI_API_KEY 환경 변수가 설정되지 않았습니다.")
+    
     response = requests.post(
-        "https://mrfakename-dia-1-6b.hf.space/gradio_api/call/generate_dialogue",
-        headers=headers,
-        json={"data": [text]},
+        "https://api.openai.com/v1/audio/speech",
+        headers={
+            "Authorization": f"Bearer {api_key}",
+            "Content-Type": "application/json",
+        },
+        json={
+            "model": model,
+            "input": text,
+            "voice": voice,
+            "response_format": "wav",
+        },
+        timeout=60,
     )
-
-    # Extract the event ID from the response
-    event_id = response.json()["event_id"]
-
-    # Make a streaming request to get the generated dialogue
-    stream_url = f"https://mrfakename-dia-1-6b.hf.space/gradio_api/call/generate_dialogue/{event_id}"
-
-    # Use a streaming request to get the audio data
-    with requests.get(stream_url, headers=headers, stream=True) as stream_response:
-        # Process the streaming response
-        for line in stream_response.iter_lines():
-            if line:
-                if line.startswith(b"data: ") and not line.startswith(b"data: null"):
-                    audio_data = line[6:]
-                    return requests.get(json.loads(audio_data)[0]["url"]).content
-
-
-def predict_tts(text, model):
-    global client
-    print(f"Predicting TTS for {model}")
-    # Exceptions: special models that shouldn't be passed to the router
-    if model == "csm-1b":
-        return predict_csm(text)
-    elif model == "playdialog-1.0":
-        return predict_playdialog(text)
-    elif model == "dia-1.6b":
-        return predict_dia(text)
-
-    if not model in model_mapping:
-        raise ValueError(f"Model {model} not found")
-
-    result = requests.post(
-        url,
-        headers=headers,
-        data=json.dumps(
-            {
-                "text": text,
-                "provider": model_mapping[model]["provider"],
-                "model": model_mapping[model]["model"],
-            }
-        ),
+    response.raise_for_status()
+    
+    with tempfile.NamedTemporaryFile(delete=False, suffix=".wav") as f:
+        f.write(response.content)
+        return f.name
+
+
+def predict_google_tts(text: str, voice: str = "ko-KR-Wavenet-A") -> str:
+    """Google Cloud TTS API 호출"""
+    api_key = os.getenv("GOOGLE_API_KEY")
+    if not api_key:
+        raise ValueError("GOOGLE_API_KEY 환경 변수가 설정되지 않았습니다.")
+    
+    response = requests.post(
+        f"https://texttospeech.googleapis.com/v1/text:synthesize?key={api_key}",
+        headers={"Content-Type": "application/json"},
+        json={
+            "input": {"text": text},
+            "voice": {
+                "languageCode": "ko-KR",
+                "name": voice,
+            },
+            "audioConfig": {
+                "audioEncoding": "LINEAR16",
+                "sampleRateHertz": 24000,
+            },
+        },
+        timeout=30,
     )
-    response_json = result.json()
-
-    audio_data = response_json["audio_data"]  # base64 encoded audio data
-    extension = response_json["extension"]
-    # Decode the base64 audio data
-    audio_bytes = base64.b64decode(audio_data)
-
-    # Create a temporary file to store the audio data
-    with tempfile.NamedTemporaryFile(delete=False, suffix=f".{extension}") as temp_file:
-        temp_file.write(audio_bytes)
-        temp_path = temp_file.name
-
-    return temp_path
+    response.raise_for_status()
+    
+    audio_content = response.json().get("audioContent")
+    if not audio_content:
+        raise ValueError("Google TTS API가 오디오를 반환하지 않았습니다.")
+    
+    audio_bytes = base64.b64decode(audio_content)
+    with tempfile.NamedTemporaryFile(delete=False, suffix=".wav") as f:
+        f.write(audio_bytes)
+        return f.name
+
+
+def predict_tts(text: str, model: str) -> str:
+    """
+    TTS 생성 메인 함수
+    
+    Args:
+        text: 합성할 텍스트
+        model: 모델 ID (model_mapping의 키)
+        
+    Returns:
+        생성된 오디오 파일 경로
+    """
+    print(f"[TTS] Predicting for model: {model}")
+    
+    if model not in model_mapping:
+        raise ValueError(f"지원하지 않는 모델입니다: {model}")
+    
+    config = model_mapping[model]
+    provider = config["provider"]
+    
+    if provider == "channel":
+        return predict_channel_tts(text, config.get("voice", "hana"))
+    
+    elif provider == "openai":
+        return predict_openai_tts(
+            text,
+            config.get("model", "tts-1"),
+            config.get("voice", "alloy"),
+        )
+    
+    elif provider == "google":
+        return predict_google_tts(text, config.get("voice", "ko-KR-Wavenet-A"))
+    
+    elif provider == "elevenlabs":
+        return predict_elevenlabs_tts(text, config.get("model", "eleven_multilingual_v2"))
+    
+    else:
+        raise ValueError(f"알 수 없는 provider: {provider}")
 
 
 if __name__ == "__main__":
-    print(
-        predict_dia(
-            [
-                {"text": "Hello, how are you?", "speaker_id": 0},
-                {"text": "I'm great, thank you!", "speaker_id": 1},
-            ]
-        )
-    )
-    # print("Predicting PlayDialog")
-    # print(
-    #     predict_playdialog(
-    #         [
-    #             {"text": "Hey how are you doing.", "speaker_id": 0},
-    #             {"text": "Pretty good, pretty good.", "speaker_id": 1},
-    #             {"text": "I'm great, so happy to be speaking to you.", "speaker_id": 0},
-    #         ]
-    #     )
-    # )
+    # 테스트
+    test_text = "안녕하세요, 채널톡 TTS 테스트입니다."
+    
+    print("Testing Channel TTS...")
+    try:
+        path = predict_channel_tts(test_text)
+        print(f"  Success: {path}")
+    except Exception as e:
+        print(f"  Error: {e}")