diff --git a/src/layouts/MainLayout.vue b/src/layouts/MainLayout.vue
index aec1fe36..f3c11022 100644
--- a/src/layouts/MainLayout.vue
+++ b/src/layouts/MainLayout.vue
@@ -185,7 +185,6 @@ onMounted(async () => {
             left: -18px;
             background-color: var(--surface-1);
           "
-          class="bordered"
         >
           <q-btn
             flat
@@ -210,18 +209,21 @@ onMounted(async () => {
       </div>
 
       <div
-        class="surface-3 rounded q-pb-lg scroll column"
+        class="surface-0 q-pb-lg scroll column"
         style="height: 100vh; flex-wrap: nowrap"
       >
         <!-- header -->
         <div
-          class="q-px-lg row items-center justify-between q-pb-md surface-3 q-pt-lg"
+          class="q-px-lg surface-0 row items-center justify-between q-pb-md q-pt-lg"
           style="position: sticky; top: 0; z-index: 8"
         >
           <div class="column">
             <span
               class="text-weight-bold"
               :class="{ 'text-h6': $q.screen.gt.xs }"
+              :style="{
+                filter: `brightness(${$q.dark.isActive ? '2' : '1'})`,
+              }"
             >
               {{
                 utilsStore.currentTitle?.title