Bump version to 4.7.0

Update better-xcloud.user.js
Add vscode files
2025-06-29 10:51:44 +02:00 · 2024-06-08 17:22:43 +07:00 · 2024-06-08 17:21:55 +07:00 · 2024-06-08 17:05:02 +07:00 · 2024-06-08 17:04:49 +07:00 · 2024-06-07 21:04:52 +07:00
66 changed files with 4236 additions and 1962 deletions
--- a/.github/ISSUE_TEMPLATE/01-bug-report.yml
+++ b/.github/ISSUE_TEMPLATE/01-bug-report.yml
@ -11,12 +11,21 @@ body:
      options:
        - label: I will only use English in my report.
          required: true
-        - label: "The bug doesn't happen when I disable Better xCloud script."
-          required: true
        - label: I have used the search function for [**open and closed issues**](https://github.com/redphx/better-xcloud/issues?q=is%3Aissue) to see if someone else has already submitted the same bug report.
          required: true
        - label: I will describe the problem with as much detail as possible.
          required: true
+  - type: checkboxes
+    id: questions
+    attributes:
+      label: Questions
+      options:
+        - label: xCloud officially supports my country/region.
+          required: false
+        - label: "The bug doesn't happen when I disable Better xCloud script."
+          required: false
+        - label: "The bug didn't happen in previous Better xCloud version (name which one)."
+          required: false
  - type: dropdown
    id: device_type
    attributes:
@ -50,9 +59,9 @@ body:
  - type: input
    id: browser_version
    attributes:
-      label: "Browser Version"
-      description: "What is the name and version of the browser?"
-      placeholder: "e.g., Chrome 124.0"
+      label: "Android app/Browser Version"
+      description: "What is the name and version of the browser/Android app?"
+      placeholder: "e.g., Chrome 124.0, Android app 0.15.0"
    validations:
      required: true
  - type: input
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@ -0,0 +1,5 @@
+{
+  "files.readonlyInclude": {
+    "dist/**/*": true
+  }
+}
--- a/.vscode/tasks.json
+++ b/.vscode/tasks.json
@ -0,0 +1,15 @@
+{
+  "version": "2.0.0",
+  "tasks": [
+    {
+      "type": "typescript",
+      "tsconfig": "tsconfig.json",
+      "option": "watch",
+      "problemMatcher": [
+        "$tsc-watch"
+      ],
+      "group": "build",
+      "label": "tsc: watch - tsconfig.json"
+    }
+  ]
+}
--- a/dist/better-xcloud.meta.js
+++ b/dist/better-xcloud.meta.js
@ -1,5 +1,5 @@
 // ==UserScript==
 // @name         Better xCloud
 // @namespace    https://github.com/redphx
-// @version      4.5.0
+// @version      4.7.0
 // ==/UserScript==
--- a/dist/better-xcloud.user.js
+++ b/dist/better-xcloud.user.js
--- a/package.json
+++ b/package.json
@ -6,12 +6,12 @@
    "build": "build.ts"
  },
  "devDependencies": {
-    "@types/bun": "latest",
-    "@types/node": "^20.12.7",
+    "@types/bun": "^1.1.3",
+    "@types/node": "^20.13.0",
    "@types/stylus": "^0.48.42",
    "stylus": "^0.63.0"
  },
  "peerDependencies": {
-    "typescript": "^5.0.0"
+    "typescript": "^5.4.5"
  }
 }
--- a/scripts/custom-flags.user.js
+++ b/scripts/custom-flags.user.js
@ -0,0 +1,41 @@
+// ==UserScript==
+// @name         Better xCloud - Custom flags
+// @namespace    https://github.com/redphx
+// @version      1.0.0
+// @description  Customize Better xCloud script
+// @author       redphx
+// @license      MIT
+// @match        https://www.xbox.com/*/play*
+// @run-at       document-start
+// @grant        none
+// ==/UserScript==
+'use strict';
+
+/*
+Make sure this script is being loaded before the Better xCloud script.
+
+How to:
+1. Uninstall Better xCloud script.
+2. Install this script.
+3. Reinstall Better xCloud script. All your settings are still there.
+*/
+
+// Change this to `false` if you want to temporary disable the script
+const enabled = true;
+
+enabled && (window.BX_FLAGS = {
+    /*
+    Add titleId of the game(s) you want to add here.
+    Keep in mind: this method only works with some games.
+
+    Example:
+        - Flight Simulator has this link: /play/games/microsoft-flight-simulator-standard-40th-anniversa/9PMQDM08SNK9
+        - That means its titleId is "9PMQDM08SNK9"
+        - So it becomes:
+            ForceNativeMkbTitles: [
+                "9PMQDM08SNK9",
+            ],
+    */
+    ForceNativeMkbTitles: [
+    ],
+});
--- a/src/assets/css/button.styl
+++ b/src/assets/css/button.styl
@ -59,6 +59,10 @@
        }
    }

