diff --git a/src/common/architecture/dependenciesProvider/DependenciesProvider.ts b/src/common/architecture/dependenciesProvider/DependenciesProvider.ts
index 68f77fd..794a681 100644
--- a/src/common/architecture/dependenciesProvider/DependenciesProvider.ts
+++ b/src/common/architecture/dependenciesProvider/DependenciesProvider.ts
@@ -4,10 +4,13 @@
 import WorkflowsImport from '../../../features/workflows/core/communityConsole/import';
 import Workflows from '../../../features/workflows/core/communityConsole/workflows';
 import StartupDataStorage from '../../../contentScripts/communityConsole/utils/StartupDataStorage';
+import ReportDialogColorThemeFix from '../../../features/ccDarkTheme/core/logic/reportDialog';
 
 export const AutoRefreshDependency = 'autoRefresh';
 export const ExtraInfoDependency = 'extraInfo';
 export const OptionsProviderDependency = 'optionsProvider';
+export const ReportDialogColorThemeFixDependency =
+  'report-dialog-color-theme-fix';
 export const StartupDataStorageDependency = 'startupDataStorage';
 export const WorkflowsDependency = 'workflows';
 export const WorkflowsImportDependency = 'workflowsImport';
@@ -15,6 +18,7 @@
   [AutoRefreshDependency]: AutoRefresh,
   [ExtraInfoDependency]: ExtraInfo,
   [OptionsProviderDependency]: OptionsProvider,
+  [ReportDialogColorThemeFixDependency]: ReportDialogColorThemeFix,
   [StartupDataStorageDependency]: StartupDataStorage,
   [WorkflowsDependency]: Workflows,
   [WorkflowsImportDependency]: WorkflowsImport,
diff --git a/src/contentScripts/communityConsole/main.js b/src/contentScripts/communityConsole/main.js
index 22e35f7..890f3b0 100644
--- a/src/contentScripts/communityConsole/main.js
+++ b/src/contentScripts/communityConsole/main.js
@@ -5,9 +5,6 @@
 
 import AvatarsHandler from './avatars.js';
 import {batchLock} from './batchLock.js';
-import {injectDarkThemeButton, isDarkThemeOn} from './darkTheme/darkTheme.js';
-import ReportDialogColorThemeFix from './darkTheme/reportDialog.js';
-import {unifiedProfilesFix} from './darkTheme/unifiedProfiles.js';
 // #!if ['chromium', 'chromium_mv3'].includes(browser_target)
 import {applyDragAndDropFixIfEnabled} from './dragAndDropFix.js';
 // #!endif
@@ -15,14 +12,9 @@
 import {kRepliesSectionSelector} from './threadToolbar/constants.js';
 import ThreadToolbar from './threadToolbar/threadToolbar.js';
 
