diff --git a/web/app/(commonLayout)/app/(appDetailLayout)/[appId]/style.module.css b/web/app/(commonLayout)/app/(appDetailLayout)/[appId]/style.module.css
index 1f1aca2d114..45c7d197b40 100644
--- a/web/app/(commonLayout)/app/(appDetailLayout)/[appId]/style.module.css
+++ b/web/app/(commonLayout)/app/(appDetailLayout)/[appId]/style.module.css
@@ -1,5 +1,3 @@
-@reference "../../../../styles/globals.css";
-
 .app {
     flex-grow: 1;
     height: 0;
diff --git a/web/app/(commonLayout)/datasets/(datasetDetailLayout)/[datasetId]/documents/style.module.css b/web/app/(commonLayout)/datasets/(datasetDetailLayout)/[datasetId]/documents/style.module.css
index 955f5d593b8..67a9fe3bf5d 100644
--- a/web/app/(commonLayout)/datasets/(datasetDetailLayout)/[datasetId]/documents/style.module.css
+++ b/web/app/(commonLayout)/datasets/(datasetDetailLayout)/[datasetId]/documents/style.module.css
@@ -1,5 +1,3 @@
-@reference "../../../../../styles/globals.css";
-
 .logTable td {
   padding: 7px 8px;
   box-sizing: border-box;
diff --git a/web/app/components/app/configuration/base/var-highlight/style.module.css b/web/app/components/app/configuration/base/var-highlight/style.module.css
index b7a66085ce6..2bcef0dabb9 100644
--- a/web/app/components/app/configuration/base/var-highlight/style.module.css
+++ b/web/app/components/app/configuration/base/var-highlight/style.module.css
@@ -1,5 +1,3 @@
-@reference "../../../../../styles/globals.css";
-
 .item {
   background-color: rgba(21, 94, 239, 0.05);
 }
diff --git a/web/app/components/app/configuration/base/warning-mask/style.module.css b/web/app/components/app/configuration/base/warning-mask/style.module.css
index f922ec332fb..a2c394de2a8 100644
--- a/web/app/components/app/configuration/base/warning-mask/style.module.css
+++ b/web/app/components/app/configuration/base/warning-mask/style.module.css
@@ -1,5 +1,3 @@
-@reference "../../../../../styles/globals.css";
-
 .mask {
   backdrop-filter: blur(2px);
 }
diff --git a/web/app/components/app/configuration/config-prompt/style.module.css b/web/app/components/app/configuration/config-prompt/style.module.css
index 3086441327f..224d59d9c8a 100644
--- a/web/app/components/app/configuration/config-prompt/style.module.css
+++ b/web/app/components/app/configuration/config-prompt/style.module.css
@@ -1,5 +1,3 @@
-@reference "../../../../styles/globals.css";
-
 .gradientBorder {
   background: radial-gradient(circle at 100% 100%, #fcfcfd 0, #fcfcfd 10px, transparent 10px) 0% 0%/12px 12px no-repeat,
             radial-gradient(circle at 0 100%, #fcfcfd 0, #fcfcfd 10px, transparent 10px) 100% 0%/12px 12px no-repeat,
diff --git a/web/app/components/app/configuration/config/automatic/style.module.css b/web/app/components/app/configuration/config/automatic/style.module.css
index fb25784808a..fa67b8519b7 100644
--- a/web/app/components/app/configuration/config/automatic/style.module.css
+++ b/web/app/components/app/configuration/config/automatic/style.module.css
@@ -1,5 +1,3 @@
-@reference "../../../../../styles/globals.css";
-
 .textGradient {
   background: linear-gradient(92deg, #2250F2 -29.55%, #0EBCF3 75.22%);
   -webkit-background-clip: text;
diff --git a/web/app/components/app/configuration/ctrl-btn-group/style.module.css b/web/app/components/app/configuration/ctrl-btn-group/style.module.css
index 0614d2775b9..3e874868a93 100644
--- a/web/app/components/app/configuration/ctrl-btn-group/style.module.css
+++ b/web/app/components/app/configuration/ctrl-btn-group/style.module.css
@@ -1,5 +1,3 @@
-@reference "../../../../styles/globals.css";
-
 .ctrlBtn {
     left: -16px;
     right: -16px;
diff --git a/web/app/components/app/configuration/style.module.css b/web/app/components/app/configuration/style.module.css
index 136d065215c..01f2c93167a 100644
--- a/web/app/components/app/configuration/style.module.css
+++ b/web/app/components/app/configuration/style.module.css
@@ -1,5 +1,3 @@
-@reference "../../../styles/globals.css";
-
 .advancedPromptMode {
   position: relative;
 }
diff --git a/web/app/components/base/app-icon-picker/style.module.css b/web/app/components/base/app-icon-picker/style.module.css
index c22ca04a661..5ec199a2325 100644
--- a/web/app/components/base/app-icon-picker/style.module.css
+++ b/web/app/components/base/app-icon-picker/style.module.css
@@ -1,5 +1,3 @@
-@reference "../../../styles/globals.css";
-
 .container {
     display: flex;
     flex-direction: column;
diff --git a/web/app/components/base/audio-btn/style.module.css b/web/app/components/base/audio-btn/style.module.css
index 2a07ad0697a..7e3175aa139 100644
--- a/web/app/components/base/audio-btn/style.module.css
+++ b/web/app/components/base/audio-btn/style.module.css
@@ -1,5 +1,3 @@
-@reference "../../../styles/globals.css";
-
 .playIcon {
   background-image: url(~@/app/components/develop/secret-key/assets/play.svg);
   background-position: center;
diff --git a/web/app/components/base/chat/chat/loading-anim/style.module.css b/web/app/components/base/chat/chat/loading-anim/style.module.css
index 1e1a87a3121..d5a373df6ff 100644
--- a/web/app/components/base/chat/chat/loading-anim/style.module.css
+++ b/web/app/components/base/chat/chat/loading-anim/style.module.css
@@ -1,5 +1,3 @@
-@reference "../../../../../styles/globals.css";
-
 .dot-flashing {
   position: relative;
   animation: dot-flashing 1s infinite linear alternate;
diff --git a/web/app/components/base/copy-feedback/style.module.css b/web/app/components/base/copy-feedback/style.module.css
index 13359768356..83625d61891 100644
--- a/web/app/components/base/copy-feedback/style.module.css
+++ b/web/app/components/base/copy-feedback/style.module.css
@@ -1,5 +1,3 @@
-@reference "../../../styles/globals.css";
-
 .copyIcon {
   background-image: url(~@/app/components/develop/secret-key/assets/copy.svg);
   background-position: center;
diff --git a/web/app/components/base/grid-mask/style.module.css b/web/app/components/base/grid-mask/style.module.css
index 24d73a62afc..e051271fab9 100644
--- a/web/app/components/base/grid-mask/style.module.css
+++ b/web/app/components/base/grid-mask/style.module.css
@@ -1,5 +1,3 @@
-@reference "../../../styles/globals.css";
-
 .gridBg{
   background-image: url(./Grid.svg);
   background-repeat: repeat;
diff --git a/web/app/components/base/image-gallery/style.module.css b/web/app/components/base/image-gallery/style.module.css
index 3cbe886b048..2e4c62e4563 100644
--- a/web/app/components/base/image-gallery/style.module.css
+++ b/web/app/components/base/image-gallery/style.module.css
@@ -1,5 +1,3 @@
-@reference "../../../styles/globals.css";
-
 .item {
   max-height: 200px;
   margin-right: 8px;
diff --git a/web/app/components/base/radio/style.module.css b/web/app/components/base/radio/style.module.css
index 3ecf32f8d6f..3e6bcdf418c 100644
--- a/web/app/components/base/radio/style.module.css
+++ b/web/app/components/base/radio/style.module.css
@@ -1,5 +1,3 @@
-@reference "../../../styles/globals.css";
-
 .container {
     padding: 4px;
     border-radius: 4px;
diff --git a/web/app/components/base/simple-pie-chart/index.module.css b/web/app/components/base/simple-pie-chart/index.module.css
index 8ee0bdecf83..827b18d5f10 100644
--- a/web/app/components/base/simple-pie-chart/index.module.css
+++ b/web/app/components/base/simple-pie-chart/index.module.css
@@ -1,5 +1,3 @@
-@reference "../../../styles/globals.css";
-
 .simplePieChart {
   border-radius: 50%;
   box-shadow: 0 0 5px -3px rgb(from var(--simple-pie-chart-color) r g b / 0.1), 0.5px 0.5px 3px 0 rgb(from var(--simple-pie-chart-color) r g b / 0.3);
diff --git a/web/app/components/base/svg/style.module.css b/web/app/components/base/svg/style.module.css
index 885a9f8c3ad..9258fe8ed3f 100644
--- a/web/app/components/base/svg/style.module.css
+++ b/web/app/components/base/svg/style.module.css
@@ -1,5 +1,3 @@
-@reference "../../../styles/globals.css";
-
 .svgIcon {
   background-image: url(~@/app/components/develop/secret-key/assets/svg.svg);
   background-position: center;
diff --git a/web/app/components/base/ui/scroll-area/index.module.css b/web/app/components/base/ui/scroll-area/index.module.css
index 4b0cb178752..a81fd3d3c25 100644
--- a/web/app/components/base/ui/scroll-area/index.module.css
+++ b/web/app/components/base/ui/scroll-area/index.module.css
@@ -1,5 +1,3 @@
-@reference "../../../../styles/globals.css";
-
 .scrollbar::before,
 .scrollbar::after {
   content: '';
diff --git a/web/app/components/base/video-gallery/VideoPlayer.module.css b/web/app/components/base/video-gallery/VideoPlayer.module.css
index c31499184f7..04c4a367d62 100644
--- a/web/app/components/base/video-gallery/VideoPlayer.module.css
+++ b/web/app/components/base/video-gallery/VideoPlayer.module.css
@@ -1,5 +1,3 @@
-@reference "../../../styles/globals.css";
-
 .videoPlayer {
   position: relative;
   width: 100%;
diff --git a/web/app/components/base/voice-input/index.module.css b/web/app/components/base/voice-input/index.module.css
index 330d261af0b..8286f9d9a95 100644
--- a/web/app/components/base/voice-input/index.module.css
+++ b/web/app/components/base/voice-input/index.module.css
@@ -1,5 +1,3 @@
-@reference "../../../styles/globals.css";
-
 .wrapper {
   background: linear-gradient(131deg, #2250F2 0%, #0EBCF3 100%);
   box-shadow: 0px 4px 6px -2px rgba(16, 24, 40, 0.03), 0px 12px 16px -4px rgba(16, 24, 40, 0.08);
diff --git a/web/app/components/billing/annotation-full/style.module.css b/web/app/components/billing/annotation-full/style.module.css
index 61a4406ae5f..15bedd84ca4 100644
--- a/web/app/components/billing/annotation-full/style.module.css
+++ b/web/app/components/billing/annotation-full/style.module.css
@@ -1,5 +1,3 @@
-@reference "../../../styles/globals.css";
-
 .textGradient {
   background: linear-gradient(92deg, #2250F2 -29.55%, #0EBCF3 75.22%);
   -webkit-background-clip: text;
diff --git a/web/app/components/billing/apps-full-in-dialog/style.module.css b/web/app/components/billing/apps-full-in-dialog/style.module.css
index 06c062be7d7..1f68e665a62 100644
--- a/web/app/components/billing/apps-full-in-dialog/style.module.css
+++ b/web/app/components/billing/apps-full-in-dialog/style.module.css
@@ -1,5 +1,3 @@
-@reference "../../../styles/globals.css";
-
 .textGradient {
   background: linear-gradient(92deg, #0EBCF3 -29.55%, #2250F2 75.22%);
   -webkit-background-clip: text;
diff --git a/web/app/components/billing/plan-upgrade-modal/style.module.css b/web/app/components/billing/plan-upgrade-modal/style.module.css
index 3b6dbf27a53..50ad4883880 100644
--- a/web/app/components/billing/plan-upgrade-modal/style.module.css
+++ b/web/app/components/billing/plan-upgrade-modal/style.module.css
@@ -1,5 +1,3 @@
-@reference "../../../styles/globals.css";
-
 .surface {
   border: 0.5px solid var(--color-components-panel-border, rgba(16, 24, 40, 0.08));
   background:
diff --git a/web/app/components/billing/pricing/header.module.css b/web/app/components/billing/pricing/header.module.css
index 43deaea206b..fc05646d865 100644
--- a/web/app/components/billing/pricing/header.module.css
+++ b/web/app/components/billing/pricing/header.module.css
@@ -1,5 +1,3 @@
-@reference "../../../styles/globals.css";
-
 .instrumentSerif {
   font-family: "Instrument Serif", serif;
   font-style: italic;
diff --git a/web/app/components/billing/upgrade-btn/style.module.css b/web/app/components/billing/upgrade-btn/style.module.css
index 6fbdb8b6c40..ab8c30ebd52 100644
--- a/web/app/components/billing/upgrade-btn/style.module.css
+++ b/web/app/components/billing/upgrade-btn/style.module.css
@@ -1,5 +1,3 @@
-@reference "../../../styles/globals.css";
-
 .upgradeBtn {
   background: linear-gradient(99deg, rgba(255, 255, 255, 0.12) 7.16%, rgba(255, 255, 255, 0.00) 85.47%), linear-gradient(280deg, #00B2FF 12.96%, #132BFF 90.95%);
   box-shadow: 0px 2px 4px -2px rgba(16, 24, 40, 0.06), 0px 4px 8px -2px rgba(0, 162, 253, 0.12);
diff --git a/web/app/components/billing/vector-space-full/style.module.css b/web/app/components/billing/vector-space-full/style.module.css
index 61a4406ae5f..15bedd84ca4 100644
--- a/web/app/components/billing/vector-space-full/style.module.css
+++ b/web/app/components/billing/vector-space-full/style.module.css
@@ -1,5 +1,3 @@
-@reference "../../../styles/globals.css";
-
 .textGradient {
   background: linear-gradient(92deg, #2250F2 -29.55%, #0EBCF3 75.22%);
   -webkit-background-clip: text;
diff --git a/web/app/components/custom/custom-web-app-brand/style.module.css b/web/app/components/custom/custom-web-app-brand/style.module.css
index e24f725c033..bdc7d7cfbfe 100644
--- a/web/app/components/custom/custom-web-app-brand/style.module.css
+++ b/web/app/components/custom/custom-web-app-brand/style.module.css
@@ -1,5 +1,3 @@
-@reference "../../../styles/globals.css";
-
 .mask {
   background: linear-gradient(273deg, rgba(255, 255, 255, 0.00) 51.75%, rgba(255, 255, 255, 0.80) 115.32%);
 }
diff --git a/web/app/components/custom/style.module.css b/web/app/components/custom/style.module.css
index df955bd293a..0a839f6387c 100644
--- a/web/app/components/custom/style.module.css
+++ b/web/app/components/custom/style.module.css
@@ -1,5 +1,3 @@
-@reference "../../styles/globals.css";
-
 .textGradient {
   background: linear-gradient(92deg, #2250F2 -29.55%, #0EBCF3 75.22%);
   -webkit-background-clip: text;
diff --git a/web/app/components/datasets/create/index.module.css b/web/app/components/datasets/create/index.module.css
index 2e7e4f3a569..e69de29bb2d 100644
--- a/web/app/components/datasets/create/index.module.css
+++ b/web/app/components/datasets/create/index.module.css
@@ -1,2 +0,0 @@
-@reference "../../../styles/globals.css";
-
diff --git a/web/app/components/develop/secret-key/style.module.css b/web/app/components/develop/secret-key/style.module.css
index b62ba4cf278..f13161c888a 100644
--- a/web/app/components/develop/secret-key/style.module.css
+++ b/web/app/components/develop/secret-key/style.module.css
@@ -1,5 +1,3 @@
-@reference "../../../styles/globals.css";
-
 .customModal {
     max-width: 800px !important;
     max-height: calc(100vh - 80px);
diff --git a/web/app/components/explore/app-list/style.module.css b/web/app/components/explore/app-list/style.module.css
index ca83ab0fa24..241130a03d1 100644
--- a/web/app/components/explore/app-list/style.module.css
+++ b/web/app/components/explore/app-list/style.module.css
@@ -1,5 +1,3 @@
-@reference "../../../styles/globals.css";
-
 .textGradient {
   background: linear-gradient(to right, rgba(16, 74, 225, 1) 0, rgba(0, 152, 238, 1) 100%);
   -webkit-background-clip: text;
diff --git a/web/app/components/explore/sidebar/no-apps/style.module.css b/web/app/components/explore/sidebar/no-apps/style.module.css
index 556774eb751..ad3787ce2bd 100644
--- a/web/app/components/explore/sidebar/no-apps/style.module.css
+++ b/web/app/components/explore/sidebar/no-apps/style.module.css
@@ -1,5 +1,3 @@
-@reference "../../../../styles/globals.css";
-
 .light {
   background-image: url('./no-web-apps-light.png');
 }
diff --git a/web/app/components/header/account-dropdown/workplace-selector/index.module.css b/web/app/components/header/account-dropdown/workplace-selector/index.module.css
index 4b2257f427a..c3184f7e18c 100644
--- a/web/app/components/header/account-dropdown/workplace-selector/index.module.css
+++ b/web/app/components/header/account-dropdown/workplace-selector/index.module.css
@@ -1,5 +1,3 @@
-@reference "../../../../styles/globals.css";
-
 .popup {
   left: 4px;
   transform: translateX(-100%);
diff --git a/web/app/components/header/account-setting/Integrations-page/index.module.css b/web/app/components/header/account-setting/Integrations-page/index.module.css
index e7c70e8e02a..7c2a8836395 100644
--- a/web/app/components/header/account-setting/Integrations-page/index.module.css
+++ b/web/app/components/header/account-setting/Integrations-page/index.module.css
@@ -1,5 +1,3 @@
-@reference "../../../../styles/globals.css";
-
 .google-icon {
   background: url(../../assets/google.svg) center center no-repeat;
   background-size: 16px 16px;
diff --git a/web/app/components/header/account-setting/language-page/index.module.css b/web/app/components/header/account-setting/language-page/index.module.css
index e7c70e8e02a..7c2a8836395 100644
--- a/web/app/components/header/account-setting/language-page/index.module.css
+++ b/web/app/components/header/account-setting/language-page/index.module.css
@@ -1,5 +1,3 @@
-@reference "../../../../styles/globals.css";
-
 .google-icon {
   background: url(../../assets/google.svg) center center no-repeat;
   background-size: 16px 16px;
diff --git a/web/app/components/header/account-setting/members-page/invited-modal/index.module.css b/web/app/components/header/account-setting/members-page/invited-modal/index.module.css
index 37e23b1f79d..96470439f03 100644
--- a/web/app/components/header/account-setting/members-page/invited-modal/index.module.css
+++ b/web/app/components/header/account-setting/members-page/invited-modal/index.module.css
@@ -1,5 +1,3 @@
-@reference "../../../../../styles/globals.css";
-
 .modal {
   padding: 32px !important;
   width: 480px !important;
diff --git a/web/app/components/header/account-setting/model-provider-page/provider-added-card/quota-panel.module.css b/web/app/components/header/account-setting/model-provider-page/provider-added-card/quota-panel.module.css
index 9c106968ca0..47d2c4cead2 100644
--- a/web/app/components/header/account-setting/model-provider-page/provider-added-card/quota-panel.module.css
+++ b/web/app/components/header/account-setting/model-provider-page/provider-added-card/quota-panel.module.css
@@ -1,5 +1,3 @@
-@reference "../../../../../styles/globals.css";
-
 .gridBg {
   background-size: 4px 4px;
   background-image:
diff --git a/web/app/components/header/index.module.css b/web/app/components/header/index.module.css
index 755433a7995..9e23bc10a6b 100644
--- a/web/app/components/header/index.module.css
+++ b/web/app/components/header/index.module.css
@@ -1,5 +1,3 @@
-@reference "../../styles/globals.css";
-
 .header-DEVELOPMENT {
   background: linear-gradient(180deg, rgba(253, 176, 34, 0.08) 0%, rgba(253, 176, 34, 0) 100%);
   border-top: 4px solid #FDB022;
diff --git a/web/app/components/header/nav/index.module.css b/web/app/components/header/nav/index.module.css
index 2e7e4f3a569..e69de29bb2d 100644
--- a/web/app/components/header/nav/index.module.css
+++ b/web/app/components/header/nav/index.module.css
@@ -1,2 +0,0 @@
-@reference "../../../styles/globals.css";
-
diff --git a/web/app/components/header/plugins-nav/downloading-icon.module.css b/web/app/components/header/plugins-nav/downloading-icon.module.css
index 53b2cf5479c..bbd6a35e4c7 100644
--- a/web/app/components/header/plugins-nav/downloading-icon.module.css
+++ b/web/app/components/header/plugins-nav/downloading-icon.module.css
@@ -1,5 +1,3 @@
-@reference "../../../styles/globals.css";
-
 @keyframes realistic-blink {
   0% { fill: #37ff37; opacity: 0.4; }
   15% { fill: #37ff37; opacity: 0.9; }
diff --git a/web/app/components/plugins/reference-setting-modal/style.module.css b/web/app/components/plugins/reference-setting-modal/style.module.css
index 61a4406ae5f..15bedd84ca4 100644
--- a/web/app/components/plugins/reference-setting-modal/style.module.css
+++ b/web/app/components/plugins/reference-setting-modal/style.module.css
@@ -1,5 +1,3 @@
-@reference "../../../styles/globals.css";
-
 .textGradient {
   background: linear-gradient(92deg, #2250F2 -29.55%, #0EBCF3 75.22%);
   -webkit-background-clip: text;
diff --git a/web/app/components/workflow/nodes/_base/components/retry/style.module.css b/web/app/components/workflow/nodes/_base/components/retry/style.module.css
index 0e92485b685..2ce4e7b400a 100644
--- a/web/app/components/workflow/nodes/_base/components/retry/style.module.css
+++ b/web/app/components/workflow/nodes/_base/components/retry/style.module.css
@@ -1,5 +1,3 @@
-@reference "../../../../../../styles/globals.css";
-
 .input::-webkit-inner-spin-button,
 .input::-webkit-outer-spin-button {
   -webkit-appearance: none;
diff --git a/web/app/signin/page.module.css b/web/app/signin/page.module.css
index ba89077ec00..e9759b23a85 100644
--- a/web/app/signin/page.module.css
+++ b/web/app/signin/page.module.css
@@ -1,5 +1,3 @@
-@reference "../styles/globals.css";
-
 .githubIcon {
   background: center/contain url('./assets/github.svg') no-repeat;
 }
diff --git a/web/app/styles/markdown.css b/web/app/styles/markdown.css
index 1ada6e49bde..45b3d4bad1f 100644
--- a/web/app/styles/markdown.css
+++ b/web/app/styles/markdown.css
@@ -1,6 +1,5 @@
 @import '../../themes/markdown-light.css';
 @import '../../themes/markdown-dark.css';
-@reference "./globals.css";
 
 .markdown-body {
   -ms-text-size-adjust: 100%;
@@ -73,7 +72,6 @@
 }
 
 .markdown-body abbr[title]:hover::after {
-  @apply shadow-xl shadow-shadow-shadow-5 rounded-md;
   position: absolute;
   bottom: 100%;
   left: 0;
@@ -84,8 +82,12 @@
   font-size: 12px;
   line-height: 1;
   color: var(--color-text-secondary);
+  border-radius: 0.375rem;
   border: 0.5px solid var(--color-components-panel-border);
   background-color: var(--color-components-tooltip-bg);
+  box-shadow:
+    0px 8px 8px -4px var(--color-shadow-shadow-5),
+    0px 20px 24px -4px var(--color-shadow-shadow-5);
 }
 
 .markdown-body b,