Update style.css

style.css

@@ -559,4 +559,53 @@ body {
 footer,
 .gradio-container footer {
   display: none !important;
-}
+}
+
+/* ============================================================
+   TwoQuarks — Gallery as Carousel Strip (horizontal scroll)
+   ============================================================ */
+
+#down_gallery, #strange_gallery {
+  margin-top: 12px !important;
+}
+
+/* El contenedor interno de la galería cambia según versión,
+   por eso usamos selectores tolerantes */
+#down_gallery [class*="gallery"],
+#strange_gallery [class*="gallery"] {
+  overflow-x: auto !important;
+  overflow-y: hidden !important;
+  padding-bottom: 8px !important;
+  scroll-snap-type: x mandatory !important;
+}
+
+#down_gallery [class*="gallery"]::-webkit-scrollbar,
+#strange_gallery [class*="gallery"]::-webkit-scrollbar {
+  height: 10px !important;
+}
+
+#down_gallery [class*="gallery"] [role="list"],
+#strange_gallery [class*="gallery"] [role="list"] {
+  display: flex !important;
+  flex-wrap: nowrap !important;
+  gap: 12px !important;
+}
+
+/* Cada item = tile consistente */
+#down_gallery [role="listitem"],
+#strange_gallery [role="listitem"] {
+  flex: 0 0 320px !important;
+  scroll-snap-align: start !important;
+  border-radius: 14px !important;
+  overflow: hidden !important;
+  background: rgba(255,255,255,0.03) !important;
+  border: 1px solid rgba(255,255,255,0.10) !important;
+}
+
+/* Imágenes: no deformar plots */
+#down_gallery img, #strange_gallery img {
+  width: 100% !important;
+  height: 240px !important;
+  object-fit: contain !important;
+  display: block !important;
+}