// Lucide-style inline icons
const Icon = ({ d, size = 24, stroke = 'currentColor', fill = 'none', sw = 2, children, ...rest }) => (
  <svg width={size} height={size} viewBox="0 0 24 24" fill={fill} stroke={stroke} strokeWidth={sw}
       strokeLinecap="round" strokeLinejoin="round" {...rest}>
    {children || <path d={d} />}
  </svg>
);

const IconBall = (p) => (
  <Icon {...p}>
    <circle cx="12" cy="12" r="9"/>
    <path d="M12 3l3 4-1 5-4 0-1-5 3-4z"/>
    <path d="M3 12l4 1 2 4-3 3"/>
    <path d="M21 12l-4 1-2 4 3 3"/>
    <path d="M9 8 5 7"/>
    <path d="M15 8l4-1"/>
  </Icon>
);
const IconWhistle = (p) => (
  <Icon {...p}>
    <path d="M3 12a6 6 0 1 0 12 0 6 6 0 0 0-12 0z"/>
    <path d="M15 10h6l-2-3-4 1"/>
    <circle cx="9" cy="12" r="1.5"/>
  </Icon>
);
const IconShield = (p) => (
  <Icon {...p}>
    <path d="M12 3l8 3v6c0 5-3.5 8-8 9-4.5-1-8-4-8-9V6l8-3z"/>
  </Icon>
);
const IconTrophy = (p) => (
  <Icon {...p}>
    <path d="M8 4h8v4a4 4 0 1 1-8 0V4z"/>
    <path d="M8 6H4v2a3 3 0 0 0 3 3"/>
    <path d="M16 6h4v2a3 3 0 0 1-3 3"/>
    <path d="M10 14h4l-1 4h-2l-1-4z"/>
    <path d="M8 20h8"/>
  </Icon>
);
const IconUsers = (p) => (
  <Icon {...p}>
    <circle cx="9" cy="8" r="3"/>
    <path d="M3 20c0-3 3-5 6-5s6 2 6 5"/>
    <circle cx="17" cy="9" r="2.5"/>
    <path d="M15 20c0-2.2 1.8-4 4-4"/>
  </Icon>
);
const IconSpark = (p) => (
  <Icon {...p}>
    <path d="M12 3v4"/><path d="M12 17v4"/><path d="M3 12h4"/><path d="M17 12h4"/>
    <path d="M5.5 5.5l2.5 2.5"/><path d="M16 16l2.5 2.5"/>
    <path d="M5.5 18.5L8 16"/><path d="M16 8l2.5-2.5"/>
  </Icon>
);
const IconCalendar = (p) => (
  <Icon {...p}>
    <rect x="3" y="5" width="18" height="16" rx="2"/>
    <path d="M3 9h18"/><path d="M8 3v4"/><path d="M16 3v4"/>
  </Icon>
);
const IconClock = (p) => (
  <Icon {...p}><circle cx="12" cy="12" r="9"/><path d="M12 7v5l3 2"/></Icon>
);
const IconPin = (p) => (
  <Icon {...p}>
    <path d="M12 22s7-7 7-12a7 7 0 1 0-14 0c0 5 7 12 7 12z"/>
    <circle cx="12" cy="10" r="2.5"/>
  </Icon>
);
const IconPhone = (p) => (
  <Icon {...p}>
    <path d="M5 3h3l2 5-2 1a11 11 0 0 0 6 6l1-2 5 2v3a2 2 0 0 1-2 2A17 17 0 0 1 3 5a2 2 0 0 1 2-2z"/>
  </Icon>
);
const IconMail = (p) => (
  <Icon {...p}>
    <rect x="3" y="5" width="18" height="14" rx="2"/>
    <path d="M3 7l9 7 9-7"/>
  </Icon>
);
const IconArrow = (p) => (
  <Icon {...p}><path d="M5 12h14"/><path d="M13 6l6 6-6 6"/></Icon>
);
const IconCheck = (p) => (
  <Icon {...p}><path d="M5 12l4 4 10-10"/></Icon>
);
const IconStar = (p) => (
  <Icon {...p}><path d="M12 3l2.6 5.6 6.4.7-4.8 4.4 1.4 6.3L12 17l-5.6 3 1.4-6.3L3 9.3l6.4-.7L12 3z"/></Icon>
);
const IconMenu = (p) => (
  <Icon {...p}><path d="M3 6h18"/><path d="M3 12h18"/><path d="M3 18h18"/></Icon>
);
const IconX = (p) => (
  <Icon {...p}><path d="M6 6l12 12"/><path d="M18 6L6 18"/></Icon>
);
const IconIG = (p) => (
  <Icon {...p}>
    <rect x="3" y="3" width="18" height="18" rx="5"/>
    <circle cx="12" cy="12" r="4"/>
    <circle cx="17.5" cy="6.5" r="0.6" fill="currentColor"/>
  </Icon>
);
const IconYT = (p) => (
  <Icon {...p}>
    <rect x="2.5" y="6" width="19" height="12" rx="3"/>
    <path d="M10 9.5v5l4.5-2.5L10 9.5z" fill="currentColor"/>
  </Icon>
);
const IconWA = (p) => (
  <Icon {...p}>
    <path d="M20 12a8 8 0 1 1-3.5-6.6L20 4l-1.4 3.5A8 8 0 0 1 20 12z"/>
    <path d="M9 9c0 4 2 6 6 6l1.5-1.5-2-1L13 14a4 4 0 0 1-3-3l1.5-1.5-1-2L9 9z"/>
  </Icon>
);
const IconTikTok = (p) => (
  <Icon {...p}>
    <path d="M14 4v9a4 4 0 1 1-4-4"/>
    <path d="M14 4c0 2.5 2 4.5 4.5 4.5"/>
  </Icon>
);

Object.assign(window, {
  Icon, IconBall, IconWhistle, IconShield, IconTrophy, IconUsers, IconSpark,
  IconCalendar, IconClock, IconPin, IconPhone, IconMail, IconArrow, IconCheck,
  IconStar, IconMenu, IconX, IconIG, IconYT, IconWA, IconTikTok
});
