primocode 10.17.1 → 11.0.0

package/vendor/motioncraft/assets/template/src/lib/format.mjs

@@ -0,0 +1,28 @@
+// Shared output geometry. Insets are conservative starting points, not platform guarantees:
+// app chrome moves with device, caption length, and account settings.
+export const FORMATS = Object.freeze({
+  '16:9': {width: 1920, height: 1080, platform: 'wide'},
+  '1:1': {width: 1080, height: 1080, platform: 'ig-feed'},
+  '4:5': {width: 1080, height: 1350, platform: 'ig-feed'},
+  '9:16': {width: 1080, height: 1920, platform: 'tiktok'},
+});
+export const PLATFORMS = ['wide','ig-feed', 'reels', 'tiktok'];
+export function geometry(format = '16:9', platform) {
+  const base = FORMATS[format];
+  if (!base) throw new Error(`Unknown format ${format}. Use 16:9, 1:1, 4:5 or 9:16.`);
+  const target = platform || base.platform;
+  if (!PLATFORMS.includes(target)) throw new Error(`Unknown platform ${target}`);
+  if(target==='wide' && format!=='16:9') throw new Error('wide requires 16:9');
+  if(target!=='wide' && format==='16:9') throw new Error('16:9 requires wide');
+  if (target !== 'ig-feed' && target!=='wide' && format !== '9:16') throw new Error(`${target} requires 9:16`);
+  const {width:w,height:h} = base;
+  // Left, right, top, bottom pixel insets. Keep copy out of common app overlays.
+  const insets = target==='wide' ? {left:96,right:96,top:72,bottom:72} : target === 'tiktok' ? {left:72,right:175,top:210,bottom:350} :
+    target === 'reels' ? {left:72,right:175,top:190,bottom:340} :
+    format === '4:5' ? {left:72,right:72,top:100,bottom:135} :
+    {left:72,right:72,top:96,bottom:115};
+  const safe = {x:insets.left,y:insets.top,width:w-insets.left-insets.right,height:h-insets.top-insets.bottom};
+  return {format,platform:target,width:w,height:h,insets,safe,
+    // Three non-overlapping regions inside the safe content rect.
+    zones:{top:[0,.26],center:[.27,.78],bottom:[.79,1]}};
+}

package/vendor/motioncraft/assets/template/src/lib/timeline.ts

@@ -0,0 +1,29 @@
+// Reads public/timeline.json (built by `motioncraft timeline build`).
+// words: VO words with start/end seconds. beats: beat times. scenes: scene windows. events: named moments.
+import {staticFile, delayRender, continueRender} from 'remotion';
+import {useEffect, useState} from 'react';
+import {FPS} from './tokens';
+export type TLWord = {w: string; start: number; end: number};
+export type Timeline = {duration: number; bpm?: number; words: TLWord[]; beats: number[]; scenes: {id: string; start: number; end: number}[]; events: {id: string; t: number}[]};
+export const useTimeline = (file = 'timeline.json') => {
+  const [tl, setTl] = useState<Timeline | null>(null);
+  const [h] = useState(() => delayRender('timeline'));
+  useEffect(() => {
+    fetch(staticFile(file)).then((r) => r.json()).then((j) => { setTl(j); continueRender(h); }).catch(() => { setTl({duration: 20, words: [], beats: [], scenes: [], events: []}); continueRender(h); });
+  }, [file, h]);
+  return tl;
+};
+// Frame where the n-th occurrence of a word starts (case-insensitive). Text appears 2 frames early: eyes lead ears.
+export const wordAt = (tl: Timeline | null, word: string, nth = 0, lead = 2): number => {
+  if (!tl) return 0;
+  const hits = tl.words.filter((x) => x.w.toLowerCase().replace(/[^\p{L}\p{N}]/gu, '') === word.toLowerCase());
+  const w = hits[nth]; return w ? Math.max(0, Math.round(w.start * FPS) - lead) : 0;
+};
+export const eventAt = (tl: Timeline | null, id: string) => { const e = tl?.events.find((x) => x.id === id); return e ? Math.round(e.t * FPS) : 0; };
+// snap a frame to the nearest beat if within maxMs
+export const snapToBeat = (tl: Timeline | null, frame: number, maxMs = 80) => {
+  if (!tl?.beats?.length) return frame;
+  const t = frame / FPS; let best = tl.beats[0];
+  for (const b of tl.beats) if (Math.abs(b - t) < Math.abs(best - t)) best = b;
+  return Math.abs(best - t) * 1000 <= maxMs ? Math.round(best * FPS) : frame;
+};

package/vendor/motioncraft/assets/template/src/lib/tokens.ts

@@ -0,0 +1,9 @@
+// Every visual number comes from here. Change the style by swapping style.json, not by editing components.
+import './fonts';
+import style from '../style.json';
+export const S = style;
+export const C = style.color;
+export const FONT = `"${style.font.display}", sans-serif`;
+export const MONO = `"${style.font.mono}", monospace`;
+export const W = style.canvas.width, H = style.canvas.height, FPS = style.canvas.fps;
+export const SAFE = style.layout.safe;

package/vendor/motioncraft/assets/template/src/scenes/Example.tsx

