deploy: 56ba5d8

scss/adjust/_chat.scss

@@ -0,0 +1,6 @@
+// Channels and Roles
+:is(.theme-dark, .theme-light) {
+    :is(.container__03ec9, .header__71942, .scrollerContainer_dda72c, .emptyPage_feb902, .container__6b2e5) {
+        background-color: var(--background-primary);
+    }
+}

scss/adjust/_input.scss

@@ -0,0 +1,16 @@
+// Inputs
+
+// Toggle switch
+.control__6a084 {
+    @at-root .container__2ed72 {
+        color: var(--primary-400);
+        &.checked__36fdc {
+            color: var(--green-360);
+        }
+
+        background-color: currentColor !important;
+        path {
+            fill: currentColor;
+        }
+    }
+}

scss/adjust/_search.scss

@@ -0,0 +1,44 @@
+// Message search
+
+// Search pills
+// Hardcoded colours replaced by vars of closest luminosity match
+// #34383d / hsl(213, 7.96%, 22.16%) --> var(--primary-600)
+.theme-dark :is(.searchAnswer__2ccaf, .searchFilter_dbda51) {
+    background-color: var(--primary-600);
+}
+
+// Search options
+// Hardcoded colours replaced by vars of closest luminosity match
+// #caccce / hsl(210, 4%, 80%) --> var(--primary-300)
+// #5d6269 / hsl(215, 6%, 39%) --> var(--primary-460)
+.theme-dark {
+    --search-popout-option-fade: linear-gradient(90deg, transparent 0%, var(--primary-800) 80%);
+    --search-popout-option-fade-hover: linear-gradient(90deg, transparent 0%, var(--primary-600) 50%);
+    --search-popout-option-user-nickname: var(--text-normal);
+    --search-popout-option-user-username: var(--text-muted);
+    --search-popout-option-filter-text: var(--primary-400);
+    --search-popout-option-non-text-color: var(--primary-300);
+    --search-popout-option-filter-color: var(--primary-300);
+    --search-popout-option-answer-color: var(--primary-300);
+    --search-popout-date-picker-border: 1px solid var(--primary-660);
+    --search-popout-date-picker-hint-text: var(--primary-300);
+    --search-popout-date-picker-hint-value-text: var(--white-500);
+    --search-popout-date-picker-hint-value-background: var(--brand-experiment);
+    --search-popout-date-picker-hint-value-background-hover: var(--brand-experiment-430);
+}
+
+.theme-light {
+    --search-popout-option-fade: linear-gradient(90deg, transparent 0%, var(--white-500) 80%);
+    --search-popout-option-fade-hover: linear-gradient(90deg, transparent 0%, var(--primary-160) 50%);
+    --search-popout-option-user-nickname: var(--text-normal);
+    --search-popout-option-user-username: var(--text-muted);
+    --search-popout-option-filter-text: var(--primary-300);
+    --search-popout-option-non-text-color: var(--primary-460);
+    --search-popout-option-filter-color: var(--primary-300);
+    --search-popout-option-answer-color: var(--primary-500);
+    --search-popout-date-picker-border: 1px solid var(--primary-200);
+    --search-popout-date-picker-hint-text: var(--primary-300);
+    --search-popout-date-picker-hint-value-text: var(--white-500);
+    --search-popout-date-picker-hint-value-background: var(--brand-experiment);
+    --search-popout-date-picker-hint-value-background-hover: var(--brand-experiment-400);
+}

scss/adjust/index.scss

@@ -0,0 +1,3 @@
+@forward "./chat";
+@forward "./input";
+@forward "./search";

scss/sys.scss

@@ -1,3 +1,4 @@
+@forward "./adjust";
 @forward "./mode";
 @forward "./root";
 @forward "./themesettings";

scss/themesettings/_validate.scss

@@ -4,6 +4,6 @@
 // or invalid user input given
 @property #{$origin} {
     syntax: "<color>";
-    inherits: false;
+    inherits: true;
     initial-value: cyan;
 }