Use var() notation

docs/_sass/patreon.sass

@@ -4,7 +4,7 @@
 
 .bd-side-sponsor-label,
 .bd-banner-label
-  color: $border-hover
+  color: var(--#{$prefix}-border-hover)
   font-size: 0.75rem
   margin-bottom: 0.75rem
 
@@ -31,17 +31,17 @@
     margin-bottom: 0.25em
   &.is-patreon
     background-color: $patreon-blue
-    color: $scheme-main
+    color: var(--#{$prefix}-scheme-main)
   // &.is-fortyfour
-  //   background-color: $scheme-main
+  //   background-color: var(--#{$prefix}-scheme-main)
   //   border: 2px solid $background
   .button
     transform-origin: center
     transition-duration: $speed
     transition-property: transform
   &:hover
-    border-color: $link
-    color: $link
+    border-color: var(--#{$prefix}-link)
+    color: var(--#{$prefix}-link)
     .bd-banner-title
       color: currentColor
     .button
@@ -55,7 +55,7 @@
   opacity: 0.5
 
 .bd-banner-title
-  color: $text-strong
+  color: var(--#{$prefix}-text-strong)
   font-size: 1.25em
   font-weight: $weight-semibold
   line-height: 1.25