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

Обзор проекта
- Создать веб-страницу для головоломки «Соедини 9 точек».
- Реализовать правила и инструкции для объяснения игры.

Дизайн и интерфейс пользователя
- Минималистичный дизайн с достаточным пространством вокруг точек для классических решений.
- Интерактивная область для соединения точек линиями с помощью мыши.
- Реализовать таймер для отслеживания времени решения.

Основной функционал и логика
- Использовать JavaScript/CSS для интерактивного рисования линий.
- Проверять решение головоломки: выдавать поздравительное сообщение при правильном решении или объяснять ошибки при неправильном.
- Таймер подсчитывает время, затраченное на решение головоломки.

Лучшие практики
- Оптимизировать для десктопных и мобильных браузеров.
- Обеспечить безопасность и эффективность клиентской логики.
- Обеспечить чёткую визуальную обратную связь при рисовании линий и уведомления о завершении.

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

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

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

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