// Inline SVG icons (stroke-based, 16px default)
const Icon = ({ name, size = 16, style }) => {
  const s = { width: size, height: size, ...style };
  const common = { width: size, height: size, viewBox: '0 0 24 24', fill: 'none', stroke: 'currentColor', strokeWidth: 1.75, strokeLinecap: 'round', strokeLinejoin: 'round' };
  switch (name) {
    case 'command':  return <svg {...common}><rect x="3" y="3" width="7" height="7" rx="1.5"/><rect x="14" y="3" width="7" height="7" rx="1.5"/><rect x="3" y="14" width="7" height="7" rx="1.5"/><path d="M14 17h7M17.5 14v7"/></svg>;
    case 'bolt':     return <svg {...common}><path d="M13 2 4 14h7l-1 8 9-12h-7z"/></svg>;
    case 'graph':    return <svg {...common}><circle cx="6" cy="6" r="2.5"/><circle cx="18" cy="6" r="2.5"/><circle cx="12" cy="18" r="2.5"/><path d="M8 7.5l8 0M7.5 8l3.5 8M16.5 8l-3.5 8"/></svg>;
    case 'map':      return <svg {...common}><path d="M9 18V4l-6 3v14zM15 20V6l6-3v14zM9 4l6 2M9 18l6 2"/></svg>;
    case 'sparkle':  return <svg {...common}><path d="M12 3v3M12 18v3M3 12h3M18 12h3M5.6 5.6l2.1 2.1M16.3 16.3l2.1 2.1M5.6 18.4l2.1-2.1M16.3 7.7l2.1-2.1"/><circle cx="12" cy="12" r="3"/></svg>;
    case 'bulb':     return <svg {...common}><path d="M9 18h6M10 22h4M12 2a6 6 0 0 0-4 10.5c1 .9 1.5 2 1.5 3V15h5v-.5c0-1 .5-2.1 1.5-3A6 6 0 0 0 12 2z"/></svg>;
    case 'alert':    return <svg {...common}><path d="M12 3 2 21h20zM12 10v5M12 18v.01"/></svg>;
    case 'brain':    return <svg {...common}><path d="M9 4.5a2.5 2.5 0 0 0-2.5 2.5v.5A3 3 0 0 0 5 13a3 3 0 0 0 1.5 2.6V17a3 3 0 0 0 3 3h0a3 3 0 0 0 3-3V5a2.5 2.5 0 0 0-2.5-.5z"/><path d="M15 4.5A2.5 2.5 0 0 1 17.5 7v.5A3 3 0 0 1 19 13a3 3 0 0 1-1.5 2.6V17a3 3 0 0 1-3 3h0a3 3 0 0 1-3-3"/></svg>;
    case 'radio':    return <svg {...common}><circle cx="12" cy="12" r="2"/><path d="M7 16.5a7 7 0 0 1 0-9M17 7.5a7 7 0 0 1 0 9M4 19a11 11 0 0 1 0-14M20 5a11 11 0 0 1 0 14"/></svg>;
    case 'key':      return <svg {...common}><circle cx="8" cy="15" r="4"/><path d="M11 12l10-10M17 6l3 3M15 8l3 3"/></svg>;
    case 'cog':      return <svg {...common}><circle cx="12" cy="12" r="3"/><path d="M19.4 15a1.7 1.7 0 0 0 .3 1.8l.1.1a2 2 0 1 1-2.8 2.8l-.1-.1a1.7 1.7 0 0 0-1.8-.3 1.7 1.7 0 0 0-1 1.5V21a2 2 0 0 1-4 0v-.1a1.7 1.7 0 0 0-1.1-1.5 1.7 1.7 0 0 0-1.8.3l-.1.1a2 2 0 1 1-2.8-2.8l.1-.1a1.7 1.7 0 0 0 .3-1.8 1.7 1.7 0 0 0-1.5-1H3a2 2 0 0 1 0-4h.1a1.7 1.7 0 0 0 1.5-1.1 1.7 1.7 0 0 0-.3-1.8l-.1-.1a2 2 0 1 1 2.8-2.8l.1.1a1.7 1.7 0 0 0 1.8.3H9a1.7 1.7 0 0 0 1-1.5V3a2 2 0 0 1 4 0v.1a1.7 1.7 0 0 0 1 1.5 1.7 1.7 0 0 0 1.8-.3l.1-.1a2 2 0 1 1 2.8 2.8l-.1.1a1.7 1.7 0 0 0-.3 1.8V9a1.7 1.7 0 0 0 1.5 1H21a2 2 0 0 1 0 4h-.1a1.7 1.7 0 0 0-1.5 1z"/></svg>;
    case 'building': return <svg {...common}><rect x="4" y="3" width="16" height="18" rx="1.5"/><path d="M9 8h.01M15 8h.01M9 12h.01M15 12h.01M9 16h6"/></svg>;
    case 'search':   return <svg {...common}><circle cx="11" cy="11" r="7"/><path d="m21 21-4.3-4.3"/></svg>;
    case 'up':       return <svg {...common}><path d="M7 14l5-5 5 5"/></svg>;
    case 'down':     return <svg {...common}><path d="M7 10l5 5 5-5"/></svg>;
    case 'arrow-right': return <svg {...common}><path d="M5 12h14M13 5l7 7-7 7"/></svg>;
    case 'plus':     return <svg {...common}><path d="M12 5v14M5 12h14"/></svg>;
    case 'filter':   return <svg {...common}><path d="M3 5h18l-7 9v6l-4-2v-4z"/></svg>;
    case 'refresh':  return <svg {...common}><path d="M3 12a9 9 0 0 1 15-6.7L21 8M21 3v5h-5M21 12a9 9 0 0 1-15 6.7L3 16M3 21v-5h5"/></svg>;
    case 'send':     return <svg {...common}><path d="m22 2-7 20-4-9-9-4z"/></svg>;
    case 'mic':      return <svg {...common}><rect x="9" y="3" width="6" height="12" rx="3"/><path d="M5 11a7 7 0 0 0 14 0M12 18v3M9 21h6"/></svg>;
    case 'chart':    return <svg {...common}><path d="M3 20V4M3 20h18M7 16l4-6 4 4 5-8"/></svg>;
    case 'clipboard':return <svg {...common}><rect x="8" y="3" width="8" height="4" rx="1"/><path d="M8 5H6a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2h-2"/></svg>;
    case 'check':    return <svg {...common}><path d="M4 12l5 5L20 6"/></svg>;
    case 'x':        return <svg {...common}><path d="M6 6l12 12M18 6l-12 12"/></svg>;
    case 'chevron':  return <svg {...common}><path d="M9 6l6 6-6 6"/></svg>;
    case 'shield':   return <svg {...common}><path d="M12 3l8 3v6c0 5-3.5 8.5-8 9-4.5-.5-8-4-8-9V6z"/><path d="m9 12 2 2 4-4"/></svg>;
    default: return null;
  }
};

window.Icon = Icon;