diff --git a/frontend/components/screen/StyleEditor.tsx b/frontend/components/screen/StyleEditor.tsx
index ecd405d0..cadeb641 100644
--- a/frontend/components/screen/StyleEditor.tsx
+++ b/frontend/components/screen/StyleEditor.tsx
@@ -29,59 +29,6 @@ export default function StyleEditor({ style, onStyleChange, className }: StyleEd
 
   return (
     <div className={`space-y-6 p-6 ${className}`}>
-      {/* 여백 섹션 */}
-      <div className="space-y-3">
-        <div className="flex items-center gap-2">
-          <Box className="text-primary h-4 w-4" />
-          <h3 className="text-sm font-semibold">여백</h3>
-        </div>
-        <Separator className="my-2" />
-        <div className="space-y-3">
-          <div className="grid grid-cols-2 gap-3">
-            <div className="space-y-1.5">
-              <Label htmlFor="margin" className="text-xs font-medium">
-                외부 여백
-              </Label>
-              <Input
-                id="margin"
-                type="text"
-                placeholder="10px"
-                value={localStyle.margin || ""}
-                onChange={(e) => handleStyleChange("margin", e.target.value)}
-                className="h-8"
-              />
-            </div>
-            <div className="space-y-1.5">
-              <Label htmlFor="padding" className="text-xs font-medium">
-                내부 여백
-              </Label>
-              <Input
-                id="padding"
-                type="text"
-                placeholder="10px"
-                value={localStyle.padding || ""}
-                onChange={(e) => handleStyleChange("padding", e.target.value)}
-                className="h-8"
-              />
-            </div>
-          </div>
-
-          <div className="space-y-1.5">
-            <Label htmlFor="gap" className="text-xs font-medium">
-              간격
-            </Label>
-            <Input
-              id="gap"
-              type="text"
-              placeholder="10px"
-              value={localStyle.gap || ""}
-              onChange={(e) => handleStyleChange("gap", e.target.value)}
-              className="h-8"
-            />
-          </div>
-        </div>
-      </div>
-
       {/* 테두리 섹션 */}
       <div className="space-y-3">
         <div className="flex items-center gap-2">
@@ -101,7 +48,7 @@ export default function StyleEditor({ style, onStyleChange, className }: StyleEd
                 placeholder="1px"
                 value={localStyle.borderWidth || ""}
                 onChange={(e) => handleStyleChange("borderWidth", e.target.value)}
-                className="h-8"
+                className="h-8 text-xs"
               />
             </div>
             <div className="space-y-1.5">
@@ -112,7 +59,7 @@ export default function StyleEditor({ style, onStyleChange, className }: StyleEd
                 value={localStyle.borderStyle || "solid"}
                 onValueChange={(value) => handleStyleChange("borderStyle", value)}
               >
-                <SelectTrigger className="h-8">
+                <SelectTrigger className="h-8 text-xs">
                   <SelectValue />
                 </SelectTrigger>
                 <SelectContent>
@@ -136,14 +83,14 @@ export default function StyleEditor({ style, onStyleChange, className }: StyleEd
                   type="color"
                   value={localStyle.borderColor || "#000000"}
                   onChange={(e) => handleStyleChange("borderColor", e.target.value)}
-                  className="h-8 w-14 p-1"
+                  className="h-8 w-14 p-1 text-xs"
                 />
                 <Input
                   type="text"
                   value={localStyle.borderColor || "#000000"}
                   onChange={(e) => handleStyleChange("borderColor", e.target.value)}
                   placeholder="#000000"
-                  className="h-8 flex-1"
+                  className="h-8 flex-1 text-xs"
                 />
               </div>
             </div>
@@ -157,7 +104,7 @@ export default function StyleEditor({ style, onStyleChange, className }: StyleEd
                 placeholder="5px"
                 value={localStyle.borderRadius || ""}
                 onChange={(e) => handleStyleChange("borderRadius", e.target.value)}
-                className="h-8"
+                className="h-8 text-xs"
               />
             </div>
           </div>
@@ -182,14 +129,14 @@ export default function StyleEditor({ style, onStyleChange, className }: StyleEd
                 type="color"
                 value={localStyle.backgroundColor || "#ffffff"}
                 onChange={(e) => handleStyleChange("backgroundColor", e.target.value)}
-                className="h-8 w-14 p-1"
+                className="h-8 w-14 p-1 text-xs"
               />
               <Input
                 type="text"
                 value={localStyle.backgroundColor || "#ffffff"}
                 onChange={(e) => handleStyleChange("backgroundColor", e.target.value)}
                 placeholder="#ffffff"
-                className="h-8 flex-1"
+                className="h-8 flex-1 text-xs"
               />
             </div>
           </div>
@@ -204,7 +151,7 @@ export default function StyleEditor({ style, onStyleChange, className }: StyleEd
               placeholder="url('image.jpg')"
               value={localStyle.backgroundImage || ""}
               onChange={(e) => handleStyleChange("backgroundImage", e.target.value)}
-              className="h-8"
+              className="h-8 text-xs"
             />
           </div>
         </div>
@@ -229,14 +176,14 @@ export default function StyleEditor({ style, onStyleChange, className }: StyleEd
                   type="color"
                   value={localStyle.color || "#000000"}
                   onChange={(e) => handleStyleChange("color", e.target.value)}
-                  className="h-8 w-14 p-1"
+                  className="h-8 w-14 p-1 text-xs"
                 />
                 <Input
                   type="text"
                   value={localStyle.color || "#000000"}
                   onChange={(e) => handleStyleChange("color", e.target.value)}
                   placeholder="#000000"
-                  className="h-8 flex-1"
+                  className="h-8 flex-1 text-xs"
                 />
               </div>
             </div>
@@ -250,7 +197,7 @@ export default function StyleEditor({ style, onStyleChange, className }: StyleEd
                 placeholder="14px"
                 value={localStyle.fontSize || ""}
                 onChange={(e) => handleStyleChange("fontSize", e.target.value)}
-                className="h-8"
+                className="h-8 text-xs"
               />
             </div>
           </div>
@@ -264,17 +211,31 @@ export default function StyleEditor({ style, onStyleChange, className }: StyleEd
                 value={localStyle.fontWeight || "normal"}
                 onValueChange={(value) => handleStyleChange("fontWeight", value)}
               >
-                <SelectTrigger className="h-6 w-full text-[10px] px-2">
+                <SelectTrigger className="h-6 w-full px-2 text-[10px]">
                   <SelectValue />
                 </SelectTrigger>
                 <SelectContent>
-                  <SelectItem value="normal" className="text-[10px]">보통</SelectItem>
-                  <SelectItem value="bold" className="text-[10px]">굵게</SelectItem>
-                  <SelectItem value="100" className="text-[10px]">100</SelectItem>
-                  <SelectItem value="400" className="text-[10px]">400</SelectItem>
-                  <SelectItem value="500" className="text-[10px]">500</SelectItem>
-                  <SelectItem value="600" className="text-[10px]">600</SelectItem>
-                  <SelectItem value="700" className="text-[10px]">700</SelectItem>
+                  <SelectItem value="normal" className="text-[10px]">
+                    보통
+                  </SelectItem>
+                  <SelectItem value="bold" className="text-[10px]">
+                    굵게
+                  </SelectItem>
+                  <SelectItem value="100" className="text-[10px]">
+                    100
+                  </SelectItem>
+                  <SelectItem value="400" className="text-[10px]">
+                    400
+                  </SelectItem>
+                  <SelectItem value="500" className="text-[10px]">
+                    500
+                  </SelectItem>
+                  <SelectItem value="600" className="text-[10px]">
+                    600
+                  </SelectItem>
+                  <SelectItem value="700" className="text-[10px]">
+                    700
+                  </SelectItem>
                 </SelectContent>
               </Select>
             </div>
@@ -286,14 +247,22 @@ export default function StyleEditor({ style, onStyleChange, className }: StyleEd
                 value={localStyle.textAlign || "left"}
                 onValueChange={(value) => handleStyleChange("textAlign", value)}
               >
-                <SelectTrigger className="h-6 w-full text-[10px] px-2">
+                <SelectTrigger className="h-6 w-full px-2 text-[10px]">
                   <SelectValue />
                 </SelectTrigger>
                 <SelectContent>
-                  <SelectItem value="left" className="text-[10px]">왼쪽</SelectItem>
-                  <SelectItem value="center" className="text-[10px]">가운데</SelectItem>
-                  <SelectItem value="right" className="text-[10px]">오른쪽</SelectItem>
-                  <SelectItem value="justify" className="text-[10px]">양쪽</SelectItem>
+                  <SelectItem value="left" className="text-[10px]">
+                    왼쪽
+                  </SelectItem>
+                  <SelectItem value="center" className="text-[10px]">
+                    가운데
+                  </SelectItem>
+                  <SelectItem value="right" className="text-[10px]">
+                    오른쪽
+                  </SelectItem>
+                  <SelectItem value="justify" className="text-[10px]">
+                    양쪽
+                  </SelectItem>
                 </SelectContent>
               </Select>
             </div>
diff --git a/frontend/components/screen/config-panels/ButtonConfigPanel.tsx b/frontend/components/screen/config-panels/ButtonConfigPanel.tsx
index 01663c89..6b1669c4 100644
--- a/frontend/components/screen/config-panels/ButtonConfigPanel.tsx
+++ b/frontend/components/screen/config-panels/ButtonConfigPanel.tsx
@@ -515,94 +515,60 @@ export const ButtonConfigPanel: React.FC<ButtonConfigPanelProps> = ({
       {/* 테이블 이력 보기 액션 설정 */}
       {(component.componentConfig?.action?.type || "save") === "view_table_history" && (
         <div className="mt-4 space-y-4">
-          <h4 className="text-sm font-medium">📜 테이블 이력 보기 설정</h4>
-
           <div>
             <Label>
               전체 이력 표시 컬럼 (필수) <span className="text-red-600">*</span>
             </Label>
 
-            {!config.action?.historyTableName && !currentTableName ? (
-              <div className="mt-2 rounded-md border border-yellow-300 bg-yellow-50 p-3">
-                <p className="text-xs text-yellow-800">
-                  ⚠️ 먼저 <strong>테이블명</strong>을 입력하거나, 현재 화면에 테이블을 연결해주세요.
-                </p>
-              </div>
-            ) : (
-              <>
-                {!config.action?.historyTableName && currentTableName && (
-                  <div className="mt-2 rounded-md border border-green-300 bg-green-50 p-2">
-                    <p className="text-xs text-green-800">
-                      ✓ 현재 화면의 테이블 <strong>{currentTableName}</strong>을(를) 자동으로 사용합니다.
-                    </p>
-                  </div>
-                )}
-
-                <Popover open={displayColumnOpen} onOpenChange={setDisplayColumnOpen}>
-                  <PopoverTrigger asChild>
-                    <Button
-                      variant="outline"
-                      role="combobox"
-                      aria-expanded={displayColumnOpen}
-                      className="mt-2 h-10 w-full justify-between text-sm"
-                      disabled={columnsLoading || tableColumns.length === 0}
-                    >
-                      {columnsLoading
-                        ? "로딩 중..."
-                        : config.action?.historyDisplayColumn
-                          ? config.action.historyDisplayColumn
-                          : tableColumns.length === 0
-                            ? "사용 가능한 컬럼이 없습니다"
-                            : "컬럼을 선택하세요"}
-                      <ChevronsUpDown className="ml-2 h-4 w-4 shrink-0 opacity-50" />
-                    </Button>
-                  </PopoverTrigger>
-                  <PopoverContent className="p-0" style={{ width: "var(--radix-popover-trigger-width)" }} align="start">
-                    <Command>
-                      <CommandInput placeholder="컬럼 검색..." className="text-sm" />
-                      <CommandList>
-                        <CommandEmpty className="text-sm">컬럼을 찾을 수 없습니다.</CommandEmpty>
-                        <CommandGroup>
-                          {tableColumns.map((column) => (
-                            <CommandItem
-                              key={column}
-                              value={column}
-                              onSelect={(currentValue) => {
-                                onUpdateProperty("componentConfig.action.historyDisplayColumn", currentValue);
-                                setDisplayColumnOpen(false);
-                              }}
-                              className="text-sm"
-                            >
-                              <Check
-                                className={cn(
-                                  "mr-2 h-4 w-4",
-                                  config.action?.historyDisplayColumn === column ? "opacity-100" : "opacity-0",
-                                )}
-                              />
-                              {column}
-                            </CommandItem>
-                          ))}
-                        </CommandGroup>
-                      </CommandList>
-                    </Command>
-                  </PopoverContent>
-                </Popover>
-
-                <p className="mt-2 text-xs text-gray-700">
-                  <strong>전체 테이블 이력</strong>에서 레코드를 구분하기 위한 컬럼입니다.
-                  <br />
-                  예: <code className="rounded bg-white px-1">device_code</code>를 설정하면 이력에 &quot;DTG-001&quot;로
-                  표시됩니다.
-                  <br />이 컬럼으로 검색도 가능합니다.
-                </p>
-
-                {tableColumns.length === 0 && !columnsLoading && (
-                  <p className="mt-2 text-xs text-red-600">
-                    ⚠️ ID 및 날짜 타입 컬럼을 제외한 사용 가능한 컬럼이 없습니다.
-                  </p>
-                )}
-              </>
-            )}
+            <Popover open={displayColumnOpen} onOpenChange={setDisplayColumnOpen}>
+              <PopoverTrigger asChild>
+                <Button
+                  variant="outline"
+                  role="combobox"
+                  aria-expanded={displayColumnOpen}
+                  className="mt-2 h-8 w-full justify-between text-xs"
+                  disabled={columnsLoading || tableColumns.length === 0}
+                >
+                  {columnsLoading
+                    ? "로딩 중..."
+                    : config.action?.historyDisplayColumn
+                      ? config.action.historyDisplayColumn
+                      : tableColumns.length === 0
+                        ? "사용 가능한 컬럼이 없습니다"
+                        : "컬럼을 선택하세요"}
+                  <ChevronsUpDown className="ml-2 h-4 w-4 shrink-0 opacity-50" />
+                </Button>
+              </PopoverTrigger>
+              <PopoverContent className="p-0" style={{ width: "var(--radix-popover-trigger-width)" }} align="start">
+                <Command>
+                  <CommandInput placeholder="컬럼 검색..." className="text-sm" />
+                  <CommandList>
+                    <CommandEmpty className="text-sm">컬럼을 찾을 수 없습니다.</CommandEmpty>
+                    <CommandGroup>
+                      {tableColumns.map((column) => (
+                        <CommandItem
+                          key={column}
+                          value={column}
+                          onSelect={(currentValue) => {
+                            onUpdateProperty("componentConfig.action.historyDisplayColumn", currentValue);
+                            setDisplayColumnOpen(false);
+                          }}
+                          className="text-sm"
+                        >
+                          <Check
+                            className={cn(
+                              "mr-2 h-4 w-4",
+                              config.action?.historyDisplayColumn === column ? "opacity-100" : "opacity-0",
+                            )}
+                          />
+                          {column}
+                        </CommandItem>
+                      ))}
+                    </CommandGroup>
+                  </CommandList>
+                </Command>
+              </PopoverContent>
+            </Popover>
           </div>
         </div>
       )}
@@ -693,6 +659,7 @@ export const ButtonConfigPanel: React.FC<ButtonConfigPanelProps> = ({
                 setLocalInputs((prev) => ({ ...prev, targetUrl: newValue }));
                 onUpdateProperty("componentConfig.action.targetUrl", newValue);
               }}
+              className="h-8 text-xs"
             />
             <p className="mt-1 text-xs text-gray-500">URL을 입력하면 화면 선택보다 우선 적용됩니다</p>
           </div>
diff --git a/frontend/components/screen/panels/ComponentsPanel.tsx b/frontend/components/screen/panels/ComponentsPanel.tsx
index b341cfb2..893bef5f 100644
--- a/frontend/components/screen/panels/ComponentsPanel.tsx
+++ b/frontend/components/screen/panels/ComponentsPanel.tsx
@@ -21,14 +21,14 @@ interface ComponentsPanelProps {
   placedColumns?: Set<string>; // 이미 배치된 컬럼명 집합
 }
 
-export function ComponentsPanel({ 
-  className, 
-  tables = [], 
-  searchTerm = "", 
-  onSearchChange, 
+export function ComponentsPanel({
+  className,
+  tables = [],
+  searchTerm = "",
+  onSearchChange,
   onTableDragStart,
   selectedTableName,
-  placedColumns 
+  placedColumns,
 }: ComponentsPanelProps) {
   const [searchQuery, setSearchQuery] = useState("");
 
@@ -176,8 +176,8 @@ export function ComponentsPanel({
       </div>
 
       {/* 카테고리 탭 */}
-      <Tabs defaultValue="input" className="flex flex-1 flex-col">
-        <TabsList className="mb-3 grid h-8 w-full grid-cols-5">
+      <Tabs defaultValue="input" className="flex min-h-0 flex-1 flex-col">
+        <TabsList className="mb-3 grid h-8 w-full flex-shrink-0 grid-cols-5">
           <TabsTrigger value="tables" className="flex items-center gap-1 px-1 text-xs">
             <Database className="h-3 w-3" />
             <span className="hidden sm:inline">테이블</span>
diff --git a/frontend/components/screen/panels/DetailSettingsPanel.tsx b/frontend/components/screen/panels/DetailSettingsPanel.tsx
index 1320778e..ee50e54d 100644
--- a/frontend/components/screen/panels/DetailSettingsPanel.tsx
+++ b/frontend/components/screen/panels/DetailSettingsPanel.tsx
@@ -1150,7 +1150,7 @@ export const DetailSettingsPanel: React.FC<DetailSettingsPanelProps> = ({
         <div className="space-y-2">
           <label className="block text-sm font-medium text-gray-700">세부 타입 선택</label>
           <Select value={localDetailType} onValueChange={handleDetailTypeChange}>
-            <SelectTrigger className="w-full bg-white">
+            <SelectTrigger className="h-8 w-full bg-white text-xs">
               <SelectValue placeholder="세부 타입을 선택하세요" />
             </SelectTrigger>
             <SelectContent>
diff --git a/frontend/components/screen/panels/PropertiesPanel.tsx b/frontend/components/screen/panels/PropertiesPanel.tsx
index 248e2e8a..2b10322c 100644
--- a/frontend/components/screen/panels/PropertiesPanel.tsx
+++ b/frontend/components/screen/panels/PropertiesPanel.tsx
@@ -551,11 +551,6 @@ const PropertiesPanelComponent: React.FC<PropertiesPanelProps> = ({
 
         {/* 액션 버튼들 */}
         <div className="flex flex-wrap gap-1.5">
-          <Button size="sm" variant="outline" onClick={onCopyComponent} className="h-8 px-2.5 text-xs">
-            <Copy className="mr-1 h-3 w-3" />
-            복사
-          </Button>
-
           {canGroup && (
             <Button size="sm" variant="outline" onClick={onGroupComponents} className="h-8 px-2.5 text-xs">
               <Group className="mr-1 h-3 w-3" />
@@ -569,11 +564,6 @@ const PropertiesPanelComponent: React.FC<PropertiesPanelProps> = ({
               해제
             </Button>
           )}
-
-          <Button size="sm" variant="destructive" onClick={onDeleteComponent} className="h-8 px-2.5 text-xs">
-            <Trash2 className="mr-1 h-3 w-3" />
-            삭제
-          </Button>
         </div>
       </div>
 
diff --git a/frontend/components/screen/panels/ResolutionPanel.tsx b/frontend/components/screen/panels/ResolutionPanel.tsx
index 82072987..44cc5266 100644
--- a/frontend/components/screen/panels/ResolutionPanel.tsx
+++ b/frontend/components/screen/panels/ResolutionPanel.tsx
@@ -82,9 +82,9 @@ const ResolutionPanel: React.FC<ResolutionPanelProps> = ({ currentResolution, on
     <div className="space-y-4">
       {/* 프리셋 선택 */}
       <div className="space-y-2">
-        <Label className="text-sm font-medium">해상도 프리셋</Label>
+        <Label className="text-xs font-medium">해상도 프리셋</Label>
         <Select value={selectedPreset} onValueChange={handlePresetChange}>
-          <SelectTrigger>
+          <SelectTrigger className="h-8 text-xs">
             <SelectValue placeholder="해상도를 선택하세요" />
           </SelectTrigger>
           <SelectContent>
@@ -93,7 +93,7 @@ const ResolutionPanel: React.FC<ResolutionPanelProps> = ({ currentResolution, on
             {SCREEN_RESOLUTIONS.filter((r) => r.category === "desktop").map((resolution) => (
               <SelectItem key={resolution.name} value={resolution.name}>
                 <div className="flex items-center space-x-2">
-                  <Monitor className="h-4 w-4 text-primary" />
+                  <Monitor className="text-primary h-4 w-4" />
                   <span>{resolution.name}</span>
                 </div>
               </SelectItem>
@@ -125,7 +125,7 @@ const ResolutionPanel: React.FC<ResolutionPanelProps> = ({ currentResolution, on
             <div className="px-2 py-1 text-xs font-medium text-gray-500">사용자 정의</div>
             <SelectItem value="custom">
               <div className="flex items-center space-x-2">
-                <Settings className="h-4 w-4 text-muted-foreground" />
+                <Settings className="text-muted-foreground h-4 w-4" />
                 <span>사용자 정의</span>
               </div>
             </SelectItem>
@@ -139,43 +139,33 @@ const ResolutionPanel: React.FC<ResolutionPanelProps> = ({ currentResolution, on
           <Label className="text-sm font-medium">사용자 정의 해상도</Label>
           <div className="grid grid-cols-2 gap-3">
             <div className="space-y-1">
-              <Label className="text-xs text-muted-foreground">너비 (px)</Label>
+              <Label className="text-muted-foreground text-xs">너비 (px)</Label>
               <Input
                 type="number"
                 value={customWidth}
                 onChange={(e) => setCustomWidth(e.target.value)}
                 placeholder="1920"
                 min="1"
+                className="h-8 text-xs"
               />
             </div>
             <div className="space-y-1">
-              <Label className="text-xs text-muted-foreground">높이 (px)</Label>
+              <Label className="text-muted-foreground text-xs">높이 (px)</Label>
               <Input
                 type="number"
                 value={customHeight}
                 onChange={(e) => setCustomHeight(e.target.value)}
                 placeholder="1080"
                 min="1"
+                className="h-8 text-xs"
               />
             </div>
           </div>
-          <Button onClick={handleCustomResolution} size="sm" className="w-full">
+          <Button onClick={handleCustomResolution} size="sm" className="h-8 w-full text-xs">
             적용
           </Button>
         </div>
       )}
-
-      {/* 해상도 정보 */}
-      <div className="space-y-2 text-xs text-gray-500">
-        <div className="flex items-center justify-between">
-          <span>화면 비율:</span>
-          <span>{(currentResolution.width / currentResolution.height).toFixed(2)}:1</span>
-        </div>
-        <div className="flex items-center justify-between">
-          <span>총 픽셀:</span>
-          <span>{(currentResolution.width * currentResolution.height).toLocaleString()}</span>
-        </div>
-      </div>
     </div>
   );
 };
diff --git a/frontend/components/screen/panels/UnifiedPropertiesPanel.tsx b/frontend/components/screen/panels/UnifiedPropertiesPanel.tsx
index bb6ccf66..6e992de0 100644
--- a/frontend/components/screen/panels/UnifiedPropertiesPanel.tsx
+++ b/frontend/components/screen/panels/UnifiedPropertiesPanel.tsx
@@ -202,15 +202,6 @@ export const UnifiedPropertiesPanel: React.FC<UnifiedPropertiesPanelProps> = ({
 
     return (
       <div className="space-y-1.5">
-        {/* 컴포넌트 정보 - 간소화 */}
-        <div className="bg-muted flex items-center justify-between rounded px-2 py-1">
-          <div className="flex items-center gap-1">
-            <Info className="text-muted-foreground h-2.5 w-2.5" />
-            <span className="text-foreground text-[10px] font-medium">{selectedComponent.type}</span>
-          </div>
-          <span className="text-muted-foreground text-[9px]">{selectedComponent.id.slice(0, 8)}</span>
-        </div>
-
         {/* 라벨 + 최소 높이 (같은 행) */}
         <div className="grid grid-cols-2 gap-1.5">
           <div className="space-y-0.5">
@@ -300,24 +291,15 @@ export const UnifiedPropertiesPanel: React.FC<UnifiedPropertiesPanelProps> = ({
           </div>
         )}
 
-        {/* 위치 */}
-        <div className="grid grid-cols-3 gap-2">
-          <div>
-            <Label>X {dragState?.isDragging && <Badge variant="secondary">드래그중</Badge>}</Label>
-            <Input type="number" value={Math.round(currentPosition.x || 0)} disabled />
-          </div>
-          <div>
-            <Label>Y</Label>
-            <Input type="number" value={Math.round(currentPosition.y || 0)} disabled />
-          </div>
-          <div>
-            <Label>Z</Label>
-            <Input
-              type="number"
-              value={currentPosition.z || 1}
-              onChange={(e) => handleUpdate("position.z", parseInt(e.target.value) || 1)}
-            />
-          </div>
+        {/* Z-Index */}
+        <div className="space-y-0.5">
+          <Label className="text-[10px]">Z-Index (레이어)</Label>
+          <Input
+            type="number"
+            value={currentPosition.z || 1}
+            onChange={(e) => handleUpdate("position.z", parseInt(e.target.value) || 1)}
+            className="h-6 text-[10px]"
+          />
         </div>
 
         {/* 라벨 스타일 */}
@@ -389,33 +371,6 @@ export const UnifiedPropertiesPanel: React.FC<UnifiedPropertiesPanelProps> = ({
             </div>
           )}
         </div>
-
-        {/* 액션 버튼 */}
-        <Separator />
-        <div className="flex gap-2">
-          {onCopyComponent && (
-            <Button
-              variant="outline"
-              size="sm"
-              onClick={() => onCopyComponent(selectedComponent.id)}
-              className="flex-1"
-            >
-              <Copy className="mr-2 h-4 w-4" />
-              복사
-            </Button>
-          )}
-          {onDeleteComponent && (
-            <Button
-              variant="outline"
-              size="sm"
-              onClick={() => onDeleteComponent(selectedComponent.id)}
-              className="flex-1 text-red-600 hover:bg-red-50 hover:text-red-700"
-            >
-              <Trash2 className="mr-2 h-4 w-4" />
-              삭제
-            </Button>
-          )}
-        </div>
       </div>
     );
   };
@@ -513,7 +468,7 @@ export const UnifiedPropertiesPanel: React.FC<UnifiedPropertiesPanelProps> = ({
             <div>
               <Label>세부 타입</Label>
               <Select value={localComponentDetailType || webType} onValueChange={handleDetailTypeChange}>
-                <SelectTrigger>
+                <SelectTrigger className="h-8 text-xs">
                   <SelectValue placeholder="세부 타입 선택" />
                 </SelectTrigger>
                 <SelectContent>
@@ -561,7 +516,7 @@ export const UnifiedPropertiesPanel: React.FC<UnifiedPropertiesPanelProps> = ({
             <div>
               <Label>입력 타입</Label>
               <Select value={widget.webType} onValueChange={(value) => handleUpdate("webType", value)}>
-                <SelectTrigger>
+                <SelectTrigger className="h-8 text-xs">
                   <SelectValue />
                 </SelectTrigger>
                 <SelectContent>
diff --git a/frontend/components/screen/panels/webtype-configs/CheckboxTypeConfigPanel.tsx b/frontend/components/screen/panels/webtype-configs/CheckboxTypeConfigPanel.tsx
index abc400bb..4a6016aa 100644
--- a/frontend/components/screen/panels/webtype-configs/CheckboxTypeConfigPanel.tsx
+++ b/frontend/components/screen/panels/webtype-configs/CheckboxTypeConfigPanel.tsx
@@ -90,11 +90,11 @@ export const CheckboxTypeConfigPanel: React.FC<CheckboxTypeConfigPanelProps> = (
 
     const newConfig = JSON.parse(JSON.stringify(currentValues));
     // console.log("☑️ CheckboxTypeConfig 업데이트:", {
-      // key,
-      // value,
-      // oldConfig: safeConfig,
-      // newConfig,
-      // localValues,
+    // key,
+    // value,
+    // oldConfig: safeConfig,
+    // newConfig,
+    // localValues,
     // });
 
     setTimeout(() => {
@@ -122,7 +122,7 @@ export const CheckboxTypeConfigPanel: React.FC<CheckboxTypeConfigPanelProps> = (
           라벨 위치
         </Label>
         <Select value={localValues.labelPosition} onValueChange={(value) => updateConfig("labelPosition", value)}>
-          <SelectTrigger className="mt-1">
+          <SelectTrigger className="mt-1 h-8 text-xs">
             <SelectValue placeholder="라벨 위치 선택" />
           </SelectTrigger>
           <SelectContent>
@@ -218,7 +218,7 @@ export const CheckboxTypeConfigPanel: React.FC<CheckboxTypeConfigPanelProps> = (
 
       {/* 안내 메시지 */}
       {localValues.indeterminate && (
-        <div className="rounded-md bg-accent p-3">
+        <div className="bg-accent rounded-md p-3">
           <div className="text-sm font-medium text-blue-900">불확정 상태</div>
           <div className="mt-1 text-xs text-blue-800">
             체크박스가 부분적으로 선택된 상태를 나타낼 수 있습니다. 주로 트리 구조에서 일부 하위 항목만 선택된 경우에
diff --git a/frontend/components/screen/panels/webtype-configs/CodeTypeConfigPanel.tsx b/frontend/components/screen/panels/webtype-configs/CodeTypeConfigPanel.tsx
index 2f735751..02736828 100644
--- a/frontend/components/screen/panels/webtype-configs/CodeTypeConfigPanel.tsx
+++ b/frontend/components/screen/panels/webtype-configs/CodeTypeConfigPanel.tsx
@@ -105,10 +105,10 @@ export const CodeTypeConfigPanel: React.FC<CodeTypeConfigPanelProps> = ({ config
     // 실제 config 업데이트
     const newConfig = { ...safeConfig, [key]: value };
     // console.log("💻 CodeTypeConfig 업데이트:", {
-      // key,
-      // value,
-      // oldConfig: safeConfig,
-      // newConfig,
+    // key,
+    // value,
+    // oldConfig: safeConfig,
+    // newConfig,
     // });
     onConfigChange(newConfig);
   };
@@ -121,7 +121,7 @@ export const CodeTypeConfigPanel: React.FC<CodeTypeConfigPanelProps> = ({ config
           프로그래밍 언어
         </Label>
         <Select value={localValues.language} onValueChange={(value) => updateConfig("language", value)}>
-          <SelectTrigger className="mt-1">
+          <SelectTrigger className="mt-1 h-8 text-xs">
             <SelectValue placeholder="언어 선택" />
           </SelectTrigger>
           <SelectContent className="max-h-60">
@@ -140,7 +140,7 @@ export const CodeTypeConfigPanel: React.FC<CodeTypeConfigPanelProps> = ({ config
           테마
         </Label>
         <Select value={localValues.theme} onValueChange={(value) => updateConfig("theme", value)}>
-          <SelectTrigger className="mt-1">
+          <SelectTrigger className="mt-1 h-8 text-xs">
             <SelectValue placeholder="테마 선택" />
           </SelectTrigger>
           <SelectContent>
@@ -271,7 +271,7 @@ export const CodeTypeConfigPanel: React.FC<CodeTypeConfigPanelProps> = ({ config
       </div>
 
       {/* 안내 메시지 */}
-      <div className="rounded-md bg-accent p-3">
+      <div className="bg-accent rounded-md p-3">
         <div className="text-sm font-medium text-blue-900">코드 에디터 설정</div>
         <div className="mt-1 text-xs text-blue-800">
           • 문법 강조 표시는 선택된 언어에 따라 적용됩니다
diff --git a/frontend/components/screen/panels/webtype-configs/DateTypeConfigPanel.tsx b/frontend/components/screen/panels/webtype-configs/DateTypeConfigPanel.tsx
index 1e30def2..e488e45b 100644
--- a/frontend/components/screen/panels/webtype-configs/DateTypeConfigPanel.tsx
+++ b/frontend/components/screen/panels/webtype-configs/DateTypeConfigPanel.tsx
@@ -27,8 +27,8 @@ export const DateTypeConfigPanel: React.FC<DateTypeConfigPanelProps> = ({ config
   // 로컬 상태로 실시간 입력 관리
   const [localValues, setLocalValues] = useState(() => {
     // console.log("📅 DateTypeConfigPanel 초기 상태 설정:", {
-      // config,
-      // safeConfig,
+    // config,
+    // safeConfig,
     // });
 
     return {
@@ -47,17 +47,17 @@ export const DateTypeConfigPanel: React.FC<DateTypeConfigPanelProps> = ({ config
     const hasValidConfig = config && Object.keys(config).length > 0;
 
     // console.log("📅 DateTypeConfigPanel config 변경 감지:", {
-      // config,
-      // configExists: !!config,
-      // configKeys: config ? Object.keys(config) : [],
-      // hasValidConfig,
-      // safeConfig,
-      // safeConfigKeys: Object.keys(safeConfig),
-      // currentLocalValues: localValues,
-      // configStringified: JSON.stringify(config),
-      // safeConfigStringified: JSON.stringify(safeConfig),
-      // willUpdateLocalValues: hasValidConfig,
-      // timestamp: new Date().toISOString(),
+    // config,
+    // configExists: !!config,
+    // configKeys: config ? Object.keys(config) : [],
+    // hasValidConfig,
+    // safeConfig,
+    // safeConfigKeys: Object.keys(safeConfig),
+    // currentLocalValues: localValues,
+    // configStringified: JSON.stringify(config),
+    // safeConfigStringified: JSON.stringify(safeConfig),
+    // willUpdateLocalValues: hasValidConfig,
+    // timestamp: new Date().toISOString(),
     // });
 
     // config가 없거나 비어있으면 로컬 상태를 유지
@@ -85,17 +85,17 @@ export const DateTypeConfigPanel: React.FC<DateTypeConfigPanelProps> = ({ config
       localValues.maxDate !== newLocalValues.maxDate;
 
     // console.log("🔄 로컬 상태 업데이트 검사:", {
-      // oldLocalValues: localValues,
-      // newLocalValues,
-      // hasChanges,
-      // changes: {
-        // format: localValues.format !== newLocalValues.format,
-        // showTime: localValues.showTime !== newLocalValues.showTime,
-        // defaultValue: localValues.defaultValue !== newLocalValues.defaultValue,
-        // placeholder: localValues.placeholder !== newLocalValues.placeholder,
-        // minDate: localValues.minDate !== newLocalValues.minDate,
-        // maxDate: localValues.maxDate !== newLocalValues.maxDate,
-      // },
+    // oldLocalValues: localValues,
+    // newLocalValues,
+    // hasChanges,
+    // changes: {
+    // format: localValues.format !== newLocalValues.format,
+    // showTime: localValues.showTime !== newLocalValues.showTime,
+    // defaultValue: localValues.defaultValue !== newLocalValues.defaultValue,
+    // placeholder: localValues.placeholder !== newLocalValues.placeholder,
+    // minDate: localValues.minDate !== newLocalValues.minDate,
+    // maxDate: localValues.maxDate !== newLocalValues.maxDate,
+    // },
     // });
 
     if (hasChanges) {
@@ -113,34 +113,34 @@ export const DateTypeConfigPanel: React.FC<DateTypeConfigPanelProps> = ({ config
     // 실제 config 업데이트 - 현재 로컬 상태를 기반으로 새 객체 생성 (safeConfig 기본값 덮어쓰기 방지)
     const newConfig = JSON.parse(JSON.stringify({ ...localValues, [key]: value }));
     // console.log("📅 DateTypeConfig 업데이트:", {
-      // key,
-      // value,
-      // oldConfig: safeConfig,
-      // newConfig,
-      // localValues,
-      // timestamp: new Date().toISOString(),
-      // changes: {
-        // format: newConfig.format !== safeConfig.format,
-        // showTime: newConfig.showTime !== safeConfig.showTime,
-        // placeholder: newConfig.placeholder !== safeConfig.placeholder,
-        // minDate: newConfig.minDate !== safeConfig.minDate,
-        // maxDate: newConfig.maxDate !== safeConfig.maxDate,
-        // defaultValue: newConfig.defaultValue !== safeConfig.defaultValue,
-      // },
-      // willCallOnConfigChange: true,
+    // key,
+    // value,
+    // oldConfig: safeConfig,
+    // newConfig,
+    // localValues,
+    // timestamp: new Date().toISOString(),
+    // changes: {
+    // format: newConfig.format !== safeConfig.format,
+    // showTime: newConfig.showTime !== safeConfig.showTime,
+    // placeholder: newConfig.placeholder !== safeConfig.placeholder,
+    // minDate: newConfig.minDate !== safeConfig.minDate,
+    // maxDate: newConfig.maxDate !== safeConfig.maxDate,
+    // defaultValue: newConfig.defaultValue !== safeConfig.defaultValue,
+    // },
+    // willCallOnConfigChange: true,
     // });
 
     // console.log("🔄 onConfigChange 호출 직전:", {
-      // newConfig,
-      // configStringified: JSON.stringify(newConfig),
+    // newConfig,
+    // configStringified: JSON.stringify(newConfig),
     // });
 
     // 약간의 지연을 두고 업데이트 (배치 업데이트 방지)
     setTimeout(() => {
       // console.log("✅ onConfigChange 호출 완료:", {
-        // key,
-        // newConfig,
-        // timestamp: new Date().toISOString(),
+      // key,
+      // newConfig,
+      // timestamp: new Date().toISOString(),
       // });
       onConfigChange(newConfig);
     }, 0);
@@ -157,9 +157,9 @@ export const DateTypeConfigPanel: React.FC<DateTypeConfigPanelProps> = ({ config
           value={localValues.format}
           onValueChange={(value) => {
             // console.log("📅 날짜 형식 변경:", {
-              // oldFormat: localValues.format,
-              // newFormat: value,
-              // oldShowTime: localValues.showTime,
+            // oldFormat: localValues.format,
+            // newFormat: value,
+            // oldShowTime: localValues.showTime,
             // });
 
             // format 변경 시 showTime도 자동 동기화
@@ -175,9 +175,9 @@ export const DateTypeConfigPanel: React.FC<DateTypeConfigPanelProps> = ({ config
             );
 
             // console.log("🔄 format+showTime 동시 업데이트:", {
-              // newFormat: value,
-              // newShowTime: hasTime,
-              // newConfig,
+            // newFormat: value,
+            // newShowTime: hasTime,
+            // newConfig,
             // });
 
             // 로컬 상태도 동시 업데이트
@@ -193,7 +193,7 @@ export const DateTypeConfigPanel: React.FC<DateTypeConfigPanelProps> = ({ config
             }, 0);
           }}
         >
-          <SelectTrigger className="mt-1">
+          <SelectTrigger className="mt-1 h-8 text-xs">
             <SelectValue placeholder="날짜 형식 선택" />
           </SelectTrigger>
           <SelectContent>
@@ -215,9 +215,9 @@ export const DateTypeConfigPanel: React.FC<DateTypeConfigPanelProps> = ({ config
           onCheckedChange={(checked) => {
             const newShowTime = !!checked;
             // console.log("⏰ 시간 표시 체크박스 변경:", {
-              // oldShowTime: localValues.showTime,
-              // newShowTime,
-              // currentFormat: localValues.format,
+            // oldShowTime: localValues.showTime,
+            // newShowTime,
+            // currentFormat: localValues.format,
             // });
 
             // showTime 변경 시 format도 적절히 조정
@@ -231,9 +231,9 @@ export const DateTypeConfigPanel: React.FC<DateTypeConfigPanelProps> = ({ config
             }
 
             // console.log("🔄 showTime+format 동시 업데이트:", {
-              // newShowTime,
-              // oldFormat: localValues.format,
-              // newFormat,
+            // newShowTime,
+            // oldFormat: localValues.format,
+            // newFormat,
             // });
 
             // 한 번에 두 값을 모두 업데이트 - 현재 로컬 상태 기반으로 생성
diff --git a/frontend/components/screen/panels/webtype-configs/EntityTypeConfigPanel.tsx b/frontend/components/screen/panels/webtype-configs/EntityTypeConfigPanel.tsx
index 656f482d..893fb100 100644
--- a/frontend/components/screen/panels/webtype-configs/EntityTypeConfigPanel.tsx
+++ b/frontend/components/screen/panels/webtype-configs/EntityTypeConfigPanel.tsx
@@ -92,10 +92,10 @@ export const EntityTypeConfigPanel: React.FC<EntityTypeConfigPanelProps> = ({ co
     // 실제 config 업데이트
     const newConfig = { ...safeConfig, [key]: value };
     // console.log("🏢 EntityTypeConfig 업데이트:", {
-      // key,
-      // value,
-      // oldConfig: safeConfig,
-      // newConfig,
+    // key,
+    // value,
+    // oldConfig: safeConfig,
+    // newConfig,
     // });
     onConfigChange(newConfig);
   };
@@ -233,7 +233,7 @@ export const EntityTypeConfigPanel: React.FC<EntityTypeConfigPanelProps> = ({ co
           표시 형식
         </Label>
         <Select value={localValues.displayFormat} onValueChange={(value) => updateConfig("displayFormat", value)}>
-          <SelectTrigger className="mt-1">
+          <SelectTrigger className="mt-1 h-8 text-xs">
             <SelectValue placeholder="형식 선택" />
           </SelectTrigger>
           <SelectContent>
@@ -317,7 +317,7 @@ export const EntityTypeConfigPanel: React.FC<EntityTypeConfigPanelProps> = ({ co
         <div className="mt-2">
           <div className="flex items-center space-x-2 rounded border bg-white p-2">
             <Search className="h-4 w-4 text-gray-400" />
-            <div className="flex-1 text-sm text-muted-foreground">
+            <div className="text-muted-foreground flex-1 text-sm">
               {localValues.placeholder || `${localValues.referenceTable || "엔터티"}를 선택하세요`}
             </div>
             <Database className="h-4 w-4 text-gray-400" />
@@ -334,7 +334,7 @@ export const EntityTypeConfigPanel: React.FC<EntityTypeConfigPanelProps> = ({ co
       </div>
 
       {/* 안내 메시지 */}
-      <div className="rounded-md bg-accent p-3">
+      <div className="bg-accent rounded-md p-3">
         <div className="text-sm font-medium text-blue-900">엔터티 타입 설정 가이드</div>
         <div className="mt-1 text-xs text-blue-800">
           • <strong>참조 테이블</strong>: 데이터를 가져올 다른 테이블 이름
diff --git a/frontend/components/screen/panels/webtype-configs/NumberTypeConfigPanel.tsx b/frontend/components/screen/panels/webtype-configs/NumberTypeConfigPanel.tsx
index 5ad60139..d317c049 100644
--- a/frontend/components/screen/panels/webtype-configs/NumberTypeConfigPanel.tsx
+++ b/frontend/components/screen/panels/webtype-configs/NumberTypeConfigPanel.tsx
@@ -89,12 +89,12 @@ export const NumberTypeConfigPanel: React.FC<NumberTypeConfigPanelProps> = ({ co
 
     const newConfig = JSON.parse(JSON.stringify(currentValues));
     // console.log("🔢 NumberTypeConfig 업데이트:", {
-      // key,
-      // value,
-      // oldConfig: safeConfig,
-      // newConfig,
-      // localValues,
-      // timestamp: new Date().toISOString(),
+    // key,
+    // value,
+    // oldConfig: safeConfig,
+    // newConfig,
+    // localValues,
+    // timestamp: new Date().toISOString(),
     // });
 
     // 약간의 지연을 두고 업데이트 (배치 업데이트 방지)
@@ -111,7 +111,7 @@ export const NumberTypeConfigPanel: React.FC<NumberTypeConfigPanelProps> = ({ co
           숫자 형식
         </Label>
         <Select value={localValues.format} onValueChange={(value) => updateConfig("format", value)}>
-          <SelectTrigger className="mt-1">
+          <SelectTrigger className="mt-1 h-8 text-xs">
             <SelectValue placeholder="숫자 형식 선택" />
           </SelectTrigger>
           <SelectContent>
diff --git a/frontend/components/screen/panels/webtype-configs/SelectTypeConfigPanel.tsx b/frontend/components/screen/panels/webtype-configs/SelectTypeConfigPanel.tsx
index a1ef00c5..819aaae9 100644
--- a/frontend/components/screen/panels/webtype-configs/SelectTypeConfigPanel.tsx
+++ b/frontend/components/screen/panels/webtype-configs/SelectTypeConfigPanel.tsx
@@ -82,11 +82,11 @@ export const SelectTypeConfigPanel: React.FC<SelectTypeConfigPanelProps> = ({ co
     // 실제 config 업데이트 - 깊은 복사로 새 객체 보장
     const newConfig = JSON.parse(JSON.stringify({ ...safeConfig, [key]: value }));
     // console.log("📋 SelectTypeConfig 업데이트:", {
-      // key,
-      // value,
-      // oldConfig: safeConfig,
-      // newConfig,
-      // timestamp: new Date().toISOString(),
+    // key,
+    // value,
+    // oldConfig: safeConfig,
+    // newConfig,
+    // timestamp: new Date().toISOString(),
     // });
 
     // 약간의 지연을 두고 업데이트 (배치 업데이트 방지)
@@ -101,10 +101,10 @@ export const SelectTypeConfigPanel: React.FC<SelectTypeConfigPanelProps> = ({ co
       const updatedOptions = [...(safeConfig.options || []), newOptionData];
 
       // console.log("➕ SelectType 옵션 추가:", {
-        // newOption: newOptionData,
-        // updatedOptions,
-        // currentLocalOptions: localOptions,
-        // timestamp: new Date().toISOString(),
+      // newOption: newOptionData,
+      // updatedOptions,
+      // currentLocalOptions: localOptions,
+      // timestamp: new Date().toISOString(),
       // });
 
       // 로컬 상태 즉시 업데이트
@@ -128,9 +128,9 @@ export const SelectTypeConfigPanel: React.FC<SelectTypeConfigPanelProps> = ({ co
 
   const removeOption = (index: number) => {
     // console.log("➖ SelectType 옵션 삭제:", {
-      // removeIndex: index,
-      // currentOptions: safeConfig.options,
-      // currentLocalOptions: localOptions,
+    // removeIndex: index,
+    // currentOptions: safeConfig.options,
+    // currentLocalOptions: localOptions,
     // });
 
     // 로컬 상태 즉시 업데이트
@@ -170,7 +170,7 @@ export const SelectTypeConfigPanel: React.FC<SelectTypeConfigPanelProps> = ({ co
             value={localValues.placeholder}
             onChange={(e) => updateConfig("placeholder", e.target.value)}
             placeholder="옵션을 선택하세요"
-            className="mt-1"
+            className="mt-1 h-8 text-xs"
           />
         </div>
 
diff --git a/frontend/components/screen/panels/webtype-configs/TextTypeConfigPanel.tsx b/frontend/components/screen/panels/webtype-configs/TextTypeConfigPanel.tsx
index e4f7dc8d..30327894 100644
--- a/frontend/components/screen/panels/webtype-configs/TextTypeConfigPanel.tsx
+++ b/frontend/components/screen/panels/webtype-configs/TextTypeConfigPanel.tsx
@@ -94,11 +94,11 @@ export const TextTypeConfigPanel: React.FC<TextTypeConfigPanelProps> = ({ config
 
     const newConfig = JSON.parse(JSON.stringify(currentValues));
     // console.log("📝 TextTypeConfig 업데이트:", {
-      // key,
-      // value,
-      // oldConfig: safeConfig,
-      // newConfig,
-      // localValues,
+    // key,
+    // value,
+    // oldConfig: safeConfig,
+    // newConfig,
+    // localValues,
     // });
 
     setTimeout(() => {
@@ -114,7 +114,7 @@ export const TextTypeConfigPanel: React.FC<TextTypeConfigPanelProps> = ({ config
           입력 형식
         </Label>
         <Select value={localValues.format} onValueChange={(value) => updateConfig("format", value)}>
-          <SelectTrigger className="mt-1">
+          <SelectTrigger className="mt-1 h-8 text-xs">
             <SelectValue placeholder="입력 형식 선택" />
           </SelectTrigger>
           <SelectContent>
@@ -220,13 +220,13 @@ export const TextTypeConfigPanel: React.FC<TextTypeConfigPanelProps> = ({ config
         </div>
 
         {localValues.autoInput && (
-          <div className="space-y-3 border-l-2 border-primary/20 pl-4">
+          <div className="border-primary/20 space-y-3 border-l-2 pl-4">
             <div>
               <Label htmlFor="autoValueType" className="text-sm font-medium">
                 자동값 타입
               </Label>
               <Select value={localValues.autoValueType} onValueChange={(value) => updateConfig("autoValueType", value)}>
-                <SelectTrigger className="mt-1">
+                <SelectTrigger className="mt-1 h-8 text-xs">
                   <SelectValue placeholder="자동값 타입 선택" />
                 </SelectTrigger>
                 <SelectContent>
@@ -256,7 +256,7 @@ export const TextTypeConfigPanel: React.FC<TextTypeConfigPanelProps> = ({ config
               </div>
             )}
 
-            <div className="rounded-md bg-accent p-3">
+            <div className="bg-accent rounded-md p-3">
               <div className="text-sm font-medium text-blue-900">자동입력 안내</div>
               <div className="mt-1 text-xs text-blue-800">
                 자동입력이 활성화되면 해당 필드는 읽기 전용이 되며, 설정된 타입에 따라 자동으로 값이 입력됩니다.
@@ -280,7 +280,7 @@ export const TextTypeConfigPanel: React.FC<TextTypeConfigPanelProps> = ({ config
 
       {/* 형식별 안내 메시지 */}
       {localValues.format !== "none" && (
-        <div className="rounded-md bg-accent p-3">
+        <div className="bg-accent rounded-md p-3">
           <div className="text-sm font-medium text-blue-900">형식 안내</div>
           <div className="mt-1 text-xs text-blue-800">
             {localValues.format === "email" && "유효한 이메일 주소를 입력해야 합니다 (예: user@example.com)"}