From 25df856e009b7e3a6729eb52fa1a73b9352132ab Mon Sep 17 00:00:00 2001
From: Mike Fara <mjfara@gmail.com>
Date: Sat, 31 Oct 2026 00:59:08 -0400
Subject: [PATCH] Place the BSOD AI chat under the results

It opened between the summary strip and the report, pushing a long report
down. It now sits right after the results, and opening it scrolls it into
view from the wand in the strip.

Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
---
 pages/Analyzer.tsx | 18 ++++++++++++++----
 styles.css         |  2 +-
 2 files changed, 15 insertions(+), 5 deletions(-)

diff --git a/pages/Analyzer.tsx b/pages/Analyzer.tsx
index a455826..88e0dbe 100644
--- a/pages/Analyzer.tsx
+++ b/pages/Analyzer.tsx
@@ -205,6 +205,14 @@ const Analyzer: React.FC = () => {
         wasLive.current = live;
     }, [live]);
 
+    // The chat sits under the results, which can be far below the wand: bring it into view when it opens.
+    useEffect(() => {
+        if (!aiOpen) return;
+        const reduce = window.matchMedia('(prefers-reduced-motion: reduce)').matches;
+        const id = setTimeout(() => document.getElementById('bsod-ai-chat')?.scrollIntoView({ behavior: reduce ? 'auto' : 'smooth', block: 'nearest' }), 0);
+        return () => clearTimeout(id);
+    }, [aiOpen]);
+
     const analyzerStructuredData = {
         "@context": "https://schema.org",
         "@graph": [
@@ -324,9 +332,6 @@ const Analyzer: React.FC = () => {
                         </button>
                     </div>
                 )}
-                {summaryOpen && !live && aiOpen && fresh.length > 0 && (
-                    <BsodAiChat files={fresh} onClose={() => { setAiOpen(false); setTimeout(() => wandRef.current?.focus(), 0); }} />
-                )}
                 {error && <ErrorAlert error={error} className="mt-2" />}
 
                 <AnalysisCompletionAnnouncer isAnalyzing={isAnalyzing} analyzedCount={analyzedCount} />
@@ -353,7 +358,12 @@ const Analyzer: React.FC = () => {
                     showAds={true}
                     AdComponent={InFeedAd}
                 />
-                
+
+                {/* Under the report it is about, not above it: the wand in the summary strip opens it and scrolls here. */}
+                {summaryOpen && !live && aiOpen && fresh.length > 0 && (
+                    <BsodAiChat files={fresh} onClose={() => { setAiOpen(false); setTimeout(() => wandRef.current?.focus(), 0); }} />
+                )}
+
                 {/* Vertical ad on desktop, shown alongside results */}
                 {dumpFiles.some(df => df.status !== FileStatus.PENDING) && (
                     <aside className="desktop-only" style={{
diff --git a/styles.css b/styles.css
index 9d3d9ff..7a56847 100755
--- a/styles.css
+++ b/styles.css
@@ -3172,7 +3172,7 @@ body:has(.sticky-ad ins[data-ad-status="filled"]) .analyzer-live { min-height: c
 .analyzer-summary small { display: block; font-size: 0.7rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text-tertiary); }
 .analyzer-summary .btn { margin-left: auto; }
 /* BSOD AI chat (components/BsodAiChat.tsx): the wand in the summary strip opens it. */
-.ai-chat { --teal: #14b8a6; display: flex; flex-direction: column; max-height: min(36rem, 80dvh); margin-top: 1rem; border: 1px solid var(--glass-border); border-radius: 20px; background: var(--glass-bg); overflow: hidden; }
+.ai-chat { --teal: #14b8a6; display: flex; flex-direction: column; max-height: min(36rem, 80dvh); margin: 1rem 0; border: 1px solid var(--glass-border); border-radius: 20px; background: var(--glass-bg); overflow: hidden; }
 .light .ai-chat { --teal: #0d9488; }
 .ai-head { display: flex; align-items: center; gap: 0.75rem; padding: 0.7rem 1rem; border-bottom: 1px solid var(--border-primary); }
 .ai-avatar { flex: none; width: 3.25rem; height: 3.25rem; }