try to fix this spaghetti of a code

public/frontend_home.js

@@ -138,7 +138,7 @@ document.addEventListener("DOMContentLoaded", async () => {
     };
 
     const connectSocket = () => {
-        if (socket && socket.readyState === WebSocket.OPEN) {
+        if (socket && socket.readyState === WebSocket.OPEN && socket.authenticated) {
             return Promise.resolve(socket);
         }
 
@@ -158,6 +158,7 @@ document.addEventListener("DOMContentLoaded", async () => {
                 const message = JSON.parse(event.data);
                 if (message.type === "auth:success") {
                     currentUsername = message.username;
+                    socket.authenticated = true;
                     resolve(socket);
                 }
                 if (message.type === "auth:error") {
@@ -258,7 +259,7 @@ document.addEventListener("DOMContentLoaded", async () => {
     logoutButton.addEventListener("click", async (e) => {
         e.preventDefault();
         try {
-            if (socket && socket.readyState === WebSocket.OPEN) {
+            if (socket && socket.readyState === WebSocket.OPEN && socket.authenticated) {
                 socket.close();
             }
             const logoutRes = await fetch("/logout", {
@@ -266,7 +267,7 @@ document.addEventListener("DOMContentLoaded", async () => {
                 credentials: "same-origin"
             });
             if (logoutRes.ok) {
-                document.cookie = "authorization=; Max-Age=0; path=/;";
+                localStorage.removeItem("activeLobbyId");
                 window.location.href = "/login.html";
             }
         } catch (err) {

public/frontend_poker.js

@@ -29,9 +29,8 @@ document.addEventListener("DOMContentLoaded", () => {
     let socket = null;
     let socketReady = null;
     let isYourTurn = false;
-    let canLeaveTable = true;
     let isSpectator = false;
-    let currentStackValue = 400;
+    let currentStackValue = 0;
     let minimumStake = 10;
     let callAmount = 0;
     let countdownTimer = null;
@@ -129,6 +128,7 @@ document.addEventListener("DOMContentLoaded", () => {
         actionButtons.forEach((button) => {
             button.disabled = !isYourTurn || isSpectator;
             if (button.dataset.action === "hit") {
+                button.textContent = callAmount > 0 ? "Call" : "Check";
                 button.title = callAmount > 0
                     ? `Call with $${Math.min(callAmount, currentStackValue)}.`
                     : actionTooltips.hit;
@@ -178,7 +178,7 @@ document.addEventListener("DOMContentLoaded", () => {
     };
 
     const connectSocket = () => {
-        if (socket && socket.readyState === WebSocket.OPEN) {
+        if (socket && socket.readyState === WebSocket.OPEN && socket.authenticated) {
             return Promise.resolve(socket);
         }
 
@@ -190,7 +190,16 @@ document.addEventListener("DOMContentLoaded", () => {
         socket = new WebSocket(`${protocol}//${window.location.host}`);
 
         socketReady = new Promise((resolve, reject) => {
-            socket.addEventListener("open", () => resolve(socket), {once: true});
+            socket.addEventListener("message", (event) => {
+                const message = JSON.parse(event.data);
+                if (message.type === "auth:success") {
+                    socket.authenticated = true;
+                    resolve(socket);
+                } else {
+                    reject(new Error(message.message || "Authentication failed"));
+                }
+            }, {once: true});
+            socket.addEventListener("close", () => reject(new Error("Connection closed")), {once: true});
             socket.addEventListener("error", () => reject(new Error("WebSocket connection failed")), {once: true});
         });
 
@@ -200,7 +209,6 @@ document.addEventListener("DOMContentLoaded", () => {
             if (message.type === "poker:state") {
                 hideError();
                 isYourTurn = Boolean(message.isYourTurn);
-                canLeaveTable = Boolean(message.canLeaveTable);
                 isSpectator = Boolean(message.isSpectator);
                 currentStackValue = Number(message.yourStack ?? 0);
                 minimumStake = Number(message.minimumStake || 10);
@@ -252,6 +260,10 @@ document.addEventListener("DOMContentLoaded", () => {
         });
 
         socket.addEventListener("close", () => {
+            isYourTurn = false;
+            stopCountdown();
+            updateActionButtons();
+            showError("Connection lost. Reload to reconnect to the table.");
             socket = null;
             socketReady = null;
         });
@@ -271,7 +283,7 @@ document.addEventListener("DOMContentLoaded", () => {
         const minBet = maxBet > 0 ? Math.min(requiredBet, maxBet) : 0;
         betRange.min = String(minBet);
         betRange.max = String(maxBet);
-        betRange.step = String(minimumStake);
+        betRange.step = "1";
         setBetValue(Math.max(minBet, Number(betRange.value) || minBet));
     };
 

public/home.html

@@ -2,6 +2,7 @@
 <html lang="en">
 <head>
     <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Home</title>
     <link rel="stylesheet" href="styles_home.css">
     <link rel="icon" href="gambling.png" type="image/x-icon">

public/login.html

@@ -2,6 +2,7 @@
 <html lang="en">
 <head>
     <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Login</title>
     <link rel="stylesheet" href="styles_login.css">
     <link rel="icon" href="gambling.png" type="image/x-icon">

public/poker.html

@@ -36,7 +36,7 @@
     </section>
 
     <section class="actions" aria-label="Poker actions">
-        <button data-action="hit">Hit</button>
+        <button data-action="hit">Check</button>
         <button data-action="fold">Fold</button>
         <button data-action="bet">Bet</button>
     </section>
@@ -49,9 +49,9 @@
         <div id="spectator-note" class="spectator-note hidden">Spectating</div>
         <div class="player-status">
             <span id="player-name">Player</span>
-            <span>Your Bet: $<strong id="current-bet">0</strong></span>
+            <span>Table Bet: $<strong id="current-bet">0</strong></span>
             <span>Your Total: $<strong id="your-contribution">0</strong></span>
-            <span>Your Stack: $<strong id="your-stack">400</strong></span>
+            <span>Your Stack: $<strong id="your-stack">0</strong></span>
             <span id="last-action">Game starting</span>
         </div>
     </section>

public/unauthorized.html

@@ -2,6 +2,7 @@
 <html lang="en">
 <head>
   <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>Access Denied</title>
   <style>
     body {