feat(preview): add tablet device mode with scaled frame styling

vibn-frontend/app/[workspace]/project/[projectId]/(home)/preview/page.tsx

@@ -255,11 +255,22 @@ export default function PreviewTab() {
       >
         <div
           style={{
-            ...(deviceMode === "desktop" ? desktopFrame : mobileFrame),
+            ...(deviceMode === "desktop"
+              ? desktopFrame
+              : deviceMode === "tablet"
+                ? tabletFrame
+                : mobileFrame),
             transition: "all 0.3s ease",
+            transform:
+              deviceMode === "tablet"
+                ? "scale(0.85)"
+                : deviceMode === "mobile"
+                  ? "scale(0.95)"
+                  : "none",
+            transformOrigin: "center center",
           }}
         >
-          {deviceMode === "mobile" && <MobileChrome />}
+          {deviceMode !== "desktop" && <MobileChrome />}
 
           {iframeSrc ? (
             <iframe
@@ -273,7 +284,12 @@ export default function PreviewTab() {
               onLoad={() => bridge?.notifyPreviewIframeLoaded()}
               style={{
                 ...iframeStyle,
-                borderRadius: deviceMode === "mobile" ? 44 : 0,
+                borderRadius:
+                  deviceMode === "mobile"
+                    ? 44
+                    : deviceMode === "tablet"
+                      ? 28
+                      : 0,
               }}
               {...(sandboxIframe(iframeSrc, origin)
                 ? { sandbox: SAME_ORIGIN_SANDBOX }
@@ -283,7 +299,9 @@ export default function PreviewTab() {
             <div style={loaderWrap}>{emptyContent}</div>
           )}
 
-          {deviceMode === "mobile" && <div style={homeIndicator} aria-hidden />}
+          {deviceMode !== "desktop" && (
+            <div style={homeIndicator} aria-hidden />
+          )}
         </div>
       </div>
     </div>
@@ -566,6 +584,21 @@ const desktopFrame: React.CSSProperties = {
     "0 1px 2px rgba(26, 26, 26, 0.04), 0 12px 40px rgba(26, 26, 26, 0.07), inset 0 1px 0 rgba(255, 255, 255, 0.85)",
 };
 
+const tabletFrame: React.CSSProperties = {
+  position: "relative",
+  width: 768,
+  height: 1024,
+  flexShrink: 0,
+  borderRadius: 40,
+  overflow: "hidden",
+  background: "#000",
+  border: "14px solid #1a1a1a",
+  boxShadow:
+    "0 0 0 1px rgba(255,255,255,0.1) inset, 0 24px 60px rgba(26, 26, 26, 0.15)",
+  display: "flex",
+  flexDirection: "column",
+};
+
 const mobileFrame: React.CSSProperties = {
   position: "relative",
   width: 390,