Add updated files

app.py

@@ -95,7 +95,8 @@ def calculate_impact(category, confidence_score, query_text, model_name):
     }
 
 def get_dialogue(water_level, category):
-    state = "energetic" if water_level > 0.7 else ("tired" if water_level >= 0.3 else "raspy")
+    # Adjusted dialogue thresholds back to 10L max (7.0 and 3.0)
+    state = "energetic" if water_level > 7.0 else ("tired" if water_level >= 3.0 else "raspy")
     return DIALOGUES[state].get(category, "I have no words left for this.")
 
 def generate_audio(text):
@@ -116,10 +117,11 @@ def get_relatable_translations(impact):
     return w_ex, e_ex, c_ex
 
 def get_stats_html(water, energy, co2, points):
-    water_percent = max(0, min(100, (water / 1.0) * 100))
+    # Updated progress bar logic for a 10.0L maximum
+    water_percent = max(0, min(100, (water / 10.0) * 100))
     return f"""
     <div class="stats-container">
-        <div class="stat-card water-card"><div class="stat-label">WATER TANK (1L MAX)</div><div class="stat-value">{water:.3f}L</div><div class="progress-bar-bg"><div class="progress-bar-fill" style="width: {water_percent}%;"></div></div></div>
+        <div class="stat-card water-card"><div class="stat-label">WATER TANK (10L MAX)</div><div class="stat-value">{water:.2f}L</div><div class="progress-bar-bg"><div class="progress-bar-fill" style="width: {water_percent}%;"></div></div></div>
         <div class="stat-card energy-card"><div class="stat-label">ENERGY WASTED</div><div class="stat-value">{energy:.4f} <span style="font-size: 0.5em;">kWh</span></div></div>
         <div class="stat-card co2-card"><div class="stat-label">CARBON (CO₂e)</div><div class="stat-value">{co2:.2f}g</div></div>
         <div class="stat-card points-card"><div class="stat-label">SCORE</div><div class="stat-value">{points}</div></div>
@@ -127,12 +129,13 @@ def get_stats_html(water, energy, co2, points):
     """
 
 def get_drip_visuals(water_level):
-    if water_level > 0.7:
+    # Adjusted visual state thresholds back to 10.0L maximum (7.0 and 3.0)
+    if water_level > 7.0:
         g_start, g_end = "#7dd3fc", "#0369a1"
         mouth_d = "M43 112 Q60 122 77 112"
         cracks_op, sweat_op, tear_op = "0", "0", "0"
         mood, mood_color, anim = "Hydrated and coping", "rgb(34, 211, 238)", "bounce 2s infinite ease-in-out"
-    elif 0.3 <= water_level <= 0.7:
+    elif 3.0 <= water_level <= 7.0:
         g_start, g_end = "#38bdf8", "#0284c7"
         mouth_d = "M43 112 Q60 110 77 112"
         cracks_op, sweat_op, tear_op = "0", "1", "0"
@@ -166,7 +169,7 @@ def get_drip_visuals(water_level):
         <path id="tear" d="M38 104 C37 108,33 108,33 112 C33 115,36 117,38 114 C40 117,43 115,43 112 C43 108,39 108,38 104Z" fill="#93c5fd" opacity="{tear_op}" style="transition: opacity 0.5s;"></path>
       </svg>
       <div class="drip-mood" id="drip-mood" style="color: {mood_color}; font-weight: 500; font-size: 1.1rem; margin-top: 15px;">{mood}</div>
-      <div style="text-align:center; margin-top:10px;"><div style="font-size:10px; color:#94a3b8; text-transform:uppercase; letter-spacing:1px;">Water Left</div><div style="font-size:26px; font-weight:700; color:{mood_color};" id="d-water">{water_level:.3f}L</div></div>
+      <div style="text-align:center; margin-top:10px;"><div style="font-size:10px; color:#94a3b8; text-transform:uppercase; letter-spacing:1px;">Water Left</div><div style="font-size:26px; font-weight:700; color:{mood_color};" id="d-water">{water_level:.2f}L</div></div>
     </div>
     """
 
@@ -222,6 +225,7 @@ def generate_victory_dashboard(state):
             """
         confetti_elements = "".join([f'<div class="confetti-piece" style="left: {random.randint(0, 100)}%; background-color: hsl({random.randint(0, 360)}, 100%, 60%); animation-duration: {random.uniform(2.5, 5)}s; animation-delay: {random.uniform(0, 2)}s;"></div>' for _ in range(60)])
         
