Replace browser confirm() dialogs with custom modal; add live label preview on battery add form

- base.html: add CSS/HTML/JS for styled in-app confirmation modal (dark-mode compatible via CSS vars)
- device_list, battery_detail: convert onsubmit confirm() to declarative data-confirm attributes
- dashboard: convert bulk Delete/Install buttons to use modal helpers (submitWithAction pattern)
- app.py: pass brand_counts dict to battery_add template
- battery_add.html: show live "Will create: Brand 001 → Brand 003" preview as brand/quantity change
- tests: add two tests covering brand_counts server-side rendering

templates/battery_add.html

@@ -27,6 +27,7 @@
         <label for="count">Quantity</label>
         <input type="number" id="count" name="count" value="{{ form_count|default(1) }}" min="1" max="50">
         <small class="text-muted">Labels are auto-generated (e.g. Eneloop 001, Eneloop 002)</small>
+        <div id="label-preview" style="font-size:0.85rem;color:var(--link);margin-top:0.3rem;font-weight:500;min-height:1.2em;"></div>
       </div>
 
       <div class="form-group">
@@ -96,6 +97,8 @@
 </div>
 
 <script>
+var brandCounts = {{ brand_counts|default({})|tojson }};
+
 function metaSelectChanged(sel, inputId) {
   var input = document.getElementById(inputId);
   if (sel.value === '__new__') {
@@ -106,8 +109,26 @@ function metaSelectChanged(sel, inputId) {
     input.style.display = 'none';
     input.value = sel.value;
   }
+  if (inputId === 'brand') updateLabelPreview();
 }
 
+function updateLabelPreview() {
+  var brand = document.getElementById('brand').value.trim();
+  var count = parseInt(document.getElementById('count').value, 10) || 1;
+  var preview = document.getElementById('label-preview');
+  if (!brand) { preview.textContent = ''; return; }
+  var existing = brandCounts[brand] !== undefined ? brandCounts[brand] : 0;
+  var first = existing + 1;
+  var last  = existing + count;
+  var pad = function(n) { return n.toString().padStart(3, '0'); };
+  preview.textContent = count === 1
+    ? 'Will create: ' + brand + ' ' + pad(first)
+    : 'Will create: ' + brand + ' ' + pad(first) + ' \u2192 ' + brand + ' ' + pad(last);
+}
+
+document.getElementById('count').addEventListener('input', updateLabelPreview);
+document.getElementById('brand').addEventListener('input', updateLabelPreview);
+
 // Restore brand state on error re-render
 (function () {
   var input = document.getElementById('brand');