diff --git a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Sketch-on-face-with-none-z-up-1-Google-Chrome-linux.png b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Sketch-on-face-with-none-z-up-1-Google-Chrome-linux.png
index 5e9c65bcb..7f5983b68 100644
Binary files a/e2e/playwright/snapshot-tests.spec.ts-snapshots/Sketch-on-face-with-none-z-up-1-Google-Chrome-linux.png and b/e2e/playwright/snapshot-tests.spec.ts-snapshots/Sketch-on-face-with-none-z-up-1-Google-Chrome-linux.png differ
diff --git a/src/components/ModelingSidebar/ModelingPane.tsx b/src/components/ModelingSidebar/ModelingPane.tsx
index 35c1857c4..966dc0ffb 100644
--- a/src/components/ModelingSidebar/ModelingPane.tsx
+++ b/src/components/ModelingSidebar/ModelingPane.tsx
@@ -1,5 +1,6 @@
 import { useStore } from 'useStore'
 import styles from './ModelingPane.module.css'
+import { useSettingsAuthContext } from 'hooks/useSettingsAuthContext'
 
 export interface ModelingPaneProps
   extends React.PropsWithChildren,
@@ -29,18 +30,21 @@ export const ModelingPane = ({
   detailsTestId,
   ...props
 }: ModelingPaneProps) => {
+  const { settings } = useSettingsAuthContext()
+  const onboardingStatus = settings.context.app.onboardingStatus
   const { buttonDownInStream } = useStore((s) => ({
     buttonDownInStream: s.buttonDownInStream,
   }))
+  const pointerEventsCssClass =
+    buttonDownInStream || onboardingStatus.current === 'camera'
+      ? 'pointer-events-none '
+      : 'pointer-events-auto '
   return (
     <section
       {...props}
       data-testid={detailsTestId}
       className={
-        (buttonDownInStream ? 'pointer-events-none ' : 'pointer-events-auto ') +
-        styles.panel +
-        ' group ' +
-        (className || '')
+        pointerEventsCssClass + styles.panel + ' group ' + (className || '')
       }
     >
       <ModelingPaneHeader title={title} Menu={Menu} />
diff --git a/src/components/ModelingSidebar/ModelingSidebar.tsx b/src/components/ModelingSidebar/ModelingSidebar.tsx
index 30653d12d..4953178a8 100644
--- a/src/components/ModelingSidebar/ModelingSidebar.tsx
+++ b/src/components/ModelingSidebar/ModelingSidebar.tsx
@@ -15,19 +15,18 @@ interface ModelingSidebarProps {
 }
 
 export function ModelingSidebar({ paneOpacity }: ModelingSidebarProps) {
-  const { buttonDownInStream, openPanes } = useStore((s) => ({
+  const { settings } = useSettingsAuthContext()
+  const onboardingStatus = settings.context.app.onboardingStatus
+  const { openPanes, buttonDownInStream } = useStore((s) => ({
     buttonDownInStream: s.buttonDownInStream,
     openPanes: s.openPanes,
   }))
-  const { settings } = useSettingsAuthContext()
-  const {
-    app: { onboardingStatus },
-  } = settings.context
-
   const pointerEventsCssClass =
-    buttonDownInStream || onboardingStatus.current === 'camera'
+    buttonDownInStream ||
+    onboardingStatus.current === 'camera' ||
+    openPanes.length === 0
       ? 'pointer-events-none '
-      : 'pointer-events-auto'
+      : 'pointer-events-auto '
 
   return (
     <Resizable
@@ -41,8 +40,7 @@ export function ModelingSidebar({ paneOpacity }: ModelingSidebarProps) {
       handleClasses={{
         right:
           (openPanes.length === 0 ? 'hidden ' : 'block ') +
-          'translate-x-1/2 hover:bg-chalkboard-10 hover:dark:bg-chalkboard-110 bg-transparent transition-colors duration-75 transition-ease-out delay-100 ' +
-          pointerEventsCssClass,
+          'translate-x-1/2 hover:bg-chalkboard-10 hover:dark:bg-chalkboard-110 bg-transparent transition-colors duration-75 transition-ease-out delay-100 ',
       }}
     >
       <div className={styles.grid + ' flex-1'}>
@@ -118,6 +116,7 @@ function ModelingSidebarSection({
     >
       <Tab.List
         className={
+          'pointer-events-auto ' +
           (alignButtons === 'start'
             ? 'justify-start self-start'
             : 'justify-end self-end') +
diff --git a/src/index.css b/src/index.css
index 966f081cd..e488963b1 100644
--- a/src/index.css
+++ b/src/index.css
@@ -135,9 +135,13 @@ code {
   overflow: auto;
 }
 
+#code-mirror-override .cm-gutter {
+  @apply select-none;
+}
+
 #code-mirror-override .cm-activeLine,
 #code-mirror-override .cm-activeLineGutter {
-  @apply bg-primary/20;
+  @apply bg-primary/10;
 }
 
 .dark #code-mirror-override .cm-activeLine,