diff --git a/assets/css/src/components/newsletter-editor/_common.scss b/assets/css/src/components-editor/_common.scss
similarity index 100%
rename from assets/css/src/components/newsletter-editor/_common.scss
rename to assets/css/src/components-editor/_common.scss
diff --git a/assets/css/src/components/newsletter-editor/_layout.scss b/assets/css/src/components-editor/_layout.scss
similarity index 91%
rename from assets/css/src/components/newsletter-editor/_layout.scss
rename to assets/css/src/components-editor/_layout.scss
index e6a6b5ecc0..40f5f7b011 100644
--- a/assets/css/src/components/newsletter-editor/_layout.scss
+++ b/assets/css/src/components-editor/_layout.scss
@@ -39,7 +39,7 @@
 
 .mailpoet_newsletter_wrapper {
   margin: auto;
-  max-width: $editor-width;
+  max-width: $grid-editor-width;
   position: relative;
-  width: $editor-width;
+  width: $grid-editor-width;
 }
diff --git a/assets/css/src/components/newsletter-editor/_library-overrides.scss b/assets/css/src/components-editor/_library-overrides.scss
similarity index 100%
rename from assets/css/src/components/newsletter-editor/_library-overrides.scss
rename to assets/css/src/components-editor/_library-overrides.scss
diff --git a/assets/css/src/components/newsletter-editor/components/_block-tools.scss b/assets/css/src/components-editor/components/_block-tools.scss
similarity index 100%
rename from assets/css/src/components/newsletter-editor/components/_block-tools.scss
rename to assets/css/src/components-editor/components/_block-tools.scss
diff --git a/assets/css/src/components/newsletter-editor/components/_drag-and-drop.scss b/assets/css/src/components-editor/components/_drag-and-drop.scss
similarity index 98%
rename from assets/css/src/components/newsletter-editor/components/_drag-and-drop.scss
rename to assets/css/src/components-editor/components/_drag-and-drop.scss
index 0fb41d6381..a72e79bef3 100644
--- a/assets/css/src/components/newsletter-editor/components/_drag-and-drop.scss
+++ b/assets/css/src/components-editor/components/_drag-and-drop.scss
@@ -41,7 +41,7 @@
 
 .mailpoet_block.mailpoet_droppable_active {
   border: 1px dashed $color-primary !important;
-  width: $editor-width;
+  width: $grid-editor-width;
 
   .mailpoet_tools {
     display: none !important;
diff --git a/assets/css/src/components/newsletter-editor/components/_forms.scss b/assets/css/src/components-editor/components/_forms.scss
similarity index 100%
rename from assets/css/src/components/newsletter-editor/components/_forms.scss
rename to assets/css/src/components-editor/components/_forms.scss
diff --git a/assets/css/src/components/newsletter-editor/components/_heading.scss b/assets/css/src/components-editor/components/_heading.scss
similarity index 100%
rename from assets/css/src/components/newsletter-editor/components/_heading.scss
rename to assets/css/src/components-editor/components/_heading.scss
diff --git a/assets/css/src/components/newsletter-editor/components/_history.scss b/assets/css/src/components-editor/components/_history.scss
similarity index 100%
rename from assets/css/src/components/newsletter-editor/components/_history.scss
rename to assets/css/src/components-editor/components/_history.scss
diff --git a/assets/css/src/components/newsletter-editor/components/_layers.scss b/assets/css/src/components-editor/components/_layers.scss
similarity index 100%
rename from assets/css/src/components/newsletter-editor/components/_layers.scss
rename to assets/css/src/components-editor/components/_layers.scss
diff --git a/assets/css/src/components/newsletter-editor/components/_resize.scss b/assets/css/src/components-editor/components/_resize.scss
similarity index 100%
rename from assets/css/src/components/newsletter-editor/components/_resize.scss
rename to assets/css/src/components-editor/components/_resize.scss
diff --git a/assets/css/src/components/newsletter-editor/components/_save.scss b/assets/css/src/components-editor/components/_save.scss
similarity index 100%
rename from assets/css/src/components/newsletter-editor/components/_save.scss
rename to assets/css/src/components-editor/components/_save.scss
diff --git a/assets/css/src/components/newsletter-editor/components/_sidebar.scss b/assets/css/src/components-editor/components/_sidebar.scss
similarity index 100%
rename from assets/css/src/components/newsletter-editor/components/_sidebar.scss
rename to assets/css/src/components-editor/components/_sidebar.scss
diff --git a/assets/css/src/components/newsletter-editor/components/_sidepanel.scss b/assets/css/src/components-editor/components/_sidepanel.scss
similarity index 100%
rename from assets/css/src/components/newsletter-editor/components/_sidepanel.scss
rename to assets/css/src/components-editor/components/_sidepanel.scss
diff --git a/assets/css/src/components/newsletter-editor/content-blocks/_automated-latest-content.scss b/assets/css/src/components-editor/content-blocks/_automated-latest-content.scss
similarity index 100%
rename from assets/css/src/components/newsletter-editor/content-blocks/_automated-latest-content.scss
rename to assets/css/src/components-editor/content-blocks/_automated-latest-content.scss
diff --git a/assets/css/src/components/newsletter-editor/content-blocks/_base.scss b/assets/css/src/components-editor/content-blocks/_base.scss
similarity index 100%
rename from assets/css/src/components/newsletter-editor/content-blocks/_base.scss
rename to assets/css/src/components-editor/content-blocks/_base.scss
diff --git a/assets/css/src/components/newsletter-editor/content-blocks/_button.scss b/assets/css/src/components-editor/content-blocks/_button.scss
similarity index 100%
rename from assets/css/src/components/newsletter-editor/content-blocks/_button.scss
rename to assets/css/src/components-editor/content-blocks/_button.scss
diff --git a/assets/css/src/components/newsletter-editor/content-blocks/_container.scss b/assets/css/src/components-editor/content-blocks/_container.scss
similarity index 99%
rename from assets/css/src/components/newsletter-editor/content-blocks/_container.scss
rename to assets/css/src/components-editor/content-blocks/_container.scss
index 1218bee422..ac27d5f6c8 100644
--- a/assets/css/src/components/newsletter-editor/content-blocks/_container.scss
+++ b/assets/css/src/components-editor/content-blocks/_container.scss
@@ -31,7 +31,7 @@
 
   > .mailpoet_container_block {
     border: 0;
-    width: $editor-width;
+    width: $grid-editor-width;
   }
 
   > .mailpoet_container_block > .mailpoet_container > .mailpoet_container_block {
diff --git a/assets/css/src/components/newsletter-editor/content-blocks/_divider.scss b/assets/css/src/components-editor/content-blocks/_divider.scss
similarity index 94%
rename from assets/css/src/components/newsletter-editor/content-blocks/_divider.scss
rename to assets/css/src/components-editor/content-blocks/_divider.scss
index 9632c8f066..bb92f7bba2 100644
--- a/assets/css/src/components/newsletter-editor/content-blocks/_divider.scss
+++ b/assets/css/src/components-editor/content-blocks/_divider.scss
@@ -12,7 +12,7 @@
   border: 1px solid transparent;
   display: block;
   margin: auto;
-  max-width: $editor-width;
+  max-width: $grid-editor-width;
   padding: 10px 0;
   width: 100%;
 
diff --git a/assets/css/src/components/newsletter-editor/content-blocks/_footer.scss b/assets/css/src/components-editor/content-blocks/_footer.scss
similarity index 100%
rename from assets/css/src/components/newsletter-editor/content-blocks/_footer.scss
rename to assets/css/src/components-editor/content-blocks/_footer.scss
diff --git a/assets/css/src/components/newsletter-editor/content-blocks/_header.scss b/assets/css/src/components-editor/content-blocks/_header.scss
similarity index 100%
rename from assets/css/src/components/newsletter-editor/content-blocks/_header.scss
rename to assets/css/src/components-editor/content-blocks/_header.scss
diff --git a/assets/css/src/components/newsletter-editor/content-blocks/_image.scss b/assets/css/src/components-editor/content-blocks/_image.scss
similarity index 100%
rename from assets/css/src/components/newsletter-editor/content-blocks/_image.scss
rename to assets/css/src/components-editor/content-blocks/_image.scss
diff --git a/assets/css/src/components/newsletter-editor/content-blocks/_posts.scss b/assets/css/src/components-editor/content-blocks/_posts.scss
similarity index 100%
rename from assets/css/src/components/newsletter-editor/content-blocks/_posts.scss
rename to assets/css/src/components-editor/content-blocks/_posts.scss
diff --git a/assets/css/src/components/newsletter-editor/content-blocks/_products.scss b/assets/css/src/components-editor/content-blocks/_products.scss
similarity index 100%
rename from assets/css/src/components/newsletter-editor/content-blocks/_products.scss
rename to assets/css/src/components-editor/content-blocks/_products.scss
diff --git a/assets/css/src/components/newsletter-editor/content-blocks/_social.scss b/assets/css/src/components-editor/content-blocks/_social.scss
similarity index 100%
rename from assets/css/src/components/newsletter-editor/content-blocks/_social.scss
rename to assets/css/src/components-editor/content-blocks/_social.scss
diff --git a/assets/css/src/components/newsletter-editor/content-blocks/_spacer.scss b/assets/css/src/components-editor/content-blocks/_spacer.scss
similarity index 100%
rename from assets/css/src/components/newsletter-editor/content-blocks/_spacer.scss
rename to assets/css/src/components-editor/content-blocks/_spacer.scss
diff --git a/assets/css/src/components/newsletter-editor/content-blocks/_text.scss b/assets/css/src/components-editor/content-blocks/_text.scss
similarity index 100%
rename from assets/css/src/components/newsletter-editor/content-blocks/_text.scss
rename to assets/css/src/components-editor/content-blocks/_text.scss
diff --git a/assets/css/src/components/newsletter-editor/content-blocks/_woocommerce-content.scss b/assets/css/src/components-editor/content-blocks/_woocommerce-content.scss
similarity index 100%
rename from assets/css/src/components/newsletter-editor/content-blocks/_woocommerce-content.scss
rename to assets/css/src/components-editor/content-blocks/_woocommerce-content.scss
diff --git a/assets/css/src/components/newsletter-editor/content-blocks/_woocommerce-heading.scss b/assets/css/src/components-editor/content-blocks/_woocommerce-heading.scss
similarity index 100%
rename from assets/css/src/components/newsletter-editor/content-blocks/_woocommerce-heading.scss
rename to assets/css/src/components-editor/content-blocks/_woocommerce-heading.scss
diff --git a/assets/css/src/components/_newsletter-templates.scss b/assets/css/src/components/_newsletter-templates.scss
index 8101991260..533573d1b0 100644
--- a/assets/css/src/components/_newsletter-templates.scss
+++ b/assets/css/src/components/_newsletter-templates.scss
@@ -1,8 +1,8 @@
 .mailpoet_template_iframe {
   left: 0;
-  max-width: $editor-width;
+  max-width: $grid-editor-width;
   position: absolute;
   top: 0;
-  width: $editor-width;
+  width: $grid-editor-width;
   z-index: -9999;
 }
diff --git a/assets/css/src/mailpoet-editor.scss b/assets/css/src/mailpoet-editor.scss
new file mode 100644
index 0000000000..91ce8f17ae
--- /dev/null
+++ b/assets/css/src/mailpoet-editor.scss
@@ -0,0 +1,49 @@
+// Settings
+// Global variables, config switches. Not producing any CSS.
+@import 'settings/grid';
+@import 'settings/colors';
+@import 'settings/editor';
+@import 'settings/range';
+
+// Tools
+// Default mixins and functions. Still not producing any CSS.
+@import 'mixins/animations';
+@import 'mixins/breakpoints';
+
+// Generic
+// 3rd-party styles, can be overwritten.
+@import '../../../node_modules/spectrum-colorpicker/spectrum';
+
+// Components
+// Actual UI components.
+@import 'components-editor/common';
+@import 'components-editor/layout';
+@import 'components-editor/components/forms';
+@import 'components-editor/components/heading';
+@import 'components-editor/components/history';
+@import 'components-editor/components/sidebar';
+@import 'components-editor/components/sidepanel';
+@import 'components-editor/components/save';
+@import 'components-editor/components/block-tools';
+@import 'components-editor/components/layers';
+@import 'components-editor/components/drag-and-drop';
+@import 'components-editor/components/resize';
+@import 'components-editor/content-blocks/base';
+@import 'components-editor/content-blocks/container';
+@import 'components-editor/content-blocks/automated-latest-content';
+@import 'components-editor/content-blocks/posts';
+@import 'components-editor/content-blocks/products';
+@import 'components-editor/content-blocks/button';
+@import 'components-editor/content-blocks/divider';
+@import 'components-editor/content-blocks/image';
+@import 'components-editor/content-blocks/social';
+@import 'components-editor/content-blocks/spacer';
+@import 'components-editor/content-blocks/text';
+@import 'components-editor/content-blocks/header';
+@import 'components-editor/content-blocks/footer';
+@import 'components-editor/content-blocks/woocommerce-heading';
+@import 'components-editor/content-blocks/woocommerce-content';
+
+// Utilities
+// Helpers and overrides.
+@import 'components-editor/library-overrides';
diff --git a/assets/css/src/mailpoet-plugin.scss b/assets/css/src/mailpoet-plugin.scss
index 0a82c3f52d..55e8d26fbb 100644
--- a/assets/css/src/mailpoet-plugin.scss
+++ b/assets/css/src/mailpoet-plugin.scss
@@ -1,22 +1,24 @@
-// 1. Settings
+// Settings
 // Global variables, config switches. Not producing any CSS.
+@import 'settings/grid';
 @import 'settings/badge';
 @import 'settings/colors';
-@import 'settings/editor';
 @import 'settings/legacy-modal';
 @import 'settings/modal';
 @import 'settings/newsletter';
 @import 'settings/progress';
-@import 'settings/range';
 
-// 2. Tools
+// Tools
 // Default mixins and functions. Still not producing any CSS.
-@import 'mixins/animations';
 @import 'mixins/breakpoints';
 @import 'mixins/clearfix';
 
+// Generic
+// 3rd-party styles, can be overwritten.
 @import '../../../node_modules/select2/dist/css/select2';
-@import '../../../node_modules/spectrum-colorpicker/spectrum';
+
+// Components
+// Actual UI components.
 @import 'components/automatic-emails';
 @import 'components/datepicker/datepicker';
 @import 'components/dynamic-segments';
@@ -47,31 +49,3 @@
 @import 'components/stats';
 @import 'components/import-export';
 @import 'components/toggle';
-@import 'components/newsletter-editor/common';
-@import 'components/newsletter-editor/layout';
-@import 'components/newsletter-editor/components/forms';
-@import 'components/newsletter-editor/components/heading';
-@import 'components/newsletter-editor/components/history';
-@import 'components/newsletter-editor/components/sidebar';
-@import 'components/newsletter-editor/components/sidepanel';
-@import 'components/newsletter-editor/components/save';
-@import 'components/newsletter-editor/components/block-tools';
-@import 'components/newsletter-editor/components/layers';
-@import 'components/newsletter-editor/components/drag-and-drop';
-@import 'components/newsletter-editor/components/resize';
-@import 'components/newsletter-editor/content-blocks/base';
-@import 'components/newsletter-editor/content-blocks/container';
-@import 'components/newsletter-editor/content-blocks/automated-latest-content';
-@import 'components/newsletter-editor/content-blocks/posts';
-@import 'components/newsletter-editor/content-blocks/products';
-@import 'components/newsletter-editor/content-blocks/button';
-@import 'components/newsletter-editor/content-blocks/divider';
-@import 'components/newsletter-editor/content-blocks/image';
-@import 'components/newsletter-editor/content-blocks/social';
-@import 'components/newsletter-editor/content-blocks/spacer';
-@import 'components/newsletter-editor/content-blocks/text';
-@import 'components/newsletter-editor/content-blocks/header';
-@import 'components/newsletter-editor/content-blocks/footer';
-@import 'components/newsletter-editor/content-blocks/woocommerce-heading';
-@import 'components/newsletter-editor/content-blocks/woocommerce-content';
-@import 'components/newsletter-editor/library-overrides';
diff --git a/assets/css/src/mailpoet-public.scss b/assets/css/src/mailpoet-public.scss
index 63282cdf10..9435b93230 100644
--- a/assets/css/src/mailpoet-public.scss
+++ b/assets/css/src/mailpoet-public.scss
@@ -1,4 +1,4 @@
-// 1. Tools
+// Tools
 // Default mixins and functions. Not producing any CSS.
 @import 'mixins/breakpoints';
 @import 'mixins/clearfix';
diff --git a/assets/css/src/settings/_editor.scss b/assets/css/src/settings/_editor.scss
index 4744f3896e..4226b391fc 100644
--- a/assets/css/src/settings/_editor.scss
+++ b/assets/css/src/settings/_editor.scss
@@ -1,11 +1,10 @@
 $editor-line-height: 1.6em;
-$editor-width: 660px;
 
 $editor-column-margin: 20px;
-$editor-column-width-one: $editor-width - (2 * $editor-column-margin);
-$editor-column-width-two: $editor-width / 2 - (2 * $editor-column-margin);
-$editor-column-width-two-wider: (($editor-width / 3) - $editor-column-margin) * 2;
-$editor-column-width-three: $editor-width / 3 - (2 * $editor-column-margin);
+$editor-column-width-one: $grid-editor-width - (2 * $editor-column-margin);
+$editor-column-width-two: $grid-editor-width / 2 - (2 * $editor-column-margin);
+$editor-column-width-two-wider: (($grid-editor-width / 3) - $editor-column-margin) * 2;
+$editor-column-width-three: $grid-editor-width / 3 - (2 * $editor-column-margin);
 
 $editor-divider-background-color: #daebf2;
 $editor-divider-border-color: #adadad;
diff --git a/assets/css/src/settings/_grid.scss b/assets/css/src/settings/_grid.scss
new file mode 100644
index 0000000000..561a74e410
--- /dev/null
+++ b/assets/css/src/settings/_grid.scss
@@ -0,0 +1 @@
+$grid-editor-width: 660px;
diff --git a/views/newsletter/editor.html b/views/newsletter/editor.html
index bb363ce862..5896ba975f 100644
--- a/views/newsletter/editor.html
+++ b/views/newsletter/editor.html
@@ -391,10 +391,12 @@
   }) %>
 <% endblock %>
 
+<% block after_css %>
+  <%= stylesheet('mailpoet-editor.css') %>
+<% endblock %>
+
 <% block after_javascript %>
-  <%= javascript(
-    'newsletter_editor.js'
-  ) %>
+  <%= javascript('newsletter_editor.js') %>
 
   <%= do_action('mailpoet_newsletter_editor_after_javascript') %>