Custom low-profile toolbar stylesheet for Chrome devtools

Custom.css

/**********************************************/
/*
 * Low-profile toolbar Chrome devtools skin
 * by Christian Maughan Tegnér
 *
 * https://gist.github.com/gists/3936677
 *
/**********************************************/

.compact #toolbar {
    height: 24px !important;
}

.compact .toolbar-item.close-left {
    margin-top: 0 !important;
}

.compact .toolbar-item.toggleable {
    margin-top: 3px !important;
    padding-top: 0px !important;
}

.compact .toolbar-icon {
    width: 12px !important;
    height: 12px !important;
    background-size: 96px 24px !important;
}

.compact .toolbar-item:active .toolbar-icon {
    background-position-y: 12px !important;
}

.compact .toolbar-item.resources .toolbar-icon {
    background-position-x: -12px !important;
}

.compact .toolbar-item.network .toolbar-icon {
    background-position-x: -24px !important;
}

.compact .toolbar-item.sources .toolbar-icon {
    background-position-x: -36px !important;
}

.compact .toolbar-item.timeline .toolbar-icon {
    background-position-x: -48px !important;
  }

.compact .toolbar-item.profiles .toolbar-icon {
    background-position-x: -60px !important;
}

.compact .toolbar-item.audits .toolbar-icon {
    background-position-x: -72px !important;
}

.compact .toolbar-item.console .toolbar-icon {
    background-position-x: -84px !important;
}

.compact .toolbar-item.extension-panel-1_1 .toolbar-icon {
    background-size: 12px 12px !important;
    background-position-x: 12px !important;
}

body.compact #main {
    top: 24px !important;
}