Update app.py

app.py

@@ -1,213 +1,160 @@
-# 협력적 LLM 시스템 - Python 구현
-
-## 1. FastAPI 백엔드 (backend.py)
-
-```python
-from fastapi import FastAPI, HTTPException
-from fastapi.middleware.cors import CORSMiddleware
-from pydantic import BaseModel
-from typing import List, Optional, Dict, Any
+import gradio as gr
 import os
-import httpx
-import asyncio
 import json
+import requests
 from datetime import datetime
+import asyncio
+import aiohttp
+from typing import List, Dict, Any
 import logging
 
 # 로깅 설정
 logging.basicConfig(level=logging.INFO)
 logger = logging.getLogger(__name__)
 
-app = FastAPI(title="Collaborative LLM System")
-
-# CORS 설정
-app.add_middleware(
-    CORSMiddleware,
-    allow_origins=["*"],
-    allow_credentials=True,
-    allow_methods=["*"],
-    allow_headers=["*"],
-)
-
 # 환경 변수에서 토큰 가져오기
-FRIENDLI_TOKEN = os.getenv("FRIENDLI_TOKEN")
-if not FRIENDLI_TOKEN:
-    raise ValueError("FRIENDLI_TOKEN 환경 변수가 설정되지 않았습니다.")
-
+FRIENDLI_TOKEN = os.getenv("FRIENDLI_TOKEN", "YOUR_FRIENDLI_TOKEN")
 API_URL = "https://api.friendli.ai/dedicated/v1/chat/completions"
 MODEL_ID = "dep89a2fld32mcm"
 
-# 요청/응답 모델
-class Message(BaseModel):
-    role: str
-    content: str
+# 전역 변수
+conversation_history = []
 
-class LLMRequest(BaseModel):
-    messages: List[Message]
-    role: str  # 'supervisor' or 'executor'
-    stream: bool = True
+class LLMCollaborativeSystem:
+    def __init__(self):
+        self.token = FRIENDLI_TOKEN
+        self.api_url = API_URL
+        self.model_id = MODEL_ID
+        
+    def create_headers(self):
+        """API 헤더 생성"""
+        return {
+            "Authorization": f"Bearer {self.token}",
+            "Content-Type": "application/json"
+        }
+    
+    def create_supervisor_prompt(self, user_query: str, executor_response: str = None) -> str:
+        """감독자 AI 프롬프트 생성"""
+        if executor_response:
+            return f"""당신은 거시적 관점에서 분석하고 지도하는 감독자 AI입니다.
 
-class CollaborativeRequest(BaseModel):
-    user_query: str
-    max_iterations: int = 3
+사용자 질문: {user_query}
 
-class LLMResponse(BaseModel):
-    content: str
-    role: str
-    timestamp: str
+실행자 AI의 답변:
+{executor_response}
 
-# LLM 호출 함수
-async def call_llm(messages: List[Dict[str, str]], role: str, stream: bool = True):
-    """LLM API 호출"""
-    
-    # 역할에 따른 시스템 프롬프트
-    system_prompts = {
-        "supervisor": """당신은 거시적 관점에서 분석하고 지도하는 감독자 AI입니다.
-        - 전체적인 방향과 프레임워크를 제시합니다.
-        - 실행자 AI의 답변을 검토하고 개선점을 제안합니다.
-        - 구조적이고 체계적인 접근을 추구합니다.""",
-        
-        "executor": """당신은 세부적인 내용을 구현하는 실행자 AI입니다.
-        - 감독자 AI의 지침에 따라 구체적인 내용을 작성합니다.
-        - 실용적이고 실행 가능한 세부 사항에 집중합니다.
-        - 필요시 감독자에게 추가 지침을 요청합니다."""
-    }
-    
-    # 메시지 구성
-    full_messages = [
-        {"role": "system", "content": system_prompts.get(role, "")},
-        *messages
-    ]
-    
-    headers = {
-        "Authorization": f"Bearer {FRIENDLI_TOKEN}",
-        "Content-Type": "application/json"
-    }
+이 답변을 검토하고 개선점과 추가 고려사항을 제시해주세요. 구조적이고 체계적인 피드백을 제공하세요."""
+        else:
+            return f"""당신은 거시적 관점에서 분석하고 지도하는 감독자 AI입니다.
+
+사용자 질문: {user_query}
+
+이 질문에 대한 전체적인 접근 방향과 프레임워크를 제시해주세요. 핵심 요소와 고려사항을 구조화하여 설명해주세요."""
     
-    payload = {
-        "model": MODEL_ID,
-        "messages": full_messages,
-        "max_tokens": 2048,
-        "temperature": 0.7,
-        "top_p": 0.8,
-        "stream": stream,
-        "stream_options": {"include_usage": True} if stream else None
-    }
+    def create_executor_prompt(self, user_query: str, supervisor_guidance: str) -> str:
+        """실행자 AI 프롬프트 생성"""
+        return f"""당신은 세부적인 내용을 구현하는 실행자 AI입니다.
+
+감독자 AI의 지침:
+{supervisor_guidance}
+
+사용자 질문: {user_query}
+
+위 지침을 바탕으로 구체적이고 실행 가능한 세부 내용을 작성해주세요. 실용적이고 구현 가능한 해결책에 집중하세요."""
     
-    async with httpx.AsyncClient(timeout=60.0) as client:
+    def call_llm_sync(self, messages: List[Dict[str, str]], role: str) -> str:
+        """동기식 LLM API 호출"""
         try:
-            if stream:
-                response_text = ""
-                async with client.stream("POST", API_URL, json=payload, headers=headers) as response:
-                    async for line in response.aiter_lines():
-                        if line.startswith("data: "):
-                            data = line[6:]
-                            if data == "[DONE]":
-                                break
-                            try:
-                                chunk = json.loads(data)
-                                if "choices" in chunk and chunk["choices"]:
-                                    content = chunk["choices"][0].get("delta", {}).get("content", "")
-                                    response_text += content
-                                    yield content
-                            except json.JSONDecodeError:
-                                continue
-                return response_text
-            else:
-                response = await client.post(API_URL, json=payload, headers=headers)
-                response.raise_for_status()
+            # 역할에 따른 시스템 프롬프트
+            system_prompts = {
+                "supervisor": "당신은 거시적 관점에서 분석하고 지도하는 감독자 AI입니다.",
+                "executor": "당신은 세부적인 내용을 구현하는 실행자 AI입니다."
+            }
+            
+            # 메시지 구성
+            full_messages = [
+                {"role": "system", "content": system_prompts.get(role, "")},
+                *messages
+            ]
+            
+            payload = {
+                "model": self.model_id,
+                "messages": full_messages,
+                "max_tokens": 2048,
+                "temperature": 0.7,
+                "top_p": 0.8,
+                "stream": False
+            }
+            
+            response = requests.post(
+                self.api_url,
+                headers=self.create_headers(),
+                json=payload,
+                timeout=60
+            )
+            
+            if response.status_code == 200:
                 data = response.json()
                 return data["choices"][0]["message"]["content"]
+            else:
+                logger.error(f"API 오류: {response.status_code}")
+                return f"API 호출 오류: {response.status_code}"
                 
         except Exception as e:
-            logger.error(f"LLM API 호출 오류: {str(e)}")
-            raise HTTPException(status_code=500, detail=f"LLM API 호출 실패: {str(e)}")
-
-# API 엔드포인트
-@app.post("/api/llm/single")
-async def single_llm_call(request: LLMRequest):
-    """단일 LLM 호출"""
-    messages = [{"role": msg.role, "content": msg.content} for msg in request.messages]
-    
-    if request.stream:
-        async def generate():
-            async for chunk in call_llm(messages, request.role, stream=True):
-                yield chunk
-        return generate()
-    else:
-        content = await call_llm(messages, request.role, stream=False)
-        return LLMResponse(
-            content=content,
-            role=request.role,
-            timestamp=datetime.now().isoformat()
-        )
-
-@app.post("/api/llm/collaborate")
-async def collaborative_process(request: CollaborativeRequest):
-    """협력적 LLM 처리"""
-    user_query = request.user_query
-    conversation_log = []
+            logger.error(f"LLM 호출 중 오류: {str(e)}")
+            return f"오류 발생: {str(e)}"
     
-    try:
-        # 1단계: 감독자 AI의 초기 분석
-        supervisor_prompt = f"""사용자 질문: {user_query}
-
-이 질문에 대한 전체적인 접근 방향과 프레임워크를 제시해주세요.
-핵심 요소와 고려사항을 구조화하여 설명해주세요."""
-
-        supervisor_response = ""
-        async for chunk in call_llm([{"role": "user", "content": supervisor_prompt}], "supervisor"):
-            supervisor_response += chunk
-        
-        conversation_log.append({
-            "role": "supervisor",
-            "stage": "initial_analysis",
-            "content": supervisor_response,
-            "timestamp": datetime.now().isoformat()
-        })
+    def process_collaborative(self, user_query: str) -> Dict[str, Any]:
+        """협력적 처리 프로세스"""
+        conversation_log = []
         
-        # 2단계: 실행자 AI의 세부 구현
-        executor_prompt = f"""감독자 AI의 지침:
-{supervisor_response}
-
-사용자 질문: {user_query}
-
-위 지침을 바탕으로 구체적이고 실행 가능한 세부 내용을 작성해주세요."""
-
-        executor_response = ""
-        async for chunk in call_llm([{"role": "user", "content": executor_prompt}], "executor"):
-            executor_response += chunk
+        try:
+            # 1단계: 감독자 AI의 초기 분석
+            supervisor_prompt = self.create_supervisor_prompt(user_query)
+            supervisor_response = self.call_llm_sync(
+                [{"role": "user", "content": supervisor_prompt}],
+                "supervisor"
+            )
             
-        conversation_log.append({
-            "role": "executor",
-            "stage": "implementation",
-            "content": executor_response,
-            "timestamp": datetime.now().isoformat()
-        })
-        
-        # 3단계: 감독자 AI의 검토 및 피드백
-        review_prompt = f"""사용자 질문: {user_query}
-
-실행자 AI의 답변:
-{executor_response}
-
-이 답변을 검토하고 개선점과 추가 고려사항을 제시해주세요."""
-
-        review_response = ""
-        async for chunk in call_llm([{"role": "user", "content": review_prompt}], "supervisor"):
-            review_response += chunk
+            conversation_log.append({
+                "role": "supervisor",
+                "stage": "초기 분석",
+                "content": supervisor_response,
+                "timestamp": datetime.now().strftime("%H:%M:%S")
+            })
             
-        conversation_log.append({
-            "role": "supervisor",
-            "stage": "review",
-            "content": review_response,
-            "timestamp": datetime.now().isoformat()
-        })
-        
-        # 4단계: 최종 종합
-        final_summary = f"""## 협력적 AI 시스템 종합 답변
+            # 2단계: 실행자 AI의 세부 구현
+            executor_prompt = self.create_executor_prompt(user_query, supervisor_response)
+            executor_response = self.call_llm_sync(
+                [{"role": "user", "content": executor_prompt}],
+                "executor"
+            )
+            
+            conversation_log.append({
+                "role": "executor",
+                "stage": "세부 구현",
+                "content": executor_response,
+                "timestamp": datetime.now().strftime("%H:%M:%S")
+            })
+            
+            # 3단계: 감독자 AI의 검토 및 피드백
+            review_prompt = self.create_supervisor_prompt(user_query, executor_response)
+            review_response = self.call_llm_sync(
+                [{"role": "user", "content": review_prompt}],
+                "supervisor"
+            )
+            
+            conversation_log.append({
+                "role": "supervisor",
+                "stage": "검토 및 피드백",
+                "content": review_response,
+                "timestamp": datetime.now().strftime("%H:%M:%S")
+            })
+            
+            # 4단계: 최종 종합
+            final_summary = f"""## 🤝 협력적 AI 시스템 종합 답변
 
-### 🎯 사용자 질문
+### 📌 사용자 질문
 {user_query}
 
 ### 🔍 거시적 분석 (감독자 AI)
@@ -221,348 +168,168 @@ async def collaborative_process(request: CollaborativeRequest):
 
 ---
 *이 답변은 거시적 관점과 미시적 세부사항을 종합하여 작성되었습니다.*"""
-        
-        return {
-            "final_result": final_summary,
-            "conversation_log": conversation_log,
-            "timestamp": datetime.now().isoformat()
-        }
-        
-    except Exception as e:
-        logger.error(f"협력 처리 오류: {str(e)}")
-        raise HTTPException(status_code=500, detail=str(e))
-
-@app.get("/health")
-async def health_check():
-    return {"status": "healthy", "timestamp": datetime.now().isoformat()}
-
-if __name__ == "__main__":
-    import uvicorn
-    uvicorn.run(app, host="0.0.0.0", port=8000)
-```
-
-## 2. Streamlit 프론트엔드 (streamlit_app.py)
-
-```python
-import streamlit as st
-import requests
-import json
-from datetime import datetime
-import time
-import os
-
-# 페이지 설정
-st.set_page_config(
-    page_title="협력적 LLM 시스템",
-    page_icon="🤝",
-    layout="wide",
-    initial_sidebar_state="expanded"
-)
-
-# 스타일 설정
-st.markdown("""
-<style>
-    .main-header {
-        text-align: center;
-        background: linear-gradient(90deg, #667eea 0%, #764ba2 100%);
-        -webkit-background-clip: text;
-        -webkit-text-fill-color: transparent;
-        font-size: 3rem;
-        font-weight: bold;
-        margin-bottom: 2rem;
-    }
-    .llm-box {
-        background-color: #f0f2f6;
-        border-radius: 10px;
-        padding: 1rem;
-        margin-bottom: 1rem;
-        border-left: 4px solid;
-    }
-    .supervisor-box {
-        border-left-color: #667eea;
-    }
-    .executor-box {
-        border-left-color: #764ba2;
-    }
-    .timestamp {
-        font-size: 0.8rem;
-        color: #666;
-    }
-</style>
-""", unsafe_allow_html=True)
-
-# 백엔드 URL
-BACKEND_URL = os.getenv("BACKEND_URL", "http://localhost:8000")
-
-# 세션 상태 초기화
-if "conversation_history" not in st.session_state:
-    st.session_state.conversation_history = []
-if "current_conversation" not in st.session_state:
-    st.session_state.current_conversation = None
-
-# 헤더
-st.markdown('<h1 class="main-header">🤝 협력적 LLM 시스템</h1>', unsafe_allow_html=True)
-st.markdown("거시적 감독자 AI와 미시적 실행자 AI가 협력하여 최상의 답변을 만들어냅니다.")
-
-# 사이드바
-with st.sidebar:
-    st.header("⚙️ 설정")
-    
-    # 백엔드 상태 확인
-    try:
-        response = requests.get(f"{BACKEND_URL}/health")
-        if response.status_code == 200:
-            st.success("✅ 백엔드 연결됨")
-        else:
-            st.error("❌ 백엔드 연결 실패")
-    except:
-        st.error("❌ 백엔드 서버를 시작해주세요")
-    
-    st.divider()
-    
-    # 대화 기록
-    st.header("📝 대화 기록")
-    if st.session_state.conversation_history:
-        for idx, conv in enumerate(reversed(st.session_state.conversation_history)):
-            if st.button(f"💬 {conv['query'][:30]}...", key=f"hist_{idx}"):
-                st.session_state.current_conversation = conv
-    else:
-        st.info("대화 기록이 없습니다.")
-    
-    if st.button("🗑️ 기록 초기화"):
-        st.session_state.conversation_history = []
-        st.session_state.current_conversation = None
-        st.rerun()
-
-# 메인 컨텐츠
-main_container = st.container()
-
-# 질문 입력
-with main_container:
-    col1, col2 = st.columns([5, 1])
-    with col1:
-        user_query = st.text_input(
-            "질문을 입력하세요:",
-            placeholder="예: 기계학습 모델의 성능을 향상시키는 방법은?",
-            key="user_input"
-        )
-    with col2:
-        process_button = st.button("🚀 분석 시작", type="primary", use_container_width=True)
-
-# 처리 로직
-if process_button and user_query:
-    with st.spinner("AI들이 협력하여 답변을 생성하고 있습니다..."):
-        try:
-            # 백엔드에 요청
-            response = requests.post(
-                f"{BACKEND_URL}/api/llm/collaborate",
-                json={"user_query": user_query, "max_iterations": 3}
-            )
             
-            if response.status_code == 200:
-                result = response.json()
-                
-                # 대화 기록에 추가
-                conversation = {
-                    "query": user_query,
-                    "result": result,
-                    "timestamp": datetime.now().isoformat()
-                }
-                st.session_state.conversation_history.append(conversation)
-                st.session_state.current_conversation = conversation
-                
-                st.success("✅ 분석 완료!")
-            else:
-                st.error(f"오류 발생: {response.status_code}")
-                
+            return {
+                "final_result": final_summary,
+                "conversation_log": conversation_log,
+                "supervisor_texts": [log["content"] for log in conversation_log if log["role"] == "supervisor"],
+                "executor_texts": [log["content"] for log in conversation_log if log["role"] == "executor"]
+            }
+            
         except Exception as e:
-            st.error(f"처리 중 오류 발생: {str(e)}")
-
-# 결과 표시
-if st.session_state.current_conversation:
-    conv = st.session_state.current_conversation
-    
-    # 최종 결과
-    st.markdown("### 📊 최종 종합 결과")
-    with st.expander("펼치기", expanded=True):
-        st.markdown(conv["result"]["final_result"])
-    
-    # 대화 과정
-    st.markdown("### 🔄 AI 협력 과정")
-    
-    # 두 개의 컬럼으로 분할
-    col1, col2 = st.columns(2)
-    
-    supervisor_logs = [log for log in conv["result"]["conversation_log"] if log["role"] == "supervisor"]
-    executor_logs = [log for log in conv["result"]["conversation_log"] if log["role"] == "executor"]
-    
-    with col1:
-        st.markdown("#### 🧠 감독자 AI (거시적 분석)")
-        for log in supervisor_logs:
-            with st.container():
-                st.markdown(f'<div class="llm-box supervisor-box">', unsafe_allow_html=True)
-                st.markdown(f"**{log['stage']}**")
-                st.text(log["content"][:500] + "..." if len(log["content"]) > 500 else log["content"])
-                st.markdown(f'<span class="timestamp">{log["timestamp"]}</span>', unsafe_allow_html=True)
-                st.markdown('</div>', unsafe_allow_html=True)
-    
-    with col2:
-        st.markdown("#### 👁️ 실행자 AI (미시적 구현)")
-        for log in executor_logs:
-            with st.container():
-                st.markdown(f'<div class="llm-box executor-box">', unsafe_allow_html=True)
-                st.markdown(f"**{log['stage']}**")
-                st.text(log["content"][:500] + "..." if len(log["content"]) > 500 else log["content"])
-                st.markdown(f'<span class="timestamp">{log["timestamp"]}</span>', unsafe_allow_html=True)
-                st.markdown('</div>', unsafe_allow_html=True)
-
-# 하단 정보
-st.divider()
-st.markdown("""
-<div style="text-align: center; color: #666;">
-    💡 이 시스템은 두 AI가 서로 다른 관점에서 접근하여 더 나은 답변을 만들어냅니다.<br>
-    감독자 AI는 전체적인 방향을, 실행자 AI는 구체적인 세부사항을 담당합니다.
-</div>
-""", unsafe_allow_html=True)
-```
+            logger.error(f"협력 처리 오류: {str(e)}")
+            return {
+                "final_result": f"처리 중 오류가 발생했습니다: {str(e)}",
+                "conversation_log": [],
+                "supervisor_texts": [],
+                "executor_texts": []
+            }
 
