diff --git a/apps/web/src/pages/IdeasPage.tsx b/apps/web/src/pages/IdeasPage.tsx
index 71cff840b..d5c2c7bc6 100644
--- a/apps/web/src/pages/IdeasPage.tsx
+++ b/apps/web/src/pages/IdeasPage.tsx
@@ -1,33 +1,25 @@
 import { useCallback, useEffect, useMemo, useState } from 'react';
 import { useNavigate } from 'react-router-dom';
 import {
-  Plus,
   Search,
   Lightbulb,
   MessageSquare,
   Play,
   Check,
   Archive,
-  X,
   ChevronDown,
   ChevronRight,
+  Clock,
 } from 'lucide-react';
 import type { Task, TaskStatus } from '@simple-agent-manager/shared';
-import {
-  listProjectTasks,
-  createProjectTask,
-  updateProjectTaskStatus,
-  deleteProjectTask,
-  runProjectTask,
-  listChatSessions,
-} from '../lib/api';
+import { listProjectTasks, listChatSessions } from '../lib/api';
 import type { ChatSessionResponse } from '../lib/api';
 import { useProjectContext } from './ProjectContext';
 import { useIsMobile } from '../hooks/useIsMobile';
 import { Spinner } from '@simple-agent-manager/ui';
 
 // ---------------------------------------------------------------------------
-// Status mapping: internal task statuses → user-facing idea statuses
+// Status mapping: internal task statuses -> user-facing idea statuses
 // ---------------------------------------------------------------------------
 
 type IdeaStatus = 'exploring' | 'ready' | 'executing' | 'done' | 'parked';
@@ -44,14 +36,13 @@ const STATUS_FROM_TASK: Record<TaskStatus, IdeaStatus> = {
 };
 
 const STATUS_CONFIG: Record<IdeaStatus, { label: string; color: string; icon: React.ReactNode }> = {
-  exploring: { label: 'Exploring', color: 'var(--sam-color-accent-primary)', icon: <Lightbulb size={14} /> },
-  ready: { label: 'Ready', color: 'var(--sam-color-warning)', icon: <Play size={14} /> },
+  exploring: { label: 'Exploring', color: 'var(--sam-color-accent-primary)', icon: <Lightbulb size={14} aria-hidden="true" /> },
+  ready: { label: 'Ready', color: 'var(--sam-color-warning)', icon: <Play size={14} aria-hidden="true" /> },
   executing: { label: 'Executing', color: 'var(--sam-color-info)', icon: <span aria-hidden="true"><Spinner size="sm" /></span> },
-  done: { label: 'Done', color: 'var(--sam-color-success)', icon: <Check size={14} /> },
-  parked: { label: 'Parked', color: 'var(--sam-color-fg-muted)', icon: <Archive size={14} /> },
+  done: { label: 'Done', color: 'var(--sam-color-success)', icon: <Check size={14} aria-hidden="true" /> },
+  parked: { label: 'Parked', color: 'var(--sam-color-fg-muted)', icon: <Archive size={14} aria-hidden="true" /> },
 };
 
-// Which groups to show and in what order
 const STATUS_ORDER: IdeaStatus[] = ['exploring', 'ready', 'executing', 'done', 'parked'];
 
 /** Max ideas to load per page. Override via VITE_IDEAS_FETCH_LIMIT. */
@@ -67,204 +58,63 @@ const IDEAS_SESSION_FETCH_LIMIT = parseInt(
 );
 
 // ---------------------------------------------------------------------------
-// Sub-components
+// Helpers
 // ---------------------------------------------------------------------------
 