@@ -0,0 +1,76 @@
+// Example video (~20 s) that shows every core pattern. Copy a scene, change the words, keep the numbers.
+import React from 'react';
+import {AbsoluteFill, Audio, staticFile, useCurrentFrame} from 'remotion';
+import {Background, Scene, Camera, Center, Zone} from '../components/Stage';
+import {Headline, words} from '../components/Headline';
+import {Strike, Card, Pill, CheckItem, StepCards, Callout, Credit, Counter} from '../components/UI';
+import {FloatingShapes} from '../components/Three';
+import {EndCard} from '../components/EndCard';
+import {sec} from '../lib/anim';
+import {nearestBeatFrame} from '../lib/beat';
+import {MorphTransition} from '../components/MorphTransition';
+import {FormatCtx, Format, Platform} from '../lib/format-context';
+import {geometry} from '../lib/format.mjs';
+import {DebugCtx} from '../lib/debug';
+
+export type MainProps = {handle: string; audio?: string; beats?: number[]; mcDebug?: boolean; format?:Format;platform?:Platform};
+
+export const Main: React.FC<MainProps> = ({handle, audio, beats = [], mcDebug = false,format='16:9',platform='wide'}) => {
+  const f = useCurrentFrame();
+  return <FormatCtx.Provider value={{format,platform}}><DebugCtx.Provider value={mcDebug}>
+    <AbsoluteFill>
+      {!mcDebug && <Background />}
+      {mcDebug && <AbsoluteFill style={{background: '#fff'}} />}
+      <Camera keys={[[0, 1.04, 0, 0], [sec(4), 1, 0, 0], [sec(9), 1.03, 0, -6], [sec(12), 1, 0, 0]]}>
+        {/* 1. Hook: 3D objects + short line */}
+        <Scene from={0} to={sec(3.4)} noIn>
+          {!mcDebug && <AbsoluteFill style={{opacity: 0.9}}><FloatingShapes at={nearestBeatFrame(0, beats)} beats={beats} /></AbsoluteFill>}
+          <Center><Headline level="h1" items={words('Make videos like *this.*', nearestBeatFrame(8, beats))} /></Center>
+        </Scene>
+        {/* 2. Reframe: "Not X. Y." */}
+        <Scene from={sec(3.4)} to={sec(7.6)}>
+          <Center gap={10}>
+            <div style={{display:'flex',alignItems:'center',justifyContent:'center',flexWrap:'wrap',gap:12}}>
+              <Headline level="h2" items={words('The secret is not', sec(3.6))} />
+              <Strike at={sec(4.4)} appear={sec(4.0)} word="prompts." size={46} />
+            </div>
+            <Headline level="h0" items={words('*References.*', sec(4.8))} />
+          </Center>
+        </Scene>
+        {/* 3. Proof: card + checklist, headline in its own zone */}
+        <Scene from={sec(7.6)} to={sec(12)}>
+          <Zone name="top"><Headline level="h1" size={64} items={words('Give *feedback* until it fits', sec(7.8))} /></Zone>
+          <Zone name="center" style={{gap:format==='9:16'?18:12,flexDirection:format==='9:16'?'column':'row'}}>
+            <Card at={sec(8.2)} w={format==='9:16'?620:430} h={format==='9:16'?340:250} title="preview">
+              <div style={{height:'100%',display:'grid',placeItems:'center'}}><Counter at={nearestBeatFrame(sec(8.6), beats)} to={30} suffix=" fps" size={format==='9:16'?100:70} /></div>
+            </Card>
+            <div style={{display: 'flex', flexDirection: 'column', gap: 16}}>
+              <CheckItem at={sec(9)} done={sec(10)} text="font too big" />
+              <CheckItem at={sec(9.4)} done={sec(10.4)} text="music too loud" />
+              <CheckItem at={sec(9.8)} done={sec(10.8)} text="motion not smooth" />
+            </div>
+          </Zone>
+          <Credit at={sec(8.4)}>Example data</Credit>
+        </Scene>
+        {/* 4. Formula */}
+        <Scene from={sec(12)} to={sec(15.2)}>
+          <Zone name="top"><Headline level="h1" size={64} items={words('The formula', sec(12.2))} /></Zone>
+          <Zone name="center"><StepCards at={sec(12.6)} steps={['Reference', 'Break down', 'Feedback']} vertical={format!=='9:16'} /></Zone>
+        </Scene>
+        {/* 5. CTA */}
+        <Scene from={sec(15.2)} to={sec(17.6)}>
+          <Zone name="top"><Headline level="h1" size={64} items={words('Want the full *style?*', sec(15.4))} /></Zone>
+          <Zone name="center"><Callout at={nearestBeatFrame(sec(16), beats)} label="Comment" big="STYLE" note="we send you the file" /></Zone>
+        </Scene>
+        {/* 6. End card */}
+        <Scene from={sec(17.6)} to={sec(30)} noOut>
+          <EndCard at={sec(17.8)} handle={handle} line="Follow for more" />
+        </Scene>
+      </Camera>
+      <MorphTransition at={sec(3.4)-11} holdBefore={10} holdAfter={50}
+        from={{x:.86,y:.24,size:170,points:[[0,-1],[1,0],[0,1],[-1,0]],color:undefined}}
+        to={{x:.76,y:.72,size:110,points:[[-1,-1],[1,-1],[1,1],[-1,1]],color:undefined}} />
+      {audio && !mcDebug && <Audio src={staticFile(audio)} />}
+    </AbsoluteFill>
+  </DebugCtx.Provider></FormatCtx.Provider>;
+};

package/vendor/motioncraft/assets/template/src/scenes/Launch.tsx

@@ -0,0 +1,26 @@
+import React from 'react';
+import {AbsoluteFill,Audio,staticFile} from 'remotion';
+import {Background,Scene,Zone} from '../components/Stage';
+import {Headline,words} from '../components/Headline';
+import {Card,Callout,CheckItem,Frames} from '../components/UI';
+import {S,C,FONT} from '../lib/tokens';
+import {FormatCtx, Format, Platform} from '../lib/format-context';
+import {geometry} from '../lib/format.mjs';
+import {DebugCtx} from '../lib/debug';
+import {sec} from '../lib/anim';
+
+export type LaunchProps={handle:string; product:string; problem:string; feature1:string; feature2:string; cta:string; demoDir?:string; demoCount?:number; demoCredit?:string; duration?:number; audio?:string; mcDebug?:boolean;format?:Format;platform?:Platform};
+export const Launch:React.FC<LaunchProps>=({handle,product,problem,feature1,feature2,cta,demoDir,demoCount=0,demoCredit,duration=45,audio,mcDebug=false,format='16:9',platform='wide'})=>{
+ const g=geometry(format,platform);const cardW=Math.min(g.safe.width-24,format==='9:16'?860:650);const cardH=Math.min(g.safe.height*.46,format==='9:16'?600:390);
+ const realDemo=!!demoDir&&demoCount>0&&!!demoCredit;
+ const cut=(s:number)=>sec(s*duration/45);
+ return <FormatCtx.Provider value={{format,platform}}><DebugCtx.Provider value={mcDebug}><AbsoluteFill>
+ {!mcDebug?<Background/>:<AbsoluteFill style={{background:'#fff'}}/>}
+ <Scene from={0} to={cut(8)} noIn><Zone name="top"><Headline level="h1" items={words(problem,cut(0.6))}/></Zone><Zone name="center"><div style={{fontFamily:FONT,color:C.muted,fontSize:42}}>A problem worth solving</div></Zone></Scene>
+ <Scene from={cut(8)} to={cut(27)}><Zone name="top"><Headline level="h1" items={words(`${product} in action`,cut(8.2))}/></Zone><Zone name="center"><Card at={cut(8.5)} w={cardW} h={cardH} title={product}>
+ {realDemo?<Frames dir={demoDir!} count={demoCount} at={cut(9)} fps={30*45/duration} w={cardW} h={cardH-48}/>:<div style={{height:'100%',display:'grid',placeItems:'center',fontFamily:FONT,color:C.danger,fontSize:40,textAlign:'center',padding:40}}>REPLACE WITH REAL DEMO FRAMES<br/>Add demoDir, demoCount and demoCredit</div>}
+ </Card></Zone><div style={{position:'absolute',left:g.safe.x,bottom:g.insets.bottom+10,fontFamily:FONT,fontSize:24,color:C.muted}}>{realDemo?`Demo source: ${demoCredit}`:'DEMO NOT VERIFIED - DO NOT PUBLISH'}</div></Scene>
+ <Scene from={cut(27)} to={cut(39)}><Zone name="top"><Headline level="h1" items={words('What changes',cut(27.2))}/></Zone><Zone name="center" style={{flexDirection:'column',gap:24}}><CheckItem at={cut(28)} text={feature1} size={36}/><CheckItem at={cut(30)} text={feature2} size={36}/></Zone></Scene>
+ <Scene from={cut(39)} to={cut(45)} noOut><Zone name="top"><Headline level="h1" items={words('Try it yourself',cut(39.2))}/></Zone><Zone name="center"><Callout at={cut(40)} label="Next step" big={cta}/></Zone><div style={{position:'absolute',bottom:g.insets.bottom+10,right:g.insets.right+12,fontFamily:FONT,fontSize:25,color:C.muted}}>{handle}</div></Scene>
+ {audio&&!mcDebug&&<Audio src={staticFile(audio)}/>}</AbsoluteFill></DebugCtx.Provider></FormatCtx.Provider>;
+};

