diff --git a/assets/styles/base.pcss b/assets/styles/base.pcss
new file mode 100644
index 0000000..b87fdc9
--- /dev/null
+++ b/assets/styles/base.pcss
@@ -0,0 +1,11 @@
+/**
+ * This injects Tailwind's base styles, which is a combination of
+ * Normalize.css and some additional base styles.
+ */
+@import 'tailwindcss/base';
+
+/**
+ * Here we add custom base styles, applied after the tailwind-base
+ * classes
+ *
+ */
diff --git a/assets/styles/components.pcss b/assets/styles/components.pcss
new file mode 100644
index 0000000..7a63ef1
--- /dev/null
+++ b/assets/styles/components.pcss
@@ -0,0 +1,22 @@
+/**
+ * This injects any component classes registered by plugins.
+ *
+ */
+@import 'tailwindcss/components';
+
+/**
+ * Here we add custom component classes; stuff we want loaded
+ * *before* the utilities so that the utilities can still
+ * override them.
+ *
+ */
+
+/**
+ * This is CSS used for high-level layouts.
+ */
+@import "layouts/app.pcss";
+
+/**
+ * Our own components.
+ */
+@import "components/image.pcss";
diff --git a/assets/styles/components/image.pcss b/assets/styles/components/image.pcss
new file mode 100644
index 0000000..96ebb4f
--- /dev/null
+++ b/assets/styles/components/image.pcss
@@ -0,0 +1,3 @@
+img {
+    border: 2px solid greenyellow;
+}
diff --git a/assets/styles/css.js b/assets/styles/css.js
new file mode 100644
index 0000000..dff3011
--- /dev/null
+++ b/assets/styles/css.js
@@ -0,0 +1,9 @@
+/**
+ * This rigamarole is to so that we can import these as modules webpack
+ * will recognize, leading to faster rebuilds that don't get bogged down by
+ * Tailwind.
+ */
+
+import './base.pcss'
+import './components.pcss'
+import './utilities.pcss'
diff --git a/assets/styles/layouts/app.pcss b/assets/styles/layouts/app.pcss
new file mode 100644
index 0000000..7b4acb9
--- /dev/null
+++ b/assets/styles/layouts/app.pcss
@@ -0,0 +1,3 @@
+body {
+    background-color: aquamarine;
+}
diff --git a/assets/styles/main.css b/assets/styles/main.css
deleted file mode 100644
index 2a85094..0000000
--- a/assets/styles/main.css
+++ /dev/null
@@ -1,7 +0,0 @@
-@import "tailwindcss/base";
-@import "tailwindcss/components";
-@import "tailwindcss/utilities";
-
-body {
-    background: green;
-}
diff --git a/assets/styles/utilities.pcss b/assets/styles/utilities.pcss
new file mode 100644
index 0000000..b69634b
--- /dev/null
+++ b/assets/styles/utilities.pcss
@@ -0,0 +1,12 @@
+/**
+ * This injects all of Tailwind's utility classes, generated based on your
+ * config file.
+ *
+ */
+@import 'tailwindcss/utilities';
+
+/**
+ * Include vendor css.
+ *
+ */
+@import 'vendor.pcss';
diff --git a/assets/styles/vendor.pcss b/assets/styles/vendor.pcss
new file mode 100644
index 0000000..9dd5d5a
--- /dev/null
+++ b/assets/styles/vendor.pcss
@@ -0,0 +1,3 @@
+/**
+ * Any files from external packages that are very unlikely to change.
+ */
diff --git a/build/webpack.config.base.js b/build/webpack.config.base.js
index bfea344..f07bc7e 100644
--- a/build/webpack.config.base.js
+++ b/build/webpack.config.base.js
@@ -11,6 +11,6 @@ module.exports = {
         publicPath: "/",
     },
     mode: process.env.NODE_ENV || 'development',
-    devtool: 'source-map',
+    devtool: 'eval-cheap-module-source-map',
     stats: 'errors-only',
 }
diff --git a/build/webpack.config.main.js b/build/webpack.config.main.js
index eef3795..8c1b3dc 100644
--- a/build/webpack.config.main.js
+++ b/build/webpack.config.main.js
@@ -9,7 +9,7 @@ module.exports = {
     entry: {
         main: [
             path.join(__dirname, '..', 'assets', 'scripts', 'main.js'),
-            path.join(__dirname, '..', 'assets', 'styles', 'main.css'),
+            path.join(__dirname, '..', 'assets', 'styles', 'css.js'),
         ],
     },
     plugins: [
@@ -22,6 +22,9 @@ module.exports = {
         compress: true,
         port: 9000,
         watchContentBase: true,
+        hot: true,
+        publicPath: '/',
+        // stats: 'errors-only'
     },
     module: {
         rules: [
@@ -59,7 +62,7 @@ module.exports = {
                 },
             },
             {
-                test: /\.css$/i,
+                test: /\.?pcss$/i,
                 use: [
                     MiniCssExtractPlugin.loader,
                     {