Update reference builds to Chrome 32.0.1700.19

chrome_linux/resources/inspector/inspector.css

 /* dialog.css */
 
 .dialog {
     position: absolute;
     
     padding: 10px;
     border-radius: 10px;
     border: 1px solid gray;
 
     box-shadow: rgb(40,40,40) 0 0 50px;
@@ skipping 29 matching lines @@
     padding: 3px 20px;
     margin: 0 0 0 10px;
 }
 
 .go-to-line-dialog button:active {
     background-color: rgb(215, 215, 215);
     background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(194, 194, 194)), to(rgb(239, 239, 239)));
 }
 
 
+/* tabbedPane.css */
+
+/*
+ * Copyright (C) 2006, 2007, 2008 Apple Inc.  All rights reserved.
+ * Copyright (C) 2009 Anthony Ricaud <rik@webkit.org>
+ * Copyright (C) 2011 Google Inc. All rights reserved.
+ *
+ * Redistribution and use in source and binary forms, with or without
+ * modification, are permitted provided that the following conditions are
+ * met:
+ *
+ * 1. Redistributions of source code must retain the above copyright
+ * notice, this list of conditions and the following disclaimer.
+ *
+ * 2. Redistributions in binary form must reproduce the above
+ * copyright notice, this list of conditions and the following disclaimer
+ * in the documentation and/or other materials provided with the
+ * distribution.
+ *
+ * THIS SOFTWARE IS PROVIDED BY GOOGLE INC. AND ITS CONTRIBUTORS
+ * "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+ * LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+ * A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL GOOGLE INC.
+ * OR ITS CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+ * SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+ * LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+ * DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
+ * THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+ * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+ * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+ */
+ 
+.tabbed-pane {
+    flex: auto;
+}
+
+.tabbed-pane-content {
+    position: relative;
+    overflow: auto;
+    flex: auto;
+    display: flex;
+}
+
+.tabbed-pane-content.has-no-tabs {
+    background-color: lightgray;
+}
+
+.tabbed-pane-header {
+    flex: 0 0 23px;
+    border-bottom: 1px solid rgb(163, 163, 163);
+    overflow: hidden;
+    width: 100%;
+}
+
+.tabbed-pane-header-contents {
+    margin: 0 10px;
+}
+
+.tabbed-pane-header-tabs {
+    float: left;
+}
+
+.tabbed-pane-header-tab {
+    float: left;
+    margin-top: 2px;
+    padding: 2px 4px 2px 4px;
+    height: 21px;
+    border: 1px solid transparent;
+    border-bottom: none;
+    line-height: 15px;
+    
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    overflow: hidden;
+}
+
+.tabbed-pane-header-tab.measuring {
+    visibility: hidden;
+}
+
+.tabbed-pane-header-tab.selected {
+    border: 1px solid rgb(163, 163, 163);
+    border-bottom: none;
+}
+
+.tabbed-pane-header-tab.selected {
+    background: white;
+    border-top-color: #bbb;
+}
+
+.tabbed-pane-header-tab .close-button-gray {
+    position: relative;
+    top: 2px;
+    left: 1px;
+    margin-left: 2px;
+    margin-top: -3px;
+    visibility: hidden;
+}
+
+.tabbed-pane-header-tab:hover .close-button-gray,
+.tabbed-pane-header-tab.selected .close-button-gray {
+    visibility: visible;
+}
+
+.tabbed-pane-header-tabs-drop-down-container {
+    float: left;
+    position: relative;
+    vertical-align: bottom;
+    padding-left: 3px;
+    line-height: 20px;
+}
+
+.tabbed-pane-header-tabs-drop-down-container.measuring {
+    visibility: hidden;
+}
+
+.tabbed-pane-header-tabs-drop-down {
+    position: relative;
+    opacity: 0.7;
+    color: rgb(30, 30, 30);
+    font-size: 133%;
+    padding: 0 3px;
+}
+
+.tabbed-pane-header-tabs-drop-down:hover {
+    opacity: 1.0;
+}
+
+.tabbed-pane-header-tabs-drop-down:active {
+    opacity: 0.8;
+}
+
+select.tabbed-pane-header-tabs-drop-down-select {
+    position: absolute;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    opacity: 0;
+    border: none;
+    margin: 0;
+    font-size: 75%;
+    -webkit-appearance: none;
+    width: 20px;
+}
+
 /* inspector.css */
 
 /*
  * Copyright (C) 2006, 2007, 2008 Apple Inc.  All rights reserved.
  * Copyright (C) 2009 Anthony Ricaud <rik@webkit.org>
  *
  * Redistribution and use in source and binary forms, with or without
  * modification, are permitted provided that the following conditions
  * are met:
  *
@@ skipping 24 matching lines @@
 }
 
 .fill {
     position: absolute;
     top: 0;
     left: 0;
     right: 0;
     bottom: 0;
 }
 
+.hbox {
+    display: flex !important;
+    flex-direction: row;
+}
+
+.vbox {
+    display: flex !important;
+    flex-direction: column;
+}
+
 .inline-block {
     display: inline-block;
 }
 
 .hidden {
-    display: none;
+    display: none !important;
 }
 
-.nowrap {
+.nowrap,
+.nowrap-below,
+.nowrap-below div,
+.nowrap-below span {
     white-space: nowrap !important;
 }
 
-#toolbar {
-    position: absolute;
-    top: 0;
-    left: 0;
-    right: 0;
-    height: 26px;
+.toolbar-background {
     background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(191, 191, 191)), to(rgb(151, 151, 151)));
-    padding-top: 1px;
-    padding-left: 5px;
+    padding: 1px 0 0 1px;
     border-bottom: 1px solid rgb(80, 80, 80);
-    -webkit-flex-direction: row;
     background-origin: padding-box;
     background-clip: padding-box;
 }
 
+.toolbar {
+    flex: 0 0 25px;
+    display: flex;
+    flex-direction: row;
+    position: relative;
+}
+
+.toolbar .tabbed-pane-header {
+    border: none;
+}
+
+.toolbar .tabbed-pane-header-contents {
+    margin: 0;
+}
+
+.toolbar .tabbed-pane-header-tab {
+    border-width: 0 2px 0 2px;
+    background: none;
+    padding-right: 3px;
+}
+
+.toolbar .tabbed-pane-header-tab.selected {
+    border-width: 0 2px 0 2px;
+    -webkit-border-image: url(Images/toolbarItemSelected.png) 0 2 0 2;
+}
+
+.toolbar button.status-bar-item {
+    border: none;
+    margin: 0 -2px;
+}
+
 button,
 input,
 select {
   font-family: inherit;
   font-size: inherit;
 }
 
-body.inactive #toolbar {
+body.inactive .toolbar-background {
     background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(233, 233, 233)), to(rgb(207, 207, 207)));
     border-bottom: 1px solid rgb(64%, 64%, 64%);
 }
 
-body.dock-to-bottom #toolbar {
+body.dock-to-bottom .toolbar-background {
     padding-top: 0;
     border-top: 1px solid rgb(100, 100, 100);
     cursor: default;
 }
 
-body.dock-to-bottom.platform-mac #toolbar {
+body.dock-to-bottom.platform-mac .toolbar-background {
     border-top-color: white;
 }
 
-body.dock-to-bottom.inactive #toolbar {
+body.dock-to-bottom.inactive .toolbar-background {
     border-top: 1px solid rgb(64%, 64%, 64%);
 }
 
-body.platform-windows #toolbar,
-body.platform-windows.inactive #toolbar {
+body.platform-windows .toolbar-background,
+body.platform-windows.inactive .toolbar-background {
     background-image: none;
 }
 
-body.undocked.platform-mac-leopard #toolbar {
+body.undocked.platform-mac-leopard .toolbar-background {
     background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(175, 175, 175)), to(rgb(151, 151, 151))) !important;
 }
 
-body.undocked.platform-mac-leopard.inactive #toolbar {
+body.undocked.platform-mac-leopard.inactive .toolbar-background {
     background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(221, 221, 221)), to(rgb(207, 207, 207))) !important;
 }
 
-body.undocked.platform-mac-snowleopard #toolbar {
+body.undocked.platform-mac-snowleopard .toolbar-background {
     background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(189, 189, 189)), to(rgb(167, 167, 167))) !important;
 }
 
-body.undocked.platform-mac-snowleopard.inactive #toolbar {
+body.undocked.platform-mac-snowleopard.inactive .toolbar-background {
     background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(228, 228, 228)), to(rgb(216, 216, 216))) !important;
 }
 
-body.undocked.platform-mac-mountain-lion #toolbar {
+body.undocked.platform-mac-mountain-lion .toolbar-background {
     background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(208, 208, 208)), to(rgb(200, 200, 200))) !important;
 }
 
-body.undocked.platform-mac-mountain-lion.inactive #toolbar {
+body.undocked.platform-mac-mountain-lion.inactive .toolbar-background {
     background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(238, 238, 238)), to(rgb(224, 224, 224))) !important;
 }
 
-.toolbar-item {
-    display: inline-block;
-    float: left;
-    margin: 0;
-    padding-right: 6px;
-    background-color: transparent;
-    border-style: none;
-    border-color: transparent;
-    color: inherit;
+.toolbar > .tabbed-pane-header {
+    flex: auto;
 }
 
-.toolbar-item {
-    height: 24px;
+.toolbar-controls-left {
+    flex: none;
+    opacity: 0.8;
+    padding-top: 1px;
 }
 
-.toolbar-item.toggleable.toggled-on {
-    border-width: 0 2px 0 2px;
-    padding-left: 4px;
-    padding-right: 4px;
-    -webkit-border-image: url(Images/toolbarItemSelected.png) 0 2 0 2;
+.toolbar-controls-right {
+    flex: none;
+    margin-right: 2px;
+    padding-top: 1px;
 }
 
-.toolbar-label {
-    line-height: 22px;
-    text-shadow: rgba(255, 255, 255, 0.5) 0 1px 0;
-    display: inline;
-}
-
-.toolbar-item.toggleable .close-button {
-    margin-left: 2px;
-    margin-right: -2px;
-    position: relative;
-    top: 2px;
-    opacity: 0.5;
-}
-
-.toolbar-item.toggleable .close-button:hover {
-    opacity: 1;
-}
-
-#toolbar-dropdown .toolbar-items-separator {
-    border-bottom: 1px solid #aaa;
-    width: 100%;
-    margin: 5px 0;
-}
-
-.toolbar-item.toggleable:active .toolbar-label {
-    text-shadow: none;
-}
-
-body.dock-to-bottom #search-toolbar-label {
-    display: none;
-}
-
-#toolbar-controls {
-    float: right;
-    display: -webkit-flex;
-    -webkit-align-items: center;
-    height: 100%;
-}
-
-#toolbar-dropdown-arrow {
-    font-size: 14px;
-    font-weight: bold;
-    border: 0;
-    background-color: transparent;
-    border-radius: 5px;
-    text-shadow: none;
-    cursor: default;
-    margin: 0;
-    /* A line height of 0 allows precise text positioning using padding. */
-    line-height: 0;
-    padding: 11px 6px 11px;
-}
-
-#toolbar-dropdown-arrow.dropdown-visible {
-    background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(251, 251, 251, 0.9)), to(rgba(231, 231, 231, 0.9)));
-}
-
-#toolbar-dropdown-arrow:hover {
-    background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(191, 191, 191, 0.7)), to(rgba(171, 171, 171, 0.5)));
-}
-
-#toolbar-dropdown-arrow:active {
-    background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(111, 111, 111, 0.8)), to(rgba(91, 91, 91, 0.8)));
-}
-
-#toolbar-dropdown {
-    position: absolute;
-    z-index: 1000;
-    box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.4);
-    border: 1px solid rgb(128, 128, 128);
-    background-color: inherit;
-    background-image: inherit;
-}
-
-body.undocked.platform-mac-leopard #toolbar-dropdown,
-body.undocked.platform-mac-snowleopard #toolbar-dropdown {
-    background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(191, 191, 191)), to(rgb(151, 151, 151)));
-}
-
-#toolbar-dropdown .scrollable-content {
-    display: -webkit-flex;
-    -webkit-flex-direction: column;
-    -webkit-align-items: flex-start;
-    padding-right: 0;
-}
-
-#toolbar-dropdown .toolbar-item {
-    display: -webkit-flex;
-    -webkit-flex-direction: row;
-    -webkit-flex: none;
-    width: 100%;
-    border: 1px solid rgba(0, 0, 0, 0);
-}
-
-#toolbar-dropdown .toolbar-item.toggleable.toggled-on {
-    border: 1px solid rgba(100, 100, 120, 0.4);
-    -webkit-border-image: none;
-    background: -webkit-gradient(linear, left top, left bottom, from(rgba(128, 128, 128, 0.6)), to(rgba(128, 128, 128, 0.6)), color-stop(20%, rgba(158, 158, 158, 0.2)), color-stop(80%, rgba(158, 158, 158, 0.2)));
-}
-
-#toolbar-dropdown .toolbar-item.toggleable:hover {
-    background: -webkit-gradient(linear, left top, left bottom, from(rgba(128, 128, 128, 0.6)), to(rgba(128, 128, 128, 0.3)), color-stop(20%, rgba(158, 158, 158, 0.2)), color-stop(80%, rgba(158, 158, 158, 0.1)));
-}
-
-#toolbar-dropdown .toolbar-label {
-    line-height: 22px;
-    top: 0;
-}
-
-#toolbar-panels-menu {
-    border: 0;
-    border-radius: 5px;
-    cursor: default;
-    font-family: Arial, Helvetica, sans-serif !important;
-    font-weight: bold;
-    line-height: 16px;
-    height: 22px;
-    padding: 0 4px 0 4px;
-    margin: 1px 3px;
-}
-
-#toolbar-panels-menu:hover:not(.disabled) {
-    background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(191, 191, 191, 0.7)), to(rgba(171, 171, 171, 0.5)));
-}
-
-#toolbar-panels-menu.disabled {
-    opacity: 0.4;
-    text-shadow: white 1px 1px 0;
-}
-
-#toolbar-panels-menu:active:not(.disabled) {
-    background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(111, 111, 111, 0.8)), to(rgba(91, 91, 91, 0.8)));
+.toolbar-controls-right #error-warning-count,
+.toolbar-controls-right .console-status-bar-item,
+.toolbar-controls-right .settings-status-bar-item,
+.toolbar-controls-right .dock-status-bar-item
+{
+    opacity: 0.8;
 }
 
 .scrollable-content {
     position: static;
     height: 100%;
     overflow-y: auto;
     width: 100%;
     margin-right: 12px;
     padding-right: 3px;
 }