package/vendor/motioncraft/assets/template/src/scenes/TimelineLegacy.tsx

@@ -0,0 +1,24 @@
+import React from 'react';
+import {AbsoluteFill,Sequence,useCurrentFrame} from 'remotion';
+import {Main,MainProps} from './Example';
+import {Launch,LaunchProps} from './Launch';
+import {Tutorial,TutorialProps} from './Tutorial';
+
+export type LegacyScene={id:string;fromFrame:number;toFrame:number;sourceFromFrame:number;sourceToFrame:number};
+export type LegacyBoard={duration:number;fps:number;scenes:LegacyScene[]};
+export type LegacyProps={timeline?:LegacyBoard;audio?:string};
+const Slice:React.FC<{scene:LegacyScene;kind:'main'|'launch'|'tutorial';props:MainProps&LaunchProps&TutorialProps}>=({scene,kind,props})=>{
+ const local=useCurrentFrame(),target=scene.toFrame-scene.fromFrame,source=scene.sourceToFrame-scene.sourceFromFrame;
+ const at=scene.sourceFromFrame+Math.min(source-1,Math.floor(local*source/target));
+ // Offset the nested sequence so every legacy component sees the mapped source frame.
+ // Freeze alone does not override the frame seen through Sequence in all versions.
+ const clean={...props,audio:undefined};
+ return <Sequence from={local-at} durationInFrames={1800+at} layout="none">{kind==='main'?<Main {...clean}/>:kind==='launch'?<Launch {...clean}/>:<Tutorial {...clean}/>}</Sequence>;
+};
+export const TimelineLegacy:React.FC<LegacyProps&Record<string,unknown>&{kind:'main'|'launch'|'tutorial'}>=({timeline,kind,...rest})=>{
+ if(!timeline)return kind==='main'?<Main {...rest as MainProps}/>:kind==='launch'?<Launch {...rest as LaunchProps}/>:<Tutorial {...rest as TutorialProps}/>;
+ // Audio must be re-timed with `timeline audio` and supplied to render separately.
+ // Never silently keep the old full-composition audio while shots are reordered.
+ const props=rest as MainProps&LaunchProps&TutorialProps;
+ return <AbsoluteFill>{timeline.scenes.map(s=><Sequence key={s.id} from={s.fromFrame} durationInFrames={s.toFrame-s.fromFrame} layout="none"><Slice scene={s} kind={kind} props={props}/></Sequence>)}</AbsoluteFill>;
+};

package/vendor/motioncraft/assets/template/src/scenes/TimelineVideo.tsx

