diff --git a/src/components/progress-table.svelte b/src/components/progress-table.svelte
index 0ac9330..9a8d903 100644
--- a/src/components/progress-table.svelte
+++ b/src/components/progress-table.svelte
@@ -7,8 +7,8 @@
 
   let interval: Parameters<typeof clearInterval>[0] = undefined;
 
-  let scrolled = $state(false);
-  let container: HTMLDivElement;
+  let y = $state(0);
+  let scrolled = $derived(y > 32);
 
   $effect(() => {
     clearInterval(interval);
@@ -34,17 +34,9 @@
   });
 </script>
 
-<div
-  bind:this={container}
-  class="relative col-[content] max-h-[calc(var(--main-min-height)---spacing(8))] overflow-y-auto pr-0.5"
-  onscroll={(e) => {
-    const scrollTop = container.scrollTop;
-    const scrollHeight = container.scrollHeight;
-    const clientHeight = container.clientHeight;
+<svelte:window bind:scrollY={y} />
 
-    scrolled = scrollTop > 32;
-  }}
->
+<div class="relative col-[content] pr-0.5">
   {#await entriesPromise}
     <p class="text-center">Loading entries...</p>
   {:then entries}
@@ -52,9 +44,6 @@
       <p class="text-center">No entries.</p>
     {:else}
       {@render table(entries)}
-      <div
-        class="sticky inset-x-0 bottom-0 h-16 bg-gradient-to-t from-gray-950 to-transparent"
-      ></div>
     {/if}
   {:catch error}
     <p class="mx-auto max-w-md text-center">
@@ -68,7 +57,7 @@
     class="@container grid w-full grid-cols-[auto,1fr,auto,auto,auto] gap-1 font-light @lg:gap-3"
   >
     <div
-      class="sticky top-0 col-span-5 grid grid-cols-[subgrid] gap-1 bg-gray-950 py-2 text-gray-400 capitalize"
+      class="sticky top-(--header-height) col-span-5 grid grid-cols-[subgrid] gap-1 bg-gray-950 py-2 text-gray-400 capitalize"
     >
       <div>id</div>
       <div class="px-1">name</div>
@@ -78,8 +67,7 @@
 
       {#if scrolled}
         <div
-          in:fade={{ duration: 500, easing: cubicInOut }}
-          out:fade={{ duration: 250, easing: cubicInOut }}
+          transition:fade={{ duration: 250, easing: cubicInOut }}
           class="absolute inset-x-0 top-full h-16 bg-gradient-to-b from-gray-950 to-transparent"
         ></div>
       {/if}
@@ -104,6 +92,7 @@
       </div>
     {/each}
   </div>
+  <div class="sticky inset-x-0 bottom-0 h-16 bg-gradient-to-t from-gray-950 to-transparent"></div>
 {/snippet}
 
 {#snippet done(finished: boolean)}