Пиксельная Солнечная система

Полностью реализуйте «интерактивный сайт Солнечной системы в чёрно-белом пиксельном стиле» (чистая статика, запускается локально, развёртывается на статическом хостинге). Все требования перечислены ниже: выполните и проверьте каждый пункт.

[1. Техническая основа]
1. Чистый статический сайт: importmap + нативные ESM; three.js и все зависимости локально в проекте; без CDN, без этапа сборки, без бэкенда; точка входа — index.html.
2. Двухконтурная стратегия ресурсов: для геометрии используются встроенные сферы / параметрические меши three.js; для текстур — реальные астрономические изображения (NASA Visible Earth, карты Луны LRO, SolarSystemScope), организованные в три уровня качества — стандартный / HD 4K / ультра 8K — с менеджером загрузки текстур (кэш Promise, различение цветовых пространств SRGB и линейного, анизотропия ≤ 8, повторная попытка при сбое и переход на стандартный уровень).
3. Рендерер: antialias, вывод SRGB, ACESFilmicToneMapping (экспозиция ≈ 1.05), DPR ≤ 2 (≤ 1.5 на мобильных), ближняя плоскость 0.002, чёрный фон сцены.

[2. Содержимое сцены (всё в реальном времени в 3D; не выдавать изображения или видео за 3D)]
1. Объекты: Солнце + восемь планет + Луна (приливно захвачена и обращается вокруг Земли). Внутренние планеты обращаются быстрее, внешние — медленнее, вращаются с реальными пропорциональными скоростями и имеют реальные наклоны осей (Сатурн 27°, Уран 82°).
2. Солнце: излучающая сфера + слабый ореол; точечный источник света для освещения + слабое рассеянное освещение.
3. Земля: текстуры дня и ночи в реальном времени переключаются по «скалярному произведению нормали · направления на Солнце» (переход терминатора), ночные огни городов светятся сами по себе (отдельный переключатель); отдельная оболочка облаков (1.006R, alphaMap) и атмосферная оболочка с краевым освещением Френеля (1.025R, умноженная на коэффициент солнечного света) — все три слоя переключаются по отдельности.
4. Сатурн: сфера и кольца входят в одну группу с наклоном 27°; кольцо — параметрический меш в плоскости XZ, UV-координаты накладывают полосовую текстуру по радиусу, двустороннее, alphaTest ≈ 0.04, depthWrite = false.
5. Луна: текстура лунной поверхности 8K (на сайте предложить уровни 4K / 8K); освещение крупным планом должно быть затемнено до реалистичного средне-серого вида.
6. Фон: редкие неподвижные точки звёзд (не большая текстура туманности).

[3. Система взаимодействия]
1. Выбор объекта: клик в каталоге / клик raycast по сцене (для малых тел — увеличенная невидимая сфера выбора) / переход к предыдущему или следующему.
2. Камера фокуса: камера постоянно удерживает движущийся целевой объект (смещение синхронизируется каждый кадр) и не увлекается орбитальным движением; расстояние обзора = ограничивающий радиус / коэффициент заполнения кадра (по умолчанию 0.7, Луна 0.78, Солнце 0.45 с чёрной каймой); плавные переходы ease-out длительностью 850 мс отслеживают цель в реальном времени даже во время перехода; перетаскивание пользователем сразу перехватывает управление (отменяя заданное перемещение камеры).
3. Ракурсы: шесть положений камеры — освещённая сторона / терминатор / полярная область / край диска / ночная сторона / деталь (составляются из смещений «направление к Солнцу × в сторону × вверх»; когда цель находится в начале координат, использовать фиксированное направление, чтобы избежать вырождения нулевого вектора).
4. Время и отображение: общая пауза, отдельный переключатель вращения, отдельный переключатель орбит, скорость 0–4×, переключатель орбитальных линий, переключатель подписей, сброс вида; состояния вращения/орбит должны строго синхронизироваться с UI.

