bug: ion-modal handle transformZ results in blurry content on Windows

### Prerequisites

- [X] I have read the [Contributing Guidelines](https://github.com/ionic-team/ionic-framework/blob/main/.github/CONTRIBUTING.md#creating-an-issue).
- [X] I agree to follow the [Code of Conduct](https://ionicframework.com/code-of-conduct).
- [X] I have searched for [existing issues](https://github.com/ionic-team/ionic-framework/issues) that already report this problem, without success.

### Ionic Framework Version

- [ ] v4.x
- [ ] v5.x
- [X] v6.x
- [ ] Nightly

### Current Behavior

When using ion-modal in the browser (From PC, windows 10, chrome last), the content is rendered fuzzy, as if in a small screen resolution (not clear text and all elements)



Example content outside of ion-modal

From a mobile device, the display is normal

### Expected Behavior

Content stays blurry

### Steps to Reproduce

unclear

### Code Reproduction URL

_No response_

### Ionic Info

Ionic:

Ionic CLI : 6.20.3
Ionic Framework : @ionic/vue 6.3.2

Capacitor:

Capacitor CLI : 4.4.0
@capacitor/android : 4.4.0
@capacitor/core : 4.4.0
@capacitor/ios : 4.4.0

Utility:

cordova-res : 0.15.4
native-run : 1.7.1

System:

NodeJS : v16.15.1 (C:\Program Files\nodejs\node.exe)
npm : 8.19.2
OS : Windows 10

### Additional Information

_No response_

首先，在 Windows 10 上使用所报告的 Ionic Vue 6.3.2 环境于 Chrome 中复现 ion-modal 的渲染问题，然后检查 transformZ 如何影响 modal 内容。当 modal 的文本和元素能够在浏览器中清晰渲染，且不会导致正常移动端显示出现回归时，即视为完成。

由索引模型根据 Issue 内容生成。