-function IdeaStatusBadge({ status }: { status: IdeaStatus }) {
-  const config = STATUS_CONFIG[status];
-  return (
-    <span
-      className="inline-flex items-center gap-1 px-2 py-0.5 rounded-full text-xs font-medium"
-      style={{ color: config.color, background: `color-mix(in srgb, ${config.color} 15%, transparent)` }}
-    >
-      {config.icon}
-      {config.label}
-    </span>
-  );
+function timeAgo(dateStr: string): string {
+  const diffMs = Date.now() - new Date(dateStr).getTime();
+  const minutes = Math.floor(diffMs / 60_000);
+  if (minutes < 1) return 'just now';
+  if (minutes < 60) return `${minutes}m ago`;
+  const hours = Math.floor(minutes / 60);
+  if (hours < 24) return `${hours}h ago`;
+  const days = Math.floor(hours / 24);
+  return `${days}d ago`;
 }
 
+// ---------------------------------------------------------------------------
+// Sub-components
+// ---------------------------------------------------------------------------
+
 interface IdeaCardProps {
   idea: Task;
   sessionCount: number;
-  onBrainstorm: () => void;
-  onExecute: () => void;
   onClick: () => void;
-  onDelete: () => void;
 }
 
-function IdeaCard({ idea, sessionCount, onBrainstorm, onExecute, onClick, onDelete }: IdeaCardProps) {
-  const ideaStatus = STATUS_FROM_TASK[idea.status];
-
+function IdeaCard({ idea, sessionCount, onClick }: IdeaCardProps) {
   return (
-    <div
-      className="group relative flex flex-col gap-2 p-4 rounded-lg border border-border-default bg-surface hover:border-accent/40 transition-colors cursor-pointer"
+    <button
+      onClick={onClick}
+      className="flex items-start gap-3 px-3 py-2.5 min-h-[56px] rounded-lg border border-border-default bg-surface hover:border-accent/40 transition-colors cursor-pointer text-left w-full focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-accent"
+      aria-label={`View idea: ${idea.title}`}
     >
-      {/* Clickable overlay for card navigation — sits behind action buttons */}
-      <button
-        className="absolute inset-0 w-full h-full bg-transparent border-none cursor-pointer z-0 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-accent rounded-lg"
-        onClick={onClick}
-        aria-label={`View idea: ${idea.title}`}
-      />
-
-      {/* Header: title + status */}
-      <div className="flex items-start justify-between gap-2 relative z-[1] pointer-events-none">
-        <h3 className="text-sm font-semibold text-fg-primary m-0 line-clamp-2 flex-1">
+      {/* Content */}
+      <div className="flex-1 min-w-0">
+        <h3 className="text-sm font-medium text-fg-primary m-0 line-clamp-1">
           {idea.title}
         </h3>
-        <IdeaStatusBadge status={ideaStatus} />
+        {idea.description && (
+          <p className="text-xs text-fg-muted m-0 mt-0.5 line-clamp-1">
+            {idea.description}
+          </p>
+        )}
       </div>
 
-      {/* Description snippet */}
-      {idea.description && (
-        <p className="text-xs text-fg-muted m-0 line-clamp-2 relative z-[1] pointer-events-none">
-          {idea.description}
-        </p>
-      )}
-
-      {/* Footer: session count + actions */}
-      <div className="flex items-center justify-between mt-1 relative z-[1]">
-        <div className="flex items-center gap-1 text-xs text-fg-muted pointer-events-none">
-          <MessageSquare size={12} />
-          <span>{sessionCount} {sessionCount === 1 ? 'session' : 'sessions'}</span>
-        </div>
-
-        {/* Actions — elevated z-index so they intercept clicks above the card overlay.
-            On pointer devices actions are revealed on hover; on touch devices
-            (hover:none) they are always visible so they remain tappable. */}
-        <div
-          className="flex items-center gap-1 opacity-0 group-hover:opacity-100 [@media(hover:none)]:opacity-100 transition-opacity"
-        >
-          {(ideaStatus === 'exploring' || ideaStatus === 'ready') && (
-            <button
-              onClick={onBrainstorm}
-              className="inline-flex items-center gap-1 px-2 py-1 min-h-[44px] text-xs font-medium rounded bg-transparent border border-border-default text-fg-muted hover:text-fg-primary hover:border-accent cursor-pointer transition-colors"
-              title="Start brainstorming session"
-            >
-              <MessageSquare size={12} />
-              Brainstorm
-            </button>
-          )}
-          {(ideaStatus === 'exploring' || ideaStatus === 'ready') && (
-            <button
-              onClick={onExecute}
-              className="inline-flex items-center gap-1 px-2 py-1 min-h-[44px] text-xs font-medium rounded bg-accent text-fg-on-accent border-none cursor-pointer hover:opacity-90 transition-opacity"
-              title="Execute this idea"
-            >
-              <Play size={12} />
-              Execute
-            </button>
-          )}
-          {ideaStatus === 'exploring' && (
-            <button
-              onClick={onDelete}
-              className="inline-flex items-center gap-1 px-1.5 py-1 min-h-[44px] text-xs rounded bg-transparent border-none text-fg-muted hover:text-danger-fg cursor-pointer transition-colors"
-              aria-label="Delete idea"
-              title="Delete idea"
-            >
-              <X size={12} />
-            </button>
-          )}
-        </div>
+      {/* Meta: session count + age */}
+      <div className="flex items-center gap-3 shrink-0 text-xs text-fg-muted pt-0.5">
+        {sessionCount > 0 && (
+          <span className="inline-flex items-center gap-1">
+            <MessageSquare size={11} />
+            {sessionCount}
+          </span>
+        )}
+        <span className="inline-flex items-center gap-1">
+          <Clock size={11} />
+          {timeAgo(idea.createdAt)}
+        </span>
       </div>
-    </div>
-  );
-}
-
-interface NewIdeaDialogProps {
-  open: boolean;
-  onClose: () => void;
-  onSubmit: (title: string, description: string) => void;
-  submitting: boolean;
-}
-
-function NewIdeaDialog({ open, onClose, onSubmit, submitting }: NewIdeaDialogProps) {
-  const [title, setTitle] = useState('');
-  const [description, setDescription] = useState('');
-
-  useEffect(() => {
-    if (open) {
-      setTitle('');
-      setDescription('');
-    }
-  }, [open]);
-
-  if (!open) return null;
-
-  const handleSubmit = (e: React.FormEvent) => {
-    e.preventDefault();
-    if (!title.trim()) return;
-    onSubmit(title.trim(), description.trim());
-  };
-
-  return (
-    <>
-      {/* Backdrop */}
-      <div className="fixed inset-0 bg-overlay z-drawer-backdrop" onClick={onClose} />
-      {/* Dialog */}
-      <div
-        className="fixed inset-0 z-drawer flex items-center justify-center p-4"
-        role="dialog"
-        aria-modal="true"
-        aria-labelledby="new-idea-dialog-title"
-      >
-        <form
-          onSubmit={handleSubmit}
-          className="w-full max-w-md bg-surface rounded-lg border border-border-default shadow-lg p-6 flex flex-col gap-4"
-          onClick={(e) => e.stopPropagation()}
-        >
-          <h2 id="new-idea-dialog-title" className="text-lg font-semibold text-fg-primary m-0">New Idea</h2>
-
-          <div className="flex flex-col gap-1.5">
-            <label htmlFor="idea-title" className="text-sm font-medium text-fg-secondary">
-              Title
-            </label>
-            <input
-              id="idea-title"
-              type="text"
-              value={title}
-              onChange={(e) => setTitle(e.target.value)}
-              placeholder="What do you want to explore?"
-              className="w-full px-3 py-2 text-sm rounded border border-border-default bg-surface-inset text-fg-primary placeholder:text-fg-muted focus:outline-none focus:border-accent"
-              autoFocus
-              disabled={submitting}
-            />
-          </div>
-
-          <div className="flex flex-col gap-1.5">
-            <label htmlFor="idea-description" className="text-sm font-medium text-fg-secondary">
-              Description <span className="text-fg-muted font-normal">(optional)</span>
-            </label>
-            <textarea
-              id="idea-description"
-              value={description}
-              onChange={(e) => setDescription(e.target.value)}
-              placeholder="Brief context or goals..."
-              rows={3}
-              className="w-full px-3 py-2 text-sm rounded border border-border-default bg-surface-inset text-fg-primary placeholder:text-fg-muted focus:outline-none focus:border-accent resize-y"
-              disabled={submitting}
-            />
-          </div>
-
-          <div className="flex justify-end gap-2">
-            <button
-              type="button"
-              onClick={onClose}
-              className="px-4 py-2 text-sm font-medium rounded border border-border-default bg-transparent text-fg-muted hover:text-fg-primary cursor-pointer transition-colors"
-              disabled={submitting}
-            >
-              Cancel
-            </button>
-            <button
-              type="submit"
-              className="px-4 py-2 text-sm font-medium rounded bg-accent text-fg-on-accent border-none cursor-pointer hover:opacity-90 transition-opacity disabled:opacity-50"
-              disabled={!title.trim() || submitting}
-            >
-              {submitting ? 'Creating...' : 'Create Idea'}
-            </button>
-          </div>
-        </form>
-      </div>
-    </>
+    </button>
   );
 }
 
@@ -283,10 +133,6 @@ export function IdeasPage() {
   const [searchQuery, setSearchQuery] = useState('');
   const [statusFilter, setStatusFilter] = useState<IdeaStatus | 'all'>('all');
 
-  // New idea dialog
-  const [dialogOpen, setDialogOpen] = useState(false);
-  const [creating, setCreating] = useState(false);
-
   // Collapsible groups
   const [collapsedGroups, setCollapsedGroups] = useState<Set<IdeaStatus>>(new Set(['done', 'parked']));
 
@@ -330,7 +176,6 @@ export function IdeasPage() {
   const filteredIdeas = useMemo(() => {
     let result = ideas;
 
-    // Text search
     if (searchQuery.trim()) {
       const q = searchQuery.toLowerCase();
       result = result.filter(
@@ -340,7 +185,6 @@ export function IdeasPage() {
       );
     }
 
-    // Status filter
     if (statusFilter !== 'all') {
       result = result.filter((idea) => STATUS_FROM_TASK[idea.status] === statusFilter);
     }
@@ -364,75 +208,8 @@ export function IdeasPage() {
   // Actions
   // ---------------------------------------------------------------------------
 
-  const handleCreateIdea = useCallback(
-    async (title: string, description: string) => {
-      setCreating(true);
-      try {
-        await createProjectTask(projectId, {
-          title,
-          description: description || undefined,
-        });
-        setDialogOpen(false);
-        await loadData();
-      } catch (err) {
-        console.error('Failed to create idea:', err);
-      } finally {
-        setCreating(false);
-      }
-    },
-    [projectId, loadData],
-  );
-
-  const handleBrainstorm = useCallback(
-    async (idea: Task) => {
-      // Navigate to project chat and submit a conversation-mode task referencing this idea
-      // For now, navigate to chat with a pre-filled context
-      navigate(`/projects/${projectId}/chat`, {
-        state: {
-          brainstormIdea: {
-            taskId: idea.id,
-            title: idea.title,
-            description: idea.description,
-          },
-        },
-      });
-    },
-    [projectId, navigate],
-  );
-
-  const handleExecute = useCallback(
-    async (idea: Task) => {
-      try {
-        // If still draft, transition to ready first
-        if (idea.status === 'draft') {
-          await updateProjectTaskStatus(projectId, idea.id, { toStatus: 'ready' });
-        }
-        // Run the task
-        await runProjectTask(projectId, idea.id);
-        // Navigate to chat — the task runner will create a session
-        navigate(`/projects/${projectId}/chat`);
-      } catch (err) {
-        console.error('Failed to execute idea:', err);
-      }
-    },
-    [projectId, navigate],
-  );
-
-  const handleDelete = useCallback(
-    async (ideaId: string) => {
-      try {
-        await deleteProjectTask(projectId, ideaId);
-        await loadData();
-      } catch (err) {
-        console.error('Failed to delete idea:', err);
-      }
-    },
-    [projectId, loadData],
-  );
-
   const handleIdeaClick = useCallback(
     (idea: Task) => {
-      // Navigate to task detail page (reused as idea detail)
       navigate(`/projects/${projectId}/ideas/${idea.id}`);
     },
     [projectId, navigate],
@@ -465,19 +242,10 @@ export function IdeasPage() {
   return (
     <div className={`flex flex-col gap-4 ${isMobile ? 'px-4 py-3' : 'px-6 py-4'}`}>
       {/* Header */}
-      <div className="flex items-center justify-between gap-3">
-        <h1 className="text-xl font-semibold text-fg-primary m-0">Ideas</h1>
-        <button
-          onClick={() => setDialogOpen(true)}
-          className="inline-flex items-center gap-1.5 px-3 py-2 min-h-[44px] text-sm font-medium rounded-lg bg-accent text-fg-on-accent border-none cursor-pointer hover:opacity-90 transition-opacity"
-        >
-          <Plus size={16} />
-          New Idea
-        </button>
-      </div>
+      <h1 className="text-xl font-semibold text-fg-primary m-0">Ideas</h1>
 
-      {/* Search + Filter bar */}
-      <div className={`flex gap-2 ${isMobile ? 'flex-col' : 'items-center'}`}>
+      {/* Search + Filter bar — always single row */}
+      <div className="flex items-center gap-2">
         <div className="relative flex-1">
           <Search size={16} className="absolute left-3 top-1/2 -translate-y-1/2 text-fg-muted pointer-events-none" />
           <input
@@ -492,7 +260,7 @@ export function IdeasPage() {
           value={statusFilter}
           onChange={(e) => setStatusFilter(e.target.value as IdeaStatus | 'all')}
           aria-label="Filter by status"
-          className="px-3 py-2 text-sm rounded-lg border border-border-default bg-surface-inset text-fg-primary focus:outline-none focus:border-accent cursor-pointer"
+          className="px-3 py-2 text-sm rounded-lg border border-border-default bg-surface-inset text-fg-primary focus:outline-none focus:border-accent cursor-pointer shrink-0"
         >
           <option value="all">All statuses</option>
           {STATUS_ORDER.map((status) => (
@@ -503,18 +271,18 @@ export function IdeasPage() {
         </select>
       </div>
 
-      {/* Ideas grouped by status */}
+      {/* Ideas grouped by status — timeline feel */}
       {filteredIdeas.length === 0 ? (
-        <div className="flex flex-col items-center justify-center py-12 text-center">
-          <Lightbulb size={48} className="text-fg-muted mb-3 opacity-40" />
-          <p className="text-sm text-fg-muted m-0">
+        <div className="flex flex-col items-center justify-center py-16 text-center">
+          <Lightbulb size={40} className="text-fg-muted mb-3 opacity-30" />
+          <p className="text-sm text-fg-muted m-0 max-w-xs">
             {searchQuery || statusFilter !== 'all'
               ? 'No ideas match your search.'
-              : 'No ideas yet. Create one to start exploring!'}
+              : 'Ideas emerge from your conversations. Start chatting to explore new ideas.'}
           </p>
         </div>
       ) : (
-        <div className="flex flex-col gap-4">
+        <div className="flex flex-col gap-6">
           {STATUS_ORDER.map((status) => {
             const items = groupedIdeas.get(status) || [];
             if (items.length === 0) return null;
@@ -523,59 +291,59 @@ export function IdeasPage() {
             const config = STATUS_CONFIG[status];
 
             return (
-              <div key={status} className="flex flex-col gap-2">
-                {/* Group header */}
+              <section key={status} aria-labelledby={`group-header-${status}`} className="flex flex-col gap-1.5">
+                {/* Group header with timeline accent */}
                 <button
                   onClick={() => toggleGroup(status)}
                   aria-expanded={!collapsed}
-                  className="flex items-center gap-2 px-1 py-1 bg-transparent border-none cursor-pointer text-left focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-accent rounded"
+                  aria-controls={`group-list-${status}`}
+                  className="flex items-center gap-2 px-1 py-1.5 min-h-[44px] bg-transparent border-none cursor-pointer text-left focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-accent rounded"
                 >
-                  {collapsed ? (
-                    <ChevronRight size={14} className="text-fg-muted" />
-                  ) : (
-                    <ChevronDown size={14} className="text-fg-muted" />
-                  )}
-                  <span className="text-xs font-semibold uppercase tracking-wider" style={{ color: config.color }}>
+                  <span
+                    className="inline-flex items-center justify-center w-5 h-5 rounded-full shrink-0"
+                    style={{ background: `color-mix(in srgb, ${config.color} 20%, transparent)`, color: config.color }}
+                  >
+                    {config.icon}
+                  </span>
+                  <span
+                    id={`group-header-${status}`}
+                    className="text-xs font-semibold uppercase tracking-wider"
+                    style={{ color: config.color }}
+                  >
                     {config.label}
                   </span>
                   <span className="text-xs text-fg-muted">({items.length})</span>
+                  <span className="ml-auto">
+                    {collapsed ? (
+                      <ChevronRight size={14} className="text-fg-muted" aria-hidden="true" />
+                    ) : (
+                      <ChevronDown size={14} className="text-fg-muted" aria-hidden="true" />
+                    )}
+                  </span>
                 </button>
 
-                {/* Cards grid */}
+                {/* Timeline items — vertical list with left accent */}
                 {!collapsed && (
                   <div
-                    className={`grid gap-3 ${
-                      isMobile
-                        ? 'grid-cols-1'
-                        : 'grid-cols-[repeat(auto-fill,minmax(300px,1fr))]'
-                    }`}
+                    id={`group-list-${status}`}
+                    className="flex flex-col gap-1.5 ml-2.5 pl-4 border-l-2"
+                    style={{ borderColor: `color-mix(in srgb, ${config.color} 30%, transparent)` }}
                   >
                     {items.map((idea) => (
                       <IdeaCard
                         key={idea.id}
                         idea={idea}
                         sessionCount={sessionCountByTaskId.get(idea.id) || 0}
-                        onBrainstorm={() => handleBrainstorm(idea)}
-                        onExecute={() => handleExecute(idea)}
                         onClick={() => handleIdeaClick(idea)}
-                        onDelete={() => handleDelete(idea.id)}
                       />
                     ))}
                   </div>
                 )}
-              </div>
+              </section>
             );
           })}
         </div>
       )}
-
-      {/* New Idea Dialog */}
-      <NewIdeaDialog
-        open={dialogOpen}
-        onClose={() => setDialogOpen(false)}
-        onSubmit={handleCreateIdea}
-        submitting={creating}
-      />
     </div>
   );
 }
diff --git a/apps/web/tests/unit/pages/ideas-page.test.tsx b/apps/web/tests/unit/pages/ideas-page.test.tsx
index 12b649736..7ba73f5fb 100644
--- a/apps/web/tests/unit/pages/ideas-page.test.tsx
+++ b/apps/web/tests/unit/pages/ideas-page.test.tsx
@@ -11,20 +11,12 @@ import type { Task, TaskStatus } from '@simple-agent-manager/shared';
 const mocks = vi.hoisted(() => ({
   listProjectTasks: vi.fn(),
   listChatSessions: vi.fn(),
-  createProjectTask: vi.fn(),
-  updateProjectTaskStatus: vi.fn(),
-  deleteProjectTask: vi.fn(),
-  runProjectTask: vi.fn(),
   navigate: vi.fn(),
 }));
 
 vi.mock('../../../src/lib/api', () => ({
   listProjectTasks: mocks.listProjectTasks,
   listChatSessions: mocks.listChatSessions,
-  createProjectTask: mocks.createProjectTask,
-  updateProjectTaskStatus: mocks.updateProjectTaskStatus,
-  deleteProjectTask: mocks.deleteProjectTask,
-  runProjectTask: mocks.runProjectTask,
 }));
 
 vi.mock('react-router-dom', async () => {
@@ -102,15 +94,31 @@ describe('IdeasPage', () => {
     mocks.listChatSessions.mockResolvedValue({ sessions: [], total: 0 });
   });
 
-  it('renders the Ideas heading and New Idea button', async () => {
+  it('renders the Ideas heading', async () => {
     renderIdeasPage();
     expect(await screen.findByRole('heading', { name: 'Ideas' })).toBeInTheDocument();
-    expect(screen.getByRole('button', { name: /New Idea/i })).toBeInTheDocument();
+  });
+
+  it('does not render any write-action buttons', async () => {
+    mocks.listProjectTasks.mockResolvedValue({
+      tasks: [makeTask({ id: '1', title: 'Some idea', status: 'draft' })],
+      nextCursor: null,
+    });
+
+    renderIdeasPage();
+    await screen.findByText('Some idea');
+
+    expect(screen.queryByRole('button', { name: /New Idea/i })).not.toBeInTheDocument();
+    expect(screen.queryByRole('button', { name: /Brainstorm/i })).not.toBeInTheDocument();
+    expect(screen.queryByRole('button', { name: /Execute/i })).not.toBeInTheDocument();
+    expect(screen.queryByRole('button', { name: /Delete idea/i })).not.toBeInTheDocument();
   });
 
   it('shows empty state when no ideas exist', async () => {
     renderIdeasPage();
-    expect(await screen.findByText(/No ideas yet/i)).toBeInTheDocument();
+    expect(
+      await screen.findByText('Ideas emerge from your conversations. Start chatting to explore new ideas.'),
+    ).toBeInTheDocument();
   });
 
   it('displays ideas grouped by status', async () => {
@@ -124,12 +132,9 @@ describe('IdeasPage', () => {
 
     renderIdeasPage();
 
-    // Wait for ideas to load
     expect(await screen.findByText('Explore caching')).toBeInTheDocument();
     expect(screen.getByText('Build auth flow')).toBeInTheDocument();
 
-    // Status group headers are visible (Done/Parked groups are collapsed by default)
-    // "Exploring" appears in both badges and group headers, so just check count
     expect(screen.getAllByText('Exploring').length).toBeGreaterThan(0);
     expect(screen.getAllByText('Executing').length).toBeGreaterThan(0);
   });
@@ -174,34 +179,6 @@ describe('IdeasPage', () => {
     expect(screen.getByText('Running idea')).toBeInTheDocument();
   });
 
-  it('opens new idea dialog and creates an idea', async () => {
-    const user = userEvent.setup();
-    mocks.createProjectTask.mockResolvedValue(
-      makeTask({ id: 'new-1', title: 'My new idea' }),
-    );
-
-    renderIdeasPage();
-    await screen.findByRole('heading', { name: 'Ideas' });
-
-    // Open dialog
-    await user.click(screen.getByRole('button', { name: /New Idea/i }));
-
-    // Fill form
-    const titleInput = screen.getByLabelText('Title');
-    await user.type(titleInput, 'My new idea');
-
-    const descInput = screen.getByLabelText(/Description/);
-    await user.type(descInput, 'Some description');
-
-    // Submit
-    await user.click(screen.getByRole('button', { name: /Create Idea/i }));
-
-    expect(mocks.createProjectTask).toHaveBeenCalledWith('proj-test', {
-      title: 'My new idea',
-      description: 'Some description',
-    });
-  });
-
   it('shows session count per idea', async () => {
     mocks.listProjectTasks.mockResolvedValue({
       tasks: [makeTask({ id: 'task-1', title: 'Idea with sessions', status: 'draft' })],
@@ -216,57 +193,8 @@ describe('IdeasPage', () => {
     });
 
     renderIdeasPage();
-    expect(await screen.findByText('2 sessions')).toBeInTheDocument();
-  });
-
-  it('navigates to chat on brainstorm action', async () => {
-    const user = userEvent.setup();
-    mocks.listProjectTasks.mockResolvedValue({
-      tasks: [makeTask({ id: 'idea-1', title: 'Brainstorm me', status: 'draft' })],
-      nextCursor: null,
-    });
-
-    renderIdeasPage();
-    await screen.findByText('Brainstorm me');
-
-    // Hover to show actions (simulate by finding the button)
-    const brainstormBtn = screen.getByRole('button', { name: 'Brainstorm' });
-    await user.click(brainstormBtn);
-
-    expect(mocks.navigate).toHaveBeenCalledWith(
-      '/projects/proj-test/chat',
-      expect.objectContaining({
-        state: expect.objectContaining({
-          brainstormIdea: expect.objectContaining({
-            taskId: 'idea-1',
-            title: 'Brainstorm me',
-          }),
-        }),
-      }),
-    );
-  });
-
-  it('executes an idea by promoting to ready and running', async () => {
-    const user = userEvent.setup();
-    mocks.listProjectTasks.mockResolvedValue({
-      tasks: [makeTask({ id: 'idea-2', title: 'Execute me', status: 'draft' })],
-      nextCursor: null,
-    });
-    mocks.updateProjectTaskStatus.mockResolvedValue({});
-    mocks.runProjectTask.mockResolvedValue({ taskId: 'idea-2', status: 'queued' });
-
-    renderIdeasPage();
-    await screen.findByText('Execute me');
-
-    const executeBtn = screen.getByRole('button', { name: 'Execute' });
-    await user.click(executeBtn);
-
-    // Should transition draft → ready, then run
-    expect(mocks.updateProjectTaskStatus).toHaveBeenCalledWith('proj-test', 'idea-2', {
-      toStatus: 'ready',
-    });
-    expect(mocks.runProjectTask).toHaveBeenCalledWith('proj-test', 'idea-2');
-    expect(mocks.navigate).toHaveBeenCalledWith('/projects/proj-test/chat');
+    const ideaCard = await screen.findByRole('button', { name: /View idea: Idea with sessions/i });
+    expect(ideaCard).toHaveTextContent('2');
   });
 
   it('navigates to idea detail on card click', async () => {
@@ -279,49 +207,12 @@ describe('IdeasPage', () => {
     renderIdeasPage();
     await screen.findByText('Click me');
 
-    // Click on the card navigation button
     const cardBtn = screen.getByRole('button', { name: /View idea: Click me/i });
     await user.click(cardBtn);
 
     expect(mocks.navigate).toHaveBeenCalledWith('/projects/proj-test/ideas/idea-3');
   });
 
-  it('deletes an idea', async () => {
-    const user = userEvent.setup();
-    mocks.listProjectTasks.mockResolvedValue({
-      tasks: [makeTask({ id: 'idea-4', title: 'Delete me', status: 'draft' })],
-      nextCursor: null,
-    });
-    mocks.deleteProjectTask.mockResolvedValue({ success: true });
-
-    renderIdeasPage();
-    await screen.findByText('Delete me');
-
-    const deleteBtn = screen.getByRole('button', { name: 'Delete idea' });
-    await user.click(deleteBtn);
-
-    expect(mocks.deleteProjectTask).toHaveBeenCalledWith('proj-test', 'idea-4');
-  });
-
-  it('executes a ready-status idea without transitioning status', async () => {
-    const user = userEvent.setup();
-    mocks.listProjectTasks.mockResolvedValue({
-      tasks: [makeTask({ id: 'idea-r', title: 'Ready idea', status: 'ready' })],
-      nextCursor: null,
-    });
-    mocks.runProjectTask.mockResolvedValue({ taskId: 'idea-r', status: 'queued' });
-
-    renderIdeasPage();
-    await screen.findByText('Ready idea');
-
-    const executeBtn = screen.getByRole('button', { name: 'Execute' });
-    await user.click(executeBtn);
-
-    // Should NOT call updateProjectTaskStatus for ready ideas
-    expect(mocks.updateProjectTaskStatus).not.toHaveBeenCalled();
-    expect(mocks.runProjectTask).toHaveBeenCalledWith('proj-test', 'idea-r');
-  });
-
   it('expands a collapsed group when clicked', async () => {
     const user = userEvent.setup();
     mocks.listProjectTasks.mockResolvedValue({
@@ -331,14 +222,11 @@ describe('IdeasPage', () => {
 
     renderIdeasPage();
 
-    // Done group is collapsed by default — idea should not be visible
     const doneBtn = await screen.findByRole('button', { name: /Done/i });
     expect(screen.queryByText('Completed idea')).not.toBeInTheDocument();
 
-    // Click group header to expand
     await user.click(doneBtn);
 
-    // Now the idea should be visible
     expect(screen.getByText('Completed idea')).toBeInTheDocument();
   });
 
@@ -358,32 +246,28 @@ describe('IdeasPage', () => {
     expect(screen.getByText('No ideas match your search.')).toBeInTheDocument();
   });
 
-  it('cancel button closes the new idea dialog', async () => {
-    const user = userEvent.setup();
-    renderIdeasPage();
-    await screen.findByRole('heading', { name: 'Ideas' });
-
-    // Open dialog
-    await user.click(screen.getByRole('button', { name: /New Idea/i }));
-    expect(screen.getByRole('heading', { name: 'New Idea' })).toBeInTheDocument();
-
-    // Cancel
-    await user.click(screen.getByRole('button', { name: 'Cancel' }));
+  it('displays idea creation time', async () => {
+    mocks.listProjectTasks.mockResolvedValue({
+      tasks: [makeTask({ id: '1', title: 'Timed idea', status: 'draft', createdAt: new Date().toISOString() })],
+      nextCursor: null,
+    });
 
-    // Dialog should be gone (the form heading disappears)
-    expect(screen.queryByLabelText('Title')).not.toBeInTheDocument();
-    expect(mocks.createProjectTask).not.toHaveBeenCalled();
+    renderIdeasPage();
+    const card = await screen.findByRole('button', { name: /View idea: Timed idea/i });
+    expect(card).toHaveTextContent('just now');
   });
 
-  it('does not submit when title is empty', async () => {
-    const user = userEvent.setup();
-    renderIdeasPage();
-    await screen.findByRole('heading', { name: 'Ideas' });
+  it('shows timeline accent border for status groups', async () => {
+    mocks.listProjectTasks.mockResolvedValue({
+      tasks: [makeTask({ id: '1', title: 'My idea', status: 'draft' })],
+      nextCursor: null,
+    });
 
-    await user.click(screen.getByRole('button', { name: /New Idea/i }));
+    renderIdeasPage();
+    await screen.findByText('My idea');
 
-    // Submit button should be disabled with empty title
-    const submitBtn = screen.getByRole('button', { name: /Create Idea/i });
-    expect(submitBtn).toBeDisabled();
+    const section = screen.getByText('My idea').closest('button')?.parentElement;
+    expect(section).toBeTruthy();
+    expect(section?.className).toContain('border-l-2');
   });
 });
diff --git a/tasks/backlog/2026-03-19-ideas-page-polish.md b/tasks/backlog/2026-03-19-ideas-page-polish.md
index e346a4219..3d7297945 100644
--- a/tasks/backlog/2026-03-19-ideas-page-polish.md
+++ b/tasks/backlog/2026-03-19-ideas-page-polish.md
@@ -1,7 +1,8 @@
 # Ideas Page Polish Items
 
 **Created**: 2026-03-19
-**Source**: UI/UX specialist review of PR #458
+**Updated**: 2026-03-19 (after read-only redesign in PR #464)
+**Source**: UI/UX specialist review of PR #458, updated after PR #464
 
 ## Problem
 
@@ -9,26 +10,24 @@ Several non-blocking UX improvements identified during the Ideas page review tha
 
 ## Items
 
-### 1. Delete idea has no confirmation guard
-- `handleDelete` in `IdeasPage.tsx` calls the destructive API immediately on click
-- Add a `window.confirm` or inline undo toast to prevent accidental deletions
-
-### 2. TaskDetail breadcrumbs under ideas route
+### 1. TaskDetail breadcrumbs under ideas route
 - `handleIdeaClick` navigates to `/projects/:id/ideas/:taskId` which renders `TaskDetail`
 - Verify `TaskDetail` page title and breadcrumbs don't say "Task" when accessed from ideas context
 
-### 3. Session idea-tag overflow in narrow drawers
+### 2. Session idea-tag overflow in narrow drawers
 - The idea tag in `ProjectChat` sidebar uses `whitespace-nowrap` + `overflow-hidden text-ellipsis`
 - `max-w-full` on the tag inside a flex parent could still cause overflow in very narrow mobile drawers
 - Low priority
 
-### 4. Native select styling inconsistency
+### 3. Native select styling inconsistency
 - Status filter `<select>` ignores most custom styling on Windows/Android Chrome
 - Consider a custom dropdown component if consistent styling is important
 
+## Removed Items (resolved by PR #464 read-only redesign)
+- ~~Delete idea has no confirmation guard~~ — all write actions removed; IdeasPage is now read-only
+
 ## Acceptance Criteria
 
-- [ ] Delete action shows confirmation before proceeding
 - [ ] TaskDetail renders appropriate context (Ideas vs Tasks) based on route
 - [ ] Idea tags don't overflow in narrow mobile drawers
 - [ ] Status filter appearance is acceptable cross-platform (or custom dropdown implemented)