diff --git a/client/src/actions/index.js b/client/src/actions/index.js
index 9c08b059e..ac2577057 100644
--- a/client/src/actions/index.js
+++ b/client/src/actions/index.js
@@ -10,6 +10,9 @@ export const setNetworkId = id => ({ type: SET_NETWORK_ID, id })
 export const SET_PLAYER_ADDRESS = "SET_PLAYER_ADDRESS";
 export const setPlayerAddress = address => ({ type: SET_PLAYER_ADDRESS, address })
 
+export const SET_GAME_READ_ONLY = "SET_GAME_READ_ONLY";
+export const setGameReadOnly = readOnly => ({ type: SET_GAME_READ_ONLY, readOnly })
+
 export const LOAD_GAME_DATA = "LOAD_GAME_DATA";
 export const loadGamedata = () => ({ type: LOAD_GAME_DATA, levels: undefined })
 
diff --git a/client/src/containers/App.js b/client/src/containers/App.js
index 7f089c227..b7baba979 100644
--- a/client/src/containers/App.js
+++ b/client/src/containers/App.js
@@ -17,7 +17,8 @@ import {
   deprecationDate,
 } from "../utils/networkDeprecation";
 import { Helmet } from "react-helmet";
-
+import { store } from "./../store";
+import * as actions from "../../src/actions";
 
 class App extends React.Component {
   constructor() {
@@ -61,6 +62,35 @@ class App extends React.Component {
     this.props.navigate(`${constants.PATH_LEVEL_ROOT}${target}`);
   }
 
+  async continueAnyway() {
+    const deployWindow = document.querySelectorAll(".deploy-window-bg");
+    deployWindow[0].style.display = "none";
+  }
+
+  async continueInReadOnly() {
+    store.dispatch(actions.loadGamedata());
+    store.dispatch(actions.setGameReadOnly(true));
+    const accountConnectionWindow = document.querySelectorAll(
+      ".account-connection-window-bg"
+    );
+    accountConnectionWindow[0].style.display = "none";
+  }
+
+  async displayConnectionWindow() {
+    const accountConnectionWindow = document.querySelectorAll(
+      ".account-connection-window-bg"
+    );
+    accountConnectionWindow[0].style.display = "block";
+  }
+
+  async requestAccounts() {
+    await window.ethereum.request({ method: "eth_requestAccounts" });
+    const accountConnectionWindow = document.querySelectorAll(
+      ".account-connection-window-bg"
+    );
+    accountConnectionWindow[0].style.display = "none";
+  }
+
   render() {
     let language = localStorage.getItem("lang");
     let strings = loadTranslations(language);
@@ -117,11 +147,6 @@ class App extends React.Component {
       }
     }
 
-    async function continueAnyway() {
-      const deployWindow = document.querySelectorAll(".deploy-window-bg");
-      deployWindow[0].style.display = "none";
-    }
-
     return (
       <div className="appcontainer">
         <Helmet>
@@ -180,13 +205,46 @@ class App extends React.Component {
             />
             <ul>
               <button
-                onClick={() => this.navigateToFirstIncompleteLevel()}
+                onClick={() => {
+                  if (!store.getState().gamedata.readOnly) {
+                    this.navigateToFirstIncompleteLevel();
+                  } else {
+                    this.displayConnectionWindow();
+                  }
+                }}
                 className="buttons"
               >
                 {strings.playNow}
               </button>
             </ul>
           </section>
+          {/*not Account Connected window*/}
+          <div className="account-connection-window-bg">
+            <div className="account-connection-window">
+              <button
+                className="account-connection-close-x fas fa-x "
+                onClick={this.continueInReadOnly}
+              >
+              </button>
+              <h1>{randBadIcon()}</h1>
+              <br />
+              <h2>{strings.accountNotConnectedTitle}</h2>
+              <br />
+              <p>{strings.accountNotConnectedMessage}</p>
+              <br />
+              <div className="choice-buttons">
+                <button
+                  className="buttons"
+                  onClick={async () => {
+                    await this.requestAccounts();
+                    window.location.reload();
+                  }}
+                >
+                  {strings.connectAccount}
+                </button>
+              </div>
+            </div>
+          </div>
           {/*not Deployed window*/}
           <div className="deploy-window-bg">
             {!networkOnDeprecationOrDeprecated(this.state.chainId) ? (
@@ -194,7 +252,6 @@ class App extends React.Component {
                 {/*deploy window*/}
                 <h1>{randGoodIcon()}</h1>
                 <h2>{strings.deployMessageTitle}</h2>
-                <br />
                 {strings.deployMessage}
                 {supportedNetworksList(supportedNetworks)}
                 <p className="deploy-note">{strings.deployConfirmation}</p>
@@ -225,7 +282,7 @@ class App extends React.Component {
                     {strings.switchToSepolia}
                   </button>
                   {!isDeprecatedNetwork(this.state.chainId) && (
-                    <button className="buttons" onClick={continueAnyway}>
+                    <button className="buttons" onClick={this.continueAnyway}>
                       {strings.continueAnyway}
                     </button>
                   )}
diff --git a/client/src/containers/Header.js b/client/src/containers/Header.js
index b008a72a5..20c445eb6 100644
--- a/client/src/containers/Header.js
+++ b/client/src/containers/Header.js
@@ -2,7 +2,7 @@ import React from "react";
 import onClickOutside from "react-onclickoutside";
 import { connect } from "react-redux";
 import { withRouter } from "../hoc/withRouter";
-import { Link } from "react-router-dom";
+import { Link, Navigate } from "react-router-dom";
 import { bindActionCreators } from "redux";
 import * as actions from "../actions";
 import * as constants from "../constants";
@@ -11,6 +11,7 @@ import PropTypes from "prop-types";
 import { ProgressBar } from "react-loader-spinner";
 import { svgFilter } from "../utils/svg";
 import LeaderIcon from "../components/leaderboard/LeaderIcon";
+import { store } from "../store";
 // import parse from "html-react-parser";
 
 class Header extends React.Component {
@@ -24,7 +25,7 @@ class Header extends React.Component {
       multiDDOpen: false,
     };
 
-    if (this.props.web3) {
+    if (this.props.web3 && !store.getState().gamedata.readOnly) {
       window.ethereum.request({ method: "eth_chainId" }).then((id) => {
         this.setState({ chainId: Number(id) });
       });
@@ -325,7 +326,8 @@ class Header extends React.Component {
                       </Link>
                     </div>
                     {window.location.pathname === constants.PATH_ROOT &&
-                      !!this.props.web3 && (
+                      !!this.props.web3 &&
+                      !store.getState().gamedata.readOnly && (
                         <Link
                           onClick={() => this.toggleDropdownState()}
                           to={constants.PATH_LEADERBOARD}
@@ -342,45 +344,58 @@ class Header extends React.Component {
                       className="element-in-row toggle --small"
                       type="checkbox"
                     />
+                    <div className="connect-button">
+                    {store.getState().gamedata.readOnly && (
+                      <button
+                        className="buttons"
+                        onClick={async () => {
+                          await window.ethereum.request({ method: "eth_requestAccounts" });
+                          window.location.reload();
+                         }}
+                      >
+                        {strings.connectAccount}
+                      </button>
+                    )}
+                    </div>
                   </div>
                 </div>
-
-                <div
-                  className={`single-dropdown --${
-                    this.props.web3 && "--hidden"
-                  }`}
-                >
-                  <p onClick={() => this.setActiveTab(2)}>
-                    <i className="fas fa-network-wired"></i>
-                    <span>{strings.Networks}</span>
-                  </p>
-                  <div className={this.getDDClassName(2)}>
-                    {Object.values(constants.NETWORKS_INGAME).map(
-                      (network, index) => {
-                        if (network && network.name !== "local") {
-                          if (Number(network.id) === this.state.chainId)
-                            return false; // filter out current network
-                          return (
-                            <div
-                              key={index}
-                              onClick={(e) => {
-                                e.preventDefault();
-                                this.changeNetwork(network);
-                              }}
-                              className="dropdown-pill"
-                            >
-                              <a id={network.name} key={network.name} href="/">
-                                {network.name}
-                              </a>
-                            </div>
-                          );
+                {this.props.web3 && !store.getState().gamedata.readOnly && (
+                  <div className={`single-dropdown`}>
+                    <p onClick={() => this.setActiveTab(2)}>
+                      <i className="fas fa-network-wired"></i>
+                      <span>{strings.Networks}</span>
+                    </p>
+                    <div className={this.getDDClassName(2)}>
+                      {Object.values(constants.NETWORKS_INGAME).map(
+                        (network, index) => {
+                          if (network && network.name !== "local") {
+                            if (Number(network.id) === this.state.chainId)
+                              return false; // filter out current network
+                            return (
+                              <div
+                                key={index}
+                                onClick={(e) => {
+                                  e.preventDefault();
+                                  this.changeNetwork(network);
+                                }}
+                                className="dropdown-pill"
+                              >
+                                <a
+                                  id={network.name}
+                                  key={network.name}
+                                  href="/"
+                                >
+                                  {network.name}
+                                </a>
+                              </div>
+                            );
+                          }
+                          return null;
                         }
-                        return null;
-                      }
-                    )}
+                      )}
+                    </div>
                   </div>
-                </div>
-
+                )}
                 <div className="single-dropdown">
                   <p onClick={() => this.setActiveTab(1)}>
                     <i className="fas fa-globe-americas"></i>
@@ -438,7 +453,7 @@ class Header extends React.Component {
             wrapperClass="progress-bar-wrapper"
             visible={true}
           />
-          {!this.props.web3 && (
+          {!this.props.web3 && !store.getState().gamedata.readOnly && (
             <div
               style={{ backgroundColor: "#eddfd6", border: "none" }}
               className="alert alert-warning"
diff --git a/client/src/containers/Level.js b/client/src/containers/Level.js
index 104a2a037..9bdbca987 100644
--- a/client/src/containers/Level.js
+++ b/client/src/containers/Level.js
@@ -15,6 +15,7 @@ import { getLevelKey } from "../utils/contractutil";
 import { deployAndRegisterLevel } from "../utils/deploycontract";
 import { svgFilter } from "../utils/svg";
 import { Helmet } from 'react-helmet';
+import { store } from "../store";
 
 class Level extends React.Component {
   constructor(props) {
@@ -331,7 +332,7 @@ class Level extends React.Component {
                 )}
 
                 {/* DEPLOY OR CREATE */}
-                {this.props.web3 && <button
+                { !store.getState().gamedata.readOnly && this.props.web3 && <button
                   type="button"
                   className="button-actions"
                   onClick={
diff --git a/client/src/gamedata/ar/strings.json b/client/src/gamedata/ar/strings.json
index cf640631e..e052fe024 100644
--- a/client/src/gamedata/ar/strings.json
+++ b/client/src/gamedata/ar/strings.json
@@ -26,6 +26,9 @@
   "sources": "مصادر",
   "submitInstance": "تسليم النسخة",
   "getNewInstance": "احصل على نسخة جديدة",
+  "accountNotConnectedTitle": "حساب MetaMask غير متصل",
+  "accountNotConnectedMessage": "لبدء مغامرتك، قم بتوصيل محفظة MetaMask الخاصة بك! تتفاعل لعبتنا بشكل مباشر مع عقود Ethernaut على السلسلة، مما يعني أن أفعالك في اللعبة مسجلة على blockchain. من خلال ربط حساب MetaMask الخاص بك، يمكنك التفاعل بأمان مع هذه العقود الذكية، مما يسمح لك بحل التحديات والتقدم في اللعبة.",
+  "connectAccount": "يتصل",
   "deployMessageTitle": "لم يتم نشر اللعبة",
   "deployMessage": "تدُعم اللُعبة حاليًا هذه الشبكات فقط:",
   "deprecatedNetwork": "شبكة عفا عليها الزمن",
diff --git a/client/src/gamedata/en/strings.json b/client/src/gamedata/en/strings.json
index 9d975b683..077904155 100644
--- a/client/src/gamedata/en/strings.json
+++ b/client/src/gamedata/en/strings.json
@@ -26,6 +26,9 @@
   "sources": "Sources",
   "submitInstance": "Submit instance",
   "getNewInstance": "Get new instance",
+  "accountNotConnectedTitle": "MetaMask account not connected",
+  "accountNotConnectedMessage": "To begin your adventure, connect your MetaMask wallet! Our game interacts directly with Ethernaut on-chain contracts, which means that your actions in the game are recorded on the blockchain. By linking your MetaMask account, you can securely engage with these smart contracts, allowing you to solve challenges, and progress in the game.",
+  "connectAccount": "Connect",
   "deployMessageTitle": "Game not deployed",
   "deprecatedNetwork": "Network deprecated",
   "networkBeingDeprecated": "Network being deprecated",
diff --git a/client/src/gamedata/es/strings.json b/client/src/gamedata/es/strings.json
index 535965f15..afed6ab74 100644
--- a/client/src/gamedata/es/strings.json
+++ b/client/src/gamedata/es/strings.json
@@ -26,6 +26,9 @@
   "sources": "Código",
   "submitInstance": "Comprueba instancia",
   "getNewInstance": "Nueva instancia",
+  "accountNotConnectedTitle": "Cuenta MetaMask no conectada",
+  "accountNotConnectedMessage": "Para comenzar tu aventura, conecta tu billetera MetaMask. Nuestro juego interactúa directamente con los contratos en cadena de Ethernaut, lo que significa que tus acciones en el juego quedan registradas en la cadena de bloques. Al vincular tu cuenta MetaMask, puedes interactuar de forma segura con estos contratos inteligentes, lo que te permite resolver desafíos y progresar en el juego.",
+  "connectAccount": "Conectar",
   "deployMessageTitle": "Juego no desplegado",
   "deprecatedNetwork": "Red obsoleta",
   "networkBeingDeprecated": "Red en desuso",
diff --git a/client/src/gamedata/fr/strings.json b/client/src/gamedata/fr/strings.json
index a5d59ae31..20cd09e0a 100644
--- a/client/src/gamedata/fr/strings.json
+++ b/client/src/gamedata/fr/strings.json
@@ -26,6 +26,9 @@
   "sources": "Sources",
   "submitInstance": "Soumettre une instance",
   "getNewInstance": "Créer une nouvelle instance",
+  "accountNotConnectedTitle": "Compte MetaMask non connecté",
+  "accountNotConnectedMessage": "Pour commencer votre aventure, connectez votre portefeuille MetaMask ! Notre jeu interagit directement avec les contrats on-chain d'Ethernaut, ce qui signifie que vos actions dans le jeu sont enregistrées sur la blockchain. En liant votre compte MetaMask, vous pouvez interagir en toute sécurité avec ces contrats intelligents, vous permettant de résoudre des défis et de progresser dans le jeu.",
+  "connectAccount": "Connecter",
   "deployMessageTitle": "Jeu non déployé",
   "deprecatedNetwork": "Réseau obsolète",
   "networkBeingDeprecated": "Réseau désaffecté",
diff --git a/client/src/gamedata/ja/strings.json b/client/src/gamedata/ja/strings.json
index ce5d32656..177ed8bcc 100644
--- a/client/src/gamedata/ja/strings.json
+++ b/client/src/gamedata/ja/strings.json
@@ -26,6 +26,9 @@
   "sources": "ソース",
   "submitInstance": "インスタンスの提出",
   "getNewInstance": "インスタンスの生成",
+  "accountNotConnectedTitle": "MetaMask アカウントが接続されていません",
+  "accountNotConnectedMessage": "冒険を始めるには、MetaMask ウォレットを接続してください。私たちのゲームは Ethernaut オンチェーン コントラクトと直接やり取りします。つまり、ゲーム内でのアクションはブロックチェーンに記録されます。MetaMask アカウントをリンクすることで、これらのスマート コントラクトに安全に関与し、課題を解決してゲームを進めることができます。",
+  "connectAccount": "接続する",
   "deployMessageTitle": "ゲームが展開されていません",
   "deployMessage": "現在、ゲームはこれらのネットワークのみをサポートしています:",
   "deprecatedNetwork": "ネットワークは放棄されています",
diff --git a/client/src/gamedata/pt_br/strings.json b/client/src/gamedata/pt_br/strings.json
index f33c24a31..7553a13e0 100644
--- a/client/src/gamedata/pt_br/strings.json
+++ b/client/src/gamedata/pt_br/strings.json
@@ -26,6 +26,9 @@
   "sources": "Código",
   "submitInstance": "Enviar instância",
   "getNewInstance": "Obter nova instância",
+  "accountNotConnectedTitle": "Conta MetaMask não ligada",
+  "accountNotConnectedMessage": "Para começar a sua aventura, ligue a sua carteira MetaMask! O nosso jogo interage diretamente com os contratos on-chain do Ethernaut, o que significa que as suas ações no jogo são registadas na blockchain. Ao ligar a sua conta MetaMask, pode interagir com segurança com estes contratos inteligentes, permitindo-lhe resolver desafios e progredir no jogo.",
+  "connectAccount": "Ligar",
   "deployMessageTitle": "Jogo não implantado",
   "deprecatedNetwork": "Rede obsoleta",
   "networkBeingDeprecated": "Rede sendo obsoleta",
diff --git a/client/src/gamedata/ru/strings.json b/client/src/gamedata/ru/strings.json
index 3d289c5aa..7f0eee3dd 100644
--- a/client/src/gamedata/ru/strings.json
+++ b/client/src/gamedata/ru/strings.json
@@ -26,6 +26,9 @@
   "sources": "Исходный код",
   "submitInstance": "Отправить инстанс на проверку",
   "getNewInstance": "Создать новый инстанс",
+  "accountNotConnectedTitle": "Учетная запись MetaMask не подключена",
+  "accountNotConnectedMessage": "Чтобы начать приключение, подключите свой кошелек MetaMask! Наша игра напрямую взаимодействует с ончейн-контрактами Ethernaut, что означает, что ваши действия в игре записываются в блокчейн. Подключив свой аккаунт MetaMask, вы можете безопасно взаимодействовать с этими смарт-контрактами, что позволит вам решать задачи и продвигаться в игре.",
+  "connectAccount": "Bağlamak",
   "deployMessageTitle": "Игра не развернута",
   "deprecatedNetwork": "заброшенная сеть",
   "networkBeingDeprecated": "сеть в процессе закрытия",
diff --git a/client/src/gamedata/tr/strings.json b/client/src/gamedata/tr/strings.json
index f8326636b..0c6b9a6b3 100644
--- a/client/src/gamedata/tr/strings.json
+++ b/client/src/gamedata/tr/strings.json
@@ -26,6 +26,9 @@
   "sources": "Kaynaklar",
   "submitInstance": "Durum gönder",
   "getNewInstance": "Yeni durum al",
+  "accountNotConnectedTitle": "MetaMask hesabı bağlı değil",
+  "accountNotConnectedMessage": "Maceranıza başlamak için MetaMask cüzdanınızı bağlayın! Oyunumuz doğrudan Ethernaut zincir üstü sözleşmeleriyle etkileşime girer, bu da oyundaki eylemlerinizin blok zincirinde kaydedildiği anlamına gelir. MetaMask hesabınızı bağlayarak bu akıllı sözleşmelerle güvenli bir şekilde etkileşime girebilir, zorlukları çözebilir ve oyunda ilerleyebilirsiniz.",
+  "connectAccount": "Bağlamak",
   "deployMessageTitle": "Oyun dağıtılmadı",
   "deprecatedNetwork": "Ağ kullanımdan kaldırıldı",
   "networkBeingDeprecated": "Ağ kullanımdan kaldırılıyor",
diff --git a/client/src/gamedata/zh_cn/strings.json b/client/src/gamedata/zh_cn/strings.json
index c4f5fe700..d136c5065 100644
--- a/client/src/gamedata/zh_cn/strings.json
+++ b/client/src/gamedata/zh_cn/strings.json
@@ -26,6 +26,9 @@
   "sources": "源码",
   "submitInstance": "提交该实例",
   "getNewInstance": "生成新实例",
+  "accountNotConnectedTitle": "MetaMask 帐户未连接",
+  "accountNotConnectedMessage": "要开始您的冒险，请连接您的 MetaMask 钱包！我们的游戏直接与 Ethernaut 链上合约交互，这意味着您在游戏中的行为会记录在区块链上。通过链接您的 MetaMask 帐户，您可以安全地与这些智能合约互动，从而让您解决​​挑战并在游戏中取得进展。", 
+  "connectAccount": "连接",
   "deployMessageTitle": "Game not deployed",
   "deprecatedNetwork": "Network deprecated",
   "networkBeingDeprecated": "Network being deprecated",
diff --git a/client/src/gamedata/zh_tw/strings.json b/client/src/gamedata/zh_tw/strings.json
index 5274791aa..88705e573 100644
--- a/client/src/gamedata/zh_tw/strings.json
+++ b/client/src/gamedata/zh_tw/strings.json
@@ -26,6 +26,9 @@
   "sources": "原始碼",
   "submitInstance": "提交該實例",
   "getNewInstance": "產生新實例",
+  "accountNotConnectedTitle": "MetaMask 帳戶未連接",
+  "accountNotConnectedMessage": "要開始您的冒險，請連接您的 MetaMask 錢包！我們的遊戲直接與 Ethernaut 鏈上合約交互，這意味著您在遊戲中的行為都會記錄在區塊鏈上。透過連結您的 MetaMask 帳戶，您可以安全地使用這些智能合約，從而解決挑戰並在遊戲中取得進展。",
+  "connectAccount": "連接",
   "deployMessageTitle": "遊戲未部署",
   "deprecatedNetwork": "網路已棄用",
   "networkBeingDeprecated": "網路將來將被棄用",
@@ -35,7 +38,6 @@
   "deployGame": "部署遊戲",
   "switchToSepolia": "切換到Sepolia",
   "continueAnyway": "仍然繼續",
-
   "deployLevel": "部署級別",
   "helperDeployAllContracts": "在當前網絡上部署所有其餘合同。",
   "confirmMainnetDeploy": "您在主網上，遊戲沒有貨幣價值，您不應在此網絡中部署。",
diff --git a/client/src/index.js b/client/src/index.js
index 6fcc2cce5..3d15c7957 100644
--- a/client/src/index.js
+++ b/client/src/index.js
@@ -36,6 +36,7 @@ Sentry.init({
 store.dispatch(actions.connectWeb3(window.ethereum));
 const container = document.getElementById("root");
 const root = createRoot(container);
+
 if (!window.ethereum) {
   //root.render(<h3>Hey, You dont have the supported wallet!</h3>);
   // let language = localStorage.getItem("lang");
@@ -43,10 +44,17 @@ if (!window.ethereum) {
   // store.dispatch(actions.setNetworkId(parseInt("5")));
   store.dispatch(actions.loadGamedata());
 } else {
-  window.ethereum.request({ method: "eth_chainId" }).then((res) => {
-    store.dispatch(actions.setNetworkId(parseInt(res)));
-    store.dispatch(actions.loadGamedata());
-  })  
+  window.ethereum.request({ method: "eth_accounts" }).then((res) => {
+    if (res.length !== 0) {
+      window.ethereum.request({ method: "eth_chainId" }).then((res) => {
+        store.dispatch(actions.setNetworkId(parseInt(res)));
+        store.dispatch(actions.loadGamedata());
+      });
+    } else {
+      const accountConnectionWindow = document.querySelectorAll('.account-connection-window-bg');
+      if (accountConnectionWindow[0]) accountConnectionWindow[0].style.display = 'block';
+    }
+  });
 }
 
 root.render(
@@ -69,7 +77,13 @@ root.render(
 
 // Post-load actions.
 window.addEventListener("load", async () => {
-  if (window.ethereum) {
+  // Check if any MetaMask account is connected to the frontend
+  let accountConnected = false;
+  if(window.ethereum) {
+    const eth_accounts = await window.ethereum.request({ method: "eth_accounts" });
+    accountConnected = eth_accounts.length !== 0;
+  }
+  if (accountConnected) {
     window.web3 = new constants.Web3(window.ethereum);
     try {
       await window.ethereum.request({ method: `eth_requestAccounts` });
@@ -79,8 +93,7 @@ window.addEventListener("load", async () => {
       window.web3 = null;
     }
   }
-
-  if (window.web3) {
+  if (window.web3 && accountConnected) {
     ethutil.setWeb3(window.web3);
     // ethutil.attachLogger();
 
diff --git a/client/src/middlewares/setGameReadOnly.js b/client/src/middlewares/setGameReadOnly.js
new file mode 100644
index 000000000..8cedf957b
--- /dev/null
+++ b/client/src/middlewares/setGameReadOnly.js
@@ -0,0 +1,8 @@
+import * as actions from '../actions';
+
+const setGameReadOnly = store => next => action => {
+  if (action.type !== actions.SET_GAME_READ_ONLY) return next(action)
+
+}
+
+export default setGameReadOnly
diff --git a/client/src/reducers/gamedataReducer.js b/client/src/reducers/gamedataReducer.js
index b4e129773..78ede1f19 100644
--- a/client/src/reducers/gamedataReducer.js
+++ b/client/src/reducers/gamedataReducer.js
@@ -1,6 +1,7 @@
 import * as actions from '../actions';
 
 const initialState = {
+  readOnly: false,
   ethernautAddress: undefined,
   activeLevel: undefined,
   levels: []
@@ -9,6 +10,12 @@ const initialState = {
 const gameDataReducer = function(state = initialState, action) {
   switch(action.type) {
 
+    case actions.SET_GAME_READ_ONLY:
+      return {
+        ...state,
+        readOnly: action.readOnly
+      }
+
     case actions.LOAD_GAME_DATA:
       return {
         ...state,
diff --git a/client/src/styles/app.css b/client/src/styles/app.css
index 1bc810aa4..0b1a7279c 100644
--- a/client/src/styles/app.css
+++ b/client/src/styles/app.css
@@ -85,7 +85,6 @@ ul {
   margin-top: -15%;
 } */
 
-
 .lines {
   margin-bottom: 4%;
   margin-top: 2%;
@@ -154,19 +153,18 @@ button :hover {
   align-items: center;
 }
 
-
 .top-banner {
   display: flex;
   gap: 10%;
   align-items: center;
   justify-content: space-between;
-   width: 100%;
+  width: 100%;
   height: 80px;
   border-radius: 6px;
   border: 2px solid var(--secondary-color);
   margin-bottom: 4%;
   margin-top: 2%;
-  padding: 2%
+  padding: 2%;
 }
 
 .top-banner-text {
@@ -205,7 +203,7 @@ nav li {
   font-family: helvetica, sans-serif;
 }
 
-.nav-links button i:hover{
+.nav-links button i:hover {
   outline: none;
   background: transparent;
 }
@@ -275,6 +273,58 @@ nav li {
   margin-bottom: 2em;
 }
 
+.account-connection-window-bg {
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background-color: rgba(0, 0, 0, 0.3);
+  z-index: 4;
+  display: none;
+}
+
+.account-connection-window {
+  position: relative;
+  top: 20%;
+  width: 40%;
+  left: 30%;
+  right: 30%;
+  display: inherit;
+  background-color: var(--primary-color);
+  z-index: 5;
+  padding: 2% 2% 2% 2%;
+  box-shadow: black 0px 0px 60px;
+  border: 2px solid var(--secondary-color);
+  border-radius: 6px;
+}
+
+.account-connection-window h1 {
+  text-align: center;
+}
+
+.account-connection-window h2 {
+  font-size: 2.5em;
+  text-align: center;
+}
+
+.account-connection-window p {
+  font-size: 1.1em;
+  text-align: justify;
+}
+
+.account-connection-close-x {
+  position: absolute;
+  right: 2.5%;
+  top: 2.5%;
+  width: 1.75rem;
+  height: 1.75rem;
+}
+
+.connect-button {
+  margin-left: auto;
+}
+
 .deploy-window-bg {
   position: fixed;
   top: 0;
@@ -309,6 +359,14 @@ nav li {
   text-align: center;
 }
 
+.deploy-window h2 {
+  font-size: 2.5em;
+}
+
+.deploy-window p {
+  font-size: 1.1em;
+}
+
 .choice-buttons {
   display: flex;
   justify-content: space-evenly;
@@ -424,10 +482,10 @@ nav li {
   padding-left: 50px;
   padding-right: 50px;
 }
-.author-section-border{
+.author-section-border {
   border: none !important;
 }
-.author-section{
+.author-section {
   width: 60%;
   margin-left: 20%;
 
@@ -550,13 +608,12 @@ footer {
   display: none;
 }
 
-
 /* --------- styles for multi dropdowns --------------*/
-.multi-dropdown{
+.multi-dropdown {
   padding: 0% 0px;
 }
 
-.multi-dropdown__icon{
+.multi-dropdown__icon {
   color: var(--primary-color);
   background-color: var(--secondary-color);
   padding: 4px 9px;
@@ -569,11 +626,11 @@ footer {
   font-size: 20px;
 }
 
-.multi-dropdown__icon:hover{
-  opacity: 0.90;
+.multi-dropdown__icon:hover {
+  opacity: 0.9;
 }
 
-.multi-dropdown__dropdown{
+.multi-dropdown__dropdown {
   background-color: var(--secondary-color);
   color: var(--primary-color);
   border: solid 10px var(--secondary-color);
@@ -586,31 +643,31 @@ footer {
   margin-top: 5px;
 }
 
-.multi-dropdown__dropdown.--closed{
+.multi-dropdown__dropdown.--closed {
   display: none;
 }
 
-.multi-dropdown__dropdown > div{
+.multi-dropdown__dropdown > div {
   background-color: var(--primary-color);
-  color:  var(--secondary-color);
+  color: var(--secondary-color);
   margin-bottom: 7px;
   transition: 300ms;
 }
-.multi-dropdown__dropdown > div:last-of-type{
+.multi-dropdown__dropdown > div:last-of-type {
   margin-bottom: 0;
 }
 
-.multi-dropdown__dropdown div:hover{
+.multi-dropdown__dropdown div:hover {
   opacity: 0.95;
 }
 
-.single-dropdown{
+.single-dropdown {
   padding-top: 5px;
   padding-bottom: 5px;
   border-radius: 5px;
 }
 
-.single-dropdown.--hidden{
+.single-dropdown.--hidden {
   display: none;
 }
 
@@ -634,37 +691,37 @@ footer {
   gap: 3px;
 }
 
-.single-dropdown > div.hide{
+.single-dropdown > div.hide {
   display: none;
 }
 
-.dropdown-pill{
-  background-color:  var(--secondary-color);
-  color:  var(--primary-color);
+.dropdown-pill {
+  background-color: var(--secondary-color);
+  color: var(--primary-color);
   border-radius: 3px;
   padding: 5px 10px;
   cursor: pointer;
   line-height: 16px;
 }
 
-.dropdown-pill a, .dropdown-pill span{
+.dropdown-pill a,
+.dropdown-pill span {
   text-decoration: none;
-  color:  var(--secondary-color);
+  color: var(--secondary-color);
 }
 
-.dropdown-pill div{
+.dropdown-pill div {
   display: flex;
   align-items: center;
 }
 
-.dropdown-pill.--left{
+.dropdown-pill.--left {
   text-align: left;
 }
 
-
-.single-dropdown a{
+.single-dropdown a {
   text-decoration: none;
-  color:  var(--primary-color);;
+  color: var(--primary-color);
 }
 
 .toggle.--small {
@@ -677,7 +734,7 @@ footer {
   height: 15px;
 }
 
-.filled-icon{
+.filled-icon {
   background-color: var(--secondary-color);
   color: var(--primary-color);
   width: fit-content;
@@ -685,7 +742,7 @@ footer {
   border-radius: 5px;
 }
 
-.filled-icon svg{
+.filled-icon svg {
   fill: var(--primary-color);
   display: inline-block;
   height: 13px;
@@ -696,7 +753,7 @@ footer {
 }
 
 /* --------- styles for multi dropdowns --------------*/
-@media only screen and (max-width: 1029px){
+@media only screen and (max-width: 1029px) {
   :root {
     margin-left: 10%;
     margin-right: 10%;
@@ -713,20 +770,18 @@ footer {
 .tooltip-container {
   background-color: var(--secondary-color);
   color: var(--primary-color);
-  padding:5px 10px;
+  padding: 5px 10px;
   border-radius: 5px;
 }
 
 @media only screen and (max-width: 956px) {
-  .multi-dropdown__dropdown{
+  .multi-dropdown__dropdown {
     margin-left: -15.8em;
   }
-  
 }
 
-
 @media only screen and (max-width: 885px) {
-  .appcontainer{
+  .appcontainer {
     width: 100vw;
   }
 
@@ -743,18 +798,18 @@ footer {
     width: 95%;
   }
 
-  .multi-dropdown{
+  .multi-dropdown {
     padding: 4px 9px;
   }
 
-  .header-ul{
+  .header-ul {
     display: flex;
     margin-right: 20px;
   }
-  .helpcontainer{
+  .helpcontainer {
     width: calc(100vw - 40px);
   }
-  .header-ul > .dropdown.chains{
+  .header-ul > .dropdown.chains {
     display: none;
   }
 
@@ -787,7 +842,7 @@ footer {
     width: calc(100vw - 40px);
   }
 
-  .author-section-border{
+  .author-section-border {
     padding: 0;
   }
 
@@ -813,10 +868,10 @@ footer {
   align-items: center;
 }
 
- .page-not-found-title{
-    margin-top: 3rem;
- }
+.page-not-found-title {
+  margin-top: 3rem;
+}
 
- .page-not-found-text{
+.page-not-found-text {
   margin-top: 1rem;
-}
\ No newline at end of file
+}