diff --git a/assets/src/components/amp-setting-toggle/test/__snapshots__/index.js.snap b/assets/src/components/amp-setting-toggle/test/__snapshots__/index.js.snap
index 97d42563551..30b98416830 100644
--- a/assets/src/components/amp-setting-toggle/test/__snapshots__/index.js.snap
+++ b/assets/src/components/amp-setting-toggle/test/__snapshots__/index.js.snap
@@ -5,13 +5,13 @@ exports[`AMPSettingToggle matches snapshots 1`] = `
   className="amp-setting-toggle"
 >
   <div
-    className="components-base-control components-toggle-control css-ij2po-Wrapper-boxSizingReset ej5x27r4"
+    className="components-base-control components-toggle-control css-fothu4-Wrapper-boxSizingReset ej5x27r4"
   >
     <div
-      className="components-base-control__field css-yj91it-StyledField ej5x27r3"
+      className="components-base-control__field css-2txpkp-StyledField ej5x27r3"
     >
       <div
-        className="components-flex components-h-stack css-x0iqvu-PolymorphicDiv-Flex-base-ItemsRow e19lxcc00"
+        className="components-flex components-h-stack css-1ub13jk-PolymorphicDiv-Flex-base-ItemsRow e19lxcc00"
         data-wp-c16t={true}
         data-wp-component="HStack"
       >
@@ -33,7 +33,7 @@ exports[`AMPSettingToggle matches snapshots 1`] = `
           />
         </span>
         <label
-          className="components-flex-item components-flex-block components-toggle-control__label css-10m3u8l-PolymorphicDiv-Item-sx-Base-block e19lxcc00"
+          className="components-flex-item components-flex-block components-toggle-control__label css-1mqm1jz-PolymorphicDiv-Item-sx-Base-block e19lxcc00"
           data-wp-c16t={true}
           data-wp-component="FlexBlock"
           htmlFor="inspector-toggle-control-0"
@@ -60,13 +60,13 @@ exports[`AMPSettingToggle matches snapshots 2`] = `
   className="amp-setting-toggle"
 >
   <div
-    className="components-base-control components-toggle-control css-ij2po-Wrapper-boxSizingReset ej5x27r4"
+    className="components-base-control components-toggle-control css-fothu4-Wrapper-boxSizingReset ej5x27r4"
   >
     <div
-      className="components-base-control__field css-yj91it-StyledField ej5x27r3"
+      className="components-base-control__field css-2txpkp-StyledField ej5x27r3"
     >
       <div
-        className="components-flex components-h-stack css-x0iqvu-PolymorphicDiv-Flex-base-ItemsRow e19lxcc00"
+        className="components-flex components-h-stack css-1ub13jk-PolymorphicDiv-Flex-base-ItemsRow e19lxcc00"
         data-wp-c16t={true}
         data-wp-component="HStack"
       >
@@ -88,7 +88,7 @@ exports[`AMPSettingToggle matches snapshots 2`] = `
           />
         </span>
         <label
-          className="components-flex-item components-flex-block components-toggle-control__label css-10m3u8l-PolymorphicDiv-Item-sx-Base-block e19lxcc00"
+          className="components-flex-item components-flex-block components-toggle-control__label css-1mqm1jz-PolymorphicDiv-Item-sx-Base-block e19lxcc00"
           data-wp-c16t={true}
           data-wp-component="FlexBlock"
           htmlFor="inspector-toggle-control-1"
diff --git a/assets/src/components/dev-tools-toggle/test/__snapshots__/index.js.snap b/assets/src/components/dev-tools-toggle/test/__snapshots__/index.js.snap
index 9dd857fe034..aed62242e14 100644
--- a/assets/src/components/dev-tools-toggle/test/__snapshots__/index.js.snap
+++ b/assets/src/components/dev-tools-toggle/test/__snapshots__/index.js.snap
@@ -5,13 +5,13 @@ exports[`DevToolsToggle matches snapshot 1`] = `
   className="amp-setting-toggle"
 >
   <div
-    className="components-base-control components-toggle-control css-ij2po-Wrapper-boxSizingReset ej5x27r4"
+    className="components-base-control components-toggle-control css-fothu4-Wrapper-boxSizingReset ej5x27r4"
   >
     <div
-      className="components-base-control__field css-yj91it-StyledField ej5x27r3"
+      className="components-base-control__field css-2txpkp-StyledField ej5x27r3"
     >
       <div
-        className="components-flex components-h-stack css-x0iqvu-PolymorphicDiv-Flex-base-ItemsRow e19lxcc00"
+        className="components-flex components-h-stack css-1ub13jk-PolymorphicDiv-Flex-base-ItemsRow e19lxcc00"
         data-wp-c16t={true}
         data-wp-component="HStack"
       >
@@ -33,7 +33,7 @@ exports[`DevToolsToggle matches snapshot 1`] = `
           />
         </span>
         <label
