diff --git a/src/styles/adaptedStyles/animePage.scss b/src/styles/adaptedStyles/animePage.scss
index 36541f7e..afc2ba33 100644
--- a/src/styles/adaptedStyles/animePage.scss
+++ b/src/styles/adaptedStyles/animePage.scss
@@ -1,4 +1,4 @@
-.bewly-design {
+.bewly-design.animePage {
   :not(fjjdsl) .home-v3-app-container {
     .home-banner-wrapper
       .banner-hover-group
diff --git a/src/styles/adaptedStyles/animePlayback&MoviePage.scss b/src/styles/adaptedStyles/animePlayback&MoviePage.scss
index ff020f0f..4530f165 100644
--- a/src/styles/adaptedStyles/animePlayback&MoviePage.scss
+++ b/src/styles/adaptedStyles/animePlayback&MoviePage.scss
@@ -1,4 +1,4 @@
-.bewly-design {
+.bewly-design.animePlaybackAndMoviePage {
   .bpx-player-contextmenu > li {
     box-sizing: unset;
   }
diff --git a/src/styles/adaptedStyles/articlesPage.scss b/src/styles/adaptedStyles/articlesPage.scss
index e86c18bb..45c1246f 100644
--- a/src/styles/adaptedStyles/articlesPage.scss
+++ b/src/styles/adaptedStyles/articlesPage.scss
@@ -1,4 +1,4 @@
-.bewly-design {
+.bewly-design.articlePage {
   .right-side-bar .catalog .catalog-text {
     line-height: unset;
   }
@@ -157,6 +157,10 @@
       color: var(--bew-text-1);
     }
 
+    span[style*="color:#000000"] {
+      color: var(--bew-text-1) !important;
+    }
+
     .page-content
       .left-side
       .article-list
@@ -230,7 +234,8 @@
     .view-note .note-content .ql-container .ql-editor,
     .bili-dialog-bomb .appeal-box .header,
     .bili-dialog-bomb .appeal-box .submit,
-    .bili-dialog-bomb .appeal-box .submit .cancel {
+    .bili-dialog-bomb .appeal-box .submit .cancel,
+    .bili-button.primary.plain {
       background-color: transparent;
     }
 
diff --git a/src/styles/adaptedStyles/channelPage.scss b/src/styles/adaptedStyles/channelPage.scss
index 90c9bb33..4891e74a 100644
--- a/src/styles/adaptedStyles/channelPage.scss
+++ b/src/styles/adaptedStyles/channelPage.scss
@@ -1,4 +1,4 @@
-.bewly-design {
+.bewly-design.channelPage {
   .banner-wrapper {
     background-color: black;
     margin-bottom: 0 !important;
diff --git a/src/styles/adaptedStyles/common.scss b/src/styles/adaptedStyles/common.scss
index 0de585b7..7f9f7fd1 100644
--- a/src/styles/adaptedStyles/common.scss
+++ b/src/styles/adaptedStyles/common.scss
@@ -1,4 +1,5 @@
-.bili-header .bili-header__bar {
+.bili-header .bili-header__bar,
+#internationalHeader {
   visibility: hidden;
 }
 .bewly-design {
diff --git a/src/styles/adaptedStyles/historyPage.scss b/src/styles/adaptedStyles/historyPage.scss
index 5d5610e1..723e04db 100644
--- a/src/styles/adaptedStyles/historyPage.scss
+++ b/src/styles/adaptedStyles/historyPage.scss
@@ -1,4 +1,4 @@
-.bewly-design {
+.bewly-design.historyPage {
   .history-wrap .b-head .b-head-t {
     color: var(--bew-text-1);
   }
diff --git a/src/styles/adaptedStyles/homePage.scss b/src/styles/adaptedStyles/homePage.scss
index 82a80d9f..f9cc4a0e 100644
--- a/src/styles/adaptedStyles/homePage.scss
+++ b/src/styles/adaptedStyles/homePage.scss
@@ -1,4 +1,4 @@
-.bewly-design {
+.bewly-design.homePage {
   .header-channel {
     margin-top: 10px;
   }
diff --git a/src/styles/adaptedStyles/index.ts b/src/styles/adaptedStyles/index.ts
index 7084de32..77bd7694 100644
--- a/src/styles/adaptedStyles/index.ts
+++ b/src/styles/adaptedStyles/index.ts
@@ -14,32 +14,44 @@ async function setupStyles() {
     || /https?:\/\/www.bilibili.com\/?$/.test(currentUrl)
     || /https?:\/\/www.bilibili.com\/index.html$/.test(currentUrl)
     || /https?:\/\/bilibili.com\/\?spm_id_from=.*/.test(currentUrl)
-    || /https?:\/\/www.bilibili.com\/\?spm_id_from=(.)*/.test(currentUrl))
+    || /https?:\/\/www.bilibili.com\/\?spm_id_from=(.)*/.test(currentUrl)) {
     await import('./homePage.scss')
+    document.documentElement.classList.add('homePage')
+  }
 
   // notifications page
-  else if (/https?:\/\/message.bilibili.com\.*/.test(currentUrl))
+  else if (/https?:\/\/message.bilibili.com\.*/.test(currentUrl)) {
     await import('./notificationsPage.scss')
+    document.documentElement.classList.add('notificationsPage')
+  }
 
   // moments page
   else if (
     // moments
     /https?:\/\/t.bilibili.com\.*/.test(currentUrl)
     // moment detail
-    || /https?:\/\/www.bilibili.com\/opus\/.*/.test(currentUrl))
+    || /https?:\/\/www.bilibili.com\/opus\/.*/.test(currentUrl)) {
     await import('./momentsPage.scss')
+    document.documentElement.classList.add('momentsPage')
+  }
 
   // history page
-  else if (/https?:\/\/(www.)?bilibili.com\/account\/history.*/.test(currentUrl))
+  else if (/https?:\/\/(www.)?bilibili.com\/account\/history.*/.test(currentUrl)) {
     await import('./historyPage.scss')
+    document.documentElement.classList.add('historyPage')
+  }
 
   // user space page
-  else if (/https?:\/\/space.bilibili.com\.*/.test(currentUrl))
+  else if (/https?:\/\/space.bilibili.com\.*/.test(currentUrl)) {
     await import('./userSpacePage.scss')
+    document.documentElement.classList.add('userSpacePage')
+  }
 
   // search page
-  else if (/https?:\/\/search.bilibili.com\.*/.test(currentUrl))
+  else if (/https?:\/\/search.bilibili.com\.*/.test(currentUrl)) {
     await import('./searchPage.scss')
+    document.documentElement.classList.add('searchPage')
+  }
 
   // video page
   else if (
@@ -48,28 +60,38 @@ async function setupStyles() {
     || /https?:\/\/(www.)?bilibili.com\/list\/watchlater.*/.test(currentUrl)
     // favorite playlist
     || /https?:\/\/(www.)?bilibili.com\/list\/ml.*/.test(currentUrl)
-  )
+  ) {
     await import('./videoPage.scss')
+    document.documentElement.classList.add('videoPage')
+  }
 
   else if (
     // anime playback & movie page
     /https?:\/\/(www.)?bilibili.com\/bangumi\/play\/.*/.test(currentUrl)
-  )
+  ) {
     await import('./animePlayback&MoviePage.scss')
+    document.documentElement.classList.add('animePlaybackAndMoviePage')
+  }
 
   // anime page & chinese anime page
   else if (
-    /https?:\/\/(www.)?bilibili.com\/(anime|guochuang).*/.test(currentUrl))
+    /https?:\/\/(www.)?bilibili.com\/(anime|guochuang).*/.test(currentUrl)) {
     await import('./animePage.scss')
+    document.documentElement.classList.add('animePage')
+  }
 
   // channel page e.g. tv shows, movie, variety shows, mooc page
   else if (
-    /https?:\/\/(www.)?bilibili.com\/(tv|movie|variety|mooc|documentary).*/.test(currentUrl))
+    /https?:\/\/(www.)?bilibili.com\/(tv|movie|variety|mooc|documentary).*/.test(currentUrl)) {
     await import('./channelPage.scss')
+    document.documentElement.classList.add('channelPage')
+  }
 
   // articles page
-  else if (/https?:\/\/(www.)?bilibili.com\/read.*/.test(currentUrl))
+  else if (/https?:\/\/(www.)?bilibili.com\/read.*/.test(currentUrl)) {
     await import('./articlesPage.scss')
+    document.documentElement.classList.add('articlesPage')
+  }
 }
 
 setupStyles()
diff --git a/src/styles/adaptedStyles/momentsPage.scss b/src/styles/adaptedStyles/momentsPage.scss
index e2c41c17..e929eb04 100644
--- a/src/styles/adaptedStyles/momentsPage.scss
+++ b/src/styles/adaptedStyles/momentsPage.scss
@@ -1,4 +1,4 @@
-.bewly-design {
+.bewly-design.momentsPage {
   .bili-dyn-home--member {
     // margin-top: 10px;
   }
diff --git a/src/styles/adaptedStyles/notificationsPage.scss b/src/styles/adaptedStyles/notificationsPage.scss
index 256ab86a..e8faeb02 100644
--- a/src/styles/adaptedStyles/notificationsPage.scss
+++ b/src/styles/adaptedStyles/notificationsPage.scss
@@ -7,7 +7,7 @@
     height: calc(100vh - 70px);
   }
 }
-.bewly-design {
+.bewly-design.notificationsPage {
   #message-navbar {
     display: none;
 
diff --git a/src/styles/adaptedStyles/searchPage.scss b/src/styles/adaptedStyles/searchPage.scss
index 32ab8a34..a6d3b726 100644
--- a/src/styles/adaptedStyles/searchPage.scss
+++ b/src/styles/adaptedStyles/searchPage.scss
@@ -1,4 +1,4 @@
-.bewly-design {
+.bewly-design.searchPage {
   // .search-input-container .search-fixed-header.search-sticky-header {
   //   display: none;;
   // }
diff --git a/src/styles/adaptedStyles/userSpacePage.scss b/src/styles/adaptedStyles/userSpacePage.scss
index c676131a..6f81ede3 100644
--- a/src/styles/adaptedStyles/userSpacePage.scss
+++ b/src/styles/adaptedStyles/userSpacePage.scss
@@ -6,7 +6,7 @@
   }
 }
 
-.bewly-design {
+.bewly-design.userSpacePage {
   .wrapper .edit-video-modal .target-favlist {
     padding: 12px 36px;
   }
diff --git a/src/styles/adaptedStyles/videoPage.scss b/src/styles/adaptedStyles/videoPage.scss
index 9dd44859..1b926e54 100644
--- a/src/styles/adaptedStyles/videoPage.scss
+++ b/src/styles/adaptedStyles/videoPage.scss
@@ -1,4 +1,4 @@
-.bewly-design {
+.bewly-design.videoPage {
   .user-card-m-exp .layout {
     display: none;
   }
diff --git a/src/styles/variables.scss b/src/styles/variables.scss
index 31245f4a..8d0ca23d 100644
--- a/src/styles/variables.scss
+++ b/src/styles/variables.scss
@@ -195,6 +195,7 @@
   --bpx-box-shadow: rgba(0, 0, 0, 0.15);
   --bpx-toast-fn-color: var(--bew-theme-color);
   --bpx-toast-fn-hover-color: var(--bew-theme-color-80);
+  --bpx-primary-color: var(--bew-theme-color);
 }
 
 :root.dark.bewly-design {