body {
    font-family: 'Poppins', sans-serif;
    background: #080b14;
    color: #ffffff;
    min-height: 100vh;
}

/* Custom Glow & Animation Effects */
.glow-box {
    box-shadow: 0 0 25px rgba(6, 182, 212, 0.25);
}
.glow-box-active {
    box-shadow: 0 0 30px rgba(6, 182, 212, 0.6);
    border-color: #06b6d4 !important;
}
.glow-btn {
    box-shadow: 0 4px 20px rgba(6, 182, 212, 0.4);
    transition: all 0.3s ease;
}
.glow-btn:hover {
    box-shadow: 0 6px 28px rgba(6, 182, 212, 0.7);
    transform: translateY(-2px);
}

/* Custom Pulse Keyframe */
@keyframes pulseGlow {
    0%, 100% { opacity: 1; filter: drop-shadow(0 0 10px rgba(6, 182, 212, 0.8)); }
    50% { opacity: 0.8; filter: drop-shadow(0 0 20px rgba(6, 182, 212, 1)); }
}
.pulse-dice {
    animation: pulseGlow 2s infinite ease-in-out;
}

/* Hardware-Accelerated Smooth 360-Degree Rotation */
@keyframes smoothSpin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}
.custom-spin {
    animation: smoothSpin 0.85s linear infinite;
    will-change: transform;
    display: inline-block;
}

/* 3D Page Flip Transitions */
@keyframes pageFlipOut {
    0% {
        opacity: 1;
        transform: perspective(1200px) rotateY(0deg) scale(1);
    }
    100% {
        opacity: 0;
        transform: perspective(1200px) rotateY(-90deg) scale(0.95);
    }
}
@keyframes pageFlipIn {
    0% {
        opacity: 0;
        transform: perspective(1200px) rotateY(90deg) scale(0.95);
    }
    100% {
        opacity: 1;
        transform: perspective(1200px) rotateY(0deg) scale(1);
    }
}
.animate-page-flip-out {
    animation: pageFlipOut 0.55s cubic-bezier(0.4, 0, 0.2, 1) forwards;
    transform-origin: left center;
    backface-visibility: hidden;
}
.animate-page-flip-in {
    animation: pageFlipIn 0.60s cubic-bezier(0.4, 0, 0.2, 1) forwards;
    transform-origin: right center;
    backface-visibility: hidden;
}

/* Custom Scrollbar for Chat */
::-webkit-scrollbar {
    width: 6px;
}
::-webkit-scrollbar-track {
    background: rgba(15, 23, 42, 0.6);
}
::-webkit-scrollbar-thumb {
    background: #334155;
    border-radius: 3px;
}
::-webkit-scrollbar-thumb:hover {
    background: #475569;
}

/* Safe Reveal Animations */
@keyframes flipInX {
    0% {
        opacity: 0;
        transform: translateY(18px) scale(0.96);
    }
    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}
.animate-flip-in {
    animation: flipInX 0.45s cubic-bezier(0.16, 1, 0.3, 1) forwards;
    width: 100%;
}

.animate-fade-in {
    animation: flipInX 0.3s ease-out forwards;
}

@keyframes dynamicDiceHero {
    0% {
        transform: translateY(0) rotate(0deg) scale(1);
        filter: drop-shadow(0 0 18px rgba(0, 240, 255, 0.9));
    }
    15% {
        transform: translateY(-18px) rotate(20deg) scale(1.1);
        filter: drop-shadow(0 0 30px rgba(6, 182, 212, 1));
    }
    30% {
        transform: translateY(0) rotate(-12deg) scale(0.95);
        filter: drop-shadow(0 0 20px rgba(59, 130, 246, 0.9));
    }
    45% {
        transform: translateY(-28px) rotate(180deg) scale(1.18);
        filter: drop-shadow(0 0 40px rgba(0, 240, 255, 1));
    }
    60% {
        transform: translateY(-2px) rotate(340deg) scale(1.02);
        filter: drop-shadow(0 0 22px rgba(6, 182, 212, 0.9));
    }
    70%, 74%, 78%, 82%, 86%, 90% {
        transform: translateY(-5px) rotate(360deg) scale(1.05) translate(2px, -2px);
        filter: drop-shadow(0 0 32px rgba(0, 240, 255, 1));
    }
    100% {
        transform: translateY(0) rotate(360deg) scale(1);
        filter: drop-shadow(0 0 18px rgba(0, 240, 255, 0.9));
    }
}
.hero-dice-anim {
    animation: dynamicDiceHero 4.5s infinite cubic-bezier(0.42, 0, 0.58, 1);
}