From e7cebed25ac28ffceb8a6050fa76ba1062e41a60 Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Fri, 23 Jan 2026 13:09:48 +0000
Subject: [PATCH 1/5] Initial plan


From de6d93ab58720723e256c8fa31436f5d9df0e043 Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Fri, 23 Jan 2026 13:12:29 +0000
Subject: [PATCH 2/5] Add mobile responsive CSS fixes for horizontal scroll and
 title sizing

Co-authored-by: maxonary <62939182+maxonary@users.noreply.github.com>
---
 frontend/src/App.css               |  4 +++
 frontend/src/index.css             |  7 ++++
 frontend/src/styles/Minecraft.css  | 58 ++++++++++++++++++++++++++++++
 frontend/src/styles/TitleImage.css | 17 +++++++++
 frontend/src/styles/UserTable.css  | 55 ++++++++++++++++++++++++++++
 5 files changed, 141 insertions(+)

diff --git a/frontend/src/App.css b/frontend/src/App.css
index ead0934..85ebbd9 100644
--- a/frontend/src/App.css
+++ b/frontend/src/App.css
@@ -1,5 +1,7 @@
 .App {
   text-align: center;
+  max-width: 100vw;
+  overflow-x: hidden;
 }
 
 .AppContainer {
@@ -9,4 +11,6 @@
   flex-direction: column;
   width: 100%;
   height: 100%;
+  max-width: 100vw;
+  overflow-x: hidden;
 }
\ No newline at end of file
diff --git a/frontend/src/index.css b/frontend/src/index.css
index ec2585e..aecdd5c 100644
--- a/frontend/src/index.css
+++ b/frontend/src/index.css
@@ -5,6 +5,13 @@ body {
     sans-serif;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
+  overflow-x: hidden;
+  max-width: 100vw;
+}
+
+html {
+  overflow-x: hidden;
+  max-width: 100vw;
 }
 
 code {
diff --git a/frontend/src/styles/Minecraft.css b/frontend/src/styles/Minecraft.css
index a31124d..57556d3 100644
--- a/frontend/src/styles/Minecraft.css
+++ b/frontend/src/styles/Minecraft.css
@@ -36,6 +36,8 @@ body {
   height: 100vh;
   justify-content: center;
   position: relative;
+  overflow-x: hidden;
+  overflow-y: auto;
 }
 
 button {
@@ -86,6 +88,9 @@ button {
     'lang fourth 		.'
   ;
   grid-gap: 8px;
+  max-width: 100vw;
+  padding: 0 10px;
+  box-sizing: border-box;
 }
 
 .menu :nth-child(1) {grid-area: first;}
@@ -120,6 +125,9 @@ button {
   '.    sixth 		.'
 ;
 grid-gap: 8px;
+max-width: 100vw;
+padding: 0 10px;
+box-sizing: border-box;
 }
 
 .menu-register :nth-child(1) {grid-area: first;}
@@ -141,6 +149,9 @@ grid-gap: 8px;
   '. 		second 		.'
 ;
 grid-gap: 8px;
+max-width: 100vw;
+padding: 0 10px;
+box-sizing: border-box;
 }
 .menu-dashboard :nth-child(1) {grid-area: first;}
 .menu-dashboard .double {grid-area: second;}
@@ -204,4 +215,51 @@ grid-gap: 8px;
 
 .error-message {
   color: red;
+}
+
+/* Mobile responsive styles */
+@media (max-width: 768px) {
+  :root {
+    --btn-size: 25pt;
+  }
+
+  .menu,
+  .menu-register,
+  .menu-dashboard {
+    grid-template-columns: calc(var(--btn-size) * 0.8) calc(var(--btn-size) * 8) calc(var(--btn-size) * 0.8);
+    padding: 0 5px;
+  }
+
+  .title {
+    font-size: 0.9em;
+  }
+}
+
+@media (max-width: 480px) {
+  :root {
+    --btn-size: 22pt;
+  }
+
+  .menu,
+  .menu-register,
+  .menu-dashboard {
+    grid-template-columns: 15px minmax(250px, calc(100vw - 50px)) 15px;
+    padding: 0 5px;
+    grid-gap: 6px;
+  }
+
+  .title {
+    font-size: 0.8em;
+    padding-left: 5px;
+    padding-right: 5px;
+  }
+
+  .item.lang {
+    width: 100%;
+  }
+
+  .item.lang img {
+    width: 20px;
+    height: 20px;
+  }
 }
\ No newline at end of file
diff --git a/frontend/src/styles/TitleImage.css b/frontend/src/styles/TitleImage.css
index ee5a510..c76bc51 100644
--- a/frontend/src/styles/TitleImage.css
+++ b/frontend/src/styles/TitleImage.css
@@ -2,4 +2,21 @@
   height: 100px;
   margin-bottom: 50px;
   cursor: pointer;
+  max-width: calc(100vw - 40px);
+  object-fit: contain;
+}
+
+@media (max-width: 768px) {
+  .title-image {
+    height: 80px;
+    margin-bottom: 30px;
+  }
+}
+
+@media (max-width: 480px) {
+  .title-image {
+    height: 60px;
+    margin-bottom: 20px;
+    max-width: calc(100vw - 20px);
+  }
 }
