diff --git a/resources/templates/components/a-button.html b/resources/templates/components/a-button.html
index c746750c..60387939 100644
--- a/resources/templates/components/a-button.html
+++ b/resources/templates/components/a-button.html
@@ -1 +1,9 @@
-<a class="{{ classes }}"{{ attrs|safe }}>{% if indicator %}<div class="htmx-indicator flex items-center">{% include "templates/components/spinner.html" %}<div class="ml-3">Loading...</div></div>{% endif %}<div class="inline-flex gap-2 items-center justify-center{% if indicator %} htmx-indicator-hidden{% endif %}">{{ body|safe }}</div></a>
+<a class="{{ classes }}"{{ attrs|safe }}>
+  {% if indicator %}
+    <div class="htmx-indicator flex items-center">
+      {% include "templates/components/spinner.html" %}
+      <div class="ml-3">Loading...</div>
+    </div>
+  {% endif %}
+  <div class="inline-flex gap-2 items-center justify-center{% if indicator %} htmx-indicator-hidden{% endif %}">{{ body|safe }}</div>
+</a>
diff --git a/resources/templates/components/a-icon-button.html b/resources/templates/components/a-icon-button.html
index 9265f2a5..051b9dd2 100644
--- a/resources/templates/components/a-icon-button.html
+++ b/resources/templates/components/a-icon-button.html
@@ -1 +1,3 @@
-<a class="{{ classes }}"{{ attrs|safe }}><div class="h-4 w-4">{{ body|safe }}</div></a>
+<a class="{{ classes }}"{{ attrs|safe }}>
+  <div class="h-4 w-4">{{ body|safe }}</div>
+</a>
diff --git a/resources/templates/components/badge.html b/resources/templates/components/badge.html
index cc8a6630..b7c977d3 100644
--- a/resources/templates/components/badge.html
+++ b/resources/templates/components/badge.html
@@ -1 +1,2 @@
-<div class="{{ classes }}"{{ attrs|safe }}>{{ body|safe }}</div>
+<div class="{{ classes }}"{{ attrs|safe }}>{{ body|safe }}
+</div>
diff --git a/resources/templates/components/button-group-button.html b/resources/templates/components/button-group-button.html
index fc8c23ac..7412f48a 100644
--- a/resources/templates/components/button-group-button.html
+++ b/resources/templates/components/button-group-button.html
@@ -1 +1,2 @@
-<button class="{{ classes }}"{{ attrs|safe }}>{{ body|safe }}</button>
+<button class="{{ classes }}"{{ attrs|safe }}>{{ body|safe }}
+</button>
diff --git a/resources/templates/components/button-group.html b/resources/templates/components/button-group.html
index 8cd98844..c174c5f8 100644
--- a/resources/templates/components/button-group.html
+++ b/resources/templates/components/button-group.html
@@ -1 +1,6 @@
-<div class="inline-flex rounded-md shadow-sm" role="group" hx-on:click="this.querySelector(&quot;input&quot;).value = event.target.value; this.querySelector(&quot;input&quot;).dispatchEvent(new Event('change', {bubbles: true}));"><input type="hidden" name="{{ name }}">{{ body|safe }}</div>
+<div class="inline-flex rounded-md shadow-sm"
+     role="group"
+     hx-on:click="this.querySelector(&quot;input&quot;).value = event.target.value; this.querySelector(&quot;input&quot;).dispatchEvent(new Event('change', {bubbles: true}));">
+  <input type="hidden" name="{{ name }}">
+  {{ body|safe }}
+</div>
diff --git a/resources/templates/components/button.html b/resources/templates/components/button.html
index 875664db..0fd392c8 100644
--- a/resources/templates/components/button.html
+++ b/resources/templates/components/button.html
@@ -1 +1,7 @@
-<button class="{{ classes }}"{{ attrs|safe }}><div class="htmx-indicator flex items-center absolute inset-0 justify-center">{% include "templates/components/spinner.html" %}{% if loading_label %}<div class="ml-3">Loading...</div>{% endif %}</div><div class="htmx-indicator-invisible inline-flex gap-2 items-center justify-center">{{ body|safe }}</div></button>
+<button class="{{ classes }}"{{ attrs|safe }}>
+  <div class="htmx-indicator flex items-center absolute inset-0 justify-center">
+    {% include "templates/components/spinner.html" %}
+    {% if loading_label %}<div class="ml-3">Loading...</div>{% endif %}
+  </div>
+  <div class="htmx-indicator-invisible inline-flex gap-2 items-center justify-center">{{ body|safe }}</div>
+</button>
diff --git a/resources/templates/components/data-grid-cell.html b/resources/templates/components/data-grid-cell.html
index 96006923..3f4e8fb2 100644
--- a/resources/templates/components/data-grid-cell.html
+++ b/resources/templates/components/data-grid-cell.html
@@ -1 +1,3 @@
-<td class="px-4 py-2{% if klass %} {{ klass }}{% endif %}"{{ attrs|safe }}>{{ body|safe }}</td>
+<td class="px-4 py-2{% if klass %} {{ klass }}{% endif %}"
+    {{ attrs|safe }}>{{ body|safe }}
+</td>
diff --git a/resources/templates/components/data-grid-header.html b/resources/templates/components/data-grid-header.html
index 7b2a904a..1f04343a 100644
--- a/resources/templates/components/data-grid-header.html
+++ b/resources/templates/components/data-grid-header.html
@@ -1 +1,10 @@
-<th class="px-4 py-3{% if klass %} {{ klass }}{% endif %}" scope="col" @click="{{ click|safe }}"{{ attrs|safe }}>{% if sort_key %}<a href="#">{{ body|safe }}</a>{% else %}{{ body|safe }}{% endif %}</th>
+<th class="px-4 py-3{% if klass %} {{ klass }}{% endif %}"
+    scope="col"
+    @click="{{ click|safe }}"
+    {{ attrs|safe }}>
+  {% if sort_key %}
+    <a href="#">{{ body|safe }}</a>
+  {% else %}
+    {{ body|safe }}
+  {% endif %}
+</th>
diff --git a/resources/templates/components/data-grid-row.html b/resources/templates/components/data-grid-row.html
index 8162179f..cf9a5f9c 100644
--- a/resources/templates/components/data-grid-row.html
+++ b/resources/templates/components/data-grid-row.html
@@ -1 +1,2 @@
-<tr class="{{ classes }}"{{ attrs|safe }}>{{ body|safe }}</tr>
+<tr class="{{ classes }}"{{ attrs|safe }}>{{ body|safe }}
+</tr>
diff --git a/resources/templates/components/data-grid.html b/resources/templates/components/data-grid.html
index 6231a37f..7dd57c92 100644
--- a/resources/templates/components/data-grid.html
+++ b/resources/templates/components/data-grid.html
@@ -1 +1,11 @@
-<div class="shrink overflow-y-scroll"><table class="{{ table_class }}"{{ table_attrs|safe }}><thead class="{{ thead_class }}"><tr>{{ headers|safe }}</tr></thead><tbody>{{ rows|safe }}</tbody>{{ footer_tbody|safe }}</table></div>
+<div class="shrink overflow-y-scroll">
+  <table class="{{ table_class }}"{{ table_attrs|safe }}>
+    <thead class="{{ thead_class }}">
+      <tr>{{ headers|safe }}</tr>
+    </thead>
+    <tbody>
+      {{ rows|safe }}
+    </tbody>
+    {{ footer_tbody|safe }}
+  </table>
+</div>
diff --git a/resources/templates/components/location-select.html b/resources/templates/components/location-select.html
index c96755d7..1b210640 100644
--- a/resources/templates/components/location-select.html
+++ b/resources/templates/components/location-select.html
@@ -3,6 +3,6 @@
    surrounding Hiccup row via the auto-ap.ssr.selmer interop bridge. #}
 <select name="{{ name }}" class="{{ classes }}">
   {% for opt in options %}
