diff --git a/public/index.html b/public/index.html
new file mode 100644
index 0000000..5520300
--- /dev/null
+++ b/public/index.html
@@ -0,0 +1,47 @@
+<!DOCTYPE html>
+<html lang="tr">
+<head>
+<meta charset="UTF-8">
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+<title>RAYCASTER-3D — Retro FPS Motoru</title>
+<link rel="stylesheet" href="style.css">
+</head>
+<body>
+  <!-- Üst bilgi -->
+  <header class="topbar">
+    <span class="logo">⟁ RAYCASTER<span class="dim">-3D</span></span>
+    <span class="tag">Wolfenstein '92 · saf 2D canvas · DDA ışın</span>
+    <span class="hint">W/A/S/D yürü · ←/→ veya A/D dön</span>
+  </header>
+
+  <main class="stage">
+    <!-- 3D görünüm -->
+    <div class="viewport">
+      <canvas id="game"></canvas>
+      <!-- Retro hedef (çapraz) -->
+      <div class="crosshair" aria-hidden="true">
+        <span class="x"></span><span class="y"></span>
+      </div>
+      <!-- Radar minimap (sağ üst) -->
+      <div class="minimap-wrap">
+        <canvas id="minimap" width="160" height="160"></canvas>
+        <span class="mm-label">RADAR</span>
+      </div>
+    </div>
+
+    <!-- Retro durum çubuğu -->
+    <footer class="hudbar">
+      <div class="hud-block"><label>FPS</label><strong id="hud-fps">60</strong></div>
+      <div class="hud-block"><label>X</label><strong id="hud-x">2.50</strong></div>
+      <div class="hud-block"><label>Y</label><strong id="hud-y">2.50</strong></div>
+      <div class="hud-block"><label>BAKIŞ</label><strong id="hud-ang">30°</strong></div>
+      <div class="hud-fill"></div>
+      <div class="hud-copy">NUMEX · ENGINE 2D // RETRO-RAY © 2026</div>
+    </footer>
+  </main>
+
+  <!-- Engine yüklenir: önce motor, sonra oyun mantığı -->
+  <script src="engine.js"></script>
+  <script src="app.js"></script>
+</body>
+</html>
