diff --git a/devtools/client/jar.mn b/devtools/client/jar.mn
index 97295ddc4ce9..d9a8f1284a6c 100644
--- a/devtools/client/jar.mn
+++ b/devtools/client/jar.mn
@@ -24,7 +24,6 @@ devtools.jar:
     content/shared/theme-switching.js (shared/theme-switching.js)
     content/shared/frame-script-utils.js (shared/frame-script-utils.js)
     content/styleeditor/styleeditor.xul (styleeditor/styleeditor.xul)
-    content/styleeditor/styleeditor.css (styleeditor/styleeditor.css)
     content/storage/storage.xul (storage/storage.xul)
     content/inspector/fonts/fonts.js (inspector/fonts/fonts.js)
     content/inspector/layout/layout.js (inspector/layout/layout.js)
diff --git a/devtools/client/styleeditor/styleeditor.css b/devtools/client/styleeditor/styleeditor.css
deleted file mode 100644
index 4d695b1ca90f..000000000000
--- a/devtools/client/styleeditor/styleeditor.css
+++ /dev/null
@@ -1,133 +0,0 @@
-/* vim:set ts=2 sw=2 sts=2 et: */
-/* This Source Code Form is subject to the terms of the Mozilla Public
- * License, v. 2.0. If a copy of the MPL was not distributed with this
- * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
-
-#style-editor-chrome {
-  -moz-box-flex: 1;
-}
-
-.stylesheet-error-message {
-  display: none;
-}
-
-li.error > .stylesheet-info > .stylesheet-more  > .stylesheet-error-message {
-  display: block;
-}
-
-.devtools-toolbar > spacer {
-  -moz-box-flex: 1;
-}
-
-.splitview-nav > li,
-.stylesheet-info,
-.stylesheet-more {
-  display: -moz-box;
-}
-
-.stylesheet-details-container {
-  -moz-box-flex: 1;
-}
-
-.stylesheet-media-container {
-  overflow-y: auto;
-}
-
-.media-rule-label {
-  display: flex;
-}
-
-.media-rule-condition {
-  flex: 1;
-  overflow: hidden;
-}
-
-.splitview-nav > li {
-  -moz-box-orient: horizontal;
-}
-
-.splitview-nav > li > hgroup {
-  display: -moz-box;
-  -moz-box-orient: vertical;
-  -moz-box-flex: 1;
-}
-
-.stylesheet-info > h1 {
-  -moz-box-flex: 1;
-}
-
-.stylesheet-name > label {
-  display: inline;
-  cursor: pointer;
-}
-
-.splitview-nav > li > hgroup.stylesheet-info {
-  -moz-box-pack: center;
-}
-
-.stylesheet-name {
-  white-space: nowrap;
-}
-
-li.unsaved > hgroup > h1 > .stylesheet-name:before {
-  content: "*";
-}
-
-li.linked-file-error .stylesheet-linked-file {
-  text-decoration: line-through;
-}
-
-li.linked-file-error .stylesheet-linked-file:after {
-  content: " ✘";
-}
-
-li.linked-file-error .stylesheet-rule-count {
-  visibility: hidden;
-}
-
-.stylesheet-linked-file:not(:empty):before {
-  content: " ↳ ";
-}
-
-.stylesheet-enabled {
-  display: -moz-box;
-  cursor: pointer;
-}
-
-.stylesheet-saveButton {
-  display: none;
-  margin-top: 0px;
-  margin-bottom: 0px;
-}
-
-.stylesheet-rule-count,
-li.splitview-active > hgroup > .stylesheet-more > h3 > .stylesheet-saveButton,
-li:hover > hgroup > .stylesheet-more > h3 > .stylesheet-saveButton {
-  display: -moz-box;
-}
-
-.stylesheet-more > spacer {
-  -moz-box-flex: 1;
-}
-
-/* portrait mode */
-@media (max-width: 550px) {
-  li.splitview-active > hgroup > .stylesheet-more > .stylesheet-rule-count,
-  li:hover > hgroup > .stylesheet-more > .stylesheet-rule-count {
-    display: none;
-  }
-
-  .stylesheet-more {
-    -moz-box-flex: 1;
-    -moz-box-pack: end;
-  }
-
-  .splitview-nav > li > hgroup.stylesheet-info {
-    -moz-box-orient: horizontal;
-    -moz-box-flex: 1;
-  }
-
-  .stylesheet-more > spacer {
-    -moz-box-flex: 0;
-  }
-}
diff --git a/devtools/client/styleeditor/styleeditor.xul b/devtools/client/styleeditor/styleeditor.xul
index e9f825ca073b..1a59261593fb 100644
--- a/devtools/client/styleeditor/styleeditor.xul
+++ b/devtools/client/styleeditor/styleeditor.xul
@@ -18,7 +18,6 @@
 <?xml-stylesheet href="chrome://devtools/content/shared/splitview.css" type="text/css"?>
 <?xml-stylesheet href="chrome://devtools/skin/widgets.css" type="text/css"?>
 <?xml-stylesheet href="chrome://devtools/skin/splitview.css" type="text/css"?>