[4. Чёрно-белый UI в пиксельном стиле (в духе careers.kimi.com, только чёрный/белый/серый, без синего)]
1. Основной шрифт — моноширинный; пиксельный шрифт для чисел / коротких заголовков / навигации (лицензия OFL, локальное размещение); разборчивый основной шрифт для китайского текста.
2. Верхняя панель: слева логотип SOLAR SYSTEM (английский текст и китайское название), справа «Обзор / Объекты / Настройки отображения».
3. Селектор объектов: группировка по звезде / планетам / луне, двухзначная нумерация, текущий элемент выделен (без больших цветных блоков), прокрутка.
4. Плашка внизу слева: номер (например, 05/10) + крупный заголовок (китайское название + английское) + тип объекта + одна поэтическая строка + данные о диаметре + «Подробнее ↗»; в режиме обзора показывать «размеры и расстояния скорректированы для наглядности».
5. Нижняя панель инструментов: пауза / вращение / орбита / скорость / орбитальные линии / сброс вида (значок + короткий текст) + переключатель предыдущего/следующего (в центре показано английское название текущего объекта).
6. Панель сведений (выезжает справа): описание, ключевые факты (с единицами и пометками «прибл.»), кнопки фокуса наблюдения (каждая связана с реальным состоянием камеры/слоя и показывает «текущее»), источники данных, ссылки для дальнейшего чтения; панель настроек разделена на группы «Вид / Качество».
7. Пропуск событий: полноэкранный слой UI использует pointer-events: none; только кнопки / списки / панели / панель инструментов используют auto; прокрутка внутри панели не должна передаваться canvas. Замените Солнечную систему экзопланетной системой TRAPPIST-1: один красный карлик и семь каменистых планет. Сохраните пиксельный UI, камеру фокуса и управление временем, а для каждой планеты используйте реальные параметры TRAPPIST-1. [5. Пиксельная заставка и эффекты движения]
1. Заставка: полноэкранная 1-битная поверхность Луны с упорядоченным дизерингом Байера (выборка изображения → квантизация в оттенки серого → 4 уровня серого → матрица 4×4); размер блока дизеринга плавно уменьшается с 14px до 1.5px по мере загрузки (сам прогресс служит индикатором загрузки), по центру — заголовок пиксельным шрифтом, тёмная радиальная маска и кнопка «Начать исследование →»; вход только по клику пользователя (без автоматического входа).
2. Выход: после клика заголовок затухает за 220 мс, затем числовая матрица растворяется волной — диагональный фронт проходит по экрану (с возмущением для каждой ячейки), пиксельные блоки уменьшаются и исчезают по градиенту волны, а примерно через 800 мс появляется обзор Солнечной системы.
3. Другие эффекты: при смене объектов крупный заголовок и поэтическая строка появляются через эффект расшифровки перемешанных символов (около 320/420 мс); символы кнопок навигации прокручиваются в два слоя (350 мс, задержка 30 мс на символ, запускается при hover и focus); панели переходят с прозрачностью + смещением 12px (около 220 мс); заголовок панели сведений проявляется через разреженную блочную маску (≤ 700 мс).
4. При prefers-reduced-motion всё сводится к прямому переключению.

[6. Дополнительная информация]
1. Прицел наблюдения: тонкое перекрестие следует за мышью, а координаты LAT/LON указанной поверхности планеты отображаются в реальном времени справа вверху (скрыто на сенсорных экранах).
2. Карточка предпросмотра при наведении в каталоге (название / диаметр / расстояние от Солнца / поэтическая строка).
3. Полное управление с клавиатуры: ←/→ переключают объекты, ↑/↓ изменяют приближение, Space — пауза, 1–0 — прямой переход, O — обзор, D — сведения, S — настройки, H — карточка сочетаний, Esc — закрытие панелей.
4. Журнал наблюдений: внизу справа — прокручиваемая моноширинная запись последних 3 действий.

[7. Мобильные устройства и доступность]
1. Каталог с горизонтальной прокруткой, выбранный элемент автоматически прокручивается в видимую область; сведения / настройки — закрываемые нижние панели; сенсорные цели ≥ 44px; адаптация к безопасной области; панель инструментов и панели не должны перекрываться.
2. Семантические кнопки, корректные aria-pressed / aria-selected, видимый фокус, Escape закрывает панели и возвращает фокус кнопке, которая их открыла, состояние загрузки объявляется через лёгкую live region.

[8. Критерии приёмки (проверить каждый пункт)]
1. Пиксельная заставка видна при запуске; по клику она волной растворяется в обзор (Солнце по центру, орбитальные линии, подписи планет).
2. Поочерёдно переключите все десять объектов: название / выбор в каталоге / данные синхронизированы, камера плавно отслеживает цель, не теряя её, нет чёрных сфер, ошибок компиляции шейдеров и 404.
3. Три переключателя слоёв Земли дают заметный эффект, кольца Сатурна лежат в плоскости его экватора, терминатор Луны выглядит естественно без выбеливания, а Солнце — диск с чёрной каймой (не полноэкранная поверхность Солнца).
4. Проверьте скриншотами на настольном устройстве 1440×900 и телефоне 390×844: нет перекрытий и переполнения; ноль ошибок в консоли; полностью пригодно при включённом reduced-motion.

Сначала перечислите порядок реализации (сцена → взаимодействие → UI → движение → приёмка), затем сразу предоставьте запускаемые файлы. Не предоставляйте незавершённые заглушки и не выдумывайте ресурсы или данные.

