diff --git a/web/app/src/assets/base.css b/web/app/src/assets/base.css
index 2b0f031d..c642e174 100644
--- a/web/app/src/assets/base.css
+++ b/web/app/src/assets/base.css
@@ -109,6 +109,15 @@ body {
   width: calc(100% - calc(var(--grid-gap) * 2));
 }
 
+body.is-two-columns #app {
+  grid-template-areas:
+    "header header"
+    "col-1 col-2"
+    "footer footer";
+  grid-template-columns: 1fr 1fr;
+  grid-template-rows: var(--header-height) 1fr var(--footer-height);
+}
+
 @media (max-width: 1280px) {
   #app {
     grid-template-areas:
@@ -121,6 +130,18 @@ body {
   }
 }
 
+@media (max-width: 960px) {
+  body.is-two-columns #app {
+    grid-template-areas:
+      "header"
+      "col-1"
+      "col-2"
+      "footer";
+    grid-template-columns: 1fr;
+    grid-template-rows: var(--header-height) 1fr 1fr var(--footer-height);
+  }
+}
+
 .col {
   background-color: var(--color-background-column);
   border-radius: var(--border-radius);
diff --git a/web/app/src/views/WorkersView.vue b/web/app/src/views/WorkersView.vue
index 6e40d191..906c8c54 100644
--- a/web/app/src/views/WorkersView.vue
+++ b/web/app/src/views/WorkersView.vue
@@ -50,6 +50,8 @@ export default {
   mounted() {
     window.workersView = this;
     this._fetchWorker(this.workerID);
+
+    document.body.classList.add('is-two-columns');
   },
   watch: {
     workerID(newWorkerID, oldWorkerID) {