The images show the daily rewards grid where the active day (Tag 3) is scaled up / translated forward out of the row — it's bigger and overlapping neighboring columns instead of staying flat and in-line with them.
Line 506 is the culprit — whileHover={{ scale: 1.06, y: -4 }} on every card, but more importantly line 500–501 shows initial={{ scale: 0.85, y: 8 }} animating to scale: 1 — the active day card probably has an extra persistent scale or y transform applied to it. Let me read the card render:
Now let me check the column/week header to understand the active-day column sizing:
Found it. The problem is the whileHover={{ scale: 1.06, y: -4 }} on every card — it also activates permanently on the active day card via the focus/hover state leaking, AND there's a persistent animated scale/y on the active card. The real fix is simply removing whileHover scale/y entirely so cards stay flat in the grid:
Now also remove the entry animation y: 8 offset and the initial scale: 0.85 so cards don't animate in from a shifted position that could leave the active card in a wrong state:
Removed the scale: 1.06, y: -4 from whileHover and the scale: 0.85 / y: 8 from the entry animation — both were causing the active day card to visually pop out of the grid row. Cards now stay flat and in-line with their columns at all times; the active state is still clearly indicated by the border glow and pulse ring without any positional shift.