diff --git a/package.json b/package.json
index af03aed94..585a36d60 100644
--- a/package.json
+++ b/package.json
@@ -190,7 +190,14 @@
             "vscode-brightscript-language": [
                 {
                     "id": "devicesView",
-                    "name": "Devices"
+                    "name": "Devices",
+                    "icon": "./images/icons/set-top-box-light.svg"
+                },
+                {
+                    "id": "remoteControlPanel",
+                    "name": "Remote Control",
+                    "type": "webview",
+                    "icon": "$(game)"
                 }
             ],
             "debug": [
@@ -435,6 +442,11 @@
                     "when": "view == sceneGraphInspectorView",
                     "group": "navigation@1"
                 },
+                {
+                    "command": "extension.brightscript.openRemoteControlPanelInPanel",
+                    "when": "view == remoteControlPanel",
+                    "group": "navigation@1"
+                },
                 {
                     "command": "extension.brightscript.disconnectFromDevice",
                     "when": "view == sceneGraphInspectorView && brightscript.isOnDeviceComponentAvailable",
@@ -3608,6 +3620,12 @@
                 "category": "BrightScript",
                 "icon": "$(link-external)"
             },
+            {
+                "command": "extension.brightscript.openRemoteControlPanelInPanel",
+                "title": "Open Remote Control Panel In New Window",
+                "category": "BrightScript",
+                "icon": "$(link-external)"
+            },
             {
                 "command": "extension.brightscript.clearNpmPackageCache",
                 "title": "Clear the extension's local node_modules cache",
@@ -3624,228 +3642,228 @@
             {
                 "command": "extension.brightscript.pressBackButton",
                 "key": "Escape",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.pressBackButton",
                 "key": "Delete",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.doNothing",
                 "key": "Ctrl+Delete",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.doNothing",
                 "key": "Alt+Delete",
                 "mac": "Option+Delete",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.doNothing",
                 "key": "Win+Delete",
                 "mac": "Cmd+Delete",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.pressHomeButton",
                 "key": "Home",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.pressHomeButton",
                 "key": "Shift+Escape",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.pressHomeButton",
                 "key": "Ctrl+Escape",
                 "mac": "Cmd+Escape",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.pressInstantReplayButton",
                 "key": "Backspace",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.pressBackspaceButton",
                 "key": "Ctrl+Backspace",
                 "mac": "Cmd+Backspace",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.doNothing",
                 "key": "Alt+Backspace",
                 "mac": "Option+Backspace",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.doNothing",
                 "key": "Win+Backspace",
                 "mac": "Ctrl+Backspace",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.pressUpButton",
                 "key": "Up",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.doNothing",
                 "key": "Ctrl+Up",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.doNothing",
                 "key": "Alt+Up",
                 "mac": "Option+Up",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.doNothing",
                 "key": "Win+Up",
                 "mac": "Cmd+Up",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.pressDownButton",
                 "key": "Down",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.doNothing",
                 "key": "Ctrl+Down",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.doNothing",
                 "key": "Alt+Down",
                 "mac": "Option+Down",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.doNothing",
                 "key": "Win+Down",
                 "mac": "Cmd+Down",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.pressRightButton",
                 "key": "Right",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.pressLeftButton",
                 "key": "Left",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.pressSelectButton",
                 "key": "Enter",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.pressPlayButton",
                 "key": "Ctrl+Enter",
                 "mac": "Cmd+Enter",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.pressPlayButton",
                 "key": "End",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.doNothing",
                 "key": "Alt+Enter",
                 "mac": "Option+Enter",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.doNothing",
                 "key": "Win+Enter",
                 "mac": "Ctrl+Enter",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.pressPlayButton",
                 "key": "MediaPlayPause",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.pressRevButton",
                 "key": "Ctrl+Left",
                 "mac": "Cmd+Left",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.doNothing",
                 "key": "Alt+Left",
                 "mac": "Option+Left",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.doNothing",
                 "key": "Win+Left",
                 "mac": "Ctrl+Left",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.pressRevButton",
                 "key": "PageUp",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.pressRevButton",
                 "key": "MediaTrackPrevious",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.pressFwdButton",
                 "key": "Ctrl+Right",
                 "mac": "Cmd+Right",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.doNothing",
                 "key": "Alt+Right",
                 "mac": "Option+Right",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.doNothing",
                 "key": "Win+Right",
                 "mac": "Ctrl+Right",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.pressFwdButton",
                 "key": "PageDown",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.pressFwdButton",
                 "key": "MediaTrackNext",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.pressStarButton",
                 "key": "Ctrl+8",
                 "mac": "Cmd+8",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.pressStarButton",
                 "key": "Ctrl+Shift+8",
                 "mac": "Cmd+Shift+8",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.pressStarButton",
                 "key": "Insert",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.toggleRemoteControlMode",
@@ -3855,583 +3873,583 @@
             {
                 "command": "extension.brightscript.pressVolumeMute",
                 "key": "AudioVolumeMute",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+SPACE",
                 "key": "Space",
                 "args": " ",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+TAB",
                 "key": "Tab",
                 "args": "\t",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+!",
                 "key": "Shift+1",
                 "args": "!",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+@",
                 "key": "Shift+2",
                 "args": "@",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+#",
                 "key": "Shift+3",
                 "args": "#",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+$",
                 "key": "Shift+4",
                 "args": "$",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+%",
                 "key": "Shift+5",
                 "args": "%",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+^",
                 "key": "Shift+6",
                 "args": "^",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+&",
                 "key": "Shift+7",
                 "args": "&",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+*",
                 "key": "Shift+8",
                 "args": "*",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+(",
                 "key": "Shift+9",
                 "args": "(",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+)",
                 "key": "Shift+0",
                 "args": ")",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+'",
                 "key": "'",
                 "args": "'",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+\"",
                 "key": "Shift+'",
                 "args": "\"",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii++",
                 "key": "Shift+=",
                 "args": "+",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+,",
                 "key": ",",
                 "args": ",",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+-",
                 "key": "-",
                 "args": "-",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+.",
                 "key": ".",
                 "args": ".",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+/",
                 "key": "/",
                 "args": "/",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+0",
                 "key": "0",
                 "args": "0",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+1",
                 "key": "1",
                 "args": "1",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+2",
                 "key": "2",
                 "args": "2",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+3",
                 "key": "3",
                 "args": "3",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+4",
                 "key": "4",
                 "args": "4",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+5",
                 "key": "5",
                 "args": "5",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+6",
                 "key": "6",
                 "args": "6",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+7",
                 "key": "7",
                 "args": "7",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+8",
                 "key": "8",
                 "args": "8",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+9",
                 "key": "9",
                 "args": "9",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+:",
                 "key": "Shift+;",
                 "args": ":",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+;",
                 "key": ";",
                 "args": ";",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+<",
                 "key": "Shift+,",
                 "args": "<",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+=",
                 "key": "=",
                 "args": "=",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+>",
                 "key": "Shift+.",
                 "args": ">",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+?",
                 "key": "Shift+/",
                 "args": "?",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+A",
                 "key": "Shift+a",
                 "args": "A",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+B",
                 "key": "Shift+b",
                 "args": "B",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+C",
                 "key": "Shift+c",
                 "args": "C",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+D",
                 "key": "Shift+d",
                 "args": "D",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+E",
                 "key": "Shift+e",
                 "args": "E",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+F",
                 "key": "Shift+f",
                 "args": "F",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+G",
                 "key": "Shift+g",
                 "args": "G",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+H",
                 "key": "Shift+h",
                 "args": "H",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+I",
                 "key": "Shift+i",
                 "args": "I",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+J",
                 "key": "Shift+j",
                 "args": "J",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+K",
                 "key": "Shift+k",
                 "args": "K",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+L",
                 "key": "Shift+l",
                 "args": "L",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+M",
                 "key": "Shift+m",
                 "args": "M",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+N",
                 "key": "Shift+n",
                 "args": "N",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+O",
                 "key": "Shift+o",
                 "args": "O",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+P",
                 "key": "Shift+p",
                 "args": "P",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+Q",
                 "key": "Shift+q",
                 "args": "Q",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+R",
                 "key": "Shift+r",
                 "args": "R",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+S",
                 "key": "Shift+s",
                 "args": "S",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+T",
                 "key": "Shift+t",
                 "args": "T",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+U",
                 "key": "Shift+u",
                 "args": "U",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+V",
                 "key": "Shift+v",
                 "args": "V",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+W",
                 "key": "Shift+w",
                 "args": "W",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+X",
                 "key": "Shift+x",
                 "args": "X",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+Y",
                 "key": "Shift+y",
                 "args": "Y",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+Z",
                 "key": "Shift+z",
                 "args": "Z",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+[",
                 "key": "[",
                 "args": "[",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+\\",
                 "key": "\\",
                 "args": "\\",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+]",
                 "key": "]",
                 "args": "]",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+_",
                 "key": "Shift+-",
                 "args": "_",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+`",
                 "key": "`",
                 "args": "`",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+a",
                 "key": "a",
                 "args": "a",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+b",
                 "key": "b",
                 "args": "b",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+c",
                 "key": "c",
                 "args": "c",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+d",
                 "key": "d",
                 "args": "d",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+e",
                 "key": "e",
                 "args": "e",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+f",
                 "key": "f",
                 "args": "f",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+g",
                 "key": "g",
                 "args": "g",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+h",
                 "key": "h",
                 "args": "h",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+i",
                 "key": "i",
                 "args": "i",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+j",
                 "key": "j",
                 "args": "j",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+k",
                 "key": "k",
                 "args": "k",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+l",
                 "key": "l",
                 "args": "l",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+m",
                 "key": "m",
                 "args": "m",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+n",
                 "key": "n",
                 "args": "n",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+o",
                 "key": "o",
                 "args": "o",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+p",
                 "key": "p",
                 "args": "p",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+q",
                 "key": "q",
                 "args": "q",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+r",
                 "key": "r",
                 "args": "r",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+s",
                 "key": "s",
                 "args": "s",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+t",
                 "key": "t",
                 "args": "t",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+u",
                 "key": "u",
                 "args": "u",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+v",
                 "key": "v",
                 "args": "v",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+w",
                 "key": "w",
                 "args": "w",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+x",
                 "key": "x",
                 "args": "x",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+y",
                 "key": "y",
                 "args": "y",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+z",
                 "key": "z",
                 "args": "z",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+{",
                 "key": "Shift+[",
                 "args": "{",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+|",
                 "key": "Shift+\\",
                 "args": "|",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+}",
                 "key": "Shift+]",
                 "args": "}",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.sendAscii+~",
                 "key": "Shift+`",
                 "args": "~",
-                "when": "!searchInputBoxFocus && !findInputFocussed && !inCommandsPicker && !inQuickOpen && brightscript.isRemoteControlMode"
+                "when": "brightscript.isRemoteControlMode && (focusedView == remoteControlPanel || activeWebviewPanelId == 'remoteControlPanel')"
             },
             {
                 "command": "extension.brightscript.markLogOutput",
diff --git a/src/BrightScriptCommands.ts b/src/BrightScriptCommands.ts
index 46411d7d1..c848dffe1 100644
--- a/src/BrightScriptCommands.ts
+++ b/src/BrightScriptCommands.ts
@@ -17,6 +17,7 @@ import type { UserInputManager } from './managers/UserInputManager';
 import { clearNpmPackageCacheCommand } from './commands/ClearNpmPackageCacheCommand';
 import type { LocalPackageManager } from './managers/LocalPackageManager';
 import { profilingCommands } from './commands/ProfilingCommands';
+import type { WebviewViewProviderManager } from './managers/WebviewViewProviderManager';
 
 export class BrightScriptCommands {
 
@@ -36,6 +37,20 @@ export class BrightScriptCommands {
     public password: string;
     public workspacePath: string;
     private keypressNotifiers = [] as ((key: string, literalCharacter: boolean) => void)[];
+    private webviewViewProviderManager: WebviewViewProviderManager;
+
+    /**
+     * Set the WebviewViewProviderManager reference (called after construction)
+     */
+    public setWebviewViewProviderManager(manager: WebviewViewProviderManager) {
+        this.webviewViewProviderManager = manager;
+        this.remoteControlManager.setModeChangedCallback((isEnabled) => {
+            manager.onRemoteControlModeChanged(isEnabled);
+        });
+        this.registerKeypressNotifier((key, literalCharacter) => {
+            manager.onRemoteCommandSent(key, literalCharacter);
+        });
+    }
 
     public registerCommands() {
 
@@ -434,6 +449,7 @@ export class BrightScriptCommands {
                 throw new Error('Tried to set active device but failed.');
             } else {
                 await this.context.workspaceState.update('remoteHost', ip);
+                this.webviewViewProviderManager?.onRemoteHostChanged();
                 await vscode.window.showInformationMessage(`BrightScript Language extension active device set to: ${ip}`);
             }
         });
@@ -525,6 +541,7 @@ export class BrightScriptCommands {
 
         this.registerCommand('clearActiveDevice', async () => {
             await this.context.workspaceState.update('remoteHost', '');
+            this.webviewViewProviderManager?.onRemoteHostChanged();
             await vscode.window.showInformationMessage('BrightScript Language extension active device cleared');
         });
 
@@ -701,6 +718,7 @@ export class BrightScriptCommands {
             throw new Error('Can\'t send command: host is required.');
         } else {
             await this.context.workspaceState.update('remoteHost', this.host);
+            this.webviewViewProviderManager?.onRemoteHostChanged();
         }
         if (this.host) {
             //try resolving the hostname. (sometimes it fails for no reason, so just ignore the crash if it does)
diff --git a/src/commands/VscodeCommand.ts b/src/commands/VscodeCommand.ts
index 3c36c694f..117b3d411 100644
--- a/src/commands/VscodeCommand.ts
+++ b/src/commands/VscodeCommand.ts
@@ -22,5 +22,6 @@ export enum VscodeCommand {
     rokuFileSystemViewRefresh = 'extension.brightscript.rokuFileSystemView.refresh',
     disconnectFromDevice = 'extension.brightscript.disconnectFromDevice',
     openSceneGraphInspectorInPanel = 'extension.brightscript.openSceneGraphInspectorInPanel',
+    openRemoteControlPanelInPanel = 'extension.brightscript.openRemoteControlPanelInPanel',
     clearNpmPackageCache = 'extension.brightscript.clearNpmPackageCache'
 }
diff --git a/src/extension.ts b/src/extension.ts
index e953ae69b..2ada659ae 100644
--- a/src/extension.ts
+++ b/src/extension.ts
@@ -94,6 +94,7 @@ export class Extension {
         this.rtaManager = new RtaManager(context);
         this.webviewViewProviderManager = new WebviewViewProviderManager(context, this.rtaManager, this.brightScriptCommands);
         this.rtaManager.setWebviewViewProviderManager(this.webviewViewProviderManager);
+        this.brightScriptCommands.setWebviewViewProviderManager(this.webviewViewProviderManager);
 
         PerfettoEditorProvider.register(context);
 
diff --git a/src/managers/RemoteControlManager.ts b/src/managers/RemoteControlManager.ts
index a0c7dd595..5b85b639b 100644
--- a/src/managers/RemoteControlManager.ts
+++ b/src/managers/RemoteControlManager.ts
@@ -22,7 +22,12 @@ export class RemoteControlManager {
         this.isFlasherAllowedByUser = util.getConfiguration('brightscript')?.get('remoteControlMode.enableActiveAnimation') ?? true;
     }
 
-    private isEnabled = false;
+    public isEnabled = false;
+    private onModeChangedCallback?: (isEnabled: boolean) => void;
+
+    public setModeChangedCallback(callback: (isEnabled: boolean) => void) {
+        this.onModeChangedCallback = callback;
+    }
 
     private isFlasherAllowedByUser: boolean;
 
@@ -96,9 +101,11 @@ export class RemoteControlManager {
         this.isEnabled = isEnabled;
         if (this.isEnabled) {
             this.enableFlasher();
+            await vscode.commands.executeCommand(VscodeCommand.openRemoteControlPanelInPanel);
         } else {
             this.disableFlasher?.();
         }
+        this.onModeChangedCallback?.(isEnabled);
     }
 
     private disableFlasher: () => void;
diff --git a/src/managers/WebviewViewProviderManager.ts b/src/managers/WebviewViewProviderManager.ts
index b0ef97cb5..641d8530a 100644
--- a/src/managers/WebviewViewProviderManager.ts
+++ b/src/managers/WebviewViewProviderManager.ts
@@ -11,6 +11,7 @@ import { RokuRegistryViewProvider } from '../viewProviders/RokuRegistryViewProvi
 import { SceneGraphInspectorViewProvider } from '../viewProviders/SceneGraphInspectorViewProvider';
 import { RokuAutomationViewViewProvider } from '../viewProviders/RokuAutomationViewViewProvider';
 import { RokuReplViewProvider } from '../viewProviders/RokuReplViewProvider';
+import { RemoteControlPanelProvider } from '../viewProviders/RemoteControlPanelProvider';
 
 export class WebviewViewProviderManager {
     constructor(
@@ -55,6 +56,9 @@ export class WebviewViewProviderManager {
     }, {
         constructor: RokuReplViewProvider,
         provider: undefined as RokuReplViewProvider
+    }, {
+        constructor: RemoteControlPanelProvider,
+        provider: undefined as RemoteControlPanelProvider
     }];
 
     public getWebviewViewProviders() {
@@ -100,4 +104,38 @@ export class WebviewViewProviderManager {
             }
         }
     }
+
+    /**
+     * Notify the Remote Control Panel that the remoteHost has changed
+     */
+    public onRemoteHostChanged() {
+        const remoteControlPanel = this.webviewViews.find(
+            view => view.provider instanceof RemoteControlPanelProvider
+        )?.provider as RemoteControlPanelProvider;
+
+        if (remoteControlPanel) {
+            remoteControlPanel.updateRemoteHost();
+        }
+    }
+
+    public onRemoteCommandSent(key: string, literalCharacter: boolean) {
+        const remoteControlPanel = this.webviewViews.find(
+            view => view.provider instanceof RemoteControlPanelProvider
+        )?.provider as RemoteControlPanelProvider;
+
+        remoteControlPanel?.notifyRemoteCommandSent(key, literalCharacter);
+    }
+
+    public onRemoteControlModeChanged(isEnabled: boolean) {
+        const remoteControlPanel = this.webviewViews.find(
+            view => view.provider instanceof RemoteControlPanelProvider
+        )?.provider as RemoteControlPanelProvider;
+
+        if (remoteControlPanel) {
+            remoteControlPanel.notifyRemoteControlModeChanged(isEnabled);
+            if (!isEnabled) {
+                remoteControlPanel.closePanel();
+            }
+        }
+    }
 }
diff --git a/src/viewProviders/BaseWebviewViewProvider.ts b/src/viewProviders/BaseWebviewViewProvider.ts
index 024e2dac2..a00f3a69c 100644
--- a/src/viewProviders/BaseWebviewViewProvider.ts
+++ b/src/viewProviders/BaseWebviewViewProvider.ts
@@ -114,7 +114,7 @@ export abstract class BaseWebviewViewProvider implements vscode.WebviewViewProvi
         this.messageCommandCallbacks[command] = callback;
     }
 
-    private setupViewMessageObserver(webview: vscode.Webview) {
+    protected setupViewMessageObserver(webview: vscode.Webview) {
         webview.onDidReceiveMessage(async (message) => {
             try {
                 const command = message.command;
@@ -217,7 +217,8 @@ export abstract class BaseWebviewViewProvider implements vscode.WebviewViewProvi
     * Get a webview-supported URI for the given path
     */
     private asWebviewUri(...parts: string[]) {
-        return this.view?.webview?.asWebviewUri?.(
+        const webview = this.view?.webview ?? this.panel?.webview;
+        return webview?.asWebviewUri?.(
             vscode.Uri.file(
                 path.join(...parts)
             )
diff --git a/src/viewProviders/RemoteControlPanelProvider.ts b/src/viewProviders/RemoteControlPanelProvider.ts
new file mode 100644
index 000000000..288b57ba1
--- /dev/null
+++ b/src/viewProviders/RemoteControlPanelProvider.ts
@@ -0,0 +1,318 @@
+import * as vscode from 'vscode';
+import * as path from 'path';
+import * as fsExtra from 'fs-extra';
+import { BaseWebviewViewProvider } from './BaseWebviewViewProvider';
+import { ViewProviderId } from './ViewProviderId';
+import { ViewProviderCommand } from './ViewProviderCommand';
+import { ViewProviderEvent } from './ViewProviderEvent';
+import { VscodeCommand } from '../commands/VscodeCommand';
+import { vscodeContextManager } from '../managers/VscodeContextManager';
+
+/**
+ * Provides a webview panel for virtual remote control with visual feedback
+ */
+export class RemoteControlPanelProvider extends BaseWebviewViewProvider {
+    public readonly id = ViewProviderId.remoteControlPanel;
+
+    // Maps button names (as used in the webview) to their VS Code command IDs
+    private static readonly buttonCommandMap: Record<string, string> = {
+        'Power': 'extension.brightscript.pressPowerButton',
+        'Back': 'extension.brightscript.pressBackButton',
+        'Home': 'extension.brightscript.pressHomeButton',
+        'Up': 'extension.brightscript.pressUpButton',
+        'Down': 'extension.brightscript.pressDownButton',
+        'Left': 'extension.brightscript.pressLeftButton',
+        'Right': 'extension.brightscript.pressRightButton',
+        'Select': 'extension.brightscript.pressSelectButton',
+        'InstantReplay': 'extension.brightscript.pressInstantReplayButton',
+        'Info': 'extension.brightscript.pressStarButton',
+        'Rev': 'extension.brightscript.pressRevButton',
+        'Play': 'extension.brightscript.pressPlayButton',
+        'Fwd': 'extension.brightscript.pressFwdButton',
+        'Blue': 'extension.brightscript.pressBlue',
+        'Green': 'extension.brightscript.pressGreen',
+        'Red': 'extension.brightscript.pressRed',
+        'Yellow': 'extension.brightscript.pressYellow',
+        'Exit': 'extension.brightscript.pressExit',
+        'VolumeUp': 'extension.brightscript.pressVolumeUp',
+        'VolumeDown': 'extension.brightscript.pressVolumeDown',
+        'VolumeMute': 'extension.brightscript.pressVolumeMute'
+    };
+
+    constructor(context: vscode.ExtensionContext, dependencies) {
+        super(context, dependencies);
+
+        console.log('RemoteControlPanelProvider constructor');
+        this.setupKeybindingsWatcher();
+
+        this.registerCommand(VscodeCommand.openRemoteControlPanelInPanel, async () => {
+            await this.createOrRevealWebviewPanel();
+        });
+
+        // Restore the panel when VS Code reopens a window that had it open
+        context.subscriptions.push(
+            vscode.window.registerWebviewPanelSerializer(this.id, {
+                deserializeWebviewPanel: async (webviewPanel: vscode.WebviewPanel) => {
+                    this.panel = webviewPanel;
+                    webviewPanel.onDidDispose(() => {
+                        this.panel = undefined;
+                    });
+                    this.setupViewMessageObserver(webviewPanel.webview);
+                    webviewPanel.webview.html = await this.getHtmlForWebview();
+                }
+            })
+        );
+
+        // Handle remote command requests from the webview
+        this.addMessageCommandCallback(ViewProviderCommand.sendRemoteCommand, async (message) => {
+            const button = message.context.button;
+            console.log('RemoteControlPanelProvider received sendRemoteCommand:', button);
+
+            // Map button names to the corresponding press command
+            const commandMap = {
+                'Power': 'pressPowerButton',
+                'Back': 'pressBackButton',
+                'Home': 'pressHomeButton',
+                'Up': 'pressUpButton',
+                'Down': 'pressDownButton',
+                'Left': 'pressLeftButton',
+                'Right': 'pressRightButton',
+                'Select': 'pressSelectButton',
+                'InstantReplay': 'pressInstantReplayButton',
+                'Search': 'pressSearchButton',
+                'Info': 'pressInfoButton',
+                'Rev': 'pressRevButton',
+                'Play': 'pressPlayButton',
+                'Fwd': 'pressFwdButton',
+                'Blue': 'pressBlueButton',
+                'Green': 'pressGreenButton',
+                'Red': 'pressRedButton',
+                'Yellow': 'pressYellowButton',
+                'Exit': 'pressExitButton',
+                'Guide': 'pressGuideButton',
+                'VolumeUp': 'pressVolumeUpButton',
+                'VolumeDown': 'pressVolumeDownButton',
+                'VolumeMute': 'pressVolumeMuteButton'
+            };
+
+            const commandName = commandMap[button];
+            if (commandName) {
+                try {
+                    await vscode.commands.executeCommand(`extension.brightscript.${commandName}`);
+                    this.postOrQueueMessage(this.createResponseMessage(message));
+                } catch (error) {
+                    this.postOrQueueMessage(this.createResponseMessage(message, undefined, error.message));
+                }
+            } else {
+                this.postOrQueueMessage(this.createResponseMessage(message, undefined, `Unknown button: ${button}`));
+            }
+            return true;
+        });
+
+        // Handle text input requests from the webview
+        this.addMessageCommandCallback(ViewProviderCommand.sendRemoteText, async (message) => {
+            const text = message.context.text;
+            try {
+                await vscode.commands.executeCommand('extension.brightscript.sendRemoteText', text);
+                this.postOrQueueMessage(this.createResponseMessage(message));
+            } catch (error) {
+                this.postOrQueueMessage(this.createResponseMessage(message, undefined, error.message));
+            }
+            return true;
+        });
+    }
+
+    public onViewReady() {
+        // Send initial device connection status when view is ready
+        console.log('RemoteControlPanelProvider.onViewReady()');
+        this.updateDeviceStatus();
+        this.notifyRemoteControlModeChanged(vscodeContextManager.get<boolean>('brightscript.isRemoteControlMode', false));
+        this.sendKeybindings();
+    }
+
+    private setupKeybindingsWatcher() {
+        // Watch the user's keybindings.json for real-time updates
+        const userKeybindingsPath = this.getUserKeybindingsPath();
+        const watcher = vscode.workspace.createFileSystemWatcher(
+            new vscode.RelativePattern(vscode.Uri.file(path.dirname(userKeybindingsPath)), 'keybindings.json')
+        );
+        const onChanged = () => this.sendKeybindings();
+        watcher.onDidChange(onChanged);
+        watcher.onDidCreate(onChanged);
+        watcher.onDidDelete(onChanged);
+        this.extensionContext.subscriptions.push(watcher);
+    }
+
+    private getUserKeybindingsPath(): string {
+        // globalStorageUri is <user-data>/User/globalStorage/<ext-id>
+        // keybindings.json lives at <user-data>/User/keybindings.json
+        return path.resolve(this.extensionContext.globalStorageUri.fsPath, '..', '..', 'keybindings.json');
+    }
+
+    private loadKeybindings(): Record<string, string[]> {
+        const isMac = process.platform === 'darwin';
+        const isLinux = process.platform === 'linux';
+
+        // Read default keybindings from this extension's package.json
+        const pkgJson = fsExtra.readJsonSync(path.join(this.extensionContext.extensionPath, 'package.json'));
+        const defaultBindings: { command: string; key?: string; mac?: string; linux?: string; win?: string }[] =
+            pkgJson.contributes?.keybindings ?? [];
+
+        // Build command → keys[] map, applying platform-specific overrides
+        const commandKeys: Record<string, string[]> = {};
+        for (const binding of defaultBindings) {
+            let key = binding.key;
+            if (isMac && binding.mac) {
+                key = binding.mac;
+            } else if (isLinux && binding.linux) {
+                key = binding.linux;
+            }
+            if (!key) {
+                continue;
+            }
+            if (!commandKeys[binding.command]) {
+                commandKeys[binding.command] = [];
+            }
+            commandKeys[binding.command].push(key);
+        }
+
+        // Overlay with user keybinding customizations
+        try {
+            const userKeybindingsPath = this.getUserKeybindingsPath();
+            if (fsExtra.existsSync(userKeybindingsPath)) {
+                const content = fsExtra.readFileSync(userKeybindingsPath, 'utf8');
+                // Strip JSONC comments before parsing
+                const stripped = content
+                    .replace(/\/\/[^\n]*/g, '')
+                    .replace(/\/\*[\s\S]*?\*\//g, '');
+                const userBindings: { command: string; key: string }[] = JSON.parse(stripped);
+                for (const binding of userBindings) {
+                    const isRemoval = binding.command.startsWith('-');
+                    const commandId = isRemoval ? binding.command.slice(1) : binding.command;
+                    if (isRemoval) {
+                        if (commandKeys[commandId]) {
+                            commandKeys[commandId] = commandKeys[commandId].filter(
+                                k => k.toLowerCase() !== binding.key.toLowerCase()
+                            );
+                        }
+                    } else {
+                        if (!commandKeys[commandId]) {
+                            commandKeys[commandId] = [];
+                        }
+                        if (!commandKeys[commandId].includes(binding.key)) {
+                            commandKeys[commandId].push(binding.key);
+                        }
+                    }
+                }
+            }
+        } catch {
+            // Silently fall back to defaults if user keybindings can't be read/parsed
+        }
+
+        // Build button name → keys[] map
+        const result: Record<string, string[]> = {};
+        for (const [button, commandId] of Object.entries(RemoteControlPanelProvider.buttonCommandMap)) {
+            result[button] = commandKeys[commandId] ?? [];
+        }
+        return result;
+    }
+
+    private sendKeybindings() {
+        let keybindings: Record<string, string[]> = {};
+        try {
+            keybindings = this.loadKeybindings();
+        } catch (e) {
+            console.error('RemoteControlPanelProvider: failed to load keybindings:', e);
+        }
+        this.postOrQueueMessage(this.createEventMessage(ViewProviderEvent.onKeybindingsUpdated, { keybindings: keybindings }));
+    }
+
+    public notifyRemoteControlModeChanged(isEnabled: boolean) {
+        this.postOrQueueMessage(this.createEventMessage(ViewProviderEvent.onRemoteControlModeChanged, { isEnabled: isEnabled }));
+    }
+
+    public notifyRemoteCommandSent(key: string, literalCharacter: boolean) {
+        this.postOrQueueMessage(this.createEventMessage(ViewProviderEvent.onRemoteCommandSent, { key: key, literalCharacter: literalCharacter }));
+    }
+
+    public closePanel() {
+        this.panel?.dispose();
+    }
+
+    private updateDeviceStatus() {
+        // Check if there's a remoteHost set in workspace state
+        const remoteHost = this.extensionContext.workspaceState.get<string>('remoteHost');
+        console.log('RemoteControlPanelProvider.updateDeviceStatus(), remoteHost:', remoteHost);
+
+        const message = this.createEventMessage(ViewProviderEvent.onDeviceConnectionChanged, {
+            connected: !!remoteHost,
+            deviceName: remoteHost || ''
+        });
+        console.log('RemoteControlPanelProvider sending event:', message);
+        this.postOrQueueMessage(message);
+    }
+
+    /**
+     * Public method to update device status when remoteHost changes
+     * Can be called from BrightScriptCommands when setActiveDevice is called
+     */
+    public updateRemoteHost() {
+        this.updateDeviceStatus();
+    }
+
+    public onDidStartDebugSession(e: vscode.DebugSession) {
+        // When a debug session starts, also update based on workspace state
+        // as the remoteHost might have been set
+        this.updateDeviceStatus();
+    }
+
+    public onDidTerminateDebugSession(e: vscode.DebugSession) {
+        // When debug session ends, check if remoteHost is still set
+        // (it might still be set from previous sessions)
+        this.updateDeviceStatus();
+    }
+
+    /**
+     * Override to open the panel to the side instead of in the active column
+     */
+    protected async createOrRevealWebviewPanel() {
+        // See if we need to make the panel or not
+        let createPanel = false;
+        if (!this.panel) {
+            createPanel = true;
+        } else {
+            try {
+                this.panel.reveal();
+            } catch (e) {
+                createPanel = true;
+            }
+        }
+
+        if (createPanel) {
+            this.panel = vscode.window.createWebviewPanel(
+                this.id,
+                'Remote Control Panel',
+                vscode.ViewColumn.Beside, // Open to the side instead of active column
+                {
+                    // Enable javascript in the webview
+                    enableScripts: true,
+                    // Keep the webview alive when hidden so postMessage still delivers
+                    // (e.g. keyboard shortcut feedback when the panel isn't the active tab)
+                    retainContextWhenHidden: true,
+                    localResourceRoots: [
+                        vscode.Uri.file(this.webviewBasePath)
+                    ]
+                }
+            );
+
+            this.panel.onDidDispose(() => {
+                this.panel = undefined;
+            });
+
+            this.setupViewMessageObserver(this.panel.webview);
+
+            const html = await this.getHtmlForWebview();
+            this.panel.webview.html = html;
+        }
+    }
+}
diff --git a/src/viewProviders/ViewProviderCommand.ts b/src/viewProviders/ViewProviderCommand.ts
index a8e9aacfa..98540679f 100644
--- a/src/viewProviders/ViewProviderCommand.ts
+++ b/src/viewProviders/ViewProviderCommand.ts
@@ -11,6 +11,8 @@ export enum ViewProviderCommand {
     runRokuAutomationConfig = 'runRokuAutomationConfig',
     sendMessageToWebviews = 'sendMessageToWebviews',
     sendReplRequest = 'sendReplRequest',
+    sendRemoteCommand = 'sendRemoteCommand',
+    sendRemoteText = 'sendRemoteText',
     setManualIpAddress = 'setManualIpAddress',
     setVscodeContext = 'setVscodeContext',
     stopRokuAutomationConfig = 'stopRokuAutomationConfig',
diff --git a/src/viewProviders/ViewProviderEvent.ts b/src/viewProviders/ViewProviderEvent.ts
index 806c9bc9f..621172674 100644
--- a/src/viewProviders/ViewProviderEvent.ts
+++ b/src/viewProviders/ViewProviderEvent.ts
@@ -1,4 +1,5 @@
 export enum ViewProviderEvent {
+    onDeviceConnectionChanged = 'onDeviceConnectionChanged',
     onNodeFocused = 'onNodeFocused',
     onDeviceAvailabilityChange = 'onDeviceAvailabilityChange',
     onVscodeCommandReceived = 'onVscodeCommandReceived',
@@ -11,5 +12,8 @@ export enum ViewProviderEvent {
     onRokuAutomationKeyPressed = 'onRokuAutomationKeyPressed',
     onRokuAppOverlayAdded = 'onRokuAppOverlayAdded',
     onRokuAppOverlayThumbnailsLoaded = 'onRokuAppOverlayThumbnailsLoaded',
-    onVscodeContextSet = 'onVscodeContextSet'
+    onRemoteControlModeChanged = 'onRemoteControlModeChanged',
+    onVscodeContextSet = 'onVscodeContextSet',
+    onRemoteCommandSent = 'onRemoteCommandSent',
+    onKeybindingsUpdated = 'onKeybindingsUpdated'
 }
diff --git a/src/viewProviders/ViewProviderId.ts b/src/viewProviders/ViewProviderId.ts
index ddde2fde4..d362cbbd1 100644
--- a/src/viewProviders/ViewProviderId.ts
+++ b/src/viewProviders/ViewProviderId.ts
@@ -8,5 +8,6 @@ export enum ViewProviderId {
     rokuAppOverlaysView = 'rokuAppOverlaysView',
     rokuCommandsView = 'rokuCommandsView',
     rokuAutomationView = 'rokuAutomationView',
-    rokuReplView = 'rokuReplView'
+    rokuReplView = 'rokuReplView',
+    remoteControlPanel = 'remoteControlPanel'
 }
diff --git a/webviews/src/main.ts b/webviews/src/main.ts
index 10253dbc1..84a0040cf 100644
--- a/webviews/src/main.ts
+++ b/webviews/src/main.ts
@@ -8,6 +8,7 @@ import rokuRegistryView from './views/RokuRegistryView/RokuRegistryView.svelte';
 import rokuAppOverlaysView from './views/RokuAppOverlaysView/RokuAppOverlaysView.svelte';
 import sceneGraphInspectorView from './views/SceneGraphInspectorView/SceneGraphInspectorView.svelte';
 import rokuReplView from './views/RokuReplView/RokuReplView.svelte';
+import remoteControlPanel from './views/RemoteControlPanel/RemoteControlPanel.svelte';
 
 
 import './style.css';
@@ -33,7 +34,8 @@ const views = {
     rokuRegistryView,
     rokuAppOverlaysView,
     sceneGraphInspectorView,
-    rokuReplView
+    rokuReplView,
+    remoteControlPanel
 };
 
 const app = new views[viewName]({
diff --git a/webviews/src/views/RemoteControlPanel/RemoteControlPanel.svelte b/webviews/src/views/RemoteControlPanel/RemoteControlPanel.svelte
new file mode 100644
index 000000000..8d74f26b8
--- /dev/null
+++ b/webviews/src/views/RemoteControlPanel/RemoteControlPanel.svelte
@@ -0,0 +1,796 @@
+<script lang="ts">
+    window.vscode = acquireVsCodeApi();
+
+    import { intermediary } from '../../ExtensionIntermediary';
+    import { ViewProviderCommand } from '../../../../src/viewProviders/ViewProviderCommand';
+    import { ViewProviderEvent } from '../../../../src/viewProviders/ViewProviderEvent';
+    import { onMount } from 'svelte';
+
+    let deviceInfo: string = 'No device connected';
+    let lastCommand: string = '';
+    let advanced: boolean = false;
+    let isFocused: boolean = false;
+    let isRemoteControlMode: boolean = false;
+    let activeButton: string = '';
+    let activeButtonTimeout: ReturnType<typeof setTimeout>;
+    let keybindings: Record<string, string[]> = {};
+
+    interface HistoryItem {
+        id: number;
+        type: 'button' | 'text';
+        value: string;
+    }
+
+    let historyItems: HistoryItem[] = [];
+    let historyCounter = 0;
+    let textBuffer = '';
+    let currentTextItemId: number | null = null;
+    let isNarrow = false;
+    let historyOpen = false;
+    let containerEl: HTMLElement;
+
+    // Observe device connection status
+    intermediary.observeEvent(ViewProviderEvent.onDeviceConnectionChanged, (message) => {
+        console.log('RemoteControlPanel received onDeviceConnectionChanged:', message);
+        if (message.context.connected) {
+            deviceInfo = `Connected to ${message.context.deviceName || 'Roku Device'}`;
+        } else {
+            deviceInfo = 'No device connected';
+        }
+    });
+
+    // Observe remote control mode status
+    intermediary.observeEvent(ViewProviderEvent.onRemoteControlModeChanged, (message) => {
+        isRemoteControlMode = message.context.isEnabled;
+    });
+
+    // Observe keybinding updates from the extension
+    intermediary.observeEvent(ViewProviderEvent.onKeybindingsUpdated, (message) => {
+        keybindings = message.context.keybindings;
+    });
+
+    // Observe remote commands sent from the extension (keyboard, command palette, etc.)
+    intermediary.observeEvent(ViewProviderEvent.onRemoteCommandSent, (message) => {
+        const key = message.context.key as string;
+        const literalCharacter = message.context.literalCharacter as boolean;
+        lastCommand = key;
+        activeButton = key;
+        clearTimeout(activeButtonTimeout);
+        activeButtonTimeout = setTimeout(() => {
+            activeButton = '';
+        }, 200);
+        if (literalCharacter) {
+            addCharToHistory(key);
+        } else {
+            addButtonHistory(key);
+        }
+    });
+
+    onMount(() => {
+        console.log('RemoteControlPanel mounted, sending viewReady');
+        intermediary.sendViewReady();
+
+        const onFocus = () => { isFocused = true; };
+        const onBlur = () => { isFocused = false; };
+        window.addEventListener('focus', onFocus);
+        window.addEventListener('blur', onBlur);
+        isFocused = document.hasFocus();
+
+        const ro = new ResizeObserver(entries => {
+            for (const entry of entries) {
+                isNarrow = entry.contentRect.width < 440;
+            }
+        });
+        ro.observe(containerEl);
+
+        return () => {
+            window.removeEventListener('focus', onFocus);
+            window.removeEventListener('blur', onBlur);
+            ro.disconnect();
+        };
+    });
+
+    function addCharToHistory(char: string) {
+        textBuffer += char;
+        if (currentTextItemId !== null) {
+            historyItems = historyItems.map(item =>
+                item.id === currentTextItemId ? { ...item, value: textBuffer } : item
+            );
+        } else {
+            const id = historyCounter++;
+            currentTextItemId = id;
+            historyItems = [{ id, type: 'text' as const, value: textBuffer }, ...historyItems].slice(0, 100);
+        }
+    }
+
+    function flushTextBuffer() {
+        textBuffer = '';
+        currentTextItemId = null;
+    }
+
+    function addButtonHistory(button: string) {
+        flushTextBuffer();
+        historyItems = [{ id: historyCounter++, type: 'button' as const, value: button }, ...historyItems].slice(0, 100);
+    }
+
+    async function sendRemoteCommand(command: string) {
+        addButtonHistory(command);
+        lastCommand = command;
+        console.log('Sending remote command:', command);
+        try {
+            await intermediary.sendCommand(ViewProviderCommand.sendRemoteCommand, {
+                button: command
+            });
+        } catch (error) {
+            console.error('Failed to send remote command:', error);
+        }
+    }
+
+    $: buttonTitle = (label: string, button: string): string => {
+        const keys = keybindings[button];
+        return keys?.length ? `${label} (${keys.join(', ')})` : label;
+    };
+
+    async function sendTextInput() {
+        const text = prompt('Enter text to send to device:');
+        if (text) {
+            flushTextBuffer();
+            historyItems = [{ id: historyCounter++, type: 'text' as const, value: text }, ...historyItems].slice(0, 100);
+            await intermediary.sendCommand(ViewProviderCommand.sendRemoteText, {
+                text: text
+            });
+        }
+    }
+</script>
+
+<style>
+    .remote-container {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        padding: 12px;
+        gap: 10px;
+        user-select: none;
+        width: 300px;
+        flex-shrink: 0;
+        border: 2px solid transparent;
+        border-radius: 12px;
+        transition: border-color 0.2s;
+    }
+
+    .remote-container.focused {
+        border-color: var(--vscode-focusBorder, #007fd4);
+    }
+
+    .focus-indicator {
+        width: 100%;
+        text-align: center;
+        padding: 5px 8px;
+        border-radius: 6px;
+        font-size: 11px;
+        font-weight: 600;
+        letter-spacing: 0.4px;
+        transition: background 0.2s, color 0.2s;
+    }
+
+    .focus-indicator.active {
+        background: var(--vscode-testing-iconPassed, #388a34);
+        color: white;
+    }
+
+    .focus-indicator.inactive {
+        background: var(--vscode-editor-background);
+        color: var(--vscode-descriptionForeground);
+        border: 1px dashed var(--vscode-panel-border);
+        cursor: pointer;
+    }
+
+    .device-status {
+        width: 100%;
+        display: flex;
+        align-items: center;
+        gap: 6px;
+        padding: 8px;
+        background: var(--vscode-editor-background);
+        border: 1px solid var(--vscode-panel-border);
+        border-radius: 8px;
+    }
+
+    .last-command {
+        font-size: 11px;
+        color: var(--vscode-descriptionForeground);
+        margin-top: 3px;
+    }
+
+    .remote-body {
+        display: flex;
+        gap: 8px;
+        width: 100%;
+    }
+
+    .main-controls {
+        flex: 1;
+        display: flex;
+        flex-direction: column;
+        gap: 10px;
+    }
+
+    .side-controls {
+        display: flex;
+        flex-direction: column;
+        gap: 6px;
+        padding-top: 0;
+        align-items: stretch;
+        flex-shrink: 0;
+        width: 58px;
+    }
+
+    .button-row {
+        display: flex;
+        justify-content: center;
+        gap: 6px;
+    }
+
+    .button-row .remote-button {
+        flex: 1;
+    }
+
+    .remote-button {
+        background: #6B3FA0;
+        color: white;
+        border: none;
+        border-radius: 20px;
+        padding: 10px 8px;
+        cursor: pointer;
+        font-size: 16px;
+        font-weight: 500;
+        transition: all 0.1s;
+        min-width: 0;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+    }
+
+    .remote-button:hover {
+        background: #7E52B5;
+    }
+
+    .remote-button:active {
+        transform: scale(0.95);
+        background: #5A3287;
+    }
+
+    .pressed {
+        transform: scale(0.95);
+        filter: brightness(0.8);
+    }
+
+    .dpad-container {
+        display: grid;
+        grid-template-columns: 1fr 1fr 1fr;
+        grid-template-rows: 1fr 1fr 1fr;
+        gap: 0;
+        width: fit-content;
+        margin: 0 auto;
+        background: transparent;
+        position: relative;
+    }
+
+    .dpad-container::before {
+        content: '';
+        position: absolute;
+        top: 0;
+        left: 33.33%;
+        right: 33.33%;
+        bottom: 0;
+        background: #6B3FA0;
+        z-index: 0;
+        border-radius: 12px;
+    }
+
+    .dpad-container::after {
+        content: '';
+        position: absolute;
+        left: 0;
+        right: 0;
+        top: 33.33%;
+        bottom: 33.33%;
+        background: #6B3FA0;
+        z-index: 0;
+        border-radius: 12px;
+    }
+
+    .dpad-corner {
+        background: transparent;
+        pointer-events: none;
+    }
+
+    .dpad-button {
+        background: #6B3FA0;
+        color: white;
+        border: none;
+        border-radius: 0;
+        padding: 16px;
+        cursor: pointer;
+        font-size: 15px;
+        font-weight: 600;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        position: relative;
+        z-index: 1;
+    }
+
+    .dpad-button:hover {
+        background: #7E52B5;
+    }
+
+    .dpad-button:active {
+        transform: scale(0.95);
+    }
+
+    .dpad-up {
+        grid-column: 2;
+        grid-row: 1;
+        border-radius: 12px 12px 0 0;
+    }
+    .dpad-left {
+        grid-column: 1;
+        grid-row: 2;
+        border-radius: 12px 0 0 12px;
+    }
+    .dpad-ok {
+        grid-column: 2;
+        grid-row: 2;
+        background: #7E52B5;
+        font-weight: bold;
+        border-radius: 50%;
+        border: 3px solid #5A3287;
+        margin: 5px;
+        font-size: 13px;
+        letter-spacing: 0.5px;
+    }
+    .dpad-right {
+        grid-column: 3;
+        grid-row: 2;
+        border-radius: 0 12px 12px 0;
+    }
+    .dpad-down {
+        grid-column: 2;
+        grid-row: 3;
+        border-radius: 0 0 12px 12px;
+    }
+
+    .colored-buttons {
+        display: flex;
+        justify-content: center;
+        gap: 6px;
+    }
+
+    .colored-button {
+        width: 45px;
+        height: 36px;
+        border-radius: 8px;
+        border: 2px solid rgba(0, 0, 0, 0.2);
+        cursor: pointer;
+        transition: all 0.1s;
+    }
+
+    .colored-button:active {
+        transform: scale(0.95);
+    }
+
+    .btn-blue { background: #0066cc; }
+    .btn-green { background: #00aa44; }
+    .btn-red { background: #cc0000; }
+    .btn-yellow { background: #ccaa00; }
+
+    .power-button {
+        background: #6B3FA0;
+        color: #ff5252;
+        width: fit-content;
+        min-width: 60px;
+        align-self: center;
+        font-size: 22px;
+        padding: 10px 20px;
+        border-radius: 50%;
+    }
+
+    .power-button:hover {
+        background: #7E52B5;
+        color: #ff8a80;
+    }
+
+    .section-title {
+        text-align: center;
+        font-size: 10px;
+        color: var(--vscode-descriptionForeground);
+        margin: 2px 0;
+        text-transform: uppercase;
+        letter-spacing: 1px;
+    }
+
+    .volume-button {
+        padding: 10px 4px;
+        font-size: 12px;
+        border-radius: 20px;
+        text-align: center;
+        width: 100%;
+    }
+
+    .advanced-toggle {
+        align-items: center;
+        gap: 6px;
+        font-size: 11px;
+        color: var(--vscode-descriptionForeground);
+        cursor: pointer;
+        user-select: none;
+        align-self: flex-end;
+    }
+
+    .advanced-toggle input {
+        cursor: pointer;
+    }
+
+    /* ── Layout wrapper ── */
+    .page-wrapper {
+        display: flex;
+        flex-direction: row;
+        align-items: flex-start;
+        gap: 8px;
+        padding: 8px;
+        box-sizing: border-box;
+        width: 100%;
+        position: relative;
+    }
+
+    /* ── History toggle button (narrow mode only) ── */
+    .history-toggle-btn {
+        flex-shrink: 0;
+        background: var(--vscode-button-secondaryBackground, #3a3d41);
+        color: var(--vscode-button-secondaryForeground, #cccccc);
+        border: 1px solid var(--vscode-panel-border);
+        border-radius: 4px;
+        padding: 3px 7px;
+        font-size: 10px;
+        cursor: pointer;
+        white-space: nowrap;
+    }
+
+    .history-toggle-btn:hover {
+        background: var(--vscode-button-secondaryHoverBackground, #45494e);
+    }
+
+    .history-toggle-active {
+        background: var(--vscode-button-background, #0e639c);
+        color: var(--vscode-button-foreground, #ffffff);
+        border-color: var(--vscode-button-background, #0e639c);
+    }
+
+    /* ── History panel ── */
+    .history-panel {
+        flex-shrink: 0;
+        width: 150px;
+        display: flex;
+        flex-direction: column;
+        background: var(--vscode-editor-background);
+        border: 1px solid var(--vscode-panel-border);
+        border-radius: 8px;
+        overflow: hidden;
+        max-height: 600px;
+        align-self: stretch;
+    }
+
+    .history-overlay {
+        position: absolute;
+        top: 8px;
+        left: 8px;
+        right: 8px;
+        width: auto;
+        max-height: 85%;
+        z-index: 10;
+        box-shadow: 0 4px 16px rgba(0, 0, 0, 0.4);
+    }
+
+    .history-header {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        padding: 6px 8px;
+        border-bottom: 1px solid var(--vscode-panel-border);
+        flex-shrink: 0;
+    }
+
+    .history-title {
+        font-size: 10px;
+        font-weight: 600;
+        text-transform: uppercase;
+        letter-spacing: 0.8px;
+        color: var(--vscode-descriptionForeground);
+    }
+
+    .history-clear-btn {
+        background: none;
+        border: none;
+        color: var(--vscode-descriptionForeground);
+        font-size: 10px;
+        cursor: pointer;
+        padding: 1px 4px;
+        border-radius: 3px;
+    }
+
+    .history-clear-btn:hover {
+        background: var(--vscode-toolbar-hoverBackground);
+        color: var(--vscode-foreground);
+    }
+
+    .history-close-btn {
+        margin-left: auto;
+        background: none;
+        border: none;
+        color: var(--vscode-descriptionForeground);
+        font-size: 12px;
+        cursor: pointer;
+        padding: 1px 5px;
+        border-radius: 3px;
+        line-height: 1;
+    }
+
+    .history-close-btn:hover {
+        background: var(--vscode-toolbar-hoverBackground);
+        color: var(--vscode-foreground);
+    }
+
+    .history-list {
+        overflow-y: auto;
+        flex: 1;
+        display: flex;
+        flex-direction: column;
+        padding: 4px;
+        gap: 2px;
+    }
+
+    .history-empty {
+        padding: 12px 8px;
+        text-align: center;
+        font-size: 11px;
+        color: var(--vscode-descriptionForeground);
+        opacity: 0.6;
+    }
+
+    .history-item {
+        display: flex;
+        align-items: baseline;
+        gap: 5px;
+        padding: 3px 5px;
+        border-radius: 4px;
+        font-size: 11px;
+        background: var(--vscode-list-inactiveSelectionBackground, rgba(255,255,255,0.04));
+    }
+
+    .history-item-type {
+        flex-shrink: 0;
+        font-size: 9px;
+        font-weight: 700;
+        width: 12px;
+        text-align: center;
+        opacity: 0.5;
+    }
+
+    .history-item-text .history-item-type {
+        color: var(--vscode-charts-green, #4ec9b0);
+    }
+
+    .history-item-button .history-item-type {
+        color: var(--vscode-charts-blue, #569cd6);
+    }
+
+    .history-item-value {
+        flex: 1;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+        color: var(--vscode-foreground);
+    }
+
+    .history-item-text .history-item-value {
+        font-style: italic;
+    }
+
+    .device-status-info {
+        flex: 1;
+        text-align: center;
+    }
+</style>
+
+<div class="page-wrapper" bind:this={containerEl}>
+<div class="remote-container" class:focused={isFocused}>
+    <div class="device-status">
+        <div class="device-status-info">
+            <div>{deviceInfo}</div>
+            {#if lastCommand}
+                <div class="last-command">Last: {lastCommand}</div>
+            {/if}
+        </div>
+        {#if isNarrow}
+            <button
+                class="history-toggle-btn"
+                class:history-toggle-active={historyOpen}
+                on:click={() => historyOpen = !historyOpen}
+                title="Toggle command history"
+            >{historyOpen ? 'Close' : 'History'}{!historyOpen && historyItems.length > 0 ? ` (${historyItems.length})` : ''}</button>
+        {/if}
+    </div>
+
+    {#if !isRemoteControlMode}
+        <div class="focus-indicator inactive">Remote control mode is off</div>
+    {:else if isFocused}
+        <div class="focus-indicator active">Keyboard active — keys sent to Roku</div>
+    {:else}
+        <div class="focus-indicator inactive" on:click={() => window.focus()} on:keydown={() => window.focus()} role="button" tabindex="0">
+            Click to enable keyboard control
+        </div>
+    {/if}
+
+    <label class="advanced-toggle">
+        <input type="checkbox" bind:checked={advanced} />
+        Advanced
+    </label>
+
+    <div class="remote-body">
+        <!-- Main Remote Controls -->
+        <div class="main-controls">
+            <!-- Power Button -->
+            <button class="remote-button power-button" class:pressed={activeButton === 'Power'} on:click={() => sendRemoteCommand('Power')} title={buttonTitle('Power', 'Power')}>
+                ⏻
+            </button>
+
+            <!-- Top Buttons -->
+            <div class="button-row">
+                <button class="remote-button" class:pressed={activeButton === 'Back'} on:click={() => sendRemoteCommand('Back')} title={buttonTitle('Back', 'Back')}>
+                    ←
+                </button>
+                <button class="remote-button" class:pressed={activeButton === 'Home'} on:click={() => sendRemoteCommand('Home')} title={buttonTitle('Home', 'Home')}>
+                    ⌂
+                </button>
+            </div>
+
+            <!-- D-Pad -->
+            <div class="section-title">Navigation</div>
+            <div class="dpad-container">
+                <div class="dpad-corner"></div>
+                <button class="dpad-button dpad-up" class:pressed={activeButton === 'Up'} on:click={() => sendRemoteCommand('Up')} title={buttonTitle('Up', 'Up')}>
+                    ^
+                </button>
+                <div class="dpad-corner"></div>
+                <button class="dpad-button dpad-left" class:pressed={activeButton === 'Left'} on:click={() => sendRemoteCommand('Left')} title={buttonTitle('Left', 'Left')}>
+                    &lt;
+                </button>
+                <button class="dpad-button dpad-ok" class:pressed={activeButton === 'Select'} on:click={() => sendRemoteCommand('Select')} title={buttonTitle('Select', 'Select')}>
+                    OK
+                </button>
+                <button class="dpad-button dpad-right" class:pressed={activeButton === 'Right'} on:click={() => sendRemoteCommand('Right')} title={buttonTitle('Right', 'Right')}>
+                    &gt;
+                </button>
+                <div class="dpad-corner"></div>
+                <button class="dpad-button dpad-down" class:pressed={activeButton === 'Down'} on:click={() => sendRemoteCommand('Down')} title={buttonTitle('Down', 'Down')}>
+                    v
+                </button>
+                <div class="dpad-corner"></div>
+            </div>
+
+            <!-- Under D-Pad Buttons -->
+            <div class="button-row">
+                <button class="remote-button" class:pressed={activeButton === 'InstantReplay'} on:click={() => sendRemoteCommand('InstantReplay')} title={buttonTitle('Instant Replay', 'InstantReplay')}>
+                    ↺
+                </button>
+                <button class="remote-button" class:pressed={activeButton === 'Info'} on:click={() => sendRemoteCommand('Info')} title={buttonTitle('Options / Info', 'Info')}>
+                    *
+                </button>
+            </div>
+
+            <!-- Playback Controls -->
+            <div class="section-title">Playback</div>
+            <div class="button-row">
+                <button class="remote-button" class:pressed={activeButton === 'Rev'} on:click={() => sendRemoteCommand('Rev')} title={buttonTitle('Rewind', 'Rev')}>
+                    «
+                </button>
+                <button class="remote-button" class:pressed={activeButton === 'Play'} on:click={() => sendRemoteCommand('Play')} title={buttonTitle('Play / Pause', 'Play')}>
+                    ▶
+                </button>
+                <button class="remote-button" class:pressed={activeButton === 'Fwd'} on:click={() => sendRemoteCommand('Fwd')} title={buttonTitle('Fast Forward', 'Fwd')}>
+                    »
+                </button>
+            </div>
+
+            {#if advanced}
+            <!-- Colored Buttons -->
+            <div class="section-title">Shortcuts</div>
+            <div class="colored-buttons">
+                <button
+                    class="colored-button btn-blue"
+                    class:pressed={activeButton === 'Blue'}
+                    on:click={() => sendRemoteCommand('Blue')}
+                    title={buttonTitle('Blue', 'Blue')}
+                ></button>
+                <button
+                    class="colored-button btn-green"
+                    class:pressed={activeButton === 'Green'}
+                    on:click={() => sendRemoteCommand('Green')}
+                    title={buttonTitle('Green', 'Green')}
+                ></button>
+                <button
+                    class="colored-button btn-red"
+                    class:pressed={activeButton === 'Red'}
+                    on:click={() => sendRemoteCommand('Red')}
+                    title={buttonTitle('Red', 'Red')}
+                ></button>
+                <button
+                    class="colored-button btn-yellow"
+                    class:pressed={activeButton === 'Yellow'}
+                    on:click={() => sendRemoteCommand('Yellow')}
+                    title={buttonTitle('Yellow', 'Yellow')}
+                ></button>
+            </div>
+
+            <!-- Bottom Buttons -->
+            <div class="button-row">
+                <button class="remote-button" class:pressed={activeButton === 'Exit'} on:click={() => sendRemoteCommand('Exit')}>
+                    Exit
+                </button>
+                <button class="remote-button" class:pressed={activeButton === 'Guide'} on:click={() => sendRemoteCommand('Guide')}>
+                    Guide
+                </button>
+            </div>
+            {/if}
+
+            <!-- Text Input -->
+            <button class="remote-button" on:click={sendTextInput} title="Send Text">
+                ⌨ Text
+            </button>
+        </div>
+
+        {#if advanced}
+        <!-- Side Volume Controls -->
+        <div class="side-controls">
+            <div class="section-title">Volume</div>
+            <button class="remote-button volume-button" class:pressed={activeButton === 'VolumeUp'} on:click={() => sendRemoteCommand('VolumeUp')} title={buttonTitle('Volume Up', 'VolumeUp')}>
+                Vol +
+            </button>
+            <button class="remote-button volume-button" class:pressed={activeButton === 'VolumeDown'} on:click={() => sendRemoteCommand('VolumeDown')} title={buttonTitle('Volume Down', 'VolumeDown')}>
+                Vol −
+            </button>
+            <button class="remote-button volume-button" class:pressed={activeButton === 'VolumeMute'} on:click={() => sendRemoteCommand('VolumeMute')} title={buttonTitle('Mute', 'VolumeMute')}>
+                Mute
+            </button>
+        </div>
+        {/if}
+    </div>
+</div>
+
+{#if !isNarrow || historyOpen}
+    <div class="history-panel" class:history-overlay={isNarrow && historyOpen}>
+        <div class="history-header">
+            <span class="history-title">History</span>
+            {#if historyItems.length > 0}
+                <button class="history-clear-btn" on:click={() => historyItems = []}>Clear</button>
+            {/if}
+            {#if isNarrow}
+                <button class="history-close-btn" on:click={() => historyOpen = false} title="Close history">✕</button>
+            {/if}
+        </div>
+        <div class="history-list">
+            {#if historyItems.length === 0}
+                <div class="history-empty">No commands yet</div>
+            {:else}
+                {#each historyItems as item (item.id)}
+                    <div class="history-item history-item-{item.type}">
+                        <span class="history-item-type">{item.type === 'text' ? 'T' : '>'}</span>
+                        <span class="history-item-value">{item.value}</span>
+                    </div>
+                {/each}
+            {/if}
+        </div>
+    </div>
+{/if}
+</div>