@@ skipping 170 matching lines @@
 
 .close-button-gray:hover {
     background-position: -143px -216px;
 }
 
 .close-button-gray:active {
     background-position: -160px -216px;
 }
 
 
-.close-left {
-    float: left;
-}
-
-body.undocked .toolbar-item.close-left, body.undocked .toolbar-item.close-right {
+body.undocked .toolbar-item .close-button {
     display: none;
 }
 
-body.platform-mac .toolbar-item.close-right {
+body.remote .toolbar-item .close-button {
     display: none;
 }
 
-body.remote .toolbar-item.close-left, body.remote .toolbar-item.close-right {
-    display: none;
-}
-
-body:not(.platform-mac) .toolbar-item.close-left {
-    display: none;
-}
-
-.toolbar-item.close-left,
-.toolbar-item.close-right {
-  display: -webkit-flex;
-  -webkit-align-items: center;
-  height: 100%;
-  cursor: default;
-}
-
-#root {
-    position: absolute;
-    top: 0;
-    left: 0;
-    right: 0;
-    bottom: 0;
-}
-
-#main {
-    position: absolute;
-    z-index: 1;
-    top: 26px;
-    left: 0;
-    right: 0;
-    bottom: 0;
-    overflow: hidden;
+.panel-status-bar {
+    border-top: none;
+    display: flex;
+    pointer-events: none;
     background-color: white;
-}
-
-#main-panels {
-    position: absolute;
-    top: 0;
-    left: 0;
-    right: 0;
-    bottom: 23px;
-    overflow: hidden;
-}
-
-body.drawer-visible #main-panels {
-    bottom: 24px;
-}
-
-#main-status-bar {
-    position: absolute;
-    bottom: 0;
-    left: 0;
-    right: 0;
+    flex: 0 0 23px;
+    position: relative;
 }
 
 .status-bar {
     position: relative;
     white-space: nowrap;
     height: 23px;
     overflow: hidden;
     width: 100%;
     z-index: 12;
-    background-image: -webkit-linear-gradient(rgb(243,243,243), rgb(235,235,235));
     border-top: 1px solid rgb(202, 202, 202);
     display: -webkit-flex;
 }
 
 .status-bar > div {
     display: inline-block;
     vertical-align: top;
     overflow: visible;
 }
 
 .status-bar-item {
     display: inline-block;
     pointer-events: auto;
     cursor: default;
     height: 22px;
     padding: 0;
     margin-left: -1px;
     margin-right: 0;
     vertical-align: top;
     border: 0 transparent none;
     background-color: transparent;
+    flex: none;
 }
 
 .status-bar-text {
     padding-left: 5px;
     padding-right: 15px;
     padding-top: 3px;
 }
 
