# Хэндофф для Claude Design — дашборд «Состояние группировки»

Этот файл — то, что прикладываем в чат Claude Design вместе со скриншотами текущего UI.
Цель: спроектировать **новый экран «Состояние группировки»** в едином стиле с уже сделанными
прототипами (`pcp-tgu-mission-ops`, `pcp-service-map`, `pcp-tgu-editor`), но на **реальных
токенах продукта**.

Эталон стиля — **реальный код** pcp-tgu-ops-ui (`src/styles/theme.css` + `editor-tokens.css`),
а не oklch/IBM Plex из прежних прототипов. Ниже — те же имена токенов, что в прототипах,
но с боевыми значениями. Используй их as-is.

---

## 1. Токены (вставить в `:root` нового прототипа)

```css
:root {
  /* Фоны (тёмная пультовая тема) */
  --bg-0: #111315;   /* база */
  --bg-1: #171a1c;   /* панель */
  --bg-2: #1f2325;   /* панель 2 */
  --bg-3: #262b2e;   /* приподнятый элемент */
  --line: #30373a;
  --line-soft: #252b2d;
  --grid: #252b2d;

  /* Текст */
  --ink:   #e7ecec;
  --ink-1: #e7ecec;
  --ink-2: #a4b0b1;
  --ink-3: #748183;

  /* Акцент / статусы */
  --accent: #68c3bd;        /* бирюза — основной акцент */
  --accent-strong: #82ded8;
  --danger:  #d64545;
  --warning: #f0ad2e;
  --success: #2f9e44;
  --now:  #f0ad2e;          /* линия «сейчас» */
  --warn: #f0ad2e;

  /* Типы аппаратуры (ДЗЗ): оптика / радар / комбо */
  --t-optical:     #68c3bd;
  --t-optical-dim: rgba(104, 195, 189, 0.18);
  --t-radar:       #f0ad2e;
  --t-radar-dim:   rgba(240, 173, 46, 0.16);
  --t-combo:       #d64545;
  --t-combo-dim:   rgba(214, 69, 69, 0.16);

  /* Шрифты */
  --sans: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --mono: "SFMono-Regular", Consolas, "Liberation Mono", monospace;

  --radius: 7px;
  --shadow: 0 16px 42px rgba(0, 0, 0, 0.28);
}
```

**Правила стиля, обязательные к соблюдению:**
- Все **числа, идентификаторы, времена** — моноширинным (`--mono`). Это узнаваемая черта UI.
- Подписи/заголовки — `--sans` (Inter).
- Никаких oklch и IBM Plex — только значения выше.

---

## 2. Что изменилось в продукте с момента прежних прототипов

Если будешь заодно подравнивать существующие морды — учти эти расхождения с тем, что было
сгенерировано раньше:

- **Редактор:** левая панель информации шире (≈17rem вместо 15.5rem) — числа больше не липнут к краю.
- **Слоты:** статусы слотов проставляются и красятся **только после закладки плана на КА**
  (статус `LAID_IN`), а не по «принятию». До закладки — нейтральны.
- **Закладка:** кнопка «Подтвердить закладку» заблокирована, пока начало закладки в будущем.
- **Комплексный план (вкладка):** появились история прогонов (выпадающий список прошлых расчётов),
  тумблер «Показать заявки» (оверлей заявок на карте) и ограничение интервала расчёта — **не более 10 суток**.
- **Редактор / правка включения:** инспектор включения read-only; правка идёт через
  «Редактировать» → предзаполненное окно построения, которое заменяет маршрут.
- **Таймлайн:** стрелки цепочки версий плана между выдачами.
- **Статусы плана:** `LAID_IN` и `SUPERSEDED` теперь реальны; `ACCEPTED` не возникает.

---

## 3. ТЗ на новый экран «Состояние группировки»

Оперативный дашборд состояния орбитальной группировки ДЗЗ. Главное — «живая» карта с
проигрыванием и подсветкой того, что снимается прямо сейчас.

**Раскладка (предложение, можно улучшить):**
- Крупная карта мира (2D, как в `pcp-service-map`) — основная область.
- Снизу — компактная **полоса проигрывания**: кнопка ▶/⏸, скорость (1×/10×/60×/300×),
  ползунок времени, текущее модельное время моноширинным.
- Слева/справа — узкая панель: список КА группировки со статусом (на связи / съёмка / сброс /
  вне зоны), фильтр по типу аппаратуры (оптика/радар/комбо), счётчики.
- Верхняя строка — сводка: всего КА, сейчас снимают N, активных маршрутов M, ближайший сеанс.

**Поведение «плей»:**
- По ▶ модельное время идёт вперёд; **метки КА двигаются по трассам** в реальном (масштабируемом) времени.
- Маршруты/полосы, которые **снимаются в текущий момент времени**, подсвечиваются (акцентом/типом
  аппаратуры), у КА в режиме съёмки — выделенное состояние.
- При паузе — всё замирает, можно кликнуть КА/маршрут и увидеть детали (как инспектор в редакторе).
- Линия «сейчас» (`--now`) отделяет факт от прогноза, если будет мини-таймлайн снизу.

**Данные (моки в `data.jsx`, сид-генерация как в прежних прототипах):**
- `spacecraft[]`: { id, name, group, type: optical|radar|combo, ... } + упрощённая трасса
  (последовательность {t, lat, lon}) для анимации позиции по времени.
- `captures[]` (включения): { id, scId, tStart, tEnd, footprint (полигон/полоса), requestId? } —
  по ним подсвечиваем «снимается сейчас», когда `tStart ≤ now ≤ tEnd`.
- `NOW` зафиксировать под дату проекта, диапазон — несколько суток.

**Формат сдачи:** новая папка `docs/ui-prototypes/pcp-grouping-dashboard/` в том же устройстве,
что прежние прототипы: `app.jsx` (корень) + `data.jsx` (моки) + модули (`mapview.jsx`,
`timeline.jsx`/`playbar.jsx`, `sidebar.jsx`, `details.jsx`, `util.jsx`) + HTML-обёртка
(React/Babel из CDN, блок `:root` из раздела 1). Переиспользуй `basemap.js`/`world.js`/`orbit.jsx`
из `pcp-service-map`, если подходят.
