style: 채번규칙 미리보기 UI 간소화

- '미리보기' 제목 및 Card 컴포넌트 제거
- '코드 미리보기' 라벨 제거
- 한 줄로 간결하게 표현 (px-3 py-2)
- 불필요한 여백 제거로 깔끔한 레이아웃

frontend/components/numbering-rule/NumberingRuleDesigner.tsx

@@ -322,14 +322,9 @@ export const NumberingRuleDesigner: React.FC<NumberingRuleDesignerProps> = ({
               />
             </div>
 
-            <Card className="border-border bg-card">
-              <CardHeader className="pb-3">
-                <CardTitle className="text-sm font-medium">미리보기</CardTitle>
-              </CardHeader>
-              <CardContent>
-                <NumberingRulePreview config={currentRule} />
-              </CardContent>
-            </Card>
+            <div className="space-y-2">
+              <NumberingRulePreview config={currentRule} />
+            </div>
 
             <div className="flex-1 overflow-y-auto">
               <div className="mb-3 flex items-center justify-between">

frontend/components/numbering-rule/NumberingRulePreview.tsx

@@ -81,11 +81,8 @@ export const NumberingRulePreview: React.FC<NumberingRulePreviewProps> = ({
   }
 
   return (
-    <div className="space-y-2">
-      <p className="text-xs text-muted-foreground sm:text-sm">코드 미리보기</p>
-      <div className="rounded-md bg-muted p-3 sm:p-4">
-        <code className="text-sm font-mono text-foreground sm:text-base">{generatedCode}</code>
-      </div>
+    <div className="rounded-md bg-muted px-3 py-2">
+      <code className="text-sm font-mono text-foreground">{generatedCode}</code>
     </div>
   );
 };