luckiest-co 1.0.40 → 1.0.42

package/skills/video-studio/references/styles/finance-chart.md

@@ -0,0 +1,60 @@
+# Editorial Data Chart
+
+- id: `finance-chart`
+- Source: huashu-art-motion `references/动画语法/t3_finance_chart.md` (MIT)
+- Best for: revenue, profit, user counts, price trends, market share, regional comparisons, before and after an event. Segments where viewers will screenshot and check numbers. 2.5-6s per chart, 30-90s total.
+- Not for: a single number (use a big-number reveal), unreliable or unsourced data, explaining a mechanism.
+- Triggers: economist chart, financial times chart, ft chart, bloomberg, data journalism, revenue chart, bar chart race, candlestick, stock chart animation, finance explainer, earnings growth
+- Tone cell: calm-sharp
+- Clock: smooth 30/60 fps
+
+## Look
+- Base: white `#FFFFFF`, warm salmon `#FFF1E5`, or dark `#0E1116` with light text and a teal main bar. The chart base matches the surrounding video's color family. A white report page dropped into a dark film reads as disconnected.
+- Layout: thin red top rule (8px), small red tag at top left (96x22), bold headline stating the one conclusion, subtitle with metric and unit, source line bottom left.
+- Palette: red `#E3120B`, blue `#006BA2`, cyan `#3EBCD2`, green `#379A8B`, yellow `#EBB434`, grey `#758D99`, black `#0C0C0C`.
+- Emphasis: one color tells the story, everything else drops to light grey (`#C6D2D8`).
+- Grid: horizontal lines only, thin grey (alpha 0.13, 1.5px). Only the zero baseline is solid black (3px). Tick values sit on the right above their lines.
+- Type: condensed sans for numbers, bold headline 700, regular subtitle 400. Axis text smallest, source smallest and lightest.
+- Up and down colors: state them on the chart. Red-up/green-down in East Asian markets, green-up/red-down in Western ones. A colorblind-safe option is blue/orange with up and down triangles.
+- Line width 5px for the main line, 4px averages, 2px callout leaders. Fictional data carries a "sample data" badge on every shot, real data never does.
+
+## Motion
+- Order: layout 0-0.5s, grid lines draw left to right (lag 0.12s, ease-out-quint), x labels fade up, then data, then color emphasis, then the annotation. Each stage 0.5-1.3s.
+- Bars grow from the zero baseline with ease-out-quint, staggered 0.22s, value label rides the bar top and counts in sync.
+- Lines draw by x (time), not arc length, so steep sections draw fast. Head dot 9px with a following price label, area fill alpha 0.14 to 0.
+- Annotation fires the moment the line head passes the event: dot pops (spring 0.45s, bounce 0.25) with a pulse ring, leader draws 0.12s later, text fades 0.3s later. One annotation per shot.
+- Candles appear one by one (lag 0.06s), body then wick, volume in sync.
+- Counts use ease-out-expo over 0.9-1.3s with tabular digits. Hold at least 0.5s after a number lands.
+- Camera stays still. A slow 1s push to a data point or 0.7s glide to the next group, with a fast 0.28s push for the single most important number.
+
+## Signature features (judged against these)
+- Headline is a single conclusion and the multiples in it can be recomputed from the chart (a / b shown in the annotation).
+- Bars start at zero. A line axis that does not start at zero says so in the subtitle.
+- Axes and grid appear before the data.
+- Each data point lands on the spoken number.
+- One highlight color, everything else grey, red/green meaning labeled.
+- One annotation per chart shot.
+- No bouncing bars, 3D bars, or rotating pies.
+- Unit and source are written on the chart.
+
+## Beat pattern (30-60s)
+- 0-4s: chart frame (rule, tag, headline, empty axes). Headline states the conclusion.
+- 4-20s: one chart per one or two voiceover sentences. Bars or line grow when named.
+- 50-70%: pivot to the key figure. Push in to the final bar or the event point, annotation pops with the ratio (for example "130.5 / 16.7").
+- Optional swap: change layout (bar to line) only for the same metric, move first then reshape. Never morph between different metrics.
+- Last 4-6s: one clean frame with the conclusion, source visible, hold 0.8s or more.
+
+## Sound
+Light low-key pulse or soft pad, no big beat. Small tick as each bar lands, clean tone on the final number. Voice sits on top.
+
+## Build it in HyperFrames
+- SVG or Canvas 2D with seeded data. Scales have an inverse so you can compute `tHit = start + duration * smooth^-1(x fraction)` for the annotation trigger.
+- Tick generator uses 1, 2, 2.5, 5 times 10^k, and pads one tick above and below the data range so bars never leave the axes.
+- Panel push transition: new panel slides in from the right with a thin red bar leading, 0.5s on `cubic-bezier(.7,0,.2,1)`, and starts building its layout during the slide.
+- Zoom into a local area: camera redraws vector content, never scales a bitmap.
+
+## Watch out
+- Truncated bar axes, too many colors, every series highlighted.
+- "Rose to 8.7x" is not "rose by 8.7x". Check the wording against the numbers.
+- Animation so busy the value cannot be read.
+- Three identical chart layouts in a row. Insert a push to a detail, a big number, or real footage.

package/skills/video-studio/references/styles/flat-vector.md

