From ff1a3999039494f8513b517249276f65e084fec6 Mon Sep 17 00:00:00 2001
From: Ritchie Cunningham <ritchie@ritchiecunningham.co.uk>
Date: Sat, 23 Aug 2025 16:24:06 +0100
Subject: [PATCH] Responsive layout for mobile devices.

---
 dist/style.css | 26 +++++++++++++++++++++++++-
 1 file changed, 25 insertions(+), 1 deletion(-)

diff --git a/dist/style.css b/dist/style.css
index 2684e2e..10a7aa0 100644
--- a/dist/style.css
+++ b/dist/style.css
@@ -46,7 +46,7 @@ body {
 }
 
 #score-container {
-    color: #FFD700; /* Gold */
+    color: #FFD700; /* Gold. */
     font-size: 36px;
     text-shadow: 2px 2px 4px #000000;
     text-align: center;
@@ -144,3 +144,27 @@ body {
     background-color: #CCCCCC;
     color: #121212;
 }
+
+@media (max-width: 768px) {
+    #main-container {
+        flex-direction: column;
+        align-items: center;
+    }
+
+    #slap-image {
+        width: 80vw; /* 80% of the viewport width. */
+    }
+
+    #leaderboard-container {
+        margin-top: 20px;
+    }
+
+    #save-score {
+        padding: 15px 30px;
+        font-size: 24px;
+    }
+
+    #score-container {
+        font-size: 24px;
+    }
+}