diff --git a/frontend/src/components/tasks/TaskLinkPill.tsx b/frontend/src/components/tasks/TaskLinkPill.tsx
index 49b988a3..60752708 100644
--- a/frontend/src/components/tasks/TaskLinkPill.tsx
+++ b/frontend/src/components/tasks/TaskLinkPill.tsx
@@ -41,6 +41,13 @@ const priorityLabels: Record<TaskPriority, string> = {
   critical: "Критический",
 };
 
+const priorityTitleShiftClasses: Record<TaskPriority, string> = {
+  low: "group-hover/task-pill:translate-x-10 group-focus-visible/task-pill:translate-x-10",
+  medium: "group-hover/task-pill:translate-x-12 group-focus-visible/task-pill:translate-x-12",
+  high: "group-hover/task-pill:translate-x-12 group-focus-visible/task-pill:translate-x-12",
+  critical: "group-hover/task-pill:translate-x-16 group-focus-visible/task-pill:translate-x-16",
+};
+
 function normalizeHexColor(value?: string | null): string {
   const color = String(value || "").trim();
   if (/^#[0-9a-f]{6}$/i.test(color)) return color;
@@ -77,11 +84,10 @@ export default function TaskLinkPill({
   const priority = task.priority || "medium";
   const priorityColor = priorityColors[priority];
   const priorityLabel = task.priority_display || priorityLabels[priority];
+  const priorityTitleShiftClass = priorityTitleShiftClasses[priority];
   const textColor = getReadableTextColor(columnColor);
   const isOnAccent = tone === "onAccent";
-  const title = `${task.board_name ? `${task.board_name}: ` : ""}${task.title}${
-    task.priority_display ? `, ${task.priority_display}` : ""
-  }`;
+  const title = `${task.board_name ? `${task.board_name}: ` : ""}${task.title}, ${priorityLabel}`;
   const style: CSSProperties = {
     backgroundColor: columnColor,
     boxShadow: isOnAccent ? "inset 0 1px 0 rgba(255, 255, 255, 0.18)" : undefined,
@@ -89,26 +95,29 @@ export default function TaskLinkPill({
   };
   const href = `/tasks?board=${task.board_id}&task=${task.id}`;
   const canOpen = task.can_open !== false;
-  const pillClassName = `group/task-pill inline-flex max-w-full items-center gap-1.5 rounded-full px-2 py-1 text-[11px] font-medium shadow-sm transition ${
+  const pillClassName = `group/task-pill inline-flex min-w-0 max-w-full items-center gap-1.5 overflow-hidden rounded-full px-2 py-1 text-[11px] font-medium shadow-sm transition ${
     canOpen
       ? "hover:brightness-110 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white/45"
       : "cursor-pointer hover:brightness-105 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-white/45"
   } ${className}`;
   const content = (
     <>
-      <span
-        className="inline-flex h-2.5 min-w-2.5 max-w-2.5 shrink-0 items-center justify-center overflow-hidden rounded-full border transition-[height,max-width,padding] duration-200 ease-out group-hover/task-pill:h-4 group-hover/task-pill:max-w-24 group-hover/task-pill:px-1.5 group-focus-visible/task-pill:h-4 group-focus-visible/task-pill:max-w-24 group-focus-visible/task-pill:px-1.5"
-        style={{
-          backgroundColor: priorityColor,
-          borderColor: textColor,
-        }}
-        aria-hidden="true"
-      >
-        <span className="max-w-0 whitespace-nowrap text-[9px] font-semibold leading-none text-white opacity-0 transition-[max-width,opacity] duration-200 ease-out group-hover/task-pill:max-w-20 group-hover/task-pill:opacity-100 group-focus-visible/task-pill:max-w-20 group-focus-visible/task-pill:opacity-100">
-          {priorityLabel}
+      <span className="relative h-4 w-2.5 shrink-0" aria-hidden="true">
+        <span
+          className="absolute left-0 top-1/2 z-10 inline-flex h-2.5 min-w-2.5 max-w-2.5 -translate-y-1/2 items-center justify-center overflow-hidden rounded-full border transition-[height,max-width,padding] duration-200 ease-out group-hover/task-pill:h-4 group-hover/task-pill:max-w-24 group-hover/task-pill:px-1.5 group-focus-visible/task-pill:h-4 group-focus-visible/task-pill:max-w-24 group-focus-visible/task-pill:px-1.5"
+          style={{
+            backgroundColor: priorityColor,
+            borderColor: textColor,
+          }}
+        >
+          <span className="max-w-0 whitespace-nowrap text-[9px] font-semibold leading-none text-white opacity-0 transition-[max-width,opacity] duration-200 ease-out group-hover/task-pill:max-w-20 group-hover/task-pill:opacity-100 group-focus-visible/task-pill:max-w-20 group-focus-visible/task-pill:opacity-100">
+            {priorityLabel}
+          </span>
         </span>
       </span>
-      <span className={`${maxTitleClassName} truncate`}>{task.title}</span>
+      <span className={`${maxTitleClassName} min-w-0 truncate transition-transform duration-200 ease-out ${priorityTitleShiftClass}`}>
+        {task.title}
+      </span>
     </>
   );