diff --git a/cmd/koralmapper/main.go b/cmd/koralmapper/main.go
index 3a2b318..732cc2b 100644
--- a/cmd/koralmapper/main.go
+++ b/cmd/koralmapper/main.go
@@ -380,26 +380,24 @@
 
 	data.MappingSections = []MappingSectionData{
 		{
-			Title:           "Request",
-			Mode:            "request",
-			CheckboxClass:   "request-cb",
-			CheckboxName:    "request",
-			FieldsClass:     "request-fields",
-			ArrowClass:      "request-dir-arrow",
-			ArrowDirection:  "atob",
-			ArrowLabel:      "\u2192",
-			AnnotationLabel: "(query)",
+			Title:          "Request",
+			Mode:           "request",
+			CheckboxClass:  "request-cb",
+			CheckboxName:   "request",
+			FieldsClass:    "request-fields",
+			ArrowClass:     "request-dir-arrow",
+			ArrowDirection: "atob",
+			ArrowLabel:     "\u2192",
 		},
 		{
-			Title:           "Response",
-			Mode:            "response",
-			CheckboxClass:   "response-cb",
-			CheckboxName:    "response",
-			FieldsClass:     "response-fields",
-			ArrowClass:      "response-dir-arrow",
-			ArrowDirection:  "btoa",
-			ArrowLabel:      "\u2190",
-			AnnotationLabel: "(query)",
+			Title:          "Response",
+			Mode:           "response",
+			CheckboxClass:  "response-cb",
+			CheckboxName:   "response",
+			FieldsClass:    "response-fields",
+			ArrowClass:     "response-dir-arrow",
+			ArrowDirection: "btoa",
+			ArrowLabel:     "\u2190",
 		},
 	}
 
diff --git a/cmd/koralmapper/main_test.go b/cmd/koralmapper/main_test.go
index c9b1be4..b4dfc02 100644
--- a/cmd/koralmapper/main_test.go
+++ b/cmd/koralmapper/main_test.go
@@ -1944,7 +1944,7 @@
 	assert.Contains(t, htmlContent, "<legend>Response</legend>")
 
 	// Annotation mapping entries
-	assert.Contains(t, htmlContent, "(query)")
+	assert.Contains(t, htmlContent, "query")
 	assert.Contains(t, htmlContent, "anno-mapper")
 	assert.Contains(t, htmlContent, `data-id="anno-mapper"`)
 	assert.Contains(t, htmlContent, `data-type="annotation"`)
@@ -1953,7 +1953,7 @@
 	assert.Contains(t, htmlContent, "Annotation mapping")
 
 	// Corpus mapping entries
-	assert.Contains(t, htmlContent, "(corpus)")
+	assert.Contains(t, htmlContent, "corpus")
 	assert.Contains(t, htmlContent, "<strong>corpus-mapper</strong>")
 	assert.Contains(t, htmlContent, `data-id="corpus-mapper"`)
 	assert.Contains(t, htmlContent, `data-type="corpus"`)
diff --git a/cmd/koralmapper/static/config.html b/cmd/koralmapper/static/config.html
index c258267..ef682f5 100644
--- a/cmd/koralmapper/static/config.html
+++ b/cmd/koralmapper/static/config.html
@@ -23,7 +23,7 @@
                  data-default-foundry-b="{{.FoundryB}}" data-default-layer-b="{{.LayerB}}">
                 <div class="mapping-row">
                     <input type="checkbox" id="check-{{.ID}}-{{$section.Mode}}" class="checkbox {{$section.CheckboxClass}}" name="{{$section.CheckboxName}}">
-                    <label for="check-{{.ID}}-{{$section.Mode}}"><span></span>{{$section.AnnotationLabel}} <strong>{{.ID}}</strong></label>
+                    <label for="check-{{.ID}}-{{$section.Mode}}"><span></span><span class="data-mode">query</span> <strong>{{.ID}}</strong></label>
                     <div class="mapping-fields {{$section.FieldsClass}}">
                         <input type="text" class="{{$section.Mode}}-foundryA" value="{{.FoundryA}}" placeholder="{{.FoundryA}}" size="8">/<input type="text" class="{{$section.Mode}}-layerA" value="{{.LayerA}}" placeholder="{{.LayerA}}" size="4">
                         <button type="button" class="{{$section.ArrowClass}}" data-dir="{{$section.ArrowDirection}}">{{$section.ArrowLabel}}</button>