-  <option value="{{ opt.value }}"{% if opt.selected %} selected{% endif %}>{{ opt.label }}</option>
+    <option value="{{ opt.value }}"{% if opt.selected %} selected{% endif %}>{{ opt.label }}</option>
   {% endfor %}
 </select>
diff --git a/resources/templates/components/modal.html b/resources/templates/components/modal.html
index 497175e0..7e80c083 100644
--- a/resources/templates/components/modal.html
+++ b/resources/templates/components/modal.html
@@ -1 +1,2 @@
-<div class="{{ classes }}" @click.outside="open=false"{{ attrs|safe }}>{{ body|safe }}</div>
+<div class="{{ classes }}" @click.outside="open=false"{{ attrs|safe }}>{{ body|safe }}
+</div>
diff --git a/resources/templates/components/money-input.html b/resources/templates/components/money-input.html
index 99103792..85eb7949 100644
--- a/resources/templates/components/money-input.html
+++ b/resources/templates/components/money-input.html
@@ -1,2 +1,2 @@
 {# Money input (number, step=0.01, right-aligned). sc/money-input builds `attrs`. #}
-<input{{ attrs|safe }}>
+<input {{ attrs|safe }}>
diff --git a/resources/templates/components/radio-card.html b/resources/templates/components/radio-card.html
index e7b9e56e..ec911088 100644
--- a/resources/templates/components/radio-card.html
+++ b/resources/templates/components/radio-card.html
@@ -1 +1,16 @@
-<ul class="{{ ul_class }}">{% for opt in options %}<li class="{{ li_class }}"><div class="{{ div_class }}"><input id="{{ opt.id }}" type="radio" value="{{ opt.value }}" name="{{ name }}" class="{{ input_class }}"{{ input_attrs|safe }}{% if opt.checked %} checked{% endif %}><label for="{{ opt.id }}" class="{{ label_class }}">{{ opt.content|safe }}</label></div></li>{% endfor %}</ul>
+<ul class="{{ ul_class }}">
+  {% for opt in options %}
+    <li class="{{ li_class }}">
+      <div class="{{ div_class }}">
+        <input id="{{ opt.id }}"
+               type="radio"
+               value="{{ opt.value }}"
+               name="{{ name }}"
+               class="{{ input_class }}"
+               {{ input_attrs|safe }}
+               {% if opt.checked %}checked{% endif %}>
+        <label for="{{ opt.id }}" class="{{ label_class }}">{{ opt.content|safe }}</label>
+      </div>
+    </li>
+  {% endfor %}
+</ul>
diff --git a/resources/templates/components/select.html b/resources/templates/components/select.html
index cc7eab4e..57755cf7 100644
--- a/resources/templates/components/select.html
+++ b/resources/templates/components/select.html
@@ -1,4 +1,8 @@
 {# Generic <select>. options = [{value, label, selected}]. Plain-HTML attributes -- the
    Selmer migration target (no Hiccup keyword/string attribute ambiguity). Extra attrs
    (hx-*, x-*) ride through {{ attrs|safe }}. #}
-<select name="{{ name }}" class="{{ classes }}"{{ attrs|safe }}>{% for opt in options %}<option value="{{ opt.value }}"{% if opt.selected %} selected{% endif %}>{{ opt.label }}</option>{% endfor %}</select>
+<select name="{{ name }}" class="{{ classes }}"{{ attrs|safe }}>
+  {% for opt in options %}
+    <option value="{{ opt.value }}"{% if opt.selected %} selected{% endif %}>{{ opt.label }}</option>
+  {% endfor %}
+</select>
diff --git a/resources/templates/components/spinner.html b/resources/templates/components/spinner.html
index 2b408d87..c2f17b6b 100644
--- a/resources/templates/components/spinner.html
+++ b/resources/templates/components/spinner.html
@@ -1 +1,11 @@
-<svg aria-hidden="true" class="animate-spin inline w-4 h-4 text-white" fill="none" role="status" viewbox="0 0 100 101" xmlns="http://www.w3.org/2000/svg"><path d="M100 50.5908C100 78.2051 77.6142 100.591 50 100.591C22.3858 100.591 0 78.2051 0 50.5908C0 22.9766 22.3858 0.59082 50 0.59082C77.6142 0.59082 100 22.9766 100 50.5908ZM9.08144 50.5908C9.08144 73.1895 27.4013 91.5094 50 91.5094C72.5987 91.5094 90.9186 73.1895 90.9186 50.5908C90.9186 27.9921 72.5987 9.67226 50 9.67226C27.4013 9.67226 9.08144 27.9921 9.08144 50.5908Z" fill="#E5E7EB"></path><path d="M93.9676 39.0409C96.393 38.4038 97.8624 35.9116 97.0079 33.5539C95.2932 28.8227 92.871 24.3692 89.8167 20.348C85.8452 15.1192 80.8826 10.7238 75.2124 7.41289C69.5422 4.10194 63.2754 1.94025 56.7698 1.05124C51.7666 0.367541 46.6976 0.446843 41.7345 1.27873C39.2613 1.69328 37.813 4.19778 38.4501 6.62326C39.0873 9.04874 41.5694 10.4717 44.0505 10.1071C47.8511 9.54855 51.7191 9.52689 55.5402 10.0491C60.8642 10.7766 65.9928 12.5457 70.6331 15.2552C75.2735 17.9648 79.3347 21.5619 82.5849 25.841C84.9175 28.9121 86.7997 32.2913 88.1811 35.8758C89.083 38.2158 91.5421 39.6781 93.9676 39.0409Z" fill="currentColor"></path></svg>
+<svg aria-hidden="true"
+     class="animate-spin inline w-4 h-4 text-white"
+     fill="none"
+     role="status"
+     viewbox="0 0 100 101"
+     xmlns="http://www.w3.org/2000/svg">
+  <path d="M100 50.5908C100 78.2051 77.6142 100.591 50 100.591C22.3858 100.591 0 78.2051 0 50.5908C0 22.9766 22.3858 0.59082 50 0.59082C77.6142 0.59082 100 22.9766 100 50.5908ZM9.08144 50.5908C9.08144 73.1895 27.4013 91.5094 50 91.5094C72.5987 91.5094 90.9186 73.1895 90.9186 50.5908C90.9186 27.9921 72.5987 9.67226 50 9.67226C27.4013 9.67226 9.08144 27.9921 9.08144 50.5908Z" fill="#E5E7EB">
+  </path>
+  <path d="M93.9676 39.0409C96.393 38.4038 97.8624 35.9116 97.0079 33.5539C95.2932 28.8227 92.871 24.3692 89.8167 20.348C85.8452 15.1192 80.8826 10.7238 75.2124 7.41289C69.5422 4.10194 63.2754 1.94025 56.7698 1.05124C51.7666 0.367541 46.6976 0.446843 41.7345 1.27873C39.2613 1.69328 37.813 4.19778 38.4501 6.62326C39.0873 9.04874 41.5694 10.4717 44.0505 10.1071C47.8511 9.54855 51.7191 9.52689 55.5402 10.0491C60.8642 10.7766 65.9928 12.5457 70.6331 15.2552C75.2735 17.9648 79.3347 21.5619 82.5849 25.841C84.9175 28.9121 86.7997 32.2913 88.1811 35.8758C89.083 38.2158 91.5421 39.6781 93.9676 39.0409Z" fill="currentColor">
+  </path>
+</svg>
diff --git a/resources/templates/components/svg-drop-down.html b/resources/templates/components/svg-drop-down.html
index 7c7f13f5..ac31a4f1 100644
--- a/resources/templates/components/svg-drop-down.html
+++ b/resources/templates/components/svg-drop-down.html
@@ -1 +1,7 @@
-<svg aria-hidden="true" fill="none" stroke="currentColor" viewbox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M19 9l-7 7-7-7" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"></path></svg>
+<svg aria-hidden="true"
+     fill="none"
+     stroke="currentColor"
+     viewbox="0 0 24 24"
+     xmlns="http://www.w3.org/2000/svg">
+  <path d="M19 9l-7 7-7-7" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"></path>
+</svg>
diff --git a/resources/templates/components/svg-external-link.html b/resources/templates/components/svg-external-link.html
index 6280d30b..54754ed5 100644
--- a/resources/templates/components/svg-external-link.html
+++ b/resources/templates/components/svg-external-link.html
@@ -1 +1,8 @@
-<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><defs></defs><title>navigation-next</title><path d="M23,9.5H12.387a4,4,0,0,0-4,4v2" fill="none" stroke-linecap="round" stroke-linejoin="round" stroke="currentColor"></path><polyline fill="none" points="19 13.498 23 9.498 19 5.498" stroke-linecap="round" stroke-linejoin="round" stroke="currentColor"></polyline><path d="M14.387,13v5.5a1,1,0,0,1-1,1h-12a1,1,0,0,1-1-1V6.5a1,1,0,0,1,1-1h12a1,1,0,0,1,1,1V7" fill="none" stroke-linecap="round" stroke-linejoin="round" stroke="currentColor"></path></svg>
+<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+  <defs></defs><title>navigation-next</title>
+  <path d="M23,9.5H12.387a4,4,0,0,0-4,4v2" fill="none" stroke-linecap="round" stroke-linejoin="round" stroke="currentColor">
+  </path>
+  <polyline fill="none" points="19 13.498 23 9.498 19 5.498" stroke-linecap="round" stroke-linejoin="round" stroke="currentColor"></polyline>
+  <path d="M14.387,13v5.5a1,1,0,0,1-1,1h-12a1,1,0,0,1-1-1V6.5a1,1,0,0,1,1-1h12a1,1,0,0,1,1,1V7" fill="none" stroke-linecap="round" stroke-linejoin="round" stroke="currentColor">
+  </path>
+</svg>
diff --git a/resources/templates/components/svg-x.html b/resources/templates/components/svg-x.html
index 717e9253..a4b7b82a 100644
--- a/resources/templates/components/svg-x.html
+++ b/resources/templates/components/svg-x.html
@@ -1 +1,3 @@
-<svg viewbox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><defs></defs><title>delete-2</title><circle cx="12" cy="12" fill="none" r="11.5" stroke-linecap="round" stroke-linejoin="round" stroke="currentColor"></circle><line fill="none" stroke-linecap="round" stroke-linejoin="round" stroke="currentColor" x1="7" x2="17" y1="7" y2="17"></line><line fill="none" stroke-linecap="round" stroke-linejoin="round" stroke="currentColor" x1="17" x2="7" y1="7" y2="17"></line></svg>
+<svg viewbox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+  <defs></defs><title>delete-2</title><circle cx="12" cy="12" fill="none" r="11.5" stroke-linecap="round" stroke-linejoin="round" stroke="currentColor"></circle><line fill="none" stroke-linecap="round" stroke-linejoin="round" stroke="currentColor" x1="7" x2="17" y1="7" y2="17"></line><line fill="none" stroke-linecap="round" stroke-linejoin="round" stroke="currentColor" x1="17" x2="7" y1="7" y2="17"></line>
+</svg>
diff --git a/resources/templates/components/text-input.html b/resources/templates/components/text-input.html
index 79f9dd58..e8a46f80 100644
--- a/resources/templates/components/text-input.html
+++ b/resources/templates/components/text-input.html
@@ -1,3 +1,3 @@
 {# Text input. sc/text-input builds the full attr map (type/autocomplete/class+size
    already merged, reusing inputs/default-input-classes + hh/add-class) into `attrs`. #}
-<input{{ attrs|safe }}>
+<input {{ attrs|safe }}>
diff --git a/resources/templates/components/typeahead.html b/resources/templates/components/typeahead.html
index 7df07c9e..7579347b 100644
--- a/resources/templates/components/typeahead.html
+++ b/resources/templates/components/typeahead.html
@@ -1,4 +1,60 @@
 {# Click-to-select typeahead (Alpine + tippy). Survives whole-form swaps; null-guarded
    tippy?. / $refs.input? throughout. The Clojure wrapper (sc/typeahead) resolves the
    initial {value,label} server-side and builds x_data + the hidden-input attrs. #}
-<div class="relative" x-data="{{ x_data }}" x-modelable="value.value"{% if x_model %} x-model="{{ x_model }}"{% endif %}{% if key %} key="{{ key }}"{% endif %}>{% if disabled %}<span x-text="value.label"></span>{% else %}<a class="{{ a_class }}" x-tooltip.on.click="{content: ()=>($refs.dropdown?.innerHTML ?? ''), placement: 'bottom', onMount(i) {htmx.process(i.popper); }, popperOptions: {strategy: 'fixed', modifiers: [{name: 'flip', options: {fallbackPlacements: ['top']}}]}, theme: 'dropdown', allowHTML: true, interactive:true}" @keydown.down.prevent.stop="tippy?.show();" @keydown.backspace="tippy?.hide(); value = {value: '', label: '' }" tabindex="0" x-init="{{ a_xinit }}" x-ref="input"><input{{ hidden_attrs|safe }}><div class="flex w-full justify-items-stretch"><span class="flex-grow text-left" x-text="value.label"></span><div class="w-3 h-3 m-1 inline ml-1 justify-self-end text-gray-500 self-center">{% include "templates/components/svg-drop-down.html" %}</div><div x-show="value.warning"><div class="peer absolute inline-flex items-center z-10 justify-center w-6 h-6 text-xs font-black text-white border-3 border-white rounded-full -top-2 -right-2 dark:border-gray-900 bg-red-300" x-tooltip="value.warning">!</div></div></div></a>{% endif %}<template x-ref="dropdown"><ul class="dropdown-contents bg-gray-100 dark:bg-gray-600  ring-1" @keydown.escape="$refs.input?.__x_tippy?.hide(); value = {value: '', label: '' };  " x-destroy="if ($refs.input) {$refs.input.focus();}"><input type="text" autofocus class="{{ search_class }}" x-model="search" placeholder="{{ placeholder }}" @change.stop="" @keydown.down.prevent="active ++; active = active >= elements.length - 1 ? elements.length - 1 : active" @keydown.up.prevent="active --; active = active < 0 ? 0 : active" @keydown.enter.prevent.stop="$refs.input?.__x_tippy?.hide(); value = elements.length > 0 ? $data.elements[active >= 0 ? active : 0] : {'value': '', label: ''}; $refs.input?.focus()" x-init="$el.focus(); $watch('search', s => { if($el.value.length > 2) {fetch(addQueryParam(baseUrl, 'q', s)).then(data=>data.json()).then(data => {elements = data; active=-1; $refs.input?.__x_tippy?.popperInstance?.update()}) }})"><div class="dropdown-options rounded-b-lg overflow-hidden"><template x-for="(element, index) in elements"><li><a class="px-4 py-2 flex gap-2 items-center outline-0 focus:bg-neutral-100 hover:bg-neutral-100 whitespace-nowrap [&.active]:bg-primary-500 [&.active]:dark:bg-primary-700  text-gray-800  dark:text-gray-100" href="#" :class="active == index ? 'active' : ''" @mouseover="active = index" @mouseout="active = -1" @click.prevent="value = element; $refs.input?.__x_tippy?.hide(); setTimeout(() => $refs.input?.focus(), 10)" x-html="element.label"></a></li></template><template x-if="elements.length == 0"><li class="px-4 py-2 flex gap-2 items-center outline-0 focus:bg-neutral-100 hover:bg-neutral-100 whitespace-nowrap [&.active]:bg-primary-500 text-gray-800  dark:text-gray-100 text-xs ">No results found</li></template></div></ul></template></div>
+<div class="relative"
+     x-data="{{ x_data }}"
+     x-modelable="value.value"
+     {% if x_model %}x-model="{{ x_model }}"{% endif %}
+     {% if key %}key="{{ key }}"{% endif %}>
+  {% if disabled %}
+    <span x-text="value.label"></span>
+  {% else %}
+    <a class="{{ a_class }}"
+       x-tooltip.on.click="{content: ()=>($refs.dropdown?.innerHTML ?? ''), placement: 'bottom', onMount(i) {htmx.process(i.popper); }, popperOptions: {strategy: 'fixed', modifiers: [{name: 'flip', options: {fallbackPlacements: ['top']}}]}, theme: 'dropdown', allowHTML: true, interactive:true}"
+       @keydown.down.prevent.stop="tippy?.show();"
+       @keydown.backspace="tippy?.hide(); value = {value: '', label: '' }"
+       tabindex="0"
+       x-init="{{ a_xinit }}"
+       x-ref="input"><input {{ hidden_attrs|safe }}>
+      <div class="flex w-full justify-items-stretch">
+        <span class="flex-grow text-left" x-text="value.label"></span>
+        <div class="w-3 h-3 m-1 inline ml-1 justify-self-end text-gray-500 self-center">
+          {% include "templates/components/svg-drop-down.html" %}
+        </div>
+        <div x-show="value.warning">
+          <div class="peer absolute inline-flex items-center z-10 justify-center w-6 h-6 text-xs font-black text-white border-3 border-white rounded-full -top-2 -right-2 dark:border-gray-900 bg-red-300"
+               x-tooltip="value.warning">!</div>
+        </div>
+      </div>
+    </a>
+  {% endif %}
+  <template x-ref="dropdown">
+    <ul class="dropdown-contents bg-gray-100 dark:bg-gray-600  ring-1"
+        @keydown.escape="$refs.input?.__x_tippy?.hide(); value = {value: '', label: '' };  "
+        x-destroy="if ($refs.input) {$refs.input.focus();}">
+      <input type="text"
+             autofocus
+             class="{{ search_class }}"
+             x-model="search"
+             placeholder="{{ placeholder }}"
+             @change.stop=""
+             @keydown.down.prevent="active ++; active = active >= elements.length - 1 ? elements.length - 1 : active"
+             @keydown.up.prevent="active --; active = active < 0 ? 0 : active"
+             @keydown.enter.prevent.stop="$refs.input?.__x_tippy?.hide(); value = elements.length > 0 ? $data.elements[active >= 0 ? active : 0] : {'value': '', label: ''}; $refs.input?.focus()"
+             x-init="$el.focus(); $watch('search', s => { if($el.value.length > 2) {fetch(addQueryParam(baseUrl, 'q', s)).then(data=>data.json()).then(data => {elements = data; active=-1; $refs.input?.__x_tippy?.popperInstance?.update()}) }})">
+        <div class="dropdown-options rounded-b-lg overflow-hidden">
+          <template x-for="(element, index) in elements">
+            <li><a class="px-4 py-2 flex gap-2 items-center outline-0 focus:bg-neutral-100 hover:bg-neutral-100 whitespace-nowrap [&.active]:bg-primary-500 [&.active]:dark:bg-primary-700  text-gray-800  dark:text-gray-100"
+   href="#"
+   :class="active == index ? 'active' : ''"
+   @mouseover="active = index"
+   @mouseout="active = -1"
+   @click.prevent="value = element; $refs.input?.__x_tippy?.hide(); setTimeout(() => $refs.input?.focus(), 10)"
+   x-html="element.label"></a></li>
+          </template><template x-if="elements.length == 0">
+          <li class="px-4 py-2 flex gap-2 items-center outline-0 focus:bg-neutral-100 hover:bg-neutral-100 whitespace-nowrap [&.active]:bg-primary-500 text-gray-800  dark:text-gray-100 text-xs ">No results found</li>
+        </template>
+      </div>
+    </ul>
+  </template>
+</div>
diff --git a/resources/templates/components/validated-field.html b/resources/templates/components/validated-field.html
index 96806adf..0b9b0fa3 100644
--- a/resources/templates/components/validated-field.html
+++ b/resources/templates/components/validated-field.html
@@ -3,4 +3,10 @@
    carries any pass-through div attributes (the per-row location cell hangs its hx-* /
    x-dispatch swap wiring here); `body` is the pre-rendered inner control HTML;
    `errors_str` is the comma-joined string errors (empty when none). #}
-<div class="{{ classes }}"{{ attrs|safe }}>{% if label %}<label class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">{{ label }}</label>{% endif %}{{ body|safe }}<p class="mt-2 text-xs text-red-600 dark:text-red-500 h-4">{{ errors_str }}</p></div>
+<div class="{{ classes }}"{{ attrs|safe }}>
+  {% if label %}
+    <label class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">{{ label }}</label>
+  {% endif %}
+  {{ body|safe }}
+  <p class="mt-2 text-xs text-red-600 dark:text-red-500 h-4">{{ errors_str }}</p>
+</div>
diff --git a/resources/templates/interop-smoke.html b/resources/templates/interop-smoke.html
index deac9901..5fa980ab 100644
--- a/resources/templates/interop-smoke.html
+++ b/resources/templates/interop-smoke.html
@@ -2,6 +2,7 @@
   <h3>{{ title }}</h3>
   {# a Hiccup-rendered component, passed in pre-rendered and emitted verbatim #}
   {{ hiccup_frag|safe }}
-  <input x-ref="input" x-model="value.value"
+  <input x-ref="input"
+         x-model="value.value"
          @keydown.down.prevent.stop="tippy?.show()" />
 </div>
diff --git a/resources/templates/invoice-bulk-edit/edit-form.html b/resources/templates/invoice-bulk-edit/edit-form.html
index 204e515d..aec7ce8e 100644
--- a/resources/templates/invoice-bulk-edit/edit-form.html
+++ b/resources/templates/invoice-bulk-edit/edit-form.html
@@ -1,4 +1,5 @@
 {# Top-level plain bulk-edit form (no wizard). The resolved (not-locked) invoice id set
    rides in hidden ids[] fields so the selection survives form-changed / submit posts
    without an EDN snapshot or a filter round-trip. #}
-<form id="bulk-edit-form"{{ form_attrs|safe }}>{{ ids_hidden|safe }}{{ modal|safe }}</form>
+<form id="bulk-edit-form"{{ form_attrs|safe }}>{{ ids_hidden|safe }}{{ modal|safe }}
+</form>
diff --git a/resources/templates/invoice-bulk-edit/expense-totals.html b/resources/templates/invoice-bulk-edit/expense-totals.html
index 98883251..bfc5bff7 100644
--- a/resources/templates/invoice-bulk-edit/expense-totals.html
+++ b/resources/templates/invoice-bulk-edit/expense-totals.html
@@ -2,4 +2,6 @@
    the input rows, so a percentage edit refreshes them with a targeted swap (Rule 4) and
    never replaces the input-bearing rows above. Replaces the old per-cell bulk-edit-total
    / bulk-edit-balance routes. #}
-<tbody id="expense-totals">{{ rows|safe }}</tbody>
+<tbody id="expense-totals">
+  {{ rows|safe }}
+</tbody>
diff --git a/resources/templates/sales-summary/edit-form.html b/resources/templates/sales-summary/edit-form.html
index a5417a2a..bf119ea3 100644
--- a/resources/templates/sales-summary/edit-form.html
+++ b/resources/templates/sales-summary/edit-form.html
@@ -1,4 +1,7 @@
 {# Plain sales-summary edit form (no wizard). db/id rides in a hidden field; all other
    state is the live form, re-derived against the entity each request (no EDN snapshot,
    no step-params). #}
-<form id="summary-edit-form"{{ form_attrs|safe }}><input type="hidden" name="db/id" value="{{ db_id }}">{{ modal|safe }}</form>
+<form id="summary-edit-form"{{ form_attrs|safe }}>
+  <input type="hidden" name="db/id" value="{{ db_id }}">
+  {{ modal|safe }}
+</form>
diff --git a/resources/templates/sales-summary/summary-body.html b/resources/templates/sales-summary/summary-body.html
index 16cc4e50..8e381c60 100644
--- a/resources/templates/sales-summary/summary-body.html
+++ b/resources/templates/sales-summary/summary-body.html
@@ -1,4 +1,21 @@
 {# Sales-summary modal body: a read-only Debits | Credits two-column view of the auto
    items (each account is inline-editable), a swappable totals/balance block, and an
    editable Manual Items section with a working "New Summary Item" add. #}
-<div class="space-y-4 p-2"><div class="grid grid-cols-2 gap-6"><div><div class="font-semibold text-sm mb-2">Debits</div><div class="space-y-1">{{ debit_rows|safe }}</div></div><div><div class="font-semibold text-sm mb-2">Credits</div><div class="space-y-1">{{ credit_rows|safe }}</div></div></div><div id="summary-totals">{{ totals|safe }}</div><div class="mt-4 border-t pt-3"><div class="font-semibold text-sm mb-2">Manual Items</div><div class="space-y-2" id="manual-items">{{ manual_rows|safe }}</div><div class="mt-2 flex justify-center">{{ new_item_button|safe }}</div></div></div>
+<div class="space-y-4 p-2">
+  <div class="grid grid-cols-2 gap-6">
+    <div>
+      <div class="font-semibold text-sm mb-2">Debits</div>
+      <div class="space-y-1">{{ debit_rows|safe }}</div>
+    </div>
+    <div>
+      <div class="font-semibold text-sm mb-2">Credits</div>
+      <div class="space-y-1">{{ credit_rows|safe }}</div>
+    </div>
+  </div>
+  <div id="summary-totals">{{ totals|safe }}</div>
+  <div class="mt-4 border-t pt-3">
+    <div class="font-semibold text-sm mb-2">Manual Items</div>
+    <div class="space-y-2" id="manual-items">{{ manual_rows|safe }}</div>
+    <div class="mt-2 flex justify-center">{{ new_item_button|safe }}</div>
+  </div>
+</div>
diff --git a/resources/templates/transaction-bulk-code/bulk-code-body.html b/resources/templates/transaction-bulk-code/bulk-code-body.html
index 52b17f1a..b76a613f 100644
--- a/resources/templates/transaction-bulk-code/bulk-code-body.html
+++ b/resources/templates/transaction-bulk-code/bulk-code-body.html
@@ -1,3 +1,13 @@
 {# Bulk-code modal body: vendor field (a change repopulates the default account via a
    whole-form swap), status select, and the expense-account grid. #}
-<div class="space-y-4 p-4"><div class="grid grid-cols-2 gap-4"><div{{ vendor_changed_attrs|safe }}>{{ vendor_field|safe }}</div><div>{{ status_field|safe }}</div><div class="col-span-2 pt-4"><h3 class="text-lg font-medium mb-3">Expense Accounts</h3>{{ accounts_field|safe }}</div></div></div>
+<div class="space-y-4 p-4">
+  <div class="grid grid-cols-2 gap-4">
+    <div {{ vendor_changed_attrs|safe }}>{{ vendor_field|safe }}
+    </div>
+    <div>{{ status_field|safe }}</div>
+    <div class="col-span-2 pt-4">
+      <h3 class="text-lg font-medium mb-3">Expense Accounts</h3>
+      {{ accounts_field|safe }}
+    </div>
+  </div>
+</div>
diff --git a/resources/templates/transaction-bulk-code/bulk-code-form.html b/resources/templates/transaction-bulk-code/bulk-code-form.html
index 266a0923..eeb851b0 100644
--- a/resources/templates/transaction-bulk-code/bulk-code-form.html
+++ b/resources/templates/transaction-bulk-code/bulk-code-form.html
@@ -2,4 +2,5 @@
    id set rides in hidden ids[] fields -- the analog of the edit modal's single db/id
    hidden -- so the selection survives form-changed / submit posts without an EDN snapshot
    or a filter round-trip. #}
-<form id="bulk-code-form"{{ form_attrs|safe }}>{{ ids_hidden|safe }}{{ modal|safe }}</form>
+<form id="bulk-code-form"{{ form_attrs|safe }}>{{ ids_hidden|safe }}{{ modal|safe }}
+</form>
diff --git a/resources/templates/transaction-edit/account-totals.html b/resources/templates/transaction-edit/account-totals.html
index cdc8f1b8..e66630f9 100644
--- a/resources/templates/transaction-edit/account-totals.html
+++ b/resources/templates/transaction-edit/account-totals.html
@@ -1,3 +1,5 @@
 {# Totals live in their own swappable <tbody> so an amount edit refreshes them with a
    targeted swap, never replacing the input-bearing rows above (caret survives). #}
-<tbody id="account-totals">{{ rows|safe }}</tbody>
+<tbody id="account-totals">
+  {{ rows|safe }}
+</tbody>
diff --git a/resources/templates/transaction-edit/approval-status.html b/resources/templates/transaction-edit/approval-status.html
index 58a7dc00..8aaccf4d 100644
--- a/resources/templates/transaction-edit/approval-status.html
+++ b/resources/templates/transaction-edit/approval-status.html
@@ -1 +1,4 @@
-<div x-data="{{ x_data }}">{{ status_hidden|safe }}<div class="inline-flex rounded-md shadow-sm" role="group">{{ buttons|safe }}</div></div>
+<div x-data="{{ x_data }}">
+  {{ status_hidden|safe }}
+  <div class="inline-flex rounded-md shadow-sm" role="group">{{ buttons|safe }}</div>
+</div>
diff --git a/resources/templates/transaction-edit/details-panel.html b/resources/templates/transaction-edit/details-panel.html
index 6a584217..b73146b5 100644
--- a/resources/templates/transaction-edit/details-panel.html
+++ b/resources/templates/transaction-edit/details-panel.html
@@ -1,2 +1,39 @@
 {# Read-only transaction summary shown in the modal's left side panel. #}
-<div class="p-4 space-y-4"><h3 class="text-sm font-semibold text-gray-900 uppercase tracking-wider">Details</h3><div class="space-y-3"><div><div class="text-xs font-medium text-gray-500">Amount</div><div class="text-sm font-medium text-gray-900">{{ amount }}</div></div><div><div class="text-xs font-medium text-gray-500">Date</div><div class="text-sm text-gray-900">{{ date }}</div></div><div><div class="text-xs font-medium text-gray-500">Bank Account</div><div class="text-sm text-gray-900">{{ bank_account }}</div></div><div><div class="text-xs font-medium text-gray-500">Post Date</div><div class="text-sm text-gray-900">{{ post_date }}</div></div><div><div class="text-xs font-medium text-gray-500">Description</div><div class="text-sm text-gray-900 truncate cursor-help" title="{{ description_original }}">{{ description_simple }}</div></div><div><div class="text-xs font-medium text-gray-500">Check Number</div><div class="text-sm text-gray-900">{{ check_number }}</div></div><div><div class="text-xs font-medium text-gray-500">Status</div><div class="text-sm text-gray-900">{{ status }}</div></div><div><div class="text-xs font-medium text-gray-500">Transaction Type</div><div class="text-sm text-gray-900">{{ type }}</div></div></div></div>
+<div class="p-4 space-y-4">
+  <h3 class="text-sm font-semibold text-gray-900 uppercase tracking-wider">Details</h3>
+  <div class="space-y-3">
+    <div>
+      <div class="text-xs font-medium text-gray-500">Amount</div>
+      <div class="text-sm font-medium text-gray-900">{{ amount }}</div>
+    </div>
+    <div>
+      <div class="text-xs font-medium text-gray-500">Date</div>
+      <div class="text-sm text-gray-900">{{ date }}</div>
+    </div>
+    <div>
+      <div class="text-xs font-medium text-gray-500">Bank Account</div>
+      <div class="text-sm text-gray-900">{{ bank_account }}</div>
+    </div>
+    <div>
+      <div class="text-xs font-medium text-gray-500">Post Date</div>
+      <div class="text-sm text-gray-900">{{ post_date }}</div>
+    </div>
+    <div>
+      <div class="text-xs font-medium text-gray-500">Description</div>
+      <div class="text-sm text-gray-900 truncate cursor-help"
+           title="{{ description_original }}">{{ description_simple }}</div>
+    </div>
+    <div>
+      <div class="text-xs font-medium text-gray-500">Check Number</div>
+      <div class="text-sm text-gray-900">{{ check_number }}</div>
+    </div>
+    <div>
+      <div class="text-xs font-medium text-gray-500">Status</div>
+      <div class="text-sm text-gray-900">{{ status }}</div>
+    </div>
+    <div>
+      <div class="text-xs font-medium text-gray-500">Transaction Type</div>
+      <div class="text-sm text-gray-900">{{ type }}</div>
+    </div>
+  </div>
+</div>
diff --git a/resources/templates/transaction-edit/edit-form.html b/resources/templates/transaction-edit/edit-form.html
index 64e7a2b6..665f5608 100644
--- a/resources/templates/transaction-edit/edit-form.html
+++ b/resources/templates/transaction-edit/edit-form.html
@@ -1,4 +1,7 @@
 {# Top-level plain form. The entity id rides in a hidden field; all other state is the
    live form, re-derived against the entity each request (no serialized snapshot, no
    wizard step-params). #}
-<form id="edit-form"{{ form_attrs|safe }}><input type="hidden" name="db/id" value="{{ db_id }}">{{ modal|safe }}</form>
+<form id="edit-form"{{ form_attrs|safe }}>
+  <input type="hidden" name="db/id" value="{{ db_id }}">
+  {{ modal|safe }}
+</form>
diff --git a/resources/templates/transaction-edit/edit-modal.html b/resources/templates/transaction-edit/edit-modal.html
index 734ee8d1..f4ca2e16 100644
--- a/resources/templates/transaction-edit/edit-modal.html
+++ b/resources/templates/transaction-edit/edit-modal.html
@@ -1,4 +1,15 @@
 {# Modal card chrome (header / optional side panel / body / footer). Single-step, so
    no timeline, no back/next nav -- just the Done button in the footer. Enter triggers
    the save button via $refs.next. #}
-<div class="modal-card bg-white rounded-lg shadow dark:bg-gray-700 dark:text-white  modal-content flex flex-col max-h-screen max-w-screen md:w-[950px] md:h-[650px] w-full h-full last-modal-step transition duration-150" @keydown.enter.prevent.stop="if ($refs.next) {$refs.next.click()}" x-data=""><div class="flex items-start justify-between p-4 border-b rounded-t dark:border-gray-600 shrink-0">{{ head|safe }}</div><div class="flex shrink overflow-auto grow">{% if side_panel %}<div class="grow-0 w-64 bg-gray-50 border-r hidden md:block overflow-y-auto max-h-full">{{ side_panel|safe }}</div>{% endif %}<div class="px-6 py-2 space-y-6 overflow-y-scroll w-full shrink grow">{{ body|safe }}</div></div><div class="p-4 border-t">{{ footer|safe }}</div></div>
+<div class="modal-card bg-white rounded-lg shadow dark:bg-gray-700 dark:text-white  modal-content flex flex-col max-h-screen max-w-screen md:w-[950px] md:h-[650px] w-full h-full last-modal-step transition duration-150"
+     @keydown.enter.prevent.stop="if ($refs.next) {$refs.next.click()}"
+     x-data="">
+  <div class="flex items-start justify-between p-4 border-b rounded-t dark:border-gray-600 shrink-0">{{ head|safe }}</div>
+  <div class="flex shrink overflow-auto grow">
+    {% if side_panel %}
+      <div class="grow-0 w-64 bg-gray-50 border-r hidden md:block overflow-y-auto max-h-full">{{ side_panel|safe }}</div>
+    {% endif %}
+    <div class="px-6 py-2 space-y-6 overflow-y-scroll w-full shrink grow">{{ body|safe }}</div>
+  </div>
+  <div class="p-4 border-t">{{ footer|safe }}</div>
+</div>
diff --git a/resources/templates/transaction-edit/invoice-option.html b/resources/templates/transaction-edit/invoice-option.html
index ac85e955..fbb6399e 100644
--- a/resources/templates/transaction-edit/invoice-option.html
+++ b/resources/templates/transaction-edit/invoice-option.html
@@ -1 +1,6 @@
-<div class="ml-3"><span class="block text-sm font-medium">{{ number }}</span><span class="block text-sm text-gray-500">{{ vendor }}</span><span class="block text-sm text-gray-500">{{ date }}</span><span class="block text-sm font-medium">{{ amount }}</span></div>
+<div class="ml-3">
+  <span class="block text-sm font-medium">{{ number }}</span>
+  <span class="block text-sm text-gray-500">{{ vendor }}</span>
+  <span class="block text-sm text-gray-500">{{ date }}</span>
+  <span class="block text-sm font-medium">{{ amount }}</span>
+</div>
diff --git a/resources/templates/transaction-edit/linked-payment.html b/resources/templates/transaction-edit/linked-payment.html
index 7c695c62..2a77363b 100644
--- a/resources/templates/transaction-edit/linked-payment.html
+++ b/resources/templates/transaction-edit/linked-payment.html
@@ -1 +1,27 @@
-<div class="my-4 p-4 bg-blue-50 rounded"><h3 class="text-lg font-bold mb-2">Linked Payment{{ external_link|safe }}</h3><div class="space-y-2"><div class="flex justify-between"><div class="font-medium">Payment #</div><div>{{ number }}</div></div><div class="flex justify-between"><div class="font-medium">Vendor</div><div>{{ vendor }}</div></div><div class="flex justify-between"><div class="font-medium">Amount</div><div>{{ amount }}</div></div><div class="flex justify-between"><div class="font-medium">Status</div><div>{{ status }}</div></div><div class="flex justify-between"><div class="font-medium">Date</div><div>{{ date }}</div></div>{{ payment_id_hidden|safe }}<div class="mt-4"{{ unlink_attrs|safe }}>{{ unlink_button|safe }}</div></div></div>
+<div class="my-4 p-4 bg-blue-50 rounded">
+  <h3 class="text-lg font-bold mb-2">Linked Payment{{ external_link|safe }}</h3>
+  <div class="space-y-2">
+    <div class="flex justify-between">
+      <div class="font-medium">Payment #</div>
+      <div>{{ number }}</div>
+    </div>
+    <div class="flex justify-between">
+      <div class="font-medium">Vendor</div>
+      <div>{{ vendor }}</div>
+    </div>
+    <div class="flex justify-between">
+      <div class="font-medium">Amount</div>
+      <div>{{ amount }}</div>
+    </div>
+    <div class="flex justify-between">
+      <div class="font-medium">Status</div>
+      <div>{{ status }}</div>
+    </div>
+    <div class="flex justify-between">
+      <div class="font-medium">Date</div>
+      <div>{{ date }}</div>
+    </div>
+    {{ payment_id_hidden|safe }}<div class="mt-4"{{ unlink_attrs|safe }}>{{ unlink_button|safe }}
+  </div>
+</div>
+</div>
diff --git a/resources/templates/transaction-edit/links-body.html b/resources/templates/transaction-edit/links-body.html
index 5332da45..7c610508 100644
--- a/resources/templates/transaction-edit/links-body.html
+++ b/resources/templates/transaction-edit/links-body.html
@@ -1,3 +1,32 @@
 {# The single step's body: memo + the activeForm tab switcher (link payment / unpaid /
    autopay / rule / manual) + the five x-show panels. Fragments are pre-rendered. #}
-<div class="space-y-1"><div>{{ memo_field|safe }}<div x-data="{{ x_data }}" @unlinked="canChange=true"><div class="flex space-x-2 mb-4">{{ action_hidden|safe }}{{ tabs|safe }}</div><div x-show="activeForm === 'link-payment'" x-transition:enter="transition ease-out duration-500" x-transition:enter-start="opacity-0 transform scale-95" x-transition:enter-end="opacity-100 transform scale-100">{{ panel_payment|safe }}</div><div x-show="activeForm === 'link-unpaid-invoices'" x-transition:enter="transition ease-out duration-500" x-transition:enter-start="opacity-0 transform scale-95" x-transition:enter-end="opacity-100 transform scale-100">{{ panel_unpaid|safe }}</div><div x-show="activeForm === 'link-autopay-invoices'" x-transition:enter="transition ease-out duration-500" x-transition:enter-start="opacity-0 transform scale-95" x-transition:enter-end="opacity-100 transform scale-100">{{ panel_autopay|safe }}</div><div x-show="activeForm === 'apply-rule'" x-transition:enter="transition ease-out duration-500" x-transition:enter-start="opacity-0 transform scale-95" x-transition:enter-end="opacity-100 transform scale-100">{{ panel_rule|safe }}</div><div x-show="activeForm === 'manual'" x-transition:enter="transition ease-out duration-500" x-transition:enter-start="opacity-0 transform scale-95" x-transition:enter-end="opacity-100 transform scale-100"><div>{{ panel_manual|safe }}</div></div></div></div></div>
+<div class="space-y-1">
+  <div>
+    {{ memo_field|safe }}
+    <div x-data="{{ x_data }}" @unlinked="canChange=true">
+      <div class="flex space-x-2 mb-4">{{ action_hidden|safe }}{{ tabs|safe }}</div>
+      <div x-show="activeForm === 'link-payment'"
+           x-transition:enter="transition ease-out duration-500"
+           x-transition:enter-start="opacity-0 transform scale-95"
+           x-transition:enter-end="opacity-100 transform scale-100">{{ panel_payment|safe }}</div>
+      <div x-show="activeForm === 'link-unpaid-invoices'"
+           x-transition:enter="transition ease-out duration-500"
+           x-transition:enter-start="opacity-0 transform scale-95"
+           x-transition:enter-end="opacity-100 transform scale-100">{{ panel_unpaid|safe }}</div>
+      <div x-show="activeForm === 'link-autopay-invoices'"
+           x-transition:enter="transition ease-out duration-500"
+           x-transition:enter-start="opacity-0 transform scale-95"
+           x-transition:enter-end="opacity-100 transform scale-100">{{ panel_autopay|safe }}</div>
+      <div x-show="activeForm === 'apply-rule'"
+           x-transition:enter="transition ease-out duration-500"
+           x-transition:enter-start="opacity-0 transform scale-95"
+           x-transition:enter-end="opacity-100 transform scale-100">{{ panel_rule|safe }}</div>
+      <div x-show="activeForm === 'manual'"
+           x-transition:enter="transition ease-out duration-500"
+           x-transition:enter-start="opacity-0 transform scale-95"
+           x-transition:enter-end="opacity-100 transform scale-100">
+        <div>{{ panel_manual|safe }}</div>
+      </div>
+    </div>
+  </div>
+</div>
diff --git a/resources/templates/transaction-edit/manual-coding.html b/resources/templates/transaction-edit/manual-coding.html
index c9315560..fa843326 100644
--- a/resources/templates/transaction-edit/manual-coding.html
+++ b/resources/templates/transaction-edit/manual-coding.html
@@ -1,3 +1,11 @@
 {# Vendor field (a change repopulates the default account via a whole-form swap) + either
    the simple single-row coding or the advanced account grid. #}
-<div id="manual-coding-section">{{ mode_hidden|safe }}<div{{ vendor_changed_attrs|safe }}>{{ vendor_field|safe }}</div>{% if is_simple %}<div x-data="{{ simple_xdata }}">{{ simple_mode|safe }}</div>{% else %}<div>{{ toggle_link|safe }}{{ accounts_field|safe }}</div>{% endif %}</div>
+<div id="manual-coding-section">
+  {{ mode_hidden|safe }}<div {{ vendor_changed_attrs|safe }}>{{ vendor_field|safe }}
+</div>
+{% if is_simple %}
+  <div x-data="{{ simple_xdata }}">{{ simple_mode|safe }}</div>
+{% else %}
+  <div>{{ toggle_link|safe }}{{ accounts_field|safe }}</div>
+{% endif %}
+</div>
diff --git a/resources/templates/transaction-edit/panel-list.html b/resources/templates/transaction-edit/panel-list.html
index 0bfe7219..49ba2382 100644
--- a/resources/templates/transaction-edit/panel-list.html
+++ b/resources/templates/transaction-edit/panel-list.html
@@ -1,3 +1,10 @@
 {# Shared shell for the autopay/unpaid/rule match panels: heading + action hidden +
    prompt label + a radio-card of options. #}
-<div><h3 class="text-lg font-bold mb-4">{{ heading }}</h3>{{ action_hidden|safe }}<div class="space-y-2"><label class="block text-sm font-medium mb-1">{{ prompt }}</label>{{ radio|safe }}</div></div>
+<div>
+  <h3 class="text-lg font-bold mb-4">{{ heading }}</h3>
+  {{ action_hidden|safe }}
+  <div class="space-y-2">
+    <label class="block text-sm font-medium mb-1">{{ prompt }}</label>
+    {{ radio|safe }}
+  </div>
+</div>
diff --git a/resources/templates/transaction-edit/rule-option.html b/resources/templates/transaction-edit/rule-option.html
index 1ecaaa23..5247e3bd 100644
--- a/resources/templates/transaction-edit/rule-option.html
+++ b/resources/templates/transaction-edit/rule-option.html
@@ -1 +1,4 @@
-<div class="ml-3"><span class="block text-sm font-medium">{{ note }}</span><span class="block text-sm text-gray-500">{{ description }}</span></div>
+<div class="ml-3">
+  <span class="block text-sm font-medium">{{ note }}</span>
+  <span class="block text-sm text-gray-500">{{ description }}</span>
+</div>
diff --git a/resources/templates/transaction-edit/simple-mode.html b/resources/templates/transaction-edit/simple-mode.html
index aa72b073..40d6eb10 100644
--- a/resources/templates/transaction-edit/simple-mode.html
+++ b/resources/templates/transaction-edit/simple-mode.html
@@ -1,4 +1,14 @@
 {# Simple mode: a single account row (account typeahead + location select) rendered at a
    fixed index 0, plus the link to switch to the advanced grid. Selecting the account
    swaps just the location cell (#simple-account-location). #}
-<div><span>{{ row_id_hidden|safe }}<div class="flex gap-2 mt-2">{{ account_field|safe }}<div id="simple-account-location">{{ location_field|safe }}</div>{{ amount_hidden|safe }}</div></span><div class="mt-1"><a class="text-sm text-blue-600 hover:underline cursor-pointer"{{ toggle_attrs|safe }}>Switch to advanced mode</a></div></div>
+<div>
+  <span>{{ row_id_hidden|safe }}
+    <div class="flex gap-2 mt-2">
+      {{ account_field|safe }}
+      <div id="simple-account-location">{{ location_field|safe }}</div>
+      {{ amount_hidden|safe }}
+    </div>
+  </span>
+  <div class="mt-1"><a class="text-sm text-blue-600 hover:underline cursor-pointer"
+   {{ toggle_attrs|safe }}>Switch to advanced mode</a></div>
+</div>