diff --git a/mobile/src/components/ProductCard.tsx b/mobile/src/components/ProductCard.tsx
index a6872ffe..3b66961e 100644
--- a/mobile/src/components/ProductCard.tsx
+++ b/mobile/src/components/ProductCard.tsx
@@ -537,27 +537,31 @@ const styles = StyleSheet.create({
     },
     videoModalOverlay: {
         flex: 1,
-        backgroundColor: "#000",
-        padding: 0,
+        backgroundColor: "rgba(0,0,0,0.92)",
+        justifyContent: "center",
+        alignItems: "center",
     },
     videoModalContent: {
-        flex: 1,
-        width: "100%",
+        width: SCREEN_WIDTH - 10,
         backgroundColor: "#000",
+        borderRadius: 12,
         overflow: "hidden",
         position: "relative",
     },
     videoCloseBtn: {
         position: "absolute",
-        top: 16,
-        right: 16,
-        width: 44,
-        height: 44,
-        borderRadius: 22,
+        top: 10,
+        right: 10,
+        width: 36,
+        height: 36,
+        borderRadius: 18,
         backgroundColor: "rgba(239,68,68,0.85)",
         justifyContent: "center",
         alignItems: "center",
         zIndex: 10,
     },
-    videoPlayer: { width: "100%", flex: 1 },
+    videoPlayer: {
+        width: "100%",
+        height: Math.round((SCREEN_WIDTH - 10) * 9 / 16),
+    },
 });
diff --git a/mobile/src/screens/client/ProductDetailScreen.tsx b/mobile/src/screens/client/ProductDetailScreen.tsx
index 1b086d06..05243378 100644
--- a/mobile/src/screens/client/ProductDetailScreen.tsx
+++ b/mobile/src/screens/client/ProductDetailScreen.tsx
@@ -402,13 +402,14 @@ export default function ProductDetailScreen() {
                 },
                 videoOverlay: {
                     flex: 1,
-                    backgroundColor: "#000",
-                    padding: 0,
+                    backgroundColor: "rgba(0,0,0,0.92)",
+                    justifyContent: "center",
+                    alignItems: "center",
                 },
                 videoContent: {
-                    flex: 1,
-                    width: "100%",
+                    width: SCREEN_WIDTH - 10,
                     backgroundColor: "#000",
+                    borderRadius: 12,
                     overflow: "hidden",
                 },
                 videoTopBar: {
@@ -439,7 +440,10 @@ export default function ProductDetailScreen() {
                     justifyContent: "center",
                     alignItems: "center",
                 },
-                videoPlayer: { width: "100%", flex: 1 },
+                videoPlayer: {
+                    width: "100%",
+                    height: Math.round((SCREEN_WIDTH - 10) * 9 / 16),
+                },
             }),
         [colors, isDark, catColor],
     );
@@ -489,7 +493,7 @@ export default function ProductDetailScreen() {
                         <Image
                             source={{ uri: imageUri }}
                             style={styles.image}
-                            resizeMode="contain"
+                            resizeMode="cover"
                         />
                     ) : (
                         <View