diff --git a/ui/src/components/agents/ported/ChatView.tsx b/ui/src/components/agents/ported/ChatView.tsx
index 01849dd6..11d27d09 100644
--- a/ui/src/components/agents/ported/ChatView.tsx
+++ b/ui/src/components/agents/ported/ChatView.tsx
@@ -449,7 +449,7 @@ export function ChatView({ tabId }: ChatViewProps) {
                 )}
                 {hasStreamingChangedFiles && (
                   <div
-                    className={`border border-[var(--ui-border)] bg-[var(--ui-accent-bubble)] px-3 pt-2 pb-4 flex items-center justify-between gap-3 text-xs rounded-b-none ${(hasTodos || hasActiveLoops) ? "rounded-t-none border-t-0" : "rounded-t-xl"}`}
+                    className={`border border-[var(--ui-border)] bg-[var(--ui-code-bubble)] px-3 pt-2 pb-4 flex items-center justify-between gap-3 text-xs rounded-b-none ${(hasTodos || hasActiveLoops) ? "rounded-t-none border-t-0" : "rounded-t-xl"}`}
                   >
                     <span className="text-[color:var(--ui-text-muted)] truncate">
                       {streamingChangedFiles.length} file{streamingChangedFiles.length === 1 ? "" : "s"} changed
@@ -537,7 +537,7 @@ const LoopManagerBlock = forwardRef<HTMLDivElement, LoopManagerBlockProps>(funct
       <button
         type="button"
         onClick={onOpenLoopManager}
-        className="w-full border border-[var(--ui-border)] bg-[var(--ui-accent-bubble)] px-3 pt-2 pb-4 flex items-center justify-between gap-3 text-xs rounded-t-xl rounded-b-none mb-0 hover:bg-[var(--ui-bg-hover)] transition-colors"
+        className="w-full border border-[var(--ui-border)] bg-[var(--ui-code-bubble)] px-3 pt-2 pb-4 flex items-center justify-between gap-3 text-xs rounded-t-xl rounded-b-none mb-0 hover:bg-[var(--ui-bg-hover)] transition-colors"
       >
         <span className="flex items-center gap-3">
           <span className="relative flex h-2 w-2">
diff --git a/ui/src/components/agents/ported/CodeBlock.tsx b/ui/src/components/agents/ported/CodeBlock.tsx
index f223266e..9da907f0 100644
--- a/ui/src/components/agents/ported/CodeBlock.tsx
+++ b/ui/src/components/agents/ported/CodeBlock.tsx
@@ -104,9 +104,9 @@ export function CodeBlock({ text, language }: CodeBlockProps) {
   };
 
   return (
-    <div className="my-2 max-w-full overflow-hidden rounded-xl bg-[var(--ui-accent-bubble)]">
+    <div className="my-2 max-w-full overflow-hidden rounded-xl border border-[var(--ui-border-subtle)] bg-[var(--ui-code-bubble)]">
       <div className="flex items-center justify-between px-3 py-2 text-xs">
-        <span className="text-[color:var(--ui-text-muted)]">{displayLanguage}</span>
+        <span className="font-mono text-[color:var(--ui-accent-2)]">{displayLanguage}</span>
         <button
           type="button"
           onClick={handleCopy}
diff --git a/ui/src/components/agents/ported/MessageView.tsx b/ui/src/components/agents/ported/MessageView.tsx
index 9bc63bdf..71f99752 100644
--- a/ui/src/components/agents/ported/MessageView.tsx
+++ b/ui/src/components/agents/ported/MessageView.tsx
@@ -187,7 +187,7 @@ const TurnChangedFilesCard = memo(function TurnChangedFilesCard({
   }, []);
 
   return (
-    <div className="mt-3 rounded-xl bg-[var(--ui-accent-bubble)] overflow-hidden">
+    <div className="mt-3 rounded-xl border border-[var(--ui-border-subtle)] bg-[var(--ui-code-bubble)] overflow-hidden">
       <div className="px-3 py-2 text-xs text-[color:var(--ui-text-muted)] border-b border-[var(--ui-border)] flex items-center gap-2">
         <span>{files.length} file{files.length === 1 ? "" : "s"} changed</span>
         <span className="text-green-400">+{totals.additions}</span>
diff --git a/ui/src/components/agents/ported/ReplyCard.tsx b/ui/src/components/agents/ported/ReplyCard.tsx
index 270f2de2..c19be049 100644
--- a/ui/src/components/agents/ported/ReplyCard.tsx
+++ b/ui/src/components/agents/ported/ReplyCard.tsx
@@ -183,7 +183,7 @@ export const ReplyCard = memo(function ReplyCard({ chunk }: ReplyCardProps) {
         <span>{headerLabel(isLinear, chunk.status)}</span>
       </div>
       {body && (
-        <div className="overflow-hidden rounded-xl bg-[var(--ui-accent-bubble)]">
+        <div className="overflow-hidden rounded-xl border border-[var(--ui-border-subtle)] bg-[var(--ui-code-bubble)]">
           <div className="max-h-[250px] overflow-auto px-3 py-2 text-[13px] text-[color:var(--ui-text)]">
             {isLinear ? (
               <Markdown content={body} />
diff --git a/ui/src/components/agents/ported/ShellCommand.tsx b/ui/src/components/agents/ported/ShellCommand.tsx
index 1917fe80..fed52d5e 100644
--- a/ui/src/components/agents/ported/ShellCommand.tsx
+++ b/ui/src/components/agents/ported/ShellCommand.tsx
@@ -64,9 +64,9 @@ export const ShellCommand = memo(function ShellCommand({
       </button>
 
       {expanded && (
-        <div className="rounded-xl bg-[var(--ui-accent-bubble)] mt-1 overflow-hidden max-h-[250px] flex flex-col">
+        <div className="rounded-xl border border-[var(--ui-border-subtle)] bg-[var(--ui-code-bubble)] mt-1 overflow-hidden max-h-[250px] flex flex-col">
           <div className="px-3 pt-2 pb-1 font-mono text-xs shrink-0">
-            <div className="text-[color:var(--ui-text-dim)] mb-2">bash</div>
+            <div className="text-[color:var(--ui-accent-2)] mb-2">bash</div>
             <div className="text-[color:var(--ui-text)] font-semibold whitespace-pre overflow-x-auto">
               <span className="text-[color:var(--ui-text-dim)]">$ </span>
               {command}
diff --git a/ui/src/components/agents/ported/TodoList.tsx b/ui/src/components/agents/ported/TodoList.tsx
index 0005bb73..e237d575 100644
--- a/ui/src/components/agents/ported/TodoList.tsx
+++ b/ui/src/components/agents/ported/TodoList.tsx
@@ -54,7 +54,7 @@ export function TodoList({ todos, className = "", runActive = false }: TodoListP
   const completed = todos.filter((t) => t.status === "completed").length;
 
   return (
-    <div className={`font-sans text-xs rounded-xl border border-[var(--ui-border)] bg-[var(--ui-accent-bubble)] overflow-hidden ${className}`}>
+    <div className={`font-sans text-xs rounded-xl border border-[var(--ui-border)] bg-[var(--ui-code-bubble)] overflow-hidden ${className}`}>
       <button
         type="button"
         className="w-full px-3 py-2 flex items-center gap-2 text-left hover:bg-white/5 transition-colors"
diff --git a/ui/src/components/agents/ported/ToolExecution.tsx b/ui/src/components/agents/ported/ToolExecution.tsx
index ce1bd0d7..e455204c 100644
--- a/ui/src/components/agents/ported/ToolExecution.tsx
+++ b/ui/src/components/agents/ported/ToolExecution.tsx
@@ -186,7 +186,7 @@ const InlineDiffCollapsible = memo(function InlineDiffCollapsible({
         </button>
       </div>
 
-      <div className="rounded-lg bg-[var(--ui-accent-bubble)] overflow-hidden border border-[var(--ui-border-subtle)]">
+      <div className="rounded-lg bg-[var(--ui-code-bubble)] overflow-hidden border border-[var(--ui-border-subtle)]">
         <div className="px-3 py-2 flex items-center gap-2">
           <span className={`text-[13px] truncate flex-1 min-w-0 ${isError ? "text-red-400" : "text-[color:var(--ui-accent)]"}`}>
             {filePath}
diff --git a/ui/src/styles/agents.css b/ui/src/styles/agents.css
index bc8dc804..411810b5 100644
--- a/ui/src/styles/agents.css
+++ b/ui/src/styles/agents.css
@@ -9,7 +9,9 @@
   --ui-text-muted: oklch(0.45 0.017 213.2);
   --ui-text-dim: oklch(0.56 0.021 213.5);
   --ui-accent: oklch(0.52 0.105 223.128);
+  --ui-accent-2: oklch(0.52 0.16 295);
   --ui-accent-bubble: oklch(0.955 0.015 223);
+  --ui-code-bubble: oklch(0.962 0.002 247.9);
   --ui-sidebar: oklch(0.987 0.002 197.1);
   --ui-sidebar-hover: oklch(0.963 0.002 197.1);
   --ui-success: oklch(0.62 0.17 145);
@@ -28,7 +30,9 @@
   --ui-text-muted: oklch(0.723 0.014 214.4);
   --ui-text-dim: oklch(0.56 0.021 213.5);
   --ui-accent: oklch(0.715 0.143 215.221);
+  --ui-accent-2: oklch(0.78 0.13 295);
   --ui-accent-bubble: oklch(0.274 0.04 223);
+  --ui-code-bubble: oklch(0.248 0.004 228.8);
   --ui-sidebar: oklch(0.218 0.008 223.9);
   --ui-sidebar-hover: oklch(0.275 0.011 216.9);
   --ui-success: oklch(0.62 0.17 145);