@@ -0,0 +1,41 @@
+# Flat Vector Explainer
+
+- id: `flat-vector`
+- Source: mg-styles-15 `prompts/01-flat-vector.md` (MIT, Vincentwei1021)
+- Best for: SaaS explainer, product launch, annual report, science explainer, brand film in one continuous shot
+- Not for: photoreal products, moody or cinematic tone, anything needing gradients or texture
+- Triggers: flat design, vector, explainer, 2D motion graphics, corporate explainer, Material design, shape wipe, bouncy, brand film, Buck, Motion Ocean, Google explainer
+- Tone cell: kinetic-soft
+- Clock: smooth 30 fps
+
+## Look
+Solid color blocks only, no gradients, no or minimal stroke. Bold 5-6 color palette: ultramarine #2B2BFF, coral #FF5A4E, sunflower #FFC62B, mint #2EE6A8, cream #FFF6E9, ink #151433. Geometric characters (circles, rounded rects, limbs as capsules). Clean negative space. Rounded heavy sans for titles. All elements are vector shapes. Shape wipes use full palette colors, never white flashes.
+
+## Motion
+Elastic overshoot is the soul: cubic-bezier(0.34,1.56,0.64,1), or a bezier with 70-85% influence handles. Every entrance is anticipation, burst out, rebound. Stagger entrances 2-4 frames, each element with its own mini overshoot. Squash and stretch about 10% on moves. Only one hero moves at a time. Secondary action and follow-through on limbs, birds, clouds. Transitions are element-driven: a shape expands to fill the frame (shape wipe), or an object flies out and carries the cut. One continuous shot: push into a window, into a phone, into a bubble.
+
+## Signature features (judged against these)
+- Zero gradients, 5-6 flat palette colors only.
+- Entrances use anticipation then overshoot (about 1.1x scale) then settle.
+- Building or icon stagger of 2-4 frames.
+- 10% squash and stretch on moving shapes.
+- Limb rig with anchor-point rotations, head bob, blink.
+- At least one shape-wipe or element-carried transition, no crossfades.
+- One hero moves at a time.
+- Logo lockup assembled by elements flying in, held 1s with micro-motion.
+
+## 10-second beat seed
+- 0-1.2s: empty color field, one saturated circle drops in, stretch, squash, overshoot, settle.
+- 1.2-3s: circle becomes a sun, flat city pops up building by building, clouds slide, birds flap.
+- 3-5.5s: camera pushes into one window, geometric character at a desk reacts, phone pings.
+- 5.5-8s (hero at 60-75%): notification bubble expands as a shape wipe, icons burst in on rhythm (bars grow, check draws, heart pops, coin flips).
+- 8-10s: everything collapses into an invented brand lockup plus tagline, elastic settle, hold 1s with micro-motion.
+
+## Sound
+Upbeat future-bass or pop, about 120 BPM. Pop, boing and whoosh on every entry, synced to the frame.
+
+## Build it in HyperFrames
+SVG composition driven by GSAP with a paused timeline seeked per frame. Put the overshoot curve in a CustomEase or the bezier above. Use nested groups with transform-origin set to joints for limb rigs. Shape wipes are a scaled circle or rect in a palette color. For motion blur on fast moves, render sub-frames (about 4) and average, or skip blur and keep moves short.
+
+## Watch out
+Template look is the main failure: same icon-burst grid, no idea. Avoid more than one hero moving. Keep every color from the palette. Do not let gradients sneak in through shadows. Check kerning on the lockup.

package/skills/video-studio/references/styles/grain-flat-illustration.md

@@ -0,0 +1,48 @@
+# Grain Flat Illustration
+
+- id: `grain-flat-illustration`
+- Source: huashu-art-motion `16_2026.md` (MIT)
+- Best for: SaaS explainers, app launches, character-driven stories with a joke payoff, social shorts, onboarding
+- Not for: photoreal products, heavy texture styles, dense data tables
+- Triggers: flat illustration, dribbble, grain texture, stipple shading, vector character, modern 2d, noise gradient, editorial illustration
+- Tone cell: kinetic-soft
+- Clock: smooth 30/60 fps (limited-animation snaps allowed on hits)
+
+## Look
+Pure color blocks with no outlines. Volume comes from a slightly deeper shade of the same hue (for example a lit sweater block `#f08b7d`, a leg shape with one darker arc `#f3ad4c`). Grain is the finish: 2 px square stipple dots whose density is a function of position, for example a pink disc `0.12 + 0.75*clamp((y-cy+120)/420)` (denser toward the bottom), lavender blocks and a sun denser toward lower right. Static grain is baked into a cache. Characters get a second static grain texture composited with source-atop (5% dark dots alpha 70, 3.5% light dots alpha 90) so grain lands only on them. Light cones are 26,000 stipple dots, width growing 56 to 150 with y, fading with distance. Compose with a big-head character ratio (head scaled about 1.2x around the neck).
+
+## Motion
+- Performance first: anticipation, squash, snap, overshoot, settle. Examples: crouch (sy 1 to 0.86, sx to 1.07), stretch on launch (sy 1.12), squash on landing (sy 0.86 to 0.70, sx 1.18) with the feet pinned to the surface.
+- Facing flips on the flattest frame (a snap, cleaner than a paper-turn).
+- Repeated hits: prep 7 frames, strike 4, hold 4, recover 8; lean amount grows with reach.
+- Falling object: gravity about 1.75 px/frame^2 at 60 fps, rotation `-0.12 - 2.3*q^1.3`, impact lines 8 frames, debris on parabolas, spill that widens then holds, two ripples.
+- Secondary motion by damped oscillators: `damped(F, start, amp, period, decay)`, for a hanging lamp (0.055 rad, period 26 frames) and plants.
+- Transition family: three-color concentric ring iris.
+
+## Signature features (judged against these)
+- No outlines anywhere.
+- Grain density varies with position (falls off toward light).
+- Character grain only on the character, not on the whole frame.
+- Deliberate squash and stretch with feet pinned.
+- Overshoot on arrivals, damped motion on environment.
+- Three-act gag: set-up, escalation, payoff, then a signature or logo stamp.
+- Background decorations boil at 4 fps (+/-1.5 px, +/-0.09 rad).
+
+## 10-second beat seed
+- 0-1.2s: character already doing something, title implied.
+- 1.2-5s: escalation, three repeated attempts that get bigger.
+- 5-7s (hero): the break or payoff with impact lines and debris.
+- 8.8-10s: smug or relieved pose held, signature writes on with a clip reveal.
+
+## Sound
+Light funk or lo-fi pop, 100-116 BPM. Foley hits on every squash and hit, a cartoon crash, a final soft bell.
+
+## Build it in HyperFrames
+Canvas 2D with a pose library. Pose = local key points; `mixPose` lerps numbers between poses.
+- Transform order: translate to center, rotate about feet or center, scale (squash about feet so they do not leave the ground).
+- When aiming a limb after applying a lean transform, convert the target with `c.getTransform().invertSelf().transformPoint(...)`.
+- Signature wipe: clip the text with the writing front moving over frames; underline in 24 segments tapering 3.4 to 1.4 px.
+
+## Watch out
+- No weak spot logged in the source. The main risk is a lifeless cut-and-paste character: keep secondary motion on everything.
+- Measured frame numbers are written at 60 fps; scale them if you render at 30.

