refactor(web): unify message-direction arrows and rename Pinned section (#1623)

- Direction labels now both point right so the arrow reads clearly at
  badge size: incoming "client ← server" becomes "server → client"
  (from → to), in MessageDirectionBadge and MessageDirectionFilter
  (shared by the Protocol and Network views).
- The Protocol list's pinned section header now reads "Pinned Messages"
  (was "Pinned Requests"), matching the "Messages" panel title.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01BrihGWcrM9JGRyu41nzZYw

clients/web/src/components/groups/ProtocolControls/ProtocolControls.test.tsx

@@ -91,7 +91,7 @@ describe("ProtocolControls", () => {
       screen.getByRole("button", { name: "client → server" }),
     ).toBeInTheDocument();
     expect(
-      screen.getByRole("button", { name: "client ← server" }),
+      screen.getByRole("button", { name: "server → client" }),
     ).toBeInTheDocument();
   });
 
@@ -102,7 +102,7 @@ describe("ProtocolControls", () => {
       <ProtocolControls {...baseProps} onToggleDirection={onToggleDirection} />,
     );
     // Currently visible → clicking turns it off.
-    await user.click(screen.getByRole("button", { name: "client ← server" }));
+    await user.click(screen.getByRole("button", { name: "server → client" }));
     expect(onToggleDirection).toHaveBeenCalledWith("server", false);
   });