diff --git a/modular/collapsing_members/dynamic.css b/modular/collapsing_members/dynamic.css
new file mode 100644
index 0000000..b37af61
--- /dev/null
+++ b/modular/collapsing_members/dynamic.css
@@ -0,0 +1,86 @@
+@media (width < 1300px) {
+  [class^="chat-"]
+    > [class^="content-"]
+    > [class^="container-"]
+    > [class^="membersWrap-"],
+  [class^="chat-"] > [class^="content-"] > [class^="membersWrap-"] {
+    width: 50px !important;
+    min-width: 50px !important;
+  }
+
+  [class^="chat-"]
+    > [class^="content-"]
+    > [class^="container-"]:hover
+    > [class^="membersWrap-"],
+  [class^="chat-"] > [class^="content-"] > [class^="membersWrap-"]:hover {
+    width: 240px !important;
+  }
+
+  [class^="chat-"]
+    > [class^="content-"]
+    > [class^="container"]
+    > [class^="membersWrap-"],
+  [class^="chat-"] > [class^="content-"] > [class^="membersWrap-"] {
+    min-width: 0;
+    min-height: 100%;
+    background-color: var(--background-secondary);
+  }
+
+  [class^="chat-"]
+    > [class^="content-"]
+    > [class^="container-"]
+    > [class^="membersWrap-"]
+    > [class^="members-"],
+  [class^="chat-"]
+    > [class^="content-"]
+    > [class^="membersWrap-"]
+    > [class^="members-"] {
+    width: 58px !important;
+  }
+
+  [class^="chat-"]
+    > [class^="content-"]
+    > [class^="container-"]:hover
+    > [class^="membersWrap-"]
+    > [class^="members-"],
+  [class^="chat-"]
+    > [class^="content-"]
+    > [class^="membersWrap-"]:hover
+    > [class^="members-"] {
+    width: 240px !important;
+  }
+
+  [class^="chat-"]
+    > [class^="content-"]
+    > [class^="container-"]
+    > [class^="membersWrap-"]
+    > [class^="members-"]
+    > [class^="content-"]
+    > [class^="membersGroup-"],
+  [class^="chat-"]
+    > [class^="content-"]
+    > [class^="membersWrap-"]
+    > [class^="members-"]
+    > [class^="content-"]
+    > [class^="membersGroup-"] {
+    height: 0;
+    padding-top: 12px;
+  }
+
+  [class^="chat-"]
+    > [class^="content-"]
+    > [class^="container-"]:hover
+    > [class^="membersWrap-"]
+    > [class^="members-"]
+    > [class^="content-"]
+    > [class^="membersGroup-"],
+  [class^="chat-"]
+    > [class^="content-"]
+    > [class^="membersWrap-"]:hover
+    > [class^="members-"]
+    > [class^="content-"]
+    > [class^="membersGroup-"] {
+    height: 40px;
+    padding-top: 24px;
+  }
+}
diff --git a/modular/collapsing_members.css b/modular/collapsing_members/on.css
similarity index 100%
rename from modular/collapsing_members.css
rename to modular/collapsing_members/on.css
diff --git a/modular/collapsing_sidebar/compact-er_support.css b/modular/collapsing_sidebar/compact-er_support.css
new file mode 100644
index 0000000..e4b84bb
--- /dev/null
+++ b/modular/collapsing_sidebar/compact-er_support.css
@@ -0,0 +1,180 @@
+div[class^="sidebar-"]:not(:has(> [class^="side-"])) > nav {
+  width: unset;
+  z-index: 9;
+}
+
+div[class^="sidebar-"]:not(:has(> [class^="side-"])) {
+  width: 56px;
+}
+div[class^="sidebar-"]:not(:has(> [class^="side-"])):hover {
+  width: 240px;
+}
+
+div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+  > [class^="panels-"]
+  > *:not(:last-child),
+div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+  > [class^="panels-"]
+  > [class^="container-"]:last-child
+  > [class^="avatarWrapper-"]
+  > [class^="nameTag-"],
+div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+  > [class^="panels-"]
+  > [class^="container-"]:last-child
+  > div:last-child {
+  display: none;
+}
+
+div[class^="sidebar-"]:not(:has(> [class^="side-"]))
+  > [class^="panels-"]
+  > [class^="container-"]:last-child {
+  width: 232px;
+  position: relative;
+  bottom: 0;
+}
+div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+  > [class^="panels-"]
+  > [class^="container-"]:last-child {
+  width: 48px;
+}
+
+div[class^="sidebar-"]:not(:has(> [class^="side-"]))
+  > nav
+  > [class^="scroller-"] {
+  margin-top: 32px;
+}
+
+div[class^="sidebar-"]:not(:has(> [class^="side-"]))
+  > nav[class^="container-"]
+  > [class^="container-"][class*="clickable-"],
+div[class^="sidebar-"]:not(:has(> [class^="side-"]))
+  > nav[class^="privateChannels-"]
+  > [class^="searchBar-"] {
+  position: fixed;
+  top: 0;
+  width: 240px;
+  z-index: 101;
+  background: var(--background-secondary);
+  padding: 0;
+}
+
+div[class^="sidebar-"]:not(:has(> [class^="side-"]))
+  > nav[class^="container-"]
+  > [class^="container-"][class*="clickable-"]
+  > [class^="animatedContainer-"] {
+  height: 32px;
+}
+
+div[class^="sidebar-"]:not(:has(> [class^="side-"]))
+  > nav[class^="container-"]
+  > [class^="container-"][class*="clickable-"]
+  > [class^="animatedContainer-"]
+  > [class^="bannerImage-"] {
+  height: 32px;
+}
+div[class^="sidebar-"]:not(:has(> [class^="side-"]))
+  > nav[class^="container-"]
+  > [class^="container-"][class*="clickable-"]
+  > [class^="animatedContainer-"]
+  > [class^="bannerImage-"]:after {
+  content: "";
+  height: 32px;
+  width: 240px;
+  top: 0;
+  left: 0;
+  position: absolute;
+  background: linear-gradient(
+    0deg,
+    var(--background-secondary) 5%,
+    transparent 100%
+  );
+}
+
+div[class^="sidebar-"]:not(:has(> [class^="side-"]))
+  > nav[class^="container-"]
+  > [class^="container-"][class*="clickable-"]
+  > [class^="animatedContainer-"]
+  [class^="bannerImg-"] {
+  top: -67px;
+  position: relative;
+}
+
+div[class^="sidebar-"]:not(:has(> [class^="side-"]))
+  > nav[class^="container-"]
+  > [class^="scroller-"]
+  > ul
+  > div[style="height: 84px;"] {
+  height: 0 !important;
+}
+
+div[class^="sidebar-"]:not(:has(> [class^="side-"])):hover
+  ~ [class^="chat-"]
+  [class^="chatContent-"]
+  > form
+  > [class^="channelTextArea"] {
+  margin-left: 0;
+}
+
+div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+  ~ [class^="chat-"]
+  [class^="title-"] {
+  margin-left: 184px;
+  width: calc(100% - 184px);
+}
+div[class^="sidebar-"]:not(:has(> [class^="side-"])):hover
+  ~ [class^="chat-"]
+  [class^="title-"] {
+  margin-left: 0;
+}
+
+div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+  [class^="channelInfo-"],
+div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+  [class^="containerDefault-"][class*="selected-"]
+  [class^="iconVisibility-"]
+  > [class^="content-"]
+  > [class^="children-"],
+div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+  [class^="containerDefault-"]
+  [class^="iconVisibility-"]:not([class*="typeThread-"])
+  > [class^="content-"]
+  > [class^="mainContent-"]
+  > [class^="name-"],
+div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+  [class^="containerDefault-"]
+  > [class^="iconVisibility-"][class*="clickable-"],
+div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+  [class^="containerDefault-"]
+  [class^="voiceUser-"]
+  > [class^="content-"]
+  > [class^="icons-"],
+div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+  [class^="containerDefault-"]
+  [class^="voiceUser-"]
+  > [class^="content-"]
+  > [class*="username-"] {
+  display: none;
+}
+
+div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+  [class^="containerDefault-"]
+  [class^="iconVisibility-"][class*="typeThread-"]
+  > [class^="content-"]
+  > [class^="mainContent-"]
+  > [class^="name-"] {
+  margin-left: 20px;
+}
+
+div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+  > [class^="privateChannels-"]
+  ul[class^="content-"]
+  > [class*="privateChannelsHeaderContainer-"] {
+  height: 0;
+}
+div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+  > [class^="privateChannels-"]
+  ul[class^="content-"]
+  > [class*="privateChannelsHeaderContainer-"]
+  > * {
+  display: none;
+}
diff --git a/modular/collapsing_sidebar/dynamic.css b/modular/collapsing_sidebar/dynamic.css
new file mode 100644
index 0000000..8a4db43
--- /dev/null
+++ b/modular/collapsing_sidebar/dynamic.css
@@ -0,0 +1,182 @@
+@media (width < 1300px) {
+  div[class^="sidebar-"]:not(:has(> [class^="side-"])) > nav {
+    width: unset;
+    z-index: 9;
+  }
+
+  div[class^="sidebar-"]:not(:has(> [class^="side-"])) {
+    width: 56px;
+  }
+  div[class^="sidebar-"]:not(:has(> [class^="side-"])):hover {
+    width: 240px;
+  }
+
+  div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+    > [class^="panels-"]
+    > *:not(:last-child),
+  div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+    > [class^="panels-"]
+    > [class^="container-"]:last-child
+    > [class^="avatarWrapper-"]
+    > [class^="nameTag-"],
+  div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+    > [class^="panels-"]
+    > [class^="container-"]:last-child
+    > div:last-child {
+    display: none;
+  }
+
+  div[class^="sidebar-"]:not(:has(> [class^="side-"]))
+    > [class^="panels-"]
+    > [class^="container-"]:last-child {
+    width: 232px;
+    position: relative;
+    bottom: 0;
+  }
+  div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+    > [class^="panels-"]
+    > [class^="container-"]:last-child {
+    width: 48px;
+  }
+
+  div[class^="sidebar-"]:not(:has(> [class^="side-"]))
+    > nav
+    > [class^="scroller-"] {
+    margin-top: 48px;
+  }
+
+  div[class^="sidebar-"]:not(:has(> [class^="side-"]))
+    > nav[class^="container-"]
+    > [class^="container-"][class*="clickable-"],
+  div[class^="sidebar-"]:not(:has(> [class^="side-"]))
+    > nav[class^="privateChannels-"]
+    > [class^="searchBar-"] {
+    position: fixed;
+    top: 0;
+    width: 240px;
+    z-index: 101;
+    background: var(--background-secondary);
+    padding: 0;
+  }
+
+  div[class^="sidebar-"]:not(:has(> [class^="side-"]))
+    > nav[class^="container-"]
+    > [class^="container-"][class*="clickable-"]
+    > [class^="animatedContainer-"] {
+    height: 48px;
+  }
+
+  div[class^="sidebar-"]:not(:has(> [class^="side-"]))
+    > nav[class^="container-"]
+    > [class^="container-"][class*="clickable-"]
+    > [class^="animatedContainer-"]
+    > [class^="bannerImage-"] {
+    height: 48px;
+  }
+  div[class^="sidebar-"]:not(:has(> [class^="side-"]))
+    > nav[class^="container-"]
+    > [class^="container-"][class*="clickable-"]
+    > [class^="animatedContainer-"]
+    > [class^="bannerImage-"]:after {
+    content: "";
+    height: 48px;
+    width: 240px;
+    top: 0;
+    left: 0;
+    position: absolute;
+    background: linear-gradient(
+      0deg,
+      var(--background-secondary) 5%,
+      transparent 100%
+    );
+  }
+
+  div[class^="sidebar-"]:not(:has(> [class^="side-"]))
+    > nav[class^="container-"]
+    > [class^="container-"][class*="clickable-"]
+    > [class^="animatedContainer-"]
+    [class^="bannerImg-"] {
+    top: -67px;
+    position: relative;
+  }
+
+  div[class^="sidebar-"]:not(:has(> [class^="side-"]))
+    > nav[class^="container-"]
+    > [class^="scroller-"]
+    > ul
+    > div[style="height: 84px;"] {
+    height: 0 !important;
+  }
+
+  div[class^="sidebar-"]:not(:has(> [class^="side-"])):hover
+    ~ [class^="chat-"]
+    [class^="chatContent-"]
+    > form
+    > [class^="channelTextArea"] {
+    margin-left: 0;
+  }
+
+  div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+    ~ [class^="chat-"]
+    [class^="title-"] {
+    margin-left: 184px;
+    width: calc(100% - 184px);
+  }
+  div[class^="sidebar-"]:not(:has(> [class^="side-"])):hover
+    ~ [class^="chat-"]
+    [class^="title-"] {
+    margin-left: 0;
+  }
+
+  div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+    [class^="channelInfo-"],
+  div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+    [class^="containerDefault-"][class*="selected-"]
+    [class^="iconVisibility-"]
+    > [class^="content-"]
+    > [class^="children-"],
+  div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+    [class^="containerDefault-"]
+    [class^="iconVisibility-"]:not([class*="typeThread-"])
+    > [class^="content-"]
+    > [class^="mainContent-"]
+    > [class^="name-"],
+  div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+    [class^="containerDefault-"]
+    > [class^="iconVisibility-"][class*="clickable-"],
+  div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+    [class^="containerDefault-"]
+    [class^="voiceUser-"]
+    > [class^="content-"]
+    > [class^="icons-"],
+  div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+    [class^="containerDefault-"]
+    [class^="voiceUser-"]
+    > [class^="content-"]
+    > [class*="username-"] {
+    display: none;
+  }
+
+  div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+    [class^="containerDefault-"]
+    [class^="iconVisibility-"][class*="typeThread-"]
+    > [class^="content-"]
+    > [class^="mainContent-"]
+    > [class^="name-"] {
+    margin-left: 20px;
+  }
+
+  div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+    > [class^="privateChannels-"]
+    ul[class^="content-"]
+    > [class*="privateChannelsHeaderContainer-"] {
+    height: 0;
+  }
+  div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+    > [class^="privateChannels-"]
+    ul[class^="content-"]
+    > [class*="privateChannelsHeaderContainer-"]
+    > * {
+    display: none;
+  }
+}
diff --git a/modular/collapsing_sidebar/dynamic_+_compact-er_support.css b/modular/collapsing_sidebar/dynamic_+_compact-er_support.css
new file mode 100644
index 0000000..a34fc7d
--- /dev/null
+++ b/modular/collapsing_sidebar/dynamic_+_compact-er_support.css
@@ -0,0 +1,182 @@
+@media (width < 1300px) {
+  div[class^="sidebar-"]:not(:has(> [class^="side-"])) > nav {
+    width: unset;
+    z-index: 9;
+  }
+
+  div[class^="sidebar-"]:not(:has(> [class^="side-"])) {
+    width: 56px;
+  }
+  div[class^="sidebar-"]:not(:has(> [class^="side-"])):hover {
+    width: 240px;
+  }
+
+  div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+    > [class^="panels-"]
+    > *:not(:last-child),
+  div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+    > [class^="panels-"]
+    > [class^="container-"]:last-child
+    > [class^="avatarWrapper-"]
+    > [class^="nameTag-"],
+  div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+    > [class^="panels-"]
+    > [class^="container-"]:last-child
+    > div:last-child {
+    display: none;
+  }
+
+  div[class^="sidebar-"]:not(:has(> [class^="side-"]))
+    > [class^="panels-"]
+    > [class^="container-"]:last-child {
+    width: 232px;
+    position: relative;
+    bottom: 0;
+  }
+  div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+    > [class^="panels-"]
+    > [class^="container-"]:last-child {
+    width: 48px;
+  }
+
+  div[class^="sidebar-"]:not(:has(> [class^="side-"]))
+    > nav
+    > [class^="scroller-"] {
+    margin-top: 32px;
+  }
+
+  div[class^="sidebar-"]:not(:has(> [class^="side-"]))
+    > nav[class^="container-"]
+    > [class^="container-"][class*="clickable-"],
+  div[class^="sidebar-"]:not(:has(> [class^="side-"]))
+    > nav[class^="privateChannels-"]
+    > [class^="searchBar-"] {
+    position: fixed;
+    top: 0;
+    width: 240px;
+    z-index: 101;
+    background: var(--background-secondary);
+    padding: 0;
+  }
+
+  div[class^="sidebar-"]:not(:has(> [class^="side-"]))
+    > nav[class^="container-"]
+    > [class^="container-"][class*="clickable-"]
+    > [class^="animatedContainer-"] {
+    height: 32px;
+  }
+
+  div[class^="sidebar-"]:not(:has(> [class^="side-"]))
+    > nav[class^="container-"]
+    > [class^="container-"][class*="clickable-"]
+    > [class^="animatedContainer-"]
+    > [class^="bannerImage-"] {
+    height: 32px;
+  }
+  div[class^="sidebar-"]:not(:has(> [class^="side-"]))
+    > nav[class^="container-"]
+    > [class^="container-"][class*="clickable-"]
+    > [class^="animatedContainer-"]
+    > [class^="bannerImage-"]:after {
+    content: "";
+    height: 32px;
+    width: 240px;
+    top: 0;
+    left: 0;
+    position: absolute;
+    background: linear-gradient(
+      0deg,
+      var(--background-secondary) 5%,
+      transparent 100%
+    );
+  }
+
+  div[class^="sidebar-"]:not(:has(> [class^="side-"]))
+    > nav[class^="container-"]
+    > [class^="container-"][class*="clickable-"]
+    > [class^="animatedContainer-"]
+    [class^="bannerImg-"] {
+    top: -67px;
+    position: relative;
+  }
+
+  div[class^="sidebar-"]:not(:has(> [class^="side-"]))
+    > nav[class^="container-"]
+    > [class^="scroller-"]
+    > ul
+    > div[style="height: 84px;"] {
+    height: 0 !important;
+  }
+
+  div[class^="sidebar-"]:not(:has(> [class^="side-"])):hover
+    ~ [class^="chat-"]
+    [class^="chatContent-"]
+    > form
+    > [class^="channelTextArea"] {
+    margin-left: 0;
+  }
+
+  div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+    ~ [class^="chat-"]
+    [class^="title-"] {
+    margin-left: 184px;
+    width: calc(100% - 184px);
+  }
+  div[class^="sidebar-"]:not(:has(> [class^="side-"])):hover
+    ~ [class^="chat-"]
+    [class^="title-"] {
+    margin-left: 0;
+  }
+
+  div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+    [class^="channelInfo-"],
+  div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+    [class^="containerDefault-"][class*="selected-"]
+    [class^="iconVisibility-"]
+    > [class^="content-"]
+    > [class^="children-"],
+  div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+    [class^="containerDefault-"]
+    [class^="iconVisibility-"]:not([class*="typeThread-"])
+    > [class^="content-"]
+    > [class^="mainContent-"]
+    > [class^="name-"],
+  div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+    [class^="containerDefault-"]
+    > [class^="iconVisibility-"][class*="clickable-"],
+  div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+    [class^="containerDefault-"]
+    [class^="voiceUser-"]
+    > [class^="content-"]
+    > [class^="icons-"],
+  div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+    [class^="containerDefault-"]
+    [class^="voiceUser-"]
+    > [class^="content-"]
+    > [class*="username-"] {
+    display: none;
+  }
+
+  div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+    [class^="containerDefault-"]
+    [class^="iconVisibility-"][class*="typeThread-"]
+    > [class^="content-"]
+    > [class^="mainContent-"]
+    > [class^="name-"] {
+    margin-left: 20px;
+  }
+
+  div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+    > [class^="privateChannels-"]
+    ul[class^="content-"]
+    > [class*="privateChannelsHeaderContainer-"] {
+    height: 0;
+  }
+  div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+    > [class^="privateChannels-"]
+    ul[class^="content-"]
+    > [class*="privateChannelsHeaderContainer-"]
+    > * {
+    display: none;
+  }
+}
diff --git a/modular/collapsing_sidebar/integrated.css b/modular/collapsing_sidebar/integrated.css
deleted file mode 100644
index 09c4249..0000000
--- a/modular/collapsing_sidebar/integrated.css
+++ /dev/null
@@ -1,169 +0,0 @@
-div[class^="sidebar-"]:has(> nav[class^="container-"]) > [class^="panels-"] {
-  position: absolute;
-  bottom: 0;
-  width: 240px;
-  height: 53px;
-  display: flex;
-  flex-direction: column-reverse;
-  justify-content: flex-end;
-  z-index: 10;
-}
-div[class^="sidebar-"]:has(> nav[class^="container-"])
-  > [class^="panels-"]:hover {
-  height: unset;
-  flex-direction: column;
-}
-
-div[class^="sidebar-"]:has(> nav[class^="container-"]) {
-  width: unset;
-}
-div[class^="sidebar-"]:has(> nav[class^="container-"])
-  > nav[class^="container-"] {
-  width: unset;
-  z-index: 9;
-}
-
-div[class^="sidebar-"]:has(> nav[class^="container-"])
-  > nav[class^="container-"]
-  > [class^="scroller-"] {
-  width: 56px;
-  margin-top: 48px;
-  margin-bottom: 53px;
-}
-div[class^="sidebar-"]:has(> nav[class^="container-"]):hover
-  > nav[class^="container-"]
-  > [class^="scroller-"] {
-  width: 240px;
-}
-
-div[class^="sidebar-"]:has(> nav[class^="container-"])
-  > nav[class^="container-"]
-  > [class^="container-"][class*="clickable-"] {
-  position: fixed;
-  top: 0;
-  width: 240px;
-  z-index: 101;
-  background: var(--background-secondary);
-}
-
-div[class^="sidebar-"]:has(> nav[class^="container-"])
-  > nav[class^="container-"]
-  > [class^="container-"][class*="clickable-"]
-  > [class^="animatedContainer-"] {
-  height: 48px;
-}
-
-div[class^="sidebar-"]:has(> nav[class^="container-"])
-  > nav[class^="container-"]
-  > [class^="container-"][class*="clickable-"]
-  > [class^="animatedContainer-"]
-  > [class^="bannerImage-"] {
-  height: 48px;
-}
-div[class^="sidebar-"]:has(> nav[class^="container-"])
-  > nav[class^="container-"]
-  > [class^="container-"][class*="clickable-"]
-  > [class^="animatedContainer-"]
-  > [class^="bannerImage-"]:after {
-  content: "";
-  height: 48px;
-  width: 240px;
-  top: 0;
-  left: 0;
-  position: absolute;
-  background: linear-gradient(
-    0deg,
-    var(--background-secondary) 5%,
-    transparent 100%
-  );
-}
-
-div[class^="sidebar-"]:has(> nav[class^="container-"])
-  > nav[class^="container-"]
-  > [class^="container-"][class*="clickable-"]
-  > [class^="animatedContainer-"]
-  [class^="bannerImg-"] {
-  top: -67px;
-  position: relative;
-}
-
-div[class^="sidebar-"]:has(> nav[class^="container-"])
-  > nav[class^="container-"]
-  > [class^="scroller-"]
-  > ul
-  > div[style="height: 84px;"] {
-  height: 0 !important;
-}
-
-div[class^="sidebar-"]:has(> nav[class^="container-"]):not(:hover)
-  ~ [class^="chat-"]
-  [class^="chatContent-"]
-  > form
-  > [class^="channelTextArea"] {
-  width: calc(100% - 184px);
-  margin-left: 184px;
-}
-
-div[class^="sidebar-"]:has(> nav[class^="container-"]):hover
-  ~ [class^="chat-"]
-  [class^="chatContent-"]
-  > form
-  > [class^="channelTextArea"] {
-  margin-left: 0;
-}
-
-div[class^="sidebar-"]:has(> nav[class^="container-"]):not(:hover)
-  ~ [class^="chat-"]
-  [class^="title-"] {
-  margin-left: 184px;
-  width: calc(100% - 184px);
-}
-div[class^="sidebar-"]:has(> nav[class^="container-"]):hover
-  ~ [class^="chat-"]
-  [class^="title-"] {
-  margin-left: 0;
-}
-
-div[class^="sidebar-"]:has(> nav[class^="container-"]):not(:hover)
-  [class^="channelInfo-"],
-div[class^="sidebar-"]:has(> nav[class^="container-"]):not(:hover)
-  [class^="containerDefault-"][class*="selected-"]
-  [class^="iconVisibility-"]
-  > [class^="content-"]
-  > [class^="children-"],
-div[class^="sidebar-"]:has(> nav[class^="container-"]):not(:hover)
-  [class^="containerDefault-"]
-  [class^="iconVisibility-"]:not([class*="typeThread-"])
-  > [class^="content-"]
-  > [class^="mainContent-"]
-  > [class^="name-"],
-div[class^="sidebar-"]:has(> nav[class^="container-"]):not(:hover)
-  [class^="containerDefault-"]
-  > [class^="iconVisibility-"][class*="clickable-"],
-div[class^="sidebar-"]:has(> nav[class^="container-"]):not(:hover)
-  [class^="containerDefault-"]
-  [class^="voiceUser-"]
-  > [class^="content-"]
-  > [class^="icons-"],
-div[class^="sidebar-"]:has(> nav[class^="container-"]):not(:hover)
-  [class^="containerDefault-"]
-  [class^="voiceUser-"]
-  > [class^="content-"]
-  > [class*="username-"] {
-  display: none;
-}
-
-div[class^="sidebar-"]:has(> nav[class^="container-"]):not(:hover)
-  [class^="containerDefault-"]
-  [class^="iconVisibility-"][class*="typeThread-"]
-  > [class^="content-"]
-  > [class^="mainContent-"]
-  > [class^="name-"] {
-  margin-left: 20px;
-}
-
-div[class^="sidebar-"]:has(> nav[class^="container-"]):not(:hover)
-  ~ [class^="chat-"]
-  [class^="autocomplete-"] {
-  left: -184px;
-}
diff --git a/modular/collapsing_sidebar/integrated_-_compact-er_support.css b/modular/collapsing_sidebar/integrated_-_compact-er_support.css
deleted file mode 100644
index 10ccbdf..0000000
--- a/modular/collapsing_sidebar/integrated_-_compact-er_support.css
+++ /dev/null
@@ -1,169 +0,0 @@
-div[class^="sidebar-"]:has(> nav[class^="container-"]) > [class^="panels-"] {
-  position: absolute;
-  bottom: 0;
-  width: 240px;
-  height: 40px;
-  display: flex;
-  flex-direction: column-reverse;
-  justify-content: flex-end;
-  z-index: 10;
-}
-div[class^="sidebar-"]:has(> nav[class^="container-"])
-  > [class^="panels-"]:hover {
-  height: unset;
-  flex-direction: column;
-}
-
-div[class^="sidebar-"]:has(> nav[class^="container-"]) {
-  width: unset;
-}
-div[class^="sidebar-"]:has(> nav[class^="container-"])
-  > nav[class^="container-"] {
-  width: unset;
-  z-index: 9;
-}
-
-div[class^="sidebar-"]:has(> nav[class^="container-"])
-  > nav[class^="container-"]
-  > [class^="scroller-"] {
-  width: 56px;
-  margin-top: 48px;
-  margin-bottom: 53px;
-}
-div[class^="sidebar-"]:has(> nav[class^="container-"]):hover
-  > nav[class^="container-"]
-  > [class^="scroller-"] {
-  width: 240px;
-}
-
-div[class^="sidebar-"]:has(> nav[class^="container-"])
-  > nav[class^="container-"]
-  > [class^="container-"][class*="clickable-"] {
-  position: fixed;
-  top: 0;
-  width: 240px;
-  z-index: 101;
-  background: var(--background-secondary);
-}
-
-div[class^="sidebar-"]:has(> nav[class^="container-"])
-  > nav[class^="container-"]
-  > [class^="container-"][class*="clickable-"]
-  > [class^="animatedContainer-"] {
-  height: 32px;
-}
-
-div[class^="sidebar-"]:has(> nav[class^="container-"])
-  > nav[class^="container-"]
-  > [class^="container-"][class*="clickable-"]
-  > [class^="animatedContainer-"]
-  > [class^="bannerImage-"] {
-  height: 32px;
-}
-div[class^="sidebar-"]:has(> nav[class^="container-"])
-  > nav[class^="container-"]
-  > [class^="container-"][class*="clickable-"]
-  > [class^="animatedContainer-"]
-  > [class^="bannerImage-"]:after {
-  content: "";
-  height: 32px;
-  width: 240px;
-  top: 0;
-  left: 0;
-  position: absolute;
-  background: linear-gradient(
-    0deg,
-    var(--background-secondary) 5%,
-    transparent 100%
-  );
-}
-
-div[class^="sidebar-"]:has(> nav[class^="container-"])
-  > nav[class^="container-"]
-  > [class^="container-"][class*="clickable-"]
-  > [class^="animatedContainer-"]
-  [class^="bannerImg-"] {
-  top: -67px;
-  position: relative;
-}
-
-div[class^="sidebar-"]:has(> nav[class^="container-"])
-  > nav[class^="container-"]
-  > [class^="scroller-"]
-  > ul
-  > div[style="height: 84px;"] {
-  height: 0 !important;
-}
-
-div[class^="sidebar-"]:has(> nav[class^="container-"]):not(:hover)
-  ~ [class^="chat-"]
-  [class^="chatContent-"]
-  > form
-  > [class^="channelTextArea"] {
-  width: calc(100% - 184px);
-  margin-left: 184px;
-}
-
-div[class^="sidebar-"]:has(> nav[class^="container-"]):hover
-  ~ [class^="chat-"]
-  [class^="chatContent-"]
-  > form
-  > [class^="channelTextArea"] {
-  margin-left: 0;
-}
-
-div[class^="sidebar-"]:has(> nav[class^="container-"]):not(:hover)
-  ~ [class^="chat-"]
-  [class^="title-"] {
-  margin-left: 184px;
-  width: calc(100% - 184px);
-}
-div[class^="sidebar-"]:has(> nav[class^="container-"]):hover
-  ~ [class^="chat-"]
-  [class^="title-"] {
-  margin-left: 0;
-}
-
-div[class^="sidebar-"]:has(> nav[class^="container-"]):not(:hover)
-  [class^="channelInfo-"],
-div[class^="sidebar-"]:has(> nav[class^="container-"]):not(:hover)
-  [class^="containerDefault-"][class*="selected-"]
-  [class^="iconVisibility-"]
-  > [class^="content-"]
-  > [class^="children-"],
-div[class^="sidebar-"]:has(> nav[class^="container-"]):not(:hover)
-  [class^="containerDefault-"]
-  [class^="iconVisibility-"]:not([class*="typeThread-"])
-  > [class^="content-"]
-  > [class^="mainContent-"]
-  > [class^="name-"],
-div[class^="sidebar-"]:has(> nav[class^="container-"]):not(:hover)
-  [class^="containerDefault-"]
-  > [class^="iconVisibility-"][class*="clickable-"],
-div[class^="sidebar-"]:has(> nav[class^="container-"]):not(:hover)
-  [class^="containerDefault-"]
-  [class^="voiceUser-"]
-  > [class^="content-"]
-  > [class^="icons-"],
-div[class^="sidebar-"]:has(> nav[class^="container-"]):not(:hover)
-  [class^="containerDefault-"]
-  [class^="voiceUser-"]
-  > [class^="content-"]
-  > [class*="username-"] {
-  display: none;
-}
-
-div[class^="sidebar-"]:has(> nav[class^="container-"]):not(:hover)
-  [class^="containerDefault-"]
-  [class^="iconVisibility-"][class*="typeThread-"]
-  > [class^="content-"]
-  > [class^="mainContent-"]
-  > [class^="name-"] {
-  margin-left: 20px;
-}
-
-div[class^="sidebar-"]:has(> nav[class^="container-"]):not(:hover)
-  ~ [class^="chat-"]
-  [class^="autocomplete-"] {
-  left: -184px;
-}
diff --git a/modular/collapsing_sidebar/on.css b/modular/collapsing_sidebar/on.css
new file mode 100644
index 0000000..501b50b
--- /dev/null
+++ b/modular/collapsing_sidebar/on.css
@@ -0,0 +1,180 @@
+div[class^="sidebar-"]:not(:has(> [class^="side-"])) > nav {
+  width: unset;
+  z-index: 9;
+}
+
+div[class^="sidebar-"]:not(:has(> [class^="side-"])) {
+  width: 56px;
+}
+div[class^="sidebar-"]:not(:has(> [class^="side-"])):hover {
+  width: 240px;
+}
+
+div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+  > [class^="panels-"]
+  > *:not(:last-child),
+div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+  > [class^="panels-"]
+  > [class^="container-"]:last-child
+  > [class^="avatarWrapper-"]
+  > [class^="nameTag-"],
+div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+  > [class^="panels-"]
+  > [class^="container-"]:last-child
+  > div:last-child {
+  display: none;
+}
+
+div[class^="sidebar-"]:not(:has(> [class^="side-"]))
+  > [class^="panels-"]
+  > [class^="container-"]:last-child {
+  width: 232px;
+  position: relative;
+  bottom: 0;
+}
+div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+  > [class^="panels-"]
+  > [class^="container-"]:last-child {
+  width: 48px;
+}
+
+div[class^="sidebar-"]:not(:has(> [class^="side-"]))
+  > nav
+  > [class^="scroller-"] {
+  margin-top: 48px;
+}
+
+div[class^="sidebar-"]:not(:has(> [class^="side-"]))
+  > nav[class^="container-"]
+  > [class^="container-"][class*="clickable-"],
+div[class^="sidebar-"]:not(:has(> [class^="side-"]))
+  > nav[class^="privateChannels-"]
+  > [class^="searchBar-"] {
+  position: fixed;
+  top: 0;
+  width: 240px;
+  z-index: 101;
+  background: var(--background-secondary);
+  padding: 0;
+}
+
+div[class^="sidebar-"]:not(:has(> [class^="side-"]))
+  > nav[class^="container-"]
+  > [class^="container-"][class*="clickable-"]
+  > [class^="animatedContainer-"] {
+  height: 48px;
+}
+
+div[class^="sidebar-"]:not(:has(> [class^="side-"]))
+  > nav[class^="container-"]
+  > [class^="container-"][class*="clickable-"]
+  > [class^="animatedContainer-"]
+  > [class^="bannerImage-"] {
+  height: 48px;
+}
+div[class^="sidebar-"]:not(:has(> [class^="side-"]))
+  > nav[class^="container-"]
+  > [class^="container-"][class*="clickable-"]
+  > [class^="animatedContainer-"]
+  > [class^="bannerImage-"]:after {
+  content: "";
+  height: 48px;
+  width: 240px;
+  top: 0;
+  left: 0;
+  position: absolute;
+  background: linear-gradient(
+    0deg,
+    var(--background-secondary) 5%,
+    transparent 100%
+  );
+}
+
+div[class^="sidebar-"]:not(:has(> [class^="side-"]))
+  > nav[class^="container-"]
+  > [class^="container-"][class*="clickable-"]
+  > [class^="animatedContainer-"]
+  [class^="bannerImg-"] {
+  top: -67px;
+  position: relative;
+}
+
+div[class^="sidebar-"]:not(:has(> [class^="side-"]))
+  > nav[class^="container-"]
+  > [class^="scroller-"]
+  > ul
+  > div[style="height: 84px;"] {
+  height: 0 !important;
+}
+
+div[class^="sidebar-"]:not(:has(> [class^="side-"])):hover
+  ~ [class^="chat-"]
+  [class^="chatContent-"]
+  > form
+  > [class^="channelTextArea"] {
+  margin-left: 0;
+}
+
+div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+  ~ [class^="chat-"]
+  [class^="title-"] {
+  margin-left: 184px;
+  width: calc(100% - 184px);
+}
+div[class^="sidebar-"]:not(:has(> [class^="side-"])):hover
+  ~ [class^="chat-"]
+  [class^="title-"] {
+  margin-left: 0;
+}
+
+div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+  [class^="channelInfo-"],
+div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+  [class^="containerDefault-"][class*="selected-"]
+  [class^="iconVisibility-"]
+  > [class^="content-"]
+  > [class^="children-"],
+div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+  [class^="containerDefault-"]
+  [class^="iconVisibility-"]:not([class*="typeThread-"])
+  > [class^="content-"]
+  > [class^="mainContent-"]
+  > [class^="name-"],
+div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+  [class^="containerDefault-"]
+  > [class^="iconVisibility-"][class*="clickable-"],
+div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+  [class^="containerDefault-"]
+  [class^="voiceUser-"]
+  > [class^="content-"]
+  > [class^="icons-"],
+div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+  [class^="containerDefault-"]
+  [class^="voiceUser-"]
+  > [class^="content-"]
+  > [class*="username-"] {
+  display: none;
+}
+
+div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+  [class^="containerDefault-"]
+  [class^="iconVisibility-"][class*="typeThread-"]
+  > [class^="content-"]
+  > [class^="mainContent-"]
+  > [class^="name-"] {
+  margin-left: 20px;
+}
+
+div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+  > [class^="privateChannels-"]
+  ul[class^="content-"]
+  > [class*="privateChannelsHeaderContainer-"] {
+  height: 0;
+}
+div[class^="sidebar-"]:not(:has(> [class^="side-"])):not(:hover)
+  > [class^="privateChannels-"]
+  ul[class^="content-"]
+  > [class*="privateChannelsHeaderContainer-"]
+  > * {
+  display: none;
+}
diff --git a/modular/collapsing_sidebar/simple.css b/modular/collapsing_sidebar/simple.css
deleted file mode 100644
index b297da1..0000000
--- a/modular/collapsing_sidebar/simple.css
+++ /dev/null
@@ -1,7 +0,0 @@
-[class^="sidebar-"] {
-  overflow: hidden;
-  width: 48px;
-}
-[class^="sidebar-"]:hover {
-  width: 240px;
-}
diff --git a/modular/compacter_mode.css b/modular/compacter_mode.css
index 2e191db..f3d6d6b 100644
--- a/modular/compacter_mode.css
+++ b/modular/compacter_mode.css
@@ -71,6 +71,16 @@ section[class^="panels-"]
   min-height: 24px;
 }
 
