Add custom fields + warranty plugin, rework settings into two-pane shell

Feature work from the 2026-07 session:

Settings IA
- Replace the flat 27-card settings hub with a persistent two-pane shell
  (SettingsLayout.vue): grouped, searchable left rail + content pane.
- Nest all settings/* routes under the shell via router post-processing;
  shared nav catalog in settingsNav.js. Group by asset class (PCs, Printers,
  Equipment, Network) so per-type settings stop scattering.

Custom fields (core)
- customfields + customfieldvalues tables (migration 7d14), CRUD API at
  /api/customfields, per-asset value get/save.
- Settings management page + reusable CustomFieldsSection (detail) and
  CustomFieldsInputs (form) wired into all four asset types.

Warranty (new plugin)
- plugins/warranty: warranties + warrantyassets (migration 7d15), derived
  coverage status, provider abstraction (manual now; Dell/Lenovo/HP stubs).
- API CRUD + per-asset panel + report buckets; WarrantyPanel on all four
  detail pages; Warranties management page; Warranty report + Reports card.
- Seed warranty.* permissions.

Printer drivers
- printerdrivers table (migration 7d13) linked to printer models; drivers now
  surface on the matching printer's detail page.

Other
- PCDetail rebalanced (Network + Status + Warranty + custom fields on the right).
- Rename PCs list "Features" column to "Remote Access"; fix badge hover underline.
- Drop equipment islocationonly field.
- Centralize asset-type label/route maps into utils/assetTypes.js.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

frontend/src/components/WarrantyPanel.vue

@@ -0,0 +1,75 @@
+<template>
+  <div class="section-card" v-if="warranties.length || showEmpty">
+    <h3 class="section-title">Warranty</h3>
+
+    <div v-if="warranties.length" class="warranty-list">
+      <div v-for="w in warranties" :key="w.warrantyid" class="warranty-item">
+        <div class="warranty-top">
+          <span class="warranty-vendor">{{ w.vendor }}</span>
+          <span class="status-badge" :style="colorStyle(w.statuscolor)">{{ statusLabel(w.status) }}</span>
+        </div>
+        <div class="warranty-meta">
+          <span v-if="w.servicelevel">{{ w.servicelevel }}</span>
+          <span v-if="w.enddate">Ends {{ formatDate(w.enddate) }}</span>
+          <span v-if="w.servicetag" class="mono">Tag {{ w.servicetag }}</span>
+        </div>
+      </div>
+      <router-link to="/warranties" class="warranty-manage">Manage warranties</router-link>
+    </div>
+
+    <div v-else class="warranty-empty">
+      <span class="muted">No warranty on record.</span>
+      <router-link to="/warranties" class="warranty-manage">Add one</router-link>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { ref, watch, onMounted } from 'vue'
+import { colorStyle } from '@/utils/colorStyle'
+import { warrantyApi } from '../api'
+
+const props = defineProps({
+  assetid: { type: [Number, String], default: null },
+  // When true, render the card even with no warranties (shows an "Add one" link).
+  showEmpty: { type: Boolean, default: false },
+})
+
+const warranties = ref([])
+
+function statusLabel(status) {
+  return { active: 'Active', expiring: 'Expiring Soon', expired: 'Expired', unknown: 'Unknown' }[status] || status
+}
+
+function formatDate(d) {
+  if (!d) return '-'
+  return new Date(d + 'T00:00:00').toLocaleDateString()
+}
+
+async function load() {
+  if (!props.assetid) { warranties.value = []; return }
+  try {
+    const response = await warrantyApi.forAsset(props.assetid)
+    warranties.value = response.data.data || []
+  } catch (err) {
+    console.error('Error loading warranties:', err)
+    warranties.value = []
+  }
+}
+
+onMounted(load)
+watch(() => props.assetid, load)
+</script>
+
+<style scoped>
+.warranty-list { display: flex; flex-direction: column; gap: 0.75rem; }
+.warranty-item { padding: 0.6rem 0.75rem; background: var(--bg); border-radius: 6px; }
+.warranty-top { display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; }
+.warranty-vendor { font-weight: 600; color: var(--text); }
+.status-badge { padding: 0.15rem 0.6rem; border-radius: 12px; font-size: 0.75rem; font-weight: 600; }
+.warranty-meta { margin-top: 0.35rem; display: flex; flex-wrap: wrap; gap: 0.75rem; font-size: 0.82rem; color: var(--text-light); }
+.warranty-empty { display: flex; align-items: center; gap: 0.6rem; }
+.warranty-manage { font-size: 0.82rem; }
+.mono { font-family: monospace; }
+.muted { color: var(--text-light); }
+</style>