feat: 화면 관리 및 대시보드 뷰어 레이아웃 전체 너비 활용 개선

- 화면 관리 페이지에서 position.x === 0인 컴포넌트가 100% 너비로 표시되도록 수정
- 대시보드 뷰어에서 부모 컨테이너의 maxWidth 제한 제거하여 화면 전체 너비 활용
- AppLayout의 main 영역에 16px 내부 패딩 적용
- RealtimePreview 및 RealtimePreviewDynamic 컴포넌트에서 좌측 정렬 컴포넌트 너비 자동 조정
- 모바일 환경에서 화면 스케일링 비활성화 (반응형만 작동)
- table-mobile-fixed CSS 클래스 추가로 모바일 테이블 레이아웃 개선
- useResponsive 훅 추가로 반응형 감지 기능 구현

frontend/components/screen/RealtimePreviewDynamic.tsx

@@ -238,11 +238,15 @@ export const RealtimePreviewDynamic: React.FC<RealtimePreviewProps> = ({
   const baseStyle = {
     left: `${position.x}px`,
     top: `${position.y}px`,
-    width: getWidth(),
+    // 🆕 left가 0이면 부모 너비를 100% 채우도록 수정 (우측 여백 제거)
+    width: position.x === 0 ? "100%" : getWidth(),
     height: getHeight(), // 모든 컴포넌트 고정 높이로 변경
     zIndex: component.type === "layout" ? 1 : position.z || 2, // 레이아웃은 z-index 1, 다른 컴포넌트는 2 이상
     ...componentStyle,
-    // style.width와 style.height는 이미 getWidth/getHeight에서 처리했으므로 중복 적용됨
+    // style.width가 있어도 position.x === 0이면 100%로 강제
+    ...(position.x === 0 && { width: "100%" }),
+    // right 속성 강제 제거
+    right: undefined,
   };
 
   const handleClick = (e: React.MouseEvent) => {