-#floating-status-bar-container {
-    position: absolute;
-    left: 0;
-    right: 0;
-    bottom: 0;
-    display: none;
-    border-bottom: 1px solid rgb(202, 202, 202);
-    cursor: ns-resize;
-    height: 24px;
-}
-
-body.drawer-overlay #floating-status-bar-container {
-    box-shadow: 1px 1px 5px 2px rgba(128, 128, 128, 0.7);
-}
-
-body.drawer-visible #floating-status-bar-container {
-    display: -webkit-flex;
-}
-
-#floating-status-bar-resizer {
-    content: url(Images/statusbarResizerVertical.png);
-    margin-top: 7px;
-    pointer-events: none;
-    height: 8px;
-}
-
-#panel-status-bar {
-    -webkit-flex: 1 0;
-    display: -webkit-flex;
-    pointer-events: none;
-}
-
 #drawer-view-anchor {
     display: inline-block;
 }
 
 .status-bar-item:active {
     position: relative;
     z-index: 200;
 }
 
 .glyph {
@@ skipping 29 matching lines @@
 
 .long-click-glyph.shadow {
     top: 1px;
     background-color: white !important;
     z-index: 0;
 }
 
 button.status-bar-item {
     position: relative;
     width: 32px;
-    border-left: 1px solid rgb(202, 202, 202);
-    border-right: 1px solid rgb(202, 202, 202);
 }
 
 .status-bar button.status-bar-item .glyph {
     margin: 0 -1px;
 }
 
-.status-bar select.status-bar-item:active,
-.status-bar button.status-bar-item:active {
-    border-left: 1px solid rgb(120, 120, 120);
-    border-right: 1px solid rgb(120, 120, 120);
-}
-
 button.status-bar-item .glyph.shadow {
     background-color: rgba(255, 255, 255, 0.33) !important;
 }
 
 button.status-bar-item.toggled-on .glyph {
     background-color: rgb(66, 129, 235);
 }
 
+button.status-bar-item:hover .glyph {
+    opacity: 1;
+}
+
 button.status-bar-item:disabled {
-    opacity: 0.5;
     background-position: 0 0 !important;
 }
 
+button.status-bar-item:disabled .glyph {
+    opacity: 0.5 !important;
+}
+
 button.status-bar-item.extension {
     background-image: none;
 }
 
 .status-bar-select-container {
     display: inline-block;
 }
 
 .status-bar-select-arrow {
     background-image: url(Images/statusbarButtonGlyphs.png);
@@ skipping 21 matching lines @@
     text-shadow: rgba(255, 255, 255, 0.75) 0 1px 0;
     -webkit-appearance: none;
     border: 0;
     border-radius: 0;
     padding: 0 15px 0 5px;
     margin-right: -10px;
     position: relative;
     line-height: 20px;
 }
 
-select.status-bar-item,
-select.status-bar-item:hover {
-    border-left: 1px solid rgb(202, 202, 202);
-    border-right: 1px solid rgb(202, 202, 202);
-}
-
 .status-bar-item > .glyph {
     -webkit-mask-image: url(Images/statusbarButtonGlyphs.png);
     -webkit-mask-size: 320px 120px;
+    opacity: 0.8;
 }
 
 .console-filter > .glyph {
     -webkit-mask-position: -32px -48px;
 }
 
 @media (-webkit-min-device-pixel-ratio: 1.5) {
 .status-bar-item > .glyph {
     -webkit-mask-image: url(Images/statusbarButtonGlyphs2x.png);
 }
@@ skipping 21 matching lines @@
     position: absolute;
     width: 31px;
     bottom: -3px;
     background: white;
 }
 
 .alternate-status-bar-buttons-bar .status-bar-item {
     height: 24px;
     margin-top: -1px;
     border: 1px solid rgb(202, 202, 202);
-    border-bottom: 1px solid transparent;
 }
 
 .alternate-status-bar-buttons-bar .status-bar-item.emulate-active {
     background-color: rgb(163,163,163);
     border: 1px solid rgb(120, 120, 120);
-    border-bottom: 1px solid transparent;
 }
 
 button.status-bar-item.settings-status-bar-item,
 button.status-bar-item.settings-status-bar-item:active {
     border-right: 0 transparent none;
 }
 
 button.status-bar-item.left-sidebar-show-hide-button,
 button.status-bar-item.right-sidebar-show-hide-button {
     position: absolute;
@@ skipping 99 matching lines @@
 
 .green-ball {
     background-position: -235px -96px;
 }
 
 .orange-ball {
     background-position: -246px -96px;
 }
 
 #error-warning-count {
+    display: inline-block;
     padding: 4px 6px 6px 0;
     font-size: 11px;
     height: 19px;
     cursor: pointer;
     line-height: 14px;
 }
 
 #error-warning-count:hover {
     border-bottom: 1px solid rgb(96, 96, 96);
 }
 
 #error-warning-count .error-icon-small,
 #error-warning-count .warning-icon-small {
     vertical-align: -1px;
     margin-right: 2px;
 }
 
 #error-warning-count .warning-icon-small {
     margin-left: 6px;
 }
 
-#drawer {
+.drawer {
     display: none;
-    position: absolute;
-    bottom: 0;
-    left: 0;
-    right: 0;
-    height: 200px;
+    flex: 0 0 200px;
+    position: relative;
     background-color: white;
     z-index: 1;
 }
 
-#drawer-body {
-    position: absolute;
-    top: 0;
-    bottom: 24px;
-    left: 0;
-    right: 0;
-}
-
 #drawer-contents {
     position: absolute;
     top: 0;
     bottom: 0;
     left: 0;
     right: 0;
+    display: flex;
+}
+
+#drawer-contents > .tabbed-pane > .tabbed-pane-header {
+    background-color: rgb(236, 236, 236);
+    cursor: ns-resize;
+    border-top: 1px solid rgb(124, 124, 124);
+    border-bottom: 1px solid rgb(203, 203, 203);
+}
+
+body.inactive #drawer-contents .tabbed-pane-header {
+    border-top: 1px solid rgb(64%, 64%, 64%);
+}
+
+#drawer-contents .tabbed-pane-header .tabbed-pane-header-tab {
+    cursor: default;
+}
+
+.drawer-resizer {
+    position: absolute;
+    right: 0;
+    top: 8px;
+    content: url(Images/statusbarResizerVertical.png);
+    height: 8px;
+    pointer-events: none;
 }
 
 #drawer-footer {
     position: absolute;
     bottom: 0;
     left: 0;
     right: 0;
     font-size: 11px;
     height: 23px;
+    background-color: rgb(236, 236, 236);
 }
 
-body.drawer-visible #drawer {
+body.drawer-visible .drawer {
     display: block;
 }
 
 body.platform-mac .monospace,
 body.platform-mac .source-code {
     font-size: 11px !important;
     font-family: Menlo, monospace;
 }
 
 body.platform-mac.platform-mac-tiger .monospace,
 body.platform-mac.platform-mac-tiger .source-code {
     font-size: 10px !important;
     font-family: Monaco, monospace;
 }
 
 body.platform-windows .monospace,
 body.platform-windows .source-code {
     font-size: 12px !important;
     font-family: Consolas, Lucida Console, monospace;
 }
 
 body.platform-linux .monospace,
 body.platform-linux .source-code {
     font-size: 11px !important;
     font-family: dejavu sans mono, monospace;
 }
 
-#console-view {
-    position: absolute;
-    top: 0;
-    bottom: 0;
-    left: 0;
-    right: 0;
-    overflow-y: auto;
+.console-status-bar {
+    flex: 0 0 23px;
+    overflow: hidden;
 }
 
 #console-messages {
-    position: absolute;
-    z-index: 0;
-    top: 0;
-    left: 0;
-    right: 0;
-    bottom: 0;
+    flex: 1 1;
     padding: 2px 0;
-    overflow-y: overlay;
+    overflow-y: auto;
     word-wrap: break-word;
     -webkit-user-select: text;
+    border-top: 1px solid rgb(230, 230, 230);
 }
 
 #console-prompt {
     clear: right;
     position: relative;
-    border-top: 1px solid rgb(240, 240, 240);
     padding: 1px 22px 1px 0;
     margin-left: 24px;
     min-height: 16px;
     white-space: pre-wrap;
     -webkit-user-modify: read-write-plaintext-only;
 }
 
 #console-prompt::before {
     background-position: -192px -96px;
 }
 
 .console-user-command-result.console-log-level::before {
     background-position: -202px -96px;
 }
 
 .console-message,
 .console-user-command {
     clear: right;
     position: relative;
-    border-top: 1px solid rgb(240, 240, 240);
+    border-bottom: 1px solid rgb(240, 240, 240);
     padding: 1px 22px 1px 0;
     margin-left: 24px;
     min-height: 16px;
 }
 
 .console-mesage:first-child {
     border-top: none;
 }
 
 .console-adjacent-user-command-result {
@@ skipping 52 matching lines @@
     color: white;
     border-radius: 7px;
 }
 
 .console-message-text {
     white-space: pre-wrap;
 }
 
 .repeated-message.console-error-level::before,
 .repeated-message.console-warning-level:before,
