From f3a9966902d86470db83ea8cbdfec99f41386cfb Mon Sep 17 00:00:00 2001
From: Dan <rdtiv@outlook.com>
Date: Sat, 22 Aug 2026 23:28:57 -0500
Subject: [PATCH 1/3] chore(deps): remove unused styled-jsx direct dependency

Nothing in pages/, components/, or lib/ imports styled-jsx or uses
<style jsx>. Next 13.5 bundles its own copy (styled-jsx@5.1.1 under
next), so the app keeps working; only the redundant direct dependency
and its package-lock entries are dropped.
---
 package-lock.json | 26 +-------------------------
 package.json      |  3 +--
 2 files changed, 2 insertions(+), 27 deletions(-)

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",

From 6db660ebd317c4d0c53788d0ff7aee21e36f3f23 Mon Sep 17 00:00:00 2001
From: Dan <rdtiv@outlook.com>
Date: Sat, 22 Aug 2026 23:29:19 -0500
Subject: [PATCH 2/3] fix(anchor): drop dead .confidence-legend query in
 useAnchoredSurface

No element in the app carries the confidence-legend class, so the
querySelector always returned null and the header rect was already
the effective fallback. Read the header rect directly; the ?? 0
fallback behaviour when .chat-header is missing is unchanged.
---
 components/useAnchoredSurface.js | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)

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);
 

From 4ae787820c05668a4c98df855721c698352c6979 Mon Sep 17 00:00:00 2001
From: Dan <rdtiv@outlook.com>
Date: Sat, 22 Aug 2026 23:29:52 -0500
Subject: [PATCH 3/3] fix(styles): make the reduced-motion guard for
 is-after-fork take effect

The guard lived in an earlier @media block, before the equal-specificity
base rule .token.is-after-fork { animation: forkFadeIn ... } later in
the same file, so source order made the base rule win and reduced
motion never applied. Move the guard to directly after the base rule,
matching the .sampling-panel guard's existing pattern in panels.css.
---
 styles/surfaces.css | 11 +++++++----
 1 file changed, 7 insertions(+), 4 deletions(-)

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; }