diff --git a/playground/voyage-playground.html b/playground/voyage-playground.html
index f6df511..f7cc0c4 100644
--- a/playground/voyage-playground.html
+++ b/playground/voyage-playground.html
@@ -1,9 +1,33 @@
 <!DOCTYPE html>
-<html lang="nb">
+<html lang="nb" data-theme="dark">
 <head>
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <title>Voyage Annotation Playground v4.2</title>
+
+  <!-- Theme bootstrap. Må kjøre før stylesheets parses for å unngå
+       flash-of-wrong-theme (FOUC). Prioritet:
+         1) lagret valg (localStorage 'voyage-theme')
+         2) OS-preferanse via matchMedia('(prefers-color-scheme: dark)')
+         3) HTML-attributtets default ('dark')
+       Setter både data-theme + colorScheme for native form-controls/scrollbars.
+       Wrappes i try/catch — file:// + privatmodus kan blokkere localStorage. -->
+  <script>
+    (function () {
+      var theme = null;
+      try {
+        var saved = localStorage.getItem('voyage-theme');
+        if (saved === 'light' || saved === 'dark') theme = saved;
+      } catch (e) { /* localStorage utilgjengelig */ }
+      if (!theme && window.matchMedia) {
+        theme = window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
+      }
+      if (!theme) theme = document.documentElement.getAttribute('data-theme') || 'dark';
+      document.documentElement.setAttribute('data-theme', theme);
+      document.documentElement.style.colorScheme = theme;
+    })();
+  </script>
+
   <link rel="stylesheet" href="vendor/playground-design-system/fonts.css">
   <link rel="stylesheet" href="vendor/playground-design-system/tokens.css">
   <link rel="stylesheet" href="vendor/playground-design-system/base.css">
