diff --git a/src/renderer/less/bootstrap.less b/src/renderer/less/bootstrap.less
index a32d04bc..ace079f4 100644
--- a/src/renderer/less/bootstrap.less
+++ b/src/renderer/less/bootstrap.less
@@ -35,10 +35,12 @@
   color: #212529;
   text-align: left;
   list-style: none;
-  background-color: #fff;
+  background-color: var(--color1);
   background-clip: padding-box;
   border: 1px solid rgba(0, 0, 0, 0.15);
   border-radius: 0.25rem;
+  box-shadow: var(--mediaItemShadow), var(--mediaItemShadow-ShadowSubtle);
+  backdrop-filter: var(--glassFilter);
 }
 .dropdown-menu[data-bs-popper] {
   top: 100%;
@@ -1388,23 +1390,24 @@ fieldset:disabled .btn {
 
 .btn-secondary {
   color           : #fff;
-  background-color: #6c757d;
-  border-color    : #6c757d;
+  border-color    : 1px solid rgba(100, 100, 100, 0.35);
+  background-color: rgba(100, 100, 100, 0.25);
+  border-top-color: 1px solid rgba(100, 100, 100, 0.5);
 }
 
 .btn-secondary:hover {
   color           : #fff;
-  background-color: #5c636a;
-  border-color    : #565e64;
+  // background-color: #5c636a;
+  // border-color    : #565e64;
 }
 
-.btn-check:focus+.btn-secondary,
-.btn-secondary:focus {
-  color           : #fff;
-  background-color: #5c636a;
-  border-color    : #565e64;
-  box-shadow      : 0 0 0 0.25rem rgba(130, 138, 145, 0.5);
-}
+// .btn-check:focus+.btn-secondary,
+// .btn-secondary:focus {
+//   color           : #fff;
+//   background-color: #5c636a;
+//   border-color    : #565e64;
+//   box-shadow      : 0 0 0 0.25rem rgba(130, 138, 145, 0.5);
+// }
 
 .btn-check:checked+.btn-secondary,
 .btn-check:active+.btn-secondary,
diff --git a/src/renderer/main/vueapp.js b/src/renderer/main/vueapp.js
index e049ff71..e1abc256 100644
--- a/src/renderer/main/vueapp.js
+++ b/src/renderer/main/vueapp.js
@@ -581,6 +581,9 @@ const app = new Vue({
             if (this.cfg.visual.theme != "default.less" && this.cfg.visual.theme != "") {
                 this.setTheme(this.cfg.visual.theme)
             }
+            if (this.cfg.visual.styles.length != 0) {
+                await this.reloadStyles()
+            }
 
             if (this.platform == "darwin") {
                 this.chrome.windowControlPosition = "left"
@@ -762,6 +765,9 @@ const app = new Vue({
             ipcRenderer.on('theme-update', (event, arg) => {
                 less.refresh(true, true, true)
                 self.setTheme(self.cfg.visual.theme, true)
+                if (app.cfg.visual.styles.length != 0) {
+                    app.reloadStyles()
+                }
             })
 
             ipcRenderer.on('SoundCheckTag', (event, tag) => {
@@ -899,9 +905,6 @@ const app = new Vue({
                 this.$forceUpdate()
             }, 500)
             ipcRenderer.invoke("renderer-ready", true)
-            if (this.cfg.visual.styles.length != 0) {
-                this.reloadStyles()
-            }
             document.querySelector("#LOADER").remove()
             if (this.cfg.general.themeUpdateNotification) {
                 this.checkForThemeUpdates()
@@ -986,6 +989,7 @@ const app = new Vue({
             less.registerStylesheetsImmediately()
             less.refresh(true, true, true)
             this.$forceUpdate()
+            return
         },
         macOSEmu() {
             this.chrome.forceDirectives["macosemu"] = {
diff --git a/src/renderer/style.less b/src/renderer/style.less
index 7d50fab8..aa4d73ee 100644
--- a/src/renderer/style.less
+++ b/src/renderer/style.less
@@ -44,6 +44,7 @@
   --songProgressBackground: #333;
   --textColor: #eee;
   --replayGradient: linear-gradient(45deg, hsl(248deg 58% 29%), hsl(13deg 41% 42%));
+  --glassFilter: blur(16px) saturate(180%); 
 }
 
 *:focus-visible {
@@ -238,6 +239,17 @@ input[type="text"], input[type="number"] {
   opacity: 0.70;
 }
 
+a.dropdown-item {
+  color: var(--textColor);
+
+  &:hover {
+    background-color: var(--selected);
+    color: var(--textColor);
+  }
+  &:active {
+    background-color: var(--selected-click);
+  }
+}
 
 .bg-artwork {
   position: absolute;
diff --git a/src/renderer/themes/compactui.less b/src/renderer/themes/compactui.less
new file mode 100644
index 00000000..e69de29b
diff --git a/src/renderer/themes/groovy/index.less b/src/renderer/themes/groovy/index.less
deleted file mode 100644
index ab0c0141..00000000
--- a/src/renderer/themes/groovy/index.less
+++ /dev/null
@@ -1 +0,0 @@
-//
\ No newline at end of file
diff --git a/src/renderer/themes/groovy/theme.json b/src/renderer/themes/groovy/theme.json
deleted file mode 100644
index db9f5469..00000000
--- a/src/renderer/themes/groovy/theme.json
+++ /dev/null
@@ -1,15 +0,0 @@
-{
-    "name": "Groovy",
-    "description": "Inspired by Groove Music and Media Player found on Windows",
-    "version": "1.0.0",
-    "author": "ciderapp",
-    "github_repo": "ciderapp/Groovy",
-    "directives": {
-        "windowLayout": {
-            "value": "twopanel"
-        },
-        "lcdArtworkSize": {
-            "value": 70
-        }
-    }
-}
\ No newline at end of file
diff --git a/src/renderer/themes/inline_drawer.less b/src/renderer/themes/inline_drawer.less
new file mode 100644
index 00000000..a87f6a61
--- /dev/null
+++ b/src/renderer/themes/inline_drawer.less
@@ -0,0 +1,41 @@
+&:not(.modular-fs) {
+    .app-drawer {
+        border-radius: 0px;
+        top          : 0;
+        right        : 0;
+        height       : 100%;
+        box-shadow   : unset;
+        border-left  : 1px solid var(--color2);
+        background   : var(--color1);
+        margin-right : 0px;
+        position     : relative;
+    }
+
+    .drawertransition-enter-active,
+    .drawertransition-leave-active {
+        transition: margin .25s var(--appleEase), opacity .25s var(--appleEase);
+    }
+
+    .drawertransition-enter,
+    .drawertransition-leave-to {
+        margin-right: -300px;
+    }
+    
+    @media screen and (max-width: 1120px) {
+        .app-drawer {
+            margin-right: 0px;
+            position    : absolute;
+        }
+
+        .drawertransition-enter-active,
+        .drawertransition-leave-active {
+            transition: right .25s var(--appleEase), opacity .25s var(--appleEase);
+        }
+
+        .drawertransition-enter,
+        .drawertransition-leave-to {
+            right: -300px;
+        }
+    }
+
+}
\ No newline at end of file
diff --git a/src/renderer/themes/reduce_visuals.less b/src/renderer/themes/reduce_visuals.less
new file mode 100644
index 00000000..9b23fb0a
--- /dev/null
+++ b/src/renderer/themes/reduce_visuals.less
@@ -0,0 +1,115 @@
+body {
+    --ciderShadow-Generic         : var(--mediaItemShadow);
+    --mediaItemShadow-Shadow      : var(--mediaItemShadow);
+    --mediaItemShadow-ShadowSubtle: var(--mediaItemShadow);
+}
+
+.bg-artwork-container {
+    display  : none;
+    animation: none !important;
+
+    .bg-artwork {
+        animation: none !important;
+    }
+}
+
+.replaycard-enter-active,
+.replaycard-leave-active {
+    transition: unset;
+}
+
+.replaycard-enter,
+.replaycard-leave-to {
+    opacity  : 0;
+    transform: translateY(20px);
+}
+
+.modal-enter-active,
+.modal-leave-active {
+    transition: unset;
+}
+
+.modal-enter,
+.modal-leave-to {
+    opacity  : 0;
+    transform: scale(1.10);
+}
+
+.wpfade-enter-active,
+.wpfade-leave-active {
+    transition: opacity .1s var(--appleEase);
+}
+
+.wpfade-enter,
+.wpfade-leave-to {
+    opacity: 0;
+}
+
+.wpfade_transform-enter-active,
+.wpfade_transform-leave-active {
+    transition : unset;
+    will-change: unset;
+}
+
+.wpfade_transform-enter {
+    opacity    : 0;
+    transform  : unset;
+    will-change: unset;
+}
+
+.wpfade_transform-leave-to {
+    opacity    : 0;
+    transform  : unset;
+    will-change: unset;
+}
+
+
+.wpfade_transform_backwards-enter-active,
+.wpfade_transform_backwards-leave-active {
+    transition: unset;
+}
+
+.wpfade_transform_backwards-enter {
+    opacity    : 0;
+    transform  : unset;
+    will-change: unset;
+}
+
+.wpfade_transform_backwards-leave-to {
+    opacity    : 0;
+    transform  : unset;
+    will-change: unset;
+}
+
+.fabfade-enter-active,
+.fabfade-leave-active {
+    transition: unset;
+}
+
+.fabfade-enter,
+.fabfade-leave-to {
+    opacity  : 0;
+    transform: scale(0.5);
+}
+
+.fsModeSwitch-enter-active,
+.fsModeSwitch-leave-active {
+    transition: unset;
+}
+
+.fsModeSwitch-enter,
+.fsModeSwitch-leave-to {
+    transform: scale(1.10);
+    opacity  : 0;
+}
+
+
+.drawertransition-enter-active,
+.drawertransition-leave-active {
+    transition: unset;
+}
+
+.drawertransition-enter,
+.drawertransition-leave-to {
+    right: -300px;
+}
\ No newline at end of file
diff --git a/src/renderer/views/pages/settings.ejs b/src/renderer/views/pages/settings.ejs
index 3195af5e..7a45c317 100644
--- a/src/renderer/views/pages/settings.ejs
+++ b/src/renderer/views/pages/settings.ejs
@@ -226,7 +226,6 @@
                                 <select class="md-select" @change="$root.setTheme($root.cfg.visual.theme)" v-model="$root.cfg.visual.theme">
                                     <option value="default.less">{{$root.getLz('settings.option.visual.theme.default')}}</option>
                                     <option value="dark.less">{{$root.getLz('settings.option.visual.theme.dark')}}</option>
-                                    <option value="sweetener.less">Sweetener</option>
                                     <option v-for="theme in themes" :value="theme.file">{{ theme.name }}</option>
                                 </select>
                                 <button class="md-btn md-btn-small md-btn-block" @click="gitHubExplore()" style="margin-top: 8px">
@@ -964,11 +963,18 @@
                             </b-col>
                         </b-row>
                         </b-list-group-item>
-                        <b-list-group-item variant="dark">
-                            <b-dropdown class="stylesDropdown" variant="primary" text="Add Style...">
-                            <b-dropdown-item v-for="theme in themes" @click="addStyle(theme.file)">{{theme.name}}</b-dropdown-item>
-                        </b-dropdown>
-                    </b-list-group-item>
+                        <b-list-group-item slot="footer" style="-webkit-user-drag: none" variant="dark">
+                            <b-row>
+                                <b-col>
+                                    <b-dropdown class="stylesDropdown" variant="primary" text="Add Style...">
+                                        <b-dropdown-item v-for="theme in themes" @click="addStyle(theme.file)">{{theme.name}}</b-dropdown-item>
+                                    </b-dropdown>
+                                </b-col>
+                                <b-col>
+                                    <b-btn @click="gitHubExplore()">{{$root.getLz('settings.option.visual.theme.github.explore')}}</b-btn>    
+                                </b-col>
+                            </b-row>
+                        </b-list-group-item>
                 </draggable>    
             </div>
         `,
@@ -984,9 +990,30 @@
                 newTheme: null
             }
         },
+        mounted() {
+            this.themes.unshift({
+                name: "Sweetener",
+                file: "sweetener.less"
+            })
+            this.themes.unshift({
+                name: "Reduce Visuals",
+                file: "reduce_visuals.less"
+            })
+            this.themes.unshift({
+                name: "Inline Drawer",
+                file: "inline_drawer.less"
+            })
+        },
         methods: {
+            gitHubExplore() {
+                this.$root.appRoute("themes-github")
+            },
             getThemeName(filename) {
-                return this.themes.find(theme => theme.file === filename).name;
+                try {
+                    return this.themes.find(theme => theme.file === filename).name;                    
+                }catch(e) {
+                    return filename;
+                }
             },
             moveUp() {
                 const styles = this.$root.cfg.visual.styles
diff --git a/src/renderer/views/pages/themes-github.ejs b/src/renderer/views/pages/themes-github.ejs
index 0b1e0883..a8afaaf1 100644
--- a/src/renderer/views/pages/themes-github.ejs
+++ b/src/renderer/views/pages/themes-github.ejs
@@ -10,7 +10,6 @@
                             v-model="$root.cfg.visual.theme">
                         <option value="default.less">{{$root.getLz('settings.option.visual.theme.default')}}</option>
                         <option value="dark.less">{{$root.getLz('settings.option.visual.theme.dark')}}</option>
-                        <option value="sweetener.less">Sweetener</option>
                         <option v-for="theme in themes" :value="theme.file">{{ theme.name }}</option>
                     </select>
                 </div>