diff --git a/lib/Deck/DeckPluginLoader.php b/lib/Deck/DeckPluginLoader.php
index 5ceb9e74f7..21d70dd54e 100644
--- a/lib/Deck/DeckPluginLoader.php
+++ b/lib/Deck/DeckPluginLoader.php
@@ -36,7 +36,9 @@ class DeckPluginLoader implements IEventListener {
 
 		if (str_starts_with($this->request->getPathInfo(), '/apps/deck')) {
 			Util::addScript('spreed', 'talk-collections');
+
 			Util::addScript('spreed', 'talk-deck');
+			Util::addStyle('spreed', 'talk-deck');
 		}
 	}
 }
diff --git a/lib/Files/TemplateLoader.php b/lib/Files/TemplateLoader.php
index 7033a4c003..e143c79def 100644
--- a/lib/Files/TemplateLoader.php
+++ b/lib/Files/TemplateLoader.php
@@ -80,6 +80,7 @@ class TemplateLoader implements IEventListener {
 		Util::addStyle(Application::APP_ID, 'icons');
 		if (!str_starts_with($this->request->getPathInfo(), '/apps/maps')) {
 			Util::addScript(Application::APP_ID, 'talk-files-sidebar');
+			Util::addStyle(Application::APP_ID, 'talk-files-sidebar');
 		}
 
 		if ($user instanceof IUser) {
diff --git a/lib/Flow/RegisterOperationsListener.php b/lib/Flow/RegisterOperationsListener.php
index 330aee7f3b..4516ddf496 100644
--- a/lib/Flow/RegisterOperationsListener.php
+++ b/lib/Flow/RegisterOperationsListener.php
@@ -32,5 +32,6 @@ class RegisterOperationsListener implements IEventListener {
 
 		$event->registerOperation($this->operation);
 		Util::addScript('spreed', 'talk-flow');
+		Util::addStyle('spreed', 'talk-flow');
 	}
 }
diff --git a/lib/Maps/MapsPluginLoader.php b/lib/Maps/MapsPluginLoader.php
index b7e0981ffd..2e298a9240 100644
--- a/lib/Maps/MapsPluginLoader.php
+++ b/lib/Maps/MapsPluginLoader.php
@@ -47,6 +47,7 @@ class MapsPluginLoader implements IEventListener {
 		if (str_starts_with($this->request->getPathInfo(), '/apps/maps')) {
 			Util::addScript('spreed', 'talk-collections');
 			Util::addScript('spreed', 'talk-maps');
+			Util::addStyle('spreed', 'talk-maps');
 		}
 	}
 }
diff --git a/lib/PublicShare/TemplateLoader.php b/lib/PublicShare/TemplateLoader.php
index 1cb8b3c0b7..b76790f015 100644
--- a/lib/PublicShare/TemplateLoader.php
+++ b/lib/PublicShare/TemplateLoader.php
@@ -76,6 +76,7 @@ class TemplateLoader implements IEventListener {
 
 		Util::addStyle(Application::APP_ID, 'icons');
 		Util::addScript(Application::APP_ID, 'talk-public-share-sidebar');
+		Util::addStyle(Application::APP_ID, 'talk-public-share-sidebar');
 
 		$this->publishInitialStateForGuest();
 	}
diff --git a/lib/PublicShareAuth/TemplateLoader.php b/lib/PublicShareAuth/TemplateLoader.php
index ae1a9dec0b..54ff6e1f8f 100644
--- a/lib/PublicShareAuth/TemplateLoader.php
+++ b/lib/PublicShareAuth/TemplateLoader.php
@@ -72,6 +72,7 @@ class TemplateLoader implements IEventListener {
 		Util::addStyle(Application::APP_ID, 'icons');
 		Util::addStyle(Application::APP_ID, 'publicshareauth');
 		Util::addScript(Application::APP_ID, 'talk-public-share-auth-sidebar');
+		Util::addStyle(Application::APP_ID, 'talk-public-share-auth-sidebar');
 
 		$this->publishInitialStateForGuest();
 	}
diff --git a/lib/Search/UnifiedSearchCSSLoader.php b/lib/Search/UnifiedSearchCSSLoader.php
index fd91e24356..8bf5f27d65 100644
--- a/lib/Search/UnifiedSearchCSSLoader.php
+++ b/lib/Search/UnifiedSearchCSSLoader.php
@@ -26,6 +26,7 @@ class UnifiedSearchCSSLoader implements IEventListener {
 
 		if ($event->isLoggedIn()) {
 			Util::addStyle(Application::APP_ID, 'unified-search');
+			Util::addStyle(Application::APP_ID, 'talk-search');
 		}
 	}
 }
