diff --git a/backend/app/services/thread_service.py b/backend/app/services/thread_service.py
index c504928..772dd5b 100644
--- a/backend/app/services/thread_service.py
+++ b/backend/app/services/thread_service.py
@@ -5,6 +5,7 @@
 from typing import Any, Dict, List, Optional
 from uuid import UUID
 
+from sqlalchemy import func
 from sqlalchemy.orm import Session, joinedload
 
 from app.models import Comment, ContextType, Project, Thread, User
diff --git a/frontend/app/projects/[projectId]/features/[featureId]/FeatureDetailClient.tsx b/frontend/app/projects/[projectId]/features/[featureId]/FeatureDetailClient.tsx
index 2bdcce0..fde20c0 100644
--- a/frontend/app/projects/[projectId]/features/[featureId]/FeatureDetailClient.tsx
+++ b/frontend/app/projects/[projectId]/features/[featureId]/FeatureDetailClient.tsx
@@ -1,6 +1,6 @@
 "use client";
 
-import { useEffect, useState, useCallback, useRef } from "react";
+import { useEffect, useState, useCallback, useRef, useMemo } from "react";
 import { useParams, useRouter, useSearchParams } from "next/navigation";
 import Link from "next/link";
 import { apiClient } from "@/lib/api/client";
@@ -77,6 +77,7 @@ import { CopyableModuleKey } from "@/components/features/CopyableModuleKey";
 import { GenerationProgressCard } from "@/components/brainstorming/GenerationProgressCard";
 import { DecisionSummarizerStatus } from "@/components/DecisionSummarizerStatus";
 import { useNav } from "@/lib/contexts/NavContext";
+import { useSidePanel } from "@/lib/contexts/SidePanelContext";
 import { useProjectPermissions } from "@/lib/hooks/useProjectPermissions";
 import { buildProjectUrl, buildPhaseUrl, buildDiscussionUrl } from "@/lib/url";
 
@@ -155,6 +156,7 @@ export default function FeatureDetailClient() {
   const router = useRouter();
   const { user } = useAuth();
   const { currentProject } = useNav();
+  const { setSidePanelContent } = useSidePanel();
   const searchParams = useSearchParams();
   const projectId = params.projectId as string;
   const featureId = params.featureId as string;
@@ -546,6 +548,71 @@ export default function FeatureDetailClient() {
     setRefreshKey((k) => k + 1); // Refresh content viewers
   }, []);
 