-.repeated-message.console-debug-level:before {
+.repeated-message.console-debug-level:before,
+.repeated-message.console-info-level:before {
     visibility: hidden;
 }
 
 .repeated-message .outline-disclosure,
 .repeated-message > .console-message-text {
     -webkit-flex: 1;
 }
 
 .console-info {
     color: rgb(128, 128, 128);
@@ skipping 63 matching lines @@
 .console-error-level .section > .header .title {
     color: red !important;
 }
 
 .console-debug-level .console-message-text {
     color: blue;
 }
 
 .console-error-level::before,
 .console-warning-level::before,
-.console-debug-level::before {
+.console-debug-level::before,
+.console-info-level::before {
     background-image: url(Images/statusbarButtonGlyphs.png);
     background-size: 320px 120px;
     width: 10px;
     height: 10px;
 }
 
 @media (-webkit-min-device-pixel-ratio: 1.5) {
 .console-error-level::before,
 .console-warning-level::before,
-.console-debug-level::before {
+.console-debug-level::before,
+.console-info-level::before {
     background-image: url(Images/statusbarButtonGlyphs2x.png);
 }
 } /* media */
 
 .console-warning-level::before {
     background-position: -202px -107px;
 }
 
 .console-error-level::before {
     background-position: -213px -96px;
 }
 
+.console-info-level::before {
+    background-position: -213px -107px;
+}
+
 .console-user-command .console-message {
     margin-left: -24px;
     padding-right: 0;
     border-bottom: none;
 }
 
 .console-user-command::before {
     background-position: -192px -107px;
 }
 
@@ skipping 164 matching lines @@
 }
 
 .panel {
     display: none;
     overflow: hidden;
     position: absolute;
     top: 0;
     left: 0;
     right: 0;
     bottom: 0;
+    z-index: 0;
 }
 
 .panel.visible {
     display: block;
 }
 
+.panel.extension-panel.visible {
+    display: flex !important;
+    flex-direction: column;
+}
+
+.extension-view {
+    flex: auto;
+    position: relative;
+}
+
 iframe.extension {
     width: 100%;
     height: 100%;
 }
 
 iframe.panel.extension {
     display: block;
     height: 100%;
 }
 
@@ skipping 627 matching lines @@
 }
 
 .scope-bar li:active {
     background: rgba(0, 0, 0, 0.5);
 }
 
 
 .console-warning-level.repeated-message,
 .console-error-level.repeated-message,
 .console-log-level.repeated-message,
-.console-debug-level.repeated-message{
+.console-debug-level.repeated-message,
+.console-info-level.repeated-message {
     display: -webkit-flex;
 }
 
 .console-user-command-result {
     display: block;
 }
 
 .source-view-frame {
     width: 100%;
     height: 100%;
@@ skipping 185 matching lines @@
 }
 
 .sidebar-tree.small .sidebar-tree-item .status,
 .sidebar-tree .children.small .sidebar-tree-item .status,
 .sidebar-tree-item.small .status {
     margin-top: 1px;
 }
 
 .sidebar-tree-item.selected {
     color: white;
-    border-top: 1px solid rgb(145, 160, 192);
-    background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(162, 177, 207)), to(rgb(120, 138, 177)));
     text-shadow: rgba(0, 0, 0, 0.33) 1px 1px 0;
     background-origin: padding-box;
     background-clip: padding-box;
+    background-color: rgb(56, 121, 217);
 }
 
 :focus .sidebar-tree-item.selected {
-    border-top: 1px solid rgb(68, 128, 200);
-    background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(92, 147, 213)), to(rgb(21, 83, 170)));
+    background-color: rgb(56, 121, 217);
 }
 
 body.inactive .sidebar-tree-item.selected {
-    border-top: 1px solid rgb(151, 151, 151);
-    background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(180, 180, 180)), to(rgb(138, 138, 138)));
+    background-color: rgb(180,180,180);
 }
 
 .sidebar-tree-item .titles {
     position: relative;
     top: 5px;
     line-height: 12px;
     padding-bottom: 1px;
     text-overflow: ellipsis;
     overflow: hidden;
     white-space: nowrap;
@@ skipping 78 matching lines @@
 .storage-application-cache-status,
 .storage-application-cache-connectivity {
     position: relative;
     top: 4px;
 }
 
 .status-bar-items {
     position: absolute;
     top: 0;
     bottom: 0;
-    left: 200px;
+    left: 0;
     overflow: hidden;
     border-left: 1px solid rgb(184, 184, 184);
     margin-left: -1px;
 }
 
 .node-search-status-bar-item .glyph {
     -webkit-mask-position: -224px -24px;
 }
 
 .delete-storage-status-bar-item .glyph {
@@ skipping 200 matching lines @@
 }
 
 .search-view {
     position: absolute;
     top: 0;
     bottom: 0;
     left: 0;
     right: 0;
 }
 
-.search-drawer-header input[type="search"].search-config-search {
-    font-size: 11px;
-    margin-left: 4px;
+.search-drawer-header {
+    flex: none;
+    padding: 4px;
+}
+
+.search-drawer-header input[type="text"].search-config-search {
+    -webkit-appearance: none;
+    padding: 0 2px;
+    margin: 0;
+    border: 1px solid rgb(163, 163, 163);
+    height: 20px;
+    border-radius: 2px;
     color: #303030;
-    position: relative;
-    height: 19px;
+}
+
+.search-drawer-header input[type="search"].search-config-search:focus {
+    border: 1px solid rgb(190, 190, 190);
+    outline: none;
 }
 
 body.platform-mac .search-drawer-header input[type="search"].search-config-search {
     top: 1px;
 }
 
 .search-drawer-header label.search-config-label {
     margin-left: 8px;
     color: #303030;
 }
 
 .search-drawer-header input[type="checkbox"].search-config-checkbox {
     vertical-align: bottom;
 }
 
 body:not(.platform-mac) .search-drawer-header input[type="checkbox"].search-config-checkbox {
     margin-bottom: 5px;
 }
 
 body.platform-mac .search-drawer-header input[type="checkbox"].search-config-checkbox {
     margin-bottom: 4px;
 }
 
-.drawer-header {
-    font-size: 11px;
-    border-right: 1px solid rgb(197, 197, 197);
-    line-height: 21px;
-    padding-left: 6px;
-    display: inline-block;
-}
-
-.drawer-header .close-button {
-    position: relative;
-    top: 3px;
-    margin: 0 3px;
-}
-
 #bottom-status-bar-container {
     -webkit-flex: 1 1 0;
     width: 0;
     overflow: hidden;
 }
 
-.search-status-bar-item {
-    display: inline-block;
-    cursor: pointer;
-    font-size: 11px;
-    height: 23px;
+.search-status-bar-summary {
+    background-color: rgb(236, 236, 236);
+    border-top: 1px solid #ccc;
+    padding-left: 5px;
+    flex: 0 0 19px;
 }
 
-.search-status-bar-message {
-    margin-left:5px;
-    margin-right:5px;
-    margin-top:5px;
-    float:left;
+.search-status-bar-summary .progress-bar-container {
+    margin-top: -4px;
 }
 
 .progress-bar-stop-button-item {
     width: 19px;
     height: 24px;
     overflow: hidden;
 }
 
 .progress-bar-stop-button .glyph {
     -webkit-mask-position: -96px -48px;
     background-color: rgb(216, 0, 0) !important;
 }
 
-.search-results-status-bar-message {
-    margin-right: 10px;
-    cursor: default;
-    font-size: 11px;
-    float: right;
-    margin-top: 5px;
-}
-
 .search-view .search-results {
-    position: absolute;
-    top: 0;
-    bottom: 0;
-    left: 0;
-    right: 0;
     overflow-y: auto;
+    flex: auto;
 }
 
 #search-results-pane-file-based li {
     list-style: none;
 }
 
 #search-results-pane-file-based ol {
     -webkit-padding-start: 0;
     margin-top: 0;
 }
@@ skipping 258 matching lines @@
 .custom-popup-vertical-scroll ::-webkit-scrollbar-track-piece:vertical:increment {
     -webkit-border-image: url(Images/trackVert.png) 11 0 11 0;
     border-color: transparent;
     border-width: 0 0 11px 0;
 }
 
 .console-context {
     max-width: 200px;
 }
 
-.inspector-footer {
-    position: absolute;
-    bottom: 0;
-    left: 0;
-    right: 0;
+.inspector-footer.status-bar {
+    flex: 0 0 auto;
+    background-color: rgb(236, 236, 236);
     height: auto;
 }
 
 .progress-bar-container {
-    display: -webkit-flex;
+    display: inline-flex;
     margin: 0 8px;
     -webkit-flex: 1 0;
 }
 
 .progress-bar-container span {
     padding: 6px;
 }
 
 .progress-bar-container progress {
     margin-top: 7px;
     -webkit-flex: 1 0;
 }
 
 body.platform-mac .progress-bar-container progress {
     margin-top: 6px;
 }
 
 .progress-bar-container button.status-bar-item {
     border-left: none;
     margin-top: 1px;
 }
 
-.source-frame-cursor-position {
-    padding-left: 6px;
-    padding-top: 4px;
-    display: inline-block;
-    pointer-events: auto;
-    -webkit-user-select: text;
-    font-size: 11px;
-    cursor: text;
-    line-height: 14px;
-}
-
 .elements-tree-outline li.parent::before {
     top: 0 !important;
 }
 
+#drawer-editor-view {
+    flex: auto;
+}
+
+.toolbar-close-button-item {
+    display: inline-block;
+    float: right;
+    padding-right: 4px;
+    padding-top: 4px;
+    padding-left: 2px;
+}
+
+body.undocked .toolbar-close-button-item {
+    display: none;
+}
 /* inspectorCommon.css */
 
 html {
     height: 100%;
 }
 
 body {
     cursor: default;
     position: absolute;
     top: 0;
@@ skipping 64 matching lines @@
 
 .monospace {
     font-size: 10px !important;
     font-family: monospace;
 }
 
 .resources-dividers {
     position: absolute;
     left: 0;
     right: 0;
-    height: 100%;
     top: 0;
     z-index: -100;
+    bottom: 0;
 }
 
 .resources-event-dividers {
     position: absolute;
     left: 0;
     right: 0;
     height: 100%;
     top: 0;
     z-index: 300;
     pointer-events: none;
 }
 
 .resources-dividers-label-bar {
     position: absolute;
     top: 0;
     left: 0;
     right: 0;
     background-color: rgba(255, 255, 255, 0.8);
     background-clip: padding-box;
-    border-bottom: 1px solid rgba(0, 0, 0, 0.3);
     height: 20px;
     z-index: 200;
     pointer-events: none;
     overflow: hidden;
 }
 
 .resize-enabled .resources-dividers-label-bar {
     cursor: move;
 }
 
@@ skipping 29 matching lines @@
     white-space: nowrap;
     pointer-events: none;
 }
 
 .overview-grid-window-selector {
     position: absolute;
     top: 0;
     bottom: 0;
     background-color: rgba(125, 173, 217, 0.5);
     z-index: 250;
+    pointer-events: none;
 }
 
 .overview-grid-window {
     background-color: white;
     position: absolute;
     left: 0;
     right: 0;
     top: 0;
     height: 20px;
     z-index: 150;
@@ skipping 36 matching lines @@
     cursor: ew-resize;
 }
 
 .overview-grid-window-resizer-right {
     margin-left: -3px;
     margin-right: -2px;
 }
 
 /* Network timing is shared between popover and network item view pane */
 
+.network-timing-table td {
+    padding: 0;
+}
+
 .network-timing-row {
     position: relative;
     height: 16px;
 }
 
 .network-timing-bar {
     position: absolute;
     background-color: red;
     border-left: 1px solid red;
     opacity: 0.4;
@@ skipping 125 matching lines @@
 .webkit-html-external-link {
     /* Keep this in sync with view-source.css (.webkit-html-external-link) */
     text-decoration: none;
 }
 
 .webkit-html-external-link:hover {
     /* Keep this in sync with view-source.css (.webkit-html-external-link:hover) */
     text-decoration: underline;
 }
 
+.webkit-html-end-of-file {
+    /* Keep this in sync with view-source.css (.webkit-html-end-of-file) */
+    color: rgb(255, 0, 0);
+    font-weight: bold;
+}
+
 /* popover.css */
 
 .popover {
     position: absolute;
     -webkit-border-image: url(Images/popoverBackground.png) 25 25 25 25;
     border-width: 25px;
     z-index: 100;
     pointer-events: none;
 }
 
@@ skipping 153 matching lines @@
 }
 
 .fill {
     position: absolute;
     top: 0;
     left: 0;
     right: 0;
     bottom: 0;
 }
 
+.hbox {
+    display: flex !important;
+    flex-direction: row;
+}
+
+.vbox {
+    display: flex !important;
+    flex-direction: column;
+}
+
 .inline-block {
     display: inline-block;
 }
 
 .hidden {
-    display: none;
+    display: none !important;
 }
 
-.nowrap {
+.nowrap,
+.nowrap-below,
+.nowrap-below div,
+.nowrap-below span {
     white-space: nowrap !important;
 }
 
-#toolbar {
-    position: absolute;
-    top: 0;
-    left: 0;
-    right: 0;
-    height: 26px;
+.toolbar-background {
     background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(191, 191, 191)), to(rgb(151, 151, 151)));
-    padding-top: 1px;
-    padding-left: 5px;
+    padding: 1px 0 0 1px;
     border-bottom: 1px solid rgb(80, 80, 80);
-    -webkit-flex-direction: row;
     background-origin: padding-box;
     background-clip: padding-box;
 }
 