-var mutationObserver, options, avatars, threadToolbar, flattenThreads,
-    reportDialogColorThemeFix;
+var mutationObserver, options, avatars, threadToolbar, flattenThreads;
 
 const watchedNodesSelectors = [
-  // App container (used to set up the intersection observer and inject the dark
-  // mode button)
-  'ec-app',
-
   // Scrollable content (used for the intersection observer)
   '.scrollable-content',
 
@@ -51,9 +43,6 @@
   // Thread list (used for the autorefresh feature)
   'ec-thread-list',
 
-  // Unified profile iframe and report dialog iframe
-  'iframe',
-
   // Thread page reply section (for the thread page toolbar)
   kRepliesSectionSelector,
 
@@ -63,17 +52,6 @@
 
 function handleCandidateNode(node) {
   if (typeof node.classList !== 'undefined') {
-    if (('tagName' in node) && node.tagName == 'EC-APP') {
-      // Inject the dark mode button
-      // TODO(avm99963): make this feature dynamic.
-      if (options.ccdarktheme && options.ccdarktheme_mode == 'switch') {
-        var rightControl = node.querySelector('header .right-control');
-        if (rightControl !== null)
-          injectDarkThemeButton(
-              rightControl, options.ccdarktheme_switch_status);
-      }
-    }
-
     // Show the "previous posts" links if the option is currently enabled.
     //   Here we're selecting the 'ec-user > div' element (unique child)
     if (node.matches(
@@ -112,16 +90,6 @@
       avatars.injectIfEnabled(node);
     }
 
-    if (node.tagName == 'IFRAME') {
-      // Redirect unified profile iframe to dark version if applicable
-      if (isDarkThemeOn(options) && unifiedProfilesFix.checkIframe(node)) {
-        unifiedProfilesFix.fixIframe(node);
-      }
-
-      // Set report dialog iframe's theme to the appropriate theme
-      reportDialogColorThemeFix.fixThemeIfReportDialogIframeAndApplicable(node);
-    }
-
     // Inject thread toolbar
     if (threadToolbar.shouldInject(node)) {
       threadToolbar.injectIfApplicable(node);
@@ -180,7 +148,6 @@
   avatars = new AvatarsHandler();
   threadToolbar = new ThreadToolbar();
   flattenThreads = new FlattenThreads();
-  reportDialogColorThemeFix = new ReportDialogColorThemeFix(options);
 
   // Before starting the mutation Observer, check whether we missed any
   // mutations by manually checking whether some watched nodes already
diff --git a/src/contentScripts/communityConsole/start.js b/src/contentScripts/communityConsole/start.js
index 2f8ba2a..b9c7f58 100644
--- a/src/contentScripts/communityConsole/start.js
+++ b/src/contentScripts/communityConsole/start.js
@@ -19,21 +19,6 @@
         'data-startup', JSON.stringify(startup));
   }
 
-  if (options.ccdarktheme) {
-    switch (options.ccdarktheme_mode) {
-      case 'switch':
-        if (options.ccdarktheme_switch_status == true)
-          injectStylesheet(chrome.runtime.getURL('ccDarkTheme.bundle.css'));
-        break;
-
-      case 'system':
-        injectStylesheet(chrome.runtime.getURL('ccDarkTheme.bundle.css'), {
-          'media': '(prefers-color-scheme: dark)',
-        });
-        break;
-    }
-  }
-
   if (options.uispacing) {
     injectStylesheet(chrome.runtime.getURL('css/ui_spacing/shared.css'));
     injectStylesheet(chrome.runtime.getURL('css/ui_spacing/console.css'));
diff --git a/src/features/Features.ts b/src/features/Features.ts
index a93f8a3..67c93aa 100644
--- a/src/features/Features.ts
+++ b/src/features/Features.ts
@@ -4,12 +4,14 @@
 import ScriptFilterListProvider from '../common/architecture/scripts/ScriptFilterListProvider';
 import ExtraInfoFeature from './extraInfo/extraInfo.feature';
 import WorkflowsFeature from './workflows/workflows.feature';
+import CCDarkThemeFeature from './ccDarkTheme/ccDarkTheme.feature';
 
 export type ConcreteFeatureClass = { new (): Feature };
 
 export default class Features extends ScriptFilterListProvider {
   private features: ConcreteFeatureClass[] = [
     AutoRefreshFeature,
+    CCDarkThemeFeature,
     ExtraInfoFeature,
     InfiniteScrollFeature,
     WorkflowsFeature,
diff --git a/src/features/ccDarkTheme/ccDarkTheme.feature.ts b/src/features/ccDarkTheme/ccDarkTheme.feature.ts
new file mode 100644
index 0000000..74efbf2
--- /dev/null
+++ b/src/features/ccDarkTheme/ccDarkTheme.feature.ts
@@ -0,0 +1,21 @@
+import Feature from '../../common/architecture/features/Feature';
+import { ConcreteScript } from '../../common/architecture/scripts/Script';
+import { OptionCodename } from '../../common/options/optionsPrototype';
+import InjectAutoDarkTheme from './scripts/injectAutoDarkTheme.script';
+import InjectForcedDarkTheme from './scripts/injectForcedDarkTheme.script';
+import CCDarkThemeNodeWatcherScript from './scripts/nodeWatcher.script';
+
+export default class CCDarkThemeFeature extends Feature {
+  public readonly scripts: ConcreteScript[] = [
+    InjectAutoDarkTheme,
+    InjectForcedDarkTheme,
+    CCDarkThemeNodeWatcherScript,
+  ];
+
+  readonly codename = 'darkTheme';
+  readonly relatedOptions: OptionCodename[] = [
+    'ccdarktheme',
+    'ccdarktheme_mode',
+    'ccdarktheme_switch_status',
+  ];
+}
diff --git a/src/contentScripts/communityConsole/darkTheme/darkTheme.js b/src/features/ccDarkTheme/core/logic/darkTheme.js
similarity index 64%
rename from src/contentScripts/communityConsole/darkTheme/darkTheme.js
rename to src/features/ccDarkTheme/core/logic/darkTheme.js
index c1888ea..d3d7e5e 100644
--- a/src/contentScripts/communityConsole/darkTheme/darkTheme.js
+++ b/src/features/ccDarkTheme/core/logic/darkTheme.js
@@ -1,7 +1,7 @@
-import {MDCTooltip} from '@material/tooltip';
+import { MDCTooltip } from '@material/tooltip';
 
-import {createPlainTooltip} from '../../../common/tooltip.js';
-import {createExtBadge} from '../utils/common.js';
+import { createPlainTooltip } from '../../../../common/tooltip.js';
+import { createExtBadge } from '../../../../contentScripts/communityConsole/utils/common.js';
 
 export const kColorThemeMode = Object.freeze({
   Auto: Symbol('auto'),
@@ -9,17 +9,16 @@
   Dark: Symbol('dark'),
 });
 
-export function injectDarkThemeButton(rightControl, previousDarkThemeOption) {
+export function injectDarkThemeButton(rightControl) {
   var darkThemeSwitch = document.createElement('material-button');
   darkThemeSwitch.classList.add('TWPT-dark-theme', 'TWPT-btn--with-badge');
   darkThemeSwitch.setAttribute('button', '');
 
   darkThemeSwitch.addEventListener('click', () => {
-    chrome.storage.sync.get(null, currentOptions => {
-      currentOptions.ccdarktheme_switch_status = !previousDarkThemeOption;
-      chrome.storage.sync.set(currentOptions, () => {
-        location.reload();
-      });
+    chrome.storage.sync.get(null, (currentOptions) => {
+      currentOptions.ccdarktheme_switch_status =
+        !currentOptions.ccdarktheme_switch_status;
+      chrome.storage.sync.set(currentOptions);
     });
   });
 
@@ -42,11 +41,13 @@
   darkThemeSwitch.appendChild(badgeContent);
 
   rightControl.style.width =
-      (parseInt(window.getComputedStyle(rightControl).width) + 58) + 'px';
+    parseInt(window.getComputedStyle(rightControl).width) + 58 + 'px';
   rightControl.insertAdjacentElement('afterbegin', darkThemeSwitch);
 
   createPlainTooltip(
-      switchContent, chrome.i18n.getMessage('inject_ccdarktheme_helper'));
+    switchContent,
+    chrome.i18n.getMessage('inject_ccdarktheme_helper'),
+  );
   new MDCTooltip(badgeTooltip);
 }
 
@@ -55,8 +56,9 @@
     return kColorThemeMode.Light;
   } else {
     if (options.ccdarktheme_mode == 'switch') {
-      return options.ccdarktheme_switch_status ? kColorThemeMode.Dark :
-                                                 kColorThemeMode.Light;
+      return options.ccdarktheme_switch_status
+        ? kColorThemeMode.Dark
+        : kColorThemeMode.Light;
     } else {
       return kColorThemeMode.Auto;
     }
@@ -68,8 +70,10 @@
 
   switch (activeColorTheme) {
     case kColorThemeMode.Auto:
-      return window.matchMedia &&
-          window.matchMedia('(prefers-color-scheme: dark)').matches;
+      return (
+        window.matchMedia &&
+        window.matchMedia('(prefers-color-scheme: dark)').matches
+      );
 
     case kColorThemeMode.Light:
       return false;
diff --git a/src/contentScripts/communityConsole/darkTheme/reportDialog.js b/src/features/ccDarkTheme/core/logic/reportDialog.js
similarity index 77%
rename from src/contentScripts/communityConsole/darkTheme/reportDialog.js
rename to src/features/ccDarkTheme/core/logic/reportDialog.js
index d7c84a8..4e79f4a 100644
--- a/src/contentScripts/communityConsole/darkTheme/reportDialog.js
+++ b/src/features/ccDarkTheme/core/logic/reportDialog.js
@@ -7,14 +7,13 @@
 };
 
 export default class ReportDialogColorThemeFix {
-  constructor(options) {
-    this.optionsAtPageLoad = options;
-  }
+  constructor() {}
 
-  fixThemeIfReportDialogIframeAndApplicable(iframe) {
+  async fixThemeIfReportDialogIframeAndApplicable(iframe, optionsProvider) {
     if (!this.isReportDialogIframe(iframe)) return;
 
-    const currentColorTheme = getCurrentColorTheme(this.optionsAtPageLoad);
+    const options = await optionsProvider.getOptionsValues();
+    const currentColorTheme = getCurrentColorTheme(options);
 
     // By default the report dialog is added with the light theme
     if (currentColorTheme === kColorThemeMode.Light) return;
diff --git a/src/contentScripts/communityConsole/darkTheme/unifiedProfiles.js b/src/features/ccDarkTheme/core/logic/unifiedProfiles.js
similarity index 100%
rename from src/contentScripts/communityConsole/darkTheme/unifiedProfiles.js
rename to src/features/ccDarkTheme/core/logic/unifiedProfiles.js
diff --git a/src/ccDarkTheme/abstracts/_variables.scss b/src/features/ccDarkTheme/core/styles/abstracts/_variables.scss
similarity index 97%
rename from src/ccDarkTheme/abstracts/_variables.scss
rename to src/features/ccDarkTheme/core/styles/abstracts/_variables.scss
index 9deae11..bcb922d 100644
--- a/src/ccDarkTheme/abstracts/_variables.scss
+++ b/src/features/ccDarkTheme/core/styles/abstracts/_variables.scss
@@ -1,4 +1,4 @@
-@use '../../md3/theme' as md3-theme;
+@use '../../../../../md3/theme' as md3-theme;
 
 :root {
   --TWPT-primary-text: #e8eaed;
diff --git a/src/ccDarkTheme/base/_base.scss b/src/features/ccDarkTheme/core/styles/base/_base.scss
similarity index 100%
rename from src/ccDarkTheme/base/_base.scss
rename to src/features/ccDarkTheme/core/styles/base/_base.scss
diff --git a/src/ccDarkTheme/components/_action-bar.scss b/src/features/ccDarkTheme/core/styles/components/_action-bar.scss
similarity index 100%
rename from src/ccDarkTheme/components/_action-bar.scss
rename to src/features/ccDarkTheme/core/styles/components/_action-bar.scss
diff --git a/src/ccDarkTheme/components/_activity-panel.scss b/src/features/ccDarkTheme/core/styles/components/_activity-panel.scss
similarity index 100%
rename from src/ccDarkTheme/components/_activity-panel.scss
rename to src/features/ccDarkTheme/core/styles/components/_activity-panel.scss
diff --git a/src/ccDarkTheme/components/_canned-responses.scss b/src/features/ccDarkTheme/core/styles/components/_canned-responses.scss
similarity index 100%
rename from src/ccDarkTheme/components/_canned-responses.scss
rename to src/features/ccDarkTheme/core/styles/components/_canned-responses.scss
diff --git a/src/ccDarkTheme/components/_drawer.scss b/src/features/ccDarkTheme/core/styles/components/_drawer.scss
similarity index 100%
rename from src/ccDarkTheme/components/_drawer.scss
rename to src/features/ccDarkTheme/core/styles/components/_drawer.scss
diff --git a/src/ccDarkTheme/components/_duplicate-thread.scss b/src/features/ccDarkTheme/core/styles/components/_duplicate-thread.scss
similarity index 100%
rename from src/ccDarkTheme/components/_duplicate-thread.scss
rename to src/features/ccDarkTheme/core/styles/components/_duplicate-thread.scss
diff --git a/src/ccDarkTheme/components/_icon.scss b/src/features/ccDarkTheme/core/styles/components/_icon.scss
similarity index 100%
rename from src/ccDarkTheme/components/_icon.scss
rename to src/features/ccDarkTheme/core/styles/components/_icon.scss
diff --git a/src/ccDarkTheme/components/_index.scss b/src/features/ccDarkTheme/core/styles/components/_index.scss
similarity index 100%
rename from src/ccDarkTheme/components/_index.scss
rename to src/features/ccDarkTheme/core/styles/components/_index.scss
diff --git a/src/ccDarkTheme/components/_loading-spinner.scss b/src/features/ccDarkTheme/core/styles/components/_loading-spinner.scss
similarity index 100%
rename from src/ccDarkTheme/components/_loading-spinner.scss
rename to src/features/ccDarkTheme/core/styles/components/_loading-spinner.scss
diff --git a/src/ccDarkTheme/components/_menu.scss b/src/features/ccDarkTheme/core/styles/components/_menu.scss
similarity index 100%
rename from src/ccDarkTheme/components/_menu.scss
rename to src/features/ccDarkTheme/core/styles/components/_menu.scss
diff --git a/src/ccDarkTheme/components/_profile-chart.scss b/src/features/ccDarkTheme/core/styles/components/_profile-chart.scss
similarity index 100%
rename from src/ccDarkTheme/components/_profile-chart.scss
rename to src/features/ccDarkTheme/core/styles/components/_profile-chart.scss
diff --git a/src/ccDarkTheme/components/_query-builder.scss b/src/features/ccDarkTheme/core/styles/components/_query-builder.scss
similarity index 100%
rename from src/ccDarkTheme/components/_query-builder.scss
rename to src/features/ccDarkTheme/core/styles/components/_query-builder.scss
diff --git a/src/ccDarkTheme/components/_review-bar.scss b/src/features/ccDarkTheme/core/styles/components/_review-bar.scss
similarity index 100%
rename from src/ccDarkTheme/components/_review-bar.scss
rename to src/features/ccDarkTheme/core/styles/components/_review-bar.scss
diff --git a/src/ccDarkTheme/components/_rich-text-editor.scss b/src/features/ccDarkTheme/core/styles/components/_rich-text-editor.scss
similarity index 100%
rename from src/ccDarkTheme/components/_rich-text-editor.scss
rename to src/features/ccDarkTheme/core/styles/components/_rich-text-editor.scss
diff --git a/src/ccDarkTheme/components/_settings.scss b/src/features/ccDarkTheme/core/styles/components/_settings.scss
similarity index 100%
rename from src/ccDarkTheme/components/_settings.scss
rename to src/features/ccDarkTheme/core/styles/components/_settings.scss
diff --git a/src/ccDarkTheme/components/_stepper.scss b/src/features/ccDarkTheme/core/styles/components/_stepper.scss
similarity index 100%
rename from src/ccDarkTheme/components/_stepper.scss
rename to src/features/ccDarkTheme/core/styles/components/_stepper.scss
diff --git a/src/ccDarkTheme/components/_tabs.scss b/src/features/ccDarkTheme/core/styles/components/_tabs.scss
similarity index 100%
rename from src/ccDarkTheme/components/_tabs.scss
rename to src/features/ccDarkTheme/core/styles/components/_tabs.scss
diff --git a/src/ccDarkTheme/components/_thread-composer.scss b/src/features/ccDarkTheme/core/styles/components/_thread-composer.scss
similarity index 100%
rename from src/ccDarkTheme/components/_thread-composer.scss
rename to src/features/ccDarkTheme/core/styles/components/_thread-composer.scss
diff --git a/src/ccDarkTheme/components/_thread-insert.scss b/src/features/ccDarkTheme/core/styles/components/_thread-insert.scss
similarity index 100%
rename from src/ccDarkTheme/components/_thread-insert.scss
rename to src/features/ccDarkTheme/core/styles/components/_thread-insert.scss
diff --git a/src/ccDarkTheme/components/_thread-list.scss b/src/features/ccDarkTheme/core/styles/components/_thread-list.scss
similarity index 100%
rename from src/ccDarkTheme/components/_thread-list.scss
rename to src/features/ccDarkTheme/core/styles/components/_thread-list.scss
diff --git a/src/ccDarkTheme/components/_thread-view.scss b/src/features/ccDarkTheme/core/styles/components/_thread-view.scss
similarity index 100%
rename from src/ccDarkTheme/components/_thread-view.scss
rename to src/features/ccDarkTheme/core/styles/components/_thread-view.scss
diff --git a/src/ccDarkTheme/components/_user-badge.scss b/src/features/ccDarkTheme/core/styles/components/_user-badge.scss
similarity index 100%
rename from src/ccDarkTheme/components/_user-badge.scss
rename to src/features/ccDarkTheme/core/styles/components/_user-badge.scss
diff --git a/src/ccDarkTheme/components/buttons/_button.scss b/src/features/ccDarkTheme/core/styles/components/buttons/_button.scss
similarity index 100%
rename from src/ccDarkTheme/components/buttons/_button.scss
rename to src/features/ccDarkTheme/core/styles/components/buttons/_button.scss
diff --git a/src/ccDarkTheme/components/buttons/_index.scss b/src/features/ccDarkTheme/core/styles/components/buttons/_index.scss
similarity index 100%
rename from src/ccDarkTheme/components/buttons/_index.scss
rename to src/features/ccDarkTheme/core/styles/components/buttons/_index.scss
diff --git a/src/ccDarkTheme/components/buttons/_reply.scss b/src/features/ccDarkTheme/core/styles/components/buttons/_reply.scss
similarity index 100%
rename from src/ccDarkTheme/components/buttons/_reply.scss
rename to src/features/ccDarkTheme/core/styles/components/buttons/_reply.scss
diff --git a/src/ccDarkTheme/components/buttons/_skip-to-main.scss b/src/features/ccDarkTheme/core/styles/components/buttons/_skip-to-main.scss
similarity index 100%
rename from src/ccDarkTheme/components/buttons/_skip-to-main.scss
rename to src/features/ccDarkTheme/core/styles/components/buttons/_skip-to-main.scss
diff --git a/src/ccDarkTheme/components/buttons/_yes-no.scss b/src/features/ccDarkTheme/core/styles/components/buttons/_yes-no.scss
similarity index 100%
rename from src/ccDarkTheme/components/buttons/_yes-no.scss
rename to src/features/ccDarkTheme/core/styles/components/buttons/_yes-no.scss
diff --git a/src/ccDarkTheme/components/custom/_chip.scss b/src/features/ccDarkTheme/core/styles/components/custom/_chip.scss
similarity index 100%
rename from src/ccDarkTheme/components/custom/_chip.scss
rename to src/features/ccDarkTheme/core/styles/components/custom/_chip.scss
diff --git a/src/ccDarkTheme/components/custom/_index.scss b/src/features/ccDarkTheme/core/styles/components/custom/_index.scss
similarity index 100%
rename from src/ccDarkTheme/components/custom/_index.scss
rename to src/features/ccDarkTheme/core/styles/components/custom/_index.scss
diff --git a/src/ccDarkTheme/components/custom/_log.scss b/src/features/ccDarkTheme/core/styles/components/custom/_log.scss
similarity index 100%
rename from src/ccDarkTheme/components/custom/_log.scss
rename to src/features/ccDarkTheme/core/styles/components/custom/_log.scss
diff --git a/src/ccDarkTheme/components/custom/_warning.scss b/src/features/ccDarkTheme/core/styles/components/custom/_warning.scss
similarity index 100%
rename from src/ccDarkTheme/components/custom/_warning.scss
rename to src/features/ccDarkTheme/core/styles/components/custom/_warning.scss
diff --git a/src/ccDarkTheme/components/dialogs/_bug-case-links.scss b/src/features/ccDarkTheme/core/styles/components/dialogs/_bug-case-links.scss
similarity index 100%
rename from src/ccDarkTheme/components/dialogs/_bug-case-links.scss
rename to src/features/ccDarkTheme/core/styles/components/dialogs/_bug-case-links.scss
diff --git a/src/ccDarkTheme/components/dialogs/_dialog.scss b/src/features/ccDarkTheme/core/styles/components/dialogs/_dialog.scss
similarity index 100%
rename from src/ccDarkTheme/components/dialogs/_dialog.scss
rename to src/features/ccDarkTheme/core/styles/components/dialogs/_dialog.scss
diff --git a/src/ccDarkTheme/components/dialogs/_index.scss b/src/features/ccDarkTheme/core/styles/components/dialogs/_index.scss
similarity index 100%
rename from src/ccDarkTheme/components/dialogs/_index.scss
rename to src/features/ccDarkTheme/core/styles/components/dialogs/_index.scss
diff --git a/src/ccDarkTheme/components/dialogs/_keyboard-shortcuts.scss b/src/features/ccDarkTheme/core/styles/components/dialogs/_keyboard-shortcuts.scss
similarity index 100%
rename from src/ccDarkTheme/components/dialogs/_keyboard-shortcuts.scss
rename to src/features/ccDarkTheme/core/styles/components/dialogs/_keyboard-shortcuts.scss
diff --git a/src/ccDarkTheme/components/dialogs/_private-message.scss b/src/features/ccDarkTheme/core/styles/components/dialogs/_private-message.scss
similarity index 100%
rename from src/ccDarkTheme/components/dialogs/_private-message.scss
rename to src/features/ccDarkTheme/core/styles/components/dialogs/_private-message.scss
diff --git a/src/ccDarkTheme/components/dialogs/_report.scss b/src/features/ccDarkTheme/core/styles/components/dialogs/_report.scss
similarity index 100%
rename from src/ccDarkTheme/components/dialogs/_report.scss
rename to src/features/ccDarkTheme/core/styles/components/dialogs/_report.scss
diff --git a/src/ccDarkTheme/components/inputs/_checkbox.scss b/src/features/ccDarkTheme/core/styles/components/inputs/_checkbox.scss
similarity index 100%
rename from src/ccDarkTheme/components/inputs/_checkbox.scss
rename to src/features/ccDarkTheme/core/styles/components/inputs/_checkbox.scss
diff --git a/src/ccDarkTheme/components/inputs/_dropdown-select.scss b/src/features/ccDarkTheme/core/styles/components/inputs/_dropdown-select.scss
similarity index 100%
rename from src/ccDarkTheme/components/inputs/_dropdown-select.scss
rename to src/features/ccDarkTheme/core/styles/components/inputs/_dropdown-select.scss
diff --git a/src/ccDarkTheme/components/inputs/_index.scss b/src/features/ccDarkTheme/core/styles/components/inputs/_index.scss
similarity index 100%
rename from src/ccDarkTheme/components/inputs/_index.scss
rename to src/features/ccDarkTheme/core/styles/components/inputs/_index.scss
diff --git a/src/ccDarkTheme/components/inputs/_pickers.scss b/src/features/ccDarkTheme/core/styles/components/inputs/_pickers.scss
similarity index 100%
rename from src/ccDarkTheme/components/inputs/_pickers.scss
rename to src/features/ccDarkTheme/core/styles/components/inputs/_pickers.scss
diff --git a/src/ccDarkTheme/components/inputs/_radio.scss b/src/features/ccDarkTheme/core/styles/components/inputs/_radio.scss
similarity index 100%
rename from src/ccDarkTheme/components/inputs/_radio.scss
rename to src/features/ccDarkTheme/core/styles/components/inputs/_radio.scss
diff --git a/src/ccDarkTheme/components/inputs/_selector.scss b/src/features/ccDarkTheme/core/styles/components/inputs/_selector.scss
similarity index 100%
rename from src/ccDarkTheme/components/inputs/_selector.scss
rename to src/features/ccDarkTheme/core/styles/components/inputs/_selector.scss
diff --git a/src/ccDarkTheme/components/inputs/_switch.scss b/src/features/ccDarkTheme/core/styles/components/inputs/_switch.scss
similarity index 100%
rename from src/ccDarkTheme/components/inputs/_switch.scss
rename to src/features/ccDarkTheme/core/styles/components/inputs/_switch.scss
diff --git a/src/ccDarkTheme/components/inputs/_text.scss b/src/features/ccDarkTheme/core/styles/components/inputs/_text.scss
similarity index 100%
rename from src/ccDarkTheme/components/inputs/_text.scss
rename to src/features/ccDarkTheme/core/styles/components/inputs/_text.scss
diff --git a/src/ccDarkTheme/components/notifications/_bell.scss b/src/features/ccDarkTheme/core/styles/components/notifications/_bell.scss
similarity index 100%
rename from src/ccDarkTheme/components/notifications/_bell.scss
rename to src/features/ccDarkTheme/core/styles/components/notifications/_bell.scss
diff --git a/src/ccDarkTheme/components/notifications/_index.scss b/src/features/ccDarkTheme/core/styles/components/notifications/_index.scss
similarity index 100%
rename from src/ccDarkTheme/components/notifications/_index.scss
rename to src/features/ccDarkTheme/core/styles/components/notifications/_index.scss
diff --git a/src/ccDarkTheme/components/notifications/_panel.scss b/src/features/ccDarkTheme/core/styles/components/notifications/_panel.scss
similarity index 100%
rename from src/ccDarkTheme/components/notifications/_panel.scss
rename to src/features/ccDarkTheme/core/styles/components/notifications/_panel.scss
diff --git a/src/ccDarkTheme/components/popups/_account-selector.scss b/src/features/ccDarkTheme/core/styles/components/popups/_account-selector.scss
similarity index 100%
rename from src/ccDarkTheme/components/popups/_account-selector.scss
rename to src/features/ccDarkTheme/core/styles/components/popups/_account-selector.scss
diff --git a/src/ccDarkTheme/components/popups/_announcements.scss b/src/features/ccDarkTheme/core/styles/components/popups/_announcements.scss
similarity index 100%
rename from src/ccDarkTheme/components/popups/_announcements.scss
rename to src/features/ccDarkTheme/core/styles/components/popups/_announcements.scss
diff --git a/src/ccDarkTheme/components/popups/_index.scss b/src/features/ccDarkTheme/core/styles/components/popups/_index.scss
similarity index 100%
rename from src/ccDarkTheme/components/popups/_index.scss
rename to src/features/ccDarkTheme/core/styles/components/popups/_index.scss
diff --git a/src/ccDarkTheme/components/popups/_popup.scss b/src/features/ccDarkTheme/core/styles/components/popups/_popup.scss
similarity index 100%
rename from src/ccDarkTheme/components/popups/_popup.scss
rename to src/features/ccDarkTheme/core/styles/components/popups/_popup.scss
diff --git a/src/ccDarkTheme/layout/_header.scss b/src/features/ccDarkTheme/core/styles/layout/_header.scss
similarity index 100%
rename from src/ccDarkTheme/layout/_header.scss
rename to src/features/ccDarkTheme/core/styles/layout/_header.scss
diff --git a/src/ccDarkTheme/layout/_index.scss b/src/features/ccDarkTheme/core/styles/layout/_index.scss
similarity index 100%
rename from src/ccDarkTheme/layout/_index.scss
rename to src/features/ccDarkTheme/core/styles/layout/_index.scss
diff --git a/src/ccDarkTheme/layout/_main.scss b/src/features/ccDarkTheme/core/styles/layout/_main.scss
similarity index 100%
rename from src/ccDarkTheme/layout/_main.scss
rename to src/features/ccDarkTheme/core/styles/layout/_main.scss
diff --git a/src/ccDarkTheme/main.scss b/src/features/ccDarkTheme/core/styles/main.scss
similarity index 100%
rename from src/ccDarkTheme/main.scss
rename to src/features/ccDarkTheme/core/styles/main.scss
diff --git a/src/ccDarkTheme/vendors/_index.scss b/src/features/ccDarkTheme/core/styles/vendors/_index.scss
similarity index 100%
rename from src/ccDarkTheme/vendors/_index.scss
rename to src/features/ccDarkTheme/core/styles/vendors/_index.scss
diff --git a/src/ccDarkTheme/vendors/google/IMPORTANT_NOTICE.txt b/src/features/ccDarkTheme/core/styles/vendors/google/IMPORTANT_NOTICE.txt
similarity index 100%
rename from src/ccDarkTheme/vendors/google/IMPORTANT_NOTICE.txt
rename to src/features/ccDarkTheme/core/styles/vendors/google/IMPORTANT_NOTICE.txt
diff --git a/src/ccDarkTheme/vendors/google/_common-interop-components.scss b/src/features/ccDarkTheme/core/styles/vendors/google/_common-interop-components.scss
similarity index 100%
rename from src/ccDarkTheme/vendors/google/_common-interop-components.scss
rename to src/features/ccDarkTheme/core/styles/vendors/google/_common-interop-components.scss
diff --git a/src/ccDarkTheme/vendors/google/_index.scss b/src/features/ccDarkTheme/core/styles/vendors/google/_index.scss
similarity index 100%
rename from src/ccDarkTheme/vendors/google/_index.scss
rename to src/features/ccDarkTheme/core/styles/vendors/google/_index.scss
diff --git a/src/ccDarkTheme/vendors/google/_profile.scss b/src/features/ccDarkTheme/core/styles/vendors/google/_profile.scss
similarity index 100%
rename from src/ccDarkTheme/vendors/google/_profile.scss
rename to src/features/ccDarkTheme/core/styles/vendors/google/_profile.scss
diff --git a/src/ccDarkTheme/vendors/google/_thread.scss b/src/features/ccDarkTheme/core/styles/vendors/google/_thread.scss
similarity index 100%
rename from src/ccDarkTheme/vendors/google/_thread.scss
rename to src/features/ccDarkTheme/core/styles/vendors/google/_thread.scss
diff --git a/src/features/ccDarkTheme/nodeWatcherHandlers/ecApp.handler.ts b/src/features/ccDarkTheme/nodeWatcherHandlers/ecApp.handler.ts
new file mode 100644
index 0000000..12d50bb
--- /dev/null
+++ b/src/features/ccDarkTheme/nodeWatcherHandlers/ecApp.handler.ts
@@ -0,0 +1,26 @@
+import CssSelectorNodeWatcherScriptHandler from '../../../common/architecture/scripts/nodeWatcher/handlers/CssSelectorNodeWatcherScriptHandler';
+import { NodeMutation } from '../../../common/nodeWatcher/NodeWatcherHandler';
+import { injectDarkThemeButton } from '../core/logic/darkTheme';
+import { CCDarkThemeNodeWatcherDependencies } from '../scripts/nodeWatcher.script';
+
+/**
+ * Injects the dark theme button.
+ */
+export default class CCDarkThemeEcAppHandler extends CssSelectorNodeWatcherScriptHandler<CCDarkThemeNodeWatcherDependencies> {
+  cssSelector = 'ec-app';
+
+  async onMutatedNode(mutation: NodeMutation) {
+    if (!(mutation.node instanceof Element)) return;
+
+    const optionsProvider = this.options.optionsProvider;
+    const isEnabled = await optionsProvider.isEnabled('ccdarktheme');
+    const mode = await optionsProvider.getOptionValue('ccdarktheme_mode');
+
+    // TODO(avm99963): make this feature dynamic.
+    if (isEnabled && mode === 'switch') {
+      const rightControl = mutation.node.querySelector('header .right-control');
+      if (rightControl === null) return;
+      injectDarkThemeButton(rightControl);
+    }
+  }
+}
diff --git a/src/features/ccDarkTheme/nodeWatcherHandlers/reportDialog.handler.ts b/src/features/ccDarkTheme/nodeWatcherHandlers/reportDialog.handler.ts
new file mode 100644
index 0000000..83942e5
--- /dev/null
+++ b/src/features/ccDarkTheme/nodeWatcherHandlers/reportDialog.handler.ts
@@ -0,0 +1,17 @@
+import CssSelectorNodeWatcherScriptHandler from '../../../common/architecture/scripts/nodeWatcher/handlers/CssSelectorNodeWatcherScriptHandler';
+import { NodeMutation } from '../../../common/nodeWatcher/NodeWatcherHandler';
+import { CCDarkThemeNodeWatcherDependencies } from '../scripts/nodeWatcher.script';
+
+/**
+ * Sets the report dialog iframe's theme to the appropriate theme.
+ */
+export default class CCDarkThemeReportDialogHandler extends CssSelectorNodeWatcherScriptHandler<CCDarkThemeNodeWatcherDependencies> {
+  cssSelector = 'iframe';
+
+  onMutatedNode(mutation: NodeMutation) {
+    this.options.reportDialogColorThemeFix.fixThemeIfReportDialogIframeAndApplicable(
+      mutation.node,
+      this.options.optionsProvider,
+    );
+  }
+}
diff --git a/src/features/ccDarkTheme/nodeWatcherHandlers/unifiedProfilesIframe.handler.ts b/src/features/ccDarkTheme/nodeWatcherHandlers/unifiedProfilesIframe.handler.ts
new file mode 100644
index 0000000..b71b9a7
--- /dev/null
+++ b/src/features/ccDarkTheme/nodeWatcherHandlers/unifiedProfilesIframe.handler.ts
@@ -0,0 +1,23 @@
+import CssSelectorNodeWatcherScriptHandler from '../../../common/architecture/scripts/nodeWatcher/handlers/CssSelectorNodeWatcherScriptHandler';
+import { NodeMutation } from '../../../common/nodeWatcher/NodeWatcherHandler';
+import { isDarkThemeOn } from '../core/logic/darkTheme';
+import { unifiedProfilesFix } from '../core/logic/unifiedProfiles';
+import { CCDarkThemeNodeWatcherDependencies } from '../scripts/nodeWatcher.script';
+
+/**
+ * Redirect unified profile iframe to dark version if applicable
+ */
+export default class CCDarkThemeUnifiedProfilesIframeHandler extends CssSelectorNodeWatcherScriptHandler<CCDarkThemeNodeWatcherDependencies> {
+  cssSelector = 'iframe';
+
+  async onMutatedNode(mutation: NodeMutation) {
+    const optionsValues = await this.options.optionsProvider.getOptionsValues();
+
+    if (
+      isDarkThemeOn(optionsValues) &&
+      unifiedProfilesFix.checkIframe(mutation.node)
+    ) {
+      unifiedProfilesFix.fixIframe(mutation.node);
+    }
+  }
+}
diff --git a/src/features/ccDarkTheme/scripts/injectAutoDarkTheme.script.ts b/src/features/ccDarkTheme/scripts/injectAutoDarkTheme.script.ts
new file mode 100644
index 0000000..c462a03
--- /dev/null
+++ b/src/features/ccDarkTheme/scripts/injectAutoDarkTheme.script.ts
@@ -0,0 +1,17 @@
+import { ScriptPage } from '../../../common/architecture/scripts/Script';
+import StylesheetScript from '../../../common/architecture/scripts/stylesheet/StylesheetScript';
+
+export default class InjectAutoDarkTheme extends StylesheetScript {
+  stylesheet = 'ccDarkTheme.bundle.css';
+  attributes = { media: '(prefers-color-scheme: dark)' };
+  page = ScriptPage.CommunityConsole;
+
+  async shouldBeInjected(): Promise<boolean> {
+    const ccDarkThemeEnabled =
+      await this.optionsProvider.isEnabled('ccdarktheme');
+    const ccDarkThemeMode =
+      await this.optionsProvider.getOptionValue('ccdarktheme_mode');
+
+    return ccDarkThemeEnabled && ccDarkThemeMode === 'system';
+  }
+}
diff --git a/src/features/ccDarkTheme/scripts/injectForcedDarkTheme.script.ts b/src/features/ccDarkTheme/scripts/injectForcedDarkTheme.script.ts
new file mode 100644
index 0000000..ebd221b
--- /dev/null
+++ b/src/features/ccDarkTheme/scripts/injectForcedDarkTheme.script.ts
@@ -0,0 +1,23 @@
+import { ScriptPage } from '../../../common/architecture/scripts/Script';
+import StylesheetScript from '../../../common/architecture/scripts/stylesheet/StylesheetScript';
+
+export default class InjectForcedDarkTheme extends StylesheetScript {
+  stylesheet = 'ccDarkTheme.bundle.css';
+  page = ScriptPage.CommunityConsole;
+
+  async shouldBeInjected(): Promise<boolean> {
+    const ccDarkThemeEnabled =
+      await this.optionsProvider.isEnabled('ccdarktheme');
+    const ccDarkThemeMode =
+      await this.optionsProvider.getOptionValue('ccdarktheme_mode');
+    const ccDarkThemeSwitchEnabled = await this.optionsProvider.isEnabled(
+      'ccdarktheme_switch_status',
+    );
+
+    return (
+      ccDarkThemeEnabled &&
+      ccDarkThemeMode === 'switch' &&
+      ccDarkThemeSwitchEnabled
+    );
+  }
+}
diff --git a/src/features/ccDarkTheme/scripts/nodeWatcher.script.ts b/src/features/ccDarkTheme/scripts/nodeWatcher.script.ts
new file mode 100644
index 0000000..7a78798
--- /dev/null
+++ b/src/features/ccDarkTheme/scripts/nodeWatcher.script.ts
@@ -0,0 +1,46 @@
+import DependenciesProviderSingleton, {
+  OptionsProviderDependency,
+  ReportDialogColorThemeFixDependency,
+} from '../../../common/architecture/dependenciesProvider/DependenciesProvider';
+import {
+  ScriptEnvironment,
+  ScriptPage,
+  ScriptRunPhase,
+} from '../../../common/architecture/scripts/Script';
+import NodeWatcherScript from '../../../common/architecture/scripts/nodeWatcher/NodeWatcherScript';
+import OptionsProvider from '../../../common/options/OptionsProvider';
+import ReportDialogColorThemeFix from '../core/logic/reportDialog';
+import CCDarkThemeEcAppHandler from '../nodeWatcherHandlers/ecApp.handler';
+import CCDarkThemeReportDialogHandler from '../nodeWatcherHandlers/reportDialog.handler';
+import CCDarkThemeUnifiedProfilesIframeHandler from '../nodeWatcherHandlers/unifiedProfilesIframe.handler';
+
+export interface CCDarkThemeNodeWatcherDependencies {
+  reportDialogColorThemeFix: ReportDialogColorThemeFix;
+  optionsProvider: OptionsProvider;
+}
+
+export default class CCDarkThemeNodeWatcherScript extends NodeWatcherScript<CCDarkThemeNodeWatcherDependencies> {
+  public page = ScriptPage.CommunityConsole;
+  public environment = ScriptEnvironment.ContentScript;
+  public runPhase = ScriptRunPhase.Main;
+  public handlers = new Map([
+    ['cc-dark-theme-ec-app', CCDarkThemeEcAppHandler],
+    ['cc-dark-theme-report-dialog', CCDarkThemeReportDialogHandler],
+    [
+      'cc-dark-theme-unified-profiles-iframe',
+      CCDarkThemeUnifiedProfilesIframeHandler,
+    ],
+  ]);
+
+  protected optionsFactory(): CCDarkThemeNodeWatcherDependencies {
+    const dependenciesProvider = DependenciesProviderSingleton.getInstance();
+    return {
+      reportDialogColorThemeFix: dependenciesProvider.getDependency(
+        ReportDialogColorThemeFixDependency,
+      ),
+      optionsProvider: dependenciesProvider.getDependency(
+        OptionsProviderDependency,
+      ),
+    };
+  }
+}