app.py

import streamlit as st
import tempfile
import os
import json
import matplotlib
import matplotlib.pyplot as plt
from datetime import datetime
from stt import transcribe, calculate_wpm
from analyzer import analyze
from report import generate_pdf
import librosa
import numpy as np

matplotlib.rcParams['font.family'] = 'Malgun Gothic'
matplotlib.rcParams['axes.unicode_minus'] = False

st.set_page_config(
    page_title="PresentAI",
    page_icon="🎤",
    layout="wide"
)

# ========== CSS ==========
st.markdown("""
<style>
.pai-root {
  font-family: 'Pretendard','Apple SD Gothic Neo','Malgun Gothic',
               -apple-system, BlinkMacSystemFont,'Segoe UI', sans-serif;
  color: #1a1c2e;
  -webkit-font-smoothing: antialiased;
  line-height: 1.5;
  max-width: 1080px;
  margin: 0 auto;
}
.pai-root *, .pai-root *::before, .pai-root *::after { box-sizing: border-box; }
.pai-root h1, .pai-root h2, .pai-root h3, .pai-root p { margin: 0; }

.pai-header {
  display: flex; align-items: center; justify-content: space-between;
  flex-wrap: wrap; gap: 12px; margin-bottom: 24px;
}
.pai-eyebrow {
  font-size: 13px; font-weight: 600; letter-spacing: 0.08em;
  color: #7c6df0; text-transform: uppercase; margin-bottom: 6px;
}
.pai-h1 {
  font-size: 28px; font-weight: 800; color: #1a1c2e; letter-spacing: -0.02em;
}
.pai-pill {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 8px 14px; background: #fff; border: 1px solid #e6e6f2;
  border-radius: 999px; font-size: 13px; color: #5a5d7a; font-weight: 500;
}
.pai-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: #22c55e; display: inline-block;
}

.pai-hero {
  background: linear-gradient(135deg,#6366f1 0%,#8b5cf6 50%,#a855f7 100%);
  border-radius: 24px; padding: 36px;
  color: #fff; box-shadow: 0 20px 50px -20px rgba(99,102,241,0.55);
  margin-bottom: 20px; position: relative; overflow: hidden;
}
.pai-hero__blob {
  position: absolute; border-radius: 50%;
  background: rgba(255,255,255,0.08); pointer-events: none;
}
.pai-hero__blob--1 { top: -60px; right: -40px; width: 240px; height: 240px; }
.pai-hero__blob--2 { bottom: -80px; right: 120px; width: 180px; height: 180px;
                     background: rgba(255,255,255,0.05); }
.pai-hero__inner {
  position: relative; display: flex; align-items: center;
  gap: 40px; flex-wrap: wrap;
}
.pai-score-big { display: flex; align-items: baseline; gap: 8px; flex: 0 0 auto; }
.pai-score-big__num {
  font-size: 104px; font-weight: 800; line-height: 1; letter-spacing: -0.04em;
}
.pai-score-big__unit { font-size: 22px; font-weight: 600; opacity: 0.85; }

.pai-score-grid {
  flex: 1 1 420px;
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 14px 24px;
}
.pai-score-row__head {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 6px;
}
.pai-score-row__label { font-size: 13px; font-weight: 600; opacity: 0.9; }
.pai-score-row__val   { font-size: 13px; font-weight: 700; }
.pai-score-row__val b { font-size: 15px; font-weight: 800; }

.pai-bar {
  height: 6px; background: rgba(255,255,255,0.22);
  border-radius: 99px; overflow: hidden;
}
.pai-bar__fill         { height: 100%; background: #fff; border-radius: 99px; }
.pai-bar__fill--warn   { background: #fcd34d; }
.pai-bar__fill--danger { background: #fb7185; }

.pai-comment {
  position: relative; margin-top: 28px; padding: 16px 20px;
  background: rgba(255,255,255,0.14);
  border-left: 3px solid rgba(255,255,255,0.7);
  border-radius: 8px;
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
}
.pai-comment__label {
  font-size: 12px; font-weight: 700; letter-spacing: 0.06em;
  text-transform: uppercase; opacity: 0.85; margin-bottom: 6px;
}
.pai-comment__text { font-size: 15px; line-height: 1.6; font-weight: 500; }

.pai-card {
  background: #fff; border: 1px solid #ececf6;
  border-radius: 18px; padding: 24px;
  box-shadow: 0 1px 2px rgba(15,23,42,0.04);
  margin-bottom: 20px;
}
.pai-card__head {
  display: flex; align-items: center; gap: 10px; margin-bottom: 16px;
}
.pai-card__icon {
  width: 32px; height: 32px; border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
  font-size: 16px; flex-shrink: 0;
}
.pai-card__icon--warn   { background: linear-gradient(135deg,#fef3c7,#fde68a); }
.pai-card__icon--purple { background: linear-gradient(135deg,#ede9fe,#ddd6fe); }
.pai-card__icon--blue   { background: linear-gradient(135deg,#dbeafe,#bfdbfe); }
.pai-card__icon--danger { background: linear-gradient(135deg,#fee2e2,#fecaca); }
.pai-card__icon--indigo { background: linear-gradient(135deg,#e0e7ff,#c7d2fe); }
.pai-card__title { font-size: 16px; font-weight: 700; color: #1a1c2e; }
.pai-card__counter {
  margin-left: auto; font-size: 12px; color: #5a5d7a;
  background: #f3f1ff; padding: 4px 10px; border-radius: 999px; font-weight: 600;
}
.pai-card__counter--success { color: #15803d; background: #dcfce7; }

.pai-grid-2 {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 20px; margin-bottom: 20px;
}
.pai-grid-2 > .pai-card { margin-bottom: 0; }

.pai-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.pai-chip {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 8px 12px; border-radius: 10px;
  font-size: 14px; font-weight: 600;
}
.pai-chip--warn   { background: #fef3c7; border: 1px solid #fde68a; color: #92400e; }
.pai-chip--purple { background: #f3f1ff; border: 1px solid #e5e0ff; color: #5b4cd1; }
.pai-chip__count {
  color: #fff; font-size: 11px; padding: 2px 7px;
  border-radius: 99px; font-weight: 700;
}
.pai-chip--warn   .pai-chip__count { background: #92400e; }
.pai-chip--purple .pai-chip__count { background: #5b4cd1; }

.pai-repeat-list { display: flex; flex-direction: column; gap: 10px; }
.pai-repeat-row__head {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 6px;
}
.pai-repeat-row__word  { font-size: 14px; font-weight: 600; color: #1a1c2e; }
.pai-repeat-row__count { font-size: 12px; font-weight: 700; color: #7c6df0; }
.pai-repeat-bar {
  height: 8px; background: #f3f1ff; border-radius: 99px; overflow: hidden;
}
.pai-repeat-bar__fill {
  height: 100%; border-radius: 99px;
  background: linear-gradient(90deg,#8b5cf6,#a855f7);
}

.pai-steps {
  display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 14px;
}
.pai-step {
  position: relative; padding: 18px;
  border-radius: 14px;
}
.pai-step--ok {
  background: linear-gradient(135deg,#f0fdf4,#dcfce7);
  border: 1px solid #bbf7d0;
}
.pai-step--fail {
  background: linear-gradient(135deg,#fef2f2,#fee2e2);
  border: 1px solid #fecaca;
}
.pai-step__check {
  position: absolute; top: 14px; right: 14px;
  width: 24px; height: 24px; border-radius: 50%;
  color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-size: 13px; font-weight: 800;
}
.pai-step--ok .pai-step__check { background: #22c55e; }
.pai-step--fail .pai-step__check { background: #ef4444; }
.pai-step__num {
  font-size: 11px; font-weight: 700; letter-spacing: 0.08em;
  text-transform: uppercase; margin-bottom: 6px;
}
.pai-step--ok .pai-step__num { color: #15803d; }
.pai-step--fail .pai-step__num { color: #b91c1c; }
.pai-step__name { font-size: 18px; font-weight: 700; }
.pai-step--ok .pai-step__name { color: #14532d; }
.pai-step--fail .pai-step__name { color: #991b1b; }

.pai-footer {
  text-align: center; padding: 16px 0 8px 0;
  font-size: 12px; color: #94a3b8;
}

@media (max-width: 720px) {
  .pai-grid-2,
  .pai-steps,
  .pai-score-grid { grid-template-columns: 1fr; }
  .pai-score-big__num { font-size: 72px; }
  .pai-hero { padding: 24px; }
}
</style>
""", unsafe_allow_html=True)

