.sprite {
    width: 22px;
    height: 26px;
    background-repeat: no-repeat;
}

/* Down Frames */
.down {
    background-position: 0px 0px; /* First column, first row */
}

.down_walk1 {
    background-position: -23px 0px; /* Second column, first row */
}

.down_walk2 {
    background-position: -45px 0px; /* Third column, first row */
}

/* Up Frames */
.up {
    background-position: 0px -27px; /* First column, second row */
}

.up_walk1 {
    background-position: -23px -27px; /* Second column, second row */
}

.up_walk2 {
    background-position: -45px -27px; /* Third column, second row */
}

/* Left Frames */
.left {
    background-position: 0px -53px; /* First column, third row */
}

.left_walk1 {
    background-position: -23px -53px; /* Second column, third row */
}

.left_walk2 {
    background-position: -45px -53px; /* Third column, third row */
}

/* Right Frames */
.right {
    background-position: 0px -79px; /* First column, fourth row */
}

.right_walk1 {
    background-position: -23px -79px; /* Second column, fourth row */
}

.right_walk2 {
    background-position: -45px -79px; /* Third column, fourth row */
}

/* Map-specific sprite styling */
.map-sprite {
    transform: scale(1.45);
    background-repeat: no-repeat;
    position: absolute; /* Allows for free movement */
    transition: transform 0.3s ease-in-out; /* Smooth transition for movement */
}