diff --git a/VR/client/app.css b/VR/client/app.css
new file mode 100644
index 0000000..52ca42d
--- /dev/null
+++ b/VR/client/app.css
@@ -0,0 +1,87 @@
+html,
+body,
+canvas {
+ margin: 0;
+ padding: 0;
+ width: 100%;
+ height: 100%;
+ overflow: hidden;
+}
+
+#status {
+ position: fixed;
+ top: 12px;
+ left: 12px;
+ padding: 8px 12px;
+ color: #f9f9f9;
+ background: rgba(0, 0, 0, 0.6);
+ font-family: Menlo, monospace;
+ z-index: 10;
+ border-radius: 6px;
+}
+
+#start-btn {
+ position: fixed;
+ top: 52px;
+ left: 12px;
+ z-index: 10;
+ padding: 8px 12px;
+ border: 0;
+ border-radius: 6px;
+ background: #1c7ed6;
+ color: white;
+ font-family: Menlo, monospace;
+ cursor: pointer;
+}
+
+#join-panel,
+#arm-camera-panel {
+ position: fixed;
+ right: 12px;
+ z-index: 10;
+ padding: 10px;
+ border-radius: 8px;
+ background: rgba(0, 0, 0, 0.68);
+ color: #f9f9f9;
+ font-family: Menlo, monospace;
+ display: grid;
+ gap: 6px;
+ min-width: 190px;
+}
+
+#join-panel {
+ top: 12px;
+}
+
+#arm-camera-panel {
+ top: 188px;
+ display: none;
+}
+
+#join-panel select,
+#join-panel button,
+#arm-camera-panel select {
+ font-family: Menlo, monospace;
+ padding: 5px 6px;
+ border-radius: 4px;
+ border: none;
+}
+
+#join-panel button {
+ background: #2f9e44;
+ color: white;
+ cursor: pointer;
+}
+
+#spectate-btn {
+ background: #6c757d;
+}
+
+#arm-camera-btn {
+ background: #1971c2;
+}
+
+.panel-caption {
+ font-size: 12px;
+ color: #ced4da;
+}
diff --git a/VR/client/index.html b/VR/client/index.html
index 2e440f4..bd5d14f 100644
--- a/VR/client/index.html
+++ b/VR/client/index.html
@@ -5,95 +5,7 @@
SPARC VR Client
-
+