fix(web): give the board's chat pill its own accessible name

The panel's fold toggle and the header pill both read "Trò chuyện", so
a role query, or a screen reader, found two controls with one name.

web/src/lib/components/GameBoard.svelte

@@ -138,10 +138,16 @@
 				     about. Scrolling the panel into view rather than opening it in
 				     place, since a folded panel scrolled here still shows its own
 				     badge and its own way to unfold. -->
+				<!-- Its own accessible name: the panel below has a toggle that
+				     reads "Trò chuyện" too, and two controls announced alike are
+				     one control a screen reader cannot tell apart. -->
 				<button
 					type="button"
 					class="chat-pill"
 					onclick={onchatopen}
+					aria-label={chatUnread > 0
+						? `${t.chatOpen}, ${fill(t.chatUnread, { n: chatUnread })}`
+						: t.chatOpen}
 					data-testid="chat-pill"
 				>
 					{t.chatTitle}

web/src/lib/i18n/vi.js

@@ -122,6 +122,9 @@ export const t = {
 	shareInvite: 'Vào chơi nối từ với tôi',
 
 	chatTitle: 'Trò chuyện',
+	// The board header's shortcut to the panel; distinct from the panel's own
+	// toggle so the two are never announced as the same control.
+	chatOpen: 'Mở trò chuyện',
 	chatPlaceholder: 'Nhắn tin…',
 	chatEmpty: 'Chưa có tin nhắn nào.',
 	chatUnread: '{n} tin mới',