package/skills/video-studio/references/styles/hud.md

@@ -0,0 +1,41 @@
+# Cyberpunk HUD (FUI)
+
+- id: `hud`
+- Source: mg-styles-15 `prompts/22-hud.md` (MIT, Vincentwei1021)
+- Best for: tech reviews, AI product demos, game edits, sci-fi and aerospace explainers, film-UI style intros
+- Not for: warm, organic, calm editorial, or hand-made looks
+- Triggers: HUD, FUI, cyberpunk, sci-fi interface, targeting, radar, hologram, tech UI, terminal, scanlines, Territory Studio, Cyberpunk 2077, Evangelion
+- Tone cell: kinetic-sharp
+- Clock: smooth 30 fps
+
+## Look
+Deep teal-black. Cyan #00E5FF linework with orange/red #FF6A00 as the alert state. Hex grid, concentric rotating rings with ticks, conic radar sweep with blips, columns of monospace numbers, typewriter status lines with a cursor, sparkline graphs. Central wireframe hologram (globe or drone) with scanlines. Global glow, slight chromatic aberration, scanlines, restrained micro-glitches. Film-UI density with restraint. Coordinates and labels in monospace, for example "N31°14′ E121°29′".
+
+## Motion
+Layered build-up: lines draw on in hierarchical staggered order, then data comes alive, then a target is found. Rings rotate at different speeds. Numbers jump randomly for 3-5 frames then settle on the real value. Typewriter text with blinking cursor. Lock brackets shrink in from the corners, scale 1.4 to 1.0 with fast-out slow-in, snapping onto the target. Then the whole UI flips to alert orange with "TARGET LOCKED". Micro-glitches kept sparse.
+
+## Signature features (judged against these)
+- Cyan and orange neon linework on teal-black.
+- Wireframes draw on with dashoffset in staggered hierarchy.
+- Radar sweep (conic) with blinking blips.
+- Number columns roll 3-5 frames then settle.
+- Lock brackets 1.4 to 1.0 fast-out slow-in.
+- Hue flip from cyan to orange on lock.
+- Global glow, chromatic aberration, scanlines.
+- Monospace typewriter text with cursor.
+
+## 10-second beat seed
+- 0-1.2s: hex grid and first rings draw on.
+- 1.2-5s: data columns, radar, hologram, status lines come alive.
+- 5-7s: a blip is found, lock brackets close in.
+- 7-8.5s (hero at 70-85%): palette flips to orange, "TARGET LOCKED", alarm.
+- 8.5-10s: held with ongoing rings and scan.
+
+## Sound
+Darksynth pulse with HUD beeps, scan sweeps, an ascending lock-on tone, and an alarm on lock.
+
+## Build it in HyperFrames
+SVG layers for rings and ticks, conic-gradient or canvas for the radar sweep (angle = t * speed), Three.js wireframe hologram with scanline overlay for the center. All data seeded: number at step k = seededRandom(k) until settle time, then final value. Glow with an SVG blur or a bloom pass, RGB offset by a post shader or duplicated layers with mix-blend-mode: screen.
+
+## Watch out
+Too dense and unreadable: keep hierarchy, leave negative space. Unseeded random numbers break determinism. Keep glitches rare. Do not use real military or brand insignia.

package/skills/video-studio/references/styles/impressionist.md

@@ -0,0 +1,48 @@
+# Impressionist Dabs
+
+- id: `impressionist`
+- Source: huashu-art-motion `08_impressionism.md` (MIT)
+- Best for: lifestyle, travel, wellness, food, spring and summer campaigns, soft nostalgic reels
+- Not for: faces and hands in close-up, text-heavy slides, technical product shots
+- Triggers: impressionism, monet, renoir, pastel brushstrokes, sunlit, garden, plein air, dappled light
+- Tone cell: calm-soft
+- Clock: smooth 30/60 fps (brush positions fixed, light and wind animated)
+
+## Look
+Pastel region palettes, 7-9 colors each: lilac-pink walls (`#d8bede #f0c8cc #f2c4d4`), a warm yellow sun zone (cream yellow set), rose-orange-violet floors, plus separate sets for sky, grass, curtains and cloth. Canvas base `#f2e6ee` shows through the gaps between strokes. Strokes are short and fat: main pass cell 11, length 20, width 7, no outline, color jitter 26. A second finer pass (cell 6, length 11, width 4.5) for far views and small framed images. White or near-white elements must be detected (color above about 240,236,225) and mixed back to white, otherwise they get painted the wall color. Signal colors like poppy red stay as authored.
+
+## Motion
+- Dappled sun patches: 26 patches, intensity `0.5+0.5*sin(t*sp+ph)*sin(t*sp*0.53+2ph)`, clamped, so the on/off rhythm is irregular. Each drifts +/-10 to 44 px. Each patch is about 40 bright short strokes.
+- Poppy-like flowers sway: head offset `sin(t*3.2+ph+x*0.02)*(6+r*0.6)`, amplitude 10 or more.
+- Clouds travel about 45 px/s, foliage sways `sin(t*1.9)*8`, ribbons and curtains flutter.
+- Wind rotates distant grass strokes by +/-0.22 rad.
+- Transition family: strokes of color dots flood the frame, then clear into the next scene.
+
+## Signature features (judged against these)
+- Short visible dabs everywhere, no outlines.
+- Light-colored gaps between strokes show the pale base.
+- Sun patches that blink irregularly and drift.
+- Pastel region palettes, no pure black.
+- Fine dabs for distant detail, larger dabs for near surfaces.
+- Whites preserved as whites.
+- Surface does not reshuffle between frames.
+
+## 10-second beat seed
+- 0-1.2s: sunlit scene with light patches already moving.
+- 1.2-6s: wind passes through flowers and cloth, slow pan of 20-40 px.
+- 6-7s (hero): sun patch crosses the subject or title.
+- 8.8-10s: hold with patches still drifting.
+
+## Sound
+Light acoustic guitar or harp, 80-96 BPM, bird ambience. Soft shimmer on each patch flare.
+
+## Build it in HyperFrames
+Canvas 2D flat base redrawn each frame (things move), then 2 full-frame stroke passes.
+- Wrap the palette function so each cell consumes exactly one random number and never returns null. Otherwise one moving object reshuffles every later stroke.
+- Use `hash(i,j)` per cell for subject-layer strokes instead of an alpha mask.
+- Light patches use source-over at high alpha; additive blending disappears on pastel grounds.
+
+## Watch out
+- Current weak spot: faces and hands get shattered by the strokes. Keep them small or paint them in a calmer pass.
+- Reseeding the whole screen every 7-8 frames reads as flicker (measured frame diff 4.1 against 0.57 after the fix). Fix stroke positions, animate light and wind instead.
+- A single coarse pass erases small distant things. Use two passes.

