fix(a11y): fix ProgressRing text label contrast and add no-restricted-syntax lint rule for text-accent

ProgressRing used text-accent (#a1dcd8) on a percentage text label — same WCAG 2.1 AA failure as #341. Switched to text-primary. Also adds ESLint no-restricted-syntax rule (scoped to *.svelte files) that blocks future text-accent usage in JavaScript string literals inside Svelte class expressions. The rule caught both violations at once; both are now fixed. The rule is scoped to .svelte files so test assertions against 'text-accent' strings in .spec.ts files are unaffected. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
fix(viewer): replace text-accent with text-primary on annotation toggle inactive state
2026-04-26 21:03:12 +02:00 · 2026-04-26 21:02:39 +02:00
29 changed files with 64 additions and 989 deletions
--- a/backend/api_tests/Transcription.http
+++ b/backend/api_tests/Transcription.http
@@ -1,3 +0,0 @@
-### Mark all blocks as reviewed
-PUT http://localhost:8080/api/documents/{{documentId}}/transcription-blocks/review-all
-Authorization: Basic admin admin123
--- a/backend/src/main/java/org/raddatz/familienarchiv/controller/TranscriptionBlockController.java
+++ b/backend/src/main/java/org/raddatz/familienarchiv/controller/TranscriptionBlockController.java
@@ -90,15 +90,6 @@ public class TranscriptionBlockController {
        return transcriptionService.reviewBlock(documentId, blockId, userId);
    }

-    @PutMapping("/review-all")
-    @RequirePermission(Permission.WRITE_ALL)
-    public List<TranscriptionBlock> markAllBlocksReviewed(
-            @PathVariable UUID documentId,
-            Authentication authentication) {
-        UUID userId = requireUserId(authentication);
-        return transcriptionService.markAllBlocksReviewed(documentId, userId);
-    }
-
    @GetMapping("/{blockId}/history")
    @RequirePermission(Permission.READ_ALL)
    public List<TranscriptionBlockVersion> getBlockHistory(
--- a/backend/src/main/java/org/raddatz/familienarchiv/service/TranscriptionService.java
+++ b/backend/src/main/java/org/raddatz/familienarchiv/service/TranscriptionService.java
@@ -205,18 +205,6 @@ public class TranscriptionService {
        return saved;
    }

-    @Transactional
-    public List<TranscriptionBlock> markAllBlocksReviewed(UUID documentId, UUID userId) {
-        List<TranscriptionBlock> blocks = blockRepository.findByDocumentIdOrderBySortOrderAsc(documentId);
-        for (TranscriptionBlock block : blocks) {
-            if (!block.isReviewed()) {
-                block.setReviewed(true);
-                auditService.logAfterCommit(AuditKind.BLOCK_REVIEWED, userId, documentId, null);
-            }
-        }
-        return blockRepository.saveAll(blocks);
-    }
-
    public List<TranscriptionBlockVersion> getBlockHistory(UUID documentId, UUID blockId) {
        getBlock(documentId, blockId);
        return versionRepository.findByBlockIdOrderByChangedAtDesc(blockId);
--- a/backend/src/test/java/org/raddatz/familienarchiv/controller/AnnotationControllerTest.java
+++ b/backend/src/test/java/org/raddatz/familienarchiv/controller/AnnotationControllerTest.java
@@ -154,13 +154,6 @@ class AnnotationControllerTest {
                .andExpect(status().isForbidden());
    }

-    @Test
-    @WithMockUser(authorities = "READ_ALL")
-    void deleteAnnotation_returns403_whenUserHasOnlyReadAllPermission() throws Exception {
-        mockMvc.perform(delete("/api/documents/" + UUID.randomUUID() + "/annotations/" + UUID.randomUUID()))
-                .andExpect(status().isForbidden());
-    }
-
    @Test
    @WithMockUser(authorities = "ANNOTATE_ALL")
    void deleteAnnotation_returns204_whenHasAnnotatePermission() throws Exception {
--- a/backend/src/test/java/org/raddatz/familienarchiv/controller/TranscriptionBlockControllerTest.java
+++ b/backend/src/test/java/org/raddatz/familienarchiv/controller/TranscriptionBlockControllerTest.java
@@ -260,13 +260,6 @@ class TranscriptionBlockControllerTest {
                .andExpect(status().isForbidden());
    }

-    @Test
-    @WithMockUser(authorities = "READ_ALL")
-    void deleteBlock_returns403_whenUserHasOnlyReadAllPermission() throws Exception {
-        mockMvc.perform(delete(URL_BLOCK))
-                .andExpect(status().isForbidden());
-    }
-
    @Test
    @WithMockUser(authorities = "WRITE_ALL")
    void deleteBlock_returns204_whenAuthorised() throws Exception {
@@ -380,63 +373,4 @@ class TranscriptionBlockControllerTest {
                .andExpect(status().isOk())
                .andExpect(jsonPath("$.reviewed").value(true));
    }
-
-    // ─── PUT .../review-all ───────────────────────────────────────────────────
-
-    private static final String URL_REVIEW_ALL = URL_BASE + "/review-all";
-
-    @Test
-    void markAllBlocksReviewed_returns401_whenUnauthenticated() throws Exception {
-        mockMvc.perform(put(URL_REVIEW_ALL))
-                .andExpect(status().isUnauthorized());
-    }
-
-    @Test
-    @WithMockUser(authorities = "READ_ALL")
-    void markAllBlocksReviewed_returns403_whenMissingWriteAllPermission() throws Exception {
-        mockMvc.perform(put(URL_REVIEW_ALL))
-                .andExpect(status().isForbidden());
-    }
-
-    @Test
-    @WithMockUser(authorities = "WRITE_ALL")
-    void markAllBlocksReviewed_returns200_withAllReviewedBlocks_whenAuthorised() throws Exception {
-        when(userService.findByEmail(any())).thenReturn(mockUser());
-        TranscriptionBlock b1 = TranscriptionBlock.builder()
-                .id(UUID.randomUUID()).documentId(DOC_ID).annotationId(UUID.randomUUID())
-                .text("Block 1").sortOrder(0).reviewed(true).build();
-        TranscriptionBlock b2 = TranscriptionBlock.builder()
-                .id(UUID.randomUUID()).documentId(DOC_ID).annotationId(UUID.randomUUID())
-                .text("Block 2").sortOrder(1).reviewed(true).build();
-        when(transcriptionService.markAllBlocksReviewed(eq(DOC_ID), any()))
-                .thenReturn(List.of(b1, b2));
-
-        mockMvc.perform(put(URL_REVIEW_ALL))
-                .andExpect(status().isOk())
-                .andExpect(jsonPath("$").isArray())
-                .andExpect(jsonPath("$[0].reviewed").value(true))
-                .andExpect(jsonPath("$[1].reviewed").value(true));
-    }
-
-    @Test
-    @WithMockUser(authorities = "WRITE_ALL")
-    void markAllBlocksReviewed_returns200_withEmptyList_whenNoBlocksExist() throws Exception {
-        when(userService.findByEmail(any())).thenReturn(mockUser());
-        when(transcriptionService.markAllBlocksReviewed(eq(DOC_ID), any()))
-                .thenReturn(List.of());
-
-        mockMvc.perform(put(URL_REVIEW_ALL))
-                .andExpect(status().isOk())
-                .andExpect(jsonPath("$").isArray())
-                .andExpect(jsonPath("$").isEmpty());
-    }
-
-    @Test
-    @WithMockUser(authorities = "WRITE_ALL")
-    void markAllBlocksReviewed_returns401_whenUserNotFoundInDatabase() throws Exception {
-        when(userService.findByEmail(any())).thenReturn(null);
-
-        mockMvc.perform(put(URL_REVIEW_ALL))
-                .andExpect(status().isUnauthorized());
-    }
 }
--- a/backend/src/test/java/org/raddatz/familienarchiv/service/TranscriptionServiceTest.java
+++ b/backend/src/test/java/org/raddatz/familienarchiv/service/TranscriptionServiceTest.java
@@ -506,86 +506,4 @@ class TranscriptionServiceTest {

        verify(auditService, never()).logAfterCommit(any(), any(), any(), any());
    }
-
-    // ─── markAllBlocksReviewed ───────────────────────────────────────────────────
-
-    @Test
-    void markAllBlocksReviewed_setsAllUnreviewedBlocksToReviewed() {
-        UUID docId = UUID.randomUUID();
-        UUID userId = UUID.randomUUID();
-        TranscriptionBlock block1 = TranscriptionBlock.builder()
-                .id(UUID.randomUUID()).documentId(docId).reviewed(false).build();
-        TranscriptionBlock block2 = TranscriptionBlock.builder()
-                .id(UUID.randomUUID()).documentId(docId).reviewed(false).build();
-        when(blockRepository.findByDocumentIdOrderBySortOrderAsc(docId))
-                .thenReturn(List.of(block1, block2));
-        when(blockRepository.saveAll(any())).thenAnswer(inv -> inv.getArgument(0));
-
-        List<TranscriptionBlock> result = transcriptionService.markAllBlocksReviewed(docId, userId);
-
-        assertThat(result).allMatch(TranscriptionBlock::isReviewed);
-        verify(blockRepository).saveAll(List.of(block1, block2));
-    }
-
-    @Test
-    void markAllBlocksReviewed_isIdempotent_whenAllBlocksAlreadyReviewed() {
-        UUID docId = UUID.randomUUID();
-        UUID userId = UUID.randomUUID();
-        TranscriptionBlock block = TranscriptionBlock.builder()
-                .id(UUID.randomUUID()).documentId(docId).reviewed(true).build();
-        when(blockRepository.findByDocumentIdOrderBySortOrderAsc(docId))
-                .thenReturn(List.of(block));
-        when(blockRepository.saveAll(any())).thenAnswer(inv -> inv.getArgument(0));
-
-        List<TranscriptionBlock> result = transcriptionService.markAllBlocksReviewed(docId, userId);
-
-        assertThat(result).allMatch(TranscriptionBlock::isReviewed);
-        verify(blockRepository).saveAll(any());
-    }
-
-    @Test
-    void markAllBlocksReviewed_emitsBlockReviewedAuditEvent_forEachUnreviewedBlock() {
-        UUID docId = UUID.randomUUID();
-        UUID userId = UUID.randomUUID();
-        TranscriptionBlock block1 = TranscriptionBlock.builder()
-                .id(UUID.randomUUID()).documentId(docId).reviewed(false).build();
-        TranscriptionBlock block2 = TranscriptionBlock.builder()
-                .id(UUID.randomUUID()).documentId(docId).reviewed(false).build();
-        when(blockRepository.findByDocumentIdOrderBySortOrderAsc(docId))
-                .thenReturn(List.of(block1, block2));
-        when(blockRepository.saveAll(any())).thenAnswer(inv -> inv.getArgument(0));
-
-        transcriptionService.markAllBlocksReviewed(docId, userId);
-
-        verify(auditService, times(2)).logAfterCommit(AuditKind.BLOCK_REVIEWED, userId, docId, null);
-    }
-
-    @Test
-    void markAllBlocksReviewed_doesNotEmitAuditEvent_forAlreadyReviewedBlocks() {
-        UUID docId = UUID.randomUUID();
-        UUID userId = UUID.randomUUID();
-        TranscriptionBlock alreadyReviewed = TranscriptionBlock.builder()
-                .id(UUID.randomUUID()).documentId(docId).reviewed(true).build();
-        TranscriptionBlock unreviewed = TranscriptionBlock.builder()
-                .id(UUID.randomUUID()).documentId(docId).reviewed(false).build();
-        when(blockRepository.findByDocumentIdOrderBySortOrderAsc(docId))
-                .thenReturn(List.of(alreadyReviewed, unreviewed));
-        when(blockRepository.saveAll(any())).thenAnswer(inv -> inv.getArgument(0));
-
-        transcriptionService.markAllBlocksReviewed(docId, userId);
-
-        verify(auditService, times(1)).logAfterCommit(AuditKind.BLOCK_REVIEWED, userId, docId, null);
-    }
-
-    @Test
-    void markAllBlocksReviewed_returnsEmptyList_whenNoBlocksExist() {
-        UUID docId = UUID.randomUUID();
-        UUID userId = UUID.randomUUID();
-        when(blockRepository.findByDocumentIdOrderBySortOrderAsc(docId)).thenReturn(List.of());
-        when(blockRepository.saveAll(any())).thenAnswer(inv -> inv.getArgument(0));
-
-        List<TranscriptionBlock> result = transcriptionService.markAllBlocksReviewed(docId, userId);
-
-        assertThat(result).isEmpty();
-    }
 }
--- a/frontend/messages/de.json
+++ b/frontend/messages/de.json
@@ -23,8 +23,6 @@
 	"nav_conversations": "Briefwechsel",
 	"nav_admin": "Admin",
 	"nav_logout": "Abmelden",
-	"theme_toggle_to_light": "Zu hellem Design wechseln",
-	"theme_toggle_to_dark": "Zu dunklem Design wechseln",
 	"btn_save": "Speichern",
 	"btn_cancel": "Abbrechen",
 	"btn_confirm": "Bestätigen",
@@ -818,7 +816,6 @@
 	"pagination_next": "Weiter",
 	"pagination_page_of": "Seite {page} von {total}",
 	"pagination_nav_label": "Seitennavigation",
-	"pagination_page_button": "Seite {page}",

 	"common_opens_new_tab": "(öffnet in neuem Tab)",

--- a/frontend/messages/en.json
+++ b/frontend/messages/en.json
@@ -23,8 +23,6 @@
 	"nav_conversations": "Letters",
 	"nav_admin": "Admin",
 	"nav_logout": "Sign out",
-	"theme_toggle_to_light": "Switch to light mode",
-	"theme_toggle_to_dark": "Switch to dark mode",
 	"btn_save": "Save",
 	"btn_cancel": "Cancel",
 	"btn_confirm": "Confirm",
@@ -818,7 +816,6 @@
 	"pagination_next": "Next",
 	"pagination_page_of": "Page {page} of {total}",
 	"pagination_nav_label": "Pagination",
-	"pagination_page_button": "Page {page}",

 	"common_opens_new_tab": "(opens in new tab)",

--- a/frontend/messages/es.json
+++ b/frontend/messages/es.json
@@ -23,8 +23,6 @@
 	"nav_conversations": "Cartas",
 	"nav_admin": "Admin",
 	"nav_logout": "Cerrar sesión",
-	"theme_toggle_to_light": "Cambiar a modo claro",
-	"theme_toggle_to_dark": "Cambiar a modo oscuro",
 	"btn_save": "Guardar",
 	"btn_cancel": "Cancelar",
 	"btn_confirm": "Confirmar",
@@ -818,7 +816,6 @@
 	"pagination_next": "Siguiente",
 	"pagination_page_of": "Página {page} de {total}",
 	"pagination_nav_label": "Paginación",
-	"pagination_page_button": "Página {page}",

 	"common_opens_new_tab": "(abre en pestaña nueva)",

--- a/frontend/src/lib/components/AnnotationLayer.svelte
+++ b/frontend/src/lib/components/AnnotationLayer.svelte
@@ -18,8 +18,7 @@ let {
 	dimmed = false,
 	flashAnnotationId = null,
 	onDraw,
-	onAnnotationClick,
-	onDeleteRequest
+	onAnnotationClick
 }: {
 	annotations: Annotation[];
 	canDraw: boolean;
@@ -30,7 +29,6 @@ let {
 	flashAnnotationId?: string | null;
 	onDraw: (rect: DrawRect) => void;
 	onAnnotationClick?: (id: string) => void;
-	onDeleteRequest?: (annotationId: string) => void;
 } = $props();

 let drawStart = $state<{ x: number; y: number } | null>(null);
@@ -114,8 +112,6 @@ const containerStyle = $derived(
 			dimmed={dimmed}
 			blockNumber={blockNumbers[annotation.id]}
 			isFlashing={flashAnnotationId === annotation.id}
-			showDelete={canDraw}
-			onDeleteRequest={() => onDeleteRequest?.(annotation.id)}
 			onclick={() => onAnnotationClick?.(annotation.id)}
 			onpointerenter={() => (hoveredId = annotation.id)}
 			onpointerleave={() => (hoveredId = null)}
--- a/frontend/src/lib/components/AnnotationLayer.svelte.spec.ts
+++ b/frontend/src/lib/components/AnnotationLayer.svelte.spec.ts
@@ -98,7 +98,7 @@ describe('AnnotationLayer', () => {
 		expect(el2.style.opacity).toBe('1');
 	});

-	it('does not show delete button when annotation is not hovered or active', async () => {
+	it('does not show delete buttons (annotations owned by blocks)', async () => {
 		render(AnnotationLayer, {
 			annotations: [makeAnnotation('ann-1')],
 			canDraw: true,
@@ -107,19 +107,6 @@ describe('AnnotationLayer', () => {
 		});

 		await expect.element(page.getByTestId('annotation-ann-1')).toBeInTheDocument();
-		expect(page.getByTestId('annotation-delete-ann-1').query()).toBeNull();
-	});
-
-	it('does not show delete button when canDraw is false even if annotation is active', async () => {
-		render(AnnotationLayer, {
-			annotations: [makeAnnotation('ann-1')],
-			canDraw: false,
-			color: '#00C7B1',
-			activeAnnotationId: 'ann-1',
-			onDraw: () => {}
-		});
-
-		await expect.element(page.getByTestId('annotation-ann-1')).toBeInTheDocument();
-		expect(page.getByTestId('annotation-delete-ann-1').query()).toBeNull();
+		expect(page.getByRole('button', { name: /löschen/i }).query()).toBeNull();
 	});
 });
--- a/frontend/src/lib/components/AnnotationShape.svelte
+++ b/frontend/src/lib/components/AnnotationShape.svelte
@@ -11,8 +11,6 @@ let {
 	blockNumber = undefined,
 	isFlashing = false,
 	isResizable = false,
-	showDelete = false,
-	onDeleteRequest,
 	onclick,
 	onpointerenter,
 	onpointerleave
@@ -25,15 +23,11 @@ let {
 	blockNumber?: number | undefined;
 	isFlashing?: boolean;
 	isResizable?: boolean;
-	showDelete?: boolean;
-	onDeleteRequest?: () => void;
 	onclick: () => void;
 	onpointerenter: () => void;
 	onpointerleave: () => void;
 } = $props();

-const deleteVisible = $derived(showDelete && (isHovered || isActive));
-
 function hexToRgba(hex: string, alpha: number): string {
 	const r = parseInt(hex.slice(1, 3), 16);
 	const g = parseInt(hex.slice(3, 5), 16);
@@ -89,7 +83,6 @@ let shapeStyle = $derived(
 	onclick={onclick}
 	onkeydown={(e) => {
 		if (e.key === 'Enter' || e.key === ' ') onclick();
-		if (e.key === 'Delete' && showDelete) onDeleteRequest?.();
 	}}
 	onpointerenter={onpointerenter}
 	onpointerleave={onpointerleave}
@@ -119,51 +112,6 @@ let shapeStyle = $derived(
 			{blockNumber}
 		</div>
 	{/if}
-	{#if deleteVisible}
-		<button
-			data-testid="annotation-delete-{annotation.id}"
-			type="button"
-			aria-label="Löschen"
-			onclick={(e) => {
-				e.stopPropagation();
-				onDeleteRequest?.();
-			}}
-			style="
-				position: absolute;
-				top: 4px;
-				right: 4px;
-				min-width: 44px;
-				min-height: 44px;
-				display: flex;
-				align-items: center;
-				justify-content: center;
-				border-radius: 50%;
-				background-color: #fff;
-				border: 1px solid var(--color-error, #e53e3e);
-				color: var(--color-error, #e53e3e);
-				cursor: pointer;
-				pointer-events: auto;
-				box-shadow: 0 1px 4px rgba(0,0,0,0.2);
-				z-index: 10;
-			"
-		>
-			<svg
-				width="16"
-				height="16"
-				viewBox="0 0 24 24"
-				fill="none"
-				stroke="currentColor"
-				stroke-width="1.5"
-				aria-hidden="true"
-			>
-				<path
-					stroke-linecap="round"
-					stroke-linejoin="round"
-					d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16"
-				/>
-			</svg>
-		</button>
-	{/if}
 	{#if isResizable}
 		<AnnotationEditOverlay annotation={annotation} />
 	{/if}
--- a/frontend/src/lib/components/AnnotationShape.svelte.spec.ts
+++ b/frontend/src/lib/components/AnnotationShape.svelte.spec.ts
@@ -1,177 +0,0 @@
-import { describe, it, expect, vi, afterEach } from 'vitest';
-import { cleanup, render } from 'vitest-browser-svelte';
-import { page } from 'vitest/browser';
-import AnnotationShape from './AnnotationShape.svelte';
-
-afterEach(cleanup);
-
-function makeAnnotation(id = 'ann-1') {
-	return {
-		id,
-		documentId: 'doc-1',
-		pageNumber: 1,
-		x: 0.1,
-		y: 0.1,
-		width: 0.3,
-		height: 0.2,
-		color: '#00C7B1',
-		createdAt: new Date().toISOString()
-	};
-}
-
-describe('AnnotationShape', () => {
-	it('renders the annotation element', async () => {
-		render(AnnotationShape, {
-			annotation: makeAnnotation(),
-			isHovered: false,
-			isActive: false,
-			onclick: () => {},
-			onpointerenter: () => {},
-			onpointerleave: () => {}
-		});
-
-		await expect.element(page.getByTestId('annotation-ann-1')).toBeInTheDocument();
-	});
-
-	it('does not show delete button when showDelete is false', async () => {
-		render(AnnotationShape, {
-			annotation: makeAnnotation(),
-			isHovered: true,
-			isActive: false,
-			showDelete: false,
-			onDeleteRequest: vi.fn(),
-			onclick: () => {},
-			onpointerenter: () => {},
-			onpointerleave: () => {}
-		});
-
-		expect(page.getByTestId('annotation-delete-ann-1').query()).toBeNull();
-	});
-
-	it('does not show delete button when showDelete is true but neither hovered nor active', async () => {
-		render(AnnotationShape, {
-			annotation: makeAnnotation(),
-			isHovered: false,
-			isActive: false,
-			showDelete: true,
-			onDeleteRequest: vi.fn(),
-			onclick: () => {},
-			onpointerenter: () => {},
-			onpointerleave: () => {}
-		});
-
-		expect(page.getByTestId('annotation-delete-ann-1').query()).toBeNull();
-	});
-
-	it('shows delete button when showDelete is true and isHovered is true', async () => {
-		render(AnnotationShape, {
-			annotation: makeAnnotation(),
-			isHovered: true,
-			isActive: false,
-			showDelete: true,
-			onDeleteRequest: vi.fn(),
-			onclick: () => {},
-			onpointerenter: () => {},
-			onpointerleave: () => {}
-		});
-
-		await expect.element(page.getByTestId('annotation-delete-ann-1')).toBeInTheDocument();
-	});
-
-	it('shows delete button when showDelete is true and isActive is true', async () => {
-		render(AnnotationShape, {
-			annotation: makeAnnotation(),
-			isHovered: false,
-			isActive: true,
-			showDelete: true,
-			onDeleteRequest: vi.fn(),
-			onclick: () => {},
-			onpointerenter: () => {},
-			onpointerleave: () => {}
-		});
-
-		await expect.element(page.getByTestId('annotation-delete-ann-1')).toBeInTheDocument();
-	});
-
-	it('calls onDeleteRequest when delete button is clicked', async () => {
-		const onDeleteRequest = vi.fn();
-
-		render(AnnotationShape, {
-			annotation: makeAnnotation(),
-			isHovered: true,
-			isActive: false,
-			showDelete: true,
-			onDeleteRequest,
-			onclick: () => {},
-			onpointerenter: () => {},
-			onpointerleave: () => {}
-		});
-
-		const deleteBtn = page.getByTestId('annotation-delete-ann-1');
-		await deleteBtn.click();
-
-		expect(onDeleteRequest).toHaveBeenCalledOnce();
-	});
-
-	it('does not call onclick when delete button is clicked', async () => {
-		const onclick = vi.fn();
-		const onDeleteRequest = vi.fn();
-
-		render(AnnotationShape, {
-			annotation: makeAnnotation(),
-			isHovered: true,
-			isActive: false,
-			showDelete: true,
-			onDeleteRequest,
-			onclick,
-			onpointerenter: () => {},
-			onpointerleave: () => {}
-		});
-
-		const deleteBtn = page.getByTestId('annotation-delete-ann-1');
-		await deleteBtn.click();
-
-		expect(onclick).not.toHaveBeenCalled();
-		expect(onDeleteRequest).toHaveBeenCalledOnce();
-	});
-
-	it('calls onDeleteRequest when Delete key is pressed on the annotation', async () => {
-		const onDeleteRequest = vi.fn();
-
-		render(AnnotationShape, {
-			annotation: makeAnnotation(),
-			isHovered: false,
-			isActive: true,
-			showDelete: true,
-			onDeleteRequest,
-			onclick: () => {},
-			onpointerenter: () => {},
-			onpointerleave: () => {}
-		});
-
-		const annotationEl = page.getByTestId('annotation-ann-1').element() as HTMLElement;
-		annotationEl.dispatchEvent(new KeyboardEvent('keydown', { key: 'Delete', bubbles: true }));
-
-		expect(onDeleteRequest).toHaveBeenCalledOnce();
-	});
-
-	it('does not call onDeleteRequest on Delete key when showDelete is false', async () => {
-		const onDeleteRequest = vi.fn();
-
-		render(AnnotationShape, {
-			annotation: makeAnnotation(),
-			isHovered: false,
-			isActive: true,
-			showDelete: false,
-			onDeleteRequest,
-			onclick: () => {},
-			onpointerenter: () => {},
-			onpointerleave: () => {}
-		});
-
-		const annotationEl = page.getByTestId('annotation-ann-1').element() as HTMLElement;
-		annotationEl.dispatchEvent(new KeyboardEvent('keydown', { key: 'Delete', bubbles: true }));
-
-		expect(onDeleteRequest).not.toHaveBeenCalled();
-	});
-});
--- a/frontend/src/lib/components/DocumentViewer.svelte
+++ b/frontend/src/lib/components/DocumentViewer.svelte
@@ -24,7 +24,6 @@ type Props = {
 	flashAnnotationId?: string | null;
 	onAnnotationClick: (id: string) => void;
 	onTranscriptionDraw?: (rect: DrawRect) => void;
-	onDeleteAnnotationRequest?: (annotationId: string) => void;
 };

 let {
@@ -39,8 +38,7 @@ let {
 	annotationsDimmed = false,
 	flashAnnotationId = null,
 	onAnnotationClick,
-	onTranscriptionDraw,
-	onDeleteAnnotationRequest
+	onTranscriptionDraw
 }: Props = $props();
 </script>

@@ -100,7 +98,6 @@ let {
 			flashAnnotationId={flashAnnotationId}
 			onAnnotationClick={onAnnotationClick}
 			onTranscriptionDraw={onTranscriptionDraw}
-			onDeleteAnnotationRequest={onDeleteAnnotationRequest}
 			documentFileHash={doc.fileHash ?? null}
 		/>
 	{:else if fileUrl}
--- a/frontend/src/lib/components/NotificationBell.svelte
+++ b/frontend/src/lib/components/NotificationBell.svelte
@@ -48,12 +48,6 @@ function handleKeydown(event: KeyboardEvent) {
 	}
 }

-const bellLabel = $derived(
-	stream.unreadCount > 0
-		? m.notification_bell_unread_label({ count: stream.unreadCount })
-		: m.notification_bell_label()
-);
-
 function attachBellButton(node: HTMLButtonElement) {
 	bellButtonEl = node;
 	return () => {
@@ -78,11 +72,12 @@ onDestroy(() => {
 		{@attach attachBellButton}
 		type="button"
 		onclick={toggleDropdown}
-		aria-label={bellLabel}
-		title={bellLabel}
+		aria-label={stream.unreadCount > 0
+			? m.notification_bell_unread_label({ count: stream.unreadCount })
+			: m.notification_bell_label()}
 		aria-expanded={open}
 		aria-haspopup="true"
-		class="relative cursor-pointer rounded-sm p-2 text-white/65 transition-colors hover:bg-white/10 hover:text-white focus:outline-none focus-visible:ring-2 focus-visible:ring-focus-ring"
+		class="relative rounded-sm p-2 text-white/65 transition-colors hover:bg-white/10 hover:text-white focus:outline-none focus-visible:ring-2 focus-visible:ring-focus-ring"
 	>
 		<svg
 			xmlns="http://www.w3.org/2000/svg"
--- a/frontend/src/lib/components/NotificationBell.svelte.spec.ts
+++ b/frontend/src/lib/components/NotificationBell.svelte.spec.ts
@@ -55,34 +55,6 @@ async function openDropdownAndClickFirstNotification() {
 	notifButton.click();
 }

-describe('NotificationBell — cursor and tooltip', () => {
-	it('bell button has cursor-pointer class', async () => {
-		render(NotificationBell);
-		const btn = document.querySelector<HTMLButtonElement>('button[aria-haspopup="true"]')!;
-		expect(btn.classList.contains('cursor-pointer')).toBe(true);
-	});
-
-	it('bell button title equals aria-label when unreadCount is 0', async () => {
-		mockNotificationList.value = [];
-		render(NotificationBell);
-		const btn = document.querySelector<HTMLButtonElement>('button[aria-haspopup="true"]')!;
-		expect(btn.getAttribute('title')).toBe('Benachrichtigungen');
-		expect(btn.getAttribute('aria-label')).toBe(btn.getAttribute('title'));
-	});
-
-	it('bell button title equals aria-label when unreadCount is 3', async () => {
-		mockNotificationList.value = [
-			makeNotification({ id: 'n1' }),
-			makeNotification({ id: 'n2' }),
-			makeNotification({ id: 'n3' })
-		];
-		render(NotificationBell);
-		const btn = document.querySelector<HTMLButtonElement>('button[aria-haspopup="true"]')!;
-		expect(btn.getAttribute('title')).toBe('3 ungelesene Benachrichtigungen');
-		expect(btn.getAttribute('aria-label')).toBe(btn.getAttribute('title'));
-	});
-});
-
 describe('NotificationBell', () => {
 	it('handleMarkRead navigates to URL including annotationId when notification has annotationId', async () => {
 		mockNotificationList.value = [makeNotification({ annotationId: 'annot-1' })];
--- a/frontend/src/lib/components/Pagination.svelte
+++ b/frontend/src/lib/components/Pagination.svelte
@@ -20,48 +20,6 @@ const controlBase =
 	'inline-flex min-h-[44px] min-w-[44px] items-center justify-center gap-1.5 rounded-sm border border-line bg-white px-4 py-2 font-sans text-sm font-bold text-ink';
 const linkBase = `${controlBase} transition-colors hover:bg-surface focus-visible:ring-2 focus-visible:ring-brand-navy focus-visible:ring-offset-2 focus-visible:outline-none`;
 const disabledBase = `${controlBase} cursor-not-allowed opacity-40`;
-const activePageBase =
-	'inline-flex min-h-[44px] min-w-[44px] items-center justify-center rounded-sm border border-brand-navy bg-brand-navy px-4 py-2 font-sans text-sm font-bold text-white';
-
-/**
- * Builds the sliding window of 1-indexed page numbers to render as buttons.
- * Always shows: first, last, current, one neighbor each side.
- * null entries represent ellipsis gaps.
- */
-const pageWindow = $derived.by(() => {
-	const first = 1;
-	const last = totalPages;
-	const current = page + 1; // convert to 1-indexed
-
-	const windowStart = Math.max(first, current - 1);
-	const windowEnd = Math.min(last, current + 1);
-
-	const result: (number | null)[] = [];
-
-	result.push(first);
-
-	if (windowStart > first + 2) {
-		result.push(null); // left ellipsis
-	} else if (windowStart === first + 2) {
-		result.push(first + 1); // bridge: one page gap, show directly instead of ellipsis
-	}
-
-	for (let p = Math.max(windowStart, first + 1); p <= Math.min(windowEnd, last - 1); p++) {
-		result.push(p);
-	}
-
-	if (windowEnd < last - 2) {
-		result.push(null); // right ellipsis
-	} else if (windowEnd === last - 2) {
-		result.push(last - 1); // bridge: one page gap, show directly instead of ellipsis
-	}
-
-	if (last > first) {
-		result.push(last);
-	}
-
-	return result;
-});
 </script>

 {#if totalPages > 1}
@@ -94,60 +52,13 @@ const pageWindow = $derived.by(() => {
 			</span>
 		{/if}

-		<!-- Mobile: "Seite X von Y" label (hidden on sm: and above) -->
-		<!-- aria-hidden: decorative visual label; AT uses the sr-only span below for aria-current -->
 		<span
 			data-testid="pagination-page-label"
-			aria-hidden="true"
-			class="font-sans text-sm text-ink-2 sm:hidden"
+			aria-current="page"
+			class="font-sans text-sm text-ink-2"
 		>
 			{m.pagination_page_of({ page: page + 1, total: totalPages })}
 		</span>
-		<!-- Always in the AT tree: announces current page regardless of breakpoint.
-		     On mobile, the desktop button container is display:none so this is the only AT anchor.
-		     On desktop, the active page button also carries aria-current — both announce the same info. -->
-		<span data-testid="pagination-current-page-sr" aria-current="page" class="sr-only">
-			{m.pagination_page_of({ page: page + 1, total: totalPages })}
-		</span>
-
-		<!-- Desktop: numbered page buttons (hidden below sm:) -->
-		<div data-testid="pagination-pages" class="hidden items-center gap-1 sm:flex">
-			{#each pageWindow as entry, i (entry === null ? 'ellipsis-' + i : entry)}
-				{#if entry === null}
-					{#if i === 1}
-						<span
-							data-testid="pagination-ellipsis-left"
-							aria-hidden="true"
-							class="px-2 text-sm text-ink-2">…</span
-						>
-					{:else}
-						<span
-							data-testid="pagination-ellipsis-right"
-							aria-hidden="true"
-							class="px-2 text-sm text-ink-2">…</span
-						>
-					{/if}
-				{:else if entry === page + 1}
-					<span
-						data-testid="pagination-page-{entry}"
-						aria-current="page"
-						aria-label={m.pagination_page_button({ page: entry })}
-						class={activePageBase}
-					>
-						{entry}
-					</span>
-				{:else}
-					<a
-						data-testid="pagination-page-{entry}"
-						aria-label={m.pagination_page_button({ page: entry })}
-						href={makeHref(entry - 1)}
-						class={linkBase}
-					>
-						{entry}
-					</a>
-				{/if}
-			{/each}
-		</div>

 		{#if hasNext}
 			<a
--- a/frontend/src/lib/components/Pagination.svelte.spec.ts
+++ b/frontend/src/lib/components/Pagination.svelte.spec.ts
@@ -19,145 +19,11 @@ describe('Pagination', () => {
 		await expect.element(label).toHaveTextContent(/10/);
 	});

-	it('mobile page label is aria-hidden (desktop buttons carry the aria-current role)', async () => {
+	it('marks the current page label with aria-current="page"', async () => {
 		render(Pagination, { page: 0, totalPages: 3, makeHref });

 		const label = page.getByTestId('pagination-page-label');
-		await expect.element(label).toHaveAttribute('aria-hidden', 'true');
-	});
-
-	describe('page number buttons', () => {
-		it('renders page number buttons when totalPages > 1', async () => {
-			render(Pagination, { page: 4, totalPages: 12, makeHref });
-
-			const nav = page.getByRole('navigation');
-			// active page button — the current page (5, 1-indexed)
-			const activeBtn = nav.getByTestId('pagination-page-5');
-			await expect.element(activeBtn).toBeInTheDocument();
-		});
-
-		it('does not render page number buttons when totalPages <= 1', async () => {
-			render(Pagination, { page: 0, totalPages: 1, makeHref });
-
-			// entire nav is hidden
-			const nav = page.getByRole('navigation');
-			await expect.element(nav).not.toBeInTheDocument();
-		});
-
-		it('marks the active page button with aria-current="page"', async () => {
-			render(Pagination, { page: 4, totalPages: 12, makeHref });
-
-			const nav = page.getByRole('navigation');
-			const activeBtn = nav.getByTestId('pagination-page-5');
-			await expect.element(activeBtn).toHaveAttribute('aria-current', 'page');
-		});
-
-		it('active page button has brand-navy background', async () => {
-			render(Pagination, { page: 4, totalPages: 12, makeHref });
-
-			const nav = page.getByRole('navigation');
-			const activeBtn = nav.getByTestId('pagination-page-5');
-			await expect.element(activeBtn).toHaveClass(/bg-brand-navy/);
-		});
-
-		it('active page button has 44px touch target', async () => {
-			render(Pagination, { page: 4, totalPages: 12, makeHref });
-
-			const nav = page.getByRole('navigation');
-			const activeBtn = nav.getByTestId('pagination-page-5');
-			await expect.element(activeBtn).toHaveClass(/min-h-\[44px\]/);
-			await expect.element(activeBtn).toHaveClass(/min-w-\[44px\]/);
-		});
-
-		it('inactive page buttons link to their target page via makeHref', async () => {
-			const spy = vi.fn(makeHref);
-			render(Pagination, { page: 4, totalPages: 12, makeHref: spy });
-
-			const nav = page.getByRole('navigation');
-			// page button for page 1 (0-indexed: 0) should link to /documents?page=0
-			const firstPageBtn = nav.getByTestId('pagination-page-1');
-			await expect.element(firstPageBtn).toHaveAttribute('href', '/documents?page=0');
-		});
-
-		it('renders first and last page buttons always visible', async () => {
-			render(Pagination, { page: 5, totalPages: 12, makeHref });
-
-			const nav = page.getByRole('navigation');
-			await expect.element(nav.getByTestId('pagination-page-1')).toBeInTheDocument();
-			await expect.element(nav.getByTestId('pagination-page-12')).toBeInTheDocument();
-		});
-
-		it('renders ellipsis span between first page and window when gap exists', async () => {
-			// page 6 (0-indexed: 5) — window is 5,6,7 — gap between 1 and 5
-			render(Pagination, { page: 5, totalPages: 12, makeHref });
-
-			const nav = page.getByRole('navigation');
-			const ellipses = nav.getByTestId('pagination-ellipsis-left');
-			await expect.element(ellipses).toBeInTheDocument();
-		});
-
-		it('renders ellipsis span between window and last page when gap exists', async () => {
-			// page 1 (0-indexed: 0) — window is 1,2 — gap between 2 and 12
-			render(Pagination, { page: 0, totalPages: 12, makeHref });
-
-			const nav = page.getByRole('navigation');
-			const ellipsis = nav.getByTestId('pagination-ellipsis-right');
-			await expect.element(ellipsis).toBeInTheDocument();
-		});
-
-		it('does not render left ellipsis when window is adjacent to first page', async () => {
-			// page 1 (0-indexed: 0) — window starts at 1, adjacent to first page
-			render(Pagination, { page: 0, totalPages: 12, makeHref });
-
-			const nav = page.getByRole('navigation');
-			const leftEllipsis = nav.getByTestId('pagination-ellipsis-left');
-			await expect.element(leftEllipsis).not.toBeInTheDocument();
-		});
-
-		it('does not render right ellipsis when window is adjacent to last page', async () => {
-			// last page (0-indexed: 11) — window ends at 12, adjacent to last page
-			render(Pagination, { page: 11, totalPages: 12, makeHref });
-
-			const nav = page.getByRole('navigation');
-			const rightEllipsis = nav.getByTestId('pagination-ellipsis-right');
-			await expect.element(rightEllipsis).not.toBeInTheDocument();
-		});
-
-		it('page buttons container has hidden class on mobile (sm: prefix)', async () => {
-			// The page buttons container must be hidden below sm: breakpoint
-			render(Pagination, { page: 4, totalPages: 12, makeHref });
-
-			const nav = page.getByRole('navigation');
-			const pageButtons = nav.getByTestId('pagination-pages');
-			await expect.element(pageButtons).toHaveClass(/hidden/);
-			await expect.element(pageButtons).toHaveClass(/sm:flex/);
-		});
-
-		it('renders both pages without ellipsis when totalPages is 2', async () => {
-			render(Pagination, { page: 0, totalPages: 2, makeHref });
-
-			const nav = page.getByRole('navigation');
-			await expect.element(nav.getByTestId('pagination-page-1')).toBeInTheDocument();
-			await expect.element(nav.getByTestId('pagination-page-2')).toBeInTheDocument();
-			await expect.element(nav.getByTestId('pagination-ellipsis-left')).not.toBeInTheDocument();
-			await expect.element(nav.getByTestId('pagination-ellipsis-right')).not.toBeInTheDocument();
-		});
-	});
-
-	it('mobile page label is aria-hidden so screen readers skip it on wide screens', async () => {
-		render(Pagination, { page: 2, totalPages: 10, makeHref });
-
-		const label = page.getByTestId('pagination-page-label');
-		await expect.element(label).toHaveAttribute('aria-hidden', 'true');
-	});
-
-	it('sr-only span always provides aria-current="page" for screen readers at all breakpoints', async () => {
-		render(Pagination, { page: 2, totalPages: 10, makeHref });
-
-		const nav = page.getByRole('navigation');
-		const srLabel = nav.getByTestId('pagination-current-page-sr');
-		await expect.element(srLabel).toBeInTheDocument();
-		await expect.element(srLabel).toHaveAttribute('aria-current', 'page');
+		await expect.element(label).toHaveAttribute('aria-current', 'page');
 	});

 	it('renders prev as a link pointing at page - 1 when not on first page', async () => {
--- a/frontend/src/lib/components/PdfViewer.svelte
+++ b/frontend/src/lib/components/PdfViewer.svelte
@@ -18,7 +18,6 @@ let {
 	activeAnnotationId = $bindable<string | null>(null),
 	onAnnotationClick,
 	onTranscriptionDraw,
-	onDeleteAnnotationRequest,
 	documentFileHash,
 	annotationsDimmed = false,
 	flashAnnotationId = null
@@ -31,7 +30,6 @@ let {
 	activeAnnotationId?: string | null;
 	onAnnotationClick?: (id: string) => void;
 	onTranscriptionDraw?: (rect: DrawRect) => void;
-	onDeleteAnnotationRequest?: (annotationId: string) => void;
 	documentFileHash?: string | null;
 	annotationsDimmed?: boolean;
 	flashAnnotationId?: string | null;
@@ -266,7 +264,6 @@ function handleAnnotationClick(id: string) {
 								flashAnnotationId={flashAnnotationId}
 								onDraw={handleDraw}
 								onAnnotationClick={handleAnnotationClick}
-								onDeleteRequest={onDeleteAnnotationRequest}
 							/>
 						{/if}
 					</div>
--- a/frontend/src/lib/components/ThemeToggle.svelte
+++ b/frontend/src/lib/components/ThemeToggle.svelte
@@ -1,6 +1,5 @@
 <script lang="ts">
 import { onMount } from 'svelte';
-import { m } from '$lib/paraglide/messages.js';

 type Theme = 'light' | 'dark';

@@ -20,10 +19,6 @@ onMount(() => {
 	theme = resolveInitialTheme();
 });

-const themeLabel = $derived(
-	theme === 'dark' ? m.theme_toggle_to_light() : m.theme_toggle_to_dark()
-);
-
 function toggle() {
 	theme = theme === 'dark' ? 'light' : 'dark';
 	localStorage.setItem('theme', theme);
@@ -34,8 +29,8 @@ function toggle() {
 <button
 	type="button"
 	onclick={toggle}
-	aria-label={themeLabel}
-	title={themeLabel}
+	aria-label={theme === 'dark' ? 'light mode' : 'dark mode'}
+	title={theme === 'dark' ? 'light mode' : 'dark mode'}
 	class="rounded p-1.5 text-white/65 transition-colors hover:bg-white/10 hover:text-white focus:outline-none focus-visible:ring-2 focus-visible:ring-focus-ring"
 >
 	{#if theme === 'dark'}
--- a/frontend/src/lib/components/ThemeToggle.svelte.spec.ts
+++ b/frontend/src/lib/components/ThemeToggle.svelte.spec.ts
@@ -1,45 +0,0 @@
-import { afterEach, beforeEach, describe, expect, it } from 'vitest';
-import { cleanup, render } from 'vitest-browser-svelte';
-import { page } from 'vitest/browser';
-import ThemeToggle from './ThemeToggle.svelte';
-
-afterEach(() => {
-	cleanup();
-	localStorage.removeItem('theme');
-});
-
-describe('ThemeToggle — label derivation (light mode)', () => {
-	beforeEach(() => {
-		localStorage.setItem('theme', 'light');
-	});
-
-	it('aria-label invites switching to dark mode when theme is light', async () => {
-		render(ThemeToggle);
-		const btn = await page.getByRole('button').element();
-		expect(btn.getAttribute('aria-label')).toBe('Zu dunklem Design wechseln');
-	});
-
-	it('title equals aria-label in light mode', async () => {
-		render(ThemeToggle);
-		const btn = await page.getByRole('button').element();
-		expect(btn.getAttribute('title')).toBe(btn.getAttribute('aria-label'));
-	});
-});
-
-describe('ThemeToggle — label derivation (dark mode)', () => {
-	beforeEach(() => {
-		localStorage.setItem('theme', 'dark');
-	});
-
-	it('aria-label invites switching to light mode when theme is dark', async () => {
-		render(ThemeToggle);
-		const btn = await page.getByRole('button').element();
-		expect(btn.getAttribute('aria-label')).toBe('Zu hellem Design wechseln');
-	});
-
-	it('title equals aria-label in dark mode', async () => {
-		render(ThemeToggle);
-		const btn = await page.getByRole('button').element();
-		expect(btn.getAttribute('title')).toBe(btn.getAttribute('aria-label'));
-	});
-});
--- a/frontend/src/lib/components/TranscriptionEditView.svelte
+++ b/frontend/src/lib/components/TranscriptionEditView.svelte
@@ -19,7 +19,6 @@ type Props = {
 	onSaveBlock: (blockId: string, text: string) => Promise<void>;
 	onDeleteBlock: (blockId: string) => Promise<void>;
 	onReviewToggle: (blockId: string) => Promise<void>;
-	onMarkAllReviewed?: () => Promise<void>;
 	onTriggerOcr?: (scriptType: string, useExistingAnnotations: boolean) => void;
 	canWrite?: boolean;
 	trainingLabels?: string[];
@@ -38,7 +37,6 @@ let {
 	onSaveBlock,
 	onDeleteBlock,
 	onReviewToggle,
-	onMarkAllReviewed,
 	onTriggerOcr,
 	canWrite = false,
 	trainingLabels = [],
@@ -48,14 +46,12 @@ let {
 let activeBlockId: string | null = $state(null);
 let localLabels: string[] = $derived.by(() => [...trainingLabels]);
 let listEl: HTMLElement | null = $state(null);
-let markingAllReviewed = $state(false);

 const sortedBlocks = $derived([...blocks].sort((a, b) => a.sortOrder - b.sortOrder));
 const hasBlocks = $derived(blocks.length > 0);
 const reviewedCount = $derived(blocks.filter((b) => b.reviewed).length);
 const totalCount = $derived(blocks.length);
 const reviewProgress = $derived(totalCount > 0 ? (reviewedCount / totalCount) * 100 : 0);
-const allReviewed = $derived(totalCount > 0 && reviewedCount === totalCount);

 // Sync: when an annotation is clicked on the PDF, activate the corresponding block
 $effect(() => {
@@ -64,16 +60,6 @@ $effect(() => {
 	if (block) activeBlockId = block.id;
 });

-async function handleMarkAllReviewed() {
-	if (!onMarkAllReviewed) return;
-	markingAllReviewed = true;
-	try {
-		await onMarkAllReviewed();
-	} finally {
-		markingAllReviewed = false;
-	}
-}
-
 const autoSave = createBlockAutoSave({ saveFn: onSaveBlock, documentId });

 const dragDrop = createBlockDragDrop({
@@ -161,56 +147,9 @@ async function handleLabelToggle(label: string) {
 	{#if hasBlocks}
 		<!-- Sticky review progress header -->
 		<div class="sticky top-0 z-10 border-b border-line bg-surface px-4 pt-3 pb-2">
-			<div class="flex items-center justify-between">
-				<p class="font-sans text-xs text-ink-2">
-					<span class="font-semibold text-ink">{reviewedCount} / {totalCount}</span> geprüft
-				</p>
-				{#if onMarkAllReviewed}
-					<button
-						onclick={handleMarkAllReviewed}
-						disabled={allReviewed || markingAllReviewed}
-						title={allReviewed ? 'Alle Blöcke sind bereits als fertig markiert' : undefined}
-						class="flex min-h-[44px] items-center gap-1.5 rounded-sm px-3 font-sans text-xs font-medium text-brand-navy/80 transition-colors hover:text-brand-navy focus-visible:ring-2 focus-visible:ring-brand-navy disabled:opacity-40"
-					>
-						{#if markingAllReviewed}
-							<svg
-								class="h-3.5 w-3.5 animate-spin"
-								fill="none"
-								viewBox="0 0 24 24"
-								xmlns="http://www.w3.org/2000/svg"
-								aria-hidden="true"
-							>
-								<circle
-									class="opacity-25"
-									cx="12"
-									cy="12"
-									r="10"
-									stroke="currentColor"
-									stroke-width="4"
-								></circle>
-								<path
-									class="opacity-75"
-									fill="currentColor"
-									d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4z"
-								></path>
-							</svg>
-						{:else}
-							<svg
-								class="h-3.5 w-3.5"
-								fill="none"
-								stroke="currentColor"
-								stroke-width="2"
-								viewBox="0 0 24 24"
-								xmlns="http://www.w3.org/2000/svg"
-								aria-hidden="true"
-							>
-								<path stroke-linecap="round" stroke-linejoin="round" d="M5 13l4 4L19 7" />
-							</svg>
-						{/if}
-						Alle als fertig markieren
-					</button>
-				{/if}
-			</div>
+			<p class="font-sans text-xs text-ink-2">
+				<span class="font-semibold text-ink">{reviewedCount} / {totalCount}</span> geprüft
+			</p>
 			<div class="bg-brand-sand mt-1.5 h-0.5 w-full overflow-hidden rounded-full">
 				<div
 					class="h-full rounded-full bg-brand-mint transition-all duration-300"
--- a/frontend/src/lib/components/TranscriptionEditView.svelte.spec.ts
+++ b/frontend/src/lib/components/TranscriptionEditView.svelte.spec.ts
@@ -49,11 +49,6 @@ function renderView(overrides: Record<string, unknown> = {}, service = createCon
 	};
 }

-const unreviewedBlock1 = { ...block1, reviewed: false };
-const unreviewedBlock2 = { ...block2, reviewed: false };
-const reviewedBlock1 = { ...block1, reviewed: true };
-const reviewedBlock2 = { ...block2, reviewed: true };
-
 describe('TranscriptionEditView — rendering', () => {
 	it('renders blocks in sort order', async () => {
 		renderView();
@@ -274,61 +269,3 @@ describe('TranscriptionEditView — review progress counter', () => {
 		await expect.element(page.getByText(/geprüft/)).not.toBeInTheDocument();
 	});
 });
-
-// ─── Bulk mark all as reviewed ────────────────────────────────────────────────
-
-describe('TranscriptionEditView — mark all reviewed', () => {
-	it('shows "Alle als fertig markieren" button when onMarkAllReviewed is provided and blocks are unreviewed', async () => {
-		renderView({
-			blocks: [unreviewedBlock1, unreviewedBlock2],
-			onMarkAllReviewed: vi.fn().mockResolvedValue(undefined)
-		});
-		await expect
-			.element(page.getByRole('button', { name: /Alle als fertig markieren/ }))
-			.toBeInTheDocument();
-	});
-
-	it('does not show "Alle als fertig markieren" button when onMarkAllReviewed is not provided', async () => {
-		renderView({ blocks: [unreviewedBlock1, unreviewedBlock2] });
-		await expect
-			.element(page.getByRole('button', { name: /Alle als fertig markieren/ }))
-			.not.toBeInTheDocument();
-	});
-
-	it('disables button when all blocks are already reviewed', async () => {
-		renderView({
-			blocks: [reviewedBlock1, reviewedBlock2],
-			onMarkAllReviewed: vi.fn().mockResolvedValue(undefined)
-		});
-		await expect
-			.element(page.getByRole('button', { name: /Alle als fertig markieren/ }))
-			.toBeDisabled();
-	});
-
-	it('calls onMarkAllReviewed exactly once when button is clicked', async () => {
-		const onMarkAllReviewed = vi.fn().mockResolvedValue(undefined);
-		renderView({
-			blocks: [unreviewedBlock1, unreviewedBlock2],
-			onMarkAllReviewed
-		});
-
-		await page.getByRole('button', { name: /Alle als fertig markieren/ }).click();
-		await vi.waitFor(() => expect(onMarkAllReviewed).toHaveBeenCalledTimes(1));
-	});
-
-	it('disables button while operation is in-flight', async () => {
-		let resolveMarkAll!: () => void;
-		const onMarkAllReviewed = vi
-			.fn()
-			.mockReturnValue(new Promise<void>((r) => (resolveMarkAll = r)));
-		renderView({
-			blocks: [unreviewedBlock1, unreviewedBlock2],
-			onMarkAllReviewed
-		});
-
-		const btn = page.getByRole('button', { name: /Alle als fertig markieren/ });
-		await btn.click();
-		await expect.element(btn).toBeDisabled();
-		resolveMarkAll();
-	});
-});
--- a/frontend/src/routes/documents/[id]/+page.svelte
+++ b/frontend/src/routes/documents/[id]/+page.svelte
@@ -13,12 +13,9 @@ import { getErrorMessage } from '$lib/errors';
 import { translateOcrProgress } from '$lib/ocr/translateOcrProgress';
 import { createFileLoader } from '$lib/hooks/useFileLoader.svelte';
 import { scrollToCommentFromQuery } from '$lib/utils/deepLinkScroll';
-import { getConfirmService } from '$lib/services/confirm.svelte.js';

 let { data } = $props();

-const { confirm } = getConfirmService();
-
 const doc = $derived(data.document);
 const canWrite = $derived(data.canWrite ?? false);
 const currentUserId = $derived((data.user?.id as string | undefined) ?? null);
@@ -108,26 +105,6 @@ async function deleteBlock(blockId: string) {
 	annotationReloadKey++;
 }

-async function handleAnnotationDeleteRequest(annotationId: string) {
-	const confirmed = await confirm({
-		title: m.transcription_block_delete_confirm(),
-		destructive: true
-	});
-	if (!confirmed) return;
-
-	const block = transcriptionBlocks.find((b) => b.annotationId === annotationId);
-	if (block) {
-		await deleteBlock(block.id);
-	} else {
-		// Annotation has no linked block — delete the annotation directly
-		const res = await fetch(`/api/documents/${doc.id}/annotations/${annotationId}`, {
-			method: 'DELETE'
-		});
-		if (!res.ok) throw new Error('Delete annotation failed');
-		annotationReloadKey++;
-	}
-}
-
 async function reviewToggle(blockId: string) {
 	const res = await fetch(`/api/documents/${doc.id}/transcription-blocks/${blockId}/review`, {
 		method: 'PUT'
@@ -137,18 +114,6 @@ async function reviewToggle(blockId: string) {
 	transcriptionBlocks = transcriptionBlocks.map((b) => (b.id === blockId ? updated : b));
 }

-async function markAllReviewed() {
-	const res = await fetch(`/api/documents/${doc.id}/transcription-blocks/review-all`, {
-		method: 'PUT'
-	});
-	if (!res.ok) return;
-	const updated = await res.json();
-	for (const b of updated) {
-		const existing = transcriptionBlocks.find((x) => x.id === b.id);
-		if (existing) existing.reviewed = b.reviewed;
-	}
-}
-
 async function toggleTrainingLabel(label: string, enrolled: boolean) {
 	const res = await fetch(`/api/documents/${doc.id}/training-labels`, {
 		method: 'PATCH',
@@ -416,7 +381,6 @@ onMount(() => {
 				bind:activeAnnotationId={activeAnnotationId}
 				onAnnotationClick={handleAnnotationClick}
 				onTranscriptionDraw={createBlockFromDraw}
-				onDeleteAnnotationRequest={handleAnnotationDeleteRequest}
 			/>
 		</div>

@@ -513,7 +477,6 @@ onMount(() => {
 							onSaveBlock={saveBlock}
 							onDeleteBlock={deleteBlock}
 							onReviewToggle={reviewToggle}
-							onMarkAllReviewed={markAllReviewed}
 							onTriggerOcr={triggerOcr}
 							onToggleTrainingLabel={toggleTrainingLabel}
 						/>
--- a/frontend/src/routes/layout.css
+++ b/frontend/src/routes/layout.css
@@ -365,11 +365,6 @@
 		text-underline-offset: 4px;
 	}

-	/* Tailwind preflight resets cursor on *, overriding the browser default for buttons */
-	button {
-		cursor: pointer;
-	}
-
 	/* Fallback focus ring for any interactive element not styled with ring-focus-ring */
 	:focus-visible {
 		outline: 2px solid var(--c-focus-ring);
--- a/frontend/src/routes/persons/[id]/PersonMergePanel.svelte
+++ b/frontend/src/routes/persons/[id]/PersonMergePanel.svelte
@@ -15,7 +15,7 @@ let mergeTargetId = $state('');
 let showMergeConfirm = $state(false);
 </script>

-<div class="mb-10 overflow-hidden rounded-sm border border-red-200 bg-surface shadow-sm">
+<div class="mb-10 overflow-hidden rounded-sm border border-line bg-surface shadow-sm">
 	<div class="p-6 md:p-8">
 		<h2 class="mb-1 font-serif text-lg text-ink">{m.person_merge_heading()}</h2>
 		<p class="mb-5 font-sans text-sm text-ink-2">
--- a/frontend/src/routes/persons/[id]/PersonMergePanel.svelte.spec.ts
+++ b/frontend/src/routes/persons/[id]/PersonMergePanel.svelte.spec.ts
@@ -1,55 +0,0 @@
-import { describe, it, expect, vi, afterEach } from 'vitest';
-import { cleanup, render } from 'vitest-browser-svelte';
-import { page } from 'vitest/browser';
-import PersonMergePanel from './PersonMergePanel.svelte';
-
-vi.mock('$app/forms', () => ({ enhance: () => () => {} }));
-vi.mock('$lib/components/PersonTypeahead.svelte', () => ({
-	default: () => null
-}));
-
-afterEach(cleanup);
-
-const makePerson = (overrides = {}) => ({
-	displayName: 'Hans Müller',
-	...overrides
-});
-
-// ─── Danger indicator ────────────────────────────────────────────────────────
-
-describe('PersonMergePanel — danger indicator', () => {
-	it('renders outer container with red border class', () => {
-		const { container } = render(PersonMergePanel, {
-			props: { person: makePerson(), form: null }
-		});
-		const panel = container.firstElementChild as HTMLElement;
-		expect(panel?.classList.contains('border-red-200')).toBe(true);
-	});
-});
-
-// ─── Initial state ────────────────────────────────────────────────────────────
-
-describe('PersonMergePanel — initial state', () => {
-	it('renders merge heading', async () => {
-		render(PersonMergePanel, { props: { person: makePerson(), form: null } });
-		const heading = page.getByRole('heading', { level: 2 });
-		await expect.element(heading).toBeInTheDocument();
-	});
-
-	it('merge button is disabled when no target selected', async () => {
-		render(PersonMergePanel, { props: { person: makePerson(), form: null } });
-		const mergeBtn = page.getByRole('button', { name: /zusammenführen/i });
-		await expect.element(mergeBtn).toBeDisabled();
-	});
-});
-
-// ─── Error state ──────────────────────────────────────────────────────────────
-
-describe('PersonMergePanel — error state', () => {
-	it('renders mergeError when form contains error', async () => {
-		render(PersonMergePanel, {
-			props: { person: makePerson(), form: { mergeError: 'Zielperson nicht gefunden.' } }
-		});
-		await expect.element(page.getByText('Zielperson nicht gefunden.')).toBeInTheDocument();
-	});
-});
--- a/frontend/src/routes/persons/[id]/edit/+page.svelte
+++ b/frontend/src/routes/persons/[id]/edit/+page.svelte
@@ -5,7 +5,7 @@ import BackButton from '$lib/components/BackButton.svelte';
 import PersonEditForm from './PersonEditForm.svelte';
 import PersonEditSaveBar from './PersonEditSaveBar.svelte';
 import NameHistoryEditCard from './NameHistoryEditCard.svelte';
-import PersonMergePanel from '../PersonMergePanel.svelte';
+import PersonDangerZone from './PersonDangerZone.svelte';

 let { data, form } = $props();
 const person = $derived(data.person);
@@ -35,9 +35,7 @@ const person = $derived(data.person);

 	<NameHistoryEditCard aliases={data.aliases} canWrite={true} aliasError={form?.aliasError} />

-	{#key person.id}
-		<PersonMergePanel person={person} form={form} />
-	{/key}
+	<PersonDangerZone person={person} form={form} />

 	<PersonEditSaveBar discardHref="/persons/{person.id}" formId="person-edit-form" />
 </div>
--- a/frontend/src/routes/persons/[id]/edit/PersonDangerZone.svelte
+++ b/frontend/src/routes/persons/[id]/edit/PersonDangerZone.svelte
@@ -0,0 +1,44 @@
+<script lang="ts">
+import { m } from '$lib/paraglide/messages.js';
+import PersonMergePanel from '../PersonMergePanel.svelte';
+
+let {
+	person,
+	form
+}: {
+	person: { id: string; firstName?: string | null; lastName: string; displayName: string };
+	form?: { mergeError?: string } | null;
+} = $props();
+
+let open = $state(false);
+</script>
+
+<div class="mt-8 overflow-hidden rounded-sm border border-red-200 bg-surface shadow-sm">
+	<button
+		type="button"
+		onclick={() => (open = !open)}
+		class="flex w-full items-center justify-between px-6 py-4 text-left"
+		aria-expanded={open}
+	>
+		<span class="text-sm font-bold tracking-widest text-red-600 uppercase">
+			{m.person_danger_zone_heading()}
+		</span>
+		<svg
+			class="h-4 w-4 text-red-400 transition-transform {open ? 'rotate-180' : ''}"
+			fill="none"
+			stroke="currentColor"
+			viewBox="0 0 24 24"
+			aria-hidden="true"
+		>
+			<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7" />
+		</svg>
+	</button>
+
+	{#if open}
+		<div class="border-t border-red-100 px-6 py-4">
+			{#key person.id}
+				<PersonMergePanel person={person} form={form} />
+			{/key}
+		</div>
+	{/if}
+</div>