diff --git a/src/components/ScreenKeyboard.tsx b/src/components/ScreenKeyboard.tsx
index 3929384..165a459 100644
--- a/src/components/ScreenKeyboard.tsx
+++ b/src/components/ScreenKeyboard.tsx
@@ -205,9 +205,9 @@ const ScreenKeyboard: React.FC<ScreenKeyboardProps> = ({ onStudentIdChange, onDr
   ];
 
   return (
-    <div className="flex flex-col items-center space-y-6">
+    <>
       {/* 学号显示区域 */}
-      <div className="bg-white/10 backdrop-blur-md rounded-2xl p-6 w-full max-w-md">
+      <div className="bg-white/10 backdrop-blur-md rounded-2xl p-6 mb-6 w-full">
         <div className="bg-black/20 rounded-xl p-4 mb-4">
           <div className="text-center">
             <div className="text-4xl font-mono text-white mb-2 leading-tight">
@@ -244,7 +244,8 @@ const ScreenKeyboard: React.FC<ScreenKeyboardProps> = ({ onStudentIdChange, onDr
           whileTap={{ scale: 0.98 }}
           onClick={handleDraw}
           disabled={studentId.length !== 12 || isDrawing || isCheckingLimit || studentDrawCount >= maxDrawTimes || isDebouncing}
-          className="w-full py-6 bg-gradient-to-r from-green-500 to-blue-600 hover:from-green-600 hover:to-blue-700 disabled:from-gray-500 disabled:to-gray-600 disabled:cursor-not-allowed text-white font-bold text-xl rounded-xl shadow-lg transition-all duration-200 flex items-center justify-center space-x-2"
+          className="py-6 bg-gradient-to-r from-green-500 to-blue-600 hover:from-green-600 hover:to-blue-700 disabled:from-gray-500 disabled:to-gray-600 disabled:cursor-not-allowed text-white font-bold text-xl rounded-xl shadow-lg transition-all duration-200 flex items-center justify-center space-x-2"
+          style={{ width: '100%' }}
         >
           <Play className="w-6 h-6" />
           <span>{isDrawing ? '抽奖中...' : 
@@ -255,9 +256,9 @@ const ScreenKeyboard: React.FC<ScreenKeyboardProps> = ({ onStudentIdChange, onDr
         </motion.button>
       </div>
       
-      {/* 屏幕键盘 - 140px*140px */}
-      <div className="bg-white/10 backdrop-blur-md rounded-2xl p-6">
-        <div className="grid grid-cols-3 gap-[10px]" style={{ width: '450px', height: '600px' }}>
+      {/* 屏幕键盘 - 调整按钮大小以适应容器 */}
+      <div className="bg-white/10 backdrop-blur-md rounded-2xl p-2 w-full h-full flex flex-col min-h-0">
+        <div className="grid grid-cols-3 gap-1 w-full h-full flex-1 min-h-0">
           {keys.flat().map((key, index) => {
             let content;
             
@@ -276,7 +277,7 @@ const ScreenKeyboard: React.FC<ScreenKeyboardProps> = ({ onStudentIdChange, onDr
               ${typeof key === 'number' ? '' : 'text-lg'}
             `;
             
-            const numberStyle = /^[0-9]$/.test(key) ? { fontSize: '112px', lineHeight: '140px' } : {};
+            const numberStyle = /^[0-9]$/.test(key) ? { fontSize: 'clamp(2rem, 6vw, 5rem)' } : {};
             
             if (key === 'clear') {
               content = <RotateCcw className="w-8 h-8" />;
@@ -291,8 +292,8 @@ const ScreenKeyboard: React.FC<ScreenKeyboardProps> = ({ onStudentIdChange, onDr
                 key={index}
                 whileHover={isDrawing || isNumberKeyDisabled ? {} : { scale: 1.05 }}
                 whileTap={isDrawing || isNumberKeyDisabled ? {} : { scale: 0.95 }}
-                className={className}
-                style={{ width: '140px', height: '140px', ...numberStyle }}
+                className={`${className} w-full h-full min-h-0`}
+                style={{ ...numberStyle }}
                 disabled={isDrawing || isNumberKeyDisabled}
                 onClick={() => {
                   if (key === 'clear') {
@@ -310,7 +311,7 @@ const ScreenKeyboard: React.FC<ScreenKeyboardProps> = ({ onStudentIdChange, onDr
           })}
         </div>
       </div>
-    </div>
+    </>
   );
 }