diff --git a/components/work-review/WorkReviewAnnotationMarker.tsx b/components/work-review/WorkReviewAnnotationMarker.tsx
index 66a9d44..61cc350 100644
--- a/components/work-review/WorkReviewAnnotationMarker.tsx
+++ b/components/work-review/WorkReviewAnnotationMarker.tsx
@@ -124,7 +124,7 @@ export function WorkReviewAnnotationMarker({
           {item.markerNumber}
         </span>
         <span
-          className={`pointer-events-none absolute -top-0.5 w-max max-w-[min(14rem,calc(100vw-3rem))] whitespace-normal break-words rounded-lg bg-[#101828]/90 px-3 py-2 text-left text-[11px] font-semibold leading-[1.45] text-white shadow-[0_4px_14px_rgba(15,23,42,0.24)] [overflow-wrap:anywhere] ${showComment ? 'block' : 'hidden'} ${commentPosition(minX)}`}
+          className={`pointer-events-none absolute -top-0.5 w-max max-w-[min(10rem,calc(100vw-3rem))] whitespace-normal break-words rounded-lg bg-[#101828]/90 px-3 py-2 text-left text-[11px] font-semibold leading-[1.45] text-white shadow-[0_4px_14px_rgba(15,23,42,0.24)] [overflow-wrap:anywhere] sm:max-w-[min(14rem,calc(100vw-3rem))] ${showComment ? 'block' : 'hidden'} ${commentPosition(minX)}`}
           aria-hidden={!showComment}
         >
           {summary}
@@ -151,7 +151,7 @@ export function WorkReviewAnnotationMarker({
         {item.markerNumber}
       </span>
       <span
-        className={`pointer-events-none absolute top-1/2 w-max max-w-[min(14rem,calc(100vw-3rem))] -translate-y-1/2 whitespace-normal break-words rounded-lg bg-[#101828]/90 px-3 py-2 text-left text-[11px] font-semibold leading-[1.45] text-white shadow-[0_4px_14px_rgba(15,23,42,0.24)] [overflow-wrap:anywhere] ${
+        className={`pointer-events-none absolute top-1/2 w-max max-w-[min(10rem,calc(100vw-3rem))] -translate-y-1/2 whitespace-normal break-words rounded-lg bg-[#101828]/90 px-3 py-2 text-left text-[11px] font-semibold leading-[1.45] text-white shadow-[0_4px_14px_rgba(15,23,42,0.24)] [overflow-wrap:anywhere] sm:max-w-[min(14rem,calc(100vw-3rem))] ${
           showComment ? 'block' : 'hidden'
         } ${
           alignRight ? 'right-9' : 'left-9'
diff --git a/lib/__tests__/work-review-annotation-marker.test.tsx b/lib/__tests__/work-review-annotation-marker.test.tsx
index d794939..4a1be9f 100644
--- a/lib/__tests__/work-review-annotation-marker.test.tsx
+++ b/lib/__tests__/work-review-annotation-marker.test.tsx
@@ -26,7 +26,13 @@ describe('WorkReviewAnnotationMarker', () => {
     )
 
     const visibleComment = screen.getByText(longComment)
-    expect(visibleComment).toHaveClass('whitespace-normal', 'break-words', '[overflow-wrap:anywhere]')
+    expect(visibleComment).toHaveClass(
+      'whitespace-normal',
+      'break-words',
+      'max-w-[min(10rem,calc(100vw-3rem))]',
+      'sm:max-w-[min(14rem,calc(100vw-3rem))]',
+      '[overflow-wrap:anywhere]',
+    )
     expect(visibleComment).not.toHaveClass('truncate')
   })
 })