Upload app.py with huggingface_hub

app.py

@@ -264,7 +264,12 @@ body, .gradio-container {
     color: #f3f4f6 !important;
     font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
 }
-.gradio-container { max-width: 1400px !important; margin: auto !important; padding-top: 18px !important; padding-bottom: 24px !important; }
+.gradio-container {
+    max-width: 1400px !important;
+    margin: auto !important;
+    padding-top: 12px !important;
+    padding-bottom: 24px !important;
+}
 .main-title { font-size: 34px; font-weight: 800; margin-bottom: 6px; color: #f8fafc; }
 .sub-title { font-size: 16px; line-height: 1.8; color: #cbd5e1; margin-bottom: 20px; }
 
@@ -276,14 +281,19 @@ body, .gradio-container {
     border: none !important;
     box-shadow: none !important;
     padding: 0 !important;
-    margin-bottom: 22px !important;
+    margin: 0 0 6px 0 !important;
     justify-content: flex-start !important;
 }
 
+/* =========================
+   Model Selector
+========================= */
+
 #model-bar{
-    background: transparent !important;
-    border: none !important;
-    box-shadow: none !important;
+    max-width:360px;
+    background:transparent !important;
+    border:none !important;
+    box-shadow:none !important;
 }
 
 #model-bar label{
@@ -294,20 +304,45 @@ body, .gradio-container {
 }
 
 #model-bar .wrap{
-    background:#14336b !important;
+    background:#183a74 !important;
     border:1px solid #3568bf !important;
     border-radius:18px !important;
+    transition:all .2s ease;
+}
+
+#model-bar .wrap:hover{
+    border-color:#4f84df !important;
+}
+
+#model-bar .wrap:focus-within{
+    background:#183a74 !important;
+    border-color:#4f84df !important;
+    box-shadow:none !important;
 }
 
 #model-bar input{
     background:transparent !important;
     color:#ffffff !important;
-    font-size:15px !important;
     font-weight:700 !important;
+    font-size:15px !important;
+    box-shadow:none !important;
+}
+
+#model-bar input:focus{
+    background:transparent !important;
+    box-shadow:none !important;
+}
+
+#model-bar button{
+    background:transparent !important;
+}
+
+#model-bar button:hover{
+    background:transparent !important;
 }
 
 #model-bar svg{
-    color:#93c5fd !important;
+    color:#9ec7ff !important;
 }
 
 #model-bar *:focus{
@@ -315,11 +350,18 @@ body, .gradio-container {
 }
 
 
-.section-title { font-size: 22px; font-weight: 700; color: #f8fafc; margin: 8px 0 14px 0; }
+.section-title {
+    font-size: 22px;
+    font-weight: 700;
+    color: #f8fafc;
+    margin: 0 0 10px 0;
+}
 
 /* Force Input Panel and Detection Output columns to start flush at the top */
-#main-panels-row {
-    align-items: flex-start !important;
+#main-panels-row{
+    align-items:flex-start !important;
+    margin-top:-8px !important;
+}
 }
 #main-panels-row > * {
     margin-top: 0 !important;