Полностью реализуйте «интерактивный сайт Солнечной системы в чёрно-белом пиксельном стиле» (чистая статика, запускается локально, развёртывается на статическом хостинге). Все требования перечислены ниже: выполните и проверьте каждый пункт.

[1. Техническая основа]
1. Чистый статический сайт: importmap + нативные ESM; three.js и все зависимости локально в проекте; без CDN, без этапа сборки, без бэкенда; точка входа — index.html.
2. Двухконтурная стратегия ресурсов: для геометрии используются встроенные сферы / параметрические меши three.js; для текстур — реальные астрономические изображения (NASA Visible Earth, карты Луны LRO, SolarSystemScope), организованные в три уровня качества — стандартный / HD 4K / ультра 8K — с менеджером загрузки текстур (кэш Promise, различение цветовых пространств SRGB и линейного, анизотропия ≤ 8, повторная попытка при сбое и переход на стандартный уровень).
3. Рендерер: antialias, вывод SRGB, ACESFilmicToneMapping (экспозиция ≈ 1.05), DPR ≤ 2 (≤ 1.5 на мобильных), ближняя плоскость 0.002, чёрный фон сцены.

[2. Содержимое сцены (всё в реальном времени в 3D; не выдавать изображения или видео за 3D)]
1. Объекты: Солнце + восемь планет + Луна (приливно захвачена и обращается вокруг Земли). Внутренние планеты обращаются быстрее, внешние — медленнее, вращаются с реальными пропорциональными скоростями и имеют реальные наклоны осей (Сатурн 27°, Уран 82°).
2. Солнце: излучающая сфера + слабый ореол; точечный источник света для освещения + слабое рассеянное освещение.
3. Земля: текстуры дня и ночи в реальном времени переключаются по «скалярному произведению нормали · направления на Солнце» (переход терминатора), ночные огни городов светятся сами по себе (отдельный переключатель); отдельная оболочка облаков (1.006R, alphaMap) и атмосферная оболочка с краевым освещением Френеля (1.025R, умноженная на коэффициент солнечного света) — все три слоя переключаются по отдельности.
4. Сатурн: сфера и кольца входят в одну группу с наклоном 27°; кольцо — параметрический меш в плоскости XZ, UV-координаты накладывают полосовую текстуру по радиусу, двустороннее, alphaTest ≈ 0.04, depthWrite = false.
5. Луна: текстура лунной поверхности 8K (на сайте предложить уровни 4K / 8K); освещение крупным планом должно быть затемнено до реалистичного средне-серого вида.
6. Фон: редкие неподвижные точки звёзд (не большая текстура туманности).

[3. Система взаимодействия]
1. Выбор объекта: клик в каталоге / клик raycast по сцене (для малых тел — увеличенная невидимая сфера выбора) / переход к предыдущему или следующему.
2. Камера фокуса: камера постоянно удерживает движущийся целевой объект (смещение синхронизируется каждый кадр) и не увлекается орбитальным движением; расстояние обзора = ограничивающий радиус / коэффициент заполнения кадра (по умолчанию 0.7, Луна 0.78, Солнце 0.45 с чёрной каймой); плавные переходы ease-out длительностью 850 мс отслеживают цель в реальном времени даже во время перехода; перетаскивание пользователем сразу перехватывает управление (отменяя заданное перемещение камеры).
3. Ракурсы: шесть положений камеры — освещённая сторона / терминатор / полярная область / край диска / ночная сторона / деталь (составляются из смещений «направление к Солнцу × в сторону × вверх»; когда цель находится в начале координат, использовать фиксированное направление, чтобы избежать вырождения нулевого вектора).
4. Время и отображение: общая пауза, отдельный переключатель вращения, отдельный переключатель орбит, скорость 0–4×, переключатель орбитальных линий, переключатель подписей, сброс вида; состояния вращения/орбит должны строго синхронизироваться с UI.

