* {
     margin: 0;
     padding: 0;
     box-sizing: border-box
 }

 body {
     font-family: 'Plus Jakarta Sans', sans-serif
 }

 ::-webkit-scrollbar {
     width: 6px;
     height: 6px
 }

 ::-webkit-scrollbar-thumb {
     background: #6366f1;
     border-radius: 10px
 }

 @keyframes slideDown {
     from {
         opacity: 0;
         transform: translateY(-8px)
     }

     to {
         opacity: 1;
         transform: translateY(0)
     }
 }

 @keyframes scaleIn {
     from {
         opacity: 0;
         transform: scale(.9)
     }

     to {
         opacity: 1;
         transform: scale(1)
     }
 }

 @keyframes fadeIn {
     from {
         opacity: 0
     }

     to {
         opacity: 1
     }
 }

 @keyframes spin {
     to {
         transform: rotate(360deg)
     }
 }

 @keyframes toastIn {
     from {
         transform: translateX(120%);
         opacity: 0
     }

     to {
         transform: translateX(0);
         opacity: 1
     }
 }

 .slide-down {
     animation: slideDown .25s ease
 }

 .scale-in {
     animation: scaleIn .3s ease
 }

 .fade-in {
     animation: fadeIn .3s ease
 }

 .toast-anim {
     animation: toastIn .4s ease
 }

 .spin-icon {
     animation: spin 1s linear
 }

 .tab-content {
     display: none
 }

 .tab-content.active {
     display: block;
     animation: fadeIn .3s ease
 }