Bigger same-height logos; Plus Jakarta Sans font; single-border Model dropdown

app.py

@@ -99,8 +99,17 @@ APP_THEME = gr.themes.Base(
     primary_hue=gr.themes.colors.blue,
     secondary_hue=gr.themes.colors.sky,
     neutral_hue=gr.themes.colors.blue,
-    font=gr.themes.GoogleFont("Manrope"),
-    font_mono=gr.themes.GoogleFont("JetBrains Mono"),
+    font=[
+        gr.themes.GoogleFont("Plus Jakarta Sans"),
+        "ui-sans-serif",
+        "system-ui",
+        "sans-serif",
+    ],
+    font_mono=[
+        gr.themes.GoogleFont("JetBrains Mono"),
+        "ui-monospace",
+        "monospace",
+    ],
 ).set(
     body_background_fill="#f5f9ff",
     body_text_color="#0f2744",
@@ -321,37 +330,28 @@ gradio-app > div {
 .osu-nlp-logo [aria-label*="ullscreen" i] {
   display: none !important;
 }
-.banner-quest-logo img {
-  height: 96px !important;
+/* Both logos share the same fixed height so they visually line up. Width is
+   auto so each logo keeps its natural aspect ratio. */
+.banner-quest-logo img,
+.osu-nlp-logo img {
+  height: 140px !important;
   width: auto !important;
   max-width: 100% !important;
   object-fit: contain !important;
-  border-radius: 18px !important;
   background: transparent !important;
   border: none !important;
-  box-shadow: 0 8px 22px rgba(37,99,235,0.08) !important;
+  box-shadow: none !important;
+  border-radius: 0 !important;
+  padding: 0 !important;
   margin: 0 auto !important;
   display: block !important;
-  padding: 6px 12px !important;
 }
 .banner-right {
   display: flex !important;
   justify-content: flex-end !important;
   align-items: center !important;
 }
-.osu-nlp-logo img {
-  height: 96px !important;
-  width: auto !important;
-  max-width: 100% !important;
-  object-fit: contain !important;
-  border-radius: 18px !important;
-  background: transparent !important;
-  border: none !important;
-  box-shadow: 0 8px 22px rgba(37,99,235,0.08) !important;
-  padding: 6px 12px !important;
-  margin-left: auto !important;
-  display: block !important;
-}
+.osu-nlp-logo img { margin-left: auto !important; }
 .osu-nlp-logo {
   cursor: pointer;
   transition: transform .15s ease;
@@ -567,14 +567,26 @@ gradio-app > div {
 }
 
 /* --- DROPDOWN --- */
-[class*="gradio-container"] [data-testid="dropdown"],
-[class*="gradio-container"] [data-testid="dropdown"] > .wrap,
-[class*="gradio-container"] .secondary-wrap,
-[class*="gradio-container"] [class*="dropdown"] .wrap {
+/* The visible "Model" pill is the [data-testid="dropdown"] wrap; it's the only
+   thing that should carry the blue border. The <input> inside it must be
+   transparent/borderless or we get "border inside border" nesting. */
+[class*="gradio-container"] [data-testid="dropdown"] {
   background: #ffffff !important;
   border: 1px solid #bfdbfe !important;
   border-radius: 14px !important;
   box-shadow: none !important;
+  padding: 2px 4px !important;
+}
+[class*="gradio-container"] [data-testid="dropdown"] > .wrap,
+[class*="gradio-container"] [data-testid="dropdown"] .secondary-wrap,
+[class*="gradio-container"] [data-testid="dropdown"] .wrap-inner,
+[class*="gradio-container"] [data-testid="dropdown"] input,
+[class*="gradio-container"] [data-testid="dropdown"] .input-container,
+[class*="gradio-container"] [class*="dropdown"] .wrap {
+  background: transparent !important;
+  border: none !important;
+  box-shadow: none !important;
+  border-radius: 12px !important;
 }
 [class*="gradio-container"] .options ul,
 [class*="gradio-container"] .options {
@@ -1209,9 +1221,6 @@ with gr.Blocks(
                 show_share_button=False,
                 elem_classes="banner-quest-logo",
             )
-            gr.HTML(
-                '<div class="banner-subtitle">A deep research agent for multi-source investigation</div>'
-            )
         with gr.Column(scale=1, elem_classes="banner-side banner-right"):
             gr.Image(
                 value=OSU_NLP_LOGO_PATH,