updated lighthouse/ tweaked UI

index.html

@@ -17,7 +17,7 @@
     <link rel="stylesheet" href="/assets/styling/highlight.css" />
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
     <link rel="manifest" href="/manifest.webmanifest" />
-    <link rel="ard" href="/ai-catalog.json" />
+    <link rel="ard" href="/.well-known/ard.json" />
     <script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/components/prism-core.min.js"></script>
     <script
         src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/plugins/autoloader/prism-autoloader.min.js"></script>
@@ -31,14 +31,34 @@
 </head>
 
 <body>
-    <video class="video-bg" src="" autoplay muted loop></video>
+    <video class="video-bg" autoplay muted loop playsinline></video>
+
+    <script>
+        const video = document.querySelector('.video-bg');
+
+        function setVideoBackground() {
+            video.src = document.documentElement.classList.contains('dark')
+                ? 'https://www.pexels.com/download/video/38811850//'
+                : 'https://www.pexels.com/download/video/38811850//';
+
+            video.load();
+            video.play().catch(() => { });
+        }
+
+        setVideoBackground();
+
+        new MutationObserver(setVideoBackground).observe(document.documentElement, {
+            attributes: true,
+            attributeFilter: ['class']
+        });
+    </script>
+    <div id="banner">
+        <span>
+            Rights holders can request source removal — <a href="/misc/project/dmca">DMCA policy</a>.
+        </span>
+        <button id="banner-close" onclick="dismissBanner()" aria-label="Dismiss">✕</button>
+    </div>
     <div id="header-container">
-        <div id="banner">
-            <span>
-                Rights holders can request source removal — <a href="/misc/project/dmca">DMCA policy</a>.
-            </span>
-            <button id="banner-close" onclick="dismissBanner()" aria-label="Dismiss">✕</button>
-        </div>
         <header id="navbar">
             <div class="nav-top">
                 <a class="brand" href="/"><img src="/assets/images/logo.png" alt="Vyla" id="brand-logo" width="28"