switch to correct orange color

app.py

@@ -307,15 +307,15 @@ def build_street_html(image_url: str) -> str:
     <div id="image-container" style="position:relative;max-width:960px;margin:0 auto;">
       <div id="fullscreen-wrapper" style="position:relative; background-color: #000;">
         <img id="street-image" src="__IMG_URL__" style="width:100%;height:auto;border-radius:8px;box-shadow:0 4px 6px rgba(0,0,0,0.1);display:block;" />
-        <button id="fullscreen-btn" title="Toggle Fullscreen" style="position:absolute;top:10px;right:10px;z-index:10;background:#f97316;border:none;color:white;padding:8px;border-radius:4px;cursor:pointer;line-height:0;">
+        <button id="fullscreen-btn" title="Toggle Fullscreen" style="position:absolute;top:10px;right:10px;z-index:10;background:#FA500F;border:none;color:white;padding:8px;border-radius:4px;cursor:pointer;line-height:0;">
           <!-- SVG icon will be injected by JS -->
         </button>
       </div>
       <div id="mini-map-wrap" style="transition:all 0.3s ease;position:absolute;right:10px;bottom:10px;border:2px solid #fff;border-radius:8px;box-shadow:0 2px 8px rgba(0,0,0,0.2);background:#fff;">
         <div id="mini-map" style="width:100%;height:100%;cursor:pointer"></div>
         <div id="map-controls" style="position:absolute;right:8px;top:8px;display:flex;gap:6px;z-index:5;">
-          <button id="map-size-minus" class="map-ctrl" style="width:34px;height:28px;border-radius:6px;border:1px solid rgba(0,0,0,0.2);background:#f97316;color:#fff;display:flex;align-items:center;justify-content:center;font-size:20px;padding:0;line-height:0;">−</button>
-          <button id="map-size-plus" class="map-ctrl" style="width:34px;height:28px;border-radius:6px;border:1px solid rgba(0,0,0,0.2);background:#f97316;color:#fff;display:flex;align-items:center;justify-content:center;font-size:20px;padding:0;line-height:0;">+</button>
+          <button id="map-size-minus" class="map-ctrl" style="width:34px;height:28px;border-radius:6px;border:1px solid rgba(0,0,0,0.2);background:#FA500F;color:#fff;display:flex;align-items:center;justify-content:center;font-size:20px;padding:0;line-height:0;">−</button>
+          <button id="map-size-plus" class="map-ctrl" style="width:34px;height:28px;border-radius:6px;border:1px solid rgba(0,0,0,0.2);background:#FA500F;color:#fff;display:flex;align-items:center;justify-content:center;font-size:20px;padding:0;line-height:0;">+</button>
         </div>
       </div>
     </div>
