diff --git a/css/leptonChrome.css b/css/leptonChrome.css
index 40cf40c..9e49a65 100644
--- a/css/leptonChrome.css
+++ b/css/leptonChrome.css
@@ -5333,6 +5333,47 @@
     --arrowpanel-menuitem-padding-inline: calc(var(--arrowpanel-menuitem-padding-block) + 8px) !important;
   }
 }
+/** Sidebar UI ****************************************************************/
+@supports -moz-bool-pref("userChrome.sidebar.overlap") or -moz-bool-pref("userChrome.autohide.sidebar") {
+  #sidebar-box {
+    /* Original
+     min-width: 14em;
+     width: 18em;
+     max-width: 36em;
+    */
+    --uc-sidebar-width: 40px;
+    --uc-sidebar-activate-width: 18em;
+    --uc-sidebar-fullscreen-width: 4px;
+    --uc-sidebar-shadow-color: #28282f;
+    --uc-autohide-sidebar-delay: 600ms;
+    /* Wait 0.6s before hiding sidebar */
+    z-index: 1000 !important;
+    position: relative !important;
+    box-shadow: 1px 0px 15px -10px var(--uc-sidebar-shadow-color);
+  }
+
+  #sidebar-splitter {
+    display: none !important;
+  }
+}
+@supports -moz-bool-pref("userChrome.sidebar.overlap") {
+  @supports not -moz-bool-pref("userChrome.autohide.sidebar") {
+    #sidebar-box {
+      min-width: var(--uc-sidebar-activate-width) !important;
+      max-width: var(--uc-sidebar-activate-width) !important;
+      margin-inline-start: calc(-1 * var(--uc-sidebar-activate-width)) !important;
+      will-change: transform;
+    }
+    #sidebar-box:not([hidden="true"]) {
+      transform: translateX(var(--uc-sidebar-activate-width));
+    }
+    @media (prefers-reduced-motion: no-preference) {
+      #sidebar-box {
+        transition: transform 0.25s var(--animation-easing-function), opacity 0.25s ease-in-out, visibility 0s linear !important;
+      }
+    }
+  }
+}
 /** Other UI ******************************************************************/
 /*= Bookmark Bar - Centered ==================================================*/
 @supports -moz-bool-pref("userChrome.bookmarkbar.centered") {
@@ -5390,46 +5431,6 @@
     }
   }
 }
-@supports -moz-bool-pref("userChrome.sidebar.overlap") or -moz-bool-pref("userChrome.autohide.sidebar") {
-  #sidebar-box {
-    /* Original
-     min-width: 14em;
-     width: 18em;
-     max-width: 36em;
-    */
-    --uc-sidebar-width: 40px;
-    --uc-sidebar-activate-width: 18em;
-    --uc-sidebar-fullscreen-width: 4px;
-    --uc-sidebar-shadow-color: #28282f;
-    --uc-autohide-sidebar-delay: 600ms;
-    /* Wait 0.6s before hiding sidebar */
-    z-index: 1000 !important;
-    position: relative !important;
-    box-shadow: 1px 0px 15px -10px var(--uc-sidebar-shadow-color);
-  }
-
-  #sidebar-splitter {
-    display: none !important;
-  }
-}
-@supports -moz-bool-pref("userChrome.sidebar.overlap") {
-  @supports not -moz-bool-pref("userChrome.autohide.sidebar") {
-    #sidebar-box {
-      min-width: var(--uc-sidebar-activate-width) !important;
-      max-width: var(--uc-sidebar-activate-width) !important;
-      margin-inline-start: calc(-1 * var(--uc-sidebar-activate-width)) !important;
-      will-change: transform;
-    }
-    #sidebar-box:not([hidden="true"]) {
-      transform: translateX(var(--uc-sidebar-activate-width));
-    }
-    @media (prefers-reduced-motion: no-preference) {
-      #sidebar-box {
-        transition: transform 0.25s var(--animation-easing-function), opacity 0.25s ease-in-out, visibility 0s linear !important;
-      }
-    }
-  }
-}
 @supports -moz-bool-pref("userChrome.autohide.sidebar") {
   #sidebar-box {
     min-width: var(--uc-sidebar-width) !important;
diff --git a/src/autohide/_sidebar.scss b/src/autohide/_sidebar.scss
index 8247184..ba58cd8 100644
--- a/src/autohide/_sidebar.scss
+++ b/src/autohide/_sidebar.scss
@@ -1,48 +1,4 @@
-@include Option("userChrome.sidebar.overlap", "userChrome.autohide.sidebar") {
-  #sidebar-box {
-    /* Original
-    min-width: 14em;
-    width: 18em;
-    max-width: 36em;
-   */
-
-    --uc-sidebar-width: 40px;
-    --uc-sidebar-activate-width: 18em;
-    --uc-sidebar-fullscreen-width: 4px;
-    --uc-sidebar-shadow-color: #28282F;
-    --uc-autohide-sidebar-delay: 600ms; /* Wait 0.6s before hiding sidebar */
-
-    z-index: 1000 !important;
-    position: relative !important;
-
-    box-shadow: 1px 0px 15px -10px var(--uc-sidebar-shadow-color);
-  }
-
-  #sidebar-splitter {
-    display: none !important;
-  }
-}
-
-@include Option("userChrome.sidebar.overlap") {
-  @include NotOption("userChrome.autohide.sidebar") {
-    #sidebar-box {
-      min-width: var(--uc-sidebar-activate-width) !important;
-      max-width: var(--uc-sidebar-activate-width) !important;
-      margin-inline-start: calc(-1 * var(--uc-sidebar-activate-width)) !important;
-
-      will-change: transform;
-
-      &:not([hidden="true"]) {
-        transform: translateX(var(--uc-sidebar-activate-width));
-      }
-
-      @include Animate {
-        transition: transform 0.25s var(--animation-easing-function), opacity 0.25s ease-in-out,
-                    visibility 0s linear !important;
-      }
-    }
-  }
-}
+// Refer variable `src/sidebar/overlap`
 
 @include Option("userChrome.autohide.sidebar") {
   #sidebar-box {
@@ -56,7 +12,7 @@
   }
 
   @include Option("userChrome.sidebar.overlap") {
-    @import "sidebar/overlay";
+    @import "sidebar/overlap";
   }
   @include NotOption("userChrome.sidebar.overlap") {
     @import "sidebar/static";
diff --git a/src/autohide/sidebar/_overlay.scss b/src/autohide/sidebar/_overlap.scss
similarity index 100%
rename from src/autohide/sidebar/_overlay.scss
rename to src/autohide/sidebar/_overlap.scss
diff --git a/src/leptonChrome.scss b/src/leptonChrome.scss
index fbce8b1..1a5717b 100644
--- a/src/leptonChrome.scss
+++ b/src/leptonChrome.scss
@@ -67,6 +67,9 @@
 /** Panel UI ******************************************************************/
 @import "panel/index";
 
+/** Sidebar UI ****************************************************************/
+@import "sidebar/index";
+
 /** Other UI ******************************************************************/
 @import "others/index";