diff --git a/backstop.json b/backstop.json
index d723e47..effed90 100644
--- a/backstop.json
+++ b/backstop.json
@@ -108,9 +108,11 @@
     "ci_report": "screenshots/ci_report"
   },
   "report": ["CI"],
-  "engine": "puppeteer",
+  "onBeforeScript": "playwright/onBefore.js",
+  "onReadyScript": "playwright/onReady.js",
+  "engine": "playwright",
   "engineOptions": {
-    "args": ["--no-sandbox"]
+    "browser": "chromium"
   },
   "dockerCommandTemplate": "docker run --rm -i --network host --mount type=bind,source=\"{cwd}\",target=/src backstopjs/backstopjs:{version} {backstopCommand} {args}",
   "asyncCaptureLimit": 5,
diff --git a/screenshots/makeDarkMode.js b/screenshots/makeDarkMode.js
index c39a481..fc16f75 100644
--- a/screenshots/makeDarkMode.js
+++ b/screenshots/makeDarkMode.js
@@ -1,11 +1,6 @@
-// https://github.com/microsoft/TypeScript-Website/blob/v2/packages/typescriptlang-org/scripts/backstop/makeDarkMode.js
+// https://playwright.dev/docs/api/class-page#page-emulate-media
 module.exports = async (page, scenario) => {
   console.log("SWITCHING TO DARK for " + scenario.label)
 
-  await page.emulateMediaFeatures([
-    {
-      name: "prefers-color-scheme",
-      value: "dark",
-    },
-  ])
+  await page.emulateMedia({ colorScheme: 'dark' });
 }
diff --git a/screenshots/reference/docs_Login_partner_0_document_0_reference.png b/screenshots/reference/docs_Login_partner_0_document_0_reference.png
index 03695ef..04f8abe 100644
Binary files a/screenshots/reference/docs_Login_partner_0_document_0_reference.png and b/screenshots/reference/docs_Login_partner_0_document_0_reference.png differ
diff --git a/screenshots/reference/docs_Typography_0_document_0_reference.png b/screenshots/reference/docs_Typography_0_document_0_reference.png
index 2142dcb..9498b0a 100644
Binary files a/screenshots/reference/docs_Typography_0_document_0_reference.png and b/screenshots/reference/docs_Typography_0_document_0_reference.png differ