:root {
            /* Ensure these match your site's main.css or define fallback */
            --main-color: #1A48EE;
            --secondary-color: #008AFF;
            --tertiary-color: #2c20E6;
            --secondary-background: #f9f9f9;
            --main-background: #e5f3ff;
            --tertiary-background: #e6e5ea;
            --color-white: #ffffff;
            --color-error-dark: #c53030;
            --color-green: #16a34a;
            --border-color: #e2e8f0;
            --color-gray: #4a5568;
            
            /* Game UI Variables */
            --bg-color: var(--main-background);
            --ui-bg: var(--color-white);
            --text-color: var(--color-gray);
        }

        /* Screen Reader Only Helper */
        .sr-only {
            position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
            overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
        }

        /* Game Header */
        #game-header {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 10px 20px;
            background-color: var(--ui-bg);
            border: 1px solid var(--border-color);
            border-radius: 8px 8px 0 0;
            color: var(--main-color);
            font-size: 18px;
            font-weight: bold;
            box-shadow: 0 3px 10px rgba(0, 0, 0, 0.05);
            /* Removed fixed max-width initially, handled by JS */
            flex-shrink: 0;
            margin: 0 auto; /* Center it */
            max-width: 100%; /* Ensure responsiveness */
            box-sizing: border-box; /* Include padding in width */
        }

        /* Game Board Container */
        #game-container {
            position: relative;
            background-color: #000000;
            border: 1px solid var(--border-color);
            border-top: none;
            box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
            touch-action: none;
            overflow: hidden;
            border-radius: 0 0 8px 8px;
            flex-shrink: 0;
            margin-bottom: 20px;
            /* Width handled by JS to match canvas */
            margin: 0 auto 20px auto; /* Center it */
            max-width: 100%; /* Prevent horizontal scroll */
            width: 100%; /* Ensure it fills available space up to max-width set by JS */
        }

        /* Layout wrapper for Game + Ad */
        #game-layout {
            display: flex;
            flex-direction: column;
            align-items: center;
            width: 100%;
        }

        @media screen and (min-width: 1400px) {
            #game-layout {
                flex-direction: row;
                justify-content: center;
                align-items: flex-start;
                gap: 20px;
            }
            
            /* On large screens, the game container shouldn't necessarily center itself via margin: auto if using flex gap */
            #game-container {
                margin: 0 0 20px 0; 
            }
        }

        canvas {
            display: block;
            background-color: #000000;
            outline: none;
            margin: 0 auto; /* Center canvas in container */
            max-width: 100%; /* Ensure canvas scales down on small screens */
            height: auto; /* Maintain aspect ratio */
        }
        
        canvas:focus {
            box-shadow: 0 0 0 4px var(--main-color);
        }

        /* Game specific button styles */
        #game-header .icon-btn {
            background: var(--tertiary-background);
            border: 1px solid var(--border-color);
            color: var(--main-color);
            font-size: 16px;
            cursor: pointer;
            padding: 6px 10px;
            margin-left: 8px;
            border-radius: 6px;
            transition: all 0.2s;
        }
        #game-header .icon-btn:hover { background: var(--secondary-background); color: #fff; }
        #game-header .icon-btn:focus { outline: 2px solid var(--main-color); }

        /* Overlays */
        #start-screen, #game-over-screen, #level-screen, #settings-screen {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            background-color: var(--ui-bg);
            border: 1px solid var(--border-color);
            padding: 2rem;
            text-align: center;
            border-radius: 12px;
            box-shadow: 0 20px 50px rgba(0, 0, 0, 0.15);
            z-index: 10;
            min-width: 280px;
            max-width: 90%;
            width: 100%; /* Ensure it doesn't overflow on very small screens */
            box-sizing: border-box;
        }

        .overlay-title { color: var(--main-color); margin: 0 0 10px 0; font-size: 1.8rem; }
        
        .game-main-btn {
            background-color: var(--main-color);
            color: var(--color-white);
            font-weight: bold;
            padding: 0.75rem 2rem;
            border: none;
            border-radius: 0.5rem;
            box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
            transition: background-color 0.3s;
            cursor: pointer;
            font-size: 1rem;
            margin-top: 15px;
            width: 100%; /* Full width for consistency */
        }
        .game-main-btn:hover { background-color: var(--secondary-color); }
        .game-main-btn:focus { outline: 3px solid #000; }
        
        .game-secondary-btn {
            background-color: var(--tertiary-background);
            color: var(--main-color);
            border: 1px solid var(--border-color);
            font-weight: bold;
            padding: 0.75rem 2rem;
            border-radius: 0.5rem;
            transition: background-color 0.3s;
            cursor: pointer;
            font-size: 0.9rem;
            margin-top: 10px;
            width: 100%;
        }
        .game-secondary-btn:hover { background-color: var(--secondary-background); }

        .hidden { display: none !important; }

        /* Settings */
        .setting-row {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-bottom: 12px;
            text-align: left;
            font-size: 0.95rem;
            color: var(--text-color);
        }
        input[type="range"] { accent-color: var(--main-color); }
        input:focus { outline: 2px solid var(--main-color); }

        /* Mobile Controls */
        #mobile-controls {
            display: none;
            width: 100%;
            margin-top: 10px;
            margin-bottom: 20px;
            flex-shrink: 0;
            max-width: 100%; /* Prevent overflow */
        }
        .d-pad { position: relative; width: 140px; height: 140px; margin: 0 auto; }
        .d-btn {
            position: absolute; width: 45px; height: 45px;
            background: var(--ui-bg);
            border: 1px solid var(--border-color);
            border-radius: 10px;
            display: flex; align-items: center; justify-content: center;
            font-size: 20px; cursor: pointer; color: var(--main-color);
            box-shadow: 0 2px 5px rgba(0,0,0,0.1);
            -webkit-tap-highlight-color: transparent;
        }
        .d-btn:active { background: var(--tertiary-background); transform: scale(0.95); }
        .btn-up { top: 0; left: 47.5px; }
        .btn-down { bottom: 0; left: 47.5px; }
        .btn-left { top: 47.5px; left: 0; }
        .btn-right { top: 47.5px; right: 0; }
         #fullscreen-btn {
            display: none;
        }
        /* Instructions Section overrides */
        #game-instructions {
            margin-top: 20px;
            width: 100%;
            background: var(--ui-bg);
            border: 1px solid var(--border-color);
            padding: 20px;
            border-radius: 12px;
            font-size: 0.9rem;
            line-height: 1.5;
            margin-bottom: 30px;
            box-sizing: border-box; /* Include padding in width */
        }
        #game-instructions h2 { border-bottom: 2px solid var(--main-background); padding-bottom: 8px; margin-top: 0; font-size: 1.2rem; color: var(--main-color); }
        #game-instructions ul { padding-left: 20px; margin-bottom: 0; }
        #game-instructions li { margin-bottom: 8px; }

        /* Ensure Game High Contrast doesn't break site UI - Scoped to .game-high-contrast class */
        .game-high-contrast #game-header,
        .game-high-contrast #start-screen, 
        .game-high-contrast #game-over-screen, 
        .game-high-contrast #level-screen, 
        .game-high-contrast #settings-screen,
        .game-high-contrast #game-instructions {
            border: 2px solid #fff;
            background-color: #000;
            color: #fff;
        }
        .game-high-contrast #game-header span { color: #ff0; }
        .game-high-contrast .overlay-title, .game-high-contrast h2 { color: #ff0 !important; }
        
        /* High Contrast Menu Fix */
        .game-high-contrast .setting-row { color: #fff; }
        .game-high-contrast .setting-row label { color: #fff; }

        .game-high-contrast .icon-btn, .game-high-contrast .d-btn, .game-high-contrast .game-main-btn {
            background: #000; color: #ff0; border: 1px solid #fff;
        }
        .game-high-contrast .game-secondary-btn {
             background: #333; color: #ff0; border: 1px solid #fff;
        }

        /* Vertical Ad Styles */
        .vertical-ad-container {
            display: none; /* Hidden by default */
            width: 160px;
            height: 600px;
            /* Removed fixed positioning to allow flexbox layout */
        }
        /* Fullscreen styles */
        :fullscreen #game-wrapper {
            background-color: var(--bg-color); /* Match theme */
            width: 100vw;
            height: 100vh;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            padding: 20px 0;
            margin: 0;
            box-sizing: border-box;
            max-width: none !important; /* Override inline max-width */
            overflow: hidden;
        }

        /* Adjustments for children in fullscreen */
        :fullscreen #game-wrapper #game-header {
            width: 100%;
            max-width: 800px; /* Limit width for readability */
            flex-shrink: 0;
        }
         body.high-contrast :fullscreen #game-wrapper {
            background-color: #000;
        }
        :fullscreen #game-wrapper #game-container {
             flex-grow: 1;
             display: flex;
             align-items: center;
             justify-content: center;
             width: 100%;
             max-width: 100%; /* Allow full width */
             height: 0; /* Flex hack to allow container to shrink/grow properly */
             border: none;
             box-shadow: none;
             margin: 0;
        }

        :fullscreen #game-wrapper canvas {
            /* Force CSS scaling over inline JS styles */
            width: auto !important;
            height: auto !important;
            max-width: 100%;
            max-height: 100%;
            object-fit: contain;
        }
        
        :fullscreen #game-wrapper #mobile-controls {
            flex-shrink: 0;
            margin-bottom: 0;
            margin-top: 10px;
        }

        /* Vendor prefixes for older browsers (simplified for brevity, main logic above) */
        :-webkit-full-screen #game-wrapper {
            background-color: #000; /* Fallback */
            width: 100%;
            height: 100%;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            max-width: none !important;
        }
        @media screen and (min-width: 1400px) {
            .vertical-ad-container {
                display: block;
                /* Sticky positioning keeps it in view while scrolling the game area if needed */
                position: sticky;
                top: 20px; 
            }
        }

        @media (max-width: 768px) {
            #mobile-controls { display: block; }
            #game-header { font-size: 14px; padding: 10px; }
             #fullscreen-btn {
                display: inline-block;
            }
        }