[Frame] Reduce motion on width changes (#11927)

### WHY are these changes introduced?

Fixes https://github.com/Shopify/polaris-internal/issues/1600

### WHAT is this pull request doing?

turns off frame width transitions (when sidebar is opened/closed)

### How to 🎩

- turn on prefers reduced motion in mac os settings
- turn on sidebar beta flag 
- open/close sidebar

https://admin.web.web-81d9.sophie-schneider.us.spin.dev/store/shop1

### 🎩 checklist

- [x] Tested a
[snapshot](https://github.com/Shopify/polaris/blob/main/documentation/Releasing.md#-snapshot-releases)

.changeset/tidy-glasses-dress.md

@@ -0,0 +1,5 @@
+---
+'@shopify/polaris': patch
+---
+
+Added `prefers-reduced-motion` media queries to `Frame` width transitions

polaris-react/src/components/Frame/Frame.module.css

@@ -30,6 +30,10 @@
     /* stylelint-disable-next-line polaris/conventions/polaris/custom-property-allowed-list -- private token from component */
     width: calc(100% - var(--pc-sidebar-width));
   }
+
+  @media (prefers-reduced-motion) {
+    transition: none;
+  }
 }
 
 .Frame-TopBarAndReframe {
@@ -38,6 +42,10 @@
   /* stylelint-enable */
   background-color: var(--p-color-bg-inverse);
   transition: width var(--p-motion-duration-250) var(--p-motion-ease);
+
+  @media (prefers-reduced-motion) {
+    transition: none;
+  }
 }
 
 .Navigation {
@@ -305,6 +313,10 @@
         var(--pc-app-provider-scrollbar-width) - var(--p-space-150)
     );
     /* stylelint-enable -- polaris/conventions/polaris/custom-property-allowed-list */
+
+    @media (prefers-reduced-motion) {
+      transition: none;
+    }
   }
 
   .hasSidebar & {
@@ -320,6 +332,10 @@
           var(--pc-sidebar-width)
       );
     }
+
+    @media (prefers-reduced-motion) {
+      transition: none;
+    }
   }
 }