* {
     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
     }
 }

 @keyframes pulse {

     0%,
     100% {
         opacity: 1
     }

     50% {
         opacity: .5
     }
 }

 @keyframes pulse-ring {
     0% {
         box-shadow: 0 0 0 0 rgba(16, 185, 129, .5)
     }

     70% {
         box-shadow: 0 0 0 10px rgba(16, 185, 129, 0)
     }

     100% {
         box-shadow: 0 0 0 0 rgba(16, 185, 129, 0)
     }
 }

 .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
 }

 .pulse-live {
     animation: pulse 2s infinite
 }

 .pulse-ring {
     animation: pulse-ring 2s infinite
 }

 .tab-content {
     display: none
 }

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