diff --git a/frontend/src/lib/geschichte/JourneyItemCard.svelte b/frontend/src/lib/geschichte/JourneyItemCard.svelte
index dff6b316..534aaa8a 100644
--- a/frontend/src/lib/geschichte/JourneyItemCard.svelte
+++ b/frontend/src/lib/geschichte/JourneyItemCard.svelte
@@ -58,7 +58,7 @@ const hasNote = $derived(item.note != null && item.note.trim().length > 0);
 		</a>
 		{#if hasNote}
 			<!-- plaintext — do NOT use {@html} here -->
-			<div class="border-mint mt-3 rounded-r-sm border-l-2 bg-surface py-1.5 pr-2 pl-3">
+			<div class="mt-3 rounded-r-sm border-l-2 border-brand-mint bg-surface py-1.5 pr-2 pl-3">
 				<p class="text-xs leading-relaxed text-ink-2 italic">{item.note}</p>
 			</div>
 		{/if}
diff --git a/frontend/src/lib/geschichte/JourneyItemCard.svelte.spec.ts b/frontend/src/lib/geschichte/JourneyItemCard.svelte.spec.ts
index 39e19681..a3901521 100644
--- a/frontend/src/lib/geschichte/JourneyItemCard.svelte.spec.ts
+++ b/frontend/src/lib/geschichte/JourneyItemCard.svelte.spec.ts
@@ -110,6 +110,14 @@ describe('JourneyItemCard', () => {
 		await expect.element(page.getByText('Ein wichtiger Brief')).toBeVisible();
 	});
 
+	it('annotation block uses the brand mint accent border (#798)', async () => {
+		render(JourneyItemCard, { props: { item: baseItem({ note: 'Ein wichtiger Brief' }) } });
+
+		const note = document.querySelector('[class*="border-l-2"]');
+		expect(note).not.toBeNull();
+		expect(note!.className).toContain('border-brand-mint');
+	});
+
 	it('omits annotation block when note is blank or whitespace', async () => {
 		render(JourneyItemCard, { props: { item: baseItem({ note: '   ' }) } });