diff --git a/src/components/PreviewPanel.jsx b/src/components/PreviewPanel.jsx
index f94a471..afec57f 100644
--- a/src/components/PreviewPanel.jsx
+++ b/src/components/PreviewPanel.jsx
@@ -2,7 +2,6 @@ import React, { useState } from 'react';
 
 export default function PreviewPanel({ code }) {
   const [gameUrl, setGameUrl] = useState('');
-  const [snakeApiUrl, setSnakeApiUrl] = useState('');
   const [settings, setSettings] = useState(null);
   const [moveRes, setMoveRes] = useState(null);
   const [loadingSetup, setLoadingSetup] = useState(false);
@@ -64,20 +63,6 @@ export default function PreviewPanel({ code }) {
         </button>
       </form>
 
-      {/* API server URL */}
-      <form style={{ display: 'flex', gap: '0.5rem', marginBottom: '1rem' }}>
-        <input
-          type="text"
-          placeholder="Your Snake API URL"
-          value={snakeApiUrl}
-          onChange={(e) => setSnakeApiUrl(e.target.value)}
-          style={{ flex: 1 }}
-        />
-        <button onClick={fetchSetup} disabled={!snakeApiUrl || loadingSetup}>
-          {loadingSetup ? 'Loading…' : 'Connect Snake API'}
-        </button>
-      </form>
-
       {/* Test Move */}
       <div style={{ marginBottom: '1rem' }}>
         <button onClick={testMove} disabled={!settings || loadingMove}>
diff --git a/src/pages/CodeEditor.jsx b/src/pages/CodeEditor.jsx
index 4bdcda2..8bf9310 100644
--- a/src/pages/CodeEditor.jsx
+++ b/src/pages/CodeEditor.jsx
@@ -1,5 +1,6 @@
 import { useEffect, useState } from "react";
 import EditorPanel from "../components/EditorPanel";
+import PreviewPanel from "../components/PreviewPanel";
 
 const PageCodeEditor = () => {
   const [code, setCode] = useState(
@@ -64,6 +65,11 @@ const PageCodeEditor = () => {
           <EditorPanel code={code} onChange={setCode} />
         </div>
 
+        {/* <div className="preview-section">
+            <PreviewPanel code={code} />
+        </div> */}
+
+
         {/* live arena */}
         <div
           className="box-panel"
@@ -134,46 +140,6 @@ const PageCodeEditor = () => {
             </button>
           </div>
 
-          {/* snake api */}
-          <div
-            style={{
-              background: "rgba(255,255,255,0.05)",
-              borderRadius: "8px",
-              padding: "1rem",
-              marginBottom: "1rem",
-              textAlign: "center",
-            }}
-          >
-            <input
-              type="text"
-              placeholder="Your Snake API URL"
-              style={{
-                background: "transparent",
-                border: "none",
-                color: "#fff",
-                width: "100%",
-                textAlign: "center",
-                fontFamily: "'Fira Code', monospace",
-                outline: "none",
-              }}
-            />
-            <button
-              style={{
-                backgroundColor: "#ff2a6d",
-                color: "#fff",
-                padding: "0.5rem 1rem",
-                border: "none",
-                borderRadius: "20px",
-                marginTop: "0.5rem",
-                cursor: "pointer",
-                width: "100%",
-                fontWeight: "bold",
-              }}
-            >
-              CONNECT SNAKE API
-            </button>
-          </div>
-
           {/* test move button */}
           <div
             style={{