diff --git a/lib/Settings/Admin/AdminSettings.php b/lib/Settings/Admin/AdminSettings.php
index 30a4c8833d..1451e92665 100644
--- a/lib/Settings/Admin/AdminSettings.php
+++ b/lib/Settings/Admin/AdminSettings.php
@@ -66,6 +66,7 @@ class AdminSettings implements ISettings {
 
 		Util::addStyle('spreed', 'admin-settings');
 		Util::addScript('spreed', 'talk-admin-settings');
+		Util::addStyle('spreed', 'talk-admin-settings');
 
 		return new TemplateResponse('spreed', 'settings/admin-settings', [], '');
 	}
diff --git a/templates/index.php b/templates/index.php
index 4a557e8f9f..9cde0a0d48 100644
--- a/templates/index.php
+++ b/templates/index.php
@@ -7,4 +7,5 @@ declare(strict_types=1);
  */
 
 \OCP\Util::addScript('spreed', 'talk-main');
+\OCP\Util::addStyle('spreed', 'talk-main');
 style('spreed', 'icons');
diff --git a/templates/recording.php b/templates/recording.php
index cc0a1a71f3..bcebc32dab 100644
--- a/templates/recording.php
+++ b/templates/recording.php
@@ -7,4 +7,5 @@ declare(strict_types=1);
  */
 
 \OCP\Util::addScript('spreed', 'talk-recording');
+\OCP\Util::addStyle('spreed', 'talk-recording');
 style('spreed', 'icons');
diff --git a/webpack.common.config.js b/webpack.common.config.js
index a2348cc2d8..c6c96ec9b5 100644
--- a/webpack.common.config.js
+++ b/webpack.common.config.js
@@ -1,10 +1,11 @@
-/**
+/*
  * SPDX-FileCopyrightText: 2022 Nextcloud GmbH and Nextcloud contributors
  * SPDX-License-Identifier: AGPL-3.0-or-later
  */
 
 const nextcloudWebpackRules = require('@nextcloud/webpack-vue-config/rules')
 const BabelLoaderExcludeNodeModulesExcept = require('babel-loader-exclude-node-modules-except')
+const MiniCssExtractPlugin = require('mini-css-extract-plugin')
 const { mergeWithRules } = require('webpack-merge')
 
 // Replace rules with the same modules
@@ -20,13 +21,21 @@ module.exports = mergeWithRules({
 })(
 	{
 		module: {
-		// Reuse @nextcloud/webpack-vue-config/rules
+			// Reuse @nextcloud/webpack-vue-config/rules
 			rules: Object.values(nextcloudWebpackRules),
 		},
 	},
 	{
 		module: {
 			rules: [
+				{
+					test: /\.css$/,
+					use: [MiniCssExtractPlugin.loader, 'css-loader'],
+				},
+				{
+					test: /\.scss$/,
+					use: [MiniCssExtractPlugin.loader, 'css-loader', 'sass-loader'],
+				},
 				{
 					test: /\.js$/,
 					loader: 'esbuild-loader',
diff --git a/webpack.config.js b/webpack.config.js
index ab1bd01b59..d0f28a0817 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -1,9 +1,11 @@
-const nextcloudWebpackConfig = require('@nextcloud/webpack-vue-config')
-const { EsbuildPlugin } = require('esbuild-loader')
-/**
+/*
  * SPDX-FileCopyrightText: 2023 Nextcloud GmbH and Nextcloud contributors
  * SPDX-License-Identifier: AGPL-3.0-or-later
  */
+
+const nextcloudWebpackConfig = require('@nextcloud/webpack-vue-config')
+const { EsbuildPlugin } = require('esbuild-loader')
+const MiniCssExtractPlugin = require('mini-css-extract-plugin')
 const path = require('node:path')
 const webpack = require('webpack')
 const { mergeWithRules } = require('webpack-merge')
@@ -56,6 +58,11 @@ module.exports = mergeWithRules({
 
 	plugins: [
 		new webpack.DefinePlugin({ IS_DESKTOP: false }),
+		new MiniCssExtractPlugin({
+			filename: '../css/talk-[name].css',
+			chunkFilename: '../css/chunks/[id].chunk.css',
+			ignoreOrder: true,
+		}),
 	],
 
 	cache: true,