* {
    box-sizing: border-box;
}

body {
    font-family: 'Bricolage Grotesque', sans-serif;
    margin: 0;
    padding: 0;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.font-display {
    font-family: 'Bricolage Grotesque', sans-serif;
}

.font-mono {
    font-family: 'Space Mono', monospace;
}

@keyframes gradient {
    0%, 100% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
}

.animate-gradient {
    background-size: 200% 200%;
    animation: gradient 4s ease infinite;
}

@keyframes emojiPop {
    0% { transform: scale(0); opacity: 0; }
    50% { transform: scale(1.3); }
    100% { transform: scale(1); opacity: 1; }
}

.emoji-pop {
    animation: emojiPop 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55) forwards;
}

@keyframes vibePulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.7; }
}

.vibe-pulse {
    animation: vibePulse 2s ease-in-out infinite;
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}

.animate-fade-in {
    animation: fadeIn 0.6s ease-out forwards;
}

@keyframes bounceIn {
    0% { transform: scale(0.3); opacity: 0; }
    50% { transform: scale(1.05); }
    70% { transform: scale(0.9); }
    100% { transform: scale(1); opacity: 1; }
}

.animate-bounce-in {
    animation: bounceIn 0.6s cubic-bezier(0.68, -0.55, 0.265, 1.55) forwards;
}

/* Custom scrollbar */
::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.05);
    border-radius: 10px;
}

::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.2);
    border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
    background: rgba(255, 255, 255, 0.3);
}

/* Prevent text selection on buttons */
button {
    user-select: none;
    -webkit-user-select: none;
}

/* Glass effect enhancement */
.backdrop-blur-sm {
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.backdrop-blur-md {
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

/* Mobile touch improvements */
@media (hover: none) {
    button:active {
        transform: scale(0.95);
    }
}

/* Smooth page transitions */
#root {
    min-height: 100vh;
}