Generated banner for Nested Container Clean Agency
Generated logo for Nested Container Clean Agency

Nested Container Clean Agency

Meng ToCommunityCreated by Meng To

  • Skill
  • Content generator
  • Design and creative
  • MIT
  • Medium risk

From the author

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.
— the description by Meng To

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

  1. Download the skill as a ZIP:

    https://mp-staging.autogineer.com/agent-skills/mengto/nested-container-clean-agency/download
  2. Unzip 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.

  • 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

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.

Download ZIP

The ZIP holds the skill’s files, its licence files and an ATTRIBUTION.md. Download nested-container-clean-agency.zip