diff --git a/common/common.scss b/common/common.scss
index d3c631e..7383f68 100644
--- a/common/common.scss
+++ b/common/common.scss
@@ -8,3 +8,5 @@
 @import "buttons";
 @import "chat";
 @import "hiddenstuff";
+@import "topics";
+@import "misc";
diff --git a/javascripts/discourse/api-initializers/next-gen.gjs b/javascripts/discourse/api-initializers/next-gen.gjs
new file mode 100644
index 0000000..8068fac
--- /dev/null
+++ b/javascripts/discourse/api-initializers/next-gen.gjs
@@ -0,0 +1,18 @@
+import Component from "@glimmer/component";
+import { apiInitializer } from "discourse/lib/api";
+
+export default apiInitializer("1.8.0", (api) => {
+  api.renderInOutlet("above-main-container",
+  class ExperimentalScreen extends Component {
+    <template>
+      <ul class="experimental-screen">
+        <li class="experimental-screen__top-left"></li>
+        <li class="experimental-screen__top-right"></li>
+        <li class="experimental-screen__bottom-left"></li>
+        <li class="experimental-screen__bottom-right"></li>
+        <li class="experimental-screen__bottom-bar"></li>
+      </ul>
+    </template>
+  }
+  );
+});
diff --git a/javascripts/discourse/api-initializers/next-gen.js b/javascripts/discourse/api-initializers/next-gen.js
deleted file mode 100644
index b78f8da..0000000
--- a/javascripts/discourse/api-initializers/next-gen.js
+++ /dev/null
@@ -1,5 +0,0 @@
-import { apiInitializer } from "discourse/lib/api";
-
-export default apiInitializer("1.8.0", (/* api */) => {
-  // console.log("hello world from api initializer!");
-});
diff --git a/scss/buttons.scss b/scss/buttons.scss
index 4c81aa9..f3c139c 100644
--- a/scss/buttons.scss
+++ b/scss/buttons.scss
@@ -1,16 +1,12 @@
-:root {
-  --d-button-border-radius: 6.25rem;
-}
-
 .btn {
   padding: 0.5em 1rem;
 }
 
