diff --git a/src/components/app-layout.tsx b/src/components/app-layout.tsx
index 99f9583..afdadca 100644
--- a/src/components/app-layout.tsx
+++ b/src/components/app-layout.tsx
@@ -1416,7 +1416,7 @@ export default function AppLayout() {
           </div>
         </header>
 
-        <div className="flex-1 p-4 md:p-6 bg-gradient-to-br from-white via-white to-emerald-50/20 dark:from-gray-950 dark:via-gray-950 dark:to-emerald-950/10">
+        <div className="flex-1 p-4 md:p-6 overflow-y-auto bg-gradient-to-br from-white via-white to-emerald-50/20 dark:from-gray-950 dark:via-gray-950 dark:to-emerald-950/10">
           <AnimatePresence mode="wait">
             <motion.div
               key={currentView}
diff --git a/src/components/notebooks-view.tsx b/src/components/notebooks-view.tsx
index e9c6c6f..06c09cd 100755
--- a/src/components/notebooks-view.tsx
+++ b/src/components/notebooks-view.tsx
@@ -2533,7 +2533,7 @@ function NotebookDetailView({
             </Button>
           </div>
 
-          <ScrollArea className="flex-1 max-h-[calc(100vh-280px)]">
+          <ScrollArea className="flex-1 max-h-[calc(100vh-350px)] min-h-0">
             <div className="p-2 space-y-2">
               {pages.map((page, idx) => {
                 const isDragged = draggedPageId === page.id;
@@ -4668,7 +4668,7 @@ export default function NotebooksView() {
 
   if (selectedNotebook) {
     return (
-      <div className="min-h-screen bg-gray-50 dark:bg-gray-950">
+      <div className="h-[calc(100vh-8rem)] bg-gray-50 dark:bg-gray-950 rounded-lg overflow-hidden">
         <NotebookDetailView
           notebook={selectedNotebook}
           subjectName={selectedNotebook.subjectId ? subjectNameMap[selectedNotebook.subjectId] ?? null : null}