Update style.css

style.css

@@ -12,38 +12,45 @@ body {
 
 body { font-family: system-ui; max-width: 800px; margin: 0 auto; padding: 20px; }
 
-#container { 
-    margin: 10px;
-    display: flex;
-    flex-direction: column;
-    gap: 15px;
-    padding: 20px;
-    border: 2px dashed #ccc;
-    border-radius: 8px;
-    cursor: pointer;
-    text-align: center;
-}
-#query-input {
-    width: 100%;
-    padding: 8px;
-    border: 1px solid #ccc;
-    border-radius: 4px;
-    margin-top: 10px;
-}
-#status {
-    margin-top: 15px;
-    display: block;
-    color: #666;
-}
-#upload { display: none; }
-#example { 
-    color: blue;
-    text-decoration: underline;
-    cursor: pointer;
-}
-#preview {
-    max-width: 100%;
-    max-height: 300px;
-    margin-top: 10px;
-    display: none;
-}
+ #container {
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+            gap: 15px;
+            padding: 20px;
+            border: 2px dashed #ccc;
+            border-radius: 8px;
+            cursor: pointer;
+            text-align: center;
+        }
+        #prompt-stage {
+            display: none;
+            width: 100%;
+        }
+        #upload-stage {
+            width: 100%;
+        }
+        #preview-image {
+            max-height: 200px;
+            margin: 10px 0;
+        }
+        #prompt-input {
+            width: 100%;
+            padding: 8px;
+            margin: 10px 0;
+            border: 1px solid #ccc;
+            border-radius: 4px;
+        }
+        .button-group {
+            display: flex;
+            gap: 10px;
+            justify-content: center;
+            margin-top: 10px;
+        }
+        button {
+            padding: 8px 16px;
+            border-radius: 4px;
+            cursor: pointer;
+        }
+        #upload { display: none; }
+        #example { color: blue; text-decoration: underline; cursor: pointer; }