+.toolbar {
+    flex: 0 0 25px;
+    display: flex;
+    flex-direction: row;
+    position: relative;
+}
+
+.toolbar .tabbed-pane-header {
+    border: none;
+}
+
+.toolbar .tabbed-pane-header-contents {
+    margin: 0;
+}
+
+.toolbar .tabbed-pane-header-tab {
+    border-width: 0 2px 0 2px;
+    background: none;
+    padding-right: 3px;
+}
+
+.toolbar .tabbed-pane-header-tab.selected {
+    border-width: 0 2px 0 2px;
+    -webkit-border-image: url(Images/toolbarItemSelected.png) 0 2 0 2;
+}
+
+.toolbar button.status-bar-item {
+    border: none;
+    margin: 0 -2px;
+}
+
 button,
 input,
 select {
   font-family: inherit;
   font-size: inherit;
 }
 
-body.inactive #toolbar {
+body.inactive .toolbar-background {
     background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(233, 233, 233)), to(rgb(207, 207, 207)));
     border-bottom: 1px solid rgb(64%, 64%, 64%);
 }
 
-body.dock-to-bottom #toolbar {
+body.dock-to-bottom .toolbar-background {
     padding-top: 0;
     border-top: 1px solid rgb(100, 100, 100);
     cursor: default;
 }
 
-body.dock-to-bottom.platform-mac #toolbar {
+body.dock-to-bottom.platform-mac .toolbar-background {
     border-top-color: white;
 }
 
-body.dock-to-bottom.inactive #toolbar {
+body.dock-to-bottom.inactive .toolbar-background {
     border-top: 1px solid rgb(64%, 64%, 64%);
 }
 
-body.platform-windows #toolbar,
-body.platform-windows.inactive #toolbar {
+body.platform-windows .toolbar-background,
+body.platform-windows.inactive .toolbar-background {
     background-image: none;
 }
 
-body.undocked.platform-mac-leopard #toolbar {
+body.undocked.platform-mac-leopard .toolbar-background {
     background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(175, 175, 175)), to(rgb(151, 151, 151))) !important;
 }
 
-body.undocked.platform-mac-leopard.inactive #toolbar {
+body.undocked.platform-mac-leopard.inactive .toolbar-background {
     background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(221, 221, 221)), to(rgb(207, 207, 207))) !important;
 }
 
-body.undocked.platform-mac-snowleopard #toolbar {
+body.undocked.platform-mac-snowleopard .toolbar-background {
     background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(189, 189, 189)), to(rgb(167, 167, 167))) !important;
 }
 
-body.undocked.platform-mac-snowleopard.inactive #toolbar {
+body.undocked.platform-mac-snowleopard.inactive .toolbar-background {
     background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(228, 228, 228)), to(rgb(216, 216, 216))) !important;
 }
 
-body.undocked.platform-mac-mountain-lion #toolbar {
+body.undocked.platform-mac-mountain-lion .toolbar-background {
     background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(208, 208, 208)), to(rgb(200, 200, 200))) !important;
 }
 
-body.undocked.platform-mac-mountain-lion.inactive #toolbar {
+body.undocked.platform-mac-mountain-lion.inactive .toolbar-background {
     background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(238, 238, 238)), to(rgb(224, 224, 224))) !important;
 }
 