-.btn-default {
-  border: 1px solid var(--accent-color);
-  background: var(--secondary);
+.sidebar-new-topic-button__wrapper {
+  margin: 1.5rem 1rem;
 }
-#create-topic.btn {
+
+.sidebar-new-topic-button__wrapper .btn {
   background-color: var(--accent-color);
   color: var(--accent-text-color);
   svg {
diff --git a/scss/main.scss b/scss/main.scss
index e3381be..44196c2 100644
--- a/scss/main.scss
+++ b/scss/main.scss
@@ -2,21 +2,34 @@ html:not(:has(.has-full-page-chat)) {
   background-color: #f5f8ff;
 }
 
+body.has-sidebar-page #main-outlet-wrapper {
+  grid-template-columns: 0px 1fr minmax(0, var(--d-max-width)) 1fr;
+  grid-template-areas:
+    "space sidebar content"
+    "space sidebar content";
+  gap: 0 var(--main-grid-gap);
+}
+
+.powered-by-discourse {
+  display: none;
+}
+
 body:not(.has-full-page-chat) {
-  &.navigation-topics #main-outlet {
-    background: radial-gradient(
-        100.59% 70.87% at 41.19% 73.28%,
-        rgba(188, 241, 238, 0.2) 0%,
-        rgba(255, 255, 255, 0) 100%
-      ),
-      radial-gradient(
-        67.07% 61.36% at 66.47% 64.15%,
-        rgba(162, 164, 225, 0.2) 0%,
-        rgba(255, 255, 255, 0) 100%
-      ),
-      #fff;
+  #main-outlet {
+    // background: radial-gradient(
+    //     100.59% 70.87% at 41.19% 73.28%,
+    //     rgba(188, 241, 238, 0.2) 0%,
+    //     rgba(255, 255, 255, 0) 100%
+    //   ),
+    //   radial-gradient(
+    //     67.07% 61.36% at 66.47% 64.15%,
+    //     rgba(162, 164, 225, 0.2) 0%,
+    //     rgba(255, 255, 255, 0) 100%
+    //   ),
+    //   #fff;
+    background-color: #ffffff;
+    padding-bottom: calc(var(--d-border-radius-large) * 2);
   }
-  background-color: #f5f8ff;
   #main-outlet-wrapper {
     // margin-top: 1.5rem;
     // gap: 2em !important;
@@ -28,7 +41,7 @@ body:not(.has-full-page-chat) {
     //   box-sizing: border-box;
     // }
     #main-outlet {
-      max-width: 1000px;
+      position: relative;
       // height: inherit;
       // overflow: scroll;
       // &:has(.list-controls) {
@@ -46,23 +59,128 @@ body:not(.has-full-page-chat) {
       // background-color: light-dark(#ffffff, #000000);
     }
   }
+}
 
-  #topic-title {
+.experimental-screen {
+  @media screen and (max-width: 425px) {
+    display: none;
+  }
+  width: 100%;
+  display: block;
+  margin: 0;
+  padding: 0;
+  position: relative;
+  container: content-width / inline-size;
+  li {
+    list-style: none;
+    margin: 0;
+    padding: 0;
+  }
+  &__top-left,
+  &__top-right,
+  &__bottom-left,
+  &__bottom-right {
+    position: fixed;
+    width: var(--d-border-radius-large);
+    height: var(--d-border-radius-large);
+    background-color: var(--secondary);
     z-index: 999;
-    margin-bottom: 1em;
-    padding: 1.5rem 2rem 0.5em;
-    position: sticky;
+    -webkit-mask: radial-gradient(
+      circle at var(--d-border-radius-large) var(--d-border-radius-large),
+      transparent var(--d-border-radius-large),
+      transparent var(--d-border-radius-large),
+      black var(--d-border-radius-large)
+    );
+  }
+  &__top-left {
     top: var(--header-offset);
-    background: var(--secondary);
+    left: calc(var(--main-grid-gap) * 2 + var(--d-sidebar-width));
+    @media screen and (max-width: 768px) {
+      left: var(--main-grid-gap);
+    }
   }
-
-  .container.posts,
-  .more-topics__container,
-  #topic-footer-buttons {
-    padding: 0 24px;
+  &__top-right {
+    top: var(--header-offset);
+    transform: rotate(90deg);
+    @container content-width (width > 1px) {
+      left: calc(
+        var(--main-grid-gap) * 2 + var(--d-sidebar-width) + 100cqw -
+          var(--d-border-radius-large)
+      );
+      @media screen and (max-width: 768px) {
+        left: calc(
+          var(--main-grid-gap) + 100cqw - var(--d-border-radius-large)
+        );
+      }
+    }
   }
-
-  .container.posts .topic-navigation {
-    top: calc(var(--header-offset, 60px) + 4em);
+  &__bottom-left {
+    transform: rotate(-90deg);
+    bottom: var(--d-border-radius-large);
+    left: calc(var(--main-grid-gap) * 2 + var(--d-sidebar-width));
+    @media screen and (max-width: 768px) {
+      left: var(--main-grid-gap);
+      bottom: calc(var(--d-border-radius-large) * 2);
+    }
+  }
+  &__bottom-right {
+    transform: rotate(180deg);
+    bottom: var(--d-border-radius-large);
+    @container content-width (width > 1px) {
+      left: calc(
+        var(--main-grid-gap) * 2 + var(--d-sidebar-width) + 100cqw -
+          var(--d-border-radius-large)
+      );
+      @media screen and (max-width: 768px) {
+        left: calc(
+          var(--main-grid-gap) + 100cqw - var(--d-border-radius-large)
+        );
+        bottom: calc(var(--d-border-radius-large) * 2);
+      }
+    }
+  }
+  &__bottom-bar {
+    position: fixed;
+    width: 100%;
+    z-index: 999;
+    background-color: var(--secondary);
+    bottom: 0;
+    left: calc(var(--main-grid-gap) * 2 + var(--d-sidebar-width));
+    @media screen and (max-width: 768px) {
+      left: var(--main-grid-gap);
+      height: calc(var(--d-border-radius-large) * 2);
+    }
+    height: var(--d-border-radius-large);
+    @container content-width (width > 1px) {
+      width: 100cqw;
+    }
   }
 }
+
+@media screen and (min-width: 768px) {
+  .with-topic-progress {
+    bottom: calc(
+      env(safe-area-inset-bottom) + var(--composer-height, 0px) +
+        var(--d-border-radius-large)
+    );
+  }
+}
+
+@media screen and (max-width: 768px) {
+  .with-topic-progress {
+    bottom: calc(
+      env(safe-area-inset-bottom) + var(--composer-height, 0px) +
+        calc(var(--d-border-radius-large) * 2)
+    );
+  }
+}
+
+@media screen and (max-width: 400px) {
+  .with-topic-progress {
+    bottom: calc(env(safe-area-inset-bottom) + var(--composer-height, 0px));
+  }
+}
+
+.boxed.white {
+  background-color: #fff;
+}
diff --git a/scss/misc.scss b/scss/misc.scss
new file mode 100644
index 0000000..4f87bbd
--- /dev/null
+++ b/scss/misc.scss
@@ -0,0 +1,3 @@
+.user-main .about.collapsed-info .details {
+  background: #fff;
+}
diff --git a/scss/nav-pills.scss b/scss/nav-pills.scss
index 7993f8b..4da1b04 100644
--- a/scss/nav-pills.scss
+++ b/scss/nav-pills.scss
@@ -1,7 +1,7 @@
 .list-controls {
   position: sticky;
   top: var(--header-offset);
-  background: var(--secondary);
+  background: #ffffff;
   z-index: 100;
   padding: 1.5rem 0 1rem 0;
   max-width: unset;
@@ -14,8 +14,8 @@
   .combo-box .combo-box-header,
   .select-kit.is-expanded .select-kit-body,
   .discourse-post-event .discourse-post-event-widget {
-    background-color: var(--secondary);
-    border-radius: 6.25rem;
+    background-color: #ffffff;
+    border-radius: var(--d-border-radius);
   }
 }
 .nav-pills > li > a:hover,
diff --git a/scss/sidebar.scss b/scss/sidebar.scss
index 8fd83e8..c60f3f4 100644
--- a/scss/sidebar.scss
+++ b/scss/sidebar.scss
@@ -2,6 +2,10 @@
   // --d-sidebar-background: #f5f8ff;
 }
 
+.sidebar-section-link-wrapper .sidebar-section-link {
+  border-radius: var(--d-border-radius);
+}
+
 .sidebar-wrapper {
   background: #f5f8ff;
 
@@ -16,3 +20,7 @@
     padding: 0;
   }
 }
