diff --git a/src/css/app.scss b/src/css/app.scss
index 1488da86..5304eaf7 100644
--- a/src/css/app.scss
+++ b/src/css/app.scss
@@ -18,6 +18,7 @@ html {
   --surface-3: var(--gray-1);
 
   --text-mute: var(--stone-5-hsl);
+  --text-mute-2: var(--stone-7-hsl);
 
   --info-fg: 0 0% 100%;
   --info-bg: var(--blue-6-hsl);
@@ -30,6 +31,8 @@ html {
 
   --gender-male: var(--blue-5-hsl);
   --gender-female: var(--pink-7-hsl);
+  --customer-corp: var(--purple-11-hsl);
+  --customer-pers: var(--teal-9-hsl);
 
   --shadow-color: 220 3% 15%;
   --shadow-strength: 5%;
@@ -51,7 +54,10 @@ html {
   --surface-2: var(--gray-10);
   --surface-3: var(--gray-9);
 
+  --customer-corp: var(--purple-9-hsl);
+
   --text-mute: var(--stone-8-hsl);
+  --text-mute-2: var(--foreground);
 
   --shadow-color: 220 0% 100%;
   --shadow-strength: 25%;
@@ -121,6 +127,10 @@ html {
   color: hsl(var(--text-mute));
 }
 
+.app-text-muted-2 {
+  color: hsl(var(--text-mute-2));
+}
+
 .app-text-info {
   color: hsl(var(--info-bg));
 }
@@ -165,3 +175,21 @@ html {
   color: hsl(var(--positive-fg));
   background-color: hsl(var(--gender-female)) !important;
 }
+
+.app-text-corp {
+  color: hsl(var(--customer-corp));
+}
+
+.app-bg-corp {
+  color: hsl(var(--customer-corp));
+  background-color: hsla(var(--customer-corp) / 0.2) !important;
+}
+
+.app-text-pers {
+  color: hsl(var(--customer-pers));
+}
+
+.app-bg-pers {
+  color: hsl(var(--customer-pers));
+  background-color: hsla(var(--customer-pers) / 0.2) !important;
+}