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/AssetRelationships.vue

@@ -33,7 +33,7 @@
                 {{ rel.targetasset?.name || rel.targetasset?.assetnumber || 'Unknown' }}
               </router-link>
               <div class="rel-meta">
-                <span class="badge badge-outline">{{ rel.relationshiptypename }}</span>
+                <span class="badge" :style="colorStyle(colorForType(rel.relationshiptypename))">{{ rel.relationshiptypename }}</span>
                 <span class="rel-type-badge">{{ rel.targetasset?.assettype }}</span>
               </div>
               <div v-if="rel.notes" class="rel-notes">{{ rel.notes }}</div>
@@ -65,7 +65,7 @@
                 {{ rel.sourceasset?.name || rel.sourceasset?.assetnumber || 'Unknown' }}
               </router-link>
               <div class="rel-meta">
-                <span class="badge badge-outline">{{ rel.relationshiptypename }}</span>
+                <span class="badge" :style="colorStyle(colorForType(rel.relationshiptypename))">{{ rel.relationshiptypename }}</span>
                 <span class="rel-type-badge">{{ rel.sourceasset?.assettype }}</span>
               </div>
               <div v-if="rel.notes" class="rel-notes">{{ rel.notes }}</div>
@@ -175,6 +175,7 @@
 import { ref, computed, onMounted, watch } from 'vue'
 import { Cog, Monitor, Printer, Globe, Package } from 'lucide-vue-next'
 import { assetsApi, relationshipTypesApi } from '../api'
+import { colorStyle } from '@/utils/colorStyle'
 import { useAuthStore } from '../stores/auth'
 
 const props = defineProps({
@@ -199,6 +200,11 @@ const lookupFailed = ref(false)
 const outgoing = ref([])
 const incoming = ref([])
 const relationshipTypes = ref([])
+
+function colorForType(name) {
+  const t = relationshipTypes.value.find(rt => rt.relationshiptype === name)
+  return t?.color || null
+}
 const showAddModal = ref(false)
 
 // New relationship form