@keyframes fadeIn {from{opacity:0;}to{opacity:1;}}@keyframes fadeOut {from{opacity:1;}to{opacity:0;}}@keyframes fadeInUp {from{opacity:0;transform:translateY(20px);}to{opacity:1;transform:translateY(0);}}@keyframes slideUp {from{opacity:0;transform:translateY(20px);}to{opacity:1;transform:translateY(0);}}@keyframes pulse {0%,
  100%{transform:scale(1);}50%{transform:scale(1.05);}}@keyframes float {0%,
  100%{transform:translateY(0);}50%{transform:translateY(-10px);}}@keyframes spin {from{transform:rotate(0deg);}to{transform:rotate(360deg);}}@keyframes shimmer {0%{background-position:-1000px 0;}100%{background-position:1000px 0;}}.visible .hero-title{animation:fadeInUp 0.8s ease forwards;}@keyframes scaleIn {0%{opacity:0;transform:scale(0.9);}100%{opacity:1;transform:scale(1);}}@keyframes shine {0%{left:-100%;}100%{left:100%;}}@keyframes skeleton {0%{background-position:-200px 0;}100%{background-position:calc(200px + 100%) 0;}}@keyframes sparkle {0%,
  100%{opacity:1;transform:scale(1) rotate(0deg);}25%{opacity:0.8;transform:scale(1.1) rotate(-5deg);}50%{opacity:1;transform:scale(1.15) rotate(5deg);}75%{opacity:0.9;transform:scale(1.05) rotate(-3deg);}}.grade-arrow{font-size:2.5rem;color:#3B6EF5;animation:arrowPulse 1.2s ease-in-out infinite;text-shadow:0 0 20px currentColor;}@keyframes arrowPulse {0%,
  100%{transform:translateX(0) scale(1);opacity:1;}50%{transform:translateX(8px) scale(1.1);opacity:0.8;}}.confetti{position:absolute;width:10px;height:10px;opacity:0;animation:confettiFall 3s ease-out forwards;}@keyframes confettiFall {0%{opacity:1;transform:translateY(-100vh) rotate(0deg);}100%{opacity:0;transform:translateY(100vh) rotate(720deg);}}@media (max-width: 600px) {.grade-arrow{font-size:2rem;}}.badge-notification{position:fixed;bottom:20px;right:20px;background:var(--bg-card);border:1px solid var(--border-color);border-radius:16px;padding:16px 20px;display:flex;align-items:center;gap:14px;box-shadow:0 10px 40px rgba(0, 0, 0, 0.2);z-index:10000;max-width:380px;opacity:0;transform:translateX(100%) scale(0.9);transition:all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);overflow:hidden;}.badge-notification.show{opacity:1;transform:translateX(0) scale(1);}.badge-notif-glow{position:absolute;top:-50%;left:-50%;width:200%;height:200%;border-radius:50%;filter:blur(60px);opacity:0.5;z-index:-1;animation:badgeGlowPulse 2s ease-in-out infinite;}@keyframes badgeGlowPulse {0%,
  100%{opacity:0.3;transform:scale(1);}50%{opacity:0.6;transform:scale(1.1);}}.badge-notif-icon{width:56px;height:56px;border-radius:14px;display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:0 4px 12px rgba(0, 0, 0, 0.2);animation:badgeIconBounce 0.6s ease-out 0.3s both;}.badge-notif-icon i{width:28px;height:28px;color:white;}@keyframes badgeIconBounce {0%{transform:scale(0);}50%{transform:scale(1.2);}100%{transform:scale(1);}}.badge-notif-content{flex:1;min-width:0;}.badge-notif-title{font-size:0.75rem;font-weight:600;color:var(--text-secondary);text-transform:uppercase;letter-spacing:0.5px;margin-bottom:2px;}.badge-notif-name{font-size:1.1rem;font-weight:700;color:var(--text-primary);margin-bottom:2px;}.badge-notif-desc{font-size:0.8rem;color:var(--text-secondary);line-height:1.3;}.badge-notif-rarity{position:absolute;top:8px;right:40px;font-size:0.6rem;font-weight:700;padding:3px 8px;border-radius:6px;letter-spacing:0.5px;}.badge-notif-rarity.common{background:rgba(148, 163, 184, 0.2);color:#94a3b8;}.badge-notif-rarity.uncommon{background:rgba(34, 197, 94, 0.2);color:#22c55e;}.badge-notif-rarity.rare{background:rgba(59, 110, 245, 0.2);color:var(--primary-accent);}.badge-notif-rarity.legendary{background:rgba(234, 179, 8, 0.2);color:#eab308;animation:legendaryShine 2s ease-in-out infinite;}@keyframes legendaryShine {0%,
  100%{box-shadow:0 0 0 rgba(234, 179, 8, 0);}50%{box-shadow:0 0 15px rgba(234, 179, 8, 0.5);}}.badge-notif-close{position:absolute;top:8px;right:8px;background:none;border:none;color:var(--text-secondary);cursor:pointer;padding:4px;border-radius:6px;transition:all 0.2s;}.badge-notif-close:hover{background:var(--bg-hover);color:var(--text-primary);}.badge-notif-close i{width:16px;height:16px;}@media (max-width: 480px) {.badge-notification{left:10px;right:10px;bottom:10px;max-width:none;transform:translateY(100%) scale(0.9);}.badge-notification.show{transform:translateY(0) scale(1);}}