diff --git a/packages/core/rendering/core-rendering-server-internal/src/views/template.tsx b/packages/core/rendering/core-rendering-server-internal/src/views/template.tsx
index bbc8109e403da..bac48c88e1b23 100644
--- a/packages/core/rendering/core-rendering-server-internal/src/views/template.tsx
+++ b/packages/core/rendering/core-rendering-server-internal/src/views/template.tsx
@@ -54,8 +54,8 @@ export const Template: FunctionComponent<Props> = ({
         <meta name="color-scheme" content="light dark" />
         {/* Inject EUI reset and global styles before all other component styles */}
         <meta name={EUI_STYLES_GLOBAL} />
-        <Styles darkMode={darkMode} stylesheetPaths={stylesheetPaths} />
         <meta name="emotion" />
+        <Styles darkMode={darkMode} stylesheetPaths={stylesheetPaths} />
         {/* Inject stylesheets into the <head> before scripts so that KP plugins with bundled styles will override them */}
         <meta name="add-styles-here" />
         <meta name="add-scripts-here" />
diff --git a/packages/kbn-storybook/templates/index.ejs b/packages/kbn-storybook/templates/index.ejs
index e8d8d4d6df09d..b52fc548b814b 100644
--- a/packages/kbn-storybook/templates/index.ejs
+++ b/packages/kbn-storybook/templates/index.ejs
@@ -15,6 +15,7 @@
     <meta name="viewport" content="width=device-width, initial-scale=1" />
     
     <meta name="eui-global" />
+    <meta name="emotion" />
 
     <!-- Added for Kibana shared dependencies -->
     <script>
@@ -26,8 +27,6 @@
     <link id="eui-theme-css" href="kbn-ui-shared-deps-npm.v8.light.css" rel="stylesheet" />
     <!--                                      -->
 
-    <meta name="emotion" />
-
     <% if (typeof headHtmlSnippet !== 'undefined') { %> <%= headHtmlSnippet %> <% } %> <%
     htmlWebpackPlugin.files.css.forEach(file => { %>
     <link href="<%= file %>" rel="stylesheet" />
diff --git a/src/plugins/unified_histogram/public/panels/panels_resizable.tsx b/src/plugins/unified_histogram/public/panels/panels_resizable.tsx
index bbf4a70f90e9d..36af60f317247 100644
--- a/src/plugins/unified_histogram/public/panels/panels_resizable.tsx
+++ b/src/plugins/unified_histogram/public/panels/panels_resizable.tsx
@@ -61,7 +61,7 @@ export const PanelsResizable = ({
     []
   );
   const resizeWithPortalsHackButtonCss = css`
-    z-index: 3;
+    z-index: 3 !important; // !important can be removed once EuiResizableButton is converted to Emotion
   `;
   const resizeWithPortalsHackOverlayCss = css`
     position: absolute;
@@ -164,7 +164,9 @@ export const PanelsResizable = ({
 
   const { euiTheme } = useEuiTheme();
   const buttonCss = css`
-    && {
+    // The selectors here are intended to override EuiResizableButtons's Sass styles
+    // it can be removed once EuiResizableButton has been converted to Emotion
+    &.euiResizableButton.euiResizableButton--vertical {
       margin-top: -${euiTheme.size.base};
       margin-bottom: 0;
     }
diff --git a/x-pack/plugins/aiops/public/components/change_point_detection/change_points_table.tsx b/x-pack/plugins/aiops/public/components/change_point_detection/change_points_table.tsx
index 905a76fe90e94..b49b3d41e5689 100644
--- a/x-pack/plugins/aiops/public/components/change_point_detection/change_points_table.tsx
+++ b/x-pack/plugins/aiops/public/components/change_point_detection/change_points_table.tsx
@@ -116,7 +116,11 @@ export const ChangePointsTable: FC<ChangePointsTableProps> = ({
       height: '80px',
       truncateText: false,
       valign: 'middle',
-      css: { display: 'block', padding: 0 },
+      css: {
+        // Extra specificity needed here to override Sass styles
+        // TODO: Can be removed once EuiTable has been converted to Emotion
+        ['&.euiTableCellContent']: { display: 'block', padding: 0 },
+      },
       render: (annotation: ChangePointAnnotation) => {
         return <MiniChartPreview annotation={annotation} fieldConfig={fieldConfig} />;
       },
