From 16131751127068a9bf1fdb81645d1674e832aaab Mon Sep 17 00:00:00 2001
From: Michael Czechowski <mail@dailysh.it>
Date: Wed, 14 Jan 2026 15:44:58 +0100
Subject: [PATCH] feat(animation): add bowl smiley peek animation on success

Bowl mascot now peeks up from bottom right corner when a lesson
is completed, synced with the existing "Crispyyyyyy!" animation.
---
 src/main.css | 38 ++++++++++++++++++++++++++++++++++++++
 1 file changed, 38 insertions(+)

diff --git a/src/main.css b/src/main.css
index e787cac..fc9e545 100644
--- a/src/main.css
+++ b/src/main.css
@@ -712,6 +712,44 @@ kbd {
 	}
 }
 
+/* Bowl smiley peek animation from bottom right corner */
+.preview-section.matched::after {
+	content: "";
+	position: absolute;
+	bottom: 0;
+	right: 40px;
+	width: 80px;
+	height: 80px;
+	background: url("/bowl.png") center/contain no-repeat;
+	z-index: 20;
+	pointer-events: none;
+	animation: bowl-peek 3s ease-in-out forwards;
+	transform: translateY(100%);
+}
+
+@keyframes bowl-peek {
+	0% {
+		transform: translateY(100%);
+		opacity: 0;
+	}
+	15% {
+		opacity: 1;
+	}
+	30% {
+		transform: translateY(30%);
+	}
+	50% {
+		transform: translateY(30%);
+	}
+	70% {
+		transform: translateY(30%);
+	}
+	100% {
+		transform: translateY(100%);
+		opacity: 0;
+	}
+}
+
 @keyframes crispy-bounce {
 	0% {
 		top: 100%;