From 1c2a3c6d3ada627e89bb3f5894955969538ec356 Mon Sep 17 00:00:00 2001
From: Dejvino <scoutmaster@dejvino.cz>
Date: Sun, 16 Nov 2025 13:20:33 +0100
Subject: [PATCH] Refactoring: add Vite to serve JS modules

---
 tv-player/.gitignore            |    1 +
 tv-player/index.html            |   15 +-
 tv-player/package-lock.json     | 1069 +++++++++++++++++++++++++++++++
 tv-player/package.json          |   17 +
 tv-player/src/EffectsManager.js |    5 +-
 tv-player/src/animate.js        |  105 ---
 tv-player/src/core/animate.js   |  110 ++++
 tv-player/src/core/init.js      |   62 ++
 tv-player/src/effects_dust.js   |    4 +-
 tv-player/src/effects_flies.js  |   21 +-
 tv-player/src/init.js           |   67 --
 tv-player/src/main.js           |    6 +
 tv-player/src/scene.js          |  166 ++---
 tv-player/src/state.js          |   50 ++
 tv-player/src/utils.js          |   13 +-
 tv-player/src/vcr-display.js    |   32 +-
 tv-player/src/video-player.js   |   95 +--
 17 files changed, 1506 insertions(+), 332 deletions(-)
 create mode 100644 tv-player/.gitignore
 create mode 100644 tv-player/package-lock.json
 create mode 100644 tv-player/package.json
 delete mode 100644 tv-player/src/animate.js
 create mode 100644 tv-player/src/core/animate.js
 create mode 100644 tv-player/src/core/init.js
 delete mode 100644 tv-player/src/init.js
 create mode 100644 tv-player/src/main.js
 create mode 100644 tv-player/src/state.js

diff --git a/tv-player/.gitignore b/tv-player/.gitignore
new file mode 100644
index 0000000..b512c09
--- /dev/null
+++ b/tv-player/.gitignore
@@ -0,0 +1 @@
+node_modules
\ No newline at end of file
diff --git a/tv-player/index.html b/tv-player/index.html
index 9b7805f..1e7b122 100644
--- a/tv-player/index.html
+++ b/tv-player/index.html
@@ -4,9 +4,8 @@
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Retro TV Player</title>
-    <!-- Load Tailwind CSS for styling --><script src="./vendor/tailwind-3.4.17.js" x-src="https://cdn.tailwindcss.com"></script>
+    <!-- Load Tailwind CSS for styling --><script src="/vendor/tailwind-3.4.17.js"></script>
 
-    <!-- Load Three.js for 3D rendering --><script src="./vendor/three.min.js" x-src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r128/three.min.js"></script>
     <script src="./src/tailwind-config.js"></script>
     <style>
         /* Dark room aesthetic */
@@ -45,16 +44,8 @@
         </div>
     </div>
 
-    <script src="./src/global-variables.js"></script>
-    <script src="./src/utils.js"></script>
-    <script src="./src/scene.js"></script>
-    <script src="./src/video-player.js"></script>
-    <script src="./src/effects_dust.js"></script>
-    <script src="./src/effects_flies.js"></script>
-    <script src="./src/EffectsManager.js"></script>
-    <script src="./src/vcr-display.js"></script>
-    <script src="./src/animate.js"></script>
-    <script src="./src/init.js"></script>
+    <!-- Main entry point for the application -->
+    <script type="module" src="/src/main.js"></script>
 
     <!-- 3D Canvas will be injected here by Three.js -->
 </body>
