fusionSetup { "backgroundNode": "Background_Canvas", "background": "#d2d9e9", "outputNode": "MediaOut1", "input": "Merge_receipt-phone", "localFrames": [ 0, 480 ], "timelineFps": { "numerator": 60, "denominator": 1 }, "pixelAspect": 1, "layerOrder": "Listed ordered Over merges. Child tree is composited before its parent transform.", "notAnImportFile": true, "documentation": { "retainedManual": "Resolve-21.pdf / chapter120 Transform, printed pages2929-2931; chapter108 masks. Read from retained official documentation, not a claim of installed-version validation.", "transform": "Center positions the image, Pivot is the rotation/scaling axis, Size scales, positive Angle is counterclockwise, Canvas edges default transparent." }, "instructions": [ "Local x/y are pixels from the top-left of the parent, not the composition. All keys use the same native local frame f. For absolute source time use sourceStart+f, and for nominal seconds multiply by fpsDenominator/fpsNumerator. These are not measured master PTS.", "Use full1920x1080 transparent domains for local transforms, retaining offscreen material until the parent clipping stage. For these recipes any content permanently outside that local domain never returns into the visible window. Do not resize a group to its changing visible bounding box before parenting.", "For zero-rotation local origin(ox,oy), sx=scale*scaleX and sy=scale*scaleY: bx=x+ox-sx*ox, by=y+oy-sy*oy. Output pixels=(bx+sx*inputX,by+sy*inputY). Full-frame Fusion centered Pivot=(0.5,0.5) then uses CenterX=bx/1920+sx/2; CenterY=1-by/1080-sy/2. Use independent X/Y Size if scales differ. For the payment spinner rotate its local80x80 domain about(40,40), Angle=-rotation for CSS clockwise motion, then place the rotated result; do not rotate around the full canvas center.", "For a local rectangle center use ((x+w/2)/1920,1-(y+h/2)/1080), Width=w/1920, Height=h/1080. For rounded corners preserve the radius in pixel geometry; reconstruct a Bezier rounded rectangle rather than treating the Fusion Corner Radius knob as pixels. Every SVG path/viewBox and native icon path is preserved in the guide.", "Left-key hold means the left value persists strictly before the next key, and the right value begins exactly at that key. Smooth means u*u*(3-2*u), not Resolve default Auto or the older cubic Bezier(.16,1,.3,1). Bake controls.csv values as native-frame keys when an analytic expression is inconvenient.", "Masks change alpha before Over compositing. overflow:hidden plus radius intersects the children with a local rounded rectangle; radius alone does not clip children. All clip.top/right/bottom/left values are local pixels, not percentages or a time offset. Visible inset bounds=(left,top,width-left-right,height-top-bottom). Intersect masks; do not use an effect mask that merely limits Transform influence.", "CSS rect borders lie inside their stated box. Native fallback uses an outer rounded mask minus an inset rounded mask of border thickness; do not expand the box with a centered outline. Whole-group opacity is applied once after child Over merges.", "Keep premultiplied RGBA consistent for Over. If a color operation needs straight alpha, unpremultiply then premultiply immediately around it. No arbitrary opacity compensation, Screen blend or black backing. The original SVG radial/linear gradients use local alpha stops.", "All blur controls are CSS pixel values. Fusion Gaussian radius/quality is not assumed equivalent; calibrate the separate shadow branches and document reframing at full output resolution. Transparent SVG gradient stops are not blur nodes. Disable motion blur; no exposure sampling is authored.", "Geist text uses explicit line breaks and listed pixel boxes. Resolve Text+ font size/baseline and SVG gradient appearance need actual application calibration. Do not claim identical rasterization from a numerical sampler pass. Use held StyledText strings for the exact character prefix schedule if Write On counts differently.", "Use no optical flow, dynamic zoom, retiming, transition handles or synthesized audio. No extra frames precede or follow the source window. Final output is clipped to1920x1080, not scaled to fit it." ] } fusionNodes [ { "layerId": "context-field", "nodeId": "Layer_context-field", "kind": "image", "parentLayerId": null, "recipePointer": "/layers/0", "mergeIndex": 0, "backgroundInput": "Background_Canvas", "foregroundInput": "Processed_context-field", "output": "Merge_context-field", "activeLocalFrames": [ 0, 480 ], "effectiveActiveLocalFrames": [ 0, 480 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 0, "end": 480, "x": [ { "frame": 0, "value": -64, "easing": "smooth" }, { "frame": 479, "value": -24, "easing": "hold" } ], "y": [ { "frame": 0, "value": -36, "easing": "smooth" }, { "frame": 479, "value": -12, "easing": "hold" } ], "width": 2048, "height": 1152, "origin": [ 0, 0 ], "slot": "fieldArt", "fit": "contain" }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Native vector subgroup reconstructed from svgConstruction", "Fit Transform", "Local Transform", "Over Merge" ], "assets": { "defaults": { "kind": "image", "path": "art/payment-state-sequence/field-default.svg", "width": 1920, "height": 1080, "rights": "Original code-generated vector geometry authored for this kit. No source film imagery, logos, tracing, embedded bitmap or remote resource." }, "adaptation": { "kind": "image", "path": "art/payment-state-sequence/field-adaptation.svg", "width": 1920, "height": 1080, "rights": "Original code-generated vector geometry authored for this kit. No source film imagery, logos, tracing, embedded bitmap or remote resource." } }, "fitRule": "Use min(boxWidth/SVGWidth, boxHeight/SVGHeight), center the resulting artwork in the box, preserve SVG viewBox and alpha. These supplied boxes match their assets; no photographic crop." }, { "layerId": "detail-rim", "nodeId": "Layer_detail-rim", "kind": "rect", "parentLayerId": null, "recipePointer": "/layers/1", "mergeIndex": 1, "backgroundInput": "Merge_context-field", "foregroundInput": "Processed_detail-rim", "output": "Merge_detail-rim", "activeLocalFrames": [ 0, 133 ], "effectiveActiveLocalFrames": [ 0, 133 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 0, "end": 133, "x": 550, "y": -32, "width": 820, "height": 1200, "origin": [ 0, 0 ], "fill": "#ffffff", "opacity": 0.36 }, "alphaAndMasks": { "opacity": 0.36, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 0.36 }, "tools": [ "Background with Rectangle/Ellipse mask", "Inside-border ring if stroke is present", "Blur if present", "Local Transform", "Over Merge" ] }, { "layerId": "detail-clip", "nodeId": "Layer_detail-clip", "kind": "group", "parentLayerId": null, "recipePointer": "/layers/2", "mergeIndex": 2, "backgroundInput": "Merge_detail-rim", "foregroundInput": "Processed_detail-clip", "output": "Merge_detail-clip", "activeLocalFrames": [ 0, 133 ], "effectiveActiveLocalFrames": [ 0, 133 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 0, "end": 133, "x": 574, "y": -32, "width": 772, "height": 1180, "origin": [ 0, 0 ], "fill": "$paper", "overflow": "hidden" }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "hidden", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Transparent RGBA working domain", "Ordered child Merges", "Rounded Rectangle/Polygon alpha intersection if required", "Transform", "Group opacity", "Over Merge" ], "localFill": "$paper", "childLayerIds": [ "product-hero", "product-title", "option-label", "option-border", "option-value", "option-chevron", "product-merchant", "product-note", "product-price", "buy-button", "buy-label", "checkout-hint", "detail-dim", "checkout-drawer" ], "contentsInput": "Merge_checkout-drawer" }, { "layerId": "product-hero", "nodeId": "Layer_product-hero", "kind": "image", "parentLayerId": "detail-clip", "recipePointer": "/layers/2/children/0", "mergeIndex": 0, "backgroundInput": "Transparent_detail-clip", "foregroundInput": "Processed_product-hero", "output": "Merge_product-hero", "activeLocalFrames": [ 0, 133 ], "effectiveActiveLocalFrames": [ 0, 133 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 0, "end": 133, "x": 0, "y": 0, "width": 772, "height": 515, "origin": [ 0, 0 ], "slot": "productArt", "fit": "contain" }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Native vector subgroup reconstructed from svgConstruction", "Fit Transform", "Local Transform", "Over Merge" ], "assets": { "defaults": { "kind": "image", "path": "art/payment-state-sequence/product-default.svg", "width": 480, "height": 320, "rights": "Original code-generated vector geometry authored for this kit. No source film imagery, logos, tracing, embedded bitmap or remote resource." }, "adaptation": { "kind": "image", "path": "art/payment-state-sequence/product-adaptation.svg", "width": 480, "height": 320, "rights": "Original code-generated vector geometry authored for this kit. No source film imagery, logos, tracing, embedded bitmap or remote resource." } }, "fitRule": "Use min(boxWidth/SVGWidth, boxHeight/SVGHeight), center the resulting artwork in the box, preserve SVG viewBox and alpha. These supplied boxes match their assets; no photographic crop." }, { "layerId": "product-title", "nodeId": "Layer_product-title", "kind": "text", "parentLayerId": "detail-clip", "recipePointer": "/layers/2/children/1", "mergeIndex": 1, "backgroundInput": "Merge_product-hero", "foregroundInput": "Processed_product-title", "output": "Merge_product-title", "activeLocalFrames": [ 0, 133 ], "effectiveActiveLocalFrames": [ 0, 133 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 0, "end": 133, "x": 30, "y": 548, "width": 714, "height": 58, "origin": [ 0, 0 ], "slot": "productTitle", "fontSize": 38, "lineHeight": 1.25, "weight": 600, "color": "$ink" }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Text+ in bundled Geist", "Set explicit newline layout", "Stepped StyledText or Write On gate when present", "Local Transform", "Over Merge" ], "content": { "defaults": "Willow planter set", "adaptation": "Studio notebook kit" }, "font": { "family": "Geist", "file": "project/public/fonts/Geist.ttf", "pixels": 38, "weight": 600, "lineHeightPixels": 47.5, "letterSpacingPixels": 0, "fit": "No shrink or automatic wrapping. Text+ Size and baseline need actual installed-font calibration; the recipe pixel box is authoritative." } }, { "layerId": "option-label", "nodeId": "Layer_option-label", "kind": "text", "parentLayerId": "detail-clip", "recipePointer": "/layers/2/children/2", "mergeIndex": 2, "backgroundInput": "Merge_product-title", "foregroundInput": "Processed_option-label", "output": "Merge_option-label", "activeLocalFrames": [ 0, 133 ], "effectiveActiveLocalFrames": [ 0, 133 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 0, "end": 133, "x": 30, "y": 636, "width": 710, "height": 42, "origin": [ 0, 0 ], "slot": "optionLabel", "fontSize": 27, "lineHeight": 1.25, "weight": 400, "color": "$ink" }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Text+ in bundled Geist", "Set explicit newline layout", "Stepped StyledText or Write On gate when present", "Local Transform", "Over Merge" ], "content": { "defaults": "Planting kit", "adaptation": "Writing kit" }, "font": { "family": "Geist", "file": "project/public/fonts/Geist.ttf", "pixels": 27, "weight": 400, "lineHeightPixels": 33.75, "letterSpacingPixels": 0, "fit": "No shrink or automatic wrapping. Text+ Size and baseline need actual installed-font calibration; the recipe pixel box is authoritative." } }, { "layerId": "option-border", "nodeId": "Layer_option-border", "kind": "rect", "parentLayerId": "detail-clip", "recipePointer": "/layers/2/children/3", "mergeIndex": 3, "backgroundInput": "Merge_option-label", "foregroundInput": "Processed_option-border", "output": "Merge_option-border", "activeLocalFrames": [ 0, 133 ], "effectiveActiveLocalFrames": [ 0, 133 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 0, "end": 133, "x": 30, "y": 690, "width": 712, "height": 90, "origin": [ 0, 0 ], "fill": "$paper", "radius": 28, "stroke": "#d2d7d3", "strokeWidth": 2 }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 28, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Background with Rectangle/Ellipse mask", "Inside-border ring if stroke is present", "Blur if present", "Local Transform", "Over Merge" ] }, { "layerId": "option-value", "nodeId": "Layer_option-value", "kind": "text", "parentLayerId": "detail-clip", "recipePointer": "/layers/2/children/4", "mergeIndex": 4, "backgroundInput": "Merge_option-border", "foregroundInput": "Processed_option-value", "output": "Merge_option-value", "activeLocalFrames": [ 0, 133 ], "effectiveActiveLocalFrames": [ 0, 133 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 0, "end": 133, "x": 62, "y": 712, "width": 620, "height": 44, "origin": [ 0, 0 ], "slot": "optionValue", "fontSize": 27, "lineHeight": 1.25, "weight": 400, "color": "$muted" }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Text+ in bundled Geist", "Set explicit newline layout", "Stepped StyledText or Write On gate when present", "Local Transform", "Over Merge" ], "content": { "defaults": "Fern + clay planter", "adaptation": "Notebook + pencil" }, "font": { "family": "Geist", "file": "project/public/fonts/Geist.ttf", "pixels": 27, "weight": 400, "lineHeightPixels": 33.75, "letterSpacingPixels": 0, "fit": "No shrink or automatic wrapping. Text+ Size and baseline need actual installed-font calibration; the recipe pixel box is authoritative." } }, { "layerId": "option-chevron", "nodeId": "Layer_option-chevron", "kind": "path", "parentLayerId": "detail-clip", "recipePointer": "/layers/2/children/5", "mergeIndex": 5, "backgroundInput": "Merge_option-value", "foregroundInput": "Processed_option-chevron", "output": "Merge_option-chevron", "activeLocalFrames": [ 0, 133 ], "effectiveActiveLocalFrames": [ 0, 133 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 0, "end": 133, "x": 676, "y": 714, "width": 32, "height": 32, "origin": [ 0, 0 ], "path": "M18 25L32 39L46 25", "viewBox": [ 0, 0, 64, 64 ], "fill": "none", "stroke": "$muted", "strokeWidth": 4 }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Polygon/Bezier fill/stroke using exact path/viewBox", "Path-length dash/trim when present", "Local Transform", "Over Merge" ], "strokeSemantics": "SVG default butt linecaps and miter joins; strokeWidth and dash units are in the path viewBox, not canvas pixels. Static SVG asset elements may explicitly override these defaults." }, { "layerId": "product-merchant", "nodeId": "Layer_product-merchant", "kind": "text", "parentLayerId": "detail-clip", "recipePointer": "/layers/2/children/6", "mergeIndex": 6, "backgroundInput": "Merge_option-chevron", "foregroundInput": "Processed_product-merchant", "output": "Merge_product-merchant", "activeLocalFrames": [ 0, 133 ], "effectiveActiveLocalFrames": [ 0, 133 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 0, "end": 133, "x": 30, "y": 844, "width": 420, "height": 48, "origin": [ 0, 0 ], "slot": "merchant", "fontSize": 30, "lineHeight": 1.25, "weight": 600, "color": "$ink" }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Text+ in bundled Geist", "Set explicit newline layout", "Stepped StyledText or Write On gate when present", "Local Transform", "Over Merge" ], "content": { "defaults": "Mossworks", "adaptation": "Paperwell" }, "font": { "family": "Geist", "file": "project/public/fonts/Geist.ttf", "pixels": 30, "weight": 600, "lineHeightPixels": 37.5, "letterSpacingPixels": 0, "fit": "No shrink or automatic wrapping. Text+ Size and baseline need actual installed-font calibration; the recipe pixel box is authoritative." } }, { "layerId": "product-note", "nodeId": "Layer_product-note", "kind": "text", "parentLayerId": "detail-clip", "recipePointer": "/layers/2/children/7", "mergeIndex": 7, "backgroundInput": "Merge_product-merchant", "foregroundInput": "Processed_product-note", "output": "Merge_product-note", "activeLocalFrames": [ 0, 133 ], "effectiveActiveLocalFrames": [ 0, 133 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 0, "end": 133, "x": 30, "y": 892, "width": 470, "height": 42, "origin": [ 0, 0 ], "slot": "productNote", "fontSize": 23, "lineHeight": 1.25, "weight": 400, "color": "$muted" }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Text+ in bundled Geist", "Set explicit newline layout", "Stepped StyledText or Write On gate when present", "Local Transform", "Over Merge" ], "content": { "defaults": "Original garden collection", "adaptation": "Original studio collection" }, "font": { "family": "Geist", "file": "project/public/fonts/Geist.ttf", "pixels": 23, "weight": 400, "lineHeightPixels": 28.75, "letterSpacingPixels": 0, "fit": "No shrink or automatic wrapping. Text+ Size and baseline need actual installed-font calibration; the recipe pixel box is authoritative." } }, { "layerId": "product-price", "nodeId": "Layer_product-price", "kind": "text", "parentLayerId": "detail-clip", "recipePointer": "/layers/2/children/8", "mergeIndex": 8, "backgroundInput": "Merge_product-note", "foregroundInput": "Processed_product-price", "output": "Merge_product-price", "activeLocalFrames": [ 0, 133 ], "effectiveActiveLocalFrames": [ 0, 133 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 0, "end": 133, "x": 502, "y": 880, "width": 142, "height": 46, "origin": [ 0, 0 ], "slot": "price", "fontSize": 30, "lineHeight": 1.25, "weight": 400, "color": "$ink", "align": "right" }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Text+ in bundled Geist", "Set explicit newline layout", "Stepped StyledText or Write On gate when present", "Local Transform", "Over Merge" ], "content": { "defaults": "$48.00", "adaptation": "$32.00" }, "font": { "family": "Geist", "file": "project/public/fonts/Geist.ttf", "pixels": 30, "weight": 400, "lineHeightPixels": 37.5, "letterSpacingPixels": 0, "fit": "No shrink or automatic wrapping. Text+ Size and baseline need actual installed-font calibration; the recipe pixel box is authoritative." } }, { "layerId": "buy-button", "nodeId": "Layer_buy-button", "kind": "rect", "parentLayerId": "detail-clip", "recipePointer": "/layers/2/children/9", "mergeIndex": 9, "backgroundInput": "Merge_product-price", "foregroundInput": "Processed_buy-button", "output": "Merge_buy-button", "activeLocalFrames": [ 0, 133 ], "effectiveActiveLocalFrames": [ 0, 133 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 0, "end": 133, "x": 654, "y": 864, "width": 88, "height": 64, "origin": [ 0, 0 ], "fill": "$accent", "radius": 32 }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 32, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Background with Rectangle/Ellipse mask", "Inside-border ring if stroke is present", "Blur if present", "Local Transform", "Over Merge" ] }, { "layerId": "buy-label", "nodeId": "Layer_buy-label", "kind": "text", "parentLayerId": "detail-clip", "recipePointer": "/layers/2/children/10", "mergeIndex": 10, "backgroundInput": "Merge_buy-button", "foregroundInput": "Processed_buy-label", "output": "Merge_buy-label", "activeLocalFrames": [ 0, 133 ], "effectiveActiveLocalFrames": [ 0, 133 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 0, "end": 133, "x": 661, "y": 883, "width": 74, "height": 32, "origin": [ 0, 0 ], "slot": "buy", "fontSize": 24, "lineHeight": 1.25, "weight": 400, "color": "#ffffff", "align": "center" }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Text+ in bundled Geist", "Set explicit newline layout", "Stepped StyledText or Write On gate when present", "Local Transform", "Over Merge" ], "content": { "defaults": "Buy", "adaptation": "Buy" }, "font": { "family": "Geist", "file": "project/public/fonts/Geist.ttf", "pixels": 24, "weight": 400, "lineHeightPixels": 30.0, "letterSpacingPixels": 0, "fit": "No shrink or automatic wrapping. Text+ Size and baseline need actual installed-font calibration; the recipe pixel box is authoritative." } }, { "layerId": "checkout-hint", "nodeId": "Layer_checkout-hint", "kind": "text", "parentLayerId": "detail-clip", "recipePointer": "/layers/2/children/11", "mergeIndex": 11, "backgroundInput": "Merge_buy-label", "foregroundInput": "Processed_checkout-hint", "output": "Merge_checkout-hint", "activeLocalFrames": [ 0, 133 ], "effectiveActiveLocalFrames": [ 0, 133 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 0, "end": 133, "x": 30, "y": 956, "width": 710, "height": 42, "origin": [ 0, 0 ], "slot": "checkoutHint", "fontSize": 23, "lineHeight": 1.25, "weight": 400, "color": "$accent" }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Text+ in bundled Geist", "Set explicit newline layout", "Stepped StyledText or Write On gate when present", "Local Transform", "Over Merge" ], "content": { "defaults": "Illustrative checkout", "adaptation": "Illustrative checkout" }, "font": { "family": "Geist", "file": "project/public/fonts/Geist.ttf", "pixels": 23, "weight": 400, "lineHeightPixels": 28.75, "letterSpacingPixels": 0, "fit": "No shrink or automatic wrapping. Text+ Size and baseline need actual installed-font calibration; the recipe pixel box is authoritative." } }, { "layerId": "detail-dim", "nodeId": "Layer_detail-dim", "kind": "rect", "parentLayerId": "detail-clip", "recipePointer": "/layers/2/children/12", "mergeIndex": 12, "backgroundInput": "Merge_checkout-hint", "foregroundInput": "Processed_detail-dim", "output": "Merge_detail-dim", "activeLocalFrames": [ 32, 133 ], "effectiveActiveLocalFrames": [ 32, 133 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 32, "end": 133, "x": 0, "y": 0, "width": 772, "height": 1180, "origin": [ 0, 0 ], "fill": "#000000", "opacity": [ { "frame": 32, "value": 0, "easing": "linear" }, { "frame": 43, "value": 0.18, "easing": "hold" } ] }, "alphaAndMasks": { "opacity": [ { "frame": 32, "value": 0, "easing": "linear" }, { "frame": 43, "value": 0.18, "easing": "hold" } ], "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": [ { "frame": 32, "value": 0, "easing": "linear" }, { "frame": 43, "value": 0.18, "easing": "hold" } ] }, "tools": [ "Background with Rectangle/Ellipse mask", "Inside-border ring if stroke is present", "Blur if present", "Local Transform", "Over Merge" ] }, { "layerId": "checkout-drawer", "nodeId": "Layer_checkout-drawer", "kind": "group", "parentLayerId": "detail-clip", "recipePointer": "/layers/2/children/13", "mergeIndex": 13, "backgroundInput": "Merge_detail-dim", "foregroundInput": "Processed_checkout-drawer", "output": "Merge_checkout-drawer", "activeLocalFrames": [ 36, 133 ], "effectiveActiveLocalFrames": [ 36, 133 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 36, "end": 133, "x": [ { "frame": 36, "value": 772, "easing": "smooth" }, { "frame": 76, "value": 0, "easing": "hold" } ], "y": [ { "frame": 36, "value": 0, "easing": "hold" }, { "frame": 92, "value": 0, "easing": "smooth" }, { "frame": 132, "value": -48, "easing": "hold" } ], "width": 772, "height": 1180, "origin": [ 0, 0 ], "fill": "$paper" }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Transparent RGBA working domain", "Ordered child Merges", "Rounded Rectangle/Polygon alpha intersection if required", "Transform", "Group opacity", "Over Merge" ], "localFill": "$paper", "childLayerIds": [ "checkout-thumb", "checkout-title", "quantity-plate", "quantity-value", "checkout-rule-0", "checkout-icon-0", "checkout-row-0", "checkout-subrow-0", "checkout-rule-1", "checkout-icon-1", "checkout-row-1", "checkout-subrow-1", "checkout-rule-2", "checkout-icon-2", "checkout-row-2", "checkout-subrow-2", "checkout-summary-labels", "checkout-summary-values", "checkout-total-label", "checkout-total", "checkout-pay-button", "checkout-pay-label" ], "contentsInput": "Merge_checkout-pay-label" }, { "layerId": "checkout-thumb", "nodeId": "Layer_checkout-thumb", "kind": "image", "parentLayerId": "checkout-drawer", "recipePointer": "/layers/2/children/13/children/0", "mergeIndex": 0, "backgroundInput": "Transparent_checkout-drawer", "foregroundInput": "Processed_checkout-thumb", "output": "Merge_checkout-thumb", "activeLocalFrames": [ 36, 133 ], "effectiveActiveLocalFrames": [ 36, 133 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 36, "end": 133, "x": 30, "y": 42, "width": 240, "height": 160, "origin": [ 0, 0 ], "slot": "productArt", "fit": "contain" }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Native vector subgroup reconstructed from svgConstruction", "Fit Transform", "Local Transform", "Over Merge" ], "assets": { "defaults": { "kind": "image", "path": "art/payment-state-sequence/product-default.svg", "width": 480, "height": 320, "rights": "Original code-generated vector geometry authored for this kit. No source film imagery, logos, tracing, embedded bitmap or remote resource." }, "adaptation": { "kind": "image", "path": "art/payment-state-sequence/product-adaptation.svg", "width": 480, "height": 320, "rights": "Original code-generated vector geometry authored for this kit. No source film imagery, logos, tracing, embedded bitmap or remote resource." } }, "fitRule": "Use min(boxWidth/SVGWidth, boxHeight/SVGHeight), center the resulting artwork in the box, preserve SVG viewBox and alpha. These supplied boxes match their assets; no photographic crop." }, { "layerId": "checkout-title", "nodeId": "Layer_checkout-title", "kind": "text", "parentLayerId": "checkout-drawer", "recipePointer": "/layers/2/children/13/children/1", "mergeIndex": 1, "backgroundInput": "Merge_checkout-thumb", "foregroundInput": "Processed_checkout-title", "output": "Merge_checkout-title", "activeLocalFrames": [ 36, 133 ], "effectiveActiveLocalFrames": [ 36, 133 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 36, "end": 133, "x": 306, "y": 42, "width": 422, "height": 104, "origin": [ 0, 0 ], "slot": "productShort", "fontSize": 34, "lineHeight": 1.25, "weight": 500, "color": "$ink" }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Text+ in bundled Geist", "Set explicit newline layout", "Stepped StyledText or Write On gate when present", "Local Transform", "Over Merge" ], "content": { "defaults": "Willow\nplanter set", "adaptation": "Studio\nnotebook kit" }, "font": { "family": "Geist", "file": "project/public/fonts/Geist.ttf", "pixels": 34, "weight": 500, "lineHeightPixels": 42.5, "letterSpacingPixels": 0, "fit": "No shrink or automatic wrapping. Text+ Size and baseline need actual installed-font calibration; the recipe pixel box is authoritative." } }, { "layerId": "quantity-plate", "nodeId": "Layer_quantity-plate", "kind": "rect", "parentLayerId": "checkout-drawer", "recipePointer": "/layers/2/children/13/children/2", "mergeIndex": 2, "backgroundInput": "Merge_checkout-title", "foregroundInput": "Processed_quantity-plate", "output": "Merge_quantity-plate", "activeLocalFrames": [ 36, 133 ], "effectiveActiveLocalFrames": [ 36, 133 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 36, "end": 133, "x": 306, "y": 164, "width": 210, "height": 68, "origin": [ 0, 0 ], "fill": "$panel", "radius": 22 }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 22, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Background with Rectangle/Ellipse mask", "Inside-border ring if stroke is present", "Blur if present", "Local Transform", "Over Merge" ] }, { "layerId": "quantity-value", "nodeId": "Layer_quantity-value", "kind": "text", "parentLayerId": "checkout-drawer", "recipePointer": "/layers/2/children/13/children/3", "mergeIndex": 3, "backgroundInput": "Merge_quantity-plate", "foregroundInput": "Processed_quantity-value", "output": "Merge_quantity-value", "activeLocalFrames": [ 36, 133 ], "effectiveActiveLocalFrames": [ 36, 133 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 36, "end": 133, "x": 322, "y": 181, "width": 176, "height": 40, "origin": [ 0, 0 ], "slot": "quantity", "fontSize": 29, "lineHeight": 1.25, "weight": 400, "color": "$ink", "align": "center" }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Text+ in bundled Geist", "Set explicit newline layout", "Stepped StyledText or Write On gate when present", "Local Transform", "Over Merge" ], "content": { "defaults": "− 1 +", "adaptation": "− 1 +" }, "font": { "family": "Geist", "file": "project/public/fonts/Geist.ttf", "pixels": 29, "weight": 400, "lineHeightPixels": 36.25, "letterSpacingPixels": 0, "fit": "No shrink or automatic wrapping. Text+ Size and baseline need actual installed-font calibration; the recipe pixel box is authoritative." } }, { "layerId": "checkout-rule-0", "nodeId": "Layer_checkout-rule-0", "kind": "rect", "parentLayerId": "checkout-drawer", "recipePointer": "/layers/2/children/13/children/4", "mergeIndex": 4, "backgroundInput": "Merge_quantity-value", "foregroundInput": "Processed_checkout-rule-0", "output": "Merge_checkout-rule-0", "activeLocalFrames": [ 36, 133 ], "effectiveActiveLocalFrames": [ 36, 133 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 36, "end": 133, "x": 30, "y": 268, "width": 712, "height": 2, "origin": [ 0, 0 ], "fill": "#edf0ed" }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Background with Rectangle/Ellipse mask", "Inside-border ring if stroke is present", "Blur if present", "Local Transform", "Over Merge" ] }, { "layerId": "checkout-icon-0", "nodeId": "Layer_checkout-icon-0", "kind": "path", "parentLayerId": "checkout-drawer", "recipePointer": "/layers/2/children/13/children/5", "mergeIndex": 5, "backgroundInput": "Merge_checkout-rule-0", "foregroundInput": "Processed_checkout-icon-0", "output": "Merge_checkout-icon-0", "activeLocalFrames": [ 36, 133 ], "effectiveActiveLocalFrames": [ 36, 133 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 36, "end": 133, "x": 40, "y": 299, "width": 48, "height": 48, "origin": [ 0, 0 ], "path": "M10 14H54V50H10ZM10 25H54", "viewBox": [ 0, 0, 64, 64 ], "fill": "none", "stroke": "$ink", "strokeWidth": 3 }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Polygon/Bezier fill/stroke using exact path/viewBox", "Path-length dash/trim when present", "Local Transform", "Over Merge" ], "strokeSemantics": "SVG default butt linecaps and miter joins; strokeWidth and dash units are in the path viewBox, not canvas pixels. Static SVG asset elements may explicitly override these defaults." }, { "layerId": "checkout-row-0", "nodeId": "Layer_checkout-row-0", "kind": "text", "parentLayerId": "checkout-drawer", "recipePointer": "/layers/2/children/13/children/6", "mergeIndex": 6, "backgroundInput": "Merge_checkout-icon-0", "foregroundInput": "Processed_checkout-row-0", "output": "Merge_checkout-row-0", "activeLocalFrames": [ 36, 133 ], "effectiveActiveLocalFrames": [ 36, 133 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 36, "end": 133, "x": 116, "y": 290, "width": 570, "height": 42, "origin": [ 0, 0 ], "slot": "cardLabel", "fontSize": 28, "lineHeight": 1.25, "weight": 400, "color": "$ink" }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Text+ in bundled Geist", "Set explicit newline layout", "Stepped StyledText or Write On gate when present", "Local Transform", "Over Merge" ], "content": { "defaults": "Sample card", "adaptation": "Sample card" }, "font": { "family": "Geist", "file": "project/public/fonts/Geist.ttf", "pixels": 28, "weight": 400, "lineHeightPixels": 35.0, "letterSpacingPixels": 0, "fit": "No shrink or automatic wrapping. Text+ Size and baseline need actual installed-font calibration; the recipe pixel box is authoritative." } }, { "layerId": "checkout-subrow-0", "nodeId": "Layer_checkout-subrow-0", "kind": "text", "parentLayerId": "checkout-drawer", "recipePointer": "/layers/2/children/13/children/7", "mergeIndex": 7, "backgroundInput": "Merge_checkout-row-0", "foregroundInput": "Processed_checkout-subrow-0", "output": "Merge_checkout-subrow-0", "activeLocalFrames": [ 36, 133 ], "effectiveActiveLocalFrames": [ 36, 133 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 36, "end": 133, "x": 116, "y": 336, "width": 570, "height": 36, "origin": [ 0, 0 ], "slot": "cardValue", "fontSize": 23, "lineHeight": 1.25, "weight": 400, "color": "$muted" }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Text+ in bundled Geist", "Set explicit newline layout", "Stepped StyledText or Write On gate when present", "Local Transform", "Over Merge" ], "content": { "defaults": "•••• 0000 · demo only", "adaptation": "•••• 0000 · demo only" }, "font": { "family": "Geist", "file": "project/public/fonts/Geist.ttf", "pixels": 23, "weight": 400, "lineHeightPixels": 28.75, "letterSpacingPixels": 0, "fit": "No shrink or automatic wrapping. Text+ Size and baseline need actual installed-font calibration; the recipe pixel box is authoritative." } }, { "layerId": "checkout-rule-1", "nodeId": "Layer_checkout-rule-1", "kind": "rect", "parentLayerId": "checkout-drawer", "recipePointer": "/layers/2/children/13/children/8", "mergeIndex": 8, "backgroundInput": "Merge_checkout-subrow-0", "foregroundInput": "Processed_checkout-rule-1", "output": "Merge_checkout-rule-1", "activeLocalFrames": [ 36, 133 ], "effectiveActiveLocalFrames": [ 36, 133 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 36, "end": 133, "x": 30, "y": 388, "width": 712, "height": 2, "origin": [ 0, 0 ], "fill": "#edf0ed" }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Background with Rectangle/Ellipse mask", "Inside-border ring if stroke is present", "Blur if present", "Local Transform", "Over Merge" ] }, { "layerId": "checkout-icon-1", "nodeId": "Layer_checkout-icon-1", "kind": "path", "parentLayerId": "checkout-drawer", "recipePointer": "/layers/2/children/13/children/9", "mergeIndex": 9, "backgroundInput": "Merge_checkout-rule-1", "foregroundInput": "Processed_checkout-icon-1", "output": "Merge_checkout-icon-1", "activeLocalFrames": [ 36, 133 ], "effectiveActiveLocalFrames": [ 36, 133 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 36, "end": 133, "x": 40, "y": 419, "width": 48, "height": 48, "origin": [ 0, 0 ], "path": "M32 57Q10 37 12 24A20 20 0 0 1 52 24Q54 37 32 57ZM25 23A7 7 0 1 0 39 23A7 7 0 1 0 25 23", "viewBox": [ 0, 0, 64, 64 ], "fill": "none", "stroke": "$ink", "strokeWidth": 3 }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Polygon/Bezier fill/stroke using exact path/viewBox", "Path-length dash/trim when present", "Local Transform", "Over Merge" ], "strokeSemantics": "SVG default butt linecaps and miter joins; strokeWidth and dash units are in the path viewBox, not canvas pixels. Static SVG asset elements may explicitly override these defaults." }, { "layerId": "checkout-row-1", "nodeId": "Layer_checkout-row-1", "kind": "text", "parentLayerId": "checkout-drawer", "recipePointer": "/layers/2/children/13/children/10", "mergeIndex": 10, "backgroundInput": "Merge_checkout-icon-1", "foregroundInput": "Processed_checkout-row-1", "output": "Merge_checkout-row-1", "activeLocalFrames": [ 36, 133 ], "effectiveActiveLocalFrames": [ 36, 133 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 36, "end": 133, "x": 116, "y": 410, "width": 570, "height": 42, "origin": [ 0, 0 ], "slot": "recipient", "fontSize": 28, "lineHeight": 1.25, "weight": 400, "color": "$ink" }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Text+ in bundled Geist", "Set explicit newline layout", "Stepped StyledText or Write On gate when present", "Local Transform", "Over Merge" ], "content": { "defaults": "Sample recipient", "adaptation": "Sample recipient" }, "font": { "family": "Geist", "file": "project/public/fonts/Geist.ttf", "pixels": 28, "weight": 400, "lineHeightPixels": 35.0, "letterSpacingPixels": 0, "fit": "No shrink or automatic wrapping. Text+ Size and baseline need actual installed-font calibration; the recipe pixel box is authoritative." } }, { "layerId": "checkout-subrow-1", "nodeId": "Layer_checkout-subrow-1", "kind": "text", "parentLayerId": "checkout-drawer", "recipePointer": "/layers/2/children/13/children/11", "mergeIndex": 11, "backgroundInput": "Merge_checkout-row-1", "foregroundInput": "Processed_checkout-subrow-1", "output": "Merge_checkout-subrow-1", "activeLocalFrames": [ 36, 133 ], "effectiveActiveLocalFrames": [ 36, 133 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 36, "end": 133, "x": 116, "y": 456, "width": 570, "height": 36, "origin": [ 0, 0 ], "slot": "address", "fontSize": 23, "lineHeight": 1.25, "weight": 400, "color": "$muted" }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Text+ in bundled Geist", "Set explicit newline layout", "Stepped StyledText or Write On gate when present", "Local Transform", "Over Merge" ], "content": { "defaults": "Demo address · no delivery", "adaptation": "Demo address · no delivery" }, "font": { "family": "Geist", "file": "project/public/fonts/Geist.ttf", "pixels": 23, "weight": 400, "lineHeightPixels": 28.75, "letterSpacingPixels": 0, "fit": "No shrink or automatic wrapping. Text+ Size and baseline need actual installed-font calibration; the recipe pixel box is authoritative." } }, { "layerId": "checkout-rule-2", "nodeId": "Layer_checkout-rule-2", "kind": "rect", "parentLayerId": "checkout-drawer", "recipePointer": "/layers/2/children/13/children/12", "mergeIndex": 12, "backgroundInput": "Merge_checkout-subrow-1", "foregroundInput": "Processed_checkout-rule-2", "output": "Merge_checkout-rule-2", "activeLocalFrames": [ 36, 133 ], "effectiveActiveLocalFrames": [ 36, 133 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 36, "end": 133, "x": 30, "y": 508, "width": 712, "height": 2, "origin": [ 0, 0 ], "fill": "#edf0ed" }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Background with Rectangle/Ellipse mask", "Inside-border ring if stroke is present", "Blur if present", "Local Transform", "Over Merge" ] }, { "layerId": "checkout-icon-2", "nodeId": "Layer_checkout-icon-2", "kind": "path", "parentLayerId": "checkout-drawer", "recipePointer": "/layers/2/children/13/children/13", "mergeIndex": 13, "backgroundInput": "Merge_checkout-rule-2", "foregroundInput": "Processed_checkout-icon-2", "output": "Merge_checkout-icon-2", "activeLocalFrames": [ 36, 133 ], "effectiveActiveLocalFrames": [ 36, 133 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 36, "end": 133, "x": 40, "y": 539, "width": 48, "height": 48, "origin": [ 0, 0 ], "path": "M7 15H39V46H7ZM39 25H50L59 36V46H39M15 46A6 6 0 1 0 27 46M41 46A6 6 0 1 0 53 46", "viewBox": [ 0, 0, 64, 64 ], "fill": "none", "stroke": "$ink", "strokeWidth": 3 }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Polygon/Bezier fill/stroke using exact path/viewBox", "Path-length dash/trim when present", "Local Transform", "Over Merge" ], "strokeSemantics": "SVG default butt linecaps and miter joins; strokeWidth and dash units are in the path viewBox, not canvas pixels. Static SVG asset elements may explicitly override these defaults." }, { "layerId": "checkout-row-2", "nodeId": "Layer_checkout-row-2", "kind": "text", "parentLayerId": "checkout-drawer", "recipePointer": "/layers/2/children/13/children/14", "mergeIndex": 14, "backgroundInput": "Merge_checkout-icon-2", "foregroundInput": "Processed_checkout-row-2", "output": "Merge_checkout-row-2", "activeLocalFrames": [ 36, 133 ], "effectiveActiveLocalFrames": [ 36, 133 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 36, "end": 133, "x": 116, "y": 530, "width": 570, "height": 42, "origin": [ 0, 0 ], "slot": "shippingTitle", "fontSize": 28, "lineHeight": 1.25, "weight": 400, "color": "$ink" }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Text+ in bundled Geist", "Set explicit newline layout", "Stepped StyledText or Write On gate when present", "Local Transform", "Over Merge" ], "content": { "defaults": "Standard delivery", "adaptation": "Standard delivery" }, "font": { "family": "Geist", "file": "project/public/fonts/Geist.ttf", "pixels": 28, "weight": 400, "lineHeightPixels": 35.0, "letterSpacingPixels": 0, "fit": "No shrink or automatic wrapping. Text+ Size and baseline need actual installed-font calibration; the recipe pixel box is authoritative." } }, { "layerId": "checkout-subrow-2", "nodeId": "Layer_checkout-subrow-2", "kind": "text", "parentLayerId": "checkout-drawer", "recipePointer": "/layers/2/children/13/children/15", "mergeIndex": 15, "backgroundInput": "Merge_checkout-row-2", "foregroundInput": "Processed_checkout-subrow-2", "output": "Merge_checkout-subrow-2", "activeLocalFrames": [ 36, 133 ], "effectiveActiveLocalFrames": [ 36, 133 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 36, "end": 133, "x": 116, "y": 576, "width": 570, "height": 36, "origin": [ 0, 0 ], "slot": "shippingValue", "fontSize": 23, "lineHeight": 1.25, "weight": 400, "color": "$muted" }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Text+ in bundled Geist", "Set explicit newline layout", "Stepped StyledText or Write On gate when present", "Local Transform", "Over Merge" ], "content": { "defaults": "Illustrative · no promise", "adaptation": "Illustrative · no promise" }, "font": { "family": "Geist", "file": "project/public/fonts/Geist.ttf", "pixels": 23, "weight": 400, "lineHeightPixels": 28.75, "letterSpacingPixels": 0, "fit": "No shrink or automatic wrapping. Text+ Size and baseline need actual installed-font calibration; the recipe pixel box is authoritative." } }, { "layerId": "checkout-summary-labels", "nodeId": "Layer_checkout-summary-labels", "kind": "text", "parentLayerId": "checkout-drawer", "recipePointer": "/layers/2/children/13/children/16", "mergeIndex": 16, "backgroundInput": "Merge_checkout-subrow-2", "foregroundInput": "Processed_checkout-summary-labels", "output": "Merge_checkout-summary-labels", "activeLocalFrames": [ 36, 133 ], "effectiveActiveLocalFrames": [ 36, 133 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 36, "end": 133, "x": 30, "y": 684, "width": 370, "height": 112, "origin": [ 0, 0 ], "slot": "summaryLabels", "fontSize": 25, "lineHeight": 1.4, "weight": 400, "color": "$muted" }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Text+ in bundled Geist", "Set explicit newline layout", "Stepped StyledText or Write On gate when present", "Local Transform", "Over Merge" ], "content": { "defaults": "Subtotal\nDelivery\nEstimated tax", "adaptation": "Subtotal\nDelivery\nEstimated tax" }, "font": { "family": "Geist", "file": "project/public/fonts/Geist.ttf", "pixels": 25, "weight": 400, "lineHeightPixels": 35.0, "letterSpacingPixels": 0, "fit": "No shrink or automatic wrapping. Text+ Size and baseline need actual installed-font calibration; the recipe pixel box is authoritative." } }, { "layerId": "checkout-summary-values", "nodeId": "Layer_checkout-summary-values", "kind": "text", "parentLayerId": "checkout-drawer", "recipePointer": "/layers/2/children/13/children/17", "mergeIndex": 17, "backgroundInput": "Merge_checkout-summary-labels", "foregroundInput": "Processed_checkout-summary-values", "output": "Merge_checkout-summary-values", "activeLocalFrames": [ 36, 133 ], "effectiveActiveLocalFrames": [ 36, 133 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 36, "end": 133, "x": 434, "y": 684, "width": 308, "height": 112, "origin": [ 0, 0 ], "slot": "summaryValues", "fontSize": 25, "lineHeight": 1.4, "weight": 400, "color": "$muted", "align": "right" }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Text+ in bundled Geist", "Set explicit newline layout", "Stepped StyledText or Write On gate when present", "Local Transform", "Over Merge" ], "content": { "defaults": "$48.00\n$4.00\n$0.00", "adaptation": "$32.00\n$4.00\n$0.00" }, "font": { "family": "Geist", "file": "project/public/fonts/Geist.ttf", "pixels": 25, "weight": 400, "lineHeightPixels": 35.0, "letterSpacingPixels": 0, "fit": "No shrink or automatic wrapping. Text+ Size and baseline need actual installed-font calibration; the recipe pixel box is authoritative." } }, { "layerId": "checkout-total-label", "nodeId": "Layer_checkout-total-label", "kind": "text", "parentLayerId": "checkout-drawer", "recipePointer": "/layers/2/children/13/children/18", "mergeIndex": 18, "backgroundInput": "Merge_checkout-summary-values", "foregroundInput": "Processed_checkout-total-label", "output": "Merge_checkout-total-label", "activeLocalFrames": [ 36, 133 ], "effectiveActiveLocalFrames": [ 36, 133 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 36, "end": 133, "x": 30, "y": 838, "width": 410, "height": 48, "origin": [ 0, 0 ], "slot": "totalLabel", "fontSize": 28, "lineHeight": 1.25, "weight": 400, "color": "$ink" }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Text+ in bundled Geist", "Set explicit newline layout", "Stepped StyledText or Write On gate when present", "Local Transform", "Over Merge" ], "content": { "defaults": "Demo total", "adaptation": "Demo total" }, "font": { "family": "Geist", "file": "project/public/fonts/Geist.ttf", "pixels": 28, "weight": 400, "lineHeightPixels": 35.0, "letterSpacingPixels": 0, "fit": "No shrink or automatic wrapping. Text+ Size and baseline need actual installed-font calibration; the recipe pixel box is authoritative." } }, { "layerId": "checkout-total", "nodeId": "Layer_checkout-total", "kind": "text", "parentLayerId": "checkout-drawer", "recipePointer": "/layers/2/children/13/children/19", "mergeIndex": 19, "backgroundInput": "Merge_checkout-total-label", "foregroundInput": "Processed_checkout-total", "output": "Merge_checkout-total", "activeLocalFrames": [ 36, 133 ], "effectiveActiveLocalFrames": [ 36, 133 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 36, "end": 133, "x": 456, "y": 830, "width": 286, "height": 58, "origin": [ 0, 0 ], "slot": "total", "fontSize": 40, "lineHeight": 1.25, "weight": 600, "color": "$ink", "align": "right" }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Text+ in bundled Geist", "Set explicit newline layout", "Stepped StyledText or Write On gate when present", "Local Transform", "Over Merge" ], "content": { "defaults": "$52.00", "adaptation": "$36.00" }, "font": { "family": "Geist", "file": "project/public/fonts/Geist.ttf", "pixels": 40, "weight": 600, "lineHeightPixels": 50.0, "letterSpacingPixels": 0, "fit": "No shrink or automatic wrapping. Text+ Size and baseline need actual installed-font calibration; the recipe pixel box is authoritative." } }, { "layerId": "checkout-pay-button", "nodeId": "Layer_checkout-pay-button", "kind": "rect", "parentLayerId": "checkout-drawer", "recipePointer": "/layers/2/children/13/children/20", "mergeIndex": 20, "backgroundInput": "Merge_checkout-total", "foregroundInput": "Processed_checkout-pay-button", "output": "Merge_checkout-pay-button", "activeLocalFrames": [ 36, 133 ], "effectiveActiveLocalFrames": [ 36, 133 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 36, "end": 133, "x": 30, "y": 936, "width": 712, "height": 94, "origin": [ 0, 0 ], "fill": "#101211", "radius": 47 }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 47, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Background with Rectangle/Ellipse mask", "Inside-border ring if stroke is present", "Blur if present", "Local Transform", "Over Merge" ] }, { "layerId": "checkout-pay-label", "nodeId": "Layer_checkout-pay-label", "kind": "text", "parentLayerId": "checkout-drawer", "recipePointer": "/layers/2/children/13/children/21", "mergeIndex": 21, "backgroundInput": "Merge_checkout-pay-button", "foregroundInput": "Processed_checkout-pay-label", "output": "Merge_checkout-pay-label", "activeLocalFrames": [ 36, 133 ], "effectiveActiveLocalFrames": [ 36, 133 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 36, "end": 133, "x": 58, "y": 959, "width": 656, "height": 46, "origin": [ 0, 0 ], "slot": "pay", "fontSize": 32, "lineHeight": 1.25, "weight": 400, "color": "#ffffff", "align": "center" }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Text+ in bundled Geist", "Set explicit newline layout", "Stepped StyledText or Write On gate when present", "Local Transform", "Over Merge" ], "content": { "defaults": "Pay Mossworks", "adaptation": "Pay Paperwell" }, "font": { "family": "Geist", "file": "project/public/fonts/Geist.ttf", "pixels": 32, "weight": 400, "lineHeightPixels": 40.0, "letterSpacingPixels": 0, "fit": "No shrink or automatic wrapping. Text+ Size and baseline need actual installed-font calibration; the recipe pixel box is authoritative." } }, { "layerId": "action-pill", "nodeId": "Layer_action-pill", "kind": "group", "parentLayerId": null, "recipePointer": "/layers/3", "mergeIndex": 3, "backgroundInput": "Merge_detail-clip", "foregroundInput": "Processed_action-pill", "output": "Merge_action-pill", "activeLocalFrames": [ 133, 262 ], "effectiveActiveLocalFrames": [ 133, 262 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 133, "end": 262, "x": [ { "frame": 133, "value": 526, "easing": "hold" }, { "frame": 244, "value": 526, "easing": "smooth" }, { "frame": 261, "value": 866, "easing": "hold" } ], "y": [ { "frame": 133, "value": 436, "easing": "smooth" }, { "frame": 145, "value": 432, "easing": "hold" } ], "width": [ { "frame": 133, "value": 868, "easing": "hold" }, { "frame": 244, "value": 868, "easing": "smooth" }, { "frame": 261, "value": 188, "easing": "hold" } ], "height": 224, "origin": [ 434, 112 ], "fill": "#101211", "radius": 112, "overflow": "hidden", "scale": [ { "frame": 133, "value": 1, "easing": "hold" }, { "frame": 172, "value": 1, "easing": "smooth" }, { "frame": 175, "value": 0.985, "easing": "smooth" }, { "frame": 180, "value": 1, "easing": "hold" } ] }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 112, "overflow": "hidden", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 434, 112 ], "scale": [ { "frame": 133, "value": 1, "easing": "hold" }, { "frame": 172, "value": 1, "easing": "smooth" }, { "frame": 175, "value": 0.985, "easing": "smooth" }, { "frame": 180, "value": 1, "easing": "hold" } ], "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Transparent RGBA working domain", "Ordered child Merges", "Rounded Rectangle/Polygon alpha intersection if required", "Transform", "Group opacity", "Over Merge" ], "localFill": "#101211", "childLayerIds": [ "pay-label", "working-spinner", "working-label" ], "contentsInput": "Merge_working-label" }, { "layerId": "pay-label", "nodeId": "Layer_pay-label", "kind": "text", "parentLayerId": "action-pill", "recipePointer": "/layers/3/children/0", "mergeIndex": 0, "backgroundInput": "Transparent_action-pill", "foregroundInput": "Processed_pay-label", "output": "Merge_pay-label", "activeLocalFrames": [ 133, 176 ], "effectiveActiveLocalFrames": [ 133, 176 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 133, "end": 176, "x": 28, "y": 61, "width": 812, "height": 98, "origin": [ 0, 0 ], "slot": "pay", "fontSize": 66, "lineHeight": 1.25, "weight": 500, "color": "#ffffff", "align": "center" }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Text+ in bundled Geist", "Set explicit newline layout", "Stepped StyledText or Write On gate when present", "Local Transform", "Over Merge" ], "content": { "defaults": "Pay Mossworks", "adaptation": "Pay Paperwell" }, "font": { "family": "Geist", "file": "project/public/fonts/Geist.ttf", "pixels": 66, "weight": 500, "lineHeightPixels": 82.5, "letterSpacingPixels": 0, "fit": "No shrink or automatic wrapping. Text+ Size and baseline need actual installed-font calibration; the recipe pixel box is authoritative." } }, { "layerId": "working-spinner", "nodeId": "Layer_working-spinner", "kind": "image", "parentLayerId": "action-pill", "recipePointer": "/layers/3/children/1", "mergeIndex": 1, "backgroundInput": "Merge_pay-label", "foregroundInput": "Processed_working-spinner", "output": "Merge_working-spinner", "activeLocalFrames": [ 176, 262 ], "effectiveActiveLocalFrames": [ 176, 262 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 176, "end": 262, "x": 170, "y": 72, "width": 80, "height": 80, "origin": [ 40, 40 ], "slot": "spinnerArt", "fit": "contain", "rotation": [ { "frame": 176, "value": 0, "easing": "linear" }, { "frame": 262, "value": 1290, "easing": "hold" } ] }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 40, 40 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": [ { "frame": 176, "value": 0, "easing": "linear" }, { "frame": 262, "value": 1290, "easing": "hold" } ], "opacity": 1 }, "tools": [ "Native vector subgroup reconstructed from svgConstruction", "Fit Transform", "Local Transform", "Over Merge" ], "assets": { "defaults": { "kind": "image", "path": "art/payment-state-sequence/spinner-default.svg", "width": 80, "height": 80, "rights": "Original code-generated vector geometry authored for this kit. No source film imagery, logos, tracing, embedded bitmap or remote resource." }, "adaptation": { "kind": "image", "path": "art/payment-state-sequence/spinner-adaptation.svg", "width": 80, "height": 80, "rights": "Original code-generated vector geometry authored for this kit. No source film imagery, logos, tracing, embedded bitmap or remote resource." } }, "fitRule": "Use min(boxWidth/SVGWidth, boxHeight/SVGHeight), center the resulting artwork in the box, preserve SVG viewBox and alpha. These supplied boxes match their assets; no photographic crop." }, { "layerId": "working-label", "nodeId": "Layer_working-label", "kind": "text", "parentLayerId": "action-pill", "recipePointer": "/layers/3/children/2", "mergeIndex": 2, "backgroundInput": "Merge_working-spinner", "foregroundInput": "Processed_working-label", "output": "Merge_working-label", "activeLocalFrames": [ 176, 262 ], "effectiveActiveLocalFrames": [ 176, 262 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 176, "end": 262, "x": 290, "y": 61, "width": 540, "height": 100, "origin": [ 0, 0 ], "slot": "working", "fontSize": 64, "lineHeight": 1.25, "weight": 400, "color": "#ffffff", "opacity": [ { "frame": 176, "value": 0.12, "easing": "linear" }, { "frame": 188, "value": 1, "easing": "hold" } ] }, "alphaAndMasks": { "opacity": [ { "frame": 176, "value": 0.12, "easing": "linear" }, { "frame": 188, "value": 1, "easing": "hold" } ], "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": [ { "frame": 176, "value": 0.12, "easing": "linear" }, { "frame": 188, "value": 1, "easing": "hold" } ] }, "tools": [ "Text+ in bundled Geist", "Set explicit newline layout", "Stepped StyledText or Write On gate when present", "Local Transform", "Over Merge" ], "content": { "defaults": "Processing", "adaptation": "Processing" }, "font": { "family": "Geist", "file": "project/public/fonts/Geist.ttf", "pixels": 64, "weight": 400, "lineHeightPixels": 80.0, "letterSpacingPixels": 0, "fit": "No shrink or automatic wrapping. Text+ Size and baseline need actual installed-font calibration; the recipe pixel box is authoritative." } }, { "layerId": "success-rim", "nodeId": "Layer_success-rim", "kind": "rect", "parentLayerId": null, "recipePointer": "/layers/4", "mergeIndex": 4, "backgroundInput": "Merge_action-pill", "foregroundInput": "Processed_success-rim", "output": "Merge_success-rim", "activeLocalFrames": [ 262, 344 ], "effectiveActiveLocalFrames": [ 262, 344 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 262, "end": 344, "x": 534, "y": 0, "width": 852, "height": 1120, "origin": [ 0, 0 ], "fill": "#ffffff", "opacity": 0.34 }, "alphaAndMasks": { "opacity": 0.34, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 0.34 }, "tools": [ "Background with Rectangle/Ellipse mask", "Inside-border ring if stroke is present", "Blur if present", "Local Transform", "Over Merge" ] }, { "layerId": "success-column", "nodeId": "Layer_success-column", "kind": "group", "parentLayerId": null, "recipePointer": "/layers/5", "mergeIndex": 5, "backgroundInput": "Merge_success-rim", "foregroundInput": "Processed_success-column", "output": "Merge_success-column", "activeLocalFrames": [ 262, 344 ], "effectiveActiveLocalFrames": [ 262, 344 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 262, "end": 344, "x": 566, "y": [ { "frame": 262, "value": 0, "easing": "hold" }, { "frame": 328, "value": 0, "easing": "smooth" }, { "frame": 343, "value": -32, "easing": "hold" } ], "width": 788, "height": 1120, "origin": [ 0, 0 ], "fill": "$paper" }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Transparent RGBA working domain", "Ordered child Merges", "Rounded Rectangle/Polygon alpha intersection if required", "Transform", "Group opacity", "Over Merge" ], "localFill": "$paper", "childLayerIds": [ "success-merchant", "success-dot", "success-black-ring", "success-green-ripple", "success-disc", "success-check" ], "contentsInput": "Merge_success-check" }, { "layerId": "success-merchant", "nodeId": "Layer_success-merchant", "kind": "text", "parentLayerId": "success-column", "recipePointer": "/layers/5/children/0", "mergeIndex": 0, "backgroundInput": "Transparent_success-column", "foregroundInput": "Processed_success-merchant", "output": "Merge_success-merchant", "activeLocalFrames": [ 262, 344 ], "effectiveActiveLocalFrames": [ 262, 344 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 262, "end": 344, "x": 56, "y": 12, "width": 676, "height": 54, "origin": [ 0, 0 ], "slot": "merchant", "fontSize": 28, "lineHeight": 1.25, "weight": 600, "color": "$ink", "align": "center" }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Text+ in bundled Geist", "Set explicit newline layout", "Stepped StyledText or Write On gate when present", "Local Transform", "Over Merge" ], "content": { "defaults": "Mossworks", "adaptation": "Paperwell" }, "font": { "family": "Geist", "file": "project/public/fonts/Geist.ttf", "pixels": 28, "weight": 600, "lineHeightPixels": 35.0, "letterSpacingPixels": 0, "fit": "No shrink or automatic wrapping. Text+ Size and baseline need actual installed-font calibration; the recipe pixel box is authoritative." } }, { "layerId": "success-dot", "nodeId": "Layer_success-dot", "kind": "ellipse", "parentLayerId": "success-column", "recipePointer": "/layers/5/children/1", "mergeIndex": 1, "backgroundInput": "Merge_success-merchant", "foregroundInput": "Processed_success-dot", "output": "Merge_success-dot", "activeLocalFrames": [ 262, 280 ], "effectiveActiveLocalFrames": [ 262, 280 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 262, "end": 280, "x": 362, "y": 508, "width": 64, "height": 64, "origin": [ 32, 32 ], "fill": "#080b09", "scale": [ { "frame": 262, "value": 0.22, "easing": "smooth" }, { "frame": 270, "value": 1, "easing": "hold" } ] }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 32, 32 ], "scale": [ { "frame": 262, "value": 0.22, "easing": "smooth" }, { "frame": 270, "value": 1, "easing": "hold" } ], "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Background with Rectangle/Ellipse mask", "Inside-border ring if stroke is present", "Blur if present", "Local Transform", "Over Merge" ] }, { "layerId": "success-black-ring", "nodeId": "Layer_success-black-ring", "kind": "ellipse", "parentLayerId": "success-column", "recipePointer": "/layers/5/children/2", "mergeIndex": 2, "backgroundInput": "Merge_success-dot", "foregroundInput": "Processed_success-black-ring", "output": "Merge_success-black-ring", "activeLocalFrames": [ 266, 272 ], "effectiveActiveLocalFrames": [ 266, 272 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 266, "end": 272, "x": 312, "y": 458, "width": 164, "height": 164, "origin": [ 82, 82 ], "fill": "transparent", "stroke": "#080b09", "strokeWidth": 14, "scale": [ { "frame": 266, "value": 0.65, "easing": "smooth" }, { "frame": 271, "value": 1, "easing": "hold" } ] }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 82, 82 ], "scale": [ { "frame": 266, "value": 0.65, "easing": "smooth" }, { "frame": 271, "value": 1, "easing": "hold" } ], "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Background with Rectangle/Ellipse mask", "Inside-border ring if stroke is present", "Blur if present", "Local Transform", "Over Merge" ] }, { "layerId": "success-green-ripple", "nodeId": "Layer_success-green-ripple", "kind": "ellipse", "parentLayerId": "success-column", "recipePointer": "/layers/5/children/3", "mergeIndex": 3, "backgroundInput": "Merge_success-black-ring", "foregroundInput": "Processed_success-green-ripple", "output": "Merge_success-green-ripple", "activeLocalFrames": [ 272, 290 ], "effectiveActiveLocalFrames": [ 272, 290 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 272, "end": 290, "x": 306, "y": 452, "width": 176, "height": 176, "origin": [ 88, 88 ], "fill": "transparent", "stroke": "#32b94b", "strokeWidth": 9, "scale": [ { "frame": 272, "value": 0.92, "easing": "smooth" }, { "frame": 289, "value": 1.5, "easing": "hold" } ], "opacity": [ { "frame": 272, "value": 1, "easing": "linear" }, { "frame": 289, "value": 0, "easing": "hold" } ] }, "alphaAndMasks": { "opacity": [ { "frame": 272, "value": 1, "easing": "linear" }, { "frame": 289, "value": 0, "easing": "hold" } ], "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 88, 88 ], "scale": [ { "frame": 272, "value": 0.92, "easing": "smooth" }, { "frame": 289, "value": 1.5, "easing": "hold" } ], "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": [ { "frame": 272, "value": 1, "easing": "linear" }, { "frame": 289, "value": 0, "easing": "hold" } ] }, "tools": [ "Background with Rectangle/Ellipse mask", "Inside-border ring if stroke is present", "Blur if present", "Local Transform", "Over Merge" ] }, { "layerId": "success-disc", "nodeId": "Layer_success-disc", "kind": "ellipse", "parentLayerId": "success-column", "recipePointer": "/layers/5/children/4", "mergeIndex": 4, "backgroundInput": "Merge_success-green-ripple", "foregroundInput": "Processed_success-disc", "output": "Merge_success-disc", "activeLocalFrames": [ 280, 344 ], "effectiveActiveLocalFrames": [ 280, 344 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 280, "end": 344, "x": 300, "y": 446, "width": 188, "height": 188, "origin": [ 94, 94 ], "fill": "#2abd46", "scale": [ { "frame": 280, "value": 0.3, "easing": "smooth" }, { "frame": 290, "value": 1, "easing": "hold" } ] }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 94, 94 ], "scale": [ { "frame": 280, "value": 0.3, "easing": "smooth" }, { "frame": 290, "value": 1, "easing": "hold" } ], "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Background with Rectangle/Ellipse mask", "Inside-border ring if stroke is present", "Blur if present", "Local Transform", "Over Merge" ] }, { "layerId": "success-check", "nodeId": "Layer_success-check", "kind": "path", "parentLayerId": "success-column", "recipePointer": "/layers/5/children/5", "mergeIndex": 5, "backgroundInput": "Merge_success-disc", "foregroundInput": "Processed_success-check", "output": "Merge_success-check", "activeLocalFrames": [ 284, 344 ], "effectiveActiveLocalFrames": [ 284, 344 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 284, "end": 344, "x": 346, "y": 492, "width": 96, "height": 96, "origin": [ 0, 0 ], "path": "M12 34L26 48L54 14", "viewBox": [ 0, 0, 64, 64 ], "fill": "none", "stroke": "#ffffff", "strokeWidth": 7, "dashArray": 80, "dashOffset": [ { "frame": 284, "value": 80, "easing": "linear" }, { "frame": 294, "value": 0, "easing": "hold" } ] }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Polygon/Bezier fill/stroke using exact path/viewBox", "Path-length dash/trim when present", "Local Transform", "Over Merge" ], "strokeSemantics": "SVG default butt linecaps and miter joins; strokeWidth and dash units are in the path viewBox, not canvas pixels. Static SVG asset elements may explicitly override these defaults." }, { "layerId": "phone-rim", "nodeId": "Layer_phone-rim", "kind": "rect", "parentLayerId": null, "recipePointer": "/layers/6", "mergeIndex": 6, "backgroundInput": "Merge_success-column", "foregroundInput": "Processed_phone-rim", "output": "Merge_phone-rim", "activeLocalFrames": [ 344, 480 ], "effectiveActiveLocalFrames": [ 344, 480 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 344, "end": 480, "x": 726, "y": [ { "frame": 344, "value": 100, "easing": "smooth" }, { "frame": 375, "value": 92, "easing": "hold" }, { "frame": 400, "value": 92, "easing": "smooth" }, { "frame": 479, "value": 80, "easing": "hold" } ], "width": 468, "height": 914, "origin": [ 0, 0 ], "fill": "#ffffff", "radius": 86, "opacity": 0.52 }, "alphaAndMasks": { "opacity": 0.52, "radiusPixels": 86, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 0.52 }, "tools": [ "Background with Rectangle/Ellipse mask", "Inside-border ring if stroke is present", "Blur if present", "Local Transform", "Over Merge" ] }, { "layerId": "receipt-phone", "nodeId": "Layer_receipt-phone", "kind": "group", "parentLayerId": null, "recipePointer": "/layers/7", "mergeIndex": 7, "backgroundInput": "Merge_phone-rim", "foregroundInput": "Processed_receipt-phone", "output": "Merge_receipt-phone", "activeLocalFrames": [ 344, 480 ], "effectiveActiveLocalFrames": [ 344, 480 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 344, "end": 480, "x": 742, "y": [ { "frame": 344, "value": 116, "easing": "smooth" }, { "frame": 375, "value": 108, "easing": "hold" }, { "frame": 400, "value": 108, "easing": "smooth" }, { "frame": 479, "value": 96, "easing": "hold" } ], "width": 436, "height": 882, "origin": [ 0, 0 ], "fill": "$paper", "radius": 70, "overflow": "hidden" }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 70, "overflow": "hidden", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Transparent RGBA working domain", "Ordered child Merges", "Rounded Rectangle/Polygon alpha intersection if required", "Transform", "Group opacity", "Over Merge" ], "localFill": "$paper", "childLayerIds": [ "phone-time", "phone-signal", "phone-menu", "phone-app", "receipt-plate", "receipt-state-dot", "receipt-state", "receipt-thumb", "receipt-product", "receipt-labels", "receipt-values", "receipt-details-button", "receipt-details", "receipt-confirmation", "receipt-actions", "phone-composer", "phone-composer-label", "phone-home-bar" ], "contentsInput": "Merge_phone-home-bar" }, { "layerId": "phone-time", "nodeId": "Layer_phone-time", "kind": "text", "parentLayerId": "receipt-phone", "recipePointer": "/layers/7/children/0", "mergeIndex": 0, "backgroundInput": "Transparent_receipt-phone", "foregroundInput": "Processed_phone-time", "output": "Merge_phone-time", "activeLocalFrames": [ 344, 480 ], "effectiveActiveLocalFrames": [ 344, 480 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 344, "end": 480, "x": 48, "y": 32, "width": 110, "height": 30, "origin": [ 0, 0 ], "slot": "timeLabel", "fontSize": 17, "lineHeight": 1.25, "weight": 600, "color": "$ink" }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Text+ in bundled Geist", "Set explicit newline layout", "Stepped StyledText or Write On gate when present", "Local Transform", "Over Merge" ], "content": { "defaults": "09:41", "adaptation": "09:41" }, "font": { "family": "Geist", "file": "project/public/fonts/Geist.ttf", "pixels": 17, "weight": 600, "lineHeightPixels": 21.25, "letterSpacingPixels": 0, "fit": "No shrink or automatic wrapping. Text+ Size and baseline need actual installed-font calibration; the recipe pixel box is authoritative." } }, { "layerId": "phone-signal", "nodeId": "Layer_phone-signal", "kind": "rect", "parentLayerId": "receipt-phone", "recipePointer": "/layers/7/children/1", "mergeIndex": 1, "backgroundInput": "Merge_phone-time", "foregroundInput": "Processed_phone-signal", "output": "Merge_phone-signal", "activeLocalFrames": [ 344, 480 ], "effectiveActiveLocalFrames": [ 344, 480 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 344, "end": 480, "x": 344, "y": 36, "width": 40, "height": 10, "origin": [ 0, 0 ], "fill": "$ink", "radius": 4 }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 4, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Background with Rectangle/Ellipse mask", "Inside-border ring if stroke is present", "Blur if present", "Local Transform", "Over Merge" ] }, { "layerId": "phone-menu", "nodeId": "Layer_phone-menu", "kind": "path", "parentLayerId": "receipt-phone", "recipePointer": "/layers/7/children/2", "mergeIndex": 2, "backgroundInput": "Merge_phone-signal", "foregroundInput": "Processed_phone-menu", "output": "Merge_phone-menu", "activeLocalFrames": [ 344, 480 ], "effectiveActiveLocalFrames": [ 344, 480 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 344, "end": 480, "x": 32, "y": 74, "width": 27, "height": 27, "origin": [ 0, 0 ], "path": "M14 20H50M14 32H50M14 44H38", "viewBox": [ 0, 0, 64, 64 ], "fill": "none", "stroke": "$ink", "strokeWidth": 4 }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Polygon/Bezier fill/stroke using exact path/viewBox", "Path-length dash/trim when present", "Local Transform", "Over Merge" ], "strokeSemantics": "SVG default butt linecaps and miter joins; strokeWidth and dash units are in the path viewBox, not canvas pixels. Static SVG asset elements may explicitly override these defaults." }, { "layerId": "phone-app", "nodeId": "Layer_phone-app", "kind": "text", "parentLayerId": "receipt-phone", "recipePointer": "/layers/7/children/3", "mergeIndex": 3, "backgroundInput": "Merge_phone-menu", "foregroundInput": "Processed_phone-app", "output": "Merge_phone-app", "activeLocalFrames": [ 344, 480 ], "effectiveActiveLocalFrames": [ 344, 480 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 344, "end": 480, "x": 76, "y": 70, "width": 278, "height": 35, "origin": [ 0, 0 ], "slot": "appName", "fontSize": 22, "lineHeight": 1.25, "weight": 400, "color": "$ink" }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Text+ in bundled Geist", "Set explicit newline layout", "Stepped StyledText or Write On gate when present", "Local Transform", "Over Merge" ], "content": { "defaults": "Fieldshop", "adaptation": "Fieldshop" }, "font": { "family": "Geist", "file": "project/public/fonts/Geist.ttf", "pixels": 22, "weight": 400, "lineHeightPixels": 27.5, "letterSpacingPixels": 0, "fit": "No shrink or automatic wrapping. Text+ Size and baseline need actual installed-font calibration; the recipe pixel box is authoritative." } }, { "layerId": "receipt-plate", "nodeId": "Layer_receipt-plate", "kind": "rect", "parentLayerId": "receipt-phone", "recipePointer": "/layers/7/children/4", "mergeIndex": 4, "backgroundInput": "Merge_phone-app", "foregroundInput": "Processed_receipt-plate", "output": "Merge_receipt-plate", "activeLocalFrames": [ 344, 480 ], "effectiveActiveLocalFrames": [ 344, 480 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 344, "end": 480, "x": 28, "y": 126, "width": 380, "height": 390, "origin": [ 0, 0 ], "fill": "$paper", "radius": 25, "stroke": "#e3e9e5", "strokeWidth": 2 }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 25, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Background with Rectangle/Ellipse mask", "Inside-border ring if stroke is present", "Blur if present", "Local Transform", "Over Merge" ] }, { "layerId": "receipt-state-dot", "nodeId": "Layer_receipt-state-dot", "kind": "ellipse", "parentLayerId": "receipt-phone", "recipePointer": "/layers/7/children/5", "mergeIndex": 5, "backgroundInput": "Merge_receipt-plate", "foregroundInput": "Processed_receipt-state-dot", "output": "Merge_receipt-state-dot", "activeLocalFrames": [ 344, 480 ], "effectiveActiveLocalFrames": [ 344, 480 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 344, "end": 480, "x": 46, "y": 146, "width": 15, "height": 15, "origin": [ 0, 0 ], "fill": "#2abd46" }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Background with Rectangle/Ellipse mask", "Inside-border ring if stroke is present", "Blur if present", "Local Transform", "Over Merge" ] }, { "layerId": "receipt-state", "nodeId": "Layer_receipt-state", "kind": "text", "parentLayerId": "receipt-phone", "recipePointer": "/layers/7/children/6", "mergeIndex": 6, "backgroundInput": "Merge_receipt-state-dot", "foregroundInput": "Processed_receipt-state", "output": "Merge_receipt-state", "activeLocalFrames": [ 344, 480 ], "effectiveActiveLocalFrames": [ 344, 480 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 344, "end": 480, "x": 69, "y": 142, "width": 310, "height": 30, "origin": [ 0, 0 ], "slot": "complete", "fontSize": 17, "lineHeight": 1.25, "weight": 400, "color": "$ink" }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Text+ in bundled Geist", "Set explicit newline layout", "Stepped StyledText or Write On gate when present", "Local Transform", "Over Merge" ], "content": { "defaults": "Order recorded · demo", "adaptation": "Order recorded · demo" }, "font": { "family": "Geist", "file": "project/public/fonts/Geist.ttf", "pixels": 17, "weight": 400, "lineHeightPixels": 21.25, "letterSpacingPixels": 0, "fit": "No shrink or automatic wrapping. Text+ Size and baseline need actual installed-font calibration; the recipe pixel box is authoritative." } }, { "layerId": "receipt-thumb", "nodeId": "Layer_receipt-thumb", "kind": "image", "parentLayerId": "receipt-phone", "recipePointer": "/layers/7/children/7", "mergeIndex": 7, "backgroundInput": "Merge_receipt-state", "foregroundInput": "Processed_receipt-thumb", "output": "Merge_receipt-thumb", "activeLocalFrames": [ 344, 480 ], "effectiveActiveLocalFrames": [ 344, 480 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 344, "end": 480, "x": 46, "y": 190, "width": 136, "height": 91, "origin": [ 0, 0 ], "slot": "productArt", "fit": "contain" }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Native vector subgroup reconstructed from svgConstruction", "Fit Transform", "Local Transform", "Over Merge" ], "assets": { "defaults": { "kind": "image", "path": "art/payment-state-sequence/product-default.svg", "width": 480, "height": 320, "rights": "Original code-generated vector geometry authored for this kit. No source film imagery, logos, tracing, embedded bitmap or remote resource." }, "adaptation": { "kind": "image", "path": "art/payment-state-sequence/product-adaptation.svg", "width": 480, "height": 320, "rights": "Original code-generated vector geometry authored for this kit. No source film imagery, logos, tracing, embedded bitmap or remote resource." } }, "fitRule": "Use min(boxWidth/SVGWidth, boxHeight/SVGHeight), center the resulting artwork in the box, preserve SVG viewBox and alpha. These supplied boxes match their assets; no photographic crop." }, { "layerId": "receipt-product", "nodeId": "Layer_receipt-product", "kind": "text", "parentLayerId": "receipt-phone", "recipePointer": "/layers/7/children/8", "mergeIndex": 8, "backgroundInput": "Merge_receipt-thumb", "foregroundInput": "Processed_receipt-product", "output": "Merge_receipt-product", "activeLocalFrames": [ 344, 480 ], "effectiveActiveLocalFrames": [ 344, 480 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 344, "end": 480, "x": 198, "y": 190, "width": 178, "height": 86, "origin": [ 0, 0 ], "slot": "productShort", "fontSize": 22, "lineHeight": 1.25, "weight": 500, "color": "$ink" }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Text+ in bundled Geist", "Set explicit newline layout", "Stepped StyledText or Write On gate when present", "Local Transform", "Over Merge" ], "content": { "defaults": "Willow\nplanter set", "adaptation": "Studio\nnotebook kit" }, "font": { "family": "Geist", "file": "project/public/fonts/Geist.ttf", "pixels": 22, "weight": 500, "lineHeightPixels": 27.5, "letterSpacingPixels": 0, "fit": "No shrink or automatic wrapping. Text+ Size and baseline need actual installed-font calibration; the recipe pixel box is authoritative." } }, { "layerId": "receipt-labels", "nodeId": "Layer_receipt-labels", "kind": "text", "parentLayerId": "receipt-phone", "recipePointer": "/layers/7/children/9", "mergeIndex": 9, "backgroundInput": "Merge_receipt-product", "foregroundInput": "Processed_receipt-labels", "output": "Merge_receipt-labels", "activeLocalFrames": [ 344, 480 ], "effectiveActiveLocalFrames": [ 344, 480 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 344, "end": 480, "x": 46, "y": 322, "width": 164, "height": 99, "origin": [ 0, 0 ], "slot": "receiptLabels", "fontSize": 17, "lineHeight": 1.9, "weight": 400, "color": "$muted" }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Text+ in bundled Geist", "Set explicit newline layout", "Stepped StyledText or Write On gate when present", "Local Transform", "Over Merge" ], "content": { "defaults": "Quantity\nSold by\nDemo total", "adaptation": "Quantity\nSold by\nDemo total" }, "font": { "family": "Geist", "file": "project/public/fonts/Geist.ttf", "pixels": 17, "weight": 400, "lineHeightPixels": 32.3, "letterSpacingPixels": 0, "fit": "No shrink or automatic wrapping. Text+ Size and baseline need actual installed-font calibration; the recipe pixel box is authoritative." } }, { "layerId": "receipt-values", "nodeId": "Layer_receipt-values", "kind": "text", "parentLayerId": "receipt-phone", "recipePointer": "/layers/7/children/10", "mergeIndex": 10, "backgroundInput": "Merge_receipt-labels", "foregroundInput": "Processed_receipt-values", "output": "Merge_receipt-values", "activeLocalFrames": [ 344, 480 ], "effectiveActiveLocalFrames": [ 344, 480 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 344, "end": 480, "x": 214, "y": 322, "width": 174, "height": 99, "origin": [ 0, 0 ], "slot": "receiptValues", "fontSize": 17, "lineHeight": 1.9, "weight": 400, "color": "$ink", "align": "right" }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Text+ in bundled Geist", "Set explicit newline layout", "Stepped StyledText or Write On gate when present", "Local Transform", "Over Merge" ], "content": { "defaults": "1\nMossworks\n$52.00", "adaptation": "1\nPaperwell\n$36.00" }, "font": { "family": "Geist", "file": "project/public/fonts/Geist.ttf", "pixels": 17, "weight": 400, "lineHeightPixels": 32.3, "letterSpacingPixels": 0, "fit": "No shrink or automatic wrapping. Text+ Size and baseline need actual installed-font calibration; the recipe pixel box is authoritative." } }, { "layerId": "receipt-details-button", "nodeId": "Layer_receipt-details-button", "kind": "rect", "parentLayerId": "receipt-phone", "recipePointer": "/layers/7/children/11", "mergeIndex": 11, "backgroundInput": "Merge_receipt-values", "foregroundInput": "Processed_receipt-details-button", "output": "Merge_receipt-details-button", "activeLocalFrames": [ 344, 480 ], "effectiveActiveLocalFrames": [ 344, 480 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 344, "end": 480, "x": 46, "y": 452, "width": 342, "height": 42, "origin": [ 0, 0 ], "fill": "$paper", "stroke": "#edf0ed", "strokeWidth": 1, "radius": 21 }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 21, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Background with Rectangle/Ellipse mask", "Inside-border ring if stroke is present", "Blur if present", "Local Transform", "Over Merge" ] }, { "layerId": "receipt-details", "nodeId": "Layer_receipt-details", "kind": "text", "parentLayerId": "receipt-phone", "recipePointer": "/layers/7/children/12", "mergeIndex": 12, "backgroundInput": "Merge_receipt-details-button", "foregroundInput": "Processed_receipt-details", "output": "Merge_receipt-details", "activeLocalFrames": [ 344, 480 ], "effectiveActiveLocalFrames": [ 344, 480 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 344, "end": 480, "x": 58, "y": 461, "width": 318, "height": 26, "origin": [ 0, 0 ], "slot": "details", "fontSize": 17, "lineHeight": 1.25, "weight": 400, "color": "$ink", "align": "center" }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Text+ in bundled Geist", "Set explicit newline layout", "Stepped StyledText or Write On gate when present", "Local Transform", "Over Merge" ], "content": { "defaults": "View details", "adaptation": "View details" }, "font": { "family": "Geist", "file": "project/public/fonts/Geist.ttf", "pixels": 17, "weight": 400, "lineHeightPixels": 21.25, "letterSpacingPixels": 0, "fit": "No shrink or automatic wrapping. Text+ Size and baseline need actual installed-font calibration; the recipe pixel box is authoritative." } }, { "layerId": "receipt-confirmation", "nodeId": "Layer_receipt-confirmation", "kind": "text", "parentLayerId": "receipt-phone", "recipePointer": "/layers/7/children/13", "mergeIndex": 13, "backgroundInput": "Merge_receipt-details", "foregroundInput": "Processed_receipt-confirmation", "output": "Merge_receipt-confirmation", "activeLocalFrames": [ 376, 480 ], "effectiveActiveLocalFrames": [ 376, 480 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 376, "end": 480, "x": 30, "y": 548, "width": 378, "height": 112, "origin": [ 0, 0 ], "slot": "confirmation", "fontSize": 18, "lineHeight": 1.45, "weight": 400, "color": "$ink", "reveal": { "unit": "characters", "steps": [ { "frame": 376, "count": 0 }, { "frame": 383, "count": 22 }, { "frame": 394, "count": 48 }, { "frame": 405, "count": 80 }, { "frame": 417, "count": 112 }, { "frame": 430, "count": 180 } ] } }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Text+ in bundled Geist", "Set explicit newline layout", "Stepped StyledText or Write On gate when present", "Local Transform", "Over Merge" ], "content": { "defaults": "Your planter is on the sample order.\nThis is an illustrated receipt, not\na real purchase. Review the item\nand total in the details above.", "adaptation": "Your notebook is on the sample order.\nThis is an illustrated receipt, not\na real purchase. Review the item\nand total in the details above." }, "font": { "family": "Geist", "file": "project/public/fonts/Geist.ttf", "pixels": 18, "weight": 400, "lineHeightPixels": 26.099999999999998, "letterSpacingPixels": 0, "fit": "No shrink or automatic wrapping. Text+ Size and baseline need actual installed-font calibration; the recipe pixel box is authoritative." } }, { "layerId": "receipt-actions", "nodeId": "Layer_receipt-actions", "kind": "path", "parentLayerId": "receipt-phone", "recipePointer": "/layers/7/children/14", "mergeIndex": 14, "backgroundInput": "Merge_receipt-confirmation", "foregroundInput": "Processed_receipt-actions", "output": "Merge_receipt-actions", "activeLocalFrames": [ 435, 480 ], "effectiveActiveLocalFrames": [ 435, 480 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 435, "end": 480, "x": 34, "y": 668, "width": 120, "height": 36, "origin": [ 0, 0 ], "path": "M4 12H15V23H4ZM24 12H34V23H24ZM44 12H54V23H44", "viewBox": [ 0, 0, 64, 64 ], "fill": "none", "stroke": "$muted", "strokeWidth": 1.5 }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Polygon/Bezier fill/stroke using exact path/viewBox", "Path-length dash/trim when present", "Local Transform", "Over Merge" ], "strokeSemantics": "SVG default butt linecaps and miter joins; strokeWidth and dash units are in the path viewBox, not canvas pixels. Static SVG asset elements may explicitly override these defaults." }, { "layerId": "phone-composer", "nodeId": "Layer_phone-composer", "kind": "rect", "parentLayerId": "receipt-phone", "recipePointer": "/layers/7/children/15", "mergeIndex": 15, "backgroundInput": "Merge_receipt-actions", "foregroundInput": "Processed_phone-composer", "output": "Merge_phone-composer", "activeLocalFrames": [ 344, 480 ], "effectiveActiveLocalFrames": [ 344, 480 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 344, "end": 480, "x": 30, "y": 774, "width": 378, "height": 46, "origin": [ 0, 0 ], "fill": "$panel", "radius": 23 }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 23, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Background with Rectangle/Ellipse mask", "Inside-border ring if stroke is present", "Blur if present", "Local Transform", "Over Merge" ] }, { "layerId": "phone-composer-label", "nodeId": "Layer_phone-composer-label", "kind": "text", "parentLayerId": "receipt-phone", "recipePointer": "/layers/7/children/16", "mergeIndex": 16, "backgroundInput": "Merge_phone-composer", "foregroundInput": "Processed_phone-composer-label", "output": "Merge_phone-composer-label", "activeLocalFrames": [ 344, 480 ], "effectiveActiveLocalFrames": [ 344, 480 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 344, "end": 480, "x": 57, "y": 786, "width": 314, "height": 26, "origin": [ 0, 0 ], "slot": "composerHint", "fontSize": 17, "lineHeight": 1.25, "weight": 400, "color": "$muted" }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 0, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Text+ in bundled Geist", "Set explicit newline layout", "Stepped StyledText or Write On gate when present", "Local Transform", "Over Merge" ], "content": { "defaults": "Ask about this order", "adaptation": "Ask about this order" }, "font": { "family": "Geist", "file": "project/public/fonts/Geist.ttf", "pixels": 17, "weight": 400, "lineHeightPixels": 21.25, "letterSpacingPixels": 0, "fit": "No shrink or automatic wrapping. Text+ Size and baseline need actual installed-font calibration; the recipe pixel box is authoritative." } }, { "layerId": "phone-home-bar", "nodeId": "Layer_phone-home-bar", "kind": "rect", "parentLayerId": "receipt-phone", "recipePointer": "/layers/7/children/17", "mergeIndex": 17, "backgroundInput": "Merge_phone-composer-label", "foregroundInput": "Processed_phone-home-bar", "output": "Merge_phone-home-bar", "activeLocalFrames": [ 344, 480 ], "effectiveActiveLocalFrames": [ 344, 480 ], "frameConvention": "Global zero-based recipe clock, not frame minus layer start. Gates are half-open.", "controls": { "start": 344, "end": 480, "x": 144, "y": 846, "width": 148, "height": 5, "origin": [ 0, 0 ], "fill": "$ink", "radius": 3 }, "alphaAndMasks": { "opacity": 1, "radiusPixels": 3, "overflow": "visible", "clip": null, "insetClipIsIndependentOfOverflow": true, "order": "Draw or merge local content; apply the listed local effects and alpha masks. The explicit inset clip always applies, independently of overflow. Rounded descendant clipping requires overflow:hidden. Apply the local transform and whole-layer opacity before ordered Over into the parent." }, "defaultTransform": { "originPixels": [ 0, 0 ], "scale": 1, "scaleX": 1, "scaleY": 1, "rotation": 0, "opacity": 1 }, "tools": [ "Background with Rectangle/Ellipse mask", "Inside-border ring if stroke is present", "Blur if present", "Local Transform", "Over Merge" ] } ] svgConstruction { "art/payment-state-sequence/product-default.svg": { "sha256": "5a4dd7c17b5c8d9679e63f758897809aa9137fea23a55ef9fd507194f480c5a1", "construction": { "element": "svg", "attributes": { "width": "480", "height": "320", "viewBox": "0 0 480 320" }, "children": [ { "element": "defs", "attributes": {}, "children": [ { "element": "linearGradient", "attributes": { "id": "clay" }, "children": [ { "element": "stop", "attributes": { "stop-color": "#be7f57" }, "children": [] }, { "element": "stop", "attributes": { "offset": ".5", "stop-color": "#dbad83" }, "children": [] }, { "element": "stop", "attributes": { "offset": "1", "stop-color": "#a96d4e" }, "children": [] } ] }, { "element": "linearGradient", "attributes": { "id": "leaf", "x1": "0", "y1": "0", "x2": "1", "y2": "1" }, "children": [ { "element": "stop", "attributes": { "stop-color": "#507868" }, "children": [] }, { "element": "stop", "attributes": { "offset": "1", "stop-color": "#264c3d" }, "children": [] } ] } ] }, { "element": "rect", "attributes": { "width": "480", "height": "320", "fill": "#e9e5db" }, "children": [] }, { "element": "path", "attributes": { "d": "M0 243L480 199V320H0Z", "fill": "#d8d5c9" }, "children": [] }, { "element": "ellipse", "attributes": { "cx": "258", "cy": "276", "rx": "124", "ry": "20", "fill": "#5b6256", "opacity": ".15" }, "children": [] }, { "element": "path", "attributes": { "d": "M162 155H330L306 274Q246 297 184 274Z", "fill": "url(#clay)" }, "children": [] }, { "element": "ellipse", "attributes": { "cx": "246", "cy": "155", "rx": "84", "ry": "23", "fill": "#cb946c" }, "children": [] }, { "element": "ellipse", "attributes": { "cx": "246", "cy": "155", "rx": "68", "ry": "15", "fill": "#57473b" }, "children": [] }, { "element": "path", "attributes": { "d": "M246 167C240 122 232 81 220 39M245 152C259 115 280 76 308 48M241 138C207 128 177 102 162 75", "fill": "none", "stroke": "#375944", "stroke-width": "5" }, "children": [] }, { "element": "path", "attributes": { "d": "M221 54Q167 34 176 71Q194 98 230 92Q268 51 238 22Q213 18 221 54ZM272 106Q254 57 286 58Q307 74 291 94Q344 63 354 91Q352 122 272 106ZM211 127Q157 100 140 119Q143 148 211 127Z", "fill": "url(#leaf)" }, "children": [] }, { "element": "path", "attributes": { "d": "M186 187Q245 204 314 181M190 241Q244 259 306 238", "fill": "none", "stroke": "#eed0b1", "stroke-width": "2", "opacity": ".5" }, "children": [] } ] }, "authorship": "Original parameterized SVG; no image source, trace or conversion.", "nativeRebuild": "Use each explicit SVG element as a separate filled/masked vector node. Gradient coordinates without units are objectBoundingBox; x right, y down. Carry stop-opacity through alpha, not a solid-color approximation." }, "art/payment-state-sequence/spinner-default.svg": { "sha256": "63f1e00e21cbdb5c5c52d4a7857d30f8d710cd5811a06dc1178cb0a877aa2ae9", "construction": { "element": "svg", "attributes": { "width": "80", "height": "80", "viewBox": "0 0 80 80" }, "children": [ { "element": "path", "attributes": { "d": "M40.0000 17.0000L40.0000 6.0000", "fill": "none", "stroke": "#ffffff", "stroke-width": "5", "stroke-linecap": "round", "opacity": "1.00" }, "children": [] }, { "element": "path", "attributes": { "d": "M56.2635 23.7365L64.0416 15.9584", "fill": "none", "stroke": "#ffffff", "stroke-width": "5", "stroke-linecap": "round", "opacity": "0.90" }, "children": [] }, { "element": "path", "attributes": { "d": "M63.0000 40.0000L74.0000 40.0000", "fill": "none", "stroke": "#ffffff", "stroke-width": "5", "stroke-linecap": "round", "opacity": "0.80" }, "children": [] }, { "element": "path", "attributes": { "d": "M56.2635 56.2635L64.0416 64.0416", "fill": "none", "stroke": "#ffffff", "stroke-width": "5", "stroke-linecap": "round", "opacity": "0.70" }, "children": [] }, { "element": "path", "attributes": { "d": "M40.0000 63.0000L40.0000 74.0000", "fill": "none", "stroke": "#ffffff", "stroke-width": "5", "stroke-linecap": "round", "opacity": "0.60" }, "children": [] }, { "element": "path", "attributes": { "d": "M23.7365 56.2635L15.9584 64.0416", "fill": "none", "stroke": "#ffffff", "stroke-width": "5", "stroke-linecap": "round", "opacity": "0.50" }, "children": [] }, { "element": "path", "attributes": { "d": "M17.0000 40.0000L6.0000 40.0000", "fill": "none", "stroke": "#ffffff", "stroke-width": "5", "stroke-linecap": "round", "opacity": "0.40" }, "children": [] }, { "element": "path", "attributes": { "d": "M23.7365 23.7365L15.9584 15.9584", "fill": "none", "stroke": "#ffffff", "stroke-width": "5", "stroke-linecap": "round", "opacity": "0.30" }, "children": [] } ] }, "authorship": "Original parameterized SVG; no image source, trace or conversion.", "nativeRebuild": "Use each explicit SVG element as a separate filled/masked vector node. Gradient coordinates without units are objectBoundingBox; x right, y down. Carry stop-opacity through alpha, not a solid-color approximation." }, "art/payment-state-sequence/field-default.svg": { "sha256": "3fe3f674a2d468aa23f15adccc5ebf62f93f1e673891bebf4ba1464e600bb1ba", "construction": { "element": "svg", "attributes": { "width": "1920", "height": "1080", "viewBox": "0 0 1920 1080" }, "children": [ { "element": "defs", "attributes": {}, "children": [ { "element": "linearGradient", "attributes": { "id": "base", "x1": "0", "y1": "0", "x2": "1", "y2": "1" }, "children": [ { "element": "stop", "attributes": { "stop-color": "#c1d7f4" }, "children": [] }, { "element": "stop", "attributes": { "offset": ".54", "stop-color": "#dbcaf2" }, "children": [] }, { "element": "stop", "attributes": { "offset": "1", "stop-color": "#f4dce8" }, "children": [] } ] }, { "element": "radialGradient", "attributes": { "id": "glow" }, "children": [ { "element": "stop", "attributes": { "stop-color": "#ffffff", "stop-opacity": ".84" }, "children": [] }, { "element": "stop", "attributes": { "offset": "1", "stop-color": "#ffffff", "stop-opacity": "0" }, "children": [] } ] }, { "element": "radialGradient", "attributes": { "id": "wash" }, "children": [ { "element": "stop", "attributes": { "stop-color": "#819be7", "stop-opacity": ".66" }, "children": [] }, { "element": "stop", "attributes": { "offset": "1", "stop-color": "#819be7", "stop-opacity": "0" }, "children": [] } ] } ] }, { "element": "rect", "attributes": { "width": "1920", "height": "1080", "fill": "url(#base)" }, "children": [] }, { "element": "ellipse", "attributes": { "cx": "510", "cy": "240", "rx": "690", "ry": "800", "fill": "url(#glow)" }, "children": [] }, { "element": "ellipse", "attributes": { "cx": "1370", "cy": "1020", "rx": "840", "ry": "620", "fill": "url(#glow)" }, "children": [] }, { "element": "ellipse", "attributes": { "cx": "730", "cy": "1090", "rx": "650", "ry": "710", "fill": "url(#wash)" }, "children": [] } ] }, "authorship": "Original parameterized SVG; no image source, trace or conversion.", "nativeRebuild": "Use each explicit SVG element as a separate filled/masked vector node. Gradient coordinates without units are objectBoundingBox; x right, y down. Carry stop-opacity through alpha, not a solid-color approximation." }, "art/payment-state-sequence/product-adaptation.svg": { "sha256": "14f928f2146028316607a36ff04dfbcbf496e2cc73c9decb7b5ef3e87d2c24f5", "construction": { "element": "svg", "attributes": { "width": "480", "height": "320", "viewBox": "0 0 480 320" }, "children": [ { "element": "defs", "attributes": {}, "children": [ { "element": "linearGradient", "attributes": { "id": "cover", "x1": "0", "y1": "0", "x2": "1", "y2": "1" }, "children": [ { "element": "stop", "attributes": { "stop-color": "#597789" }, "children": [] }, { "element": "stop", "attributes": { "offset": "1", "stop-color": "#304c61" }, "children": [] } ] }, { "element": "linearGradient", "attributes": { "id": "paper" }, "children": [ { "element": "stop", "attributes": { "stop-color": "#fff6df" }, "children": [] }, { "element": "stop", "attributes": { "offset": "1", "stop-color": "#d9ccb1" }, "children": [] } ] } ] }, { "element": "rect", "attributes": { "width": "480", "height": "320", "fill": "#e8e2d8" }, "children": [] }, { "element": "path", "attributes": { "d": "M0 263L480 208V320H0Z", "fill": "#d6d2c8" }, "children": [] }, { "element": "ellipse", "attributes": { "cx": "256", "cy": "261", "rx": "153", "ry": "22", "fill": "#36444a", "opacity": ".14" }, "children": [] }, { "element": "path", "attributes": { "d": "M106 96L289 67L350 244L156 276Z", "fill": "#253d50" }, "children": [] }, { "element": "path", "attributes": { "d": "M117 96L290 69L342 230L161 261Z", "fill": "url(#paper)" }, "children": [] }, { "element": "path", "attributes": { "d": "M109 79L289 49L342 218L156 250Z", "fill": "url(#cover)" }, "children": [] }, { "element": "path", "attributes": { "d": "M137 75L183 245", "stroke": "#94acb5", "stroke-width": "3" }, "children": [] }, { "element": "path", "attributes": { "d": "M221 62L265 232", "stroke": "#162e3e", "stroke-width": "11" }, "children": [] }, { "element": "path", "attributes": { "d": "M156 255L336 225M158 261L338 232", "stroke": "#b5a78e", "stroke-width": "2" }, "children": [] }, { "element": "path", "attributes": { "d": "M326 92L342 87L392 244L378 249Z", "fill": "#c99553" }, "children": [] }, { "element": "path", "attributes": { "d": "M378 249L392 244L391 272Z", "fill": "#edd9b4" }, "children": [] }, { "element": "path", "attributes": { "d": "M386 265L391 272L391 261Z", "fill": "#3b454a" }, "children": [] } ] }, "authorship": "Original parameterized SVG; no image source, trace or conversion.", "nativeRebuild": "Use each explicit SVG element as a separate filled/masked vector node. Gradient coordinates without units are objectBoundingBox; x right, y down. Carry stop-opacity through alpha, not a solid-color approximation." }, "art/payment-state-sequence/spinner-adaptation.svg": { "sha256": "63f1e00e21cbdb5c5c52d4a7857d30f8d710cd5811a06dc1178cb0a877aa2ae9", "construction": { "element": "svg", "attributes": { "width": "80", "height": "80", "viewBox": "0 0 80 80" }, "children": [ { "element": "path", "attributes": { "d": "M40.0000 17.0000L40.0000 6.0000", "fill": "none", "stroke": "#ffffff", "stroke-width": "5", "stroke-linecap": "round", "opacity": "1.00" }, "children": [] }, { "element": "path", "attributes": { "d": "M56.2635 23.7365L64.0416 15.9584", "fill": "none", "stroke": "#ffffff", "stroke-width": "5", "stroke-linecap": "round", "opacity": "0.90" }, "children": [] }, { "element": "path", "attributes": { "d": "M63.0000 40.0000L74.0000 40.0000", "fill": "none", "stroke": "#ffffff", "stroke-width": "5", "stroke-linecap": "round", "opacity": "0.80" }, "children": [] }, { "element": "path", "attributes": { "d": "M56.2635 56.2635L64.0416 64.0416", "fill": "none", "stroke": "#ffffff", "stroke-width": "5", "stroke-linecap": "round", "opacity": "0.70" }, "children": [] }, { "element": "path", "attributes": { "d": "M40.0000 63.0000L40.0000 74.0000", "fill": "none", "stroke": "#ffffff", "stroke-width": "5", "stroke-linecap": "round", "opacity": "0.60" }, "children": [] }, { "element": "path", "attributes": { "d": "M23.7365 56.2635L15.9584 64.0416", "fill": "none", "stroke": "#ffffff", "stroke-width": "5", "stroke-linecap": "round", "opacity": "0.50" }, "children": [] }, { "element": "path", "attributes": { "d": "M17.0000 40.0000L6.0000 40.0000", "fill": "none", "stroke": "#ffffff", "stroke-width": "5", "stroke-linecap": "round", "opacity": "0.40" }, "children": [] }, { "element": "path", "attributes": { "d": "M23.7365 23.7365L15.9584 15.9584", "fill": "none", "stroke": "#ffffff", "stroke-width": "5", "stroke-linecap": "round", "opacity": "0.30" }, "children": [] } ] }, "authorship": "Original parameterized SVG; no image source, trace or conversion.", "nativeRebuild": "Use each explicit SVG element as a separate filled/masked vector node. Gradient coordinates without units are objectBoundingBox; x right, y down. Carry stop-opacity through alpha, not a solid-color approximation." }, "art/payment-state-sequence/field-adaptation.svg": { "sha256": "f65c221328d5f64ba5d276fb8b5da125144098a469a1b84ac5dc2ac3ed55e936", "construction": { "element": "svg", "attributes": { "width": "1920", "height": "1080", "viewBox": "0 0 1920 1080" }, "children": [ { "element": "defs", "attributes": {}, "children": [ { "element": "linearGradient", "attributes": { "id": "base", "x1": "0", "y1": "0", "x2": "1", "y2": "1" }, "children": [ { "element": "stop", "attributes": { "stop-color": "#ccd9e6" }, "children": [] }, { "element": "stop", "attributes": { "offset": ".54", "stop-color": "#d2d4ed" }, "children": [] }, { "element": "stop", "attributes": { "offset": "1", "stop-color": "#f2dfd5" }, "children": [] } ] }, { "element": "radialGradient", "attributes": { "id": "glow" }, "children": [ { "element": "stop", "attributes": { "stop-color": "#ffffff", "stop-opacity": ".84" }, "children": [] }, { "element": "stop", "attributes": { "offset": "1", "stop-color": "#ffffff", "stop-opacity": "0" }, "children": [] } ] }, { "element": "radialGradient", "attributes": { "id": "wash" }, "children": [ { "element": "stop", "attributes": { "stop-color": "#969ec5", "stop-opacity": ".66" }, "children": [] }, { "element": "stop", "attributes": { "offset": "1", "stop-color": "#969ec5", "stop-opacity": "0" }, "children": [] } ] } ] }, { "element": "rect", "attributes": { "width": "1920", "height": "1080", "fill": "url(#base)" }, "children": [] }, { "element": "ellipse", "attributes": { "cx": "510", "cy": "240", "rx": "690", "ry": "800", "fill": "url(#glow)" }, "children": [] }, { "element": "ellipse", "attributes": { "cx": "1370", "cy": "1020", "rx": "840", "ry": "620", "fill": "url(#glow)" }, "children": [] }, { "element": "ellipse", "attributes": { "cx": "730", "cy": "1090", "rx": "650", "ry": "710", "fill": "url(#wash)" }, "children": [] } ] }, "authorship": "Original parameterized SVG; no image source, trace or conversion.", "nativeRebuild": "Use each explicit SVG element as a separate filled/masked vector node. Gradient coordinates without units are objectBoundingBox; x right, y down. Carry stop-opacity through alpha, not a solid-color approximation." } } tracks [ { "layerId": "context-field", "property": "x", "value": [ { "frame": 0, "value": -64, "easing": "smooth" }, { "frame": 479, "value": -24, "easing": "hold" } ], "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "context-field", "property": "y", "value": [ { "frame": 0, "value": -36, "easing": "smooth" }, { "frame": 479, "value": -12, "easing": "hold" } ], "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "context-field", "property": "width", "value": 2048, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "context-field", "property": "height", "value": 1152, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "detail-rim", "property": "x", "value": 550, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "detail-rim", "property": "y", "value": -32, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "detail-rim", "property": "width", "value": 820, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "detail-rim", "property": "height", "value": 1200, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "detail-rim", "property": "opacity", "value": 0.36, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "detail-clip", "property": "x", "value": 574, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "detail-clip", "property": "y", "value": -32, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "detail-clip", "property": "width", "value": 772, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "detail-clip", "property": "height", "value": 1180, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "product-hero", "property": "x", "value": 0, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "product-hero", "property": "y", "value": 0, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "product-hero", "property": "width", "value": 772, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "product-hero", "property": "height", "value": 515, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "product-title", "property": "x", "value": 30, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "product-title", "property": "y", "value": 548, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "product-title", "property": "width", "value": 714, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "product-title", "property": "height", "value": 58, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "option-label", "property": "x", "value": 30, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "option-label", "property": "y", "value": 636, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "option-label", "property": "width", "value": 710, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "option-label", "property": "height", "value": 42, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "option-border", "property": "x", "value": 30, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "option-border", "property": "y", "value": 690, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "option-border", "property": "width", "value": 712, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "option-border", "property": "height", "value": 90, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "option-border", "property": "radius", "value": 28, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "option-value", "property": "x", "value": 62, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "option-value", "property": "y", "value": 712, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "option-value", "property": "width", "value": 620, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "option-value", "property": "height", "value": 44, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "option-chevron", "property": "x", "value": 676, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "option-chevron", "property": "y", "value": 714, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "option-chevron", "property": "width", "value": 32, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "option-chevron", "property": "height", "value": 32, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "product-merchant", "property": "x", "value": 30, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "product-merchant", "property": "y", "value": 844, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "product-merchant", "property": "width", "value": 420, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "product-merchant", "property": "height", "value": 48, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "product-note", "property": "x", "value": 30, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "product-note", "property": "y", "value": 892, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "product-note", "property": "width", "value": 470, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "product-note", "property": "height", "value": 42, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "product-price", "property": "x", "value": 502, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "product-price", "property": "y", "value": 880, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "product-price", "property": "width", "value": 142, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "product-price", "property": "height", "value": 46, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "buy-button", "property": "x", "value": 654, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "buy-button", "property": "y", "value": 864, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "buy-button", "property": "width", "value": 88, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "buy-button", "property": "height", "value": 64, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "buy-button", "property": "radius", "value": 32, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "buy-label", "property": "x", "value": 661, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "buy-label", "property": "y", "value": 883, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "buy-label", "property": "width", "value": 74, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "buy-label", "property": "height", "value": 32, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-hint", "property": "x", "value": 30, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-hint", "property": "y", "value": 956, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-hint", "property": "width", "value": 710, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-hint", "property": "height", "value": 42, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "detail-dim", "property": "x", "value": 0, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "detail-dim", "property": "y", "value": 0, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "detail-dim", "property": "width", "value": 772, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "detail-dim", "property": "height", "value": 1180, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "detail-dim", "property": "opacity", "value": [ { "frame": 32, "value": 0, "easing": "linear" }, { "frame": 43, "value": 0.18, "easing": "hold" } ], "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-drawer", "property": "x", "value": [ { "frame": 36, "value": 772, "easing": "smooth" }, { "frame": 76, "value": 0, "easing": "hold" } ], "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-drawer", "property": "y", "value": [ { "frame": 36, "value": 0, "easing": "hold" }, { "frame": 92, "value": 0, "easing": "smooth" }, { "frame": 132, "value": -48, "easing": "hold" } ], "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-drawer", "property": "width", "value": 772, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-drawer", "property": "height", "value": 1180, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-thumb", "property": "x", "value": 30, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-thumb", "property": "y", "value": 42, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-thumb", "property": "width", "value": 240, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-thumb", "property": "height", "value": 160, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-title", "property": "x", "value": 306, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-title", "property": "y", "value": 42, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-title", "property": "width", "value": 422, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-title", "property": "height", "value": 104, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "quantity-plate", "property": "x", "value": 306, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "quantity-plate", "property": "y", "value": 164, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "quantity-plate", "property": "width", "value": 210, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "quantity-plate", "property": "height", "value": 68, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "quantity-plate", "property": "radius", "value": 22, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "quantity-value", "property": "x", "value": 322, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "quantity-value", "property": "y", "value": 181, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "quantity-value", "property": "width", "value": 176, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "quantity-value", "property": "height", "value": 40, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-rule-0", "property": "x", "value": 30, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-rule-0", "property": "y", "value": 268, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-rule-0", "property": "width", "value": 712, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-rule-0", "property": "height", "value": 2, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-icon-0", "property": "x", "value": 40, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-icon-0", "property": "y", "value": 299, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-icon-0", "property": "width", "value": 48, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-icon-0", "property": "height", "value": 48, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-row-0", "property": "x", "value": 116, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-row-0", "property": "y", "value": 290, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-row-0", "property": "width", "value": 570, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-row-0", "property": "height", "value": 42, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-subrow-0", "property": "x", "value": 116, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-subrow-0", "property": "y", "value": 336, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-subrow-0", "property": "width", "value": 570, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-subrow-0", "property": "height", "value": 36, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-rule-1", "property": "x", "value": 30, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-rule-1", "property": "y", "value": 388, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-rule-1", "property": "width", "value": 712, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-rule-1", "property": "height", "value": 2, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-icon-1", "property": "x", "value": 40, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-icon-1", "property": "y", "value": 419, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-icon-1", "property": "width", "value": 48, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-icon-1", "property": "height", "value": 48, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-row-1", "property": "x", "value": 116, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-row-1", "property": "y", "value": 410, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-row-1", "property": "width", "value": 570, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-row-1", "property": "height", "value": 42, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-subrow-1", "property": "x", "value": 116, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-subrow-1", "property": "y", "value": 456, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-subrow-1", "property": "width", "value": 570, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-subrow-1", "property": "height", "value": 36, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-rule-2", "property": "x", "value": 30, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-rule-2", "property": "y", "value": 508, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-rule-2", "property": "width", "value": 712, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-rule-2", "property": "height", "value": 2, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-icon-2", "property": "x", "value": 40, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-icon-2", "property": "y", "value": 539, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-icon-2", "property": "width", "value": 48, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-icon-2", "property": "height", "value": 48, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-row-2", "property": "x", "value": 116, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-row-2", "property": "y", "value": 530, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-row-2", "property": "width", "value": 570, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-row-2", "property": "height", "value": 42, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-subrow-2", "property": "x", "value": 116, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-subrow-2", "property": "y", "value": 576, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-subrow-2", "property": "width", "value": 570, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-subrow-2", "property": "height", "value": 36, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-summary-labels", "property": "x", "value": 30, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-summary-labels", "property": "y", "value": 684, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-summary-labels", "property": "width", "value": 370, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-summary-labels", "property": "height", "value": 112, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-summary-values", "property": "x", "value": 434, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-summary-values", "property": "y", "value": 684, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-summary-values", "property": "width", "value": 308, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-summary-values", "property": "height", "value": 112, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-total-label", "property": "x", "value": 30, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-total-label", "property": "y", "value": 838, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-total-label", "property": "width", "value": 410, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-total-label", "property": "height", "value": 48, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-total", "property": "x", "value": 456, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-total", "property": "y", "value": 830, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-total", "property": "width", "value": 286, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-total", "property": "height", "value": 58, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-pay-button", "property": "x", "value": 30, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-pay-button", "property": "y", "value": 936, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-pay-button", "property": "width", "value": 712, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-pay-button", "property": "height", "value": 94, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-pay-button", "property": "radius", "value": 47, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-pay-label", "property": "x", "value": 58, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-pay-label", "property": "y", "value": 959, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-pay-label", "property": "width", "value": 656, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "checkout-pay-label", "property": "height", "value": 46, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "action-pill", "property": "x", "value": [ { "frame": 133, "value": 526, "easing": "hold" }, { "frame": 244, "value": 526, "easing": "smooth" }, { "frame": 261, "value": 866, "easing": "hold" } ], "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "action-pill", "property": "y", "value": [ { "frame": 133, "value": 436, "easing": "smooth" }, { "frame": 145, "value": 432, "easing": "hold" } ], "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "action-pill", "property": "width", "value": [ { "frame": 133, "value": 868, "easing": "hold" }, { "frame": 244, "value": 868, "easing": "smooth" }, { "frame": 261, "value": 188, "easing": "hold" } ], "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "action-pill", "property": "height", "value": 224, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "action-pill", "property": "scale", "value": [ { "frame": 133, "value": 1, "easing": "hold" }, { "frame": 172, "value": 1, "easing": "smooth" }, { "frame": 175, "value": 0.985, "easing": "smooth" }, { "frame": 180, "value": 1, "easing": "hold" } ], "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "action-pill", "property": "radius", "value": 112, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "pay-label", "property": "x", "value": 28, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "pay-label", "property": "y", "value": 61, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "pay-label", "property": "width", "value": 812, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "pay-label", "property": "height", "value": 98, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "working-spinner", "property": "x", "value": 170, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "working-spinner", "property": "y", "value": 72, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "working-spinner", "property": "width", "value": 80, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "working-spinner", "property": "height", "value": 80, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "working-spinner", "property": "rotation", "value": [ { "frame": 176, "value": 0, "easing": "linear" }, { "frame": 262, "value": 1290, "easing": "hold" } ], "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "working-label", "property": "x", "value": 290, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "working-label", "property": "y", "value": 61, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "working-label", "property": "width", "value": 540, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "working-label", "property": "height", "value": 100, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "working-label", "property": "opacity", "value": [ { "frame": 176, "value": 0.12, "easing": "linear" }, { "frame": 188, "value": 1, "easing": "hold" } ], "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "success-rim", "property": "x", "value": 534, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "success-rim", "property": "y", "value": 0, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "success-rim", "property": "width", "value": 852, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "success-rim", "property": "height", "value": 1120, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "success-rim", "property": "opacity", "value": 0.34, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "success-column", "property": "x", "value": 566, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "success-column", "property": "y", "value": [ { "frame": 262, "value": 0, "easing": "hold" }, { "frame": 328, "value": 0, "easing": "smooth" }, { "frame": 343, "value": -32, "easing": "hold" } ], "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "success-column", "property": "width", "value": 788, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "success-column", "property": "height", "value": 1120, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "success-merchant", "property": "x", "value": 56, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "success-merchant", "property": "y", "value": 12, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "success-merchant", "property": "width", "value": 676, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "success-merchant", "property": "height", "value": 54, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "success-dot", "property": "x", "value": 362, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "success-dot", "property": "y", "value": 508, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "success-dot", "property": "width", "value": 64, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "success-dot", "property": "height", "value": 64, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "success-dot", "property": "scale", "value": [ { "frame": 262, "value": 0.22, "easing": "smooth" }, { "frame": 270, "value": 1, "easing": "hold" } ], "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "success-black-ring", "property": "x", "value": 312, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "success-black-ring", "property": "y", "value": 458, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "success-black-ring", "property": "width", "value": 164, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "success-black-ring", "property": "height", "value": 164, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "success-black-ring", "property": "scale", "value": [ { "frame": 266, "value": 0.65, "easing": "smooth" }, { "frame": 271, "value": 1, "easing": "hold" } ], "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "success-green-ripple", "property": "x", "value": 306, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "success-green-ripple", "property": "y", "value": 452, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "success-green-ripple", "property": "width", "value": 176, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "success-green-ripple", "property": "height", "value": 176, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "success-green-ripple", "property": "scale", "value": [ { "frame": 272, "value": 0.92, "easing": "smooth" }, { "frame": 289, "value": 1.5, "easing": "hold" } ], "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "success-green-ripple", "property": "opacity", "value": [ { "frame": 272, "value": 1, "easing": "linear" }, { "frame": 289, "value": 0, "easing": "hold" } ], "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "success-disc", "property": "x", "value": 300, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "success-disc", "property": "y", "value": 446, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "success-disc", "property": "width", "value": 188, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "success-disc", "property": "height", "value": 188, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "success-disc", "property": "scale", "value": [ { "frame": 280, "value": 0.3, "easing": "smooth" }, { "frame": 290, "value": 1, "easing": "hold" } ], "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "success-check", "property": "x", "value": 346, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "success-check", "property": "y", "value": 492, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "success-check", "property": "width", "value": 96, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "success-check", "property": "height", "value": 96, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "success-check", "property": "dashOffset", "value": [ { "frame": 284, "value": 80, "easing": "linear" }, { "frame": 294, "value": 0, "easing": "hold" } ], "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "phone-rim", "property": "x", "value": 726, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "phone-rim", "property": "y", "value": [ { "frame": 344, "value": 100, "easing": "smooth" }, { "frame": 375, "value": 92, "easing": "hold" }, { "frame": 400, "value": 92, "easing": "smooth" }, { "frame": 479, "value": 80, "easing": "hold" } ], "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "phone-rim", "property": "width", "value": 468, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "phone-rim", "property": "height", "value": 914, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "phone-rim", "property": "opacity", "value": 0.52, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "phone-rim", "property": "radius", "value": 86, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-phone", "property": "x", "value": 742, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-phone", "property": "y", "value": [ { "frame": 344, "value": 116, "easing": "smooth" }, { "frame": 375, "value": 108, "easing": "hold" }, { "frame": 400, "value": 108, "easing": "smooth" }, { "frame": 479, "value": 96, "easing": "hold" } ], "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-phone", "property": "width", "value": 436, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-phone", "property": "height", "value": 882, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-phone", "property": "radius", "value": 70, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "phone-time", "property": "x", "value": 48, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "phone-time", "property": "y", "value": 32, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "phone-time", "property": "width", "value": 110, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "phone-time", "property": "height", "value": 30, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "phone-signal", "property": "x", "value": 344, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "phone-signal", "property": "y", "value": 36, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "phone-signal", "property": "width", "value": 40, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "phone-signal", "property": "height", "value": 10, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "phone-signal", "property": "radius", "value": 4, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "phone-menu", "property": "x", "value": 32, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "phone-menu", "property": "y", "value": 74, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "phone-menu", "property": "width", "value": 27, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "phone-menu", "property": "height", "value": 27, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "phone-app", "property": "x", "value": 76, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "phone-app", "property": "y", "value": 70, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "phone-app", "property": "width", "value": 278, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "phone-app", "property": "height", "value": 35, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-plate", "property": "x", "value": 28, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-plate", "property": "y", "value": 126, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-plate", "property": "width", "value": 380, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-plate", "property": "height", "value": 390, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-plate", "property": "radius", "value": 25, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-state-dot", "property": "x", "value": 46, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-state-dot", "property": "y", "value": 146, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-state-dot", "property": "width", "value": 15, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-state-dot", "property": "height", "value": 15, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-state", "property": "x", "value": 69, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-state", "property": "y", "value": 142, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-state", "property": "width", "value": 310, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-state", "property": "height", "value": 30, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-thumb", "property": "x", "value": 46, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-thumb", "property": "y", "value": 190, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-thumb", "property": "width", "value": 136, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-thumb", "property": "height", "value": 91, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-product", "property": "x", "value": 198, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-product", "property": "y", "value": 190, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-product", "property": "width", "value": 178, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-product", "property": "height", "value": 86, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-labels", "property": "x", "value": 46, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-labels", "property": "y", "value": 322, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-labels", "property": "width", "value": 164, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-labels", "property": "height", "value": 99, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-values", "property": "x", "value": 214, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-values", "property": "y", "value": 322, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-values", "property": "width", "value": 174, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-values", "property": "height", "value": 99, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-details-button", "property": "x", "value": 46, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-details-button", "property": "y", "value": 452, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-details-button", "property": "width", "value": 342, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-details-button", "property": "height", "value": 42, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-details-button", "property": "radius", "value": 21, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-details", "property": "x", "value": 58, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-details", "property": "y", "value": 461, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-details", "property": "width", "value": 318, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-details", "property": "height", "value": 26, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-confirmation", "property": "x", "value": 30, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-confirmation", "property": "y", "value": 548, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-confirmation", "property": "width", "value": 378, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-confirmation", "property": "height", "value": 112, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-actions", "property": "x", "value": 34, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-actions", "property": "y", "value": 668, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-actions", "property": "width", "value": 120, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "receipt-actions", "property": "height", "value": 36, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "phone-composer", "property": "x", "value": 30, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "phone-composer", "property": "y", "value": 774, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "phone-composer", "property": "width", "value": 378, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "phone-composer", "property": "height", "value": 46, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "phone-composer", "property": "radius", "value": 23, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "phone-composer-label", "property": "x", "value": 57, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "phone-composer-label", "property": "y", "value": 786, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "phone-composer-label", "property": "width", "value": 314, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "phone-composer-label", "property": "height", "value": 26, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "phone-home-bar", "property": "x", "value": 144, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "phone-home-bar", "property": "y", "value": 846, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "phone-home-bar", "property": "width", "value": 148, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "phone-home-bar", "property": "height", "value": 5, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." }, { "layerId": "phone-home-bar", "property": "radius", "value": 3, "basis": "Chosen implementation control; source observations and exact half-open interval are documented separately." } ] steps [ "Start in the downloaded kit root. Verify core-publication-v08.zip and active-assets.zip against the pinned SHA-256 values, then unpack core first and the selected active overlay second with overwrite enabled. Both have project/... member paths. No legacy assets archive, inspection image or private preparation file is needed.", "Run unchanged handoff.py verify and frames from the kit root before editing. This checks the recipe and both SVG variants and exports native-frame numerical controls, not visual quality. The complete editable recipe is installed at project/recipes/.json.", "In Fusion create a1920x1080 square-pixel composition at60fps with inclusive range0..479. Global local frame0 maps to the source start specified in guide.json. Do not add handles, transition frames, retiming or an ending hold.", "Build every group as a transparent local RGBA domain, merge children in listed order, intersect local clipping masks, then transform and apply group alpha once before Over compositing into the parent. Every child key uses the same global frame f; layer start is a gate, not a new clock.", "Rebuild the original SVGs from svgConstruction: all element attributes, paths, viewBoxes, gradient stops and alpha are preserved. Use native filled Polygon/Bezier/Ellipse subgroups, not a rasterized interface or source photo. Original source imagery is research only.", "Use the core Geist font and the stated pixel boxes, weight, lineHeight and explicit newlines. No auto-shrink or line wrapping is supported. Text+ Size/baseline and native blur need application calibration; nothing here claims a tested .comp/.drp or pixel-equivalent native result.", "Select one complete content object. Default depicts a fern planter from fictional Mossworks:48.00 subtotal+4.00 delivery+0.00 tax=52.00 demo total. Adaptation depicts a notebook/pencil kit from fictional Paperwell:32.00+4.00+0.00=36.00. Merchant, productShort, productTitle, productArt, receiptValues and confirmation must change together. No card number, address, delivery promise or live payment exists.", "Place context-field behind every state,2048x1152. Its x moves-64→-24 and y-36→-12 over0..479 using smoothstep. The SVG has one linear base and three transparent radial ellipse layers. This chosen material drifts even during apparent UI holds; it is not the source optical field.", "Create detail-rim=(550,-32,820,1200), alpha.36, and detail-clip=(574,-32,772,1180), white fill, overflow hidden, gate[0,133). Build product-hero at(0,0,772,515) from productArt, title at(30,548), option controls at690, merchant/price at844/880 and Buy at(654,864,88,64). Keep the entire detail group vertically cropped by the canvas; do not resize it to fit.", "Draw detail-dim over the product but below checkout-drawer, gate[32,133), black alpha0 at32→.18 at43 linearly. The drawer is its own white772x1180 child: x772 at36→0 at76 smoothstep; y0 through92→-48 at132 smoothstep. It enters under the fixed detail clip. Do not animate product geometry together with the drawer.", "Inside checkout-drawer use the SAME productArt at(30,42,240,160), title at(306,42), quantity plate at(306,164,210,68), and three rows with tops290/410/530. Each row has its exact path icon, primary label and muted secondary label. Summary columns begin684; demo total begins830; black action box=(30,936,712,94), radius47. All exact label/line limits and icons are enumerated in fusionNodes.", "At133 switch the whole detail branch off and action-pill on. This is a stepped branch switch, not a dissolve or a zoom. action-pill=(526,y,868,224), radius112, dark fill, local origin(434,112); y436 at133→432 at145 smoothstep. Keep child alpha inside the rounded clipping mask.", "Hold the pay label through175. The whole pill scale is1 through172, .985 at175,1 at180 with smoothstep segments; origin is its original center. At176 switch to working-spinner and working-label. Working-label opacity.12 at176→1 at188 linearly. Do not interpolate the label strings or crossfade both labels together.", "working-spinner uses its original80x80 SVG at(170,72), origin(40,40); rotation0 degrees at176→1290 at262 linearly, i.e.15 degrees/native frame. The eight spokes have fixed descending opacities1,.9,...,.3. For Fusion rebuild on a local80x80 transparent square, rotate around its center using Angle=-rotation, then place in the pill; do not rotate a full-canvas image about the default canvas pivot.", "From244 to261 narrow the pill width868→188 and move x526→866 with smoothstep, preserving center960. The label and spinner retain their fixed local dimensions and are cropped by the shrinking rounded alpha mask. This is NOT scaling the type down or keying its font size. The branch ends at262 before its last rotation key is rendered.", "At262 hard-switch to success-rim=(534,0,852,1120), alpha.34, and success-column=(566,0,788,1120), white. The merchant stays at(56,12), centered. Column y holds0 through328 and reaches-32 at343 smoothstep. The isolated pay branch must be absent.", "Create the black64px dot at(362,508), centered origin(32,32), scale.22 at262→1 at270; gate[262,280). Black ring is164px at(312,458),14px inside stroke, scale.65 at266→1 at271, gate[266,272). These are separate local layers, not a recolored shared circle.", "Green ripple is176px at(306,452),9px inside stroke,#32b94b, gate[272,290), center pivot, scale.92→1.5 over272..289 smoothstep and alpha1→0 linearly. Green disc is188px at(300,446),#2abd46, gate[280,344), scale.30 at280→1 at290 smoothstep. Apply each alpha before Over, no Screen blend or dark matte.", "For success-check use the exact path M12 34 L26 48 L54 14 in viewBox0 0 64 64, box(346,492,96,96), white stroke7 viewBox units, unfilled, default SVG butt caps and miter joins. Gate[284,344), dashArray80 and dashOffset80 at284→0 at294 linearly. Fusion fallback trims the same64-unit path by arc length, not a rectangular left-to-right wipe. The two segment lengths are sqrt(392) and sqrt(1940); visible path length is clamp(80-dashOffset,0,totalLength). Hold the completed check through343.", "At344 hard-switch success off and receipt-phone on. Phone x742,width436,height882,radius70, overflow hidden. Its y is116 at344→108 at375, holds through400, then96 at479, smoothstep on moving segments. The separate translucent rim is16px larger on every side, x726,width468,height914,radius86,alpha.52, y exactly phoneY-16. Do not retain a floating success check over the receipt.", "Build receipt-phone children in the listed order: time/signal/app header; receipt plate(28,126,380,390); state dot/label; SAME productArt at(46,190,136,91); productShort at(198,190); quantity/merchant/total columns at322; details button at452. Receipt plate exists fully at344; the product is not replaced by another icon.", "Keep confirmation at(30,548,378,112),18px Geist, lineHeight1.45, explicit four lines. Gate[376,480). Character-prefix steps are0 at376,22 at383,48 at394,80 at405,112 at417,180 at430; slices beyond actual text length simply show the complete string. Bake held StyledText prefixes if Text+ Write On counts differently. Small action symbols start435; composer and home bar already exist from344.", "Check cuts133/262/344 on both sides, working onset176, width clip244..261, distinct ring/disc/check stages, receipt identity and late streamed copy. Final479 stays on the phone. Treat these chosen controls as an editable source-informed fixture, never measured checkout latency or a successful transaction." ] checkpoints [ { "localFrame": 0, "sourceFrame": 1080, "expectation": "Cropped original product detail; no drawer or receipt." }, { "localFrame": 31, "sourceFrame": 1111, "expectation": "Product-only branch before dim." }, { "localFrame": 32, "sourceFrame": 1112, "expectation": "Dim branch starts at zero alpha; no hard cut." }, { "localFrame": 36, "sourceFrame": 1116, "expectation": "Checkout drawer starts at localx772, fully clipped at the right." }, { "localFrame": 60, "sourceFrame": 1140, "expectation": "Drawer enters over dim product; thumb uses the same productArt." }, { "localFrame": 76, "sourceFrame": 1156, "expectation": "Drawerx0; its contents and pay action are populated." }, { "localFrame": 120, "sourceFrame": 1200, "expectation": "Checkout content has moved upward; its own y track is not frozen." }, { "localFrame": 132, "sourceFrame": 1212, "expectation": "Last detail/drawer frame; drawery-48." }, { "localFrame": 133, "sourceFrame": 1213, "expectation": "Hard cut to isolated pay pill; product/detail absent." }, { "localFrame": 150, "sourceFrame": 1230, "expectation": "Pill settled aty432, full868px width." }, { "localFrame": 175, "sourceFrame": 1255, "expectation": "Last pay label, scale.985; no working text yet." }, { "localFrame": 176, "sourceFrame": 1256, "expectation": "Working label and spinner replace pay text; label alpha.12." }, { "localFrame": 210, "sourceFrame": 1290, "expectation": "Spinner rotated510 degrees; fixed-size working label remains." }, { "localFrame": 244, "sourceFrame": 1324, "expectation": "Pill begins width clipping from868px, not text scaling." }, { "localFrame": 261, "sourceFrame": 1341, "expectation": "Last working frame: width188,x866, clipped children." }, { "localFrame": 262, "sourceFrame": 1342, "expectation": "Hard cut to white success column; small black dot only." }, { "localFrame": 270, "sourceFrame": 1350, "expectation": "Black dot and black ring visible as separate layers." }, { "localFrame": 272, "sourceFrame": 1352, "expectation": "Black ring absent; green ripple begins." }, { "localFrame": 280, "sourceFrame": 1360, "expectation": "Dot absent; green disc starts under the fading ripple." }, { "localFrame": 284, "sourceFrame": 1364, "expectation": "Check branch starts with dashOffset80, initially hidden." }, { "localFrame": 294, "sourceFrame": 1374, "expectation": "Complete check path, green disc at full size; ripple absent." }, { "localFrame": 300, "sourceFrame": 1380, "expectation": "Completed success state; no receipt yet." }, { "localFrame": 343, "sourceFrame": 1423, "expectation": "Last success-column frame; y-32." }, { "localFrame": 344, "sourceFrame": 1424, "expectation": "Hard cut to full receipt phone with the same product and totals." }, { "localFrame": 360, "sourceFrame": 1440, "expectation": "Populated receipt; confirmation paragraph not yet active." }, { "localFrame": 376, "sourceFrame": 1456, "expectation": "Confirmation branch begins with zero visible characters." }, { "localFrame": 400, "sourceFrame": 1480, "expectation": "Confirmation is a partial prefix; no all-at-once final paragraph." }, { "localFrame": 430, "sourceFrame": 1510, "expectation": "Complete confirmation for both original variants." }, { "localFrame": 479, "sourceFrame": 1559, "expectation": "Final included phone frame at y96, receipt and confirmation retained." } ] implementationDifferences [ "Both contents are original: default is a fern planter from fictional Mossworks; adaptation is a notebook/pencil kit from fictional Paperwell. Product artwork, title, options, merchant, prices, totals and receipt prose change together.", "Source photography becomes editable original SVG geometry. Source branding, card/address data and confirmation promises are removed. No source-derived screenshot, live account or purchase is used.", "The exact60fps480-frame window and observed state/cut order are retained. All dimensions, colors, smoothstep curves, spinner speed and text-prefix steps are chosen implementation values, not recovered official controls.", "Processing is represented by rotating eight fixed-opacity SVG spokes; source spoke cadence is not measured. Success uses separate dot, ring, green ripple, disc and dashed check stroke. The moving vector gradient is not source optical material.", "The final receipt keeps the same productArt slot as the hero and checkout thumb. This is illustrative state continuity, not evidence of a successful transaction." ] limitations [ "Original vector planter/notebook products replace the source photograph; materiality and exact drifting light field differ. Chosen spinner, ripple and receipt text cadence need parent output review; no rendered readability or native Resolve calibration is established.", "No output render/encode, npm dependency installation, moving-source review, audio assessment, blind test or native Resolve execution was performed by this builder.", "Full native source masters were unavailable. Retained excerpts have960x540 pixels; 1920x1080 source dimensions and master hashes are inherited queue metadata.", "All historical source-quality status remains unresolved. Mechanical readiness does not approve material, typography, motion, source fidelity or production use.", "The core includes a licensed Geist font. This is SVG/code-only active imagery, not an assertion that the entire runtime contains no binary files.", "Only selected recipe and active SVG files belong in the overlay. No old asset pack, source master, private worker, dependency tree or critic output belongs in it.", "Text fit requires the actual loaded browser font; field length caps and numeric tracks alone cannot establish readability.", "Both content variants demonstrate one treatment, not two new examples. No shared counts, catalog entries or publication state are modified." ]