Replace Gallery-as-input with File picker + Gallery preview

The interactive Gallery was ignoring preview=False for single-image
layout and letterboxing a lone reference across the full panel width
with large blank space above. Switch to a clean two-component pattern:
gr.File for upload (compact file list) + a non-interactive gr.Gallery
below it driven by a change handler for thumbnails. Deterministic tile
sizing, proper aspect ratios.

compare_styles already accepted filepath strings via _coerce_to_pil, so
the inference path needs no change.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

app.py

@@ -158,20 +158,33 @@ with gr.Blocks(title="MegaStyle Style Comparison", theme=gr.themes.Soft()) as de
             )
         with gr.Column(scale=1):
             gr.Markdown(f"### 2. Reference images (up to {MAX_REFERENCES})")
-            refs_in = gr.Gallery(
+            refs_in = gr.File(
+                file_count="multiple",
+                file_types=["image"],
+                show_label=False,
+                height=140,
+            )
+            refs_preview = gr.Gallery(
                 show_label=False,
-                height=360,
                 columns=4,
                 rows=2,
+                height=220,
                 object_fit="contain",
                 preview=False,
                 allow_preview=False,
                 show_fullscreen_button=False,
                 show_share_button=False,
                 show_download_button=False,
-                interactive=True,
+                interactive=False,
             )
 
+    def _files_to_gallery(files: list | None) -> list[str]:
+        if not files:
+            return []
+        return [getattr(f, "name", f) for f in files]
+
+    refs_in.change(fn=_files_to_gallery, inputs=refs_in, outputs=refs_preview)
+
     with gr.Row():
         compare_btn = gr.Button("Compare styles", variant="primary", size="lg")