.control-button-q {
    position: relative;
    background: none;
    border: none;
    top: 296px;
    left: 69px;
    transform: scale(1);
    cursor: pointer;
    z-index: 1000;
}

.control-button-q img,
.control-button-a img,
.control-button-e img,
.control-button-d img {
    width: 100%;
    height: auto;
}

.control-button-a {
    position: relative;
    background: none;
    border: none;
    top: 380px;
    left: -10px;
    transform: scale(1);
    cursor: pointer;
    z-index: 1000;
}

.control-button-e {
    position: relative;
    background: none;
    border: none;
    top: 296px;
    left: 559px;
    transform: scale(1);
    cursor: pointer;
    z-index: 1000;
}

.control-button-d {
    position: relative;
    background: none;
    border: none;
    top: 380px;
    left: 480px;
    transform: scale(1);
    cursor: pointer;
    z-index: 1000;
}

.control-button-pause {
    position: relative;
    background: none;
    border: none;
    top: 80px;
    left: 392px;
    transform: scale(1);
    cursor: pointer;
    z-index: 1000;
}

.control-button-resume {
    position: relative;
    background: none;
    border: none;
    top: 20px;
    left: 325px;
    transform: scale(1);
    cursor: pointer;
    z-index: 1000;
}

.control-button-reset {
    position: relative;
    background: none;
    border: none;
    top: 140px;
    left: 258px;
    transform: scale(1);
    cursor: pointer;
    z-index: 1000;
}

.light-indicator {
    position: absolute;
    width: 30px;
    height: 30px;
    z-index: 1000;
}

.green-light {
    top: 51px;
    right: 48px;
}

.red-light {
    top: 111px;
    right: 48px;
}

.lives-display {
    position: absolute;
    top: 30px;
    left: 50%;
    width: 100%;
    height: 24px;
    z-index: 2000;
}

.slide-buttons-container {
    position: absolute;
    top: 195px;
    left: 51px;
    display: flex;
    gap: 30px;
    z-index: 1000;
}

.slide-button {
    position: relative;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    width: 100%;
    transition: transform 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.slide-button img {
    width: 100%;
    object-fit: contain;
}

.slide-button.active {
    transform: translateY(36px);
}

/* Dla wersji mobilnej */
@media (max-width: 900px) and (orientation: landscape) {
    .slide-buttons-container {
        top: 30%;
        left: 50%;
        transform: translateX(-50%);
    }
    
    .slide-button {
        width: 48px;
        height: 48px;
    }
}
