@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700;800;900&display=swap');

        body {
            font-family: 'Inter', sans-serif;
            margin: 0;
            padding: 0;
            /* Dark gradient background for the whole page */
            background: linear-gradient(135deg, #1a202c, #2d3748, #4a5568);
            min-height: 100vh;
            display: flex;
            align-items: center;
            justify-content: center;
            color: white;
            /* Changed from 'overflow: hidden;' to 'overflow-y: auto;' to allow vertical scrolling */
            overflow-y: auto;
        }

        /* Keyframe animations */
        @keyframes fade-in-down {
            0% { opacity: 0; transform: translateY(-20px); }
            100% { opacity: 1; transform: translateY(0); }
        }
        @keyframes fade-in-up {
            0% { opacity: 0; transform: translateY(20px); }
            100% { opacity: 1; transform: translateY(0); }
        }
        @keyframes fade-in {
            0% { opacity: 0; }
            100% { opacity: 1; }
        }
        @keyframes zoom-in {
            0% { transform: scale(0.9); opacity: 0; }
            100% { transform: scale(1); opacity: 1; }
        }
        @keyframes pulse {
            0%, 100% { opacity: 1; }
            50% { opacity: .75; }
        }

        .animate-fade-in-down { animation: fade-in-down 0.8s ease-out forwards; }
        .animate-fade-in-up { animation: fade-in-up 0.8s ease-out forwards; animation-delay: 0.2s; }
        .animate-fade-in { animation: fade-in 0.3s ease-out forwards; }
        .animate-zoom-in { animation: zoom-in 0.3s ease-out forwards; }
        .animate-pulse { animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite; }

        /* Specific styling for game cells */
        .cell {
            background-color: #2d3748; /* Darker gray for cells */
            border: 1px solid #4a5568; /* Lighter border for contrast */
            box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3);
        }
        .cell:hover {
            background-color: #4a5568; /* Slightly lighter on hover */
        }

        /* Specific styling for modal background */
        .modal-overlay {
            background-color: rgba(0, 0, 0, 0.8);
        }