diff --git a/src/client/LangSelector.ts b/src/client/LangSelector.ts
index 58e4b9415..132e63d79 100644
--- a/src/client/LangSelector.ts
+++ b/src/client/LangSelector.ts
@@ -20,6 +20,7 @@ export class LangSelector extends LitElement {
   @state() private languageList: any[] = [];
   @state() private showModal: boolean = false;
   @state() private debugMode: boolean = false;
+  @state() isVisible = true;
 
   private debugKeyPressed: boolean = false;
   private languageMetadata: LanguageMetadata[] = metadata;
@@ -248,7 +249,16 @@ export class LangSelector extends LitElement {
     await this.loadLanguageList();
   }
 
+  public close() {
+    this.showModal = false;
+    this.isVisible = false;
+    this.requestUpdate();
+  }
+
   render() {
+    if (!this.isVisible) {
+      return html``;
+    }
     const currentLang =
       this.languageList.find((l) => l.code === this.currentLang) ??
       (this.currentLang === "debug"
diff --git a/src/client/Main.ts b/src/client/Main.ts
index 58dffff72..00c2950a2 100644
--- a/src/client/Main.ts
+++ b/src/client/Main.ts
@@ -560,6 +560,7 @@ class Client {
           "stats-button",
           "token-login",
           "matchmaking-modal",
+          "lang-selector",
         ].forEach((tag) => {
           const modal = document.querySelector(tag) as HTMLElement & {
             close?: () => void;