package/skills/video-studio/references/styles/ink-wash.md

@@ -0,0 +1,49 @@
+# Ink Wash (sumi-e)
+
+- id: `ink-wash`
+- Source: huashu-art-motion `17_ink.md` (MIT)
+- Best for: tea, wellness, craft, East Asian brands, poetic intros, minimal luxury, philosophy content
+- Not for: loud kinetic ads, high-saturation product shots, busy UI
+- Triggers: ink wash, sumi-e, chinese painting, calligraphy, brush, shuimo, qi baishi, bada shanren, zen, rice paper
+- Tone cell: calm-sharp
+- Clock: smooth 30/60 fps
+
+## Look
+Paper is the base and ink is only added. Rice paper `#efe6d0` with noise grain and about 2,600 short fibers, a vignette up to alpha 0.22 at the edges. Ink is one near-black `[16,14,12]` used in five tones: scorched 0.9, thick 0.8, heavy 0.6, light 0.35, clear 0.15. Accent pigments used sparingly: ochre `#c47a3c`, blue-gray `#6f8aa0`, yellow `#e2aa34`, a single red for the seal `#c4281e` and tiny vermilion touches (`#d8553f`). Lots of empty space. Whites are carved out of washes with `destination-out`, not painted white.
+
+## Motion
+- Opening: the picture writes itself stroke by stroke over about 0.45 s (`reveal = smoothstep(d, d+l, lt/0.45)`), offset so frame 0 already has ink.
+- Ink bleed: halo blur grows over time, so wash edges keep spreading.
+- Branches sway `sin(2.9t)*0.11`, leaves flip `sin(7t+g)*0.2`, mist bands (paper-colored blurred ellipses) slide 150-270 px/s.
+- A bird crosses at 420 px/s, wings 8 beats per second.
+- Seal stamps down from 1.5x to 1x with multiply.
+- Transition family: strokes write in, ink blooms across the paper.
+
+## Signature features (judged against these)
+- Brush strokes with pressure taper and dry-brush gaps (flying white).
+- Washes with soft spreading edges.
+- Five ink tones, not flat black.
+- Large negative space.
+- A red seal in the corner.
+- Whites by carving, not by paint.
+- Only 2-3 spots of color.
+
+## 10-second beat seed
+- 0-1.2s: strokes write in.
+- 1.2-6s: wash blooms spread, branch sways, mist slides.
+- 6-7s (hero): single bold stroke or bird crossing, seal lands.
+- 8.8-10s: hold with mist moving slowly.
+
+## Sound
+Guzheng or sparse bamboo flute, 60-72 BPM, occasional low drum. One plucked note per stroke.
+
+## Build it in HyperFrames
+Canvas 2D, cache the static strokes after they finish writing.
+- Resample brush paths to 4 px arc length (so dry-brush noise frequency is constant). Pressure profile `smoothstep(0,head,q)*(1-0.7*smoothstep(1-tail,1,q))`.
+- Each bristle is one continuous polyline with butt caps, broken where `noise(k*1.9, i*0.09)` is below `dry*q^1.2*0.95+0.05`. Segment-by-segment strokes leave knots.
+- Washes: draw shape on scratch canvas, multiply twice (outer halo blur, inner body blur), grow 0 to 1 over lt.
+
+## Watch out
+- Current weak spot: figures are not loose enough (review 6/10). Use few strokes and let the wash do the form.
+- Multiply washes are transparent, so lines show through the shapes. Underpaint paper color inside each silhouette first.
+- A pure white first frame fails as a cover. Start with some ink already down.

package/skills/video-studio/references/styles/isometric.md