-.toolbar-item {
-    display: inline-block;
-    float: left;
-    margin: 0;
-    padding-right: 6px;
-    background-color: transparent;
-    border-style: none;
-    border-color: transparent;
-    color: inherit;
+.toolbar > .tabbed-pane-header {
+    flex: auto;
 }
 
-.toolbar-item {
-    height: 24px;
+.toolbar-controls-left {
+    flex: none;
+    opacity: 0.8;
+    padding-top: 1px;
 }
 
-.toolbar-item.toggleable.toggled-on {
-    border-width: 0 2px 0 2px;
-    padding-left: 4px;
-    padding-right: 4px;
-    -webkit-border-image: url(Images/toolbarItemSelected.png) 0 2 0 2;
+.toolbar-controls-right {
+    flex: none;
+    margin-right: 2px;
+    padding-top: 1px;
 }
 
-.toolbar-label {
-    line-height: 22px;
-    text-shadow: rgba(255, 255, 255, 0.5) 0 1px 0;
-    display: inline;
-}
-
-.toolbar-item.toggleable .close-button {
-    margin-left: 2px;
-    margin-right: -2px;
-    position: relative;
-    top: 2px;
-    opacity: 0.5;
-}
-
-.toolbar-item.toggleable .close-button:hover {
-    opacity: 1;
-}
-
-#toolbar-dropdown .toolbar-items-separator {
-    border-bottom: 1px solid #aaa;
-    width: 100%;
-    margin: 5px 0;
-}
-
-.toolbar-item.toggleable:active .toolbar-label {
-    text-shadow: none;
-}
-
-body.dock-to-bottom #search-toolbar-label {
-    display: none;
-}
-
-#toolbar-controls {
-    float: right;
-    display: -webkit-flex;
-    -webkit-align-items: center;
-    height: 100%;
-}
-
-#toolbar-dropdown-arrow {
-    font-size: 14px;
-    font-weight: bold;
-    border: 0;
-    background-color: transparent;
-    border-radius: 5px;
-    text-shadow: none;
-    cursor: default;
-    margin: 0;
-    /* A line height of 0 allows precise text positioning using padding. */
-    line-height: 0;
-    padding: 11px 6px 11px;
-}
-
-#toolbar-dropdown-arrow.dropdown-visible {
-    background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(251, 251, 251, 0.9)), to(rgba(231, 231, 231, 0.9)));
-}
-
-#toolbar-dropdown-arrow:hover {
-    background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(191, 191, 191, 0.7)), to(rgba(171, 171, 171, 0.5)));
-}
-
-#toolbar-dropdown-arrow:active {
-    background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(111, 111, 111, 0.8)), to(rgba(91, 91, 91, 0.8)));
-}
-
-#toolbar-dropdown {
-    position: absolute;
-    z-index: 1000;
-    box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.4);
-    border: 1px solid rgb(128, 128, 128);
-    background-color: inherit;
-    background-image: inherit;
-}
-
-body.undocked.platform-mac-leopard #toolbar-dropdown,
-body.undocked.platform-mac-snowleopard #toolbar-dropdown {
-    background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(191, 191, 191)), to(rgb(151, 151, 151)));
-}
-
-#toolbar-dropdown .scrollable-content {
-    display: -webkit-flex;
-    -webkit-flex-direction: column;
-    -webkit-align-items: flex-start;
-    padding-right: 0;
-}
-
-#toolbar-dropdown .toolbar-item {
-    display: -webkit-flex;
-    -webkit-flex-direction: row;
-    -webkit-flex: none;
-    width: 100%;
-    border: 1px solid rgba(0, 0, 0, 0);
-}
-
-#toolbar-dropdown .toolbar-item.toggleable.toggled-on {
-    border: 1px solid rgba(100, 100, 120, 0.4);
-    -webkit-border-image: none;
-    background: -webkit-gradient(linear, left top, left bottom, from(rgba(128, 128, 128, 0.6)), to(rgba(128, 128, 128, 0.6)), color-stop(20%, rgba(158, 158, 158, 0.2)), color-stop(80%, rgba(158, 158, 158, 0.2)));
-}
-
-#toolbar-dropdown .toolbar-item.toggleable:hover {
-    background: -webkit-gradient(linear, left top, left bottom, from(rgba(128, 128, 128, 0.6)), to(rgba(128, 128, 128, 0.3)), color-stop(20%, rgba(158, 158, 158, 0.2)), color-stop(80%, rgba(158, 158, 158, 0.1)));
-}
-
-#toolbar-dropdown .toolbar-label {
-    line-height: 22px;
-    top: 0;
-}
-
-#toolbar-panels-menu {
-    border: 0;
-    border-radius: 5px;
-    cursor: default;
-    font-family: Arial, Helvetica, sans-serif !important;
-    font-weight: bold;
-    line-height: 16px;
-    height: 22px;
-    padding: 0 4px 0 4px;
-    margin: 1px 3px;
-}
-
-#toolbar-panels-menu:hover:not(.disabled) {
-    background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(191, 191, 191, 0.7)), to(rgba(171, 171, 171, 0.5)));
-}
-
-#toolbar-panels-menu.disabled {
-    opacity: 0.4;
-    text-shadow: white 1px 1px 0;
-}
-
-#toolbar-panels-menu:active:not(.disabled) {
-    background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(111, 111, 111, 0.8)), to(rgba(91, 91, 91, 0.8)));
+.toolbar-controls-right #error-warning-count,
+.toolbar-controls-right .console-status-bar-item,
+.toolbar-controls-right .settings-status-bar-item,
+.toolbar-controls-right .dock-status-bar-item
+{
+    opacity: 0.8;
 }
 
 .scrollable-content {
     position: static;
     height: 100%;
     overflow-y: auto;
     width: 100%;
     margin-right: 12px;
     padding-right: 3px;
 }
@@ skipping 170 matching lines @@
 
 .close-button-gray:hover {
     background-position: -143px -216px;
 }
 
 .close-button-gray:active {
     background-position: -160px -216px;
 }
 
 
-.close-left {
-    float: left;
-}
-
-body.undocked .toolbar-item.close-left, body.undocked .toolbar-item.close-right {
+body.undocked .toolbar-item .close-button {
     display: none;
 }
 
-body.platform-mac .toolbar-item.close-right {
+body.remote .toolbar-item .close-button {
     display: none;
 }
 
-body.remote .toolbar-item.close-left, body.remote .toolbar-item.close-right {
-    display: none;
-}
-
-body:not(.platform-mac) .toolbar-item.close-left {
-    display: none;
-}
-
-.toolbar-item.close-left,
-.toolbar-item.close-right {
-  display: -webkit-flex;
-  -webkit-align-items: center;
-  height: 100%;
-  cursor: default;
-}
-
-#root {
-    position: absolute;
-    top: 0;
-    left: 0;
-    right: 0;
-    bottom: 0;
-}
-
-#main {
-    position: absolute;
-    z-index: 1;
-    top: 26px;
-    left: 0;
-    right: 0;
-    bottom: 0;
-    overflow: hidden;
+.panel-status-bar {
+    border-top: none;
+    display: flex;
+    pointer-events: none;
     background-color: white;
-}
-
-#main-panels {
-    position: absolute;
-    top: 0;
-    left: 0;
-    right: 0;
-    bottom: 23px;
-    overflow: hidden;
-}
-
-body.drawer-visible #main-panels {
-    bottom: 24px;
-}
-
-#main-status-bar {
-    position: absolute;
-    bottom: 0;
-    left: 0;
-    right: 0;
+    flex: 0 0 23px;
+    position: relative;
 }
 
 .status-bar {
     position: relative;
     white-space: nowrap;
     height: 23px;
     overflow: hidden;
     width: 100%;
     z-index: 12;
-    background-image: -webkit-linear-gradient(rgb(243,243,243), rgb(235,235,235));
     border-top: 1px solid rgb(202, 202, 202);
     display: -webkit-flex;
 }
 
 .status-bar > div {
     display: inline-block;
     vertical-align: top;
     overflow: visible;
 }
 
 .status-bar-item {
     display: inline-block;
     pointer-events: auto;
     cursor: default;
     height: 22px;
     padding: 0;
     margin-left: -1px;
     margin-right: 0;
     vertical-align: top;
     border: 0 transparent none;
     background-color: transparent;
+    flex: none;
 }
 
 .status-bar-text {
     padding-left: 5px;
     padding-right: 15px;
     padding-top: 3px;
 }
 
