Add updated files

app.py

@@ -103,7 +103,8 @@ def calculate_impact(category, confidence_score, query_text, model_name):
     }
 
 def get_dialogue(water_level, category):
-    state = "energetic" if water_level > 7.0 else ("tired" if water_level >= 3.0 else "raspy")
+    # Adjusted dialogue thresholds for 1L max
+    state = "energetic" if water_level > 0.7 else ("tired" if water_level >= 0.3 else "raspy")
     return DIALOGUES[state].get(category, "I have no words left for this.")
 
 def generate_audio(text):
@@ -124,12 +125,13 @@ 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 / 10.0) * 100))
+    # Updated progress bar logic for a 1.0L maximum
+    water_percent = max(0, min(100, (water / 1.0) * 100))
     return f"""
     <div class="stats-container">
         <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="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 energy-card">
@@ -148,12 +150,13 @@ def get_stats_html(water, energy, co2, points):
     """
 
 def get_drip_visuals(water_level):
-    if water_level > 7.0:
+    # Adjusted visual state thresholds for 1.0L maximum
+    if water_level > 0.7:
         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 3.0 <= water_level <= 7.0:
+    elif 0.3 <= water_level <= 0.7:
         g_start, g_end = "#38bdf8", "#0284c7"
         mouth_d = "M43 112 Q60 110 77 112"
         cracks_op, sweat_op, tear_op = "0", "1", "0"
@@ -194,7 +197,7 @@ def get_drip_visuals(water_level):
       <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:.2f}L</div>
+        <div style="font-size:26px; font-weight:700; color:{mood_color};" id="d-water">{water_level:.3f}L</div>
       </div>
     </div>
     """
@@ -253,6 +256,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 from 10.0 to 1.0 to reflect the 1L tank
         return f"""
         <div class="victory-wrapper">
             {confetti_elements}
@@ -268,7 +272,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;">💧 {10.0 - state.get('water', 10.0):.2f} L</p>
+                        <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;">⚡ {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>
@@ -408,8 +412,6 @@ h1 { text-align: center; color: #38bdf8; text-shadow: 0 0 15px rgba(56, 189, 248
 .alt-group { padding: 25px; background: linear-gradient(145deg, rgba(16, 185, 129, 0.05), rgba(6, 95, 70, 0.1)); border-radius: 20px; border: 1px solid rgba(16, 185, 129, 0.3); margin-top: 25px; box-shadow: 0 10px 30px rgba(0,0,0,0.2);}
 .alt-card { background: linear-gradient(145deg, #1e293b, #0f172a) !important; border: 1px solid #10b981 !important; color: #a7f3d0 !important; height: auto !important; min-height: 180px !important; border-radius: 16px !important; font-size: 1.05em !important; font-weight: 500 !important; white-space: pre-wrap !important; line-height: 1.5 !important; padding: 15px !important; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important; cursor: pointer; box-shadow: 0 4px 15px rgba(0,0,0,0.4) !important;}
 .alt-card:hover { background: linear-gradient(145deg, #064e3b, #065f46) !important; transform: translateY(-8px) !important; box-shadow: 0 12px 30px rgba(16, 185, 129, 0.3) !important; color: white !important; border-color: #34d399 !important;}
-
-/* Fix Dropdown styling for completely proper selection only */
 .custom-dropdown { background: rgba(30, 41, 59, 0.8) !important; border: 1px solid #38bdf8 !important; border-radius: 12px !important; }
 
 /* Victory Dashboard & Celebration */
@@ -429,6 +431,7 @@ 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:
+    # UPDATED to start with 1.0 Liters
     game_state = gr.State({
         "water": 1.0, "energy": 0.0, "co2": 0.0, "points": 0, "queries": 0, 
         "history": [], "game_over": False, "current_best_alt": None, "current_shuffled_alts": []
@@ -437,20 +440,19 @@ with gr.Blocks(css=custom_css, title="EcoQueryQuest") as demo:
     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(10.0, 0.0, 0.0, 0))
+    # UPDATED to start UI with 1.0 Liters
+    stats_html = gr.HTML(get_stats_html(1.0, 0.0, 0.0, 0))
 
     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(10.0))
-                # The audio component remains visible=True natively so it autoplays, but is visually hidden via CSS wrapper classes
+                # UPDATED to start Drip visual with 1.0 Liters
+                drip_html = gr.HTML(get_drip_visuals(1.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>")
             
             with gr.Column(scale=2):
-                # Ensure dropdown is the ONLY dropdown, strictly interactive but not allowing custom user values to protect scaling logic
                 model_selector = gr.Dropdown(choices=list(MODELS.keys()), value="GPT-5.4", label="Select Target LLM Backend", elem_classes=["custom-dropdown"], interactive=True, allow_custom_value=False)
-                
                 with gr.Row(elem_classes=["input-row"]):
                     user_input = gr.Textbox(show_label=False, placeholder="Type your query here...", elem_classes=["custom-textbox"], scale=4, lines=3)
                     submit_btn = gr.Button("Send Query", elem_classes=["custom-btn"], scale=1)