diff --git a/frontends/main/package.json b/frontends/main/package.json
index 63de77c3e9..51b6bc4065 100644
--- a/frontends/main/package.json
+++ b/frontends/main/package.json
@@ -14,7 +14,7 @@
     "@emotion/cache": "^11.13.1",
     "@emotion/styled": "^11.11.0",
     "@mitodl/course-search-utils": "3.3.2",
-    "@mitodl/smoot-design": "^6.1.0",
+    "@mitodl/smoot-design": "^6.2.2",
     "@next/bundle-analyzer": "^14.2.15",
     "@remixicon/react": "^4.2.0",
     "@sentry/nextjs": "^9.0.0",
diff --git a/frontends/main/src/page-components/LearningResourceExpanded/AiChatSyllabusSlideDown.tsx b/frontends/main/src/page-components/LearningResourceExpanded/AiChatSyllabusSlideDown.tsx
index ae3ddbeba1..9300e183f3 100644
--- a/frontends/main/src/page-components/LearningResourceExpanded/AiChatSyllabusSlideDown.tsx
+++ b/frontends/main/src/page-components/LearningResourceExpanded/AiChatSyllabusSlideDown.tsx
@@ -1,11 +1,7 @@
 import React, { useRef, useEffect } from "react"
 import { Typography, styled } from "ol-components"
 import { Button } from "@mitodl/smoot-design"
-import {
-  RiSparkling2Line,
-  RiArrowDownSLine,
-  RiCloseLine,
-} from "@remixicon/react"
+import { RiSparkling2Line, RiArrowDownSLine } from "@remixicon/react"
 import type { AiChatProps } from "@mitodl/smoot-design/ai"
 import { LearningResource } from "api"
 import { AiChat } from "@mitodl/smoot-design/ai"
@@ -74,31 +70,21 @@ const StyledButton = styled(Button)<{ open: boolean }>(({ theme, open }) => ({
   "&&": {
     ":hover": {
       backgroundColor: theme.custom.colors.white,
-      borderColor: open
-        ? theme.custom.colors.darkGray1
-        : theme.custom.colors.silverGray,
-      "svg:last-child": {
-        backgroundColor: open ? theme.custom.colors.darkGray1 : "transparent",
-      },
+      borderColor: theme.custom.colors.silverGray,
     },
   },
+  "svg:last-child": {
+    transform: open ? "rotate(-180deg)" : "rotate(0deg)",
+    transition: "transform 0.3s ease-in-out",
+  },
 }))
 
-const OpenChevron = styled(RiArrowDownSLine)(({ theme }) => ({
+const Chevron = styled(RiArrowDownSLine)(({ theme }) => ({
   fill: theme.custom.colors.mitRed,
   position: "absolute",
   right: "9px",
 }))
 
-const CloseButton = styled(RiCloseLine)(({ theme }) => ({
-  fill: theme.custom.colors.white,
-  position: "absolute",
-  right: "0",
-  padding: "9px",
-  boxSizing: "content-box",
-  backgroundColor: theme.custom.colors.silverGray,
-}))
-
 const StyledAiChat = styled(AiChat)<{
   topPosition: number
 }>(({ topPosition }) => ({
@@ -146,7 +132,7 @@ export const AiChatSyllabusOpener = ({
         <Typography variant="body1">
           Ask<strong>TIM</strong> about this course
         </Typography>
-        {open ? <CloseButton /> : <OpenChevron />}
+        <Chevron />
       </StyledButton>
     </Opener>
   )
diff --git a/frontends/main/src/page-components/LearningResourceExpanded/LearningResourceExpanded.tsx b/frontends/main/src/page-components/LearningResourceExpanded/LearningResourceExpanded.tsx
index ef1dbe4b29..1f0e5652d0 100644
--- a/frontends/main/src/page-components/LearningResourceExpanded/LearningResourceExpanded.tsx
+++ b/frontends/main/src/page-components/LearningResourceExpanded/LearningResourceExpanded.tsx
@@ -174,7 +174,9 @@ const LearningResourceExpanded: React.FC<LearningResourceExpandedProps> = ({
       outerContainerRef.current.scrollTo(0, 0)
     }
     if (scrollElement) {
-      scrollElement.scrollTop = 0
+      requestAnimationFrame(() => {
+        scrollElement.scrollTop = 0
+      })
     }
   }, [resourceId, scrollElement])
 
diff --git a/yarn.lock b/yarn.lock
index 7f5cb83965..22121736a3 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2703,9 +2703,9 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@mitodl/smoot-design@npm:^6.1.0":
-  version: 6.1.0
-  resolution: "@mitodl/smoot-design@npm:6.1.0"
+"@mitodl/smoot-design@npm:^6.2.2":
+  version: 6.2.2
+  resolution: "@mitodl/smoot-design@npm:6.2.2"
   dependencies:
     "@emotion/cache": "npm:^11.14.0"
     "@mui/utils": "npm:^6.1.6"
@@ -2725,7 +2725,7 @@ __metadata:
     "@remixicon/react": ^4.2.0
     react: ^18 || ^19
     react-dom: ^18 || ^19
-  checksum: 10/1395c039f7b30dc73d317de264e37ccf98c2e9d9a87083e4549136bcb3b15017a472a5a98c476ba22b942a9ea97f4bc93d2182902db05b9ffbaca5b66e53fc80
+  checksum: 10/e82638cf078014d970e720061f85a4b4338dcb20c0bae022b968f2ec3c6a6b25a37dd927400f443324cf033efba9dbfa882175bb00ac13001c237be3a3255039
   languageName: node
   linkType: hard
 
@@ -13083,7 +13083,7 @@ __metadata:
     "@emotion/styled": "npm:^11.11.0"
     "@faker-js/faker": "npm:^9.0.0"
     "@mitodl/course-search-utils": "npm:3.3.2"
-    "@mitodl/smoot-design": "npm:^6.1.0"
+    "@mitodl/smoot-design": "npm:^6.2.2"
     "@next/bundle-analyzer": "npm:^14.2.15"
     "@remixicon/react": "npm:^4.2.0"
     "@sentry/nextjs": "npm:^9.0.0"