feat: implement one-shot modifier keys for mobile terminal

- Redesign useSpecialKeys hook with modifier state tracking
- Add one-shot activation for Ctrl and Alt keys
- Visual feedback: active modifiers shown with yellow highlight
- Fix focusInput to use term.focus() instead of hidden input
- Always refocus terminal after sending any special key
- Add requestAnimationFrame for reliable focus restoration

apps/web/src/components/special-keys-panel.tsx

@@ -39,7 +39,7 @@ export const SpecialKeysPanel: React.FC<SpecialKeysPanelProps> = ({
   onClose,
   onKeepFocus,
 }) => {
-  const { sendKey } = useSpecialKeys({ onSend });
+  const { sendKey, clearModifier } = useSpecialKeys({ onSend });
 
   if (!isOpen) return null;
 
@@ -47,14 +47,29 @@ export const SpecialKeysPanel: React.FC<SpecialKeysPanelProps> = ({
     e.preventDefault();
     sendKey(key);
     onClose();
-    onKeepFocus?.();
+    // Always refocus terminal after sending
+    requestAnimationFrame(() => {
+      onKeepFocus?.();
+    });
+  };
+
+  const handleOverlayPointerDown = (e: React.PointerEvent) => {
+    e.preventDefault();
+    clearModifier();
+    onClose();
+    requestAnimationFrame(() => {
+      onKeepFocus?.();
+    });
   };
 
   return (
-    <div className="special-keys-panel-overlay" onClick={onClose}>
+    <div
+      className="special-keys-panel-overlay"
+      onPointerDown={handleOverlayPointerDown}
+    >
       <div
         className="special-keys-panel"
-        onClick={(e) => e.stopPropagation()}
+        onPointerDown={(e) => e.stopPropagation()}
       >
         <div className="special-keys-panel-section">
           {EXPANDED_KEYS.map(({ key, label }) => (
@@ -62,7 +77,6 @@ export const SpecialKeysPanel: React.FC<SpecialKeysPanelProps> = ({
               key={key}
               className="special-key-button"
               onPointerDown={(e) => handlePointerDown(e, key)}
-              onFocus={(e) => e.target.blur()}
               type="button"
               tabIndex={-1}
             >
@@ -77,7 +91,6 @@ export const SpecialKeysPanel: React.FC<SpecialKeysPanelProps> = ({
               key={key}
               className="special-key-button"
               onPointerDown={(e) => handlePointerDown(e, key)}
-              onFocus={(e) => e.target.blur()}
               type="button"
               tabIndex={-1}
             >