+        # Updated "Total Wasted" formula to 10.0 to reflect the 10L tank
         return f"""
         <div class="endgame-wrapper">
             {confetti_elements}
@@ -237,7 +241,7 @@ def generate_victory_dashboard(state):
                     </div>
                     <div class="v-stat-box" style="border-top: 4px solid #fca5a5;">
                         <h4 style="color: #fca5a5;">Total Wasted</h4>
-                        <p style="color: #fca5a5; font-size: 1.1em; margin: 8px 0;">💧 {1.0 - state.get('water', 1.0):.3f} L</p>
+                        <p style="color: #fca5a5; font-size: 1.1em; margin: 8px 0;">💧 {10.0 - state.get('water', 10.0):.2f} L</p>
                         <p style="color: #fca5a5; font-size: 1.1em; margin: 8px 0;">⚡ {state.get('energy', 0):.4f} kWh</p>
                         <p style="color: #fca5a5; font-size: 1.1em; margin: 8px 0;">☁️ {state.get('co2', 0):.2f} g</p>
                     </div>
@@ -269,6 +273,7 @@ def generate_defeat_dashboard(state):
             """
         ash_elements = "".join([f'<div class="ash-piece" style="left: {random.randint(0, 100)}%; animation-duration: {random.uniform(3, 6)}s; animation-delay: {random.uniform(0, 2)}s;"></div>' for _ in range(60)])
         
+        # Updated "Total Wasted" to reflect the empty 10L tank
         return f"""
         <div class="endgame-wrapper">
             {ash_elements}
@@ -278,7 +283,7 @@ def generate_defeat_dashboard(state):
                 <div class="victory-stats-row">
                     <div class="v-stat-box" style="border-top: 4px solid #ef4444; background: rgba(239, 68, 68, 0.1);">
                         <h4 style="color: #ef4444;">Total Resources Wasted</h4>
-                        <p style="color: #fca5a5; font-size: 1.3em; font-weight: bold; margin: 8px 0;">💧 1.0 L (Tank Empty)</p>
+                        <p style="color: #fca5a5; font-size: 1.3em; font-weight: bold; margin: 8px 0;">💧 10.0 L (Tank Empty)</p>
                         <p style="color: #fca5a5; font-size: 1.3em; font-weight: bold; margin: 8px 0;">⚡ {state.get('energy', 0):.4f} kWh</p>
                         <p style="color: #fca5a5; font-size: 1.3em; font-weight: bold; margin: 8px 0;">☁️ {state.get('co2', 0):.2f} g</p>
                     </div>
@@ -305,7 +310,6 @@ def generate_defeat_dashboard(state):
 # --- 3. EVENT HANDLERS ---
 
 def process_query(user_input, selected_model, state):
-    # CRITICAL FIX: If game is over, return without changing visibility to avoid hiding endgame screen
     if state["game_over"] or not user_input.strip():
         return [state] + [gr.update()]*13
 
@@ -367,7 +371,6 @@ def process_query(user_input, selected_model, state):
             gr.update(visible=True), gr.update())
 
 def select_alternative(choice_text, state):
-    # CRITICAL FIX: If game is over, return without changing visibility
     if state["game_over"] or not state.get("current_best_alt"):
         return [state] + [gr.update()]*5
         
@@ -456,21 +459,23 @@ h1 { text-align: center; color: #38bdf8; text-shadow: 0 0 15px rgba(56, 189, 248
 """
 
 with gr.Blocks(css=custom_css, title="EcoQueryQuest") as demo:
+    # 1. State initialized with 10.0L
     game_state = gr.State({
-        "water": 1.0, "energy": 0.0, "co2": 0.0, "points": 0, "queries": 0, 
+        "water": 10.0, "energy": 0.0, "co2": 0.0, "points": 0, "queries": 0, 
         "history": [], "game_over": False, "current_best_alt": None, "current_shuffled_alts": []
     })
 
     gr.Markdown("<h1>🌍 EcoQueryQuest</h1>")
     gr.Markdown("<div class='subtitle'>Select a model, type a query, and watch Drip react. Reach 500 points to win!</div>")
 
-    stats_html = gr.HTML(get_stats_html(1.0, 0.0, 0.0, 0))
+    # 2. Stats initialized with 10.0L
+    stats_html = gr.HTML(get_stats_html(10.0, 0.0, 0.0, 0))
 
-    # Using standard column; when game is over, we set this to visible=False
     with gr.Column(visible=True) as main_game_ui:
         with gr.Row():
             with gr.Column(scale=1, elem_classes=["drip-pod"]):
-                drip_html = gr.HTML(get_drip_visuals(1.0))
+                # 3. Drip visual initialized with 10.0L
+                drip_html = gr.HTML(get_drip_visuals(10.0))
                 drip_audio = gr.Audio(label="Drip's Voice", autoplay=True, interactive=False, elem_classes=["hidden-audio"])
                 drip_feedback = gr.HTML("<div class='feedback-box'>Waiting for your first query...</div>")
             
@@ -489,8 +494,6 @@ with gr.Blocks(css=custom_css, title="EcoQueryQuest") as demo:
                 alt_btn_3 = gr.Button("", elem_classes=["alt-card"])
             alt_feedback = gr.Markdown()
 
-    # The Victory/Defeat screen is ALWAYS attached to the DOM but empty.
-    # When game is over, this populates directly, avoiding Gradio's nested visibility bugs.
     endgame_display = gr.HTML("")
 
     user_input.submit(