-          className="components-flex-item components-flex-block components-toggle-control__label css-10m3u8l-PolymorphicDiv-Item-sx-Base-block e19lxcc00"
+          className="components-flex-item components-flex-block components-toggle-control__label css-1mqm1jz-PolymorphicDiv-Item-sx-Base-block e19lxcc00"
           data-wp-c16t={true}
           data-wp-component="FlexBlock"
           htmlFor="inspector-toggle-control-0"
@@ -57,7 +57,7 @@ exports[`DevToolsToggle matches snapshot for the loading state 1`] = `
   className="amp-spinner-container"
 >
   <svg
-    className="components-spinner css-etcl5r-StyledSpinner ea4tfvq2"
+    className="components-spinner css-1ej1y9w-StyledSpinner ea4tfvq2"
     focusable="false"
     height="16"
     role="presentation"
@@ -66,14 +66,14 @@ exports[`DevToolsToggle matches snapshot for the loading state 1`] = `
     xmlns="http://www.w3.org/2000/svg"
   >
     <circle
-      className="css-mx768t-SpinnerTrack-commonPathProps ea4tfvq1"
+      className="css-s63o93-SpinnerTrack-commonPathProps ea4tfvq1"
       cx="50"
       cy="50"
       r="50"
       vectorEffect="non-scaling-stroke"
     />
     <path
-      className="css-7c7ebc-SpinnerIndicator-commonPathProps ea4tfvq0"
+      className="css-ib3l9u-SpinnerIndicator-commonPathProps ea4tfvq0"
       d="m 50 0 a 50 50 0 0 1 50 50"
       vectorEffect="non-scaling-stroke"
     />
diff --git a/assets/src/components/loading/test/__snapshots__/loading.js.snap b/assets/src/components/loading/test/__snapshots__/loading.js.snap
index eacb6c62cc2..e07fb7d75d3 100644
--- a/assets/src/components/loading/test/__snapshots__/loading.js.snap
+++ b/assets/src/components/loading/test/__snapshots__/loading.js.snap
@@ -5,7 +5,7 @@ exports[`the Loading component matches the snapshots 1`] = `
   className="amp-spinner-container"
 >
   <svg
-    className="components-spinner css-etcl5r-StyledSpinner ea4tfvq2"
+    className="components-spinner css-1ej1y9w-StyledSpinner ea4tfvq2"
     focusable="false"
     height="16"
     role="presentation"
@@ -14,14 +14,14 @@ exports[`the Loading component matches the snapshots 1`] = `
     xmlns="http://www.w3.org/2000/svg"
   >
     <circle
-      className="css-mx768t-SpinnerTrack-commonPathProps ea4tfvq1"
+      className="css-s63o93-SpinnerTrack-commonPathProps ea4tfvq1"
       cx="50"
       cy="50"
       r="50"
       vectorEffect="non-scaling-stroke"
     />
     <path
-      className="css-7c7ebc-SpinnerIndicator-commonPathProps ea4tfvq0"
+      className="css-ib3l9u-SpinnerIndicator-commonPathProps ea4tfvq0"
       d="m 50 0 a 50 50 0 0 1 50 50"
       vectorEffect="non-scaling-stroke"
     />
@@ -34,7 +34,7 @@ exports[`the Loading component matches the snapshots 2`] = `
   className="amp-spinner-container amp-spinner-container--inline"
 >
   <svg
-    className="components-spinner css-etcl5r-StyledSpinner ea4tfvq2"
+    className="components-spinner css-1ej1y9w-StyledSpinner ea4tfvq2"
     focusable="false"
     height="16"
     role="presentation"
@@ -43,14 +43,14 @@ exports[`the Loading component matches the snapshots 2`] = `
     xmlns="http://www.w3.org/2000/svg"
   >
     <circle
