diff --git a/plugins/chat/assets/stylesheets/common/chat-channel-title.scss b/plugins/chat/assets/stylesheets/common/chat-channel-title.scss
index d5bbb14222e..38968f36c11 100644
--- a/plugins/chat/assets/stylesheets/common/chat-channel-title.scss
+++ b/plugins/chat/assets/stylesheets/common/chat-channel-title.scss
@@ -8,18 +8,6 @@
   align-items: center;
   @include ellipsis;
 
-  .category-chat-private .d-icon {
-    background-color: var(--secondary);
-    position: absolute;
-    border-radius: 5px;
-    padding: 2px 2px 3px;
-    color: var(--primary-high);
-    height: 0.5em;
-    width: 0.5em;
-    left: calc(0.6125em + 3px);
-    top: -4px;
-  }
-
   .user-status-message {
     display: none; // we only show when in channels list
   }
diff --git a/plugins/chat/assets/stylesheets/common/chat-drawer.scss b/plugins/chat/assets/stylesheets/common/chat-drawer.scss
index 5e6dcf786f7..918dcd6b8c5 100644
--- a/plugins/chat/assets/stylesheets/common/chat-drawer.scss
+++ b/plugins/chat/assets/stylesheets/common/chat-drawer.scss
@@ -35,18 +35,6 @@ body.composer-open .chat-drawer-outlet-container {
   padding-bottom: var(--composer-height, 0);
   transition: all 100ms ease-in;
   transition-property: bottom, padding-bottom;
-
-  .channels-list {
-    .chat-channel-row {
-      height: 3.6em;
-      padding: 0 0.5rem;
-      margin: 0 0 0 0.5rem;
-
-      &:not(:last-of-type) {
-        border-bottom: 1px solid var(--primary-low);
-      }
-    }
-  }
 }
 
 .chat-drawer {
@@ -146,9 +134,7 @@ body.composer-open .chat-drawer-outlet-container {
         height: 1.25em;
       }
     }
-    .category-chat-private .d-icon {
-      background-color: var(--primary-very-low);
-    }
+
     .badge-wrapper.bullet {
       margin-right: 0px;
     }
@@ -211,9 +197,4 @@ body.composer-open .chat-drawer-outlet-container {
   height: 100%;
   min-height: 1px;
   padding-bottom: 0.25em;
-
-  .channels-list .chat-channel-divider {
-    padding: 1.5rem 0.5rem 1rem 1rem;
-    color: var(--quaternary);
-  }
 }
