diff --git a/web/src/app/page.tsx b/web/src/app/page.tsx
index eb539e5..8264733 100644
--- a/web/src/app/page.tsx
+++ b/web/src/app/page.tsx
@@ -882,132 +882,143 @@ function TicketWorkbenchContent() {
               </div>
             ) : (
               <>
-                {/* Column header */}
-                <div className={cn(
-                  "sticky top-0 z-10 flex border-b border-border bg-muted/50",
-                  density === "compact" ? "min-h-7" : "min-h-8"
-                )}>
-                  <div className="w-9 shrink-0" />
-                  {availableColumns.filter((c) => c.visible).map((col) => (
-                    <div
-                      key={col.key}
-                      className="relative flex shrink-0 items-center gap-1 border-r border-border/60 px-3 last:border-r-0"
-                      style={{ width: col.key === "subject" ? undefined : col.width, flex: col.key === "subject" ? 1 : undefined, minWidth: col.key === "subject" ? 200 : undefined }}
-                    >
-                      <span className="text-[11px] font-semibold uppercase text-muted-foreground truncate">
-                        {col.label}
-                      </span>
-                      {/* Resize handle */}
+                {/* Table layout for consistent column alignment */}
+                <div style={{ display: "table", width: "100%" }}>
+                  {/* Column header */}
+                  <div className={cn(
+                    "sticky top-0 z-10 border-b border-border bg-muted/50",
+                    density === "compact" ? "min-h-7" : "min-h-8"
+                  )} style={{ display: "table-row" }}>
+                    <div style={{ display: "table-cell", width: 36 }} />
+                    {availableColumns.filter((c) => c.visible).map((col) => (
                       <div
-                        className="absolute right-0 top-0 h-full w-1 cursor-col-resize hover:bg-primary/40"
-                        onMouseDown={(e) => handleColumnResize(col.key, e)}
-                      />
-                    </div>
-                  ))}
-                  <div className="w-12 shrink-0" />
-                </div>
-
-                {filteredTickets.map((ticket) => {
-                  const selected = ticket.id === selectedId;
-                  const ownerName = ticket.owner_id
-                    ? users.find((u) => u.id === ticket.owner_id)?.username ?? "assigned"
-                    : null;
-
-                  return (
-                    <button
-                      key={ticket.id}
-                      type="button"
-                      onClick={() => setSelectedId(ticket.id)}
-                      onDoubleClick={() => router.push(`/tickets/${ticket.id}`)}
-                      className={cn(
-                        "flex items-center border-b border-border/80 text-left transition-colors",
-                        density === "compact" ? "min-h-9" : "min-h-12",
-                        selected
-                          ? "bg-accent/80 shadow-[inset_3px_0_0_var(--primary)]"
-                          : "hover:bg-accent/45"
-                      )}
-                    >
-                      {/* Checkbox */}
-                      <span className="flex w-9 shrink-0 items-center justify-center" onClick={(e) => e.stopPropagation()}>
-                        <input
-                          type="checkbox"
-                          checked={batchIds.has(ticket.id)}
-                          onChange={() => toggleBatchId(ticket.id)}
-                          className="h-3.5 w-3.5 rounded border-border accent-primary"
+                        key={col.key}
+                        className="relative border-r border-border/60 px-3 align-middle last:border-r-0"
+                        style={{ display: "table-cell", width: col.key === "subject" ? undefined : col.width }}
+                      >
+                        <span className="text-[10px] font-semibold uppercase text-muted-foreground/60 truncate block">
+                          {col.label}
+                        </span>
+                        <div
+                          className="absolute right-0 top-0 h-full w-1 cursor-col-resize hover:bg-primary/40"
+                          onMouseDown={(e) => handleColumnResize(col.key, e)}
                         />
-                      </span>
-                      {availableColumns.filter((c) => c.visible).map((col) => {
-                        if (col.key.startsWith("cf.")) {
-                          const cfKey = col.key.slice(3);
-                          const cfValue = ticket.custom_fields?.find((v) => v.custom_field?.key === cfKey || v.custom_field?.name === cfKey)?.value;
-                          return (
-                            <span key={col.key} className="shrink-0 truncate px-3 text-sm text-foreground" style={{ width: col.width }}>
-                              {cfValue ?? "—"}
-                            </span>
-                          );
-                        }
-                        switch (col.key) {
-                          case "id":
+                      </div>
+                    ))}
+                    <div style={{ display: "table-cell", width: 48 }} />
+                  </div>
+
+                  {filteredTickets.map((ticket) => {
+                    const selected = ticket.id === selectedId;
+                    const ownerName = ticket.owner_id
+                      ? users.find((u) => u.id === ticket.owner_id)?.username ?? "assigned"
+                      : null;
+
+                    return (
+                      <div
+                        key={ticket.id}
+                        role="button"
+                        tabIndex={0}
+                        onClick={() => setSelectedId(ticket.id)}
+                        onDoubleClick={() => router.push(`/tickets/${ticket.id}`)}
+                        onKeyDown={(e) => { if (e.key === "Enter") router.push(`/tickets/${ticket.id}`); }}
+                        className={cn(
+                          "cursor-pointer border-b border-border/80",
+                          density === "compact" ? "" : "",
+                          selected
+                            ? "bg-accent/80 shadow-[inset_3px_0_0_var(--primary)]"
+                            : "hover:bg-accent/45"
+                        )}
+                        style={{ display: "table-row" }}
+                      >
+                        <div className="flex items-center justify-center" style={{ display: "table-cell", width: 36, verticalAlign: "middle" }} onClick={(e) => e.stopPropagation()}>
+                          <input
+                            type="checkbox"
+                            checked={batchIds.has(ticket.id)}
+                            onChange={() => toggleBatchId(ticket.id)}
+                            className="h-3.5 w-3.5 rounded border-border accent-primary"
+                          />
+                        </div>
+                        {availableColumns.filter((c) => c.visible).map((col) => {
+                          const cellStyle = {
+                            display: "table-cell" as const,
+                            width: col.key === "subject" ? undefined : col.width,
+                            verticalAlign: "middle" as const,
+                            padding: density === "compact" ? "4px 12px" : "8px 12px",
+                          };
+
+                          if (col.key.startsWith("cf.")) {
+                            const cfKey = col.key.slice(3);
+                            const cfValue = ticket.custom_fields?.find((v) => v.custom_field?.key === cfKey || v.custom_field?.name === cfKey)?.value;
                             return (
-                              <span key={col.key} className="shrink-0 px-3 font-mono text-xs font-semibold text-muted-foreground" style={{ width: col.width }}>
-                                {formatTicketId(ticket.id)}
-                              </span>
+                              <div key={col.key} className="truncate text-sm text-foreground" style={cellStyle}>
+                                {cfValue ?? "—"}
+                              </div>
                             );
-                          case "subject":
-                            return (
-                              <span key={col.key} className="min-w-0 flex-1 px-3" style={{ minWidth: 200 }}>
-                                <span className="block truncate text-sm font-semibold text-foreground">
-                                  {ticket.subject}
-                                </span>
-                                {density === "comfortable" && (
-                                  <span className="mt-0.5 flex items-center gap-2 text-xs text-muted-foreground">
-                                    {ownerName ?? "Unassigned"}
-                                    <span className="h-1 w-1 rounded-full bg-border" />
-                                    Created {relativeTime(ticket.created_at)}
+                          }
+                          switch (col.key) {
+                            case "id":
+                              return (
+                                <div key={col.key} className="font-mono text-xs font-semibold text-muted-foreground" style={cellStyle}>
+                                  {formatTicketId(ticket.id)}
+                                </div>
+                              );
+                            case "subject":
+                              return (
+                                <div key={col.key} className="min-w-[200px]" style={cellStyle}>
+                                  <span className="block truncate text-sm font-semibold text-foreground">
+                                    {ticket.subject}
                                   </span>
-                                )}
-                              </span>
-                            );
-                          case "status":
-                            return (
-                              <span key={col.key} className="shrink-0 px-3" style={{ width: col.width }}>
-                                <TicketStatusBadge status={ticket.status} />
-                              </span>
-                            );
-                          case "queue":
-                            return (
-                              <span key={col.key} className="shrink-0 truncate px-3 text-sm font-medium text-muted-foreground" style={{ width: col.width }}>
-                                {queueName(queues, ticket.queue_id)}
-                              </span>
-                            );
-                          case "owner":
-                            return (
-                              <span key={col.key} className="shrink-0 truncate px-3 text-sm text-foreground" style={{ width: col.width }}>
-                                {ownerName ?? "—"}
-                              </span>
-                            );
-                          case "created":
-                            return (
-                              <span key={col.key} className="shrink-0 px-3 text-xs text-muted-foreground" style={{ width: col.width }}>
-                                {relativeTime(ticket.created_at)}
-                              </span>
-                            );
-                          case "updated":
-                            return (
-                              <span key={col.key} className="shrink-0 px-3 text-xs text-muted-foreground" style={{ width: col.width }}>
-                                {relativeTime(ticket.updated_at)}
-                              </span>
-                            );
-                          default:
-                            return <span key={col.key} className="shrink-0 px-3" style={{ width: col.width }} />;
-                        }
-                      })}
-                      <span className="flex w-12 shrink-0 justify-end px-2 text-muted-foreground">
-                        <ChevronRightIcon className="h-4 w-4" />
-                      </span>
-                    </button>
-                  );
-                })}
+                                  {density === "comfortable" && (
+                                    <span className="mt-0.5 flex items-center gap-2 text-xs text-muted-foreground">
+                                      {ownerName ?? "Unassigned"}
+                                      <span className="h-1 w-1 rounded-full bg-border" />
+                                      Created {relativeTime(ticket.created_at)}
+                                    </span>
+                                  )}
+                                </div>
+                              );
+                            case "status":
+                              return (
+                                <div key={col.key} style={cellStyle}>
+                                  <TicketStatusBadge status={ticket.status} />
+                                </div>
+                              );
+                            case "queue":
+                              return (
+                                <div key={col.key} className="truncate text-sm font-medium text-muted-foreground" style={cellStyle}>
+                                  {queueName(queues, ticket.queue_id)}
+                                </div>
+                              );
+                            case "owner":
+                              return (
+                                <div key={col.key} className="truncate text-sm text-foreground" style={cellStyle}>
+                                  {ownerName ?? "—"}
+                                </div>
+                              );
+                            case "created":
+                              return (
+                                <div key={col.key} className="text-xs text-muted-foreground" style={cellStyle}>
+                                  {relativeTime(ticket.created_at)}
+                                </div>
+                              );
+                            case "updated":
+                              return (
+                                <div key={col.key} className="text-xs text-muted-foreground" style={cellStyle}>
+                                  {relativeTime(ticket.updated_at)}
+                                </div>
+                              );
+                            default:
+                              return <div key={col.key} style={cellStyle} />;
+                          }
+                        })}
+                        <div className="flex justify-end px-2 text-muted-foreground" style={{ display: "table-cell", width: 48, verticalAlign: "middle" }}>
+                          <ChevronRightIcon className="h-4 w-4" />
+                        </div>
+                      </div>
+                    );
+                  })}
+                </div>
               </>
             )}
           </div>