-      className="css-mx768t-SpinnerTrack-commonPathProps ea4tfvq1"
+      className="css-s63o93-SpinnerTrack-commonPathProps ea4tfvq1"
       cx="50"
       cy="50"
       r="50"
       vectorEffect="non-scaling-stroke"
     />
     <path
-      className="css-7c7ebc-SpinnerIndicator-commonPathProps ea4tfvq0"
+      className="css-ib3l9u-SpinnerIndicator-commonPathProps ea4tfvq0"
       d="m 50 0 a 50 50 0 0 1 50 50"
       vectorEffect="non-scaling-stroke"
     />
diff --git a/assets/src/components/redirect-toggle/test/__snapshots__/redirect-toggle.js.snap b/assets/src/components/redirect-toggle/test/__snapshots__/redirect-toggle.js.snap
index e499b31f879..9abf258e705 100644
--- a/assets/src/components/redirect-toggle/test/__snapshots__/redirect-toggle.js.snap
+++ b/assets/src/components/redirect-toggle/test/__snapshots__/redirect-toggle.js.snap
@@ -5,13 +5,13 @@ exports[`RedirectToggle matches snapshot 1`] = `
   className="amp-setting-toggle"
 >
   <div
-    className="components-base-control components-toggle-control css-ij2po-Wrapper-boxSizingReset ej5x27r4"
+    className="components-base-control components-toggle-control css-fothu4-Wrapper-boxSizingReset ej5x27r4"
   >
     <div
-      className="components-base-control__field css-yj91it-StyledField ej5x27r3"
+      className="components-base-control__field css-2txpkp-StyledField ej5x27r3"
     >
       <div
-        className="components-flex components-h-stack css-x0iqvu-PolymorphicDiv-Flex-base-ItemsRow e19lxcc00"
+        className="components-flex components-h-stack css-1ub13jk-PolymorphicDiv-Flex-base-ItemsRow e19lxcc00"
         data-wp-c16t={true}
         data-wp-component="HStack"
       >
@@ -33,7 +33,7 @@ exports[`RedirectToggle matches snapshot 1`] = `
           />
         </span>
         <label
-          className="components-flex-item components-flex-block components-toggle-control__label css-10m3u8l-PolymorphicDiv-Item-sx-Base-block e19lxcc00"
+          className="components-flex-item components-flex-block components-toggle-control__label css-1mqm1jz-PolymorphicDiv-Item-sx-Base-block e19lxcc00"
           data-wp-c16t={true}
           data-wp-component="FlexBlock"
           htmlFor="inspector-toggle-control-0"
diff --git a/assets/src/components/template-mode-option/test/__snapshots__/index.js.snap b/assets/src/components/template-mode-option/test/__snapshots__/index.js.snap
index 29005ddd3de..0e961ecd219 100644
--- a/assets/src/components/template-mode-option/test/__snapshots__/index.js.snap
+++ b/assets/src/components/template-mode-option/test/__snapshots__/index.js.snap
@@ -146,7 +146,7 @@ exports[`TemplateModeOption matches snapshot 1`] = `
           </svg>
         </span>
         <span
-          className="components-visually-hidden css-161q9d5-PolymorphicDiv e19lxcc00"
+          className="components-visually-hidden css-1qfl78b-PolymorphicDiv e19lxcc00"
           data-wp-c16t={true}
           data-wp-component="VisuallyHidden"
           style={
@@ -418,7 +418,7 @@ exports[`TemplateModeOption matches snapshot 2`] = `
           </svg>
         </span>
         <span
-          className="components-visually-hidden css-161q9d5-PolymorphicDiv e19lxcc00"
+          className="components-visually-hidden css-1qfl78b-PolymorphicDiv e19lxcc00"
           data-wp-c16t={true}
           data-wp-component="VisuallyHidden"
           style={
@@ -718,7 +718,7 @@ exports[`TemplateModeOption matches snapshot 3`] = `
           </svg>
         </span>
         <span
-          className="components-visually-hidden css-161q9d5-PolymorphicDiv e19lxcc00"
+          className="components-visually-hidden css-1qfl78b-PolymorphicDiv e19lxcc00"
           data-wp-c16t={true}
           data-wp-component="VisuallyHidden"
           style={