Deploy deathmatch from 28e3a4c

app.py

@@ -94,7 +94,12 @@ button.primary, .dm-primary button {
     font-size: 18px !important; text-transform: uppercase !important;
     box-shadow: 0 14px 40px rgba(224,48,60,0.32) !important;
 }
-.dm-commentary { padding: 16px 18px; border-radius: 18px; border: 1px solid rgba(255,255,255,0.08); background: var(--dm-panel); }
+.dm-commentary { padding: 16px 18px; border-radius: 18px; border: 1px solid rgba(242,176,48,0.28);
+    background: var(--dm-panel) !important; text-shadow: 0 1px 2px rgba(0,0,0,0.6); }
+/* Force fire-yellow commentary text so it stays legible regardless of the
+   visitor's light/dark browser theme (Gradio markdown otherwise inherits a
+   theme color that can vanish on a light background). */
+.dm-commentary, .dm-commentary * { color: #ffc233 !important; }
 .animate-status {
     margin: 14px 0 0; padding: 16px 18px; border-radius: 16px; font-size: 14px; line-height: 1.55;
 }
@@ -338,7 +343,7 @@ with gr.Blocks(title="Celebrity Deathmatch") as demo:
             gr.Markdown("### The keyframe reel")
             reel = gr.Gallery(label="Fight reel", columns=5, height=320,
                               object_fit="cover")
-            commentary = gr.Markdown()
+            commentary = gr.Markdown(elem_classes=["dm-commentary"])
             animate_btn = gr.Button("🎬 Animate the full fight", variant="primary",
                                     interactive=False, elem_classes=["dm-primary"])
             animate_status = gr.HTML()