+    &.bx-tall {
+        height: calc(var(--bx-button-height) * 1.5) !important;
+    }
+
    svg {
        display: inline-block;
        width: 16px;
@ -71,10 +75,10 @@

    span {
        display: inline-block;
-        height: var(--bx-button-height);
+        /* height: var(--bx-button-height); */
        line-height: var(--bx-button-height);
        vertical-align: middle;
-        vertical-align: -webkit-baseline-middle;
+        /* vertical-align: -webkit-baseline-middle; */
        color: #fff;
        overflow: hidden;
        white-space: nowrap;
--- a/src/assets/css/global-settings.styl
+++ b/src/assets/css/global-settings.styl
@ -1,6 +1,5 @@
 .bx-settings-reload-button {
    margin-top: 10px;
-    height: calc(var(--bx-button-height) * 1.5);
 }

 .bx-settings-container {
--- a/src/assets/css/mkb.styl
+++ b/src/assets/css/mkb.styl
@ -16,8 +16,6 @@
 }

 .bx-mkb-pointer-lock-msg {
-    display: flex;
-    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
    position: fixed;
@ -25,7 +23,7 @@
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
    margin: auto;
-    background: #000000e5;
+    background: #151515;
    z-index: var(--bx-mkb-pointer-lock-msg-z-index);
    color: #fff;
    text-align: center;
@ -36,21 +34,14 @@
    border-radius: 8px;
    align-items: center;
    box-shadow: 0 0 6px #000;
+    min-width: 220px;
+    opacity: 0.9;

    &:hover {
-        background: #151515;
+        opacity: 1;
    }

-    button {
-        margin-right: 12px;
-        height: 60px;
-    }
-
-    svg {
-        width: 32px;
-    }
-
-    div {
+    > div:first-of-type {
        display: flex;
        flex-direction: column;
        text-align: left;
@ -61,14 +52,47 @@

        &:first-child {
            font-size: 22px;
-            margin-bottom: 8px;
+            margin-bottom: 4px;
+            font-weight: bold;
        }

        &:last-child {
-            font-size: 14px;
+            font-size: 12px;
            font-style: italic;
        }
    }
+
+    > div:last-of-type {
+        margin-top: 10px;
+
+        &[data-type='native'] {
+            button {
+                &:first-of-type {
+                    margin-bottom: 8px;
+                }
+            }
+        }
+
+        &[data-type='virtual'] {
+            div {
+                display: flex;
+                flex-flow: row;
+                margin-top: 8px;
+
+                button {
+                    flex: 1;
+
+                    &:first-of-type {
+                        margin-right: 5px;
+                    }
+
+                    &:last-of-type {
+                        margin-left: 5px;
+                    }
+                }
+            }
+        }
+    }
 }

 .bx-mkb-preset-tools {
--- a/src/assets/css/stream-stats.styl
+++ b/src/assets/css/stream-stats.styl
@ -1,6 +1,5 @@
 /* STATS BADGE */
 .bx-badges {
-    position: absolute;
    margin-left: 0px;
    user-select: none;
    -webkit-user-select: none;
@ -17,27 +16,60 @@
    margin: 0 8px 8px 0;
    box-shadow: 0px 0px 6px #000;
    border-radius: 4px;
+    height: 30px;
 }

 .bx-badge-name {
    background-color: #2d3036;
-    display: inline-block;
-    padding: 2px 8px;
    border-radius: 4px 0 0 4px;
-    text-transform: uppercase;
+
+    svg {
+        width: 16px;
+        height: 16px;
+    }
 }

 .bx-badge-value {
    background-color: grey;
-    display: inline-block;
-    padding: 2px 8px;
    border-radius: 0 4px 4px 0;
 }

+.bx-badge-name, .bx-badge-value {
+    display: inline-block;
+    padding: 0 8px;
+    /* height: 30px; */
+    line-height: 30px;
+    vertical-align: bottom;
+}
+
 .bx-badge-battery[data-charging=true] span:first-of-type::after {
    content: ' ⚡️';
 }

+div[class^=StreamMenu-module__container] .bx-badges {
+    position: absolute;
+    max-width: 500px;
+}
+
+#gamepass-dialog-root .bx-badges {
+    position: fixed;
+    top: 60px;
+    left: 460px;
+    max-width: 500px;
+
+    @media (min-width: 568px) and (max-height: 480px) {
+        position: unset;
+        top: unset;
+        left: unset;
+        margin: 8px 0;
+    }
+
+    @media (min-width: 480px) and (min-height: calc(481px)) {
+
+    }
+}
+
+
 /* STATS BAR */
 .bx-stats-bar {
    display: block;
--- a/src/assets/css/stream.styl
+++ b/src/assets/css/stream.styl
@ -20,6 +20,18 @@ body[data-media-type=tv] .bx-stream-refresh-button {
    top: calc(var(--gds-focus-borderSize) + 80px) !important;
 }

+.bx-stream-home-button {
+    top: calc(env(safe-area-inset-top, 0px) + 10px + 50px * 2) !important;
+}
+
+body[data-media-type=default] .bx-stream-home-button {
+    left: calc(env(safe-area-inset-left, 0px) + 12px) !important;
+}
+
+body[data-media-type=tv] .bx-stream-home-button {
+    top: calc(var(--gds-focus-borderSize) + 80px * 2) !important;
+}
+
@keyframes bx-anim-taking-screenshot {
    0% {
        border: 0px solid #ffffff80;
@ -53,3 +65,10 @@ div[data-testid=media-container] {
    align-self: center;
    background: #000;
 }
+
+#gamepass-dialog-root div[class^=Guide-module__guide] {
+    .bx-button {
+        overflow: visible;
+        margin-bottom: 12px;
+    }
+}
--- a/src/assets/svg/battery-full.svg
+++ b/src/assets/svg/battery-full.svg
@ -0,0 +1,3 @@
+<svg xmlns='http://www.w3.org/2000/svg' fill='#fff' fill-rule='evenodd' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' stroke-miterlimit='2' viewBox='0 0 32 32'>
+    <path d='M24.774 6.71H3.097C1.398 6.71 0 8.108 0 9.806v12.387c0 1.699 1.398 3.097 3.097 3.097h21.677c1.699 0 3.097-1.398 3.097-3.097V9.806c0-1.699-1.398-3.097-3.097-3.097zm1.032 15.484a1.04 1.04 0 0 1-1.032 1.032H3.097a1.04 1.04 0 0 1-1.032-1.032V9.806a1.04 1.04 0 0 1 1.032-1.032h21.677a1.04 1.04 0 0 1 1.032 1.032v12.387zm-2.065-10.323v8.258a1.04 1.04 0 0 1-1.032 1.032H5.161a1.04 1.04 0 0 1-1.032-1.032v-8.258a1.04 1.04 0 0 1 1.032-1.032H22.71a1.04 1.04 0 0 1 1.032 1.032zm8.258 0v8.258a1.04 1.04 0 0 1-1.032 1.032 1.04 1.04 0 0 1-1.032-1.032v-8.258a1.04 1.04 0 0 1 1.032-1.032A1.04 1.04 0 0 1 32 11.871z' fill-rule='nonzero'/>
+</svg>
--- a/src/assets/svg/camera.svg
+++ b/src/assets/svg/camera.svg
@ -1,6 +1,6 @@
 <svg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='#fff' fill-rule='evenodd' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' viewBox='0 0 32 32'>
-    <g transform="matrix(.150985 0 0 .150985 -3.32603 -2.72209)" fill="none" stroke="#fff" stroke-width="16">
-        <path d="M208 208H48c-8.777 0-16-7.223-16-16V80c0-8.777 7.223-16 16-16h32l16-24h64l16 24h32c8.777 0 16 7.223 16 16v112c0 8.777-7.223 16-16 16z"/>
-        <circle cx="128" cy="132" r="36"/>
+    <g transform='matrix(.150985 0 0 .150985 -3.32603 -2.72209)' fill='none' stroke='#fff' stroke-width='16'>
+        <path d='M208 208H48c-8.777 0-16-7.223-16-16V80c0-8.777 7.223-16 16-16h32l16-24h64l16 24h32c8.777 0 16 7.223 16 16v112c0 8.777-7.223 16-16 16z'/>
+        <circle cx='128' cy='132' r='36'/>
    </g>
 </svg>
--- a/src/assets/svg/caret-left.svg
+++ b/src/assets/svg/caret-left.svg
@ -1,3 +1,3 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="100%" stroke="#fff" fill="#fff" height="100%" viewBox="0 0 32 32" fill-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="2">
-    <path d="M6.755 1.924l-6 13.649c-.119.27-.119.578 0 .849l6 13.649c.234.533.857.775 1.389.541s.775-.857.541-1.389L2.871 15.997 8.685 2.773c.234-.533-.008-1.155-.541-1.389s-1.155.008-1.389.541z"/>
+<svg xmlns='http://www.w3.org/2000/svg' width='100%' stroke='#fff' fill='#fff' height='100%' viewBox='0 0 32 32' fill-rule='evenodd' stroke-linejoin='round' stroke-miterlimit='2'>
+    <path d='M6.755 1.924l-6 13.649c-.119.27-.119.578 0 .849l6 13.649c.234.533.857.775 1.389.541s.775-.857.541-1.389L2.871 15.997 8.685 2.773c.234-.533-.008-1.155-.541-1.389s-1.155.008-1.389.541z'/>
 </svg>
--- a/src/assets/svg/caret-right.svg
+++ b/src/assets/svg/caret-right.svg
@ -1,3 +1,3 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="100%" stroke="#fff" fill="#fff" height="100%" viewBox="0 0 32 32" fill-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="2">
-    <path d="M2.685 1.924l6 13.649c.119.27.119.578 0 .849l-6 13.649c-.234.533-.857.775-1.389.541s-.775-.857-.541-1.389l5.813-13.225L.755 2.773c-.234-.533.008-1.155.541-1.389s1.155.008 1.389.541z"/>
+<svg xmlns='http://www.w3.org/2000/svg' width='100%' stroke='#fff' fill='#fff' height='100%' viewBox='0 0 32 32' fill-rule='evenodd' stroke-linejoin='round' stroke-miterlimit='2'>
+    <path d='M2.685 1.924l6 13.649c.119.27.119.578 0 .849l-6 13.649c-.234.533-.857.775-1.389.541s-.775-.857-.541-1.389l5.813-13.225L.755 2.773c-.234-.533.008-1.155.541-1.389s1.155.008 1.389.541z'/>
 </svg>
--- a/src/assets/svg/clock.svg
+++ b/src/assets/svg/clock.svg
@ -0,0 +1,6 @@
+<svg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='#fff' fill-rule='evenodd' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' viewBox='0 0 32 32'>
+    <g transform='matrix(.150026 0 0 .150026 -3.20332 -3.20332)' fill='none' stroke='#fff' stroke-width='16'>
+        <circle cx='128' cy='128' r='96'/>
+        <path d='M128 72v56h56'/>
+    </g>
+</svg>
--- a/src/assets/svg/cloud.svg
+++ b/src/assets/svg/cloud.svg
@ -0,0 +1,3 @@
+<svg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='#fff' fill-rule='evenodd' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' viewBox='0 0 32 32'>
+    <path d='M9.773 16c0-5.694 4.685-10.379 10.379-10.379S30.53 10.306 30.53 16s-4.685 10.379-10.379 10.379H8.735c-3.982-.005-7.256-3.283-7.256-7.265s3.28-7.265 7.265-7.265c.606 0 1.21.076 1.797.226' fill='none' stroke='#fff' stroke-width='2.076'/>
+</svg>
--- a/src/assets/svg/command.svg
+++ b/src/assets/svg/command.svg
@ -1,4 +1,4 @@
 <svg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='#fff' fill-rule='evenodd' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' viewBox='0 0 32 32'>
-    <path d="M25.425 1.5c2.784 0 5.075 2.291 5.075 5.075s-2.291 5.075-5.075 5.075H20.35V6.575c0-2.784 2.291-5.075 5.075-5.075zM11.65 11.65H6.575C3.791 11.65 1.5 9.359 1.5 6.575S3.791 1.5 6.575 1.5s5.075 2.291 5.075 5.075v5.075zm8.7 8.7h5.075c2.784 0 5.075 2.291 5.075 5.075S28.209 30.5 25.425 30.5s-5.075-2.291-5.075-5.075V20.35zM6.575 30.5c-2.784 0-5.075-2.291-5.075-5.075s2.291-5.075 5.075-5.075h5.075v5.075c0 2.784-2.291 5.075-5.075 5.075z"/>
-    <path d="M11.65 11.65h8.7v8.7h-8.7z"/>
+    <path d='M25.425 1.5c2.784 0 5.075 2.291 5.075 5.075s-2.291 5.075-5.075 5.075H20.35V6.575c0-2.784 2.291-5.075 5.075-5.075zM11.65 11.65H6.575C3.791 11.65 1.5 9.359 1.5 6.575S3.791 1.5 6.575 1.5s5.075 2.291 5.075 5.075v5.075zm8.7 8.7h5.075c2.784 0 5.075 2.291 5.075 5.075S28.209 30.5 25.425 30.5s-5.075-2.291-5.075-5.075V20.35zM6.575 30.5c-2.784 0-5.075-2.291-5.075-5.075s2.291-5.075 5.075-5.075h5.075v5.075c0 2.784-2.291 5.075-5.075 5.075z'/>
+    <path d='M11.65 11.65h8.7v8.7h-8.7z'/>
 </svg>
--- a/src/assets/svg/download.svg
+++ b/src/assets/svg/download.svg
@ -0,0 +1,4 @@
+<svg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='#fff' fill-rule='evenodd' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' viewBox='0 0 32 32'>
+    <path d='M16 19.955V1.5m14.5 18.455v9.227c0 .723-.595 1.318-1.318 1.318H2.818c-.723 0-1.318-.595-1.318-1.318v-9.227'/>
+    <path d='M22.591 13.364L16 19.955l-6.591-6.591'/>
+</svg>
--- a/src/assets/svg/home.svg
+++ b/src/assets/svg/home.svg
@ -0,0 +1,3 @@
+<svg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='#fff' fill-rule='evenodd' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' viewBox='0 0 32 32'>
+    <path d='M12.217 30.503V20.414h7.567v10.089h10.089V15.37a1.26 1.26 0 0 0-.369-.892L16.892 1.867a1.26 1.26 0 0 0-1.784 0L2.497 14.478a1.26 1.26 0 0 0-.369.892v15.133h10.089z'/>
+</svg>
--- a/src/assets/svg/microphone-slash.svg
+++ b/src/assets/svg/microphone-slash.svg
@ -1,4 +1,4 @@
 <svg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='#fff' fill-rule='evenodd' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' viewBox='0 0 32 32'>
-    <path d="M16 25.125v5.368M5.265 4.728l21.471 23.618m-4.789-5.267c-1.698 1.326-3.793 2.047-5.947 2.047-5.3 0-9.662-4.362-9.662-9.662"/>
-    <path d="M25.662 15.463a9.62 9.62 0 0 1-.978 4.242m-5.64.187c-.895.616-1.957.943-3.043.939-2.945 0-5.368-2.423-5.368-5.368v-4.831m.442-5.896A5.38 5.38 0 0 1 16 1.507c2.945 0 5.368 2.423 5.368 5.368v8.588c0 .188-.01.375-.03.562"/>
+    <path d='M16 25.125v5.368M5.265 4.728l21.471 23.618m-4.789-5.267c-1.698 1.326-3.793 2.047-5.947 2.047-5.3 0-9.662-4.362-9.662-9.662'/>
+    <path d='M25.662 15.463a9.62 9.62 0 0 1-.978 4.242m-5.64.187c-.895.616-1.957.943-3.043.939-2.945 0-5.368-2.423-5.368-5.368v-4.831m.442-5.896A5.38 5.38 0 0 1 16 1.507c2.945 0 5.368 2.423 5.368 5.368v8.588c0 .188-.01.375-.03.562'/>
 </svg>
--- a/src/assets/svg/microphone.svg
+++ b/src/assets/svg/microphone.svg
@ -1,3 +1,3 @@
 <svg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='#fff' fill-rule='evenodd' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' viewBox='0 0 32 32'>
-    <path d="M21.368 6.875A5.37 5.37 0 0 0 16 1.507a5.37 5.37 0 0 0-5.368 5.368v8.588A5.37 5.37 0 0 0 16 20.831a5.37 5.37 0 0 0 5.368-5.368V6.875zM16 25.125v5.368m9.662-15.03c0 5.3-4.362 9.662-9.662 9.662s-9.662-4.362-9.662-9.662"/>
+    <path d='M21.368 6.875A5.37 5.37 0 0 0 16 1.507a5.37 5.37 0 0 0-5.368 5.368v8.588A5.37 5.37 0 0 0 16 20.831a5.37 5.37 0 0 0 5.368-5.368V6.875zM16 25.125v5.368m9.662-15.03c0 5.3-4.362 9.662-9.662 9.662s-9.662-4.362-9.662-9.662'/>
 </svg>
--- a/src/assets/svg/native-mkb.svg
+++ b/src/assets/svg/native-mkb.svg
@ -0,0 +1,10 @@
+<svg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='#fff' fill-rule='evenodd' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' viewBox='0 0 32 32'>
+    <g stroke-width="2.1">
+        <path d="m15.817 6h-10.604c-2.215 0-4.013 1.798-4.013 4.013v12.213c0 2.215 1.798 4.013 4.013 4.013h11.21"/>
+        <path d="m5.698 20.617h1.124m-1.124-4.517h7.9m-7.881-4.5h7.9m-2.3 9h2.2"/>
+    </g>
+    <g stroke-width="2.13">
+        <path d="m30.805 13.1c0-3.919-3.181-7.1-7.1-7.1s-7.1 3.181-7.1 7.1v6.4c0 3.919 3.182 7.1 7.1 7.1s7.1-3.181 7.1-7.1z"/>
+        <path d="m23.705 14.715v-4.753"/>
+    </g>
+</svg>
--- a/src/assets/svg/refresh.svg
+++ b/src/assets/svg/refresh.svg
@ -1,3 +1,3 @@
 <svg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='#fff' fill-rule='evenodd' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' viewBox='0 0 32 32'>
-    <path d="M23.247 12.377h7.247V5.13"/><path d="M23.911 25.663a13.29 13.29 0 0 1-9.119 3.623C7.504 29.286 1.506 23.289 1.506 16S7.504 2.713 14.792 2.713a13.29 13.29 0 0 1 9.395 3.891l6.307 5.772"/>
+    <path d='M23.247 12.377h7.247V5.13'/><path d='M23.911 25.663a13.29 13.29 0 0 1-9.119 3.623C7.504 29.286 1.506 23.289 1.506 16S7.504 2.713 14.792 2.713a13.29 13.29 0 0 1 9.395 3.891l6.307 5.772'/>
 </svg>
--- a/src/assets/svg/speaker-high.svg
+++ b/src/assets/svg/speaker-high.svg
@ -0,0 +1,4 @@
+<svg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='#fff' fill-rule='evenodd' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' viewBox='0 0 32 32'>
+    <path d='M8.964 21.417h-6.5a1.09 1.09 0 0 1-1.083-1.083v-8.667a1.09 1.09 0 0 1 1.083-1.083h6.5L18.714 3v26l-9.75-7.583z'/>
+    <path d='M8.964 10.583v10.833m15.167-8.28a4.35 4.35 0 0 1 0 5.728M28.149 9.5a9.79 9.79 0 0 1 0 13'/>
+</svg>
--- a/src/assets/svg/touch-control-disable.svg
+++ b/src/assets/svg/touch-control-disable.svg
@ -1,9 +1,9 @@
-<svg xmlns="http://www.w3.org/2000/svg" fill="#fff" viewBox="0 0 32 32" fill-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="2">
-    <g fill="none" stroke="#fff">
-        <path d="M6.021 5.021l20 22" stroke-width="2"/>
-        <path d="M8.735 8.559H2.909a.89.89 0 0 0-.889.889v13.146a.89.89 0 0 0 .889.888h19.34m4.289 0h2.594a.89.89 0 0 0 .889-.888V9.448a.89.89 0 0 0-.889-.889H12.971" stroke-miterlimit="1.5" stroke-width="2.083"/>
+<svg xmlns='http://www.w3.org/2000/svg' fill='#fff' viewBox='0 0 32 32' fill-rule='evenodd' stroke-linejoin='round' stroke-miterlimit='2'>
+    <g fill='none' stroke='#fff'>
+        <path d='M6.021 5.021l20 22' stroke-width='2'/>
+        <path d='M8.735 8.559H2.909a.89.89 0 0 0-.889.889v13.146a.89.89 0 0 0 .889.888h19.34m4.289 0h2.594a.89.89 0 0 0 .889-.888V9.448a.89.89 0 0 0-.889-.889H12.971' stroke-miterlimit='1.5' stroke-width='2.083'/>
    </g>
-    <path d="M8.147 11.981l-.053-.001-.054.001c-.55.028-.988.483-.988 1.04v6c0 .575.467 1.042 1.042 1.042l.053-.001c.55-.028.988-.484.988-1.04v-6a1.04 1.04 0 0 0-.988-1.04z"/>
-    <path d="M11.147 14.981l-.054-.001h-6a1.04 1.04 0 1 0 0 2.083h6c.575 0 1.042-.467 1.042-1.042a1.04 1.04 0 0 0-.988-1.04z"/>
-    <circle cx="25.345" cy="18.582" r="2.561" fill="none" stroke="#fff" stroke-width="1.78" transform="matrix(1.17131 0 0 1.17131 -5.74235 -5.74456)"/>
+    <path d='M8.147 11.981l-.053-.001-.054.001c-.55.028-.988.483-.988 1.04v6c0 .575.467 1.042 1.042 1.042l.053-.001c.55-.028.988-.484.988-1.04v-6a1.04 1.04 0 0 0-.988-1.04z'/>
+    <path d='M11.147 14.981l-.054-.001h-6a1.04 1.04 0 1 0 0 2.083h6c.575 0 1.042-.467 1.042-1.042a1.04 1.04 0 0 0-.988-1.04z'/>
+    <circle cx='25.345' cy='18.582' r='2.561' fill='none' stroke='#fff' stroke-width='1.78' transform='matrix(1.17131 0 0 1.17131 -5.74235 -5.74456)'/>
 </svg>
--- a/src/assets/svg/touch-control-enable.svg
+++ b/src/assets/svg/touch-control-enable.svg
@ -1,6 +1,6 @@
-<svg xmlns="http://www.w3.org/2000/svg" fill="#fff" viewBox="0 0 32 32" fill-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="2">
-    <path d="M30.021 9.448a.89.89 0 0 0-.889-.889H2.909a.89.89 0 0 0-.889.889v13.146a.89.89 0 0 0 .889.888h26.223a.89.89 0 0 0 .889-.888V9.448z" fill="none" stroke="#fff" stroke-width="2.083"/>
-    <path d="M8.147 11.981l-.053-.001-.054.001c-.55.028-.988.483-.988 1.04v6c0 .575.467 1.042 1.042 1.042l.053-.001c.55-.028.988-.484.988-1.04v-6a1.04 1.04 0 0 0-.988-1.04z"/>
-    <path d="M11.147 14.981l-.054-.001h-6a1.04 1.04 0 1 0 0 2.083h6c.575 0 1.042-.467 1.042-1.042a1.04 1.04 0 0 0-.988-1.04z"/>
-    <circle cx="25.345" cy="18.582" r="2.561" fill="none" stroke="#fff" stroke-width="1.78" transform="matrix(1.17131 0 0 1.17131 -5.74235 -5.74456)"/>
+<svg xmlns='http://www.w3.org/2000/svg' fill='#fff' viewBox='0 0 32 32' fill-rule='evenodd' stroke-linejoin='round' stroke-miterlimit='2'>
+    <path d='M30.021 9.448a.89.89 0 0 0-.889-.889H2.909a.89.89 0 0 0-.889.889v13.146a.89.89 0 0 0 .889.888h26.223a.89.89 0 0 0 .889-.888V9.448z' fill='none' stroke='#fff' stroke-width='2.083'/>
+    <path d='M8.147 11.981l-.053-.001-.054.001c-.55.028-.988.483-.988 1.04v6c0 .575.467 1.042 1.042 1.042l.053-.001c.55-.028.988-.484.988-1.04v-6a1.04 1.04 0 0 0-.988-1.04z'/>
+    <path d='M11.147 14.981l-.054-.001h-6a1.04 1.04 0 1 0 0 2.083h6c.575 0 1.042-.467 1.042-1.042a1.04 1.04 0 0 0-.988-1.04z'/>
+    <circle cx='25.345' cy='18.582' r='2.561' fill='none' stroke='#fff' stroke-width='1.78' transform='matrix(1.17131 0 0 1.17131 -5.74235 -5.74456)'/>
 </svg>
--- a/src/assets/svg/upload.svg
+++ b/src/assets/svg/upload.svg
@ -0,0 +1,4 @@
+<svg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='#fff' fill-rule='evenodd' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' viewBox='0 0 32 32'>
+    <path d='M16 19.905V1.682m14.318 18.223v9.112a1.31 1.31 0 0 1-1.302 1.302H2.983a1.31 1.31 0 0 1-1.302-1.302v-9.112'/>
+    <path d='M9.492 8.19L16 1.682l6.508 6.508'/>
+</svg>
--- a/src/assets/svg/virtual-controller.svg
+++ b/src/assets/svg/virtual-controller.svg
@ -0,0 +1,11 @@
+<svg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='#fff' fill-rule='evenodd' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' viewBox='0 0 32 32'>
+    <g stroke-width="2.06">
+        <path d="M8.417 13.218h4.124"/>
+        <path d="M10.479 11.155v4.125"/>
+        <path d="M12.787 19.404L7.36 25.565a3.61 3.61 0 0 1-2.551 1.056A3.63 3.63 0 0 1 1.2 23.013c0-.21.018-.42.055-.626l2.108-10.845C3.923 8.356 6.714 6.007 9.949 6h5.192"/>
+    </g>
+    <g stroke-width="2.11">
+        <path d="M30.8 13.1c0-3.919-3.181-7.1-7.1-7.1s-7.1 3.181-7.1 7.1v6.421c0 3.919 3.181 7.1 7.1 7.1s7.1-3.181 7.1-7.1V13.1z"/>
+        <path d="M23.7 14.724V9.966"/>
+    </g>
+</svg>
--- a/src/index.ts
+++ b/src/index.ts
@ -6,7 +6,7 @@ import { t } from "@utils/translation";
 import { interceptHttpRequests } from "@utils/network";
 import { CE } from "@utils/html";
 import { showGamepadToast } from "@utils/gamepad";
-import { MkbHandler } from "@modules/mkb/mkb-handler";
+import { EmulatedMkbHandler } from "@modules/mkb/mkb-handler";
 import { StreamBadges } from "@modules/stream/stream-badges";
 import { StreamStats } from "@modules/stream/stream-stats";
 import { addCss } from "@utils/css";
@ -23,12 +23,14 @@ import { RemotePlay } from "@modules/remote-play";
 import { onHistoryChanged, patchHistoryMethod } from "@utils/history";
 import { VibrationManager } from "@modules/vibration-manager";
 import { overridePreloadState } from "@utils/preload-state";
-import { patchAudioContext, patchCanvasContext, patchMeControl, patchRtcCodecs, patchRtcPeerConnection, patchVideoApi } from "@utils/monkey-patches";
+import { patchAudioContext, patchCanvasContext, patchMeControl, patchPointerLockApi, patchRtcCodecs, patchRtcPeerConnection, patchVideoApi } from "@utils/monkey-patches";
 import { AppInterface, STATES } from "@utils/global";
 import { injectStreamMenuButtons } from "@modules/stream/stream-ui";
 import { BxLogger } from "@utils/bx-logger";
 import { GameBar } from "./modules/game-bar/game-bar";
 import { Screenshot } from "./utils/screenshot";
+import { NativeMkbHandler } from "./modules/mkb/native-mkb-handler";
+import { GuideMenu, GuideMenuTab } from "./modules/ui/guide-menu";


 // Handle login page
@ -166,17 +168,19 @@ window.addEventListener(BxEvent.STREAM_ERROR_PAGE, e => {
    BxEvent.dispatch(window, BxEvent.STREAM_STOPPED);
 });

-window.addEventListener(BxEvent.STREAM_STOPPED, e => {
+function unload() {
    if (!STATES.isPlaying) {
        return;
    }

+    // Stop MKB listeners
+    EmulatedMkbHandler.getInstance().destroy();
+    NativeMkbHandler.getInstance().destroy();
+
    STATES.isPlaying = false;
    STATES.currentStream = {};
    window.BX_EXPOSED.shouldShowSensorControls = false;
-
-    // Stop MKB listeners
-    getPref(PrefKey.MKB_ENABLED) && MkbHandler.INSTANCE.destroy();
+    window.BX_EXPOSED.stopTakRendering = false;

    const $streamSettingsDialog = document.querySelector('.bx-stream-settings-dialog');
    if ($streamSettingsDialog) {
@ -185,11 +189,16 @@ window.addEventListener(BxEvent.STREAM_STOPPED, e => {

    STATES.currentStream.audioGainNode = null;
    STATES.currentStream.$video = null;
-    StreamStats.onStoppedPlaying();
+    StreamStats.getInstance().onStoppedPlaying();

    MouseCursorHider.stop();
    TouchController.reset();
    GameBar.getInstance().disable();
+}
+
+window.addEventListener(BxEvent.STREAM_STOPPED, unload);
+window.addEventListener('pagehide', e => {
+    BxEvent.dispatch(window, BxEvent.STREAM_STOPPED);
 });

 window.addEventListener(BxEvent.CAPTURE_SCREENSHOT, e => {
@ -206,6 +215,25 @@ function observeRootDialog($root: HTMLElement) {
                continue;
            }

+            if (mutation.addedNodes.length === 1) {
+                const $addedElm = mutation.addedNodes[0];
+                if ($addedElm instanceof HTMLElement && $addedElm.className) {
+                    if ($addedElm.className.startsWith('NavigationAnimation') || $addedElm.className.startsWith('DialogRoutes') || $addedElm.className.startsWith('Dialog-module__container')) {
+                        // Find navigation bar
+                        const $selectedTab = $addedElm.querySelector('div[class^=NavigationMenu] button[aria-selected=true');
+                        if ($selectedTab) {
+                            let $elm: Element | null = $selectedTab;
+                            let index;
+                            for (index = 0; ($elm = $elm?.previousElementSibling); index++);
+
+                            if (index === 0) {
+                                BxEvent.dispatch(window, BxEvent.XCLOUD_GUIDE_MENU_SHOWN, {where: GuideMenuTab.HOME});
+                            }
+                        }
+                    }
+                }
+            }
+
            const shown = ($root.firstElementChild && $root.firstElementChild.childElementCount > 0) || false;
            if (shown !== currentShown) {
                currentShown = shown;
@ -244,6 +272,7 @@ function main() {
    interceptHttpRequests();
    patchVideoApi();
    patchCanvasContext();
+    AppInterface && patchPointerLockApi();

    getPref(PrefKey.AUDIO_ENABLE_VOLUME_CONTROL) && patchAudioContext();
    getPref(PrefKey.BLOCK_TRACKING) && patchMeControl();
@ -262,9 +291,10 @@ function main() {
    (getPref(PrefKey.GAME_BAR_POSITION) !== 'off') && GameBar.getInstance();
    BX_FLAGS.PreloadUi && setupStreamUi();

+    GuideMenu.observe();
    StreamBadges.setupEvents();
    StreamStats.setupEvents();
-    MkbHandler.setupEvents();
+    EmulatedMkbHandler.setupEvents();

    Patcher.init();

@ -282,6 +312,9 @@ function main() {
    if (getPref(PrefKey.STREAM_TOUCH_CONTROLLER) === 'all') {
        TouchController.setup();
    }
+
+    // Start PointerProviderServer
+    (getPref(PrefKey.MKB_ENABLED)) && AppInterface && AppInterface.startPointerServer();
 }

 main();
--- a/src/modules/controller-shortcut.ts
+++ b/src/modules/controller-shortcut.ts
@ -3,7 +3,7 @@ import { GamepadKey } from "./mkb/definitions";
 import { PrompFont } from "@utils/prompt-font";
 import { CE } from "@utils/html";
 import { t } from "@utils/translation";
-import { MkbHandler } from "./mkb/mkb-handler";
+import { EmulatedMkbHandler } from "./mkb/mkb-handler";
 import { StreamStats } from "./stream/stream-stats";
 import { MicrophoneShortcut } from "./shortcuts/shortcut-microphone";
 import { StreamUiShortcut } from "./shortcuts/shortcut-stream-ui";
@ -87,7 +87,7 @@ export class ControllerShortcut {
                break;

            case ShortcutAction.STREAM_STATS_TOGGLE:
-                StreamStats.toggle();
+                StreamStats.getInstance().toggle();
                break;

            case ShortcutAction.STREAM_MICROPHONE_TOGGLE:
@ -172,7 +172,7 @@ export class ControllerShortcut {
            }

            // Ignore emulated gamepad
-            if (gamepad.id === MkbHandler.VIRTUAL_GAMEPAD_ID) {
+            if (gamepad.id === EmulatedMkbHandler.VIRTUAL_GAMEPAD_ID) {
                continue;
            }

--- a/src/modules/game-bar/game-bar.ts
+++ b/src/modules/game-bar/game-bar.ts
@ -82,6 +82,18 @@ export class GameBar {
        document.documentElement.appendChild($gameBar);
        this.$gameBar = $gameBar;
        this.$container = $container;
+
+        // Enable/disable Game Bar when playing/pausing
+        getPref(PrefKey.GAME_BAR_POSITION) !== 'off' && window.addEventListener(BxEvent.XCLOUD_POLLING_MODE_CHANGED, ((e: Event) => {
+            if (!STATES.isPlaying) {
+                this.disable();
+                return;
+            }
+
+            // Toggle Game bar
+            const mode = (e as any).mode;
+            mode !== 'None' ? this.disable() : this.enable();
+        }).bind(this));
    }

    private beginHideTimeout() {
--- a/src/modules/loading-screen.ts
+++ b/src/modules/loading-screen.ts
@ -46,6 +46,10 @@ export class LoadingScreen {
 #game-stream div[class*=RocketAnimation-module__container] > svg {
    display: none;
 }
+
+#game-stream video[class*=RocketAnimationVideo-module__video] {
+    display: none;
+}
 `;
        $bgStyle.textContent += css;
    }
@ -159,13 +163,13 @@ export class LoadingScreen {
 `;
        }

-        LoadingScreen.reset();
+        setTimeout(LoadingScreen.reset, 2000);
    }

    static reset() {
-        LoadingScreen.#$waitTimeBox && LoadingScreen.#$waitTimeBox.classList.add('bx-gone');
        LoadingScreen.#$bgStyle && (LoadingScreen.#$bgStyle.textContent = '');

+        LoadingScreen.#$waitTimeBox && LoadingScreen.#$waitTimeBox.classList.add('bx-gone');
        LoadingScreen.#waitTimeInterval && clearInterval(LoadingScreen.#waitTimeInterval);
        LoadingScreen.#waitTimeInterval = null;
    }
--- a/src/modules/mkb/base-mkb-handler.ts
+++ b/src/modules/mkb/base-mkb-handler.ts
@ -0,0 +1,23 @@
+export abstract class MouseDataProvider {
+    protected mkbHandler: MkbHandler;
+    constructor(handler: MkbHandler) {
+        this.mkbHandler = handler;
+    }
+
+    abstract init(): void;
+    abstract start(): void;
+    abstract stop(): void;
+    abstract destroy(): void;
+}
+
+export abstract class MkbHandler {
+    abstract init(): void;
+    abstract start(): void;
+    abstract stop(): void;
+    abstract destroy(): void;
+    abstract handleMouseMove(data: MkbMouseMove): void;
+    abstract handleMouseClick(data: MkbMouseClick): void;
+    abstract handleMouseWheel(data: MkbMouseWheel): boolean;
+    abstract waitForMouseData(enabled: boolean): void;
+    abstract isEnabled(): boolean;
+}
--- a/src/modules/mkb/definitions.ts
+++ b/src/modules/mkb/definitions.ts
@ -99,7 +99,4 @@ export enum MkbPresetKey {
    MOUSE_SENSITIVITY_Y = 'sensitivity_y',

    MOUSE_DEADZONE_COUNTERWEIGHT = 'deadzone_counterweight',
-
-    MOUSE_STICK_DECAY_STRENGTH = 'stick_decay_strength',
-    MOUSE_STICK_DECAY_MIN = 'stick_decay_min',
 }
--- a/src/modules/mkb/key-helper.ts
+++ b/src/modules/mkb/key-helper.ts
@ -20,7 +20,7 @@ export class KeyHelper {
        let name;

        if (e instanceof KeyboardEvent) {
-            code = e.code;
+            code = e.code || e.key;
        } else if (e instanceof WheelEvent) {
            if (e.deltaY < 0) {
                code = WheelCode.SCROLL_UP;
@ -28,7 +28,7 @@ export class KeyHelper {
                code = WheelCode.SCROLL_DOWN;
            } else if (e.deltaX < 0) {
                code = WheelCode.SCROLL_LEFT;
-            } else {
+            } else if (e.deltaX > 0) {
                code = WheelCode.SCROLL_RIGHT;
            }
        } else if (e instanceof MouseEvent) {
--- a/src/modules/mkb/mkb-handler.ts
+++ b/src/modules/mkb/mkb-handler.ts
@ -1,5 +1,5 @@
 import { MkbPreset } from "./mkb-preset";
-import { GamepadKey, MkbPresetKey, GamepadStick, MouseMapTo } from "./definitions";
+import { GamepadKey, MkbPresetKey, GamepadStick, MouseMapTo, WheelCode } from "./definitions";
 import { createButton, ButtonStyle, CE } from "@utils/html";
 import { BxEvent } from "@utils/bx-event";
 import { PrefKey, getPref } from "@utils/preferences";
@ -9,38 +9,135 @@ import { LocalDb } from "@utils/local-db";
 import { KeyHelper } from "./key-helper";
 import type { MkbStoredPreset } from "@/types/mkb";
 import { showStreamSettings } from "@modules/stream/stream-ui";
-import { STATES } from "@utils/global";
+import { AppInterface, STATES } from "@utils/global";
 import { UserAgent } from "@utils/user-agent";
 import { BxLogger } from "@utils/bx-logger";
-import { BxIcon } from "@utils/bx-icon";
+import { PointerClient } from "./pointer-client";
+import { NativeMkbHandler } from "./native-mkb-handler";
+import { MkbHandler, MouseDataProvider } from "./base-mkb-handler";

 const LOG_TAG = 'MkbHandler';

+const PointerToMouseButton = {
+    1: 0,
+    2: 2,
+    4: 1,
+}
+
+
+class WebSocketMouseDataProvider extends MouseDataProvider {
+    #pointerClient: PointerClient | undefined
+    #connected = false
+
+    init(): void {
+        this.#pointerClient = PointerClient.getInstance();
+        this.#connected = false;
+        try {
+            this.#pointerClient.start(this.mkbHandler);
+            this.#connected = true;
+        } catch (e) {
+            Toast.show('Cannot enable Mouse & Keyboard feature');
+        }
+    }
+
+    start(): void {
+        this.#connected && AppInterface.requestPointerCapture();
+    }
+
+    stop(): void {
+        this.#connected && AppInterface.releasePointerCapture();
+    }
+
+    destroy(): void {
+        this.#connected && this.#pointerClient?.stop();
+    }
+}
+
+class PointerLockMouseDataProvider extends MouseDataProvider {
+    init(): void {}
+
+    start(): void {
+        window.addEventListener('mousemove', this.#onMouseMoveEvent);
+        window.addEventListener('mousedown', this.#onMouseEvent);
+        window.addEventListener('mouseup', this.#onMouseEvent);
+        window.addEventListener('wheel', this.#onWheelEvent, {passive: false});
+        window.addEventListener('contextmenu', this.#disableContextMenu);
+    }
+
+    stop(): void {
+        document.pointerLockElement && document.exitPointerLock();
+
+        window.removeEventListener('mousemove', this.#onMouseMoveEvent);
+        window.removeEventListener('mousedown', this.#onMouseEvent);
+        window.removeEventListener('mouseup', this.#onMouseEvent);
+        window.removeEventListener('wheel', this.#onWheelEvent);
+        window.removeEventListener('contextmenu', this.#disableContextMenu);
+    }
+
+    destroy(): void {}
+
+    #onMouseMoveEvent = (e: MouseEvent) => {
+        this.mkbHandler.handleMouseMove({
+            movementX: e.movementX,
+            movementY: e.movementY,
+        });
+    }
+
+    #onMouseEvent = (e: MouseEvent) => {
+        e.preventDefault();
+
+        const isMouseDown = e.type === 'mousedown';
+        const data: MkbMouseClick = {
+            mouseButton: e.button,
+            pressed: isMouseDown,
+        };
+
+        this.mkbHandler.handleMouseClick(data);
+    }
+
+    #onWheelEvent = (e: WheelEvent) => {
+        const key = KeyHelper.getKeyFromEvent(e);
+        if (!key) {
+            return;
+        }
+
+        const data: MkbMouseWheel = {
+            vertical: e.deltaY,
+            horizontal: e.deltaX,
+        };
+
+        if (this.mkbHandler.handleMouseWheel(data)) {
+            e.preventDefault();
+        }
+    }
+
+    #disableContextMenu = (e: Event) => e.preventDefault();
+}
+
 /*
 This class uses some code from Yuzu emulator to handle mouse's movements
 Source: https://github.com/yuzu-emu/yuzu-mainline/blob/master/src/input_common/drivers/mouse.cpp
 */
-export class MkbHandler {
-    static #instance: MkbHandler;
-    static get INSTANCE() {
-        if (!MkbHandler.#instance) {
-            MkbHandler.#instance = new MkbHandler();
+export class EmulatedMkbHandler extends MkbHandler {
+    static #instance: EmulatedMkbHandler;
+    public static getInstance(): EmulatedMkbHandler {
+        if (!EmulatedMkbHandler.#instance) {
+            EmulatedMkbHandler.#instance = new EmulatedMkbHandler();
        }

-        return MkbHandler.#instance;
+        return EmulatedMkbHandler.#instance;
    }

    #CURRENT_PRESET_DATA = MkbPreset.convert(MkbPreset.DEFAULT_PRESET);

    static readonly DEFAULT_PANNING_SENSITIVITY = 0.0010;
-    static readonly DEFAULT_STICK_SENSITIVITY = 0.0006;
    static readonly DEFAULT_DEADZONE_COUNTERWEIGHT = 0.01;
    static readonly MAXIMUM_STICK_RANGE = 1.1;

    static VIRTUAL_GAMEPAD_ID = 'Xbox 360 Controller';

    #VIRTUAL_GAMEPAD = {
-            id: MkbHandler.VIRTUAL_GAMEPAD_ID,
+            id: EmulatedMkbHandler.VIRTUAL_GAMEPAD_ID,
            index: 3,
            connected: false,
            hapticActuators: null,
@ -55,16 +152,18 @@ export class MkbHandler {
    #nativeGetGamepads = window.navigator.getGamepads.bind(window.navigator);

    #enabled = false;
+    #mouseDataProvider: MouseDataProvider | undefined;
    #isPolling = false;

    #prevWheelCode = null;
    #wheelStoppedTimeout?: number | null;

    #detectMouseStoppedTimeout?: number | null;
-    #allowStickDecaying = false;

    #$message?: HTMLElement;

+    #escKeyDownTime: number = -1;
+
    #STICK_MAP: {[key in GamepadKey]?: [GamepadKey[], number, number]};
    #LEFT_STICK_X: GamepadKey[] = [];
    #LEFT_STICK_Y: GamepadKey[] = [];
@ -72,6 +171,8 @@ export class MkbHandler {
    #RIGHT_STICK_Y: GamepadKey[] = [];

    constructor() {
+        super();
+
        this.#STICK_MAP = {
            [GamepadKey.LS_LEFT]: [this.#LEFT_STICK_X, 0, -1],
            [GamepadKey.LS_RIGHT]: [this.#LEFT_STICK_X, 0, 1],
@ -85,6 +186,8 @@ export class MkbHandler {
        };
    }

+    isEnabled = () => this.#enabled;
+
    #patchedGetGamepads = () => {
        const gamepads = this.#nativeGetGamepads() || [];
        (gamepads as any)[this.#VIRTUAL_GAMEPAD.index] = this.#VIRTUAL_GAMEPAD;
@ -102,6 +205,7 @@ export class MkbHandler {
        virtualGamepad.timestamp = performance.now();
    }

+    /*
    #getStickAxes(stick: GamepadStick) {
        const virtualGamepad = this.#getVirtualGamepad();
        return {
@ -109,11 +213,10 @@ export class MkbHandler {
            y: virtualGamepad.axes[stick * 2 + 1],
        };
    }
+    */

    #vectorLength = (x: number, y: number): number => Math.sqrt(x ** 2 + y ** 2);

-    #disableContextMenu = (e: Event) => e.preventDefault();
-
    #resetGamepad = () => {
        const gamepad = this.#getVirtualGamepad();

@ -167,19 +270,37 @@ export class MkbHandler {
        const isKeyDown = e.type === 'keydown';

        // Toggle MKB feature
-        if (isKeyDown) {
-            if (e.code === 'F8') {
+        if (e.code === 'F8') {
+            if (!isKeyDown) {
                e.preventDefault();
                this.toggle();
-                return;
            }

-            if (!this.#isPolling) {
-                return;
-            }
+            return;
        }

-        const buttonIndex = this.#CURRENT_PRESET_DATA.mapping[e.code]!;
+        // Hijack the Esc button
+        if (e.code === 'Escape') {
+            e.preventDefault();
+
+            // Hold the Esc for 1 second to disable MKB
+            if (this.#enabled && isKeyDown) {
+                if (this.#escKeyDownTime === -1) {
+                    this.#escKeyDownTime = performance.now();
+                } else if (performance.now() - this.#escKeyDownTime >= 1000) {
+                    this.stop();
+                }
+            } else {
+                this.#escKeyDownTime = -1;
+            }
+            return;
+        }
+
+        if (!this.#isPolling) {
+            return;
+        }
+
+        const buttonIndex = this.#CURRENT_PRESET_DATA.mapping[e.code || e.key]!;
        if (typeof buttonIndex === 'undefined') {
            return;
        }
@ -193,25 +314,30 @@ export class MkbHandler {
        this.#pressButton(buttonIndex, isKeyDown);
    }

-    #onMouseEvent = (e: MouseEvent) => {
-        const isMouseDown = e.type === 'mousedown';
-        const key = KeyHelper.getKeyFromEvent(e);
-        if (!key) {
-            return;
-        }
+    #onMouseStopped = () => {
+        // Reset stick position
+        this.#detectMouseStoppedTimeout = null;

-        const buttonIndex = this.#CURRENT_PRESET_DATA.mapping[key.code]!;
-        if (typeof buttonIndex === 'undefined') {
-            return;
-        }
-
-        e.preventDefault();
-        this.#pressButton(buttonIndex, isMouseDown);
+        const mouseMapTo = this.#CURRENT_PRESET_DATA.mouse[MkbPresetKey.MOUSE_MAP_TO];
+        const analog = mouseMapTo === MouseMapTo.LS ? GamepadStick.LEFT : GamepadStick.RIGHT;
+        this.#updateStick(analog, 0, 0);
    }

-    #onWheelEvent = (e: WheelEvent) => {
-        const key = KeyHelper.getKeyFromEvent(e);
-        if (!key) {
+    handleMouseClick = (data: MkbMouseClick) => {
+        let mouseButton;
+        if (typeof data.mouseButton !== 'undefined') {
+            mouseButton = data.mouseButton;
+        } else if (typeof data.pointerButton !== 'undefined') {
+            mouseButton = PointerToMouseButton[data.pointerButton as keyof typeof PointerToMouseButton];
+        }
+
+        const keyCode = 'Mouse' + mouseButton;
+        const key = {
+            code: keyCode,
+            name: KeyHelper.codeToKeyName(keyCode),
+        };
+
+        if (!key.name) {
            return;
        }

@ -220,7 +346,63 @@ export class MkbHandler {
            return;
        }

-        e.preventDefault();
+        this.#pressButton(buttonIndex, data.pressed);
+    }
+
+    handleMouseMove = (data: MkbMouseMove) => {
+        // TODO: optimize this
+        const mouseMapTo = this.#CURRENT_PRESET_DATA.mouse[MkbPresetKey.MOUSE_MAP_TO];
+        if (mouseMapTo === MouseMapTo.OFF) {
+            // Ignore mouse movements
+            return;
+        }
+
+        this.#detectMouseStoppedTimeout && clearTimeout(this.#detectMouseStoppedTimeout);
+        this.#detectMouseStoppedTimeout = window.setTimeout(this.#onMouseStopped.bind(this), 50);
+
+        const deadzoneCounterweight = this.#CURRENT_PRESET_DATA.mouse[MkbPresetKey.MOUSE_DEADZONE_COUNTERWEIGHT];
+
+        let x = data.movementX * this.#CURRENT_PRESET_DATA.mouse[MkbPresetKey.MOUSE_SENSITIVITY_X];
+        let y = data.movementY * this.#CURRENT_PRESET_DATA.mouse[MkbPresetKey.MOUSE_SENSITIVITY_Y];
+
+        let length = this.#vectorLength(x, y);
+        if (length !== 0 && length < deadzoneCounterweight) {
+            x *= deadzoneCounterweight / length;
+            y *= deadzoneCounterweight / length;
+        } else if (length > EmulatedMkbHandler.MAXIMUM_STICK_RANGE) {
+            x *= EmulatedMkbHandler.MAXIMUM_STICK_RANGE / length;
+            y *= EmulatedMkbHandler.MAXIMUM_STICK_RANGE / length;
+        }
+
+        const analog = mouseMapTo === MouseMapTo.LS ? GamepadStick.LEFT : GamepadStick.RIGHT;
+        this.#updateStick(analog, x, y);
+    }
+
+    handleMouseWheel = (data: MkbMouseWheel): boolean => {
+        let code = '';
+        if (data.vertical < 0) {
+            code = WheelCode.SCROLL_UP;
+        } else if (data.vertical > 0) {
+            code = WheelCode.SCROLL_DOWN;
+        } else if (data.horizontal < 0) {
+            code = WheelCode.SCROLL_LEFT;
+        } else if (data.horizontal > 0) {
+            code = WheelCode.SCROLL_RIGHT;
+        }
+
+        if (!code) {
+            return false;
+        }
+
+        const key = {
+            code: code,
+            name: KeyHelper.codeToKeyName(code),
+        };
+
+        const buttonIndex = this.#CURRENT_PRESET_DATA.mapping[key.code]!;
+        if (typeof buttonIndex === 'undefined') {
+            return false;
+        }

        if (this.#prevWheelCode === null || this.#prevWheelCode === key.code) {
            this.#wheelStoppedTimeout && clearTimeout(this.#wheelStoppedTimeout);
@ -231,93 +413,20 @@ export class MkbHandler {
            this.#prevWheelCode = null;
            this.#pressButton(buttonIndex, false);
        }, 20);
+
+        return true;
    }

-    #decayStick = () => {
-        if (!this.#allowStickDecaying) {
-            return;
+    toggle = (force?: boolean) => {
+        if (typeof force !== 'undefined') {
+            this.#enabled = force;
+        } else {
+            this.#enabled = !this.#enabled;
        }

-        const mouseMapTo = this.#CURRENT_PRESET_DATA.mouse[MkbPresetKey.MOUSE_MAP_TO];
-        if (mouseMapTo === MouseMapTo.OFF) {
-            return;
-        }
-
-        const analog = mouseMapTo === MouseMapTo.LS ? GamepadStick.LEFT : GamepadStick.RIGHT;
-
-        let { x, y } = this.#getStickAxes(analog);
-        const length = this.#vectorLength(x, y);
-
-        const clampedLength = Math.min(1.0, length);
-        const decayStrength = this.#CURRENT_PRESET_DATA.mouse[MkbPresetKey.MOUSE_STICK_DECAY_STRENGTH];
-        const decay = 1 - clampedLength * clampedLength * decayStrength;
-        const minDecay = this.#CURRENT_PRESET_DATA.mouse[MkbPresetKey.MOUSE_STICK_DECAY_MIN];
-        const clampedDecay = Math.min(1 - minDecay, decay);
-
-        x *= clampedDecay;
-        y *= clampedDecay;
-
-        const deadzoneCounterweight = 20 * MkbHandler.DEFAULT_DEADZONE_COUNTERWEIGHT;
-        if (Math.abs(x) <= deadzoneCounterweight && Math.abs(y) <= deadzoneCounterweight) {
-            x = 0;
-            y = 0;
-        }
-
-        if (this.#allowStickDecaying) {
-            this.#updateStick(analog, x, y);
-
-            (x !== 0 || y !== 0) && requestAnimationFrame(this.#decayStick);
-        }
-    }
-
-    #onMouseStopped = () => {
-        this.#allowStickDecaying = true;
-        requestAnimationFrame(this.#decayStick);
-    }
-
-    #onMouseMoveEvent = (e: MouseEvent) => {
-        // TODO: optimize this
-        const mouseMapTo = this.#CURRENT_PRESET_DATA.mouse[MkbPresetKey.MOUSE_MAP_TO];
-        if (mouseMapTo === MouseMapTo.OFF) {
-            // Ignore mouse movements
-            return;
-        }
-
-        this.#allowStickDecaying = false;
-        this.#detectMouseStoppedTimeout && clearTimeout(this.#detectMouseStoppedTimeout);
-        this.#detectMouseStoppedTimeout = window.setTimeout(this.#onMouseStopped.bind(this), 10);
-
-        const deltaX = e.movementX;
-        const deltaY = e.movementY;
-
-        const deadzoneCounterweight = this.#CURRENT_PRESET_DATA.mouse[MkbPresetKey.MOUSE_DEADZONE_COUNTERWEIGHT];
-
-        let x = deltaX * this.#CURRENT_PRESET_DATA.mouse[MkbPresetKey.MOUSE_SENSITIVITY_X];
-        let y = deltaY * this.#CURRENT_PRESET_DATA.mouse[MkbPresetKey.MOUSE_SENSITIVITY_Y];
-
-        let length = this.#vectorLength(x, y);
-        if (length !== 0 && length < deadzoneCounterweight) {
-            x *= deadzoneCounterweight / length;
-            y *= deadzoneCounterweight / length;
-        } else if (length > MkbHandler.MAXIMUM_STICK_RANGE) {
-            x *= MkbHandler.MAXIMUM_STICK_RANGE / length;
-            y *= MkbHandler.MAXIMUM_STICK_RANGE / length;
-        }
-
-        const analog = mouseMapTo === MouseMapTo.LS ? GamepadStick.LEFT : GamepadStick.RIGHT;
-        this.#updateStick(analog, x, y);
-    }
-
-    toggle = () => {
-        this.#enabled = !this.#enabled;
-        this.#enabled ? document.pointerLockElement && this.start() : this.stop();
-
-        Toast.show(t('mouse-and-keyboard'), t(this.#enabled ? 'enabled' : 'disabled'), {instant: true});
-
        if (this.#enabled) {
-            !document.pointerLockElement && this.#waitForPointerLock(true);
+            document.body.requestPointerLock();
        } else {
-            this.#waitForPointerLock(false);
            document.pointerLockElement && document.exitPointerLock();
        }
    }
@ -338,10 +447,84 @@ export class MkbHandler {
        });
    }

+    waitForMouseData = (wait: boolean) => {
+        this.#$message && this.#$message.classList.toggle('bx-gone', !wait);
+    }
+
+    #onPollingModeChanged = (e: Event) => {
+        if (!this.#$message) {
+            return;
+        }
+
+        const mode = (e as any).mode;
+        if (mode === 'None') {
+            this.#$message.classList.remove('bx-offscreen');
+        } else {
+            this.#$message.classList.add('bx-offscreen');
+        }
+    }
+
+    #onDialogShown = () => {
+        document.pointerLockElement && document.exitPointerLock();
+    }
+
+    #initMessage = () => {
+        if (!this.#$message) {
+            this.#$message = CE('div', {'class': 'bx-mkb-pointer-lock-msg bx-gone'},
+                CE('div', {},
+                    CE('p', {}, t('virtual-controller')),
+                    CE('p', {}, t('press-key-to-toggle-mkb', {key: 'F8'})),
+                ),
+
+                CE('div', {'data-type': 'virtual'},
+                    createButton({
+                        style: ButtonStyle.PRIMARY | ButtonStyle.TALL | ButtonStyle.FULL_WIDTH,
+                        label: t('activate'),
+                        onClick: ((e: Event) => {
+                            e.preventDefault();
+                            e.stopPropagation();
+
+                            this.toggle(true);
+                        }).bind(this),
+                    }),
+
+                    CE('div', {},
+                        createButton({
+                            label: t('ignore'),
+                            style: ButtonStyle.GHOST,
+                            onClick: e => {
+                                e.preventDefault();
+                                e.stopPropagation();
+
+                                this.toggle(false);
+                                this.waitForMouseData(false);
+                            },
+                        }),
+
+                        createButton({
+                            label: t('edit'),
+                            onClick: e => {
+                                e.preventDefault();
+                                e.stopPropagation();
+
+                                showStreamSettings('mkb');
+                            },
+                        }),
+                    ),
+                ),
+            );
+        }
+
+        if (!this.#$message.isConnected) {
+            document.documentElement.appendChild(this.#$message);
+        }
+    }
+
    #onPointerLockChange = () => {
-        if (this.#enabled && !document.pointerLockElement) {
+        if (document.pointerLockElement) {
+            this.start();
+        } else {
            this.stop();
-            this.#waitForPointerLock(true);
        }
    }

@ -350,60 +533,60 @@ export class MkbHandler {
        this.stop();
    }

-    #onActivatePointerLock = () => {
-        if (!document.pointerLockElement) {
-            document.body.requestPointerLock();
-        }
-
-        this.#waitForPointerLock(false);
+    #onPointerLockRequested = () => {
        this.start();
    }

-    #waitForPointerLock = (wait: boolean) => {
-        this.#$message && this.#$message.classList.toggle('bx-gone', !wait);
+    #onPointerLockExited = () => {
+        this.#mouseDataProvider?.stop();
    }

-    #onStreamMenuShown = () => {
-        this.#enabled && this.#waitForPointerLock(false);
-    }
-
-    #onStreamMenuHidden = () => {
-        this.#enabled && this.#waitForPointerLock(true);
+    handleEvent(event: Event) {
+        switch (event.type) {
+            case BxEvent.POINTER_LOCK_REQUESTED:
+                this.#onPointerLockRequested();
+                break;
+            case BxEvent.POINTER_LOCK_EXITED:
+                this.#onPointerLockExited();
+                break;
+        }
    }

    init = () => {
        this.refreshPresetData();
-        this.#enabled = true;
+        this.#enabled = false;
+
+        if (AppInterface) {
+            this.#mouseDataProvider = new WebSocketMouseDataProvider(this);
+        } else {
+            this.#mouseDataProvider = new PointerLockMouseDataProvider(this);
+        }
+        this.#mouseDataProvider.init();

        window.addEventListener('keydown', this.#onKeyboardEvent);
+        window.addEventListener('keyup', this.#onKeyboardEvent);

-        document.addEventListener('pointerlockchange', this.#onPointerLockChange);
-        document.addEventListener('pointerlockerror', this.#onPointerLockError);
+        window.addEventListener(BxEvent.XCLOUD_POLLING_MODE_CHANGED, this.#onPollingModeChanged);
+        window.addEventListener(BxEvent.XCLOUD_DIALOG_SHOWN, this.#onDialogShown);

-        this.#$message = CE('div', {'class': 'bx-mkb-pointer-lock-msg bx-gone'},
-                createButton({
-                    icon: BxIcon.MOUSE_SETTINGS,
-                    style: ButtonStyle.PRIMARY,
-                    onClick: e => {
-                        e.preventDefault();
-                        e.stopPropagation();
+        if (AppInterface) {
+            // Android app doesn't support PointerLock API so we need to use a different method
+            window.addEventListener(BxEvent.POINTER_LOCK_REQUESTED, this);
+            window.addEventListener(BxEvent.POINTER_LOCK_EXITED, this);
+        } else {
+            document.addEventListener('pointerlockchange', this.#onPointerLockChange);
+            document.addEventListener('pointerlockerror', this.#onPointerLockError);
+        }

-                        showStreamSettings('mkb');
-                    },
-                }),
-                CE('div', {},
-                    CE('p', {}, t('mkb-click-to-activate')),
-                    CE('p', {}, t('press-key-to-toggle-mkb', {key: 'F8'})),
-                ),
-            );
+        this.#initMessage();
+        this.#$message?.classList.add('bx-gone');

-        this.#$message.addEventListener('click', this.#onActivatePointerLock);
-        document.documentElement.appendChild(this.#$message);
-
-        window.addEventListener(BxEvent.STREAM_MENU_SHOWN, this.#onStreamMenuShown);
-        window.addEventListener(BxEvent.STREAM_MENU_HIDDEN, this.#onStreamMenuHidden);
-
-        this.#waitForPointerLock(true);
+        if (AppInterface) {
+            Toast.show(t('press-key-to-toggle-mkb', {key: `<b>F8</b>`}), t('virtual-controller'), {html: true});
+            this.waitForMouseData(false);
+        } else {
+            this.waitForMouseData(true);
+        }
    }

    destroy = () => {
@ -411,31 +594,43 @@ export class MkbHandler {
        this.#enabled = false;
        this.stop();

-        this.#waitForPointerLock(false);
+        this.waitForMouseData(false);
        document.pointerLockElement && document.exitPointerLock();

        window.removeEventListener('keydown', this.#onKeyboardEvent);
+        window.removeEventListener('keyup', this.#onKeyboardEvent);

-        document.removeEventListener('pointerlockchange', this.#onPointerLockChange);
-        document.removeEventListener('pointerlockerror', this.#onPointerLockError);
+        if (AppInterface) {
+            window.removeEventListener(BxEvent.POINTER_LOCK_REQUESTED, this);
+            window.removeEventListener(BxEvent.POINTER_LOCK_EXITED, this);
+        } else {
+            document.removeEventListener('pointerlockchange', this.#onPointerLockChange);
+            document.removeEventListener('pointerlockerror', this.#onPointerLockError);
+        }

-        window.removeEventListener(BxEvent.STREAM_MENU_SHOWN, this.#onStreamMenuShown);
-        window.removeEventListener(BxEvent.STREAM_MENU_HIDDEN, this.#onStreamMenuHidden);
+        window.removeEventListener(BxEvent.XCLOUD_POLLING_MODE_CHANGED, this.#onPollingModeChanged);
+        window.removeEventListener(BxEvent.XCLOUD_DIALOG_SHOWN, this.#onDialogShown);
+
+        this.#mouseDataProvider?.destroy();
+
+        window.removeEventListener(BxEvent.XCLOUD_POLLING_MODE_CHANGED, this.#onPollingModeChanged);
    }

    start = () => {
+        if (!this.#enabled) {
+            this.#enabled = true;
+            Toast.show(t('virtual-controller'), t('enabled'), {instant: true});
+        }
+
        this.#isPolling = true;
-        window.navigator.getGamepads = this.#patchedGetGamepads;
+        this.#escKeyDownTime = -1;

        this.#resetGamepad();
+        window.navigator.getGamepads = this.#patchedGetGamepads;

-        window.addEventListener('keyup', this.#onKeyboardEvent);
+        this.waitForMouseData(false);

-        window.addEventListener('mousemove', this.#onMouseMoveEvent);
-        window.addEventListener('mousedown', this.#onMouseEvent);
-        window.addEventListener('mouseup', this.#onMouseEvent);
-        window.addEventListener('wheel', this.#onWheelEvent);
-        window.addEventListener('contextmenu', this.#disableContextMenu);
+        this.#mouseDataProvider?.start();

        // Dispatch "gamepadconnected" event
        const virtualGamepad = this.#getVirtualGamepad();
@ -445,39 +640,48 @@ export class MkbHandler {
        BxEvent.dispatch(window, 'gamepadconnected', {
                gamepad: virtualGamepad,
            });
+
+        window.BX_EXPOSED.stopTakRendering = true;
+
+        Toast.show(t('virtual-controller'), t('enabled'), {instant: true});
    }

    stop = () => {
+        this.#enabled = false;
        this.#isPolling = false;
+        this.#escKeyDownTime = -1;

-        // Dispatch "gamepaddisconnected" event
        const virtualGamepad = this.#getVirtualGamepad();
-        virtualGamepad.connected = false;
-        virtualGamepad.timestamp = performance.now();
+        if (virtualGamepad.connected) {
+            // Dispatch "gamepaddisconnected" event
+            this.#resetGamepad();

-        BxEvent.dispatch(window, 'gamepaddisconnected', {
-                gamepad: virtualGamepad,
-            });
+            virtualGamepad.connected = false;
+            virtualGamepad.timestamp = performance.now();

-        window.navigator.getGamepads = this.#nativeGetGamepads;
+            BxEvent.dispatch(window, 'gamepaddisconnected', {
+                    gamepad: virtualGamepad,
+                });

-        this.#resetGamepad();
+            window.navigator.getGamepads = this.#nativeGetGamepads;
+        }

-        window.removeEventListener('keyup', this.#onKeyboardEvent);
+        this.waitForMouseData(true);
+        this.#mouseDataProvider?.stop();

-        window.removeEventListener('mousemove', this.#onMouseMoveEvent);
-        window.removeEventListener('mousedown', this.#onMouseEvent);
-        window.removeEventListener('mouseup', this.#onMouseEvent);
-        window.removeEventListener('wheel', this.#onWheelEvent);
-        window.removeEventListener('contextmenu', this.#disableContextMenu);
+        // Toast.show(t('virtual-controller'), t('disabled'), {instant: true});
    }

    static setupEvents() {
-        getPref(PrefKey.MKB_ENABLED) && !UserAgent.isMobile() && window.addEventListener(BxEvent.STREAM_PLAYING, () => {
-            // Enable MKB
-            if (!STATES.currentStream.titleInfo?.details.hasMkbSupport) {
-                BxLogger.info(LOG_TAG, 'Emulate MKB');
-                MkbHandler.INSTANCE.init();
+        window.addEventListener(BxEvent.STREAM_PLAYING, () => {
+            if (STATES.currentStream.titleInfo?.details.hasMkbSupport) {
+                // Enable native MKB in Android app
+                if (AppInterface && getPref(PrefKey.NATIVE_MKB_ENABLED) === 'on') {
+                    AppInterface && NativeMkbHandler.getInstance().init();
+                }
+            } else if (getPref(PrefKey.MKB_ENABLED) && (AppInterface || !UserAgent.isMobile())) {
+                    BxLogger.info(LOG_TAG, 'Emulate MKB');
+                    EmulatedMkbHandler.getInstance().init();
            }
        });
    }
--- a/src/modules/mkb/mkb-preset.ts
+++ b/src/modules/mkb/mkb-preset.ts
@ -1,7 +1,7 @@
 import { t } from "@utils/translation";
 import { SettingElementType } from "@utils/settings";
 import { GamepadKey, MouseButtonCode, MouseMapTo, MkbPresetKey } from "./definitions";
-import { MkbHandler } from "./mkb-handler";
+import { EmulatedMkbHandler } from "./mkb-handler";
 import type { MkbPresetData, MkbConvertedPresetData } from "@/types/mkb";
 import type { PreferenceSettings } from "@/types/preferences";

@ -24,11 +24,11 @@ export class MkbPreset {
            type: SettingElementType.NUMBER_STEPPER,
            default: 50,
            min: 1,
-            max: 200,
+            max: 300,

            params: {
                suffix: '%',
-                exactTicks: 20,
+                exactTicks: 50,
            },
        },

@ -37,11 +37,11 @@ export class MkbPreset {
            type: SettingElementType.NUMBER_STEPPER,
            default: 50,
            min: 1,
-            max: 200,
+            max: 300,

            params: {
                suffix: '%',
-                exactTicks: 20,
+                exactTicks: 50,
            },
        },

@ -50,38 +50,13 @@ export class MkbPreset {
            type: SettingElementType.NUMBER_STEPPER,
            default: 20,
            min: 1,
-            max: 100,
+            max: 50,

            params: {
                suffix: '%',
                exactTicks: 10,
            },
        },
-
-        [MkbPresetKey.MOUSE_STICK_DECAY_STRENGTH]: {
-            label: t('stick-decay-strength'),
-            type: SettingElementType.NUMBER_STEPPER,
-            default: 100,
-            min: 10,
-            max: 100,
-
-            params: {
-                suffix: '%',
-                exactTicks: 10,
-            },
-        },
-
-        [MkbPresetKey.MOUSE_STICK_DECAY_MIN]: {
-            label: t('stick-decay-minimum'),
-            type: SettingElementType.NUMBER_STEPPER,
-            default: 10,
-            min: 1,
-            max: 10,
-
-            params: {
-                suffix: '%',
-            },
-        },
    };

    static DEFAULT_PRESET: MkbPresetData = {
@ -124,11 +99,9 @@ export class MkbPreset {

        'mouse': {
            [MkbPresetKey.MOUSE_MAP_TO]: MouseMapTo[MouseMapTo.RS],
-            [MkbPresetKey.MOUSE_SENSITIVITY_X]: 50,
-            [MkbPresetKey.MOUSE_SENSITIVITY_Y]: 50,
+            [MkbPresetKey.MOUSE_SENSITIVITY_X]: 100,
+            [MkbPresetKey.MOUSE_SENSITIVITY_Y]: 100,
            [MkbPresetKey.MOUSE_DEADZONE_COUNTERWEIGHT]: 20,
-            [MkbPresetKey.MOUSE_STICK_DECAY_STRENGTH]: 100,
-            [MkbPresetKey.MOUSE_STICK_DECAY_MIN]: 10,
        },
    };

@ -146,11 +119,9 @@ export class MkbPreset {

        // Pre-calculate mouse's sensitivities
        const mouse = obj.mouse;
-        mouse[MkbPresetKey.MOUSE_SENSITIVITY_X] *= MkbHandler.DEFAULT_PANNING_SENSITIVITY;
-        mouse[MkbPresetKey.MOUSE_SENSITIVITY_Y] *= MkbHandler.DEFAULT_PANNING_SENSITIVITY;
-        mouse[MkbPresetKey.MOUSE_DEADZONE_COUNTERWEIGHT] *= MkbHandler.DEFAULT_DEADZONE_COUNTERWEIGHT;
-        mouse[MkbPresetKey.MOUSE_STICK_DECAY_STRENGTH] *= 0.01;
-        mouse[MkbPresetKey.MOUSE_STICK_DECAY_MIN] *= 0.01;
+        mouse[MkbPresetKey.MOUSE_SENSITIVITY_X] *= EmulatedMkbHandler.DEFAULT_PANNING_SENSITIVITY;
+        mouse[MkbPresetKey.MOUSE_SENSITIVITY_Y] *= EmulatedMkbHandler.DEFAULT_PANNING_SENSITIVITY;
+        mouse[MkbPresetKey.MOUSE_DEADZONE_COUNTERWEIGHT] *= EmulatedMkbHandler.DEFAULT_DEADZONE_COUNTERWEIGHT;

        const mouseMapTo = MouseMapTo[mouse[MkbPresetKey.MOUSE_MAP_TO]!];
        if (typeof mouseMapTo !== 'undefined') {
--- a/src/modules/mkb/mkb-remapper.ts
+++ b/src/modules/mkb/mkb-remapper.ts
@ -6,7 +6,7 @@ import { getPref, setPref, PrefKey } from "@utils/preferences";
 import { MkbPresetKey, GamepadKeyName } from "./definitions";
 import { KeyHelper } from "./key-helper";
 import { MkbPreset } from "./mkb-preset";
-import { MkbHandler } from "./mkb-handler";
+import { EmulatedMkbHandler } from "./mkb-handler";
 import { LocalDb } from "@utils/local-db";
 import { BxIcon } from "@utils/bx-icon";
 import { SettingElement } from "@utils/settings";
@ -258,7 +258,7 @@ export class MkbRemapper {

                defaultPresetId = this.#STATE.currentPresetId;
                setPref(PrefKey.MKB_DEFAULT_PRESET_ID, defaultPresetId);
-                MkbHandler.INSTANCE.refreshPresetData();
+                EmulatedMkbHandler.getInstance().refreshPresetData();
            } else {
                defaultPresetId = getPref(PrefKey.MKB_DEFAULT_PRESET_ID);
            }
@ -487,7 +487,7 @@ export class MkbRemapper {
                           style: ButtonStyle.PRIMARY,
                           onClick: e => {
                               setPref(PrefKey.MKB_DEFAULT_PRESET_ID, this.#STATE.currentPresetId);
-                               MkbHandler.INSTANCE.refreshPresetData();
+                               EmulatedMkbHandler.getInstance().refreshPresetData();

                               this.#refresh();
                           },
@ -517,7 +517,7 @@ export class MkbRemapper {
                               LocalDb.INSTANCE.updatePreset(updatedPreset).then(id => {
                                   // If this is the default preset => refresh preset data
                                   if (id === getPref(PrefKey.MKB_DEFAULT_PRESET_ID)) {
-                                       MkbHandler.INSTANCE.refreshPresetData();
+                                       EmulatedMkbHandler.getInstance().refreshPresetData();
                                   }

                                   this.#toggleEditing(false);
--- a/src/modules/mkb/native-mkb-handler.ts
+++ b/src/modules/mkb/native-mkb-handler.ts
@ -0,0 +1,319 @@
+import { Toast } from "@/utils/toast";
+import { PointerClient } from "./pointer-client";
+import { AppInterface } from "@/utils/global";
+import { MkbHandler } from "./base-mkb-handler";
+import { t } from "@/utils/translation";
+import { BxEvent } from "@/utils/bx-event";
+import { ButtonStyle, CE, createButton } from "@/utils/html";
+import { PrefKey, getPref } from "@/utils/preferences";
+
+type NativeMouseData = {
+    X: number,
+    Y: number,
+    Buttons: number,
+    WheelX: number,
+    WheelY: number,
+    Type? : 0,  // 0: Relative, 1: Absolute
+}
+
+type XcloudInputSink = {
+    onMouseInput: (data: NativeMouseData) => void;
+}
+
+export class NativeMkbHandler extends MkbHandler {
+    private static instance: NativeMkbHandler;
+    #pointerClient: PointerClient | undefined;
+    #enabled: boolean = false;
+
+    #mouseButtonsPressed = 0;
+    #mouseWheelX = 0;
+    #mouseWheelY = 0;
+
+    #mouseVerticalMultiply = 0;
+    #mouseHorizontalMultiply = 0;
+
+    #inputSink: XcloudInputSink | undefined;
+
+    #$message?: HTMLElement;
+
+    public static getInstance(): NativeMkbHandler {
+        if (!NativeMkbHandler.instance) {
+            NativeMkbHandler.instance = new NativeMkbHandler();
+        }
+
+        return NativeMkbHandler.instance;
+    }
+
+    #onKeyboardEvent(e: KeyboardEvent) {
+        if (e.type === 'keyup' && e.code === 'F8') {
+            e.preventDefault();
+            this.toggle();
+            return;
+        }
+    }
+
+    #onPointerLockRequested(e: Event) {
+        AppInterface.requestPointerCapture();
+        this.start();
+    }
+
+    #onPointerLockExited(e: Event) {
+        AppInterface.releasePointerCapture();
+        this.stop();
+    }
+
+    #onPollingModeChanged = (e: Event) => {
+        if (!this.#$message) {
+            return;
+        }
+
+        const mode = (e as any).mode;
+        if (mode === 'None') {
+            this.#$message.classList.remove('bx-offscreen');
+        } else {
+            this.#$message.classList.add('bx-offscreen');
+        }
+    }
+
+    #onDialogShown = () => {
+        document.pointerLockElement && document.exitPointerLock();
+    }
+
+    #initMessage() {
+        if (!this.#$message) {
+            this.#$message = CE('div', {'class': 'bx-mkb-pointer-lock-msg'},
+                CE('div', {},
+                    CE('p', {}, t('native-mkb')),
+                    CE('p', {}, t('press-key-to-toggle-mkb', {key: 'F8'})),
+                ),
+
+                CE('div', {'data-type': 'native'},
+                    createButton({
+                        style: ButtonStyle.PRIMARY | ButtonStyle.FULL_WIDTH | ButtonStyle.TALL,
+                        label: t('activate'),
+                        onClick: ((e: Event) => {
+                            e.preventDefault();
+                            e.stopPropagation();
+
+                            this.toggle(true);
+                        }).bind(this),
+                    }),
+
+                    createButton({
+                        style: ButtonStyle.GHOST | ButtonStyle.FULL_WIDTH,
+                        label: t('ignore'),
+                        onClick: e => {
+                            e.preventDefault();
+                            e.stopPropagation();
+
+                            this.#$message?.classList.add('bx-gone');
+                        },
+                    }),
+                ),
+            );
+        }
+
+        if (!this.#$message.isConnected) {
+            document.documentElement.appendChild(this.#$message);
+        }
+    }
+
+    handleEvent(event: Event) {
+        switch (event.type) {
+            case 'keyup':
+                this.#onKeyboardEvent(event as KeyboardEvent);
+                break;
+
+            case BxEvent.XCLOUD_DIALOG_SHOWN:
+                this.#onDialogShown();
+                break;
+
+            case BxEvent.POINTER_LOCK_REQUESTED:
+                this.#onPointerLockRequested(event);
+                break;
+            case BxEvent.POINTER_LOCK_EXITED:
+                this.#onPointerLockExited(event);
+                break;
+
+            case BxEvent.XCLOUD_POLLING_MODE_CHANGED:
+                this.#onPollingModeChanged(event);
+                break;
+        }
+    }
+
+    init() {
+        this.#pointerClient = PointerClient.getInstance();
+        this.#inputSink = window.BX_EXPOSED.inputSink;
+
+        // Stop keyboard input at startup
+        this.#updateInputConfigurationAsync(false);
+
+        try {
+            this.#pointerClient.start(this);
+        } catch (e) {
+            Toast.show('Cannot enable Mouse & Keyboard feature');
+        }
+
+        this.#mouseVerticalMultiply = getPref(PrefKey.NATIVE_MKB_SCROLL_VERTICAL_SENSITIVITY);
+        this.#mouseHorizontalMultiply = getPref(PrefKey.NATIVE_MKB_SCROLL_HORIZONTAL_SENSITIVITY);
+
+        window.addEventListener('keyup', this);
+
+        window.addEventListener(BxEvent.XCLOUD_DIALOG_SHOWN, this);
+        window.addEventListener(BxEvent.POINTER_LOCK_REQUESTED, this);
+        window.addEventListener(BxEvent.POINTER_LOCK_EXITED, this);
+        window.addEventListener(BxEvent.XCLOUD_POLLING_MODE_CHANGED, this);
+
+        this.#initMessage();
+
+        if (AppInterface) {
+            Toast.show(t('press-key-to-toggle-mkb', {key: `<b>F8</b>`}), t('native-mkb'), {html: true});
+            this.#$message?.classList.add('bx-gone');
+        } else {
+            this.#$message?.classList.remove('bx-gone');
+        }
+    }
+
+    toggle(force?: boolean) {
+        let setEnable: boolean;
+        if (typeof force !== 'undefined') {
+            setEnable = force;
+        } else {
+            setEnable = !this.#enabled;
+        }
+
+        if (setEnable) {
+            document.documentElement.requestPointerLock();
+        } else {
+            document.exitPointerLock();
+        }
+    }
+
+    #updateInputConfigurationAsync(enabled: boolean) {
+        window.BX_EXPOSED.streamSession.updateInputConfigurationAsync({
+            enableKeyboardInput: enabled,
+            enableMouseInput: enabled,
+            enableAbsoluteMouse: false,
+            enableTouchInput: false,
+        });
+    }
+
+    start() {
+        this.#resetMouseInput();
+        this.#enabled = true;
+
+        this.#updateInputConfigurationAsync(true);
+
+        window.BX_EXPOSED.stopTakRendering = true;
+        this.#$message?.classList.add('bx-gone');
+
+        Toast.show(t('native-mkb'), t('enabled'), {instant: true});
+    }
+
+    stop() {
+        this.#resetMouseInput();
+        this.#enabled = false;
+        this.#updateInputConfigurationAsync(false);
+
+        this.#$message?.classList.remove('bx-gone');
+    }
+
+    destroy(): void {
+        this.#pointerClient?.stop();
+        window.removeEventListener('keyup', this);
+
+        window.removeEventListener(BxEvent.XCLOUD_DIALOG_SHOWN, this);
+        window.removeEventListener(BxEvent.POINTER_LOCK_REQUESTED, this);
+        window.removeEventListener(BxEvent.POINTER_LOCK_EXITED, this);
+        window.removeEventListener(BxEvent.XCLOUD_POLLING_MODE_CHANGED, this);
+
+        this.#$message?.classList.add('bx-gone');
+    }
+
+    handleMouseMove(data: MkbMouseMove): void {
+        this.#sendMouseInput({
+            X: data.movementX,
+            Y: data.movementY,
+            Buttons: this.#mouseButtonsPressed,
+            WheelX: this.#mouseWheelX,
+            WheelY: this.#mouseWheelY,
+        });
+    }
+
+    handleMouseClick(data: MkbMouseClick): void {
+        const { pointerButton, pressed } = data;
+
+        if (pressed) {
+            this.#mouseButtonsPressed |= pointerButton!;
+        } else {
+            this.#mouseButtonsPressed ^= pointerButton!;
+        }
+        this.#mouseButtonsPressed = Math.max(0, this.#mouseButtonsPressed);
+
+        this.#sendMouseInput({
+            X: 0,
+            Y: 0,
+            Buttons: this.#mouseButtonsPressed,
+            WheelX: this.#mouseWheelX,
+            WheelY: this.#mouseWheelY,
+        });
+    }
+
+    handleMouseWheel(data: MkbMouseWheel): boolean {
+        const { vertical, horizontal } = data;
+
+        this.#mouseWheelX = horizontal;
+        if (this.#mouseHorizontalMultiply && this.#mouseHorizontalMultiply !== 1) {
+            this.#mouseWheelX *= this.#mouseHorizontalMultiply;
+        }
+
+        this.#mouseWheelY = vertical;
+        if (this.#mouseVerticalMultiply && this.#mouseVerticalMultiply !== 1) {
+            this.#mouseWheelY *= this.#mouseVerticalMultiply;
+        }
+
+        this.#sendMouseInput({
+            X: 0,
+            Y: 0,
+            Buttons: this.#mouseButtonsPressed,
+            WheelX: this.#mouseWheelX,
+            WheelY: this.#mouseWheelY,
+        });
+
+        return true;
+    }
+
+    setVerticalScrollMultiplier(vertical: number) {
+        this.#mouseVerticalMultiply = vertical;
+    }
+
+    setHorizontalScrollMultiplier(horizontal: number) {
+        this.#mouseHorizontalMultiply = horizontal;
+    }
+
+    waitForMouseData(enabled: boolean): void {
+    }
+
+    isEnabled(): boolean {
+        return this.#enabled;
+    }
+
+    #sendMouseInput(data: NativeMouseData) {
+        data.Type = 0;  // Relative
+        this.#inputSink?.onMouseInput(data);
+    }
+
+    #resetMouseInput() {
+        this.#mouseButtonsPressed = 0;
+        this.#mouseWheelX = 0;
+        this.#mouseWheelY = 0;
+
+        this.#sendMouseInput({
+            X: 0,
+            Y: 0,
+            Buttons: 0,
+            WheelX: 0,
+            WheelY: 0,
+        });
+    }
+}
--- a/src/modules/mkb/pointer-client.ts
+++ b/src/modules/mkb/pointer-client.ts
@ -0,0 +1,128 @@
+import { BxLogger } from "@/utils/bx-logger";
+import { Toast } from "@/utils/toast";
+import type { MkbHandler } from "./base-mkb-handler";
+
+const LOG_TAG = 'PointerClient';
+
+enum PointerAction {
+    MOVE = 1,
+    BUTTON_PRESS = 2,
+    BUTTON_RELEASE = 3,
+    SCROLL = 4,
+    POINTER_CAPTURE_CHANGED = 5,
+}
+
+
+export class PointerClient {
+    static #PORT = 9269;
+
+    private static instance: PointerClient;
+    public static getInstance(): PointerClient {
+        if (!PointerClient.instance) {
+            PointerClient.instance = new PointerClient();
+        }
+
+        return PointerClient.instance;
+    }
+
+    #socket: WebSocket | undefined | null;
+    #mkbHandler: MkbHandler | undefined;
+
+    start(mkbHandler: MkbHandler) {
+        this.#mkbHandler = mkbHandler;
+
+        // Create WebSocket connection.
+        this.#socket = new WebSocket(`ws://localhost:${PointerClient.#PORT}`);
+        this.#socket.binaryType = 'arraybuffer';
+
+        // Connection opened
+        this.#socket.addEventListener('open', (event) => {
+            BxLogger.info(LOG_TAG, 'connected')
+        });
+
+        // Error
+        this.#socket.addEventListener('error', (event) => {
+            BxLogger.error(LOG_TAG, event);
+            Toast.show('Cannot setup mouse');
+        });
+
+        this.#socket.addEventListener('close', (event) => {
+            this.#socket = null;
+        });
+
+        // Listen for messages
+        this.#socket.addEventListener('message', (event) => {
+            const dataView = new DataView(event.data);
+
+            let messageType = dataView.getInt8(0);
+            let offset = Int8Array.BYTES_PER_ELEMENT;
+            switch (messageType) {
+                case PointerAction.MOVE:
+                    this.onMove(dataView, offset);
+                    break;
+
+                case PointerAction.BUTTON_PRESS:
+                case PointerAction.BUTTON_RELEASE:
+                    this.onPress(messageType, dataView, offset);
+                    break;
+
+                case PointerAction.SCROLL:
+                    this.onScroll(dataView, offset);
+                    break;
+
+                case PointerAction.POINTER_CAPTURE_CHANGED:
+                    this.onPointerCaptureChanged(dataView, offset);
+            }
+        });
+    }
+
+    onMove(dataView: DataView, offset: number) {
+        // [X, Y]
+        const x = dataView.getInt16(offset);
+        offset += Int16Array.BYTES_PER_ELEMENT;
+        const y = dataView.getInt16(offset);
+
+        this.#mkbHandler?.handleMouseMove({
+            movementX: x,
+            movementY: y,
+        });
+        // BxLogger.info(LOG_TAG, 'move', x, y);
+    }
+
+    onPress(messageType: PointerAction, dataView: DataView, offset: number) {
+        const button = dataView.getUint8(offset);
+
+        this.#mkbHandler?.handleMouseClick({
+            pointerButton: button,
+            pressed: messageType === PointerAction.BUTTON_PRESS,
+        });
+
+        // BxLogger.info(LOG_TAG, 'press', buttonIndex);
+    }
+
+    onScroll(dataView: DataView, offset: number) {
+        // [V_SCROLL, H_SCROLL]
+        const vScroll = dataView.getInt16(offset);
+        offset += Int16Array.BYTES_PER_ELEMENT;
+        const hScroll = dataView.getInt16(offset);
+
+        this.#mkbHandler?.handleMouseWheel({
+            vertical: vScroll,
+            horizontal: hScroll,
+        });
+
+        // BxLogger.info(LOG_TAG, 'scroll', vScroll, hScroll);
+    }
+
+    onPointerCaptureChanged(dataView: DataView, offset: number) {
+        const hasCapture = dataView.getInt8(offset) === 1;
+        !hasCapture && this.#mkbHandler?.stop();
+    }
+
+    stop() {
+        try {
+            this.#socket?.close();
+        } catch (e) {}
+        this.#socket = null;
+    }
+}
--- a/src/modules/patcher.ts
+++ b/src/modules/patcher.ts
@ -304,6 +304,37 @@ window.dispatchEvent(new Event("${BxEvent.TOUCH_LAYOUT_MANAGER_READY}"));
        return str;
    },

+
+    patchBabylonRendererClass(str: string) {
+        // ()=>{a.current.render(),h.current=window.requestAnimationFrame(l)
+        let index = str.indexOf('.current.render(),');
+        if (index === -1) {
+            return false;
+        }
+
+        // Move back a character
+        index -= 1;
+
+        // Get variable of the "BabylonRendererClass" object
+        const rendererVar = str[index];
+
+        const newCode = `
+if (window.BX_EXPOSED.stopTakRendering) {
+    try {
+        document.getElementById('BabylonCanvasContainer-main')?.parentElement.classList.add('bx-offscreen');
+
+        ${rendererVar}.current.dispose();
+    } catch (e) {}
+
+    window.BX_EXPOSED.stopTakRendering = false;
+    return;
+}
+`;
+
+        str = str.substring(0, index) + newCode + str.substring(index);
+        return str;
+    },
+
    supportLocalCoOp(str: string) {
        const text = 'this.gamepadMappingsToSend=[],';
        if (!str.includes(text)) {
@ -407,7 +438,7 @@ e.guideUI = null;
        }

        const newCode = `
-window.BX_EXPOSED.onPollingModeChanged && window.BX_EXPOSED.onPollingModeChanged(e);
+BxEvent.dispatch(window, BxEvent.XCLOUD_POLLING_MODE_CHANGED, {mode: e});
 `;
        str = str.replace(text, text + newCode);
        return str;
@ -554,9 +585,68 @@ true` + text;
        str = str.replace(text, newCode);
        return str;
    },
+
+    skipFeedbackDialog(str: string) {
+        const text = '&&this.shouldTransitionToFeedback(';
+        if (!str.includes(text)) {
+            return false;
+        }
+
+        str = str.replace(text, '&& false ' + text);
+        return str;
+    },
+
+    enableNativeMkb(str: string) {
+        const text = 'e.mouseSupported&&e.keyboardSupported&&e.fullscreenSupported;';
+        if ((!str.includes(text))) {
+            return false;
+        }
+
+        str = str.replace(text, text + 'return true;');
+        return str;
+    },
+
+    patchMouseAndKeyboardEnabled(str: string) {
+        const text = 'get mouseAndKeyboardEnabled(){';
+        if (!str.includes(text)) {
+            return false;
+        }
+
+        str = str.replace(text, text + 'return true;');
+        return str;
+    },
+
+    exposeInputSink(str: string) {
+        const text = 'this.controlChannel=null,this.inputChannel=null';
+        if (!str.includes(text)) {
+            return false;
+        }
+
+        const newCode = 'window.BX_EXPOSED.inputSink = this;';
+
+        str = str.replace(text, newCode + text);
+        return str;
+    },
+
+    disableNativeRequestPointerLock(str: string) {
+        const text = 'async requestPointerLock(){';
+        if (!str.includes(text)) {
+            return false;
+        }
+
+        str = str.replace(text, text + 'return;');
+        return str;
+    }
 };

 let PATCH_ORDERS: PatchArray = [
+    ...(getPref(PrefKey.NATIVE_MKB_ENABLED) === 'on' ? [
+        'enableNativeMkb',
+        'patchMouseAndKeyboardEnabled',
+        'disableNativeRequestPointerLock',
+        'exposeInputSink',
+    ] : []),
+
    'disableStreamGate',
    'overrideSettings',
    'broadcastPollingMode',
@ -605,11 +695,16 @@ let PLAYING_PATCH_ORDERS: PatchArray = [
    // Patch volume control for combined audio+video stream
    getPref(PrefKey.AUDIO_ENABLE_VOLUME_CONTROL) && getPref(PrefKey.STREAM_COMBINE_SOURCES) && 'patchCombinedAudioVideoMediaStream',

+    // Skip feedback dialog
+    getPref(PrefKey.STREAM_DISABLE_FEEDBACK_DIALOG) && 'skipFeedbackDialog',

-    STATES.hasTouchSupport && getPref(PrefKey.STREAM_TOUCH_CONTROLLER) === 'all' && 'patchShowSensorControls',
-    STATES.hasTouchSupport && getPref(PrefKey.STREAM_TOUCH_CONTROLLER) === 'all' && 'exposeTouchLayoutManager',
-    STATES.hasTouchSupport && (getPref(PrefKey.STREAM_TOUCH_CONTROLLER) === 'off' || getPref(PrefKey.STREAM_TOUCH_CONTROLLER_AUTO_OFF)) && 'disableTakRenderer',
-    STATES.hasTouchSupport && getPref(PrefKey.STREAM_TOUCH_CONTROLLER_DEFAULT_OPACITY) !== 100 && 'patchTouchControlDefaultOpacity',
+    ...(STATES.hasTouchSupport ? [
+        getPref(PrefKey.STREAM_TOUCH_CONTROLLER) === 'all' && 'patchShowSensorControls',
+        getPref(PrefKey.STREAM_TOUCH_CONTROLLER) === 'all' && 'exposeTouchLayoutManager',
+        (getPref(PrefKey.STREAM_TOUCH_CONTROLLER) === 'off' || getPref(PrefKey.STREAM_TOUCH_CONTROLLER_AUTO_OFF)) && 'disableTakRenderer',
+        getPref(PrefKey.STREAM_TOUCH_CONTROLLER_DEFAULT_OPACITY) !== 100 && 'patchTouchControlDefaultOpacity',
+        'patchBabylonRendererClass',
+    ] : []),

    BX_FLAGS.EnableXcloudLogging && 'enableConsoleLogging',

--- a/src/modules/patches/controller-shortcuts.js
+++ b/src/modules/patches/controller-shortcuts.js
@ -11,7 +11,12 @@ if (btnHome) {
        this.bxHomeStates = {};
    }

+    let intervalMs = 0;
+    let hijack = false;
+
    if (btnHome.pressed) {
+        hijack = true;
+        intervalMs = 16;
        this.gamepadIsIdle.set(currentGamepad.index, false);

        if (this.bxHomeStates[currentGamepad.index]) {
@ -33,14 +38,8 @@ if (btnHome) {
                timestamp: currentGamepad.timestamp,
            };
        }
-
-        // Listen to next button press
-        const intervalMs = 16;
-        this.inputConfiguration.useIntervalWorkerThreadForInput && this.intervalWorker ? this.intervalWorker.scheduleTimer(intervalMs) : this.pollGamepadssetTimeoutTimerID = setTimeout(this.pollGamepads, intervalMs);
-
-        // Hijack this button
-        return;
    } else if (this.bxHomeStates[currentGamepad.index]) {
+        hijack = true;
        const info = structuredClone(this.bxHomeStates[currentGamepad.index]);

        // Home button released
@ -77,11 +76,19 @@ if (btnHome) {
            }];

            const isLongPress = (currentGamepad.timestamp - info.timestamp) >= 500;
-            const intervalMs = isLongPress ? 500 : 100;
+            intervalMs = isLongPress ? 500 : 100;

            this.inputSink.onGamepadInput(performance.now() - intervalMs, fakeGamepadMappings);
-            this.inputConfiguration.useIntervalWorkerThreadForInput && this.intervalWorker ? this.intervalWorker.scheduleTimer(intervalMs) : this.pollGamepadssetTimeoutTimerID = setTimeout(this.pollGamepads, intervalMs);
-            return;
+        } else {
+            intervalMs = 4;
        }
    }
+
+    if (hijack && intervalMs) {
+        // Listen to next button press
+        this.inputConfiguration.useIntervalWorkerThreadForInput && this.intervalWorker ? this.intervalWorker.scheduleTimer(intervalMs) : this.pollGamepadssetTimeoutTimerID = setTimeout(this.pollGamepads, intervalMs);
+
+        // Hijack this button
+        return;
+    }
 }
--- a/src/modules/patches/vibration-adjust.js
+++ b/src/modules/patches/vibration-adjust.js
@ -3,7 +3,11 @@ if (!window.BX_ENABLE_CONTROLLER_VIBRATION) {
 }

 const intensity = window.BX_VIBRATION_INTENSITY;
-if (intensity && intensity < 1) {
+if (intensity === 0) {
+    return void(0);
+}
+
+if (intensity < 1) {
    e.leftMotorPercent *= intensity;
    e.rightMotorPercent *= intensity;
    e.leftTriggerMotorPercent *= intensity;
--- a/src/modules/stream/stream-badges.ts
+++ b/src/modules/stream/stream-badges.ts
@ -1,71 +1,91 @@
 import { t } from "@utils/translation";
 import { BxEvent } from "@utils/bx-event";
-import { CE } from "@utils/html";
+import { CE, createSvgIcon } from "@utils/html";
 import { STATES } from "@utils/global";
+import { BxLogger } from "@/utils/bx-logger";
+import { BxIcon } from "@/utils/bx-icon";

 enum StreamBadge {
    PLAYTIME = 'playtime',
    BATTERY = 'battery',
-    IN = 'in',
-    OUT = 'out',
+    DOWNLOAD = 'in',
+    UPLOAD = 'out',

    SERVER = 'server',
    VIDEO = 'video',
    AUDIO = 'audio',
+}

-    BREAK = 'break',
+const StreamBadgeIcon: Partial<{[key in StreamBadge]: any}> = {
+    [StreamBadge.PLAYTIME]: BxIcon.PLAYTIME,
+    [StreamBadge.VIDEO]: BxIcon.DISPLAY,
+    [StreamBadge.BATTERY]: BxIcon.BATTERY,
+    [StreamBadge.DOWNLOAD]: BxIcon.DOWNLOAD,
+    [StreamBadge.UPLOAD]: BxIcon.UPLOAD,
+    [StreamBadge.SERVER]: BxIcon.SERVER,
+    [StreamBadge.AUDIO]: BxIcon.AUDIO,
 }

 export class StreamBadges {
-    static ipv6 = false;
-    static resolution?: {width: number, height: number} | null = null;
-    static video?: {codec: string, profile?: string | null} | null = null;
-    static audio?: {codec: string, bitrate: number} | null = null;
-    static fps = 0;
-    static region = '';
-
-    static startBatteryLevel = 100;
-    static startTimestamp = 0;
-
-    static #cachedDoms: {[index: string]: HTMLElement} = {};
-
-    static #interval?: number | null;
-    static readonly #REFRESH_INTERVAL = 3000;
-
-    static #renderBadge(name: StreamBadge, value: string, color: string) {
-        if (name === StreamBadge.BREAK) {
-            return CE('div', {'style': 'display: block'});
+    private static instance: StreamBadges;
+    public static getInstance(): StreamBadges {
+        if (!StreamBadges.instance) {
+            StreamBadges.instance = new StreamBadges();
        }

+        return StreamBadges.instance;
+    }
+
+    #ipv6 = false;
+    #resolution?: {width: number, height: number} | null = null;
+    #video?: {codec: string, profile?: string | null} | null = null;
+    #audio?: {codec: string, bitrate: number} | null = null;
+    #region = '';
+
+    startBatteryLevel = 100;
+    startTimestamp = 0;
+
+    #$container: HTMLElement | undefined;
+    #cachedDoms: Partial<{[key in StreamBadge]: HTMLElement}> = {};
+
+    #interval?: number | null;
+    readonly #REFRESH_INTERVAL = 3000;
+
+    setRegion(region: string) {
+        this.#region = region;
+    }
+
+    #renderBadge(name: StreamBadge, value: string, color: string) {
        let $badge;
-        if (StreamBadges.#cachedDoms[name]) {
-            $badge = StreamBadges.#cachedDoms[name];
+        if (this.#cachedDoms[name]) {
+            $badge = this.#cachedDoms[name]!;
            $badge.lastElementChild!.textContent = value;
            return $badge;
        }

-        $badge = CE('div', {'class': 'bx-badge'},
-                    CE('span', {'class': 'bx-badge-name'}, t(`badge-${name}`)),
-                    CE('span', {'class': 'bx-badge-value', 'style': `background-color: ${color}`}, value));
+        $badge = CE('div', {'class': 'bx-badge', 'title': t(`badge-${name}`)},
+            CE('span', {'class': 'bx-badge-name'}, createSvgIcon(StreamBadgeIcon[name])),
+            CE('span', {'class': 'bx-badge-value', 'style': `background-color: ${color}`}, value),
+        );

        if (name === StreamBadge.BATTERY) {
            $badge.classList.add('bx-badge-battery');
        }

-        StreamBadges.#cachedDoms[name] = $badge;
+        this.#cachedDoms[name] = $badge;
        return $badge;
    }

-    static async #updateBadges(forceUpdate: boolean) {
-        if (!forceUpdate && !document.querySelector('.bx-badges')) {
-            StreamBadges.#stop();
+    async #updateBadges(forceUpdate = false) {
+        if (!this.#$container || (!forceUpdate && !this.#$container.isConnected)) {
+            this.#stop();
            return;
        }

        // Playtime
        let now = +new Date;
-        const diffSeconds = Math.ceil((now - StreamBadges.startTimestamp) / 1000);
-        const playtime = StreamBadges.#secondsToHm(diffSeconds);
+        const diffSeconds = Math.ceil((now - this.startTimestamp) / 1000);
+        const playtime = this.#secondsToHm(diffSeconds);

        // Battery
        let batteryLevel = '100%';
@ -78,8 +98,8 @@ export class StreamBadges {
                batteryLevelInt = Math.round(bm.level * 100);
                batteryLevel = `${batteryLevelInt}%`;

-                if (batteryLevelInt != StreamBadges.startBatteryLevel) {
-                    const diffLevel = Math.round(batteryLevelInt - StreamBadges.startBatteryLevel);
+                if (batteryLevelInt != this.startBatteryLevel) {
+                    const diffLevel = Math.round(batteryLevelInt - this.startBatteryLevel);
                    const sign = diffLevel > 0 ? '+' : '';
                    batteryLevel += ` (${sign}${diffLevel}%)`;
                }
@ -97,8 +117,8 @@ export class StreamBadges {
        });

        const badges = {
-            [StreamBadge.IN]: totalIn ? StreamBadges.#humanFileSize(totalIn) : null,
-            [StreamBadge.OUT]: totalOut ? StreamBadges.#humanFileSize(totalOut) : null,
+            [StreamBadge.DOWNLOAD]: totalIn ? this.#humanFileSize(totalIn) : null,
+            [StreamBadge.UPLOAD]: totalOut ? this.#humanFileSize(totalOut) : null,
            [StreamBadge.PLAYTIME]: playtime,
            [StreamBadge.BATTERY]: batteryLevel,
        };
@ -110,28 +130,34 @@ export class StreamBadges {
                continue;
            }

-            const $elm = StreamBadges.#cachedDoms[name];
+            const $elm = this.#cachedDoms[name]!;
            $elm && ($elm.lastElementChild!.textContent = value);

            if (name === StreamBadge.BATTERY) {
-                // Show charging status
-                $elm.setAttribute('data-charging', isCharging.toString());
-
-                if (StreamBadges.startBatteryLevel === 100 && batteryLevelInt === 100) {
-                    $elm.style.display = 'none';
+                if (this.startBatteryLevel === 100 && batteryLevelInt === 100) {
+                    // Hide battery badge when the battery is 100%
+                    $elm.classList.add('bx-gone');
                } else {
-                    $elm.removeAttribute('style');
+                    // Show charging status
+                    $elm.dataset.charging = isCharging.toString()
+                    $elm.classList.remove('bx-gone');
                }
            }
        }
    }

-    static #stop() {
-        StreamBadges.#interval && clearInterval(StreamBadges.#interval);
-        StreamBadges.#interval = null;
+    async #start() {
+        await this.#updateBadges(true);
+        this.#stop();
+        this.#interval = window.setInterval(this.#updateBadges.bind(this), this.#REFRESH_INTERVAL);
    }

-    static #secondsToHm(seconds: number) {
+    #stop() {
+        this.#interval && clearInterval(this.#interval);
+        this.#interval = null;
+    }
+
+    #secondsToHm(seconds: number) {
        const h = Math.floor(seconds / 3600);
        const m = Math.floor(seconds % 3600 / 60) + 1;

@ -141,25 +167,32 @@ export class StreamBadges {
    }

    // https://stackoverflow.com/a/20732091
-    static #humanFileSize(size: number) {
-        const units = ['B', 'kB', 'MB', 'GB', 'TB'];
+    #humanFileSize(size: number) {
+        const units = ['B', 'KB', 'MB', 'GB', 'TB'];

        let i = size == 0 ? 0 : Math.floor(Math.log(size) / Math.log(1024));
        return (size / Math.pow(1024, i)).toFixed(2) + ' ' + units[i];
    }

-    static async render() {
-        // Video
-        let video = '';
-        if (StreamBadges.resolution) {
-            video = `${StreamBadges.resolution.height}p`;
+    async render() {
+        if (this.#$container) {
+            this.#start();
+            return this.#$container;
        }

-        if (StreamBadges.video) {
+        await this.#getServerStats();
+
+        // Video
+        let video = '';
+        if (this.#resolution) {
+            video = `${this.#resolution.height}p`;
+        }
+
+        if (this.#video) {
            video && (video += '/');
-            video += StreamBadges.video.codec;
-            if (StreamBadges.video.profile) {
-                const profile = StreamBadges.video.profile;
+            video += this.#video.codec;
+            if (this.#video.profile) {
+                const profile = this.#video.profile;

                let quality = profile;
                if (profile.startsWith('4d')) {
@ -176,9 +209,9 @@ export class StreamBadges {

        // Audio
        let audio;
-        if (StreamBadges.audio) {
-            audio = StreamBadges.audio.codec;
-            const bitrate = StreamBadges.audio.bitrate / 1000;
+        if (this.#audio) {
+            audio = this.#audio.codec;
+            const bitrate = this.#audio.bitrate / 1000;
            audio += ` (${bitrate} kHz)`;
        }

@ -189,53 +222,139 @@ export class StreamBadges {
        }

        // Server + Region
-        let server = StreamBadges.region;
-        server += '@' + (StreamBadges.ipv6 ? 'IPv6' : 'IPv4');
+        let server = this.#region;
+        server += '@' + (this.#ipv6 ? 'IPv6' : 'IPv4');

        const BADGES = [
            [StreamBadge.PLAYTIME, '1m', '#ff004d'],
            [StreamBadge.BATTERY, batteryLevel, '#00b543'],
-            [StreamBadge.IN, StreamBadges.#humanFileSize(0), '#29adff'],
-            [StreamBadge.OUT, StreamBadges.#humanFileSize(0), '#ff77a8'],
-            [StreamBadge.BREAK],
+            [StreamBadge.DOWNLOAD, this.#humanFileSize(0), '#29adff'],
+            [StreamBadge.UPLOAD, this.#humanFileSize(0), '#ff77a8'],
            [StreamBadge.SERVER, server, '#ff6c24'],
            video ? [StreamBadge.VIDEO, video, '#742f29'] : null,
            audio ? [StreamBadge.AUDIO, audio, '#5f574f'] : null,
        ];

-        const $wrapper = CE('div', {'class': 'bx-badges'});
+        const $container = CE('div', {'class': 'bx-badges'});
        BADGES.forEach(item => {
            if (!item) {
                return;
            }

-            const $badge = StreamBadges.#renderBadge(...(item as [StreamBadge, string, string]));
-            $wrapper.appendChild($badge);
+            const $badge = this.#renderBadge(...(item as [StreamBadge, string, string]));
+            $container.appendChild($badge);
        });

-        await StreamBadges.#updateBadges(true);
-        StreamBadges.#stop();
-        StreamBadges.#interval = window.setInterval(StreamBadges.#updateBadges, StreamBadges.#REFRESH_INTERVAL);
+        this.#$container = $container;
+        await this.#start();

-        return $wrapper;
+        return $container;
+    }
+
+    async #getServerStats() {
+        const stats = await STATES.currentStream.peerConnection!.getStats();
+
+        const allVideoCodecs: {[index: string]: RTCBasicStat} = {};
+        let videoCodecId;
+
+        const allAudioCodecs: {[index: string]: RTCBasicStat} = {};
+        let audioCodecId;
+
+        const allCandidates: {[index: string]: string} = {};
+        let candidateId;
+
+        stats.forEach((stat: RTCBasicStat) => {
+            if (stat.type === 'codec') {
+                const mimeType = stat.mimeType.split('/')[0];
+                if (mimeType === 'video') {
+                    // Store all video stats
+                    allVideoCodecs[stat.id] = stat;
+                } else if (mimeType === 'audio') {
+                    // Store all audio stats
+                    allAudioCodecs[stat.id] = stat;
+                }
+            } else if (stat.type === 'inbound-rtp' && stat.packetsReceived > 0) {
+                // Get the codecId of the video/audio track currently being used
+                if (stat.kind === 'video') {
+                    videoCodecId = stat.codecId;
+                } else if (stat.kind === 'audio') {
+                    audioCodecId = stat.codecId;
+                }
+            } else if (stat.type === 'candidate-pair' && stat.packetsReceived > 0 && stat.state === 'succeeded') {
+                candidateId = stat.remoteCandidateId;
+            } else if (stat.type === 'remote-candidate') {
+                allCandidates[stat.id] = stat.address;
+            }
+        });
+
+        // Get video codec from codecId
+        if (videoCodecId) {
+            const videoStat = allVideoCodecs[videoCodecId];
+            const video: any = {
+                codec: videoStat.mimeType.substring(6),
+            };
+
+            if (video.codec === 'H264') {
+                const match = /profile-level-id=([0-9a-f]{6})/.exec(videoStat.sdpFmtpLine);
+                video.profile = match ? match[1] : null;
+            }
+
+            this.#video = video;
+        }
+
+        // Get audio codec from codecId
+        if (audioCodecId) {
+            const audioStat = allAudioCodecs[audioCodecId];
+            this.#audio = {
+                codec: audioStat.mimeType.substring(6),
+                bitrate: audioStat.clockRate,
+            }
+        }
+
+        // Get server type
+        if (candidateId) {
+            BxLogger.info('candidate', candidateId, allCandidates);
+            this.#ipv6 = allCandidates[candidateId].includes(':');
+        }
    }

    static setupEvents() {
        window.addEventListener(BxEvent.STREAM_PLAYING, e => {
            const $video = (e as any).$video;
+            const streamBadges = StreamBadges.getInstance();

-            StreamBadges.resolution = {
+            streamBadges.#resolution = {
                width: $video.videoWidth,
-                height: $video.videoHeight
+                height: $video.videoHeight,
            };
-            StreamBadges.startTimestamp = +new Date;
+            streamBadges.startTimestamp = +new Date;

            // Get battery level
            try {
                'getBattery' in navigator && (navigator as NavigatorBattery).getBattery().then(bm => {
-                    StreamBadges.startBatteryLevel = Math.round(bm.level * 100);
+                    streamBadges.startBatteryLevel = Math.round(bm.level * 100);
                });
            } catch(e) {}
        });
+
+        /*
+        Don't do this until xCloud remove the Stream Menu page
+
+        window.addEventListener(BxEvent.XCLOUD_GUIDE_SHOWN, async e => {
+            const where = (e as any).where as XcloudGuideWhere;
+
+            if (where !== XcloudGuideWhere.HOME || !STATES.isPlaying) {
+                return;
+            }
+
+            const $btnQuit = document.querySelector('#gamepass-dialog-root a[class*=QuitGameButton]');
+            if (!$btnQuit) {
+                return;
+            }
+
+            // Add badges
+            $btnQuit.insertAdjacentElement('beforebegin', await StreamBadges.getInstance().render());
+        });
+        */
    }
 }
--- a/src/modules/stream/stream-stats.ts
+++ b/src/modules/stream/stream-stats.ts
@ -1,11 +1,9 @@
 import { PrefKey } from "@utils/preferences"
 import { BxEvent } from "@utils/bx-event"
 import { getPref } from "@utils/preferences"
-import { StreamBadges } from "./stream-badges"
 import { CE } from "@utils/html"
 import { t } from "@utils/translation"
 import { STATES } from "@utils/global"
-import { BxLogger } from "@utils/bx-logger"

 export enum StreamStat {
    PING = 'ping',
@ -17,286 +15,254 @@ export enum StreamStat {
 };

 export class StreamStats {
-    static #interval?: number | null;
-    static #updateInterval = 1000;
+    private static instance: StreamStats;
+    public static getInstance(): StreamStats {
+        if (!StreamStats.instance) {
+            StreamStats.instance = new StreamStats();
+        }

-    static #$container: HTMLElement;
-    static #$fps: HTMLElement;
-    static #$ping: HTMLElement;
-    static #$dt: HTMLElement;
-    static #$pl: HTMLElement;
-    static #$fl: HTMLElement;
-    static #$br: HTMLElement;
+        return StreamStats.instance;
+    }

-    static #lastStat?: RTCBasicStat | null;
+    #timeoutId?: number | null;
+    readonly #updateInterval = 1000;

-    static #quickGlanceObserver?: MutationObserver | null;
+    #$container: HTMLElement | undefined;
+    #$fps: HTMLElement | undefined;
+    #$ping: HTMLElement | undefined;
+    #$dt: HTMLElement | undefined;
+    #$pl: HTMLElement | undefined;
+    #$fl: HTMLElement | undefined;
+    #$br: HTMLElement | undefined;

-    static start(glancing=false) {
-        if (!StreamStats.isHidden() || (glancing && StreamStats.isGlancing())) {
+    #lastVideoStat?: RTCBasicStat | null;
+
+    #quickGlanceObserver?: MutationObserver | null;
+
+    start(glancing=false) {
+        if (!this.isHidden() || (glancing && this.isGlancing())) {
            return;
        }

-        StreamStats.#$container.classList.remove('bx-gone');
-        StreamStats.#$container.setAttribute('data-display', glancing ? 'glancing' : 'fixed');
+        if (this.#$container) {
+            this.#$container.classList.remove('bx-gone');
+            this.#$container.dataset.display = glancing ? 'glancing' : 'fixed';
+        }

-        StreamStats.#interval = window.setInterval(StreamStats.update, StreamStats.#updateInterval);
+        this.#timeoutId = window.setTimeout(this.#update.bind(this), this.#updateInterval);
    }

-    static stop(glancing=false) {
-        if (glancing && !StreamStats.isGlancing()) {
+    stop(glancing=false) {
+        if (glancing && !this.isGlancing()) {
            return;
        }

-        StreamStats.#interval && clearInterval(StreamStats.#interval);
-        StreamStats.#interval = null;
-        StreamStats.#lastStat = null;
+        this.#timeoutId && clearTimeout(this.#timeoutId);
+        this.#timeoutId = null;
+        this.#lastVideoStat = null;

-        if (StreamStats.#$container) {
-            StreamStats.#$container.removeAttribute('data-display');
-            StreamStats.#$container.classList.add('bx-gone');
+        if (this.#$container) {
+            this.#$container.removeAttribute('data-display');
+            this.#$container.classList.add('bx-gone');
        }
    }

-    static toggle() {
-        if (StreamStats.isGlancing()) {
-            StreamStats.#$container.setAttribute('data-display', 'fixed');
+    toggle() {
+        if (this.isGlancing()) {
+            this.#$container && (this.#$container.dataset.display = 'fixed');
        } else {
-            StreamStats.isHidden() ? StreamStats.start() : StreamStats.stop();
+            this.isHidden() ? this.start() : this.stop();
        }
    }

-    static onStoppedPlaying() {
-        StreamStats.stop();
-        StreamStats.quickGlanceStop();
-        StreamStats.hideSettingsUi();
+    onStoppedPlaying() {
+        this.stop();
+        this.quickGlanceStop();
+        this.hideSettingsUi();
    }

-    static isHidden = () => StreamStats.#$container && StreamStats.#$container.classList.contains('bx-gone');
-    static isGlancing = () => StreamStats.#$container && StreamStats.#$container.getAttribute('data-display') === 'glancing';
+    isHidden = () => this.#$container && this.#$container.classList.contains('bx-gone');
+    isGlancing = () => this.#$container && this.#$container.dataset.display === 'glancing';

-    static quickGlanceSetup() {
-        if (StreamStats.#quickGlanceObserver) {
+    quickGlanceSetup() {
+        if (this.#quickGlanceObserver) {
            return;
        }

        const $uiContainer = document.querySelector('div[data-testid=ui-container]')!;
-        StreamStats.#quickGlanceObserver = new MutationObserver((mutationList, observer) => {
+        this.#quickGlanceObserver = new MutationObserver((mutationList, observer) => {
            for (let record of mutationList) {
                if (record.attributeName && record.attributeName === 'aria-expanded') {
                    const expanded = (record.target as HTMLElement).ariaExpanded;
                    if (expanded === 'true') {
-                        StreamStats.isHidden() && StreamStats.start(true);
+                        this.isHidden() && this.start(true);
                    } else {
-                        StreamStats.stop(true);
+                        this.stop(true);
                    }
                }
            }
        });

-        StreamStats.#quickGlanceObserver.observe($uiContainer, {
+        this.#quickGlanceObserver.observe($uiContainer, {
            attributes: true,
            attributeFilter: ['aria-expanded'],
            subtree: true,
        });
    }

-    static quickGlanceStop() {
-        StreamStats.#quickGlanceObserver && StreamStats.#quickGlanceObserver.disconnect();
-        StreamStats.#quickGlanceObserver = null;
+    quickGlanceStop() {
+        this.#quickGlanceObserver && this.#quickGlanceObserver.disconnect();
+        this.#quickGlanceObserver = null;
    }

-    static update() {
-        if (StreamStats.isHidden() || !STATES.currentStream.peerConnection) {
-            StreamStats.onStoppedPlaying();
+    async #update() {
+        if (this.isHidden() || !STATES.currentStream.peerConnection) {
+            this.onStoppedPlaying();
            return;
        }

+        this.#timeoutId = null;
+        const startTime = performance.now();
+
        const PREF_STATS_CONDITIONAL_FORMATTING = getPref(PrefKey.STATS_CONDITIONAL_FORMATTING);
-        STATES.currentStream.peerConnection.getStats().then(stats => {
-            stats.forEach(stat => {
-                let grade = '';
-                if (stat.type === 'inbound-rtp' && stat.kind === 'video') {
-                    // FPS
-                    StreamStats.#$fps.textContent = stat.framesPerSecond || 0;

-                    // Packets Lost
-                    const packetsLost = stat.packetsLost;
-                    const packetsReceived = stat.packetsReceived;
-                    const packetsLostPercentage = (packetsLost * 100 / ((packetsLost + packetsReceived) || 1)).toFixed(2);
-                    StreamStats.#$pl.textContent = packetsLostPercentage === '0.00' ? packetsLost : `${packetsLost} (${packetsLostPercentage}%)`;
+        const stats = await STATES.currentStream.peerConnection.getStats();
+        let grade = '';

-                    // Frames Dropped
-                    const framesDropped = stat.framesDropped;
-                    const framesReceived = stat.framesReceived;
-                    const framesDroppedPercentage = (framesDropped * 100 / ((framesDropped + framesReceived) || 1)).toFixed(2);
-                    StreamStats.#$fl.textContent = framesDroppedPercentage === '0.00' ? framesDropped : `${framesDropped} (${framesDroppedPercentage}%)`;
+        stats.forEach(stat => {
+            if (stat.type === 'inbound-rtp' && stat.kind === 'video') {
+                // FPS
+                this.#$fps!.textContent = stat.framesPerSecond || 0;

-                    if (StreamStats.#lastStat) {
-                        const lastStat = StreamStats.#lastStat;
-                        // Bitrate
-                        const timeDiff = stat.timestamp - lastStat.timestamp;
-                        const bitrate = 8 * (stat.bytesReceived - lastStat.bytesReceived) / timeDiff / 1000;
-                        StreamStats.#$br.textContent = `${bitrate.toFixed(2)} Mbps`;
+                // Packets Lost
+                const packetsLost = stat.packetsLost;
+                const packetsReceived = stat.packetsReceived;
+                const packetsLostPercentage = (packetsLost * 100 / ((packetsLost + packetsReceived) || 1)).toFixed(2);
+                this.#$pl!.textContent = packetsLostPercentage === '0.00' ? packetsLost : `${packetsLost} (${packetsLostPercentage}%)`;

-                        // Decode time
-                        const totalDecodeTimeDiff = stat.totalDecodeTime - lastStat.totalDecodeTime;
-                        const framesDecodedDiff = stat.framesDecoded - lastStat.framesDecoded;
-                        const currentDecodeTime = totalDecodeTimeDiff / framesDecodedDiff * 1000;
-                        StreamStats.#$dt.textContent = `${currentDecodeTime.toFixed(2)}ms`;
+                // Frames dropped
+                const framesDropped = stat.framesDropped;
+                const framesReceived = stat.framesReceived;
+                const framesDroppedPercentage = (framesDropped * 100 / ((framesDropped + framesReceived) || 1)).toFixed(2);
+                this.#$fl!.textContent = framesDroppedPercentage === '0.00' ? framesDropped : `${framesDropped} (${framesDroppedPercentage}%)`;

-                        if (PREF_STATS_CONDITIONAL_FORMATTING) {
-                            grade = (currentDecodeTime > 12) ? 'bad' : (currentDecodeTime > 9) ? 'ok' : (currentDecodeTime > 6) ? 'good' : '';
-                        }
-                        StreamStats.#$dt.setAttribute('data-grade', grade);
-                    }
-
-                    StreamStats.#lastStat = stat;
-                } else if (stat.type === 'candidate-pair' && stat.packetsReceived > 0 && stat.state === 'succeeded') {
-                    // Round Trip Time
-                    const roundTripTime = typeof stat.currentRoundTripTime !== 'undefined' ? stat.currentRoundTripTime * 1000 : -1;
-                    StreamStats.#$ping.textContent = roundTripTime === -1 ? '???' : roundTripTime.toString();
-
-                    if (PREF_STATS_CONDITIONAL_FORMATTING) {
-                        grade = (roundTripTime > 100) ? 'bad' : (roundTripTime > 75) ? 'ok' : (roundTripTime > 40) ? 'good' : '';
-                    }
-                    StreamStats.#$ping.setAttribute('data-grade', grade);
+                if (!this.#lastVideoStat) {
+                    this.#lastVideoStat = stat;
+                    return;
                }
-            });
+
+                const lastStat = this.#lastVideoStat;
+                // Bitrate
+                const timeDiff = stat.timestamp - lastStat.timestamp;
+                const bitrate = 8 * (stat.bytesReceived - lastStat.bytesReceived) / timeDiff / 1000;
+                this.#$br!.textContent = `${bitrate.toFixed(2)} Mbps`;
+
+                // Decode time
+                const totalDecodeTimeDiff = stat.totalDecodeTime - lastStat.totalDecodeTime;
+                const framesDecodedDiff = stat.framesDecoded - lastStat.framesDecoded;
+                const currentDecodeTime = totalDecodeTimeDiff / framesDecodedDiff * 1000;
+                this.#$dt!.textContent = `${currentDecodeTime.toFixed(2)}ms`;
+
+                if (PREF_STATS_CONDITIONAL_FORMATTING) {
+                    grade = (currentDecodeTime > 12) ? 'bad' : (currentDecodeTime > 9) ? 'ok' : (currentDecodeTime > 6) ? 'good' : '';
+                    this.#$dt!.dataset.grade = grade;
+                }
+
+                this.#lastVideoStat = stat;
+            } else if (stat.type === 'candidate-pair' && stat.packetsReceived > 0 && stat.state === 'succeeded') {
+                // Round Trip Time
+                const roundTripTime = !!stat.currentRoundTripTime ? stat.currentRoundTripTime * 1000 : -1;
+                this.#$ping!.textContent = roundTripTime === -1 ? '???' : roundTripTime.toString();
+
+                if (PREF_STATS_CONDITIONAL_FORMATTING) {
+                    grade = (roundTripTime > 100) ? 'bad' : (roundTripTime > 75) ? 'ok' : (roundTripTime > 40) ? 'good' : '';
+                    this.#$ping!.dataset.grade = grade;
+                }
+            }
        });
+
+        const lapsedTime = performance.now() - startTime;
+        this.#timeoutId = window.setTimeout(this.#update.bind(this), this.#updateInterval - lapsedTime);
    }

-    static refreshStyles() {
+    refreshStyles() {
        const PREF_ITEMS = getPref(PrefKey.STATS_ITEMS);
        const PREF_POSITION = getPref(PrefKey.STATS_POSITION);
        const PREF_TRANSPARENT = getPref(PrefKey.STATS_TRANSPARENT);
        const PREF_OPACITY = getPref(PrefKey.STATS_OPACITY);
        const PREF_TEXT_SIZE = getPref(PrefKey.STATS_TEXT_SIZE);

-        const $container = StreamStats.#$container;
-        $container.setAttribute('data-stats', '[' + PREF_ITEMS.join('][') + ']');
-        $container.setAttribute('data-position', PREF_POSITION);
-        $container.setAttribute('data-transparent', PREF_TRANSPARENT);
+        const $container = this.#$container!;
+        $container.dataset.stats = '[' + PREF_ITEMS.join('][') + ']';
+        $container.dataset.position = PREF_POSITION;
+        $container.dataset.transparent = PREF_TRANSPARENT;
        $container.style.opacity = PREF_OPACITY + '%';
        $container.style.fontSize = PREF_TEXT_SIZE;
    }

-    static hideSettingsUi() {
-        if (StreamStats.isGlancing() && !getPref(PrefKey.STATS_QUICK_GLANCE)) {
-            StreamStats.stop();
+    hideSettingsUi() {
+        if (this.isGlancing() && !getPref(PrefKey.STATS_QUICK_GLANCE)) {
+            this.stop();
        }
    }

-    static render() {
-        if (StreamStats.#$container) {
+    #render() {
+        if (this.#$container) {
            return;
        }

-        const STATS = {
-            [StreamStat.PING]: [t('stat-ping'), StreamStats.#$ping = CE('span', {}, '0')],
-            [StreamStat.FPS]: [t('stat-fps'), StreamStats.#$fps = CE('span', {}, '0')],
-            [StreamStat.BITRATE]: [t('stat-bitrate'), StreamStats.#$br = CE('span', {}, '0 Mbps')],
-            [StreamStat.DECODE_TIME]: [t('stat-decode-time'), StreamStats.#$dt = CE('span', {}, '0ms')],
-            [StreamStat.PACKETS_LOST]: [t('stat-packets-lost'), StreamStats.#$pl = CE('span', {}, '0')],
-            [StreamStat.FRAMES_LOST]: [t('stat-frames-lost'), StreamStats.#$fl = CE('span', {}, '0')],
+        const stats = {
+            [StreamStat.PING]: [t('stat-ping'), this.#$ping = CE('span', {}, '0')],
+            [StreamStat.FPS]: [t('stat-fps'), this.#$fps = CE('span', {}, '0')],
+            [StreamStat.BITRATE]: [t('stat-bitrate'), this.#$br = CE('span', {}, '0 Mbps')],
+            [StreamStat.DECODE_TIME]: [t('stat-decode-time'), this.#$dt = CE('span', {}, '0ms')],
+            [StreamStat.PACKETS_LOST]: [t('stat-packets-lost'), this.#$pl = CE('span', {}, '0')],
+            [StreamStat.FRAMES_LOST]: [t('stat-frames-lost'), this.#$fl = CE('span', {}, '0')],
        };

        const $barFragment = document.createDocumentFragment();
-        let statKey: keyof typeof STATS
-        for (statKey in STATS) {
-            const $div = CE('div', {'class': `bx-stat-${statKey}`, title: STATS[statKey][0]}, CE('label', {}, statKey.toUpperCase()), STATS[statKey][1]);
+        let statKey: keyof typeof stats;
+        for (statKey in stats) {
+            const $div = CE('div', {
+                    'class': `bx-stat-${statKey}`,
+                    title: stats[statKey][0]
+                },
+                CE('label', {}, statKey.toUpperCase()),
+                stats[statKey][1],
+            );
+
            $barFragment.appendChild($div);
        }

-        StreamStats.#$container = CE('div', {'class': 'bx-stats-bar bx-gone'}, $barFragment);
-        document.documentElement.appendChild(StreamStats.#$container);
+        this.#$container = CE('div', {'class': 'bx-stats-bar bx-gone'}, $barFragment);
+        this.refreshStyles();

-        StreamStats.refreshStyles();
-    }
-
-    static getServerStats() {
-        STATES.currentStream.peerConnection && STATES.currentStream.peerConnection.getStats().then(stats => {
-            const allVideoCodecs: {[index: string]: RTCBasicStat} = {};
-            let videoCodecId;
-
-            const allAudioCodecs: {[index: string]: RTCBasicStat} = {};
-            let audioCodecId;
-
-            const allCandidates: {[index: string]: string} = {};
-            let candidateId;
-
-            stats.forEach((stat: RTCBasicStat) => {
-                if (stat.type === 'codec') {
-                    const mimeType = stat.mimeType.split('/');
-                    if (mimeType[0] === 'video') {
-                        // Store all video stats
-                        allVideoCodecs[stat.id] = stat;
-                    } else if (mimeType[0] === 'audio') {
-                        // Store all audio stats
-                        allAudioCodecs[stat.id] = stat;
-                    }
-                } else if (stat.type === 'inbound-rtp' && stat.packetsReceived > 0) {
-                    // Get the codecId of the video/audio track currently being used
-                    if (stat.kind === 'video') {
-                        videoCodecId = stat.codecId;
-                    } else if (stat.kind === 'audio') {
-                        audioCodecId = stat.codecId;
-                    }
-                } else if (stat.type === 'candidate-pair' && stat.packetsReceived > 0 && stat.state === 'succeeded') {
-                    candidateId = stat.remoteCandidateId;
-                } else if (stat.type === 'remote-candidate') {
-                    allCandidates[stat.id] = stat.address;
-                }
-            });
-
-            // Get video codec from codecId
-            if (videoCodecId) {
-                const videoStat = allVideoCodecs[videoCodecId];
-                const video: typeof StreamBadges.video = {
-                    codec: videoStat.mimeType.substring(6),
-                };
-
-                if (video.codec === 'H264') {
-                    const match = /profile-level-id=([0-9a-f]{6})/.exec(videoStat.sdpFmtpLine);
-                    video.profile = match ? match[1] : null;
-                }
-
-                StreamBadges.video = video;
-            }
-
-            // Get audio codec from codecId
-            if (audioCodecId) {
-                const audioStat = allAudioCodecs[audioCodecId];
-                StreamBadges.audio = {
-                    codec: audioStat.mimeType.substring(6),
-                    bitrate: audioStat.clockRate,
-                }
-            }
-
-            // Get server type
-            if (candidateId) {
-                BxLogger.info('candidate', candidateId, allCandidates);
-                StreamBadges.ipv6 = allCandidates[candidateId].includes(':');
-            }
-
-            if (getPref(PrefKey.STATS_SHOW_WHEN_PLAYING)) {
-                StreamStats.start();
-            }
-        });
+        document.documentElement.appendChild(this.#$container!);
    }

    static setupEvents() {
+        window.addEventListener(BxEvent.STREAM_LOADING, e => {
+            StreamStats.getInstance().#render();
+        });
+
        window.addEventListener(BxEvent.STREAM_PLAYING, e => {
            const PREF_STATS_QUICK_GLANCE = getPref(PrefKey.STATS_QUICK_GLANCE);
            const PREF_STATS_SHOW_WHEN_PLAYING = getPref(PrefKey.STATS_SHOW_WHEN_PLAYING);

-            StreamStats.getServerStats();
+            const streamStats = StreamStats.getInstance();
            // Setup Stat's Quick Glance mode
-            if (PREF_STATS_QUICK_GLANCE) {
-                StreamStats.quickGlanceSetup();
+
+            if (PREF_STATS_SHOW_WHEN_PLAYING) {
+                streamStats.start();
+            } else if (PREF_STATS_QUICK_GLANCE) {
+                streamStats.quickGlanceSetup();
                // Show stats bar
-                !PREF_STATS_SHOW_WHEN_PLAYING && StreamStats.start(true);
+                !PREF_STATS_SHOW_WHEN_PLAYING && streamStats.start(true);
            }
        });
    }
+
+    static refreshStyles() {
+        StreamStats.getInstance().refreshStyles();
+    }
 }
--- a/src/modules/stream/stream-ui.ts
+++ b/src/modules/stream/stream-ui.ts
@ -2,7 +2,6 @@ import { STATES } from "@utils/global.ts";
 import { createSvgIcon } from "@utils/html.ts";
 import { BxIcon } from "@utils/bx-icon";
 import { BxEvent } from "@utils/bx-event.ts";
-import { PrefKey, getPref } from "@utils/preferences.ts";
 import { t } from "@utils/translation.ts";
 import { StreamBadges } from "./stream-badges.ts";
 import { StreamStats } from "./stream-stats.ts";
@ -13,7 +12,7 @@ function cloneStreamHudButton($orgButton: HTMLElement, label: string, svgIcon: t
    let timeout: number | null;

    const onTransitionStart = (e: TransitionEvent) => {
-        if ( e.propertyName !== 'opacity') {
+        if (e.propertyName !== 'opacity') {
            return;
        }

@ -22,7 +21,7 @@ function cloneStreamHudButton($orgButton: HTMLElement, label: string, svgIcon: t
    };

    const onTransitionEnd = (e: TransitionEvent) => {
-        if ( e.propertyName !== 'opacity') {
+        if (e.propertyName !== 'opacity') {
            return;
        }

@ -54,6 +53,28 @@ function cloneStreamHudButton($orgButton: HTMLElement, label: string, svgIcon: t
 }


+function cloneCloseButton($$btnOrg: HTMLElement, icon: typeof BxIcon, className: string, onChange: any) {
+    // Create button from the Close button
+    const $btn = $$btnOrg.cloneNode(true) as HTMLElement;
+
+    // Refresh SVG
+    const $svg = createSvgIcon(icon);
+    // Copy classes
+    $svg.setAttribute('class', $btn.firstElementChild!.getAttribute('class') || '');
+    $svg.style.fill = 'none';
+
+    $btn.classList.add(className);
+    // Remove icon
+    $btn.removeChild($btn.firstElementChild!);
+    // Add icon
+    $btn.appendChild($svg);
+    // Add "click" event listener
+    $btn.addEventListener('click', onChange);
+
+    return $btn;
+}
+
+
 export function injectStreamMenuButtons() {
    const $screen = document.querySelector('#PageContent section[class*=PureScreens]');
    if (!$screen) {
@ -89,30 +110,14 @@ export function injectStreamMenuButtons() {

    let $btnStreamSettings: HTMLElement;
    let $btnStreamStats: HTMLElement;
+    const streamStats = StreamStats.getInstance();

-    const PREF_DISABLE_FEEDBACK_DIALOG = getPref(PrefKey.STREAM_DISABLE_FEEDBACK_DIALOG);
    const observer = new MutationObserver(mutationList => {
        mutationList.forEach(item => {
            if (item.type !== 'childList') {
                return;
            }

-            item.removedNodes.forEach($node => {
-                if (!$node || $node.nodeType !== Node.ELEMENT_NODE) {
-                    return;
-                }
-
-                if (!($node as HTMLElement).className || !($node as HTMLElement).className.startsWith) {
-                    return;
-                }
-
-                if (($node as HTMLElement).className.startsWith('StreamMenu')) {
-                    if (!document.querySelector('div[class^=PureInStreamConfirmationModal]')) {
-                        BxEvent.dispatch(window, BxEvent.STREAM_MENU_HIDDEN);
-                    }
-                }
-            });
-
            item.addedNodes.forEach(async $node => {
                if (!$node || $node.nodeType !== Node.ELEMENT_NODE) {
                    return;
@ -131,50 +136,34 @@ export function injectStreamMenuButtons() {
                    return;
                }

-                if (PREF_DISABLE_FEEDBACK_DIALOG && $elm.className.startsWith('PostStreamFeedbackScreen')) {
-                    const $btnClose = $elm.querySelector('button');
-                    $btnClose && $btnClose.click();
-                    return;
-                }
-
                // Render badges
                if ($elm.className?.startsWith('StreamMenu-module__container')) {
-                    BxEvent.dispatch(window, BxEvent.STREAM_MENU_SHOWN);
-
-                    const $btnCloseHud = document.querySelector('button[class*=StreamMenu-module__backButton]');
+                    const $btnCloseHud = document.querySelector('button[class*=StreamMenu-module__backButton]') as HTMLElement;
                    if (!$btnCloseHud) {
                        return;
                    }

                    // Hide Stream Settings dialog when closing HUD
-                    $btnCloseHud && $btnCloseHud.addEventListener('click', e => {
+                    $btnCloseHud.addEventListener('click', e => {
                        $settingsDialog.classList.add('bx-gone');
                    });

                    // Create Refresh button from the Close button
-                    const $btnRefresh = $btnCloseHud.cloneNode(true) as HTMLElement;
-
-                    // Refresh SVG
-                    const $svgRefresh = createSvgIcon(BxIcon.REFRESH);
-                    // Copy classes
-                    $svgRefresh.setAttribute('class', $btnRefresh.firstElementChild!.getAttribute('class') || '');
-                    $svgRefresh.style.fill = 'none';
-
-                    $btnRefresh.classList.add('bx-stream-refresh-button');
-                    // Remove icon
-                    $btnRefresh.removeChild($btnRefresh.firstElementChild!);
-                    // Add Refresh icon
-                    $btnRefresh.appendChild($svgRefresh);
-                    // Add "click" event listener
-                    $btnRefresh.addEventListener('click', e => {
+                    const $btnRefresh = cloneCloseButton($btnCloseHud, BxIcon.REFRESH, 'bx-stream-refresh-button', () => {
                        confirm(t('confirm-reload-stream')) && window.location.reload();
                    });
+
+                    const $btnHome = cloneCloseButton($btnCloseHud, BxIcon.HOME, 'bx-stream-home-button', () => {
+                        confirm(t('back-to-home-confirm')) && (window.location.href = window.location.href.substring(0, 31));
+                    });
+
                    // Add to website
                    $btnCloseHud.insertAdjacentElement('afterend', $btnRefresh);
+                    $btnRefresh.insertAdjacentElement('afterend', $btnHome);

                    // Render stream badges
                    const $menu = document.querySelector('div[class*=StreamMenu-module__menuContainer] > div[class*=Menu-module]');
-                    $menu?.appendChild(await StreamBadges.render());
+                    $menu?.appendChild(await StreamBadges.getInstance().render());

                    hideSettingsFunc();
                    return;
@ -234,14 +223,14 @@ export function injectStreamMenuButtons() {
                        e.preventDefault();

                        // Toggle Stream Stats
-                        StreamStats.toggle();
+                        streamStats.toggle();

-                        const btnStreamStatsOn = (!StreamStats.isHidden() && !StreamStats.isGlancing());
+                        const btnStreamStatsOn = (!streamStats.isHidden() && !streamStats.isGlancing());
                        $btnStreamStats.classList.toggle('bx-stream-menu-button-on', btnStreamStatsOn);
                    });
                }

-                const btnStreamStatsOn = (!StreamStats.isHidden() && !StreamStats.isGlancing());
+                const btnStreamStatsOn = (!streamStats.isHidden() && !streamStats.isGlancing());
                $btnStreamStats.classList.toggle('bx-stream-menu-button-on', btnStreamStatsOn);

                if ($orgButton) {
--- a/src/modules/ui/global-settings.ts
+++ b/src/modules/ui/global-settings.ts
@ -31,11 +31,11 @@ const SETTINGS_UI = {
            PrefKey.BITRATE_VIDEO_MAX,

            PrefKey.AUDIO_ENABLE_VOLUME_CONTROL,
-            PrefKey.AUDIO_MIC_ON_PLAYING,
            PrefKey.STREAM_DISABLE_FEEDBACK_DIALOG,

            PrefKey.SCREENSHOT_APPLY_FILTERS,

+            PrefKey.AUDIO_MIC_ON_PLAYING,
            PrefKey.GAME_FORTNITE_FORCE_CONSOLE,
            PrefKey.STREAM_COMBINE_SOURCES,
        ],
@ -55,7 +55,7 @@ const SETTINGS_UI = {

    [t('mouse-and-keyboard')]: {
        items: [
-            PrefKey.NATIVE_MKB_DISABLED,
+            PrefKey.NATIVE_MKB_ENABLED,
            PrefKey.MKB_ENABLED,
            PrefKey.MKB_HIDE_IDLE_CURSOR,
        ],
@ -375,7 +375,7 @@ export function setupSettingsUi() {
    $btnReload = createButton({
        label: t('settings-reload'),
        classes: ['bx-settings-reload-button'],
-        style: ButtonStyle.FOCUSABLE | ButtonStyle.FULL_WIDTH,
+        style: ButtonStyle.FOCUSABLE | ButtonStyle.FULL_WIDTH | ButtonStyle.TALL,
        onClick: e => {
            window.location.reload();
            $btnReload.disabled = true;
--- a/src/modules/ui/guide-menu.ts
+++ b/src/modules/ui/guide-menu.ts
@ -0,0 +1,80 @@
+import { BxEvent } from "@/utils/bx-event";
+import { AppInterface, STATES } from "@/utils/global";
+import { createButton, ButtonStyle } from "@/utils/html";
+import { t } from "@/utils/translation";
+
+export enum GuideMenuTab {
+    HOME,
+}
+
+export class GuideMenu {
+    static #injectHome($root: HTMLElement) {
+        // Find the last divider
+        const $dividers = $root.querySelectorAll('div[class*=Divider-module__divider]');
+        if (!$dividers) {
+            return;
+        }
+        const $lastDivider = $dividers[$dividers.length - 1];
+
+        // Add "Close app" button
+        if (AppInterface) {
+            const $btnQuit = createButton({
+                label: t('close-app'),
+                style: ButtonStyle.FULL_WIDTH | ButtonStyle.FOCUSABLE | ButtonStyle.DANGER,
+                onClick: e => {
+                    AppInterface.closeApp();
+                },
+            });
+
+            $lastDivider.insertAdjacentElement('afterend', $btnQuit);
+        }
+    }
+
+    static #injectHomePlaying($root: HTMLElement) {
+        const $btnQuit = $root.querySelector('a[class*=QuitGameButton]');
+        if (!$btnQuit) {
+            return;
+        }
+
+        // Add buttons
+        const $btnReload = createButton({
+            label: t('reload-stream'),
+            style: ButtonStyle.FULL_WIDTH | ButtonStyle.FOCUSABLE,
+            onClick: e => {
+                confirm(t('confirm-reload-stream')) && window.location.reload();
+            },
+        });
+
+        const $btnHome = createButton({
+            label: t('back-to-home'),
+            style: ButtonStyle.FULL_WIDTH | ButtonStyle.FOCUSABLE,
+            onClick: e => {
+                confirm(t('back-to-home-confirm')) && (window.location.href = window.location.href.substring(0, 31));
+            },
+        });
+
+        $btnQuit.insertAdjacentElement('afterend', $btnReload);
+        $btnReload.insertAdjacentElement('afterend', $btnHome);
+
+        // Hide xCloud's Home button
+        const $btnXcloudHome = $root.querySelector('div[class^=HomeButtonWithDivider]') as HTMLElement;
+        $btnXcloudHome && ($btnXcloudHome.style.display = 'none');
+    }
+
+    static async #onShown(e: Event) {
+        const where = (e as any).where as GuideMenuTab;
+
+        if (where === GuideMenuTab.HOME) {
+            const $root = document.querySelector('#gamepass-dialog-root div[role=dialog]') as HTMLElement;
+            if (STATES.isPlaying) {
+                GuideMenu.#injectHomePlaying($root);
+            } else {
+                GuideMenu.#injectHome($root);
+            }
+        }
+    }
+
+    static observe() {
+        window.addEventListener(BxEvent.XCLOUD_GUIDE_MENU_SHOWN, GuideMenu.#onShown);
+    }
+}
--- a/src/modules/ui/ui.ts
+++ b/src/modules/ui/ui.ts
@ -1,4 +1,4 @@
-import { STATES } from "@utils/global";
+import { AppInterface, STATES } from "@utils/global";
 import { CE, createButton, ButtonStyle, createSvgIcon } from "@utils/html";
 import { BxIcon } from "@utils/bx-icon";
 import { UserAgent } from "@utils/user-agent";
@ -12,6 +12,7 @@ import { VibrationManager } from "@modules/vibration-manager";
 import { Screenshot } from "@/utils/screenshot";
 import { ControllerShortcut } from "../controller-shortcut";
 import { SoundShortcut } from "../shortcuts/shortcut-sound";
+import { NativeMkbHandler } from "../mkb/native-mkb-handler";


 export function localRedirect(path: string) {
@ -72,19 +73,6 @@ function setupStreamSettingsDialog() {
    const isSafari = UserAgent.isSafari();

    const SETTINGS_UI = [
-        getPref(PrefKey.MKB_ENABLED) && {
-            icon: BxIcon.MOUSE,
-            group: 'mkb',
-            items: [
-                {
-                    group: 'mkb',
-                    label: t('mouse-and-keyboard'),
-                    help_url: 'https://better-xcloud.github.io/mouse-and-keyboard/',
-                    content: MkbRemapper.INSTANCE.render(),
-                },
-            ],
-        },
-
        {
            icon: BxIcon.DISPLAY,
            group: 'stream',
@ -241,6 +229,44 @@ function setupStreamSettingsDialog() {
            ],
        },

+        getPref(PrefKey.MKB_ENABLED) && {
+            icon: BxIcon.VIRTUAL_CONTROLLER,
+            group: 'mkb',
+            items: [
+                {
+                    group: 'mkb',
+                    label: t('virtual-controller'),
+                    help_url: 'https://better-xcloud.github.io/mouse-and-keyboard/',
+                    content: MkbRemapper.INSTANCE.render(),
+                },
+            ],
+        },
+
+        AppInterface && getPref(PrefKey.NATIVE_MKB_ENABLED) === 'on' && {
+            icon: BxIcon.NATIVE_MKB,
+            group: 'native-mkb',
+            items: [
+                {
+                    group: 'native-mkb',
+                    label: t('native-mkb'),
+                    items: [
+                        {
+                            pref: PrefKey.NATIVE_MKB_SCROLL_VERTICAL_SENSITIVITY,
+                            onChange: (e: any, value: number) => {
+                                NativeMkbHandler.getInstance().setVerticalScrollMultiplier(value / 100);
+                            },
+                        },
+                        {
+                            pref: PrefKey.NATIVE_MKB_SCROLL_HORIZONTAL_SENSITIVITY,
+                            onChange: (e: any, value: number) => {
+                                NativeMkbHandler.getInstance().setHorizontalScrollMultiplier(value / 100);
+                            },
+                        },
+                    ],
+                },
+            ],
+        },
+
        {
            icon: BxIcon.COMMAND,
            group: 'shortcuts',
@ -268,7 +294,8 @@ function setupStreamSettingsDialog() {
                        {
                            pref: PrefKey.STATS_QUICK_GLANCE,
                            onChange: (e: InputEvent) => {
-                                (e.target! as HTMLInputElement).checked ? StreamStats.quickGlanceSetup() : StreamStats.quickGlanceStop();
+                                const streamStats = StreamStats.getInstance();
+                                (e.target! as HTMLInputElement).checked ? streamStats.quickGlanceSetup() : streamStats.quickGlanceStop();
                            },
                        },
                        {
@ -485,13 +512,13 @@ function resizeVideoPlayer() {
        }

        // Prevent floating points
-        width = Math.floor(width);
-        height = Math.floor(height);
+        width = Math.min(parentRect.width, Math.ceil(width));
+        height = Math.min(parentRect.height, Math.ceil(height));

        // Update size
        $video.style.width = `${width}px`;
        $video.style.height = `${height}px`;
-        $video.style.objectFit = 'fill';
+        $video.style.objectFit = PREF_RATIO === '16:9' ? 'contain' : 'fill';
    } else {
        $video.style.width = '100%';
        $video.style.height = '100%';
@ -520,7 +547,6 @@ export function setupStreamUi() {

        window.addEventListener('resize', updateVideoPlayerCss);
        setupStreamSettingsDialog();
-        StreamStats.render();

        Screenshot.setup();
    }
--- a/src/types/index.d.ts
+++ b/src/types/index.d.ts
@ -59,6 +59,7 @@ type XcloudTitleInfo = {
    details: {
        productId: string;
        supportedInputTypes: InputType[];
+        supportedTabs: any[];
        hasTouchSupport: boolean;
        hasFakeTouchSupport: boolean;
        hasMkbSupport: boolean;
@ -74,3 +75,19 @@ type XcloudTitleInfo = {
 declare module '*.js';
 declare module '*.svg';
 declare module '*.styl';
+
+type MkbMouseMove = {
+    movementX: number;
+    movementY: number;
+}
+
+type MkbMouseClick = {
+    pointerButton?: number,
+    mouseButton?: number,
+    pressed: boolean,
+}
+
+type MkbMouseWheel = {
+    vertical: number;
+    horizontal: number;
+}
--- a/src/types/preferences.d.ts
+++ b/src/types/preferences.d.ts
@ -6,7 +6,7 @@ export type PreferenceSetting = {
    note?: string | HTMLElement;
    type?: SettingElementType;
    ready?: (setting: PreferenceSetting) => void;
-    migrate?: (savedPrefs: any, value: any) => {};
+    migrate?: (this: Preferences, savedPrefs: any, value: any) => void;
    min?: number;
    max?: number;
    steps?: number;
--- a/src/utils/bx-event.ts
+++ b/src/utils/bx-event.ts
@ -13,9 +13,6 @@ export enum BxEvent {
    STREAM_STOPPED = 'bx-stream-stopped',
    STREAM_ERROR_PAGE = 'bx-stream-error-page',

-    STREAM_MENU_SHOWN = 'bx-stream-menu-shown',
-    STREAM_MENU_HIDDEN = 'bx-stream-menu-hidden',
-
    STREAM_WEBRTC_CONNECTED = 'bx-stream-webrtc-connected',
    STREAM_WEBRTC_DISCONNECTED = 'bx-stream-webrtc-disconnected',

@ -38,9 +35,16 @@ export enum BxEvent {
    CAPTURE_SCREENSHOT = 'bx-capture-screenshot',
    GAINNODE_VOLUME_CHANGED = 'bx-gainnode-volume-changed',

+    POINTER_LOCK_REQUESTED = 'bx-pointer-lock-requested',
+    POINTER_LOCK_EXITED = 'bx-pointer-lock-exited',
+
    // xCloud Dialog events
    XCLOUD_DIALOG_SHOWN = 'bx-xcloud-dialog-shown',
    XCLOUD_DIALOG_DISMISSED = 'bx-xcloud-dialog-dismissed',
+
+    XCLOUD_GUIDE_MENU_SHOWN = 'bx-xcloud-guide-menu-shown',
+
+    XCLOUD_POLLING_MODE_CHANGED = 'bx-xcloud-polling-mode-changed',
 }

 export enum XcloudEvent {
--- a/src/utils/bx-exposed.ts
+++ b/src/utils/bx-exposed.ts
@ -1,10 +1,9 @@
 import { ControllerShortcut } from "@/modules/controller-shortcut";
-import { GameBar } from "@modules/game-bar/game-bar";
 import { BxEvent } from "@utils/bx-event";
 import { STATES } from "@utils/global";
 import { getPref, PrefKey } from "@utils/preferences";
-import { UserAgent } from "@utils/user-agent";
 import { BxLogger } from "./bx-logger";
+import { BX_FLAGS } from "./bx-flags";

 export enum InputType {
    CONTROLLER = 'Controller',
@ -16,23 +15,6 @@ export enum InputType {
 }

 export const BxExposed = {
-    // Enable/disable Game Bar when playing/pausing
-    onPollingModeChanged: (mode: 'All' | 'None') => {
-        if (getPref(PrefKey.GAME_BAR_POSITION) === 'off') {
-            return;
-        }
-
-        const gameBar = GameBar.getInstance();
-
-        if (!STATES.isPlaying) {
-            gameBar.disable();
-            return;
-        }
-
-        // Toggle Game bar
-        mode !== 'None' ? gameBar.disable() : gameBar.enable();
-    },
-
    getTitleInfo: () => STATES.currentStream.titleInfo,

    modifyTitleInfo: (titleInfo: XcloudTitleInfo): XcloudTitleInfo => {
@ -41,8 +23,12 @@ export const BxExposed = {

        let supportedInputTypes = titleInfo.details.supportedInputTypes;

+        if (BX_FLAGS.ForceNativeMkbTitles.includes(titleInfo.details.productId)) {
+            supportedInputTypes.push(InputType.MKB);
+        }
+
        // Remove native MKB support on mobile browsers or by user's choice
-        if (getPref(PrefKey.NATIVE_MKB_DISABLED) || UserAgent.isMobile()) {
+        if (getPref(PrefKey.NATIVE_MKB_ENABLED) === 'off') {
            supportedInputTypes = supportedInputTypes.filter(i => i !== InputType.MKB);
        }

@ -66,11 +52,11 @@ export const BxExposed = {
                gamepadFound && (touchControllerAvailability = 'off');
            }

-
-
            if (touchControllerAvailability === 'off') {
                // Disable touch on all games (not native touch)
                supportedInputTypes = supportedInputTypes.filter(i => i !== InputType.CUSTOM_TOUCH_OVERLAY && i !== InputType.GENERIC_TOUCH);
+                // Empty TABs
+                titleInfo.details.supportedTabs = [];
            }

            // Pre-check supported input types
--- a/src/utils/bx-flags.ts
+++ b/src/utils/bx-flags.ts
@ -1,12 +1,14 @@
-type BxFlags = {
-    CheckForUpdate?: boolean;
-    PreloadRemotePlay?: boolean;
-    PreloadUi?: boolean;
-    EnableXcloudLogging?: boolean;
-    SafariWorkaround?: boolean;
+type BxFlags = Partial<{
+    CheckForUpdate: boolean;
+    PreloadRemotePlay: boolean;
+    PreloadUi: boolean;
+    EnableXcloudLogging: boolean;
+    SafariWorkaround: boolean;

-    UseDevTouchLayout?: boolean;
-}
+    UseDevTouchLayout: boolean;
+
+    ForceNativeMkbTitles: string[];
+}>

 // Setup flags
 const DEFAULT_FLAGS: BxFlags = {
@ -17,6 +19,8 @@ const DEFAULT_FLAGS: BxFlags = {
    SafariWorkaround: true,

    UseDevTouchLayout: false,
+
+    ForceNativeMkbTitles: [],
 }

 export const BX_FLAGS = Object.assign(DEFAULT_FLAGS, window.BX_FLAGS || {});
--- a/src/utils/bx-icon.ts
+++ b/src/utils/bx-icon.ts
@ -3,8 +3,8 @@ import iconController from "@assets/svg/controller.svg" with { type: "text" };
 import iconCopy from "@assets/svg/copy.svg" with { type: "text" };
 import iconCursorText from "@assets/svg/cursor-text.svg" with { type: "text" };
 import iconDisplay from "@assets/svg/display.svg" with { type: "text" };
-import iconMouseSettings from "@assets/svg/mouse-settings.svg" with { type: "text" };
-import iconMouse from "@assets/svg/mouse.svg" with { type: "text" };
+import iconHome from "@assets/svg/home.svg" with { type: "text" };
+import iconNativeMkb from "@assets/svg/native-mkb.svg" with { type: "text" };
 import iconNew from "@assets/svg/new.svg" with { type: "text" };
 import iconQuestion from "@assets/svg/question.svg" with { type: "text" };
 import iconRefresh from "@assets/svg/refresh.svg" with { type: "text" };
@ -14,6 +14,7 @@ import iconStreamStats from "@assets/svg/stream-stats.svg" with { type: "text" }
 import iconTrash from "@assets/svg/trash.svg" with { type: "text" };
 import iconTouchControlEnable from "@assets/svg/touch-control-enable.svg" with { type: "text" };
 import iconTouchControlDisable from "@assets/svg/touch-control-disable.svg" with { type: "text" };
+import iconVirtualController from "@assets/svg/virtual-controller.svg" with { type: "text" };

 // Game Bar
 import iconCaretLeft from "@assets/svg/caret-left.svg" with { type: "text" };
@ -22,20 +23,30 @@ import iconCamera from "@assets/svg/camera.svg" with { type: "text" };
 import iconMicrophone from "@assets/svg/microphone.svg" with { type: "text" };
 import iconMicrophoneMuted from "@assets/svg/microphone-slash.svg" with { type: "text" };

+// Stream Badge
+import iconBatteryFull from "@assets/svg/battery-full.svg" with { type: "text" };
+import iconClock from "@assets/svg/clock.svg" with { type: "text" };
+import iconCloud from "@assets/svg/cloud.svg" with { type: "text" };
+import iconDownload from "@assets/svg/download.svg" with { type: "text" };
+import iconSpeakerHigh from "@assets/svg/speaker-high.svg" with { type: "text" };
+import iconUpload from "@assets/svg/upload.svg" with { type: "text" };
+
+
 export const BxIcon = {
    STREAM_SETTINGS: iconStreamSettings,
    STREAM_STATS: iconStreamStats,
    COMMAND: iconCommand,
    CONTROLLER: iconController,
    DISPLAY: iconDisplay,
-    MOUSE: iconMouse,
-    MOUSE_SETTINGS: iconMouseSettings,
+    HOME: iconHome,
+    NATIVE_MKB: iconNativeMkb,
    NEW: iconNew,
    COPY: iconCopy,
    TRASH: iconTrash,
    CURSOR_TEXT: iconCursorText,
    QUESTION: iconQuestion,
    REFRESH: iconRefresh,
+    VIRTUAL_CONTROLLER: iconVirtualController,

    REMOTE_PLAY: iconRemotePlay,

@ -48,4 +59,12 @@ export const BxIcon = {

    MICROPHONE: iconMicrophone,
    MICROPHONE_MUTED: iconMicrophoneMuted,
+
+    // Stream Badge
+    BATTERY: iconBatteryFull,
+    PLAYTIME: iconClock,
+    SERVER: iconCloud,
+    DOWNLOAD: iconDownload,
+    UPLOAD: iconUpload,
+    AUDIO: iconSpeakerHigh,
 } as const;
--- a/src/utils/css.ts
+++ b/src/utils/css.ts
@ -6,11 +6,14 @@ import { renderStylus } from "@macros/build" with {type: "macro"};
 export function addCss() {
    let css = renderStylus();

-    // Hide "Play with friends" section
    if (getPref(PrefKey.BLOCK_SOCIAL_FEATURES)) {
        css += `
+/* Hide "Play with friends" section */
 div[class^=HomePage-module__bottomSpacing]:has(button[class*=SocialEmptyCard]),
-button[class*=SocialEmptyCard] {
+button[class*=SocialEmptyCard],
+/* Hide "Start a party" button in the Guide menu */
+#gamepass-dialog-root div[class^=AchievementsPreview-module__container] + button[class*=HomeLandingPage-module__button]
+{
    display: none;
 }
 `;
@ -54,12 +57,13 @@ div[class*=StreamHUD-module__buttonsContainer] {
 `;
    }

-    // Simplify Stream's menu
    css += `
 div[class*=StreamMenu-module__menu] {
    min-width: 100vw !important;
 }
 `;
+
+    // Simplify Stream's menu
    if (getPref(PrefKey.STREAM_SIMPLIFY_MENU)) {
        css += `
 div[class*=Menu-module__scrollable] {
--- a/src/utils/gamepad.ts
+++ b/src/utils/gamepad.ts
@ -1,4 +1,4 @@
-import { MkbHandler } from "@modules/mkb/mkb-handler";
+import { EmulatedMkbHandler } from "@modules/mkb/mkb-handler";
 import { PrefKey, getPref } from "@utils/preferences";
 import { t } from "@utils/translation";
 import { Toast } from "@utils/toast";
@ -7,7 +7,7 @@ import { BxLogger } from "@utils/bx-logger";
 // Show a toast when connecting/disconecting controller
 export function showGamepadToast(gamepad: Gamepad) {
    // Don't show Toast for virtual controller
-    if (gamepad.id === MkbHandler.VIRTUAL_GAMEPAD_ID) {
+    if (gamepad.id === EmulatedMkbHandler.VIRTUAL_GAMEPAD_ID) {
        return;
    }

--- a/src/utils/gamepass-gallery.ts
+++ b/src/utils/gamepass-gallery.ts
@ -1,4 +1,5 @@
 export enum GamePassCloudGallery {
-    TOUCH = '9c86f07a-f3e8-45ad-82a0-a1f759597059',
    ALL = '29a81209-df6f-41fd-a528-2ae6b91f719c',
+    NATIVE_MKB = '8fa264dd-124f-4af3-97e8-596fcdf4b486',
+    TOUCH = '9c86f07a-f3e8-45ad-82a0-a1f759597059',
 }
--- a/src/utils/html.ts
+++ b/src/utils/html.ts
@ -1,7 +1,7 @@
 import type { BxIcon } from "@utils/bx-icon";

 type BxButton = {
-    style?: number | string;
+    style?: number | string | ButtonStyle;
    url?: string;
    classes?: string[];
    icon?: typeof BxIcon;
@ -67,6 +67,7 @@ ButtonStyle[ButtonStyle.GHOST = 4] = 'bx-ghost';
 ButtonStyle[ButtonStyle.FOCUSABLE = 8] = 'bx-focusable';
 ButtonStyle[ButtonStyle.FULL_WIDTH = 16] = 'bx-full-width';
 ButtonStyle[ButtonStyle.FULL_HEIGHT = 32] = 'bx-full-height';
+ButtonStyle[ButtonStyle.TALL = 64] = 'bx-tall';

 const ButtonStyleIndices = Object.keys(ButtonStyle).splice(0, Object.keys(ButtonStyle).length / 2).map(i => parseInt(i));

--- a/src/utils/monkey-patches.ts
+++ b/src/utils/monkey-patches.ts
@ -103,7 +103,7 @@ export function patchRtcPeerConnection() {
        try {
            const maxVideoBitrate = getPref(PrefKey.BITRATE_VIDEO_MAX);
            if (maxVideoBitrate > 0) {
-                arguments[0].sdp = patchSdpBitrate(arguments[0].sdp, maxVideoBitrate * 1000);
+                arguments[0].sdp = patchSdpBitrate(arguments[0].sdp, Math.round(maxVideoBitrate / 1000));
            }
        } catch (e) {
            BxLogger.error('setLocalDescription', e);
@ -219,3 +219,44 @@ export function patchCanvasContext() {
        return nativeGetContext.apply(this, [contextType, contextAttributes]);
    }
 }
+
+
+export function patchPointerLockApi() {
+    Object.defineProperty(document, 'fullscreenElement', {
+        configurable: true,
+        get() {
+            return document.documentElement;
+        },
+    });
+
+    HTMLElement.prototype.requestFullscreen = function(options?: FullscreenOptions): Promise<void> {
+        return Promise.resolve();
+    }
+
+    let pointerLockElement: unknown = null;
+    Object.defineProperty(document, 'pointerLockElement', {
+        configurable: true,
+        get() {
+            return pointerLockElement;
+        },
+    });
+
+    // const nativeRequestPointerLock = HTMLElement.prototype.requestPointerLock;
+    HTMLElement.prototype.requestPointerLock = function() {
+        pointerLockElement = document.documentElement;
+        window.dispatchEvent(new Event(BxEvent.POINTER_LOCK_REQUESTED));
+        // document.dispatchEvent(new Event('pointerlockchange'));
+
+        // @ts-ignore
+        // nativeRequestPointerLock.apply(this, arguments);
+    }
+
+    // const nativeExitPointerLock = Document.prototype.exitPointerLock;
+    Document.prototype.exitPointerLock = function() {
+        pointerLockElement = null;
+        window.dispatchEvent(new Event(BxEvent.POINTER_LOCK_EXITED));
+        // document.dispatchEvent(new Event('pointerlockchange'));
+
+        // nativeExitPointerLock.apply(this);
+    }
+}
--- a/src/utils/network.ts
+++ b/src/utils/network.ts
@ -9,7 +9,6 @@ import { STATES } from "@utils/global";
 import { getPreferredServerRegion } from "@utils/region";
 import { GamePassCloudGallery } from "./gamepass-gallery";
 import { InputType } from "./bx-exposed";
-import { UserAgent } from "./user-agent";

 enum RequestType {
    XCLOUD = 'xcloud',
@ -366,14 +365,15 @@ class XcloudInterceptor {
        const url = (typeof request === 'string') ? request : (request as Request).url;
        const parsedUrl = new URL(url);

-        StreamBadges.region = parsedUrl.host.split('.', 1)[0];
+        let badgeRegion: string = parsedUrl.host.split('.', 1)[0];
        for (let regionName in STATES.serverRegions) {
            const region = STATES.serverRegions[regionName];
            if (parsedUrl.origin == region.baseUri) {
-                StreamBadges.region = regionName;
+                badgeRegion = regionName;
                break;
            }
        }
+        StreamBadges.getInstance().setRegion(badgeRegion);

        const clone = (request as Request).clone();
        const body = await clone.json();
@ -438,12 +438,21 @@ class XcloudInterceptor {
        overrides.inputConfiguration = overrides.inputConfiguration || {};
        overrides.inputConfiguration.enableVibration = true;

-        if (getPref(PrefKey.NATIVE_MKB_DISABLED) || UserAgent.isMobile()) {
+        let overrideMkb: boolean | null = null;
+
+        if (getPref(PrefKey.NATIVE_MKB_ENABLED) === 'on' || BX_FLAGS.ForceNativeMkbTitles.includes(STATES.currentStream.titleInfo!.details.productId)) {
+            overrideMkb = true;
+        }
+
+        if (getPref(PrefKey.NATIVE_MKB_ENABLED) === 'off') {
+            overrideMkb = false;
+        }
+
+        if (overrideMkb !== null) {
            overrides.inputConfiguration = Object.assign(overrides.inputConfiguration, {
-                    enableMouseInput: false,
-                    enableAbsoluteMouse: false,
-                    enableKeyboardInput: false,
-                });
+                enableMouseInput: overrideMkb,
+                enableKeyboardInput: overrideMkb,
+            });
        }

        overrides.videoConfiguration = overrides.videoConfiguration || {};
@ -613,6 +622,21 @@ export function interceptHttpRequests() {
            return response;
        }

+        if (BX_FLAGS.ForceNativeMkbTitles && url.includes('catalog.gamepass.com/sigls/') && url.includes(GamePassCloudGallery.NATIVE_MKB)) {
+            const response = await NATIVE_FETCH(request, init);
+            const obj = await response.clone().json();
+
+            try {
+                const newCustomList = BX_FLAGS.ForceNativeMkbTitles.map((item: string) => ({ id: item }));
+                obj.push(...newCustomList);
+            } catch (e) {
+                console.log(e);
+            }
+
+            response.json = () => Promise.resolve(obj);
+            return response;
+        }
+
        let requestType: RequestType;
        if (url.includes('/sessions/home') || url.includes('xhome.') || (STATES.remotePlay.isPlaying && url.endsWith('/inputconfigs'))) {
            requestType = RequestType.XHOME;
--- a/src/utils/preferences.ts
+++ b/src/utils/preferences.ts
@ -1,10 +1,10 @@
 import { CE } from "@utils/html";
 import { SUPPORTED_LANGUAGES, t } from "@utils/translation";
 import { SettingElement, SettingElementType } from "@utils/settings";
-import { UserAgentProfile } from "@utils/user-agent";
+import { UserAgent, UserAgentProfile } from "@utils/user-agent";
 import { StreamStat } from "@modules/stream/stream-stats";
 import type { PreferenceSetting, PreferenceSettings } from "@/types/preferences";
-import { STATES } from "@utils/global";
+import { AppInterface, STATES } from "@utils/global";

 export enum PrefKey {
    LAST_UPDATE_CHECK = 'version_last_check',
@ -44,7 +44,10 @@ export enum PrefKey {
    CONTROLLER_DEVICE_VIBRATION = 'controller_device_vibration',
    CONTROLLER_VIBRATION_INTENSITY = 'controller_vibration_intensity',

-    NATIVE_MKB_DISABLED = 'native_mkb_disabled',
+    NATIVE_MKB_ENABLED = 'native_mkb_enabled',
+    NATIVE_MKB_SCROLL_HORIZONTAL_SENSITIVITY = 'native_mkb_scroll_x_sensitivity',
+    NATIVE_MKB_SCROLL_VERTICAL_SENSITIVITY = 'native_mkb_scroll_y_sensitivity',
+
    MKB_ENABLED = 'mkb_enabled',
    MKB_HIDE_IDLE_CURSOR = 'mkb_hide_idle_cursor',
    MKB_ABSOLUTE_MOUSE = 'mkb_absolute_mouse',
@ -325,21 +328,30 @@ export class Preferences {
            note: '⚠️ ' + t('unexpected-behavior'),
            default: 0,
            min: 0,
-            max: 14,
-            steps: 1,
+            max: 14 * 1024 * 1000,
+            steps: 100 * 1024,
            params: {
-                suffix: ' Mb/s',
-                exactTicks: 5,
+                exactTicks:  5 * 1024 * 1000,
                customTextValue: (value: any) => {
                    value = parseInt(value);

                    if (value === 0) {
                        return t('unlimited');
+                    } else {
+                        return (value / (1024 * 1000)).toFixed(1) + ' Mb/s';
                    }
-
-                    return null;
                },
            },
+            migrate: function(savedPrefs: any, value: any) {
+                try {
+                    value = parseInt(value);
+                    if (value !== 0 && value < 100) {
+                        value *= 1024 * 1000;
+                    }
+                    this.set(PrefKey.BITRATE_VIDEO_MAX, value, true);
+                    savedPrefs[PrefKey.BITRATE_VIDEO_MAX] = value;
+                } catch (e) {}
+            },
        },

        [PrefKey.GAME_BAR_POSITION]: {
@ -405,7 +417,7 @@ export class Preferences {
            default: false,
            unsupported: ((): string | boolean => {
                const userAgent = ((window.navigator as any).orgUserAgent || window.navigator.userAgent || '').toLowerCase();
-                return userAgent.match(/(android|iphone|ipad)/) ? t('browser-unsupported-feature') : false;
+                return !AppInterface && userAgent.match(/(android|iphone|ipad)/) ? t('browser-unsupported-feature') : false;
            })(),
            ready: (setting: PreferenceSetting) => {
                let note;
@ -425,9 +437,64 @@ export class Preferences {
            },
        },

-        [PrefKey.NATIVE_MKB_DISABLED]: {
-            label: t('disable-native-mkb'),
-            default: false,
+        [PrefKey.NATIVE_MKB_ENABLED]: {
+            label: t('native-mkb'),
+            default: 'default',
+            options: {
+                default: t('default'),
+                on: t('on'),
+                off: t('off'),
+            },
+            ready: (setting: PreferenceSetting) => {
+                if (AppInterface) {
+
+                } else if (UserAgent.isMobile()) {
+                    setting.unsupported = true;
+                    setting.default = 'off';
+                    delete setting.options!['default'];
+                    delete setting.options!['on'];
+                } else {
+                    delete setting.options!['on'];
+                }
+            },
+        },
+
+        [PrefKey.NATIVE_MKB_SCROLL_HORIZONTAL_SENSITIVITY]: {
+            label: t('horizontal-scroll-sensitivity'),
+            type: SettingElementType.NUMBER_STEPPER,
+            default: 0,
+            min: 0,
+            max: 100 * 100,
+            steps: 10,
+            params: {
+                exactTicks: 20 * 100,
+                customTextValue: (value: any) => {
+                    if (!value) {
+                        return t('default');
+                    }
+
+                    return (value / 100).toFixed(1) + 'x';
+                },
+            },
+        },
+
+        [PrefKey.NATIVE_MKB_SCROLL_VERTICAL_SENSITIVITY]: {
+            label: t('vertical-scroll-sensitivity'),
+            type: SettingElementType.NUMBER_STEPPER,
+            default: 0,
+            min: 0,
+            max: 100 * 100,
+            steps: 10,
+            params: {
+                exactTicks: 20 * 100,
+                customTextValue: (value: any) => {
+                    if (!value) {
+                        return t('default');
+                    }
+
+                    return (value / 100).toFixed(1) + 'x';
+                },
+            },
        },

        [PrefKey.MKB_DEFAULT_PRESET_ID]: {
@ -689,11 +756,12 @@ export class Preferences {

        for (let settingId in Preferences.SETTINGS) {
            const setting = Preferences.SETTINGS[settingId];
-            setting.ready && setting.ready.call(this, setting);

            if (setting.migrate && settingId in savedPrefs) {
                setting.migrate.call(this, savedPrefs, savedPrefs[settingId]);
            }
+
+            setting.ready && setting.ready.call(this, setting);
        }

        for (let settingId in Preferences.SETTINGS) {
@ -704,7 +772,7 @@ export class Preferences {
                continue;
            }

-            // Ignore deprecated settings
+            // Ignore deprecated/migrated settings
            if (setting.migrate) {
                continue;
            }
@ -771,11 +839,11 @@ export class Preferences {
        return this.#prefs[key];
    }

-    set(key: PrefKey, value: any): any {
+    set(key: PrefKey, value: any, skipSave?: boolean): any {
        value = this.#validateValue(key, value);

        this.#prefs[key] = value;
-        this.#updateStorage();
+        !skipSave && this.#updateStorage();

        return value;
    }
--- a/src/utils/preload-state.ts
+++ b/src/utils/preload-state.ts
@ -3,6 +3,7 @@ import { BxLogger } from "./bx-logger";
 import { TouchController } from "@modules/touch-controller";
 import { GamePassCloudGallery } from "./gamepass-gallery";
 import { getPref, PrefKey } from "./preferences";
+import { BX_FLAGS } from "./bx-flags";

 const LOG_TAG = 'PreloadState';

@ -37,6 +38,12 @@ export function overridePreloadState() {
                        // Add to the official list
                        sigls[GamePassCloudGallery.TOUCH]?.data.products.push(...customList);
                    }
+
+                    if (BX_FLAGS.ForceNativeMkbTitles && GamePassCloudGallery.NATIVE_MKB in sigls) {
+                        // Add to the official list
+                        sigls[GamePassCloudGallery.NATIVE_MKB]?.data.products.push(...BX_FLAGS.ForceNativeMkbTitles);
+                    }
+
                } catch (e) {
                    BxLogger.error(LOG_TAG, e);
                }
--- a/src/utils/translation.ts
+++ b/src/utils/translation.ts
@ -3,8 +3,9 @@ import { NATIVE_FETCH } from "./bx-flags";
 export const SUPPORTED_LANGUAGES = {
    'en-US': 'English (United States)',

-    'en-ID': 'Bahasa Indonesia',
+    'ca-CA': 'Català',
    'de-DE': 'Deutsch',
+    'en-ID': 'Bahasa Indonesia',
    'es-ES': 'español (España)',
    'fr-FR': 'français',
    'it-IT': 'italiano',
@ -29,6 +30,8 @@ const Texts = {
    "apply": "Apply",
    "audio": "Audio",
    "auto": "Auto",
+    "back-to-home": "Back to home",
+    "back-to-home-confirm": "Do you want to go back to the home page (without disconnecting)?",
    "badge-audio": "Audio",
    "badge-battery": "Battery",
    "badge-in": "In",
@ -49,6 +52,7 @@ const Texts = {
    "clarity-boost-warning": "These settings don't work when the Clarity Boost mode is ON",
    "clear": "Clear",
    "close": "Close",
+    "close-app": "Close app",
    "combine-audio-video-streams": "Combine audio & video streams",
    "combine-audio-video-streams-summary": "May fix the laggy audio problem",
    "conditional-formatting": "Conditional formatting text color",
@ -74,7 +78,6 @@ const Texts = {
    "device-vibration-not-using-gamepad": "On when not using gamepad",
    "disable": "Disable",
    "disable-home-context-menu": "Disable context menu in Home page",
-    "disable-native-mkb": "Disable native Mouse & Keyboard feature",
    "disable-post-stream-feedback-dialog": "Disable post-stream feedback dialog",
    "disable-social-features": "Disable social features",
    "disable-xcloud-analytics": "Disable xCloud analytics",
@ -103,7 +106,9 @@ const Texts = {
    "hide-scrollbar": "Hide web page's scrollbar",
    "hide-system-menu-icon": "Hide System menu's icon",
    "hide-touch-controller": "Hide touch controller",
+    "horizontal-scroll-sensitivity": "Horizontal scroll sensitivity",
    "horizontal-sensitivity": "Horizontal sensitivity",
+    "ignore": "Ignore",
    "import": "Import",
    "increase": "Increase",
    "install-android": "Install Better xCloud app for Android",
@ -122,8 +127,10 @@ const Texts = {
    "mkb-click-to-activate": "Click to activate",
    "mkb-disclaimer": "Using this feature when playing online could be viewed as cheating",
    "mouse-and-keyboard": "Mouse & Keyboard",
+    "mouse-wheel": "Mouse wheel",
    "muted": "Muted",
    "name": "Name",
+    "native-mkb": "Native Mouse & Keyboard",
    "new": "New",
    "no-consoles-found": "No consoles found",
    "normal": "Normal",
@ -141,28 +148,30 @@ const Texts = {
    "preset": "Preset",
    "press-esc-to-cancel": "Press Esc to cancel",
    "press-key-to-toggle-mkb": [
-        (e: any) => `Press ${e.key} to toggle the Mouse and Keyboard feature`,
-        (e: any) => `${e.key}: Maus- und Tastaturunterstützung an-/ausschalten`,
-        (e: any) => `Tekan ${e.key} untuk mengaktifkan fitur Mouse dan Keyboard`,
-        (e: any) => `Pulsa ${e.key} para activar la función de ratón y teclado`,
-        (e: any) => `Appuyez sur ${e.key} pour activer/désactiver la fonction Souris et Clavier`,
-        (e: any) => `Premi ${e.key} per attivare o disattivare la funzione Mouse e Tastiera`,
-        (e: any) => `${e.key} キーでマウスとキーボードの機能を切り替える`,
-        (e: any) => `${e.key} 키를 눌러 마우스와 키보드 기능을 활성화 하십시오`,
-        (e: any) => `Naciśnij ${e.key}, aby przełączyć funkcję myszy i klawiatury`,
-        (e: any) => `Pressione ${e.key} para ativar/desativar a função de Mouse e Teclado`,
-        (e: any) => `Нажмите ${e.key} для переключения функции мыши и клавиатуры`,
+        (e: any) => `Press ${e.key} to toggle this feature`,
+        ,
+        (e: any) => `${e.key}: Funktion an-/ausschalten`,
+        ,
+        ,
+        (e: any) => `Appuyez sur ${e.key} pour activer cette fonctionnalité`,
+        (e: any) => `Premi ${e.key} per attivare questa funzionalità`,
+        (e: any) => `${e.key} でこの機能を切替`,
+        ,
+        ,
+        ,
+        ,
+        ,
+        (e: any) => `Etkinleştirmek için ${e.key} tuşuna basın`,
+        (e: any) => `Натисніть ${e.key} щоб перемкнути цю функцію`,
+        (e: any) => `Nhấn ${e.key} để bật/tắt tính năng này`,
        ,
-        (e: any) => `Klavye ve fare özelliğini açmak için ${e.key} tuşuna basın`,
-        (e: any) => `Натисніть ${e.key}, щоб увімкнути або вимкнути функцію миші та клавіатури`,
-        (e: any) => `Nhấn ${e.key} để bật/tắt tính năng Chuột và Bàn phím`,
-        (e: any) => `按下 ${e.key} 切换键鼠模式`,
    ],
    "press-to-bind": "Press a key or do a mouse click to bind...",
    "prompt-preset-name": "Preset's name:",
    "ratio": "Ratio",
    "reduce-animations": "Reduce UI animations",
    "region": "Region",
+    "reload-stream": "Reload stream",
    "remote-play": "Remote Play",
    "rename": "Rename",
    "right-click-to-unbind": "Right-click on a key to unbind it",
@ -179,6 +188,7 @@ const Texts = {
    "separate-touch-controller": "Separate Touch controller & Controller #1",
    "separate-touch-controller-note": "Touch controller is Player 1, Controller #1 is Player 2",
    "server": "Server",
+    "settings": "Settings",
    "settings-reload": "Reload page to reflect changes",
    "settings-reloading": "Reloading...",
    "shortcut-keys": "Shortcut keys",
@ -229,6 +239,7 @@ const Texts = {
    "touch-control-layout": "Touch control layout",
    "touch-control-layout-by": [
        (e: any) => `Touch control layout by ${e.name}`,
+        (e: any) => `Format del control tàctil per ${e.name}`,
        (e: any) => `Touch-Steuerungslayout von ${e.name}`,
        (e: any) => `Tata letak Sentuhan layar oleh ${e.name}`,
        (e: any) => `Disposición del control táctil por ${e.nombre}`,
@ -254,10 +265,12 @@ const Texts = {
    "unmuted": "Unmuted",
    "use-mouse-absolute-position": "Use mouse's absolute position",
    "user-agent-profile": "User-Agent profile",
+    "vertical-scroll-sensitivity": "Vertical scroll sensitivity",
    "vertical-sensitivity": "Vertical sensitivity",
    "vibration-intensity": "Vibration intensity",
    "vibration-status": "Vibration",
    "video": "Video",
+    "virtual-controller": "Virtual controller",
    "visual-quality": "Visual quality",
    "visual-quality-high": "High",
    "visual-quality-low": "Low",
Author	SHA1	Message	Date
redphx	0d59ab2ee2	Bump version to 4.7.0	2024-06-08 17:22:43 +07:00
redphx	ff794c44b5	Update better-xcloud.user.js	2024-06-08 17:21:55 +07:00
redphx	ccc824d544	Add vscode files	2024-06-08 17:05:02 +07:00
redphx	eb8490a798	Add native MKB support for Android app	2024-06-08 17:04:49 +07:00
redphx	a41d0cda0c	Update better-xcloud.user.js	2024-06-07 21:04:52 +07:00
redphx	559c3c52c3	Update better-xcloud.user.js	2024-06-07 07:57:10 +07:00
redphx	2ed1e8735f	Update better-xcloud.user.js	2024-06-07 07:20:25 +07:00
redphx	03d5550f05	Update better-xcloud.user.js	2024-06-06 20:53:53 +07:00
redphx	fb1ce5306d	Update better-xcloud.user.js	2024-06-05 21:37:38 +07:00
redphx	e8e37aa575	Update better-xcloud.user.js	2024-06-05 18:28:31 +07:00
redphx	9f1f28a2d7	Update better-xcloud.user.js	2024-06-03 15:52:55 +07:00
redphx	44cf4f1d19	Fix video ratio not working properly	2024-06-03 15:52:52 +07:00
redphx	bb20f408a3	Update custom-flags.user.js	2024-06-03 05:44:58 +07:00
redphx	c03737e224	Update custom-flags.user.js	2024-06-02 11:13:47 +07:00
redphx	5b137f7791	Update 01-bug-report.yml	2024-06-02 10:54:14 +07:00
redphx	7f52479f0a	Update better-xcloud.user.js	2024-06-02 10:44:23 +07:00
redphx	2e0a59cbe1	Add back the ability to use native MKB feature on unofficial titles	2024-06-02 10:43:59 +07:00
redphx	850afb4ca7	Disable xCloud analytics also remove the Feedback button in the Guide menu	2024-06-02 09:57:04 +07:00
redphx	e98fa29271	Disable social features also hide the "Start a party" button in the Guide menu	2024-06-02 09:52:41 +07:00
redphx	d79aaecb54	Bump version to 4.6.3	2024-06-01 18:39:30 +07:00
redphx	148b60cccb	Update better-xcloud.user.js	2024-06-01 18:39:08 +07:00
redphx	db78918d34	Don't process further when vibration intensity is 0	2024-06-01 18:37:06 +07:00
redphx	ddc4346da8	Update better-xcloud.user.js	2024-06-01 18:28:04 +07:00
redphx	4db25e8d62	Don't show stream badges in the Guide menu until xCloud removes the Stream menu	2024-06-01 18:27:46 +07:00
redphx	e10a98c245	Fix not disabling vibration when intensity is 0	2024-06-01 18:26:23 +07:00
redphx	c9b070253c	Fix button styles in WebView	2024-06-01 18:23:14 +07:00
redphx	ba07e0498e	Fix disabling the MKB dialog not making it go away	2024-06-01 18:23:00 +07:00
redphx	6c8f336e9c	Update better-xcloud.user.js	2024-06-01 17:29:11 +07:00
redphx	522e4dddd2	Update home icon	2024-06-01 17:29:09 +07:00
redphx	e1627dca61	Update better-xcloud.user.js	2024-06-01 17:11:53 +07:00
redphx	b5a19cd211	Replace double-quote with single-quote in SVG files	2024-06-01 17:11:29 +07:00
redphx	d5d81f3374	Add "Back to home" button in the Stream menu	2024-06-01 17:04:33 +07:00
redphx	2db78d01a0	Hide xCloud's Home button in the Guide menu	2024-06-01 16:34:54 +07:00
redphx	8f9976da28	Add "Reload stream" & "Back to home" buttons in the Guide menu	2024-06-01 16:29:01 +07:00
redphx	322418ec5b	Reposition badges in the Guide menu	2024-06-01 16:00:11 +07:00
redphx	28049e5d22	Update package.json	2024-06-01 15:49:30 +07:00
redphx	9593cdf8dd	Update better-xcloud.user.js	2024-06-01 10:21:29 +07:00
redphx	732bd19f3a	Add Catalan	2024-06-01 10:21:11 +07:00
redphx	562c1c95f5	Update translations	2024-06-01 10:21:05 +07:00
redphx	5d1a0a3428	Update better-xcloud.user.js	2024-06-01 10:12:52 +07:00
redphx	758501bcd3	Change objectFit to "contain"	2024-06-01 10:12:45 +07:00
redphx	e10eadc832	Fix first time activating controller shortcut will also open the Guide menu (#409 )	2024-06-01 10:11:53 +07:00
redphx	ed3c4041ff	Show stats in the Guide menu & refactor	2024-06-01 10:11:06 +07:00
redphx	60cadb4b04	Update better-xcloud.user.js	2024-05-31 21:29:36 +07:00
redphx	b5c033498e	Move "AUDIO_MIC_ON_PLAYING" setting	2024-05-31 07:31:36 +07:00
redphx	a24446a6b4	Update better-xcloud.user.js	2024-05-31 07:22:01 +07:00
redphx	bee190b867	Use a better method to skip feedback dialog	2024-05-31 07:14:58 +07:00
redphx	941ed0a00f	Fix loading screen not working properly	2024-05-31 06:55:31 +07:00
redphx	1f632db6b4	Bump version to 4.6.2	2024-05-30 17:24:50 +07:00
redphx	c07e3297ca	Update better-xcloud.user.js	2024-05-30 17:22:19 +07:00
redphx	5e43915ff7	Add a Disable button in the MKB dialog	2024-05-30 17:22:06 +07:00
redphx	e21375821d	Update better-xcloud.user.js	2024-05-30 16:46:56 +07:00
redphx	6438e533d6	Hide rocket animation in Smart TV profile	2024-05-30 16:46:48 +07:00
redphx	e9671cbe5d	Fix video not being full screen (#415 )	2024-05-30 16:28:05 +07:00
redphx	b99ec65cc9	Update better-xcloud.user.js	2024-05-30 09:34:47 +07:00
redphx	addcf56abf	Minor fix	2024-05-30 09:22:04 +07:00
redphx	db17bda673	Bump version to 4.6.1	2024-05-30 07:09:39 +07:00
redphx	0a60119c3b	Update better-xcloud.user.js	2024-05-30 07:09:14 +07:00
redphx	ef14c78941	Fix settings being reset after refreshing page	2024-05-30 07:04:01 +07:00
redphx	f2dc102996	Update better-xcloud.user.js	2024-05-29 20:19:43 +07:00
redphx	02db103a72	Fix pink border when using Clarity feature in Logitech G Cloud	2024-05-29 20:19:36 +07:00
redphx	f291047b64	Update better-xcloud.user.js	2024-05-29 20:09:22 +07:00
redphx	5866644673	Clear TABs when disabling touch control	2024-05-29 20:09:20 +07:00
redphx	5baad2d89a	Bump version to 4.6.0	2024-05-29 17:41:27 +07:00
redphx	381f3fb679	Update better-xcloud.user.js	2024-05-29 17:29:12 +07:00
redphx	0f48cb891f	Support emulated MKB in Android app commit ad365d4ee854971122f0e8cb9157ed44b3aac0d8 Author: redphx <96280+redphx@users.noreply.github.com> Date: Wed May 29 17:19:57 2024 +0700 Fix not able to reconnect to WebSocket server when switching game commit ca9369318d4cbb831650e8ca631e7997dc7706cb Author: redphx <96280+redphx@users.noreply.github.com> Date: Wed May 29 17:19:23 2024 +0700 Stop emulated MKB when losing pointer capture commit 8cca1a0554c46b8f61455e79d5b16f1dff9a8014 Author: redphx <96280+redphx@users.noreply.github.com> Date: Wed May 29 17:17:42 2024 +0700 Allow fine-tuning maximum video bitrate commit 763d414d560d9d2aa6710fd60e3f80bf43a534d6 Author: redphx <96280+redphx@users.noreply.github.com> Date: Wed May 29 08:13:56 2024 +0700 Update mouse settings commit d65c5ab4e4a33ed8ad13acf0a15c4bb5ace870eb Author: redphx <96280+redphx@users.noreply.github.com> Date: Wed May 29 08:10:49 2024 +0700 Increase MKB dialog's bg opacity commit 3e72f2ad2700737c8148ef47629528954a606578 Author: redphx <96280+redphx@users.noreply.github.com> Date: Wed May 29 08:02:57 2024 +0700 Show/hide MKB dialog properly commit e7786f36508e3aa843604d9886861930bada5d60 Author: redphx <96280+redphx@users.noreply.github.com> Date: Wed May 29 07:47:21 2024 +0700 Fix connecting to WebSocket server when it's not ready commit 512d8c227a057e5c0399bf128bc1c52a88fcf853 Author: redphx <96280+redphx@users.noreply.github.com> Date: Wed May 29 07:18:06 2024 +0700 Fix arrow keys not working in Android app commit 0ce90f47f37d057d5a4fab0003e2bec8960d1eee Author: redphx <96280+redphx@users.noreply.github.com> Date: Tue May 28 17:36:56 2024 +0700 Set mouse's default sensitivities to 50 commit 16eb48660dd44497e16ca22343a880d9a2e53a30 Author: redphx <96280+redphx@users.noreply.github.com> Date: Tue May 28 17:33:37 2024 +0700 Allow emulated MKB feature in Android app commit c3d0e64f8502e19cd4f167fea4cdbdfc2e14b65e Author: redphx <96280+redphx@users.noreply.github.com> Date: Tue May 28 17:32:49 2024 +0700 Remove stick decay settings commit d289d2a0dea61a440c1bc6b9392920b8e6ab6298 Author: redphx <96280+redphx@users.noreply.github.com> Date: Tue May 28 17:21:39 2024 +0700 Remove stick decaying feature commit 76bd001d98bac53f757f4ae793b2850aad055007 Author: redphx <96280+redphx@users.noreply.github.com> Date: Tue May 28 17:21:14 2024 +0700 Update data structure commit c5d3c87da9e6624ebefb288f6d7c8d06dc00916b Author: redphx <96280+redphx@users.noreply.github.com> Date: Tue May 28 08:14:27 2024 +0700 Fix not toggling the MKB feature correctly commit 9615535cf0e4d4372e201aefb6f1231ddbc22536 Author: redphx <96280+redphx@users.noreply.github.com> Date: Mon May 27 20:51:57 2024 +0700 Handle mouse data from the app	2024-05-29 17:28:39 +07:00
redphx	228c2ad008	Update better-xcloud.user.js	2024-05-28 17:48:07 +07:00