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/lib/components/DocumentViewer.svelte

@@ -9,15 +9,19 @@ type Doc = {
 	fileHash?: string | null;
 };
 
+type DrawRect = { x: number; y: number; width: number; height: number; pageNumber: number };
+
 type Props = {
 	doc: Doc;
 	fileUrl: string;
 	isLoading: boolean;
 	error: string;
 	annotateMode: boolean;
+	transcribeMode?: boolean;
 	activeAnnotationId: string | null;
 	activeAnnotationPage: number | null;
 	onAnnotationClick: (id: string) => void;
+	onTranscriptionDraw?: (rect: DrawRect) => void;
 };
 
 let {
@@ -26,9 +30,11 @@ let {
 	isLoading,
 	error,
 	annotateMode = $bindable(),
+	transcribeMode = false,
 	activeAnnotationId = $bindable(),
 	activeAnnotationPage = $bindable(),
-	onAnnotationClick
+	onAnnotationClick,
+	onTranscriptionDraw
 }: Props = $props();
 </script>
 
@@ -81,9 +87,11 @@ let {
 			url={fileUrl}
 			documentId={doc.id}
 			bind:annotateMode={annotateMode}
+			transcribeMode={transcribeMode}
 			bind:activeAnnotationId={activeAnnotationId}
 			bind:activeAnnotationPage={activeAnnotationPage}
 			onAnnotationClick={onAnnotationClick}
+			onTranscriptionDraw={onTranscriptionDraw}
 			documentFileHash={doc.fileHash ?? null}
 		/>
 	{:else if fileUrl}