fix(ui): style password validation errors and invalid borders

packages/ui/test/ui.test.ts

@@ -1409,6 +1409,14 @@ test("password fields cancel native invalid popups and show inline errors", asyn
     expect(dom.querySelector("[data-error='password']")?.textContent).toContain(
       "Enter your password.",
     );
+    expect(dom.querySelector(".wrn-next--invalid")).not.toBeNull();
+    const source = readFileSync(uiComponentPath(component), "utf8");
+    expect(source).toMatch(
+      /\.wrn-next--(?:toggle|strong)-password \.wrn-next__validation\s*\{\s*color: var\(--wrn-color-danger, #ef4444\)/,
+    );
+    input.value = "ExamplePassword123!";
+    input.dispatchEvent(new (dom.window as any).Event("input", { bubbles: true }));
+    expect(dom.querySelector(".wrn-next--invalid")).toBeNull();
   }
 });