-## 3. Gradio 프론트엔드 (gradio_app.py)
-
-```python
-import gradio as gr
-import requests
-import json
-from datetime import datetime
-import os
-import asyncio
-
-# 백엔드 URL
-BACKEND_URL = os.getenv("BACKEND_URL", "http://localhost:8000")
-
-# 글로벌 변수
-conversation_history = []
-
-def check_backend_status():
-    """백엔드 상태 확인"""
-    try:
-        response = requests.get(f"{BACKEND_URL}/health")
-        return response.status_code == 200
-    except:
-        return False
+# 시스템 인스턴스 생성
+llm_system = LLMCollaborativeSystem()
 
 def process_query(user_query, history):
-    """사용자 쿼리 처리"""
+    """Gradio 인터페이스를 위한 쿼리 처리 함수"""
     if not user_query:
-        return history, "", "", "", "질문을 입력해주세요."
+        return history, "", "", "", "❌ 질문을 입력해주세요."
+    
+    # 처리 시작
+    status = "🔄 AI들이 협력하여 답변을 생성하고 있습니다..."
     
     try:
-        # 백엔드에 요청
-        response = requests.post(
-            f"{BACKEND_URL}/api/llm/collaborate",
-            json={"user_query": user_query, "max_iterations": 3}
+        # 협력적 처리
+        result = llm_system.process_collaborative(user_query)
+        
+        # 감독자와 실행자 텍스트 포맷팅
+        supervisor_text = "\n\n---\n\n".join([
+            f"[{log['stage']}] - {log['timestamp']}\n{log['content']}"
+            for log in result["conversation_log"] if log["role"] == "supervisor"
+        ])
+        
+        executor_text = "\n\n---\n\n".join([
+            f"[{log['stage']}] - {log['timestamp']}\n{log['content']}"
+            for log in result["conversation_log"] if log["role"] == "executor"
+        ])
+        
+        # 히스토리 업데이트
+        new_history = history + [(user_query, result["final_result"])]
+        
+        return (
+            new_history,
+            supervisor_text,
+            executor_text,
+            result["final_result"],
+            "✅ 분석 완료!"
         )
         
-        if response.status_code == 200:
-            result = response.json()
-            
-            # 대화 로그 파싱
-            supervisor_text = ""
-            executor_text = ""
-            
-            for log in result["conversation_log"]:
-                if log["role"] == "supervisor":
-                    supervisor_text += f"[{log['stage']}]\n{log['content']}\n\n"
-                else:
-                    executor_text += f"[{log['stage']}]\n{log['content']}\n\n"
-            
-            # 히스토리 업데이트
-            new_history = history + [(user_query, result["final_result"])]
-            
-            return (
-                new_history,
-                supervisor_text,
-                executor_text,
-                result["final_result"],
-                "✅ 분석 완료!"
-            )
-        else:
-            return history, "", "", "", f"❌ 오류 발생: {response.status_code}"
-            
     except Exception as e:
-        return history, "", "", "", f"❌ 처리 중 오류: {str(e)}"
+        error_msg = f"❌ 처리 중 오류: {str(e)}"
+        return history, "", "", error_msg, error_msg
 
 def clear_all():
     """모든 내용 초기화"""
-    return [], "", "", "", ""
-
-# Gradio 인터페이스 구성
-with gr.Blocks(title="협력적 LLM 시스템", theme=gr.themes.Soft()) as app:
+    return [], "", "", "", "🔄 초기화되었습니다."
+
+# Gradio 인터페이스
+css = """
+.gradio-container {
+    font-family: 'Arial', sans-serif;
+}
+.supervisor-box {
+    border-left: 4px solid #667eea;
+    padding-left: 10px;
+}
+.executor-box {
+    border-left: 4px solid #764ba2;
+    padding-left: 10px;
+}
+"""
+
+with gr.Blocks(title="협력적 LLM 시스템", theme=gr.themes.Soft(), css=css) as app:
     gr.Markdown(
         """
         # 🤝 협력적 LLM 시스템
         
-        거시적 감독자 AI와 미시적 실행자 AI가 협력하여 최상의 답변을 만들어냅니다.
+        > 거시적 감독자 AI와 미시적 실행자 AI가 협력하여 최상의 답변을 만들어냅니다.
+        
+        **시스템 구조:**
+        - 🧠 **감독자 AI**: 전체적인 방향과 프레임워크를 제시
+        - 👁️ **실행자 AI**: 구체적이고 실행 가능한 세부사항을 작성
+        - 🔄 **협력 프로세스**: 상호 피드백을 통한 답변 개선
         """
     )
     
-    # 백엔드 상태 표시
-    with gr.Row():
-        backend_status = gr.Markdown(
-            "🟢 백엔드 연결됨" if check_backend_status() else "🔴 백엔드 연결 안됨"
-        )
-    
     with gr.Row():
         # 왼쪽: 입력 및 채팅 기록
         with gr.Column(scale=1):
             chatbot = gr.Chatbot(
                 label="💬 대화 기록",
-                height=400,
-                show_copy_button=True
+                height=500,
+                show_copy_button=True,
+                bubble_full_width=False
             )
             
             user_input = gr.Textbox(
                 label="질문 입력",
                 placeholder="예: 기계학습 모델의 성능을 향상시키는 방법은?",
-                lines=2
+                lines=3
             )
             
             with gr.Row():
-                submit_btn = gr.Button("🚀 분석 시작", variant="primary")
-                clear_btn = gr.Button("🗑️ 초기화")
+                submit_btn = gr.Button("🚀 분석 시작", variant="primary", scale=2)
+                clear_btn = gr.Button("🗑️ 초기화", scale=1)
             
             status_text = gr.Textbox(
                 label="상태",
                 interactive=False,
-                value="대기 중..."
+                value="대기 중...",
+                max_lines=1
             )
         
         # 오른쪽: AI 출력
         with gr.Column(scale=2):
             # 최종 결과
-            final_output = gr.Markdown(
-                label="📊 최종 종합 결과",
-                value="*질문을 입력하면 결과가 여기에 표시됩니다.*"
-            )
+            with gr.Accordion("📊 최종 종합 결과", open=True):
+                final_output = gr.Markdown(
+                    value="*질문을 입력하면 결과가 여기에 표시됩니다.*"
+                )
             
             with gr.Row():
                 # 감독자 AI 출력
                 with gr.Column():
+                    gr.Markdown("### 🧠 감독자 AI (거시적 분석)")
                     supervisor_output = gr.Textbox(
-                        label="🧠 감독자 AI (거시적 분석)",
+                        label="",
                         lines=15,
                         max_lines=20,
-                        interactive=False
+                        interactive=False,
+                        elem_classes=["supervisor-box"]
                     )
                 
                 # 실행자 AI 출력
                 with gr.Column():
+                    gr.Markdown("### 👁️ 실행자 AI (미시적 구현)")
                     executor_output = gr.Textbox(
-                        label="👁️ 실행자 AI (미시적 구현)",
+                        label="",
                         lines=15,
                         max_lines=20,
-                        interactive=False
+                        interactive=False,
+                        elem_classes=["executor-box"]
                     )
     
+    # 예제
+    gr.Examples(
+        examples=[
+            "기계학습 모델의 성능을 향상시키는 방법은?",
+            "효과적인 프로젝트 관리 전략을 수립하는 방법은?",
+            "지속 가능한 비즈니스 모델을 구축하는 방법은?",
+            "복잡한 데이터를 시각화하는 최선의 방법은?",
+            "팀의 생산성을 높이는 방법은?"
+        ],
+        inputs=user_input,
+        label="💡 예제 질문"
+    )
+    
     # 이벤트 핸들러
     submit_btn.click(
         fn=process_query,
@@ -587,24 +354,17 @@ with gr.Blocks(title="협력적 LLM 시스템", theme=gr.themes.Soft()) as app:
         outputs=[chatbot, supervisor_output, executor_output, final_output, status_text]
     )
     
-    # 예제
-    gr.Examples(
-        examples=[
-            "기계학습 모델의 성능을 향상시키는 방법은?",
-            "효과적인 프로젝트 관리 전략을 수립하는 방법은?",
-            "지속 가능한 비즈니스 모델을 구축하는 방법은?",
-            "복잡한 데이터를 시각화하는 최선의 방법은?"
-        ],
-        inputs=user_input
-    )
-    
     gr.Markdown(
         """
         ---
-        💡 **시스템 설명**
-        - **감독자 AI**: 전체적인 방향과 프레임워크를 제시합니다.
-        - **실행자 AI**: 구체적이고 실행 가능한 세부사항을 작성합니다.
-        - 두 AI가 상호작용하며 최적의 답변을 도출합니다.
+        ### 📝 사용 방법
+        1. 질문을 입력하고 Enter 또는 '분석 시작' 버튼을 클릭하세요.
+        2. 두 AI가 협력하여 답변을 생성하는 과정을 실시간으로 확인할 수 있습니다.
+        3. 최종 종합 결과는 상단에 표시됩니다.
+        
+        ### ⚙️ 환경 설정
+        - `FRIENDLI_TOKEN` 환경 변수를 설정하세요: `export FRIENDLI_TOKEN="your_token"`
+        - 또는 코드의 `FRIENDLI_TOKEN` 변수를 직접 수정하세요.
         """
     )
 
@@ -612,6 +372,6 @@ if __name__ == "__main__":
     app.launch(
         server_name="0.0.0.0",
         server_port=7860,
-        share=False,
+        share=True,
         show_error=True
-    )
+    )