.playTopBar {
    background-color: rgb(14, 26, 4, 0.8);
    -webkit-backdrop-filter: saturate(180%) blur(10px);
    backdrop-filter: saturate(180%) blur(10px);

    padding: var(--spacing-xs);

    display: flex;
    justify-content: space-between;
    align-items: center;
}

.playTopBar__bunnies {
    display: flex;
    flex-direction: column;

    gap: var(--spacing-xs);
}

.playTopBar__bunnies[data-reverse="true"] {
    flex-direction: column-reverse;
}

@media only screen and (min-width: 768px) {
    .playTopBar__bunnies {
        flex-direction: row;
        gap: var(--spacing-m);
    }

    .playTopBar__bunnies[data-reverse="true"] {
        flex-direction: row-reverse;
    }
}

.playTopBar__thisPlayer {
    display: flex;
    flex-direction: column;
    align-items: end;
}

@media only screen and (min-width: 768px) {
    .playTopBar__thisPlayer {
        flex-direction: row-reverse;
        align-items: center;
        gap: var(--spacing-s);
    }
}

.playTopBar__score {
    font-size: var(--text-l);
}
.playTopBar__speed {
    font-size: var(--text-s);
    transition: color 100ms ease-in;
}

.playTopBar__bunny__medal {
    position: absolute;
    transform: scale(0.5);
    left: 0;
}

.playTopBar__bunny {
    display: flex;
    align-items: center;
    gap: var(--spacing-xs);

    white-space: nowrap;

    position: relative;
    padding-left: 30px;
}