@@ -0,0 +1,49 @@
+import React from 'react';
+import {AbsoluteFill,Audio,Sequence,staticFile,useCurrentFrame} from 'remotion';
+import {Background,Zone} from '../components/Stage';
+import {Headline,words} from '../components/Headline';
+import {Card,Callout,CheckItem,Frames} from '../components/UI';
+import {C,FONT} from '../lib/tokens';
+import {FormatCtx,Format,Platform} from '../lib/format-context';
+import {geometry} from '../lib/format.mjs';
+import {DebugCtx} from '../lib/debug';
+import {beatAccent, nearestBeatFrame} from '../lib/beat';
+
+export type TimelineScene={id:string;role:string;headline?:string;fromFrame:number;toFrame:number;start:number;end:number};
+export type TimelineBoard={fps:number;duration:number;scenes:TimelineScene[]};
+export type TimelineProps={timeline?:TimelineBoard;beats?:number[];format?:Format;platform?:Platform;audio?:string;mcDebug?:boolean;handle?:string;product?:string;problem?:string;feature1?:string;feature2?:string;cta?:string;demoDir?:string;demoCount?:number;demoCredit?:string;title?:string;captureDir?:string;captureCount?:number;sourceCredit?:string};
+const defaultLaunch:TimelineBoard={fps:30,duration:45,scenes:[
+ {id:'problem',role:'problem',headline:'A real problem',fromFrame:0,toFrame:240,start:0,end:8},
+ {id:'demo',role:'demo',headline:'Product in action',fromFrame:240,toFrame:810,start:8,end:27},
+ {id:'features',role:'features',headline:'What changes',fromFrame:810,toFrame:1170,start:27,end:39},
+ {id:'cta',role:'cta',headline:'Try it yourself',fromFrame:1170,toFrame:1350,start:39,end:45}]};
+const defaultTutorial:TimelineBoard={fps:30,duration:30,scenes:[
+ {id:'intro',role:'intro',headline:'A clear tutorial',fromFrame:0,toFrame:150,start:0,end:5},
+ {id:'step-1',role:'step',headline:'Open',fromFrame:150,toFrame:450,start:5,end:15},
+ {id:'step-2',role:'step',headline:'Choose',fromFrame:450,toFrame:750,start:15,end:25},
+ {id:'outro',role:'outro',headline:'Review',fromFrame:750,toFrame:900,start:25,end:30}]};
+export const timelineDefaults={launch:defaultLaunch,tutorial:defaultTutorial};
+const Beat:React.FC<{beats:number[];start:number;fps:number}>=({beats,start,fps})=>{const f=useCurrentFrame();const hit=beats.some(b=>{const d=f-Math.round((b-start)*fps);return d>=0&&d<5});return <div data-beat="marker" style={{position:'absolute',right:30,top:30,width:16,height:16,borderRadius:16,background:C.accent,opacity:hit?1:.12,transform:`scale(${beatAccent(f+Math.round(start*fps),beats) * (hit?1.5:1)})`}}/>};
+const SceneBody:React.FC<{s:TimelineScene;p:TimelineProps;kind:'launch'|'tutorial';beats:number[];fps:number}>=({s,p,kind,beats,fps})=>{
+ const f=useCurrentFrame(),g=geometry(p.format,p.platform),duration=s.toFrame-s.fromFrame;
+ const name=s.headline || (s.role==='problem'?p.problem:s.role==='demo'?`${p.product||'Product'} in action`:s.role==='intro'?p.title:s.role==='cta'?p.cta:s.role);
+ const demo=kind==='launch'?p.demoDir:p.captureDir,count=kind==='launch'?p.demoCount:p.captureCount,credit=kind==='launch'?p.demoCredit:p.sourceCredit;
+ const ready=!!demo&&!!count&&!!credit;
+ return <AbsoluteFill data-scene={s.id} style={{fontFamily:FONT}}>
+ <Zone name="top"><Headline level="h1" items={words(name||s.role,nearestBeatFrame(s.fromFrame+Math.min(8,Math.round(duration*.06)),beats)-s.fromFrame)}/></Zone>
+ <Zone name="center">
+ {(s.role==='demo'||s.role==='step')?<Card at={nearestBeatFrame(s.fromFrame+6,beats)-s.fromFrame} w={Math.min(g.safe.width*.86,820)} h={Math.min(g.safe.height*.47,540)} title={kind==='launch'?(p.product||'Demo'):'Screen capture'}>
+ {ready?<Frames dir={demo!} count={count!} at={0} fps={30} w={Math.min(g.safe.width*.86,820)} h={Math.min(g.safe.height*.47,540)-48}/>:<div style={{padding:30,fontSize:30,color:C.danger}}>REAL FOOTAGE REQUIRED - DO NOT PUBLISH</div>}
+ </Card>:s.role==='features'?<div style={{display:'flex',flexDirection:'column',gap:25}}><CheckItem at={8} text={p.feature1||'Verified feature one'} size={32}/><CheckItem at={25} text={p.feature2||'Verified feature two'} size={32}/></div>:s.role==='cta'||s.role==='outro'?<Callout at={nearestBeatFrame(s.fromFrame+8,beats)-s.fromFrame} label="Next step" big={p.cta||'Try it'} />:<div style={{fontSize:36,color:C.muted,textAlign:'center'}}>{kind==='tutorial'?'Watch the steps':'A problem worth solving'}</div>}
+ </Zone><div style={{position:'absolute',left:g.safe.x,bottom:g.insets.bottom+12,color:C.muted,fontSize:20}}>{ready&&['demo','step'].includes(s.role)?`Source: ${credit}`:p.handle||''}</div><Beat beats={beats} start={s.start} fps={fps}/>
+ </AbsoluteFill>;
+};
+export const TimelineVideo:React.FC<TimelineProps&{kind:'launch'|'tutorial'}>=p=>{
+ const {kind,timeline,beats=[],mcDebug=false,format=kind==='launch'?'16:9':'9:16',platform=kind==='launch'?'wide':'tiktok'}=p;
+ const board=timeline||timelineDefaults[kind];
+ return <FormatCtx.Provider value={{format,platform}}><DebugCtx.Provider value={mcDebug}><AbsoluteFill>
+ {!mcDebug?<Background/>:<AbsoluteFill style={{background:'#fff'}}/>}
+ {board.scenes.map(s=><Sequence key={s.id} from={s.fromFrame} durationInFrames={s.toFrame-s.fromFrame} layout="none"><SceneBody s={s} p={{...p,format,platform}} kind={kind} beats={beats} fps={board.fps}/></Sequence>)}
+ {p.audio&&!mcDebug&&<Audio src={staticFile(p.audio)}/>}
+ </AbsoluteFill></DebugCtx.Provider></FormatCtx.Provider>;
+};

package/vendor/motioncraft/assets/template/src/scenes/Tutorial.tsx

