feat(conversation-detail): auto-scroll active tile into view and theme its highlight

src/components/conversations/conversation-detail-panel.tsx

@@ -1390,6 +1390,19 @@ export function ConversationDetailPanel() {
 
   const canTile = isTileMode && tabs.length > 1
 
+  const tileTabRefs = useRef<Map<string, HTMLDivElement | null>>(new Map())
+
+  useEffect(() => {
+    if (!canTile || !activeTabId) return
+    const el = tileTabRefs.current.get(activeTabId)
+    if (!el) return
+    el.scrollIntoView({
+      behavior: "smooth",
+      inline: "center",
+      block: "nearest",
+    })
+  }, [canTile, activeTabId])
+
   if (hasNoTabs) {
     return null
   }
@@ -1399,12 +1412,20 @@ export function ConversationDetailPanel() {
     return (
       <div
         key={tab.id}
+        ref={(el) => {
+          if (el) {
+            tileTabRefs.current.set(tab.id, el)
+          } else {
+            tileTabRefs.current.delete(tab.id)
+          }
+        }}
         className={cn(
           canTile
             ? cn(
-                "relative h-full min-w-[420px] flex-1 overflow-hidden",
+                "relative h-full min-w-96 flex-1 overflow-hidden",
                 index > 0 && "border-l border-border",
-                active && "bg-gradient-to-b from-muted/50 to-transparent"
+                active &&
+                  "bg-gradient-to-b from-sidebar-primary/[0.03] to-transparent"
               )
             : active
               ? "h-full"