The full selector for the logo is .top-bar .title-area .name img but it doesn't have any padding applied in the first place.

The .title-area has a margin applied (to the right if it is left aligned) and the .name has padding applied (this contains the logo and the site title and logo).

So .top-bar .name{padding:0!important} would remove that for example.

As for the size on mobile, you just need to pad the top and bottom of the logo img - this will keep it centered

@media screen and (max-width: 640px){

.top-bar .name img{

padding: 6px 0!important