@@ -0,0 +1,40 @@
+# Isometric Miniature World
+
+- id: `isometric`
+- Source: mg-styles-15 `prompts/03-isometric.md` (MIT, Vincentwei1021)
+- Best for: tech architecture animation, app feature demos, data campus, smart-city or cloud infrastructure explainers
+- Not for: character drama, organic subjects, anything needing perspective depth
+- Triggers: isometric, 2.5D, iso, miniature city, low poly diorama, architecture diagram animation, tech campus, Dribbble hero, School of Motion
+- Tone cell: kinetic-soft
+- Clock: smooth 30 fps
+
+## Look
+True isometric projection: orthographic, 35.264 degree elevation, 45 degree azimuth, no vanishing point, lines everywhere to scale. Pastel studio palette: lavender ground, mint, peach, sky blue, white. Soft shadows and ambient occlusion so it reads as a premium hero render. Title text lies ON the iso plane, skewed into iso space. Floating island in a pastel void for the end.
+
+## Motion
+Ground tiles flip or drop in as a wave from the centre, tiny bounce each. Buildings grow: base lands, walls scaleY from 0 with overshoot, roof cap 2-3 frames later. Trees pop, windows light in sequence. Life layer: cars loop roads, a train, drones carrying packets, glowing data streams pulse between buildings, a wind turbine spins. Camera is a parallel slide only, no rotation, with 1 : 0.8 : 0.6 parallax between foreground, middle, back layers. Pull-back to reveal the whole island.
+
+## Signature features (judged against these)
+- Orthographic 30 degree iso angle, no perspective convergence.
+- Miniature scene with many small readable objects.
+- Building growth: base first, walls scaleY with overshoot, roof 2-3 frames late.
+- Tiles arrive as a radial wave from the centre.
+- Camera moves by parallel translation only, parallax 1 : 0.8 : 0.6.
+- Pastel palette, soft shadow and AO.
+- Moving objects stay on the iso grid at 2:1 pixel slope.
+- Title set in iso space.
+
+## 10-second beat seed
+- 0-2s: tile wave from centre; hook is the first ripple at frame 0.
+- 2-5s: buildings grow, trees pop, windows light.
+- 5-8s (hero at 60-75%): cars, train, drones, data streams, turbine; parallel camera slide.
+- 8-10s: pull back to the floating island, title on the plane, hold with idling motion.
+
+## Sound
+Bright plucky tech melody (FM marimba or pluck). Soft click or pop on each tile and building landing. Airy whoosh on the pull-back.
+
+## Build it in HyperFrames
+Three.js with OrthographicCamera at the true iso angle, soft shadows and a cheap AO (baked or SSAO), stepped per frame from t. Alternative: SVG faces built with the SSR matrix (scale Y 86.6%, skew 30 degrees, rotate 30 degrees) for top, left and right faces, z-ordered by screen y. Text as a CSS-transformed element or a plane in the scene.
+
+## Watch out
+Any perspective camera breaks the style. Z-sorting errors in the SVG route. Do not rotate the camera. Keep object count high enough to feel dense but each one readable.

package/skills/video-studio/references/styles/keynote-ui.md

@@ -0,0 +1,59 @@
+# Product Keynote Screens
+
+- id: `keynote-ui`
+- Source: huashu-art-motion `references/动画语法/t2_keynote_ui.md` (MIT)
+- Best for: product or feature launches, release notes, "three new features", pricing and spec reveals, UI walkthrough steps. 30-90s, voiceover made of nouns and numbers.
+- Not for: explaining how something works (use a morphing style), data trends, bad news or serious events, topics with no product or object to enlarge.
+- Triggers: apple keynote, apple event, product launch video, linear, stripe, openai launch, release video, feature announcement, glass card, ui walkthrough, screen recording explainer
+- Tone cell: calm-sharp
+- Clock: smooth 30/60 fps
+
+## Look
+- Start from the real thing: a screenshot, screen recording or product photo goes full frame (at least 80% of width, 90% on vertical) and is pushed in to the part being discussed. Do not crop key UI.
+- Background near-black: `#050508`, or `#08090a` with text `#f7f8f8`. Take the product's own brand color for accents, not a default purple-blue.
+- Text: primary `#f5f5f7`, secondary white at 60%, eyebrow `#a7a7b4` with +6px tracking.
+- Type: Inter (or a similar neutral grotesque). Headings weight 600, large sizes tightened to -0.02em to -0.03em at 64px and up.
+- Optional wrappers, pick two at most per video: blurred color blobs, frosted glass cards, gradient text, blur-in text, floating. All five together reads as an AI template.
+- Glass card, if used: blur 40px, 7.5% white fill, 14% top light band, 1.5px gradient border, shadow blur 70-80 with y +30-40 at alpha 0.5. Radius 36px, inner radius = outer minus padding (22px). Glass needs colorful content behind it.
+- Shapes: rounded rectangles, capsules, thin round-cap line icons.
+
+## Motion
+- Springs are the main tool, defined by duration and bounce. Default bounce 0, entrances 0.15 to 0.3, never above 0.4. Card entrance duration 0.75s, small bubble 0.5s.
+- Non-spring curves: `cubic-bezier(.25,.1,.25,1)` for text reveals, `cubic-bezier(.4,0,.6,1)` for nav moves at 0.32s, Stripe-like `(.2,1,.2,1)` under 500ms.
+- Text enters: blur 18-26px to 0, rise 16-40px, opacity 0 to 1, 0.7-1.0s. Eyebrow, name, subtitle stagger 0.2-0.4s. Do this only on some screens.
+- Card entrance (no screenshot): from 170px below, rotate about 31 degrees around Y facing outward, scale 0.9 to 1, 0.1s stagger.
+- Camera: still after settle. Slow push about 0.9s to the area being discussed, 0.7s to move to the next area. Fast push 0.28s only for a reveal or comparison. Number or big word slams in 0.17s (1.55 to 0.94 to 1.0).
+- Count-up: 0.9s, ease-out-expo, tabular digits, counted once only.
+
+## Signature features (judged against these)
+- One idea per screen: one noun, one number, or one screenshot.
+- Real screenshot or product is the hero at 80% width or more and gets zoomed to a detail.
+- Large headings visibly tightened, no loose tracking at 64px+.
+- Spring bounce 0 to 0.3, never wobbly.
+- Numbers settle on the exact spoken moment and are counted once.
+- After a settle nothing floats and nothing creeps. Next motion happens at the next noun.
+- Layout changes every screen (title, screenshot zoom, big number, comparison), no title-three-cards loop.
+- Accent color comes from the product, not a default blue-violet.
+
+## Beat pattern (30-60s)
+- 0-3s: product on screen first, name rises 0.2-0.3s before the voice says it.
+- Next 15-25s: screenshot beats. Full-frame, push to detail on the spoken noun, glide to the next area, pull back out.
+- 50-70%: hero reveal. Two timings or two screenshots compared, then the ratio slams in over the screenshot, dimmed.
+- Insert one empty or quiet screen after a dense run.
+- Last 3-5s: closing name or single line, hold 0.6s or more.
+
+## Sound
+Clean minimal electronic or soft piano, 90-110 BPM or no beat. Soft click on text landing, low thud on a slam, subtle whoosh on a blur push.
+
+## Build it in HyperFrames
+- CSS plus canvas. Screenshot is an image layer with a camera transform (translate and scale) driven by a keyframe table.
+- Blur and spring are pure functions of t. Never read a clock. Seed any grain.
+- Blur push transition: old scene scales to 0.92 with 24px blur and fades, new scene arrives from 1.06 with blur to 1.0, 0.55s. Put a 1.08x heavily blurred copy of the old scene underneath so the edges never show black.
+- Shared-element expand: selected card grows from its rect to full screen with spring duration 0.55 and bounce 0. The new content is opaque on frame one.
+
+## Watch out
+- Glass over a flat dark color is just a grey rectangle.
+- Springs too bouncy, or several groups moving at once.
+- Floating cards and constant slow push were old habits in the source and should not be copied.
+- A count that restarts from 0 after a card expands, or a second copy of the same text during the expand.
+- Bright good-news mood used on serious subject matter.