@@ -37,7 +37,7 @@
                  data-default-field-a="{{.FieldA}}" data-default-field-b="{{.FieldB}}">
                 <div class="mapping-row">
                     <input type="checkbox" id="check-{{.ID}}-{{$section.Mode}}" class="checkbox {{$section.CheckboxClass}}" name="{{$section.CheckboxName}}">
-                    <label for="check-{{.ID}}-{{$section.Mode}}"><span></span>(corpus) <strong>{{.ID}}</strong></label>
+                    <label for="check-{{.ID}}-{{$section.Mode}}"><span></span><span class="data-mode">corpus</span> <strong>{{.ID}}</strong></label>
                     <div class="mapping-fields {{$section.FieldsClass}}">
                         <input type="text" class="{{$section.Mode}}-fieldA" value="{{.FieldA}}" placeholder="{{.FieldA}}" size="10">
                         <button type="button" class="{{$section.ArrowClass}}" data-dir="{{$section.ArrowDirection}}">{{$section.ArrowLabel}}</button>
@@ -51,20 +51,19 @@
         {{end}}
 
         <section>
-          <h2>Available Mappings</h2>
           <dl>
             {{range .AnnotationMappings}}
-            <dt>{{.ID}}</dt>
+            <dt>{{.ID}}:</dt>
             {{if .Description}}<dd>{{.Description}}</dd>{{end}}
             {{end}}
             {{range .CorpusMappings}}
-            <dt>{{.ID}}</dt>
+            <dt>{{.ID}}:</dt>
             {{if .Description}}<dd>{{.Description}}</dd>{{end}}
             {{end}}
           </dl>
         </section>
 
-        <section class="mapping-section">
+        <section class="mapping-section" id="pipe-info">
             <fieldset style="font-size: 0.8em;">
                 <label class="cfg-line-label" for="request-cfg-preview">Request:</label>
             <input type="text" id="request-cfg-preview" class="cfg-preview request-cfg-preview" readonly value="">
diff --git a/cmd/koralmapper/static/config.js b/cmd/koralmapper/static/config.js
index 9dff479..a98aa61 100644
--- a/cmd/koralmapper/static/config.js
+++ b/cmd/koralmapper/static/config.js
@@ -212,11 +212,8 @@
 
       var id = div.dataset.id;
       var dir = "atob";
-
-      if (div.dataset.type !== "corpus") {
-        var arrow = div.querySelector(classes.dirArrow);
-        dir = arrow ? arrow.dataset.dir : "atob";
-      }
+      var arrow = div.querySelector(classes.dirArrow);
+      dir = arrow ? arrow.dataset.dir : "atob";
 
       if (div.dataset.type !== "corpus") {
         var fA = cfgFieldValue(div, classes.foundryA, "defaultFoundryA");
diff --git a/cmd/koralmapper/static/style.css b/cmd/koralmapper/static/style.css
index 6680a1c..4fd7230 100644
--- a/cmd/koralmapper/static/style.css
+++ b/cmd/koralmapper/static/style.css
@@ -1,11 +1,41 @@
-.mapping-row {
-    display: flex;
-    align-items: center;
-    gap: 0.75rem;
-    margin: 0.35rem 0;
-    background-color: var(--color-bg-secondary);
+dt {   
+    margin-top:.7rem
 }
-.mapping-fields { display: inline-flex; align-items: center; gap: 0.35rem; }
+
+.mapping-row {
+    display: grid;
+    grid-template-columns: 13em auto;
+    gap: 0.75rem;
+    background-color: var(--color-bg-secondary);
+    
+}
+
+.mapping-row .mapping-fields {
+    display: flex;
+    max-width:22em;
+    justify-content: center;
+    margin:.2em 0;
+}
+
+.data-mode {
+    display: inline-block;
+    font-size:70%;
+    width: 6em;
+    text-align: center;
+    border: 1px solid grey;
+    background-color: #ffcc55;
+    border-radius: 5px;
+}
+
+.mapping-fields > * {
+    margin: 0 .2em;
+    vertical-align:middle;
+}
+
+#pipe-info {
+    display: none;
+}
+
 .mapping-fields input[type="text"] { font-family: monospace; }
 .request-fields, .response-fields { flex-wrap: wrap; }
 .request-dir-arrow, .response-dir-arrow { cursor: pointer; border: 1px solid #bbb; background: #f8f8f8; border-radius: 0.25rem; min-width: 2rem; }