Implement custom SVG play button with enhanced UX

- Replace text button with beautiful SVG play button
- Position button over center of video with responsive sizing
- Add smooth hover and click animations
- Hide button after click and enable native browser controls for 2D
- Maintain VR functionality when supported
- Add proper accessibility with aria-label
- Responsive design works on mobile and desktop

vr180-player.js

@@ -688,6 +688,18 @@ function onWindowResize() {
 	}
 }
 
+function hidePlayButton() {
+	if (playBtn) {
+		playBtn.classList.add('hidden');
+	}
+}
+
+function enableNativeControls() {
+	if (video) {
+		video.controls = true;
+	}
+}
+
 function togglePlayPause() {
 	if (!video || !video.currentSrc) return;
 	if (video.paused || video.ended) {
@@ -771,12 +783,16 @@ async function handleEnterVRButtonClick() {
 		return;
 	}
 	
+	// Hide the play button after click
+	hidePlayButton();
+	
 	// Check if VR is supported
 	if (playBtn.dataset.xrSupported === "true") {
 		// VR is supported - use VR functionality
 		await actualSessionToggle();
 	} else {
-		// VR is not supported - use regular video playback
+		// VR is not supported - use regular video playback and enable native controls
+		enableNativeControls();
 		togglePlayPause();
 	}
 }