@layer utilities {
    .content-auto {
        content-visibility: auto;
    }
    .card-hover {
        transition: all 0.3s ease;
    }
    .card-hover:hover {
        transform: translateY(-5px);
        box-shadow: 0 10px 25px -5px rgba(22, 93, 255, 0.3);
    }
}

#gamePlayWrapper {
    min-height: 400px;
    transition: all 0.3s ease;
}

#gamePlaceholder {
    transition: opacity 0.3s ease;
}

#playNowBtn:active {
    transform: scale(0.98);
}

#playNowBtn:disabled {
    background-color: #9ca3af !important;
    cursor: not-allowed !important;
}

@media (max-width: 768px) {
    #gamePlaceholder, #gameIframe {
        height: 400px !important;
    }
    #playNowBtn {
        width: 100%;
    }
}
