.dashboard-credit-card { animation: dashboardCardArrive .72s cubic-bezier(.22,.8,.26,1) both; transform-origin: center bottom; }
.dashboard-credit-total { display: inline-block; font-variant-numeric: tabular-nums; animation: dashboardCreditSettle .9s .22s cubic-bezier(.2,.75,.25,1) both; }
.dashboard-credit-card .overview-sun { animation: dashboardSunWake 1.25s .15s cubic-bezier(.2,.75,.25,1) both; }
.dashboard-credit-card .overview-sun i { animation: dashboardSunGlow 2.8s 1.1s ease-in-out infinite; }
@keyframes dashboardCardArrive { from { opacity: 0; transform: translateY(14px) scale(.992); box-shadow: 0 6px 18px rgba(54,34,112,.02); } to { opacity: 1; transform: none; } }
@keyframes dashboardCreditSettle { 0% { opacity: .25; transform: translateY(7px); filter: blur(2px); } 72% { opacity: 1; transform: translateY(-2px) scale(1.025); filter: none; } 100% { transform: none; } }
@keyframes dashboardSunWake { from { opacity: 0; transform: translateY(-16px) scale(.7); } to { opacity: .72; transform: none; } }
@keyframes dashboardSunGlow { 0%,100% { box-shadow: 0 0 0 12px #fff8e8,0 0 0 0 rgba(255,173,77,.18); } 50% { box-shadow: 0 0 0 12px #fff8e8,0 0 0 18px rgba(255,173,77,0); } }
@media (prefers-reduced-motion: reduce) { .dashboard-credit-card,.dashboard-credit-total,.dashboard-credit-card .overview-sun,.dashboard-credit-card .overview-sun i { animation: none !important; } }