package/skills/video-studio/references/styles/kinetic-type.md

@@ -0,0 +1,58 @@
+# Beat-Locked Kinetic Type
+
+- id: `kinetic-type`
+- Source: huashu-art-motion `references/动画语法/y5_kinetic_type.md` (MIT)
+- Best for: list openers ("3 stages", "5 reasons"), chapter cards, quotes, one-number-per-shot reveals, intros and conclusions where the structure is the message. 15-45s of type per segment, mixed with evidence shots in longer films.
+- Not for: stories and emotion (no face to relate to), long explanatory voiceover on a screen of words, lists over 5 items, anything that is all type for more than 30-60s.
+- Triggers: kinetic typography, lyric video, text animation, saul bass, typographic video, animated quote, title sequence, big word slam, text reveal, after effects type
+- Tone cell: kinetic-sharp
+- Clock: smooth 30/60 fps, with all landings on a beat grid (for example 120 BPM)
+
+## Look
+- One main word per screen, left-aligned in the left third to half (or mirrored), helper line right under it, a small label top left with a progress track, and an evidence object on the other side (code card, chat bubble, checklist). At least 130px margin.
+- Type scale about 3.4 : 1 : 0.4. Demo: main word 340px (heavy black weight), helper line 96px (heavy), label 40px (bold, 6px tracking). The main word is two words or four characters at most so it reads in 0.3s. Helper line 14 characters or fewer.
+- Each chapter has its own full-screen background color, so color is the chapter number. Demo set: yellow `#FFD23F`, coral `#FF5A36`, navy `#14213D`, off-white `#F4EFE6`, plus ink `#111111` and white. One accent per screen (for example coral circle, yellow highlighter, blue bubble `#3A86FF`, green check `#2BB673`).
+- Shapes: rounded rectangles (card r=26, bubble r=30, keycap r=22), circles for numbers, slanted highlighter blocks (slope 0.18). Dot grid background at 64px spacing, 6-10% opacity. No outlined or shadowed type. Only soft card shadows (8-18%).
+- Giant stage numeral at 900px, 5-13% opacity, bottom right behind everything.
+
+## Motion
+- Main word slam: scale 1.7 to 1, opacity 0 to 1 in the first 0.06s, under-damped spring `1 - e^(-10t) cos(2 pi 2.2 t)`, about 8% overshoot, settles in 0.35s. Title first word also rotates -8 to 0 degrees.
+- Helper line and label rise from a mask under the baseline: from +1.2 text height to 0, expo-out, 0.30-0.35s.
+- Icons, numbers, bubbles, keycaps pop with back-out s=2.6-3.0 (17-20% overshoot), 0.30-0.42s.
+- Cards slide in from 700px sideways or 260px below, 3.4 degree rotation to zero, expo-out 0.40s.
+- Typing 26 characters per second with a 2 Hz cursor. Code completion shows grey text instantly, then turns solid on the Tab press (keycap squash 14%).
+- Highlighter wipes left to right in expo-out 0.30s, 1-3 eighth notes after the word lands. Key word scales to 1.35 on the emphasis beat and stays.
+- Exit faster than entry: expo-in 0.18s, stagger 0.03s, shrink to 0.6, drop 60px, fade.
+- Stagger words by one eighth note (0.25s at 120 BPM).
+- Continuous layer is only camera drift (5px sine, 7s and 2.7s periods, +-0.5 degrees), a beat pulse (1.2% scale on each quarter, decay e^(-25t) about 0.12s), and the dot grid sliding 36px/s. Words never drift or breathe after they land.
+
+## Signature features (judged against these)
+- Main word at least 3:1 against the helper line, one thing entering at a time.
+- Chapter color changes per screen and one accent color on it.
+- Main word slams on a strong beat, small items on eighths.
+- Entry slower than exit, exit under 0.2s.
+- After landing the type is still. Motion lives in camera, beat pulse and background.
+- Every landing is on a beat number or a spoken word. Picture early, never late (at most 1 frame ahead of voice).
+- Never more than 3 same-layout pages in a row, evidence object or number slam breaks them.
+- Transition reveal frame lands on the bar line.
+
+## Beat pattern (30-60s)
+- Use one bar per screen. Per bar: beat 1 main word slams (plus giant numeral), beat 1.5 evidence object, beat 2 helper line rises, beat 3 evidence action, beat 3.5 key word grows with highlighter, beat 4 rest or exit.
+- 120 BPM gives 2s per bar. A 4-bar demo is 8.5s, a 30-60s piece uses 15-30 bars and groups them into chapters.
+- Open with a number slam or a title. Hero moment at 60-75% is the final chapter or a zoom-through transition. Finish with a last-beat hit and hold 0.5s.
+- Hold time: main word of 2 characters at least 0.5s, helper line of 7-8 characters at least 1.0s.
+
+## Sound
+Beat-driven: kick every beat, clap on 2 and 4, hat on offbeats, bass root note per bar at 105-128 BPM (demo 120). Boom on a main word, pop on small items, click on typing, rising pop on checks, riser 0.3s before each transition.
+
+## Build it in HyperFrames
+- Canvas 2D or CSS. Define `beat(n)` and write every cue in beats, not seconds. Segment start = bar line minus reveal point x transition length.
+- Transitions: zoom into a shape (first 55% expo-in to 30x, last 45% expo-out, the shape color becomes the next background), three slanted color bands sweeping with 12% stagger (0.5s), and push (0.35s expo in-out, count its "arrival" at about 90% displacement, p near 0.58, not at p=1).
+- Progress track is drawn from the global timeline as a fixed overlay, not inside each page.
+
+## Watch out
+- All text the same size and moving together.
+- Type that keeps drifting while being read.
+- Animation that lands off the beat grid, or aimed at the transition's first frame instead of the reveal frame. Each stray landing loosens the whole piece.
+- Dense four-pages-in-a-row of the same layout becomes a slideshow.
+- Real lyric videos land about once per beat. Eighth-note density works for a short opener only.

