fix: improve Android tablet keyboard-safe layout

Use dynamic viewport sizing and keyboard-aware spacing to keep new-game inputs and navigation reachable in PWA landscape mode on Android tablets. Refs #30.

Made-with: Cursor

src/lib/features/new-game/steps/Player1Step.tsx

@@ -111,8 +111,15 @@ export const Player1Step = ({ playerNameHistory, onNext, onCancel, initialValue
               }
             }}
             autoComplete="off"
+            autoCapitalize="words"
+            spellCheck={false}
+            enterKeyHint="next"
             aria-label="Name Spieler 1"
             aria-describedby="player1-help"
+            onFocus={(e) => {
+              const target = e.currentTarget as HTMLInputElement;
+              target.scrollIntoView({ block: 'center', behavior: 'smooth' });
+            }}
             style={{ 
               fontSize: UI_CONSTANTS.INPUT_FONT_SIZE, 
               minHeight: UI_CONSTANTS.INPUT_MIN_HEIGHT, 

src/lib/features/new-game/steps/Player2Step.tsx

@@ -70,7 +70,14 @@ export const Player2Step = ({ playerNameHistory, onNext, onCancel, initialValue
               setPlayer2(target.value);
             }}
             autoComplete="off"
+            autoCapitalize="words"
+            spellCheck={false}
+            enterKeyHint="next"
             aria-label="Name Spieler 2"
+            onFocus={(e) => {
+              const target = e.currentTarget as HTMLInputElement;
+              target.scrollIntoView({ block: 'center', behavior: 'smooth' });
+            }}
             style={{ fontSize: '1.2rem', minHeight: 48, marginTop: 12, marginBottom: 12, width: '100%', paddingRight: 44 }}
             ref={inputRef}
           />

src/lib/features/new-game/steps/Player3Step.tsx

@@ -67,7 +67,14 @@ export const Player3Step = ({ playerNameHistory, onNext, onCancel, initialValue
               setPlayer3(target.value);
             }}
             autoComplete="off"
+            autoCapitalize="words"
+            spellCheck={false}
+            enterKeyHint="done"
             aria-label="Name Spieler 3"
+            onFocus={(e) => {
+              const target = e.currentTarget as HTMLInputElement;
+              target.scrollIntoView({ block: 'center', behavior: 'smooth' });
+            }}
             style={{ fontSize: '1.2rem', minHeight: 48, marginTop: 12, marginBottom: 12, width: '100%', paddingRight: 44 }}
             ref={inputRef}
           />