@media (max-width: 1366px) {
    .game-title {
        font-size: inherit;
    }

    .button-group .three-d-button,
    .three-d-button,
    .three-d-button-settings,
    .three-d-button-hint {
        height: 25px !important;
        font-size: 11px;
        min-width: 40px;
        /* Reduced from 75px */
    }

    #zoomControls {
        gap: 0px;
        left: 0px;
    }

        #zoomIn,
        #zoomOut,
        #zoomControls button,
        #zoomLevel,
        #gameTimer,
        #moveCounter,
        #statisticsBtn,
        #bookmarkBtn {
            height: 15px;
            font-size: 10px !important;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 0.3rem 0.3rem !important;
            min-width: 50px !important;
        }

        #zoomIn,
        #zoomOut,
        #zoomControls button,
        #zoomLevel,
        .zoomControlsGroup button {
            min-width: 30px !important;
        }

    #zoomLevel {
        width: 20px;
    }

    /* Adjust spacing */
    .button-group {
        margin-right: 4px;
    }

    #gameHeader .variations a {
        font-size: 12px;
        gap: 15px;
    }
}

/* Small Screens (max-width: 1050px) */
@media (max-width: 1180px) {
    .game-title {
        font-size: 15px;
    }

    .button-group .three-d-button,
    .three-d-button,
    .three-d-button-settings,
    .three-d-button-hint {
        height: 25px !important;
        font-size: 9px;
        min-width: 20px;
    }

    #zoomControls {
        gap: 0px;
        left: 0px;
    }

        #zoomIn,
        #zoomOut,
        #zoomControls button,
        #zoomLevel,
        #gameTimer,
        #moveCounter,
        #statisticsBtn,
        #bookmarkBtn {
            height: 15px;
            font-size: 9px !important;
            display: flex;
            align-items: center;
            justify-content: center;
            min-width: 40px !important;
        }

        #zoomIn,
        #zoomOut,
        #zoomControls button,
        #zoomLevel,
        .zoomControlsGroup button {
            min-width: 30px !important;
        }

    /* Adjust spacing */
    .button-group {
        margin-right: 3px;
    }

    #gameHeader .variations a {
        font-size: 10px;
        gap: 12px;
    }
}

/* Small Screens (max-width: 960px) */
@media (max-width: 960px) {
    .game-title {
        font-size: 10px;
    }

    .button-group .three-d-button,
    .three-d-button,
    .three-d-button-settings,
    .three-d-button-hint {
        height: 20px !important;
        font-size: 9px;
        min-width: 20px;
    }


    #zoomControls {
        gap: 0px;
        left: 0px;
    }

        #zoomIn,
        #zoomOut,
        #zoomControls button,
        #zoomLevel,
        #gameTimer,
        #moveCounter,
        #statisticsBtn,
        #bookmarkBtn {
            height: 15px;
            font-size: 9px !important;
            display: flex;
            align-items: center;
            justify-content: center;
            min-width: 30px !important;
        }

        #zoomIn,
        #zoomOut,
        #zoomControls button,
        #zoomLevel,
        .zoomControlsGroup button {
            min-width: 20px !important;
        }

    .zoomControlsGroup button {
        width: 20px;
        /* Reduced from 20px */
    }
  
    /* Adjust spacing */
    .button-group {
        margin-right: 3px;
    }

    #gameHeader .variations a {
        font-size: 9px;
        gap: 12px;
    }
}

/* Small Screens (max-width: 765px) */
@media (max-width: 855px) {
    .game-title {
        font-size: 10px;
    }

    .button-group .three-d-button,
    .three-d-button,
    .three-d-button-settings,
    .three-d-button-hint {
        height: 20px !important;
        font-size: 7px;
        min-width: 20px;
    }

    #zoomControls {
        gap: 0px;
        left: 0px;
    }

        #zoomIn,
        #zoomOut,
        #zoomControls button,
        #zoomLevel,
        #gameTimer,
        #moveCounter,
        #statisticsBtn,
        #bookmarkBtn {
            height: 15px;
            font-size: 8px !important;
            display: flex;
            align-items: center;
            justify-content: center;
            min-width: 30px !important;
        }

        #zoomIn,
        #zoomOut,
        #zoomControls button,
        #zoomLevel,
        .zoomControlsGroup button {
            min-width: 20px !important;
        }

   
    /* Adjust spacing */
    .button-group {
        margin-right: 3px;
    }

    #gameHeader .variations a {
        font-size: 9px;
        gap: 12px;
    }
}

/* Small Screens (max-width: 635px) */
@media (max-width: 740px) {
    .game-title {
        font-size: 5px;
    }

    .button-group .three-d-button,
    .three-d-button,
    .three-d-button-settings,
    .three-d-button-hint {
        height: 20px !important;
        font-size: 6px;
        min-width: 20px;
    }

    #zoomControls {
        gap: 0px;
        left: 0px;
    }

        #zoomIn,
        #zoomOut,
        #zoomControls button,
        #zoomLevel,
        #gameTimer,
        #moveCounter,
        #statisticsBtn,
        #bookmarkBtn {
            height: 15px;
            font-size: 7px !important;
            display: flex;
            align-items: center;
            justify-content: center;
            min-width: 20px !important;
        }

        #zoomIn,
        #zoomOut,
        #zoomControls button,
        #zoomLevel,
        .zoomControlsGroup button {
            min-width: 20px !important;
        }

    #gameHeader .variations a {
        font-size: 8px;
        gap: 12px;
    }
}