+  // Side panel: inject right sidebar content
+  const sidePanelContentNode = useMemo(
+    () => (
+      <div className="h-full space-y-4 overflow-y-auto p-4">
+        <ImplementationSelector
+          featureId={featureId}
+          selectedImplementationId={selectedImplementationId}
+          onSelect={handleImplementationSelect}
+          refreshKey={refreshKey}
+        />
+        <FeatureSidebar
+          featureId={featureId}
+          orgId={user?.org_id || ""}
+          projectId={currentProject?.id || ""}
+          threadId={threadId}
+          refreshKey={refreshKey}
+          selectedImplementation={selectedImplementation}
+        />
+        {selectedImplementation?.is_complete && selectedImplementation?.completion_summary && (
+          <div className="bg-card text-card-foreground rounded-lg border shadow-sm">
+            <div className="border-b px-4 py-3">
+              <div className="flex items-center gap-2">
+                <CheckCircle2 className="h-4 w-4 text-green-600 dark:text-green-500" />
+                <span className="text-sm font-medium">Completion Summary</span>
+              </div>
+            </div>
+            <div className="px-4 py-3">
+              <p className="text-foreground text-sm leading-relaxed">
+                {selectedImplementation.completion_summary}
+              </p>
+              {selectedImplementation.completed_at && (
+                <p className="text-muted-foreground mt-3 flex items-center gap-1 text-xs">
+                  <Clock className="h-3 w-3" />
+                  {new Date(selectedImplementation.completed_at).toLocaleString(undefined, {
+                    dateStyle: "medium",
+                    timeStyle: "short",
+                  })}
+                </p>
+              )}
+            </div>
+          </div>
+        )}
+      </div>
+    ),
+    [
+      featureId,
+      selectedImplementationId,
+      handleImplementationSelect,
+      refreshKey,
+      user?.org_id,
+      currentProject?.id,
+      threadId,
+      selectedImplementation,
+    ],
+  );
+
+  useEffect(() => {
+    setSidePanelContent(sidePanelContentNode);
+  }, [setSidePanelContent, sidePanelContentNode]);
+
+  // Clear side panel on unmount
+  useEffect(() => {
+    return () => setSidePanelContent(null);
+  }, [setSidePanelContent]);
+
   // Handle new implementation created
   const handleImplementationCreated = useCallback((impl: ImplementationListItem) => {
     setImplementations((prev) => [...prev, impl]);
@@ -757,53 +824,52 @@ export default function FeatureDetailClient() {
               </>
             )}
           </div>
-          <div className="mt-2 flex items-center justify-between gap-2">
-            {/* Left: Badges */}
-            <div className="flex flex-wrap items-center gap-2">
-              {/* Completion Status */}
-              {(() => {
-                const completionConfig = COMPLETION_CONFIG[feature.completion_status || "pending"];
-                const CompletionIcon = completionConfig.icon;
-                return (
-                  <Badge
-                    variant="outline"
-                    className={`gap-1 border-0 ${completionConfig.badgeClass}`}
-                  >
-                    <CompletionIcon className={`h-3.5 w-3.5 ${completionConfig.className}`} />
-                    {completionConfig.label}
-                  </Badge>
-                );
-              })()}
-
-              {/* Priority */}
-              <Badge
-                variant="outline"
-                className={`border-0 ${PRIORITY_CONFIG[feature.priority].className}`}
-              >
-                {PRIORITY_CONFIG[feature.priority].label}
-              </Badge>
-
-              {/* Provenance */}
-              <Badge
-                variant="outline"
-                className={`border ${PROVENANCE_BADGES[feature.provenance].className}`}
-              >
-                {PROVENANCE_BADGES[feature.provenance].label}
-              </Badge>
-
-              {/* Status (only show if archived) */}
-              {isArchived && (
+          <div className="mt-2 flex flex-wrap items-center gap-2">
+            {/* Completion Status */}
+            {(() => {
+              const completionConfig = COMPLETION_CONFIG[feature.completion_status || "pending"];
+              const CompletionIcon = completionConfig.icon;
+              return (
                 <Badge
                   variant="outline"
-                  className={`border ${STATUS_BADGES[feature.status].className}`}
+                  className={`gap-1 border-0 ${completionConfig.badgeClass}`}
                 >
-                  {STATUS_BADGES[feature.status].label}
+                  <CompletionIcon className={`h-3.5 w-3.5 ${completionConfig.className}`} />
+                  {completionConfig.label}
                 </Badge>
-              )}
-            </div>
+              );
+            })()}
+
+            {/* Priority */}
+            <Badge
+              variant="outline"
+              className={`border-0 ${PRIORITY_CONFIG[feature.priority].className}`}
+            >
+              {PRIORITY_CONFIG[feature.priority].label}
+            </Badge>
+
+            {/* Provenance */}
+            <Badge
+              variant="outline"
+              className={`border ${PROVENANCE_BADGES[feature.provenance].className}`}
+            >
+              {PROVENANCE_BADGES[feature.provenance].label}
+            </Badge>
+
+            {/* Status (only show if archived) */}
+            {isArchived && (
+              <Badge
+                variant="outline"
+                className={`border ${STATUS_BADGES[feature.status].className}`}
+              >
+                {STATUS_BADGES[feature.status].label}
+              </Badge>
+            )}
+          </div>
 
-            {/* Right: Stage Progress */}
-            {/* When an implementation is selected, use its content status instead of feature-level */}
+          {/* Stage Progress - own row */}
+          {/* When an implementation is selected, use its content status instead of feature-level */}
+          <div className="mt-2">
             <FeatureStageProgress
               hasDescription={sidebarData?.has_description ?? !!feature.description}
               hasSpec={
@@ -929,7 +995,7 @@ export default function FeatureDetailClient() {
 
       {/* Tabs */}
       <Tabs value={activeTab} onValueChange={setActiveTab}>
-        <TabsList>
+        <TabsList className="h-auto flex-wrap">
           <TabsTrigger value="conversations" className="flex items-center gap-1.5">
             <MessageSquare className="h-3.5 w-3.5" />
             Conversations
@@ -965,205 +1031,154 @@ export default function FeatureDetailClient() {
           </div>
         )}
 
-        {/* Two-column layout: Tab content on left, Completion Summary on right */}
-        <div className="mt-4 grid grid-cols-1 items-start gap-6 lg:grid-cols-[1fr_400px]">
-          {/* Left column: Tab content */}
-          <div className="min-w-0">
-            <TabsContent value="conversations" className="mt-0">
-              {feature.source_project_chat_id &&
-                feature.source_project_chat_short_id &&
-                currentProject && (
-                  <div className="text-muted-foreground mb-3 flex items-center gap-1.5 text-sm">
-                    <MessageSquare className="h-3.5 w-3.5" />
-                    <span>Created from Project Chat:</span>
-                    <Link
-                      href={buildDiscussionUrl(
-                        { name: currentProject.name, short_id: currentProject.short_id },
-                        {
-                          chat_title: feature.source_project_chat_title || null,
-                          short_id: feature.source_project_chat_short_id,
-                        },
-                      )}
-                      className="text-primary hover:underline"
-                    >
-                      {feature.source_project_chat_title || "Discussion"}
-                    </Link>
-                  </div>
-                )}
-              <FeatureContentViewer
-                key={`description-${refreshKey}`}
-                featureId={featureId}
-                contentType="description"
+        <div className="mt-4 min-w-0">
+          <TabsContent value="conversations" className="mt-0">
+            {feature.source_project_chat_id &&
+              feature.source_project_chat_short_id &&
+              currentProject && (
+                <div className="text-muted-foreground mb-3 flex items-center gap-1.5 text-sm">
+                  <MessageSquare className="h-3.5 w-3.5" />
+                  <span>Created from Project Chat:</span>
+                  <Link
+                    href={buildDiscussionUrl(
+                      { name: currentProject.name, short_id: currentProject.short_id },
+                      {
+                        chat_title: feature.source_project_chat_title || null,
+                        short_id: feature.source_project_chat_short_id,
+                      },
+                    )}
+                    className="text-primary hover:underline"
+                  >
+                    {feature.source_project_chat_title || "Discussion"}
+                  </Link>
+                </div>
+              )}
+            <FeatureContentViewer
+              key={`description-${refreshKey}`}
+              featureId={featureId}
+              contentType="description"
+              isArchived={isArchived}
+              isSystemGenerated={feature.provenance === "system"}
+              title="Description"
+              emptyMessage="No description yet. Add one by clicking Edit."
+              descriptionImages={feature.description_image_attachments}
+            />
+            {/* Conversation Panel */}
+            <div className="mt-6">
+              <FeatureThreadColumn
+                feature={feature}
+                projectId={currentProject?.id || ""}
+                orgId={user?.org_id || ""}
                 isArchived={isArchived}
-                isSystemGenerated={feature.provenance === "system"}
-                title="Description"
-                emptyMessage="No description yet. Add one by clicking Edit."
-                descriptionImages={feature.description_image_attachments}
-              />
-              {/* Conversation Panel */}
-              <div className="mt-6">
-                <FeatureThreadColumn
-                  feature={feature}
-                  projectId={currentProject?.id || ""}
-                  orgId={user?.org_id || ""}
-                  isArchived={isArchived}
-                  activeTab={activeTab}
-                  onGenerate={handleContentGenerated}
-                  onThreadLoaded={handleThreadLoaded}
-                  onImplementationNameUpdated={() => setRefreshKey((k) => k + 1)}
-                  highlightedItemId={highlightedItemId}
-                  targetMessageSequence={targetMessageSequence}
-                  aboveCommentInput={(() => {
-                    // Button visibility is controlled by the server via decision summarizer
-                    if (!hasConversation) return undefined;
-
-                    // If summarizer is running, show status instead of button
-                    if (isSummarizerRunning) {
-                      return (
-                        <div className="mb-3 flex justify-end">
-                          <DecisionSummarizerStatus />
-                        </div>
-                      );
-                    }
-
-                    // Show button only when server says to (after decision summarizer completes)
-                    if (!showCreateImplementationButton) return undefined;
-
+                activeTab={activeTab}
+                onGenerate={handleContentGenerated}
+                onThreadLoaded={handleThreadLoaded}
+                onImplementationNameUpdated={() => setRefreshKey((k) => k + 1)}
+                highlightedItemId={highlightedItemId}
+                targetMessageSequence={targetMessageSequence}
+                aboveCommentInput={(() => {
+                  // Button visibility is controlled by the server via decision summarizer
+                  if (!hasConversation) return undefined;
+
+                  // If summarizer is running, show status instead of button
+                  if (isSummarizerRunning) {
                     return (
                       <div className="mb-3 flex justify-end">
-                        <CreateImplementationButton
-                          featureId={featureId}
-                          hasImplementations={implementations.length > 0}
-                          suggestedName={suggestedImplementationName}
-                          canCreate={canCreateFeatures}
-                          onCreated={handleImplementationCreated}
-                        />
+                        <DecisionSummarizerStatus />
                       </div>
                     );
-                  })()}
-                />
-              </div>
-            </TabsContent>
-
-            <TabsContent value="specification" className="mt-0">
-              <FeatureContentViewer
-                key={`spec-${refreshKey}-${selectedImplementation?.id || "none"}`}
-                featureId={featureId}
-                contentType="spec"
-                isArchived={isArchived}
-                isSystemGenerated={feature.provenance === "system"}
-                title="Specification"
-                emptyMessage="No specification yet. Add one by clicking Edit or generate from conversation."
-                canGenerate={hasConversation && canCreateFeatures}
-                disabledReason={
-                  !canCreateFeatures
-                    ? "You need member access or higher to generate content"
-                    : undefined
-                }
-                isGenerating={isGenerating || !!runningGenerationJob}
-                onGenerateClick={() => handleGenerateContent("spec")}
-                onCancelClick={handleCancelGeneration}
-                isCancelling={isCancellingGeneration}
-                descriptionImages={feature.description_image_attachments}
-                implementationContent={selectedImplementation?.spec_text}
-              />
-            </TabsContent>
-
-            <TabsContent value="prompt-plan" className="mt-0">
-              <FeatureContentViewer
-                key={`prompt-plan-${refreshKey}-${selectedImplementation?.id || "none"}`}
-                featureId={featureId}
-                contentType="prompt_plan"
-                isArchived={isArchived}
-                isSystemGenerated={feature.provenance === "system"}
-                title="Prompt Plan"
-                emptyMessage="No prompt plan yet. Add one by clicking Edit or generate from conversation."
-                canGenerate={hasConversation && !!sidebarData?.has_spec && canCreateFeatures}
-                disabledReason={
-                  !canCreateFeatures
-                    ? "You need member access or higher to generate content"
-                    : !sidebarData?.has_spec
-                      ? "Generate a specification first"
-                      : undefined
-                }
-                isGenerating={isGenerating || !!runningGenerationJob}
-                onGenerateClick={() => handleGenerateContent("prompt_plan")}
-                onCancelClick={handleCancelGeneration}
-                isCancelling={isCancellingGeneration}
-                descriptionImages={feature.description_image_attachments}
-                implementationContent={selectedImplementation?.prompt_plan_text}
+                  }
+
+                  // Show button only when server says to (after decision summarizer completes)
+                  if (!showCreateImplementationButton) return undefined;
+
+                  return (
+                    <div className="mb-3 flex justify-end">
+                      <CreateImplementationButton
+                        featureId={featureId}
+                        hasImplementations={implementations.length > 0}
+                        suggestedName={suggestedImplementationName}
+                        canCreate={canCreateFeatures}
+                        onCreated={handleImplementationCreated}
+                      />
+                    </div>
+                  );
+                })()}
               />
-            </TabsContent>
-
-            <TabsContent value="notes" className="mt-0">
-              <FeatureContentViewer
-                key={`notes-${refreshKey}-${selectedImplementation?.id || "none"}`}
-                featureId={featureId}
-                contentType="implementation_notes"
-                isArchived={isArchived}
-                isSystemGenerated={feature.provenance === "system"}
-                title="Implementation Notes"
-                emptyMessage="Implementation notes are typically added automatically by your coding agent. But, you're free to edit it as well."
-                implementationContent={selectedImplementation?.implementation_notes}
-              />
-            </TabsContent>
-
-            <TabsContent value="activity" className="mt-0">
-              <ActivityLogView
-                logs={activityLogs}
-                isLoading={isLoadingActivity}
-                emptyMessage="No activity recorded for this feature yet"
-                showCard={false}
-              />
-            </TabsContent>
-          </div>
+            </div>
+          </TabsContent>
 
-          {/* Right column: Sidebar (sticky) */}
-          <div className="sticky top-4 hidden space-y-4 lg:block">
-            {/* Implementation Selector Card */}
-            <ImplementationSelector
+          <TabsContent value="specification" className="mt-0">
+            <FeatureContentViewer
+              key={`spec-${refreshKey}-${selectedImplementation?.id || "none"}`}
               featureId={featureId}
-              selectedImplementationId={selectedImplementationId}
-              onSelect={handleImplementationSelect}
-              refreshKey={refreshKey}
+              contentType="spec"
+              isArchived={isArchived}
+              isSystemGenerated={feature.provenance === "system"}
+              title="Specification"
+              emptyMessage="No specification yet. Add one by clicking Edit or generate from conversation."
+              canGenerate={hasConversation && canCreateFeatures}
+              disabledReason={
+                !canCreateFeatures
+                  ? "You need member access or higher to generate content"
+                  : undefined
+              }
+              isGenerating={isGenerating || !!runningGenerationJob}
+              onGenerateClick={() => handleGenerateContent("spec")}
+              onCancelClick={handleCancelGeneration}
+              isCancelling={isCancellingGeneration}
+              descriptionImages={feature.description_image_attachments}
+              implementationContent={selectedImplementation?.spec_text}
             />
+          </TabsContent>
 
-            {/* Feature Sidebar - Decisions, Engagement & Readiness */}
-            <FeatureSidebar
+          <TabsContent value="prompt-plan" className="mt-0">
+            <FeatureContentViewer
+              key={`prompt-plan-${refreshKey}-${selectedImplementation?.id || "none"}`}
               featureId={featureId}
-              orgId={user?.org_id || ""}
-              projectId={currentProject?.id || ""}
-              threadId={threadId}
-              refreshKey={refreshKey}
-              selectedImplementation={selectedImplementation}
+              contentType="prompt_plan"
+              isArchived={isArchived}
+              isSystemGenerated={feature.provenance === "system"}
+              title="Prompt Plan"
+              emptyMessage="No prompt plan yet. Add one by clicking Edit or generate from conversation."
+              canGenerate={hasConversation && !!sidebarData?.has_spec && canCreateFeatures}
+              disabledReason={
+                !canCreateFeatures
+                  ? "You need member access or higher to generate content"
+                  : !sidebarData?.has_spec
+                    ? "Generate a specification first"
+                    : undefined
+              }
+              isGenerating={isGenerating || !!runningGenerationJob}
+              onGenerateClick={() => handleGenerateContent("prompt_plan")}
+              onCancelClick={handleCancelGeneration}
+              isCancelling={isCancellingGeneration}
+              descriptionImages={feature.description_image_attachments}
+              implementationContent={selectedImplementation?.prompt_plan_text}
             />
+          </TabsContent>
 
-            {/* Completion Summary */}
-            {selectedImplementation?.is_complete && selectedImplementation?.completion_summary && (
-              <div className="bg-card text-card-foreground rounded-lg border shadow-sm">
-                <div className="border-b px-4 py-3">
-                  <div className="flex items-center gap-2">
-                    <CheckCircle2 className="h-4 w-4 text-green-600 dark:text-green-500" />
-                    <span className="text-sm font-medium">Completion Summary</span>
-                  </div>
-                </div>
-                <div className="px-4 py-3">
-                  <p className="text-foreground text-sm leading-relaxed">
-                    {selectedImplementation.completion_summary}
-                  </p>
-                  {selectedImplementation.completed_at && (
-                    <p className="text-muted-foreground mt-3 flex items-center gap-1 text-xs">
-                      <Clock className="h-3 w-3" />
-                      {new Date(selectedImplementation.completed_at).toLocaleString(undefined, {
-                        dateStyle: "medium",
-                        timeStyle: "short",
-                      })}
-                    </p>
-                  )}
-                </div>
-              </div>
-            )}
-          </div>
+          <TabsContent value="notes" className="mt-0">
+            <FeatureContentViewer
+              key={`notes-${refreshKey}-${selectedImplementation?.id || "none"}`}
+              featureId={featureId}
+              contentType="implementation_notes"
+              isArchived={isArchived}
+              isSystemGenerated={feature.provenance === "system"}
+              title="Implementation Notes"
+              emptyMessage="Implementation notes are typically added automatically by your coding agent. But, you're free to edit it as well."
+              implementationContent={selectedImplementation?.implementation_notes}
+            />
+          </TabsContent>
+
+          <TabsContent value="activity" className="mt-0">
+            <ActivityLogView
+              logs={activityLogs}
+              isLoading={isLoadingActivity}
+              emptyMessage="No activity recorded for this feature yet"
+              showCard={false}
+            />
+          </TabsContent>
         </div>
       </Tabs>