# Задача: интерактивная страница «Бинго «Баланс 2.0»» для команды ## Контекст Командная wellbeing-инициатива на 8 недель (2 ноября — 21 декабря 2026), ~20–25 участников. Люди работают в разных компаниях (часть — подрядчики), общий аккаунт или SSO у всех не гарантирован. Ссылку закрепляем в канале Microsoft Teams. Нужна одна веб-страница без регистрации. ## Что делает страница 1. Каждый видит свою карточку 4×4 и кликает по клеткам, которые сделал на этой неделе (повторный клик снимает отметку). 2. Когда собран целый ряд (4 клетки одного ряда) — ряд подсвечивается + конфетти. 3. Внизу общая «батарейка команды» — растёт в реальном времени (достаточно опроса сервера раз в 15–30 сек). 4. Личная карточка обнуляется каждый понедельник в 00:00 (часовой пояс — настройка, по умолчанию Europe/Moscow). Батарейка НЕ обнуляется — копится весь сезон. ## Подсчёт батарейки - 1 отмеченная клетка = 1 шаг. Собранный ряд = +5 бонусных шагов. - Снятие отметки в ту же неделю вычитает шаг (и бонус, если ряд распался). - Цель сезона: 300 шагов (настройка). Отображение: «N из 300 шагов», процент и 10 делений по 10%. - Больше 300 — показывать «Овердрайв!» и продолжать считать. ## Анонимность (важно) - Никаких имён, email, логинов и аналитики/трекеров. - Личная карточка хранится в браузере (localStorage) + анонимный случайный id устройства. - На сервер уходят только события «клетка X отмечена / снята, неделя W, анонимный id» — чтобы сервер не дал отметить одну клетку дважды за неделю с одного устройства. - Публично видна только общая сумма. Сменил браузер — карточка начинается заново, это допустимо. ## Опционально (если несложно) - Раз в неделю мини-вопрос «Твоя батарейка сейчас?» ⚡ Полная / 🔋 Средне / 🪫 На нуле — анонимные счётчики по неделям (нужно для сравнения «до/после» в финале). - Админ-страница по секретной ссылке: шаги по неделям, популярность каждой клетки, распределение ответов на мини-вопрос, экспорт CSV. ## Клетки (ряд = тема) Тело: 01 Обед без экрана · 02 Разминка между созвонами · 03 Гимнастика для глаз · 04 Сон до полуночи Фокус: 05 Фокус-блок на одну задачу · 06 3 главных дела на день · 07 Встреча превратилась в сообщение · 08 Время залогировано в тот же день Границы: 09 Сказать «нет» или «не сейчас» · 10 Вечер без рабочих сообщений · 11 Попросить о помощи · 12 Ноутбук закрыт вовремя Люди и радость: 13 Офлайн с друзьями или семьёй · 14 Хобби, спорт или что-то руками · 15 «Спасибо» или помощь коллеге · 16 Мем в чат Мемопятницы ## Тексты - Надзаголовок: PROJECT: BALANCE · СЕЗОН 2 · 2 НОЯБРЯ — 21 ДЕКАБРЯ - Заголовок: Бинго «Баланс 2.0» (цифры «2.0» — акцентным цветом) - Три правила: 1 Делай маленькие шаги · 2 Отмечай клетки за неделю · 3 Собрал ряд — +5 в батарейку - Подпись батарейки: «Батарейка команды» / «N из 300 шагов · заполняем вместе до 21 декабря» ## Визуальный стиль - Фон #12233D, клетки #1B3150 с рамкой #2A4468, скругление 20px. - Текст #F2F5FA, второстепенный #A9B8CC. - Цвета рядов (номер клетки, иконка и название ряда): Тело #FF8A65, Фокус #7CC4FF, Границы #B9A6FF, Люди и радость #C6F432. - Акцент (батарейка, «2.0», кружки правил): #C6F432. - Шрифты Google Fonts: Unbounded (заголовки), Manrope (текст). Нужна кириллица. - Слева у каждого ряда — иконка (сердце, мишень, щит, чашка, линейные) и название ряда. - Отмеченная клетка: заливка цветом ряда, тёмный текст, галочка в кружке справа вверху. - Должно хорошо работать на телефоне (ряды могут стать 2×2), клетки — настоящие