 <!DOCTYPE css>
 <script>
        // Glitch text effect
        function glitchText(element) {
            const originalText = element.textContent;
            const glitchChars = '!@#$%^&*()_+-={}[]|;:,.<>?';
            let glitchedText = '';
            for (let i = 0; i < originalText.length; i++) {
                if (Math.random() < 0.1) {
                    glitchedText += glitchChars[Math.floor(Math.random() * glitchChars.length)];
                } else {
                    glitchedText += originalText[i];
                }
            }
            element.textContent = glitchedText;
            setTimeout(() => element.textContent = originalText, 100);
        }

        // Apply glitch effect randomly
        function applyRandomGlitch() {
            const glitchTexts = document.querySelectorAll('.glitch-text');
            const randomElement = glitchTexts[Math.floor(Math.random() * glitchTexts.length)];
            glitchText(randomElement);
        }

        setInterval(applyRandomGlitch, 2000);

        // Interactive cursor effect
        document.addEventListener('click', (e) => {
            const ripple = document.createElement('div');
            ripple.classList.ad// Interactive cursor effect
        document.addEventListener('click', (e) => {
            const ripple = document.createElement('div');
            ripple.classList.add('cursor-ripple');
            ripple.style.left = e.clientX + 'px';
            ripple.style.top = e.clientY + 'px';
            document.body.appendChild(ripple);
            setTimeout(() => ripple.remove(), 1000);
        });

        // Dynamic background shift
        function shiftBackground() {
            const hue = (Date.now() / 100) % 360;
            document.body.style.backgroundColor = `hsl(${hue}, 20%, 5%)`;
            requestAnimationFrame(shiftBackground);
        }

        shiftBackground();

        // Interactive images
        const interactiveImages = document.querySelectorAll('.interactive-image');
        interactiveImages.forEach(img => {
            img.addEventListener('mouseover', () => {
                const randomX = Math.random() * 20 - 10;
                const randomY = Math.random() * 20 - 10;
                img.style.transform = `translate(${randomX}px, ${randomY}px) scale(1.1) rotate(${Math.random() * 20 - 10}deg)`;
            });
            img.addEventListener('mouseout', () => {
                img.style.transform = 'translate(0, 0) scale(1) rotate(0deg)';
            });
        });

        // 3D objects interaction
        const objects = document.querySelectorAll('.object');
        objects.forEach(obj => {
            obj.addEventListener('mouseover', () => {
                obj.style.transform = 'rotate(45deg) scale(1.2)';
                obj.style.boxShadow = '0 0 20px var(--neon-purple)';
            });
            obj.addEventListener('mouseout', () => {
                obj.style.transform = 'rotate(0deg) scale(1)';
                obj.style.boxShadow = 'none';
            });
            obj.addEventListener('click', () => {
                const shapes = ['cube', 'sphere', 'pyramid', 'cylinder', 'torus'];
                const currentShape = obj.getAttribute('data-shape');
                const currentIndex = shapes.indexOf(currentShape);
                const nextIndex = (currentIndex + 1) % shapes.length;
                obj.setAttribute('data-shape', shapes[nextIndex]);
                obj.textContent = shapes[nextIndex];
            });
        });

        // Audio glitch effect
        const audioContext = new (window.AudioContext || window.webkitAudioContext)();

        function playGlitchSound() {
            const oscillator = audioContext.createOscillator();
            const gainNode = audioContext.createGain();

            oscillator.type = 'sawtooth';
            oscillator.frequency.setValueAtTime(Math.random() * 1000 + 200, audioContext.currentTime);
            gainNode.gain.setValueAtTime(0.1, audioContext.currentTime);

            oscillator.connect(gainNode);
            gainNode.connect(audioContext.destination);

            oscillator.start();
            oscillator.stop(audioContext.currentTime + 0.1);
        }

        document.addEventListener('mousemove', () => {
            if (Math.random() < 0.01) playGlitchSound();
        });

        // Glitchy effect for flip cards
        const flipCards = document.querySelectorAll('.flip-card');
        flipCards.forEach(card => {
            card.addEventListener('mouseover', () => {
                const glitchInterval = setInterval(() => {
                    card.style.transform = `translate(${Math.random() * 5 - 2.5}px, ${Math.random() * 5 - 2.5}px)`;
                }, 50);
                card.addEventListener('mouseout', () => {
                    clearInterval(glitchInterval);
                    card.style.transform = 'translate(0, 0)';
                }, { once: true });
            });
        });

        // Enhanced 3D object interaction
        const cube = document.querySelector('.cube');
        document.addEventListener('mousemove', (e) => {
            const x = (e.clientX / window.innerWidth - 0.5) * 20;
            const y = (e.clientY / window.innerHeight - 0.5) * 20;
            cube.style.transform = `rotateX(${y}deg) rotateY(${x}deg)`;
        });
    </script>
</body>
</html>