bug(CDK a11y, Tooltip, SortHeader): AriaDescriber not working inside Shadow DOM

### Is this a regression?

- [ ] Yes, this behavior used to work in the previous version

### The previous version in which this bug was not present was

_No response_

### Description

The AriaDescriber service creates a container element and appends it to the body. The messages inside the container are linked with the host element using `aria-describedby` when calling `ariaDescriber.describe()`.

When the host element is inside Shadow DOM this will not work properly because the hidden message element (that is referenced via `aria-describedby`) is outside of the Shadow DOM and will be ignored by the browser.

### Reproduction

I actually had the problem with Angular Material Tooltips and Table Sort Header (which use AriaDescriber) but for the repro I use the AriaDescriber service directly. I set a description on a button in the Example component which uses `ViewEncapsulation.ShadowDom`.

Steps to reproduce:
1. Open the repro https://stackblitz.com/edit/components-issue-rxwpmf?file=src/app/example-component.ts
2. Inspect the "Action" button
3. Open the "Accessibility" tab in the inspector

### Expected Behavior

The button should have the description "Some description" which was created via AriaDescriber service.

### Actual Behavior

The button has no description.


The `aria-describedby` attribute is there but the referenced element is ignored because it's outside of the Shadow DOM. It works if I set `encapsulation` on the component to `Emulated`.

### Environment

- Angular: 13.3.0
- CDK/Material: 13.3.0
- Browser(s): Brave
- Operating System (e.g. Windows, macOS, Ubuntu): macOS

Bắt đầu với dịch vụ AriaDescriber và tái hiện sự cố bằng ví dụ StackBlitz được liên kết với ViewEncapsulation.ShadowDom. Xác minh hành vi thông qua trình kiểm tra Accessibility của trình duyệt; được xem là hoàn tất khi nút hiển thị “Some description” đồng thời vẫn giữ cơ chế đóng gói Shadow DOM.

Do mô hình lập chỉ mục viết ra từ nội dung của issue.