@@ -0,0 +1,37 @@
+import React from 'react';
+import {AbsoluteFill,Audio,Img,interpolate,staticFile,useCurrentFrame} from 'remotion';
+import {Background} from '../components/Stage';
+import {S,C,FONT} from '../lib/tokens';
+import {cl,easeInOut,sec} from '../lib/anim';
+import {FormatCtx, Format, Platform} from '../lib/format-context';
+import {geometry} from '../lib/format.mjs';
+import {McBox,DebugCtx} from '../lib/debug';
+
+export type TutorialStep={title:string; caption:string; from:number; to:number; x:number; y:number; zoom?:number};
+export type TutorialProps={handle:string; title:string; captureDir?:string; captureCount?:number; captureFps?:number; sourceCredit?:string; steps:TutorialStep[]; duration?:number; audio?:string; mcDebug?:boolean;format?:Format;platform?:Platform};
+export const Tutorial:React.FC<TutorialProps>=({handle,title,captureDir,captureCount=0,captureFps=30,sourceCredit,steps,audio,mcDebug=false,format='9:16',platform='tiktok'})=>{
+ const f=useCurrentFrame();const g=geometry(format,platform);const sx=g.safe.x,sy=g.safe.y,sw=g.safe.width,sh=g.safe.height;
+ const active=steps.find(s=>f>=sec(s.from)&&f<sec(s.to))||steps[steps.length-1];
+ const ready=!!captureDir&&captureCount>0&&!!sourceCredit;
+ const t=active?Math.min(1,Math.max(0,(f-sec(active.from))/12)):0;
+ const z=active?1+(Math.min(1.6,Math.max(1,active.zoom||1.24))-1)*interpolate(t,[0,1],[0,1],{...cl,easing:easeInOut}):1;
+ const px=active?Math.min(.88,Math.max(.12,active.x)):.5,py=active?Math.min(.85,Math.max(.12,active.y)):.5;
+ const panX=active?interpolate(t,[0,1],[.5,px],{...cl,easing:easeInOut}):.5;
+ const panY=active?interpolate(t,[0,1],[.5,py],{...cl,easing:easeInOut}):.5;
+ const idx=Math.max(0,Math.min(captureCount-1,Math.floor(f*captureFps/30)));
+ return <FormatCtx.Provider value={{format,platform}}><DebugCtx.Provider value={mcDebug}><AbsoluteFill>
+ {!mcDebug?<Background/>:<AbsoluteFill style={{background:'#fff'}}/>}
+ <div style={{position:'absolute',top:sy,left:sx,width:sw,fontFamily:FONT,fontSize:format==='9:16'?52:40,fontWeight:700,color:C.ink,lineHeight:1.1}}><McBox kind="text">{title}</McBox></div>
+ <div style={{position:'absolute',top:sy+sh*.19,left:sx,width:sw,height:sh*.50,borderRadius:28,overflow:'hidden',background:C.card,border:`2px solid ${C.cardBorder}`,boxShadow:S.shape.shadow}}>
+  <div style={{position:'absolute',inset:0,transform:`scale(${z})`,transformOrigin:`${panX*100}% ${panY*100}%`}}>
+   {ready?<Img src={staticFile(`${captureDir}/${String(idx+1).padStart(3,'0')}.jpg`)} style={{width:'100%',height:'100%',objectFit:'contain'}}/>:<div style={{display:'grid',placeItems:'center',height:'100%',fontFamily:FONT,fontSize:32,color:C.danger,textAlign:'center',padding:70,overflowWrap:'anywhere'}}>SCREEN RECORDING NEEDED<br/>Add recording, frame count and source credit</div>}
+  </div>
+  {ready&&active&&<div style={{position:'absolute',left:`${(px*z+(1-z)*panX)*100}%`,top:`${(py*z+(1-z)*panY)*100}%`,width:76,height:76,border:`6px solid ${C.accent}`,borderRadius:'50%',boxShadow:'0 0 0 12px rgba(43,127,212,.2)',transform:'translate(-50%,-50%)',pointerEvents:'none'}}/>}
+ </div>
+ {/* Bottom captions are outside the capture viewport; they never hide UI controls. */}
+ <div style={{position:'absolute',top:sy+sh*.72,left:sx,width:sw,height:sh*.21,display:'flex',flexDirection:'column',justifyContent:'center',gap:18}}>
+ {active&&<><McBox kind="text" style={{fontFamily:FONT,fontSize:format==='9:16'?40:30,fontWeight:700,color:C.accent}}>STEP {steps.indexOf(active)+1}: {active.title}</McBox><McBox kind="text" style={{fontFamily:FONT,fontSize:format==='9:16'?32:25,color:C.ink,lineHeight:1.3}}>{active.caption}</McBox></>}
+ </div>
+ <div style={{position:'absolute',bottom:g.insets.bottom+12,left:sx,width:sw,fontFamily:FONT,fontSize:22,color:C.muted,display:'flex',justifyContent:'space-between'}}><span>{ready?`Capture: ${sourceCredit}`:'CAPTURE NOT VERIFIED - DO NOT PUBLISH'}</span><span>{handle}</span></div>
+ {audio&&!mcDebug&&<Audio src={staticFile(audio)}/>}</AbsoluteFill></DebugCtx.Provider></FormatCtx.Provider>;
+};

package/vendor/motioncraft/assets/template/src/style.json

