Update app.py

app.py

@@ -166,8 +166,12 @@ body,.gradio-container{
 """
 
 # ---------- Gradio UI ----------
-with gr.Blocks(css=app_css, title="HarmoniFind") as demo:
+with gr.Blocks(title="HarmoniFind") as demo:
+    # inject CSS manually (Gradio version on Spaces doesn't support css=...)
+    gr.HTML(f"<style>{app_css}</style>")
+
     bg_style = gr.HTML(make_bg_style_html())
+
     gr.HTML("""
     <div id="hf-shell">
       <div id="lux-header">
@@ -177,6 +181,7 @@ with gr.Blocks(css=app_css, title="HarmoniFind") as demo:
       </div>
     </div>
     """)
+
     with gr.Column():
         with gr.Row(variant="compact"):
             input_box = gr.Textbox(
@@ -185,20 +190,41 @@ with gr.Blocks(css=app_css, title="HarmoniFind") as demo:
                 lines=3,
                 scale=5,
             )
-            with gr.Column(scale=2,min_width=160):
-                search_btn   = gr.Button("Search",elem_classes=["primary-btn"])
-                surprise_btn = gr.Button("🎲 Surprise me",elem_classes=["secondary-btn"])
-                clear_btn    = gr.Button("Clear",elem_classes=["secondary-btn"])
-        with gr.Accordion("Search settings",open=False):
+            with gr.Column(scale=2, min_width=160):
+                search_btn   = gr.Button("Search", elem_classes=["primary-btn"])
+                surprise_btn = gr.Button("🎲 Surprise me", elem_classes=["secondary-btn"])
+                clear_btn    = gr.Button("Clear", elem_classes=["secondary-btn"])
+
+        with gr.Accordion("Search settings", open=False):
             with gr.Row():
-                k_slider    = gr.Slider(5,50,value=10,step=1,label="# semantic matches")
-                rand_slider = gr.Slider(0,10,value=2,step=1,label="# extra random tracks")
+                k_slider    = gr.Slider(5, 50, value=10, step=1, label="# semantic matches")
+                rand_slider = gr.Slider(0, 10, value=2, step=1, label="# extra random tracks")
+
     output_html = gr.HTML()
 
-    input_box.submit(search_with_bg,[input_box,k_slider,rand_slider],[output_html,bg_style])
-    search_btn.click(search_with_bg,[input_box,k_slider,rand_slider],[output_html,bg_style])
-    surprise_btn.click(get_random_vibe,outputs=input_box).then(search_with_bg,[input_box,k_slider,rand_slider],[output_html,bg_style])
-    clear_btn.click(clear_all,None,[input_box,output_html,bg_style])
+    input_box.submit(
+        search_with_bg,
+        [input_box, k_slider, rand_slider],
+        [output_html, bg_style],
+    )
+    search_btn.click(
+        search_with_bg,
+        [input_box, k_slider, rand_slider],
+        [output_html, bg_style],
+    )
+    surprise_btn.click(
+        get_random_vibe,
+        outputs=input_box,
+    ).then(
+        search_with_bg,
+        [input_box, k_slider, rand_slider],
+        [output_html, bg_style],
+    )
+    clear_btn.click(
+        clear_all,
+        None,
+        [input_box, output_html, bg_style],
+    )
 
 if __name__ == "__main__":
-    demo.launch(server_name="0.0.0.0", server_port=7860)
+    demo.launch(server_name="0.0.0.0", server_port=7860)