update css

index.css

@@ -505,6 +505,12 @@ select.input {
   max-width: 500px;
   width: 100%;
   margin-bottom: 0; /* Override card margin */
+  translate: 0 0;
+  box-shadow: 12px 12px 0 var(--color-border);
+}
+.modal-card:hover {
+  translate: 0 0;
+  box-shadow: 12px 12px 0 var(--color-border);
 }
 .modal-close-button {
   background: none;
@@ -513,6 +519,30 @@ select.input {
   color: inherit;
 }
 
+/* API Key Modal Specific Styles */
+.api-key-modal .content {
+  display: flex;
+  flex-direction: column;
+  gap: 1.5rem;
+}
+
+.api-key-info {
+  font-size: 13px;
+  line-height: 1.6;
+  opacity: 0.9;
+  margin: 0;
+}
+
+.api-key-form {
+  display: flex;
+  flex-direction: column;
+  gap: 1rem;
+}
+
+.api-key-form .button {
+  justify-content: center;
+}
+
 /* Showcase for multiple images */
 .showcase-container {
   display: flex;
@@ -627,4 +657,4 @@ select.input {
 .info-tooltip-container:hover .info-tooltip {
   opacity: 1;
   visibility: visible;
-}
+}