468「노래 한 소절」 가사 영상 — 소리에 반응하는 원형 비주얼라이저 위로 가사가 노래방처럼 켜지는 20초

Make a 20-second vertical lyric video for one part of a song, as one self-contained HTML file, and render it to MP4 with sound. It must look like a premium music-player visual from a top studio: a deep night background, one glowing circle that pulses with the music, light that blooms with every beat, and lyrics that light up like karaoke. Do the whole job now without asking questions.

[Inputs (use the default when empty)]
Song title: "【곡 제목】"
Artist or channel: "【부른 사람 · 채널】"
Four lyric lines (slash-separated): "【가사 4줄】" — words wrapped in *asterisks* are the emphasis words
End text: "【끝 문구】" — default: the artist
Audio: "【음원】" — the user may attach their own song file to this chat. If attached, use a 20-second part of it (start where the energy jumps, e.g. a chorus downbeat) and make every visual react to that real sound. If not attached, make the music yourself (see Sound).
Backing mood: "【반주 분위기】" — 밤 · 신스 = minor synth night drive, 로파이 = soft swung lo-fi with seventh chords, 밝은 팝 = bright major pop
Palette: "【색 조합】"
  밤 · 불꽃 = background #0E0B1A, text #FFF4E8, accent fire #FF5A36, second amber #FFB13B, glow violet #7A5CFF, disc #1A1530
  밤 · 바다 = background #061522, text #EAF7FF, accent #3EC5FF, second #9AF1FF, glow #FF6FB1, disc #0E2234
  새벽 · 분홍 = background #1B1026, text #FFF0F7, accent #FF6FB1, second #FFD1E8, glow #8A7BFF, disc #2A1838
Tempo: "【박자】" — default 140 BPM. Aspect ratio: Output size 1080x1920 pixels, 9:16 portrait story. Keep all text inside the central 80% of the height: compress every zone percentage below into the 10-90% range. (default 9:16).

[Sound — analyse it so the picture can listen]
If an audio file was attached, cut the part and use it. Otherwise: if you can generate music, make an instrumental at the tempo and mood; if you cannot, write the backing track yourself in code — synthesize an original instrumental sample by sample into a WAV (kick on every beat, snare on 2 and 4, eighth-note hi-hats, a bass line on the chord roots, a soft chord pad that ducks on the kick, a light sixteenth-note arpeggio, a short echo), four chords looping, with only pad and hats for the first two bars and the full band from bar three. Never use a placeholder or someone else's recording.
Then analyse the final audio offline into one value per video frame: overall loudness (RMS) and 16 log-spaced frequency bands from 50 Hz to 6 kHz, each normalised to 0–1 by its 95th percentile, rising fast and falling slowly. Embed the arrays in the HTML so seek(t) can look them up; if they are missing, fall back to a beat-shaped envelope from the tempo.

[Picture — layers drawn every frame]
1. Background with a radial glow behind the circle whose size and brightness follow loudness.
2. About 70 embers drifting upward, faster and brighter when it is loud.
3. A circular visualiser: 72 bars around a dark disc, mirrored left and right, low bands at the bottom and high bands at the top, colored from amber to fire by height, with a soft glow; the disc has thin record grooves that slowly rotate and a fire-colored centre label that pulses.
4. A glowing waveform line across the lower part built from the bands, swelling on the beat.
5. A music-player progress bar with elapsed and total time under it.
6. A small "♪ title · artist" line at the top after the intro.

[Structure — 6 scenes of 8 beats]
1. Intro: the circle grows in with an overshoot, the title types under it, the artist fades in, then both fade.
2–5. One lyric line per scene, large heavy Korean sans (Noto Sans KR 900) under the circle: it rises in, then its letters light up left to right over the scene like karaoke (lit letters turn the accent color with a glow and hop slightly); the previous line floats up and fades; the next line waits small and dim below.
6. End: the title pops back, the artist under it, then a pill with the end text; fade to the background on the last beat.

[Build]
One HTML file, everything on a single canvas. The script starts with a `const CONFIG` object holding every input plus fps 60 and a seed. All drawing comes from a pure `seek(t)` — no timers, no CSS animation, randomness only from the seed — so any frame renders identically. A settings panel above the preview (hidden with ?render=1) with Korean labels: text inputs for every text input, selects for mood, palette, tempo and ratio, play/pause, a scrubber, and a "설정 복사" button that copies CONFIG as code. Edits re-render instantly.
Write render.mjs: open the page with ?render=1 in headless Chromium (Playwright), wait for document.fonts.ready, step seek(frame / 60) through every frame, screenshot the canvas at 1080 px on the short side, pipe into ffmpeg (libx264, yuv420p, crf 18), then mux the audio as AAC into motion.mp4. Close the browser at the end. Accept an optional JSON file argument that overrides CONFIG.

[Check before finishing]
Render, export the middle of every scene into a contact sheet and look at it, and confirm the MP4 has an audio stream with sensible loudness (not silent, not clipping): bars and waveform visibly react, every lyric is readable at phone size and never clipped, the karaoke reaches the last letter before the scene ends. Fix and re-render if anything fails. Finish with the file paths and the single command to re-render after editing settings.

[Final output format]
Output size 1080x1920 pixels, 9:16 portrait story. Keep all text inside the central 80% of the height: compress every zone percentage below into the 10-90% range.
This selected output format takes priority over any fixed canvas size or aspect ratio elsewhere in this template. Adapt the composition, text zones and margins to the selected canvas without stretching or cropping essential content. Device safe areas apply only when a device is selected. Never print these format instructions on the image.