# st.html()에서 사용할 CSS (st.html은 페이지 CSS를 공유하지 않음)
CARD_CSS = """
<style>
.pai-root { font-family: 'Malgun Gothic',sans-serif; color: #1a1c2e; max-width: 1080px; margin: 0 auto; line-height: 1.5; }
.pai-root *, .pai-root *::before, .pai-root *::after { box-sizing: border-box; }
.pai-card { background: #fff; border: 1px solid #ececf6; border-radius: 18px; padding: 24px; box-shadow: 0 1px 2px rgba(15,23,42,0.04); margin-bottom: 20px; }
.pai-card__head { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; }
.pai-card__icon { width: 32px; height: 32px; border-radius: 8px; display: flex; align-items: center; justify-content: center; font-size: 16px; }
.pai-card__icon--danger { background: linear-gradient(135deg,#fee2e2,#fecaca); }
.pai-card__icon--indigo { background: linear-gradient(135deg,#e0e7ff,#c7d2fe); }
.pai-card__title { font-size: 16px; font-weight: 700; color: #1a1c2e; }
.pai-card__counter { margin-left: auto; font-size: 12px; color: #5a5d7a; background: #f3f1ff; padding: 4px 10px; border-radius: 999px; font-weight: 600; }
.pai-diff { display: flex; align-items: center; gap: 16px; padding: 18px; background: #fafaff; border: 1px dashed #d8d4f5; border-radius: 12px; flex-wrap: wrap; margin-bottom: 10px; }
.pai-diff__side { flex: 1 1 200px; }
.pai-diff__label { font-size: 11px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; margin-bottom: 6px; }
.pai-diff__label--before { color: #94a3b8; }
.pai-diff__label--after { color: #7c6df0; }
.pai-diff__text { font-size: 16px; font-weight: 700; color: #1a1c2e; }
.pai-diff__text--strike { text-decoration: line-through; text-decoration-color: #ef4444; text-decoration-thickness: 2px; }
.pai-diff__text--good { color: #5b4cd1; }
.pai-diff__arrow { font-size: 24px; color: #a855f7; font-weight: 700; }
.pai-sentence { padding: 18px 20px; border-radius: 8px; }
.pai-sentence--orig { background: #f8f8fc; border-left: 3px solid #cbd5e1; margin-bottom: 12px; }
.pai-sentence--new { background: linear-gradient(135deg,#f5f3ff,#ede9fe); border-left: 3px solid #8b5cf6; margin-bottom: 20px; }
.pai-sentence__tag { display: inline-block; font-size: 10px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; padding: 3px 8px; border-radius: 4px; margin-bottom: 8px; }
.pai-sentence__tag--orig { color: #64748b; background: #e2e8f0; }
.pai-sentence__tag--new { color: #6d28d9; background: #ddd6fe; }
.pai-sentence__body { font-size: 15px; line-height: 1.7; }
.pai-sentence--orig .pai-sentence__body { color: #475569; }
.pai-sentence--new .pai-sentence__body { color: #1a1c2e; font-weight: 500; }
.pai-sentence__reason { font-size: 13px; color: #7c6df0; margin-top: 6px; font-weight: 500; }
.pai-sentence__divider { text-align: center; color: #a855f7; font-size: 18px; font-weight: 700; margin: 4px 0 12px 0; }
</style>
"""

