Минималистичная 3D-сцена с демонстрацией UI-моментов и реальных видеоклипов

Промпт

ПРОМПТ:
<inputs>
Спроси меня: название продукта и обещание в одну строку, от 3 до 5 моментов интерфейса для показа, один акцентный цвет, от 10 до 20 принадлежащих мне настоящих вертикальных клипов и песню без лицензионных отчислений с чётким дропом (например, Mixkit, бесплатную для коммерческого использования).
</inputs>

<direction>
Премиальный минимализм. Одна идея на кадр, много свободного пространства, один акцентный цвет, один чистый гротескный шрифт (Geist или Inter) с плотным кернингом. Проявление текста через маски, match cuts, единый плавный язык камеры. Только реальные кадры, никогда не используй карточки-заполнители. В экранном тексте не ставь точки.
Запрещено: кольца ударных волн, всплески частиц, RGB-разделение, тряска камеры, блики объектива, неоновые свечения, сетчатые полы, мигающие фоны, пружинящая интерполяция.
</direction>

<structure>
10 тактов при 120 BPM, по 2 секунды каждый.
Такт 1: хук появляется на долях, слово за словом.
Такт 2: одно слово из хука превращается в интерфейс продукта. Курсор печатает и нажимает.
Дроп: круг раскрывается из кнопки в тёмную сцену.
Затем одно движение на такт: стена из реальных клипов со сканирующей линией и 3 победителями, ключевой результат крупным текстом, 3D-карусель из реальных видео с отражениями на полу и переходом whip с motion blur на один главный клип, главный клип на телефоне рядом с панелью, которая переворачивается и превращается в результаты, крупная статистика на резких склейках, бегущая строка из 3 слов, появление логотипа, затемнение до чёрного.
</structure>

<build>
1. Один HTML-файл размером 1920x1080. Все стили вычисляются из времени внутри 
http://
window.seek(t): никаких CSS-анимаций, таймеров и состояния между кадрами.
2. Реальное видео: извлеки клипы в последовательности JPEG с частотой 30fps с помощью ffmpeg и меняй источники img для каждого кадра. seek должен дожидаться декодирования изображений.
3. Проанализируй песню с помощью numpy: темп, сетку долей, энергию каждого такта и дроп. Откалибруй сетку по реальным ударам бочки. Каждый монтажный переход должен приходиться на сильную долю, каждое срабатывание интерфейса — на долю.
4. Выполни рендеринг с помощью Playwright: 3 субкадра на каждый кадр — при t минус, в момент t и при t плюс 1/240s, затем смешай их с помощью ffmpeg tmix для получения настоящего motion blur при 60fps.
5. Размести каждый звуковой эффект так, чтобы его измеренный пик, а не начало файла, приходился на событие. Эффекты должны быть тихими на фоне музыки. Нормализуй до -14 LUFS.
6. Проверь 20 или более кадров перед полным рендерингом. Исправь всё, что выглядит загромождённым, перекрывается или плохо читается.
</build>

<gotchas>
Никогда не задавай opacity или filter для элемента с preserve-3d, потому что это сплющивает его и показывает обе стороны. Вместо этого делай затухание его обёртки. Измеряй позиции элементов во время выполнения для match cuts. Используй только музыку и звуковые эффекты, лицензия которых разрешает коммерческое использование.
</gotchas>

<start>
Сначала запроси у меня входные данные, затем покажи раскадровку с точным таймингом каждого момента по сетке долей, и только после этого пиши код.
</start>

<inputs>
Ask me for: the product name and a one-line promise, 3 to 5 UI moments to show, one accent color, 10 to 20 real vertical clips I own, and a royalty-free song with a clear drop (e.g. Mixkit, free for commercial use).
</inputs>

<direction>
High-end minimal. One idea per shot, lots of empty space, one accent color, one clean sans (Geist or Inter) with tight tracking. Masked type reveals, match cuts, one smooth camera language. Real footage only, never placeholder cards. No full stops in on-screen text.
Banned: shockwave rings, particle bursts, RGB split, camera shake, lens flares, neon glows, grid floors, flashing backgrounds, bouncy easing.
</direction>

<structure>
10 bars at 120 BPM, 2 seconds each.
Bar 1: the hook lands word by word on the beats.
Bar 2: one hook word morphs into the product UI. A cursor types and clicks.
The drop: a circle opens out of the button into a dark scene.
Then one move per bar: a wall of real clips with a scan line and 3 winners, the key output as big type, a 3D carousel of real videos with floor reflections and a motion-blurred whip onto one hero clip, the hero in a phone next to a panel that flips into results, big stats on push cuts, a 3-word ticker, a logo reveal, a fade to black.
</structure>

<build>
1. One HTML file at 1920x1080. Every style is computed from time inside 
http://
window.seek(t): no CSS animations, no timers, no state between frames.
2. Real video: extract clips to 30fps JPEG sequences with ffmpeg and swap img sources per frame. seek awaits the image decodes.
3. Analyze the song with numpy: tempo, beat grid, energy per bar, the drop. Calibrate the grid to the real kick hits. Every cut sits on a downbeat, every UI hit on a beat.
4. Render with Playwright: 3 subframes per frame at t minus, at, and plus 1/240s, then blend with ffmpeg tmix for real motion blur at 60fps.
5. Place each sound effect so its measured peak, not its file start, lands on the event. Keep the effects quiet under the music. Loudnorm to -14 LUFS.
6. Probe 20 or more frames before the full render. Fix anything cluttered, overlapping or hard to read.
</build>

<gotchas>
Never set opacity or filter on a preserve-3d element, because it flattens and both faces show. Fade its wrapper instead. Measure element positions at runtime for match cuts. Only use music and sound effects whose license allows commercial use.
</gotchas>

<start>
Ask me for the inputs, then show me a storyboard with every timing on the beat grid before you write any code.
</start>