diff --git a/src/main/frontend/pipeline-console-view/pipeline-console/main/components/stages.scss b/src/main/frontend/pipeline-console-view/pipeline-console/main/components/stages.scss
index f87664b4e..43e84aa66 100644
--- a/src/main/frontend/pipeline-console-view/pipeline-console/main/components/stages.scss
+++ b/src/main/frontend/pipeline-console-view/pipeline-console/main/components/stages.scss
@@ -1,3 +1,9 @@
+@property --additional-height {
+  syntax: "<length>";
+  initial-value: 0px;
+  inherits: false;
+}
+
 .pgv-stages-graph {
   --card-background: color-mix(
     in srgb,
@@ -24,6 +30,15 @@
             var(--section-padding)
         )
     );
+    animation: grow-height linear forwards;
+    animation-timeline: scroll();
+    animation-range-end: 100px;
+
+    @keyframes grow-height {
+      to {
+        --additional-height: 100px;
+      }
+    }
   }
 
   &--dialog {
diff --git a/src/main/frontend/pipeline-console-view/pipeline-console/main/scroll-to-top-bottom.scss b/src/main/frontend/pipeline-console-view/pipeline-console/main/scroll-to-top-bottom.scss
index 53c42b5ad..2d2acf6ae 100644
--- a/src/main/frontend/pipeline-console-view/pipeline-console/main/scroll-to-top-bottom.scss
+++ b/src/main/frontend/pipeline-console-view/pipeline-console/main/scroll-to-top-bottom.scss
@@ -1,5 +1,6 @@
 .pgv-scroll-to-top-bottom {
   position: fixed;
+  bottom: calc(var(--section-padding) * 1);
   bottom: var(--section-padding);
   right: calc(var(--section-padding) * 2);
   display: flex;
@@ -16,6 +17,15 @@
     scale var(--elastic-transition);
   pointer-events: none;
   z-index: 1;
+  animation: animate-scroll-to-bottom-offset linear forwards;
+  animation-timeline: scroll();
+  animation-range-start: calc(100% - 100px);
+
+  @keyframes animate-scroll-to-bottom-offset {
+    to {
+      translate: 0 -100px;
+    }
+  }
 
   &--visible {
     opacity: 1;
diff --git a/src/main/frontend/pipeline-console-view/pipeline-console/main/scroll-to-top-bottom.tsx b/src/main/frontend/pipeline-console-view/pipeline-console/main/scroll-to-top-bottom.tsx
index 34c966028..a86b577db 100644
--- a/src/main/frontend/pipeline-console-view/pipeline-console/main/scroll-to-top-bottom.tsx
+++ b/src/main/frontend/pipeline-console-view/pipeline-console/main/scroll-to-top-bottom.tsx
@@ -18,7 +18,7 @@ export default function ScrollToTopBottom() {
 
       const atTop = scrollTop <= 10;
       const atBottom = scrollTop + windowHeight >= docHeight - 10;
-      const scrollable = docHeight > windowHeight + 10;
+      const scrollable = docHeight > windowHeight + 100;
 
       setIsAtTop(atTop);
       setIsAtBottom(atBottom);