Update app.py

app.py

@@ -64,13 +64,27 @@ examples = [
 ]
 
 css = """
-#col-container {
-    margin: 0 auto;
-    max-width: 520px;
+#left-column {
+    padding: 1rem;
+}
+
+#right-column {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding: 1rem;
+}
+
+#generated-image > img {
+    border-radius: 12px;
+    box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.2);
+    max-width: 100%;
+    height: auto;
 }
 """
 
 with gr.Blocks(css=css) as natalie_diffusion:
+    # Predefine result image so it's accessible to both sides
     result = gr.Image(label="", show_label=False, elem_id="generated-image")
 
     with gr.Row():
@@ -110,11 +124,12 @@ Generate images in the surreal style of artist [Natalie Kav](https://www.behance
                 fn=infer,
                 inputs=[prompt],
                 outputs=[result, seed],
-                cache_examples="lazy"
+                cache_examples=True,
+                cache_mode="lazy"
             )
 
         with gr.Column(scale=1, elem_id="right-column"):
-            result = render()
+            result.render()
 
     gr.on(
         triggers=[run_button.click, prompt.submit],
@@ -123,26 +138,5 @@ Generate images in the surreal style of artist [Natalie Kav](https://www.behance
         outputs=[result, seed],
     )
 
-css = """
-#left-column {
-    padding: 1rem;
-}
-
-#right-column {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    padding: 1rem;
-}
-
-#generated-image > img {
-    border-radius: 12px;
-    box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.2);
-    max-width: 100%;
-    height: auto;
-}
-"""
-
-
 if __name__ == "__main__":
     natalie_diffusion.launch()