dclstn · Oct 6, 2026 · Oct 5, 2026
diff --git a/src/modules/reduced_motion/index.js b/src/modules/reduced_motion/index.js
@@ -1,11 +1,9 @@
 import effects from '@/common/styles/UsernameEffects.module.css';
 import {onReducedMotionChange, shouldReduceMotion} from '@/common/utils/reduced-motion';
-import watcher from '@/watcher';
 
 class ReducedMotionModule {
   constructor() {
     onReducedMotionChange(() => this.load());
-    watcher.on('load.chat', () => this.load());
     this.load();
   }
 

diff --git a/src/modules/settings/components/SettingCheckbox.jsx b/src/modules/settings/components/SettingCheckbox.jsx
@@ -3,9 +3,9 @@ import React from 'react';
 import styles from './SettingCheckbox.module.css';
 import SettingWrapper from './SettingWrapper';
 
-function SettingCheckbox({name, description, value, onChange, showProBadge = false, showNewBadge = false, ...props}) {
+function SettingCheckbox({name, description, value, onChange, showProBadge = false, ...props}) {
   return (
-    <SettingWrapper name={name} description={description} showProBadge={showProBadge} showNewBadge={showNewBadge}>
+    <SettingWrapper name={name} description={description} showProBadge={showProBadge}>
       <Checkbox
         {...props}
         value={String(value)}

diff --git a/src/modules/settings/components/SettingKeywords.jsx b/src/modules/settings/components/SettingKeywords.jsx
@@ -19,7 +19,7 @@ import {
 } from '@mantine/core';
 import {useDisclosure, useFocusTrap} from '@mantine/hooks';
 import classNames from 'classnames';
-import React, {useCallback, useMemo, useRef, useState} from 'react';
+import React, {useCallback, useMemo, useState} from 'react';
 import Icon from '@/common/components/Icon';
 import useBadgeOptions from '@/common/hooks/BadgeOptions';
 import useCurrentChannel from '@/common/hooks/CurrentChannel';
@@ -274,7 +274,7 @@ function KeywordsTable({
               </ActionIcon>
             </div>
           </TableTh>
-          <TableTh className={styles.channelsColumn}>{formatMessage({defaultMessage: 'Channels'})}</TableTh>
+          <TableTh>{formatMessage({defaultMessage: 'Channels'})}</TableTh>
           <TableTh className={tableStyles.actionsColumn} />
         </TableTr>
       </TableThead>
@@ -361,7 +361,7 @@ function SettingKeywords({value, setValue, colorColumn = null}) {
           {formatMessage({defaultMessage: 'New Entry'})}
         </Button>
       }
-      className={styles.settingGroupContent}>
+      className={tableStyles.settingGroupContent}>
       {filteredEntryList.length > 0 ? (
         <KeywordsTable
           entryList={filteredEntryList}
@@ -374,7 +374,7 @@ function SettingKeywords({value, setValue, colorColumn = null}) {
           onPaste={handlePaste}
         />
       ) : entryList.length > 0 ? (
-        <Text className={styles.noKeywordsText} c="dimmed">
+        <Text className={tableStyles.emptyText} c="dimmed">
           {formatMessage({defaultMessage: 'No keywords match your search.'})}
         </Text>
       ) : (

diff --git a/src/modules/settings/components/SettingKeywords.module.css b/src/modules/settings/components/SettingKeywords.module.css
@@ -1,12 +1,3 @@
-.settingGroupContent {
-  padding: 0;
-  overflow: hidden;
-}
-
-.newEntryButton {
-  margin-left: auto;
-}
-
 .searchInputRoot {
   width: 100%;
   max-width: 240px;
@@ -16,63 +7,20 @@
   height: 32px;
 }
 
-.table {
-  font-size: var(--mantine-font-size-md);
-
-  th {
-    font-weight: 500;
-  }
-
-  th,
-  td {
-    padding: 8px 12px;
-    height: 36px;
-  }
-
-  --table-border-color: var(--mantine-color-default-border);
-
-  td:hover {
-    background-color: var(--table-hover-color);
-  }
-}
-
-.targetDataCell,
-.keywordDataCell,
-.colorDataCell,
-.actionsDataCell {
-  padding: 0 !important;
-}
-
 .targetColumn {
   width: 128px;
 }
 
-.targetSelectInput,
-.keywordInput {
-  font-size: var(--mantine-font-size-md);
-  padding-left: 12px;
-}
-
-.keywordInput:focus {
-  box-shadow: unset;
-}
-
 .keywordRoot {
   min-width: 192px;
-}
-
-.keywordRoot,
-.keywordInput,
-.keywordWrapper {
   height: 100%;
 }
 
 .keywordColumn {
   width: 1px;
 }
 
-.colorPicker,
-.actionIcon {
+.colorPicker {
   width: 36px;
   height: 36px;
   padding: 8px;
@@ -82,11 +30,6 @@
   justify-content: center;
 }
 
-.actionIconIcon {
-  width: 12px;
-  height: 12px;
-}
-
 .channelsContainer {
   all: unset;
   cursor: pointer;
@@ -109,12 +52,6 @@
   vertical-align: middle;
 }
 
-.settingGroupHeader {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-}
-
 .channelsInputHidden {
   display: none;
 }
@@ -144,11 +81,6 @@
   flex-shrink: 0;
 }
 
-.noKeywordsText {
-  padding: 20px;
-  text-align: center;
-}
-
 .keywordHeader {
   display: flex;
   align-items: center;

diff --git a/src/modules/settings/components/SettingPrimaryColorRadio.jsx b/src/modules/settings/components/SettingPrimaryColorRadio.jsx
@@ -48,7 +48,6 @@ function SettingPrimaryColorRadio({
   description,
   colors = PRIMARY_COLOR_PALETTE,
   showProBadge = false,
-  showNewBadge = false,
 }) {
   const normalizedValue = useMemo(() => normalizePrimaryColor(value, colors), [value, colors]);
   const colorLabels = useMemo(() => buildPrimaryColorLabels(colors), [colors]);
@@ -61,8 +60,7 @@ function SettingPrimaryColorRadio({
       reverse
       description={description}
       controlClassName={groupStyles.radioGroup}
-      showProBadge={showProBadge}
-      showNewBadge={showNewBadge}>
+      showProBadge={showProBadge}>
       <SettingRadioCardGroup value={normalizedValue} onChange={handleChange}>
         {colors.map((color) => (
           <SettingRadioCard

diff --git a/src/modules/settings/components/SettingSelfBotCommands.jsx b/src/modules/settings/components/SettingSelfBotCommands.jsx
@@ -15,7 +15,7 @@ import {
   TextInput,
 } from '@mantine/core';
 import classNames from 'classnames';
-import React, {useCallback, useMemo, useRef, useState} from 'react';
+import React, {useCallback, useMemo, useState} from 'react';
 import {useShallow} from 'zustand/react/shallow';
 import Icon from '@/common/components/Icon';
 import useEntryListState from '@/common/hooks/EntryListState';

diff --git a/src/modules/settings/components/SettingSelfBotTimers.jsx b/src/modules/settings/components/SettingSelfBotTimers.jsx
@@ -13,7 +13,7 @@ import {
   TextInput,
 } from '@mantine/core';
 import classNames from 'classnames';
-import React, {useCallback, useMemo, useRef, useState} from 'react';
+import React, {useCallback, useMemo, useState} from 'react';
 import {useShallow} from 'zustand/react/shallow';
 import Icon from '@/common/components/Icon';
 import ProBadge from '@/common/components/ProBadge';

diff --git a/src/modules/settings/components/SettingWrapper.jsx b/src/modules/settings/components/SettingWrapper.jsx
@@ -14,7 +14,6 @@ function SettingWrapper({
   children,
   showProBadge = false,
   showNewBadge = false,
-  showComingSoonBadge = false,
   reverse = false,
   wrap = false,
   controlClassName = '',
@@ -59,16 +58,6 @@ function SettingWrapper({
                 </Badge>
               </Tooltip>
             ) : null}
-            {showComingSoonBadge ? (
-              <Tooltip
-                withArrow
-                label={<Text size="md">{formatMessage({defaultMessage: 'This feature is not available yet.'})}</Text>}
-                portalProps={{target: portalRef.current}}>
-                <Badge color="green" variant="elevated" size="lg">
-                  {formatMessage({defaultMessage: 'Coming Soon'})}
-                </Badge>
-              </Tooltip>
-            ) : null}
           </Title>
         ) : null}
         {description != null ? (

diff --git a/src/modules/settings/components/SettingWrapper.module.css b/src/modules/settings/components/SettingWrapper.module.css
@@ -9,16 +9,6 @@
   flex-wrap: wrap;
 }
 
-.vertical {
-  flex-direction: column-reverse;
-  align-items: flex-start;
-}
-
-.reverse {
-  flex-direction: row-reverse;
-  flex-wrap: wrap;
-}
-
 .text {
   display: flex;
   flex-direction: column;

diff --git a/src/modules/settings/components/SideNavigation.module.css b/src/modules/settings/components/SideNavigation.module.css
@@ -82,7 +82,7 @@
   transform: none;
 }
 
-/* top-level nav items for each individual setting (also used by the Changelog button). These use
+/* top-level nav items for each individual setting. These use
    Mantine's transparent variant, so there's no background fill in any state (rest, hover, or
    active) — hovering only undims the label (see the hover rule below), Discord-style, and the
    pill treatment stays exclusive to the category rows. */