diff --git a/frontend/packages/swarm-ui/src/pages/CreateAgentPage.tsx b/frontend/packages/swarm-ui/src/pages/CreateAgentPage.tsx
index 95302014..ed500fe8 100644
--- a/frontend/packages/swarm-ui/src/pages/CreateAgentPage.tsx
+++ b/frontend/packages/swarm-ui/src/pages/CreateAgentPage.tsx
@@ -42,7 +42,16 @@ type SubmitState =
 // a `pattern` hint only, not a substitute for the server's own
 // validation; a name this rejects would fail server-side anyway, so
 // catching it before a round-trip is a pure UX win, not a new gate.
-const NAME_PATTERN = '[a-z0-9-]{1,63}';
+//
+// Hyphen escaped (`\-`) rather than left trailing in the class: modern
+// browsers validate the `pattern` attribute's regex in Unicode-set (`v`)
+// mode, which is far stricter about hyphen placement than classic mode —
+// `[a-z0-9-]` throws "Invalid character class" under `v` mode even though
+// it's valid classic-mode regex (a trailing `-` is unambiguous there).
+// Reproduced directly: `new RegExp('[a-z0-9-]', 'v')` throws,
+// `new RegExp('[a-z0-9\\-]', 'v')` doesn't — confirmed via mara's console
+// exception report on this page.
+const NAME_PATTERN = '[a-z0-9\\-]{1,63}';
 
 export function CreateAgentPage() {
   const [name, setName] = useState('');