Support dynamic fontsizes in iOS devices (#10181)

<!--
  ☝️How to write a good PR title:
- Prefix it with [ComponentName] (if applicable), for example: [Button]
  - Start with a verb, for example: Add, Delete, Improve, Fix…
  - Give as much context as necessary and as little as possible
  - Prefix it with [WIP] while it’s a work in progress
-->

### WHY are these changes introduced?

Currently Webviews & Mobile Web in iOS don't respect the users
preference for Font Scale which is quite inaccessible.

<!--
  Context about the problem that’s being addressed.
-->

This PR introduces the use of font: -apple-system-body if it is
supported.

Inspired by this [dev.to
article](https://dev.to/colingourlay/how-to-support-apple-s-dynamic-text-in-your-web-content-with-css-40c0#:~:text=If%20you've%20never%20seen,apple%2Dsystem%2Dbody%20)

### WHAT is this pull request doing?

<details>
  <summary>Before</summary>
<img
src="https://github.com/Shopify/polaris/assets/703938/f1adb621-2982-4cc0-8946-bd5403e2a558"
width="300"/>
</details>
<details>
  <summary>After</summary>
<img
src="https://github.com/Shopify/polaris/assets/703938/a213b56e-80ba-4fca-b09a-226ec2f6bec2"
width="300"/>

</details>


<!-- ℹ️ Delete the following for small / trivial changes -->

### How to 🎩

1. Open iOS simulator
2. Open Safari within the iOS Simulator
3. Open polaris storybook using this url
https://5d559397bae39100201eedc1-krdvxqhrcy.chromatic.com/?path=/story/all-components-text--variants
4. Change Fontscale in `Settings > Accessibility > Display & Text Size >
Larger Text ` (using the slider at the bottom)
5. Switch back to Safari
6. Verify the font scale has updated to match the preference in
accessibility

### 🎩 checklist

- [x] Tested on
[mobile](https://github.com/Shopify/polaris/blob/main/documentation/Tophatting.md#cross-browser-testing)
- [x] Tested on [multiple
browsers](https://help.shopify.com/en/manual/shopify-admin/supported-browsers)
- [x] Tested for
[accessibility](https://github.com/Shopify/polaris/blob/main/documentation/Accessibility%20testing.md)
- [x] Updated the component's `README.md` with documentation changes
- [x] [Tophatted
documentation](https://github.com/Shopify/polaris/blob/main/documentation/Tophatting%20documentation.md)
changes in the style guide

Author: ssetem

.changeset/olive-fishes-provide.md

@@ -0,0 +1,5 @@
+---
+'@shopify/polaris': minor
+---
+
+Added support for [Dynamic Type](https://developer.apple.com/documentation/uikit/uifont/scaling_fonts_automatically) in iOS

polaris-react/src/components/AppProvider/AppProvider.scss

@@ -55,6 +55,17 @@ html {
   text-rendering: optimizeLegibility;
 }
 
+/*
+  To support dynamic type in iOS, we need to set Apple's
+  system font and then define font-families and rem-based
+  font-sizes on descendant elements:
+*/
+@supports (font: -apple-system-body) {
+  html {
+    font: -apple-system-body;
+  }
+}
+
 body {
   min-height: 100%;
   margin: 0;