diff --git a/apps/web/src/components/work-item/DatePickerTrigger.tsx b/apps/web/src/components/work-item/DatePickerTrigger.tsx
index 00d411a..94de46e 100644
--- a/apps/web/src/components/work-item/DatePickerTrigger.tsx
+++ b/apps/web/src/components/work-item/DatePickerTrigger.tsx
@@ -1,4 +1,5 @@
 import { useRef } from 'react';
+import { cn } from '../../lib/utils';
 
 /* eslint-disable react-refresh/only-export-components -- formatDateForDisplay shared util; keep in same file for future use */
 export function formatDateForDisplay(isoDate: string): string {
@@ -17,6 +18,8 @@ export interface DatePickerTriggerProps {
   onChange: (value: string) => void;
   placeholder: string;
   compact?: boolean;
+  /** Extra classes for the trigger container (e.g. an overdue tone). */
+  className?: string;
 }
 
 export function DatePickerTrigger({
@@ -26,12 +29,18 @@ export function DatePickerTrigger({
   onChange,
   placeholder,
   compact: _compact = true, // eslint-disable-line @typescript-eslint/no-unused-vars -- kept for future compact layout
+  className,
 }: DatePickerTriggerProps) {
   const inputRef = useRef<HTMLInputElement>(null);
   const displayValue = value ? formatDateForDisplay(value) : '';
 
   return (
-    <div className="relative inline-flex min-w-0 shrink-0 items-center gap-1 rounded border border-(--border-subtle) bg-(--bg-layer-2) px-1.5 py-1 text-xs text-(--txt-secondary) [&_svg]:size-3">
+    <div
+      className={cn(
+        'relative inline-flex min-w-0 shrink-0 items-center gap-1 rounded border border-(--border-subtle) bg-(--bg-layer-2) px-1.5 py-1 text-xs text-(--txt-secondary) [&_svg]:size-3',
+        className,
+      )}
+    >
       <span className="shrink-0 text-(--txt-icon-tertiary)">{icon}</span>
       <span className="truncate">{displayValue || placeholder}</span>
       <input
diff --git a/apps/web/src/components/work-item/EditableCells.tsx b/apps/web/src/components/work-item/EditableCells.tsx
new file mode 100644
index 0000000..768df3f
--- /dev/null
+++ b/apps/web/src/components/work-item/EditableCells.tsx
@@ -0,0 +1,252 @@
+import { Dropdown } from './Dropdown';
+import { StatePill, PriorityIcon, WorkItemAvatarGroup, LabelChips } from './IssueRowCells';
+import { membersFromAssigneeIds } from '../../lib/issueRowHelpers';
+import { getImageUrl } from '../../lib/utils';
+import { Avatar } from '../ui';
+import type {
+  StateApiResponse,
+  LabelApiResponse,
+  WorkspaceMemberApiResponse,
+} from '../../api/types';
+import type { Priority } from '../../types';
+
+/**
+ * Inline-editable property cells for the work-item layouts. Each wraps the
+ * read-only display cell from IssueRowCells in a Dropdown so a property can be
+ * changed in place. Open/close state is owned by the parent layout via a single
+ * `openId`/`onOpen` pair so only one picker is open at a time.
+ */
+
+const PRIORITIES: Priority[] = ['urgent', 'high', 'medium', 'low', 'none'];
+const CELL_TRIGGER =
+  'inline-flex min-w-0 max-w-full items-center gap-1 rounded-(--radius-md) px-1 py-0.5 text-left hover:bg-(--bg-layer-1-hover)';
+const OPTION_BTN =
+  'flex w-full items-center gap-2 px-3 py-2 text-left text-sm hover:bg-(--bg-layer-1-hover)';
+const PANEL =
+  'max-h-72 min-w-[220px] overflow-auto rounded-md border border-(--border-subtle) bg-(--bg-surface-1) py-1 shadow-(--shadow-raised)';
+
+const Check = ({ on }: { on: boolean }) => (
+  <span className="inline-flex size-4 shrink-0 items-center justify-center rounded border border-(--border-subtle) text-[10px] text-(--txt-accent-primary)">
+    {on ? '✓' : ''}
+  </span>
+);
+
+interface OpenProps {
+  openId: string | null;
+  onOpen: (id: string | null) => void;
+  align?: 'left' | 'right';
+}
+
+export function EditableStateCell({
+  issueId,
+  state,
+  states,
+  onChange,
+  openId,
+  onOpen,
+  align,
+}: OpenProps & {
+  issueId: string;
+  state?: StateApiResponse | null;
+  states: StateApiResponse[];
+  onChange: (stateId: string) => void;
+}) {
+  return (
+    <Dropdown
+      id={`${issueId}:state`}
+      openId={openId}
+      onOpen={onOpen}
+      label="State"
+      icon={null}
+      displayValue=""
+      align={align}
+      panelClassName={PANEL}
+      triggerClassName={CELL_TRIGGER}
+      triggerAriaLabel="Change state"
+      triggerContent={<StatePill state={state} />}
+    >
+      {states.map((s) => (
+        <button
+          key={s.id}
+          type="button"
+          className={OPTION_BTN}
+          onClick={() => {
+            onOpen(null);
+            if (s.id !== state?.id) onChange(s.id);
+          }}
+        >
+          <StatePill state={s} />
+          <span className="truncate text-(--txt-primary)">{s.name}</span>
+          {state?.id === s.id && <span className="ml-auto text-xs text-(--txt-tertiary)">✓</span>}
+        </button>
+      ))}
+    </Dropdown>
+  );
+}
+
+export function EditablePriorityCell({
+  issueId,
+  priority,
+  onChange,
+  openId,
+  onOpen,
+  align,
+}: OpenProps & {
+  issueId: string;
+  priority?: Priority | string | null;
+  onChange: (priority: Priority) => void;
+}) {
+  const current = (priority ?? 'none') as Priority;
+  return (
+    <Dropdown
+      id={`${issueId}:priority`}
+      openId={openId}
+      onOpen={onOpen}
+      label="Priority"
+      icon={null}
+      displayValue=""
+      align={align}
+      panelClassName={PANEL}
+      triggerClassName={CELL_TRIGGER}
+      triggerAriaLabel="Change priority"
+      triggerContent={<PriorityIcon priority={current} />}
+    >
+      {PRIORITIES.map((p) => (
+        <button
+          key={p}
+          type="button"
+          className={OPTION_BTN}
+          onClick={() => {
+            onOpen(null);
+            if (p !== current) onChange(p);
+          }}
+        >
+          <PriorityIcon priority={p} />
+          <span className="capitalize text-(--txt-primary)">
+            {p === 'none' ? 'No priority' : p}
+          </span>
+          {current === p && <span className="ml-auto text-xs text-(--txt-tertiary)">✓</span>}
+        </button>
+      ))}
+    </Dropdown>
+  );
+}
+
+export function EditableAssigneeCell({
+  issueId,
+  assigneeIds,
+  members,
+  onChange,
+  openId,
+  onOpen,
+  align,
+}: OpenProps & {
+  issueId: string;
+  assigneeIds: string[];
+  members: WorkspaceMemberApiResponse[];
+  onChange: (assigneeIds: string[]) => void;
+}) {
+  const selected = membersFromAssigneeIds(members, assigneeIds);
+  return (
+    <Dropdown
+      id={`${issueId}:assignees`}
+      openId={openId}
+      onOpen={onOpen}
+      label="Assignees"
+      icon={null}
+      displayValue=""
+      align={align}
+      panelClassName={PANEL}
+      triggerClassName={CELL_TRIGGER}
+      triggerAriaLabel="Change assignees"
+      triggerContent={<WorkItemAvatarGroup members={selected} />}
+    >
+      {members.map((m) => {
+        const checked = assigneeIds.includes(m.member_id);
+        const name = m.member_display_name || (m.member_email ?? 'Unknown');
+        return (
+          <button
+            key={m.id}
+            type="button"
+            className={OPTION_BTN}
+            onClick={() =>
+              onChange(
+                checked
+                  ? assigneeIds.filter((x) => x !== m.member_id)
+                  : [...assigneeIds, m.member_id],
+              )
+            }
+          >
+            <Check on={checked} />
+            <Avatar name={name} src={getImageUrl(m.member_avatar) ?? undefined} size="sm" />
+            <span className="truncate text-(--txt-primary)">{name}</span>
+          </button>
+        );
+      })}
+      {members.length === 0 && (
+        <p className="px-3 py-2 text-sm text-(--txt-tertiary)">No members</p>
+      )}
+    </Dropdown>
+  );
+}
+
+export function EditableLabelCell({
+  issueId,
+  labelIds,
+  labels,
+  onChange,
+  openId,
+  onOpen,
+  align,
+}: OpenProps & {
+  issueId: string;
+  labelIds: string[];
+  labels: LabelApiResponse[];
+  onChange: (labelIds: string[]) => void;
+}) {
+  const selected = labels.filter((l) => labelIds.includes(l.id));
+  return (
+    <Dropdown
+      id={`${issueId}:labels`}
+      openId={openId}
+      onOpen={onOpen}
+      label="Labels"
+      icon={null}
+      displayValue=""
+      align={align}
+      panelClassName={PANEL}
+      triggerClassName={CELL_TRIGGER}
+      triggerAriaLabel="Change labels"
+      triggerContent={
+        selected.length > 0 ? (
+          <LabelChips labels={selected} max={2} />
+        ) : (
+          <span className="text-[11px] text-(--txt-tertiary)">Labels</span>
+        )
+      }
+    >
+      {labels.map((l) => {
+        const checked = labelIds.includes(l.id);
+        return (
+          <button
+            key={l.id}
+            type="button"
+            className={OPTION_BTN}
+            onClick={() =>
+              onChange(checked ? labelIds.filter((x) => x !== l.id) : [...labelIds, l.id])
+            }
+          >
+            <Check on={checked} />
+            <span
+              className="h-2 w-2 shrink-0 rounded-full"
+              style={{ backgroundColor: l.color || 'var(--neutral-500)' }}
+              aria-hidden
+            />
+            <span className="truncate text-(--txt-primary)">{l.name}</span>
+          </button>
+        );
+      })}
+      {labels.length === 0 && <p className="px-3 py-2 text-sm text-(--txt-tertiary)">No labels</p>}
+    </Dropdown>
+  );
+}
diff --git a/apps/web/src/components/work-item/IssueRowCells.tsx b/apps/web/src/components/work-item/IssueRowCells.tsx
index 1d59c50..4413c6d 100644
--- a/apps/web/src/components/work-item/IssueRowCells.tsx
+++ b/apps/web/src/components/work-item/IssueRowCells.tsx
@@ -4,7 +4,7 @@ import { Avatar } from '../ui';
 import { cn, getImageUrl } from '../../lib/utils';
 import type { IssueApiResponse, LabelApiResponse, StateApiResponse } from '../../api/types';
 import type { Priority } from '../../types';
-import type { MemberLite } from '../../lib/issueRowHelpers';
+import { isOverdue, type MemberLite } from '../../lib/issueRowHelpers';
 
 export type { MemberLite };
 
@@ -256,14 +256,10 @@ interface DueDateCellProps {
 }
 
 export function DueDateCell({ issue, state, now }: DueDateCellProps) {
-  const overdue = useMemo(() => {
-    if (!issue.target_date) return false;
-    const t = Date.parse(issue.target_date);
-    if (Number.isNaN(t)) return false;
-    const stateGroup = state?.group ?? '';
-    if (stateGroup === 'completed' || stateGroup === 'cancelled') return false;
-    return t < now - 24 * 3600 * 1000;
-  }, [issue.target_date, state?.group, now]);
+  const overdue = useMemo(
+    () => isOverdue(issue.target_date, state?.group, now),
+    [issue.target_date, state?.group, now],
+  );
 
   if (!issue.target_date) {
     return (
diff --git a/apps/web/src/components/work-item/layouts/IssueLayoutBoard.tsx b/apps/web/src/components/work-item/layouts/IssueLayoutBoard.tsx
index 3e79093..8ccf0f7 100644
--- a/apps/web/src/components/work-item/layouts/IssueLayoutBoard.tsx
+++ b/apps/web/src/components/work-item/layouts/IssueLayoutBoard.tsx
@@ -1,5 +1,6 @@
 import { useMemo, useState } from 'react';
 import { Link } from 'react-router-dom';
+import { Calendar } from 'lucide-react';
 import { IssuePRBadge } from '../IssuePRBadge';
 import {
   DueDateCell,
@@ -8,8 +9,20 @@ import {
   StatePill,
   WorkItemAvatarGroup,
 } from '../IssueRowCells';
-import { membersFromAssigneeIds } from '../../../lib/issueRowHelpers';
-import type { IssueApiResponse, LabelApiResponse } from '../../../api/types';
+import {
+  EditableStateCell,
+  EditablePriorityCell,
+  EditableAssigneeCell,
+  EditableLabelCell,
+} from '../EditableCells';
+import { DatePickerTrigger } from '../DatePickerTrigger';
+import { isOverdue, membersFromAssigneeIds } from '../../../lib/issueRowHelpers';
+import type {
+  IssueApiResponse,
+  LabelApiResponse,
+  StateApiResponse,
+  WorkspaceMemberApiResponse,
+} from '../../../api/types';
 import type { Priority } from '../../../types';
 import {
   issueDisplayId,
@@ -37,6 +50,7 @@ export function IssueLayoutBoard({
   projectsById,
   groupByStateGroup,
   onCardMove,
+  onUpdateIssue,
 }: IssueLayoutProps) {
   const labelById = useMemo(() => new Map(labels.map((l) => [l.id, l])), [labels]);
   const stateById = useMemo(() => new Map(states.map((s) => [s.id, s])), [states]);
@@ -45,6 +59,7 @@ export function IssueLayoutBoard({
   const dndEnabled = Boolean(onCardMove);
   const [draggingId, setDraggingId] = useState<string | null>(null);
   const [dropKey, setDropKey] = useState<string | null>(null);
+  const [openCell, setOpenCell] = useState<string | null>(null);
 
   // Map a column to the concrete state an issue should land in. For per-state
   // columns the key is already a state id; for grouped columns we pick a state
@@ -142,6 +157,12 @@ export function IssueLayoutBoard({
         setDraggingId(null);
         setDropKey(null);
       }}
+      allStates={states}
+      allLabels={labels}
+      allMembers={members}
+      onUpdateIssue={onUpdateIssue}
+      openId={openCell}
+      onOpenCell={setOpenCell}
     />
   );
 
@@ -260,6 +281,29 @@ interface BoardCardProps {
   isDragging?: boolean;
   onDragStart?: (e: React.DragEvent) => void;
   onDragEnd?: (e: React.DragEvent) => void;
+  allStates: StateApiResponse[];
+  allLabels: LabelApiResponse[];
+  allMembers: WorkspaceMemberApiResponse[];
+  onUpdateIssue?: IssueLayoutProps['onUpdateIssue'];
+  openId: string | null;
+  onOpenCell: (id: string | null) => void;
+}
+
+// Wraps an interactive control inside the card's navigating Link so clicking it
+// edits in place instead of opening the issue, and doesn't start a card drag.
+function CellGuard({ children }: { children: React.ReactNode }) {
+  return (
+    <span
+      draggable={false}
+      onDragStart={(e) => e.preventDefault()}
+      onClick={(e) => {
+        e.preventDefault();
+        e.stopPropagation();
+      }}
+    >
+      {children}
+    </span>
+  );
 }
 
 function BoardCard({
@@ -276,8 +320,15 @@ function BoardCard({
   isDragging,
   onDragStart,
   onDragEnd,
+  allStates,
+  allLabels,
+  allMembers,
+  onUpdateIssue,
+  openId,
+  onOpenCell,
 }: BoardCardProps) {
   const displayId = issueDisplayId(issue, project, projectsById);
+  const editable = Boolean(onUpdateIssue);
   return (
     <Link
       to={href}
@@ -293,7 +344,19 @@ function BoardCard({
       } ${isDragging ? 'opacity-50' : ''}`}
     >
       <div className="flex items-start gap-2">
-        <PriorityIcon priority={issue.priority as Priority | null | undefined} />
+        {editable && onUpdateIssue ? (
+          <CellGuard>
+            <EditablePriorityCell
+              issueId={issue.id}
+              priority={issue.priority}
+              openId={openId}
+              onOpen={onOpenCell}
+              onChange={(priority) => onUpdateIssue(issue.id, { priority })}
+            />
+          </CellGuard>
+        ) : (
+          <PriorityIcon priority={issue.priority as Priority | null | undefined} />
+        )}
         <div className="min-w-0 flex-1">
           <div className="flex items-center gap-1.5 text-[11px] text-(--txt-tertiary)">
             <span className="font-medium text-(--txt-accent-primary)">{displayId}</span>
@@ -306,13 +369,69 @@ function BoardCard({
       </div>
 
       <div className="mt-2 flex flex-wrap items-center gap-1.5">
-        {labels.length > 0 && <LabelChips labels={labels} max={2} />}
-        <DueDateCell issue={issue} state={state} now={now} />
-        {state && <StatePill state={state} />}
+        {editable && onUpdateIssue ? (
+          <>
+            {state && (
+              <CellGuard>
+                <EditableStateCell
+                  issueId={issue.id}
+                  state={state}
+                  states={allStates}
+                  openId={openId}
+                  onOpen={onOpenCell}
+                  onChange={(state_id) => onUpdateIssue(issue.id, { state_id })}
+                />
+              </CellGuard>
+            )}
+            <CellGuard>
+              <DatePickerTrigger
+                label="Due date"
+                icon={<Calendar />}
+                value={issue.target_date ?? ''}
+                placeholder="Due"
+                className={
+                  isOverdue(issue.target_date, state?.group, now)
+                    ? 'border-(--border-danger-strong) text-(--txt-danger-primary)'
+                    : undefined
+                }
+                onChange={(v) => onUpdateIssue(issue.id, { target_date: v || null })}
+              />
+            </CellGuard>
+            <CellGuard>
+              <EditableLabelCell
+                issueId={issue.id}
+                labelIds={issue.label_ids ?? []}
+                labels={allLabels}
+                openId={openId}
+                onOpen={onOpenCell}
+                onChange={(label_ids) => onUpdateIssue(issue.id, { label_ids })}
+              />
+            </CellGuard>
+          </>
+        ) : (
+          <>
+            {labels.length > 0 && <LabelChips labels={labels} max={2} />}
+            <DueDateCell issue={issue} state={state} now={now} />
+            {state && <StatePill state={state} />}
+          </>
+        )}
       </div>
 
       <div className="mt-2 flex items-center justify-between">
-        <WorkItemAvatarGroup members={assignees} max={3} />
+        {editable && onUpdateIssue ? (
+          <CellGuard>
+            <EditableAssigneeCell
+              issueId={issue.id}
+              assigneeIds={issue.assignee_ids ?? []}
+              members={allMembers}
+              openId={openId}
+              onOpen={onOpenCell}
+              onChange={(assignee_ids) => onUpdateIssue(issue.id, { assignee_ids })}
+            />
+          </CellGuard>
+        ) : (
+          <WorkItemAvatarGroup members={assignees} max={3} />
+        )}
       </div>
     </Link>
   );
diff --git a/apps/web/src/components/work-item/layouts/IssueLayoutList.tsx b/apps/web/src/components/work-item/layouts/IssueLayoutList.tsx
index acd6256..ed9f245 100644
--- a/apps/web/src/components/work-item/layouts/IssueLayoutList.tsx
+++ b/apps/web/src/components/work-item/layouts/IssueLayoutList.tsx
@@ -1,6 +1,6 @@
 import { useEffect, useMemo, useRef, useState } from 'react';
 import { Link } from 'react-router-dom';
-import { GripVertical } from 'lucide-react';
+import { Calendar, GripVertical } from 'lucide-react';
 import { IssuePRBadge } from '../IssuePRBadge';
 import {
   DueDateCell,
@@ -9,7 +9,14 @@ import {
   StatePill,
   WorkItemAvatarGroup,
 } from '../IssueRowCells';
-import { membersFromAssigneeIds } from '../../../lib/issueRowHelpers';
+import {
+  EditableStateCell,
+  EditablePriorityCell,
+  EditableAssigneeCell,
+  EditableLabelCell,
+} from '../EditableCells';
+import { DatePickerTrigger } from '../DatePickerTrigger';
+import { isOverdue, membersFromAssigneeIds } from '../../../lib/issueRowHelpers';
 import { cn } from '../../../lib/utils';
 import type { IssueApiResponse, LabelApiResponse } from '../../../api/types';
 import type { Priority } from '../../../types';
@@ -63,9 +70,11 @@ export function IssueLayoutList({
   moduleName,
   selection,
   onReorder,
+  onUpdateIssue,
 }: IssueLayoutListProps) {
   const stateById = useMemo(() => new Map(states.map((s) => [s.id, s])), [states]);
   const labelById = useMemo(() => new Map(labels.map((l) => [l.id, l])), [labels]);
+  const [openCell, setOpenCell] = useState<string | null>(null);
 
   // Drag-to-reorder is only offered on the flat list (the parent decides whether
   // manual ordering is active by passing onReorder).
@@ -118,7 +127,7 @@ export function IssueLayoutList({
       <li
         key={issue.id}
         className={cn(
-          'group/row flex items-center',
+          'group/row flex items-center transition-colors hover:bg-(--bg-layer-1-hover)',
           draggingId === issue.id && 'opacity-50',
           isDropTarget &&
             (dropTarget!.after
@@ -180,62 +189,139 @@ export function IssueLayoutList({
             />
           </span>
         ) : null}
+        {hasCol('priority') ? (
+          <span className="shrink-0 pl-4">
+            {onUpdateIssue ? (
+              <EditablePriorityCell
+                issueId={issue.id}
+                priority={issue.priority}
+                openId={openCell}
+                onOpen={setOpenCell}
+                onChange={(priority) => onUpdateIssue(issue.id, { priority })}
+              />
+            ) : (
+              <PriorityIcon priority={issue.priority as Priority | null | undefined} />
+            )}
+          </span>
+        ) : null}
         <Link
           draggable={false}
           to={issueHref(issue.id)}
-          className="flex min-h-12 flex-1 items-center gap-3 px-4 py-2.5 no-underline transition-colors hover:bg-(--bg-layer-1-hover)"
+          className="flex min-h-12 min-w-0 flex-1 items-center gap-1.5 truncate px-3 py-2.5 text-sm no-underline"
         >
-          <span className="flex min-w-0 flex-1 items-center gap-1.5 truncate text-sm">
-            {hasCol('priority') ? (
-              <span className="shrink-0">
-                <PriorityIcon priority={issue.priority as Priority | null | undefined} />
-              </span>
-            ) : null}
-            {hasCol('id') ? (
-              <span className="shrink-0 font-medium text-(--txt-accent-primary)">{displayId}</span>
-            ) : null}
-            <span className="ml-1 truncate text-(--txt-primary)">{issue.name}</span>
-            <IssuePRBadge summary={prInfo} />
-          </span>
-          <div className="flex shrink-0 flex-wrap items-center gap-2 text-(--txt-icon-tertiary)">
-            {hasCol('state') ? <StatePill state={issueState} /> : null}
-            {hasCol('start_date') ? (
+          {hasCol('id') ? (
+            <span className="shrink-0 font-medium text-(--txt-accent-primary)">{displayId}</span>
+          ) : null}
+          <span className="ml-1 truncate text-(--txt-primary)">{issue.name}</span>
+          <IssuePRBadge summary={prInfo} />
+        </Link>
+        <div className="flex shrink-0 flex-wrap items-center gap-2 px-4 text-(--txt-icon-tertiary)">
+          {hasCol('state') ? (
+            onUpdateIssue ? (
+              <EditableStateCell
+                issueId={issue.id}
+                state={issueState}
+                states={states}
+                openId={openCell}
+                onOpen={setOpenCell}
+                align="right"
+                onChange={(state_id) => onUpdateIssue(issue.id, { state_id })}
+              />
+            ) : (
+              <StatePill state={issueState} />
+            )
+          ) : null}
+          {hasCol('start_date') ? (
+            onUpdateIssue ? (
+              <DatePickerTrigger
+                label="Start date"
+                icon={<Calendar />}
+                value={issue.start_date ?? ''}
+                placeholder="Start"
+                onChange={(v) => onUpdateIssue(issue.id, { start_date: v || null })}
+              />
+            ) : (
               <span
                 className="max-w-[5rem] truncate text-[11px] text-(--txt-secondary)"
                 title={issue.start_date ?? ''}
               >
                 {startStr ?? '—'}
               </span>
-            ) : null}
-            {hasCol('due_date') ? <DueDateCell issue={issue} state={issueState} now={now} /> : null}
-            {hasCol('assignee') ? <WorkItemAvatarGroup members={issueAssignees} /> : null}
-            {hasCol('labels') ? <LabelChips labels={issueLabels} /> : null}
-            {hasCol('sub_work_count') && subN > 0 ? (
-              <span
-                className="inline-flex h-5 items-center gap-1 rounded-(--radius-md) border border-(--border-subtle) bg-(--bg-surface-1) px-1.5 text-[11px] text-(--txt-secondary)"
-                title="Sub-work items"
-              >
-                {subN}
-              </span>
-            ) : null}
-            {hasCol('cycle') && cycleName(issue) !== '—' ? (
-              <span
-                className="max-w-[6rem] truncate text-[11px] text-(--txt-secondary)"
-                title={`Cycle: ${cycleName(issue)}`}
-              >
-                {cycleName(issue)}
-              </span>
-            ) : null}
-            {hasCol('module') && moduleName(issue) !== '—' ? (
-              <span
-                className="max-w-[6rem] truncate text-[11px] text-(--txt-secondary)"
-                title={`Module: ${moduleName(issue)}`}
-              >
-                {moduleName(issue)}
-              </span>
-            ) : null}
-          </div>
-        </Link>
+            )
+          ) : null}
+          {hasCol('due_date') ? (
+            onUpdateIssue ? (
+              <DatePickerTrigger
+                label="Due date"
+                icon={<Calendar />}
+                value={issue.target_date ?? ''}
+                placeholder="Due"
+                className={
+                  isOverdue(issue.target_date, issueState?.group, now)
+                    ? 'border-(--border-danger-strong) text-(--txt-danger-primary)'
+                    : undefined
+                }
+                onChange={(v) => onUpdateIssue(issue.id, { target_date: v || null })}
+              />
+            ) : (
+              <DueDateCell issue={issue} state={issueState} now={now} />
+            )
+          ) : null}
+          {hasCol('assignee') ? (
+            onUpdateIssue ? (
+              <EditableAssigneeCell
+                issueId={issue.id}
+                assigneeIds={issue.assignee_ids ?? []}
+                members={members}
+                openId={openCell}
+                onOpen={setOpenCell}
+                align="right"
+                onChange={(assignee_ids) => onUpdateIssue(issue.id, { assignee_ids })}
+              />
+            ) : (
+              <WorkItemAvatarGroup members={issueAssignees} />
+            )
+          ) : null}
+          {hasCol('labels') ? (
+            onUpdateIssue ? (
+              <EditableLabelCell
+                issueId={issue.id}
+                labelIds={issue.label_ids ?? []}
+                labels={labels}
+                openId={openCell}
+                onOpen={setOpenCell}
+                align="right"
+                onChange={(label_ids) => onUpdateIssue(issue.id, { label_ids })}
+              />
+            ) : (
+              <LabelChips labels={issueLabels} />
+            )
+          ) : null}
+          {hasCol('sub_work_count') && subN > 0 ? (
+            <span
+              className="inline-flex h-5 items-center gap-1 rounded-(--radius-md) border border-(--border-subtle) bg-(--bg-surface-1) px-1.5 text-[11px] text-(--txt-secondary)"
+              title="Sub-work items"
+            >
+              {subN}
+            </span>
+          ) : null}
+          {hasCol('cycle') && cycleName(issue) !== '—' ? (
+            <span
+              className="max-w-[6rem] truncate text-[11px] text-(--txt-secondary)"
+              title={`Cycle: ${cycleName(issue)}`}
+            >
+              {cycleName(issue)}
+            </span>
+          ) : null}
+          {hasCol('module') && moduleName(issue) !== '—' ? (
+            <span
+              className="max-w-[6rem] truncate text-[11px] text-(--txt-secondary)"
+              title={`Module: ${moduleName(issue)}`}
+            >
+              {moduleName(issue)}
+            </span>
+          ) : null}
+        </div>
       </li>
     );
   };
diff --git a/apps/web/src/components/work-item/layouts/IssueLayoutSpreadsheet.tsx b/apps/web/src/components/work-item/layouts/IssueLayoutSpreadsheet.tsx
index 20cd6bc..72d1977 100644
--- a/apps/web/src/components/work-item/layouts/IssueLayoutSpreadsheet.tsx
+++ b/apps/web/src/components/work-item/layouts/IssueLayoutSpreadsheet.tsx
@@ -1,5 +1,6 @@
-import { useMemo } from 'react';
+import { useMemo, useState } from 'react';
 import { Link } from 'react-router-dom';
+import { Calendar } from 'lucide-react';
 import { IssuePRBadge } from '../IssuePRBadge';
 import {
   DueDateCell,
@@ -8,7 +9,14 @@ import {
   StatePill,
   WorkItemAvatarGroup,
 } from '../IssueRowCells';
-import { membersFromAssigneeIds } from '../../../lib/issueRowHelpers';
+import {
+  EditableStateCell,
+  EditablePriorityCell,
+  EditableAssigneeCell,
+  EditableLabelCell,
+} from '../EditableCells';
+import { DatePickerTrigger } from '../DatePickerTrigger';
+import { isOverdue, membersFromAssigneeIds } from '../../../lib/issueRowHelpers';
 import type { LabelApiResponse } from '../../../api/types';
 import type { Priority } from '../../../types';
 import type { IssueLayoutProps } from './IssueLayoutTypes';
@@ -18,7 +26,7 @@ import type { IssueLayoutProps } from './IssueLayoutTypes';
  * the same cells the list/board use, so visuals stay consistent.
  *
  * Columns (in order): ID • Title • State • Priority • Assignees • Labels • Due • Start.
- * No grouping, no inline editing yet — those would each merit their own pass.
+ * Property cells are editable in place when `onUpdateIssue` is provided.
  */
 export function IssueLayoutSpreadsheet({
   project,
@@ -29,9 +37,11 @@ export function IssueLayoutSpreadsheet({
   prSummary,
   issueHref,
   now,
+  onUpdateIssue,
 }: IssueLayoutProps) {
   const stateById = useMemo(() => new Map(states.map((s) => [s.id, s])), [states]);
   const labelById = useMemo(() => new Map(labels.map((l) => [l.id, l])), [labels]);
+  const [openCell, setOpenCell] = useState<string | null>(null);
 
   return (
     <div className="overflow-auto">
@@ -77,20 +87,92 @@ export function IssueLayoutSpreadsheet({
                     <IssuePRBadge summary={prSummary[issue.id]} />
                   </Link>
                 </Td>
-                <Td>{issueState ? <StatePill state={issueState} /> : null}</Td>
+                <Td>
+                  {onUpdateIssue ? (
+                    <EditableStateCell
+                      issueId={issue.id}
+                      state={issueState}
+                      states={states}
+                      openId={openCell}
+                      onOpen={setOpenCell}
+                      onChange={(state_id) => onUpdateIssue(issue.id, { state_id })}
+                    />
+                  ) : issueState ? (
+                    <StatePill state={issueState} />
+                  ) : null}
+                </Td>
                 <Td className="text-center">
-                  <PriorityIcon priority={issue.priority as Priority | null | undefined} />
+                  {onUpdateIssue ? (
+                    <EditablePriorityCell
+                      issueId={issue.id}
+                      priority={issue.priority}
+                      openId={openCell}
+                      onOpen={setOpenCell}
+                      onChange={(priority) => onUpdateIssue(issue.id, { priority })}
+                    />
+                  ) : (
+                    <PriorityIcon priority={issue.priority as Priority | null | undefined} />
+                  )}
                 </Td>
                 <Td>
-                  <WorkItemAvatarGroup members={issueAssignees} />
+                  {onUpdateIssue ? (
+                    <EditableAssigneeCell
+                      issueId={issue.id}
+                      assigneeIds={issue.assignee_ids ?? []}
+                      members={members}
+                      openId={openCell}
+                      onOpen={setOpenCell}
+                      onChange={(assignee_ids) => onUpdateIssue(issue.id, { assignee_ids })}
+                    />
+                  ) : (
+                    <WorkItemAvatarGroup members={issueAssignees} />
+                  )}
                 </Td>
                 <Td>
-                  <LabelChips labels={issueLabels} max={3} />
+                  {onUpdateIssue ? (
+                    <EditableLabelCell
+                      issueId={issue.id}
+                      labelIds={issue.label_ids ?? []}
+                      labels={labels}
+                      openId={openCell}
+                      onOpen={setOpenCell}
+                      onChange={(label_ids) => onUpdateIssue(issue.id, { label_ids })}
+                    />
+                  ) : (
+                    <LabelChips labels={issueLabels} max={3} />
+                  )}
                 </Td>
                 <Td>
-                  <DueDateCell issue={issue} state={issueState} now={now} />
+                  {onUpdateIssue ? (
+                    <DatePickerTrigger
+                      label="Due date"
+                      icon={<Calendar />}
+                      value={issue.target_date ?? ''}
+                      placeholder="—"
+                      className={
+                        isOverdue(issue.target_date, issueState?.group, now)
+                          ? 'border-(--border-danger-strong) text-(--txt-danger-primary)'
+                          : undefined
+                      }
+                      onChange={(v) => onUpdateIssue(issue.id, { target_date: v || null })}
+                    />
+                  ) : (
+                    <DueDateCell issue={issue} state={issueState} now={now} />
+                  )}
+                </Td>
+                <Td className="text-[11px] text-(--txt-secondary)">
+                  {onUpdateIssue ? (
+                    <DatePickerTrigger
+                      label="Start date"
+                      icon={<Calendar />}
+                      value={issue.start_date ?? ''}
+                      placeholder="—"
+                      onChange={(v) => onUpdateIssue(issue.id, { start_date: v || null })}
+                    />
+                  ) : (
+                    (startStr ?? '—')
+                  )}
                 </Td>
-                <Td className="text-[11px] text-(--txt-secondary)">{startStr ?? '—'}</Td>
               </tr>
             );
           })}
diff --git a/apps/web/src/components/work-item/layouts/IssueLayoutTypes.ts b/apps/web/src/components/work-item/layouts/IssueLayoutTypes.ts
index 1323bf9..727cae9 100644
--- a/apps/web/src/components/work-item/layouts/IssueLayoutTypes.ts
+++ b/apps/web/src/components/work-item/layouts/IssueLayoutTypes.ts
@@ -6,6 +6,7 @@ import type {
   StateApiResponse,
   WorkspaceMemberApiResponse,
 } from '../../../api/types';
+import type { Priority } from '../../../types';
 
 /** Available layout keys. */
 export const ISSUE_LAYOUTS = ['list', 'board', 'spreadsheet', 'calendar', 'gantt'] as const;
@@ -61,6 +62,22 @@ export interface IssueLayoutProps {
    * When omitted, the board is not draggable.
    */
   onCardMove?: (issueId: string, targetStateId: string) => void;
+  /**
+   * Optional inline-edit callback. When provided, property cells (state,
+   * priority, assignees, labels, dates) become editable in place and persist
+   * via this handler; when omitted the cells stay read-only.
+   */
+  onUpdateIssue?: (issueId: string, patch: IssueInlinePatch) => void;
+}
+
+/** Fields editable inline from a layout cell. */
+export interface IssueInlinePatch {
+  state_id?: string | null;
+  priority?: Priority;
+  assignee_ids?: string[];
+  label_ids?: string[];
+  start_date?: string | null;
+  target_date?: string | null;
 }
 
 /** Canonical state groups, in board column order. */
diff --git a/apps/web/src/lib/issueRowHelpers.ts b/apps/web/src/lib/issueRowHelpers.ts
index da9f71a..1b2171f 100644
--- a/apps/web/src/lib/issueRowHelpers.ts
+++ b/apps/web/src/lib/issueRowHelpers.ts
@@ -25,3 +25,23 @@ export function membersFromAssigneeIds(
   }
   return out;
 }
+
+/**
+ * True when `targetDate` is in the past (older than ~1 day) and the issue isn't
+ * already completed/cancelled. Shared so editable date cells reuse the same
+ * overdue cue the read-only DueDateCell shows. `now` is passed in for purity.
+ */
+export function isOverdue(
+  targetDate: string | null | undefined,
+  stateGroup: string | undefined,
+  now: number,
+): boolean {
+  if (!targetDate) return false;
+  const t = Date.parse(targetDate);
+  if (Number.isNaN(t)) return false;
+  // Accept both spellings of the cancelled group (the API uses "canceled").
+  if (stateGroup === 'completed' || stateGroup === 'cancelled' || stateGroup === 'canceled') {
+    return false;
+  }
+  return t < now - 24 * 3600 * 1000;
+}
diff --git a/apps/web/src/pages/IssueListPage.tsx b/apps/web/src/pages/IssueListPage.tsx
index 015348a..54320e7 100644
--- a/apps/web/src/pages/IssueListPage.tsx
+++ b/apps/web/src/pages/IssueListPage.tsx
@@ -16,6 +16,7 @@ import { IssueLayoutSpreadsheet } from '../components/work-item/layouts/IssueLay
 import { IssueLayoutCalendar } from '../components/work-item/layouts/IssueLayoutCalendar';
 import { IssueLayoutGantt } from '../components/work-item/layouts/IssueLayoutGantt';
 import { parseIssueLayout } from '../components/work-item/layouts/IssueLayoutTypes';
+import type { IssueInlinePatch } from '../components/work-item/layouts/IssueLayoutTypes';
 import type {
   WorkspaceApiResponse,
   ProjectApiResponse,
@@ -112,15 +113,19 @@ export function IssueListPage() {
   );
   // Chains reorder saves so rapid drags commit in order (see handleReorder).
   const reorderChain = useRef<Promise<unknown>>(Promise.resolve());
-  // Per-issue serialization for board drag-to-column: chain PATCHes so rapid
-  // drags of the same card commit in order, and a sequence token so only the
-  // latest move's failure triggers a refetch.
-  const cardMoveChains = useRef<Map<string, Promise<void>>>(new Map());
-  const cardMoveSeq = useRef<Map<string, number>>(new Map());
-  // Latest route key, so a late drag-failure refetch can be discarded if the
-  // user has since navigated to a different project.
+  // Per-issue serialization for inline edits + board drag-to-column: chain
+  // PATCHes so rapid updates to the same issue commit in order, and a sequence
+  // token so only the latest update's failure triggers a refetch.
+  const issueUpdateChains = useRef<Map<string, Promise<void>>>(new Map());
+  const issueUpdateSeq = useRef<Map<string, number>>(new Map());
+  // Set when any chained update for an issue fails, so the latest update
+  // reconciles local state with the server even if it itself succeeded.
+  const issueReconcileNeeded = useRef<Map<string, boolean>>(new Map());
+  // Latest route key, so a late update-failure reconcile can be discarded if the
+  // user has since navigated to a different project. Updated in a layout effect
+  // (synchronous, pre-paint) so the guard isn't stale during a route change.
   const routeKeyRef = useRef('');
-  useEffect(() => {
+  useLayoutEffect(() => {
     routeKeyRef.current = `${workspaceSlug ?? ''}/${projectId ?? ''}`;
   }, [workspaceSlug, projectId]);
   useDocumentTitle('Work items');
@@ -598,36 +603,57 @@ export function IssueListPage() {
 
   const reorderEnabled = listDisplay.orderBy === 'manual';
 
-  // Board drag-to-column: optimistically move the card's state, then persist.
-  // PATCHes for the same card are chained (commit in order); only the latest
-  // move's failure refetches, so a stale older request can't clobber a newer one.
-  const handleCardMove = (issueId: string, targetStateId: string) => {
+  // Optimistically apply `patch` to an issue, then persist. PATCHes for the same
+  // issue are chained (commit in order); only the latest update's failure
+  // refetches, and only while still on the project that initiated it — so a
+  // stale older request can't clobber a newer one or a different route's list.
+  const persistIssueUpdate = (issueId: string, patch: IssueInlinePatch) => {
     if (!workspaceSlug || !projectId) return;
-    const current = issues.find((i) => i.id === issueId);
-    if (!current || current.state_id === targetStateId) return;
-    const routeKey = `${workspaceSlug}/${projectId}`;
-    const seq = (cardMoveSeq.current.get(issueId) ?? 0) + 1;
-    cardMoveSeq.current.set(issueId, seq);
-    setIssues((prev) =>
-      prev.map((i) => (i.id === issueId ? { ...i, state_id: targetStateId } : i)),
-    );
-    const prevChain = cardMoveChains.current.get(issueId) ?? Promise.resolve();
+    const slug = workspaceSlug;
+    const pid = projectId;
+    const routeKey = `${slug}/${pid}`;
+    const seq = (issueUpdateSeq.current.get(issueId) ?? 0) + 1;
+    issueUpdateSeq.current.set(issueId, seq);
+    setIssues((prev) => prev.map((i) => (i.id === issueId ? { ...i, ...patch } : i)));
+    const prevChain = issueUpdateChains.current.get(issueId) ?? Promise.resolve();
     const next = prevChain
       .catch(() => {})
-      .then(() =>
-        issueService.update(workspaceSlug, projectId, issueId, { state_id: targetStateId }),
+      .then(() => issueService.update(slug, pid, issueId, patch))
+      .then(
+        () => undefined,
+        // Record the failure rather than reverting here — a later update in the
+        // chain (possibly to a different field) must not be lost, so we let the
+        // newest update reconcile once the chain drains.
+        () => {
+          issueReconcileNeeded.current.set(issueId, true);
+        },
       )
-      .then(() => undefined)
-      .catch(() => {
-        // Skip if superseded by a newer move, or if the user navigated to a
-        // different project (the refetch would replace the new route's list).
-        if (cardMoveSeq.current.get(issueId) === seq && routeKeyRef.current === routeKey) {
-          refetchIssues();
-        }
+      .then(() => {
+        if (issueUpdateSeq.current.get(issueId) !== seq) return;
+        if (!issueReconcileNeeded.current.get(issueId)) return;
+        issueReconcileNeeded.current.delete(issueId);
+        if (routeKeyRef.current !== routeKey) return;
+        // Re-fetch just this issue so a rejected PATCH can't leave a stale
+        // optimistic value, without clobbering other issues' in-flight edits.
+        issueService
+          .get(slug, pid, issueId)
+          .then((fresh) => setIssues((prev) => prev.map((i) => (i.id === issueId ? fresh : i))))
+          .catch(() => {});
       });
-    cardMoveChains.current.set(issueId, next);
+    issueUpdateChains.current.set(issueId, next);
   };
 
+  // Board drag-to-column: move the card's state.
+  const handleCardMove = (issueId: string, targetStateId: string) => {
+    const current = issues.find((i) => i.id === issueId);
+    if (!current || current.state_id === targetStateId) return;
+    persistIssueUpdate(issueId, { state_id: targetStateId });
+  };
+
+  // Inline property edits from list/spreadsheet cells.
+  const handleInlineUpdate = (issueId: string, patch: IssueInlinePatch) =>
+    persistIssueUpdate(issueId, patch);
+
   return (
     <div className="w-full">
       <div className="flex items-center justify-between gap-4 border-b border-(--border-subtle) px-4 py-3">
@@ -749,10 +775,19 @@ export function IssueListPage() {
               moduleName={moduleName}
               selection={{ selectedIds, onToggle: toggleSelect }}
               onReorder={reorderEnabled ? handleReorder : undefined}
+              onUpdateIssue={handleInlineUpdate}
             />
           )}
-          {layout === 'board' && <IssueLayoutBoard {...layoutProps} onCardMove={handleCardMove} />}
-          {layout === 'spreadsheet' && <IssueLayoutSpreadsheet {...layoutProps} />}
+          {layout === 'board' && (
+            <IssueLayoutBoard
+              {...layoutProps}
+              onCardMove={handleCardMove}
+              onUpdateIssue={handleInlineUpdate}
+            />
+          )}
+          {layout === 'spreadsheet' && (
+            <IssueLayoutSpreadsheet {...layoutProps} onUpdateIssue={handleInlineUpdate} />
+          )}
           {layout === 'calendar' && <IssueLayoutCalendar {...layoutProps} />}
           {layout === 'gantt' && <IssueLayoutGantt {...layoutProps} />}
           {layout === 'list' && (