refactor: clean up GlobalTaskList and enhance TaskDetailDialog

- Removed unnecessary border styling in `GlobalTaskList` for a cleaner layout.
- Added logic in `ActivityTimeline` to identify and set team lead information based on member roles.
- Improved `TaskDetailDialog` to display owner information with enhanced styling and avatar support, utilizing team colors for better visual distinction.
- Streamlined dependency display in `TaskDetailDialog` for improved readability and user interaction.

src/renderer/components/sidebar/GlobalTaskList.tsx

@@ -236,10 +236,7 @@ export const GlobalTaskList = ({
       </div>
 
       {/* Grouping mode */}
-      <div
+      <div className="flex shrink-0 items-center gap-2 px-2 py-1">
-        className="flex shrink-0 items-center gap-2 border-b px-2 py-1"
-        style={{ borderColor: 'var(--color-border)' }}
-      >
         <span className="shrink-0 text-[11px] text-text-muted">Group by:</span>
         <Select value={groupingMode} onValueChange={(v) => setGroupingMode(v as TaskGroupingMode)}>
           <SelectTrigger className="h-7 min-w-0 flex-1 border-[var(--color-border)] px-2 text-[11px]">

src/renderer/components/team/activity/ActivityTimeline.tsx

@@ -111,6 +111,18 @@ export const ActivityTimeline = ({
         memberInfo.set(m.agentType, info);
       }
     }
+    const leadMember = members.find(
+      (m) => m.agentType === 'team-lead' || m.role?.toLowerCase().includes('lead')
+    );
+    if (leadMember) {
+      const leadInfo = memberInfo.get(leadMember.name);
+      if (leadInfo) {
+        const teamLeadColor = leadInfo.color ?? getMemberColorByName('team-lead');
+        const resolvedLeadInfo = { role: leadInfo.role, color: teamLeadColor };
+        memberInfo.set('team-lead', resolvedLeadInfo);
+        memberInfo.set(leadMember.name, resolvedLeadInfo);
+      }
+    }
   }
 
   const handleMemberNameClick = (name: string): void => {

src/renderer/components/team/dialogs/TaskDetailDialog.tsx

@@ -13,8 +13,10 @@ import {
   DialogHeader,
   DialogTitle,
 } from '@renderer/components/ui/dialog';
+import { getTeamColorSet } from '@renderer/constants/teamColors';
 import { markAsRead } from '@renderer/services/commentReadStorage';
 import {
+  agentAvatarUrl,
   KANBAN_COLUMN_DISPLAY,
   TASK_STATUS_LABELS,
   TASK_STATUS_STYLES,
@@ -98,6 +100,7 @@ export const TaskDetailDialog = ({
         t.id !== currentTask.id && Array.isArray(t.related) && t.related.includes(currentTask.id)
     )
     .map((t) => t.id);
+  const ownerMember = currentTask.owner ? members.find((m) => m.name === currentTask.owner) : null;
 
   return (
     <Dialog open={open} onOpenChange={(v) => !v && onClose()}>
@@ -121,12 +124,34 @@ export const TaskDetailDialog = ({
 
         {/* Metadata */}
         <div className="grid grid-cols-2 gap-x-4 gap-y-2 text-xs sm:grid-cols-3">
+          <div className="flex min-w-0 items-center gap-2">
+            {ownerMember ? (
+              <div
+                className="flex min-w-0 items-center gap-2 rounded-md px-2 py-1"
+                style={{
+                  borderLeft: `3px solid ${getTeamColorSet(ownerMember.color ?? '').border}`,
+                  backgroundColor: getTeamColorSet(ownerMember.color ?? '').badge,
+                }}
+              >
+                <img
+                  src={agentAvatarUrl(ownerMember.name, 32)}
+                  alt={ownerMember.name}
+                  className="size-6 shrink-0 rounded-full bg-[var(--color-surface-raised)]"
+                  loading="lazy"
+                />
+                <span className="min-w-0 truncate font-medium text-[var(--color-text)]">
+                  {ownerMember.name}
+                </span>
+              </div>
+            ) : (
               <div className="flex items-center gap-1.5 text-[var(--color-text-muted)]">
                 <User size={12} />
                 <span className="text-[var(--color-text-secondary)]">
                   {currentTask.owner ?? '\u2014'}
                 </span>
               </div>
+            )}
+          </div>
           {currentTask.createdBy ? (
             <div className="flex items-center gap-1.5 text-[var(--color-text-muted)]">
               <PenLine size={12} />
@@ -159,6 +184,7 @@ export const TaskDetailDialog = ({
           )}
         </CollapsibleTeamSection>
 
+        <div className="mb-3 space-y-2">
           {/* Dependencies */}
           {blockedByIds.length > 0 ? (
             <div className="flex flex-wrap items-center gap-1.5">
@@ -279,6 +305,7 @@ export const TaskDetailDialog = ({
               ) : null}
             </div>
           ) : null}
+        </div>
 
         {/* Comments */}
         <CollapsibleTeamSection