Make Chrome DevTools responsive using media queries

I recently wrote some CSS to make Chrome DevTools responsive. You can modify DevTools' CSS by modifying the Custom.css

Using media queries I put together break points at which I hid my least important tab on the toolbar.

For Example;

/* When DevTools width is 624 pixels or less */
@media all and (max-width: 624px) and (min-width: 0px) {

    /* Hide the audits tab */
    #-webkit-web-inspector #toolbar .toolbar-item.audits {
        display: none !important;
    }
}

My full CSS file for DevTools with media queries: https://gist.github.com/Dayjo/7050186

I also wrote a blog on it with a bit more information; Make Chrome DevTools Responsive