package/skills/video-studio/references/styles/line-art.md

@@ -0,0 +1,41 @@
+# Continuous Line Art
+
+- id: `line-art`
+- Source: mg-styles-15 `prompts/02-line-art.md` (MIT, Vincentwei1021)
+- Best for: luxury, finance, architecture and design-studio brand films, logo animation, monogram reveals
+- Not for: loud, playful, data-dense or colorful content
+- Triggers: line art, one line, single line, continuous line, draw-on, stroke animation, outline, minimal luxury, monoline, logo reveal, architecture film
+- Tone cell: calm-sharp
+- Clock: smooth 30 fps
+
+## Look
+Midnight ground #0B1320 or near-black. One champagne-gold line #E9D7A5, constant 3px (2-4px range) for the whole film, round caps. Softly glowing pen tip leads the draw. Lots of negative space. Optional second color, never more. Thin letter-spaced serif wordmark (for example an invented "ATELIER LINEA"). Older segments dim to about 35% as the camera moves on.
+
+## Motion
+Draw-on by stroke-dashoffset from 100% to 0. Draw speed eases into corners with cubic-bezier(0.65,0,0.35,1), slightly slower at turns. One-stroke narrative: the tail of each figure is the start of the next (seed, sapling, branches become building structure, skyline, horizon lifts and loops into a monogram). Virtual camera follows the pen tip with drift and push, then dollies out at the end to reveal the full drawing as a poster. Line-to-fill moment: the logo fills with gold from its anchor point. Wordmark fades up last.
+
+## Signature features (judged against these)
+- Single monochrome (or two-color) line is the only form language.
+- Line width constant across the film (2-4px), round caps.
+- Continuous path, each figure grows out of the previous one.
+- Draw speed decelerates at corners.
+- Glowing pen tip visible and leading the stroke.
+- Camera follows the tip, final dolly-out reveals the full composition.
+- Line-to-fill conversion on the logo.
+- Old lines dim to about 35%.
+
+## 10-second beat seed
+- 0-1.2s: tip appears and draws a seed, line already moving.
+- 1.2-6s: sapling, branches into building, skyline, horizon; camera tracking.
+- 6-7.5s (hero at 60-75%): horizon lifts into monogram, gold fill sweeps in from anchor.
+- 7.5-8.8s: dolly out to the composed poster, wordmark fades up.
+- 8.8-10s: hold with a slow tip glint or breathing glow.
+
+## Sound
+Minimal felt piano with a soft string swell. Pen-on-paper whisper whose loudness follows tip speed. Delicate chime on the fill.
+
+## Build it in HyperFrames
+Inline SVG paths pre-joined into one path, animated with stroke-dasharray = length and stroke-dashoffset as a function of t (use getTotalLength). Camera is a transform on a parent group, computed from the path point at t (getPointAtLength) with smoothing. Glow with an SVG blur filter on a duplicate stroke. Fill via a clip or mask expanding from the anchor.
+
+## Watch out
+Shimmer on thin lines at 3px: render at 2x supersample. Do not vary line width. Keep the path truly continuous or the idea breaks. Avoid camera jitter from raw tip positions.

package/skills/video-studio/references/styles/liquid.md

@@ -0,0 +1,40 @@
+# Liquid Metaball Motion
+
+- id: `liquid`
+- Source: mg-styles-15 `prompts/07-liquid.md` (MIT, Vincentwei1021)
+- Best for: music video packaging, food and drink ads, logo genesis, transition packs
+- Not for: precise technical content, minimal corporate, long text
+- Triggers: liquid, fluid, metaball, goo, gooey, paint splash, drip, melt, blob, ink flood, liquid transition, logo reveal
+- Tone cell: kinetic-soft
+- Clock: smooth 30 fps
+
+## Look
+Deep plum ground. Glossy candy liquid going hot orange to pink to violet, with specular highlights and fresnel rim so it reads as thick 3D liquid, not flat blobs. Organic curves, never straight lines. Wordmark (invented, for example "FLUX") formed from the liquid, blended with metaballs.
+
+## Motion
+Flung, never uniform: cubic-bezier(0.22,1,0.36,1). Droplets fall and splash, flat squash on landing. Blobs fuse with stretched necks that snap, both ends rebound 2-3 frames. Secondary droplets follow the main body 2-3 frames late. A big liquid wave floods the frame as the transition, with a wavy front carrying 3-5 phase-offset bulges. Liquid coalesces into the wordmark. Last drip falls from the logo and ripples.
+
+## Signature features (judged against these)
+- Metaball fusion with visible stretched necks and snap.
+- Wavy flood transition with 3-5 phase-offset bulges.
+- Secondary droplets lag the body by 2-3 frames.
+- Rebound of 2-3 frames at the snap.
+- Fake 3D lighting: specular and fresnel rim, not flat fills.
+- Ease is fast-out slow-in, never constant speed.
+- Wordmark formed from liquid, final drip and ripple.
+
+## 10-second beat seed
+- 0-2s: droplets fall and splash.
+- 2-4s: blobs merge with stretched necks, snap, rebound.
+- 4-6s: flood wave crosses the frame.
+- 6-8.5s (hero at 60-75%): liquid coalesces into the wordmark.
+- 8.5-10s: last drip, ripple, hold.
+
+## Sound
+Bubbly gloops, pour, splash and drip, deep bass swell under a glossy synth bed.
+
+## Build it in HyperFrames
+WebGL2 fragment shader: sum of 2D SDF circles with smooth-min (polynomial k about 0.2 of radius), normals from the field gradient for fake 3D lighting, text as an SDF texture blended with the same field. Positions come from closed-form springs and splines of t. Cheaper fallback: SVG blur 20px+ then an feColorMatrix alpha threshold for the goo, add highlights as a second pass.
+
+## Watch out
+Flat blob look if lighting is skipped. Necks that never snap read as jelly. Banding in gradients: add 2-3% noise. Keep wave front phase offsets seeded, not random per frame.

