diff --git a/services/gateway/static/index.html b/services/gateway/static/index.html
index c2af24c..bf37ed5 100644
--- a/services/gateway/static/index.html
+++ b/services/gateway/static/index.html
@@ -12,67 +12,71 @@
   </header>
 
   <main>
-    <section id="submit-panel">
-      <h2>Submit a transaction</h2>
-      <form id="tx-form">
-        <label>Account
-          <select id="account-select"></select>
+    <div class="row">
+      <section id="submit-panel">
+        <h2>Submit a transaction</h2>
+        <form id="tx-form">
+          <label>Account
+            <select id="account-select"></select>
+          </label>
+          <label>Amount (minor units)
+            <input type="number" id="amount-input" value="1000" min="0">
+          </label>
+          <label>Merchant
+            <input type="text" id="merchant-input" value="Corner Store">
+          </label>
+          <fieldset>
+            <legend>Kind</legend>
+            <label><input type="radio" name="kind" value="deposit" checked> deposit</label>
+            <label><input type="radio" name="kind" value="withdrawal"> withdrawal</label>
+            <label><input type="radio" name="kind" value="purchase"> purchase</label>
+          </fieldset>
+          <button type="submit">Submit</button>
+        </form>
+      </section>
+
+      <section id="load-panel">
+        <h2>Load burst</h2>
+        <label>N
+          <select id="burst-n">
+            <option value="10">10</option>
+            <option value="50">50</option>
+            <option value="200">200</option>
+          </select>
         </label>
-        <label>Amount (minor units)
-          <input type="number" id="amount-input" value="1000" min="0">
-        </label>
-        <label>Merchant
-          <input type="text" id="merchant-input" value="Corner Store">
-        </label>
-        <fieldset>
-          <legend>Kind</legend>
-          <label><input type="radio" name="kind" value="deposit" checked> deposit</label>
-          <label><input type="radio" name="kind" value="withdrawal"> withdrawal</label>
-          <label><input type="radio" name="kind" value="purchase"> purchase</label>
-        </fieldset>
-        <button type="submit">Submit</button>
-      </form>
-    </section>
+        <button id="burst-button">Fire burst</button>
+        <table id="burst-table">
+          <thead>
+            <tr><th>count</th><th>success</th><th>errors</th><th>min</th><th>mean</th><th>p50</th><th>p95</th><th>max</th></tr>
+          </thead>
+          <tbody><tr><td colspan="8">no burst run yet</td></tr></tbody>
+        </table>
+      </section>
+    </div>
 
-    <section id="load-panel">
-      <h2>Load burst</h2>
-      <label>N
-        <select id="burst-n">
-          <option value="10">10</option>
-          <option value="50">50</option>
-          <option value="200">200</option>
-        </select>
-      </label>
-      <button id="burst-button">Fire burst</button>
-      <table id="burst-table">
-        <thead>
-          <tr><th>count</th><th>success</th><th>errors</th><th>min</th><th>mean</th><th>p50</th><th>p95</th><th>max</th></tr>
-        </thead>
-        <tbody><tr><td colspan="8">no burst run yet</td></tr></tbody>
-      </table>
-    </section>
+    <div class="row">
+      <section id="result-panel">
+        <h2>Result</h2>
+        <p>Round-trip: <span id="result-rtt">--</span> ms &middot; request_id: <code id="result-request-id">--</code></p>
+        <pre id="result-json">(nothing yet)</pre>
+      </section>
 
-    <section id="result-panel">
-      <h2>Result</h2>
-      <p>Round-trip: <span id="result-rtt">--</span> ms &middot; request_id: <code id="result-request-id">--</code></p>
-      <pre id="result-json">(nothing yet)</pre>
-    </section>
+      <section id="chaos-panel">
+        <h2>Chaos</h2>
+        <div id="chaos-flags"></div>
+        <div id="chaos-profiles">
+          <button data-profile="clean">clean</button>
+          <button data-profile="light">light</button>
+          <button data-profile="nightmare">nightmare</button>
+          <button data-profile="random">random</button>
+        </div>
+      </section>
 
-    <section id="chaos-panel">
-      <h2>Chaos</h2>
-      <div id="chaos-flags"></div>
-      <div id="chaos-profiles">
-        <button data-profile="clean">clean</button>
-        <button data-profile="light">light</button>
-        <button data-profile="nightmare">nightmare</button>
-        <button data-profile="random">random</button>
-      </div>
-    </section>
-
-    <section id="health-panel">
-      <h2>Service health</h2>
-      <div id="health-strip"></div>
-    </section>
+      <section id="health-panel">
+        <h2>Service health</h2>
+        <div id="health-strip"></div>
+      </section>
+    </div>
   </main>
 
   <script src="/static/app.js"></script>
diff --git a/services/gateway/static/style.css b/services/gateway/static/style.css
index a7aceca..34603ac 100644
--- a/services/gateway/static/style.css
+++ b/services/gateway/static/style.css
@@ -39,31 +39,27 @@ header h1 {
   font-size: 0.85rem;
 }
 
-/* 6-column grid: row 1 panels span 3 (half), row 2 panels span 2 (third).
-   The grid gap is subtracted before dividing, so with gap g and width W
-   a half panel is (W - g) / 2 and a third panel is (W - 2g) / 3. */
 main {
-  display: grid;
-  grid-template-columns: repeat(6, minmax(0, 1fr));
+  display: flex;
+  flex-direction: column;
   gap: 1.5rem;
   margin-top: 1.5rem;
 }
 
-main > section {
-  grid-column: span 2;
-  min-width: 0;
-}
-
-#submit-panel,
-#load-panel {
-  grid-column: span 3;
+/* Each row is full width and splits it evenly between its panels. The gap
+   is subtracted before dividing, so with gap g and width W two panels are
+   (W - g) / 2 each and three panels are (W - 2g) / 3 each. */
+.row {
+  display: grid;
+  grid-auto-flow: column;
+  grid-auto-columns: minmax(0, 1fr);
+  gap: 1.5rem;
+  width: 100%;
 }
 
 @media (max-width: 900px) {
-  main > section,
-  #submit-panel,
-  #load-panel {
-    grid-column: 1 / -1;
+  .row {
+    grid-auto-flow: row;
   }
 }