+
+.admin-area .sidebar-wrapper .admin-panel {
+  background-color: var(--secondary);
+}
diff --git a/scss/topics.scss b/scss/topics.scss
new file mode 100644
index 0000000..62eb133
--- /dev/null
+++ b/scss/topics.scss
@@ -0,0 +1,29 @@
+#topic-title {
+  z-index: 999;
+  margin-bottom: 1em;
+  padding: 1.5rem 2rem 0.5em;
+  position: sticky;
+  top: var(--header-offset);
+  background: #ffffff;
+}
+
+// .container.posts,
+// .more-topics__container,
+// #topic-footer-buttons {
+//   padding: 0 24px;
+// }
+
+.container.posts .topic-navigation {
+  top: calc(var(--header-offset, 60px) + 4em);
+}
+
+.discourse-post-event .discourse-post-event-widget {
+  background-color: #ffffff;
+}
+
+.more-topics__container
+  .more-topics__list
+  .topic-list-body
+  .topic-list-item:last-of-type {
+  border-bottom: 1px solid #cedde3;
+}
diff --git a/scss/variables.scss b/scss/variables.scss
index 60c7af1..b1f5181 100644
--- a/scss/variables.scss
+++ b/scss/variables.scss
@@ -1,9 +1,12 @@
 :root {
   --d-border-radius-large: 20px;
+  --d-button-border-radius: 20px;
   --d-border-radius: 6px;
   --d-input-border-radius: 6px;
   --accent-color: #595bca;
   --accent-text-color: #ffffff;
   --d-nav-color--active: var(--accent-color);
   --primary: #0c0d27;
+  --main-grid-gap: 2em;
+  --d-max-width: 1000px;
 }