@@ -0,0 +1,62 @@
+{
+  "name": "pi-v2",
+  "description": "Clean, bright, airy. Blue-white background, one blue accent, words that come alive from blur, real 3D, everything locked to voice and beat.",
+  "canvas": { "width": 1920, "height": 1080, "fps": 30 },
+  "color": {
+    "ink": "#16181d", "inkStart": "#c9ced6", "muted": "#8a909b",
+    "accent": "#2b7fd4", "accentStart": "#bcd8f6",
+    "success": "#1f9d63", "danger": "#e5484d", "highlight": "#ffb900",
+    "bg": ["#f7f8fa", "#f5f7fa", "#eaf1fb"],
+    "glow": ["rgba(150,195,250,0.55)", "rgba(185,215,252,0.45)"],
+    "card": "#ffffff", "cardBar": "#fbfcfd", "cardBorder": "rgba(20,40,80,0.06)",
+    "object3d": ["#4D9ABF", "#F09082", "#F1BE58", "#9cc8ff", "#ffffff"]
+  },
+  "font": {
+    "display": "Figtree", "mono": "JetBrains Mono",
+    "weights": { "h0": 700, "h1": 600, "h2": 500, "caption": 500 },
+    "size": { "h0": [120, 150], "h1": [64, 76], "h2": [34, 46], "caption": [20, 30] },
+    "lineHeight": { "h0": 1.08, "h1": 1.15, "h2": 1.3, "caption": 1.35 },
+    "tracking": -0.02,
+    "maxLines": 2, "maxWordsPerLine": 7, "accentPerSentence": 1
+  },
+  "layout": {
+    "safe": { "x": 96, "y": 72, "min": 60 },
+    "vertical916": { "bottomUi": 0.2, "rightUi": 0.12 },
+    "zones": { "top": [0.08, 0.3], "center": [0.3, 0.8], "bottom": [0.8, 0.93] }
+  },
+  "ease": {
+    "out": [0.22, 1, 0.36, 1],
+    "inOut": [0.65, 0, 0.35, 1],
+    "in": "quad"
+  },
+  "motion": {
+    "morph": {"frames": 22, "opacity": 0.65},
+    "character": {"stagger": 2, "frames": 12, "blur": 7, "rise": 0.2},
+    "number": {"duration": 36},
+    "beat": {"snapMs": 80, "pulse": 0.025, "pulseFrames": 8},
+    "word":  { "inFrames": 12, "blur": 10, "rise": 0.28, "colorFrames": 14, "accentColorFrames": 20, "stagger": [4, 5], "spring": { "damping": 11, "stiffness": 140, "mass": 0.7 } },
+    "wordOut": { "frames": 9, "blur": 10, "rise": 0.12, "stagger": 1.5 },
+    "card":  { "frames": 24, "rise": 180, "rotateX": 12, "blur": 12, "scaleFrom": 0.92 },
+    "pill":  { "spring": { "damping": 13, "stiffness": 150, "mass": 0.6 }, "blur": 6 },
+    "icon":  { "slotFrames": 12, "slotWidth": 1.22, "spring": { "damping": 9, "stiffness": 170, "mass": 0.6 }, "rotate": -14, "float": 3 },
+    "logo3d": { "spring": { "damping": 12, "stiffness": 90, "mass": 1 } },
+    "scene": { "overlap": 17, "scaleIn": 1.07, "shiftIn": 160, "blur": 16, "scaleOut": 0.95 },
+    "camera": { "drift": 8, "maxZoom": 1.2, "maxMotionBlur": 8 },
+    "limits": { "minEnterFrames": 6, "maxEnterFrames": 30, "minStagger": 2, "minHoldBase": 0.8, "holdPerWord": 0.25, "minGapBetweenTransitions": 1.5, "maxSpeedPxPerSec": 2400 }
+  },
+  "shape": { "cardRadius": 22, "pillRadius": 999, "shadow": "0 40px 90px rgba(25,55,105,0.13), 0 8px 20px rgba(25,55,105,0.06)" },
+  "three": {
+    "ambient": 0.52, "key": { "pos": [400, 700, 900], "intensity": 2.0 }, "fill": { "pos": [-600, -100, 400], "intensity": 0.42 },
+    "material": { "roughness": [0.2, 0.35], "clearcoat": 1, "emissive": 0.2 },
+    "shadow": {"radius": 3},
+    "depthOfField": {"enabled": false, "focus": 2100, "aperture": 0.00002, "maxBlur": 0.002},
+    "finishes": {
+      "ceramic": {"metalness": 0, "roughness": 0.3, "transmission": 0, "thickness": 0, "ior": 1.5, "envMapIntensity": 0.8, "clearcoat": 0.8},
+      "metal": {"metalness": 0.9, "roughness": 0.22, "transmission": 0, "thickness": 0, "ior": 1.5, "envMapIntensity": 1.4, "clearcoat": 0.2},
+      "glass": {"metalness": 0, "roughness": 0.08, "transmission": 0.82, "thickness": 0.5, "ior": 1.45, "envMapIntensity": 1.1, "clearcoat": 1}
+    },
+    "camera": {"moves": [[0, 1.08, -0.045, 0, 0], [42, 1, 0.055, 0, 0], [96, 0.92, 0.11, 0, 0]]}
+  },
+  "audio": { "music": "dreamy", "sfxPack": "soft-pop", "lufs": -14, "truePeak": -1, "sfxPerMinute": [120, 180] },
+  "knobs": { "energy": 0.5, "density": 0.5, "warmth": 0.4, "roundness": 0.6, "depth": 0.7, "camera": "smooth" }
+}

package/vendor/motioncraft/assets/template/tsconfig.json

@@ -0,0 +1,7 @@
+{
+  "compilerOptions": {
+    "target": "ES2020", "module": "ESNext", "moduleResolution": "bundler", "jsx": "react-jsx",
+    "strict": true, "skipLibCheck": true, "resolveJsonModule": true, "esModuleInterop": true, "noEmit": true
+  },
+  "include": ["src"]
+}

package/vendor/motioncraft/references/animation-system.md

