Function loadComplianceData

web/scripts/ragnar_modern.js:10567–10583

()

                virtual_laa:        ['Virtual/VM', 'text-gray-400'],
            };
            html += `<p class="text-xs uppercase text-gray-400 mt-4 mb-1">All MACs observed (${obs.length})</p>` +
                '<table class="min-w-full text-xs text-gray-300 whitespace-nowrap"><thead>' +
                '<tr class="text-left text-gray-500"><th class="px-2 py-1">MAC</th><th class="px-2 py-1">Type</th><th class="px-2 py-1">Vendor</th><th class="px-2 py-1">IP(s)</th></tr>' +
                '</thead><tbody>' +
                obs.map(c => {
                    const [lbl, cls] = KLASS[c.klass] || [c.klass, 'text-gray-400'];
                    const ips = (c.ips || []);
                    return `<tr class="border-t border-slate-800">
                        <td class="px-2 py-1 font-mono ${c.klass === 'spoofed_vendor_oui' ? 'text-red-300' : ''}">${escapeHtml(c.mac)}</td>
                        <td class="px-2 py-1 ${cls}">${escapeHtml(lbl)}</td>
                        <td class="px-2 py-1 text-gray-400">${escapeHtml(c.vendor || '—')}</td>
                        <td class="px-2 py-1 font-mono">${escapeHtml(ips.slice(0, 4).join(', ')) || '—'}${ips.length > 4 ? '…' : ''}</td>
                    </tr>`;
                }).join('') +
                '</tbody></table>';
        }
        // Reasons narrative
        if (d.reasons && d.reasons.length) {
            html += '<ul class="text-xs text-gray-400 mt-3 list-disc pl-5">' +
                d.reasons.map(x => '<li>' + escapeHtml(x) + '</li>').join('') + '</ul>';