v2.1: stylistic updates & countdown timer

src/lib/components/WinScreen.svelte

@@ -29,6 +29,7 @@
 	let hasWebShare = $derived(
 		typeof navigator !== "undefined" && "share" in navigator,
 	);
+	let copySuccess = $state(false);
 
 	// List of congratulations messages with weights
 	const congratulationsMessages: WeightedMessage[] = [
@@ -72,8 +73,7 @@
 </script>
 
 <div
-	class="mb-12 p-8 sm:p-12 w-full bg-linear-to-r from-green-400 to-green-600 text-white rounded-2xl shadow-2xl text-center"
-	in:fade={{ delay: 500 }}
+	class="p-8 sm:p-12 w-full bg-linear-to-r from-green-400 to-green-600 text-white rounded-2xl shadow-2xl text-center"
 >
 	<h2 class="text-2xl sm:text-4xl font-black mb-4 drop-shadow-lg">
 		{congratulationsMessage}
@@ -98,11 +98,21 @@
 			📤 Share
 		</button>
 		<button
-			onclick={copyToClipboard}
+			onclick={() => {
+				copyToClipboard();
+				copySuccess = true;
+				setTimeout(() => {
+					copySuccess = false;
+				}, 3000);
+			}}
 			data-umami-event="Copy to Clipboard"
-			class="mt-4 text-2xl font-bold p-2 bg-white/20 hover:bg-white/30 rounded-lg inline-block transition-all shadow-lg mx-2 cursor-pointer border-none appearance-none"
+			class={`mt-4 text-2xl font-bold p-2 rounded-lg inline-block transition-all shadow-lg mx-2 cursor-pointer border-none appearance-none ${
+				copySuccess
+					? "bg-green-400/50 hover:bg-green-500/60"
+					: "bg-white/20 hover:bg-white/30"
+			}`}
 		>
-			📋 Copy to clipboard
+			{copySuccess ? "✅ Copied!" : "📋 Copy to clipboard"}
 		</button>
 	{:else}
 		<button