feat(transcription): enable drawing turquoise rectangles on PDF to create blocks

- AnnotationLayer: add dimColor prop — annotations matching dim color
  render at 30% opacity with pointer-events disabled (300ms transition)
- PdfViewer: add transcribeMode prop, derived drawingEnabled/drawColor;
  in transcribe mode draws with turquoise (#00C7B1), routes draw events
  to onTranscriptionDraw callback instead of annotation endpoint
- DocumentViewer: pass through transcribeMode + onTranscriptionDraw
- Document detail page: createBlockFromDraw() POSTs to transcription
  blocks API on draw completion, adds created block to list
- Mode-based dimming: yellow annotations dim in transcribe mode,
  turquoise annotations dim in annotate mode

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

frontend/src/routes/documents/[id]/+page.svelte

@@ -99,6 +99,37 @@ async function deleteBlock(blockId: string) {
 	transcriptionBlocks = transcriptionBlocks.filter((b) => b.id !== blockId);
 }
 
+async function createBlockFromDraw(rect: {
+	x: number;
+	y: number;
+	width: number;
+	height: number;
+	pageNumber: number;
+}) {
+	try {
+		const res = await fetch(`/api/documents/${doc.id}/transcription-blocks`, {
+			method: 'POST',
+			headers: { 'Content-Type': 'application/json' },
+			body: JSON.stringify({
+				pageNumber: rect.pageNumber,
+				x: rect.x,
+				y: rect.y,
+				width: rect.width,
+				height: rect.height,
+				text: '',
+				label: null
+			})
+		});
+		if (res.ok) {
+			const created = (await res.json()) as TranscriptionBlockData;
+			transcriptionBlocks = [...transcriptionBlocks, created];
+			activeAnnotationId = created.annotationId;
+		}
+	} catch (e) {
+		console.error('Failed to create transcription block:', e);
+	}
+}
+
 function handleBlockFocus(blockId: string) {
 	const block = transcriptionBlocks.find((b) => b.id === blockId);
 	if (block) {
@@ -172,11 +203,13 @@ onMount(() => {
 				isLoading={isLoading}
 				error={fileError}
 				bind:annotateMode={annotateMode}
+				transcribeMode={transcribeMode}
 				bind:activeAnnotationId={activeAnnotationId}
 				bind:activeAnnotationPage={activeAnnotationPage}
 				onAnnotationClick={(id) => {
 					activeAnnotationId = id;
 				}}
+				onTranscriptionDraw={createBlockFromDraw}
 			/>
 		</div>