From d32d229ee6763b8e17da68f5a79995c0cfc3395a Mon Sep 17 00:00:00 2001
From: Jose Henrique <jose.henrique.ivan@gmail.com>
Date: Sun, 14 Jun 2026 15:32:15 -0300
Subject: [PATCH] fixing animation

---
 GUIDELINES-ESTILO.md                          | 19 +++++++++----------
 .../src/components/FlashcardStudySession.css  | 17 ++++++++---------
 .../src/components/FlashcardStudySession.tsx  |  4 ++--
 3 files changed, 19 insertions(+), 21 deletions(-)

diff --git a/GUIDELINES-ESTILO.md b/GUIDELINES-ESTILO.md
index 366d346..2aa54ac 100644
--- a/GUIDELINES-ESTILO.md
+++ b/GUIDELINES-ESTILO.md
@@ -434,9 +434,8 @@ Metadados (rótulos, tags, estatísticas): `text-transform: uppercase`, `letter-
 }
 
 @keyframes cardExit {
-  0%   { transform: translateX(0) rotateY(180deg) rotateZ(0); opacity: 1; }
-  45%  { transform: translateX(28px) rotateY(180deg) rotateZ(2deg); opacity: .9; }
-  100% { transform: translateX(-32px) rotateY(180deg) rotateZ(-2deg); opacity: 0; }
+  0%   { transform: rotateY(180deg) translateY(0); opacity: 1; }
+  100% { transform: rotateY(180deg) translateY(-44px); opacity: 0; }
 }
 ```
 
@@ -498,13 +497,13 @@ Metadados (rótulos, tags, estatísticas): `text-transform: uppercase`, `letter-
 .stamp.correct { color: var(--green-deep); }
 .stamp.wrong   { color: var(--red-deep); }
 
-.stamp.show { animation: stampIn .7s var(--ease); }
+.stamp.show { animation: stampIn .42s var(--ease); }
 
 @keyframes stampIn {
-  0%   { opacity: 0; transform: rotate(-18deg) scale(1.8); }
-  38%  { opacity: 1; transform: rotate(-10deg) scale(.9); }
-  58%  { transform: rotate(-12deg) scale(1.04); }
-  100% { opacity: 0; transform: rotate(-12deg) scale(1); }
+  0%   { opacity: 0; transform: rotate(-14deg) scale(0.6); }
+  55%  { opacity: 1; transform: rotate(-7deg) scale(1.08); }
+  75%  { transform: rotate(-8deg) scale(0.95); }
+  100% { opacity: 1; transform: rotate(-8deg) scale(1); }
 }
 ```
 
@@ -585,8 +584,8 @@ Metadados (rótulos, tags, estatísticas): `text-transform: uppercase`, `letter-
 | Animação | Gatilho | Duração |
 | --- | --- | --- |
 | Virada do flashcard (`rotateY(180deg)`) | Clique/Espaço/Enter | `.78s` |
-| Saída do cartão (`cardExit`) | Marcar Correto/Incorreto | `.58s` |
-| Carimbo (`stampIn`) | Marcar Correto/Incorreto | `.7s` |
+| Saída do cartão (`cardExit`) | Marcar Correto/Incorreto | `.52s` |
+| Carimbo (`stampIn`) | Marcar Correto/Incorreto | `.42s` |
 | Brilho do botão (hover) | Hover | `.55s` |
 | Confete (`confettiFly`) | Marcar Correto | `850ms` |
 | Revelação dos controles (`.controls.ready`) | Revelação da resposta | `.35s` |
diff --git a/Mindforge.Web/src/components/FlashcardStudySession.css b/Mindforge.Web/src/components/FlashcardStudySession.css
index e2a8d4d..9e003b7 100644
--- a/Mindforge.Web/src/components/FlashcardStudySession.css
+++ b/Mindforge.Web/src/components/FlashcardStudySession.css
@@ -138,7 +138,7 @@
 }
 
 .study-flashcard.is-reviewed {
-  animation: studyCardExit .58s var(--ease);
+  animation: studyCardExit .52s var(--ease) forwards;
 }
 
 .study-card-face {
@@ -361,7 +361,7 @@
 }
 
 .study-stamp.show {
-  animation: studyStampIn .7s var(--ease);
+  animation: studyStampIn .42s var(--ease);
 }
 
 .study-nav-row {
@@ -509,16 +509,15 @@
 }
 
 @keyframes studyCardExit {
-  0%   { transform: translateX(0) rotateY(180deg) rotateZ(0); opacity: 1; }
-  45%  { transform: translateX(28px) rotateY(180deg) rotateZ(2deg); opacity: .9; }
-  100% { transform: translateX(-32px) rotateY(180deg) rotateZ(-2deg); opacity: 0; }
+  0%   { transform: rotateY(180deg) translateY(0); opacity: 1; }
+  100% { transform: rotateY(180deg) translateY(-44px); opacity: 0; }
 }
 
 @keyframes studyStampIn {
-  0%   { opacity: 0; transform: rotate(-18deg) scale(1.8); }
-  38%  { opacity: 1; transform: rotate(-10deg) scale(.9); }
-  58%  { transform: rotate(-12deg) scale(1.04); }
-  100% { opacity: 0; transform: rotate(-12deg) scale(1); }
+  0%   { opacity: 0; transform: rotate(-14deg) scale(0.6); }
+  55%  { opacity: 1; transform: rotate(-7deg) scale(1.08); }
+  75%  { transform: rotate(-8deg) scale(0.95); }
+  100% { opacity: 1; transform: rotate(-8deg) scale(1); }
 }
 
 @media (max-width: 1120px) {
diff --git a/Mindforge.Web/src/components/FlashcardStudySession.tsx b/Mindforge.Web/src/components/FlashcardStudySession.tsx
index 9a32bad..f43bc2e 100644
--- a/Mindforge.Web/src/components/FlashcardStudySession.tsx
+++ b/Mindforge.Web/src/components/FlashcardStudySession.tsx
@@ -199,12 +199,12 @@ export function FlashcardStudySession({ cards, onAnswer, onEnd }: FlashcardStudy
       stampTimerRef.current = window.setTimeout(() => {
         setCardExiting(true);
         stampTimerRef.current = null;
-      }, 90);
+      }, 160);
 
       advanceTimerRef.current = window.setTimeout(() => {
         advanceCard();
         advanceTimerRef.current = null;
-      }, 760);
+      }, 700);
     } catch (err: any) {
       resetTimeout(stampTimerRef);
       resetTimeout(advanceTimerRef);