diff --git a/src/css/app.scss b/src/css/app.scss
index be2b6fc4..e0c5fb80 100644
--- a/src/css/app.scss
+++ b/src/css/app.scss
@@ -4,19 +4,24 @@
 @import 'open-props/shadows';
 @import 'open-props/zindex';
 
+:root {
+  --_bg-box-content: var(--blue-5);
+  --_color-box-content-text: var(--_bg-box-content);
+  --_bg-box-content-text: white;
+  --_bg-tooltip-branch: var(--indigo-0);
+  --_bg-tooltip-branch-arrow: var(--_bg-tooltip-branch);
+}
+
 html {
   --brand-1: #035aa1;
   --brand-2: #f50000;
-
   --border-color: var(--gray-4);
-
   --foreground: black;
   --background: var(--gray-1);
   --surface-0: var(--background);
   --surface-1: white;
   --surface-2: var(--gray-1);
   --surface-3: var(--gray-2);
-
   color: var(--foreground);
   background-color: var(--background);
 }
@@ -24,9 +29,7 @@ html {
 :where(.dark, .body--dark) {
   --brand-1: var(--blue-7);
   --brand-2: #f50000;
-
   --border-color: var(--gray-8);
-
   --foreground: white;
   --background: var(--gray-10);
   --surface-0: var(--background);