diff --git a/web/src/app/_components/message-list-view.tsx b/web/src/app/_components/message-list-view.tsx
index 7f08bd7..0937ade 100644
--- a/web/src/app/_components/message-list-view.tsx
+++ b/web/src/app/_components/message-list-view.tsx
@@ -70,10 +70,7 @@ export function MessageListView({
 
   return (
     <ScrollContainer
-      className={cn(
-        "flex h-full w-full flex-col overflow-hidden pt-4",
-        className,
-      )}
+      className={cn("flex h-full w-full flex-col overflow-hidden", className)}
       scrollShadowColor="var(--app-background)"
     >
       <ul className="flex flex-col">
diff --git a/web/src/app/_components/scroll-container.tsx b/web/src/app/_components/scroll-container.tsx
index e9ba9a8..2575a96 100644
--- a/web/src/app/_components/scroll-container.tsx
+++ b/web/src/app/_components/scroll-container.tsx
@@ -26,8 +26,8 @@ export function ScrollContainer({
         <>
           <div
             className={cn(
-              "absolute top-[-1px] right-0 left-0 z-10 h-10 bg-gradient-to-b",
-              `from-[var(--scroll-shadow-color)] to-transparent`,
+              "absolute top-0 right-0 left-0 z-10 h-10 bg-gradient-to-t",
+              `from-transparent to-[var(--scroll-shadow-color)]`,
             )}
             style={
               {