// Icons used across the page (lucide-style strokes)
const Icon = ({ name, size = 18 }) => {
  const s = { width: size, height: size, strokeWidth: 1.6, fill: "none", stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round" };
  switch (name) {
    case "arrow-right": return (<svg viewBox="0 0 24 24" {...s}><path d="M5 12h14M13 5l7 7-7 7" /></svg>);
    case "check": return (<svg viewBox="0 0 24 24" {...s}><path d="M5 12l4 4 10-10" /></svg>);
    case "spark": return (<svg viewBox="0 0 24 24" {...s}><path d="M13 2L3 14h7l-1 8 10-12h-7l1-8z" /></svg>);
    case "globe": return (<svg viewBox="0 0 24 24" {...s}><circle cx="12" cy="12" r="9" /><path d="M3 12h18M12 3a14 14 0 010 18M12 3a14 14 0 000 18" /></svg>);
    case "shield": return (<svg viewBox="0 0 24 24" {...s}><path d="M12 3l8 3v6c0 5-3.5 8-8 9-4.5-1-8-4-8-9V6l8-3z" /><path d="M9 12l2 2 4-4" /></svg>);
    case "code": return (<svg viewBox="0 0 24 24" {...s}><path d="M8 6L2 12l6 6M16 6l6 6-6 6M14 4l-4 16" /></svg>);
    case "git": return (<svg viewBox="0 0 24 24" {...s}><circle cx="6" cy="6" r="2.5" /><circle cx="6" cy="18" r="2.5" /><circle cx="18" cy="14" r="2.5" /><path d="M6 8.5v7M6 14h6c2 0 4-1.5 4-4V8.5" /></svg>);
    case "terminal": return (<svg viewBox="0 0 24 24" {...s}><path d="M4 7l5 5-5 5M11 17h9" /><rect x="2" y="3" width="20" height="18" rx="2" /></svg>);
    case "bolt": return (<svg viewBox="0 0 24 24" {...s}><path d="M13 2L4 14h7l-1 8 10-12h-7l1-8z" /></svg>);
    case "stack": return (<svg viewBox="0 0 24 24" {...s}><path d="M12 3L2 8l10 5 10-5-10-5z" /><path d="M2 13l10 5 10-5M2 18l10 5 10-5" /></svg>);
    case "lock": return (<svg viewBox="0 0 24 24" {...s}><rect x="4" y="11" width="16" height="10" rx="2" /><path d="M8 11V7a4 4 0 018 0v4" /></svg>);
    case "regions": return (<svg viewBox="0 0 24 24" {...s}><circle cx="12" cy="12" r="3" /><circle cx="12" cy="12" r="8" /><path d="M12 4v2M12 18v2M4 12h2M18 12h2" /></svg>);
    case "scale": return (<svg viewBox="0 0 24 24" {...s}><path d="M3 17l6-6 4 4 8-8M14 7h7v7" /></svg>);
    case "chart": return (<svg viewBox="0 0 24 24" {...s}><path d="M3 3v18h18M7 14l4-4 3 3 6-7" /></svg>);
    case "plug": return (<svg viewBox="0 0 24 24" {...s}><path d="M9 2v6M15 2v6M5 8h14v3a7 7 0 01-14 0V8zM12 18v4" /></svg>);
    case "plus": return (<svg viewBox="0 0 24 24" {...s}><path d="M12 5v14M5 12h14" /></svg>);
    case "twitter": return (<svg viewBox="0 0 24 24" {...s}><path d="M22 5.8c-.7.3-1.5.6-2.3.7.8-.5 1.5-1.3 1.8-2.2-.8.5-1.7.8-2.6 1A4 4 0 0012 9.3c-3.3-.2-6.3-1.8-8.3-4.2a4 4 0 001.2 5.4 4 4 0 01-1.8-.5v.1a4 4 0 003.2 4 4 4 0 01-1.8.1 4 4 0 003.7 2.8A8 8 0 012 18.6 11 11 0 008 20.3c7.2 0 11.2-6 11.2-11.2v-.5c.8-.6 1.4-1.3 2-2z" /></svg>);
    case "github": return (<svg viewBox="0 0 24 24" {...s}><path d="M9 19c-4 1-4-2-6-2m12 4v-3a3 3 0 00-1-2c3 0 6-2 6-6a5 5 0 00-1-3 5 5 0 00-1-4s-1 0-3 1a11 11 0 00-6 0c-2-1-3-1-3-1a5 5 0 00-1 4 5 5 0 00-1 3c0 4 3 6 6 6a3 3 0 00-1 2v3" /></svg>);
    case "discord": return (<svg viewBox="0 0 24 24" {...s}><path d="M19 5a17 17 0 00-4-1l-.2.4a13 13 0 00-5.6 0L9 4a17 17 0 00-4 1c-3 4-3 9-3 14a17 17 0 005 2l1-2a10 10 0 01-2-1l.5-.4a12 12 0 0011 0l.5.4a10 10 0 01-2 1l1 2a17 17 0 005-2c0-5 0-10-3-14z" /><circle cx="9" cy="13" r="1.2" /><circle cx="15" cy="13" r="1.2" /></svg>);
    default: return null;
  }
};

window.Icon = Icon;