diff --git a/packages/components/src/navigator/navigator-screen/component.tsx b/packages/components/src/navigator/navigator-screen/component.tsx
index 9bb8b3c2d83d22..2c646f475b4220 100644
--- a/packages/components/src/navigator/navigator-screen/component.tsx
+++ b/packages/components/src/navigator/navigator-screen/component.tsx
@@ -4,13 +4,12 @@
 import type { ForwardedRef } from 'react';
 // eslint-disable-next-line no-restricted-imports
 import { motion, MotionProps } from 'framer-motion';
-import { css } from '@emotion/react';
 
 /**
  * WordPress dependencies
  */
 import { focus } from '@wordpress/dom';
-import { useContext, useEffect, useMemo, useRef } from '@wordpress/element';
+import { useContext, useEffect, useRef } from '@wordpress/element';
 import {
 	useReducedMotion,
 	useMergeRefs,
@@ -27,7 +26,6 @@ import {
 	useContextSystem,
 	WordPressComponentProps,
 } from '../../ui/context';
-import { useCx } from '../../utils/hooks/use-cx';
 import { View } from '../../view';
 import { NavigatorContext } from '../context';
 import type { NavigatorScreenProps } from '../types';
@@ -57,21 +55,6 @@ function NavigatorScreen( props: Props, forwardedRef: ForwardedRef< any > ) {
 
 	const previousLocation = usePrevious( location );
 
-	const cx = useCx();
-	const classes = useMemo(
-		() =>
-			cx(
-				css( {
-					// Ensures horizontal overflow is visually accessible.
-					overflowX: 'auto',
-					// In case the root has a height, it should not be exceeded.
-					maxHeight: '100%',
-				} ),
-				className
-			),
-		[ className, cx ]
-	);
-
 	// Focus restoration
 	const isInitialLocation = location.isInitial && ! location.isBack;
 	useEffect( () => {
@@ -128,7 +111,7 @@ function NavigatorScreen( props: Props, forwardedRef: ForwardedRef< any > ) {
 		return (
 			<View
 				ref={ mergedWrapperRef }
-				className={ classes }
+				className={ className }
 				{ ...otherProps }
 			>
 				{ children }
@@ -174,7 +157,7 @@ function NavigatorScreen( props: Props, forwardedRef: ForwardedRef< any > ) {
 	return (
 		<motion.div
 			ref={ mergedWrapperRef }
-			className={ classes }
+			className={ className }
 			{ ...otherProps }
 			{ ...animatedProps }
 		>
diff --git a/packages/edit-post/src/components/preferences-modal/test/__snapshots__/index.js.snap b/packages/edit-post/src/components/preferences-modal/test/__snapshots__/index.js.snap
index 95812a2828ea91..33489890580b19 100644
--- a/packages/edit-post/src/components/preferences-modal/test/__snapshots__/index.js.snap
+++ b/packages/edit-post/src/components/preferences-modal/test/__snapshots__/index.js.snap
@@ -508,11 +508,6 @@ exports[`EditPostPreferencesModal should match snapshot when the modal is active
 }
 
 .emotion-2 {
-  overflow-x: auto;
-  max-height: 100%;
-}
-
-.emotion-3 {
   background-color: #fff;
   color: #1e1e1e;
   position: relative;
@@ -522,47 +517,47 @@ exports[`EditPostPreferencesModal should match snapshot when the modal is active
   border-radius: calc(2px - 1px);
 }
 
-.emotion-5 {
+.emotion-4 {
   height: 100%;
 }
 
-.emotion-7 {
+.emotion-6 {
   box-sizing: border-box;
   height: auto;
   max-height: 100%;
   padding: calc(4px * 4);
 }
 
-.emotion-7:first-of-type {
+.emotion-6:first-of-type {
   border-top-left-radius: calc(2px - 1px);
   border-top-right-radius: calc(2px - 1px);
 }
 
-.emotion-7:last-of-type {
+.emotion-6:last-of-type {
   border-bottom-left-radius: calc(2px - 1px);
   border-bottom-right-radius: calc(2px - 1px);
 }
 
-.emotion-9 {
+.emotion-8 {
   border-radius: 2px;
 }
 
-.emotion-9>*:first-of-type>* {
+.emotion-8>*:first-of-type>* {
   border-top-left-radius: 2px;
   border-top-right-radius: 2px;
 }
 
-.emotion-9>*:last-of-type>* {
+.emotion-8>*:last-of-type>* {
   border-bottom-left-radius: 2px;
   border-bottom-right-radius: 2px;
 }
 
-.emotion-11 {
+.emotion-10 {
   width: 100%;
   display: block;
 }
 
-.emotion-13 {
+.emotion-12 {
   -webkit-appearance: none;
   -moz-appearance: none;
   -ms-appearance: none;
@@ -579,18 +574,18 @@ exports[`EditPostPreferencesModal should match snapshot when the modal is active
   border-radius: 2px;
 }
 
-.emotion-13:hover {
+.emotion-12:hover {
   color: var( --wp-admin-theme-color, #007cba);
 }
 
-.emotion-13:focus {
+.emotion-12:focus {
   background-color: transparent;
   color: var( --wp-admin-theme-color, #007cba);
   border-color: var( --wp-admin-theme-color, #007cba);
   outline: 3px solid transparent;
 }
 
-.emotion-15 {
+.emotion-14 {
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
@@ -609,11 +604,11 @@ exports[`EditPostPreferencesModal should match snapshot when the modal is active
   width: 100%;
 }
 
-.emotion-15>* {
+.emotion-14>* {
   min-width: 0;
 }
 
-.emotion-17 {
+.emotion-16 {
   display: block;
   max-height: 100%;
   max-width: 100%;
@@ -621,14 +616,14 @@ exports[`EditPostPreferencesModal should match snapshot when the modal is active
   min-width: 0;
 }
 
-.emotion-19 {
+.emotion-18 {
   display: block;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
 }
 
-.emotion-47 {
+.emotion-46 {
   background: transparent;
   display: block;
   margin: 0!important;
@@ -648,7 +643,7 @@ exports[`EditPostPreferencesModal should match snapshot when the modal is active
 }
 
 @media ( prefers-reduced-motion: reduce ) {
-  .emotion-47 {
+  .emotion-46 {
     transition-duration: 0ms;
   }
 }
@@ -701,52 +696,52 @@ exports[`EditPostPreferencesModal should match snapshot when the modal is active
       data-wp-component="NavigatorProvider"
     >
       <div
-        class="emotion-2 components-navigator-screen"
+        class="components-navigator-screen"
         data-wp-c16t="true"
         data-wp-component="NavigatorScreen"
         style="opacity: 0; transform: translateX(50px) translateZ(0);"
       >
         <div
-          class="components-surface components-card emotion-3 emotion-1"
+          class="components-surface components-card emotion-2 emotion-1"
           data-wp-c16t="true"
           data-wp-component="Card"
         >
           <div
-            class="emotion-5 emotion-1"
+            class="emotion-4 emotion-1"
           >
             <div
-              class="components-card__body components-card-body emotion-7 emotion-1"
+              class="components-card__body components-card-body emotion-6 emotion-1"
               data-wp-c16t="true"
               data-wp-component="CardBody"
             >
               <div
-                class="components-item-group emotion-9 emotion-1"
+                class="components-item-group emotion-8 emotion-1"
                 data-wp-c16t="true"
                 data-wp-component="ItemGroup"
                 role="list"
               >
                 <div
-                  class="emotion-11"
+                  class="emotion-10"
                   role="listitem"
                 >
                   <button
-                    class="components-item components-navigator-button emotion-1 emotion-13 emotion-1"
+                    class="components-item components-navigator-button emotion-1 emotion-12 emotion-1"
                     data-wp-c16t="true"
                     data-wp-component="NavigatorButton"
                     id="general"
                   >
                     <div
-                      class="components-flex components-h-stack emotion-15 emotion-1"
+                      class="components-flex components-h-stack emotion-14 emotion-1"
                       data-wp-c16t="true"
                       data-wp-component="HStack"
                     >
                       <div
-                        class="components-flex-item emotion-17 emotion-1"
+                        class="components-flex-item emotion-16 emotion-1"
                         data-wp-c16t="true"
                         data-wp-component="FlexItem"
                       >
                         <span
-                          class="components-truncate emotion-19 emotion-1"
+                          class="components-truncate emotion-18 emotion-1"
                           data-wp-c16t="true"
                           data-wp-component="Truncate"
                         >
@@ -754,7 +749,7 @@ exports[`EditPostPreferencesModal should match snapshot when the modal is active
                         </span>
                       </div>
                       <div
-                        class="components-flex-item emotion-17 emotion-1"
+                        class="components-flex-item emotion-16 emotion-1"
                         data-wp-c16t="true"
                         data-wp-component="FlexItem"
                       >
@@ -775,27 +770,27 @@ exports[`EditPostPreferencesModal should match snapshot when the modal is active
                   </button>
                 </div>
                 <div
-                  class="emotion-11"
+                  class="emotion-10"
                   role="listitem"
                 >
                   <button
-                    class="components-item components-navigator-button emotion-1 emotion-13 emotion-1"
+                    class="components-item components-navigator-button emotion-1 emotion-12 emotion-1"
                     data-wp-c16t="true"
                     data-wp-component="NavigatorButton"
                     id="blocks"
                   >
                     <div
-                      class="components-flex components-h-stack emotion-15 emotion-1"
+                      class="components-flex components-h-stack emotion-14 emotion-1"
                       data-wp-c16t="true"
                       data-wp-component="HStack"
                     >
                       <div
-                        class="components-flex-item emotion-17 emotion-1"
+                        class="components-flex-item emotion-16 emotion-1"
                         data-wp-c16t="true"
                         data-wp-component="FlexItem"
                       >
                         <span
-                          class="components-truncate emotion-19 emotion-1"
+                          class="components-truncate emotion-18 emotion-1"
                           data-wp-c16t="true"
                           data-wp-component="Truncate"
                         >
@@ -803,7 +798,7 @@ exports[`EditPostPreferencesModal should match snapshot when the modal is active
                         </span>
                       </div>
                       <div
-                        class="components-flex-item emotion-17 emotion-1"
+                        class="components-flex-item emotion-16 emotion-1"
                         data-wp-c16t="true"
                         data-wp-component="FlexItem"
                       >
@@ -824,27 +819,27 @@ exports[`EditPostPreferencesModal should match snapshot when the modal is active
                   </button>
                 </div>
                 <div
-                  class="emotion-11"
+                  class="emotion-10"
                   role="listitem"
                 >
                   <button
-                    class="components-item components-navigator-button emotion-1 emotion-13 emotion-1"
+                    class="components-item components-navigator-button emotion-1 emotion-12 emotion-1"
                     data-wp-c16t="true"
                     data-wp-component="NavigatorButton"
                     id="panels"
                   >
                     <div
-                      class="components-flex components-h-stack emotion-15 emotion-1"
+                      class="components-flex components-h-stack emotion-14 emotion-1"
                       data-wp-c16t="true"
                       data-wp-component="HStack"
                     >
                       <div
-                        class="components-flex-item emotion-17 emotion-1"
+                        class="components-flex-item emotion-16 emotion-1"
                         data-wp-c16t="true"
                         data-wp-component="FlexItem"
                       >
                         <span
-                          class="components-truncate emotion-19 emotion-1"
+                          class="components-truncate emotion-18 emotion-1"
                           data-wp-c16t="true"
                           data-wp-component="Truncate"
                         >
@@ -852,7 +847,7 @@ exports[`EditPostPreferencesModal should match snapshot when the modal is active
                         </span>
                       </div>
                       <div
-                        class="components-flex-item emotion-17 emotion-1"
+                        class="components-flex-item emotion-16 emotion-1"
                         data-wp-c16t="true"
                         data-wp-component="FlexItem"
                       >
@@ -877,13 +872,13 @@ exports[`EditPostPreferencesModal should match snapshot when the modal is active
           </div>
           <div
             aria-hidden="true"
-            class="components-elevation emotion-47 emotion-1"
+            class="components-elevation emotion-46 emotion-1"
             data-wp-c16t="true"
             data-wp-component="Elevation"
           />
           <div
             aria-hidden="true"
-            class="components-elevation emotion-47 emotion-1"
+            class="components-elevation emotion-46 emotion-1"
             data-wp-c16t="true"
             data-wp-component="Elevation"
           />