-<?xml-stylesheet href="chrome://devtools/content/styleeditor/styleeditor.css" type="text/css"?>
 <?xml-stylesheet href="chrome://devtools/skin/styleeditor.css" type="text/css"?>
 <?xul-overlay href="chrome://global/content/editMenuOverlay.xul"?>
 
diff --git a/devtools/client/themes/styleeditor.css b/devtools/client/themes/styleeditor.css
index 551e51c7f207..1fe421e999d8 100644
--- a/devtools/client/themes/styleeditor.css
+++ b/devtools/client/themes/styleeditor.css
@@ -3,6 +3,23 @@
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
+#style-editor-chrome {
+  -moz-box-flex: 1;
+}
+
+.splitview-nav > li,
+.stylesheet-info,
+.stylesheet-more,
+.stylesheet-rule-count,
+li.splitview-active > hgroup > .stylesheet-more > h3 > .stylesheet-saveButton,
+li:hover > hgroup > .stylesheet-more > h3 > .stylesheet-saveButton {
+  display: -moz-box;
+}
+
+.devtools-toolbar > spacer {
+  -moz-box-flex: 1;
+}
+
 .style-editor-newButton {
   list-style-image: url(images/add.svg);
 }
@@ -11,6 +28,22 @@
   list-style-image: url(images/import.svg);
 }
 
+.stylesheet-details-container {
+  -moz-box-flex: 1;
+}
+
+.stylesheet-media-container {
+  overflow-y: auto;
+}
+
+.stylesheet-error-message {
+  display: none;
+}
+
+li.error > .stylesheet-info > .stylesheet-more  > .stylesheet-error-message {
+  display: block;
+}
+
 .stylesheet-title,
 .stylesheet-name {
   text-decoration: none;
@@ -18,6 +51,24 @@
 
 .stylesheet-name {
   font-size: 13px;
+  white-space: nowrap;
+}
+
+.stylesheet-name > label {
+  display: inline;
+  cursor: pointer;
+}
+
+.stylesheet-info > h1 {
+  -moz-box-flex: 1;
+}
+
+.splitview-nav > li > hgroup.stylesheet-info {
+  -moz-box-pack: center;
+}
+
+.stylesheet-more > spacer {
+  -moz-box-flex: 1;
 }
 
 .theme-dark .stylesheet-title,
@@ -43,6 +94,9 @@
 }
 
 .stylesheet-saveButton {
+  display: none;
+  margin-top: 0px;
+  margin-bottom: 0px;
   text-decoration: underline;
   cursor: pointer;
 }
@@ -59,6 +113,16 @@
   outline: 0; /* focus ring is on the stylesheet name */
 }
 
+.splitview-nav > li {
+  -moz-box-orient: horizontal;
+}
+
+.splitview-nav > li > hgroup {
+  display: -moz-box;
+  -moz-box-orient: vertical;
+  -moz-box-flex: 1;
+}
+
 .splitview-nav > li.unsaved > hgroup .stylesheet-name {
   font-style: italic;
 }
@@ -87,6 +151,7 @@
 }
 
 .media-rule-label {
+  display: flex;
   padding: 4px;
   cursor: pointer;
   border-bottom: 1px solid;
@@ -105,7 +170,14 @@
   opacity: 0.4;
 }
 
+.media-rule-condition {
+  flex: 1;
+  overflow: hidden;
+}
+
 .stylesheet-enabled {
+  display: -moz-box;
+  cursor: pointer;
   padding: 8px 0;
   margin: 0 8px;
   background-image: url(images/itemToggle.svg);
@@ -138,10 +210,24 @@
 
 .stylesheet-linked-file:not(:empty):before {
   margin-inline-start: 0.4em;
+  content: " ↳ ";
+}
+
+li.unsaved > hgroup > h1 > .stylesheet-name:before {
+  content: "*";
+}
+
+li.linked-file-error .stylesheet-linked-file {
+  text-decoration: line-through;
 }
 
 li.linked-file-error .stylesheet-linked-file:after {
   font-size: 110%;
+  content: " ✘";
+}
+
+li.linked-file-error .stylesheet-rule-count {
+  visibility: hidden;
 }
 
 .stylesheet-more > h3 {
@@ -176,6 +262,11 @@ h3 {
 
 /* portrait mode */
 @media (max-width: 550px) {
+  li.splitview-active > hgroup > .stylesheet-more > .stylesheet-rule-count,
+  li:hover > hgroup > .stylesheet-more > .stylesheet-rule-count {
+    display: none;
+  }
+
   .splitview-nav {
     box-shadow: none;
   }
@@ -196,11 +287,22 @@ h3 {
 
   .splitview-nav > li > hgroup.stylesheet-info {
     -moz-box-align: baseline;
+    -moz-box-orient: horizontal;
+    -moz-box-flex: 1;
   }
 
   .stylesheet-sidebar {
     width: 180px;
   }
+
+  .stylesheet-more {
+    -moz-box-flex: 1;
+    -moz-box-pack: end;
+  }
+
+  .stylesheet-more > spacer {
+    -moz-box-flex: 0;
+  }
 }
 
 /* CSS coverage */