+section[class^="panels-"] > [class^="container-"]:last-child {
+  position: relative;
+}
+
+section[class^="panels-"] > [class^="container-"]:last-child > div:last-child {
+  position: absolute;
+  right: 0;
+  padding-right: 8px;
+}
+
 section[class^="panels-"]
   > [class^="wrapper-"]
   > [class^="container-"]
@@ -434,11 +444,18 @@ button.hh2-spotify-controls-button {
   padding-top: 9px !important;
   padding-bottom: 9px !important;
 }
+[class^="channelTextArea-"],
 [class^="channelTextArea-"] [class^="inner-"],
 [class^="channelTextArea-"] [class^="buttons-"],
 [class^="channelTextArea-"] [class^="attachWrapper-"],
-[class^="channelTextArea-"] [class^="attachButton-"] {
-  height: 40px !important;
+[class^="channelTextArea-"] [class^="attachButton-"],
+[class^="channelTextArea-"] > [class^="scrollableContainer-"],
+[class^="channelTextArea-"] [class^="inner-"] > [class^="textArea-"] {
+  min-height: 40px !important;
+}
+[class^="channelTextArea-"] [class^="buttons-"],
+[class^="channelTextArea-"] [class^="attachWrapper-"] {
+  height: 40px;
 }
 [class^="channelTextArea-"] [class^="attachButton-"],
 [class^="channelTextArea-"] [class^="attachButton-"] > [class^="icon-"] {
@@ -504,3 +521,69 @@ button.hh2-spotify-controls-button {
   > [class^="labelContainer-"] {
   min-height: 24px;
 }
+
+[class^="sidebar-"]
+  > [class^="privateChannels-"]
+  ul[class^="content-"]
+  > [class^="channel-"]
+  [class*="layout-"] {
+  height: 36px;
+  padding: 0 4px;
+}
+[class^="sidebar-"]
+  > [class^="privateChannels-"]
+  ul[class^="content-"]
+  > [class^="channel-"]
+  [class*="layout-"]
+  > [class^="avatar-"],
+[class^="sidebar-"]
+  > [class^="privateChannels-"]
+  ul[class^="content-"]
+  > [class^="channel-"]
+  [class*="layout-"]
+  > [class^="avatar-"]
+  > [class^="wrapper-"] {
+  height: 24px !important;
+  width: 24px !important;
+}
+[class^="sidebar-"]
+  > [class^="privateChannels-"]
+  ul[class^="content-"]
+  > [class^="channel-"]
+  [class*="layout-"]
+  > [class^="avatar-"]
+  > [class^="wrapper-"]
+  > svg[viewbox="0 0 40 40"] {
+  height: 32px !important;
+  width: 32px !important;
+}
+[class^="sidebar-"]
+  > [class^="privateChannels-"]
+  ul[class^="content-"]
+  > [class^="channel-"]
+  [class*="layout-"]
+  > [class^="avatar-"]
+  > [class^="wrapper-"]
+  > svg[viewbox="0 0 32 32"] {
+  height: 24px !important;
+  width: 24px !important;
+}
+[class^="sidebar-"]
+  > [class^="privateChannels-"]
+  ul[class^="content-"]
+  > [class^="channel-"]
+  [class*="layout-"]
+  > [class^="avatar-"] {
+  margin-right: 8px;
+}
+[class^="sidebar-"]
+  > [class^="privateChannels-"]
+  ul[class^="content-"]
+  > [class*="privateChannelsHeaderContainer-"] {
+  padding: 9px 4px 2px 9px;
+  height: 24px;
+}
+
+[class^="sidebar-"] > [class^="privateChannels-"] > [class^="searchBar-"] {
+  height: 32px;
+}
diff --git a/modular/textarea/fullwidth.css b/modular/textarea/fullwidth.css
index 3545de1..387e687 100644
--- a/modular/textarea/fullwidth.css
+++ b/modular/textarea/fullwidth.css
@@ -1,5 +1,6 @@
 [class^="chatContent-"] > form {
   padding: 0 !important;
+  bottom: 0;
 }
 [class^="chatContent-"] > form [class^="channelTextArea"] {
   margin-bottom: 0 !important;
@@ -24,6 +25,12 @@
   > [class^="scrollableContainer-"]
   > [class^="inner-"]
   > [class^="buttons-"],
+[class^="chatContent-"]
+  > form
+  [class^="channelTextArea"]
+  > [class^="scrollableContainer-"]
+  > [class^="inner-"]
+  > [class^="attachWrapper-"],
 [class^="chatContent-"]
   > form
   [class^="channelTextArea"]
@@ -31,7 +38,7 @@
   > [class^="inner-"]
   > [class^="attachWrapper-"]
   > [class^="attachButton-"] {
-  height: 53px;
+  min-height: 53px;
 }
 [class^="chatContent-"]
   > form