@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap');

 * {
     font-family: 'Poppins', sans-serif;
 }

 .gradient-bg {
     background: linear-gradient(135deg, #4c63d2 0%, #5a4fcf 100%);
 }

 .floating {
     animation: float 6s ease-in-out infinite;
 }

 @keyframes float {

     0%,
     100% {
         transform: translateY(0px);
     }

     50% {
         transform: translateY(-20px);
     }
 }

 .pulse-glow {
     animation: pulseGlow 2s ease-in-out infinite alternate;
 }

 @keyframes pulseGlow {
     from {
         box-shadow: 0 0 20px rgba(59, 130, 246, 0.5);
     }

     to {
         box-shadow: 0 0 40px rgba(59, 130, 246, 0.8), 0 0 60px rgba(59, 130, 246, 0.4);
     }
 }

 .sentiment-card {
     backdrop-filter: blur(20px);
     background: rgba(255, 255, 255, 0.15);
     border: 1px solid rgba(255, 255, 255, 0.3);
     transition: all 0.3s ease;
 }

 .sentiment-card:hover {
     transform: translateY(-5px);
     box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
 }

 .emoji-bounce {
     animation: emojiBounce 1s ease-in-out infinite;
 }

 @keyframes emojiBounce {

     0%,
     20%,
     50%,
     80%,
     100% {
         transform: translateY(0);
     }

     40% {
         transform: translateY(-10px);
     }

     60% {
         transform: translateY(-5px);
     }
 }

 .sparkle {
     position: relative;
     overflow: hidden;
 }

 .sparkle::before {
     content: '';
     position: absolute;
     top: -50%;
     left: -50%;
     width: 200%;
     height: 200%;
     background: linear-gradient(45deg, transparent, rgba(255, 255, 255, 0.3), transparent);
     transform: rotate(45deg);
     animation: sparkle 3s linear infinite;
 }

 @keyframes sparkle {
     0% {
         transform: translateX(-100%) translateY(-100%) rotate(45deg);
     }

     100% {
         transform: translateX(100%) translateY(100%) rotate(45deg);
     }
 }
 .typewriter {
            overflow: hidden;
            border-right: 2px solid;
            white-space: nowrap;
            animation: typing 3s steps(40, end), blink-caret 0.75s step-end infinite;
        }
        
        @keyframes typing {
            from { width: 0; }
            to { width: 100%; }
        }
        
        @keyframes blink-caret {
            from, to { border-color: transparent; }
            50% { border-color: currentColor; }
        }
        
.neon-text {
            /* Neon effect removed */
        }
        
        .chart-container {
            position: relative;
            background: rgba(255, 255, 255, 0.12);
            backdrop-filter: blur(10px);
            border-radius: 20px;
            padding: 20px;
            border: 1px solid rgba(255, 255, 255, 0.25);
        }
        
        .word-tag {
            transition: all 0.3s ease;
            cursor: pointer;
        }
        
        .word-tag:hover {
            transform: scale(1.1);
            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
        }
        
        .loading-dots {
            display: inline-block;
        }
        
        .loading-dots::after {
            content: '';
            animation: dots 1.5s steps(4, end) infinite;
        }
        
        @keyframes dots {
            0%, 20% { content: ''; }
            40% { content: '.'; }
            60% { content: '..'; }
            80%, 100% { content: '...'; }
        }