From 163751410fde8b834e43f05e4049d50f8add7b25 Mon Sep 17 00:00:00 2001
From: Haewon Kam <haewonkam@Haewons-MacBook-Pro.local>
Date: Sat, 4 Apr 2026 00:48:42 +0900
Subject: [PATCH] fix: reduce blob animation range + force GPU with translate3d
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Halved blob movement (30px→15px, 8vw→4vw) and reduced scale
(1.1→1.05). Using translate3d forces GPU compositing layer,
preventing main-thread layout recalculation that causes jitter.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 src/index.css | 16 ++++++++--------
 1 file changed, 8 insertions(+), 8 deletions(-)

diff --git a/src/index.css b/src/index.css
index 18881fa..c87de42 100644
--- a/src/index.css
+++ b/src/index.css
@@ -40,16 +40,16 @@
 
 @keyframes blob {
   0% {
-    transform: translate(0px, 0px) scale(1);
+    transform: translate3d(0, 0, 0) scale(1);
   }
   33% {
-    transform: translate(30px, -50px) scale(1.1);
+    transform: translate3d(15px, -25px, 0) scale(1.05);
   }
   66% {
-    transform: translate(-20px, 20px) scale(0.9);
+    transform: translate3d(-10px, 10px, 0) scale(0.95);
   }
   100% {
-    transform: translate(0px, 0px) scale(1);
+    transform: translate3d(0, 0, 0) scale(1);
   }
 }
 
@@ -112,16 +112,16 @@
 
 @keyframes blob-large {
   0% {
-    transform: translate(0px, 0px) scale(1);
+    transform: translate3d(0, 0, 0) scale(1);
   }
   33% {
-    transform: translate(8vw, -8vh) scale(1.1);
+    transform: translate3d(4vw, -4vh, 0) scale(1.05);
   }
   66% {
-    transform: translate(-8vw, 8vh) scale(0.9);
+    transform: translate3d(-4vw, 4vh, 0) scale(0.95);
   }
   100% {
-    transform: translate(0px, 0px) scale(1);
+    transform: translate3d(0, 0, 0) scale(1);
   }
 }