-#floating-status-bar-container {
-    position: absolute;
-    left: 0;
-    right: 0;
-    bottom: 0;
-    display: none;
-    border-bottom: 1px solid rgb(202, 202, 202);
-    cursor: ns-resize;
-    height: 24px;
-}
-
-body.drawer-overlay #floating-status-bar-container {
-    box-shadow: 1px 1px 5px 2px rgba(128, 128, 128, 0.7);
-}
-
-body.drawer-visible #floating-status-bar-container {
-    display: -webkit-flex;
-}
-
-#floating-status-bar-resizer {
-    content: url(Images/statusbarResizerVertical.png);
-    margin-top: 7px;
-    pointer-events: none;
-    height: 8px;
-}
-
-#panel-status-bar {
-    -webkit-flex: 1 0;
-    display: -webkit-flex;
-    pointer-events: none;
-}
-
 #drawer-view-anchor {
     display: inline-block;
 }
 
 .status-bar-item:active {
     position: relative;
     z-index: 200;
 }
 
 .glyph {
@@ skipping 29 matching lines @@
 
 .long-click-glyph.shadow {
     top: 1px;
     background-color: white !important;
     z-index: 0;
 }
 
 button.status-bar-item {
     position: relative;
     width: 32px;
-    border-left: 1px solid rgb(202, 202, 202);
-    border-right: 1px solid rgb(202, 202, 202);
 }
 
 .status-bar button.status-bar-item .glyph {
     margin: 0 -1px;
 }
 
-.status-bar select.status-bar-item:active,
-.status-bar button.status-bar-item:active {
-    border-left: 1px solid rgb(120, 120, 120);
-    border-right: 1px solid rgb(120, 120, 120);
-}
-
 button.status-bar-item .glyph.shadow {
     background-color: rgba(255, 255, 255, 0.33) !important;
 }
 
 button.status-bar-item.toggled-on .glyph {
     background-color: rgb(66, 129, 235);
 }
 
+button.status-bar-item:hover .glyph {
+    opacity: 1;
+}
+
 button.status-bar-item:disabled {
-    opacity: 0.5;
     background-position: 0 0 !important;
 }
 
+button.status-bar-item:disabled .glyph {
+    opacity: 0.5 !important;
+}
+
 button.status-bar-item.extension {
     background-image: none;
 }
 
 .status-bar-select-container {
     display: inline-block;
 }
 
 .status-bar-select-arrow {
     background-image: url(Images/statusbarButtonGlyphs.png);
@@ skipping 21 matching lines @@
     text-shadow: rgba(255, 255, 255, 0.75) 0 1px 0;
     -webkit-appearance: none;
     border: 0;
     border-radius: 0;
     padding: 0 15px 0 5px;
     margin-right: -10px;
     position: relative;
     line-height: 20px;
 }
 
-select.status-bar-item,
-select.status-bar-item:hover {
-    border-left: 1px solid rgb(202, 202, 202);
-    border-right: 1px solid rgb(202, 202, 202);
-}
-
 .status-bar-item > .glyph {
     -webkit-mask-image: url(Images/statusbarButtonGlyphs.png);
     -webkit-mask-size: 320px 120px;
+    opacity: 0.8;
 }
 
 .console-filter > .glyph {
     -webkit-mask-position: -32px -48px;
 }
 
 @media (-webkit-min-device-pixel-ratio: 1.5) {
 .status-bar-item > .glyph {
     -webkit-mask-image: url(Images/statusbarButtonGlyphs2x.png);
 }
@@ skipping 21 matching lines @@
     position: absolute;
     width: 31px;
     bottom: -3px;
     background: white;
 }
 
 .alternate-status-bar-buttons-bar .status-bar-item {
     height: 24px;
     margin-top: -1px;
     border: 1px solid rgb(202, 202, 202);
-    border-bottom: 1px solid transparent;
 }
 
 .alternate-status-bar-buttons-bar .status-bar-item.emulate-active {
     background-color: rgb(163,163,163);
     border: 1px solid rgb(120, 120, 120);
-    border-bottom: 1px solid transparent;
 }
 
 button.status-bar-item.settings-status-bar-item,
 button.status-bar-item.settings-status-bar-item:active {
     border-right: 0 transparent none;
 }
 
 button.status-bar-item.left-sidebar-show-hide-button,
 button.status-bar-item.right-sidebar-show-hide-button {
     position: absolute;
@@ skipping 99 matching lines @@
 
 .green-ball {
     background-position: -235px -96px;
 }
 
 .orange-ball {
     background-position: -246px -96px;
 }
 
 #error-warning-count {
+    display: inline-block;
     padding: 4px 6px 6px 0;
     font-size: 11px;
     height: 19px;
     cursor: pointer;
     line-height: 14px;
 }
 
 #error-warning-count:hover {
     border-bottom: 1px solid rgb(96, 96, 96);
 }
 
 #error-warning-count .error-icon-small,
 #error-warning-count .warning-icon-small {
     vertical-align: -1px;
     margin-right: 2px;
 }
 
 #error-warning-count .warning-icon-small {
     margin-left: 6px;
 }
 
-#drawer {
+.drawer {
     display: none;
-    position: absolute;
-    bottom: 0;
-    left: 0;
-    right: 0;
-    height: 200px;
+    flex: 0 0 200px;
+    position: relative;
     background-color: white;
     z-index: 1;
 }
 
-#drawer-body {
-    position: absolute;
-    top: 0;
-    bottom: 24px;
-    left: 0;
-    right: 0;
-}
-
 #drawer-contents {
     position: absolute;
     top: 0;
     bottom: 0;
     left: 0;
     right: 0;
+    display: flex;
+}
+
+#drawer-contents > .tabbed-pane > .tabbed-pane-header {
+    background-color: rgb(236, 236, 236);
+    cursor: ns-resize;
+    border-top: 1px solid rgb(124, 124, 124);
+    border-bottom: 1px solid rgb(203, 203, 203);
+}
+
+body.inactive #drawer-contents .tabbed-pane-header {
+    border-top: 1px solid rgb(64%, 64%, 64%);
+}
+
+#drawer-contents .tabbed-pane-header .tabbed-pane-header-tab {
+    cursor: default;
+}
+
+.drawer-resizer {
+    position: absolute;
+    right: 0;
+    top: 8px;
+    content: url(Images/statusbarResizerVertical.png);
+    height: 8px;
+    pointer-events: none;
 }
 
 #drawer-footer {
     position: absolute;
     bottom: 0;
     left: 0;
     right: 0;
     font-size: 11px;
     height: 23px;
+    background-color: rgb(236, 236, 236);
 }
 
-body.drawer-visible #drawer {
+body.drawer-visible .drawer {
     display: block;
 }
 
 body.platform-mac .monospace,
 body.platform-mac .source-code {
     font-size: 11px !important;
     font-family: Menlo, monospace;
 }
 
 body.platform-mac.platform-mac-tiger .monospace,
 body.platform-mac.platform-mac-tiger .source-code {
     font-size: 10px !important;
     font-family: Monaco, monospace;
 }
 
 body.platform-windows .monospace,
 body.platform-windows .source-code {
     font-size: 12px !important;
     font-family: Consolas, Lucida Console, monospace;
 }
 
 body.platform-linux .monospace,
 body.platform-linux .source-code {
     font-size: 11px !important;
     font-family: dejavu sans mono, monospace;
 }
 
-#console-view {
-    position: absolute;
-    top: 0;
-    bottom: 0;
-    left: 0;
-    right: 0;
-    overflow-y: auto;
+.console-status-bar {
+    flex: 0 0 23px;
+    overflow: hidden;
 }
 
 #console-messages {
-    position: absolute;
-    z-index: 0;
-    top: 0;
-    left: 0;
-    right: 0;
-    bottom: 0;
+    flex: 1 1;
     padding: 2px 0;
-    overflow-y: overlay;
+    overflow-y: auto;
     word-wrap: break-word;
     -webkit-user-select: text;
+    border-top: 1px solid rgb(230, 230, 230);
 }
 
 #console-prompt {
     clear: right;
     position: relative;
-    border-top: 1px solid rgb(240, 240, 240);
     padding: 1px 22px 1px 0;
     margin-left: 24px;
     min-height: 16px;
     white-space: pre-wrap;
     -webkit-user-modify: read-write-plaintext-only;
 }
 
 #console-prompt::before {
     background-position: -192px -96px;
 }
 
 .console-user-command-result.console-log-level::before {
     background-position: -202px -96px;
 }
 
 .console-message,
 .console-user-command {
     clear: right;
     position: relative;
-    border-top: 1px solid rgb(240, 240, 240);
+    border-bottom: 1px solid rgb(240, 240, 240);
     padding: 1px 22px 1px 0;
     margin-left: 24px;
     min-height: 16px;
 }
 
 .console-mesage:first-child {
     border-top: none;
 }
 
 .console-adjacent-user-command-result {
@@ skipping 52 matching lines @@
     color: white;
     border-radius: 7px;
 }
 
 .console-message-text {
     white-space: pre-wrap;
 }
 
 .repeated-message.console-error-level::before,
 .repeated-message.console-warning-level:before,