@@ -396,7 +396,7 @@ def gr_submit_guess(round_id: str, lat: float, lng: float, username: str, reques
         <div style=\"display:flex;justify-content:space-between;align-items:center;margin-top:24px;font-size:0.98rem;color:#e2e8f0;flex-wrap:wrap;gap:14px;\">
           <div style=\"display:flex;gap:16px;align-items:center;flex-wrap:wrap;\">
             <span style=\"display:flex;align-items:center;gap:8px;\"><span style=\"display:inline-flex;width:13px;height:13px;border-radius:50%;background:#22c55e;box-shadow:0 0 8px rgba(34,197,94,0.6);\"></span>G = Ground Truth</span>
-            <span style=\"display:flex;align-items:center;gap:8px;\"><span style=\"display:inline-flex;width:13px;height:13px;border-radius:50%;background:#f97316;box-shadow:0 0 8px rgba(249,115,22,0.55);\"></span>H = Human</span>
+            <span style=\"display:flex;align-items:center;gap:8px;\"><span style=\"display:inline-flex;width:13px;height:13px;border-radius:50%;background:#FA500F;box-shadow:0 0 8px rgba(249,115,22,0.55);\"></span>H = Human</span>
             <span style=\"display:flex;align-items:center;gap:8px;\"><span style=\"display:inline-flex;width:13px;height:13px;border-radius:50%;background:#2563EB;box-shadow:0 0 8px rgba(37,99,235,0.6);\"></span>A = AI</span>
           </div>
           <button id=\"popup-close-next-footer\" style=\"padding:12px 22px;border-radius:12px;border:1px solid rgba(96,165,250,0.4);background:linear-gradient(135deg,#1d4ed8,#2563eb);color:#f8fafc;font-weight:600;cursor:pointer;box-shadow:0 10px 22px rgba(37,99,235,0.48);\">Next Round</button>
@@ -565,9 +565,9 @@ APP_BOOT_JS = """
         bounds.extend(gMk.getPosition());
         if (Number.isFinite(ai.lat) && Number.isFinite(ai.lng)) {
             log("AI coordinates are valid, creating marker.");
-            const aMk = new google.maps.Marker({ position: ai, map: m, label: markerLabel('M'), icon: markerIcon('#f97316', '#c2410c') });
+            const aMk = new google.maps.Marker({ position: ai, map: m, label: markerLabel('M'), icon: markerIcon('#FA500F', '#c2410c') });
             bounds.extend(aMk.getPosition());
-            new google.maps.Polyline({ path: [rnd, ai], geodesic: true, strokeColor: '#f97316', strokeOpacity: 1.0, strokeWeight: 2, map: m });
+            new google.maps.Polyline({ path: [rnd, ai], geodesic: true, strokeColor: '#FA500F', strokeOpacity: 1.0, strokeWeight: 2, map: m });
         } else {
             log("AI coordinates are NOT valid, skipping marker creation.");
         }
@@ -956,7 +956,7 @@ with gr.Blocks(css=APP_CSS, title="LLM GeoGuessr") as demo:
               <div style="display:flex;gap:16px;align-items:center;flex-wrap:wrap;">
                 <span style="display:flex;align-items:center;gap:8px;"><span style="display:inline-flex;width:13px;height:13px;border-radius:50%;background:#22c55e;box-shadow:0 0 8px rgba(34,197,94,0.6);"></span>G = Ground Truth</span>
                 <span style="display:flex;align-items:center;gap:8px;"><span style="display:inline-flex;width:13px;height:13px;border-radius:50%;background:#2563EB;box-shadow:0 0 8px rgba(37,99,235,0.6);"></span>H = Human</span>
-                <span style="display:flex;align-items:center;gap:8px;"><span style="display:inline-flex;width:13px;height:13px;border-radius:50%;background:#f97316;box-shadow:0 0 8px rgba(249,115,22,0.55);"></span>M = Magistral</span>
+                <span style="display:flex;align-items:center;gap:8px;"><span style="display:inline-flex;width:13px;height:13px;border-radius:50%;background:#FA500F;box-shadow:0 0 8px rgba(249,115,22,0.55);"></span>M = Magistral</span>
               </div>
               <button id="popup-close-next-footer" style="padding:12px 22px;border-radius:12px;border:1px solid rgba(96,165,250,0.4);background:linear-gradient(135deg,#1d4ed8,#2563eb);color:#f8fafc;font-weight:600;cursor:pointer;box-shadow:0 10px 22px rgba(37,99,235,0.48);">Next Round</button>
             </div>
@@ -989,12 +989,12 @@ with gr.Blocks(css=APP_CSS, title="LLM GeoGuessr") as demo:
                 winner_message = "The AI won this time."
 
             summary_html = f"""
-            <div style='text-align:center; padding: 40px; font-size: 1.2em;'>
-                <h2>Game Over!</h2>
-                <p>Here are the final scores:</p>
-                <p><strong>Your Score:</strong> {total_human:.0f}</p>
-                <p><strong>AI's Score:</strong> {total_ai:.0f}</p>
-                <h3>{winner_message}</h3>
+            <div style='text-align:center; padding: 40px; font-size: 1.2em; color: #FA500F;'>
+                <h2 style='color: #FA500F;'>Game Over!</h2>
+                <p style='color: #FA500F;'>Here are the final scores:</p>
+                <p style='color: #FA500F;'><strong>Your Score:</strong> {total_human:.0f}</p>
+                <p style='color: #FA500F;'><strong>AI's Score:</strong> {total_ai:.0f}</p>
+                <h3 style='color: #FA500F;'>{winner_message}</h3>
             </div>
             """
             return idx, gr.update(value=summary_html), gr.update(value=""), gr.update(value=""), gr.update(value="")