# ========== 업로드 영역 ==========
st.markdown("""
<div class="pai-root">
  <div class="pai-header">
    <div>
      <div class="pai-eyebrow">PresentAI · 발표 피드백 리포트</div>
      <h1 class="pai-h1">🎤 AI 기반 발표 피드백 시스템</h1>
    </div>
  </div>
</div>
""", unsafe_allow_html=True)

mode = st.radio(
    "모드를 선택하세요",
    ["🎤 발표 모드", "💼 면접 모드"],
    horizontal=True
)

interview_question = None
if mode == "💼 면접 모드":
    interview_question = st.text_input(
        "면접 질문을 입력하세요",
        placeholder="예: 자기소개를 해주세요"
    )

upload_label = "면접 답변 음성 파일을 업로드하세요" if mode == "💼 면접 모드" else "발표 음성 파일을 업로드하세요"
uploaded_file = st.file_uploader(
    upload_label,
    type=["m4a", "mp3", "wav", "webm", "mp4"]
)

if uploaded_file is not None:
    if interview_question is not None and interview_question.strip() == "":
        st.warning("면접 질문을 먼저 입력해주세요.")
        st.stop()
        
    with tempfile.NamedTemporaryFile(delete=False, suffix=os.path.splitext(uploaded_file.name)[1]) as tmp:
        tmp.write(uploaded_file.read())
        tmp_path = tmp.name

    try:
        if "analysis" not in st.session_state or st.session_state.get("last_file") != uploaded_file.name:
            

            with st.spinner("🎧 음성을 텍스트로 변환 중..."):
                stt_result = transcribe(tmp_path)
            # Whisper 환각 필터링
            hallucination_patterns = [
                "시청해주셔서 감사합니다",
                "구독과 좋아요",
                "감사합니다!",
                "MBC 뉴스",
                "SBS 뉴스",
            ]
            if any(pattern in stt_result["text"] for pattern in hallucination_patterns) and len(stt_result["segments"]) <= 2:
                st.warning("⚠️ 음성에서 유효한 발화를 감지하지 못했습니다. 실제 발표 음성이 포함된 파일을 업로드해주세요.")
                st.stop()

            # 빈 음성 / 무음 / 짧은 음성 체크
            if not stt_result["segments"]:
                st.warning("⚠️ 음성에서 텍스트를 인식하지 못했습니다. 음성이 포함된 파일을 업로드해주세요.")
                st.stop()

            if not stt_result["text"].strip():
                st.warning("⚠️ 음성에서 텍스트를 인식하지 못했습니다. 음성이 포함된 파일을 업로드해주세요.")
                st.stop()

            total_duration = stt_result["segments"][-1]["end"] - stt_result["segments"][0]["start"]
            if total_duration < 10:
                st.warning("⚠️ 음성이 너무 짧습니다. 최소 10초 이상의 음성을 업로드해주세요.")
                st.stop()

            wpm_data = calculate_wpm(stt_result["segments"])

            spinner_msg = "🤖 GPT가 면접 답변을 분석 중..." if interview_question else "🤖 GPT가 발표를 분석 중..."
            with st.spinner(spinner_msg):
                try:
                    analysis = analyze(stt_result["text"], wpm_data, interview_question)
                except json.JSONDecodeError:
                    st.error("❌ GPT 응답을 처리하지 못했습니다. 다시 시도해주세요.")
                    st.stop()
                except Exception as api_error:
                    st.error(f"❌ API 호출 중 오류가 발생했습니다: {str(api_error)}")
                    st.stop()

            # 결과 저장
            st.session_state["analysis"] = analysis
            st.session_state["stt_result"] = stt_result
            st.session_state["wpm_data"] = wpm_data
            st.session_state["last_file"] = uploaded_file.name
        else:
            analysis = st.session_state["analysis"]
            stt_result = st.session_state["stt_result"]
            wpm_data = st.session_state["wpm_data"]

            if st.button("🔄 다시 분석하기"):
                del st.session_state["analysis"]
                del st.session_state["last_file"]
                st.rerun()

            

        # ===== 데이터 준비 =====
        score = analysis["completeness_score"]
        bd = score["breakdown"]
        filler = analysis["filler_words"]
        repeated = analysis["repeated_expressions"]
        logic = analysis["logic_structure"]
        speed = analysis["speech_speed"]

        # 바 퍼센트 계산
        logic_pct = round(bd["logic_structure"] / 35 * 100)
        filler_pct = round(bd["filler_and_repetition"] / 25 * 100)
        speed_pct = round(bd["speech_speed"] / 20 * 100)
        expr_pct = round(bd["expression_quality"] / 20 * 100)

        # 바 색상 결정
        def bar_class(pct):
            if pct < 50:
                return "pai-bar__fill--danger"
            elif pct < 70:
                return "pai-bar__fill--warn"
            return "pai-bar__fill"

        # PDF 다운로드
        pdf_buffer = generate_pdf(analysis, wpm_data, stt_result["text"])
        st.download_button(
            label="📄 PDF 리포트 다운로드",
            data=pdf_buffer,
            file_name=f"PresentAI_리포트_{datetime.now().strftime('%Y%m%d_%H%M')}.pdf",
            mime="application/pdf"
        )

        # ===== 1. Hero 점수 영역 =====
        st.markdown(f"""
        <div class="pai-root">
          <div class="pai-header">
            <div></div>
            <div class="pai-pill">
              <span class="pai-dot"></span>
              분석 완료
            </div>
          </div>

          <section class="pai-hero">
            <div class="pai-hero__blob pai-hero__blob--1"></div>
            <div class="pai-hero__blob pai-hero__blob--2"></div>
            <div class="pai-hero__inner">
              <div class="pai-score-big">
                <div class="pai-score-big__num">{score['total']}</div>
                <div class="pai-score-big__unit">/ 100점</div>
              </div>
              <div class="pai-score-grid">
                <div class="pai-score-row">
                  <div class="pai-score-row__head">
                    <span class="pai-score-row__label">논리 구조</span>
                    <span class="pai-score-row__val"><b>{bd['logic_structure']}</b> / 35</span>
                  </div>
                  <div class="pai-bar"><div class="{bar_class(logic_pct)}" style="width:{logic_pct}%; height:100%; border-radius:99px;"></div></div>
                </div>
                <div class="pai-score-row">
                  <div class="pai-score-row__head">
                    <span class="pai-score-row__label">Filler &amp; 반복</span>
                    <span class="pai-score-row__val"><b>{bd['filler_and_repetition']}</b> / 25</span>
                  </div>
                  <div class="pai-bar"><div class="{bar_class(filler_pct)}" style="width:{filler_pct}%; height:100%; border-radius:99px;"></div></div>
                </div>
                <div class="pai-score-row">
                  <div class="pai-score-row__head">
                    <span class="pai-score-row__label">말하기 속도</span>
                    <span class="pai-score-row__val"><b>{bd['speech_speed']}</b> / 20</span>
                  </div>
                  <div class="pai-bar"><div class="{bar_class(speed_pct)}" style="width:{speed_pct}%; height:100%; border-radius:99px;"></div></div>
                </div>
                <div class="pai-score-row">
                  <div class="pai-score-row__head">
                    <span class="pai-score-row__label">표현 정확성</span>
                    <span class="pai-score-row__val"><b>{bd['expression_quality']}</b> / 20</span>
                  </div>
                  <div class="pai-bar"><div class="{bar_class(expr_pct)}" style="width:{expr_pct}%; height:100%; border-radius:99px;"></div></div>
                </div>
              </div>
            </div>
            <div class="pai-comment">
              <div class="pai-comment__label">종합 코멘트</div>
              <div class="pai-comment__text">{score['comment']}</div>
            </div>
          </section>
        </div>
        """, unsafe_allow_html=True)

        # ===== 2. Filler Words + 반복 표현 =====
        if filler["detected"]:
            filler_chips = ""
            for i, item in enumerate(filler["detected"]):
                chip_style = "pai-chip--warn" if i < 2 else "pai-chip--purple"
                filler_chips += f'<span class="pai-chip {chip_style}">{item["word"]} <span class="pai-chip__count">{item["count"]}</span></span>'
            filler_content = f'<div class="pai-chips">{filler_chips}</div>'
        else:
            filler_content = '<p style="color:#22c55e; font-size:14px; font-weight:600;">✅ Filler word가 감지되지 않았습니다.</p>'

        if repeated["detected"]:
            repeat_rows = ""
            max_count = max([item["count"] for item in repeated["detected"]])
            for item in repeated["detected"]:
                pct = round(item["count"] / max_count * 100)
                repeat_rows += f"""
                <div class="pai-repeat-row">
                  <div class="pai-repeat-row__head">
                    <span class="pai-repeat-row__word">{item['expression']}</span>
                    <span class="pai-repeat-row__count">{item['count']}회</span>
                  </div>
                  <div class="pai-repeat-bar"><div class="pai-repeat-bar__fill" style="width:{pct}%;"></div></div>
                </div>"""
            repeat_content = f'<div class="pai-repeat-list">{repeat_rows}</div>'
        else:
            repeat_content = '<p style="color:#22c55e; font-size:14px; font-weight:600;">✅ 과도한 반복 표현이 없습니다.</p>'

        st.markdown(f"""
        <div class="pai-root">
          <div class="pai-grid-2">
            <section class="pai-card">
              <div class="pai-card__head">
                <div class="pai-card__icon pai-card__icon--warn">💬</div>
                <h3 class="pai-card__title">Filler Words</h3>
                <span class="pai-card__counter">총 {filler['total_count']}회</span>
              </div>
              {filler_content}
            </section>
            <section class="pai-card">
              <div class="pai-card__head">
                <div class="pai-card__icon pai-card__icon--purple">🔁</div>
                <h3 class="pai-card__title">반복 표현</h3>
                <span class="pai-card__counter">{len(repeated['detected'])}개 단어</span>
              </div>
              {repeat_content}
            </section>
          </div>
        </div>
        """, unsafe_allow_html=True)

        # ===== 3. 말하기 속도 그래프 =====
        st.markdown("""
        <div class="pai-root">
          <section class="pai-card">
            <div class="pai-card__head">
              <div class="pai-card__icon pai-card__icon--blue">⏱️</div>
              <h3 class="pai-card__title">말하기 속도</h3>
            </div>
        """, unsafe_allow_html=True)

        if wpm_data["segments"]:
            times = [seg["start"] for seg in wpm_data["segments"]]
            wpms = [seg["wpm"] for seg in wpm_data["segments"]]

            fig, ax = plt.subplots(figsize=(10, 4))
            ax.plot(times, wpms, marker='o', color='#8b5cf6', linewidth=2, markersize=5)
            ax.axhline(y=80, color='#f59e0b', linestyle='--', label='느림 기준 (80)')
            ax.axhline(y=120, color='#ef4444', linestyle='--', label='빠름 기준 (120)')
            ax.fill_between(times, 80, 120, alpha=0.08, color='#22c55e', label='적정 구간')
            ax.set_xlabel("시간 (초)")
            ax.set_ylabel("WPM")
            ax.set_title("구간별 말하기 속도")
            ax.legend(fontsize=9)
            fig.patch.set_facecolor('#ffffff')
            ax.set_facecolor('#ffffff')
            plt.tight_layout()
            st.pyplot(fig)

        st.markdown("</section></div>", unsafe_allow_html=True)

        # 구간별 속도 + 문장 목록
        if wpm_data["segments"]:
            speed_rows = ""
            for seg in wpm_data["segments"]:
                wpm_val = seg["wpm"]
                if wpm_val < 80:
                    badge_color = "#ef4444"
                    badge_text = "느림"
                elif wpm_val > 120:
                    badge_color = "#f59e0b"
                    badge_text = "빠름"
                else:
                    badge_color = "#22c55e"
                    badge_text = "적정"

                speed_rows += f"""
                <tr>
                  <td style="padding:8px 12px; font-size:13px; color:#64748b;">{seg['start']:.0f}s ~ {seg['end']:.0f}s</td>
                  <td style="padding:8px 12px; font-size:13px; font-weight:600;">{seg['text']}</td>
                  <td style="padding:8px 12px; text-align:center;">
                    <span style="background:{badge_color}; color:#fff; padding:2px 8px; border-radius:99px; font-size:11px; font-weight:700;">{wpm_val} WPM · {badge_text}</span>
                  </td>
                </tr>"""

            st.html(CARD_CSS + f"""
            <div class="pai-root">
              <div style="overflow-x:auto;">
                <table style="width:100%; border-collapse:collapse; background:#fff; border-radius:12px; overflow:hidden; border:1px solid #ececf6;">
                  <thead>
                    <tr style="background:#f8f8fc;">
                      <th style="padding:10px 12px; text-align:left; font-size:12px; color:#64748b; font-weight:600;">시간</th>
                      <th style="padding:10px 12px; text-align:left; font-size:12px; color:#64748b; font-weight:600;">문장</th>
                      <th style="padding:10px 12px; text-align:center; font-size:12px; color:#64748b; font-weight:600;">속도</th>
                    </tr>
                  </thead>
                  <tbody>{speed_rows}</tbody>
                </table>
              </div>
            </div>
            """)

        # ===== 4. 논리 구조 =====
        intro_class = "pai-step--ok" if logic["has_intro"] else "pai-step--fail"
        body_class = "pai-step--ok" if logic["has_body"] else "pai-step--fail"
        conclusion_class = "pai-step--ok" if logic["has_conclusion"] else "pai-step--fail"
        intro_check = "✓" if logic["has_intro"] else "✗"
        body_check = "✓" if logic["has_body"] else "✗"
        conclusion_check = "✓" if logic["has_conclusion"] else "✗"

        logic_count = sum([logic["has_intro"], logic["has_body"], logic["has_conclusion"]])
        logic_pct_display = round(logic_count / 3 * 100)

        st.markdown(f"""
        <div class="pai-root">
          <section class="pai-card">
            <div class="pai-card__head">
              <div class="pai-card__icon pai-card__icon--blue">🧭</div>
              <h3 class="pai-card__title">논리 구조</h3>
              <span class="pai-card__counter pai-card__counter--success">완성도 {logic_pct_display}%</span>
            </div>
            <div class="pai-steps">
              <div class="pai-step {intro_class}">
                <span class="pai-step__check">{intro_check}</span>
                <div class="pai-step__num">STEP 1</div>
                <div class="pai-step__name">서론</div>
              </div>
              <div class="pai-step {body_class}">
                <span class="pai-step__check">{body_check}</span>
                <div class="pai-step__num">STEP 2</div>
                <div class="pai-step__name">본론</div>
              </div>
              <div class="pai-step {conclusion_class}">
                <span class="pai-step__check">{conclusion_check}</span>
                <div class="pai-step__num">STEP 3</div>
                <div class="pai-step__name">결론</div>
              </div>
            </div>
            <p style="margin-top:14px; font-size:14px; color:#475569;">{logic['comment']}</p>
          </section>
        </div>
        """, unsafe_allow_html=True)

        # ===== 5. 표현 오류 =====
        if "expression_errors" in analysis and analysis["expression_errors"]:
            error_diffs = ""
            for err in analysis["expression_errors"]:
                error_diffs += f"""
                <div class="pai-diff">
                  <div class="pai-diff__side">
                    <div class="pai-diff__label pai-diff__label--before">잘못된 표현</div>
                    <div class="pai-diff__text pai-diff__text--strike">{err['original']}</div>
                  </div>
                  <div class="pai-diff__arrow">→</div>
                  <div class="pai-diff__side">
                    <div class="pai-diff__label pai-diff__label--after">추천 표현</div>
                    <div class="pai-diff__text pai-diff__text--good">{err['corrected']}</div>
                  </div>
                </div>"""

            st.html(CARD_CSS + f"""
            <div class="pai-root">
              <section class="pai-card">
                <div class="pai-card__head">
                  <div class="pai-card__icon pai-card__icon--danger">⚠️</div>
                  <h3 class="pai-card__title">표현 오류</h3>
                  <span class="pai-card__counter">{len(analysis['expression_errors'])}건</span>
                </div>
                {error_diffs}
              </section>
            </div>
            """)
        else:
            st.html(CARD_CSS + """
            <div class="pai-root">
              <section class="pai-card">
                <div class="pai-card__head">
                  <div class="pai-card__icon pai-card__icon--danger">⚠️</div>
                  <h3 class="pai-card__title">표현 오류</h3>
                  <span class="pai-card__counter">0건</span>
                </div>
                <p style="color:#22c55e; font-size:14px; font-weight:600;">✅ 표현이 전부 적절하여 수정할 표현이 없습니다.</p>
              </section>
            </div>
            """)

        # ===== 6. 개선 문장 =====
        improvement_html = ""
        for imp in analysis["improvements"]:
            improvement_html += f"""
            <div class="pai-sentence pai-sentence--orig">
              <span class="pai-sentence__tag pai-sentence__tag--orig">원문</span>
              <div class="pai-sentence__body">{imp['original']}</div>
            </div>
            <div class="pai-sentence__divider">↓</div>
            <div class="pai-sentence pai-sentence--new">
              <span class="pai-sentence__tag pai-sentence__tag--new">개선안</span>
              <div class="pai-sentence__body">{imp['improved']}</div>
              <div class="pai-sentence__reason">💡 {imp['reason']}</div>
            </div>"""

        st.html(CARD_CSS + f"""
        <div class="pai-root">
          <section class="pai-card">
            <div class="pai-card__head">
              <div class="pai-card__icon pai-card__icon--indigo">✨</div>
              <h3 class="pai-card__title">개선 문장 제안</h3>
            </div>
            {improvement_html}
          </section>
        </div>
        """)

        # ===== 7. 발표 원문 =====
        st.markdown("""
        <div class="pai-root">
          <section class="pai-card">
            <div class="pai-card__head">
              <div class="pai-card__icon pai-card__icon--purple">📝</div>
              <h3 class="pai-card__title">발표 원문</h3>
            </div>
        """, unsafe_allow_html=True)

        st.text_area("STT 변환 결과", stt_result["text"], height=200, disabled=True)

        st.markdown("</section></div>", unsafe_allow_html=True)

        # ===== Footer =====
        st.markdown("""
        <div class="pai-root">
          <div class="pai-footer">PresentAI · 발표를 더 명확하게</div>
        </div>
        """, unsafe_allow_html=True)

    except Exception as e:
        st.error(f"❌ 오류가 발생했습니다: {str(e)}")

    finally:
        os.unlink(tmp_path)