-.repeated-message.console-debug-level:before {
+.repeated-message.console-debug-level:before,
+.repeated-message.console-info-level:before {
     visibility: hidden;
 }
 
 .repeated-message .outline-disclosure,
 .repeated-message > .console-message-text {
     -webkit-flex: 1;
 }
 
 .console-info {
     color: rgb(128, 128, 128);
@@ skipping 63 matching lines @@
 .console-error-level .section > .header .title {
     color: red !important;
 }
 
 .console-debug-level .console-message-text {
     color: blue;
 }
 
 .console-error-level::before,
 .console-warning-level::before,
-.console-debug-level::before {
+.console-debug-level::before,
+.console-info-level::before {
     background-image: url(Images/statusbarButtonGlyphs.png);
     background-size: 320px 120px;
     width: 10px;
     height: 10px;
 }
 
 @media (-webkit-min-device-pixel-ratio: 1.5) {
 .console-error-level::before,
 .console-warning-level::before,
-.console-debug-level::before {
+.console-debug-level::before,
+.console-info-level::before {
     background-image: url(Images/statusbarButtonGlyphs2x.png);
 }
 } /* media */
 
 .console-warning-level::before {
     background-position: -202px -107px;
 }
 
 .console-error-level::before {
     background-position: -213px -96px;
 }
 
+.console-info-level::before {
+    background-position: -213px -107px;
+}
+
 .console-user-command .console-message {
     margin-left: -24px;
     padding-right: 0;
     border-bottom: none;
 }
 
 .console-user-command::before {
     background-position: -192px -107px;
 }
 
@@ skipping 164 matching lines @@
 }
 
 .panel {
     display: none;
     overflow: hidden;
     position: absolute;
     top: 0;
     left: 0;
     right: 0;
     bottom: 0;
+    z-index: 0;
 }
 
 .panel.visible {
     display: block;
 }
 
+.panel.extension-panel.visible {
+    display: flex !important;
+    flex-direction: column;
+}
+
+.extension-view {
+    flex: auto;
+    position: relative;
+}
+
 iframe.extension {
     width: 100%;
     height: 100%;
 }
 
 iframe.panel.extension {
     display: block;
     height: 100%;
 }
 
@@ skipping 627 matching lines @@
 }
 
 .scope-bar li:active {
     background: rgba(0, 0, 0, 0.5);
 }
 
 
 .console-warning-level.repeated-message,
 .console-error-level.repeated-message,
 .console-log-level.repeated-message,
-.console-debug-level.repeated-message{
+.console-debug-level.repeated-message,
+.console-info-level.repeated-message {
     display: -webkit-flex;
 }
 
 .console-user-command-result {
     display: block;
 }
 
 .source-view-frame {
     width: 100%;
     height: 100%;
@@ skipping 185 matching lines @@
 }
 
 .sidebar-tree.small .sidebar-tree-item .status,
 .sidebar-tree .children.small .sidebar-tree-item .status,
 .sidebar-tree-item.small .status {
     margin-top: 1px;
 }
 
 .sidebar-tree-item.selected {
     color: white;
-    border-top: 1px solid rgb(145, 160, 192);
-    background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(162, 177, 207)), to(rgb(120, 138, 177)));
     text-shadow: rgba(0, 0, 0, 0.33) 1px 1px 0;
     background-origin: padding-box;
     background-clip: padding-box;
+    background-color: rgb(56, 121, 217);
 }
 
 :focus .sidebar-tree-item.selected {
-    border-top: 1px solid rgb(68, 128, 200);
-    background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(92, 147, 213)), to(rgb(21, 83, 170)));
+    background-color: rgb(56, 121, 217);
 }
 
 body.inactive .sidebar-tree-item.selected {
-    border-top: 1px solid rgb(151, 151, 151);
-    background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(180, 180, 180)), to(rgb(138, 138, 138)));
+    background-color: rgb(180,180,180);
 }
 
 .sidebar-tree-item .titles {
     position: relative;
     top: 5px;
     line-height: 12px;
     padding-bottom: 1px;
     text-overflow: ellipsis;
     overflow: hidden;
     white-space: nowrap;
@@ skipping 78 matching lines @@
 .storage-application-cache-status,
 .storage-application-cache-connectivity {
     position: relative;
     top: 4px;
 }
 
 .status-bar-items {
     position: absolute;
     top: 0;
     bottom: 0;
-    left: 200px;
+    left: 0;
     overflow: hidden;
     border-left: 1px solid rgb(184, 184, 184);
     margin-left: -1px;
 }
 
 .node-search-status-bar-item .glyph {
     -webkit-mask-position: -224px -24px;
 }
 
 .delete-storage-status-bar-item .glyph {
@@ skipping 200 matching lines @@
 }
 
 .search-view {
     position: absolute;
     top: 0;
     bottom: 0;
     left: 0;
     right: 0;
 }
 
-.search-drawer-header input[type="search"].search-config-search {
-    font-size: 11px;
-    margin-left: 4px;
+.search-drawer-header {
+    flex: none;
+    padding: 4px;
+}
+
+.search-drawer-header input[type="text"].search-config-search {
+    -webkit-appearance: none;
+    padding: 0 2px;
+    margin: 0;
+    border: 1px solid rgb(163, 163, 163);
+    height: 20px;
+    border-radius: 2px;
     color: #303030;
-    position: relative;
-    height: 19px;
+}
+
+.search-drawer-header input[type="search"].search-config-search:focus {
+    border: 1px solid rgb(190, 190, 190);
+    outline: none;
 }
 
 body.platform-mac .search-drawer-header input[type="search"].search-config-search {
     top: 1px;
 }
 
 .search-drawer-header label.search-config-label {
     margin-left: 8px;
     color: #303030;
 }
 
 .search-drawer-header input[type="checkbox"].search-config-checkbox {
     vertical-align: bottom;
 }
 
 body:not(.platform-mac) .search-drawer-header input[type="checkbox"].search-config-checkbox {
     margin-bottom: 5px;
 }
 
 body.platform-mac .search-drawer-header input[type="checkbox"].search-config-checkbox {
     margin-bottom: 4px;
 }
 
-.drawer-header {
-    font-size: 11px;
-    border-right: 1px solid rgb(197, 197, 197);
-    line-height: 21px;
-    padding-left: 6px;
-    display: inline-block;
-}
-
-.drawer-header .close-button {
-    position: relative;
-    top: 3px;
-    margin: 0 3px;
-}
-
 #bottom-status-bar-container {
     -webkit-flex: 1 1 0;
     width: 0;
     overflow: hidden;
 }
 
-.search-status-bar-item {
-    display: inline-block;
-    cursor: pointer;
-    font-size: 11px;
-    height: 23px;
+.search-status-bar-summary {
+    background-color: rgb(236, 236, 236);
+    border-top: 1px solid #ccc;
+    padding-left: 5px;
+    flex: 0 0 19px;
 }
 
-.search-status-bar-message {
-    margin-left:5px;
-    margin-right:5px;
-    margin-top:5px;
-    float:left;
+.search-status-bar-summary .progress-bar-container {
+    margin-top: -4px;
 }
 
 .progress-bar-stop-button-item {
     width: 19px;
     height: 24px;
     overflow: hidden;
 }
 
 .progress-bar-stop-button .glyph {
     -webkit-mask-position: -96px -48px;
     background-color: rgb(216, 0, 0) !important;
 }
 
-.search-results-status-bar-message {
-    margin-right: 10px;
-    cursor: default;
-    font-size: 11px;
-    float: right;
-    margin-top: 5px;
-}
-
 .search-view .search-results {
-    position: absolute;
-    top: 0;
-    bottom: 0;
-    left: 0;
-    right: 0;
     overflow-y: auto;
+    flex: auto;
 }
 
 #search-results-pane-file-based li {
     list-style: none;
 }
 
 #search-results-pane-file-based ol {
     -webkit-padding-start: 0;
     margin-top: 0;
 }
@@ skipping 258 matching lines @@
 .custom-popup-vertical-scroll ::-webkit-scrollbar-track-piece:vertical:increment {
     -webkit-border-image: url(Images/trackVert.png) 11 0 11 0;
     border-color: transparent;
     border-width: 0 0 11px 0;
 }
 
 .console-context {
     max-width: 200px;
 }
 
-.inspector-footer {
-    position: absolute;
-    bottom: 0;
-    left: 0;
-    right: 0;
+.inspector-footer.status-bar {
+    flex: 0 0 auto;
+    background-color: rgb(236, 236, 236);
     height: auto;
 }
 
 .progress-bar-container {
-    display: -webkit-flex;
+    display: inline-flex;
     margin: 0 8px;
     -webkit-flex: 1 0;
 }
 
 .progress-bar-container span {
     padding: 6px;
 }
 
 .progress-bar-container progress {
     margin-top: 7px;
     -webkit-flex: 1 0;
 }
 
 body.platform-mac .progress-bar-container progress {
     margin-top: 6px;
 }
 
 .progress-bar-container button.status-bar-item {
     border-left: none;
     margin-top: 1px;
 }
 
-.source-frame-cursor-position {
-    padding-left: 6px;
-    padding-top: 4px;
-    display: inline-block;
-    pointer-events: auto;
-    -webkit-user-select: text;
-    font-size: 11px;
-    cursor: text;
-    line-height: 14px;
-}
-
 .elements-tree-outline li.parent::before {
     top: 0 !important;
 }
 
+#drawer-editor-view {
+    flex: auto;
+}
+
+.toolbar-close-button-item {
+    display: inline-block;
+    float: right;
+    padding-right: 4px;
+    padding-top: 4px;
+    padding-left: 2px;
+}
+
+body.undocked .toolbar-close-button-item {
+    display: none;
+}