Update app.py

app.py

@@ -320,8 +320,9 @@ CRITICAL: Do NOT overthink. Do NOT deliberate over conditions, edge cases, or re
 """
     
     # DEBUG: Log prompt text
-    with open(os.path.join(LOG_DIR, "debug_vlm_prompt.txt"), "w", encoding="utf-8") as f:
-        f.write(prompt_text)
+    if not IS_HF:
+        with open(os.path.join(LOG_DIR, "debug_vlm_prompt.txt"), "w", encoding="utf-8") as f:
+            f.write(prompt_text)
 
     content = []
     pil_images = []
@@ -513,8 +514,9 @@ CRITICAL: Do NOT overthink. Do NOT deliberate over conditions, edge cases, or re
         global_stop_thinking[0] = False
 
         # DEBUG: Log raw output text
-        with open(os.path.join(LOG_DIR, "debug_vlm_output.txt"), "w", encoding="utf-8") as f:
-            f.write(output_text)
+        if not IS_HF:
+            with open(os.path.join(LOG_DIR, "debug_vlm_output.txt"), "w", encoding="utf-8") as f:
+                f.write(output_text)
             
     except Exception as e:
         print(f"Error during Transformers inference: {e}")
@@ -568,8 +570,9 @@ Korean words:
 """
 
     # DEBUG: Log translation prompt text
