From 3b3111b5deab947f579b7c77a859166075b5e89f Mon Sep 17 00:00:00 2001
From: schmop <lars.richard@rocketmail.com>
Date: Sun, 31 May 2026 18:17:13 +0200
Subject: [PATCH] =?UTF-8?q?Levelauswahl:=20Wolken-Symbol=20auf=20heller=20?=
 =?UTF-8?q?Karte=20sichtbar=20(T=C3=B6nung=20+=20Kontur)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/lib/components/home/NumberCard.svelte | 9 +++++++--
 src/lib/components/svg/Cloud.svelte       | 6 ++++--
 2 files changed, 11 insertions(+), 4 deletions(-)

diff --git a/src/lib/components/home/NumberCard.svelte b/src/lib/components/home/NumberCard.svelte
index b6f17b1..e3c535f 100644
--- a/src/lib/components/home/NumberCard.svelte
+++ b/src/lib/components/home/NumberCard.svelte
@@ -27,8 +27,13 @@
   <span class="number">{target}</span>
   <span class="best" aria-hidden="true">
     {#if runs > 0}
-      {@const Best = SYMBOL[bestStage].c}
-      <Best size={SYMBOL[bestStage].size} />
+      {#if bestStage === 2}
+        <!-- Auf der hellen Karte braucht die Wolke Farbe/Kontur, sonst weiß auf weiß. -->
+        <Cloud size={50} fill="#cfe2ff" stroke="#7e97c4" />
+      {:else}
+        {@const Best = SYMBOL[bestStage].c}
+        <Best size={SYMBOL[bestStage].size} />
+      {/if}
     {/if}
   </span>
 </button>
diff --git a/src/lib/components/svg/Cloud.svelte b/src/lib/components/svg/Cloud.svelte
index f510e38..da11ace 100644
--- a/src/lib/components/svg/Cloud.svelte
+++ b/src/lib/components/svg/Cloud.svelte
@@ -4,11 +4,13 @@
     size = 100,
     opacity = 1,
     variant = 0,
-  }: { size?: number; opacity?: number; variant?: number } = $props();
+    fill = 'var(--c-cloud)',
+    stroke = '#cad6e8',
+  }: { size?: number; opacity?: number; variant?: number; fill?: string; stroke?: string } = $props();
 </script>
 
 <svg width={size} height={size * 0.6} viewBox="0 0 120 70" xmlns="http://www.w3.org/2000/svg" {opacity} aria-hidden="true">
-  <g fill="var(--c-cloud)" stroke="#cad6e8" stroke-width="2">
+  <g {fill} {stroke} stroke-width="2">
     {#if variant === 1}
       <ellipse cx="26" cy="44" rx="20" ry="16" />
       <ellipse cx="52" cy="30" rx="24" ry="20" />