fix(richtlinien): improve examples, copy, and Wikipedia link

- Rule cards now show before→after examples; strikethrough rule input
  renders with CSS line-through so the visual context is honest
- Illegible-words rule shows output only — can't represent unreadable
  text as readable characters
- Intro drops fictional family names in favour of "egal wer tippt"
- Wikipedia card copy is more direct; link uses icon instead of
  parenthetical "(öffnet in neuem Tab)" text

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

frontend/src/lib/components/RichtlinienRuleCard.svelte

@@ -3,11 +3,21 @@ type Props = {
 	icon: string;
 	title: string;
 	body: string;
+	beispielInput?: string;
+	beispielInputStrike?: boolean;
 	beispielOutput?: string;
 	beispielLabel?: string;
 };
 
-let { icon, title, body, beispielOutput, beispielLabel = 'Beispiel' }: Props = $props();
+let {
+	icon,
+	title,
+	body,
+	beispielInput,
+	beispielInputStrike = false,
+	beispielOutput,
+	beispielLabel = 'Beispiel'
+}: Props = $props();
 </script>
 
 <div class="border-brand-sand break-inside-avoid rounded-sm border bg-white p-5 shadow-sm">
@@ -23,7 +33,13 @@ let { icon, title, body, beispielOutput, beispielLabel = 'Beispiel' }: Props = $
 				{beispielLabel}
 			</p>
 			<p class="mt-1 font-sans text-sm text-ink">
-				→ <code class="font-mono">{beispielOutput}</code>
+				{#if beispielInput !== undefined}
+					<code
+						class={['font-mono', beispielInputStrike && 'line-through'].filter(Boolean).join(' ')}
+						>{beispielInput}</code
+					> →
+				{/if}
+				<code class="font-mono">{beispielOutput}</code>
 			</p>
 		</div>
 	{/if}