diff --git a/package-lock.json b/package-lock.json
index 1d91aa7..93a06ef 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -25028,7 +25028,7 @@
     },
     "packages/pkg.modal": {
       "name": "@xipkg/modal",
-      "version": "4.3.0",
+      "version": "4.3.1",
       "license": "MIT",
       "dependencies": {
         "@radix-ui/react-dialog": "1.1.6",
diff --git a/packages/pkg.modal/components/ModalOverlay.tsx b/packages/pkg.modal/components/ModalOverlay.tsx
index 09ec313..d9abb4d 100644
--- a/packages/pkg.modal/components/ModalOverlay.tsx
+++ b/packages/pkg.modal/components/ModalOverlay.tsx
@@ -1,10 +1,10 @@
-import React from 'react';
+import { DialogOverlay } from '@radix-ui/react-dialog';
 import { cn } from '@xipkg/utils';
 import { cva, type VariantProps } from 'class-variance-authority';
-import { DialogOverlay } from '@radix-ui/react-dialog';
+import React from 'react';
 
 export const modalOverlayVariants = cva(
-  'border-gray-5 flex flex-col space-y-2 border-b p-6 text-left bg-gray-0',
+  'border-gray-5 flex flex-col space-y-2 border-b p-6 max-sm:p-4 text-left bg-gray-0',
   {
     variants: {
       overlayVariant: {
@@ -20,8 +20,7 @@ export const modalOverlayVariants = cva(
 );
 
 export interface ModalHeaderProps
-  extends React.ComponentProps<typeof DialogOverlay>,
-    VariantProps<typeof modalOverlayVariants> {}
+  extends React.ComponentProps<typeof DialogOverlay>, VariantProps<typeof modalOverlayVariants> {}
 
 export const ModalOverlay = ({ overlayVariant, className, ...props }: ModalHeaderProps) => (
   <DialogOverlay className={cn(modalOverlayVariants(), className)} {...props} />
diff --git a/packages/pkg.modal/package.json b/packages/pkg.modal/package.json
index ffaf028..519ba4f 100644
--- a/packages/pkg.modal/package.json
+++ b/packages/pkg.modal/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@xipkg/modal",
-  "version": "4.3.0",
+  "version": "4.3.1",
   "main": "./dist/index.mjs",
   "module": "./dist/index.mjs",
   "types": "./dist/index.d.mts",