@keyframes spin {
    from {
        rotate: 0;
    }
    to {
        rotate: 2turn;
    }
}

sync-button {
    position: fixed;
    right: 20px;
    top: 20px;

    button .icon {
        animation: 2s linear spin;
        animation-iteration-count: 0;
    }

    &[data-syncing] button {
        background-color: var(--accent) !important;

        .icon {
            animation-iteration-count: infinite;
        }
    }
}