diff --git a/wbldorbits.html b/wbldorbits.html
new file mode 100644
index 0000000..fd2c43a
--- /dev/null
+++ b/wbldorbits.html
@@ -0,0 +1,221 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <title>Senthara Orbit and Rotation Visualization</title>
+  <script src="https://cdn.jsdelivr.net/npm/phaser@3.60.0/dist/phaser.js"></script>
+  <style>
+    body { margin: 0; overflow: hidden; }
+    canvas { display: block; }
+  </style>
+</head>
+<body>
+  <script>
+    // Function to calculate the current Senthara date from simulationTime (in days)
+    function getSentharaDate(simDays) {
+      // Total days per year is 396
+      const year = Math.floor(simDays / 396) + 1;
+      const dayOfYear = (Math.floor(simDays) % 396) + 1;
+      // Each season is 99 days.
+      const seasonIndex = Math.floor((dayOfYear - 1) / 99);
+      const dayOfSeason = ((dayOfYear - 1) % 99) + 1;
+      const seasons = ["Summer", "Autumn", "Winter", "Spring"];
+      return `Year ${year} - ${seasons[seasonIndex]} ${dayOfSeason}`;
+    }
+
+    // Phaser configuration (responsive)
+    const config = {
+      type: Phaser.AUTO,
+      width: window.innerWidth,
+      height: window.innerHeight,
+      backgroundColor: "#000000",
+      scene: {
+        preload: preload,
+        create: create,
+        update: update
+      },
+      scale: {
+        mode: Phaser.Scale.RESIZE
+      }
+    };
+
+    const game = new Phaser.Game(config);
+
+    let globalGraphics;
+    let dateText;
+    let simulationTime = 0; // in days (simulation time)
+    const simulationSpeed = 10; // Speed multiplier
+
+    // Orbital periods (in days)
+    const planetPeriod = 396;  // Senthara's orbit (year)
+    const planetRotationPeriod = 1; // Planet rotates fully in 1 day
+    const kerielPeriod = 27;
+    const arkaenPeriod = 82;
+    const minianPeriod = 98;
+
+    // Orbital radii (will be computed relative to window size)
+    let planetOrbitRadius, kerielOrbitRadius, arkaenOrbitRadius, minianOrbitRadius;
+
+    // Containers for planet and moons
+    let planetContainer;
+    let kerielContainer, arkaenContainer, minianContainer;
+
+    function preload() {
+      // No external assets are loaded.
+    }
+
+    function create() {
+      globalGraphics = this.add.graphics();
+
+      dateText = this.add.text(10, game.scale.height - 30, "", {
+        font: "20px Arial",
+        fill: "#ffffff"
+      });
+
+      // Calculate orbital radii based on window size.
+      recalcOrbitRadii();
+
+      // Create planet container.
+      planetContainer = this.add.container(0, 0);
+
+      // Create a Graphics object for the planet body.
+      let planetBody = this.add.graphics();
+      planetBody.fillStyle(0x00FF00, 1);
+      planetBody.fillCircle(0, 0, 12);
+      // Add a marker line (pointing to the right, 0 deg) to indicate surface rotation.
+      planetBody.lineStyle(2, 0x000000, 1);
+      planetBody.beginPath();
+      planetBody.moveTo(0, 0);
+      planetBody.lineTo(12, 0);
+      planetBody.closePath();
+      planetBody.strokePath();
+
+      // Add the planet body to the container.
+      planetContainer.add(planetBody);
+
+      // Create a night overlay that will cover the "dark" half of the planet.
+      // Draw a half-circle (180° arc) from 0 to PI.
+      let nightOverlay = this.add.graphics();
+      nightOverlay.fillStyle(0x000000, 0.5);
+      // Draw the half circle with radius 12.
+      nightOverlay.slice(0, 0, 12, 0, Math.PI, false);
+      nightOverlay.fillPath();
+      // Store it as a property for updating later.
+      planetContainer.nightOverlay = nightOverlay;
+      // Add the overlay on top of the planet.
+      planetContainer.add(nightOverlay);
+
+      // Create containers for each moon.
+      kerielContainer = createMoonContainer(this, 6, 0xFF0000); // Keriel: radius 6, red
+      arkaenContainer = createMoonContainer(this, 5, 0x0000FF); // Arkaen: radius 5, blue
+      minianContainer = createMoonContainer(this, 5, 0xFFFFFF);  // Minian: radius 5, white
+
+      // Listen for window resize events.
+      this.scale.on('resize', (gameSize) => {
+        recalcOrbitRadii();
+        dateText.setPosition(10, gameSize.height - 30);
+      });
+    }
+
+    // Helper function to create a moon container with a circular body and a marker.
+    function createMoonContainer(scene, radius, color) {
+      let moonContainer = scene.add.container(0, 0);
+      let moonBody = scene.add.graphics();
+      moonBody.fillStyle(color, 1);
+      moonBody.fillCircle(0, 0, radius);
+      // Draw a marker (line) indicating the "front" of the moon.
+      moonBody.lineStyle(2, 0x000000, 1);
+      moonBody.beginPath();
+      moonBody.moveTo(0, 0);
+      moonBody.lineTo(radius, 0);
+      moonBody.closePath();
+      moonBody.strokePath();
+      moonContainer.add(moonBody);
+      return moonContainer;
+    }
+
+    // Recalculate orbital radii based on the window size.
+    function recalcOrbitRadii() {
+      const minDim = Math.min(window.innerWidth, window.innerHeight);
+      planetOrbitRadius = minDim * 0.3;  // 30% of smaller dimension
+      kerielOrbitRadius = planetOrbitRadius * 0.25;
+      arkaenOrbitRadius = planetOrbitRadius * 0.35;
+      minianOrbitRadius = planetOrbitRadius * 0.45;
+    }
+
+    function update(time, delta) {
+      // Advance simulation time.
+      simulationTime += (delta * simulationSpeed) / 1000;
+
+      // Clear global graphics and redraw orbit paths.
+      globalGraphics.clear();
+
+      // Center of the star (sun) at center of screen.
+      const centerX = game.scale.width / 2;
+      const centerY = game.scale.height / 2;
+
+      // Draw the star.
+      globalGraphics.fillStyle(0xFFFF00, 1);
+      globalGraphics.fillCircle(centerX, centerY, 20);
+
+      // Draw Senthara's orbital path around the star.
+      globalGraphics.lineStyle(1, 0x555555, 1);
+      globalGraphics.strokeCircle(centerX, centerY, planetOrbitRadius);
+
+      // Calculate Senthara's (planet's) orbital position.
+      const planetOrbitAngle = Phaser.Math.DegToRad((360 * (simulationTime % planetPeriod)) / planetPeriod - 90);
+      const planetX = centerX + planetOrbitRadius * Math.cos(planetOrbitAngle);
+      const planetY = centerY + planetOrbitRadius * Math.sin(planetOrbitAngle);
+
+      // Update planet container position.
+      planetContainer.x = planetX;
+      planetContainer.y = planetY;
+      // Planet rotation (self-rotation) on a period of 1 day.
+      const planetRotationAngle = Phaser.Math.DegToRad((360 * (simulationTime % planetRotationPeriod)) / planetRotationPeriod);
+      planetContainer.rotation = planetRotationAngle;
+
+      // Determine the subsolar angle (direction from planet to star).
+      const subsolarAngle = Phaser.Math.Angle.Between(planetX, planetY, centerX, centerY);
+      // The terminator line on the planet should be perpendicular to the sun direction.
+      // Update the night overlay's rotation so that its dark half covers the night side.
+      // Because the nightOverlay is a child of planetContainer, subtract the planet's rotation.
+      planetContainer.nightOverlay.rotation = subsolarAngle + Math.PI/2 - planetContainer.rotation;
+
+      // Calculate positions for each moon relative to Senthara.
+      // Keriel
+      const kerielOrbitAngle = Phaser.Math.DegToRad((360 * (simulationTime % kerielPeriod)) / kerielPeriod - 90);
+      const kerielX = planetX + kerielOrbitRadius * Math.cos(kerielOrbitAngle);
+      const kerielY = planetY + kerielOrbitRadius * Math.sin(kerielOrbitAngle);
+      kerielContainer.x = kerielX;
+      kerielContainer.y = kerielY;
+      // Tidal locking: set moon's rotation so that its marker points toward Senthara.
+      kerielContainer.rotation = Phaser.Math.Angle.Between(kerielX, kerielY, planetX, planetY);
+
+      // Arkaen
+      const arkaenOrbitAngle = Phaser.Math.DegToRad((360 * (simulationTime % arkaenPeriod)) / arkaenPeriod - 90);
+      const arkaenX = planetX + arkaenOrbitRadius * Math.cos(arkaenOrbitAngle);
+      const arkaenY = planetY + arkaenOrbitRadius * Math.sin(arkaenOrbitAngle);
+      arkaenContainer.x = arkaenX;
+      arkaenContainer.y = arkaenY;
+      arkaenContainer.rotation = Phaser.Math.Angle.Between(arkaenX, arkaenY, planetX, planetY);
+
+      // Minian
+      const minianOrbitAngle = Phaser.Math.DegToRad((360 * (simulationTime % minianPeriod)) / minianPeriod - 90);
+      const minianX = planetX + minianOrbitRadius * Math.cos(minianOrbitAngle);
+      const minianY = planetY + minianOrbitRadius * Math.sin(minianOrbitAngle);
+      minianContainer.x = minianX;
+      minianContainer.y = minianY;
+      minianContainer.rotation = Phaser.Math.Angle.Between(minianX, minianY, planetX, planetY);
+
+      // Optionally, redraw the orbits of the moons (around Senthara).
+      globalGraphics.lineStyle(1, 0x888888, 1);
+      globalGraphics.strokeCircle(planetX, planetY, kerielOrbitRadius);
+      globalGraphics.strokeCircle(planetX, planetY, arkaenOrbitRadius);
+      globalGraphics.strokeCircle(planetX, planetY, minianOrbitRadius);
+
+      // Update the Senthara calendar date text.
+      dateText.setText(getSentharaDate(simulationTime));
+    }
+  </script>
+</body>
+</html>
