use css variable colors

assets/sass/_theme/design-system/notes.sass

 .note
-    margin-left: pxToRem($space-unit)
     display: inline-block
     &__call
         @include meta
-        background: $color-background-alt
+        background: var(--color-background-alt)
         border-radius: 4px
         cursor: pointer
         display: inline
@@ -17,8 +16,8 @@
         text-align: center
         user-select: none
     &__content
-        background: $color-text
-        color: $color-background
+        background: var(--color-text)
+        color: var(--color-background)
         display: none
         max-width: 100vw
         padding: $spacing-3
@@ -28,8 +27,8 @@
         @include small
     &--active
         .note__call
-            background: $color-text
-            color: $color-background
+            background: var(--color-text)
+            color: var(--color-background)
             border-bottom-left-radius: 0
             border-bottom-right-radius: 0
         .note__content