Add ghunnah/madd durations

recitation_analysis/duration_analysis/ghunnah_analysis.py

@@ -276,13 +276,15 @@ def _find_idgham_shafawi_target(
     next_word = words[source_word_idx + 1]
 
     for letter in next_word.letters:
-        if letter.is_silent:
-            continue
-
-        # Look for meem with shaddah
+        # Check for target meem first (it may be silent when followed by vowel carrier)
         if letter.char == '\u0645' and letter.shaddah:
             return (source_word_idx + 1, letter.index, next_word.location, _get_letter_text(letter), _get_word_text(next_word))
 
+        # Skip silent letters (like alif wasl)
+        if letter.is_silent:
+            continue
+
+        # First non-silent letter wasn't target - stop
         break
 
     return None

recitation_analysis/ui/components.py

@@ -190,19 +190,10 @@ def render_collapsible_section(
     """
     open_attr = '' if collapsed else 'open'
 
-    # Status-based colors
-    if status == 'incorrect':
-        accent_color = '#e53935'  # red
-        bg_color = 'rgba(229, 57, 53, 0.08)'
-        border_color = 'rgba(229, 57, 53, 0.3)'
-    elif status == 'correct':
-        accent_color = '#43a047'  # green
-        bg_color = 'rgba(67, 160, 71, 0.08)'
-        border_color = 'rgba(67, 160, 71, 0.3)'
-    else:
-        accent_color = 'var(--body-text-color, inherit)'
-        bg_color = 'var(--background-fill-primary, #1f2937)'
-        border_color = 'var(--border-color-primary, #374151)'
+    # Use app theme color (orange) for all statuses
+    accent_color = '#f97316'  # app theme orange
+    bg_color = 'rgba(249, 115, 22, 0.08)'
+    border_color = 'rgba(249, 115, 22, 0.3)'
 
     return f'''
     <style>

ui/builder.py

@@ -207,7 +207,8 @@ def build_interface() -> gr.Blocks:
                 components["audio_input"] = gr.Audio(
                     sources=["microphone", "upload"],
                     type="filepath",
-                    label="Record or Upload Your Recitation"
+                    label="Record or Upload Your Recitation",
+                    show_label=False
                 )
 
                 # Analyze button

ui/components/audio_input.py

@@ -19,7 +19,8 @@ def create_audio_input_section() -> dict:
     audio_input = gr.Audio(
         sources=["microphone", "upload"],
         type="numpy",
-        label="🎤 Record or Upload Your Recitation"
+        label="Record or Upload Your Recitation",
+        show_label=False
     )
 
     analyze_btn = gr.Button("Analyze", variant="primary", visible=False)

ui/components/reference_audio.py

@@ -59,9 +59,10 @@ def create_reference_audio_components() -> dict:
                 elem_classes=["ref-audio-nav-btn"]
             )
 
-        # Audio player with label (always visible)
+        # Audio player (always visible)
         audio_player = gr.Audio(
-            label="🔊 Reference Reciter",
+            label="Reference Reciter",
+            show_label=False,
             type="filepath",
             interactive=False,
             elem_classes=["ref-audio-player"]

ui/handlers/reference_audio.py

@@ -10,6 +10,14 @@ import gradio as gr
 from recitation_engine.reference_audio import get_verse_audio_path, parse_verse_range
 
 
+def _get_verse_number(verse_key: str) -> int:
+    """Extract verse number from verse key like '1:5' -> 5."""
+    try:
+        return int(verse_key.split(":")[1])
+    except (IndexError, ValueError):
+        return 0
+
+
 def on_ref_audio_prev_click(
     current_idx: int,
     keys: List[str]
@@ -23,6 +31,7 @@ def on_ref_audio_prev_click(
 
     Returns:
         Tuple of (new_index, slider_value, audio_path)
+        slider_value is actual verse number, not index
     """
     if not keys:
         return 0, 0, None
@@ -30,8 +39,9 @@ def on_ref_audio_prev_click(
     new_idx = max(0, current_idx - 1)
     verse_key = keys[new_idx]
     audio_path = get_verse_audio_path(verse_key)
+    slider_val = _get_verse_number(verse_key)
 
-    return new_idx, new_idx, audio_path
+    return new_idx, slider_val, audio_path
 
 
 def on_ref_audio_next_click(
@@ -47,6 +57,7 @@ def on_ref_audio_next_click(
 
     Returns:
         Tuple of (new_index, slider_value, audio_path)
+        slider_value is actual verse number, not index
     """
     if not keys:
         return 0, 0, None
@@ -54,8 +65,9 @@ def on_ref_audio_next_click(
     new_idx = min(len(keys) - 1, current_idx + 1)
     verse_key = keys[new_idx]
     audio_path = get_verse_audio_path(verse_key)
+    slider_val = _get_verse_number(verse_key)
 
-    return new_idx, new_idx, audio_path
+    return new_idx, slider_val, audio_path
 
 
 def on_ref_audio_slider_change(
@@ -66,22 +78,29 @@ def on_ref_audio_slider_change(
     Handle slider change - navigate to specific verse.
 
     Args:
-        slider_val: Slider value (verse index, may be float)
+        slider_val: Slider value (actual verse number, may be float)
         keys: List of verse keys
 
     Returns:
         Tuple of (new_index, audio_path)
     """
+    if not keys:
+        return 0, None
+
     # Handle decimal input by rounding to nearest integer
     slider_val = int(round(slider_val))
 
-    if not keys or slider_val < 0 or slider_val >= len(keys):
+    # Convert verse number to index
+    first_verse = _get_verse_number(keys[0])
+    idx = slider_val - first_verse
+
+    if idx < 0 or idx >= len(keys):
         return 0, None
 
-    verse_key = keys[slider_val]
+    verse_key = keys[idx]
     audio_path = get_verse_audio_path(verse_key)
 
-    return slider_val, audio_path
+    return idx, audio_path
 
 
 def init_ref_audio_for_verse_range(
@@ -90,7 +109,7 @@ def init_ref_audio_for_verse_range(
     List[str],  # verse_keys state
     int,        # verse_index state
     gr.update,  # nav_row visibility
-    gr.update,  # slider max + value
+    gr.update,  # slider min, max, value
     Optional[str]  # audio_path
 ]:
     """
@@ -109,7 +128,7 @@ def init_ref_audio_for_verse_range(
             [],                              # verse_keys
             0,                               # verse_index
             gr.update(visible=False),        # nav_row
-            gr.update(maximum=0, value=0),   # slider
+            gr.update(minimum=0, maximum=0, value=0),  # slider
             None                             # audio_path
         )
 
@@ -119,7 +138,7 @@ def init_ref_audio_for_verse_range(
             [],
             0,
             gr.update(visible=False),
-            gr.update(maximum=0, value=0),
+            gr.update(minimum=0, maximum=0, value=0),
             None
         )
 
@@ -127,8 +146,13 @@ def init_ref_audio_for_verse_range(
 
     # Load first verse audio
     first_key = keys[0]
+    last_key = keys[-1]
     audio_path = get_verse_audio_path(first_key)
 
+    # Get actual verse numbers for slider range
+    first_verse = _get_verse_number(first_key)
+    last_verse = _get_verse_number(last_key)
+
     # Show nav row for 2+ verses (slider is always in nav row now)
     show_nav = count > 1
 
@@ -136,7 +160,7 @@ def init_ref_audio_for_verse_range(
         keys,                                               # verse_keys
         0,                                                  # verse_index
         gr.update(visible=show_nav),                        # nav_row
-        gr.update(maximum=count - 1, value=0),              # slider
+        gr.update(minimum=first_verse, maximum=last_verse, value=first_verse),  # slider
         audio_path                                          # audio_path
     )
 

ui/handlers/verse_selection.py

@@ -14,6 +14,7 @@ from ui.components.verse_selector import (
 from ui.components.output_display import format_arabic_text, format_no_verse_message, format_error_message
 from utils.phonemizer_utils import phonemize_verse, format_verse_reference
 from recitation_engine.reference_audio import get_verse_audio_path, parse_verse_range
+from ui.handlers.reference_audio import _get_verse_number
 from recitation_analysis.text_display import render_ghunnah_analysis_from_ref, render_madd_analysis_from_ref
 from shared_state import clear_all_audio_caches
 
@@ -163,7 +164,7 @@ def verse_selection_wrapper(from_chapter: str, from_verse: str, to_verse: str) -
     ref_audio_verse_keys = []
     ref_audio_verse_index = 0
     ref_audio_nav_row = gr.update(visible=False)
-    ref_audio_slider = gr.update(maximum=0, value=0)
+    ref_audio_slider = gr.update(minimum=0, maximum=0, value=0)
     ref_audio_player = None
 
     if verse_ref:
@@ -172,14 +173,20 @@ def verse_selection_wrapper(from_chapter: str, from_verse: str, to_verse: str) -
             if verse_keys:
                 count = len(verse_keys)
                 first_key = verse_keys[0]
+                last_key = verse_keys[-1]
                 audio_path = get_verse_audio_path(first_key)
 
+                # Get actual verse numbers for slider range
+                first_verse = _get_verse_number(first_key)
+                last_verse = _get_verse_number(last_key)
+
                 ref_audio_verse_keys = verse_keys
                 ref_audio_verse_index = 0
                 ref_audio_nav_row = gr.update(visible=count > 1)
                 ref_audio_slider = gr.update(
-                    maximum=count - 1,
-                    value=0
+                    minimum=first_verse,
+                    maximum=last_verse,
+                    value=first_verse
                 )
                 ref_audio_player = audio_path
         except Exception as e:

ui/styles.py

@@ -213,10 +213,27 @@ def get_custom_css() -> str:
     .madd-settings-row {
         flex-wrap: nowrap !important;
     }
-    /* Hide default Gradio label icons (music emoji on Audio, etc.) */
-    .label-icon {
+    /* Hide number input box and reset button in verse slider, remove empty space */
+    #ref-audio-verse-slider {
+        padding-top: 0 !important;
+        margin-top: 0 !important;
+        min-height: 0 !important;
+    }
+    #ref-audio-verse-slider input[type="number"],
+    #ref-audio-verse-slider button {
         display: none !important;
     }
+    #ref-audio-verse-slider .wrap {
+        padding: 0 !important;
+        gap: 0 !important;
+    }
+    /* Compact reference audio player */
+    .ref-audio-player {
+        min-height: 0 !important;
+    }
+    .ref-audio-player audio {
+        height: 40px !important;
+    }
     """
 
     return get_force_dark_mode_css() + get_digital_khatt_font_face(DIGITAL_KHATT_FONT_B64) + get_uthmanic_font_face() + toggle_button_css