Nested Container Clean Agency
Meng ToCommunityCreated by Meng To
- Skill
- Content generator
- Design and creative
- MIT
- Medium risk
AutoGineer summary
Written by AutoGineer from the skill’s own files, not by the author
This skill provides a structured approach to building clean, high-end agency websites by prioritizing nested container architecture over flat layouts. It focuses on establishing a clear visual hierarchy through an outer editorial shell, inset dark feature blocks, and rounded premium cards. By emphasizing generous whitespace, restrained accent usage, and intentional layering, the system ensures a sophisticated and breathable interface that avoids the clutter of generic card-grid designs.
What it does
- Defines a global page frame using outer wrappers with vertical rails and corner markers.
- Provides patterns for nesting dark feature blocks within lighter editorial shells.
- Establishes guidelines for premium card styling using gradient borders and soft shadows.
- Sets rules for restrained accent color application to maintain a professional tone.
- Offers tuning knobs for adjusting nesting depth, contrast balance, and container density.
- Outlines spacing and alignment strategies to ensure a breathable, intentional layout.
When to use it
- When designing a high-end agency or portfolio website that requires a premium feel.
- When you want to move away from flat, generic section-based layouts.
- When building complex pricing or feature comparison pages that need clear visual grouping.
- When you need a consistent design system that balances editorial content with interactive UI elements.
Advantages
- Creates a strong, sophisticated visual hierarchy through intentional container nesting.
- Prevents layout clutter by enforcing generous whitespace and restrained styling.
- Provides a modular approach to building complex page sections.
- Ensures a consistent, polished aesthetic across different page components.
Usage examples
- “Apply the nested container design system to a new agency landing page.”
- The agent will structure the page with an outer editorial shell, incorporate a dark inset section for service highlights, and use rounded cards for pricing tiers.
- “How should I style my pricing section to match the clean agency aesthetic?”
- The agent will recommend nesting the pricing cards within a dark, rounded feature block inside the main page shell, using subtle accent colors for call-to-action buttons.
Install
Download the skill as a ZIP:
https://autogineer.com/agent-skills/mengto/nested-container-clean-agency/downloadUnzip it into the cross-client skills folder of your project:
mkdir -p .agents/skills && unzip nested-container-clean-agency.zip -d .agents/skills
Documentation by Meng To
Nested Container Clean Agency Skill
Use When
Create a clean agency design system built from nested containers, with an outer editorial shell, inset dark feature blocks, rounded premium cards, and restrained accent color.
Workflow
Scope
Apply this as a full design-system direction across page shell, section framing, cards, pricing blocks, call-to-action areas, and layout rhythm.
Use it when the interface should feel clean, premium, and agency-led, with strong container hierarchy instead of flat page sections.
This is not generic card-grid SaaS and not only a framing utility. The whole composition should be organized through nested shells and inset feature blocks.
Visual target
Start with a centered outer page container that defines the main boundaries of the design with visible vertical rails, corner squares, or light frame lines.
Inside that outer shell, place one or more inset containers with contrasting surfaces, especially dark rounded feature zones nested within a light editorial page.
Build hierarchy by stacking containers inside containers: outer shell, inner dark section, then smaller rounded cards or content panels inside that section.
Keep typography clean, modern, and agency-like, with confident headlines, restrained body copy, and minimal UI noise.
Use a soft accent color sparingly for pills, buttons, active dots, subtle gradients, and call-to-action emphasis rather than saturating the full layout.
Implementation guidance
Prefer a max-width outer wrapper with consistent side padding, vertical boundary lines, and tiny corner markers to establish the global frame.
Use nested rounded containers to create depth: a darker major block inside the page, then lighter or darker cards inset within it depending on contrast needs.
Maintain generous whitespace between nested layers so each shell feels intentional and breathable.
Use border gradients, low-contrast strokes, and soft shadows to separate layers instead of heavy outlines everywhere.
Pricing sections, service groupings, or feature comparisons should feel like modular editorial blocks housed inside a larger premium container.
Motion should stay minimal and polished: masked text reveals, calm fade-ins, and light hover transitions are enough.
Recommended patterns
White or off-white outer shell with border-x rails and tiny corner squares defining the page bounds.
Large dark rounded section acting as a featured pricing or capability block nested within the lighter page shell.
Premium inner cards with gradient-border wrappers, soft surface contrast, and clear content grouping.
Small uppercase labels, compact pills, and restrained accent buttons to preserve the clean agency tone.
Editorial spacing that lets each nested container breathe, with strong alignment and uncluttered copy blocks.
Tuning knobs
Nesting depth: choose how many layers of shells to use before the system feels too busy.
Contrast balance: tune the jump between the outer shell and inset containers so the hierarchy feels strong but elegant.
Corner radius: keep rounded containers polished and premium, but avoid making them feel overly playful.
Accent strength: use the accent color as punctuation for key controls, tags, and highlights only.
Container density: give cards enough internal padding so the system reads premium instead of cramped.
Avoid
Flat sections with no clear outer-to-inner container hierarchy.
Generic agency layouts that use one level of cards and call it structured.
Overdecorated gradients, glows, or excessive accent color that break the clean tone.
Equal visual weight on every nested block, which weakens hierarchy.
Cramped containers with insufficient spacing between shell levels.
Files
- ATTRIBUTION.mdAdded by AutoGineer880 B
- LICENSELicence file added by AutoGineer1.0 KiB
- SKILL.md3.9 KiB
- demo/PROMPT.md3.4 KiB
- demo/assets/page-01-2f563338-39fa-47ea-9761-658d4f3f84db-1600w.jpg292.0 KiB
- demo/assets/page-02-4f5668c5-fc4a-44e0-bc5e-a664189d3c31-1600w.jpg212.3 KiB
- demo/assets/page-03-77415a2e-dcbc-4748-a29d-fced4821881a-1600w.jpg354.2 KiB
- demo/assets/page-04-c92852bb-a510-405a-85ab-ffa0fde136a4-1600w.jpg209.1 KiB
- demo/assets/source-preview.jpg72.1 KiB
- demo/index.html21.4 KiB
- demo/preview.jpg54.3 KiB
- demo/source.json3.2 KiB
demo/index.html
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="neuform-sandboxed-demo" content="1">
<meta http-equiv="Content-Security-Policy" content="default-src 'none'; connect-src 'self'; frame-src 'self'; script-src 'unsafe-inline'; style-src 'unsafe-inline'; base-uri 'none'; form-action 'none'; object-src 'none'">
<title>Sandboxed Neuform demo</title>
<style>
html, body, iframe { width: 100%; height: 100%; margin: 0; border: 0; }
body { overflow: hidden; background: #0b0b0b; }
iframe { display: block; background: white; }
.error { box-sizing: border-box; min-height: 100%; padding: 32px; color: #fff; font: 16px/1.5 system-ui, sans-serif; }
</style>
</head>
<body>
<iframe id="neuform-demo" title="Sandboxed Neuform design demo" sandbox="allow-scripts" referrerpolicy="no-referrer"></iframe>
<script>
const encodedHtml = "PCFET0NUWVBFIGh0bWw+CjxodG1sIGxhbmc9ImVuIj4KPGhlYWQ+CjxtZXRhIGh0dHAtZXF1aXY9IkNvbnRlbnQtU2VjdXJpdHktUG9saWN5IiBjb250ZW50PSJkZWZhdWx0LXNyYyAnbm9uZSc7IGJhc2UtdXJpICdub25lJzsgY29ubmVjdC1zcmMgJ25vbmUnOyBmb250LXNyYyBkYXRhOiBodHRwczovL2ZvbnRzLmdzdGF0aWMuY29tOyBmb3JtLWFjdGlvbiAnbm9uZSc7IGZyYW1lLXNyYyAnbm9uZSc7IGltZy1zcmMgYmxvYjo7IG1lZGlhLXNyYyBibG9iOjsgbmF2aWdhdGUtdG8gJ25vbmUnOyBvYmplY3Qtc3JjICdub25lJzsgc2NyaXB0LXNyYyAndW5zYWZlLWlubGluZScgX19ORVVGT1JNX1JVTlRJTUVfU09VUkNFU19fOyBzdHlsZS1zcmMgJ3Vuc2FmZS1pbmxpbmUnIGh0dHBzOi8vYXBpLmZvbnRzaGFyZS5jb20gaHR0cHM6Ly9mb250cy5nb29nbGVhcGlzLmNvbTsgd29ya2VyLXNyYyAnbm9uZSciPgo8c2NyaXB0IGRhdGEtbmV1Zm9ybS1hc3NldC1ib290c3RyYXA+CigoKSA9PiB7CiAgbGV0IHJlY2VpdmVkID0gZmFsc2U7CiAgY29uc3Qgb2JqZWN0VXJscyA9IFtdOwogIGNvbnN0IHJlcGxhY2VBbGwgPSAodmFsdWUsIHJlcGxhY2VtZW50cykgPT4gewogICAgbGV0IG5leHQgPSBTdHJpbmcodmFsdWUgfHwgIiIpOwogICAgZm9yIChjb25zdCBbZmlsZSwgb2JqZWN0VXJsXSBvZiByZXBsYWNlbWVudHMpIG5leHQgPSBuZXh0LnNwbGl0KGZpbGUpLmpvaW4ob2JqZWN0VXJsKTsKICAgIHJldHVybiBuZXh0OwogIH07CiAgd2luZG93LmFkZEV2ZW50TGlzdGVuZXIoIm1lc3NhZ2UiLCAoZXZlbnQpID0+IHsKICAgIGlmIChyZWNlaXZlZCB8fCBldmVudC5zb3VyY2UgIT09IHBhcmVudCB8fCBldmVudC5kYXRhPy50eXBlICE9PSAibmV1Zm9ybS1hc3NldHMtdjEiKSByZXR1cm47CiAgICByZWNlaXZlZCA9IHRydWU7CiAgICBjb25zdCByZXBsYWNlbWVudHMgPSBbXTsKICAgIGZvciAoY29uc3QgYXNzZXQgb2YgZXZlbnQuZGF0YS5hc3NldHMgfHwgW10pIHsKICAgICAgaWYgKCFhc3NldCB8fCB0eXBlb2YgYXNzZXQuZmlsZSAhPT0gInN0cmluZyIgfHwgdHlwZW9mIGFzc2V0LmJhc2U2NCAhPT0gInN0cmluZyIpIGNvbnRpbnVlOwogICAgICBjb25zdCBiaW5hcnkgPSBhdG9iKGFzc2V0LmJhc2U2NCk7CiAgICAgIGNvbnN0IGJ5dGVzID0gVWludDhBcnJheS5mcm9tKGJpbmFyeSwgKGNoYXJhY3RlcikgPT4gY2hhcmFjdGVyLmNoYXJDb2RlQXQoMCkpOwogICAgICBjb25zdCBvYmplY3RVcmwgPSBVUkwuY3JlYXRlT2JqZWN0VVJMKG5ldyBCbG9iKFtieXRlc10sIHsgdHlwZTogYXNzZXQuY29udGVudFR5cGUgfHwgImFwcGxpY2F0aW9uL29jdGV0LXN0cmVhbSIgfSkpOwogICAgICBvYmplY3RVcmxzLnB1c2gob2JqZWN0VXJsKTsKICAgICAgcmVwbGFjZW1lbnRzLnB1c2goW2Fzc2V0LmZpbGUsIG9iamVjdFVybF0pOwogICAgfQogICAgZm9yIChjb25zdCBlbGVtZW50IG9mIGRvY3VtZW50LnF1ZXJ5U2VsZWN0b3JBbGwoIioiKSkgewogICAgICBmb3IgKGNvbnN0IG5hbWUgb2YgWyJzcmMiLCAicG9zdGVyIiwgInNyY3NldCIsICJzdHlsZSJdKSB7CiAgICAgICAgY29uc3QgdmFsdWUgPSBlbGVtZW50LmdldEF0dHJpYnV0ZShuYW1lKTsKICAgICAgICBpZiAodmFsdWUpIGVsZW1lbnQuc2V0QXR0cmlidXRlKG5hbWUsIHJlcGxhY2VBbGwodmFsdWUsIHJlcGxhY2VtZW50cykpOwogICAgICB9CiAgICB9CiAgICBmb3IgKGNvbnN0IHN0eWxlIG9mIGRvY3VtZW50LnF1ZXJ5U2VsZWN0b3JBbGwoInN0eWxlIikpIHsKICAgICAgc3R5bGUudGV4dENvbnRlbnQgPSByZXBsYWNlQWxsKHN0eWxlLnRleHRDb250ZW50LCByZXBsYWNlbWVudHMpOwogICAgfQogIH0pOwogIHdpbmRvdy5hZGRFdmVudExpc3RlbmVyKCJwYWdlaGlkZSIsICgpID0+IHsKICAgIGZvciAoY29uc3Qgb2JqZWN0VXJsIG9mIG9iamVjdFVybHMpIFVSTC5yZXZva2VPYmplY3RVUkwob2JqZWN0VXJsKTsKICB9LCB7IG9uY2U6IHRydWUgfSk7Cn0pKCk7Cjwvc2NyaXB0PgoKPG1ldGEgY2hhcnNldD0iVVRGLTgiPgo8bWV0YSBuYW1lPSJ2aWV3cG9ydCIgY29udGVudD0id2lkdGg9ZGV2aWNlLXdpZHRoLCBpbml0aWFsLXNjYWxlPTEuMCI+Cjx0aXRsZT5TcXVpc2gg4oCUIFR1cm4gWW91ciBJZGVhcyBJbnRvIFN0dW5uaW5nIFZpc3VhbHM8L3RpdGxlPgo8c2NyaXB0IHNyYz0iLi4vLi4vLi4vLi4vYXNzZXRzL3J1bnRpbWUvcnVudGltZS1jY2M4ODk0YjM0MTgtcnVudGltZS5qcyI+PC9zY3JpcHQ+CjxzY3JpcHQgc3JjPSIuLi8uLi8uLi8uLi9hc3NldHMvcnVudGltZS9ydW50aW1lLTE2M2ViZDA4N2NmYy1pY29uaWZ5LWljb24tbWluLmpzIj48L3NjcmlwdD4KPGxpbmsgcmVsPSJwcmVjb25uZWN0IiBocmVmPSJodHRwczovL2ZvbnRzLmdvb2dsZWFwaXMuY29tIj4KPGxpbmsgaHJlZj0iaHR0cHM6Ly9mb250cy5nb29nbGVhcGlzLmNvbS9jc3MyP2ZhbWlseT1OZXdzcmVhZGVyOndnaHRANDAwOzUwMCZmYW1pbHk9SW50ZXI6d2dodEAzMDA7NDAwOzUwMDs2MDAmZmFtaWx5PVBhY2lmaWNvJmRpc3BsYXk9c3dhcCIgcmVsPSJzdHlsZXNoZWV0Ij4KPC9oZWFkPgo8Ym9keSBjbGFzcz0ibS0wIG1pbi1oLXNjcmVlbiBvdmVyZmxvdy14LWhpZGRlbiBiZy1bIzBhM2JiZl0iIHN0eWxlPSJmb250LWZhbWlseTpJbnRlcixzYW5zLXNlcmlmOyI+CgogIDwhLS0gQmFja2dyb3VuZCBXZWJHTCBjYW52YXMgLS0+CiAgPGNhbnZhcyBpZD0iZ2wiIGNsYXNzPSJmaXhlZCBpbnNldC0wIHctZnVsbCBoLWZ1bGwgLXotMTAiIHN0eWxlPSJwb2ludGVyLWV2ZW50czpub25lOyI+PC9jYW52YXM+CgogIDwhLS0gRG90IGdyaWQgb3ZlcmxheSAtLT4KICA8ZGl2IGNsYXNzPSJmaXhlZCBpbnNldC0wIC16LTEwIiBzdHlsZT0icG9pbnRlci1ldmVudHM6bm9uZTtiYWNrZ3JvdW5kLWltYWdlOnJhZGlhbC1ncmFkaWVudChyZ2JhKDI1NSwyNTUsMjU1LDAuMzUpIDFweCwgdHJhbnNwYXJlbnQgMXB4KTtiYWNrZ3JvdW5kLXNpemU6MjZweCAyNnB4O29wYWNpdHk6MC4xODsiPjwvZGl2PgoKICA8IS0tIEF0bW9zcGhlcmUgZ3JhZGllbnQgd2FzaCAtLT4KICA8ZGl2IGNsYXNzPSJmaXhlZCBpbnNldC0wIC16LTEwIiBzdHlsZT0icG9pbnRlci1ldmVudHM6bm9uZTtiYWNrZ3JvdW5kOmxpbmVhci1ncmFkaWVudCh0byBib3R0b20sIHJnYmEoMTUwLDE3MCwyMTAsMC4xNSkgMCUsIHJnYmEoNDAsOTAsMjIwLDAuMDUpIDQ1JSwgcmdiYSgyMCw1NSwxODAsMC41NSkgMTAwJSk7Ij48L2Rpdj4KCiAgPG1haW4gY2xhc3M9InJlbGF0aXZlIG1pbi1oLXNjcmVlbiBmbGV4IGZsZXgtY29sIiBzdHlsZT0iei1pbmRleDoxMDsiPgoKICAgIDwhLS0gTmF2aWdhdGlvbiAtLT4KICAgIDxoZWFkZXIgY2xhc3M9InctZnVsbCBweC02IHNtOnB4LTEwIGxnOnB4LTE0IHB5LTYgZmxleCBpdGVtcy1jZW50ZXIganVzdGlmeS1iZXR3ZWVuIj4KICAgICAgPGEgaHJlZj0iIyIgY2xhc3M9InRleHQtd2hpdGUgdGV4dC0zeGwiIHN0eWxlPSJmb250LWZhbWlseTpQYWNpZmljbyxjdXJzaXZlO2xldHRlci1zcGFjaW5nOjAuNXB4OyI+U3F1aXNoPC9hPgoKICAgICAgPG5hdiBjbGFzcz0iaGlkZGVuIG1kOmZsZXggaXRlbXMtY2VudGVyIGdhcC05IHRleHQtd2hpdGUiPgogICAgICAgIDxhIGhyZWY9IiMiIGNsYXNzPSJ0ZXh0LXNtIGZvbnQtbWVkaXVtIGhvdmVyOm9wYWNpdHktODAgdHJhbnNpdGlvbi1vcGFjaXR5IGR1cmF0aW9uLTE1MCI+UHJvZHVjdDwvYT4KICAgICAgICA8YSBocmVmPSIjIiBjbGFzcz0idGV4dC1zbSBmb250LW1lZGl1bSBob3ZlcjpvcGFjaXR5LTgwIHRyYW5zaXRpb24tb3BhY2l0eSBkdXJhdGlvbi0xNTAiPlByZXNldHM8L2E+CiAgICAgICAgPGEgaHJlZj0iIyIgY2xhc3M9InRleHQtc20gZm9udC1tZWRpdW0gaG92ZXI6b3BhY2l0eS04MCB0cmFuc2l0aW9uLW9wYWNpdHkgZHVyYXRpb24tMTUwIj5QcmljaW5nPC9hPgogICAgICAgIDxhIGhyZWY9IiMiIGNsYXNzPSJ0ZXh0LXNtIGZvbnQtbWVkaXVtIGhvdmVyOm9wYWNpdHktODAgdHJhbnNpdGlvbi1vcGFjaXR5IGR1cmF0aW9uLTE1MCI+QmxvZzwvYT4KICAgICAgICA8YSBocmVmPSIjIiBjbGFzcz0iYmctd2hpdGUgdGV4dC1bIzFhMjQ0MF0gdGV4dC1zbSBmb250LXNlbWlib2xkIHB4LTYgcHktMi41IHJvdW5kZWQteGwgaG92ZXI6c2NhbGUtWzEuMDNdIHRyYW5zaXRpb24tdHJhbnNmb3JtIGR1cmF0aW9uLTE1MCBzaGFkb3ctWzBweF8ycHhfM3B4Xy0xcHhfcmdiYSgwLDAsMCwwLjEpLDBweF8xcHhfMHB4XzBweF9yZ2JhKDI1LDI4LDMzLDAuMDIpLDBweF8wcHhfMHB4XzFweF9yZ2JhKDI1LDI4LDMzLDAuMDgpXSI+Q29udGFjdDwvYT4KICAgICAgPC9uYXY+CgogICAgICA8YnV0dG9uIGlkPSJtZW51QnRuIiBjbGFzcz0ibWQ6aGlkZGVuIHRleHQtd2hpdGUiIGFyaWEtbGFiZWw9Ik9wZW4gbWVudSI+CiAgICAgICAgPGljb25pZnktaWNvbiBpY29uPSJzb2xhcjpoYW1idXJnZXItbWVudS1saW5lYXIiIHdpZHRoPSIyOCIgaGVpZ2h0PSIyOCI+PC9pY29uaWZ5LWljb24+CiAgICAgIDwvYnV0dG9uPgogICAgPC9oZWFkZXI+CgogICAgPCEtLSBNb2JpbGUgbWVudSAtLT4KICAgIDxkaXYgaWQ9Im1vYmlsZU1lbnUiIGNsYXNzPSJtZDpoaWRkZW4gaGlkZGVuIHB4LTYgcGItNCBmbGV4LWNvbCBnYXAtMyB0ZXh0LXdoaXRlIj4KICAgICAgPGEgaHJlZj0iIyIgY2xhc3M9InRleHQtc20gZm9udC1tZWRpdW0gcHktMS41Ij5Qcm9kdWN0PC9hPgogICAgICA8YSBocmVmPSIjIiBjbGFzcz0idGV4dC1zbSBmb250LW1lZGl1bSBweS0xLjUiPlByZXNldHM8L2E+CiAgICAgIDxhIGhyZWY9IiMiIGNsYXNzPSJ0ZXh0LXNtIGZvbnQtbWVkaXVtIHB5LTEuNSI+UHJpY2luZzwvYT4KICAgICAgPGEgaHJlZj0iIyIgY2xhc3M9InRleHQtc20gZm9udC1tZWRpdW0gcHktMS41Ij5CbG9nPC9hPgogICAgICA8YSBocmVmPSIjIiBjbGFzcz0iYmctd2hpdGUgdGV4dC1bIzFhMjQ0MF0gdGV4dC1zbSBmb250LXNlbWlib2xkIHB4LTYgcHktMi41IHJvdW5kZWQteGwgdGV4dC1jZW50ZXIgbXQtMSI+Q29udGFjdDwvYT4KICAgIDwvZGl2PgoKICAgIDwhLS0gSGVybyAtLT4KICAgIDxzZWN0aW9uIGNsYXNzPSJmbGV4LTEgZmxleCBpdGVtcy1lbmQiPgogICAgICA8ZGl2IGNsYXNzPSJ3LWZ1bGwgcHgtNiBzbTpweC0xMCBsZzpweC0xNCBwYi0xNiBsZzpwYi0yNCBmbGV4IGZsZXgtY29sIGxnOmZsZXgtcm93IGxnOml0ZW1zLWVuZCBsZzpqdXN0aWZ5LWJldHdlZW4gZ2FwLTEwIj4KCiAgICAgICAgPCEtLSBMZWZ0IGNvcHkgLS0+CiAgICAgICAgPGRpdiBjbGFzcz0ibWF4LXctMnhsIj4KICAgICAgICAgIDxoMSBjbGFzcz0idGV4dC13aGl0ZSIgc3R5bGU9ImZvbnQtZmFtaWx5Ok5ld3NyZWFkZXIsc2VyaWY7Zm9udC13ZWlnaHQ6NDAwO2xldHRlci1zcGFjaW5nOi0wLjAyNWVtO2xpbmUtaGVpZ2h0OjEuMDI7Ij4KICAgICAgICAgICAgPHNwYW4gY2xhc3M9ImJsb2NrIG92ZXJmbG93LWhpZGRlbiI+CiAgICAgICAgICAgICAgPHNwYW4gY2xhc3M9InJldmVhbC1saW5lIGJsb2NrIHRleHQtNXhsIHNtOnRleHQtNnhsIGxnOnRleHQtN3hsIj5UdXJuIFlvdXIgSWRlYXMgSW50bzwvc3Bhbj4KICAgICAgICAgICAgPC9zcGFuPgogICAgICAgICAgICA8c3BhbiBjbGFzcz0iYmxvY2sgb3ZlcmZsb3ctaGlkZGVuIG10LTEiPgogICAgICAgICAgICAgIDxzcGFuIGNsYXNzPSJyZXZlYWwtbGluZSBibG9jayB0ZXh0LTV4bCBzbTp0ZXh0LTZ4bCBsZzp0ZXh0LTd4bCI+U3R1bm5pbmcgVmlzdWFsczwvc3Bhbj4KICAgICAgICAgICAgPC9zcGFuPgogICAgICAgICAgPC9oMT4KCiAgICAgICAgICA8cCBjbGFzcz0icmV2ZWFsLWZhZGUgbXQtNyB0ZXh0LXdoaXRlLzkwIHRleHQtYmFzZSBzbTp0ZXh0LWxnIG1heC13LW1kIiBzdHlsZT0iZm9udC13ZWlnaHQ6MzAwO2xpbmUtaGVpZ2h0OjEuNjsiPgogICAgICAgICAgICBBbiBBSSB0b29sIHRoYXQgdHVybnMgcHJvbXB0cyBpbnRvIHF1YWxpdHkgaW1hZ2VzIGZvciBicmFuZGluZyBhbmQgcHJvZHVjdCBkZXNpZ24uCiAgICAgICAgICA8L3A+CgogICAgICAgICAgPGEgaHJlZj0iIyIgY2xhc3M9InJldmVhbC1mYWRlIGlubGluZS1mbGV4IGl0ZW1zLWNlbnRlciBnYXAtMiBtdC05IGJnLXdoaXRlIHRleHQtWyMxYTI0NDBdIHRleHQtYmFzZSBmb250LXNlbWlib2xkIHB4LTcgcHktNCByb3VuZGVkLTJ4bCBob3ZlcjpzY2FsZS1bMS4wM10gdHJhbnNpdGlvbi10cmFuc2Zvcm0gZHVyYXRpb24tMTUwIHNoYWRvdy1bMHB4XzJweF8zcHhfLTFweF9yZ2JhKDAsMCwwLDAuMSksMHB4XzFweF8wcHhfMHB4X3JnYmEoMjUsMjgsMzMsMC4wMiksMHB4XzBweF8wcHhfMXB4X3JnYmEoMjUsMjgsMzMsMC4wOCldIj4KICAgICAgICAgICAgQ3JlYXRlIHlvdXIgZmlyc3QgaW1hZ2UKICAgICAgICAgIDwvYT4KICAgICAgICA8L2Rpdj4KCiAgICAgICAgPCEtLSBSaWdodCBzb2NpYWwgcHJvb2YgLS0+CiAgICAgICAgPGRpdiBjbGFzcz0icmV2ZWFsLWZhZGUgZmxleCBmbGV4LWNvbCBpdGVtcy1zdGFydCBsZzppdGVtcy1lbmQgZ2FwLTIgdGV4dC13aGl0ZSI+CiAgICAgICAgICA8ZGl2IGNsYXNzPSJmbGV4IGl0ZW1zLWNlbnRlciBnYXAtMSB0ZXh0LXllbGxvdy0zMDAiPgogICAgICAgICAgICA8aWNvbmlmeS1pY29uIGljb249InNvbGFyOnN0YXItYm9sZCIgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2Ij48L2ljb25pZnktaWNvbj4KICAgICAgICAgICAgPGljb25pZnktaWNvbiBpY29uPSJzb2xhcjpzdGFyLWJvbGQiIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiI+PC9pY29uaWZ5LWljb24+CiAgICAgICAgICAgIDxpY29uaWZ5LWljb24gaWNvbj0ic29sYXI6c3Rhci1ib2xkIiB3aWR0aD0iMTYiIGhlaWdodD0iMTYiPjwvaWNvbmlmeS1pY29uPgogICAgICAgICAgICA8aWNvbmlmeS1pY29uIGljb249InNvbGFyOnN0YXItYm9sZCIgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2Ij48L2ljb25pZnktaWNvbj4KICAgICAgICAgICAgPGljb25pZnktaWNvbiBpY29uPSJzb2xhcjpzdGFyLWJvbGQiIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiI+PC9pY29uaWZ5LWljb24+CiAgICAgICAgICA8L2Rpdj4KICAgICAgICAgIDxwIGNsYXNzPSJ0ZXh0LXNtIGZvbnQtc2VtaWJvbGQiPjNrKyBjcmVhdG9yczwvcD4KICAgICAgICAgIDxkaXYgY2xhc3M9ImZsZXggLXNwYWNlLXgtMyBtdC0xIj4KICAgICAgICAgICAgPGltZyBzcmM9ImFzc2V0cy9wYWdlLTAxLTJmNTYzMzM4LTM5ZmEtNDdlYS05NzYxLTY1OGQ0ZjNmODRkYi0xNjAwdy5qcGciIGNsYXNzPSJ3LTkgaC05IHJvdW5kZWQtZnVsbCBib3JkZXItMiBib3JkZXItd2hpdGUgb2JqZWN0LWNvdmVyIiBhbHQ9IkNyZWF0b3IiPgogICAgICAgICAgICA8aW1nIHNyYz0iYXNzZXRzL3BhZ2UtMDItNGY1NjY4YzUtZmM0YS00NGUwLWJjNWUtYTY2NDE4OWQzYzMxLTE2MDB3LmpwZyIgY2xhc3M9InctOSBoLTkgcm91bmRlZC1mdWxsIGJvcmRlci0yIGJvcmRlci13aGl0ZSBvYmplY3QtY292ZXIiIGFsdD0iQ3JlYXRvciI+CiAgICAgICAgICAgIDxpbWcgc3JjPSJhc3NldHMvcGFnZS0wMy03NzQxNWEyZS1kY2JjLTQ3NDgtYTI5ZC1mY2VkNDgyMTg4MWEtMTYwMHcuanBnIiBjbGFzcz0idy05IGgtOSByb3VuZGVkLWZ1bGwgYm9yZGVyLTIgYm9yZGVyLXdoaXRlIG9iamVjdC1jb3ZlciIgYWx0PSJDcmVhdG9yIj4KICAgICAgICAgICAgPGltZyBzcmM9ImFzc2V0cy9wYWdlLTA0LWM5Mjg1MmJiLWE1MTAtNDA1YS04NWFiLWZmYTBmZGUxMzZhNC0xNjAwdy5qcGciIGNsYXNzPSJ3LTkgaC05IHJvdW5kZWQtZnVsbCBib3JkZXItMiBib3JkZXItd2hpdGUgb2JqZWN0LWNvdmVyIiBhbHQ9IkNyZWF0b3IiPgogICAgICAgICAgPC9kaXY+CiAgICAgICAgPC9kaXY+CgogICAgICA8L2Rpdj4KICAgIDwvc2VjdGlvbj4KCiAgPC9tYWluPgoKICA8c2NyaXB0PgogICAgLy8gTW9iaWxlIG1lbnUgdG9nZ2xlCiAgICBkb2N1bWVudC5nZXRFbGVtZW50QnlJZCgnbWVudUJ0bicpLmFkZEV2ZW50TGlzdGVuZXIoJ2NsaWNrJywgZnVuY3Rpb24gKCkgewogICAgICB2YXIgbSA9IGRvY3VtZW50LmdldEVsZW1lbnRCeUlkKCdtb2JpbGVNZW51Jyk7CiAgICAgIG0uY2xhc3NMaXN0LnRvZ2dsZSgnaGlkZGVuJyk7CiAgICAgIG0uY2xhc3NMaXN0LnRvZ2dsZSgnZmxleCcpOwogICAgfSk7CgogICAgLy8gLS0tLSBNYXNrZWQgcmV2ZWFsIGFuaW1hdGlvbiAtLS0tCiAgICB3aW5kb3cuYWRkRXZlbnRMaXN0ZW5lcignbG9hZCcsIGZ1bmN0aW9uICgpIHsKICAgICAgdmFyIGxpbmVzID0gZG9jdW1lbnQucXVlcnlTZWxlY3RvckFsbCgnLnJldmVhbC1saW5lJyk7CiAgICAgIGxpbmVzLmZvckVhY2goZnVuY3Rpb24gKGVsLCBpKSB7CiAgICAgICAgZWwuc3R5bGUudHJhbnNmb3JtID0gJ3RyYW5zbGF0ZVkoMTEwJSknOwogICAgICAgIGVsLnN0eWxlLnRyYW5zaXRpb24gPSAndHJhbnNmb3JtIDFzIGN1YmljLWJlemllcigwLjE2LDEsMC4zLDEpJzsKICAgICAgICBlbC5zdHlsZS50cmFuc2l0aW9uRGVsYXkgPSAoMC4xNSArIGkgKiAwLjEyKSArICdzJzsKICAgICAgfSk7CiAgICAgIHZhciBmYWRlcyA9IGRvY3VtZW50LnF1ZXJ5U2VsZWN0b3JBbGwoJy5yZXZlYWwtZmFkZScpOwogICAgICBmYWRlcy5mb3JFYWNoKGZ1bmN0aW9uIChlbCwgaSkgewogICAgICAgIGVsLnN0eWxlLm9wYWNpdHkgPSAnMCc7CiAgICAgICAgZWwuc3R5bGUudHJhbnNmb3JtID0gJ3RyYW5zbGF0ZVkoMThweCknOwogICAgICAgIGVsLnN0eWxlLmZpbHRlciA9ICdibHVyKDZweCknOwogICAgICAgIGVsLnN0eWxlLnRyYW5zaXRpb24gPSAnb3BhY2l0eSAwLjlzIGVhc2UsIHRyYW5zZm9ybSAwLjlzIGVhc2UsIGZpbHRlciAwLjlzIGVhc2UnOwogICAgICAgIGVsLnN0eWxlLnRyYW5zaXRpb25EZWxheSA9ICgwLjUgKyBpICogMC4xMikgKyAncyc7CiAgICAgIH0pOwogICAgICByZXF1ZXN0QW5pbWF0aW9uRnJhbWUoZnVuY3Rpb24gKCkgewogICAgICAgIHJlcXVlc3RBbmltYXRpb25GcmFtZShmdW5jdGlvbiAoKSB7CiAgICAgICAgICBsaW5lcy5mb3JFYWNoKGZ1bmN0aW9uIChlbCkgeyBlbC5zdHlsZS50cmFuc2Zvcm0gPSAndHJhbnNsYXRlWSgwJSknOyB9KTsKICAgICAgICAgIGZhZGVzLmZvckVhY2goZnVuY3Rpb24gKGVsKSB7CiAgICAgICAgICAgIGVsLnN0eWxlLm9wYWNpdHkgPSAnMSc7CiAgICAgICAgICAgIGVsLnN0eWxlLnRyYW5zZm9ybSA9ICd0cmFuc2xhdGVZKDApJzsKICAgICAgICAgICAgZWwuc3R5bGUuZmlsdGVyID0gJ2JsdXIoMCknOwogICAgICAgICAgfSk7CiAgICAgICAgfSk7CiAgICAgIH0pOwogICAgfSk7CgogICAgLy8gLS0tLSBXZWJHTCBmbG9yYWwgYmxvb20gYmFja2dyb3VuZCAtLS0tCiAgICAoZnVuY3Rpb24gKCkgewogICAgICB2YXIgY2FudmFzID0gZG9jdW1lbnQuZ2V0RWxlbWVudEJ5SWQoJ2dsJyk7CiAgICAgIHZhciBnbCA9IGNhbnZhcy5nZXRDb250ZXh0KCd3ZWJnbCcpOwogICAgICBpZiAoIWdsKSByZXR1cm47CgogICAgICB2YXIgdnMgPSAnYXR0cmlidXRlIHZlYzIgcDt2b2lkIG1haW4oKXtnbF9Qb3NpdGlvbj12ZWM0KHAsMC4wLDEuMCk7fSc7CgogICAgICB2YXIgZnMgPSBbCiAgICAgICAgJ3ByZWNpc2lvbiBoaWdocCBmbG9hdDsnLAogICAgICAgICd1bmlmb3JtIHZlYzIgdV9yZXM7JywKICAgICAgICAndW5pZm9ybSBmbG9hdCB1X3RpbWU7JywKICAgICAgICAndW5pZm9ybSB2ZWMyIHVfbW91c2U7JywKICAgICAgICAnZmxvYXQgaGFzaCh2ZWMyIHApe3JldHVybiBmcmFjdChzaW4oZG90KHAsdmVjMigxMjcuMSwzMTEuNykpKSo0Mzc1OC41NDUzKTt9JywKICAgICAgICAnZmxvYXQgbm9pc2UodmVjMiBwKXt2ZWMyIGk9Zmxvb3IocCk7dmVjMiBmPWZyYWN0KHApO2Y9ZipmKigzLjAtMi4wKmYpOycsCiAgICAgICAgJyBmbG9hdCBhPWhhc2goaSk7ZmxvYXQgYj1oYXNoKGkrdmVjMigxLjAsMC4wKSk7ZmxvYXQgYz1oYXNoKGkrdmVjMigwLjAsMS4wKSk7ZmxvYXQgZD1oYXNoKGkrdmVjMigxLjAsMS4wKSk7JywKICAgICAgICAnIHJldHVybiBtaXgobWl4KGEsYixmLngpLG1peChjLGQsZi54KSxmLnkpO30nLAogICAgICAgICdmbG9hdCBmYm0odmVjMiBwKXtmbG9hdCB2PTAuMDtmbG9hdCBhPTAuNTtmb3IoaW50IGk9MDtpPDU7aSsrKXt2Kz1hKm5vaXNlKHApO3AqPTIuMDthKj0wLjU7fXJldHVybiB2O30nLAogICAgICAgICd2b2lkIG1haW4oKXsnLAogICAgICAgICcgdmVjMiB1dj1nbF9GcmFnQ29vcmQueHkvdV9yZXMueHk7JywKICAgICAgICAnIHZlYzIgc3Q9dXY7c3QueCo9dV9yZXMueC91X3Jlcy55OycsCiAgICAgICAgLy8gYmFzZSBza3kgZ3JhZGllbnQ6IGxpZ2h0ZXIgdG9wLCBkZWVwZXIgYmx1ZSBib3R0b20KICAgICAgICAnIHZlYzMgdG9wPXZlYzMoMC42MiwwLjcwLDAuODYpOycsCiAgICAgICAgJyB2ZWMzIG1pZD12ZWMzKDAuMzAsMC41MiwwLjkyKTsnLAogICAgICAgICcgdmVjMyBib3Q9dmVjMygwLjA1LDAuMjMsMC43Mik7JywKICAgICAgICAnIHZlYzMgY29sPW1peCh0b3AsbWlkLHNtb290aHN0ZXAoMC4wLDAuNTUsdXYueSkpOycsCiAgICAgICAgJyBjb2w9bWl4KGJvdCxjb2wsc21vb3Roc3RlcCgwLjAsMC43LHV2LnkpKTsnLAogICAgICAgIC8vIGZsb3dlciBjZW50ZXIKICAgICAgICAnIHZlYzIgYz12ZWMyKDAuNTUsMC41OCk7JywKICAgICAgICAnIGMueCo9dV9yZXMueC91X3Jlcy55OycsCiAgICAgICAgJyB2ZWMyIGQ9c3QtYzsnLAogICAgICAgICcgZmxvYXQgYW5nPWF0YW4oZC55LGQueCk7JywKICAgICAgICAnIGZsb2F0IHJhZD1sZW5ndGgoZCk7JywKICAgICAgICAvLyBwZXRhbCBtb2R1bGF0aW9uCiAgICAgICAgJyBmbG9hdCB0PXVfdGltZSowLjE1OycsCiAgICAgICAgJyBmbG9hdCBwZXRhbHM9MC41KzAuNSpzaW4oYW5nKjcuMCtzaW4ocmFkKjYuMC10KSoxLjQpOycsCiAgICAgICAgJyBmbG9hdCBibG9vbT1zbW9vdGhzdGVwKDAuNDIsMC4wLHJhZCkqcGV0YWxzOycsCiAgICAgICAgJyBmbG9hdCB3YXJwPWZibShkKjQuMCt0KjAuNSkqMC42OycsCiAgICAgICAgJyBibG9vbSs9c21vb3Roc3RlcCgwLjMwLDAuMCxyYWQpKndhcnA7JywKICAgICAgICAvLyBzb2Z0IGNsb3VkeSBzdHJ1Y3R1cmUKICAgICAgICAnIGZsb2F0IGNsb3VkPWZibShkKjMuMCt2ZWMyKHQqMC4zLHQqMC4yKSk7JywKICAgICAgICAnIGJsb29tKj0gKDAuNyswLjUqY2xvdWQpOycsCiAgICAgICAgLy8gcGV0YWwgY29sb3I6IHBpbmsvcHVycGxlIG91dGVyLCBvcmFuZ2UgY29yZQogICAgICAgICcgdmVjMyBwZXRhbEE9dmVjMygwLjc4LDAuNTUsMC45Mik7JywKICAgICAgICAnIHZlYzMgcGV0YWxCPXZlYzMoMC45OCwwLjUwLDAuMzApOycsCiAgICAgICAgJyB2ZWMzIGNvcmU9dmVjMygxLjAsMC42MiwwLjI1KTsnLAogICAgICAgICcgdmVjMyBmbG93ZXI9bWl4KHBldGFsQSxwZXRhbEIsc21vb3Roc3RlcCgwLjI1LDAuMDIscmFkKSk7JywKICAgICAgICAnIGZsb3dlcj1taXgoZmxvd2VyLGNvcmUsc21vb3Roc3RlcCgwLjEwLDAuMCxyYWQpKTsnLAogICAgICAgICcgY29sPW1peChjb2wsZmxvd2VyLGNsYW1wKGJsb29tKjEuMywwLjAsMC45MikpOycsCiAgICAgICAgLy8gc3VidGxlIGdsb3cgaGFsbwogICAgICAgICcgY29sKz12ZWMzKDAuNSwwLjQ1LDAuNikqc21vb3Roc3RlcCgwLjUsMC4xLHJhZCkqMC4xMDsnLAogICAgICAgIC8vIGJyZWF0aGluZyBwdWxzZQogICAgICAgICcgY29sKj0gKDAuOTcrMC4wMypzaW4odV90aW1lKjAuNikpOycsCiAgICAgICAgLy8gbW91c2UgZHJpZnQgaGlnaGxpZ2h0CiAgICAgICAgJyBmbG9hdCBtZD1sZW5ndGgodXYtdV9tb3VzZSk7JywKICAgICAgICAnIGNvbCs9dmVjMygwLjIsMC4yNSwwLjQpKnNtb290aHN0ZXAoMC41LDAuMCxtZCkqMC4wNTsnLAogICAgICAgICcgZ2xfRnJhZ0NvbG9yPXZlYzQoY29sLDEuMCk7JywKICAgICAgICAnfScKICAgICAgXS5qb2luKCdcbicpOwoKICAgICAgZnVuY3Rpb24gY29tcGlsZSh0eXBlLCBzcmMpIHsKICAgICAgICB2YXIgcyA9IGdsLmNyZWF0ZVNoYWRlcih0eXBlKTsKICAgICAgICBnbC5zaGFkZXJTb3VyY2Uocywgc3JjKTsKICAgICAgICBnbC5jb21waWxlU2hhZGVyKHMpOwogICAgICAgIHJldHVybiBzOwogICAgICB9CiAgICAgIHZhciBwcm9nID0gZ2wuY3JlYXRlUHJvZ3JhbSgpOwogICAgICBnbC5hdHRhY2hTaGFkZXIocHJvZywgY29tcGlsZShnbC5WRVJURVhfU0hBREVSLCB2cykpOwogICAgICBnbC5hdHRhY2hTaGFkZXIocHJvZywgY29tcGlsZShnbC5GUkFHTUVOVF9TSEFERVIsIGZzKSk7CiAgICAgIGdsLmxpbmtQcm9ncmFtKHByb2cpOwogICAgICBnbC51c2VQcm9ncmFtKHByb2cpOwoKICAgICAgdmFyIGJ1ZiA9IGdsLmNyZWF0ZUJ1ZmZlcigpOwogICAgICBnbC5iaW5kQnVmZmVyKGdsLkFSUkFZX0JVRkZFUiwgYnVmKTsKICAgICAgZ2wuYnVmZmVyRGF0YShnbC5BUlJBWV9CVUZGRVIsIG5ldyBGbG9hdDMyQXJyYXkoWy0xLC0xLDEsLTEsLTEsMSwtMSwxLDEsLTEsMSwxXSksIGdsLlNUQVRJQ19EUkFXKTsKICAgICAgdmFyIGxvYyA9IGdsLmdldEF0dHJpYkxvY2F0aW9uKHByb2csICdwJyk7CiAgICAgIGdsLmVuYWJsZVZlcnRleEF0dHJpYkFycmF5KGxvYyk7CiAgICAgIGdsLnZlcnRleEF0dHJpYlBvaW50ZXIobG9jLCAyLCBnbC5GTE9BVCwgZmFsc2UsIDAsIDApOwoKICAgICAgdmFyIHVSZXMgPSBnbC5nZXRVbmlmb3JtTG9jYXRpb24ocHJvZywgJ3VfcmVzJyk7CiAgICAgIHZhciB1VGltZSA9IGdsLmdldFVuaWZvcm1Mb2NhdGlvbihwcm9nLCAndV90aW1lJyk7CiAgICAgIHZhciB1TW91c2UgPSBnbC5nZXRVbmlmb3JtTG9jYXRpb24ocHJvZywgJ3VfbW91c2UnKTsKCiAgICAgIHZhciBtb3VzZSA9IFswLjU1LCAwLjVdLCB0YXJnZXQgPSBbMC41NSwgMC41XTsKCiAgICAgIGZ1bmN0aW9uIHJlc2l6ZSgpIHsKICAgICAgICB2YXIgZHByID0gTWF0aC5taW4od2luZG93LmRldmljZVBpeGVsUmF0aW8gfHwgMSwgMik7CiAgICAgICAgY2FudmFzLndpZHRoID0gd2luZG93LmlubmVyV2lkdGggKiBkcHI7CiAgICAgICAgY2FudmFzLmhlaWdodCA9IHdpbmRvdy5pbm5lckhlaWdodCAqIGRwcjsKICAgICAgICBnbC52aWV3cG9ydCgwLCAwLCBjYW52YXMud2lkdGgsIGNhbnZhcy5oZWlnaHQpOwogICAgICB9CiAgICAgIHdpbmRvdy5hZGRFdmVudExpc3RlbmVyKCdyZXNpemUnLCByZXNpemUpOwogICAgICByZXNpemUoKTsKCiAgICAgIHdpbmRvdy5hZGRFdmVudExpc3RlbmVyKCdtb3VzZW1vdmUnLCBmdW5jdGlvbiAoZSkgewogICAgICAgIHRhcmdldFswXSA9IGUuY2xpZW50WCAvIHdpbmRvdy5pbm5lcldpZHRoOwogICAgICAgIHRhcmdldFsxXSA9IDEuMCAtIGUuY2xpZW50WSAvIHdpbmRvdy5pbm5lckhlaWdodDsKICAgICAgfSk7CgogICAgICB2YXIgc3RhcnQgPSBEYXRlLm5vdygpOwogICAgICBmdW5jdGlvbiByZW5kZXIoKSB7CiAgICAgICAgbW91c2VbMF0gKz0gKHRhcmdldFswXSAtIG1vdXNlWzBdKSAqIDAuMDQ7CiAgICAgICAgbW91c2VbMV0gKz0gKHRhcmdldFsxXSAtIG1vdXNlWzFdKSAqIDAuMDQ7CiAgICAgICAgZ2wudW5pZm9ybTJmKHVSZXMsIGNhbnZhcy53aWR0aCwgY2FudmFzLmhlaWdodCk7CiAgICAgICAgZ2wudW5pZm9ybTFmKHVUaW1lLCAoRGF0ZS5ub3coKSAtIHN0YXJ0KSAvIDEwMDApOwogICAgICAgIGdsLnVuaWZvcm0yZih1TW91c2UsIG1vdXNlWzBdLCBtb3VzZVsxXSk7CiAgICAgICAgZ2wuZHJhd0FycmF5cyhnbC5UUklBTkdMRVMsIDAsIDYpOwogICAgICAgIHJlcXVlc3RBbmltYXRpb25GcmFtZShyZW5kZXIpOwogICAgICB9CiAgICAgIHJlbmRlcigpOwogICAgfSkoKTsKICA8L3NjcmlwdD4KCjwvYm9keT4KPC9odG1sPgo=";
const assetFiles = ["assets/page-01-2f563338-39fa-47ea-9761-658d4f3f84db-1600w.jpg","assets/page-02-4f5668c5-fc4a-44e0-bc5e-a664189d3c31-1600w.jpg","assets/page-03-77415a2e-dcbc-4748-a29d-fced4821881a-1600w.jpg","assets/page-04-c92852bb-a510-405a-85ab-ffa0fde136a4-1600w.jpg"];
const runtimeFiles = ["../../../../assets/runtime/runtime-163ebd087cfc-iconify-icon-min.js","../../../../assets/runtime/runtime-ccc8894b3418-runtime.js"];
const frame = document.getElementById("neuform-demo");
const decodeBytes = (value) => Uint8Array.from(atob(value), (character) => character.charCodeAt(0));
const decode = (value) => new TextDecoder().decode(decodeBytes(value));
const encodeBytes = (bytes) => {
let binary = "";
for (let index = 0; index < bytes.length; index += 32768) {
binary += String.fromCharCode(...bytes.subarray(index, index + 32768));
}
return btoa(binary);
};
const mediaTypes = {
avif: "image/avif",
gif: "image/gif",
jpg: "image/jpeg",
jpeg: "image/jpeg",
mp4: "video/mp4",
png: "image/png",
webm: "video/webm",
webp: "image/webp"
};
const loadAsset = async (file) => {
const response = await fetch(file, { cache: "no-store", credentials: "omit", redirect: "error" });
if (!response.ok) throw new Error("Could not load local demo asset: " + file);
const extension = file.split(".").pop().toLowerCase();
const contentType = mediaTypes[extension] || "application/octet-stream";
const bytes = new Uint8Array(await response.arrayBuffer());
return { base64: encodeBytes(bytes), contentType, file, kind: "asset" };
};
Promise.allSettled(assetFiles.map(loadAsset)).then((results) => {
const runtimeSources = runtimeFiles.map((file) => new URL(file, location.href).href).join(" ");
const source = decode(encodedHtml).replace("__NEUFORM_RUNTIME_SOURCES__", runtimeSources);
const mediaAssets = [];
for (const result of results) {
if (result.status !== "fulfilled") continue;
mediaAssets.push(result.value);
}
frame.addEventListener("load", () => {
frame.contentWindow.postMessage({ type: "neuform-assets-v1", assets: mediaAssets }, "*");
}, { once: true });
frame.srcdoc = source;
}).catch((error) => {
document.body.innerHTML = '<div class="error">Unable to load this sandboxed demo.</div>';
console.error(error);
});
</script>
</body>
</html>
Requirements and compatibility
Works with: Claude Code, Claude apps, OpenAI Codex, GitHub Copilot, Cursor, Gemini CLI, Kiro, OpenCode, Goose, Amp, Roo Code, JetBrains Junie, Factory Droid, Devin (ex-Windsurf), Mistral Vibe, OpenHands, Letta
“Works with” means the tool reads the open Agent Skills format; a skill written for one tool may use features others lack.
Security
What our scanner noticed· Medium risk
- Large base64-encoded blobs
A static scan is not a guarantee. Skills are third-party content: review a skill before you let an agent use it.
Attribution and licence
- Created by
- Meng To
- Publisher
- Meng To (Community)
- Source
- MengTo/Skills · agent-skills/web-design/nested-container-clean-agency · commit 5ea1661
- Licence
- MIT License (redistribution allowed)
- LICENSE (added by AutoGineer from LICENSE)
- ATTRIBUTION.md (written by AutoGineer)
- Synced
AutoGineer is not affiliated with or endorsed by Meng To or Meng To.
Download ZIP
The ZIP holds the skill’s files, its licence files and an ATTRIBUTION.md. Download nested-container-clean-agency.zip