Add dark overlay to tone down brightness

index.html

@@ -4,9 +4,19 @@
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Vanta Clouds2</title>
-<style>
+    <style>
         html, body { margin: 0; padding: 0; overflow: hidden; width: 100%; height: 100%; }
         #vanta { width: 100vw; height: 100vh; position: fixed; top: 0; left: 0; }
+        #overlay {
+            position: fixed;
+            top: 0;
+            left: 0;
+            width: 100vw;
+            height: 100vh;
+            background: rgba(0, 0, 0, 0.4);
+            pointer-events: none;
+            z-index: 1;
+        }
         #clock {
             position: fixed;
             top: 20px;
@@ -24,6 +34,7 @@
 </head>
 <body>
     <div id="vanta"></div>
+    <div id="overlay"></div>
     <div id="clock">00:00</div>
     <script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r128/three.min.js"></script>
     <script src="https://cdn.jsdelivr.net/npm/vanta@latest/dist/vanta.clouds2.min.js"></script>