diff --git a/app/modules/LowerPanel/LowerPanel.tsx b/app/modules/LowerPanel/LowerPanel.tsx
index 3fee99c41a..2b0573ba72 100644
--- a/app/modules/LowerPanel/LowerPanel.tsx
+++ b/app/modules/LowerPanel/LowerPanel.tsx
@@ -12,7 +12,7 @@ export const LowerPanel = ({ children }: LowerPanelPropsI) => {
 
   return (
     <>
-      <div className="absolute top-3/4 h-1/4 w-screen border-t border-ui-panel-border bg-ui-panel">
+      <div className="absolute bottom-0 min-h-[220px] w-screen border-t border-ui-panel-border bg-ui-panel">
         {children}
       </div>
     </>
diff --git a/app/pages/PageEnigma/PageEnigma.tsx b/app/pages/PageEnigma/PageEnigma.tsx
index 9c29022965..c93a7f29ec 100644
--- a/app/pages/PageEnigma/PageEnigma.tsx
+++ b/app/pages/PageEnigma/PageEnigma.tsx
@@ -22,7 +22,6 @@ export const PageEnigma = () => {
   const canvasRef = useRef<HTMLCanvasElement | null>(null);
   const editorRef = useRef<Editor | null>(null);
   const [timelineHeight, setTimelineHeight] = useState(0);
-  const containerRef = useRef<HTMLDivElement | null>(null);
   const timelineRef = useRef<HTMLDivElement | null>(null);
 
   const editorCallback = useCallback(() => {
@@ -94,7 +93,6 @@ export const PageEnigma = () => {
               id="video-scene"
               width="1280px"
               height="720px"
-              className="hidden"
             />
 
             {/* Top controls */}
@@ -157,7 +155,7 @@ export const PageEnigma = () => {
         </div>
 
         {/* Timeline */}
-        <div ref={timelineRef}>
+        <div className="min-h-[220px]" ref={timelineRef}>
           <Timeline editorCurrent={editorRef.current} />
         </div>
       </div>
diff --git a/app/pages/PageEnigma/comps/Timeline/Timeline.tsx b/app/pages/PageEnigma/comps/Timeline/Timeline.tsx
index e0c1f6a20c..9738f52295 100644
--- a/app/pages/PageEnigma/comps/Timeline/Timeline.tsx
+++ b/app/pages/PageEnigma/comps/Timeline/Timeline.tsx
@@ -1,31 +1,32 @@
 import { LowerPanel } from "~/modules/LowerPanel";
-import {
-  Button,
-} from '~/components';
-import Editor from '../../js/editor';
+import { Button } from "~/components";
+import Editor from "../../js/editor";
 
 export const Timeline = ({
-  editorCurrent
-}:{
-  editorCurrent: Editor|null;
-})=>{
-  const handleButtonLoad = ()=>{
+  editorCurrent,
+}: {
+  editorCurrent: Editor | null;
+}) => {
+  const handleButtonLoad = () => {
     document.getElementById("load-upload")?.click();
-  }
-  const handleButtonRender = ()=>{
+  };
+  const handleButtonRender = () => {
     editorCurrent?.togglePlayback();
-  }
-  const handleButtonPlay = ()=>{
+  };
+  const handleButtonPlay = () => {};
 
-  }
-
-  return(
+  return (
     <LowerPanel>
-      <div className='h-10 w-full border-b border-ui-panel-border'></div>
-      <input style={{ display: 'none' }} type="file" id="load-upload" name="load-upload"></input>
+      <div className="h-10 w-full border-b border-ui-panel-border"></div>
+      <input
+        style={{ display: "none" }}
+        type="file"
+        id="load-upload"
+        name="load-upload"
+      ></input>
       <Button onClick={handleButtonLoad}>Load</Button>
-        <Button onClick={handleButtonRender}>Render</Button>
-        <Button onClick={handleButtonPlay}>Play</Button>
+      <Button onClick={handleButtonRender}>Render</Button>
+      <Button onClick={handleButtonPlay}>Play</Button>
     </LowerPanel>
-  )
-}
\ No newline at end of file
+  );
+};
diff --git a/app/root.tsx b/app/root.tsx
index 9323954542..024b82cecc 100644
--- a/app/root.tsx
+++ b/app/root.tsx
@@ -55,7 +55,7 @@ export default function App() {
         <Meta />
         <Links />
       </head>
-      <body className="bg-ui-background">
+      <body className="overflow-hidden bg-ui-background">
         <TopBarInnerContext.Provider
           value={{
             TopBarInner: topBarInnerComponent,