diff --git a/app/components/Header/AuthModal.client.vue b/app/components/Header/AuthModal.client.vue
index 7f3b2ec3b6..09828ba94a 100644
--- a/app/components/Header/AuthModal.client.vue
+++ b/app/components/Header/AuthModal.client.vue
@@ -25,6 +25,19 @@ async function handleLogin() {
     await authRedirect(handleInput.value)
   }
 }
+
+watch(handleInput, newHandleInput => {
+  if (!newHandleInput) return
+
+  const normalized = newHandleInput
+    .trim()
+    .toLowerCase()
+    .replace(/[^a-z0-9.-]/g, '')
+
+  if (normalized !== newHandleInput) {
+    handleInput.value = normalized
+  }
+})
 </script>
 
 <template>