diff --git a/pkg/service/handlers/web/index.html b/pkg/service/handlers/web/index.html
index 97520bc..2fcbc7f 100644
--- a/pkg/service/handlers/web/index.html
+++ b/pkg/service/handlers/web/index.html
@@ -968,15 +968,6 @@
                 </div>
             </div>
 
-            <div
-                id="current-resolv-pane"
-                style="display: none; margin-bottom: 20px"
-            >
-                        <span class="config-header"
-                        >Current /etc/resolv.conf</span
-                        >
-                <pre id="current-resolv-content"></pre>
-            </div>
 
             <div
                 id="telnet-method-pane"
@@ -1056,7 +1047,9 @@
                 ></div>
             </div>
 
-            <div class="diff-container">
+            <!-- XML diff pair: Current Config | Planned Config. Shown
+                 when URL flip = xml in the Customize form. -->
+            <div class="diff-container" id="xml-diff-row" style="display: none">
                 <div id="xml-diff-pane" class="diff-pane">
                             <span class="config-header"
                             >Current Config (on Speaker)</span
@@ -1082,33 +1075,18 @@
                         <a href="https://github.com/gesellix/bose-soundtouch/blob/main/docs/guides/TROUBLESHOOTING.md#hostname-resolution" target="_blank" style="color: #856404;">Learn more →</a>
                     </div>
                 </div>
-                <div
-                    id="planned-hosts-pane"
-                    class="diff-pane"
-                    style="display: none"
-                >
+            </div>
+
+            <!-- Resolv diff pair: Current /etc/resolv.conf | Planned hook.
+                 Shown when DNS = resolv in the Customize form. -->
+            <div class="diff-container" id="resolv-diff-row" style="display: none; margin-top: 12px">
+                <div id="current-resolv-pane" class="diff-pane">
                             <span class="config-header"
-                            >Planned /etc/hosts Entries</span
+                            >Current /etc/resolv.conf</span
                             >
-                    <pre id="planned-hosts"></pre>
-                    <div
-                        style="
-                                    margin-top: 10px;
-                                    font-size: 0.9em;
-                                    color: #666;
-                                "
-                    >
-                        <strong>Note:</strong> This method also injects
-                        the AfterTouch Local Root CA into
-                        <code>/etc/pki/tls/certs/ca-bundle.crt</code> to
-                        enable secure HTTPS communication.
-                    </div>
+                    <pre id="current-resolv-content"></pre>
                 </div>
-                <div
-                    id="planned-resolv-pane"
-                    class="diff-pane"
-                    style="display: none"
-                >
+                <div id="planned-resolv-pane" class="diff-pane">
                             <span class="config-header"
                             >Planned /etc/resolv.conf Hook</span
                             >
diff --git a/pkg/service/handlers/web/js/script.js b/pkg/service/handlers/web/js/script.js
index 36c4180..1262705 100644
--- a/pkg/service/handlers/web/js/script.js
+++ b/pkg/service/handlers/web/js/script.js
@@ -1811,7 +1811,6 @@ async function showSummary(deviceId) {
         currentConfigElem.style.color = summary.ssh_success ? "black" : "red";
 
         document.getElementById("planned-config").innerText = summary.planned_config;
-        document.getElementById("planned-hosts").innerText = summary.planned_hosts || "";
         document.getElementById("planned-resolv").innerText = summary.planned_resolv || "";
 
         const resolveErrEl = document.getElementById("resolve-ip-error");
@@ -3143,19 +3142,19 @@ function onCustomizeChange() {
     const dns = (document.querySelector('input[name="customize-dns"]:checked') || {}).value || "none";
     const caInstall = !!(document.getElementById("customize-ca-install") || {}).checked;
 
-    // Visibility of the legacy preview/test panes inside Customize.
+    // Visibility of the diff pairs and per-method panes. Each diff
+    // pair is its own .diff-container row so the Current/Planned
+    // columns line up side-by-side per axis instead of mixing into
+    // a single 3+ column layout.
     const show = (id, on) => {
         const el = document.getElementById(id);
-        if (el) el.style.display = on ? "block" : "none";
+        if (el) el.style.display = on ? "" : "none";
     };
-    show("xml-diff-pane",     flip === "xml");
-    show("planned-xml-pane",  flip === "xml");
+    show("xml-diff-row",     flip === "xml");
+    show("resolv-diff-row",  dns === "resolv");
     show("telnet-method-pane", flip === "telnet");
-    show("planned-resolv-pane", dns === "resolv");
-    show("planned-hosts-pane", false);
-    show("current-resolv-pane", dns === "resolv");
-    show("hosts-redirection-test", false);
     show("dns-redirection-test", dns === "resolv");
+    show("hosts-redirection-test", false);
 
     // Validate the combination and toggle the Apply button.
     const errors = [];