feat(a11y): add DialogContext auto-labelling with aria-labelledby/describedby

Introduce DialogContext using React.useId() that auto-wires aria-labelledby
and aria-describedby on DialogContent, with matching ids on DialogTitle and
DialogDescription. Adds role="dialog" and aria-modal="true". All 12+ existing
consumers get proper ARIA labels without any call-site changes.

Co-Authored-By: Paperclip <noreply@paperclip.ing>

apps/web/components/ui/__tests__/dialog.spec.tsx

@@ -68,4 +68,53 @@ describe('Dialog', () => {
     await userEvent.click(screen.getByText('Stay Open'));
     expect(onOpenChange).not.toHaveBeenCalled();
   });
+
+  describe('a11y: DialogContext auto-labelling', () => {
+    it('renders DialogContent with role="dialog" and aria-modal', () => {
+      render(
+        <Dialog open={true} onOpenChange={() => {}}>
+          <DialogContent>
+            <DialogTitle>A11y Title</DialogTitle>
+          </DialogContent>
+        </Dialog>,
+      );
+
+      const dialog = screen.getByRole('dialog');
+      expect(dialog).toHaveAttribute('aria-modal', 'true');
+    });
+
+    it('auto-wires aria-labelledby from DialogTitle id', () => {
+      render(
+        <Dialog open={true} onOpenChange={() => {}}>
+          <DialogContent>
+            <DialogTitle>Auto Label</DialogTitle>
+            <DialogDescription>Auto Desc</DialogDescription>
+          </DialogContent>
+        </Dialog>,
+      );
+
+      const dialog = screen.getByRole('dialog');
+      const titleId = dialog.getAttribute('aria-labelledby');
+      const descId = dialog.getAttribute('aria-describedby');
+
+      expect(titleId).toBeTruthy();
+      expect(descId).toBeTruthy();
+
+      // The title element should carry the matching id
+      expect(screen.getByText('Auto Label')).toHaveAttribute('id', titleId);
+      expect(screen.getByText('Auto Desc')).toHaveAttribute('id', descId);
+    });
+
+    it('allows explicit id override on DialogTitle', () => {
+      render(
+        <Dialog open={true} onOpenChange={() => {}}>
+          <DialogContent>
+            <DialogTitle id="custom-title">Custom</DialogTitle>
+          </DialogContent>
+        </Dialog>,
+      );
+
+      expect(screen.getByText('Custom')).toHaveAttribute('id', 'custom-title');
+    });
+  });
 });