diff --git a/packages/kanban/src/ui/ui.css.ts b/packages/kanban/src/ui/ui.css.ts
index 3247c63..e2ce444 100644
--- a/packages/kanban/src/ui/ui.css.ts
+++ b/packages/kanban/src/ui/ui.css.ts
@@ -1,4 +1,4 @@
-import { style } from "@vanilla-extract/css";
+import { globalStyle, style } from "@vanilla-extract/css";
 import { vars } from "@exosphere/client/theme.css";
 
 // ---- Board layout ----
@@ -51,25 +51,11 @@ export const columnCount = style({
 
 // ---- Task card (compact, in column) ----
 
-export const taskCard = style({
-  display: "block",
-  paddingBlock: vars.space.sm,
-  paddingInline: vars.space.md,
-  borderRadius: vars.radius.sm,
-  border: `1px solid ${vars.color.border}`,
-  backgroundColor: vars.color.surface,
-  textDecoration: "none",
-  color: vars.color.text,
-  transition: "border-color 0.15s",
-  ":hover": {
-    borderColor: vars.color.primary,
-  },
-});
-
 export const taskNumber = style({
   fontSize: "0.8125rem",
   color: vars.color.textMuted,
   fontWeight: 500,
+  cursor: "pointer",
 });
 
 export const taskTitle = style({
@@ -82,6 +68,28 @@ export const taskTitle = style({
   display: "-webkit-box",
   WebkitLineClamp: 2,
   WebkitBoxOrient: "vertical",
+  cursor: "pointer",
+  transition: "color 0.15s",
+});
+
+export const taskCard = style({
+  display: "block",
+  paddingBlock: vars.space.sm,
+  paddingInline: vars.space.md,
+  borderRadius: vars.radius.sm,
+  border: `1px solid ${vars.color.border}`,
+  backgroundColor: vars.color.surface,
+  textDecoration: "none",
+  color: vars.color.text,
+  transition: "border-color 0.15s",
+  ":hover": {
+    borderColor: vars.color.primary,
+    textDecoration: "none",
+  },
+});
+
+globalStyle(`${taskCard}:hover .${taskTitle}`, {
+  color: vars.color.primary,
 });
 
 export const taskMeta = style({
@@ -91,6 +99,7 @@ export const taskMeta = style({
   marginBlockStart: vars.space.xs,
   fontSize: "0.75rem",
   color: vars.color.textMuted,
+  cursor: "pointer",
 });
 
 // ---- Task detail ----