diff --git a/components/useAnchoredSurface.js b/components/useAnchoredSurface.js
index 9638a7e..59501fe 100644
--- a/components/useAnchoredSurface.js
+++ b/components/useAnchoredSurface.js
@@ -50,15 +50,14 @@ export function useAnchoredSurface({ ref, isSheet, anchor, remeasureKey }) {
       const viewportWidth = window.innerWidth;
       const padding = 12;
       const header = document.querySelector('.chat-header');
-      const legend = document.querySelector('.confidence-legend');
       const form = document.querySelector('.message-form');
-      const chromeBottom = (legend || header)?.getBoundingClientRect().bottom ?? 0;
+      const chromeBottom = header?.getBoundingClientRect().bottom ?? 0;
       const topSafe = Math.max(padding, chromeBottom + 8);
       const bottomSafe = form
         ? form.getBoundingClientRect().top - 8
         : window.innerHeight - 80;
 
-      // Prefer below the token so the card does not cover the header/legend.
+      // Prefer below the token so the card does not cover the header.
       let top = anchor.y + 20;
       let left = anchor.x - (rect.width / 2);
 
diff --git a/package-lock.json b/package-lock.json
index adb0ae3..fc8effd 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -15,8 +15,7 @@
         "next": "13.5.11",
         "openai": "^4.10.0",
         "react": "18.2.0",
-        "react-dom": "18.2.0",
-        "styled-jsx": "^5.1.6"
+        "react-dom": "18.2.0"
       },
       "devDependencies": {
         "eslint": "8.45.0",
@@ -4267,29 +4266,6 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
-    "node_modules/styled-jsx": {
-      "version": "5.1.6",
-      "resolved": "https://registry.npmjs.org/styled-jsx/-/styled-jsx-5.1.6.tgz",
-      "integrity": "sha512-qSVyDTeMotdvQYoHWLNGwRFJHC+i+ZvdBRYosOFgC+Wg1vx4frN2/RG/NA7SYqqvKNLf39P2LSRA2pu6n0XYZA==",
-      "license": "MIT",
-      "dependencies": {
-        "client-only": "0.0.1"
-      },
-      "engines": {
-        "node": ">= 12.0.0"
-      },
-      "peerDependencies": {
-        "react": ">= 16.8.0 || 17.x.x || ^18.0.0-0 || ^19.0.0-0"
-      },
-      "peerDependenciesMeta": {
-        "@babel/core": {
-          "optional": true
-        },
-        "babel-plugin-macros": {
-          "optional": true
-        }
-      }
-    },
     "node_modules/supports-color": {
       "version": "7.2.0",
       "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
diff --git a/package.json b/package.json
index a5737e9..fef3833 100644
--- a/package.json
+++ b/package.json
@@ -17,8 +17,7 @@
     "next": "13.5.11",
     "openai": "^4.10.0",
     "react": "18.2.0",
-    "react-dom": "18.2.0",
-    "styled-jsx": "^5.1.6"
+    "react-dom": "18.2.0"
   },
   "devDependencies": {
     "eslint": "8.45.0",
diff --git a/styles/surfaces.css b/styles/surfaces.css
index bfb3d2f..1498652 100644
--- a/styles/surfaces.css
+++ b/styles/surfaces.css
@@ -440,10 +440,6 @@
   .token-probabilities-bar-fill {
     transition: none;
   }
-
-  .token.is-after-fork {
-    animation: none;
-  }
 }
 
 @keyframes tokenHintPulse {
@@ -473,6 +469,13 @@
   animation: forkFadeIn 160ms ease-out;
 }
 
+/* Must follow the base rule: equal specificity, source order decides. */
+@media (prefers-reduced-motion: reduce) {
+  .token.is-after-fork {
+    animation: none;
+  }
+}
+
 @keyframes forkFadeIn {
   from { opacity: 0.35; }
   to   { opacity: 1; }