@@ -0,0 +1,57 @@
+# Animation system
+
+The template in `assets/template` is the animation system. Every motion value comes from `src/style.json` (copied from `styles/<id>/tokens.json`), so a style change never needs code edits.
+
+## Timing helpers (`src/lib`)
+
+| Helper | What it does |
+|---|---|
+| `sec(s)` | seconds -> frames at the style fps |
+| `ramp(f, at, dur)` | 0..1 progress with ease-out, clamped |
+| `spr(f, at, cfg)` | spring from the style tokens |
+| `useTimeline()` | loads `public/timeline.json` (words, beats, scenes, events) |
+| `wordAt(tl, 'word', nth)` | frame where a spoken word starts, 2 frames early (eyes lead ears) |
+| `eventAt(tl, 'id')` | frame of a named event (drop, CTA...) |
+| `snapToBeat(tl, frame)` | nearest beat frame |
+
+Rule: never hard-code a time that belongs to the voice. Use `wordAt`. Hard-coded `sec()` is fine for the example and for music-only videos.
+
+## Building blocks
+
+- `Scene from to` - a scene window. Scenes overlap by `motion.scene.overlap` frames with a blur crossfade. Never hard-cut.
+- `Camera3D keys` - actual perspective dolly/orbit/target motion inside each 3D canvas. Pass `cameraMove={[[frame, distance, orbitRadians, targetX, targetY], ...]}` to `FloatingShapes`, `Logo3D`, or `Mascot` for a per-scene shot; the default comes from `three.camera.moves` style tokens as offsets from `at` (distance is a multiplier of the canvas base distance). Depth-separated shapes produce actual parallax. Check the rendered frame; this does not move DOM headline text.
+- `Camera keys` - slow in-out camera moves `[frame, scale, x, y]` plus a tiny constant drift so the frame never goes dead. Max zoom comes from tokens.
+- `Zone name="top|center|bottom"` - keeps headline and hero from competing for space.
+- `Headline items={words('Text with *accent*', at)} level="h0|h1|h2"` - words rise out of blur, one after another, accent gets the accent color.
+- `Word`, `InlineIcon` - single animated word or icon inside a line.
+- `Card`, `Pill`, `Keycap` - UI surfaces that enter with rise + tilt + blur.
+- `Strike` - "not X" crossed out, for the "Not X. Y." pattern.
+- `CheckItem`, `StepCards`, `Callout`, `Counter` - proof and formula scenes. `Counter` only for real numbers, always with a `Credit`.
+- `Frames` - play a PNG sequence (screen recordings, pre-rendered 3D).
+- `Logo3D`, `Mascot`, `FloatingShapes` - real 3D (react-three-fiber). Use `finish="metal"` or `finish="glass"` on a logo, or `finishes={["ceramic", "metal", "glass"]}` on floating objects. The style tokens set physical roughness, metalness, transmission, environment and soft shadow radius. Optional depth-aware DOF is exposed via `three.depthOfField` tokens and a `BokehPass`, but defaults off because it adds a heavy 41-tap pass on top of CPU 3D rendering and can darken transmissive materials. The stock BokehShader forces alpha to 1; our canvas-specific alpha fix allows DOM compositing, but inspect your browser/backend output before enabling it. `focus` is camera distance in scene units, not a normalized fraction. `FloatingShapes` keeps a clear box around the headline.
+- `EndCard` - handle + one line.
+- `McBox kind="text|block"` - wrap any custom element so `qa overlap` can check it.
+
+## Motion rules
+
+1. Enter with ease-out, exit faster than you enter (exit frames < enter frames).
+2. Stagger words 4-5 frames. Never all at once, never slower than a reader.
+3. Hold each state at least `0.8 s + 0.25 s per word` before it changes.
+4. At least 1.5 s between big transitions.
+5. One thing moves big at a time. Everything else is still or drifts gently.
+6. Big moments (reveal, number, logo) land on a beat or the music drop.
+7. Old text leaves before new text enters in the same zone.
+8. Text never bounces visibly: word springs stay soft (tokens), bigger springs only for small UI (pills, icons, 3D).
+9. Motion blur and camera speed stay under the token limits (`motion.limits`).
+
+## Adding a new component
+
+Take values from `S` / `C` (tokens), wrap text/blocks in `McBox`, accept an `at` frame, and hide text color in debug mode like the built-in components do. Then run `qa overlap`.
+
+## Beat-locked visual accents
+
+Pass the real beatgrid `beats` array (seconds) to `Main` or `TimelineLaunch` / `TimelineTutorial` composition props. `Main` snaps its hook, number and CTA to a nearby beat; timeline templates snap each headline, card and CTA to beats in absolute time. The helper `nearestBeatFrame(frame, beats, maxMs?)` is available for custom scenes and `beatAccent(frame, beats)` returns a brief scale multiplier for logo/shape accents. The default maximum adjustment (80 ms), pulse amount and decay live in each style's `motion.beat`. No grid means unchanged timings, not a synthetic clock. Check the actual music mix: the grid and music file must match.
+
+## Morphing scene handoff
+
+`MorphTransition` from `components/MorphTransition` interpolates a shape's matching vertices, position and size through a scene boundary. Put it above adjacent `Scene` layers at `at={boundaryFrame - 11}` (default 22 frames) and give it `from`/`to` with equal-length `points` arrays of at least three normalized `[-1,1]` vertices. Positions `x/y` are fractions of the canvas, `size` is pixels. The sample `Main` composition has a four-point diamond-to-square handoff with `holdBefore`/`holdAfter` so the same object appears on both sides of the scene boundary. The hold props specify frames before/after the morph; the destination fades over the final 10 hold frames. Without holds, it behaves as a momentary overlay. The sample holds the destination through the first moment of the next scene. This is a real shape morph but **not** automatic matching of arbitrary 3D meshes or every scene: author corresponding shapes and keep the overlay out of text-safe areas. The old blur/crossfade remains behind the morph, and other scene boundaries are unchanged. `motion.morph` tokens control duration/opacity in all five styles.

package/vendor/motioncraft/references/assets-and-licensing.md

@@ -0,0 +1,21 @@
+# Assets and licensing
+
+## What you can use
+
+| Asset | OK | Not OK |
+|---|---|---|
+| Music | motioncraft `music make`; CC0 / public-domain tracks with the source noted | any commercial or "free for YouTube" track without a clear license |
+| SFX | motioncraft `sfx make`; CC0 packs | ripped sounds from apps or games |
+| Fonts | Google Fonts (open licenses), fonts the user owns | paid fonts without a license |
+| Logos | official press-kit / brand-asset pages, used to refer to that product | modified logos, logos implying endorsement |
+| Screenshots | real screenshots you or the user took; credit other products | fake UIs presented as a real product |
+| Icons | open icon sets (for example Lucide, Tabler, Phosphor) under their license | emoji as UI icons (style rule, not license) |
+| 3D | the template's own shapes, `Logo3D` from an SVG, CC0 models | models with unclear licenses |
+| Footage from a reference video | short clip, credited, only when you are commenting on it | reusing it as your own content |
+
+## Rules
+
+- Keep a `CREDITS.md` (or a note in `brief.md`) in each project listing every third-party asset and its source.
+- Put a `<Credit>` on screen for third-party numbers, screenshots and clips.
+- Logos go in `public/`. Prefer SVG; `Logo3D` needs a clean single-path SVG.
+- Remotion itself: free for individuals and small companies, company license for larger teams - see https://www.remotion.dev/license.

package/vendor/motioncraft/references/customization.md

@@ -0,0 +1,52 @@
+# Customization
+
+## Styles
+
+A style is a folder in `styles/<id>/` with:
+
+- `tokens.json` - every color, font, size, motion, 3D, and audio value the template reads
+- `style.md` - the look in words, with do's and don'ts
+
+```bash
+node <skill-dir>/scripts/motioncraft.mjs style list
+node <skill-dir>/scripts/motioncraft.mjs new my-video --style <id>
+```
+
+`new` copies the tokens into `my-video/src/style.json`. Edit that file for this video only.
+
+## Knobs
+
+```bash
+node <skill-dir>/scripts/motioncraft.mjs style knobs src/style.json --energy 0.7 --roundness 0.4 --camera active
+```
+
+| Knob | 0 | 1 | Changes |
+|---|---|---|---|
+| `energy` | slow, calm | quick, punchy | word/card/scene timing, springs, SFX density target |
+| `warmth` | cool blue-white | warm paper | background colors |
+| `roundness` | sharp | soft | card corner radius |
+| `depth` | flat | tilted, deep | card tilt on entry |
+| `camera` | `still` / `smooth` / `active` | | camera drift |
+| `density` | | | stored as a note for you: how much content per frame. Not applied automatically. |
+
+Knobs rewrite the tokens file and then run `style check`.
+
+## Style check
+
+```bash
+node <skill-dir>/scripts/motioncraft.mjs style check src/style.json
+```
+
+It flags things that make videos look bad: low contrast for ink, accent and muted text; common AI-default fonts; weak size hierarchy between h0/h1/h2; more than 2 text lines; word timing and stagger outside the limits; heavy blur; linear easing; camera zoom over 1.3x; margins under 48 px; more than 2 background glows. Fix every error; warnings need a reason.
+
+## Making a new style
+
+1. Copy `styles/pi-v2` to `styles/<new-id>` and set `name`.
+2. Change colors, fonts, sizes, motion. Keep one accent color.
+3. Write `style.md`: 3-5 sentences on the feel, then do's and don'ts.
+4. Run `style check styles/<new-id>/tokens.json` until clean.
+5. Render the example scene with it and look at the stills.
+
+## Vertical (9:16)
+
+`new --vertical` sets 1080x1920. Keep text out of the bottom 20% and right 12% (platform buttons) - these are in `layout.vertical916`.

