// Minimal SF-style stroked icons. 24x24 viewbox, 1.6 stroke.
const Icon = ({ name, size = 16, color = "currentColor", strokeWidth = 1.6, style }) => {
  const p = {
    fill: "none", stroke: color, strokeWidth, strokeLinecap: "round", strokeLinejoin: "round",
  };
  const paths = {
    tray:       <><path d="M3 13l3-7h12l3 7" {...p}/><path d="M3 13v5a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-5" {...p}/><path d="M3 13h5l1 2h6l1-2h5" {...p}/></>,
    briefcase:  <><rect x="3" y="7" width="18" height="13" rx="2" {...p}/><path d="M9 7V5a2 2 0 0 1 2-2h2a2 2 0 0 1 2 2v2" {...p}/><path d="M3 13h18" {...p}/></>,
    home:       <><path d="M3 11l9-7 9 7" {...p}/><path d="M5 10v9a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-9" {...p}/></>,
    book:       <><path d="M5 4h11a2 2 0 0 1 2 2v14H7a2 2 0 0 1-2-2V4z" {...p}/><path d="M5 18a2 2 0 0 1 2-2h11" {...p}/></>,
    heart:      <><path d="M12 20s-7-4.5-7-10a4 4 0 0 1 7-2.6A4 4 0 0 1 19 10c0 5.5-7 10-7 10z" {...p}/></>,
    sparkle:    <><path d="M12 3l1.8 5.2L19 10l-5.2 1.8L12 17l-1.8-5.2L5 10l5.2-1.8z" {...p}/></>,
    plus:       <><path d="M12 5v14M5 12h14" {...p}/></>,
    search:     <><circle cx="11" cy="11" r="6" {...p}/><path d="M20 20l-3.5-3.5" {...p}/></>,
    calendar:   <><rect x="3" y="5" width="18" height="16" rx="2" {...p}/><path d="M3 10h18M8 3v4M16 3v4" {...p}/></>,
    check:      <><path d="M5 12l4 4 10-10" {...p}/></>,
    circle:     <><circle cx="12" cy="12" r="8" {...p}/></>,
    circleDot:  <><circle cx="12" cy="12" r="8" {...p}/><circle cx="12" cy="12" r="3" fill={color} stroke="none"/></>,
    flag:       <><path d="M5 21V4h11l-2 4 2 4H5" {...p}/></>,
    clock:      <><circle cx="12" cy="12" r="8" {...p}/><path d="M12 8v4l3 2" {...p}/></>,
    tag:        <><path d="M3 12V4h8l10 10-8 8L3 12z" {...p}/><circle cx="8" cy="8" r="1.4" fill={color} stroke="none"/></>,
    link:       <><path d="M10 14a4 4 0 0 1 0-5.6l3-3a4 4 0 0 1 5.6 5.6L17 12.5" {...p}/><path d="M14 10a4 4 0 0 1 0 5.6l-3 3A4 4 0 0 1 5.4 13l1.6-1.6" {...p}/></>,
    chevDown:   <><path d="M6 9l6 6 6-6" {...p}/></>,
    chevRight:  <><path d="M9 6l6 6-6 6" {...p}/></>,
    chevLeft:   <><path d="M15 6l-6 6 6 6" {...p}/></>,
    expand:     <><path d="M4 10V4h6M20 14v6h-6M4 4l7 7M20 20l-7-7" {...p}/></>,
    settings:   <><circle cx="12" cy="12" r="3" {...p}/><path d="M12 2v3M12 19v3M4.2 4.2l2.1 2.1M17.7 17.7l2.1 2.1M2 12h3M19 12h3M4.2 19.8l2.1-2.1M17.7 6.3l2.1-2.1" {...p}/></>,
    bell:       <><path d="M6 16V11a6 6 0 0 1 12 0v5l2 2H4l2-2z" {...p}/><path d="M10 20a2 2 0 0 0 4 0" {...p}/></>,
    keyboard:   <><rect x="2" y="6" width="20" height="12" rx="2" {...p}/><path d="M6 10h.01M10 10h.01M14 10h.01M18 10h.01M6 14h12" {...p}/></>,
    inbox:      <><path d="M3 13l3-7h12l3 7" {...p}/><path d="M3 13v5a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-5h-5l-2 2h-6l-2-2H3z" {...p}/></>,
    play:       <><path d="M7 5l12 7-12 7V5z" {...p}/></>,
    repeat:     <><path d="M4 7h12l-3-3M20 17H8l3 3" {...p}/></>,
    paperclip:  <><path d="M21 11l-9 9a5 5 0 0 1-7-7l9-9a3 3 0 0 1 4 4l-9 9a1.5 1.5 0 0 1-2-2l8-8" {...p}/></>,
    x:          <><path d="M6 6l12 12M18 6L6 18" {...p}/></>,
    command:    <><path d="M8 8h8v8H8z" {...p}/><circle cx="6" cy="6" r="2" {...p}/><circle cx="18" cy="6" r="2" {...p}/><circle cx="6" cy="18" r="2" {...p}/><circle cx="18" cy="18" r="2" {...p}/></>,
    dot:        <><circle cx="12" cy="12" r="3" fill={color} stroke="none"/></>,
    google:     <><path d="M21 12.2c0-.7-.06-1.4-.18-2H12v3.8h5.06a4.3 4.3 0 0 1-1.87 2.8v2.3h3.03c1.77-1.63 2.78-4.04 2.78-6.9z" fill="#4285F4" stroke="none"/><path d="M12 21c2.52 0 4.63-.83 6.18-2.26l-3.03-2.3c-.84.56-1.92.9-3.15.9a5.46 5.46 0 0 1-5.13-3.78H3.74v2.37A9 9 0 0 0 12 21z" fill="#34A853" stroke="none"/><path d="M6.87 13.56a5.4 5.4 0 0 1 0-3.42V7.77H3.74a9 9 0 0 0 0 8.16l3.13-2.37z" fill="#FBBC04" stroke="none"/><path d="M12 6.62c1.37 0 2.6.47 3.57 1.4l2.68-2.68A9 9 0 0 0 3.74 7.77l3.13 2.37A5.46 5.46 0 0 1 12 6.62z" fill="#EA4335" stroke="none"/></>,
    apple:      <><path d="M16.3 12.7c0-2.3 1.9-3.4 2-3.4-1.1-1.6-2.8-1.8-3.4-1.9-1.4-.1-2.8.85-3.5.85-.7 0-1.85-.83-3.05-.8-1.55.03-3 .92-3.8 2.33-1.62 2.8-.42 6.96 1.16 9.24.77 1.12 1.7 2.36 2.9 2.32 1.16-.04 1.6-.75 3-.75 1.4 0 1.8.75 3.03.73 1.25-.02 2.05-1.13 2.82-2.26.88-1.3 1.25-2.56 1.27-2.62-.03-.02-2.44-.93-2.46-3.7zM14.1 5.9c.63-.77 1.05-1.83.94-2.9-.9.04-2 .6-2.66 1.36-.58.66-1.1 1.74-.96 2.77 1.02.08 2.06-.5 2.68-1.23z" fill={color} stroke="none"/></>,
    outlook:    <><rect x="3" y="6" width="11" height="12" rx="1" {...p}/><path d="M14 9l4-2v10l-4-2" {...p}/><circle cx="8.5" cy="12" r="2.2" {...p}/></>,
    grip:       <><circle cx="9" cy="6" r="1.2" fill={color} stroke="none"/><circle cx="15" cy="6" r="1.2" fill={color} stroke="none"/><circle cx="9" cy="12" r="1.2" fill={color} stroke="none"/><circle cx="15" cy="12" r="1.2" fill={color} stroke="none"/><circle cx="9" cy="18" r="1.2" fill={color} stroke="none"/><circle cx="15" cy="18" r="1.2" fill={color} stroke="none"/></>,
    arrowUp:    <><path d="M12 19V5M5 12l7-7 7 7" {...p}/></>,
    arrowDown:  <><path d="M12 5v14M5 12l7 7 7-7" {...p}/></>,
    moon:       <><path d="M20 14a8 8 0 0 1-10-10 8 8 0 1 0 10 10z" {...p}/></>,
    sun:        <><circle cx="12" cy="12" r="4" {...p}/><path d="M12 3v2M12 19v2M3 12h2M19 12h2M5.6 5.6l1.4 1.4M17 17l1.4 1.4M5.6 18.4L7 17M17 7l1.4-1.4" {...p}/></>,
    wifi:       <><path d="M4 9a14 14 0 0 1 16 0M7 12.5a9 9 0 0 1 10 0M10 16a4 4 0 0 1 4 0" {...p}/><circle cx="12" cy="19" r="0.8" fill={color} stroke="none"/></>,
    battery:    <><rect x="2" y="8" width="17" height="9" rx="1.5" {...p}/><rect x="20" y="11" width="2" height="3" rx="0.5" fill={color} stroke="none"/><rect x="4" y="10" width="11" height="5" rx="0.5" fill={color} stroke="none"/></>,
    spotlight:  <><circle cx="11" cy="11" r="6" {...p}/><path d="M20 20l-3.5-3.5" {...p}/></>,
    apple_logo: <><path d="M16.3 12.7c0-2.3 1.9-3.4 2-3.4-1.1-1.6-2.8-1.8-3.4-1.9-1.4-.1-2.8.85-3.5.85-.7 0-1.85-.83-3.05-.8-1.55.03-3 .92-3.8 2.33-1.62 2.8-.42 6.96 1.16 9.24.77 1.12 1.7 2.36 2.9 2.32 1.16-.04 1.6-.75 3-.75 1.4 0 1.8.75 3.03.73 1.25-.02 2.05-1.13 2.82-2.26.88-1.3 1.25-2.56 1.27-2.62-.03-.02-2.44-.93-2.46-3.7zM14.1 5.9c.63-.77 1.05-1.83.94-2.9-.9.04-2 .6-2.66 1.36-.58.66-1.1 1.74-.96 2.77 1.02.08 2.06-.5 2.68-1.23z" fill={color} stroke="none"/></>,
    minus:      <><path d="M5 12h14" {...p}/></>,
    enter:      <><path d="M20 7v4a2 2 0 0 1-2 2H6" {...p}/><path d="M9 16l-3-3 3-3" {...p}/></>,
  };
  return (
    <svg width={size} height={size} viewBox="0 0 24 24" style={style} aria-hidden="true">
      {paths[name] || null}
    </svg>
  );
};

window.Icon = Icon;