\ No newline at end of file
diff --git a/frontend/src/styles/UserTable.css b/frontend/src/styles/UserTable.css
index 94987e3..e41255e 100644
--- a/frontend/src/styles/UserTable.css
+++ b/frontend/src/styles/UserTable.css
@@ -3,9 +3,12 @@ table {
   display: block;
   max-height: 300px;
   overflow-y: auto;
+  overflow-x: auto;
   table-layout: fixed;
   border-collapse: collapse;
   font-size: 16px;
+  width: 100%;
+  max-width: calc(100vw - 40px);
 }
 
 button {
@@ -39,6 +42,54 @@ td:nth-child(3), td:nth-child(4) {
 @media (max-width: 600px) {
   table {
     font-size: 14px;
+    max-width: calc(100vw - 20px);
+  }
+
+  th, td {
+    padding: 0 4px;
+    font-size: 12px;
+  }
+
+  button {
+    font-size: 11px;
+    padding: 2px 4px;
+  }
+
+  input[type="checkbox"] {
+    margin-left: 8px;
+  }
+}
+
+@media (max-width: 480px) {
+  table {
+    font-size: 12px;
+    max-width: calc(100vw - 20px);
+  }
+
+  th, td {
+    padding: 0 3px;
+    font-size: 11px;
+  }
+
+  button {
+    font-size: 10px;
+    padding: 2px 3px;
+  }
+
+  input[type="checkbox"] {
+    margin-left: 5px;
+  }
+
+  /* Make columns narrower on very small screens */
+  th:nth-child(1), td:nth-child(1) {
+    max-width: 100px;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+
+  th:nth-child(2), td:nth-child(2) {
+    max-width: 60px;
   }
 }
 
@@ -55,4 +106,8 @@ td:nth-child(3), td:nth-child(4) {
   align-items: center;
   justify-content: center;
   flex-direction: column;
+  max-width: 100vw;
+  overflow-x: hidden;
+  box-sizing: border-box;
+  padding: 10px;
 }
\ No newline at end of file

From fb76aeafa69da2d812fafcc82640f683d858002f Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Fri, 23 Jan 2026 13:17:55 +0000
Subject: [PATCH 3/5] Fix code review issues - consistent padding and allow
 table horizontal scroll

Co-authored-by: maxonary <62939182+maxonary@users.noreply.github.com>
---
 frontend/src/styles/UserTable.css | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)

diff --git a/frontend/src/styles/UserTable.css b/frontend/src/styles/UserTable.css
index e41255e..dc0b79c 100644
--- a/frontend/src/styles/UserTable.css
+++ b/frontend/src/styles/UserTable.css
@@ -42,7 +42,7 @@ td:nth-child(3), td:nth-child(4) {
 @media (max-width: 600px) {
   table {
     font-size: 14px;
-    max-width: calc(100vw - 20px);
+    max-width: calc(100vw - 40px);
   }
 
   th, td {
@@ -63,7 +63,7 @@ td:nth-child(3), td:nth-child(4) {
 @media (max-width: 480px) {
   table {
     font-size: 12px;
-    max-width: calc(100vw - 20px);
+    max-width: calc(100vw - 30px);
   }
 
   th, td {
@@ -107,7 +107,6 @@ td:nth-child(3), td:nth-child(4) {
   justify-content: center;
   flex-direction: column;
   max-width: 100vw;
-  overflow-x: hidden;
   box-sizing: border-box;
   padding: 10px;
 }
\ No newline at end of file

From 9aaee30d0a18272affa9233860b8f9c2d86f16fc Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Mon, 2 Feb 2026 11:11:53 +0000
Subject: [PATCH 4/5] Keep button sizes consistent between mobile and desktop
 views

Co-authored-by: maxonary <62939182+maxonary@users.noreply.github.com>
---
 frontend/src/styles/Minecraft.css | 41 ++-----------------------------
 1 file changed, 2 insertions(+), 39 deletions(-)

diff --git a/frontend/src/styles/Minecraft.css b/frontend/src/styles/Minecraft.css
index 57556d3..88fac02 100644
--- a/frontend/src/styles/Minecraft.css
+++ b/frontend/src/styles/Minecraft.css
@@ -218,48 +218,11 @@ box-sizing: border-box;
 }
 
 /* Mobile responsive styles */
-@media (max-width: 768px) {
-  :root {
-    --btn-size: 25pt;
-  }
-
-  .menu,
-  .menu-register,
-  .menu-dashboard {
-    grid-template-columns: calc(var(--btn-size) * 0.8) calc(var(--btn-size) * 8) calc(var(--btn-size) * 0.8);
-    padding: 0 5px;
-  }
-
-  .title {
-    font-size: 0.9em;
-  }
-}
-
 @media (max-width: 480px) {
-  :root {
-    --btn-size: 22pt;
-  }
-
   .menu,
   .menu-register,
   .menu-dashboard {
-    grid-template-columns: 15px minmax(250px, calc(100vw - 50px)) 15px;
-    padding: 0 5px;
-    grid-gap: 6px;
-  }
-
-  .title {
-    font-size: 0.8em;
-    padding-left: 5px;
-    padding-right: 5px;
-  }
-
-  .item.lang {
-    width: 100%;
-  }
-
-  .item.lang img {
-    width: 20px;
-    height: 20px;
+    grid-template-columns: var(--btn-size) calc(100vw - calc(var(--btn-size) * 2) - 40px) var(--btn-size);
+    padding: 0 10px;
   }
 }
\ No newline at end of file

From 8af24fe84d3258f31633a38023393d658e88fa68 Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Mon, 2 Feb 2026 11:12:49 +0000
Subject: [PATCH 5/5] Fix grid column calculation to account for padding and
 gaps

Co-authored-by: maxonary <62939182+maxonary@users.noreply.github.com>
---
 frontend/src/styles/Minecraft.css | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/src/styles/Minecraft.css b/frontend/src/styles/Minecraft.css
index 88fac02..c1cd7f2 100644
--- a/frontend/src/styles/Minecraft.css
+++ b/frontend/src/styles/Minecraft.css
@@ -222,7 +222,7 @@ box-sizing: border-box;
   .menu,
   .menu-register,
   .menu-dashboard {
-    grid-template-columns: var(--btn-size) calc(100vw - calc(var(--btn-size) * 2) - 40px) var(--btn-size);
+    grid-template-columns: var(--btn-size) calc(100vw - calc(var(--btn-size) * 2) - 36px) var(--btn-size);
     padding: 0 10px;
   }
 }
\ No newline at end of file