diff --git a/plugins/chat/assets/stylesheets/common/chat-index.scss b/plugins/chat/assets/stylesheets/common/chat-index.scss
index 93f5e33fea3..1bde956b15f 100644
--- a/plugins/chat/assets/stylesheets/common/chat-index.scss
+++ b/plugins/chat/assets/stylesheets/common/chat-index.scss
@@ -1,19 +1,208 @@
 .channels-list {
+  overflow-y: auto;
+  height: 100%;
+  padding-bottom: env(safe-area-inset-bottom);
+  position: relative;
+  @include chat-scrollbar(var(--secondary));
+
+  @include breakpoint(mobile-large) {
+    @include chat-scrollbar();
+  }
+
+  .open-browse-page-btn,
+  .open-draft-channel-page-btn,
+  .chat-channel-leave-btn {
+    position: relative;
+    padding: 0;
+    background: transparent;
+    color: var(--primary-medium);
+    font-size: var(--font-0-rem);
+
+    &:after {
+      content: "";
+      position: absolute;
+      top: -50%;
+      left: -50%;
+      width: 200%;
+      height: 200%;
+    }
+
+    &:hover {
+      background: transparent;
+
+      .d-icon {
+        color: var(--primary);
+      }
+    }
+  }
+
+  .public-channel-empty-message {
+    margin: 0 0.5em 0.5em 0.5em;
+    padding: 0 1em;
+  }
+
   .chat-channel-divider {
     padding: 2.5rem 1.5rem 0.5rem 1.5rem;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    font-weight: bold;
+    font-family: var(--heading-font-family);
+    font-size: var(--font-down-1);
+    color: var(--quaternary);
+
+    .channel-title {
+      line-height: var(--line-height-medium);
+    }
 
     &:first-of-type {
       padding-top: 1rem;
     }
   }
 
-  .chat-channel-title {
-    padding-right: 0.5em;
-  }
+  .chat-channel-row {
+    align-items: center;
+    box-sizing: border-box;
+    display: flex;
+    justify-content: space-between;
+    position: relative;
+    cursor: pointer;
+    color: var(--primary-high);
+    transition: opacity 50ms ease-in;
+    opacity: 1;
 
-  .chat-channel-title {
-    &__avatar {
-      padding: 1px 0; //for green active box-shadow effect;
+    @media (hover: hover) {
+      &.can-leave:hover {
+        .toggle-channel-membership-button.-leave {
+          display: block;
+
+          > * {
+            pointer-events: auto;
+          }
+        }
+
+        .chat-channel-metadata {
+          display: none;
+        }
+      }
+    }
+
+    .discourse-no-touch &:hover,
+    &.active {
+      background: var(--primary-low);
+    }
+
+    &:hover,
+    &.active {
+      &.active {
+        font-weight: 600;
+      }
+
+      .chat-channel-title {
+        &,
+        .category-chat-name,
+        .dm-usernames {
+          color: var(--primary);
+        }
+
+        .d-icon-lock {
+          background-color: var(--primary-low);
+        }
+      }
+    }
+
+    &:visited {
+      color: var(--primary-high);
+    }
+
+    &.muted {
+      opacity: 0.65;
+    }
+
+    .chat-channel-title {
+      &__users-count {
+        width: var(--channel-list-avatar-size);
+        height: var(--channel-list-avatar-size);
+        padding: 0;
+        font-size: var(--font-up-1);
+        justify-content: center;
+      }
+
+      &__avatar {
+        .chat-user-avatar {
+          img {
+            width: calc(var(--channel-list-avatar-size) - 2px);
+            height: calc(var(--channel-list-avatar-size) - 2px);
+          }
+        }
+      }
+      &__user-info {
+        @include ellipsis;
+      }
+      &__usernames {
+        display: flex;
+        align-items: center;
+        justify-content: start;
+      }
+      .user-status-message {
+        display: inline-block;
+        font-size: var(--font-down-2);
+        margin-right: 0.5rem;
+
+        &-description {
+          color: var(--primary-medium);
+        }
+      }
+    }
+
+    .chat-channel-metadata {
+      display: flex;
+      align-items: flex-end;
+      flex-direction: column;
+      margin-left: 0.5em;
+
+      &__date {
+        color: var(--primary-high);
+        font-size: var(--font-down-2);
+        white-space: nowrap;
+      }
+
+      .chat-channel-unread-indicator {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        width: auto;
+        min-width: 14px;
+        padding: 2px;
+        font-size: var(--font-down-3);
+        border-radius: 1em;
+        background: var(--tertiary-med-or-tertiary);
+
+        &.urgent {
+          background: var(--success);
+        }
+
+        .number {
+          line-height: 1rem;
+        }
+      }
+    }
+
+    &.unfollowing {
+      opacity: 0;
+    }
+
+    .toggle-channel-membership-button.-leave {
+      display: none;
+      margin-left: auto;
+    }
+    .badge-wrapper {
+      align-items: center;
+      margin-right: 0;
+    }
+
+    .emoji {
+      margin-left: 0.3em;
     }
   }
 }
diff --git a/plugins/chat/assets/stylesheets/common/common.scss b/plugins/chat/assets/stylesheets/common/common.scss
index 97d0a6a821a..10ef7b7ad0b 100644
--- a/plugins/chat/assets/stylesheets/common/common.scss
+++ b/plugins/chat/assets/stylesheets/common/common.scss
@@ -127,92 +127,6 @@ $float-height: 530px;
   }
 }
 
