fix(mobile): stop the task drawer's priority/due row overflowing

On a phone the detail drawer's field grid stayed two columns, so each
field got half the viewport. Prioritet collapsed to "Ing" and the due
row — a date input plus fixed-width time and duration fields — ran off
the right edge. Below 560px the grid now stacks to one column per field
and the due row wraps.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

web/e2e/smoke.spec.js

@@ -937,7 +937,7 @@ test('en rolle kan rettes uden at fjerne personen', async ({ browser, page }) =>
 	await page.keyboard.press('Escape');
 
 	const row = page.locator('.row').filter({ hasText: 'brænde kaffe' });
-	await expect(row.getByTitle('Uddelegeret til andreas')).toBeVisible();
+	await expect(row.getByTitle('Ansvarlig: andreas')).toBeVisible();
 	// And not on a task that is nobody's.
 	await page.getByLabel('Ny opgave').fill('min egen');
 	await page.getByLabel('Ny opgave').press('Enter');

web/src/lib/components/TaskDetail.svelte

@@ -1115,5 +1115,21 @@
 			width: auto;
 			border-left: 0;
 		}
+
+		/* Two columns is half a phone each: Prioritet collapses to "Ing" and the
+		   due-row (date + fixed-width time + duration) runs off the right edge. One
+		   column per field gives each its full width; the due-row wraps if even that
+		   is not enough. */
+		.grid {
+			grid-template-columns: 1fr;
+		}
+
+		.due {
+			flex-wrap: wrap;
+		}
+
+		.due input[type='date'] {
+			flex: 1 1 100%;
+		}
 	}
 </style>

web/src/lib/components/TaskRow.svelte

@@ -113,14 +113,8 @@
 				{#if assignee}
 					<!-- First in the row, because "who" changes what the rest of the line
 					     means: a date on somebody else's task is their deadline, not
-					     yours. The hand-off arrow marks it as delegated — out of your
-					     hands and into theirs — so a list reads at a glance as which are
-					     yours to do and which you are waiting on. -->
-					<span class="assignee" title={t('task.delegatedTo', { name: assignee.name })}>
-						<svg class="handoff" viewBox="0 0 24 24" aria-hidden="true">
-							<path d="M13 5l7 7-7 7" />
-							<path d="M20 12H4" />
-						</svg>
+					     yours. -->
+					<span class="assignee" title={t('task.assignee', { name: assignee.name })}>
 						<span class="face" style="background: {assignee.avatar_color}">
 							{assignee.name[0]?.toUpperCase() ?? '?'}
 						</span>
@@ -364,25 +358,8 @@
 	.assignee {
 		display: inline-flex;
 		align-items: center;
-		gap: 4px;
+		gap: var(--s1);
 		color: var(--ink-muted);
-		background: var(--surface-raised);
-		border: 1px solid var(--line);
-		border-radius: var(--radius-full);
-		padding: 1px var(--s2) 1px 4px;
-	}
-
-	/* The delegation mark: an arrow leaving, in the accent so the chip reads as
-	   handed-off rather than as just another name. */
-	.handoff {
-		width: 12px;
-		height: 12px;
-		fill: none;
-		stroke: var(--accent);
-		stroke-width: 2;
-		stroke-linecap: round;
-		stroke-linejoin: round;
-		flex: none;
 	}
 
 	.face {

web/src/lib/locales/da.js

@@ -188,7 +188,6 @@ export const da = {
 	'repeat.everyN.month': 'hver {n}. måned',
 	'repeat.everyN.year': 'hvert {n}. år',
 	'task.assignee': 'Ansvarlig: {name}',
-	'task.delegatedTo': 'Uddelegeret til {name}',
 	'task.subtasks': '{done} af {total} undertasks er lukket',
 	'task.attachments': '{n} vedhæftet',
 	'task.priority': 'Prioritet {n}',

web/src/lib/locales/en.js

@@ -184,7 +184,6 @@ export const en = {
 	'repeat.everyN.month': 'every {n} months',
 	'repeat.everyN.year': 'every {n} years',
 	'task.assignee': 'Assigned to {name}',
-	'task.delegatedTo': 'Delegated to {name}',
 	'task.subtasks': '{done} of {total} sub-tasks are done',
 	'task.attachments': '{n} attached',
 	'task.priority': 'Priority {n}',