* {
       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 bell-ring {

       0%,
       100% {
           transform: rotate(0)
       }

       25% {
           transform: rotate(15deg)
       }

       75% {
           transform: rotate(-15deg)
       }
   }

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

   .bell-ring {
       animation: bell-ring 1s ease-in-out infinite
   }

   .tab-content {
       display: none
   }

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