Crie uma página web com um quebra-cabeça 'Conecta 9 Pontos' usando quatro linhas sem soltar o mouse, permitindo que as linhas ultrapassem a grade. Descreva as regras e torne-o interativo para ser resolvido com o mouse. Garanta que o usuário seja parabenizado caso a solução esteja correta ou explique os erros, se não estiver.

Visão Geral do Projeto
- Construa uma página web para o quebra-cabeça 'Conecta 9 Pontos'.
- Implemente regras e diretrizes para explicar o jogo.

Design e Fluxo UI/UX
- Design minimalista com espaço suficiente ao redor dos pontos para permitir soluções clássicas.
- Área interativa para conectar pontos com linhas usando o mouse.
- Implemente um cronômetro para o desafio.

Funcionalidade Principal e Lógica
- Use JavaScript/CSS para desenhar linhas de forma interativa.
- Valide a solução do quebra-cabeça: notifique com uma mensagem de parabéns se estiver correta ou explique os erros, se não estiver.
- O cronômetro conta o tempo gasto na resolução do quebra-cabeça.

Melhores Práticas
- Otimize para navegadores de desktop e mobile.
- Lógica do lado do cliente segura e eficiente.
- Feedback visual claro para o desenho das linhas e notificações de conclusão.

Создай страницу с головоломкой соедини 9 точек 4-мя линиями не отрывая руки, линии могут выходить за пределы поля точек.
опиши правила и сделай чтобы можно было ее решить мышкой.
Обязательно выводи поздравление если задача решена,  или объяснение почему задача решена неверно.

Оставь достаточно места, для того чтобы решить задачу и выйти за пределы как в классическом решении

Q: Какой стиль или визуальное оформление вы предпочитаете для головоломки?
A: Например, минималистичный, яркий и игривый.

Q: Хотите ли вы добавить таймер или счетчик попыток для решения головоломки?
A: Да, хочу таймер.