diff --git a/tv-player/package-lock.json b/tv-player/package-lock.json
new file mode 100644
index 0000000..5e630b0
--- /dev/null
+++ b/tv-player/package-lock.json
@@ -0,0 +1,1069 @@
+{
+  "name": "tv-player",
+  "version": "1.0.0",
+  "lockfileVersion": 3,
+  "requires": true,
+  "packages": {
+    "": {
+      "name": "tv-player",
+      "version": "1.0.0",
+      "license": "ISC",
+      "dependencies": {
+        "three": "^0.181.1"
+      },
+      "devDependencies": {
+        "vite": "^7.2.2"
+      }
+    },
+    "node_modules/@esbuild/aix-ppc64": {
+      "version": "0.25.12",
+      "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.25.12.tgz",
+      "integrity": "sha512-Hhmwd6CInZ3dwpuGTF8fJG6yoWmsToE+vYgD4nytZVxcu1ulHpUQRAB1UJ8+N1Am3Mz4+xOByoQoSZf4D+CpkA==",
+      "cpu": [
+        "ppc64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "aix"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/android-arm": {
+      "version": "0.25.12",
+      "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.25.12.tgz",
+      "integrity": "sha512-VJ+sKvNA/GE7Ccacc9Cha7bpS8nyzVv0jdVgwNDaR4gDMC/2TTRc33Ip8qrNYUcpkOHUT5OZ0bUcNNVZQ9RLlg==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "android"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/android-arm64": {
+      "version": "0.25.12",
+      "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.25.12.tgz",
+      "integrity": "sha512-6AAmLG7zwD1Z159jCKPvAxZd4y/VTO0VkprYy+3N2FtJ8+BQWFXU+OxARIwA46c5tdD9SsKGZ/1ocqBS/gAKHg==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "android"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/android-x64": {
+      "version": "0.25.12",
+      "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.25.12.tgz",
+      "integrity": "sha512-5jbb+2hhDHx5phYR2By8GTWEzn6I9UqR11Kwf22iKbNpYrsmRB18aX/9ivc5cabcUiAT/wM+YIZ6SG9QO6a8kg==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "android"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/darwin-arm64": {
+      "version": "0.25.12",
+      "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.25.12.tgz",
+      "integrity": "sha512-N3zl+lxHCifgIlcMUP5016ESkeQjLj/959RxxNYIthIg+CQHInujFuXeWbWMgnTo4cp5XVHqFPmpyu9J65C1Yg==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/darwin-x64": {
+      "version": "0.25.12",
+      "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.25.12.tgz",
+      "integrity": "sha512-HQ9ka4Kx21qHXwtlTUVbKJOAnmG1ipXhdWTmNXiPzPfWKpXqASVcWdnf2bnL73wgjNrFXAa3yYvBSd9pzfEIpA==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/freebsd-arm64": {
+      "version": "0.25.12",
+      "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.25.12.tgz",
+      "integrity": "sha512-gA0Bx759+7Jve03K1S0vkOu5Lg/85dou3EseOGUes8flVOGxbhDDh/iZaoek11Y8mtyKPGF3vP8XhnkDEAmzeg==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "freebsd"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/freebsd-x64": {
+      "version": "0.25.12",
+      "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.25.12.tgz",
+      "integrity": "sha512-TGbO26Yw2xsHzxtbVFGEXBFH0FRAP7gtcPE7P5yP7wGy7cXK2oO7RyOhL5NLiqTlBh47XhmIUXuGciXEqYFfBQ==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "freebsd"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/linux-arm": {
+      "version": "0.25.12",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.25.12.tgz",
+      "integrity": "sha512-lPDGyC1JPDou8kGcywY0YILzWlhhnRjdof3UlcoqYmS9El818LLfJJc3PXXgZHrHCAKs/Z2SeZtDJr5MrkxtOw==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/linux-arm64": {
+      "version": "0.25.12",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.25.12.tgz",
+      "integrity": "sha512-8bwX7a8FghIgrupcxb4aUmYDLp8pX06rGh5HqDT7bB+8Rdells6mHvrFHHW2JAOPZUbnjUpKTLg6ECyzvas2AQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/linux-ia32": {
+      "version": "0.25.12",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.25.12.tgz",
+      "integrity": "sha512-0y9KrdVnbMM2/vG8KfU0byhUN+EFCny9+8g202gYqSSVMonbsCfLjUO+rCci7pM0WBEtz+oK/PIwHkzxkyharA==",
+      "cpu": [
+        "ia32"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/linux-loong64": {
+      "version": "0.25.12",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.25.12.tgz",
+      "integrity": "sha512-h///Lr5a9rib/v1GGqXVGzjL4TMvVTv+s1DPoxQdz7l/AYv6LDSxdIwzxkrPW438oUXiDtwM10o9PmwS/6Z0Ng==",
+      "cpu": [
+        "loong64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/linux-mips64el": {
+      "version": "0.25.12",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.25.12.tgz",
+      "integrity": "sha512-iyRrM1Pzy9GFMDLsXn1iHUm18nhKnNMWscjmp4+hpafcZjrr2WbT//d20xaGljXDBYHqRcl8HnxbX6uaA/eGVw==",
+      "cpu": [
+        "mips64el"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/linux-ppc64": {
+      "version": "0.25.12",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.25.12.tgz",
+      "integrity": "sha512-9meM/lRXxMi5PSUqEXRCtVjEZBGwB7P/D4yT8UG/mwIdze2aV4Vo6U5gD3+RsoHXKkHCfSxZKzmDssVlRj1QQA==",
+      "cpu": [
+        "ppc64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/linux-riscv64": {
+      "version": "0.25.12",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.25.12.tgz",
+      "integrity": "sha512-Zr7KR4hgKUpWAwb1f3o5ygT04MzqVrGEGXGLnj15YQDJErYu/BGg+wmFlIDOdJp0PmB0lLvxFIOXZgFRrdjR0w==",
+      "cpu": [
+        "riscv64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/linux-s390x": {
+      "version": "0.25.12",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.25.12.tgz",
+      "integrity": "sha512-MsKncOcgTNvdtiISc/jZs/Zf8d0cl/t3gYWX8J9ubBnVOwlk65UIEEvgBORTiljloIWnBzLs4qhzPkJcitIzIg==",
+      "cpu": [
+        "s390x"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/linux-x64": {
+      "version": "0.25.12",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.25.12.tgz",
+      "integrity": "sha512-uqZMTLr/zR/ed4jIGnwSLkaHmPjOjJvnm6TVVitAa08SLS9Z0VM8wIRx7gWbJB5/J54YuIMInDquWyYvQLZkgw==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/netbsd-arm64": {
+      "version": "0.25.12",
+      "resolved": "https://registry.npmjs.org/@esbuild/netbsd-arm64/-/netbsd-arm64-0.25.12.tgz",
+      "integrity": "sha512-xXwcTq4GhRM7J9A8Gv5boanHhRa/Q9KLVmcyXHCTaM4wKfIpWkdXiMog/KsnxzJ0A1+nD+zoecuzqPmCRyBGjg==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "netbsd"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/netbsd-x64": {
+      "version": "0.25.12",
+      "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.25.12.tgz",
+      "integrity": "sha512-Ld5pTlzPy3YwGec4OuHh1aCVCRvOXdH8DgRjfDy/oumVovmuSzWfnSJg+VtakB9Cm0gxNO9BzWkj6mtO1FMXkQ==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "netbsd"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/openbsd-arm64": {
+      "version": "0.25.12",
+      "resolved": "https://registry.npmjs.org/@esbuild/openbsd-arm64/-/openbsd-arm64-0.25.12.tgz",
+      "integrity": "sha512-fF96T6KsBo/pkQI950FARU9apGNTSlZGsv1jZBAlcLL1MLjLNIWPBkj5NlSz8aAzYKg+eNqknrUJ24QBybeR5A==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "openbsd"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/openbsd-x64": {
+      "version": "0.25.12",
+      "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.25.12.tgz",
+      "integrity": "sha512-MZyXUkZHjQxUvzK7rN8DJ3SRmrVrke8ZyRusHlP+kuwqTcfWLyqMOE3sScPPyeIXN/mDJIfGXvcMqCgYKekoQw==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "openbsd"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/openharmony-arm64": {
+      "version": "0.25.12",
+      "resolved": "https://registry.npmjs.org/@esbuild/openharmony-arm64/-/openharmony-arm64-0.25.12.tgz",
+      "integrity": "sha512-rm0YWsqUSRrjncSXGA7Zv78Nbnw4XL6/dzr20cyrQf7ZmRcsovpcRBdhD43Nuk3y7XIoW2OxMVvwuRvk9XdASg==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "openharmony"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/sunos-x64": {
+      "version": "0.25.12",
+      "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.25.12.tgz",
+      "integrity": "sha512-3wGSCDyuTHQUzt0nV7bocDy72r2lI33QL3gkDNGkod22EsYl04sMf0qLb8luNKTOmgF/eDEDP5BFNwoBKH441w==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "sunos"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/win32-arm64": {
+      "version": "0.25.12",
+      "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.25.12.tgz",
+      "integrity": "sha512-rMmLrur64A7+DKlnSuwqUdRKyd3UE7oPJZmnljqEptesKM8wx9J8gx5u0+9Pq0fQQW8vqeKebwNXdfOyP+8Bsg==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/win32-ia32": {
+      "version": "0.25.12",
+      "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.25.12.tgz",
+      "integrity": "sha512-HkqnmmBoCbCwxUKKNPBixiWDGCpQGVsrQfJoVGYLPT41XWF8lHuE5N6WhVia2n4o5QK5M4tYr21827fNhi4byQ==",
+      "cpu": [
+        "ia32"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/win32-x64": {
+      "version": "0.25.12",
+      "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.25.12.tgz",
+      "integrity": "sha512-alJC0uCZpTFrSL0CCDjcgleBXPnCrEAhTBILpeAp7M/OFgoqtAetfBzX0xM00MUsVVPpVjlPuMbREqnZCXaTnA==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@rollup/rollup-android-arm-eabi": {
+      "version": "4.53.2",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.53.2.tgz",
+      "integrity": "sha512-yDPzwsgiFO26RJA4nZo8I+xqzh7sJTZIWQOxn+/XOdPE31lAvLIYCKqjV+lNH/vxE2L2iH3plKxDCRK6i+CwhA==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "android"
+      ]
+    },
+    "node_modules/@rollup/rollup-android-arm64": {
+      "version": "4.53.2",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.53.2.tgz",
+      "integrity": "sha512-k8FontTxIE7b0/OGKeSN5B6j25EuppBcWM33Z19JoVT7UTXFSo3D9CdU39wGTeb29NO3XxpMNauh09B+Ibw+9g==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "android"
+      ]
+    },
+    "node_modules/@rollup/rollup-darwin-arm64": {
+      "version": "4.53.2",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.53.2.tgz",
+      "integrity": "sha512-A6s4gJpomNBtJ2yioj8bflM2oogDwzUiMl2yNJ2v9E7++sHrSrsQ29fOfn5DM/iCzpWcebNYEdXpaK4tr2RhfQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ]
+    },
+    "node_modules/@rollup/rollup-darwin-x64": {
+      "version": "4.53.2",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.53.2.tgz",
+      "integrity": "sha512-e6XqVmXlHrBlG56obu9gDRPW3O3hLxpwHpLsBJvuI8qqnsrtSZ9ERoWUXtPOkY8c78WghyPHZdmPhHLWNdAGEw==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ]
+    },
+    "node_modules/@rollup/rollup-freebsd-arm64": {
+      "version": "4.53.2",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-arm64/-/rollup-freebsd-arm64-4.53.2.tgz",
+      "integrity": "sha512-v0E9lJW8VsrwPux5Qe5CwmH/CF/2mQs6xU1MF3nmUxmZUCHazCjLgYvToOk+YuuUqLQBio1qkkREhxhc656ViA==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "freebsd"
+      ]
+    },
+    "node_modules/@rollup/rollup-freebsd-x64": {
+      "version": "4.53.2",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-x64/-/rollup-freebsd-x64-4.53.2.tgz",
+      "integrity": "sha512-ClAmAPx3ZCHtp6ysl4XEhWU69GUB1D+s7G9YjHGhIGCSrsg00nEGRRZHmINYxkdoJehde8VIsDC5t9C0gb6yqA==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "freebsd"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-arm-gnueabihf": {
+      "version": "4.53.2",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.53.2.tgz",
+      "integrity": "sha512-EPlb95nUsz6Dd9Qy13fI5kUPXNSljaG9FiJ4YUGU1O/Q77i5DYFW5KR8g1OzTcdZUqQQ1KdDqsTohdFVwCwjqg==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-arm-musleabihf": {
+      "version": "4.53.2",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-musleabihf/-/rollup-linux-arm-musleabihf-4.53.2.tgz",
+      "integrity": "sha512-BOmnVW+khAUX+YZvNfa0tGTEMVVEerOxN0pDk2E6N6DsEIa2Ctj48FOMfNDdrwinocKaC7YXUZ1pHlKpnkja/Q==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-arm64-gnu": {
+      "version": "4.53.2",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.53.2.tgz",
+      "integrity": "sha512-Xt2byDZ+6OVNuREgBXr4+CZDJtrVso5woFtpKdGPhpTPHcNG7D8YXeQzpNbFRxzTVqJf7kvPMCub/pcGUWgBjA==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-arm64-musl": {
+      "version": "4.53.2",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.53.2.tgz",
+      "integrity": "sha512-+LdZSldy/I9N8+klim/Y1HsKbJ3BbInHav5qE9Iy77dtHC/pibw1SR/fXlWyAk0ThnpRKoODwnAuSjqxFRDHUQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-loong64-gnu": {
+      "version": "4.53.2",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-loong64-gnu/-/rollup-linux-loong64-gnu-4.53.2.tgz",
+      "integrity": "sha512-8ms8sjmyc1jWJS6WdNSA23rEfdjWB30LH8Wqj0Cqvv7qSHnvw6kgMMXRdop6hkmGPlyYBdRPkjJnj3KCUHV/uQ==",
+      "cpu": [
+        "loong64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-ppc64-gnu": {
+      "version": "4.53.2",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-ppc64-gnu/-/rollup-linux-ppc64-gnu-4.53.2.tgz",
+      "integrity": "sha512-3HRQLUQbpBDMmzoxPJYd3W6vrVHOo2cVW8RUo87Xz0JPJcBLBr5kZ1pGcQAhdZgX9VV7NbGNipah1omKKe23/g==",
+      "cpu": [
+        "ppc64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-riscv64-gnu": {
+      "version": "4.53.2",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.53.2.tgz",
+      "integrity": "sha512-fMjKi+ojnmIvhk34gZP94vjogXNNUKMEYs+EDaB/5TG/wUkoeua7p7VCHnE6T2Tx+iaghAqQX8teQzcvrYpaQA==",
+      "cpu": [
+        "riscv64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-riscv64-musl": {
+      "version": "4.53.2",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-musl/-/rollup-linux-riscv64-musl-4.53.2.tgz",
+      "integrity": "sha512-XuGFGU+VwUUV5kLvoAdi0Wz5Xbh2SrjIxCtZj6Wq8MDp4bflb/+ThZsVxokM7n0pcbkEr2h5/pzqzDYI7cCgLQ==",
+      "cpu": [
+        "riscv64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-s390x-gnu": {
+      "version": "4.53.2",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-s390x-gnu/-/rollup-linux-s390x-gnu-4.53.2.tgz",
+      "integrity": "sha512-w6yjZF0P+NGzWR3AXWX9zc0DNEGdtvykB03uhonSHMRa+oWA6novflo2WaJr6JZakG2ucsyb+rvhrKac6NIy+w==",
+      "cpu": [
+        "s390x"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-x64-gnu": {
+      "version": "4.53.2",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.53.2.tgz",
+      "integrity": "sha512-yo8d6tdfdeBArzC7T/PnHd7OypfI9cbuZzPnzLJIyKYFhAQ8SvlkKtKBMbXDxe1h03Rcr7u++nFS7tqXz87Gtw==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-x64-musl": {
+      "version": "4.53.2",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.53.2.tgz",
+      "integrity": "sha512-ah59c1YkCxKExPP8O9PwOvs+XRLKwh/mV+3YdKqQ5AMQ0r4M4ZDuOrpWkUaqO7fzAHdINzV9tEVu8vNw48z0lA==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-openharmony-arm64": {
+      "version": "4.53.2",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-openharmony-arm64/-/rollup-openharmony-arm64-4.53.2.tgz",
+      "integrity": "sha512-4VEd19Wmhr+Zy7hbUsFZ6YXEiP48hE//KPLCSVNY5RMGX2/7HZ+QkN55a3atM1C/BZCGIgqN+xrVgtdak2S9+A==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "openharmony"
+      ]
+    },
+    "node_modules/@rollup/rollup-win32-arm64-msvc": {
+      "version": "4.53.2",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.53.2.tgz",
+      "integrity": "sha512-IlbHFYc/pQCgew/d5fslcy1KEaYVCJ44G8pajugd8VoOEI8ODhtb/j8XMhLpwHCMB3yk2J07ctup10gpw2nyMA==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ]
+    },
+    "node_modules/@rollup/rollup-win32-ia32-msvc": {
+      "version": "4.53.2",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.53.2.tgz",
+      "integrity": "sha512-lNlPEGgdUfSzdCWU176ku/dQRnA7W+Gp8d+cWv73jYrb8uT7HTVVxq62DUYxjbaByuf1Yk0RIIAbDzp+CnOTFg==",
+      "cpu": [
+        "ia32"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ]
+    },
+    "node_modules/@rollup/rollup-win32-x64-gnu": {
+      "version": "4.53.2",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-gnu/-/rollup-win32-x64-gnu-4.53.2.tgz",
+      "integrity": "sha512-S6YojNVrHybQis2lYov1sd+uj7K0Q05NxHcGktuMMdIQ2VixGwAfbJ23NnlvvVV1bdpR2m5MsNBViHJKcA4ADw==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ]
+    },
+    "node_modules/@rollup/rollup-win32-x64-msvc": {
+      "version": "4.53.2",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.53.2.tgz",
+      "integrity": "sha512-k+/Rkcyx//P6fetPoLMb8pBeqJBNGx81uuf7iljX9++yNBVRDQgD04L+SVXmXmh5ZP4/WOp4mWF0kmi06PW2tA==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ]
+    },
+    "node_modules/@types/estree": {
+      "version": "1.0.8",
+      "resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.8.tgz",
+      "integrity": "sha512-dWHzHa2WqEXI/O1E9OjrocMTKJl2mSrEolh1Iomrv6U+JuNwaHXsXx9bLu5gG7BUWFIN0skIQJQ/L1rIex4X6w==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/esbuild": {
+      "version": "0.25.12",
+      "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.25.12.tgz",
+      "integrity": "sha512-bbPBYYrtZbkt6Os6FiTLCTFxvq4tt3JKall1vRwshA3fdVztsLAatFaZobhkBC8/BrPetoa0oksYoKXoG4ryJg==",
+      "dev": true,
+      "hasInstallScript": true,
+      "license": "MIT",
+      "bin": {
+        "esbuild": "bin/esbuild"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "optionalDependencies": {
+        "@esbuild/aix-ppc64": "0.25.12",
+        "@esbuild/android-arm": "0.25.12",
+        "@esbuild/android-arm64": "0.25.12",
+        "@esbuild/android-x64": "0.25.12",
+        "@esbuild/darwin-arm64": "0.25.12",
+        "@esbuild/darwin-x64": "0.25.12",
+        "@esbuild/freebsd-arm64": "0.25.12",
+        "@esbuild/freebsd-x64": "0.25.12",
+        "@esbuild/linux-arm": "0.25.12",
+        "@esbuild/linux-arm64": "0.25.12",
+        "@esbuild/linux-ia32": "0.25.12",
+        "@esbuild/linux-loong64": "0.25.12",
+        "@esbuild/linux-mips64el": "0.25.12",
+        "@esbuild/linux-ppc64": "0.25.12",
+        "@esbuild/linux-riscv64": "0.25.12",
+        "@esbuild/linux-s390x": "0.25.12",
+        "@esbuild/linux-x64": "0.25.12",
+        "@esbuild/netbsd-arm64": "0.25.12",
+        "@esbuild/netbsd-x64": "0.25.12",
+        "@esbuild/openbsd-arm64": "0.25.12",
+        "@esbuild/openbsd-x64": "0.25.12",
+        "@esbuild/openharmony-arm64": "0.25.12",
+        "@esbuild/sunos-x64": "0.25.12",
+        "@esbuild/win32-arm64": "0.25.12",
+        "@esbuild/win32-ia32": "0.25.12",
+        "@esbuild/win32-x64": "0.25.12"
+      }
+    },
+    "node_modules/fdir": {
+      "version": "6.5.0",
+      "resolved": "https://registry.npmjs.org/fdir/-/fdir-6.5.0.tgz",
+      "integrity": "sha512-tIbYtZbucOs0BRGqPJkshJUYdL+SDH7dVM8gjy+ERp3WAUjLEFJE+02kanyHtwjWOnwrKYBiwAmM0p4kLJAnXg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12.0.0"
+      },
+      "peerDependencies": {
+        "picomatch": "^3 || ^4"
+      },
+      "peerDependenciesMeta": {
+        "picomatch": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/fsevents": {
+      "version": "2.3.3",
+      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz",
+      "integrity": "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==",
+      "dev": true,
+      "hasInstallScript": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": "^8.16.0 || ^10.6.0 || >=11.0.0"
+      }
+    },
+    "node_modules/nanoid": {
+      "version": "3.3.11",
+      "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.11.tgz",
+      "integrity": "sha512-N8SpfPUnUp1bK+PMYW8qSWdl9U+wwNWI4QKxOYDy9JAro3WMX7p2OeVRF9v+347pnakNevPmiHhNmZ2HbFA76w==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/ai"
+        }
+      ],
+      "license": "MIT",
+      "bin": {
+        "nanoid": "bin/nanoid.cjs"
+      },
+      "engines": {
+        "node": "^10 || ^12 || ^13.7 || ^14 || >=15.0.1"
+      }
+    },
+    "node_modules/picocolors": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.1.1.tgz",
+      "integrity": "sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA==",
+      "dev": true,
+      "license": "ISC"
+    },
+    "node_modules/picomatch": {
+      "version": "4.0.3",
+      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.3.tgz",
+      "integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/jonschlinkert"
+      }
+    },
+    "node_modules/postcss": {
+      "version": "8.5.6",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.6.tgz",
+      "integrity": "sha512-3Ybi1tAuwAP9s0r1UQ2J4n5Y0G05bJkpUIO0/bI9MhwmD70S5aTWbXGBwxHrelT+XM1k6dM0pk+SwNkpTRN7Pg==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/postcss/"
+        },
+        {
+          "type": "tidelift",
+          "url": "https://tidelift.com/funding/github/npm/postcss"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/ai"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "nanoid": "^3.3.11",
+        "picocolors": "^1.1.1",
+        "source-map-js": "^1.2.1"
+      },
+      "engines": {
+        "node": "^10 || ^12 || >=14"
+      }
+    },
+    "node_modules/rollup": {
+      "version": "4.53.2",
+      "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.53.2.tgz",
+      "integrity": "sha512-MHngMYwGJVi6Fmnk6ISmnk7JAHRNF0UkuucA0CUW3N3a4KnONPEZz+vUanQP/ZC/iY1Qkf3bwPWzyY84wEks1g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@types/estree": "1.0.8"
+      },
+      "bin": {
+        "rollup": "dist/bin/rollup"
+      },
+      "engines": {
+        "node": ">=18.0.0",
+        "npm": ">=8.0.0"
+      },
+      "optionalDependencies": {
+        "@rollup/rollup-android-arm-eabi": "4.53.2",
+        "@rollup/rollup-android-arm64": "4.53.2",
+        "@rollup/rollup-darwin-arm64": "4.53.2",
+        "@rollup/rollup-darwin-x64": "4.53.2",
+        "@rollup/rollup-freebsd-arm64": "4.53.2",
+        "@rollup/rollup-freebsd-x64": "4.53.2",
+        "@rollup/rollup-linux-arm-gnueabihf": "4.53.2",
+        "@rollup/rollup-linux-arm-musleabihf": "4.53.2",
+        "@rollup/rollup-linux-arm64-gnu": "4.53.2",
+        "@rollup/rollup-linux-arm64-musl": "4.53.2",
+        "@rollup/rollup-linux-loong64-gnu": "4.53.2",
+        "@rollup/rollup-linux-ppc64-gnu": "4.53.2",
+        "@rollup/rollup-linux-riscv64-gnu": "4.53.2",
+        "@rollup/rollup-linux-riscv64-musl": "4.53.2",
+        "@rollup/rollup-linux-s390x-gnu": "4.53.2",
+        "@rollup/rollup-linux-x64-gnu": "4.53.2",
+        "@rollup/rollup-linux-x64-musl": "4.53.2",
+        "@rollup/rollup-openharmony-arm64": "4.53.2",
+        "@rollup/rollup-win32-arm64-msvc": "4.53.2",
+        "@rollup/rollup-win32-ia32-msvc": "4.53.2",
+        "@rollup/rollup-win32-x64-gnu": "4.53.2",
+        "@rollup/rollup-win32-x64-msvc": "4.53.2",
+        "fsevents": "~2.3.2"
+      }
+    },
+    "node_modules/source-map-js": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.1.tgz",
+      "integrity": "sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==",
+      "dev": true,
+      "license": "BSD-3-Clause",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/three": {
+      "version": "0.181.1",
+      "resolved": "https://registry.npmjs.org/three/-/three-0.181.1.tgz",
+      "integrity": "sha512-bz9xZUQMw3pJbjKy7roiwXWgAp+oVUa+4k5o0oBAQ+IFJuru1xzvtk63h6k72XZanXS/SgoEhV6927Vgazyq2w==",
+      "license": "MIT"
+    },
+    "node_modules/tinyglobby": {
+      "version": "0.2.15",
+      "resolved": "https://registry.npmjs.org/tinyglobby/-/tinyglobby-0.2.15.tgz",
+      "integrity": "sha512-j2Zq4NyQYG5XMST4cbs02Ak8iJUdxRM0XI5QyxXuZOzKOINmWurp3smXu3y5wDcJrptwpSjgXHzIQxR0omXljQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "fdir": "^6.5.0",
+        "picomatch": "^4.0.3"
+      },
+      "engines": {
+        "node": ">=12.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/SuperchupuDev"
+      }
+    },
+    "node_modules/vite": {
+      "version": "7.2.2",
+      "resolved": "https://registry.npmjs.org/vite/-/vite-7.2.2.tgz",
+      "integrity": "sha512-BxAKBWmIbrDgrokdGZH1IgkIk/5mMHDreLDmCJ0qpyJaAteP8NvMhkwr/ZCQNqNH97bw/dANTE9PDzqwJghfMQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "esbuild": "^0.25.0",
+        "fdir": "^6.5.0",
+        "picomatch": "^4.0.3",
+        "postcss": "^8.5.6",
+        "rollup": "^4.43.0",
+        "tinyglobby": "^0.2.15"
+      },
+      "bin": {
+        "vite": "bin/vite.js"
+      },
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      },
+      "funding": {
+        "url": "https://github.com/vitejs/vite?sponsor=1"
+      },
+      "optionalDependencies": {
+        "fsevents": "~2.3.3"
+      },
+      "peerDependencies": {
+        "@types/node": "^20.19.0 || >=22.12.0",
+        "jiti": ">=1.21.0",
+        "less": "^4.0.0",
+        "lightningcss": "^1.21.0",
+        "sass": "^1.70.0",
+        "sass-embedded": "^1.70.0",
+        "stylus": ">=0.54.8",
+        "sugarss": "^5.0.0",
+        "terser": "^5.16.0",
+        "tsx": "^4.8.1",
+        "yaml": "^2.4.2"
+      },
+      "peerDependenciesMeta": {
+        "@types/node": {
+          "optional": true
+        },
+        "jiti": {
+          "optional": true
+        },
+        "less": {
+          "optional": true
+        },
+        "lightningcss": {
+          "optional": true
+        },
+        "sass": {
+          "optional": true
+        },
+        "sass-embedded": {
+          "optional": true
+        },
+        "stylus": {
+          "optional": true
+        },
+        "sugarss": {
+          "optional": true
+        },
+        "terser": {
+          "optional": true
+        },
+        "tsx": {
+          "optional": true
+        },
+        "yaml": {
+          "optional": true
+        }
+      }
+    }
+  }
+}
diff --git a/tv-player/package.json b/tv-player/package.json
new file mode 100644
index 0000000..678457d
--- /dev/null
+++ b/tv-player/package.json
@@ -0,0 +1,17 @@
+{
+  "name": "tv-player",
+  "version": "1.0.0",
+  "description": "",
+  "main": "index.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "author": "",
+  "license": "ISC",
+  "devDependencies": {
+    "vite": "^7.2.2"
+  },
+  "dependencies": {
+    "three": "^0.181.1"
+  }
+}
diff --git a/tv-player/src/EffectsManager.js b/tv-player/src/EffectsManager.js
index cd5366a..96f2db6 100644
--- a/tv-player/src/EffectsManager.js
+++ b/tv-player/src/EffectsManager.js
@@ -1,4 +1,7 @@
-class EffectsManager {
+import { DustEffect } from './effects_dust.js';
+import { FliesEffect } from './effects_flies.js';
+
+export class EffectsManager {
     constructor(scene) {
         this.effects = [];
         this._initializeEffects(scene);
diff --git a/tv-player/src/animate.js b/tv-player/src/animate.js
deleted file mode 100644
index 8b1434f..0000000
--- a/tv-player/src/animate.js
+++ /dev/null
@@ -1,105 +0,0 @@
-function updateCamera() {
-    const globalTime = Date.now() * 0.00005;
-    const lookAtTime = Date.now() * 0.00003;
-
-    const camAmplitude = 0.7;
-    const lookAmplitude = 0.05;
-
-    // Base Camera Position in front of the TV
-    const baseX = -0.5;
-    const baseY = 1.5;
-    const baseZ = 2.5;
-
-    // Base LookAt target (Center of the screen)
-    const baseTargetX = -0.7;
-    const baseTargetY = 1.7;
-    const baseTargetZ = -0.3;
-
-    // Camera Position Offsets (Drift)
-    const camOffsetX = Math.sin(globalTime * 3.1) * camAmplitude;
-    const camOffsetY = Math.cos(globalTime * 2.5) * camAmplitude * 0.4;
-    const camOffsetZ = Math.cos(globalTime * 3.2) * camAmplitude * 1.4;
-
-    camera.position.x = baseX + camOffsetX;
-    camera.position.y = baseY + camOffsetY;
-    camera.position.z = baseZ + camOffsetZ;
-
-    // LookAt Target Offsets (Subtle Gaze Shift)
-    const lookOffsetX = Math.sin(lookAtTime * 1.5) * lookAmplitude;
-    const lookOffsetY = Math.cos(lookAtTime * 1.2) * lookAmplitude;
-
-    // Apply lookAt to the subtly shifted target
-    camera.lookAt(baseTargetX + lookOffsetX, baseTargetY + lookOffsetY, baseTargetZ);
-}
-
-function updateLampFlicker() {
-    const flickerChance = 0.995;
-    const restoreRate = 0.15;
-
-    if (Math.random() > flickerChance) {
-        // Flickers quickly to a dimmer random value (between 0.3 and 1.05)
-        let lampLightIntensity = originalLampIntensity * (0.3 + Math.random() * 0.7);
-        lampLightSpot.intensity = lampLightIntensity;
-        lampLightPoint.intensity = lampLightIntensity;
-    } else if (lampLightPoint.intensity < originalLampIntensity) {
-        // Smoothly restore original intensity
-        let lampLightIntensity = THREE.MathUtils.lerp(lampLightPoint.intensity, originalLampIntensity, restoreRate);
-        lampLightSpot.intensity = lampLightIntensity;
-        lampLightPoint.intensity = lampLightIntensity;
-    }
-}
-
-function updateScreenLight() {
-    if (isVideoLoaded && screenLight.intensity > 0) {
-        const pulseTarget = originalScreenIntensity + (Math.random() - 0.5) * screenIntensityPulse;
-        screenLight.intensity = THREE.MathUtils.lerp(screenLight.intensity, pulseTarget, 0.1);
-
-        const lightTime = Date.now() * 0.0001;
-        const radius = 0.01;
-        const centerX = 0;
-        const centerY = 1.5;
-
-        screenLight.position.x = centerX + Math.cos(lightTime) * radius;
-        screenLight.position.y = centerY + Math.sin(lightTime * 1.5) * radius * 0.5; // Slightly different freq for Y
-    }
-}
-
-function updateVideo() {
-    if (videoTexture) {
-        videoTexture.needsUpdate = true;
-    }
-}
-
-function updateVcr() {
-    const currentTime = baseTime + videoElement.currentTime;
-    if (Math.abs(currentTime - lastUpdateTime) > 0.1) {
-        updateVcrDisplay(currentTime);
-        lastUpdateTime = currentTime;
-    }
-    if (currentTime - lastBlinkToggleTime > 0.5) { // Blink every 0.5 seconds
-        blinkState = !blinkState;
-        lastBlinkToggleTime = currentTime;
-    }
-}
-
-// --- Animation Loop ---
-function animate() {
-    requestAnimationFrame(animate);
-
-    effectsManager.update();
-    updateCamera();
-    updateLampFlicker();
-    updateScreenLight();
-    updateVideo();
-    updateVcr();
-
-    // RENDER!
-    renderer.render(scene, camera);
-}
-
-// --- Window Resize Handler ---
-function onWindowResize() {
-    camera.aspect = window.innerWidth / window.innerHeight;
-    camera.updateProjectionMatrix();
-    renderer.setSize(window.innerWidth, window.innerHeight);
-}
\ No newline at end of file
diff --git a/tv-player/src/core/animate.js b/tv-player/src/core/animate.js
new file mode 100644
index 0000000..caabe07
--- /dev/null
+++ b/tv-player/src/core/animate.js
@@ -0,0 +1,110 @@
+import * as THREE from 'three';
+import { state } from '../state.js';
+import { updateVcrDisplay } from '../vcr-display.js';
+
+
+function updateCamera() {
+    const globalTime = Date.now() * 0.00005;
+    const lookAtTime = Date.now() * 0.00003;
+
+    const camAmplitude = 0.7;
+    const lookAmplitude = 0.05;
+
+    // Base Camera Position in front of the TV
+    const baseX = -0.5;
+    const baseY = 1.5;
+    const baseZ = 2.5;
+
+    // Base LookAt target (Center of the screen)
+    const baseTargetX = -0.7;
+    const baseTargetY = 1.7;
+    const baseTargetZ = -0.3;
+
+    // Camera Position Offsets (Drift)
+    const camOffsetX = Math.sin(globalTime * 3.1) * camAmplitude;
+    const camOffsetY = Math.cos(globalTime * 2.5) * camAmplitude * 0.4;
+    const camOffsetZ = Math.cos(globalTime * 3.2) * camAmplitude * 1.4;
+
+    state.camera.position.x = baseX + camOffsetX;
+    state.camera.position.y = baseY + camOffsetY;
+    state.camera.position.z = baseZ + camOffsetZ;
+
+    // LookAt Target Offsets (Subtle Gaze Shift)
+    const lookOffsetX = Math.sin(lookAtTime * 1.5) * lookAmplitude;
+    const lookOffsetY = Math.cos(lookAtTime * 1.2) * lookAmplitude;
+
+    // Apply lookAt to the subtly shifted target
+    state.camera.lookAt(baseTargetX + lookOffsetX, baseTargetY + lookOffsetY, baseTargetZ);
+}
+
+function updateLampFlicker() {
+    const flickerChance = 0.995;
+    const restoreRate = 0.15;
+
+    if (Math.random() > flickerChance) {
+        // Flickers quickly to a dimmer random value (between 0.3 and 1.05)
+        let lampLightIntensity = state.originalLampIntensity * (0.3 + Math.random() * 0.7);
+        state.lampLightSpot.intensity = lampLightIntensity;
+        state.lampLightPoint.intensity = lampLightIntensity;
+    } else if (state.lampLightPoint.intensity < state.originalLampIntensity) {
+        // Smoothly restore original intensity
+        let lampLightIntensity = THREE.MathUtils.lerp(state.lampLightPoint.intensity, state.originalLampIntensity, restoreRate);
+        state.lampLightSpot.intensity = lampLightIntensity;
+        state.lampLightPoint.intensity = lampLightIntensity;
+    }
+}
+
+function updateScreenLight() {
+    if (state.isVideoLoaded && state.screenLight.intensity > 0) {
+        const pulseTarget = state.originalScreenIntensity + (Math.random() - 0.5) * state.screenIntensityPulse;
+        state.screenLight.intensity = THREE.MathUtils.lerp(state.screenLight.intensity, pulseTarget, 0.1);
+
+        const lightTime = Date.now() * 0.0001;
+        const radius = 0.01;
+        const centerX = 0;
+        const centerY = 1.5;
+
+        state.screenLight.position.x = centerX + Math.cos(lightTime) * radius;
+        state.screenLight.position.y = centerY + Math.sin(lightTime * 1.5) * radius * 0.5; // Slightly different freq for Y
+    }
+}
+
+function updateVideo() {
+    if (state.videoTexture) {
+        state.videoTexture.needsUpdate = true;
+    }
+}
+
+function updateVcr() {
+    const currentTime = state.baseTime + state.videoElement.currentTime;
+    if (Math.abs(currentTime - state.lastUpdateTime) > 0.1) {
+        updateVcrDisplay(currentTime);
+        state.lastUpdateTime = currentTime;
+    }
+    if (currentTime - state.lastBlinkToggleTime > 0.5) { // Blink every 0.5 seconds
+        state.blinkState = !state.blinkState;
+        state.lastBlinkToggleTime = currentTime;
+    }
+}
+
+// --- Animation Loop ---
+export function animate() {
+    requestAnimationFrame(animate);
+
+    state.effectsManager.update();
+    updateCamera();
+    updateLampFlicker();
+    updateScreenLight();
+    updateVideo();
+    updateVcr();
+
+    // RENDER!
+    state.renderer.render(state.scene, state.camera);
+}
+
+// --- Window Resize Handler ---
+export function onWindowResize() {
+    state.camera.aspect = window.innerWidth / window.innerHeight;
+    state.camera.updateProjectionMatrix();
+    state.renderer.setSize(window.innerWidth, window.innerHeight);
+}
\ No newline at end of file
diff --git a/tv-player/src/core/init.js b/tv-player/src/core/init.js
new file mode 100644
index 0000000..88a2f7b
--- /dev/null
+++ b/tv-player/src/core/init.js
@@ -0,0 +1,62 @@
+import * as THREE from 'three';
+import { state, initState } from '../state.js';
+import { EffectsManager } from '../EffectsManager.js';
+import { createSceneObjects } from '../scene.js';
+import { animate, onWindowResize } from './animate.js';
+import { loadVideoFile, playNextVideo } from '../video-player.js';
+
+// --- Initialization ---
+export function init() {
+    initState();
+
+    // 1. Scene Setup (Dark, Ambient)
+    state.scene = new THREE.Scene();
+    state.scene.background = new THREE.Color(0x000000); 
+
+    // 2. Camera Setup
+    const FOV = 65;
+    state.camera = new THREE.PerspectiveCamera(FOV, window.innerWidth / window.innerHeight, 0.1, 1000);
+    state.camera.position.set(0, 1.5, 4);
+    
+    // 3. Renderer Setup
+    state.renderer = new THREE.WebGLRenderer({ antialias: true });
+    state.renderer.setSize(window.innerWidth, window.innerHeight);
+    state.renderer.setPixelRatio(window.devicePixelRatio);
+    // Enable shadows on the renderer
+    state.renderer.shadowMap.enabled = true;
+    state.renderer.shadowMap.type = THREE.PCFSoftShadowMap; // Softer shadows
+    
+    state.container.appendChild(state.renderer.domElement);
+
+    // 5. Build the entire scene with TV and surrounding objects
+    createSceneObjects();
+
+    // 6. Initialize all visual effects via the manager
+    state.effectsManager = new EffectsManager(state.scene);
+
+    // --- 8. Debug Visualization Helpers ---
+    // Visual aids for the light source positions
+    if (state.debugLight && THREE.PointLightHelper) {
+        const screenHelper = new THREE.PointLightHelper(state.screenLight, 0.1, 0xff0000); // Red for screen
+        state.scene.add(screenHelper);
+
+        // Lamp Helper will now work since lampLight is added to the scene
+        const lampHelperPoint = new THREE.PointLightHelper(state.lampLightPoint, 0.1, 0x00ff00); // Green for lamp
+        state.scene.add(lampHelperPoint);
+    }
+    
+    // 9. Event Listeners
+    window.addEventListener('resize', onWindowResize, false);
+    state.fileInput.addEventListener('change', loadVideoFile); 
+    
+    // Button logic
+    state.loadTapeButton.addEventListener('click', () => {
+        state.fileInput.click(); 
+    });
+    
+    // Auto-advance to the next video when the current one finishes.
+    state.videoElement.addEventListener('ended', playNextVideo);
+    
+    // Start the animation loop
+    animate();
+}
diff --git a/tv-player/src/effects_dust.js b/tv-player/src/effects_dust.js
index c298278..e407bbc 100644
--- a/tv-player/src/effects_dust.js
+++ b/tv-player/src/effects_dust.js
@@ -1,4 +1,6 @@
-class DustEffect {
+import * as THREE from 'three';
+
+export class DustEffect {
     constructor(scene) {
         this.dust = null;
         this._create(scene);
diff --git a/tv-player/src/effects_flies.js b/tv-player/src/effects_flies.js
index 0090889..85ca40f 100644
--- a/tv-player/src/effects_flies.js
+++ b/tv-player/src/effects_flies.js
@@ -1,6 +1,17 @@
+import * as THREE from 'three';
+import { state } from './state.js';
+import { degToRad } from './utils.js';
+
 const FLIES_COUNT = 2;
 
-class FliesEffect {
+// --- Configuration ---
+const FLIGHT_HEIGHT_MIN = 0.5; // Min height for flying
+const FLIGHT_HEIGHT_MAX = 2;//state.roomHeight * 0.9; // Max height for flying
+const FLY_FLIGHT_SPEED_FACTOR = 0.01; // How quickly 't' increases per frame
+const FLY_WAIT_BASE = 1000;
+const FLY_LAND_CHANCE = 0.3;
+
+export class FliesEffect {
     constructor(scene) {
         this.flies = [];
         this._setupFlies(scene);
@@ -8,9 +19,9 @@ class FliesEffect {
 
     _randomFlyTarget() {
         return new THREE.Vector3(
-            (Math.random() - 0.5) * (ROOM_SIZE - 1),
+            (Math.random() - 0.5) * (state.roomSize - 1),
             FLIGHT_HEIGHT_MIN + Math.random() * (FLIGHT_HEIGHT_MAX - FLIGHT_HEIGHT_MIN),
-            (Math.random() - 0.5) * (ROOM_SIZE - 1)
+            (Math.random() - 0.5) * (state.roomSize - 1)
         );
     }
 
@@ -86,8 +97,8 @@ class FliesEffect {
                     }
 
                     if (data.landCheckTimer <= 0 && Math.random() > FLY_LAND_CHANCE) {
-                        raycaster.set(fly.position, new THREE.Vector3(0, -1, 0));
-                        const intersects = raycaster.intersectObjects(landingSurfaces, false);
+                        state.raycaster.set(fly.position, new THREE.Vector3(0, -1, 0));
+                        const intersects = state.raycaster.intersectObjects(state.landingSurfaces, false);
 
                         if (intersects.length > 0) {
                             const intersect = intersects[0];
diff --git a/tv-player/src/init.js b/tv-player/src/init.js
deleted file mode 100644
index 99cf6cd..0000000
--- a/tv-player/src/init.js
+++ /dev/null
@@ -1,67 +0,0 @@
-// --- Initialization ---
-function init() {
-    // 1. Scene Setup (Dark, Ambient)
-    scene = new THREE.Scene();
-    scene.background = new THREE.Color(0x000000); 
-
-    // 2. Camera Setup
-    const FOV = 65;
-    camera = new THREE.PerspectiveCamera(FOV, window.innerWidth / window.innerHeight, 0.1, 1000);
-    camera.position.set(0, 1.5, 4);
-    
-    // 3. Renderer Setup
-    renderer = new THREE.WebGLRenderer({ antialias: true });
-    renderer.setSize(window.innerWidth, window.innerHeight);
-    renderer.setPixelRatio(window.devicePixelRatio);
-    // Enable shadows on the renderer
-    renderer.shadowMap.enabled = true;
-    renderer.shadowMap.type = THREE.PCFSoftShadowMap; // Softer shadows
-    
-    container.appendChild(renderer.domElement);
-
-    // 4. Lighting (Minimal and focused)
-    const ambientLight = new THREE.AmbientLight(0x111111); 
-    scene.add(ambientLight);
-
-    const roomLight = new THREE.PointLight(0xffaa55, 0.05, roomSize); 
-    roomLight.position.set(0, 1.8, 0); 
-    scene.add(roomLight);
-
-    // 5. Build the entire scene with TV and surrounding objects
-    createSceneObjects();
-
-    // 6. Initialize all visual effects via the manager
-    effectsManager = new EffectsManager(scene);
-    
-    // 7. Create the Room Walls and Ceiling
-    createRoomWalls();
-
-    // --- 8. Debug Visualization Helpers ---
-    // Visual aids for the light source positions
-    if (debugLight && THREE.PointLightHelper) {
-        const screenHelper = new THREE.PointLightHelper(screenLight, 0.1, 0xff0000); // Red for screen
-        scene.add(screenHelper);
-
-        // Lamp Helper will now work since lampLight is added to the scene
-        const lampHelperPoint = new THREE.PointLightHelper(lampLightPoint, 0.1, 0x00ff00); // Green for lamp
-        scene.add(lampHelperPoint);
-    }
-    
-    // 9. Event Listeners
-    window.addEventListener('resize', onWindowResize, false);
-    fileInput.addEventListener('change', loadVideoFile); 
-    
-    // Button logic
-    loadTapeButton.addEventListener('click', () => {
-        fileInput.click(); 
-    });
-    
-    // Auto-advance to the next video when the current one finishes.
-    videoElement.addEventListener('ended', playNextVideo);
-    
-    // Start the animation loop
-    animate();
-}
-
-// Start everything on window load
-window.onload = init;
diff --git a/tv-player/src/main.js b/tv-player/src/main.js
new file mode 100644
index 0000000..5d65453
--- /dev/null
+++ b/tv-player/src/main.js
@@ -0,0 +1,6 @@
+import * as THREE from 'three';
+import './tailwind-config.js';
+import { init } from './core/init.js';
+
+// Start everything
+init();
\ No newline at end of file
diff --git a/tv-player/src/scene.js b/tv-player/src/scene.js
index c5afa57..80ae955 100644
--- a/tv-player/src/scene.js
+++ b/tv-player/src/scene.js
@@ -1,6 +1,11 @@
+import * as THREE from 'three';
+import { state } from './state.js';
+import { getRandomColor, seededRandom } from './utils.js';
+import { createVcrDisplay } from './vcr-display.js';
+
 // --- Room Walls Function ---
 function createRoomWalls() {
-    const wallTexture = loader.load('./textures/wall.jpg');
+    const wallTexture = state.loader.load('/textures/wall.jpg');
     wallTexture.wrapS = THREE.RepeatWrapping;
     wallTexture.wrapT = THREE.RepeatWrapping;
     
@@ -13,34 +18,34 @@ function createRoomWalls() {
     });
     
     // 1. Back Wall (behind the TV)
-    const backWall = new THREE.Mesh(new THREE.PlaneGeometry(roomSize, roomHeight), wallMaterial);
-    backWall.position.set(0, roomHeight / 2, -roomSize / 2);
+    const backWall = new THREE.Mesh(new THREE.PlaneGeometry(state.roomSize, state.roomHeight), wallMaterial);
+    backWall.position.set(0, state.roomHeight / 2, -state.roomSize / 2);
     backWall.receiveShadow = true; 
-    scene.add(backWall);
+    state.scene.add(backWall);
 
     // 2. Front Wall (behind the camera)
-    const frontWall = new THREE.Mesh(new THREE.PlaneGeometry(roomSize, roomHeight), wallMaterial);
-    frontWall.position.set(0, roomHeight / 2, roomSize / 2);
+    const frontWall = new THREE.Mesh(new THREE.PlaneGeometry(state.roomSize, state.roomHeight), wallMaterial);
+    frontWall.position.set(0, state.roomHeight / 2, state.roomSize / 2);
     frontWall.rotation.y = Math.PI; 
     frontWall.receiveShadow = true;
-    scene.add(frontWall);
+    state.scene.add(frontWall);
     
     // 3. Left Wall
-    const leftWall = new THREE.Mesh(new THREE.PlaneGeometry(roomSize, roomHeight), wallMaterial);
+    const leftWall = new THREE.Mesh(new THREE.PlaneGeometry(state.roomSize, state.roomHeight), wallMaterial);
     leftWall.rotation.y = Math.PI / 2; 
-    leftWall.position.set(-roomSize / 2, roomHeight / 2, 0);
+    leftWall.position.set(-state.roomSize / 2, state.roomHeight / 2, 0);
     leftWall.receiveShadow = true;
-    scene.add(leftWall);
+    state.scene.add(leftWall);
 
     // 4. Right Wall
-    const rightWall = new THREE.Mesh(new THREE.PlaneGeometry(roomSize, roomHeight), wallMaterial);
+    const rightWall = new THREE.Mesh(new THREE.PlaneGeometry(state.roomSize, state.roomHeight), wallMaterial);
     rightWall.rotation.y = -Math.PI / 2; 
-    rightWall.position.set(roomSize / 2, roomHeight / 2, 0);
+    rightWall.position.set(state.roomSize / 2, state.roomHeight / 2, 0);
     rightWall.receiveShadow = true;
-    scene.add(rightWall);
+    state.scene.add(rightWall);
 
     // 5. Ceiling 
-    const ceilingGeometry = new THREE.PlaneGeometry(roomSize, roomSize);
+    const ceilingGeometry = new THREE.PlaneGeometry(state.roomSize, state.roomSize);
     const ceilingTexture = wallTexture; 
     ceilingTexture.repeat.set(4, 4); 
     // USING MeshPhongMaterial
@@ -53,16 +58,16 @@ function createRoomWalls() {
     
     const ceiling = new THREE.Mesh(ceilingGeometry, ceilingMaterial);
     ceiling.rotation.x = Math.PI / 2; 
-    ceiling.position.set(0, roomHeight, 0);
+    ceiling.position.set(0, state.roomHeight, 0);
     ceiling.receiveShadow = true; 
-    scene.add(ceiling);
+    state.scene.add(ceiling);
     
     // --- 6. Add a Window to the Back Wall ---
     const windowWidth = 1.5;
     const windowHeight = 1.2;
     const windowGeometry = new THREE.PlaneGeometry(windowWidth, windowHeight);
 
-    const nightSkyMaterial = new THREE.MeshBasicMaterial({ 
+    const nightSkyMaterial = new THREE.MeshPhongMaterial({ 
         color: 0x0a1a3a, 
         emissive: 0x0a1a3a, 
         emissiveIntensity: 0.5,
@@ -70,13 +75,13 @@ function createRoomWalls() {
     });
     const windowPane = new THREE.Mesh(windowGeometry, nightSkyMaterial);
 
-    const windowZ = -roomSize / 2 + 0.001; 
-    windowPane.position.set(-3.5, roomHeight * 0.5 + 1.5, windowZ);
-    scene.add(windowPane);
+    const windowZ = -state.roomSize / 2 + 0.001; 
+    windowPane.position.set(-3.5, state.roomHeight * 0.5 + 1.5, windowZ);
+    state.scene.add(windowPane);
 }
 
 function createBookshelf(x, z, rotationY, uniqueSeed) {
-    seed = uniqueSeed; // Reset seed for this specific shelf instance
+    state.seed = uniqueSeed; // Reset seed for this specific shelf instance
 
     const shelfHeight = 2.2;
     const shelfDepth = 0.35;
@@ -126,7 +131,7 @@ function createBookshelf(x, z, rotationY, uniqueSeed) {
     topPanel.castShadow = true;
     shelfGroup.add(topPanel);
 
-    landingSurfaces.push(topPanel);
+    state.landingSurfaces.push(topPanel);
 
     // 2. Individual Shelves & Books
     const internalHeight = shelfHeight - (2 * woodThickness);
@@ -185,7 +190,7 @@ function createBookshelf(x, z, rotationY, uniqueSeed) {
         }
     }
 
-    scene.add(shelfGroup);
+    state.scene.add(shelfGroup);
 }
 
 function createDoor(x, z, rotY) {
@@ -224,7 +229,7 @@ function createDoor(x, z, rotY) {
     knob.castShadow = true;
     doorGroup.add(knob);
 
-    scene.add(doorGroup);
+    state.scene.add(doorGroup);
 }
 
 // --- VCR Model Function ---
@@ -267,8 +272,8 @@ function createVcr() {
     vcrGroup.position.set(0, 0.1, 0); // Position the whole VCR slightly above the floor
     
     // Light from the VCR display itself
-    vcrDisplayLight = new THREE.PointLight(0x00ff44, 0.5, 1);
-    vcrDisplayLight.position.set(0.3, 0.03, 0.35 + 0.05); // Move light slightly closer to VCR surface
+    const vcrDisplayLight = new THREE.PointLight(0x00ff44, 0.03, 1.8);
+    vcrDisplayLight.position.set(0.23, 0.03, 0.35 + 0.03);
     vcrDisplayLight.castShadow = true;
     vcrDisplayLight.shadow.mapSize.width = 256;
     vcrDisplayLight.shadow.mapSize.height = 256;
@@ -413,42 +418,42 @@ function createTvSet(x, z, rotY) {
     screenGeometry.rotateY(-Math.PI/2);
 
     const screenMaterial = new THREE.MeshBasicMaterial({ color: 0x000000 });
-    tvScreen = new THREE.Mesh(screenGeometry, screenMaterial);
+    state.tvScreen = new THREE.Mesh(screenGeometry, screenMaterial);
     
     // Position the curved screen
-    tvScreen.position.set(0.0, 1.5, -2.1); 
-    tvScreen.material = new THREE.MeshPhongMaterial({
+    state.tvScreen.position.set(0.0, 1.5, -2.1); 
+    state.tvScreen.material = new THREE.MeshPhongMaterial({
         color: 0x0a0a0a, // Deep black
         shininess: 5,
         specular: 0x111111
     });
-    tvScreen.material.needsUpdate = true;
-    tvGroup.add(tvScreen);
+    state.tvScreen.material.needsUpdate = true;
+    tvGroup.add(state.tvScreen);
 
     tvGroup.position.set(x, 0, z);
     tvGroup.rotation.y = rotY;
 
     // Light from the screen (initially low intensity, will increase when video loads)
-    screenLight = new THREE.PointLight(0xffffff, 0, 10); 
-    screenLight.position.set(0, 1.5, 1.0); 
+    state.screenLight = new THREE.PointLight(0xffffff, 0, 10); 
+    state.screenLight.position.set(0, 1.5, 1.0); 
     // Screen light casts shadows
-    screenLight.castShadow = true;
-    screenLight.shadow.mapSize.width = 1024;
-    screenLight.shadow.mapSize.height = 1024;
-    screenLight.shadow.camera.near = 0.2;
-    screenLight.shadow.camera.far = 5;
-    tvGroup.add(screenLight);
+    state.screenLight.castShadow = true;
+    state.screenLight.shadow.mapSize.width = 1024;
+    state.screenLight.shadow.mapSize.height = 1024;
+    state.screenLight.shadow.camera.near = 0.2;
+    state.screenLight.shadow.camera.far = 5;
+    tvGroup.add(state.screenLight);
 
     // -- VCR --
     const vcr = createVcr();
     vcr.position.set(-0.3, 0.6, 0.05);
     tvGroup.add(vcr);
 
-    scene.add(tvGroup);
+    state.scene.add(tvGroup);
 }
 
 // --- Scene Modeling Function ---
-function createSceneObjects() {
+export function createSceneObjects() {
     // --- Materials (MeshPhongMaterial) ---
     const darkWood = new THREE.MeshPhongMaterial({ color: 0x3d352e, shininess: 10 });
     const darkMetal = new THREE.MeshPhongMaterial({ 
@@ -460,22 +465,33 @@ function createSceneObjects() {
     
     // --- 1. Floor ---
     const floorGeometry = new THREE.PlaneGeometry(20, 20);
-    const floorTexture = loader.load('./textures/floor.jpg');
+    const floorTexture = state.loader.load('/textures/floor.jpg');
     floorTexture.wrapS = THREE.RepeatWrapping;
     floorTexture.wrapT = THREE.RepeatWrapping;
-    floorTexture.repeat.set(roomSize, roomSize);
+    floorTexture.repeat.set(state.roomSize, state.roomSize);
     const floorMaterial = new THREE.MeshPhongMaterial({ map: floorTexture, color: 0x555555, shininess: 5 }); 
     const floor = new THREE.Mesh(floorGeometry, floorMaterial);
     floor.rotation.x = -Math.PI / 2;
     floor.position.y = 0;
     floor.receiveShadow = true; 
-    scene.add(floor);
+    state.scene.add(floor);
 
-    landingSurfaces.push(floor);
+    state.landingSurfaces.push(floor);
 
-    createTvSet(-roomSize/2 + 1.2, -roomSize/2 + 0.8, Math.PI * 0.1);
+    createRoomWalls();  
+    
+    // 3. Lighting (Minimal and focused)
+    const ambientLight = new THREE.AmbientLight(0x111111, 1); 
+    state.scene.add(ambientLight);
 
-    // --- 5. Lamp (On the table, right side) ---
+    const roomLight = new THREE.PointLight(0xffaa55, 0.5, state.roomSize); 
+    roomLight.position.set(0, 1.8, 0); 
+    state.scene.add(roomLight);
+
+
+    createTvSet(-state.roomSize/2 + 1.2, -state.roomSize/2 + 0.8, Math.PI * 0.1);
+
+    // --- 5. Standing Lamp ---
     const lampBase = new THREE.CylinderGeometry(0.05, 0.2, 0.1, 12);
     const lampPole = new THREE.CylinderGeometry(0.02, 0.02, 1.5, 8);
     const lampShade = new THREE.ConeGeometry(0.2, 0.4, 16);
@@ -495,34 +511,34 @@ function createSceneObjects() {
     shadeMesh.rotation.x = Math.PI;
 
     // Lamp Light (Warm Glow) - Configured to cast shadows
-    lampLightPoint = new THREE.PointLight(0xffaa00, originalLampIntensity, 4); 
-    lampLightPoint.position.set(-0.01, roomHeight-0.9, 0.01); 
-    lampLightPoint.castShadow = true;
+    state.lampLightPoint = new THREE.PointLight(0xffaa00, state.originalLampIntensity, 4); 
+    state.lampLightPoint.position.set(-0.01, state.roomHeight-0.9, 0.01); 
+    state.lampLightPoint.castShadow = true;
     // Optimization: Reduced map size and far plane to ease resource burden
-    lampLightPoint.shadow.mapSize.width = 512; 
-    lampLightPoint.shadow.mapSize.height = 512;
-    lampLightPoint.shadow.camera.near = 0.1;
-    lampLightPoint.shadow.camera.far = 4; // Matches the light's attenuation distance (4)
-    lampLightPoint.penumbra = 0.5;
+    state.lampLightPoint.shadow.mapSize.width = 512; 
+    state.lampLightPoint.shadow.mapSize.height = 512;
+    state.lampLightPoint.shadow.camera.near = 0.1;
+    state.lampLightPoint.shadow.camera.far = 4; // Matches the light's attenuation distance (4)
+    state.lampLightPoint.penumbra = 0.5;
 
-    lampLightSpot = new THREE.SpotLight(0xffaa00, originalLampIntensity, 4); 
-    lampLightSpot.position.set(-0.01, 1.0, 0.01); 
-    lampLightSpot.target.position.set(0, 5, 0);
-    lampLightSpot.castShadow = true;
+    state.lampLightSpot = new THREE.SpotLight(0xffaa00, state.originalLampIntensity, 4); 
+    state.lampLightSpot.position.set(-0.01, 1.0, 0.01); 
+    state.lampLightSpot.target.position.set(0, 5, 0);
+    state.lampLightSpot.castShadow = true;
     // Optimization: Reduced map size and far plane to ease resource burden
-    lampLightSpot.shadow.mapSize.width = 512; 
-    lampLightSpot.shadow.mapSize.height = 512;
-    lampLightSpot.shadow.camera.near = 0.1;
-    lampLightSpot.shadow.camera.far = 4; // Matches the light's attenuation distance (4)
-    lampLightSpot.penumbra = 0.5;
+    state.lampLightSpot.shadow.mapSize.width = 512; 
+    state.lampLightSpot.shadow.mapSize.height = 512;
+    state.lampLightSpot.shadow.camera.near = 0.1;
+    state.lampLightSpot.shadow.camera.far = 4; // Matches the light's attenuation distance (4)
+    state.lampLightSpot.penumbra = 1;
     
     const lampGroup = new THREE.Group();
-    lampGroup.add(baseMesh, poleMesh, shadeMesh, lampLightSpot, lampLightSpot.target, lampLightPoint);
-    lampGroup.position.set(0.8, 0.7, -roomSize/2+0.5); 
+    lampGroup.add(baseMesh, poleMesh, shadeMesh, state.lampLightSpot, state.lampLightSpot.target, state.lampLightPoint);
+    lampGroup.position.set(0.8, 0.7, -state.roomSize/2+0.5); 
 
-    scene.add(lampGroup);
+    state.scene.add(lampGroup);
 
-    landingSurfaces.push(shadeMesh);
+    state.landingSurfaces.push(shadeMesh);
 
     // --- 7. Old Camera (On the table) ---
     const cameraBody = new THREE.BoxGeometry(0.4, 0.3, 0.15);
@@ -542,7 +558,7 @@ function createSceneObjects() {
     cameraMesh.position.set(-1.7, 0.15, 0.4);
     cameraMesh.rotation.y = -Math.PI / 10;
     cameraMesh.castShadow = true; cameraMesh.receiveShadow = true;
-    scene.add(cameraMesh);
+    state.scene.add(cameraMesh);
 
     // --- 8. Pizza Box ---
     const boxGeometry = new THREE.BoxGeometry(0.5, 0.05, 0.5);
@@ -551,7 +567,7 @@ function createSceneObjects() {
     pizzaBox.position.set(-1.8, 0.025, -0.8);
     pizzaBox.rotation.y = Math.PI / 5;
     pizzaBox.castShadow = true; pizzaBox.receiveShadow = true;
-    scene.add(pizzaBox);
+    state.scene.add(pizzaBox);
 
     // --- 8. Cassette ---
     const cassetteGeometry = new THREE.BoxGeometry(0.2, 0.05, 0.45);
@@ -560,11 +576,11 @@ function createSceneObjects() {
     cassette.position.set(-0.5, 0.025, -1.4);
     cassette.rotation.y = Math.PI / 3;
     cassette.castShadow = true; cassette.receiveShadow = true;
-    scene.add(cassette);
+    state.scene.add(cassette);
 
-    createDoor(roomSize/2, -roomSize/2 * 0.5, -Math.PI/2);
-    createBookshelf(-roomSize/2 + 0.2, roomSize/2*0.2, Math.PI/2, 0);
-    createBookshelf(-roomSize/2 + 0.2, roomSize/2*0.7, Math.PI/2, 0);
-    createBookshelf(roomSize/2 * 0.7, -roomSize/2+0.3, 0, 1);
+    createDoor(state.roomSize/2, -state.roomSize/2 * 0.5, -Math.PI/2);
+    createBookshelf(-state.roomSize/2 + 0.2, state.roomSize/2*0.2, Math.PI/2, 0);
+    createBookshelf(-state.roomSize/2 + 0.2, state.roomSize/2*0.7, Math.PI/2, 0);
+    createBookshelf(state.roomSize/2 * 0.7, -state.roomSize/2+0.3, 0, 1);
 
 }
diff --git a/tv-player/src/state.js b/tv-player/src/state.js
new file mode 100644
index 0000000..59c2066
--- /dev/null
+++ b/tv-player/src/state.js
@@ -0,0 +1,50 @@
+import * as THREE from 'three';
+
+export let state = undefined;
+
+export function initState() {
+    state = {
+    // Core Three.js components
+    scene: null,
+    camera: null,
+    renderer: null,
+    tvScreen: null,
+    videoTexture: null,
+    screenLight: null,
+    lampLightPoint: null,
+    lampLightSpot: null,
+    effectsManager: null,
+
+    // VCR Display
+    lastUpdateTime: -1,
+    baseTime: 0,
+    blinkState: false,
+    lastBlinkToggleTime: 0,
+    vcrDisplayTexture: null,
+
+    // Video Playback
+    isVideoLoaded: false,
+    videoUrls: [],
+    currentVideoIndex: -1,
+
+    // Scene constants
+    originalLampIntensity: 0.3,
+    originalScreenIntensity: 0.2,
+    screenIntensityPulse: 0.2,
+    roomSize: 5,
+    roomHeight: 3,
+    debugLight: false,
+
+    // DOM Elements
+    container: document.body,
+    videoElement: document.getElementById('video'),
+    fileInput: document.getElementById('fileInput'),
+    loadTapeButton: document.getElementById('loadTapeButton'),
+
+    // Utilities
+    loader: new THREE.TextureLoader(),
+    landingSurfaces: [],
+    raycaster: new THREE.Raycaster(),
+    seed: 12345,
+    };
+}
diff --git a/tv-player/src/utils.js b/tv-player/src/utils.js
index b1024b2..77431cc 100644
--- a/tv-player/src/utils.js
+++ b/tv-player/src/utils.js
@@ -1,5 +1,8 @@
+import * as THREE from 'three';
+import { state } from './state.js';
+
 // --- Utility: Random Color (seeded) ---
-function getRandomColor() {
+export function getRandomColor() {
     const hue = seededRandom();
     const saturation = 0.6 + seededRandom() * 0.4; 
     const lightness = 0.3 + seededRandom() * 0.4; 
@@ -11,20 +14,20 @@ function getRandomColor() {
  * @param {number} degrees
  * @returns {number}
  */
-function degToRad(degrees) {
+export function degToRad(degrees) {
     return degrees * (Math.PI / 180);
 }
 
 // --- Seedable Random Number Generator (Mulberry32) ---
-function seededRandom() {
-    let t = seed += 0x6D2B79F5;
+export function seededRandom() {
+    let t = state.seed += 0x6D2B79F5;
     t = Math.imul(t ^ t >>> 15, t | 1);
     t ^= t + Math.imul(t ^ t >>> 7, t | 61);
     return ((t ^ t >>> 14) >>> 0) / 4294967296;
 }
 
 // --- Helper function to format seconds into MM:SS ---
-function formatTime(seconds) {
+export function formatTime(seconds) {
     if (isNaN(seconds) || seconds === Infinity || seconds < 0) return '--:--';
     const minutes = Math.floor(seconds / 60);
     const remainingSeconds = Math.floor(seconds % 60);
diff --git a/tv-player/src/vcr-display.js b/tv-player/src/vcr-display.js
index 7c31dc2..0e6ca74 100644
--- a/tv-player/src/vcr-display.js
+++ b/tv-player/src/vcr-display.js
@@ -1,6 +1,7 @@
-let vcrDisplayTexture;
-let blinkState = false;
-let lastBlinkToggleTime = 0;
+import * as THREE from 'three';
+import { state } from './state.js';
+import { formatTime } from './utils.js';
+
 // --- Segment Display Definitions ---
 
 // Define which segments (indexed 0-6: A, B, C, D, E, F, G) are active for each digit
@@ -151,7 +152,7 @@ function drawSegmentDisplay(ctx, timeString) {
     const currentY = SEG_PADDING; 
 
     // Draw Playback Arrow
-    if (isVideoLoaded && videoElement.readyState >= 3) {
+    if (state.isVideoLoaded && state.videoElement.readyState >= 3) {
         drawPlaybackArrow(ctx, currentX, currentY, digitHeight);
     }
     currentX += arrowWidth + arrowPadding; // Move X after arrow and its padding
@@ -160,7 +161,7 @@ function drawSegmentDisplay(ctx, timeString) {
         const char = timeString[i];
         
         if (char === ':') {
-            drawColon(ctx, currentX, currentY, digitHeight, blinkState); // Pass blinkState
+            drawColon(ctx, currentX, currentY, digitHeight, state.blinkState); // Pass blinkState
             currentX += colonWidth; 
         } else if (char >= '0' && char <= '9') {
             drawSegmentDigit(ctx, char, currentX, currentY, digitHeight);
@@ -175,7 +176,7 @@ function drawSegmentDisplay(ctx, timeString) {
 }
 
 // --- VCR Display Functions ---
-function createVcrDisplay() {
+export function createVcrDisplay() {
     const canvas = document.createElement('canvas');
     canvas.width = 160; // Increased width for arrow and better spacing
     canvas.height = 32;
@@ -184,27 +185,28 @@ function createVcrDisplay() {
     ctx.fillStyle = '#0a0a0a';
     ctx.fillRect(0, 0, canvas.width, canvas.height);
 
-    vcrDisplayTexture = new THREE.CanvasTexture(canvas);
-    vcrDisplayTexture.needsUpdate = true;
+    state.vcrDisplayTexture = new THREE.CanvasTexture(canvas);
+    state.vcrDisplayTexture.needsUpdate = true;
     
     const displayGeometry = new THREE.PlaneGeometry(0.45, 0.1); // Adjust geometry width for new canvas size
-    const displayMaterial = new THREE.MeshBasicMaterial({ 
-        map: vcrDisplayTexture, 
+    const displayMaterial = new THREE.MeshPhongMaterial({ 
+        map: state.vcrDisplayTexture, 
         side: THREE.FrontSide, 
         color: 0xffffff,
         transparent: true,
         emissive: 0x00ff44,
-        emissiveIntensity: 0.1
+        emissiveIntensity: 0.05,
+        shininess: 0
     });
     
     const displayMesh = new THREE.Mesh(displayGeometry, displayMaterial);
     return displayMesh;
 }
 
-function updateVcrDisplay(time) {
-    if (!vcrDisplayTexture) return;
+export function updateVcrDisplay(time) {
+    if (!state.vcrDisplayTexture) return;
 
-    const canvas = vcrDisplayTexture.image;
+    const canvas = state.vcrDisplayTexture.image;
     const ctx = canvas.getContext('2d');
     
     const timeString = formatTime(time);
@@ -212,5 +214,5 @@ function updateVcrDisplay(time) {
     // Uses the new segment drawing function with ghosting, including blinkState for colon
     drawSegmentDisplay(ctx, timeString);
     
-    vcrDisplayTexture.needsUpdate = true;
+    state.vcrDisplayTexture.needsUpdate = true;
 }
diff --git a/tv-player/src/video-player.js b/tv-player/src/video-player.js
index 7adde0a..09439d8 100644
--- a/tv-player/src/video-player.js
+++ b/tv-player/src/video-player.js
@@ -1,84 +1,87 @@
+import * as THREE from 'three';
+import { state } from './state.js';
+
 // --- Play video by index ---
-function playVideoByIndex(index) {
-    currentVideoIndex = index;
-    const url = videoUrls[index];
+export function playVideoByIndex(index) {
+    state.currentVideoIndex = index;
+    const url = state.videoUrls[index];
 
     // Dispose of previous texture to free resources
-    if (videoTexture) {
-        videoTexture.dispose();
-        videoTexture = null;
+    if (state.videoTexture) {
+        state.videoTexture.dispose();
+        state.videoTexture = null;
     }
 
-    if (index < 0 || index >= videoUrls.length) {
+    if (index < 0 || index >= state.videoUrls.length) {
         console.info('End of playlist reached. Reload tapes to start again.');
-        screenLight.intensity = 0.0;
-        tvScreen.material.dispose();
-        tvScreen.material = new THREE.MeshPhongMaterial({
+        state.screenLight.intensity = 0.0;
+        state.tvScreen.material.dispose();
+        state.tvScreen.material = new THREE.MeshPhongMaterial({
             color: 0x0a0a0a, // Deep black
             shininess: 5,
             specular: 0x111111
         });
-        tvScreen.material.needsUpdate = true;
-        isVideoLoaded = false;
-        lastUpdateTime = -1; // force VCR to redraw
+        state.tvScreen.material.needsUpdate = true;
+        state.isVideoLoaded = false;
+        state.lastUpdateTime = -1; // force VCR to redraw
         return;
     }
 
-    videoElement.src = url;
-    videoElement.muted = true;
-    videoElement.load();
+    state.videoElement.src = url;
+    state.videoElement.muted = true;
+    state.videoElement.load();
     
     // Set loop property: only loop if it's the only video loaded
-    videoElement.loop = false; //videoUrls.length === 1;
+    state.videoElement.loop = false; //state.videoUrls.length === 1;
 
     
-    videoElement.onloadeddata = () => {
+    state.videoElement.onloadeddata = () => {
         // 1. Create the Three.js texture
-        videoTexture = new THREE.VideoTexture(videoElement);
-        videoTexture.minFilter = THREE.LinearFilter;
-        videoTexture.magFilter = THREE.LinearFilter;
-        videoTexture.format = THREE.RGBAFormat; 
-        videoTexture.needsUpdate = true;
+        state.videoTexture = new THREE.VideoTexture(state.videoElement);
+        state.videoTexture.minFilter = THREE.LinearFilter;
+        state.videoTexture.magFilter = THREE.LinearFilter;
+        state.videoTexture.format = THREE.RGBAFormat; 
+        state.videoTexture.needsUpdate = true;
 
         // 2. Apply the video texture to the screen mesh
-        tvScreen.material.dispose();
-        tvScreen.material = new THREE.MeshBasicMaterial({ map: videoTexture });
-        tvScreen.material.needsUpdate = true; 
+        state.tvScreen.material.dispose();
+        state.tvScreen.material = new THREE.MeshBasicMaterial({ map: state.videoTexture });
+        state.tvScreen.material.needsUpdate = true; 
 
         // 3. Start playback 
-        videoElement.play().then(() => {
-            isVideoLoaded = true;
+        state.videoElement.play().then(() => {
+            state.isVideoLoaded = true;
             // Use the defined base intensity for screen glow
-            screenLight.intensity = originalScreenIntensity; 
+            state.screenLight.intensity = state.originalScreenIntensity; 
             // Initial status message with tape count
-            console.info(`Playing tape ${currentVideoIndex + 1} of ${videoUrls.length}.`);
+            console.info(`Playing tape ${state.currentVideoIndex + 1} of ${state.videoUrls.length}.`);
         }).catch(error => {
-            screenLight.intensity = originalScreenIntensity * 0.5; // Dim the light if playback fails
-            console.error(`Playback blocked for tape ${currentVideoIndex + 1}. Click Next Tape to try again.`);
+            state.screenLight.intensity = state.originalScreenIntensity * 0.5; // Dim the light if playback fails
+            console.error(`Playback blocked for tape ${state.currentVideoIndex + 1}. Click Next Tape to try again.`);
             console.error('Playback Error: Could not start video playback.', error);
         });
     };
     
-    videoElement.onerror = (e) => {
-        screenLight.intensity = 0.1; // Keep minimum intensity for shadow map
-        console.error(`Error loading tape ${currentVideoIndex + 1}.`);
+    state.videoElement.onerror = (e) => {
+        state.screenLight.intensity = 0.1; // Keep minimum intensity for shadow map
+        console.error(`Error loading tape ${state.currentVideoIndex + 1}.`);
         console.error('Video Load Error:', e);
     };
 }
 
 // --- Cycle to the next video ---
-function playNextVideo() {
+export function playNextVideo() {
     // Determine the next index, cycling back to 0 if we reach the end
-    let nextIndex = currentVideoIndex + 1;
-    if (nextIndex < videoUrls.length) {
-        baseTime += videoElement.duration;
+    let nextIndex = state.currentVideoIndex + 1;
+    if (nextIndex < state.videoUrls.length) {
+        state.baseTime += state.videoElement.duration;
     }
     playVideoByIndex(nextIndex);
 }
 
 
 // --- Video Loading Logic (handles multiple files) ---
-function loadVideoFile(event) {
+export function loadVideoFile(event) {
     const files = event.target.files;
     if (files.length === 0) {
         console.info('File selection cancelled.');
@@ -86,25 +89,25 @@ function loadVideoFile(event) {
     }
 
     // 1. Clear previous URLs and revoke object URLs to prevent memory leaks
-    videoUrls.forEach(url => URL.revokeObjectURL(url));
-    videoUrls = [];
+    state.videoUrls.forEach(url => URL.revokeObjectURL(url));
+    state.videoUrls = [];
 
     // 2. Populate the new videoUrls array
     for (let i = 0; i < files.length; i++) {
         const file = files[i];
         if (file.type.startsWith('video/')) {
-            videoUrls.push(URL.createObjectURL(file));
+            state.videoUrls.push(URL.createObjectURL(file));
         }
     }
 
-    if (videoUrls.length === 0) {
+    if (state.videoUrls.length === 0) {
         console.info('No valid video files selected.');
         return;
     }
     
     // 3. Start playback of the first video
-    console.info(`Loaded ${videoUrls.length} tapes. Starting playback...`);
-    loadTapeButton.classList.add("hidden");
+    console.info(`Loaded ${state.videoUrls.length} tapes. Starting playback...`);
+    state.loadTapeButton.classList.add("hidden");
 
     const startDelay = 5;
     console.info(`Video will start in ${startDelay} seconds.`);