Update app.css

app.css

@@ -77,48 +77,67 @@ body {
     box-shadow: inset 0 2px 10px rgba(0,0,0,0.03);
 }
 
-/* 프롬프트 입력창 스타일 - 더 구체적인 선택자 사용 */
-.mouse-tab .ant-input-textarea textarea,
-.mouse-tab .ant-input-textarea-large textarea,
-.mouse-tab .ant-input-textarea.ant-input-textarea-large .ant-input,
-.mouse-tab div[class*="ant-input"],
-#mouse-tab .ant-input-textarea textarea,
-#mouse-tab .ant-input-textarea-large textarea,
-#mouse-tab .ant-input-textarea.ant-input-textarea-large .ant-input,
-.ant-input-textarea.ant-input-textarea-large .ant-input,
-.ant-input-textarea .ant-input {
+/* 프롬프트 입력창 강제 스타일링 */
+div[class*="ant-input-textarea"],
+div[class*="ant-input-textarea"] textarea,
+.ant-input-textarea,
+.ant-input-textarea textarea,
+.ant-input-textarea-large,
+.ant-input-textarea-large textarea,
+.ant-input.ant-input-textarea-large,
+.ant-input.ant-input-textarea-large textarea,
+textarea.ant-input,
+.ant-input-textarea .ant-input,
+.ant-input-textarea-large .ant-input,
+#mouse-tab textarea,
+.mouse-tab textarea,
+[class*="textbox"] textarea {
     height: 300px !important;
-    max-height: 300px !important;
     min-height: 300px !important;
+    max-height: 300px !important;
     resize: none !important;
-    border: 2px solid var(--neutral-200);
-    border-radius: 12px;
-    padding: 1rem;
-    font-size: 14px;
-    line-height: 1.5;
-    width: 100%;
-    box-sizing: border-box;
-    overflow-y: auto;
+    border: 2px solid var(--neutral-200) !important;
+    border-radius: 12px !important;
+    padding: 1rem !important;
+    font-size: 14px !important;
+    line-height: 1.5 !important;
+    width: 100% !important;
+    box-sizing: border-box !important;
+    overflow-y: auto !important;
 }
 
-/* Gradio 입력창에 대한 추가 스타일 */
-.gradio-container .gr-text-input,
-.gradio-container textarea,
-textarea.gr-text-input {
+/* 입력창 컨테이너 강제 높이 */
+div[class*="ant-input-textarea"],
+.ant-input-textarea,
+.ant-input-textarea-large,
+#mouse-tab .input-container,
+.mouse-tab .input-container,
+[class*="textbox"] {
     height: 300px !important;
     min-height: 300px !important;
     max-height: 300px !important;
+    margin-bottom: 1rem !important;
 }
 
-/* 입력창 컨테이너에 대한 스타일 */
-.ant-input-textarea,
-.ant-input-textarea-large,
-.input-container {
+/* Gradio 특정 스타일 오버라이드 */
+.gradio-container textarea,
+.gr-text-input,
+textarea.gr-text-input,
+.gr-panel textarea {
     height: 300px !important;
     min-height: 300px !important;
     max-height: 300px !important;
 }
 
+/* 입력창 부모 요소들의 높이 제한 해제 */
+.ant-input-textarea-show-count::after,
+.ant-input-textarea-large::after,
+.ant-input-textarea::after {
+    height: auto !important;
+    min-height: auto !important;
+    max-height: none !important;
+}
+
 /* iframe 컨테이너 */
 .html_content {
     height: 800px !important;
@@ -306,44 +325,60 @@ iframe {
 }
 
 /* Responsive adjustments */
-@media (max-width: 768px) {
-  .left_header {
-    padding: 1rem;
-  }
-  
-  .setting-buttons {
-    flex-wrap: wrap;
-  }
-
-  .ant-btn {
-    min-width: 60px;
-    font-size: 0.9rem;
-  }
-
-  /* 모바일에서의 높이 설정 */
-  .mouse-tab .ant-input-textarea textarea,
-  .mouse-tab .ant-input-textarea-large textarea,
-  .mouse-tab .ant-input-textarea.ant-input-textarea-large .ant-input,
-  .mouse-tab div[class*="ant-input"],
-  #mouse-tab .ant-input-textarea textarea,
-  #mouse-tab .ant-input-textarea-large textarea,
-  #mouse-tab .ant-input-textarea.ant-input-textarea-large .ant-input,
-  .ant-input-textarea.ant-input-textarea-large .ant-input,
-  .ant-input-textarea .ant-input,
-  .gradio-container .gr-text-input,
-  .gradio-container textarea,
-  textarea.gr-text-input {
-      height: 300px !important;
-      min-height: 300px !important;
-      max-height: 300px !important;
-  }
-  
-  .html_content,
-  iframe {
-    height: 800px !important;
-    min-height: 800px !important;
-    max-height: 800px !important;
-  }
+@media (max-width: 768px), screen and (max-height: 900px) {
+    .left_header {
+        padding: 1rem;
+    }
+    
+    .setting-buttons {
+        flex-wrap: wrap;
+    }
+
+    .ant-btn {
+        min-width: 60px;
+        font-size: 0.9rem;
+    }
+
+    /* 모바일에서도 동일한 높이 유지 */
+    div[class*="ant-input-textarea"],
+    div[class*="ant-input-textarea"] textarea,
+    .ant-input-textarea,
+    .ant-input-textarea textarea,
+    .ant-input-textarea-large,
+    .ant-input-textarea-large textarea,
+    .ant-input.ant-input-textarea-large,
+    .ant-input.ant-input-textarea-large textarea,
+    textarea.ant-input,
+    .ant-input-textarea .ant-input,
+    .ant-input-textarea-large .ant-input,
+    #mouse-tab textarea,
+    .mouse-tab textarea,
+    [class*="textbox"] textarea,
+    .gradio-container textarea,
+    .gr-text-input,
+    textarea.gr-text-input,
+    .gr-panel textarea {
+        height: 300px !important;
+        min-height: 300px !important;
+        max-height: 300px !important;
+    }
+    
+    .html_content,
+    iframe {
+        height: 800px !important;
+        min-height: 800px !important;
+        max-height: 800px !important;
+    }
+
+    .right_panel {
+        height: calc(100vh - 80px);
+        min-height: 600px;
+    }
+
+    .html_content {
+        height: calc(100vh - 160px);
+        min-height: 500px;
+    }
 }
 
 footer, .footer, div[class*="footer"], #footer {
@@ -358,33 +393,4 @@ footer, .footer, div[class*="footer"], #footer {
     box-shadow: 0 4px 15px rgba(0,0,0,0.1);
     height: calc(100vh - 100px);
     min-height: 800px;
-}
-
-/* 반응형 높이 조정 */
-@media screen and (max-height: 900px) {
-    .right_panel {
-        height: calc(100vh - 80px);
-        min-height: 600px;
-    }
-    .html_content {
-        height: calc(100vh - 160px);
-        min-height: 500px;
-    }
-    /* 모든 입력창 높이 통일 */
-    .mouse-tab .ant-input-textarea textarea,
-    .mouse-tab .ant-input-textarea-large textarea,
-    .mouse-tab .ant-input-textarea.ant-input-textarea-large .ant-input,
-    .mouse-tab div[class*="ant-input"],
-    #mouse-tab .ant-input-textarea textarea,
-    #mouse-tab .ant-input-textarea-large textarea,
-    #mouse-tab .ant-input-textarea.ant-input-textarea-large .ant-input,
-    .ant-input-textarea.ant-input-textarea-large .ant-input,
-    .ant-input-textarea .ant-input,
-    .gradio-container .gr-text-input,
-    .gradio-container textarea,
-    textarea.gr-text-input {
-        height: 300px !important;
-        min-height: 300px !important;
-        max-height: 300px !important;
-    }
 }