트레이딩창 UI 배치 및 UX 수정 및 기획서 추가

features/trade/components/search/StockSearchForm.tsx

@@ -31,7 +31,7 @@ export function StockSearchForm({
   };
 
   return (
-    <form onSubmit={onSubmit} className="flex gap-2">
+    <form onSubmit={onSubmit} className="flex items-center gap-2">
       {/* ========== SEARCH INPUT ========== */}
       <div className="relative flex-1">
         <Search className="absolute left-2.5 top-2.5 h-4 w-4 text-muted-foreground dark:text-brand-100/65" />
@@ -39,9 +39,9 @@ export function StockSearchForm({
           value={keyword}
           onChange={(e) => onKeywordChange(e.target.value)}
           onFocus={onInputFocus}
-          placeholder="종목명 또는 종목코드(6자리)를 입력하세요."
+          placeholder="종목명 또는 코드 검색"
           autoComplete="off"
-          className="pl-9 pr-9 dark:border-brand-700/55 dark:bg-brand-900/28 dark:text-brand-100 dark:placeholder:text-brand-100/55"
+          className="h-9 pl-9 pr-9 dark:border-brand-700/55 dark:bg-brand-900/28 dark:text-brand-100 dark:placeholder:text-brand-100/55"
         />
         {keyword && (
           <button
@@ -57,7 +57,11 @@ export function StockSearchForm({
       </div>
 
       {/* ========== SUBMIT BUTTON ========== */}
-      <Button type="submit" disabled={disabled || isLoading}>
+      <Button
+        type="submit"
+        disabled={disabled || isLoading}
+        className="h-9 px-2.5 text-xs sm:px-3 sm:text-sm"
+      >
         {isLoading ? "검색 중..." : "검색"}
       </Button>
     </form>