[4. Чёрно-белый UI в пиксельном стиле (в духе careers.kimi.com, только чёрный/белый/серый, без синего)]
1. Основной шрифт — моноширинный; пиксельный шрифт для чисел / коротких заголовков / навигации (лицензия OFL, локальное размещение); разборчивый основной шрифт для китайского текста.
2. Верхняя панель: слева логотип SOLAR SYSTEM (английский текст и китайское название), справа «Обзор / Объекты / Настройки отображения».
3. Селектор объектов: группировка по звезде / планетам / луне, двухзначная нумерация, текущий элемент выделен (без больших цветных блоков), прокрутка.
4. Плашка внизу слева: номер (например, 05/10) + крупный заголовок (китайское название + английское) + тип объекта + одна поэтическая строка + данные о диаметре + «Подробнее ↗»; в режиме обзора показывать «размеры и расстояния скорректированы для наглядности».
5. Нижняя панель инструментов: пауза / вращение / орбита / скорость / орбитальные линии / сброс вида (значок + короткий текст) + переключатель предыдущего/следующего (в центре показано английское название текущего объекта).
6. Панель сведений (выезжает справа): описание, ключевые факты (с единицами и пометками «прибл.»), кнопки фокуса наблюдения (каждая связана с реальным состоянием камеры/слоя и показывает «текущее»), источники данных, ссылки для дальнейшего чтения; панель настроек разделена на группы «Вид / Качество».
7. Пропуск событий: полноэкранный слой UI использует pointer-events: none; только кнопки / списки / панели / панель инструментов используют auto; прокрутка внутри панели не должна передаваться canvas. Добавьте режим класса с четырьмя главами — звезда, каменистые планеты, газовые гиганты, луны. Камера останавливается на каждом этапе, показывает три ключевых пункта в стиле классной доски, а учитель переключает каждый пункт клавишей пробела. [5. Пиксельная заставка и эффекты движения]
1. Заставка: полноэкранная 1-битная поверхность Луны с упорядоченным дизерингом Байера (выборка изображения → квантизация в оттенки серого → 4 уровня серого → матрица 4×4); размер блока дизеринга плавно уменьшается с 14px до 1.5px по мере загрузки (сам прогресс служит индикатором загрузки), по центру — заголовок пиксельным шрифтом, тёмная радиальная маска и кнопка «Начать исследование →»; вход только по клику пользователя (без автоматического входа).
2. Выход: после клика заголовок затухает за 220 мс, затем числовая матрица растворяется волной — диагональный фронт проходит по экрану (с возмущением для каждой ячейки), пиксельные блоки уменьшаются и исчезают по градиенту волны, а примерно через 800 мс появляется обзор Солнечной системы.
3. Другие эффекты: при смене объектов крупный заголовок и поэтическая строка появляются через эффект расшифровки перемешанных символов (около 320/420 мс); символы кнопок навигации прокручиваются в два слоя (350 мс, задержка 30 мс на символ, запускается при hover и focus); панели переходят с прозрачностью + смещением 12px (около 220 мс); заголовок панели сведений проявляется через разреженную блочную маску (≤ 700 мс).
4. При prefers-reduced-motion всё сводится к прямому переключению.

[6. Дополнительная информация]
1. Прицел наблюдения: тонкое перекрестие следует за мышью, а координаты LAT/LON указанной поверхности планеты отображаются в реальном времени справа вверху (скрыто на сенсорных экранах).
2. Карточка предпросмотра при наведении в каталоге (название / диаметр / расстояние от Солнца / поэтическая строка).
3. Полное управление с клавиатуры: ←/→ переключают объекты, ↑/↓ изменяют приближение, Space — пауза, 1–0 — прямой переход, O — обзор, D — сведения, S — настройки, H — карточка сочетаний, Esc — закрытие панелей.
4. Журнал наблюдений: внизу справа — прокручиваемая моноширинная запись последних 3 действий.

[7. Мобильные устройства и доступность]
1. Каталог с горизонтальной прокруткой, выбранный элемент автоматически прокручивается в видимую область; сведения / настройки — закрываемые нижние панели; сенсорные цели ≥ 44px; адаптация к безопасной области; панель инструментов и панели не должны перекрываться.
2. Семантические кнопки, корректные aria-pressed / aria-selected, видимый фокус, Escape закрывает панели и возвращает фокус кнопке, которая их открыла, состояние загрузки объявляется через лёгкую live region.

[8. Критерии приёмки (проверить каждый пункт)]
1. Пиксельная заставка видна при запуске; по клику она волной растворяется в обзор (Солнце по центру, орбитальные линии, подписи планет).
2. Поочерёдно переключите все десять объектов: название / выбор в каталоге / данные синхронизированы, камера плавно отслеживает цель, не теряя её, нет чёрных сфер, ошибок компиляции шейдеров и 404.
3. Три переключателя слоёв Земли дают заметный эффект, кольца Сатурна лежат в плоскости его экватора, терминатор Луны выглядит естественно без выбеливания, а Солнце — диск с чёрной каймой (не полноэкранная поверхность Солнца).
4. Проверьте скриншотами на настольном устройстве 1440×900 и телефоне 390×844: нет перекрытий и переполнения; ноль ошибок в консоли; полностью пригодно при включённом reduced-motion.

Сначала перечислите порядок реализации (сцена → взаимодействие → UI → движение → приёмка), затем сразу предоставьте запускаемые файлы. Не предоставляйте незавершённые заглушки и не выдумывайте ресурсы или данные.