-    with open(os.path.join(LOG_DIR, "debug_translate_prompt.txt"), "w", encoding="utf-8") as f:
-        f.write(prompt_text)
+    if not IS_HF:
+        with open(os.path.join(LOG_DIR, "debug_translate_prompt.txt"), "w", encoding="utf-8") as f:
+            f.write(prompt_text)
 
     messages = [
         {
@@ -606,8 +609,9 @@ Korean words:
         output_text = processor.batch_decode(generated_ids, skip_special_tokens=True)[0]
         
         # DEBUG: Log raw translation output text
-        with open(os.path.join(LOG_DIR, "debug_translate_output.txt"), "w", encoding="utf-8") as f:
-            f.write(output_text)
+        if not IS_HF:
+            with open(os.path.join(LOG_DIR, "debug_translate_output.txt"), "w", encoding="utf-8") as f:
+                f.write(output_text)
             
     except Exception as e:
         print(f"Error during Transformers text inference: {e}")
@@ -702,8 +706,9 @@ def process_pdf(pdf_file, url_input, audio_file_input, yt_url_input, yt_cookies_
                 return
                 
             # Log the transcription
-            with open(os.path.join(LOG_DIR, "debug_yt_transcription.txt"), "w", encoding="utf-8") as f:
-                f.write(f"Title: {yt_title}\n\n{content_text}")
+            if not IS_HF:
+                with open(os.path.join(LOG_DIR, "debug_yt_transcription.txt"), "w", encoding="utf-8") as f:
+                    f.write(f"Title: {yt_title}\n\n{content_text}")
         elif is_audio_upload:
             progress(0, desc="Transcribing uploaded audio with Cohere ASR...")
             content_text = transcribe_audio_with_asr(audio_file_input)
@@ -714,8 +719,9 @@ def process_pdf(pdf_file, url_input, audio_file_input, yt_url_input, yt_cookies_
                 yield "<p>Could not transcribe any text from the uploaded audio.</p>", current_source_hash, None, "", "", [], extracted_audio_path
                 return
                 
-            with open(os.path.join(LOG_DIR, "debug_audio_transcription.txt"), "w", encoding="utf-8") as f:
-                f.write(content_text)
+            if not IS_HF:
+                with open(os.path.join(LOG_DIR, "debug_audio_transcription.txt"), "w", encoding="utf-8") as f:
+                    f.write(content_text)
         elif is_url:
             progress(0, desc="Fetching Website...")
             content_text, images = extract_website_content(url_input.strip())
@@ -797,8 +803,9 @@ def process_pdf(pdf_file, url_input, audio_file_input, yt_url_input, yt_cookies_
             )
             
             # DEBUG: Save audio locally
-            wav_1d = wav.squeeze()
-            sf.write(os.path.join(LOG_DIR, f"debug_audio_{i}.wav"), wav_1d, tts.sample_rate, format='WAV')
+            if not IS_HF:
+                wav_1d = wav.squeeze()
+                sf.write(os.path.join(LOG_DIR, f"debug_audio_{i}.wav"), wav_1d, tts.sample_rate, format='WAV')
             
             audio_data_uri = numpy_to_base64_audio(wav, tts.sample_rate)
             item['audio_uri'] = audio_data_uri
@@ -1199,8 +1206,9 @@ def process_pdf_force(partial_text, pdf_file, url_input, translit_lang, translit
                 import numpy as np
                 import soundfile as sf
                 
-                audio_path = os.path.join(LOG_DIR, f"audio_{i}.wav")
-                sf.write(audio_path, wav, 24000)
+                if not IS_HF:
+                    audio_path = os.path.join(LOG_DIR, f"audio_{i}.wav")
+                    sf.write(audio_path, wav, 24000)
                 item["audio_uri"] = numpy_to_base64_audio(wav, tts.sample_rate)
             except Exception as e:
                 print(f"Failed to generate audio for {korean}: {e}")
@@ -1692,14 +1700,17 @@ def create_demo():
     example_audio = get_example_audio()
     
     custom_theme = gr.themes.Soft(
-        primary_hue="violet",
-        secondary_hue="indigo",
-        neutral_hue="slate",
-        font=[gr.themes.GoogleFont("Outfit"), "ui-sans-serif", "sans-serif"]
+        primary_hue="amber",
+        secondary_hue="stone",
+        neutral_hue="stone",
+        font=[gr.themes.GoogleFont("Outfit"), gr.themes.GoogleFont("Noto Serif KR"), "ui-sans-serif", "sans-serif"]
     )
 
     css = """
-    /* ── Animated Background ── */
+    /* ── 한국 (Hanguk) Inspired Theme ── */
+    @import url('https://fonts.googleapis.com/css2?family=Noto+Serif+KR:wght@400;700;900&family=Outfit:wght@400;600;700;800&display=swap');
+
+    /* ── Animated Background — ink wash 수묵화 ── */
     @keyframes gradientBG {
         0% { background-position: 0% 50%; }
         50% { background-position: 100% 50%; }
@@ -1707,25 +1718,28 @@ def create_demo():
     }
 
     body, .gradio-container {
-        background: linear-gradient(-45deg, #0f2027, #203a43, #2c5364, #1a2a6c, #112240) !important;
+        background: linear-gradient(-45deg, #0a0a0f, #1a1008, #0d1a12, #12080a, #0f0f1a) !important;
         background-size: 400% 400% !important;
-        animation: gradientBG 15s ease infinite !important;
+        animation: gradientBG 20s ease infinite !important;
         background-attachment: fixed !important;
-        color: #e2e8f0 !important;
-        font-family: 'Outfit', sans-serif !important;
-        
-        /* Force internal Gradio background variables to transparent */
+        color: #e8e0d4 !important;
+        font-family: 'Outfit', 'Noto Serif KR', sans-serif !important;
+
+        /* Force internal Gradio variables */
         --block-label-background-fill: transparent !important;
         --block-title-background-fill: transparent !important;
         --background-fill-primary: transparent !important;
         --background-fill-secondary: transparent !important;
         --block-background-fill: transparent !important;
-        --input-background-fill: rgba(0, 0, 0, 0.2) !important;
-        --input-background-fill-focus: rgba(0, 0, 0, 0.3) !important;
+        --input-background-fill: rgba(0, 0, 0, 0.25) !important;
+        --input-background-fill-focus: rgba(0, 0, 0, 0.35) !important;
         --panel-background-fill: transparent !important;
+        --checkbox-background-color: rgba(0, 0, 0, 0.2) !important;
+        --table-even-background-fill: transparent !important;
+        --table-odd-background-fill: rgba(0, 0, 0, 0.1) !important;
     }
 
-    /* ── AGGRESSIVE BACKGROUND OVERRIDES FOR FIREFOX & ALL ELEMENTS ── */
+    /* ── AGGRESSIVE BACKGROUND OVERRIDES FOR FIREFOX ── */
     .gradio-container .tabitem,
     .gradio-container .wrap,
     .gradio-container .form,
@@ -1735,33 +1749,67 @@ def create_demo():
     .gradio-container textarea,
     .gradio-container select,
     .gradio-container .dropdown-container,
+    .gradio-container .block,
+    .gradio-container .secondary-wrap,
+    .gradio-container .contain {
+        background: rgba(15, 12, 8, 0.5) !important;
+        background-color: rgba(15, 12, 8, 0.5) !important;
+    }
+
+    /* ── FILE UPLOAD / PREVIEW — fix white backgrounds ── */
     .gradio-container .file-preview,
+    .gradio-container .file-preview *,
+    .gradio-container .file-preview table,
+    .gradio-container .file-preview tr,
+    .gradio-container .file-preview td,
+    .gradio-container .file-preview th,
+    .gradio-container .file-preview tbody,
+    .gradio-container .file-preview thead,
     .gradio-container .upload-button,
-    .gradio-container .block {
-        background: rgba(15, 23, 42, 0.4) !important;
-        background-color: rgba(15, 23, 42, 0.4) !important;
+    .gradio-container .file-upload,
+    .gradio-container [data-testid="file"],
+    .gradio-container [data-testid="file"] *,
+    .gradio-container .file,
+    .gradio-container .file *,
+    .gradio-container .upload-text,
+    .gradio-container .icon-wrap,
+    .gradio-container .waveform-container,
+    .gradio-container .empty,
+    .gradio-container .empty *,
+    .gradio-container .wrap.default {
+        background: rgba(10, 8, 5, 0.4) !important;
+        background-color: rgba(10, 8, 5, 0.4) !important;
+        color: #e8e0d4 !important;
+        border-color: rgba(196, 164, 105, 0.15) !important;
+    }
+    .gradio-container .file-preview a,
+    .gradio-container .file a {
+        color: #c4a469 !important;
+    }
+
+    /* ── Glassmorphism Panels — hanji paper texture feel ── */
+    .gradio-container .form,
+    .gradio-container .panel,
+    .gradio-container .box {
+        background: rgba(15, 12, 8, 0.45) !important;
         backdrop-filter: blur(20px) !important;
         -webkit-backdrop-filter: blur(20px) !important;
-    }
-    
-    .gradio-container .form, .gradio-container .panel, .gradio-container .box {
-        border-radius: 24px !important;
-        border: 1px solid rgba(255, 255, 255, 0.1) !important;
-        box-shadow: 0 15px 35px rgba(0, 0, 0, 0.2), inset 0 0 0 1px rgba(255, 255, 255, 0.05) !important;
+        border-radius: 16px !important;
+        border: 1px solid rgba(196, 164, 105, 0.12) !important;
+        box-shadow: 0 12px 30px rgba(0, 0, 0, 0.3), inset 0 0 0 1px rgba(196, 164, 105, 0.05) !important;
     }
 
-    /* ── SELECTION / HIGHLIGHT COLOR ── */
+    /* ── Selection — warm gold ── */
     ::selection {
-        background: rgba(139, 92, 246, 0.5) !important;
+        background: rgba(196, 164, 105, 0.45) !important;
         color: #ffffff !important;
     }
     ::-moz-selection {
-        background: rgba(139, 92, 246, 0.5) !important;
+        background: rgba(196, 164, 105, 0.45) !important;
         color: #ffffff !important;
     }
 
-    /* ── GLOBAL BACKGROUND OVERRIDES (Dark Theme) ── */
-    /* Force label pills to be transparent so white text isn't invisible */
+    /* ── GLOBAL BACKGROUND OVERRIDES ── */
     .gradio-container label,
     .gradio-container .label-wrap,
     .gradio-container .block label,
@@ -1775,8 +1823,7 @@ def create_demo():
         box-shadow: none !important;
     }
 
-    /* ── GLOBAL TEXT OVERRIDES (Dark Theme) ── */
-    /* Force ALL text to be light on dark background */
+    /* ── GLOBAL TEXT — warm parchment tones ── */
     .gradio-container,
     .gradio-container label,
     .gradio-container .label-wrap,
@@ -1797,46 +1844,51 @@ def create_demo():
     .gradio-container input,
     .gradio-container select,
     .gradio-container textarea {
-        color: #e2e8f0 !important;
+        color: #e8e0d4 !important;
     }
 
-    /* ── Headings ── */
+    /* ── Heading — 서예 calligraphy style ── */
     h1 {
         text-align: center;
-        background: linear-gradient(to right, #c084fc, #60a5fa);
+        background: linear-gradient(135deg, #c4a469, #e8c97a, #a0825a);
         -webkit-background-clip: text;
         -webkit-text-fill-color: transparent;
-        font-weight: 800 !important;
-        font-size: 2.2em !important;
+        font-weight: 900 !important;
+        font-size: 2.4em !important;
         margin-bottom: 0.3em !important;
-        letter-spacing: -0.5px;
+        letter-spacing: 1px;
         line-height: 1.2 !important;
+        font-family: 'Noto Serif KR', 'Outfit', serif !important;
     }
 
-    /* ── TAB LABELS (critical fix) ── */
+    /* ── TAB LABELS — 단청 style ── */
     .gradio-container .tabs .tab-nav button,
     .gradio-container .tabs .tab-nav button span {
-        color: #94a3b8 !important;
+        color: #8a7a65 !important;
         font-weight: 600 !important;
         font-size: 14px !important;
         padding: 10px 16px !important;
         background: transparent !important;
         border: none !important;
         border-bottom: 2px solid transparent !important;
-        transition: all 0.25s ease !important;
+        transition: all 0.3s ease !important;
     }
     .gradio-container .tabs .tab-nav button.selected,
     .gradio-container .tabs .tab-nav button.selected span,
     .gradio-container .tabs .tab-nav button[aria-selected="true"],
     .gradio-container .tabs .tab-nav button[aria-selected="true"] span {
-        color: #c084fc !important;
-        border-bottom-color: #8b5cf6 !important;
-        background: rgba(139, 92, 246, 0.1) !important;
+        color: #c4a469 !important;
+        border-bottom-color: #c4a469 !important;
+        background: rgba(196, 164, 105, 0.08) !important;
     }
     .gradio-container .tabs .tab-nav button:hover,
     .gradio-container .tabs .tab-nav button:hover span {
-        color: #e2e8f0 !important;
-        background: rgba(255, 255, 255, 0.05) !important;
+        color: #e8e0d4 !important;
+        background: rgba(196, 164, 105, 0.05) !important;
+    }
+    .gradio-container .tabs .tab-nav {
+        background: transparent !important;
+        border-bottom: 1px solid rgba(196, 164, 105, 0.15) !important;
     }
 
     /* ── SLIDER / RANGE LABELS ── */
@@ -1844,13 +1896,12 @@ def create_demo():
     .gradio-container .range-slider,
     .gradio-container input[type="number"],
     .gradio-container input[type="number"]::-moz-placeholder {
-        color: #e2e8f0 !important;
+        color: #e8e0d4 !important;
     }
-    /* Slider min/max number labels */
     .gradio-container .wrap.default span,
     .gradio-container .head span,
     .gradio-container .range_slider span {
-        color: #94a3b8 !important;
+        color: #8a7a65 !important;
     }
 
     /* ── ACCORDION HEADERS ── */
@@ -1858,7 +1909,7 @@ def create_demo():
     .gradio-container .accordion > .label-wrap,
     .gradio-container details > summary,
     .gradio-container details > summary span {
-        color: #e2e8f0 !important;
+        color: #e8e0d4 !important;
         font-weight: 600 !important;
     }
 
@@ -1870,35 +1921,33 @@ def create_demo():
     .gradio-container .md em,
     .gradio-container .md h3,
     .gradio-container .md h2 {
-        color: #cbd5e1 !important;
+        color: #d4cbbe !important;
     }
     .gradio-container .md strong {
-        color: #f1f5f9 !important;
+        color: #f0e8da !important;
     }
     .gradio-container .md a {
-        color: #60a5fa !important;
+        color: #c4a469 !important;
     }
-    /* Subheading markdown like "### ⚙️ Customization Settings" */
     .gradio-container .prose h3,
     .gradio-container h3 {
-        color: #c084fc !important;
+        color: #c4a469 !important;
         font-weight: 700 !important;
         font-size: 1.05em !important;
     }
 
-    /* ── HINT TEXT (small italic helpers) ── */
+    /* ── HINT TEXT ── */
     .hint-text, .hint-text p, .hint-text * {
-        color: #64748b !important;
+        color: #6b5e4f !important;
         font-size: 13px !important;
     }
 
     /* ── FILE UPLOAD ── */
     .gradio-container .file-upload,
-    .gradio-container .upload-button,
-    .gradio-container .file-preview {
-        background: rgba(0, 0, 0, 0.2) !important;
-        border: 1px dashed rgba(255, 255, 255, 0.15) !important;
-        color: #94a3b8 !important;
+    .gradio-container .upload-button {
+        background: rgba(0, 0, 0, 0.25) !important;
+        border: 1px dashed rgba(196, 164, 105, 0.2) !important;
+        color: #8a7a65 !important;
         border-radius: 12px !important;
     }
 
@@ -1906,116 +1955,115 @@ def create_demo():
     .gradio-container .dropdown-container,
     .gradio-container .secondary-wrap,
     .gradio-container ul[role="listbox"] {
-        background: rgba(15, 23, 42, 0.95) !important;
-        border: 1px solid rgba(255, 255, 255, 0.1) !important;
-        color: #e2e8f0 !important;
+        background: rgba(15, 12, 8, 0.95) !important;
+        border: 1px solid rgba(196, 164, 105, 0.15) !important;
+        color: #e8e0d4 !important;
     }
     .gradio-container ul[role="listbox"] li {
-        color: #e2e8f0 !important;
+        color: #e8e0d4 !important;
     }
     .gradio-container ul[role="listbox"] li:hover {
-        background: rgba(139, 92, 246, 0.2) !important;
+        background: rgba(196, 164, 105, 0.15) !important;
     }
 
-    /* ── BUTTONS ── */
+    /* ── BUTTONS — 한복 inspired ── */
     button.primary {
-        background: linear-gradient(135deg, #8b5cf6, #3b82f6) !important;
+        background: linear-gradient(135deg, #b8860b, #c4a469, #8b6914) !important;
         border: none !important;
-        box-shadow: 0 0 20px rgba(139, 92, 246, 0.5) !important;
+        box-shadow: 0 0 20px rgba(196, 164, 105, 0.35) !important;
         transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
         font-weight: 700 !important;
         letter-spacing: 1px !important;
         text-transform: uppercase;
-        border-radius: 16px !important;
-        color: white !important;
+        border-radius: 12px !important;
+        color: #0a0a0f !important;
     }
     button.primary:hover {
         transform: translateY(-3px) scale(1.02) !important;
-        box-shadow: 0 0 30px rgba(139, 92, 246, 0.8) !important;
+        box-shadow: 0 0 30px rgba(196, 164, 105, 0.6) !important;
+        color: #0a0a0f !important;
     }
     button.secondary {
-        background: rgba(100, 116, 139, 0.2) !important;
-        border: 1px solid rgba(100, 116, 139, 0.4) !important;
-        color: #e2e8f0 !important;
-        border-radius: 14px !important;
+        background: rgba(100, 90, 70, 0.15) !important;
+        border: 1px solid rgba(196, 164, 105, 0.2) !important;
+        color: #e8e0d4 !important;
+        border-radius: 12px !important;
         font-weight: 600 !important;
         transition: all 0.25s ease !important;
     }
     button.secondary:hover {
-        background: rgba(100, 116, 139, 0.35) !important;
-        border-color: rgba(139, 92, 246, 0.5) !important;
-        color: #f8fafc !important;
+        background: rgba(196, 164, 105, 0.12) !important;
+        border-color: rgba(196, 164, 105, 0.35) !important;
+        color: #f0e8da !important;
         transform: translateY(-2px) !important;
     }
     button.stop {
-        background: linear-gradient(135deg, #ef4444, #b91c1c) !important;
+        background: linear-gradient(135deg, #8b2020, #c0392b) !important;
         border: none !important;
-        box-shadow: 0 0 20px rgba(239, 68, 68, 0.5) !important;
+        box-shadow: 0 0 20px rgba(192, 57, 43, 0.4) !important;
         transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
         font-weight: 700 !important;
         text-transform: uppercase;
         letter-spacing: 1px !important;
-        border-radius: 16px !important;
-        color: white !important;
+        border-radius: 12px !important;
+        color: #f0e8da !important;
     }
     button.stop:hover {
         transform: translateY(-3px) scale(1.02) !important;
-        box-shadow: 0 0 30px rgba(239, 68, 68, 0.8) !important;
+        box-shadow: 0 0 30px rgba(192, 57, 43, 0.6) !important;
     }
 
     /* ── INPUTS ── */
     textarea, input[type="text"], input[type="number"], select {
         background: rgba(0, 0, 0, 0.3) !important;
-        border: 1px solid rgba(255,255,255,0.1) !important;
-        border-radius: 12px !important;
-        color: #f8fafc !important;
+        border: 1px solid rgba(196, 164, 105, 0.12) !important;
+        border-radius: 10px !important;
+        color: #f0e8da !important;
         transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
     }
     textarea:focus, input[type="text"]:focus {
-        border-color: #a855f7 !important;
-        box-shadow: 0 0 15px rgba(168, 85, 247, 0.4), inset 0 0 0 1px rgba(168, 85, 247, 0.4) !important;
+        border-color: #c4a469 !important;
+        box-shadow: 0 0 15px rgba(196, 164, 105, 0.25), inset 0 0 0 1px rgba(196, 164, 105, 0.25) !important;
     }
-    /* Textbox label */
     .gradio-container .textbox label span,
     .gradio-container .input-label {
-        color: #c084fc !important;
+        color: #c4a469 !important;
         font-weight: 600 !important;
     }
 
     /* ── EXPORT / DOWNLOAD FILE COMPONENT ── */
     .gradio-container .download,
     .gradio-container .file a {
-        color: #60a5fa !important;
+        color: #c4a469 !important;
     }
 
     /* ── GALLERY ── */
     .gradio-container .gallery-item {
         background: rgba(0, 0, 0, 0.3) !important;
-        border: 1px solid rgba(255, 255, 255, 0.08) !important;
-        border-radius: 12px !important;
+        border: 1px solid rgba(196, 164, 105, 0.1) !important;
+        border-radius: 10px !important;
     }
 
-    /* ── INFO / TOOLTIP TEXT ── */
+    /* ── INFO / TOOLTIP ── */
     .gradio-container .info,
     .gradio-container .wrap .info {
-        color: #64748b !important;
+        color: #6b5e4f !important;
     }
 
-    /* ── BLOCK BACKGROUNDS (inner panels) ── */
+    /* ── BLOCK BACKGROUNDS ── */
     .gradio-container .block {
         background: transparent !important;
     }
     .gradio-container .contain {
         background: transparent !important;
     }
-    /* Tab panel content area */
     .gradio-container .tabitem {
         background: transparent !important;
     }
 
     /* ── AUDIO PLAYER ── */
     .gradio-container audio {
-        filter: invert(0.85) hue-rotate(180deg);
+        filter: invert(0.85) hue-rotate(180deg) sepia(0.15);
         border-radius: 8px;
     }
 
@@ -2027,7 +2075,7 @@ def create_demo():
         display: none !important;
     }
 
-    /* ── MAIN PROGRESS BAR STYLING ── */
+    /* ── MAIN PROGRESS BAR ── */
     .gradio-container .progress-container,
     .gradio-container .progress-text {
         color: #ffffff !important;
@@ -2035,18 +2083,24 @@ def create_demo():
         text-shadow: 0px 1px 4px rgba(0,0,0,0.9) !important;
     }
     .gradio-container .progress-level {
-        background: linear-gradient(90deg, #8b5cf6, #c084fc) !important;
+        background: linear-gradient(90deg, #b8860b, #c4a469) !important;
     }
 
-    /* ── SCROLLBAR (Firefox + Chrome) ── */
+    /* ── SCROLLBAR — ink brush style ── */
     * {
         scrollbar-width: thin;
-        scrollbar-color: rgba(139, 92, 246, 0.4) transparent;
+        scrollbar-color: rgba(196, 164, 105, 0.3) transparent;
     }
-    ::-webkit-scrollbar { width: 6px; height: 6px; }
+    ::-webkit-scrollbar { width: 5px; height: 5px; }
     ::-webkit-scrollbar-track { background: transparent; }
-    ::-webkit-scrollbar-thumb { background: rgba(139, 92, 246, 0.4); border-radius: 3px; }
-    ::-webkit-scrollbar-thumb:hover { background: rgba(139, 92, 246, 0.6); }
+    ::-webkit-scrollbar-thumb { background: rgba(196, 164, 105, 0.3); border-radius: 3px; }
+    ::-webkit-scrollbar-thumb:hover { background: rgba(196, 164, 105, 0.5); }
+
+    /* ── Korean decorative border on main content ── */
+    .gradio-container > .main {
+        border-top: 3px solid transparent !important;
+        border-image: linear-gradient(90deg, transparent, rgba(196, 164, 105, 0.3), rgba(192, 57, 43, 0.2), rgba(196, 164, 105, 0.3), transparent) 1 !important;
+    }
     """
     # Force dark mode via JavaScript so Gradio's internal CSS variables default to dark
     dark_mode_js = """
@@ -2401,8 +2455,9 @@ if __name__ == "__main__":
                 wav, dur = tts.synthesize(
                     text=korean_word,
                     voice_style=voice_style,
-                    language="ko",
-                    speed=0.9
+                    lang="ko",
+                    speed=0.7,
+                    total_steps=12,
                 )
                 item["audio_uri"] = numpy_to_base64_audio(wav, tts.sample_rate)
             except Exception as e: