Disable game buttons (clan tag + username) (#4170)

## Description:

disables buttons, instead of emitting a warning 
<img width="1017" height="677" alt="image"
src="https://github.com/user-attachments/assets/7af4e0e1-df22-4cfe-bc8b-6fae5e62f9b6"
/>


<img width="1006" height="668" alt="image"
src="https://github.com/user-attachments/assets/d8e5291c-4ecd-4f8d-8471-e5a547c30eda"
/>


## Please complete the following:

- [x] I have added screenshots for all UI updates
- [x] I process any text displayed to the user through translateText()
and I've added it to the en.json file
- [x] I have added relevant tests to the test directory

## Please put your Discord username so you can be contacted if a bug or
regression is found:

w.o.n

src/client/UsernameInput.ts

@@ -28,9 +28,8 @@ export class UsernameInput extends LitElement {
   @state() private clanTag: string = "";
 
   @property({ type: String }) validationError: string = "";
-  // Ownership-check feedback (i18n key) shown inline beneath the tag input. This
-  // is advisory only — it does not gate play; the tag is stripped on submit and
-  // the server re-checks authoritatively.
+  // Ownership-check feedback (i18n key) shown inline beneath the tag input. Only
+  // "not a member" gates the buttons (see emitValidity); the rest is advisory.
   @state() private clanTagOwnershipError: string = "";
   @state() private clanCheckPending: boolean = false;
   private _isValid: boolean = true;
@@ -71,6 +70,7 @@ export class UsernameInput extends LitElement {
     const gen = ++this.clanCheckGen;
     const tag = this.clanTag;
     this.clanTagOwnershipError = "";
+    this.emitValidity();
     if (tag.length === 0 || !validateClanTag(tag).isValid) {
       this.clanCheckPending = false;
       this.clanCheck = Promise.resolve(null);
@@ -81,6 +81,7 @@ export class UsernameInput extends LitElement {
       if (gen === this.clanCheckGen) {
         this.clanTagOwnershipError = res.error ?? "";
         this.clanCheckPending = false;
+        this.emitValidity();
       }
       return res.tag;
     });
@@ -239,6 +240,7 @@ export class UsernameInput extends LitElement {
     if (!clanTagResult.isValid) {
       this._isValid = false;
       this.validationError = clanTagResult.error ?? "";
+      this.emitValidity();
       return;
     }
 
@@ -251,32 +253,23 @@ export class UsernameInput extends LitElement {
     } else {
       this.validationError = result.error ?? "";
     }
+    this.emitValidity();
   }
 
-  public isValid(): boolean {
-    return this._isValid;
-  }
-
-  public showValidationFeedback(): void {
-    const message =
-      this.validationError || translateText("username.invalid_chars");
+  // Broadcast play-eligibility so action buttons can disable themselves.
+  private emitValidity() {
     window.dispatchEvent(
-      new CustomEvent("show-message", {
-        detail: {
-          message,
-          color: "red",
-          duration: 2500,
-        },
+      new CustomEvent("username-validity-change", {
+        detail: { isValid: this.canPlay() },
       }),
     );
   }
 
-  public validateOrShowError(): boolean {
-    if (this.isValid()) {
-      return true;
-    }
-    this.showValidationFeedback();
-    return false;
+  // Play-eligibility: syntax-valid and not blocked by clan membership.
+  public canPlay(): boolean {
+    return (
+      this._isValid && this.clanTagOwnershipError !== "username.tag_not_member"
+    );
   }
 }