-.channels-list {
-  overflow-y: auto;
-  height: 100%;
-  padding-bottom: env(safe-area-inset-bottom);
-  position: relative;
-  @include chat-scrollbar(var(--secondary));
-
-  @include breakpoint(mobile-large) {
-    @include chat-scrollbar();
-  }
-
-  .chat-channel-unread-indicator {
-    font-size: var(--font-down-1);
-  }
-
-  .open-browse-page-btn,
-  .open-draft-channel-page-btn,
-  .chat-channel-leave-btn {
-    position: relative;
-    padding: 0;
-    background: transparent;
-    color: var(--primary-medium);
-    font-size: var(--font-0-rem);
-
-    &:after {
-      content: "";
-      position: absolute;
-      top: -50%;
-      left: -50%;
-      width: 200%;
-      height: 200%;
-    }
-
-    &:hover {
-      background: transparent;
-
-      .d-icon {
-        color: var(--primary);
-      }
-    }
-  }
-
-  .public-channel-empty-message {
-    margin: 0 0.5em 0.5em 0.5em;
-    padding: 0 1em;
-  }
-
-  .chat-channel-divider {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    font-weight: bold;
-    padding: 0.25rem 0.5rem 0.25rem 2rem;
-    font-family: var(--heading-font-family);
-    font-size: var(--font-0);
-
-    .channel-title {
-      line-height: var(--line-height-medium);
-    }
-  }
-
-  .edit-channels-dropdown {
-    .select-kit-header {
-      background: none;
-      border: none;
-      font-size: var(--font-0-rem);
-      padding: 0.5rem;
-
-      .d-icon {
-        color: var(--primary-medium);
-        margin: 0;
-      }
-
-      &:focus .d-icon,
-      &:hover .d-icon {
-        color: var(--primary);
-      }
-    }
-  }
-  .open-browse-page-btn {
-    &:hover {
-      background: none;
-    }
-  }
-}
-
 .chat-messages-container {
   word-wrap: break-word;
   white-space: normal;
@@ -278,9 +192,10 @@ $float-height: 530px;
 
   .chat-user-avatar-container {
     position: relative;
+    padding: 1px; //for is-online boxshadow effect, preventing cutoff
 
     .avatar {
-      padding: 1px;
+      padding: 1px; ////for is-online boxshadow effect, preventing shift
     }
 
     .chat-user-presence-flair {
@@ -425,149 +340,6 @@ $float-height: 530px;
   }
 }
 
-.chat-channel-row {
-  align-items: center;
-  box-sizing: border-box;
-  display: flex;
-  justify-content: space-between;
-  position: relative;
-  cursor: pointer;
-  color: var(--primary-high);
-  transition: opacity 50ms ease-in;
-  opacity: 1;
-
-  .chat-channel-title {
-    &__user-info {
-      @include ellipsis;
-    }
-
-    &__usernames {
-      display: flex;
-      align-items: center;
-      justify-content: start;
-    }
-
-    .user-status-message {
-      display: inline-block;
-      font-size: var(--font-down-2);
-      margin-right: 0.5rem;
-
-      &-description {
-        color: var(--primary-medium);
-      }
-    }
-  }
-
-  .chat-channel-metadata {
-    display: flex;
-    align-items: flex-end;
-    flex-direction: column;
-
-    &__date {
-      color: var(--primary-high);
-      font-size: var(--font-down-2);
-      white-space: nowrap;
-    }
-
-    .chat-channel-unread-indicator {
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      margin-top: 0.25rem;
-      width: auto;
-      min-width: 14px;
-      padding: 2px;
-      font-size: var(--font-down-3);
-      border-radius: 1em;
-
-      .number {
-        line-height: 1rem;
-      }
-    }
-  }
-
-  .chat-user-avatar {
-    pointer-events: none;
-  }
-
-  &.unfollowing {
-    opacity: 0;
-  }
-
-  .toggle-channel-membership-button.-leave {
-    display: none;
-    margin-left: auto;
-  }
-
-  @media (hover: hover) {
-    &.can-leave:hover {
-      .toggle-channel-membership-button.-leave {
-        display: block;
-
-        > * {
-          pointer-events: auto;
-        }
-      }
-
-      .chat-channel-metadata {
-        display: none;
-      }
-    }
-  }
-
-  .discourse-no-touch &:hover,
-  &.active {
-    background: var(--primary-low);
-  }
-
-  &:hover,
-  &.active {
-    &.active {
-      font-weight: 600;
-    }
-
-    .chat-channel-unread-indicator {
-      border-color: var(--primary-low);
-    }
-
-    .chat-channel-title {
-      &,
-      .category-chat-name,
-      .dm-usernames {
-        color: var(--primary);
-      }
-
-      .d-icon-lock {
-        background-color: var(--primary-low);
-      }
-    }
-  }
-
-  &:visited {
-    color: var(--primary-high);
-  }
-
-  &.muted {
-    opacity: 0.65;
-  }
-  .badge-wrapper {
-    align-items: center;
-    margin-right: 0;
-  }
-
-  .chat-channel-unread-indicator {
-    background: var(--tertiary-med-or-tertiary);
-
-    &.urgent {
-      background: var(--success);
-    }
-  }
-
-  .emoji {
-    margin-left: 0.3em;
-  }
-}
-
 .chat-channel-settings-row {
   display: flex;
   padding: 0.5em;
@@ -617,12 +389,6 @@ $float-height: 530px;
       }
     }
   }