package/vendor/motioncraft/references/gpu-cloud-render.md

@@ -0,0 +1,15 @@
+# GPU/cloud render, with a real hardware check
+
+GPU acceleration is not a property of a `--gl` flag alone. Chromium, the graphics driver, Remotion, Three.js, the server/container and a visible GPU must all work together. Device presence is only a candidate. A cloud VM can have an NVIDIA card while Chrome still uses SwiftShader. **Do not promise a speedup until a short 3D scene has been rendered with hardware and timed against the same scene on CPU.** For many flat/text scenes the encode, asset I/O and browser startup dominate; a GPU may not help.
+
+## Local or GPU-worker route
+
+1. Run `node <skill-dir>/scripts/motioncraft.mjs doctor` and `gpu probe --dir <project> --gl angle`. On Linux, check GPU devices and driver/Chromium logs, not only `nvidia-smi`. On Windows ANGLE often uses D3D; on macOS it may use Metal. The probe is an inventory check, not an acceleration benchmark.
+2. Make sure the project has its real media under `public/` or `src/`. Run `npm install` in the project to create `package-lock.json`. Check no secrets are in the project. `worker manifest --dir <project> --comp <composition> --gl angle --out render-job.json` hashes the project files, skips generated output and refuses symlinks and secret-looking filenames. `worker verify --dir <project> --manifest render-job.json` checks for changed or missing files after copying to a machine you control.
+3. Copy the **complete project** and manifest securely to a GPU-capable machine of your choice. Node 18+, compatible OS packages and browser libraries, GPU drivers, appropriate Chrome/Remotion version, fonts/media and ffmpeg are needed there. Run `npm ci` there after reviewing the dependencies. Do not put API keys or GitHub tokens in the job or project. This skill does not provision a vendor account, start cloud instances, upload assets or incur spend automatically.
+4. Start with a short 3D segment, e.g. `npx remotion render src/index.ts Main out/probe.mp4 --frames=0-89 --gl=angle --concurrency=2`, inspect actual frames and browser/driver logs for hardware use, and compare elapsed times with `--gl=swangle` on the same machine/settings. If acceleration is unverified or frames differ, stop. Then render the full composition through `motioncraft render --dir <project> --comp Main --gl angle --require-gpu --concurrency 2`, using reviewed props and audio when applicable. `--require-gpu` only fails closed on missing candidate hardware or software GL; it cannot prove hardware use, so the short comparison stays mandatory.
+5. Bring the finished output back over your chosen secure transfer method, run `qa all`, inspect final pixels at intended size and listen to audio. Keep your cloud job stopped when finished. Cloud compute, storage and data transfer may cost money; confirm provider/region, total and limits before starting a paid instance.
+
+## Honest limitations
+
+This is a portable worker handoff, not an integrated cloud-render button. No GPU was available in the development container (no NVIDIA driver or `/dev/dri`), so acceleration and provider-specific deployment are **untested**. Worker manifest verifies source integrity but does not sign or encrypt files, lock external font/service responses, or pin operating-system drivers. A `package-lock.json` pins npm versions; use the same Node/Remotion/Chromium/ffmpeg versions for repeatability. Third-party assets referenced only by URLs can change or fail; bundle licensed assets locally. Extra heavy 3D can still need lower concurrency or a pre-rendered PNG cache. A cloud VM is not necessarily faster or cheaper after upload/download, cold start and failed attempts.

package/vendor/motioncraft/references/music.md

@@ -0,0 +1,43 @@
+# Music
+
+motioncraft writes its own instrumental music, so there is nothing to license. It's pure Node: no samples, no internet.
+
+## Presets
+
+| Preset | BPM | Key | Feel |
+|---|---|---|---|
+| `calm-punch` | 102 | F | warm, light groove, marimba |
+| `dreamy` | 93 | D | soft, airy, marimba and bells (pi-v2 default) |
+| `warm-major` | 98 | G | friendly pop, glockenspiel |
+| `lofi-desk` | 84 | Eb | relaxed, dusty drums, pluck |
+| `tech-bright` | 112 | A | clean and quick, tight drums, pluck |
+| `dark-minimal` | 90 | C | serious, sparse, glock |
+| `cinematic-soft` | 88 | Bb | hopeful, very sparse drums |
+
+`music presets` prints the full values and the list of chord progressions.
+
+## Picking a vibe
+
+1. Match the topic. Product launch -> `tech-bright` or `calm-punch`. Story or personal -> `dreamy` or `cinematic-soft`. Tutorial -> `lofi-desk` or `warm-major`. Serious or security topics -> `dark-minimal`.
+2. When unsure, run `music audition --duration 52` and let the user pick from 3 short options.
+3. Set `--drop` to the second where the video's big reveal happens. The engine builds intro -> groove -> main (-> breakdown -> main) -> outro around it.
+
+## Variety guard
+
+Every track is logged in `~/.motioncraft/music-history.json`. A new track must differ from the last one on at least 2 of: key, BPM (by 6 or more), progression, lead instrument. Otherwise `music make` stops and says why. Change the values; only use `--force` when the user asks for the same sound again.
+
+## Custom spec
+
+For full control pass `--spec music.json`:
+
+```json
+{ "preset": "dreamy", "duration": 52, "drop": 12.9, "key": "E", "bpm": 96, "lead": "glock", "levels": { "pad": -8 } }
+```
+
+Guardrails: BPM 70-128, swing 0.50-0.68, lead `marimba|glock|pluck|none`. `--stems` also writes each instrument as its own WAV.
+
+## Rules
+
+- Instrumental only. No vocals, chants, or DJ-style drops.
+- Music is a bed under the voice. `mix` sets it at -6 dB and ducks it a further 7 dB (plus a small 2.5 kHz dip) while someone is talking.
+- Want real recorded music instead? Only CC0 / public-domain tracks, and note the source in the project's credits.