diff --git a/docs/package.json b/docs/package.json
index aae609e17a2..7aead3cdfa9 100644
--- a/docs/package.json
+++ b/docs/package.json
@@ -8,9 +8,9 @@
     "license": "ISC",
     "scripts": {
         "images": "imagemin '_site/assets/images' --out-dir='_site/assets/images'",
-        "watch:sass": "sass --watch --poll src/assets/scss:src/assets/css",
+        "watch:sass": "node-sass --watch src/assets/scss -o src/assets/css",
         "watch:eleventy": "eleventy --serve --port=2023",
-        "build:sass": "sass --style=compressed src/assets/scss:src/assets/css --no-source-map",
+        "build:sass": "node-sass src/assets/scss -o src/assets/css",
         "build:eleventy": "npx @11ty/eleventy",
         "start": "npm-run-all build:sass --parallel watch:*  --parallel images",
         "build": "npm-run-all build:sass --parallel build:*   --parallel images"
@@ -31,9 +31,10 @@
         "markdown-it": "^12.2.0",
         "markdown-it-anchor": "^8.1.2",
         "netlify-cli": "^10.3.1",
+        "node-sass": "^6.0.1",
         "npm-run-all": "^4.1.5",
         "rimraf": "^3.0.2",
-        "sass": "^1.52.1",
+        "sass": "^1.38.0",
         "slugify": "^1.6.3"
     }
 }
diff --git a/docs/src/assets/scss/tokens/themes.scss b/docs/src/assets/scss/tokens/themes.scss
index f6c3b05ced3..1a262e020c0 100644
--- a/docs/src/assets/scss/tokens/themes.scss
+++ b/docs/src/assets/scss/tokens/themes.scss
@@ -93,7 +93,6 @@
 }
 
 @media (prefers-color-scheme: dark) {
-    html{
     --secondary-button-background-color: var(--color-neutral-700);
     --secondary-button-hover-color: var(--color-neutral-800);
     --secondary-button-text-color: var(--body-text-color);
@@ -114,7 +113,6 @@
     --hero-background-color: var(--color-neutral-800);
     --footer-background-color: var(--color-neutral-800);
     --outline-color: #fff;
-    }
 }