package/skills/video-studio/references/styles/math-explainer.md

@@ -0,0 +1,58 @@
+# Morphing Math Explainer
+
+- id: `math-explainer`
+- Source: huashu-art-motion `references/动画语法/t1_3b1b.md` (MIT)
+- Best for: explaining a mechanism step by step (neural net, matrix, gradient descent, probability, algorithm flow), 30-120s with a voiceover made of action sentences.
+- Not for: product launches, brand or mood films, real data trends, opinion or story voiceover, anything under 8s.
+- Triggers: 3blue1brown, 3b1b, manim, math explainer, linear algebra, neural network explainer, gradient descent, black background math, transform animation, equation morph
+- Tone cell: calm-sharp
+- Clock: smooth 30/60 fps
+
+## Look
+- Background pure black `#000000`. Do not use a navy gradient or bloom. The "glow" comes from saturated thin lines on black, with saturation pushed about 1.5x.
+- Palette: blue `#58C4DD`, red `#FC6255`, yellow `#FFFF00`, teal `#5CD0B3`, green `#83C167`, greys `#DDD/#888/#444`. Max 4 semantic colors per video.
+- Color is the concept name. Example: yellow = activation or signal, blue = positive weight, red = negative weight. A symbol in the formula and its object on screen share the color, and it never changes mid-video.
+- Type: serif math face (Computer Modern or CMU Serif look) for formulas, a serif for labels. Title 58px, formula 64px at 1080p.
+- Strokes: default 4px, axes and network edges 2px, grid 2px with 1px sub-grid at 25% opacity. Neuron: white 2px outline, fill opacity equals its value.
+- One main subject per screen, centered or symmetric. Title and formula pinned to the top eighth, never moving with the camera.
+
+## Motion
+- Default easing is the quintic smooth curve 6t^5 - 15t^4 + 10t^3. Linear only for write-on strokes, constant rotation, and signal flashes.
+- Rhythm: one animation runs 1-3s, then the frame holds about 1s. One concept lasts 8-20s.
+- Lagged groups: lag ratio 0.1 for small sets, 0.01 for 100 items (about 1.1s total), 0.006 for 160 edges.
+- Write-on: outline strokes first, then fill fades in over the last 60%. Under 15 glyphs takes 1s, more takes 2s.
+- Transform: resample both shapes to the same point count, align start points, interpolate linearly point by point plus color. Square grid to circles, weights flying to one neuron.
+- Signal: copy the edge, color it yellow at 1.5x width, reveal a moving window along it, stagger rows by 0.04s.
+- Camera: still while waiting. It moves only to look at the next object, one smooth push of about 1s. One fast push (0.28s, 18-32% in) at most once or twice, only when a conclusion lands.
+
+## Signature features (judged against these)
+- Black `#000000` background with no gradient and no bloom.
+- Each shot states "what becomes what", and the first frame already shows an object, not a title.
+- No more than 2 text points on screen at once, and none appears as a bullet list.
+- One color per concept, 4 semantic colors or fewer, formula symbols matching object colors.
+- Concepts connect by morph, not by cut. The last frame of one shot equals the first frame of the next.
+- Holds are truly still: no slow drift, breathing, or floating.
+- Each animation matches a verb in the voiceover, then waits about 1s.
+- A number counts up with the fill, never before the picture shows it.
+
+## Beat pattern (30-60s)
+- 0-3s: first frame is the object (grid, curve, pixels). Question title writes on after it appears.
+- Every 8-15s: one concept. Voice says the verb, one Transform plays, then 1s hold.
+- Middle: color legend appears the first time a color means something, and stays.
+- 60-75%: hero moment. Camera pushes through or into the key object (for example the one neuron that matters), preceded by a 0.3s yellow outline.
+- Last 6-8s: result settles, number counts to its final value, hold 0.6s or more. Legend remains to the end.
+
+## Sound
+Soft ambient pad or sparse piano, no beat. Quiet pen or tick on write-on, low pop on Transform landing. Voiceover leads, music 15-20 dB below.
+
+## Build it in HyperFrames
+- Canvas 2D or SVG. Every frame is a pure function of t. Write-on is a dash-offset driven by progress.
+- Morph with arrays of points: sample each shape to N points, lerp by smooth(p). Seed any layout noise.
+- Camera is a keyframe table (hold, push, hold). Zoom through an opening with log interpolation: zoom = Z^e, with Z at least 1100 / object radius so the opening covers the screen.
+- Lay out the formula once with per-token colors, then replace tokens by name between formulas.
+
+## Watch out
+- Adding glow or a navy gradient turns it into a "tech slide".
+- Using ease or linear everywhere and packing animations too fast. 8 seconds with 5 concepts is the upper limit, real use should be 2-3x slower.
+- Color meaning changing mid-video, or more than 4 colors.
+- Logic errors: connecting an output neuron to pixels when it connects to the hidden layer. Check the diagram against the claim.