Add and use custom red skin

sass/skins/custom.scss

@@ -0,0 +1,30 @@
+// This defines theme-specific variables.
+@mixin theme-variables($theme) {
+  @if $theme =='light' {
+    // Light theme colours.
+    --primary-color: #cd3731;
+  }
+
+  @else if $theme =='dark' {
+    // Dark theme colours.
+    --primary-color: #e35d5d;
+  }
+}
+
+// Apply light theme variables by default.
+:root {
+  @include theme-variables('light');
+}
+
+// Apply dark theme variables when dark theme is explicitly set.
+[data-theme='dark'] {
+  @include theme-variables('dark');
+}
+
+// Apply dark theme variables when user's system prefers dark mode
+// and the theme is not explicitly set to light.
+@media (prefers-color-scheme: dark) {
+  :root:not([data-theme='light']) {
+    @include theme-variables('dark');
+  }
+}