html{
            scroll-behavior: smooth;
        } 
        .glass {
            background: rgba(255, 255, 255, 0.05);
            backdrop-filter: blur(10px);
            -webkit-backdrop-filter: blur(10px);
            border: 1px solid rgba(255, 255, 255, 0.1);
        }
        
        .glass-dark {
            background: rgba(18, 18, 18, 0.8);
            backdrop-filter: blur(10px);
            -webkit-backdrop-filter: blur(10px);
            border: 1px solid rgba(255, 255, 255, 0.05);
        }
        
        .bg-orange-500\/80 {
            background-color: rgba(249, 115, 22, 0.8);
        }
         
        .bg-tiktok-gradient {
            background: linear-gradient(90deg, #FF0050, #08FFF9);
            background-size: 200% 200%;
            animation: gradient 8s linear infinite;
        }
        
        .text-tiktok-gradient {
            background: linear-gradient(90deg, #FF0050, #08FFF9);
            -webkit-background-clip: text;
            background-clip: text;
            color: transparent;
            background-size: 200% 200%;
            animation: gradient 8s linear infinite;
        }
         
        .neon-text {
            text-shadow: 0 0 5px rgba(255, 0, 80, 0.7), 0 0 10px rgba(8, 255, 249, 0.5);
        }
        
        .neon-box {
            box-shadow: 0 0 10px rgba(255, 0, 80, 0.7), 0 0 20px rgba(8, 255, 249, 0.5);
        }
         
        ::-webkit-scrollbar {
            width: 6px;
            height: 6px;
        }
        
        ::-webkit-scrollbar-track {
            background: #121212;
        }
        
        ::-webkit-scrollbar-thumb {
            background: linear-gradient(180deg, #FF0050, #08FFF9);
            border-radius: 3px;
        }
         
        .marquee-container {
            width: 100%;
            overflow: hidden;
            white-space: nowrap;
            position: relative;
        }
        
        .marquee-content {
            display: inline-block;
            animation: marquee 25s linear infinite;
        }
        
        .marquee-content:hover {
            animation-play-state: paused;
        }
         
        .card-3d {
            transform-style: preserve-3d;
            transition: all 0.3s ease;
        }
        
        .card-3d:hover {
            transform: translateY(-10px) rotateX(5deg) rotateY(5deg);
        }
         
        #particles-js {
            position: absolute;
            width: 100%;
            height: 100%;
            z-index: -1;
        } 
        .step-line {
            height: 2px;
            background: linear-gradient(90deg, #FF0050 0%, #FF0050 var(--progress, 0%), #2D2D2D var(--progress, 0%), #2D2D2D 100%);
            transition: --progress 0.3s ease;
        }
         
        .shine {
            position: relative;
            overflow: hidden;
        }
        
        .shine:hover::after {
            transform: translateX(500%) rotate(30deg);
        }
         
        .floating {
            animation: float 6s ease-in-out infinite;
        }