feat: 화면관리 시스템 구현

- 컴포넌트 드래그앤드롭 시스템 완성
- 속성 편집 및 실시간 미리보기 기능
- 버튼 시스템 통합 (유니버설 버튼)
- 격자 시스템 및 해상도 설정 패널
- 상세설정 패널 구현
- 스타일 편집기 최적화
- 라벨 처리 시스템 개선

frontend/components/screen/DesignerToolbar.tsx

@@ -16,6 +16,7 @@ import {
   ArrowLeft,
   Cog,
   Layout,
+  Monitor,
 } from "lucide-react";
 import { cn } from "@/lib/utils";
 
@@ -152,6 +153,19 @@ export const DesignerToolbar: React.FC<DesignerToolbarProps> = ({
             D
           </Badge>
         </Button>
+
+        <Button
+          variant={panelStates.resolution?.isOpen ? "default" : "outline"}
+          size="sm"
+          onClick={() => onTogglePanel("resolution")}
+          className={cn("flex items-center space-x-2", panelStates.resolution?.isOpen && "bg-blue-600 text-white")}
+        >
+          <Monitor className="h-4 w-4" />
+          <span>해상도</span>
+          <Badge variant="secondary" className="ml-1 text-xs">
+            E
+          </Badge>
+        </Button>
       </div>
 
       {/* 우측: 액션 버튼들 */}