-  .btn-container {
-    margin-left: auto;
-  }
-}
-
-.chat-channel-settings-row {
   .channel-name-edit {
     display: flex;
     align-items: center;
@@ -637,6 +403,9 @@ $float-height: 530px;
       margin-left: 0.25em;
     }
   }
+  .btn-container {
+    margin-left: auto;
+  }
 }
 
 body.has-sidebar-page.has-full-page-chat #main-outlet-wrapper {
@@ -659,36 +428,6 @@ body.has-full-page-chat {
   display: grid;
   grid-template-columns: var(--full-page-sidebar-width) 1fr;
 
-  .channels-list {
-    height: 100%;
-    border-right: 1px solid var(--primary-low);
-
-    .chat-channel-row {
-      padding: 0 0 0 0.5rem;
-      margin: 0 0.5rem 0.125rem 0.5rem;
-      border-radius: 0.25em;
-
-      .category-chat-private .d-icon {
-        background-color: var(--primary-very-low);
-      }
-
-      &:hover,
-      &.active {
-        background-color: var(--primary-low);
-        .chat-channel-title {
-          .category-chat-name,
-          .chat-name,
-          .dm-usernames {
-            color: var(--primary);
-          }
-        }
-        .category-chat-private .d-icon {
-          background-color: var(--primary-low);
-        }
-      }
-    }
-  }
-
   .chat-full-page-header {
     border-top: 1px solid var(--primary-low);
     border-bottom: 1px solid var(--primary-low);
@@ -793,33 +532,6 @@ body.has-full-page-chat {
   }
 }
 
-.channels-list {
-  .category-chat-badge {
-    color: var(--primary-low-mid);
-    display: flex;
-    align-items: center;
-    justify-content: center;
-
-    .d-icon {
-      height: 1.25em;
-      width: 1.25em;
-      margin: 0;
-    }
-  }
-
-  .category-chat-private .d-icon {
-    background-color: var(--secondary);
-    position: absolute;
-    border-radius: 5px;
-    padding: 3px 2px;
-    color: var(--primary-high);
-    height: 0.5em;
-    width: 0.5em;
-    left: calc(0.6125em + 6px);
-    top: -4px;
-  }
-}
-
 .chat-channel-archive-modal-inner {
   .chat-to-topic-selector {
     width: 500px;
@@ -1020,22 +732,3 @@ html.has-full-page-chat {
 [data-popper-reference-hidden] {
   visibility: hidden;
 }
-
-.channels-list {
-  .chat-user-avatar {
-    img {
-      width: calc(var(--channel-list-avatar-size) - 2px);
-      height: calc(var(--channel-list-avatar-size) - 2px);
-    }
-  }
-
-  .chat-channel-title {
-    &__users-count {
-      width: var(--channel-list-avatar-size);
-      height: var(--channel-list-avatar-size);
-      padding: 0;
-      font-size: var(--font-up-1);
-      justify-content: center;
-    }
-  }
-}
diff --git a/plugins/chat/assets/stylesheets/desktop/chat-channel-title.scss b/plugins/chat/assets/stylesheets/desktop/chat-channel-title.scss
index 5c79ad4b616..019738fe4d9 100644
--- a/plugins/chat/assets/stylesheets/desktop/chat-channel-title.scss
+++ b/plugins/chat/assets/stylesheets/desktop/chat-channel-title.scss
@@ -6,16 +6,3 @@
     border-radius: 5px;
   }
 }
-
-.channels-list {
-  .chat-channel-title {
-    max-width: 100%;
-    box-sizing: border-box;
-  }
-
-  .chat-channel-row:hover {
-    .chat-channel-title {
-      overflow: hidden;
-    }
-  }
-}
diff --git a/plugins/chat/assets/stylesheets/desktop/chat-index-drawer.scss b/plugins/chat/assets/stylesheets/desktop/chat-index-drawer.scss
new file mode 100644
index 00000000000..4fa41f81053
--- /dev/null
+++ b/plugins/chat/assets/stylesheets/desktop/chat-index-drawer.scss
@@ -0,0 +1,26 @@
+.chat-drawer-container .channels-list {
+  .chat-channel-divider {
+    padding: 1.5rem 0.5rem 0.5rem 1rem;
+    font-size: var(--font-0);
+  }
+
+  .chat-channel-row {
+    height: 3.6em;
+    padding: 0 0.5rem;
+    margin: 0 0 0 0.5rem;
+
+    &:not(:last-of-type) {
+      border-bottom: 1px solid var(--primary-low);
+    }
+
+    .chat-channel-metadata {
+      .chat-channel-unread-indicator {
+        margin-top: 0.25rem;
+      }
+    }
+  }
+
+  .toggle-channel-membership-button.-leave {
+    margin-left: 0.5em;
+  }
+}
diff --git a/plugins/chat/assets/stylesheets/desktop/chat-index-full-page.scss b/plugins/chat/assets/stylesheets/desktop/chat-index-full-page.scss
new file mode 100644
index 00000000000..a175d8779dd
--- /dev/null
+++ b/plugins/chat/assets/stylesheets/desktop/chat-index-full-page.scss
@@ -0,0 +1,45 @@
+.has-full-page-chat:not(.discourse-sidebar) {
+  .full-page-chat {
+    .channels-list {
+      height: 100%;
+      border-right: 1px solid var(--primary-low);
+      background: var(--primary-very-low);
+
+      .chat-channel-divider {
+        padding: 2rem 1rem 0.5rem 1rem;
+
+        &:first-of-type {
+          padding-top: 1.5rem;
+        }
+      }
+
+      .loading-container {
+        padding-bottom: 1em;
+      }
+
+      .chat-channel-row {
+        height: 2.5em;
+        padding: 0 0.5rem;
+        margin: 0 0.5rem 0.125rem 0.5rem;
+        border-radius: 0.25em;
+        &:hover,
+        &.active {
+          background-color: var(--primary-low);
+          .chat-channel-title {
+            .category-chat-name,
+            .chat-name,
+            .dm-usernames {
+              color: var(--primary);
+            }
+          }
+        }
+
+        .chat-channel-metadata {
+          &__date {
+            display: none;
+          }
+        }
+      }
+    }
+  }
+}
diff --git a/plugins/chat/assets/stylesheets/desktop/desktop.scss b/plugins/chat/assets/stylesheets/desktop/desktop.scss
index 3b55a455020..7515793b304 100644
--- a/plugins/chat/assets/stylesheets/desktop/desktop.scss
+++ b/plugins/chat/assets/stylesheets/desktop/desktop.scss
@@ -73,36 +73,6 @@
     border-right: 1px solid var(--primary-low);
     border-left: 1px solid var(--primary-low);
 
-    .channels-list {
-      background: var(--primary-very-low);
-
-      .chat-channel-divider {
-        padding: 2rem 0.5rem 0.5rem 1rem;
-
-        &:first-of-type {
-          padding-top: 1.5rem;
-        }
-      }
-
-      .chat-channel-row {
-        height: 2.5em;
-        padding-right: 0.5rem;
-
-        .chat-channel-metadata {
-          &__date {
-            display: none;
-          }
-          .chat-channel-unread-indicator {
-            margin-top: 0;
-          }
-        }
-      }
-
-      .loading-container {
-        padding-bottom: 1em;
-      }
-    }
-
     .chat-live-pane {
       border-radius: unset;
     }
diff --git a/plugins/chat/assets/stylesheets/mobile/chat-index.scss b/plugins/chat/assets/stylesheets/mobile/chat-index.scss
index 68365943e03..7659920f80a 100644
--- a/plugins/chat/assets/stylesheets/mobile/chat-index.scss
+++ b/plugins/chat/assets/stylesheets/mobile/chat-index.scss
@@ -1,6 +1,7 @@
 @import "common/foundation/mixins";
 .full-page-chat {
   overflow: hidden; //prevents double scroll
+
   .channels-list {
     overflow-y: overlay;
     padding-bottom: 6rem;
@@ -16,6 +17,10 @@
       }
     }
 
+    .channels-list-container {
+      background: var(--secondary);
+    }
+
     .chat-channel-row {
       height: 4em;
       margin: 0 1.5rem;
@@ -24,6 +29,10 @@
       border-bottom: 1px solid var(--primary-low);
 
       .chat-channel-metadata {
+        .chat-channel-unread-indicator {
+          font-size: var(--font-down-2);
+          margin-top: 0.25rem;
+        }
         &__date {
           font-size: var(--font-down-2);
         }
@@ -31,8 +40,6 @@
     }
 
     .chat-channel-divider {
-      background-color: var(--secondary);
-      padding: 2.5rem 1.5rem 0.75rem 1.5rem;
       font-size: var(--font-up-1);
 
       &:first-of-type {
@@ -45,14 +52,6 @@
       }
     }
 
-    .channels-list-container {
-      background: var(--secondary);
-    }
-
-    .chat-user-avatar-container {
-      padding-left: 1px; //for is-online boxshadow effect
-    }
-
     .chat-user-avatar {
       + .chat-channel-title__usernames {
         margin-left: 1rem;
diff --git a/plugins/chat/assets/stylesheets/mobile/mobile.scss b/plugins/chat/assets/stylesheets/mobile/mobile.scss
index a54cdf5fcf0..d60171796dd 100644
--- a/plugins/chat/assets/stylesheets/mobile/mobile.scss
+++ b/plugins/chat/assets/stylesheets/mobile/mobile.scss
@@ -2,11 +2,6 @@
   --channel-list-avatar-size: 38px;
 }
 
-.chat-message {
-  // 1px to account for .is-online box-shadow
-  padding: 0.1em 1px;
-}
-
 .chat-message:not(.user-info-hidden) {
   padding-top: 0.75em;
 }
@@ -73,20 +68,6 @@ body.has-full-page-chat {
   }
 }
 
-.channels-list {
-  .chat-channel-row {
-    .category-chat-private .d-icon {
-      background-color: var(--secondary);
-    }
-
-    .chat-channel-metadata {
-      .chat-channel-unread-indicator {
-        font-size: var(--font-down-2);
-      }
-    }
-  }
-}
-
 .sidebar-container .channels-list .chat-channel-divider {
   padding-left: 1em;
 }
diff --git a/plugins/chat/plugin.rb b/plugins/chat/plugin.rb
index 7ae448ac5a3..e8958816dfa 100644
--- a/plugins/chat/plugin.rb
+++ b/plugins/chat/plugin.rb
@@ -19,6 +19,8 @@ register_asset "stylesheets/common/chat-browse.scss"
 register_asset "stylesheets/common/chat-drawer.scss"
 register_asset "stylesheets/common/chat-index.scss"
 register_asset "stylesheets/mobile/chat-index.scss", :mobile
+register_asset "stylesheets/desktop/chat-index-full-page.scss", :desktop
+register_asset "stylesheets/desktop/chat-index-drawer.scss", :desktop
 register_asset "stylesheets/common/chat-channel-preview-card.scss"
 register_asset "stylesheets/common/chat-channel-info.scss"
 register_asset "stylesheets/common/chat-draft-channel.scss"