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

Инструкции:
- Расположение точек: расположите точки в виде сетки 3x3 на странице.
- Взаимодействие с пользователем: позвольте пользователям рисовать прямые линии, щелкая и перетаскивая между точками, обеспечивая непрерывное соединение линий без отрыва мыши.
- Правила загадки: четко объясните задачу — соединить все 9 точек, используя только 4 прямые линии, отметив, что линии должны быть непрерывными.

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

Пользовательский опыт:
- Разработайте привлекательный интерфейс с четкими инструкциями и интерактивной обратной связью, чтобы пользователям было интересно пробовать разные подходы без разочарования.

Особенности:
- Создайте интуитивно понятное оформление, чтобы пользователи легко понимали правила загадки и могли плавно взаимодействовать с ней. Реализуйте логику проверки правильности решения и отображения соответствующей обратной связи. Применяйте лучшие практики веб-дизайна для обеспечения доступности и адаптивности.

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

Q: Как именно должна выглядеть головоломка?
A: Точки в квадрате 3x3.

Q: Какой стиль поздравления или объяснения вас интересует?
A: Неофициальный и дружелюбный.