From d118497d837c6f78c5c6b3187f988f0d8d65667c Mon Sep 17 00:00:00 2001
From: Rob Colbert <rob@digitaltelepresence.com>
Date: Mon, 11 May 2026 21:09:17 -0400
Subject: [PATCH] CSS and style fixes for subagent display

---
 .../frontend/src/components/ChatTurn.tsx      |  8 ++--
 gadget-code/frontend/src/index.css            | 37 +++++++++++++++++++
 2 files changed, 41 insertions(+), 4 deletions(-)

diff --git a/gadget-code/frontend/src/components/ChatTurn.tsx b/gadget-code/frontend/src/components/ChatTurn.tsx
index 9ddf4cc..d514cd5 100644
--- a/gadget-code/frontend/src/components/ChatTurn.tsx
+++ b/gadget-code/frontend/src/components/ChatTurn.tsx
@@ -179,7 +179,7 @@ function SubagentDisplay({ subagent }: { subagent: NonNullable<ChatTurnBlockTool
   };
 
   return (
-    <div className="mt-2 ml-4 border-l-2 border-brand/30 pl-3">
+    <div className="ml-4 border-l-2 border-brand/20 pl-2">
       <button
         onClick={toggle}
         className="flex items-center gap-1.5 text-xs font-mono text-text-muted hover:text-text-primary transition-colors w-full text-left"
@@ -194,13 +194,13 @@ function SubagentDisplay({ subagent }: { subagent: NonNullable<ChatTurnBlockTool
       </button>
 
       {expanded && (
-        <div className="mt-2 space-y-2">
+        <div className="space-y-1">
           {/* Thinking */}
           {subagent.thinking && (
             <div>
               <div className="text-xs text-text-muted font-mono mb-1">Thinking</div>
               <div
-                className="p-2 bg-bg-secondary rounded text-xs text-text-muted whitespace-pre-wrap font-mono"
+                className="p-2 bg-bg-secondary rounded text-xs text-text-muted whitespace-pre-wrap font-mono py-1"
                 dangerouslySetInnerHTML={{
                   __html: marked.parse(subagent.thinking) as string,
                 }}
@@ -231,7 +231,7 @@ function SubagentDisplay({ subagent }: { subagent: NonNullable<ChatTurnBlockTool
             <div>
               <div className="text-xs text-text-muted font-mono mb-1">Response</div>
               <div
-                className="text-xs text-text-primary gadget-markdown"
+                className="subagent-markdown gadget-markdown"
                 dangerouslySetInnerHTML={{
                   __html: marked.parse(subagent.response) as string,
                 }}
diff --git a/gadget-code/frontend/src/index.css b/gadget-code/frontend/src/index.css
index 15654e5..212c560 100644
--- a/gadget-code/frontend/src/index.css
+++ b/gadget-code/frontend/src/index.css
@@ -243,6 +243,43 @@ input, textarea {
   font-weight: 600;
 }
 
+/* ── Subagent Markdown Styles ── */
+/* Handles cascading markdown nested inside markdown blocks */
+.subagent-markdown {
+  display: inline-block;
+  width: 100%;
+  margin: 0;
+}
+
+.subagent-markdown p {
+  margin-top: 0.25rem !important;
+  margin-bottom: 0.5rem !important;
+  padding-top: 0.25rem;
+  padding-bottom: 0.25rem;
+}
+
+.subagent-markdown pre {
+  margin-bottom: 0.5rem !important;
+}
+
+.subagent-markdown ul,
+.subagent-markdown ol {
+  margin-bottom: 0.5rem !important;
+  padding-left: 1.2rem;
+}
+
+.subagent-markdown code:not(pre code) {
+  background: #1a1a1a;
+  padding: 0.15rem 0.4rem;
+  border-radius: 3px;
+}
+
+.subagent-markdown blockquote {
+  border-left-color: #2a2a2a;
+  background: #111111;
+}
+
+
 .gadget-markdown em {
   color: #c4c4c4;
 }
\ No newline at end of file