diff --git a/src/components/common/VerificationCodeInput.tsx b/src/components/common/VerificationCodeInput.tsx
index e183029..ddb8768 100644
--- a/src/components/common/VerificationCodeInput.tsx
+++ b/src/components/common/VerificationCodeInput.tsx
@@ -13,6 +13,7 @@ import {
   Platform,
   Text,
   ViewStyle,
+  useWindowDimensions,
 } from 'react-native';
 import { useAppColors, type AppColors } from '../../theme';
 
@@ -26,9 +27,12 @@ interface VerificationCodeInputProps {
   disabled?: boolean;
 }
 
-const CELL_WIDTH = 56;
+const DEFAULT_CELL_WIDTH = 56;
+const MIN_CELL_WIDTH = 32;
 const CELL_HEIGHT = 64;
 const CELL_MARGIN = 8;
+const CONTAINER_PADDING = 24 * 2; // matches parent scrollContent paddingHorizontal
+const EXTRA_MARGIN = 32; // additional safety margin
 
 export const VerificationCodeInput: React.FC<VerificationCodeInputProps> = ({
   value,
@@ -40,7 +44,13 @@ export const VerificationCodeInput: React.FC<VerificationCodeInputProps> = ({
   disabled = false,
 }) => {
   const colors = useAppColors();
-  const styles = createStyles(colors);
+  const { width: screenWidth } = useWindowDimensions();
+
+  const availableWidth = screenWidth - CONTAINER_PADDING - EXTRA_MARGIN;
+  const maxCellWidth = Math.floor(availableWidth / length) - CELL_MARGIN;
+  const cellWidth = Math.max(MIN_CELL_WIDTH, Math.min(DEFAULT_CELL_WIDTH, maxCellWidth));
+
+  const styles = createStyles(colors, cellWidth);
 
   // 为每个数字创建一个 ref
   const inputRefs = useRef<(TextInput | null)[]>(Array(length).fill(null));
@@ -200,7 +210,7 @@ export const VerificationCodeInput: React.FC<VerificationCodeInputProps> = ({
   );
 };
 
-function createStyles(colors: AppColors) {
+function createStyles(colors: AppColors, cellWidth: number) {
   return StyleSheet.create({
     container: {
       alignItems: 'center',
@@ -212,7 +222,7 @@ function createStyles(colors: AppColors) {
       alignItems: 'center',
     },
     cell: {
-      width: CELL_WIDTH,
+      width: cellWidth,
       height: CELL_HEIGHT,
       borderRadius: 12,
       borderWidth: 1.5,
@@ -238,7 +248,7 @@ function createStyles(colors: AppColors) {
       width: '100%',
       height: '100%',
       textAlign: 'center',
-      fontSize: 28,
+      fontSize: cellWidth >= 48 ? 28 : cellWidth >= 40 ? 24 : 20,
       fontWeight: '600',
       color: colors.text.primary,
       padding: 0,