diff --git a/.DS_Store b/.DS_Store
index 5bfc8ad..46abf03 100644
Binary files a/.DS_Store and b/.DS_Store differ
diff --git a/README.md b/README.md
new file mode 100644
index 0000000..b2f672a
--- /dev/null
+++ b/README.md
@@ -0,0 +1,12 @@
+# Мультиплеерный сапер
+
+Написан на `Python` фреймворке `FastAPI` с использованием `Socket.IO` и чистого `HTML/CSS/JS`
+
+Развернут по адресу: https://ms.3spikes.space/ с помощью [RRPSFD](https://git.3spikes.space/docker/rrpsfd)
+
+## Фичи
+
+- Комнаты - Играй с друзьями, просто пришли им код своей комнаты
+- Полная кастомизация - Меняй параметры игры, а также почти всю цветовую палитру
+- Минималистичный дизайн
+- (Новое) Поддержка мобильных устройств и устройств с маленьким (в меру) экраном
\ No newline at end of file
diff --git a/docker-compose.yml b/docker-compose.yml
index 2d85172..a6f7c9d 100644
--- a/docker-compose.yml
+++ b/docker-compose.yml
@@ -1,10 +1,6 @@
-version: '3.8'
 services:
   main:
     build: .
     restart: unless-stopped
-    networks:
-      - tss-net
-networks:
-  tss-net:
-    external: true
+    labels:
+      rrpsfd:ms.3spikes.space: 80 # link to rrpsfd instead of ports: - "80:80"
diff --git a/static/index.html b/static/index.html
index c997b50..ec4372b 100644
--- a/static/index.html
+++ b/static/index.html
@@ -6,6 +6,7 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>Сапер мультиплеер</title>
     <link rel="stylesheet" href="/static/style.css">
+    <link rel="stylesheet" href="/static/small-screens.css">
     <link rel="stylesheet" href="/static/colorpicker.min.css" />
     <script src="/static/socket.io.js"></script>
     <script src="/static/colorpicker.iife.min.js"></script>
@@ -35,8 +36,10 @@
                     </div>
                 </div>
                 <div class="block">
-                    <h3>Новая комната</h3>
                     <div>
+                        <h3>Новая комната</h3>
+                    </div>
+                    <div class="no-wrap">
                         <input id="width" type="number" placeholder="25" min="5" max="25" value="25">
                         <b>X</b>
                         <input id="height" type="number" placeholder="15" min="5" max="15" value="15">
diff --git a/static/small-screens.css b/static/small-screens.css
new file mode 100644
index 0000000..5c461ce
--- /dev/null
+++ b/static/small-screens.css
@@ -0,0 +1,25 @@
+@media (max-width: 1200px) {
+    #game-canvas {
+        width: calc(100% - 300px);
+    }
+}
+
+@media (max-width: 768px) {
+    html {
+        zoom: 75%;
+    }
+
+    #game {
+        flex-direction: column;
+    }
+
+    #game-tools {
+        height: 50vh;
+    }
+
+    #game-canvas {
+        width: 100%;
+    }
+}
+
+@media (max-width: 480px) {}
\ No newline at end of file
diff --git a/static/style.css b/static/style.css
index 8d5dde2..544166f 100644
--- a/static/style.css
+++ b/static/style.css
@@ -51,6 +51,7 @@ body {
 
 .block>div {
     display: flex;
+    flex-wrap: wrap;
     flex: 1 1 auto;
     gap: 5px;
 }
@@ -60,6 +61,10 @@ body {
     text-align: center;
 }
 
+.block>div:not(.no-wrap)>* {
+    min-width: 100px;
+}
+
 #game {
     background: #fff;
 
@@ -72,15 +77,14 @@ body {
     overflow: hidden;
 }
 
-#game,
+/* #game,
 #game-canvas {
-    height: 600px;
-}
+} */
 
 #game-canvas {
     border-right: 1px solid var(--bg);
     background-color: var(--bg-2);
-    width: 800px;
+    aspect-ratio: 4/3;
 }
 
 #game-tools {