drill-widgets 2.7.2

package/dist/begin-widgets.umd.js

@@ -0,0 +1,4238 @@
+(function(D,A){typeof exports=="object"&&typeof module<"u"?A(exports):typeof define=="function"&&define.amd?define(["exports"],A):(D=typeof globalThis<"u"?globalThis:D||self,A(D.Begin={}))})(this,function(D){"use strict";/**
+ * @license
+ * Copyright 2019 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */var Re;const A=globalThis,se=A.ShadowRoot&&(A.ShadyCSS===void 0||A.ShadyCSS.nativeShadow)&&"adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.prototype,re=Symbol(),xe=new WeakMap;let _e=class{constructor(e,t,n){if(this._$cssResult$=!0,n!==re)throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");this.cssText=e,this.t=t}get styleSheet(){let e=this.o;const t=this.t;if(se&&e===void 0){const n=t!==void 0&&t.length===1;n&&(e=xe.get(t)),e===void 0&&((this.o=e=new CSSStyleSheet).replaceSync(this.cssText),n&&xe.set(t,e))}return e}toString(){return this.cssText}};const We=i=>new _e(typeof i=="string"?i:i+"",void 0,re),L=(i,...e)=>{const t=i.length===1?i[0]:e.reduce((n,s,r)=>n+(o=>{if(o._$cssResult$===!0)return o.cssText;if(typeof o=="number")return o;throw Error("Value passed to 'css' function must be a 'css' function result: "+o+". Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security.")})(s)+i[r+1],i[0]);return new _e(t,i,re)},He=(i,e)=>{if(se)i.adoptedStyleSheets=e.map(t=>t instanceof CSSStyleSheet?t:t.styleSheet);else for(const t of e){const n=document.createElement("style"),s=A.litNonce;s!==void 0&&n.setAttribute("nonce",s),n.textContent=t.cssText,i.appendChild(n)}},ye=se?i=>i:i=>i instanceof CSSStyleSheet?(e=>{let t="";for(const n of e.cssRules)t+=n.cssText;return We(t)})(i):i;/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */const{is:Ve,defineProperty:je,getOwnPropertyDescriptor:Be,getOwnPropertyNames:Qe,getOwnPropertySymbols:qe,getPrototypeOf:Ge}=Object,M=globalThis,Se=M.trustedTypes,Ye=Se?Se.emptyScript:"",oe=M.reactiveElementPolyfillSupport,W=(i,e)=>i,Y={toAttribute(i,e){switch(e){case Boolean:i=i?Ye:null;break;case Object:case Array:i=i==null?i:JSON.stringify(i)}return i},fromAttribute(i,e){let t=i;switch(e){case Boolean:t=i!==null;break;case Number:t=i===null?null:Number(i);break;case Object:case Array:try{t=JSON.parse(i)}catch{t=null}}return t}},ae=(i,e)=>!Ve(i,e),we={attribute:!0,type:String,converter:Y,reflect:!1,useDefault:!1,hasChanged:ae};Symbol.metadata??(Symbol.metadata=Symbol("metadata")),M.litPropertyMetadata??(M.litPropertyMetadata=new WeakMap);let N=class extends HTMLElement{static addInitializer(e){this._$Ei(),(this.l??(this.l=[])).push(e)}static get observedAttributes(){return this.finalize(),this._$Eh&&[...this._$Eh.keys()]}static createProperty(e,t=we){if(t.state&&(t.attribute=!1),this._$Ei(),this.prototype.hasOwnProperty(e)&&((t=Object.create(t)).wrapped=!0),this.elementProperties.set(e,t),!t.noAccessor){const n=Symbol(),s=this.getPropertyDescriptor(e,n,t);s!==void 0&&je(this.prototype,e,s)}}static getPropertyDescriptor(e,t,n){const{get:s,set:r}=Be(this.prototype,e)??{get(){return this[t]},set(o){this[t]=o}};return{get:s,set(o){const a=s==null?void 0:s.call(this);r==null||r.call(this,o),this.requestUpdate(e,a,n)},configurable:!0,enumerable:!0}}static getPropertyOptions(e){return this.elementProperties.get(e)??we}static _$Ei(){if(this.hasOwnProperty(W("elementProperties")))return;const e=Ge(this);e.finalize(),e.l!==void 0&&(this.l=[...e.l]),this.elementProperties=new Map(e.elementProperties)}static finalize(){if(this.hasOwnProperty(W("finalized")))return;if(this.finalized=!0,this._$Ei(),this.hasOwnProperty(W("properties"))){const t=this.properties,n=[...Qe(t),...qe(t)];for(const s of n)this.createProperty(s,t[s])}const e=this[Symbol.metadata];if(e!==null){const t=litPropertyMetadata.get(e);if(t!==void 0)for(const[n,s]of t)this.elementProperties.set(n,s)}this._$Eh=new Map;for(const[t,n]of this.elementProperties){const s=this._$Eu(t,n);s!==void 0&&this._$Eh.set(s,t)}this.elementStyles=this.finalizeStyles(this.styles)}static finalizeStyles(e){const t=[];if(Array.isArray(e)){const n=new Set(e.flat(1/0).reverse());for(const s of n)t.unshift(ye(s))}else e!==void 0&&t.push(ye(e));return t}static _$Eu(e,t){const n=t.attribute;return n===!1?void 0:typeof n=="string"?n:typeof e=="string"?e.toLowerCase():void 0}constructor(){super(),this._$Ep=void 0,this.isUpdatePending=!1,this.hasUpdated=!1,this._$Em=null,this._$Ev()}_$Ev(){var e;this._$ES=new Promise(t=>this.enableUpdating=t),this._$AL=new Map,this._$E_(),this.requestUpdate(),(e=this.constructor.l)==null||e.forEach(t=>t(this))}addController(e){var t;(this._$EO??(this._$EO=new Set)).add(e),this.renderRoot!==void 0&&this.isConnected&&((t=e.hostConnected)==null||t.call(e))}removeController(e){var t;(t=this._$EO)==null||t.delete(e)}_$E_(){const e=new Map,t=this.constructor.elementProperties;for(const n of t.keys())this.hasOwnProperty(n)&&(e.set(n,this[n]),delete this[n]);e.size>0&&(this._$Ep=e)}createRenderRoot(){const e=this.shadowRoot??this.attachShadow(this.constructor.shadowRootOptions);return He(e,this.constructor.elementStyles),e}connectedCallback(){var e;this.renderRoot??(this.renderRoot=this.createRenderRoot()),this.enableUpdating(!0),(e=this._$EO)==null||e.forEach(t=>{var n;return(n=t.hostConnected)==null?void 0:n.call(t)})}enableUpdating(e){}disconnectedCallback(){var e;(e=this._$EO)==null||e.forEach(t=>{var n;return(n=t.hostDisconnected)==null?void 0:n.call(t)})}attributeChangedCallback(e,t,n){this._$AK(e,n)}_$ET(e,t){var r;const n=this.constructor.elementProperties.get(e),s=this.constructor._$Eu(e,n);if(s!==void 0&&n.reflect===!0){const o=(((r=n.converter)==null?void 0:r.toAttribute)!==void 0?n.converter:Y).toAttribute(t,n.type);this._$Em=e,o==null?this.removeAttribute(s):this.setAttribute(s,o),this._$Em=null}}_$AK(e,t){var r,o;const n=this.constructor,s=n._$Eh.get(e);if(s!==void 0&&this._$Em!==s){const a=n.getPropertyOptions(s),d=typeof a.converter=="function"?{fromAttribute:a.converter}:((r=a.converter)==null?void 0:r.fromAttribute)!==void 0?a.converter:Y;this._$Em=s,this[s]=d.fromAttribute(t,a.type)??((o=this._$Ej)==null?void 0:o.get(s))??null,this._$Em=null}}requestUpdate(e,t,n){var s;if(e!==void 0){const r=this.constructor,o=this[e];if(n??(n=r.getPropertyOptions(e)),!((n.hasChanged??ae)(o,t)||n.useDefault&&n.reflect&&o===((s=this._$Ej)==null?void 0:s.get(e))&&!this.hasAttribute(r._$Eu(e,n))))return;this.C(e,t,n)}this.isUpdatePending===!1&&(this._$ES=this._$EP())}C(e,t,{useDefault:n,reflect:s,wrapped:r},o){n&&!(this._$Ej??(this._$Ej=new Map)).has(e)&&(this._$Ej.set(e,o??t??this[e]),r!==!0||o!==void 0)||(this._$AL.has(e)||(this.hasUpdated||n||(t=void 0),this._$AL.set(e,t)),s===!0&&this._$Em!==e&&(this._$Eq??(this._$Eq=new Set)).add(e))}async _$EP(){this.isUpdatePending=!0;try{await this._$ES}catch(t){Promise.reject(t)}const e=this.scheduleUpdate();return e!=null&&await e,!this.isUpdatePending}scheduleUpdate(){return this.performUpdate()}performUpdate(){var n;if(!this.isUpdatePending)return;if(!this.hasUpdated){if(this.renderRoot??(this.renderRoot=this.createRenderRoot()),this._$Ep){for(const[r,o]of this._$Ep)this[r]=o;this._$Ep=void 0}const s=this.constructor.elementProperties;if(s.size>0)for(const[r,o]of s){const{wrapped:a}=o,d=this[r];a!==!0||this._$AL.has(r)||d===void 0||this.C(r,void 0,o,d)}}let e=!1;const t=this._$AL;try{e=this.shouldUpdate(t),e?(this.willUpdate(t),(n=this._$EO)==null||n.forEach(s=>{var r;return(r=s.hostUpdate)==null?void 0:r.call(s)}),this.update(t)):this._$EM()}catch(s){throw e=!1,this._$EM(),s}e&&this._$AE(t)}willUpdate(e){}_$AE(e){var t;(t=this._$EO)==null||t.forEach(n=>{var s;return(s=n.hostUpdated)==null?void 0:s.call(n)}),this.hasUpdated||(this.hasUpdated=!0,this.firstUpdated(e)),this.updated(e)}_$EM(){this._$AL=new Map,this.isUpdatePending=!1}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this._$ES}shouldUpdate(e){return!0}update(e){this._$Eq&&(this._$Eq=this._$Eq.forEach(t=>this._$ET(t,this[t]))),this._$EM()}updated(e){}firstUpdated(e){}};N.elementStyles=[],N.shadowRootOptions={mode:"open"},N[W("elementProperties")]=new Map,N[W("finalized")]=new Map,oe==null||oe({ReactiveElement:N}),(M.reactiveElementVersions??(M.reactiveElementVersions=[])).push("2.1.0");/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */const H=globalThis,J=H.trustedTypes,ke=J?J.createPolicy("lit-html",{createHTML:i=>i}):void 0,$e="$lit$",T=`lit$${Math.random().toFixed(9).slice(2)}$`,De="?"+T,Je=`<${De}>`,F=document,V=()=>F.createComment(""),j=i=>i===null||typeof i!="object"&&typeof i!="function",de=Array.isArray,Ke=i=>de(i)||typeof(i==null?void 0:i[Symbol.iterator])=="function",le=`[ 	
+\f\r]`,B=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,Ce=/-->/g,Ee=/>/g,z=RegExp(`>|${le}(?:([^\\s"'>=/]+)(${le}*=${le}*(?:[^ 	
+\f\r"'\`<>=]|("|')|))|$)`,"g"),Ae=/'/g,Me=/"/g,Te=/^(?:script|style|textarea|title)$/i,Xe=i=>(e,...t)=>({_$litType$:i,strings:e,values:t}),l=Xe(1),I=Symbol.for("lit-noChange"),v=Symbol.for("lit-nothing"),Fe=new WeakMap,U=F.createTreeWalker(F,129);function ze(i,e){if(!de(i)||!i.hasOwnProperty("raw"))throw Error("invalid template strings array");return ke!==void 0?ke.createHTML(e):e}const Ze=(i,e)=>{const t=i.length-1,n=[];let s,r=e===2?"<svg>":e===3?"<math>":"",o=B;for(let a=0;a<t;a++){const d=i[a];let p,c,u=-1,h=0;for(;h<d.length&&(o.lastIndex=h,c=o.exec(d),c!==null);)h=o.lastIndex,o===B?c[1]==="!--"?o=Ce:c[1]!==void 0?o=Ee:c[2]!==void 0?(Te.test(c[2])&&(s=RegExp("</"+c[2],"g")),o=z):c[3]!==void 0&&(o=z):o===z?c[0]===">"?(o=s??B,u=-1):c[1]===void 0?u=-2:(u=o.lastIndex-c[2].length,p=c[1],o=c[3]===void 0?z:c[3]==='"'?Me:Ae):o===Me||o===Ae?o=z:o===Ce||o===Ee?o=B:(o=z,s=void 0);const f=o===z&&i[a+1].startsWith("/>")?" ":"";r+=o===B?d+Je:u>=0?(n.push(p),d.slice(0,u)+$e+d.slice(u)+T+f):d+T+(u===-2?a:f)}return[ze(i,r+(i[t]||"<?>")+(e===2?"</svg>":e===3?"</math>":"")),n]};class Q{constructor({strings:e,_$litType$:t},n){let s;this.parts=[];let r=0,o=0;const a=e.length-1,d=this.parts,[p,c]=Ze(e,t);if(this.el=Q.createElement(p,n),U.currentNode=this.el.content,t===2||t===3){const u=this.el.content.firstChild;u.replaceWith(...u.childNodes)}for(;(s=U.nextNode())!==null&&d.length<a;){if(s.nodeType===1){if(s.hasAttributes())for(const u of s.getAttributeNames())if(u.endsWith($e)){const h=c[o++],f=s.getAttribute(u).split(T),b=/([.?@])?(.*)/.exec(h);d.push({type:1,index:r,name:b[2],strings:f,ctor:b[1]==="."?tt:b[1]==="?"?it:b[1]==="@"?nt:K}),s.removeAttribute(u)}else u.startsWith(T)&&(d.push({type:6,index:r}),s.removeAttribute(u));if(Te.test(s.tagName)){const u=s.textContent.split(T),h=u.length-1;if(h>0){s.textContent=J?J.emptyScript:"";for(let f=0;f<h;f++)s.append(u[f],V()),U.nextNode(),d.push({type:2,index:++r});s.append(u[h],V())}}}else if(s.nodeType===8)if(s.data===De)d.push({type:2,index:r});else{let u=-1;for(;(u=s.data.indexOf(T,u+1))!==-1;)d.push({type:7,index:r}),u+=T.length-1}r++}}static createElement(e,t){const n=F.createElement("template");return n.innerHTML=e,n}}function O(i,e,t=i,n){var o,a;if(e===I)return e;let s=n!==void 0?(o=t._$Co)==null?void 0:o[n]:t._$Cl;const r=j(e)?void 0:e._$litDirective$;return(s==null?void 0:s.constructor)!==r&&((a=s==null?void 0:s._$AO)==null||a.call(s,!1),r===void 0?s=void 0:(s=new r(i),s._$AT(i,t,n)),n!==void 0?(t._$Co??(t._$Co=[]))[n]=s:t._$Cl=s),s!==void 0&&(e=O(i,s._$AS(i,e.values),s,n)),e}class et{constructor(e,t){this._$AV=[],this._$AN=void 0,this._$AD=e,this._$AM=t}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}u(e){const{el:{content:t},parts:n}=this._$AD,s=((e==null?void 0:e.creationScope)??F).importNode(t,!0);U.currentNode=s;let r=U.nextNode(),o=0,a=0,d=n[0];for(;d!==void 0;){if(o===d.index){let p;d.type===2?p=new q(r,r.nextSibling,this,e):d.type===1?p=new d.ctor(r,d.name,d.strings,this,e):d.type===6&&(p=new st(r,this,e)),this._$AV.push(p),d=n[++a]}o!==(d==null?void 0:d.index)&&(r=U.nextNode(),o++)}return U.currentNode=F,s}p(e){let t=0;for(const n of this._$AV)n!==void 0&&(n.strings!==void 0?(n._$AI(e,n,t),t+=n.strings.length-2):n._$AI(e[t])),t++}}class q{get _$AU(){var e;return((e=this._$AM)==null?void 0:e._$AU)??this._$Cv}constructor(e,t,n,s){this.type=2,this._$AH=v,this._$AN=void 0,this._$AA=e,this._$AB=t,this._$AM=n,this.options=s,this._$Cv=(s==null?void 0:s.isConnected)??!0}get parentNode(){let e=this._$AA.parentNode;const t=this._$AM;return t!==void 0&&(e==null?void 0:e.nodeType)===11&&(e=t.parentNode),e}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(e,t=this){e=O(this,e,t),j(e)?e===v||e==null||e===""?(this._$AH!==v&&this._$AR(),this._$AH=v):e!==this._$AH&&e!==I&&this._(e):e._$litType$!==void 0?this.$(e):e.nodeType!==void 0?this.T(e):Ke(e)?this.k(e):this._(e)}O(e){return this._$AA.parentNode.insertBefore(e,this._$AB)}T(e){this._$AH!==e&&(this._$AR(),this._$AH=this.O(e))}_(e){this._$AH!==v&&j(this._$AH)?this._$AA.nextSibling.data=e:this.T(F.createTextNode(e)),this._$AH=e}$(e){var r;const{values:t,_$litType$:n}=e,s=typeof n=="number"?this._$AC(e):(n.el===void 0&&(n.el=Q.createElement(ze(n.h,n.h[0]),this.options)),n);if(((r=this._$AH)==null?void 0:r._$AD)===s)this._$AH.p(t);else{const o=new et(s,this),a=o.u(this.options);o.p(t),this.T(a),this._$AH=o}}_$AC(e){let t=Fe.get(e.strings);return t===void 0&&Fe.set(e.strings,t=new Q(e)),t}k(e){de(this._$AH)||(this._$AH=[],this._$AR());const t=this._$AH;let n,s=0;for(const r of e)s===t.length?t.push(n=new q(this.O(V()),this.O(V()),this,this.options)):n=t[s],n._$AI(r),s++;s<t.length&&(this._$AR(n&&n._$AB.nextSibling,s),t.length=s)}_$AR(e=this._$AA.nextSibling,t){var n;for((n=this._$AP)==null?void 0:n.call(this,!1,!0,t);e&&e!==this._$AB;){const s=e.nextSibling;e.remove(),e=s}}setConnected(e){var t;this._$AM===void 0&&(this._$Cv=e,(t=this._$AP)==null||t.call(this,e))}}class K{get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}constructor(e,t,n,s,r){this.type=1,this._$AH=v,this._$AN=void 0,this.element=e,this.name=t,this._$AM=s,this.options=r,n.length>2||n[0]!==""||n[1]!==""?(this._$AH=Array(n.length-1).fill(new String),this.strings=n):this._$AH=v}_$AI(e,t=this,n,s){const r=this.strings;let o=!1;if(r===void 0)e=O(this,e,t,0),o=!j(e)||e!==this._$AH&&e!==I,o&&(this._$AH=e);else{const a=e;let d,p;for(e=r[0],d=0;d<r.length-1;d++)p=O(this,a[n+d],t,d),p===I&&(p=this._$AH[d]),o||(o=!j(p)||p!==this._$AH[d]),p===v?e=v:e!==v&&(e+=(p??"")+r[d+1]),this._$AH[d]=p}o&&!s&&this.j(e)}j(e){e===v?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,e??"")}}class tt extends K{constructor(){super(...arguments),this.type=3}j(e){this.element[this.name]=e===v?void 0:e}}class it extends K{constructor(){super(...arguments),this.type=4}j(e){this.element.toggleAttribute(this.name,!!e&&e!==v)}}class nt extends K{constructor(e,t,n,s,r){super(e,t,n,s,r),this.type=5}_$AI(e,t=this){if((e=O(this,e,t,0)??v)===I)return;const n=this._$AH,s=e===v&&n!==v||e.capture!==n.capture||e.once!==n.once||e.passive!==n.passive,r=e!==v&&(n===v||s);s&&this.element.removeEventListener(this.name,this,n),r&&this.element.addEventListener(this.name,this,e),this._$AH=e}handleEvent(e){var t;typeof this._$AH=="function"?this._$AH.call(((t=this.options)==null?void 0:t.host)??this.element,e):this._$AH.handleEvent(e)}}class st{constructor(e,t,n){this.element=e,this.type=6,this._$AN=void 0,this._$AM=t,this.options=n}get _$AU(){return this._$AM._$AU}_$AI(e){O(this,e)}}const pe=H.litHtmlPolyfillSupport;pe==null||pe(Q,q),(H.litHtmlVersions??(H.litHtmlVersions=[])).push("3.3.0");const rt=(i,e,t)=>{const n=(t==null?void 0:t.renderBefore)??e;let s=n._$litPart$;if(s===void 0){const r=(t==null?void 0:t.renderBefore)??null;n._$litPart$=s=new q(e.insertBefore(V(),r),r,void 0,t??{})}return s._$AI(i),s};/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */const P=globalThis;let R=class extends N{constructor(){super(...arguments),this.renderOptions={host:this},this._$Do=void 0}createRenderRoot(){var t;const e=super.createRenderRoot();return(t=this.renderOptions).renderBefore??(t.renderBefore=e.firstChild),e}update(e){const t=this.render();this.hasUpdated||(this.renderOptions.isConnected=this.isConnected),super.update(e),this._$Do=rt(t,this.renderRoot,this.renderOptions)}connectedCallback(){var e;super.connectedCallback(),(e=this._$Do)==null||e.setConnected(!0)}disconnectedCallback(){var e;super.disconnectedCallback(),(e=this._$Do)==null||e.setConnected(!1)}render(){return I}};R._$litElement$=!0,R.finalized=!0,(Re=P.litElementHydrateSupport)==null||Re.call(P,{LitElement:R});const ce=P.litElementPolyfillSupport;ce==null||ce({LitElement:R}),(P.litElementVersions??(P.litElementVersions=[])).push("4.2.0");/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */const Ie=i=>(e,t)=>{t!==void 0?t.addInitializer(()=>{customElements.define(i,e)}):customElements.define(i,e)};/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */const ot={attribute:!0,type:String,converter:Y,reflect:!1,hasChanged:ae},at=(i=ot,e,t)=>{const{kind:n,metadata:s}=t;let r=globalThis.litPropertyMetadata.get(s);if(r===void 0&&globalThis.litPropertyMetadata.set(s,r=new Map),n==="setter"&&((i=Object.create(i)).wrapped=!0),r.set(t.name,i),n==="accessor"){const{name:o}=t;return{set(a){const d=e.get.call(this);e.set.call(this,a),this.requestUpdate(o,d,i)},init(a){return a!==void 0&&this.C(o,void 0,i,a),a}}}if(n==="setter"){const{name:o}=t;return function(a){const d=this[o];e.call(this,a),this.requestUpdate(o,d,i)}}throw Error("Unsupported decorator location: "+n)};function C(i){return(e,t)=>typeof t=="object"?at(i,e,t):((n,s,r)=>{const o=s.hasOwnProperty(r);return s.constructor.createProperty(r,n),o?Object.getOwnPropertyDescriptor(s,r):void 0})(i,e,t)}/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */function _(i){return C({...i,state:!0,attribute:!1})}const y=[];for(let i=0;i<256;++i)y.push((i+256).toString(16).slice(1));function dt(i,e=0){return(y[i[e+0]]+y[i[e+1]]+y[i[e+2]]+y[i[e+3]]+"-"+y[i[e+4]]+y[i[e+5]]+"-"+y[i[e+6]]+y[i[e+7]]+"-"+y[i[e+8]]+y[i[e+9]]+"-"+y[i[e+10]]+y[i[e+11]]+y[i[e+12]]+y[i[e+13]]+y[i[e+14]]+y[i[e+15]]).toLowerCase()}let ue;const lt=new Uint8Array(16);function pt(){if(!ue){if(typeof crypto>"u"||!crypto.getRandomValues)throw new Error("crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported");ue=crypto.getRandomValues.bind(crypto)}return ue(lt)}const Ue={randomUUID:typeof crypto<"u"&&crypto.randomUUID&&crypto.randomUUID.bind(crypto)};function he(i,e,t){var s;if(Ue.randomUUID&&!i)return Ue.randomUUID();i=i||{};const n=i.random??((s=i.rng)==null?void 0:s.call(i))??pt();if(n.length<16)throw new Error("Random bytes length must be >= 16");return n[6]=n[6]&15|64,n[8]=n[8]&63|128,dt(n)}const ct=L`
+  :host {
+    display: block;
+    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
+      sans-serif;
+    background-color: #f9fafb; /* Lighter gray background */
+    border-radius: 8px;
+    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
+    overflow: hidden;
+    min-height: 600px;
+  }
+
+  /* Header */
+  .header {
+    display: flex;
+    justify-content: space-between;
+    align-items: flex-end;
+    padding: 24px;
+    border-bottom: 1px solid #e5e7eb;
+    background-color: #ffffff;
+    gap: 24px;
+  }
+
+  .header-inputs {
+    display: flex;
+    gap: 24px;
+    flex: 1;
+  }
+
+  .header-actions {
+    display: flex;
+    gap: 12px;
+    flex-shrink: 0;
+  }
+
+  .header-actions button {
+    padding: 8px 16px;
+    border-radius: 6px;
+    font-size: 14px;
+    font-weight: 500;
+    cursor: pointer;
+    transition: all 0.2s ease;
+  }
+
+  .cancel-button {
+    background-color: #ffffff;
+    color: #374151;
+    border: 1px solid #d1d5db;
+  }
+
+  .cancel-button:hover {
+    background-color: #f9fafb;
+    border-color: #9ca3af;
+  }
+
+  .save-button {
+    background-color: #0f766e;
+    color: #ffffff;
+    border: 1px solid #0f766e;
+    padding: 12px 24px;
+    font-weight: 600;
+  }
+
+  .save-button:hover {
+    background-color: #0d9488;
+    border-color: #0d9488;
+  }
+
+  /* Main Content */
+  .main-content {
+    padding: 0;
+    background-color: #f9fafb; /* Lighter gray background continues */
+  }
+`,ut=L`
+  .form-group {
+    display: flex;
+    flex-direction: column;
+    flex: 1;
+  }
+
+  .form-group label {
+    font-weight: 500;
+    color: #374151;
+    margin-bottom: 8px;
+    font-size: 14px;
+  }
+
+  .form-group input,
+  .form-group textarea {
+    padding: 12px;
+    border: 1px solid #d1d5db;
+    border-radius: 6px;
+    font-size: 14px;
+    transition: border-color 0.2s ease;
+  }
+
+  .form-group input:focus,
+  .form-group textarea:focus {
+    outline: none;
+    border-color: #3b82f6;
+    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
+  }
+
+  .form-group input::placeholder,
+  .form-group textarea::placeholder {
+    color: #9ca3af;
+  }
+
+  /* Two Column Layout */
+  .content-columns {
+    background-color: #ffffff;
+    display: grid;
+    grid-template-columns: 2fr 3fr;
+    min-height: 500px;
+    gap: 1px;
+    border: 1px solid #e5e7eb;
+    overflow: hidden;
+  }
+
+  /* Checkbox Configuration Styles */
+  .question-checkbox-config {
+    margin-top: 12px;
+  }
+
+  .checkbox-type-selection {
+    display: flex;
+    flex-direction: column;
+    gap: 8px;
+    margin-bottom: 16px;
+  }
+
+  .checkbox-type-label {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    font-size: 14px;
+    color: #374151;
+    cursor: pointer;
+    padding: 8px;
+    border-radius: 6px;
+    transition: background-color 0.2s ease;
+  }
+
+  .checkbox-type-label:hover {
+    background-color: #f9fafb;
+  }
+
+  .checkbox-type-label input[type="radio"] {
+    margin: 0;
+    cursor: pointer;
+  }
+
+  .single-checkbox-info {
+    background-color: #f0f9ff;
+    border: 1px solid #bae6fd;
+    border-radius: 6px;
+    padding: 12px;
+    margin-top: 8px;
+  }
+
+  .single-checkbox-info .config-note {
+    margin: 0;
+    font-size: 14px;
+    color: #0369a1;
+    font-style: italic;
+  }
+
+  /* Content Element Styles */
+  .add-buttons {
+    display: flex;
+    gap: 8px;
+    align-items: center;
+  }
+
+  .content-dropdown {
+    position: relative;
+    display: inline-block;
+  }
+
+  .content-options {
+    position: absolute;
+    top: 100%;
+    right: 0;
+    background: white;
+    border: 1px solid #d1d5db;
+    border-radius: 6px;
+    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
+    z-index: 1000;
+    min-width: 120px;
+    display: none;
+  }
+
+  .content-dropdown:hover .content-options {
+    display: block;
+  }
+
+  .content-options button {
+    display: block;
+    width: 100%;
+    padding: 8px 12px;
+    border: none;
+    background: white;
+    text-align: left;
+    font-size: 14px;
+    cursor: pointer;
+    transition: background-color 0.2s ease;
+  }
+
+  .content-options button:hover {
+    background-color: #f3f4f6;
+  }
+
+  .content-item {
+    border: 1px solid #e5e7eb;
+    border-radius: 6px;
+    padding: 16px;
+    margin-bottom: 12px;
+    background: #f9fafb;
+  }
+
+  .content-header {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    margin-bottom: 12px;
+  }
+
+  .content-title {
+    margin: 0;
+    font-size: 16px;
+    font-weight: 600;
+    color: #374151;
+  }
+
+  .content-header-controls {
+    display: flex;
+    gap: 8px;
+    align-items: center;
+  }
+
+  .content-type-select {
+    padding: 4px 8px;
+    border: 1px solid #d1d5db;
+    border-radius: 4px;
+    font-size: 12px;
+    background: white;
+  }
+
+  .content-config-section {
+    margin-top: 12px;
+  }
+
+  .config-textarea {
+    width: 100%;
+    min-height: 80px;
+    padding: 8px;
+    border: 1px solid #d1d5db;
+    border-radius: 4px;
+    font-size: 14px;
+    font-family: inherit;
+    resize: vertical;
+  }
+
+  .config-textarea:focus {
+    outline: none;
+    border-color: #3b82f6;
+    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
+  }
+`,ht=L`
+  /* Steps and Questions Sections */
+  .section {
+    padding: 16px;
+    background-color: #ffffff;
+  }
+
+  .section-header {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    margin-bottom: 16px;
+  }
+
+  .section-header h2 {
+    margin: 0;
+    font-size: 18px;
+    font-weight: 600;
+    color: #111827;
+  }
+
+  .add-button {
+    background-color: #f9fafb; /* Gray background to match sections */
+    color: #3b82f6;
+    border: 1px solid #3b82f6;
+    padding: 6px 12px;
+    border-radius: 6px;
+    font-size: 14px;
+    font-weight: 500;
+    cursor: pointer;
+    transition: all 0.2s ease;
+    display: flex;
+    align-items: center;
+    gap: 6px;
+  }
+
+  .add-button:hover {
+    background-color: #f3f4f6; /* Slightly darker gray on hover */
+  }
+
+  .add-button::before {
+    content: "+";
+    font-size: 16px;
+    font-weight: 600;
+  }
+
+  /* Empty States */
+  .empty-state {
+    text-align: center;
+    padding: 48px 24px;
+    background-color: transparent; /* No background color */
+    border: none; /* No dashed border */
+    border-radius: 0;
+    margin-top: 16px;
+  }
+
+  .empty-state h3 {
+    margin: 0 0 8px 0;
+    font-size: 16px;
+    font-weight: 600;
+    color: #6b7280; /* Gray text color */
+  }
+
+  .empty-state p {
+    margin: 0 0 24px 0;
+    color: #6b7280;
+    font-size: 14px;
+    line-height: 1.5;
+  }
+
+  .empty-state .add-button {
+    background-color: #f9fafb; /* Lighter gray to match background */
+    color: #3b82f6; /* Blue text to match header buttons */
+    border: 1px solid #3b82f6; /* Blue border to match header buttons */
+    padding: 8px 16px;
+    margin: 0 auto; /* Center the button horizontally */
+  }
+
+  .empty-state .add-button:hover {
+    background-color: #f3f4f6; /* Slightly darker gray on hover */
+  }
+
+  /* Steps for Questions Section */
+  .steps-empty-state {
+    padding: 32px 24px;
+    text-align: center; /* Center the steps empty state too */
+  }
+
+  .steps-empty-state h3 {
+    text-align: center; /* Center the heading */
+    margin-bottom: 4px;
+    color: #6b7280; /* Gray text color */
+  }
+
+  .steps-empty-state p {
+    text-align: center; /* Center the text */
+    margin-bottom: 16px;
+    color: #6b7280;
+  }
+
+  .steps-empty-state .add-button {
+    background-color: #f9fafb; /* Lighter gray to match background */
+    color: #3b82f6; /* Blue text to match header buttons */
+    border: 1px solid #3b82f6; /* Blue border to match header buttons */
+    margin: 0 auto; /* Center the button horizontally */
+  }
+
+  .steps-empty-state .add-button:hover {
+    background-color: #f3f4f6; /* Slightly darker gray on hover */
+  }
+
+  /* Disabled States */
+  .section.disabled {
+    opacity: 0.6;
+  }
+
+  .add-button.disabled,
+  .add-button:disabled {
+    opacity: 0.5;
+    cursor: not-allowed;
+    pointer-events: none;
+  }
+
+  /* Question Management Styles */
+  .questions-list {
+    display: flex;
+    flex-direction: column;
+    gap: 16px;
+  }
+
+  .question-item {
+    padding: 16px;
+    border: 1px solid #e5e7eb;
+    border-radius: 8px;
+    background-color: #f9fafb;
+    display: flex;
+    flex-direction: column;
+    gap: 8px;
+  }
+
+  .question-header {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    gap: 12px;
+    margin-bottom: 12px;
+  }
+
+  .question-title {
+    margin: 0;
+    font-size: 16px;
+    font-weight: 600;
+    color: #111827;
+    flex: 1;
+  }
+
+  .question-header-controls {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+  }
+
+  .question-type-select {
+    padding: 6px 10px;
+    border: 1px solid #d1d5db;
+    border-radius: 6px;
+    background-color: #ffffff;
+    font-size: 13px;
+    color: #374151;
+    min-width: 140px;
+  }
+
+  .question-type-select:focus {
+    outline: none;
+    border-color: #3b82f6;
+    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
+  }
+
+  .delete-question-button {
+    background: none;
+    border: none;
+    color: #ef4444;
+    font-size: 16px;
+    cursor: pointer;
+    padding: 4px;
+    border-radius: 4px;
+    transition: all 0.2s ease;
+  }
+
+  .delete-question-button:hover {
+    background-color: #fee2e2;
+  }
+
+  .question-label-input {
+    padding: 12px;
+    border: 1px solid #d1d5db;
+    border-radius: 6px;
+    font-size: 14px;
+    background-color: #ffffff;
+    transition: border-color 0.2s ease;
+  }
+
+  .question-label-input:focus {
+    outline: none;
+    border-color: #3b82f6;
+    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
+  }
+
+  .question-label-input::placeholder {
+    color: #9ca3af;
+  }
+
+  .question-required-label {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    font-size: 14px;
+    color: #374151;
+    cursor: pointer;
+  }
+
+  .question-required-label input[type="checkbox"] {
+    margin: 0;
+    cursor: pointer;
+  }
+
+  .add-question-button {
+    background-color: #f9fafb;
+    color: #3b82f6;
+    border: 1px solid #3b82f6;
+    padding: 8px 16px;
+    border-radius: 6px;
+    font-size: 14px;
+    font-weight: 500;
+    cursor: pointer;
+    transition: all 0.2s ease;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    gap: 6px;
+    margin-top: 8px;
+  }
+
+  .add-question-button:hover {
+    background-color: #f3f4f6;
+  }
+
+  .add-question-button::before {
+    content: "+";
+    font-size: 16px;
+    font-weight: 600;
+  }
+
+  /* Question Type-Specific Configuration Styles */
+  .question-options-section,
+  .question-config-section {
+    margin-top: 8px;
+    padding-top: 8px;
+    border-top: 1px solid #e5e7eb;
+  }
+
+  .options-label,
+  .config-label {
+    display: block;
+    font-size: 13px;
+    font-weight: 500;
+    color: #374151;
+    margin-bottom: 8px;
+  }
+
+  .options-list {
+    display: flex;
+    flex-direction: column;
+    gap: 6px;
+  }
+
+  .option-item {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+  }
+
+  .option-input {
+    flex: 1;
+    padding: 8px 10px;
+    border: 1px solid #d1d5db;
+    border-radius: 4px;
+    font-size: 13px;
+    background-color: #ffffff;
+  }
+
+  .option-input:focus {
+    outline: none;
+    border-color: #3b82f6;
+    box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.1);
+  }
+
+  .remove-option-button {
+    background: none;
+    border: none;
+    color: #ef4444;
+    font-size: 16px;
+    cursor: pointer;
+    padding: 4px 6px;
+    border-radius: 4px;
+    transition: all 0.2s ease;
+    line-height: 1;
+  }
+
+  .remove-option-button:hover {
+    background-color: #fee2e2;
+  }
+
+  .add-option-button {
+    background: none;
+    border: 1px dashed #d1d5db;
+    color: #6b7280;
+    padding: 8px 12px;
+    border-radius: 4px;
+    font-size: 13px;
+    cursor: pointer;
+    transition: all 0.2s ease;
+    margin-top: 4px;
+  }
+
+  .add-option-button:hover {
+    border-color: #3b82f6;
+    color: #3b82f6;
+    background-color: #f8fafc;
+  }
+
+  .config-input {
+    width: 100%;
+    padding: 8px 10px;
+    border: 1px solid #d1d5db;
+    border-radius: 4px;
+    font-size: 13px;
+    background-color: #ffffff;
+    margin-top: 4px;
+  }
+
+  .config-input:focus {
+    outline: none;
+    border-color: #3b82f6;
+    box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.1);
+  }
+
+  .config-note {
+    margin: 0;
+    font-size: 13px;
+    color: #6b7280;
+    font-style: italic;
+    padding: 8px 12px;
+    background-color: #f8fafc;
+    border-radius: 4px;
+    border-left: 3px solid #e5e7eb;
+  }
+`,Pe=L`
+  /* Builder Step Styles */
+  .steps-list {
+    display: flex;
+    flex-direction: column;
+    gap: 8px;
+  }
+
+  .step-item {
+    display: flex;
+    align-items: center;
+    padding: 12px;
+    border: 1px solid #e5e7eb;
+    border-radius: 6px;
+    background-color: #ffffff;
+    cursor: pointer;
+    transition: all 0.2s ease;
+    gap: 12px;
+  }
+
+  .step-item:hover {
+    border-color: #d1d5db;
+    background-color: #f9fafb;
+  }
+
+  .step-item.selected {
+    border-color: #3b82f6;
+    background-color: #eff6ff;
+  }
+
+  .step-handle {
+    color: #9ca3af;
+    font-size: 14px;
+    cursor: grab;
+    user-select: none;
+  }
+
+  .step-handle:active {
+    cursor: grabbing;
+  }
+
+  .step-content {
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    gap: 4px;
+  }
+
+  .step-content strong {
+    font-weight: 600;
+    color: #111827;
+    font-size: 14px;
+  }
+
+  .step-actions {
+    display: flex;
+    align-items: center;
+  }
+
+  .step-menu {
+    background: none;
+    border: none;
+    color: #9ca3af;
+    font-size: 16px;
+    cursor: pointer;
+    padding: 4px;
+    border-radius: 4px;
+    transition: all 0.2s ease;
+  }
+
+  .step-menu:hover {
+    background-color: #f3f4f6;
+    color: #6b7280;
+  }
+  .runner-layout {
+    display: flex;
+    width: 100%;
+    min-height: 100vh;
+    box-sizing: border-box;
+    background: #f8fafc;
+    gap: 32px;
+    overflow: hidden;
+    position: relative;
+  }
+
+  /* Loading overlay and spinner */
+  .runner-loading-overlay {
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    background: rgba(0, 0, 0, 0.4);
+    display: flex;
+    align-items: flex-start;
+    justify-content: center;
+    z-index: 1000;
+    padding-top: 80px;
+    box-sizing: border-box;
+  }
+
+  .runner-loading-box {
+    background: white;
+    border-radius: 8px;
+    padding: 24px 48px;
+    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1),
+      0 1px 2px -1px rgba(0, 0, 0, 0.1);
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: center;
+    gap: 16px;
+    min-width: 200px;
+  }
+
+  .runner-loading-spinner {
+    width: 48px;
+    height: 48px;
+    border: 4px solid #e5e7eb;
+    border-top: 4px solid #3b82f6;
+    border-radius: 50%;
+    animation: runner-spin 1s linear infinite;
+  }
+
+  .runner-loading-text {
+    color: #6b7280;
+    font-size: 16px;
+    font-weight: 500;
+    text-align: center;
+  }
+
+  @keyframes runner-spin {
+    0% {
+      transform: rotate(0deg);
+    }
+    100% {
+      transform: rotate(360deg);
+    }
+  }
+
+  .runner-sidebar {
+    width: 380px;
+    min-width: 320px;
+    background: #f8fafc;
+    border-right: 1px solid #e5e7eb;
+    padding: 40px 32px 40px 32px;
+    display: flex;
+    flex-direction: column;
+    align-items: stretch;
+    box-sizing: border-box;
+  }
+
+  .runner-sidebar-header {
+    font-size: 1.15rem;
+    font-weight: 700;
+    color: #222;
+    margin-bottom: 24px;
+    letter-spacing: 0.01em;
+    text-align: left;
+  }
+
+  .runner-steps-list {
+    list-style: none;
+    margin: 0;
+    padding: 0;
+    display: flex;
+    flex-direction: column;
+    gap: 18px;
+  }
+
+  .runner-step-item {
+    display: flex;
+    align-items: flex-start;
+    justify-content: space-between;
+    padding: 18px 18px 18px 20px;
+    border-radius: 12px;
+    background: #fff;
+    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.03);
+    margin-bottom: 0;
+    cursor: pointer;
+    border: 2px solid transparent;
+    transition: border 0.2s, box-shadow 0.2s;
+    gap: 12px;
+  }
+  .runner-step-item.active {
+    border: 2px solid #3b82f6;
+    background: #fff;
+    box-shadow: 0 2px 8px rgba(59, 130, 246, 0.08);
+  }
+  .runner-step-title {
+    font-weight: 500;
+    color: #111827;
+    font-size: 0.97rem;
+    flex: 1;
+    min-width: 0;
+    line-height: 1.4;
+  }
+  .runner-step-item.active .runner-step-title {
+    font-weight: 700;
+    font-size: 1.07rem;
+  }
+  .runner-step-badge {
+    background: #e0e7ff;
+    color: #3730a3;
+    font-size: 12px;
+    font-weight: 600;
+    border-radius: 6px;
+    padding: 2px 10px;
+    margin-left: 0;
+    flex-shrink: 0;
+    align-self: center;
+    white-space: nowrap;
+  }
+
+  .runner-main-content {
+    flex: 1;
+    width: 100%;
+    padding: 56px 64px 56px 64px;
+    background: #f8fafc;
+    min-width: 0;
+    display: flex;
+    flex-direction: column;
+    box-sizing: border-box;
+    min-height: 600px;
+    overflow: hidden;
+  }
+
+  .runner-main-content form,
+  .runner-main-content input,
+  .runner-main-content select,
+  .runner-main-content textarea {
+    max-width: 100%;
+    box-sizing: border-box;
+  }
+
+  .runner-step-header h2.runner-step-title {
+    font-size: 1.5rem;
+    font-weight: 700;
+    color: #111827;
+  }
+
+  .runner-step-divider {
+    border: none;
+    border-top: 1px solid #e5e7eb;
+    margin: 20px 0 20px 0;
+    width: 100%;
+  }
+  .runner-step-desc {
+    color: #6b7280;
+    font-size: 1rem;
+    margin: 0;
+  }
+
+  .runner-step-form {
+    display: flex;
+    flex-direction: column;
+    gap: 24px;
+  }
+
+  .runner-form-actions {
+    display: flex;
+    justify-content: flex-end;
+    margin-top: 24px;
+    padding-right: 0;
+  }
+  .next-button {
+    background: #3b82f6;
+    color: #fff;
+    border: none;
+    border-radius: 6px;
+    padding: 12px 32px;
+    font-size: 1.1rem;
+    font-weight: 600;
+    cursor: pointer;
+    transition: background 0.2s;
+    max-width: 180px;
+    min-width: 100px;
+    box-sizing: border-box;
+    align-self: flex-end;
+  }
+  .next-button:hover {
+    background: #2563eb;
+  }
+
+  :global(body) {
+    background: #f8fafc;
+  }
+
+  .runner-card {
+    background: #fff;
+    border-radius: 12px;
+    padding: 24px 24px 20px 24px;
+    margin-bottom: 0;
+    box-shadow: none;
+    border: none;
+  }
+
+  .runner-question-title {
+    font-size: 1rem;
+    font-weight: 600;
+    margin-bottom: 8px;
+    color: #111827;
+    display: flex;
+    align-items: center;
+  }
+
+  .runner-question-required {
+    color: #dc2626;
+    font-size: 1.1em;
+    margin-left: 4px;
+  }
+
+  .runner-question-divider {
+    border: none;
+    border-top: 1.5px solid #e5e7eb;
+    margin: 12px 0 20px 0;
+  }
+
+  /* Form input styling */
+  .runner-card input[type="text"],
+  .runner-card input[type="email"],
+  .runner-card input[type="number"],
+  .runner-card input[type="date"],
+  .runner-card textarea,
+  .runner-card select {
+    width: 100%;
+    padding: 12px 16px;
+    border: 1px solid #e5e7eb;
+    border-radius: 12px;
+    font-size: 14px;
+    background-color: #f9fafb;
+    color: #111827;
+    transition: all 0.2s ease;
+    box-sizing: border-box;
+  }
+
+  .runner-card input[type="text"]:focus,
+  .runner-card input[type="email"]:focus,
+  .runner-card input[type="number"]:focus,
+  .runner-card input[type="date"]:focus,
+  .runner-card textarea:focus,
+  .runner-card select:focus {
+    outline: none;
+    border-color: #3b82f6;
+    background-color: #ffffff;
+    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
+  }
+
+  .runner-card input[type="text"]::placeholder,
+  .runner-card input[type="email"]::placeholder,
+  .runner-card input[type="number"]::placeholder,
+  .runner-card textarea::placeholder {
+    color: #9ca3af;
+  }
+
+  .runner-card textarea {
+    min-height: 120px;
+    resize: vertical;
+  }
+
+  .runner-card select {
+    cursor: pointer;
+    width: auto;
+    min-width: 450px;
+    max-width: 900px;
+  }
+
+  .runner-card select.placeholder {
+    color: #9ca3af;
+  }
+
+  /* Radio group styling */
+  .radio-group {
+    display: flex;
+    flex-direction: column;
+    gap: 8px;
+    background-color: #ffffff;
+    padding: 16px;
+  }
+
+  .radio-option {
+    display: flex;
+    align-items: center;
+    cursor: pointer;
+    padding: 8px 0;
+    border: none;
+    background-color: transparent;
+    transition: all 0.2s ease;
+  }
+
+  .radio-option:hover {
+    background-color: transparent;
+  }
+
+  .radio-option input[type="radio"] {
+    margin-right: 12px;
+    width: 18px;
+    height: 18px;
+    accent-color: #3b82f6;
+    cursor: pointer;
+  }
+
+  .radio-option input[type="radio"]:checked + .radio-label {
+    font-weight: 600;
+    color: #111827;
+  }
+
+  .radio-label {
+    font-size: 16px;
+    color: #374151;
+    cursor: pointer;
+    flex: 1;
+  }
+
+  .radio-option:has(input[type="radio"]:checked) {
+    border: none;
+    background-color: transparent;
+    box-shadow: none;
+  }
+
+  /* Checkbox group styling */
+  .checkbox-group {
+    display: flex;
+    flex-direction: column;
+    gap: 8px;
+    background-color: #ffffff;
+    padding: 16px;
+  }
+
+  .checkbox-option {
+    display: flex;
+    align-items: center;
+    cursor: pointer;
+    padding: 8px 0;
+    border: none;
+    background-color: transparent;
+    transition: all 0.2s ease;
+  }
+
+  .checkbox-option:hover {
+    background-color: transparent;
+  }
+
+  .checkbox-option input[type="checkbox"] {
+    margin-right: 12px;
+    width: 18px;
+    height: 18px;
+    accent-color: #3b82f6;
+    cursor: pointer;
+  }
+
+  .checkbox-option input[type="checkbox"]:checked + .checkbox-label {
+    font-weight: 600;
+    color: #111827;
+  }
+
+  .checkbox-label {
+    font-size: 16px;
+    color: #374151;
+    cursor: pointer;
+    flex: 1;
+  }
+
+  .checkbox-option:has(input[type="checkbox"]:checked) {
+    border: none;
+    background-color: transparent;
+    box-shadow: none;
+  }
+
+  /* Single checkbox styling */
+  .checkbox-single {
+    display: flex;
+    align-items: center;
+    cursor: pointer;
+    padding: 8px 0;
+    border: none;
+    background-color: transparent;
+    transition: all 0.2s ease;
+    margin-top: 8px;
+  }
+
+  .checkbox-single:hover {
+    background-color: transparent;
+  }
+
+  .checkbox-single input[type="checkbox"] {
+    margin-right: 12px;
+    width: 18px;
+    height: 18px;
+    accent-color: #3b82f6;
+    cursor: pointer;
+  }
+
+  .checkbox-single input[type="checkbox"]:checked + .checkbox-label {
+    font-weight: 600;
+    color: #111827;
+  }
+
+  .checkbox-single:has(input[type="checkbox"]:checked) {
+    border: none;
+    background-color: transparent;
+    box-shadow: none;
+  }
+
+  /* Signature styling */
+  .signature-container {
+    display: flex;
+    flex-direction: column;
+    gap: 12px;
+  }
+
+  .signature-canvas {
+    width: 100%;
+    height: 200px;
+    border: 1px solid #e5e7eb;
+    border-radius: 8px;
+    background-color: #ffffff;
+    cursor: crosshair;
+    max-width: 700px;
+  }
+
+  .signature-controls {
+    display: flex;
+    gap: 8px;
+  }
+
+  .signature-clear-btn {
+    background: #f3f4f6;
+    color: #374151;
+    border: 1px solid #d1d5db;
+    border-radius: 6px;
+    padding: 8px 16px;
+    font-size: 14px;
+    font-weight: 500;
+    cursor: pointer;
+    transition: all 0.2s ease;
+  }
+
+  .signature-clear-btn:hover {
+    background: #e5e7eb;
+    border-color: #9ca3af;
+  }
+
+  .signature-save-btn {
+    background: #3b82f6;
+    color: white;
+    border: 1px solid #2563eb;
+    border-radius: 6px;
+    padding: 8px 16px;
+    font-size: 14px;
+    font-weight: 500;
+    cursor: pointer;
+    transition: all 0.2s ease;
+  }
+
+  .signature-save-btn:hover {
+    background: #2563eb;
+    border-color: #1d4ed8;
+  }
+
+  .signature-saved {
+    color: #059669;
+    font-size: 14px;
+    font-weight: 500;
+    display: flex;
+    align-items: center;
+    gap: 4px;
+  }
+
+  .signature-replace-btn {
+    background: #3b82f6;
+    color: white;
+    border: none;
+    padding: 8px 16px;
+    border-radius: 4px;
+    cursor: pointer;
+    font-size: 0.875rem;
+    font-weight: 500;
+    transition: background-color 0.2s ease;
+    display: inline-flex;
+    align-items: center;
+    gap: 6px;
+  }
+
+  .signature-replace-btn:hover {
+    background: #2563eb;
+  }
+
+  .signature-cancel-btn {
+    background: #6b7280;
+    color: white;
+    border: none;
+    padding: 8px 16px;
+    border-radius: 4px;
+    cursor: pointer;
+    font-size: 0.875rem;
+    font-weight: 500;
+    transition: background-color 0.2s ease;
+  }
+
+  .signature-cancel-btn:hover {
+    background: #4b5563;
+  }
+
+  /* File Upload Styles */
+  .file-upload-container {
+    display: flex;
+    flex-direction: column;
+    gap: 12px;
+  }
+
+  .file-input {
+    display: none;
+  }
+
+  .file-placeholder {
+    background: #f9fafb;
+    border: 2px dashed #d1d5db;
+    border-radius: 8px;
+    padding: 24px;
+    text-align: center;
+    color: #6b7280;
+    cursor: pointer;
+    transition: all 0.2s ease;
+  }
+
+  .file-placeholder:hover {
+    border-color: #3b82f6;
+    background: #f0f9ff;
+    color: #3b82f6;
+  }
+
+  .file-info {
+    display: flex;
+    align-items: center;
+    gap: 12px;
+    background: #f0f9ff;
+    border: 1px solid #bae6fd;
+    border-radius: 8px;
+    padding: 12px 16px;
+  }
+
+  .file-name {
+    font-weight: 500;
+    color: #0c4a6e;
+    flex: 1;
+  }
+
+  .file-size {
+    color: #0369a1;
+    font-size: 0.875rem;
+  }
+
+  .file-remove-btn {
+    background: #dc2626;
+    color: white;
+    border: none;
+    border-radius: 6px;
+    padding: 6px 12px;
+    font-size: 0.875rem;
+    font-weight: 500;
+    cursor: pointer;
+    transition: background-color 0.2s ease;
+  }
+
+  .file-remove-btn:hover {
+    background: #b91c1c;
+  }
+
+  /* Error message styling */
+  .error-message {
+    color: #dc2626;
+    font-size: 0.875rem;
+    margin-top: 8px;
+    margin-bottom: 0;
+    font-weight: 500;
+  }
+
+  .question.error input,
+  .question.error textarea,
+  .question.error select {
+    border-color: #dc2626;
+    background-color: #fef2f2;
+  }
+
+  .question.error input:focus,
+  .question.error textarea:focus,
+  .question.error select:focus {
+    border-color: #dc2626;
+    background-color: #ffffff;
+    box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.1);
+  }
+
+  /* Content Element Styles */
+  .content-element {
+    margin-bottom: 16px;
+  }
+
+  .text-content p {
+    font-size: 1rem;
+    line-height: 1.6;
+    color: #374151;
+    margin: 0;
+  }
+
+  .markdown-content {
+    font-size: 1rem;
+    line-height: 1.6;
+    color: #374151;
+  }
+
+  .markdown-content h1 {
+    font-size: 1.5rem;
+    font-weight: 700;
+    margin: 24px 0 16px 0;
+    color: #111827;
+  }
+
+  .markdown-content h2 {
+    font-size: 1.25rem;
+    font-weight: 600;
+    margin: 20px 0 12px 0;
+    color: #111827;
+  }
+
+  .markdown-content h3 {
+    font-size: 1.125rem;
+    font-weight: 600;
+    margin: 16px 0 8px 0;
+    color: #111827;
+  }
+
+  .markdown-content strong {
+    font-weight: 600;
+  }
+
+  .markdown-content em {
+    font-style: italic;
+  }
+
+  .markdown-content code {
+    background: #f3f4f6;
+    padding: 2px 6px;
+    border-radius: 4px;
+    font-family: "Courier New", monospace;
+    font-size: 0.9em;
+  }
+
+  .markdown-content blockquote {
+    background: #f8fafc;
+    border-left: 4px solid #3b82f6;
+    padding: 12px 16px;
+    margin: 16px 0;
+    border-radius: 0 4px 4px 0;
+    font-style: italic;
+    color: #374151;
+  }
+
+  .markdown-content ul {
+    margin: 12px 0;
+    padding-left: 24px;
+  }
+
+  .markdown-content ol {
+    margin: 12px 0;
+    padding-left: 24px;
+  }
+
+  .markdown-content li {
+    margin: 4px 0;
+  }
+
+  .divider-content {
+    text-align: center;
+    margin: 24px 0;
+  }
+
+  .content-divider {
+    border: none;
+    border-top: 2px solid #e5e7eb;
+    margin: 0 0 8px 0;
+  }
+
+  .divider-caption {
+    font-size: 0.875rem;
+    color: #6b7280;
+    font-style: italic;
+  }
+
+  .html-content-wrapper {
+    line-height: 1.6;
+  }
+
+  .image-placeholder,
+  .video-placeholder,
+  .file-placeholder {
+    background: #f9fafb;
+    border: 2px dashed #d1d5db;
+    border-radius: 8px;
+    padding: 24px;
+    text-align: center;
+    color: #6b7280;
+  }
+
+  .image-placeholder p,
+  .video-placeholder p,
+  .file-placeholder p {
+    margin: 0 0 8px 0;
+    font-weight: 500;
+  }
+
+  .image-placeholder small,
+  .video-placeholder small,
+  .file-placeholder small {
+    font-size: 0.875rem;
+    color: #9ca3af;
+  }
+
+  .unknown-element {
+    background: #fef2f2;
+    border: 1px solid #fecaca;
+    border-radius: 8px;
+    padding: 16px;
+    color: #dc2626;
+    text-align: center;
+  }
+
+  .unknown-element p {
+    margin: 0;
+    font-weight: 500;
+  }
+
+  /* Submission Success View Styles */
+  .submission-container {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    text-align: center;
+    min-height: 50vh;
+    padding: 64px 32px;
+    max-width: 600px;
+    margin: 0 auto;
+  }
+
+  .submission-success-icon {
+    width: 48px;
+    height: 48px;
+    color: #22c55e;
+    margin-bottom: 32px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+
+  .check-circle {
+    width: 100%;
+    height: 100%;
+  }
+
+  .submission-title {
+    font-size: 1.25rem; /* 20px */
+    font-weight: 600;
+    color: #111827;
+    margin: 0 0 16px 0;
+    line-height: 1.4;
+  }
+
+  .submission-message {
+    font-size: 1rem; /* 16px */
+    color: #6b7280;
+    margin: 0;
+    line-height: 1.5;
+  }
+
+  /* Legacy styles for backward compatibility */
+  .submitted-view {
+    text-align: center;
+    padding: 48px 32px;
+    max-width: 500px;
+    margin: 0 auto;
+  }
+
+  .submitted-icon {
+    font-size: 4rem;
+    margin-bottom: 24px;
+    display: block;
+  }
+
+  .submitted-title {
+    font-size: 1.75rem;
+    font-weight: 700;
+    color: #16a34a;
+    margin: 0 0 16px 0;
+    line-height: 1.3;
+  }
+
+  .submitted-details {
+    background: #f9fafb;
+    border: 1px solid #e5e7eb;
+    border-radius: 8px;
+    padding: 20px;
+    text-align: left;
+  }
+
+  .submitted-details p {
+    margin: 0 0 8px 0;
+    font-size: 0.95rem;
+    color: #6b7280;
+  }
+
+  .submitted-details p:last-child {
+    margin-bottom: 0;
+  }
+
+  .submitted-details strong {
+    color: #374151;
+    font-weight: 600;
+  }
+
+  /* Disabled step styles for submitted state */
+  .runner-step-item.disabled {
+    pointer-events: none;
+  }
+
+  .runner-step-item.disabled .runner-step-badge {
+    background: #e5e7eb;
+    color: #6b7280;
+  }
+
+  /* Loading state styles */
+  .runner-step-item.loading-disabled {
+    pointer-events: none;
+    opacity: 0.6;
+    cursor: not-allowed;
+  }
+
+  .runner-mobile-step-tab.loading-disabled {
+    pointer-events: none;
+    opacity: 0.6;
+    cursor: not-allowed;
+  }
+
+  .runner-step-item.completed .runner-step-badge {
+    background: #dcfce7;
+    color: #16a34a;
+  }
+
+  /* Disabled form elements in submitted state */
+  .signature-container.disabled {
+    pointer-events: none;
+    opacity: 0.6;
+  }
+
+  .file-placeholder.disabled {
+    pointer-events: none;
+    opacity: 0.6;
+    cursor: not-allowed !important;
+  }
+
+  /* Save feedback styling for admin mode */
+  .next-button.saved-state {
+    background-color: #16a34a !important;
+    color: white !important;
+    transition: background-color 0.3s ease;
+  }
+
+  .next-button.saved-state:hover {
+    background-color: #15803d !important;
+  }
+
+  /* Not assigned view styles */
+  .not-assigned-view {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    min-height: 100vh;
+    padding: 40px;
+    background: #f8fafc;
+  }
+
+  .not-assigned-container {
+    text-align: center;
+    max-width: 480px;
+    background: #fff;
+    border-radius: 16px;
+    padding: 48px 40px;
+    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
+  }
+
+  .not-assigned-icon {
+    margin: 0 auto 24px;
+    width: 48px;
+    height: 48px;
+    color: #6b7280;
+  }
+
+  .not-assigned-title {
+    font-size: 1.5rem;
+    font-weight: 600;
+    color: #111827;
+    margin: 0 0 16px 0;
+    line-height: 1.4;
+  }
+
+  .not-assigned-description {
+    font-size: 1rem;
+    color: #6b7280;
+    margin: 0;
+    line-height: 1.6;
+  }
+
+  /* View-Only Mode Styles */
+  .file-upload-view-only {
+    display: flex;
+    align-items: center;
+    padding: 12px 16px;
+    background: #f8fafc;
+    border: 1px solid #e2e8f0;
+    border-radius: 6px;
+    min-height: 48px;
+  }
+
+  .signature-view-only,
+  .signature-admin-display {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    padding: 16px;
+    background: #f8fafc;
+    border: 1px solid #e2e8f0;
+    border-radius: 6px;
+  }
+
+  .signature-existing {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    margin-bottom: 12px;
+  }
+
+  .signature-admin-actions {
+    display: flex;
+    justify-content: center;
+  }
+
+  .signature-image {
+    max-width: 100%;
+    max-height: 200px;
+    border: 1px solid #e2e8f0;
+    border-radius: 4px;
+    background: white;
+    padding: 8px;
+    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1);
+  }
+
+  .signature-svg-container {
+    max-width: 100%;
+    max-height: 200px;
+    border: 1px solid #e2e8f0;
+    border-radius: 4px;
+    background: white;
+    padding: 8px;
+    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    overflow: hidden;
+  }
+
+  .signature-svg-container svg {
+    max-width: 100%;
+    max-height: 100%;
+    height: auto;
+    width: auto;
+  }
+
+  .signature-fallback {
+    padding: 20px;
+    text-align: center;
+  }
+
+  .signature-error {
+    color: #dc2626;
+    font-style: italic;
+    font-size: 0.875rem;
+  }
+
+  .file-link {
+    display: inline-flex;
+    align-items: center;
+    gap: 8px;
+    color: #2563eb;
+    text-decoration: none;
+    font-weight: 500;
+    padding: 8px 12px;
+    border-radius: 4px;
+    transition: all 0.2s ease;
+    background: #eff6ff;
+    border: 1px solid #bfdbfe;
+    font-size: 0.875rem;
+  }
+
+  .file-link:hover {
+    color: #1d4ed8;
+    background: #dbeafe;
+    border-color: #93c5fd;
+    text-decoration: none;
+  }
+
+  .file-link:active {
+    transform: translateY(1px);
+  }
+
+  .file-size-info {
+    margin-left: 8px;
+    color: #6b7280;
+    font-size: 0.875rem;
+    font-style: italic;
+  }
+
+  /* Print mode file info styles */
+  .file-upload-print-info {
+    background: #f8fafc;
+    border: 1px solid #e2e8f0;
+    border-radius: 6px;
+    padding: 16px;
+    margin: 8px 0;
+  }
+
+  .file-details {
+    display: flex;
+    flex-direction: column;
+    gap: 8px;
+  }
+
+  .file-detail-row {
+    display: flex;
+    align-items: center;
+    font-size: 0.875rem;
+    line-height: 1.4;
+  }
+
+  .file-detail-row strong {
+    min-width: 80px;
+    color: #374151;
+    font-weight: 600;
+    margin-right: 8px;
+  }
+
+  .hidden {
+    display: none !important;
+  }
+
+  .no-file,
+  .no-signature {
+    color: #6b7280;
+    font-style: italic;
+    font-size: 0.875rem;
+  }
+
+  /* Print Mode Styles */
+  .print-layout {
+    width: 100%;
+    max-width: none;
+    background: #fff;
+    padding: 40px;
+    box-sizing: border-box;
+    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
+      sans-serif;
+  }
+
+  .print-step {
+    margin-bottom: 60px;
+    page-break-inside: avoid;
+    break-inside: avoid;
+  }
+
+  .print-step:last-child {
+    margin-bottom: 0;
+  }
+
+  /* Ensure print cards don't have unnecessary shadows/borders for clean printing */
+  .print-layout .runner-card {
+    box-shadow: none;
+    border: 1px solid #e5e7eb;
+    margin-bottom: 20px;
+  }
+
+  /* Better spacing for print */
+  .print-layout .runner-question-title {
+    margin-bottom: 12px;
+  }
+
+  .print-layout .content-element {
+    margin-bottom: 20px;
+  }
+
+  /* Mobile Steps Navigation (hidden by default, shown on mobile) */
+  .runner-mobile-steps {
+    display: none;
+    width: 100%;
+    background: #fff;
+    border-bottom: 1px solid #e5e7eb;
+    padding: 16px;
+    box-sizing: border-box;
+    overflow-x: auto;
+    -webkit-overflow-scrolling: touch;
+  }
+
+  .runner-mobile-steps-container {
+    display: flex;
+    gap: 8px;
+    min-width: min-content;
+    padding-bottom: 4px;
+  }
+
+  .runner-mobile-step-tab {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    background: #f8fafc;
+    border: 2px solid #e5e7eb;
+    border-radius: 8px;
+    padding: 12px 16px;
+    font-size: 12px;
+    font-weight: 500;
+    color: #6b7280;
+    cursor: pointer;
+    transition: all 0.2s;
+    min-width: 80px;
+    max-width: 120px;
+    flex-shrink: 0;
+    box-sizing: border-box;
+  }
+
+  .runner-mobile-step-tab:hover:not(:disabled):not(.active) {
+    background: #f1f5f9;
+    border-color: #cbd5e1;
+  }
+
+  .runner-mobile-step-tab:focus {
+    outline: none;
+  }
+
+  .runner-mobile-step-tab:focus:not(.active) {
+    outline: 2px solid #3b82f6;
+    outline-offset: 2px;
+  }
+
+  .runner-mobile-step-tab.active {
+    background: #3b82f6 !important;
+    border-color: #3b82f6 !important;
+    color: #fff !important;
+  }
+
+  .runner-mobile-step-tab.disabled {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .runner-mobile-step-tab.unassigned {
+    opacity: 0.6;
+  }
+
+  .runner-mobile-step-title {
+    display: -webkit-box;
+    -webkit-line-clamp: 2;
+    -webkit-box-orient: vertical;
+    text-align: center;
+    line-height: 1.2;
+    font-weight: 600;
+    margin-bottom: 4px;
+    overflow: hidden;
+    word-wrap: break-word;
+    hyphens: auto;
+    max-width: 100%;
+  }
+
+  .runner-mobile-step-badge {
+    display: block;
+    text-align: center;
+    font-size: 10px;
+    font-weight: 600;
+    line-height: 1;
+    background: rgba(255, 255, 255, 0.2);
+    border-radius: 4px;
+    padding: 2px 6px;
+    margin: 0 auto;
+    max-width: fit-content;
+    white-space: nowrap;
+  }
+
+  /* Enhance mobile tab styling for completed/active states */
+  .runner-mobile-step-tab.completed:not(.active) {
+    background: #22c55e;
+    border-color: #22c55e;
+    color: #fff;
+  }
+
+  .runner-mobile-step-tab.completed .runner-mobile-step-badge {
+    background: rgba(255, 255, 255, 0.3);
+    color: #fff;
+  }
+
+  .runner-mobile-step-tab.active .runner-mobile-step-badge {
+    background: rgba(255, 255, 255, 0.3);
+    color: #fff;
+  }
+
+  .runner-mobile-step-tab:not(.active):not(.completed)
+    .runner-mobile-step-badge {
+    background: rgba(0, 0, 0, 0.1);
+    color: inherit;
+  }
+
+  /* Mobile Responsive Styles */
+  @media (max-width: 768px) {
+    .runner-layout {
+      flex-direction: column;
+      min-height: 100vh;
+      gap: 0;
+      overflow: visible;
+    }
+
+    /* Hide sidebar on mobile */
+    .runner-sidebar {
+      display: none;
+    }
+
+    /* Show mobile steps navigation */
+    .runner-mobile-steps {
+      display: block;
+      order: -1;
+    }
+
+    /* Adjust main content for mobile */
+    .runner-main-content {
+      padding: 20px 16px;
+      min-height: auto;
+      flex: 1;
+      overflow: visible;
+    }
+
+    /* Mobile-friendly form styling */
+    .runner-card {
+      padding: 20px 16px;
+      border-radius: 8px;
+    }
+
+    .runner-step-header h2.runner-step-title {
+      font-size: 1.25rem;
+      line-height: 1.3;
+    }
+
+    .runner-step-desc {
+      font-size: 0.9rem;
+    }
+
+    /* Form inputs mobile optimization */
+    .runner-card input[type="text"],
+    .runner-card input[type="email"],
+    .runner-card input[type="number"],
+    .runner-card input[type="date"],
+    .runner-card textarea,
+    .runner-card select {
+      padding: 14px 16px;
+      font-size: 16px; /* Prevents zoom on iOS */
+      border-radius: 8px;
+    }
+
+    .runner-card textarea {
+      min-height: 120px;
+    }
+
+    /* Question styling for mobile */
+    .runner-question-title {
+      font-size: 0.95rem;
+      margin-bottom: 10px;
+    }
+
+    /* Form actions mobile optimization */
+    .runner-form-actions {
+      margin-top: 32px;
+      padding: 0;
+    }
+
+    .next-button {
+      width: 100%;
+      max-width: none;
+      padding: 16px 24px;
+      font-size: 1rem;
+      border-radius: 8px;
+    }
+
+    /* Radio and checkbox mobile optimization */
+    .radio-group,
+    .checkbox-group {
+      gap: 16px;
+    }
+
+    .radio-option,
+    .checkbox-option {
+      padding: 16px;
+      font-size: 0.95rem;
+    }
+
+    /* File upload mobile optimization */
+    .file-upload-area {
+      padding: 32px 16px;
+      font-size: 0.9rem;
+    }
+
+    .upload-instruction {
+      font-size: 0.85rem;
+    }
+
+    /* Signature pad mobile optimization */
+    .signature-container {
+      margin: 16px 0;
+    }
+
+    .signature-canvas {
+      max-width: 100%;
+      height: auto;
+      min-height: 200px;
+    }
+
+    .signature-controls {
+      flex-direction: column;
+      gap: 12px;
+      margin-top: 16px;
+    }
+
+    .signature-controls button {
+      width: 100%;
+      padding: 12px;
+      font-size: 0.9rem;
+    }
+
+    /* Status views mobile optimization */
+    .submission-container,
+    .submitted-view,
+    .not-assigned-view,
+    .user-steps-submitted-view {
+      padding: 32px 16px;
+      text-align: center;
+      min-height: 40vh;
+    }
+
+    .submission-success-icon {
+      width: 40px;
+      height: 40px;
+      margin-bottom: 24px;
+    }
+
+    .submission-title,
+    .submitted-title,
+    .not-assigned-title,
+    .user-steps-submitted-title {
+      font-size: 1.125rem; /* 18px on mobile */
+      margin-bottom: 16px;
+    }
+
+    .submission-message,
+    .submitted-message,
+    .not-assigned-message,
+    .user-steps-submitted-message {
+      font-size: 0.875rem; /* 14px on mobile */
+      margin-bottom: 20px;
+    }
+  }
+
+  /* Smaller mobile devices */
+  @media (max-width: 480px) {
+    .runner-main-content {
+      padding: 16px 12px;
+    }
+
+    .runner-card {
+      padding: 16px 12px;
+    }
+
+    .runner-mobile-steps {
+      padding: 12px;
+    }
+
+    .runner-mobile-step-tab {
+      min-width: 70px;
+      max-width: 100px;
+      padding: 10px 12px;
+      font-size: 11px;
+    }
+
+    .runner-mobile-step-badge {
+      font-size: 9px;
+      padding: 1px 4px;
+    }
+
+    .runner-step-header h2.runner-step-title {
+      font-size: 1.15rem;
+    }
+
+    .runner-card input[type="text"],
+    .runner-card input[type="email"],
+    .runner-card input[type="number"],
+    .runner-card input[type="date"],
+    .runner-card textarea,
+    .runner-card select {
+      padding: 12px 14px;
+    }
+  }
+
+  /* Print media queries for actual printing */
+  @media print {
+    .print-layout {
+      padding: 20px;
+      background: #fff !important;
+    }
+
+    .print-step {
+      page-break-inside: avoid;
+      margin-bottom: 40px;
+    }
+
+    .print-layout .runner-card {
+      box-shadow: none !important;
+      border: 1px solid #ccc !important;
+      margin-bottom: 15px;
+    }
+
+    /* Hide any interactive elements in print */
+    button,
+    input[type="button"],
+    input[type="submit"] {
+      display: none !important;
+    }
+
+    /* Ensure proper text color for print */
+    * {
+      color: #000 !important;
+      background: transparent !important;
+    }
+
+    /* Print-specific file info styling */
+    .file-upload-print-info {
+      border: 1px solid #000 !important;
+      background: transparent !important;
+      margin-bottom: 15px;
+    }
+
+    .file-detail-row strong {
+      color: #000 !important;
+    }
+  }
+
+  /* Clean print mode styles */
+  .print-response-value {
+    font-size: 1rem;
+    line-height: 1.5;
+    color: #111827;
+    padding: 0;
+    margin: 0 0 8px 0;
+    background: transparent;
+    border: none;
+    min-height: auto;
+  }
+
+  .print-response-value.textarea-response {
+    white-space: pre-wrap;
+    word-wrap: break-word;
+  }
+
+  .print-response-value.file-response {
+    font-weight: 500;
+  }
+
+  .print-response-value .file-size {
+    color: #6b7280;
+    font-weight: normal;
+    font-size: 0.9em;
+  }
+
+  .print-response-value.signature-response {
+    padding: 8px 0;
+  }
+
+  .print-response-value.signature-response .signature-image {
+    max-width: 200px;
+    max-height: 100px;
+    border: 1px solid #e5e7eb;
+    background: white;
+  }
+
+  .print-no-response {
+    color: #9ca3af;
+    font-style: italic;
+    font-size: 0.9em;
+  }
+
+  /* Clean radio and checkbox groups for print */
+  .radio-group.print-mode,
+  .checkbox-group.print-mode {
+    background: transparent;
+    padding: 8px 0;
+    border: none;
+  }
+
+  .checkbox-single.print-mode {
+    background: transparent;
+    padding: 8px 0;
+  }
+
+  /* Hide interactive elements in print mode but keep visual checkboxes/radios */
+  @media screen {
+    .radio-group.print-mode input[type="radio"],
+    .checkbox-group.print-mode input[type="checkbox"],
+    .checkbox-single.print-mode input[type="checkbox"] {
+      pointer-events: none;
+    }
+  }
+
+  /* Print mode question layout - no borders, horizontal separators */
+  .question-print {
+    margin: 0;
+    padding: 0;
+    background: transparent;
+    border: none;
+    box-shadow: none;
+  }
+
+  /* Print mode content layout - consistent with questions */
+  .content-print {
+    margin: 0;
+    padding: 0;
+    background: transparent;
+    border: none;
+    box-shadow: none;
+  }
+
+  /* Ensure no card styling bleeds through in print mode */
+  body[data-mode="print"] .runner-card,
+  .print-mode .runner-card {
+    background: transparent !important;
+    border: none !important;
+    border-radius: 0 !important;
+    box-shadow: none !important;
+    padding: 0 !important;
+    margin: 0 !important;
+  }
+
+  /* Print mode title (18pt) - Instance name */
+  .print-instance-title {
+    font-size: 18pt;
+    font-weight: 600;
+    color: #111827;
+    margin: 0 0 20px 0;
+    line-height: 1.3;
+  }
+
+  /* Print mode step titles (14pt) */
+  .print-step-title {
+    font-size: 14pt;
+    font-weight: 600;
+    color: #111827;
+    margin: 0 0 8px 0;
+    line-height: 1.4;
+  }
+
+  /* Print mode question titles (12pt) */
+  .print-question-title {
+    font-size: 12pt;
+    font-weight: 600;
+    color: #111827;
+    margin: 0 0 4px 0;
+    line-height: 1.4;
+  }
+
+  .print-step-description {
+    font-size: 1rem;
+    font-weight: 400;
+    color: #6b7280;
+    margin: 8px 0;
+    line-height: 1.5;
+  }
+
+  .print-question-separator {
+    border: none;
+    border-top: 1px solid #e5e7eb;
+    margin: 16px 0;
+    width: 100%;
+  }
+
+  /* Clean styling for checkbox lists in print */
+  .print-response-value.checkbox-response div {
+    margin: 2px 0;
+    line-height: 1.4;
+  }
+`,gt=L`
+  /* Modal Styles */
+  .modal-overlay {
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    background-color: rgba(0, 0, 0, 0.5);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    z-index: 1000;
+  }
+
+  .modal-container {
+    background-color: #ffffff;
+    border-radius: 12px;
+    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
+    width: 90%;
+    max-width: 600px;
+    max-height: 90vh;
+    overflow-y: auto;
+    position: relative;
+  }
+
+  .modal-header {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: 24px 24px 0 24px;
+    margin-bottom: 24px;
+  }
+
+  .modal-header h2 {
+    margin: 0;
+    font-size: 20px;
+    font-weight: 600;
+    color: #111827;
+  }
+
+  .modal-close {
+    background: none;
+    border: none;
+    font-size: 24px;
+    color: #6b7280;
+    cursor: pointer;
+    padding: 4px;
+    border-radius: 4px;
+    transition: background-color 0.2s ease;
+  }
+
+  .modal-close:hover {
+    background-color: #f3f4f6;
+  }
+
+  .modal-body {
+    padding: 0 24px 24px 24px;
+  }
+
+  .modal-form-group {
+    margin-bottom: 20px;
+  }
+
+  .modal-form-group label {
+    display: block;
+    font-weight: 600;
+    color: #111827;
+    margin-bottom: 8px;
+    font-size: 14px;
+  }
+
+  .modal-form-group input,
+  .modal-form-group textarea {
+    width: 100%;
+    padding: 12px;
+    border: 1px solid #d1d5db;
+    border-radius: 8px;
+    font-size: 14px;
+    transition: border-color 0.2s ease;
+    box-sizing: border-box;
+  }
+
+  .modal-form-group input:focus,
+  .modal-form-group textarea:focus {
+    outline: none;
+    border-color: #3b82f6;
+    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
+  }
+
+  .modal-form-group textarea {
+    min-height: 80px;
+    resize: vertical;
+  }
+
+  .modal-form-group input::placeholder,
+  .modal-form-group textarea::placeholder {
+    color: #9ca3af;
+  }
+
+  .modal-footer {
+    display: flex;
+    justify-content: flex-end;
+    gap: 12px;
+    padding: 24px;
+    border-top: 1px solid #e5e7eb;
+    margin-top: 24px;
+  }
+
+  .modal-footer button {
+    padding: 10px 20px;
+    border-radius: 8px;
+    font-size: 14px;
+    font-weight: 500;
+    cursor: pointer;
+    transition: all 0.2s ease;
+  }
+
+  .modal-cancel-button {
+    background-color: #ffffff;
+    color: #374151;
+    border: 1px solid #d1d5db;
+  }
+
+  .modal-cancel-button:hover {
+    background-color: #f9fafb;
+  }
+
+  .modal-create-button {
+    background-color: #3b82f6;
+    color: #ffffff;
+    border: 1px solid #3b82f6;
+  }
+
+  .modal-create-button:hover {
+    background-color: #2563eb;
+  }
+`;var ft=Object.defineProperty,mt=Object.getOwnPropertyDescriptor,E=(i,e,t,n)=>{for(var s=n>1?void 0:n?mt(e,t):e,r=i.length-1,o;r>=0;r--)(o=i[r])&&(s=(n?o(e,t,s):o(s))||s);return n&&s&&ft(e,t,s),s};const Le=[{id:"wf-1",name:"Onboarding Checklist",description:"Standard checklist for new employees.",steps:[{id:"step-1",title:"Welcome Information",description:"Basic details collection.",order:1,assignment:{category:"individual",type:"specific_user",email:"hr@example.com"},elements:[{id:"c1",type:"text",content:"Welcome to our company! We're excited to have you join our team. This onboarding process will help you get set up quickly and efficiently.",order:1},{id:"c2",type:"divider",content:"",caption:"Personal Information",order:2},{id:"q1",type:"text_input",label:"Full Name",order:3,required:!0},{id:"q2",type:"text_input",label:"Email Address",order:4,required:!0},{id:"c3",type:"markdown",content:`## Next Steps
+
+After completing this form, you'll receive:
+
+* **Welcome email** with your login credentials
+* **Schedule** for your orientation meeting
+* **Access** to company resources
+
+### Important Notes
+
+Please ensure all information is *accurate* before proceeding. If you need to make changes later, contact your HR representative.
+
+### What to Expect
+
+1. **Immediate**: Confirmation email
+2. **Within 24 hours**: Welcome package
+3. **This week**: Orientation meeting
+
+> **Pro tip**: Save this information for future reference!
+
+You can use \`code snippets\` like this for technical details.`,order:5}],status:"pending"},{id:"step-2",title:"Department Setup",description:"",order:2,assignment:{category:"individual",type:"instance_assignee_select"},elements:[{id:"c4",type:"text",content:"Now let's set up your department and role information. This will help us assign you to the right teams and provide appropriate access.",order:1},{id:"q3",type:"select",label:"Department",order:2,required:!0,options:["Engineering","Sales","Marketing","HR"]},{id:"q4",type:"text_input",label:"Role/Title",order:3,required:!0},{id:"c5",type:"divider",content:"",order:4},{id:"c6",type:"html",content:"<div style='background: #f0f9ff; padding: 16px; border-radius: 8px; border-left: 4px solid #3b82f6;'><strong>Note:</strong> Your department assignment will determine your initial access permissions and team assignments. You can request changes through your manager after onboarding.</div>",order:5}],status:"pending"},{id:"step-3",title:"Feedback",description:"Any initial comments?",order:3,assignment:{category:"individual",type:"subject"},elements:[{id:"c7",type:"text",content:"We'd love to hear your feedback about the onboarding process. Your input helps us improve the experience for future team members.",order:1},{id:"q5",type:"textarea",label:"Comments",order:2,required:!1},{id:"c8",type:"image",content:"",url:"https://example.com/onboarding-complete.jpg",alt:"Onboarding Complete",caption:"Congratulations on completing your onboarding!",order:3}],status:"pending"}]},{id:"wf-2",name:"IT Asset Request",description:"Request new hardware or software.",steps:[{id:"s1",title:"Request Details",order:1,assignment:{category:"individual",type:"subject"},elements:[{id:"itq1",type:"select",label:"Asset Type",order:1,required:!1,options:["Laptop","Monitor","Software License"]}],status:"pending"},{id:"s2",title:"Justification",order:2,assignment:{category:"role",type:"instance_role_assignee_select",targetId:"manager"},elements:[{id:"itq2",type:"textarea",label:"Reason",order:1,required:!0}],status:"pending"}]}];JSON.parse(JSON.stringify(Le[0].steps)),JSON.parse(JSON.stringify(Le[1].steps));let w=class extends R{constructor(){super(...arguments),this._templateData={name:"",description:"",steps:[]},this._showStepModal=!1,this._stepFormData={title:"",description:""},this._draggedStepId=null,this._dragOverStepId=null,this._selectedStepId=null,this._questions=[]}connectedCallback(){super.connectedCallback(),this._templateData=this._getDefaultWorkflowData()}_getDefaultWorkflowData(){const i={id:"step-1",title:"Step 1",description:"",order:1,assignment:{category:"individual",type:"subject"},elements:[],status:"pending"};return{id:he(),name:"",description:"",steps:[i]}}_handleTitleChange(i){const e=i.target;this._templateData={...this._templateData,name:e.value}}_handleDescriptionChange(i){const e=i.target;this._templateData={...this._templateData,description:e.value}}_handleCancel(){var i;console.log("🚫 Builder Widget: Cancel button clicked"),(i=this.onCancel)==null||i.call(this)}_handleSave(){var i,e;if((i=this._templateData.name)!=null&&i.trim()){const t={id:this._templateData.id||he(),name:this._templateData.name,description:this._templateData.description||"",steps:this._templateData.steps||[]};console.log("💾 Builder Widget: Save button clicked"),console.log("📄 Workflow Template:",JSON.stringify(t,null,2)),console.log("🔄 Calling onSave callback with workflow template"),(e=this.onSave)==null||e.call(this,t)}else console.log("⚠️ Builder Widget: Save attempted but no title provided")}_addStep(){console.log("🔹 Opening step creation modal"),this._stepFormData={title:"",description:""},this._showStepModal=!0}_closeStepModal(){console.log("🔹 Closing step creation modal"),this._showStepModal=!1,this._stepFormData={title:"",description:""}}_handleStepFormInput(i){const e=i.target,{name:t,value:n}=e;this._stepFormData={...this._stepFormData,[t]:n}}_createStep(){var t,n;if(!((t=this._stepFormData.title)!=null&&t.trim())){console.log("⚠️ Step title is required");return}const i=this._templateData.steps||[],e={id:he(),title:this._stepFormData.title.trim(),description:((n=this._stepFormData.description)==null?void 0:n.trim())||"",order:i.length+1,assignment:{category:"individual",type:"subject"},elements:[],status:"pending"};this._templateData={...this._templateData,steps:[...i,e]},this._selectedStepId=e.id,console.log("✅ Step created and selected:",e),this._closeStepModal()}_selectStep(i){this._selectedStepId=i,console.log("🎯 Step selected:",i)}_getSelectedStep(){return!this._selectedStepId||!this._templateData.steps?null:this._templateData.steps.find(i=>i.id===this._selectedStepId)||null}_handleDragStart(i,e){this._draggedStepId=e,i.dataTransfer&&(i.dataTransfer.effectAllowed="move",i.dataTransfer.setData("text/plain",e)),console.log("🔄 Drag started for step:",e)}_handleDragEnd(i){this._draggedStepId=null,this._dragOverStepId=null,console.log("🔄 Drag ended")}_handleDragOver(i,e){i.preventDefault(),i.dataTransfer&&(i.dataTransfer.dropEffect="move"),this._dragOverStepId!==e&&(this._dragOverStepId=e)}_handleDragLeave(i){const e=i.relatedTarget;i.currentTarget.contains(e)||(this._dragOverStepId=null)}_handleDrop(i,e){if(i.preventDefault(),!this._draggedStepId||this._draggedStepId===e){this._draggedStepId=null,this._dragOverStepId=null;return}const t=this._templateData.steps||[],n=t.findIndex(a=>a.id===this._draggedStepId),s=t.findIndex(a=>a.id===e);if(n===-1||s===-1){console.error("Could not find step indices for reordering");return}console.log("🔄 Before reorder:",t.map((a,d)=>`${d+1}: ${a.title}`));const r=[...t],[o]=r.splice(n,1);r.splice(s,0,o),r.forEach((a,d)=>{a.order=d+1}),console.log("🔄 After reorder:",r.map((a,d)=>`${d+1}: ${a.title}`)),this._templateData={...this._templateData,steps:r},console.log("📝 Template updated with new step order"),this._draggedStepId=null,this._dragOverStepId=null}_addQuestion(i="text_input"){var n,s;if(!this._templateData.steps||this._templateData.steps.length===0||!this._selectedStepId){console.log("⚠️ Cannot add questions without steps or selected step");return}const e=this._getSelectedStep();if(!e){console.log("⚠️ No step selected");return}if(["text","html","divider","markdown"].includes(i)){let r={id:`c-${Date.now()}`,type:i,order:(((n=e.elements)==null?void 0:n.length)||0)+1};switch(i){case"text":r.content="Enter your text content here...";break;case"html":r.content="<p>Enter your HTML content here...</p>";break;case"divider":r.content="",r.caption="Section Divider";break;case"markdown":r.content=`## Enter your markdown content here...
+
+Use **bold** and *italic* text.`;break}const o=this._templateData.steps.map(a=>a.id===this._selectedStepId?{...a,elements:[...a.elements||[],r]}:a);this._templateData={...this._templateData,steps:o},console.log("✅ Content element added to step:",this._selectedStepId)}else{const r={id:`q-${Date.now()}`,type:i,label:this._getQuestionTypeDisplayName(i),order:(((s=e.elements)==null?void 0:s.length)||0)+1,required:!1};["select","radio","checkbox"].includes(i)&&(r.options=["Option 1","Option 2"]);const o=this._templateData.steps.map(a=>a.id===this._selectedStepId?{...a,elements:[...a.elements||[],r]}:a);this._templateData={...this._templateData,steps:o},console.log("✅ Question added to step:",this._selectedStepId)}}_addContentElement(i){var s;if(!this._templateData.steps||this._templateData.steps.length===0||!this._selectedStepId){console.log("⚠️ Cannot add content without steps or selected step");return}const e=this._getSelectedStep();if(!e){console.log("⚠️ No step selected");return}let t={id:`c-${Date.now()}`,type:i,order:(((s=e.elements)==null?void 0:s.length)||0)+1};switch(i){case"text":t.content="Enter your text content here...";break;case"html":t.content="<p>Enter your HTML content here...</p>";break;case"image":t.content="",t.url="",t.alt="",t.caption="";break;case"video":t.content="",t.url="",t.caption="";break;case"file":t.content="",t.url="",t.caption="";break;case"divider":t.content="",t.caption="Section Divider";break;case"markdown":t.content=`## Enter your markdown content here...
+
+Use **bold** and *italic* text.`;break}const n=this._templateData.steps.map(r=>r.id===this._selectedStepId?{...r,elements:[...r.elements||[],t]}:r);this._templateData={...this._templateData,steps:n},console.log("✅ Content element added to step:",this._selectedStepId)}_updateQuestion(i,e){var n;if(!this._selectedStepId)return;const t=(n=this._templateData.steps)==null?void 0:n.map(s=>{var r;return s.id===this._selectedStepId?{...s,elements:((r=s.elements)==null?void 0:r.map(o=>o.id===i?{...o,...e}:o))||[]}:s});this._templateData={...this._templateData,steps:t}}_updateContentElement(i,e){var n;if(!this._selectedStepId)return;const t=(n=this._templateData.steps)==null?void 0:n.map(s=>{var r;return s.id===this._selectedStepId?{...s,elements:((r=s.elements)==null?void 0:r.map(o=>o.id===i?{...o,...e}:o))||[]}:s});this._templateData={...this._templateData,steps:t}}_deleteQuestion(i){var t;if(!this._selectedStepId)return;const e=(t=this._templateData.steps)==null?void 0:t.map(n=>{var s;return n.id===this._selectedStepId?{...n,elements:((s=n.elements)==null?void 0:s.filter(r=>r.id!==i))||[]}:n});this._templateData={...this._templateData,steps:e},console.log("🗑️ Question deleted:",i)}_renderQuestionTypeSpecificFields(i){switch(i.type){case"select":case"radio":return l`
+          <div class="question-options-section">
+            <label class="options-label">Options:</label>
+            <div class="options-list">
+              ${(i.options||[]).map((e,t)=>l`
+                  <div class="option-item">
+                    <input
+                      type="text"
+                      class="option-input"
+                      placeholder="Option ${t+1}"
+                      .value=${e}
+                      @input=${n=>{const s=n.target,r=[...i.options||[]];r[t]=s.value,this._updateQuestion(i.id,{options:r})}}
+                    />
+                    <button
+                      class="remove-option-button"
+                      @click=${()=>{const n=[...i.options||[]];n.splice(t,1),this._updateQuestion(i.id,{options:n})}}
+                      title="Remove option"
+                    >
+                      ×
+                    </button>
+                  </div>
+                `)}
+              <button
+                class="add-option-button"
+                @click=${()=>{const e=[...i.options||[],""];this._updateQuestion(i.id,{options:e})}}
+              >
+                + Add Option
+              </button>
+            </div>
+          </div>
+        `;case"checkbox":return l`
+          <div class="question-checkbox-config">
+            <div class="checkbox-type-selection">
+              <label class="checkbox-type-label">
+                <input
+                  type="radio"
+                  name="checkbox-type-${i.id}"
+                  value="single"
+                  .checked=${!i.options||i.options.length===0}
+                  @change=${e=>{e.target.checked&&this._updateQuestion(i.id,{options:void 0})}}
+                />
+                Single Checkbox (Yes/No)
+              </label>
+              <label class="checkbox-type-label">
+                <input
+                  type="radio"
+                  name="checkbox-type-${i.id}"
+                  value="group"
+                  .checked=${i.options&&i.options.length>0}
+                  @change=${e=>{e.target.checked&&this._updateQuestion(i.id,{options:i.options&&i.options.length>0?i.options:["Option 1","Option 2"]})}}
+                />
+                Checkbox Group (Multiple selections)
+              </label>
+            </div>
+
+            ${i.options&&i.options.length>0?l`
+                  <div class="question-options-section">
+                    <label class="options-label">Checkbox Options:</label>
+                    <div class="options-list">
+                      ${(i.options||[]).map((e,t)=>l`
+                          <div class="option-item">
+                            <input
+                              type="text"
+                              class="option-input"
+                              placeholder="Option ${t+1}"
+                              .value=${e}
+                              @input=${n=>{const s=n.target,r=[...i.options||[]];r[t]=s.value,this._updateQuestion(i.id,{options:r})}}
+                            />
+                            <button
+                              class="remove-option-button"
+                              @click=${()=>{const n=[...i.options||[]];n.splice(t,1),this._updateQuestion(i.id,{options:n})}}
+                              title="Remove option"
+                            >
+                              ×
+                            </button>
+                          </div>
+                        `)}
+                      <button
+                        class="add-option-button"
+                        @click=${()=>{const e=[...i.options||[],""];this._updateQuestion(i.id,{options:e})}}
+                      >
+                        + Add Option
+                      </button>
+                    </div>
+                  </div>
+                `:l`
+                  <div class="single-checkbox-info">
+                    <p class="config-note">
+                      Single checkbox - users can check/uncheck for Yes/No
+                      response
+                    </p>
+                  </div>
+                `}
+          </div>
+        `;case"textarea":return l`
+          <div class="question-config-section">
+            <label class="config-label">
+              Placeholder:
+              <input
+                type="text"
+                class="config-input"
+                placeholder="Enter placeholder text"
+                .value=${i.placeholder||""}
+                @input=${e=>{const t=e.target;this._updateQuestion(i.id,{placeholder:t.value})}}
+              />
+            </label>
+          </div>
+        `;case"text_input":return l`
+          <div class="question-config-section">
+            <label class="config-label">
+              Placeholder:
+              <input
+                type="text"
+                class="config-input"
+                placeholder="Enter placeholder text"
+                .value=${i.placeholder||""}
+                @input=${e=>{const t=e.target;this._updateQuestion(i.id,{placeholder:t.value})}}
+              />
+            </label>
+          </div>
+        `;case"number":return l`
+          <div class="question-config-section">
+            <label class="config-label">
+              Placeholder:
+              <input
+                type="text"
+                class="config-input"
+                placeholder="Enter placeholder text"
+                .value=${i.placeholder||""}
+                @input=${e=>{const t=e.target;this._updateQuestion(i.id,{placeholder:t.value})}}
+              />
+            </label>
+          </div>
+        `;case"file_upload":return l`
+          <div class="question-config-section">
+            <p class="config-note">
+              File upload field - users can upload files
+            </p>
+          </div>
+        `;case"signature":return l`
+          <div class="question-config-section">
+            <p class="config-note">
+              Digital signature pad - users can sign with mouse/touch
+            </p>
+          </div>
+        `;case"date":return l`
+          <div class="question-config-section">
+            <p class="config-note">Date picker field</p>
+          </div>
+        `;default:return l``}}_renderContentTypeSpecificFields(i){switch(i.type){case"text":return l`
+          <div class="content-config-section">
+            <label class="config-label">
+              Text Content:
+              <textarea
+                class="config-textarea"
+                placeholder="Enter your text content..."
+                .value=${i.content||""}
+                @input=${e=>{const t=e.target;this._updateContentElement(i.id,{content:t.value})}}
+              ></textarea>
+            </label>
+          </div>
+        `;case"html":return l`
+          <div class="content-config-section">
+            <label class="config-label">
+              HTML Content:
+              <textarea
+                class="config-textarea"
+                placeholder="Enter your HTML content..."
+                .value=${i.content||""}
+                @input=${e=>{const t=e.target;this._updateContentElement(i.id,{content:t.value})}}
+              ></textarea>
+            </label>
+          </div>
+        `;case"image":return l`
+          <div class="content-config-section">
+            <label class="config-label">
+              Image URL:
+              <input
+                type="url"
+                class="config-input"
+                placeholder="https://example.com/image.jpg"
+                .value=${i.url||""}
+                @input=${e=>{const t=e.target;this._updateContentElement(i.id,{url:t.value})}}
+              />
+            </label>
+            <label class="config-label">
+              Alt Text:
+              <input
+                type="text"
+                class="config-input"
+                placeholder="Describe the image"
+                .value=${i.alt||""}
+                @input=${e=>{const t=e.target;this._updateContentElement(i.id,{alt:t.value})}}
+              />
+            </label>
+            <label class="config-label">
+              Caption:
+              <input
+                type="text"
+                class="config-input"
+                placeholder="Image caption"
+                .value=${i.caption||""}
+                @input=${e=>{const t=e.target;this._updateContentElement(i.id,{caption:t.value})}}
+              />
+            </label>
+          </div>
+        `;case"video":return l`
+          <div class="content-config-section">
+            <label class="config-label">
+              Video URL:
+              <input
+                type="url"
+                class="config-input"
+                placeholder="https://example.com/video.mp4"
+                .value=${i.url||""}
+                @input=${e=>{const t=e.target;this._updateContentElement(i.id,{url:t.value})}}
+              />
+            </label>
+            <label class="config-label">
+              Caption:
+              <input
+                type="text"
+                class="config-input"
+                placeholder="Video caption"
+                .value=${i.caption||""}
+                @input=${e=>{const t=e.target;this._updateContentElement(i.id,{caption:t.value})}}
+              />
+            </label>
+          </div>
+        `;case"file":return l`
+          <div class="content-config-section">
+            <label class="config-label">
+              File URL:
+              <input
+                type="url"
+                class="config-input"
+                placeholder="https://example.com/document.pdf"
+                .value=${i.url||""}
+                @input=${e=>{const t=e.target;this._updateContentElement(i.id,{url:t.value})}}
+              />
+            </label>
+            <label class="config-label">
+              Caption:
+              <input
+                type="text"
+                class="config-input"
+                placeholder="File description"
+                .value=${i.caption||""}
+                @input=${e=>{const t=e.target;this._updateContentElement(i.id,{caption:t.value})}}
+              />
+            </label>
+          </div>
+        `;case"divider":return l`
+          <div class="content-config-section">
+            <label class="config-label">
+              Caption:
+              <input
+                type="text"
+                class="config-input"
+                placeholder="Section divider caption"
+                .value=${i.caption||""}
+                @input=${e=>{const t=e.target;this._updateContentElement(i.id,{caption:t.value})}}
+              />
+            </label>
+          </div>
+        `;case"markdown":return l`
+          <div class="content-config-section">
+            <label class="config-label">
+              Markdown Content:
+              <textarea
+                class="config-textarea"
+                placeholder="Enter your markdown content..."
+                .value=${i.content||""}
+                @input=${e=>{const t=e.target;this._updateContentElement(i.id,{content:t.value})}}
+              ></textarea>
+            </label>
+          </div>
+        `;default:return l``}}_getQuestionTypeDisplayName(i){switch(i){case"text_input":return"Text Input";case"textarea":return"Long Text";case"select":return"Select";case"radio":return"Radio";case"checkbox":return"Checkbox";case"number":return"Number";case"date":return"Date";case"file_upload":return"File Upload";case"signature":return"Signature";default:return"Question"}}_getContentTypeDisplayName(i){switch(i){case"text":return"Text";case"html":return"HTML";case"image":return"Image";case"video":return"Video";case"file":return"File";case"divider":return"Divider";case"markdown":return"Markdown";default:return"Content"}}_getCheckboxTypeDisplayName(i){return i.options&&i.options.length>0?"Checkbox Group":"Single Checkbox"}_hasSteps(){const i=!!(this._templateData.steps&&this._templateData.steps.length>0);return i&&!this._selectedStepId&&this._templateData.steps&&(this._selectedStepId=this._templateData.steps[0].id,console.log("🎯 Auto-selected first step:",this._templateData.steps[0].title)),!i&&this._selectedStepId&&(this._selectedStepId=null),i}_getAssignmentDisplayText(i){switch(i.category){case"individual":switch(i.type){case"subject":return"Assigned to: Subject";case"creator":return"Assigned to: Creator";case"instance_assignee_select":return"Assigned to: To be selected";case"specific_user":return i.email?`Assigned to: ${i.email}`:"Assigned to: Specific user";default:return"Assigned to: Individual"}case"role":switch(i.type){case"instance_role_assignee_select":return i.targetId?`Assigned to: ${i.targetId} role`:"Assigned to: Role";default:return"Assigned to: Role"}default:return"Assignment not configured"}}render(){this._hasSteps();const i=this._getSelectedStep();return l`
+      <div class="header">
+        <div class="header-inputs">
+          <div class="form-group">
+            <label for="template-title">Title</label>
+            <input
+              type="text"
+              id="template-title"
+              placeholder="Title"
+              .value=${this._templateData.name||""}
+              @input=${this._handleTitleChange}
+            />
+          </div>
+          <div class="form-group">
+            <label for="template-description">Description</label>
+            <input
+              type="text"
+              id="template-description"
+              placeholder="Description"
+              .value=${this._templateData.description||""}
+              @input=${this._handleDescriptionChange}
+            />
+          </div>
+        </div>
+        <div class="header-actions">
+          <button class="save-button" @click=${this._handleSave}>
+            Save template
+          </button>
+        </div>
+      </div>
+
+      <div class="main-content">
+        <!-- Steps and Questions -->
+        <div class="content-columns">
+          <!-- Steps Section -->
+          <div class="section">
+            <div class="section-header">
+              <h2>Steps</h2>
+              <button class="add-button" @click=${this._addStep}>Add</button>
+            </div>
+
+            <div class="steps-list">
+              <div
+                class="step-item selected"
+                @click=${()=>this._selectStep("step-1")}
+              >
+                <div class="step-handle">⋮⋮</div>
+                <div class="step-content">
+                  <strong>Step 1</strong>
+                </div>
+                <div class="step-actions">
+                  <button class="step-menu">⋯</button>
+                </div>
+              </div>
+            </div>
+          </div>
+
+          <!-- Questions Section -->
+          <div class="section">
+            <div class="section-header">
+              <h2>Questions</h2>
+              <button class="add-button" @click=${()=>this._addQuestion()}>
+                Add
+              </button>
+            </div>
+
+            ${i&&i.elements&&i.elements.length>0?l`
+                  <div class="elements-list">
+                    ${i.elements.map(e=>{const t="label"in e&&"required"in e,n="content"in e;if(t){const s=e;return l`
+                          <div class="question-item">
+                            <div class="question-header">
+                              <h3 class="question-title">
+                                ${s.label||(s.type==="checkbox"?this._getCheckboxTypeDisplayName(s):this._getQuestionTypeDisplayName(s.type))}
+                              </h3>
+                              <div class="question-header-controls">
+                                <select
+                                  class="question-type-select"
+                                  .value=${s.type||"text_input"}
+                                  style="color: #000 !important;"
+                                  @change=${r=>{const a=r.target.value;if(["text","html","divider","markdown"].includes(a)){this._addQuestion(a),this._deleteQuestion(s.id);return}const p={type:a};["select","radio","checkbox"].includes(a)&&!s.options&&(p.options=["Option 1","Option 2"]);const c=this._getQuestionTypeDisplayName(s.type);(!s.label||s.label===c)&&(p.label=this._getQuestionTypeDisplayName(a)),this._updateQuestion(s.id,p)}}
+                                >
+                                  <optgroup label="Questions">
+                                    <option value="text_input">
+                                      Text Input (short)
+                                    </option>
+                                    <option value="textarea">
+                                      Text Input (long)
+                                    </option>
+                                    <option value="select">Select</option>
+                                    <option value="radio">Radio</option>
+                                    <option value="checkbox">Checkbox</option>
+                                    <option value="file_upload">
+                                      File Upload
+                                    </option>
+                                    <option value="signature">Signature</option>
+                                    <option value="number">Number</option>
+                                    <option value="date">Date</option>
+                                  </optgroup>
+                                  <optgroup label="Content">
+                                    <option value="text">Text</option>
+                                    <option value="html">HTML</option>
+                                    <option value="divider">Divider</option>
+                                    <option value="markdown">Markdown</option>
+                                  </optgroup>
+                                </select>
+                                <button
+                                  class="delete-question-button"
+                                  @click=${()=>this._deleteQuestion(s.id)}
+                                  title="Delete question"
+                                >
+                                  🗑️
+                                </button>
+                              </div>
+                            </div>
+
+                            <input
+                              type="text"
+                              class="question-label-input"
+                              placeholder="Question label"
+                              .value=${s.label||""}
+                              @input=${r=>{const o=r.target;this._updateQuestion(s.id,{label:o.value}),this.requestUpdate()}}
+                            />
+
+                            ${this._renderQuestionTypeSpecificFields(s)}
+
+                            <label class="question-required-label">
+                              <input
+                                type="checkbox"
+                                .checked=${s.required||!1}
+                                @change=${r=>{const o=r.target;this._updateQuestion(s.id,{required:o.checked})}}
+                              />
+                              Required
+                            </label>
+                          </div>
+                        `}else if(n){const s=e;return l`
+                          <div class="question-item">
+                            <div class="question-header">
+                              <h3 class="question-title">
+                                ${this._getContentTypeDisplayName(s.type)}
+                              </h3>
+                              <div class="question-header-controls">
+                                <select
+                                  class="question-type-select"
+                                  .value=${e.type||"text"}
+                                  style="color: #000 !important;"
+                                  @change=${r=>{const a=r.target.value;if(!["text","html","divider","markdown"].includes(a)){this._addQuestion(a),this._deleteQuestion(e.id);return}this._addQuestion(a),this._deleteQuestion(e.id)}}
+                                >
+                                  <optgroup label="Questions">
+                                    <option value="text_input">
+                                      Text Input (short)
+                                    </option>
+                                    <option value="textarea">
+                                      Text Input (long)
+                                    </option>
+                                    <option value="select">Select</option>
+                                    <option value="radio">Radio</option>
+                                    <option value="checkbox">Checkbox</option>
+                                    <option value="file_upload">
+                                      File Upload
+                                    </option>
+                                    <option value="signature">Signature</option>
+                                    <option value="number">Number</option>
+                                    <option value="date">Date</option>
+                                  </optgroup>
+                                  <optgroup label="Content">
+                                    <option value="text">Text</option>
+                                    <option value="html">HTML</option>
+                                    <option value="divider">Divider</option>
+                                    <option value="markdown">Markdown</option>
+                                  </optgroup>
+                                </select>
+                                <button
+                                  class="delete-question-button"
+                                  @click=${()=>this._deleteQuestion(e.id)}
+                                  title="Delete content"
+                                >
+                                  ✕
+                                </button>
+                              </div>
+                            </div>
+                            <div class="question-content">
+                              ${this._renderContentTypeSpecificFields(s)}
+                            </div>
+                          </div>
+                        `}else{const s=e;return l`
+                          <div class="question-item">
+                            <div class="question-header">
+                              <h3 class="question-title">Unknown Element</h3>
+                              <div class="question-header-controls">
+                                <button
+                                  class="delete-question-button"
+                                  @click=${()=>this._deleteQuestion(s.id)}
+                                  title="Delete element"
+                                >
+                                  ✕
+                                </button>
+                              </div>
+                            </div>
+                          </div>
+                        `}})}
+                  </div>
+                `:l`
+                  <div class="empty-state">
+                    <h3>Add questions</h3>
+                    <p>Use the add button to start building your workflow</p>
+                    <button class="add-button" @click=${()=>this._addQuestion()}>
+                      Add
+                    </button>
+                  </div>
+                `}
+          </div>
+        </div>
+      </div>
+    `}};w.styles=L`
+    ${ct}
+    ${ut}
+    ${ht}
+    ${Pe}
+    ${gt}
+  `,E([_()],w.prototype,"_templateData",2),E([_()],w.prototype,"_showStepModal",2),E([_()],w.prototype,"_stepFormData",2),E([_()],w.prototype,"_draggedStepId",2),E([_()],w.prototype,"_dragOverStepId",2),E([_()],w.prototype,"_selectedStepId",2),E([_()],w.prototype,"_questions",2),E([C({attribute:!1})],w.prototype,"onCancel",2),E([C({attribute:!1})],w.prototype,"onSave",2),w=E([Ie("builder-widget")],w);class bt{constructor(e,t){this.signaturePads=e,this.savedSignatures=t}validateStep(e,t,n){if(n==="preview")return{isValid:!0,errors:{}};if(!e)return{isValid:!1,errors:{}};let s=!0;const r={};for(const o of e.elements)if(this.isQuestionElement(o)){const a=o;if(a.required){const d=this.validateQuestion(a,t[a.id]);d&&(s=!1,r[a.id]=d.message)}}return{isValid:s,errors:r}}validateQuestion(e,t){switch(e.type){case"checkbox":return this.validateCheckbox(e,t);case"signature":return this.validateSignature(e,t);case"file_upload":return this.validateFileUpload(e,t);default:return this.validateBasicField(e,t)}}validateCheckbox(e,t){if(e.options&&e.options.length>0){if(!Array.isArray(t)||t.length===0)return{questionId:e.id,message:`${e.label} is required.`}}else if(t!==!0)return{questionId:e.id,message:`${e.label} is required.`};return null}validateSignature(e,t){const n=this.signaturePads.get(e.id);return!n||n.isEmpty()?{questionId:e.id,message:`${e.label} is required.`}:this.savedSignatures.has(e.id)?null:{questionId:e.id,message:`Please save your ${e.label} before continuing.`}}validateFileUpload(e,t){return!t||t===null||t===void 0?{questionId:e.id,message:`${e.label} is required.`}:null}validateBasicField(e,t){return t==null||t===""?{questionId:e.id,message:`${e.label} is required.`}:null}isQuestionElement(e){return["text_input","textarea","select","number","radio","checkbox","date","file_upload","signature"].includes(e.type)}}class vt{getStorageKey(e){return`runner-form-data-${e||"default"}`}saveFormData(e,t,n,s,r,o){var c,u,h;const a=this.getStorageKey(e),d=o?{...o,currentStepId:(u=(c=o.steps)==null?void 0:c[n])==null?void 0:u.id,completedSteps:Array.from(r),updatedAt:new Date,steps:(h=o.steps)==null?void 0:h.map(f=>({...f,responses:f.responses||[]}))}:null,p={formData:t,timestamp:new Date().toISOString(),stepIndex:n,savedSignatures:Array.from(s),completedSteps:Array.from(r),instance:d};try{localStorage.setItem(a,JSON.stringify(p))}catch(f){console.warn("Failed to save form data to localStorage:",f)}}restoreFormData(e){const t=this.getStorageKey(e);try{const n=localStorage.getItem(t);if(!n)return null;const s=JSON.parse(n);return{formData:s.formData||{},stepIndex:s.stepIndex||0,savedSignatures:new Set(s.savedSignatures||[]),completedSteps:new Set(s.completedSteps||[]),savedInstance:s.instance||null}}catch(n){return console.warn("Failed to restore form data from localStorage:",n),null}}clearFormData(e,t="completed workflow"){const n=this.getStorageKey(e);try{localStorage.removeItem(n),console.log(`Cleared saved form data for ${t}`)}catch(s){console.warn("Failed to clear saved form data:",s)}}shouldRestoreData(e){return e==="default"}}/*!
+ * Signature Pad v5.0.10 | https://github.com/szimek/signature_pad
+ * (c) 2025 Szymon Nowak | Released under the MIT license
+ */class X{constructor(e,t,n,s){if(isNaN(e)||isNaN(t))throw new Error(`Point is invalid: (${e}, ${t})`);this.x=+e,this.y=+t,this.pressure=n||0,this.time=s||Date.now()}distanceTo(e){return Math.sqrt(Math.pow(this.x-e.x,2)+Math.pow(this.y-e.y,2))}equals(e){return this.x===e.x&&this.y===e.y&&this.pressure===e.pressure&&this.time===e.time}velocityFrom(e){return this.time!==e.time?this.distanceTo(e)/(this.time-e.time):0}}class ge{static fromPoints(e,t){const n=this.calculateControlPoints(e[0],e[1],e[2]).c2,s=this.calculateControlPoints(e[1],e[2],e[3]).c1;return new ge(e[1],n,s,e[2],t.start,t.end)}static calculateControlPoints(e,t,n){const s=e.x-t.x,r=e.y-t.y,o=t.x-n.x,a=t.y-n.y,d={x:(e.x+t.x)/2,y:(e.y+t.y)/2},p={x:(t.x+n.x)/2,y:(t.y+n.y)/2},c=Math.sqrt(s*s+r*r),u=Math.sqrt(o*o+a*a),h=d.x-p.x,f=d.y-p.y,b=c+u==0?0:u/(c+u),$={x:p.x+h*b,y:p.y+f*b},ie=t.x-$.x,ne=t.y-$.y;return{c1:new X(d.x+ie,d.y+ne),c2:new X(p.x+ie,p.y+ne)}}constructor(e,t,n,s,r,o){this.startPoint=e,this.control2=t,this.control1=n,this.endPoint=s,this.startWidth=r,this.endWidth=o}length(){let t=0,n,s;for(let r=0;r<=10;r+=1){const o=r/10,a=this.point(o,this.startPoint.x,this.control1.x,this.control2.x,this.endPoint.x),d=this.point(o,this.startPoint.y,this.control1.y,this.control2.y,this.endPoint.y);if(r>0){const p=a-n,c=d-s;t+=Math.sqrt(p*p+c*c)}n=a,s=d}return t}point(e,t,n,s,r){return t*(1-e)*(1-e)*(1-e)+3*n*(1-e)*(1-e)*e+3*s*(1-e)*e*e+r*e*e*e}}class xt{constructor(){try{this._et=new EventTarget}catch{this._et=document}}addEventListener(e,t,n){this._et.addEventListener(e,t,n)}dispatchEvent(e){return this._et.dispatchEvent(e)}removeEventListener(e,t,n){this._et.removeEventListener(e,t,n)}}function _t(i,e=250){let t=0,n=null,s,r,o;const a=()=>{t=Date.now(),n=null,s=i.apply(r,o),n||(r=null,o=[])};return function(...p){const c=Date.now(),u=e-(c-t);return r=this,o=p,u<=0||u>e?(n&&(clearTimeout(n),n=null),t=c,s=i.apply(r,o),n||(r=null,o=[])):n||(n=window.setTimeout(a,u)),s}}class Z extends xt{constructor(e,t={}){var n,s,r;super(),this.canvas=e,this._drawingStroke=!1,this._isEmpty=!0,this._lastPoints=[],this._data=[],this._lastVelocity=0,this._lastWidth=0,this.velocityFilterWeight=t.velocityFilterWeight||.7,this.minWidth=t.minWidth||.5,this.maxWidth=t.maxWidth||2.5,this.throttle=(n=t.throttle)!==null&&n!==void 0?n:16,this.minDistance=(s=t.minDistance)!==null&&s!==void 0?s:5,this.dotSize=t.dotSize||0,this.penColor=t.penColor||"black",this.backgroundColor=t.backgroundColor||"rgba(0,0,0,0)",this.compositeOperation=t.compositeOperation||"source-over",this.canvasContextOptions=(r=t.canvasContextOptions)!==null&&r!==void 0?r:{},this._strokeMoveUpdate=this.throttle?_t(Z.prototype._strokeUpdate,this.throttle):Z.prototype._strokeUpdate,this._handleMouseDown=this._handleMouseDown.bind(this),this._handleMouseMove=this._handleMouseMove.bind(this),this._handleMouseUp=this._handleMouseUp.bind(this),this._handleTouchStart=this._handleTouchStart.bind(this),this._handleTouchMove=this._handleTouchMove.bind(this),this._handleTouchEnd=this._handleTouchEnd.bind(this),this._handlePointerDown=this._handlePointerDown.bind(this),this._handlePointerMove=this._handlePointerMove.bind(this),this._handlePointerUp=this._handlePointerUp.bind(this),this._ctx=e.getContext("2d",this.canvasContextOptions),this.clear(),this.on()}clear(){const{_ctx:e,canvas:t}=this;e.fillStyle=this.backgroundColor,e.clearRect(0,0,t.width,t.height),e.fillRect(0,0,t.width,t.height),this._data=[],this._reset(this._getPointGroupOptions()),this._isEmpty=!0,this._strokePointerId=void 0}fromDataURL(e,t={}){return new Promise((n,s)=>{const r=new Image,o=t.ratio||window.devicePixelRatio||1,a=t.width||this.canvas.width/o,d=t.height||this.canvas.height/o,p=t.xOffset||0,c=t.yOffset||0;this._reset(this._getPointGroupOptions()),r.onload=()=>{this._ctx.drawImage(r,p,c,a,d),n()},r.onerror=u=>{s(u)},r.crossOrigin="anonymous",r.src=e,this._isEmpty=!1})}toDataURL(e="image/png",t){switch(e){case"image/svg+xml":return typeof t!="object"&&(t=void 0),`data:image/svg+xml;base64,${btoa(this.toSVG(t))}`;default:return typeof t!="number"&&(t=void 0),this.canvas.toDataURL(e,t)}}on(){this.canvas.style.touchAction="none",this.canvas.style.msTouchAction="none",this.canvas.style.userSelect="none";const e=/Macintosh/.test(navigator.userAgent)&&"ontouchstart"in document;window.PointerEvent&&!e?this._handlePointerEvents():(this._handleMouseEvents(),"ontouchstart"in window&&this._handleTouchEvents())}off(){this.canvas.style.touchAction="auto",this.canvas.style.msTouchAction="auto",this.canvas.style.userSelect="auto",this.canvas.removeEventListener("pointerdown",this._handlePointerDown),this.canvas.removeEventListener("mousedown",this._handleMouseDown),this.canvas.removeEventListener("touchstart",this._handleTouchStart),this._removeMoveUpEventListeners()}_getListenerFunctions(){var e;const t=window.document===this.canvas.ownerDocument?window:(e=this.canvas.ownerDocument.defaultView)!==null&&e!==void 0?e:this.canvas.ownerDocument;return{addEventListener:t.addEventListener.bind(t),removeEventListener:t.removeEventListener.bind(t)}}_removeMoveUpEventListeners(){const{removeEventListener:e}=this._getListenerFunctions();e("pointermove",this._handlePointerMove),e("pointerup",this._handlePointerUp),e("mousemove",this._handleMouseMove),e("mouseup",this._handleMouseUp),e("touchmove",this._handleTouchMove),e("touchend",this._handleTouchEnd)}isEmpty(){return this._isEmpty}fromData(e,{clear:t=!0}={}){t&&this.clear(),this._fromData(e,this._drawCurve.bind(this),this._drawDot.bind(this)),this._data=this._data.concat(e)}toData(){return this._data}_isLeftButtonPressed(e,t){return t?e.buttons===1:(e.buttons&1)===1}_pointerEventToSignatureEvent(e){return{event:e,type:e.type,x:e.clientX,y:e.clientY,pressure:"pressure"in e?e.pressure:0}}_touchEventToSignatureEvent(e){const t=e.changedTouches[0];return{event:e,type:e.type,x:t.clientX,y:t.clientY,pressure:t.force}}_handleMouseDown(e){!this._isLeftButtonPressed(e,!0)||this._drawingStroke||this._strokeBegin(this._pointerEventToSignatureEvent(e))}_handleMouseMove(e){if(!this._isLeftButtonPressed(e,!0)||!this._drawingStroke){this._strokeEnd(this._pointerEventToSignatureEvent(e),!1);return}this._strokeMoveUpdate(this._pointerEventToSignatureEvent(e))}_handleMouseUp(e){this._isLeftButtonPressed(e)||this._strokeEnd(this._pointerEventToSignatureEvent(e))}_handleTouchStart(e){e.targetTouches.length!==1||this._drawingStroke||(e.cancelable&&e.preventDefault(),this._strokeBegin(this._touchEventToSignatureEvent(e)))}_handleTouchMove(e){if(e.targetTouches.length===1){if(e.cancelable&&e.preventDefault(),!this._drawingStroke){this._strokeEnd(this._touchEventToSignatureEvent(e),!1);return}this._strokeMoveUpdate(this._touchEventToSignatureEvent(e))}}_handleTouchEnd(e){e.targetTouches.length===0&&(e.cancelable&&e.preventDefault(),this._strokeEnd(this._touchEventToSignatureEvent(e)))}_getPointerId(e){return e.persistentDeviceId||e.pointerId}_allowPointerId(e,t=!1){return typeof this._strokePointerId>"u"?t:this._getPointerId(e)===this._strokePointerId}_handlePointerDown(e){this._drawingStroke||!this._isLeftButtonPressed(e)||!this._allowPointerId(e,!0)||(this._strokePointerId=this._getPointerId(e),e.preventDefault(),this._strokeBegin(this._pointerEventToSignatureEvent(e)))}_handlePointerMove(e){if(this._allowPointerId(e)){if(!this._isLeftButtonPressed(e,!0)||!this._drawingStroke){this._strokeEnd(this._pointerEventToSignatureEvent(e),!1);return}e.preventDefault(),this._strokeMoveUpdate(this._pointerEventToSignatureEvent(e))}}_handlePointerUp(e){this._isLeftButtonPressed(e)||!this._allowPointerId(e)||(e.preventDefault(),this._strokeEnd(this._pointerEventToSignatureEvent(e)))}_getPointGroupOptions(e){return{penColor:e&&"penColor"in e?e.penColor:this.penColor,dotSize:e&&"dotSize"in e?e.dotSize:this.dotSize,minWidth:e&&"minWidth"in e?e.minWidth:this.minWidth,maxWidth:e&&"maxWidth"in e?e.maxWidth:this.maxWidth,velocityFilterWeight:e&&"velocityFilterWeight"in e?e.velocityFilterWeight:this.velocityFilterWeight,compositeOperation:e&&"compositeOperation"in e?e.compositeOperation:this.compositeOperation}}_strokeBegin(e){if(!this.dispatchEvent(new CustomEvent("beginStroke",{detail:e,cancelable:!0})))return;const{addEventListener:n}=this._getListenerFunctions();switch(e.event.type){case"mousedown":n("mousemove",this._handleMouseMove,{passive:!1}),n("mouseup",this._handleMouseUp,{passive:!1});break;case"touchstart":n("touchmove",this._handleTouchMove,{passive:!1}),n("touchend",this._handleTouchEnd,{passive:!1});break;case"pointerdown":n("pointermove",this._handlePointerMove,{passive:!1}),n("pointerup",this._handlePointerUp,{passive:!1});break}this._drawingStroke=!0;const s=this._getPointGroupOptions(),r=Object.assign(Object.assign({},s),{points:[]});this._data.push(r),this._reset(s),this._strokeUpdate(e)}_strokeUpdate(e){if(!this._drawingStroke)return;if(this._data.length===0){this._strokeBegin(e);return}this.dispatchEvent(new CustomEvent("beforeUpdateStroke",{detail:e}));const t=this._createPoint(e.x,e.y,e.pressure),n=this._data[this._data.length-1],s=n.points,r=s.length>0&&s[s.length-1],o=r?t.distanceTo(r)<=this.minDistance:!1,a=this._getPointGroupOptions(n);if(!r||!(r&&o)){const d=this._addPoint(t,a);r?d&&this._drawCurve(d,a):this._drawDot(t,a),s.push({time:t.time,x:t.x,y:t.y,pressure:t.pressure})}this.dispatchEvent(new CustomEvent("afterUpdateStroke",{detail:e}))}_strokeEnd(e,t=!0){this._removeMoveUpEventListeners(),this._drawingStroke&&(t&&this._strokeUpdate(e),this._drawingStroke=!1,this._strokePointerId=void 0,this.dispatchEvent(new CustomEvent("endStroke",{detail:e})))}_handlePointerEvents(){this._drawingStroke=!1,this.canvas.addEventListener("pointerdown",this._handlePointerDown,{passive:!1})}_handleMouseEvents(){this._drawingStroke=!1,this.canvas.addEventListener("mousedown",this._handleMouseDown,{passive:!1})}_handleTouchEvents(){this.canvas.addEventListener("touchstart",this._handleTouchStart,{passive:!1})}_reset(e){this._lastPoints=[],this._lastVelocity=0,this._lastWidth=(e.minWidth+e.maxWidth)/2,this._ctx.fillStyle=e.penColor,this._ctx.globalCompositeOperation=e.compositeOperation}_createPoint(e,t,n){const s=this.canvas.getBoundingClientRect();return new X(e-s.left,t-s.top,n,new Date().getTime())}_addPoint(e,t){const{_lastPoints:n}=this;if(n.push(e),n.length>2){n.length===3&&n.unshift(n[0]);const s=this._calculateCurveWidths(n[1],n[2],t),r=ge.fromPoints(n,s);return n.shift(),r}return null}_calculateCurveWidths(e,t,n){const s=n.velocityFilterWeight*t.velocityFrom(e)+(1-n.velocityFilterWeight)*this._lastVelocity,r=this._strokeWidth(s,n),o={end:r,start:this._lastWidth};return this._lastVelocity=s,this._lastWidth=r,o}_strokeWidth(e,t){return Math.max(t.maxWidth/(e+1),t.minWidth)}_drawCurveSegment(e,t,n){const s=this._ctx;s.moveTo(e,t),s.arc(e,t,n,0,2*Math.PI,!1),this._isEmpty=!1}_drawCurve(e,t){const n=this._ctx,s=e.endWidth-e.startWidth,r=Math.ceil(e.length())*2;n.beginPath(),n.fillStyle=t.penColor;for(let o=0;o<r;o+=1){const a=o/r,d=a*a,p=d*a,c=1-a,u=c*c,h=u*c;let f=h*e.startPoint.x;f+=3*u*a*e.control1.x,f+=3*c*d*e.control2.x,f+=p*e.endPoint.x;let b=h*e.startPoint.y;b+=3*u*a*e.control1.y,b+=3*c*d*e.control2.y,b+=p*e.endPoint.y;const $=Math.min(e.startWidth+p*s,t.maxWidth);this._drawCurveSegment(f,b,$)}n.closePath(),n.fill()}_drawDot(e,t){const n=this._ctx,s=t.dotSize>0?t.dotSize:(t.minWidth+t.maxWidth)/2;n.beginPath(),this._drawCurveSegment(e.x,e.y,s),n.closePath(),n.fillStyle=t.penColor,n.fill()}_fromData(e,t,n){for(const s of e){const{points:r}=s,o=this._getPointGroupOptions(s);if(r.length>1)for(let a=0;a<r.length;a+=1){const d=r[a],p=new X(d.x,d.y,d.pressure,d.time);a===0&&this._reset(o);const c=this._addPoint(p,o);c&&t(c,o)}else this._reset(o),n(r[0],o)}}toSVG({includeBackgroundColor:e=!1}={}){const t=this._data,n=Math.max(window.devicePixelRatio||1,1),s=0,r=0,o=this.canvas.width/n,a=this.canvas.height/n,d=document.createElementNS("http://www.w3.org/2000/svg","svg");if(d.setAttribute("xmlns","http://www.w3.org/2000/svg"),d.setAttribute("xmlns:xlink","http://www.w3.org/1999/xlink"),d.setAttribute("viewBox",`${s} ${r} ${o} ${a}`),d.setAttribute("width",o.toString()),d.setAttribute("height",a.toString()),e&&this.backgroundColor){const p=document.createElement("rect");p.setAttribute("width","100%"),p.setAttribute("height","100%"),p.setAttribute("fill",this.backgroundColor),d.appendChild(p)}return this._fromData(t,(p,{penColor:c})=>{const u=document.createElement("path");if(!isNaN(p.control1.x)&&!isNaN(p.control1.y)&&!isNaN(p.control2.x)&&!isNaN(p.control2.y)){const h=`M ${p.startPoint.x.toFixed(3)},${p.startPoint.y.toFixed(3)} C ${p.control1.x.toFixed(3)},${p.control1.y.toFixed(3)} ${p.control2.x.toFixed(3)},${p.control2.y.toFixed(3)} ${p.endPoint.x.toFixed(3)},${p.endPoint.y.toFixed(3)}`;u.setAttribute("d",h),u.setAttribute("stroke-width",(p.endWidth*2.25).toFixed(3)),u.setAttribute("stroke",c),u.setAttribute("fill","none"),u.setAttribute("stroke-linecap","round"),d.appendChild(u)}},(p,{penColor:c,dotSize:u,minWidth:h,maxWidth:f})=>{const b=document.createElement("circle"),$=u>0?u:(h+f)/2;b.setAttribute("r",$.toString()),b.setAttribute("cx",p.x.toString()),b.setAttribute("cy",p.y.toString()),b.setAttribute("fill",c),d.appendChild(b)}),d.outerHTML}}class yt{constructor(e){this.signaturePads=new Map,this.canvasElements=new Map,this.onSignatureChange=e}initializeSignaturePad(e,t){const n=t==null?void 0:t.getElementById(`signature-${e}`);if(!n)return null;this.clearSignaturePad(e),this.resizeCanvas(n);const s=new Z(n,{backgroundColor:"rgb(255, 255, 255)",penColor:"rgb(0, 0, 0)",minWidth:.5,maxWidth:2.5});return this.signaturePads.set(e,s),this.canvasElements.set(e,n),s.addEventListener("endStroke",()=>{this.handleSignatureChange(e)}),s}handleSignatureChange(e){var r;const t=this.signaturePads.get(e);if(!t)return;const n=!t.isEmpty(),s=n?t.toData():null;(r=this.onSignatureChange)==null||r.call(this,{questionId:e,hasSignature:n,signatureData:s})}clearSignature(e){const t=this.signaturePads.get(e);t&&(t.clear(),this.handleSignatureChange(e))}saveSignature(e){const t=this.signaturePads.get(e);if(!t||t.isEmpty())return null;const n=t.toSVG(),s=t.toDataURL();return{questionId:e,svgData:n,dataURL:s}}restoreSignature(e,t){const n=this.signaturePads.get(e);if(!n||!t)return!1;try{return n.clear(),n.fromData(t),!0}catch(s){return console.warn(`Failed to restore signature for ${e}:`,s),!1}}handleResize(){this.signaturePads.forEach((e,t)=>{const n=this.canvasElements.get(t);if(n){this.resizeCanvas(n);const s=e.toData();e.clear(),e.fromData(s)}})}resizeCanvas(e){const t=Math.max(window.devicePixelRatio||1,1),n=window.getComputedStyle(e),s=parseFloat(n.width),r=parseFloat(n.height);e.width=s*t,e.height=r*t;const o=e.getContext("2d");o&&o.scale(t,t)}clearSignaturePad(e){var t;this.signaturePads.has(e)&&((t=this.signaturePads.get(e))==null||t.off(),this.signaturePads.delete(e),this.canvasElements.delete(e))}getSignaturePad(e){return this.signaturePads.get(e)}hasSignaturePads(){return this.signaturePads.size>0}getAllSignaturePads(){return new Map(this.signaturePads)}destroy(){this.signaturePads.forEach(e=>{e.off()}),this.signaturePads.clear(),this.canvasElements.clear()}}class St{trackQuestionResponse(e,t,n){if(!e)return;e.responses||(e.responses=[]);const s=e.responses.findIndex(o=>o.elementId===t),r={elementId:t,value:n,answeredAt:new Date};s>=0?e.responses[s]=r:e.responses.push(r)}updateInstanceWithFormData(e,t){e!=null&&e.steps&&e.steps.forEach(n=>{n.responses||(n.responses=[]),n.elements.forEach(s=>{if(this.isQuestionElement(s.type)){const r=t[s.id];if(r!==void 0&&n.responses){let o=n.responses.find(a=>a.elementId===s.id);o?(o.value=r,o.answeredAt=new Date):(o={elementId:s.id,value:r,answeredAt:new Date},n.responses.push(o))}}})})}extractFormDataFromSteps(e){const t={};return e.forEach(n=>{n.responses&&n.responses.forEach(s=>{t[s.elementId]=s.value})}),t}hasChangedFromPrevious(e,t,n){if(!(n!=null&&n.steps))return!0;for(const s of n.steps)if(s.responses){const r=s.responses.find(o=>o.elementId===e);if(r)return r.value!==t}return!0}isQuestionElement(e){return["text_input","textarea","select","number","radio","checkbox","date","file_upload","signature"].includes(e)}}class wt{constructor(e,t){this.mode=e,this.currentUser=t}updateMode(e){this.mode=e}updateCurrentUser(e){this.currentUser=e}isStepAssignedToUser(e){if(!this.currentUser)return!1;const t=e.assignment;return!!(this.currentUser.targetId&&t.targetId&&this.currentUser.targetId===t.targetId||this.currentUser.email&&t.email&&this.currentUser.email===t.email)}getAssignedSteps(e){return e!=null&&e.steps?e.steps.filter(t=>this.isStepAssignedToUser(t)):[]}findNextAssignedStep(e,t){if(!(t!=null&&t.steps))return-1;if(this.mode==="preview"||this.mode==="admin"||this.mode==="view-only"||this.mode==="print")return e+1<t.steps.length?e+1:-1;for(let n=e+1;n<t.steps.length;n++){const s=t.steps[n];if(this.isStepAssignedToUser(s))return n}return-1}isLastAssignedStep(e,t){if(this.mode==="preview"||this.mode==="admin"||this.mode==="view-only"||this.mode==="print"){const n=t==null?void 0:t.steps;return e===((n==null?void 0:n.length)||0)-1}return this.findNextAssignedStep(e,t)===-1}canNavigateToStep(e,t,n,s,r,o){if((r||o)&&this.mode!=="admin"&&this.mode!=="view-only"&&this.mode!=="print")return{canNavigate:!1,newStepIndex:t,reason:"Navigation blocked: workflow submitted"};if(this.mode==="preview"||this.mode==="admin"||this.mode==="view-only"||this.mode==="print"){const p=n.steps;return!p||e<0||e>=p.length?{canNavigate:!1,newStepIndex:t,reason:"Invalid step index"}:{canNavigate:!0,newStepIndex:e}}const a=n.steps;if(!a||e<0||e>=a.length)return{canNavigate:!1,newStepIndex:t,reason:"Invalid step index"};const d=a[e];if(this.isStepAssignedToUser(d)){const p=s.has(d.id),c=this.isStepWithinAllowedRange(e,n,s);return p||c?{canNavigate:!0,newStepIndex:e}:{canNavigate:!1,newStepIndex:t,reason:"Step not accessible yet"}}else return{canNavigate:!0,newStepIndex:e}}isStepWithinAllowedRange(e,t,n){if(!(t!=null&&t.steps))return!1;const r=this.getAssignedSteps(t).map(d=>t.steps.findIndex(p=>p.id===d.id)).sort((d,p)=>d-p);let o=-1;for(const d of r){const p=t.steps[d];n.has(p.id)&&(o=d)}let a=-1;for(const d of r)if(d>o){a=d;break}return a!==-1?e<=a&&this.isStepAssignedToUser(t.steps[e]):this.isStepAssignedToUser(t.steps[e])}}const ee=class ee{constructor(){this.formData={},this.validationErrors={}}updateFormData(e){this.formData={...e}}mergeFormData(e){this.formData={...this.formData,...e}}setFormField(e,t){this.formData={...this.formData,[e]:t}}removeFormField(e){const t={...this.formData};delete t[e],this.formData=t}getFormData(){return{...this.formData}}getFormField(e){return this.formData[e]}hasFormField(e){return e in this.formData}setValidationErrors(e){this.validationErrors={...e}}getValidationErrors(){return{...this.validationErrors}}clearValidationError(e){if(this.validationErrors[e]){const t={...this.validationErrors};delete t[e],this.validationErrors=t}}hasValidationError(e){return!!this.validationErrors[e]}setValidationError(e,t){this.validationErrors={...this.validationErrors,[e]:t}}clearAllValidationErrors(){this.validationErrors={}}initializeFromResponses(e){const t={};e.forEach(n=>{n.responses&&n.responses.forEach(s=>{t[s.elementId]=s.value})}),this.formData=t}reset(){this.formData={},this.validationErrors={}}isQuestionElement(e){return ee.QUESTION_ELEMENT_TYPES.includes(e.type)}getStepFormData(e){var n;const t={};return(n=e.elements)==null||n.forEach(s=>{if(this.isQuestionElement(s)){const r=s,o=this.formData[r.id];o!==void 0&&(t[r.id]=o)}}),t}hasFormData(){return Object.keys(this.formData).length>0}getFormFieldIds(){return Object.keys(this.formData)}getValidationErrorCount(){return Object.keys(this.validationErrors).length}};ee.QUESTION_ELEMENT_TYPES=["text_input","textarea","select","number","radio","checkbox","date","file_upload","signature"];let fe=ee;const te=class te{constructor(e,t){this.formStateManager=e,this.responseTracker=t}handleFileUpload(e,t,n){var p,c,u,h,f;const s=t.target,r=(p=s.files)==null?void 0:p[0];if(!r){this.clearFile(e),(c=n.onRequestUpdate)==null||c.call(n);return}const o=this.validateFileSize(r);if(o){this.handleFileValidationError(e,o,s),(u=n.onRequestUpdate)==null||u.call(n);return}this.formStateManager.clearValidationError(e);const a=this.createFileInfo(r);this.formStateManager.setFormField(e,a);const d=this.hasFileChanged(e,a,n.savedInstance);d&&n.mode!=="preview"?this.executeFileUploadCallback(e,r,a,n):this.logSkippedCallback(e,n.mode,d),(h=n.onRequestUpdate)==null||h.call(n),n.mode!=="admin"&&((f=n.onFormDataSave)==null||f.call(n))}clearFile(e){this.formStateManager.setFormField(e,null),this.formStateManager.clearValidationError(e)}validateFileSize(e){return e.size>te.MAX_FILE_SIZE?`File size must be less than 5MB. Current size: ${(e.size/1024/1024).toFixed(2)}MB`:null}handleFileValidationError(e,t,n){this.formStateManager.setValidationError(e,t),this.formStateManager.setFormField(e,null),n.value=""}createFileInfo(e){return{name:e.name,size:e.size,type:e.type,lastModified:e.lastModified}}hasFileChanged(e,t,n){if(!(n!=null&&n.steps))return!0;for(const s of n.steps)if(s.responses){const r=s.responses.find(o=>o.elementId===e);if(r&&r.value&&typeof r.value=="object"){const o=r.value;return o.name!==t.name||o.size!==t.size||o.type!==t.type||o.lastModified!==t.lastModified}}return!0}executeFileUploadCallback(e,t,n,s){var r,o;console.log("File changed, calling callback for:",e),console.log("Callback function exists:",!!s.onFileUploaded),s.onFileUploaded&&s.onFileUploaded({instanceId:(r=s.instance)==null?void 0:r.id,stepId:(o=s.currentStep)==null?void 0:o.id,questionId:e,file:t,fileName:n.name,fileSize:n.size,fileType:n.type})}logSkippedCallback(e,t,n){t==="preview"?console.log("Preview mode: skipping file upload callback for:",e):n||console.log("File unchanged, skipping callback for:",e)}};te.MAX_FILE_SIZE=5*1024*1024;let me=te;class S{static _isInputDisabled(e){return(e.isSubmitted||e.userStepsSubmitted)&&e.mode!=="admin"||e.mode==="view-only"||e.mode==="print"||e.mode==="default"&&!e.handlers.isCurrentStepAssigned()}static _formatFileSize(e){if(e===0)return"0 Bytes";const t=1024,n=["Bytes","KB","MB","GB"],s=Math.floor(Math.log(e)/Math.log(t));return parseFloat((e/Math.pow(t,s)).toFixed(2))+" "+n[s]}static _extractFilenameFromUrl(e){try{return new URL(e).pathname.split("/").pop()||""||"Uploaded File"}catch{const t=e.split("/"),n=t[t.length-1];return n&&n.includes(".")?n:"Uploaded File"}}static _guessFileTypeFromUrl(e){var r;const n=(r=S._extractFilenameFromUrl(e).split(".").pop())==null?void 0:r.toLowerCase();return n?{pdf:"PDF Document",doc:"Word Document",docx:"Word Document",xls:"Excel Spreadsheet",xlsx:"Excel Spreadsheet",png:"PNG Image",jpg:"JPEG Image",jpeg:"JPEG Image",gif:"GIF Image",svg:"SVG Image",txt:"Text File",csv:"CSV File",zip:"ZIP Archive",mp4:"MP4 Video",mp3:"MP3 Audio"}[n]||`${n.toUpperCase()} File`:"Unknown"}static renderTextArea(e,t,n){return n.mode==="print"?l`<div class="print-response-value textarea-response">
+        ${t||l`<span class="print-no-response">No response</span>`}
+      </div>`:l`<textarea
+      id=${e.id}
+      .value=${t}
+      ?required=${e.required}
+      ?disabled=${this._isInputDisabled(n)}
+      placeholder="Your Response"
+      @input=${s=>n.handlers.handleInputChange(e.id,s)}
+    ></textarea>`}static renderSelect(e,t,n){var s;return n.mode==="print"?l`<div class="print-response-value select-response">
+        ${t||l`<span class="print-no-response">No selection made</span>`}
+      </div>`:l`<select
+      id=${e.id}
+      .value=${t}
+      ?required=${e.required}
+      ?disabled=${this._isInputDisabled(n)}
+      class=${t===""?"placeholder":""}
+      @change=${r=>n.handlers.handleInputChange(e.id,r)}
+    >
+      <option value="">Choose</option>
+      ${(s=e.options)==null?void 0:s.map(r=>l`<option value=${r}>${r}</option>`)}
+    </select>`}static renderRadio(e,t,n){var o;const s=this._isInputDisabled(n),r=n.mode==="print";return r?l`<div class="print-response-value radio-response">
+        ${t||l`<span class="print-no-response">No selection made</span>`}
+      </div>`:l`<div class="radio-group ${r?"print-mode":""}">
+      ${(o=e.options)==null?void 0:o.map(a=>l`
+          <label class="radio-option">
+            <input
+              type="radio"
+              name=${e.id}
+              value=${a}
+              .checked=${t===a}
+              ?disabled=${s}
+              @change=${r?null:d=>n.handlers.handleInputChange(e.id,d)}
+            />
+            <span class="radio-label">${a}</span>
+          </label>
+        `)}
+    </div>`}static renderCheckbox(e,t,n){var o;const s=this._isInputDisabled(n),r=n.mode==="print";if(e.options&&e.options.length>0){if(r){const a=Array.isArray(t)?t:[];return l`<div class="print-response-value checkbox-response">
+          ${a.length>0?a.map(d=>l`<div>• ${d}</div>`):l`<span class="print-no-response">No selections made</span>`}
+        </div>`}return l`<div
+        class="checkbox-group ${r?"print-mode":""}"
+      >
+        ${(o=e.options)==null?void 0:o.map(a=>l`
+            <label class="checkbox-option">
+              <input
+                type="checkbox"
+                name=${e.id}
+                value=${a}
+                .checked=${Array.isArray(t)?t.includes(a):!1}
+                ?disabled=${s}
+                @change=${r?null:d=>n.handlers.handleCheckboxGroupChange(e.id,a,d)}
+              />
+              <span class="checkbox-label">${a}</span>
+            </label>
+          `)}
+      </div>`}else return r?l`<div class="print-response-value checkbox-response">
+          ${t?"Yes":"No"}
+        </div>`:l`<label
+        class="checkbox-single ${r?"print-mode":""}"
+      >
+        <input
+          type="checkbox"
+          id=${e.id}
+          .checked=${!!t}
+          ?disabled=${s}
+          @change=${r?null:a=>n.handlers.handleCheckboxChange(e.id,a)}
+        />
+        <span class="checkbox-label">${e.label}</span>
+      </label>`}static renderSignature(e,t,n){const s=n.formData[e.id],r=!!n.formData[e.id],o=n.savedSignatures.has(e.id),a=n.replacingSignatures.has(e.id);if(n.mode==="print")return s&&typeof s=="string"?l`
+          <div class="print-response-value signature-response">
+            <img
+              src="${s}"
+              alt="Digital Signature"
+              class="signature-image"
+              @error=${d=>{var u;const p=d.target;p.style.display="none";const c=(u=p.parentElement)==null?void 0:u.querySelector(".signature-fallback");c&&c.classList.remove("hidden")}}
+            />
+            <div class="signature-fallback hidden">
+              <span class="signature-error">Unable to display signature</span>
+            </div>
+          </div>
+        `:l`<div class="print-response-value signature-response">
+          <span class="print-no-response">No signature provided</span>
+        </div>`;if(n.mode==="view-only")return s&&typeof s=="string"?l`
+          <div class="signature-view-only">
+            <img
+              src="${s}"
+              alt="Digital Signature"
+              class="signature-image"
+              @error=${d=>{var u;const p=d.target;p.style.display="none";const c=(u=p.parentElement)==null?void 0:u.querySelector(".signature-fallback");c&&c.classList.remove("hidden")}}
+            />
+            <div class="signature-fallback hidden">
+              <span class="signature-error">Unable to display signature</span>
+            </div>
+          </div>
+        `:l`
+          <div class="signature-view-only">
+            <span class="no-signature">No signature captured</span>
+          </div>
+        `;if(n.mode==="admin"&&s&&typeof s=="string"&&!a){const d=s.trim().startsWith("<svg");return l`
+        <div class="signature-admin-display">
+          <div class="signature-existing">
+            ${d?l`
+                  <div
+                    class="signature-svg-container"
+                    .innerHTML=${s}
+                  ></div>
+                `:l`
+                  <img
+                    src="${s}"
+                    alt="Digital Signature"
+                    class="signature-image"
+                    @error=${p=>{var h;const c=p.target;c.style.display="none";const u=(h=c.parentElement)==null?void 0:h.querySelector(".signature-fallback");u&&u.classList.remove("hidden")}}
+                  />
+                  <div class="signature-fallback hidden">
+                    <span class="signature-error"
+                      >Unable to display signature</span
+                    >
+                  </div>
+                `}
+          </div>
+          <div class="signature-admin-actions">
+            <button
+              type="button"
+              class="signature-replace-btn"
+              @click=${()=>n.handlers.startReplaceSignature(e.id)}
+            >
+              ✏️ Replace Signature
+            </button>
+          </div>
+        </div>
+      `}return l`
+      <div
+        class="signature-container ${this._isInputDisabled(n)?"disabled":""}"
+      >
+        <canvas id="signature-${e.id}" class="signature-canvas"></canvas>
+        <div class="signature-controls">
+          <button
+            type="button"
+            class="signature-clear-btn"
+            ?disabled=${this._isInputDisabled(n)}
+            @click=${()=>n.handlers.clearSignature(e.id)}
+          >
+            Clear
+          </button>
+          ${r&&!o?l`
+                <button
+                  type="button"
+                  class="signature-save-btn"
+                  ?disabled=${this._isInputDisabled(n)}
+                  @click=${()=>n.handlers.saveSignature(e.id)}
+                >
+                  Save
+                </button>
+              `:""}
+          ${o?l` <span class="signature-saved">✓ Saved</span> `:""}
+          ${n.mode==="admin"&&a?l`
+                <button
+                  type="button"
+                  class="signature-cancel-btn"
+                  @click=${()=>n.handlers.cancelReplaceSignature(e.id)}
+                >
+                  Cancel
+                </button>
+              `:""}
+        </div>
+      </div>
+    `}static renderFileUpload(e,t,n){const s=n.formData[e.id];if(n.mode==="view-only"||n.mode==="print")if(s){const r=typeof s=="string",o=typeof s=="object"&&s.name;if(n.mode==="print"){if(o)return l`
+              <div class="print-response-value file-response">
+                📎 ${s.name}
+                ${s.size?l` <span class="file-size"
+                      >(${S._formatFileSize(s.size)})</span
+                    >`:""}
+              </div>
+            `;if(r){const a=S._extractFilenameFromUrl(s);return l`
+              <div class="print-response-value file-response">
+                📎 ${a}
+              </div>
+            `}else return l`
+              <div class="print-response-value file-response">
+                📎 ${s}
+              </div>
+            `}else{const a=r?s:"#",d=o?s.name:r?S._extractFilenameFromUrl(s):"View File";return l`
+            <div class="file-upload-view-only">
+              <a href="${a}" target="_blank" class="file-link">
+                📎 ${d}
+              </a>
+              ${o&&s.size?l`
+                    <span class="file-size-info"
+                      >(${S._formatFileSize(s.size)})</span
+                    >
+                  `:""}
+            </div>
+          `}}else return n.mode==="print"?l`
+            <div class="print-response-value file-response">
+              <span class="print-no-response">No file uploaded</span>
+            </div>
+          `:l`
+            <div class="file-upload-view-only">
+              <span class="no-file">No file uploaded</span>
+            </div>
+          `;return l`
+      <div class="file-upload-container">
+        <input
+          type="file"
+          id=${e.id}
+          ?required=${e.required}
+          ?disabled=${this._isInputDisabled(n)}
+          @change=${r=>n.handlers.handleFileUpload(e.id,r)}
+        />
+        ${s?l`
+              <div class="file-preview">
+                <span class="file-name"
+                  >${s.name||"File selected"}</span
+                >
+                <button
+                  type="button"
+                  class="file-clear-btn"
+                  ?disabled=${this._isInputDisabled(n)}
+                  @click=${()=>{n.formData[e.id]=null,n.handlers.trackQuestionResponse(e.id,null)}}
+                >
+                  ✕
+                </button>
+              </div>
+            `:""}
+      </div>
+    `}static renderDefaultInput(e,t,n){if(n.mode==="print"){const r=e.type==="date"&&t?new Date(t).toLocaleDateString():t;return l`<div class="print-response-value input-response">
+        ${r||l`<span class="print-no-response">No response</span>`}
+      </div>`}const s=e.type==="number"?"number":e.type==="date"?"date":"text";return l`<input
+      type=${s}
+      id=${e.id}
+      .value=${t}
+      ?required=${e.required}
+      ?disabled=${this._isInputDisabled(n)}
+      placeholder="Your Response"
+      @input=${r=>n.handlers.handleInputChange(e.id,r)}
+    />`}static render(e,t){const n=t.formData[e.id]??"",s=t.validationErrors[e.id],r=()=>{switch(e.type){case"textarea":return S.renderTextArea(e,n,t);case"select":return S.renderSelect(e,n,t);case"radio":return S.renderRadio(e,n,t);case"checkbox":return S.renderCheckbox(e,n,t);case"signature":return S.renderSignature(e,n,t);case"file_upload":return S.renderFileUpload(e,n,t);default:return S.renderDefaultInput(e,n,t)}},o=e.type==="checkbox"&&(!e.options||e.options.length===0);return t.mode==="print"?l`
+        <div class="question-print">
+          ${o?"":l` <div class="print-question-title">${e.label}:</div> `}
+          ${r()}
+          <hr class="print-question-separator" />
+        </div>
+      `:l`
+      <div class="question ${s?"error":""}">
+        ${o?"":l`
+              <div class="runner-question-title">
+                ${e.label}${e.required?l`<span class="runner-question-required">*</span>`:""}
+              </div>
+              <hr class="runner-question-divider" />
+            `}
+        ${r()}
+        ${s?l`<div class="error-message">${s}</div>`:""}
+      </div>
+    `}}/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */const kt={CHILD:2},$t=i=>(...e)=>({_$litDirective$:i,values:e});class Dt{constructor(e){}get _$AU(){return this._$AM._$AU}_$AT(e,t,n){this._$Ct=e,this._$AM=t,this._$Ci=n}_$AS(e,t){return this.update(e,t)}update(e,t){return this.render(...t)}}/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */class be extends Dt{constructor(e){if(super(e),this.it=v,e.type!==kt.CHILD)throw Error(this.constructor.directiveName+"() can only be used in child bindings")}render(e){if(e===v||e==null)return this._t=void 0,this.it=e;if(e===I)return e;if(typeof e!="string")throw Error(this.constructor.directiveName+"() called with a non-string value");if(e===this.it)return this._t;this.it=e;const t=[e];return t.raw=t,this._t={_$litType$:this.constructor.resultType,strings:t,values:[]}}}be.directiveName="unsafeHTML",be.resultType=1;const Ne=$t(be);class k{static renderMarkdown(e){return e.replace(/^### (.*$)/gim,"<h3>$1</h3>").replace(/^## (.*$)/gim,"<h2>$1</h2>").replace(/^# (.*$)/gim,"<h1>$1</h1>").replace(/\*\*(.*?)\*\*/gim,"<strong>$1</strong>").replace(/\*(.*?)\*/gim,"<em>$1</em>").replace(/`(.*?)`/gim,"<code>$1</code>").replace(/^> (.*$)/gim,"<blockquote>$1</blockquote>").replace(/\n/gim,"<br>")}static renderText(e){return l`
+      <div class="content-element text-content">
+        <p>${e.content}</p>
+      </div>
+    `}static renderMarkdownElement(e){return l`
+      <div class="content-element markdown-content">
+        <div class="markdown-text">
+          ${Ne(k.renderMarkdown(e.content))}
+        </div>
+      </div>
+    `}static renderDivider(e){return l`
+      <div class="content-element divider-content">
+        <hr class="content-divider" />
+        ${e.caption?l`<div class="divider-caption">${e.caption}</div>`:""}
+      </div>
+    `}static renderHtml(e){return l`
+      <div class="content-element html-content">
+        <div class="html-content-wrapper">${Ne(e.content)}</div>
+      </div>
+    `}static renderImage(e){return l`
+      <div class="content-element image-content">
+        <div class="image-placeholder">
+          <p>📷 Image: ${e.caption||e.alt||"Image content"}</p>
+          <small>URL: ${e.url||"No URL provided"}</small>
+        </div>
+      </div>
+    `}static renderVideo(e){return l`
+      <div class="content-element video-content">
+        <div class="video-placeholder">
+          <p>🎥 Video: ${e.caption||"Video content"}</p>
+          <small>URL: ${e.url||"No URL provided"}</small>
+        </div>
+      </div>
+    `}static renderFile(e){return l`
+      <div class="content-element file-content">
+        <div class="file-placeholder">
+          <p>📄 File: ${e.caption||"File content"}</p>
+          <small>URL: ${e.url||"No URL provided"}</small>
+        </div>
+      </div>
+    `}static renderUnknown(e){return l`
+      <div class="content-element unknown-content">
+        <p>⚠️ Unknown content type: ${e.type}</p>
+      </div>
+    `}static render(e,t){const n=()=>{switch(e.type){case"text":return k.renderText(e);case"markdown":return k.renderMarkdownElement(e);case"divider":return k.renderDivider(e);case"html":return k.renderHtml(e);case"image":return k.renderImage(e);case"video":return k.renderVideo(e);case"file":return k.renderFile(e);default:return k.renderUnknown(e)}};return(t==null?void 0:t.mode)==="print"?l`
+        <div class="content-print">
+          ${n()}
+          ${e.type!=="divider"?l`<hr class="print-question-separator" />`:""}
+        </div>
+      `:n()}}class Oe{static renderMobileStepsForStatus(e){const{steps:t,disabled:n=!1}=e;return l`
+      <div class="runner-mobile-steps">
+        <nav aria-label="Workflow steps">
+          <div class="runner-mobile-steps-container">
+            ${t==null?void 0:t.map((s,r)=>{const o=e.isStepAssignedToUser(s),a=e.completedSteps.has(s.id);return l`
+                <div
+                  class="runner-mobile-step-tab ${a?"completed":""} ${o?"":"unassigned"} ${n?"disabled":""}"
+                  style="cursor: not-allowed; opacity: ${n?"0.6":o?"1":"0.6"};"
+                >
+                  <span class="runner-mobile-step-title">${s.title}</span>
+                  <span class="runner-mobile-step-badge">
+                    ${a?"Completed":o?"Your Step":"Other User"}
+                  </span>
+                </div>
+              `})}
+          </div>
+        </nav>
+      </div>
+    `}static renderNotAssignedView(){return l`
+      <div class="runner-content not-assigned-view">
+        <div class="not-assigned-container">
+          <div class="not-assigned-icon">
+            <svg
+              width="48"
+              height="48"
+              viewBox="0 0 24 24"
+              fill="none"
+              stroke="currentColor"
+              stroke-width="2"
+            >
+              <rect width="18" height="11" x="3" y="11" rx="2" ry="2"></rect>
+              <path d="m7 11V7a5 5 0 0 1 10 0v4"></path>
+            </svg>
+          </div>
+          <h2 class="not-assigned-title">
+            This workflow is not assigned to you
+          </h2>
+          <p class="not-assigned-description">
+            You don't have any steps assigned in this workflow. Please contact
+            your administrator if you believe this is an error.
+          </p>
+        </div>
+      </div>
+    `}static renderUnifiedSubmissionView(e){var t,n,s;return l`
+      <div class="runner-layout">
+        <!-- Mobile Steps Navigation (visible only on mobile) -->
+        ${this.renderMobileStepsForStatus({steps:(t=e.instance)==null?void 0:t.steps,isStepAssignedToUser:e.isStepAssignedToUser,completedSteps:e.completedSteps,disabled:!0})}
+
+        <!-- Sidebar: Steps List (read-only, hidden on mobile) -->
+        <aside class="runner-sidebar">
+          <div class="runner-sidebar-header">Steps</div>
+          <nav aria-label="Workflow steps">
+            <ul class="runner-steps-list">
+              ${(s=(n=e.instance)==null?void 0:n.steps)==null?void 0:s.map((r,o)=>{const a=e.isStepAssignedToUser(r),d=e.completedSteps.has(r.id);return l`
+                  <li
+                    class="runner-step-item ${d?"completed":""} ${a?"":"unassigned"}"
+                    style="opacity: ${a?"1":"0.6"}; cursor: not-allowed;"
+                  >
+                    <span class="runner-step-title">${r.title}</span>
+                    <span class="runner-step-badge">
+                      ${d?"Submitted":a?"Your Step":"Other User"}
+                    </span>
+                  </li>
+                `})}
+            </ul>
+          </nav>
+        </aside>
+
+        <!-- Main Content: Unified Submission View -->
+        <main class="runner-main-content">
+          <div class="submission-container">
+            <div class="submission-success-icon">
+              <svg
+                width="64"
+                height="64"
+                viewBox="0 0 24 24"
+                fill="none"
+                stroke="currentColor"
+                stroke-width="2"
+                stroke-linecap="round"
+                stroke-linejoin="round"
+                class="check-circle"
+              >
+                <path d="M9 12l2 2 4-4" />
+                <circle cx="12" cy="12" r="10" />
+              </svg>
+            </div>
+            <h2 class="submission-title">Your response has been submitted.</h2>
+            <p class="submission-message">You may now close this window.</p>
+          </div>
+        </main>
+      </div>
+    `}}class G{static isStepCompleted(e,t,n){return!!(t.completedSteps.has(e.id)||(t.isSubmitted||t.userStepsSubmitted)&&n)}static renderSidebar(e){const{steps:t}=e;return l`
+      <aside class="runner-sidebar">
+        <div class="runner-sidebar-header">Steps</div>
+        <nav aria-label="Workflow steps">
+          <ul class="runner-steps-list">
+            ${t==null?void 0:t.map((n,s)=>{const r=e.mode==="preview"||e.mode==="admin"||e.mode==="view-only"||e.mode==="print"||e.isStepAssignedToUser(n),o=s===e.currentStepIndex,a=this.isStepCompleted(n,e,r),d=(e.isSubmitted||e.userStepsSubmitted)&&e.mode!=="preview"&&e.mode!=="admin"&&e.mode!=="view-only"&&e.mode!=="print";e.mode;const p=e.isLoading;return l`
+                <li
+                  class="runner-step-item ${o?"active":""} ${a?"completed":""} ${r?"":"unassigned"} ${d?"disabled":""} ${p?"loading-disabled":""}"
+                  @click=${()=>!p&&e.goToStep(s)}
+                  style="${d?"opacity: 0.5; cursor: not-allowed;":""}"
+                >
+                  <span class="runner-step-title">${n.title}</span>
+                  <span class="runner-step-badge">
+                    ${e.mode==="preview"?"Preview":e.mode==="admin"?"Admin":e.mode==="view-only"?"View Only":e.mode==="print"?"Print":d?"Submitted":a?"Completed":r?"Assigned":"Not Assigned"}
+                  </span>
+                </li>
+              `})}
+          </ul>
+        </nav>
+      </aside>
+    `}static renderMobileSteps(e){const{steps:t}=e;return l`
+      <div class="runner-mobile-steps">
+        <nav aria-label="Workflow steps">
+          <div class="runner-mobile-steps-container">
+            ${t==null?void 0:t.map((n,s)=>{const r=e.mode==="preview"||e.mode==="admin"||e.mode==="view-only"||e.mode==="print"||e.isStepAssignedToUser(n),o=s===e.currentStepIndex,a=this.isStepCompleted(n,e,r),d=(e.isSubmitted||e.userStepsSubmitted)&&e.mode!=="preview"&&e.mode!=="admin"&&e.mode!=="view-only"&&e.mode!=="print";e.mode;const p=e.isLoading;return l`
+                <button
+                  class="runner-mobile-step-tab ${o?"active":""} ${a?"completed":""} ${r?"":"unassigned"} ${d?"disabled":""} ${p?"loading-disabled":""}"
+                  @click=${()=>!p&&e.goToStep(s)}
+                  ?disabled=${d||p}
+                  aria-current=${o?"step":"false"}
+                >
+                  <span class="runner-mobile-step-title">${n.title}</span>
+                  <span class="runner-mobile-step-badge">
+                    ${e.mode==="preview"?"Preview":e.mode==="admin"?"Admin":e.mode==="view-only"?"View Only":e.mode==="print"?"Print":d?"Submitted":a?"Completed":r?"Assigned":"Not Assigned"}
+                  </span>
+                </button>
+              `})}
+          </div>
+        </nav>
+      </div>
+    `}static renderStepHeader(e){const{step:t,mode:n}=e;return n==="print"?l`
+        <div class="step-print-header">
+          <div class="print-step-title">${t.title}</div>
+          ${t.description?l`<div class="print-step-description">
+                ${t.description}
+              </div>`:""}
+          <hr class="print-question-separator" />
+        </div>
+      `:l`
+      <section class="runner-step-header">
+        <h2 class="runner-step-title">${t.title}</h2>
+        <hr class="runner-step-divider" />
+        ${t.description?l`<p class="runner-step-desc">${t.description}</p>`:""}
+      </section>
+    `}}class Ct{static renderFormActions(e){return e.mode==="preview"||e.mode==="view-only"||e.mode==="print"||!e.isCurrentStepAssigned?l``:l`
+      <div class="runner-form-actions">
+        <button
+          class="next-button ${e.mode==="admin"&&e.justSaved?"saved-state":""}"
+          @click=${e.mode==="admin"?e.handlers.saveStep:e.isLastStepInWorkflow?e.handlers.submit:e.isLastStep?e.handlers.submitUserSteps:e.handlers.nextStep}
+          type="button"
+        >
+          ${e.mode==="admin"?e.justSaved?"✓ Saved!":"Save":e.isLastStep?"Submit":"Next"}
+        </button>
+      </div>
+    `}}class ve{static handleInputChange(e,t,n,s,r,o){const a=t.target;let d;a.type==="radio"?d=a.value:a.type==="checkbox"?d=a.checked:d=a.value;const p={...n,[e]:d};s(p),o!=="preview"&&r(e,d)}static handleCheckboxChange(e,t,n,s,r,o){const d=t.target.checked,p={...n,[e]:d};s(p),o!=="preview"&&r(e,d)}static handleCheckboxGroupChange(e,t,n,s,r,o,a){const d=n.target,p=s[e];let c=Array.isArray(p)?[...p]:[];d.checked?c.includes(t)||c.push(t):c=c.filter(h=>h!==t);const u={...s,[e]:c};r(u),a!=="preview"&&o(e,c)}}var Et=Object.defineProperty,At=Object.getOwnPropertyDescriptor,x=(i,e,t,n)=>{for(var s=n>1?void 0:n?At(e,t):e,r=i.length-1,o;r>=0;r--)(o=i[r])&&(s=(n?o(e,t,s):o(s))||s);return n&&s&&Et(e,t,s),s};let m=class extends R{constructor(){super(...arguments),this.mode="default",this.isLoading=!1,this._currentStepIndex=0,this._formData={},this._validationErrors={},this._internalCompletedSteps=new Set,this._formRestorationComplete=!1,this._savedSignatures=new Set,this._replacingSignatures=new Set,this._isSubmitted=!1,this._userStepsSubmitted=!1,this._justSaved=!1}willUpdate(i){(i.has("mode")||i.has("currentUser"))&&this._updateNavigationService(),(i.has("instance")||i.has("workflow")||i.has("mode"))&&(this._initializeState(),this._updateValidationService())}connectedCallback(){super.connectedCallback(),this._initializeServices(),this._initializeState(),window.addEventListener("resize",this._handleResize.bind(this)),this._restoreFormData()}disconnectedCallback(){var i;super.disconnectedCallback(),window.removeEventListener("resize",this._handleResize.bind(this)),(i=this.signatureManager)==null||i.destroy()}_initializeServices(){this.persistenceManager=new vt,this.responseTracker=new St,this.formStateManager=new fe,this.signatureManager=new yt(i=>this._handleSignatureChange(i)),this.fileUploadManager=new me(this.formStateManager,this.responseTracker),this._updateNavigationService(),this._updateValidationService()}_updateNavigationService(){this.navigationService=new wt(this.mode||"default",this.currentUser)}_updateValidationService(){var i;this.validationService=new bt(((i=this.signatureManager)==null?void 0:i.getAllSignaturePads())||new Map,this._savedSignatures)}_getRenderContext(){return{formData:this._formData,validationErrors:this._validationErrors,currentStepIndex:this._currentStepIndex,internalCompletedSteps:this._internalCompletedSteps,savedSignatures:this._savedSignatures,replacingSignatures:this._replacingSignatures,isSubmitted:this._isSubmitted,userStepsSubmitted:this._userStepsSubmitted,justSaved:this._justSaved,validationService:this.validationService,persistenceManager:this.persistenceManager,signatureManager:this.signatureManager,responseTracker:this.responseTracker,navigationService:this.navigationService,formStateManager:this.formStateManager,fileUploadManager:this.fileUploadManager,mode:this.mode||"default",instance:this.instance,workflow:this.workflow,currentUser:this.currentUser,isLoading:this.isLoading,handlers:{handleInputChange:this._handleInputChange.bind(this),handleCheckboxChange:this._handleCheckboxChange.bind(this),handleCheckboxGroupChange:this._handleCheckboxGroupChange.bind(this),startReplaceSignature:this._startReplaceSignature.bind(this),cancelReplaceSignature:this._cancelReplaceSignature.bind(this),clearSignature:this._clearSignature.bind(this),saveSignature:this._saveSignature.bind(this),handleFileUpload:this._handleFileUpload.bind(this),trackQuestionResponse:this._trackQuestionResponse.bind(this),isCurrentStepAssigned:this._isCurrentStepAssigned.bind(this)}}}_handleSignatureChange(i){this.formStateManager.setFormField(i.questionId,i.hasSignature),this.formStateManager.setFormField(`${i.questionId}_signatureData`,i.signatureData),this._formData=this.formStateManager.getFormData(),this._savedSignatures.has(i.questionId)&&(this._savedSignatures=new Set([...this._savedSignatures].filter(e=>e!==i.questionId))),this._clearValidationError(i.questionId),this.mode!=="admin"&&this._saveFormDataToHistory()}_clearValidationError(i){this.formStateManager.clearValidationError(i),this._validationErrors=this.formStateManager.getValidationErrors()}_updateFormData(i){this.formStateManager.updateFormData(i),this._formData=this.formStateManager.getFormData(),this.mode!=="admin"&&this._saveFormDataToHistory()}_handleFormDataUpdate(i){this._clearValidationError(i)}_initializeState(){var i,e,t;if((i=this.formStateManager)==null||i.reset(),this._validationErrors={},this._formData={},this._formRestorationComplete=!1,this._savedSignatures=new Set,this._replacingSignatures=new Set,this._savedInstance=void 0,this._justSaved=!1,this._isSubmitted=((e=this.instance)==null?void 0:e.status)==="completed"||!1,this.instance&&this.instance.status!=="completed"){const n=this._getAssignedSteps(),s=n.filter(r=>{var o;return(o=this.instance.completedSteps)==null?void 0:o.includes(r.id)});this._userStepsSubmitted=n.length>0&&s.length===n.length}else this._userStepsSubmitted=((t=this.instance)==null?void 0:t.status)==="completed"||!1;this.mode==="preview"&&this.workflow?this._initializePreviewMode():this.mode==="view-only"&&this.instance?this._initializeViewOnlyMode():this.mode==="print"&&this.instance?this._initializePrintMode():this.instance&&this._initializeDefaultMode()}_initializePreviewMode(){var i;if(console.log("Initializing preview mode..."),!((i=this.workflow)!=null&&i.steps)||this.workflow.steps.length===0){console.warn("Workflow has no steps in preview mode.");return}this.formStateManager.reset(),this._formData=this.formStateManager.getFormData(),this._currentStepIndex=0,this._internalCompletedSteps=new Set,console.log("Preview mode initialized with empty form data.")}_initializeDefaultMode(){var i;!((i=this.instance)!=null&&i.steps)||this.instance.steps.length===0||(this.instance.completedSteps?this._internalCompletedSteps=new Set(this.instance.completedSteps):this._internalCompletedSteps=new Set(this.instance.steps.filter(e=>e.status==="completed").map(e=>e.id)),this.formStateManager.initializeFromResponses(this.instance.steps),this._formData=this.formStateManager.getFormData(),this._currentStepIndex=this.instance.steps.findIndex(e=>{var t;return e.id===((t=this.instance)==null?void 0:t.currentStepId)}),this._currentStepIndex<0&&(this._currentStepIndex=0),this.instance.steps.forEach((e,t)=>{this._internalCompletedSteps.has(e.id)?e.status="completed":t===this._currentStepIndex?e.status="active":e.status="pending"}))}_initializeViewOnlyMode(){var i;!((i=this.instance)!=null&&i.steps)||this.instance.steps.length===0||(this.formStateManager.initializeFromResponses(this.instance.steps),this._formData=this.formStateManager.getFormData(),this._currentStepIndex=0,this.instance.steps.forEach(e=>{e.responses&&e.responses.length>0?(e.status="completed",this._internalCompletedSteps.add(e.id)):e.status="pending"}),console.log("View-only mode initialized with existing responses:",this._formData))}_initializePrintMode(){var i;!((i=this.instance)!=null&&i.steps)||this.instance.steps.length===0||(this.formStateManager.initializeFromResponses(this.instance.steps),this._formData=this.formStateManager.getFormData(),this._currentStepIndex=0,this.instance.steps.forEach(e=>{e.responses&&e.responses.length>0?(e.status="completed",this._internalCompletedSteps.add(e.id)):e.status="pending"}),console.log("Print mode initialized with existing responses:",this._formData))}_isStepAssignedToUser(i){return this.navigationService.isStepAssignedToUser(i)}_getAssignedSteps(){return this.instance?this.navigationService.getAssignedSteps(this.instance):[]}_isCurrentStepAssigned(){const i=this._currentStep;return!i||this.mode!=="default"?!0:this._isStepAssignedToUser(i)}_renderNotAssignedView(){return Oe.renderNotAssignedView()}get _currentStep(){var i,e,t;return this.mode==="preview"&&this.workflow?(i=this.workflow.steps)==null?void 0:i[this._currentStepIndex]:(t=(e=this.instance)==null?void 0:e.steps)==null?void 0:t[this._currentStepIndex]}_validateStep(){const i=this._currentStep;if(!i)return!1;const e=this.validationService.validateStep(i,this._formData,this.mode||"default");return this.formStateManager.setValidationErrors(e.errors),this._validationErrors=this.formStateManager.getValidationErrors(),e.isValid}_handleInputChange(i,e){ve.handleInputChange(i,e,this._formData,this._updateFormData.bind(this),this._trackQuestionResponse.bind(this),this.mode),this._handleFormDataUpdate(i)}_handleCheckboxChange(i,e){ve.handleCheckboxChange(i,e,this._formData,this._updateFormData.bind(this),this._trackQuestionResponse.bind(this),this.mode),this._handleFormDataUpdate(i)}_handleCheckboxGroupChange(i,e,t){ve.handleCheckboxGroupChange(i,e,t,this._formData,this._updateFormData.bind(this),this._trackQuestionResponse.bind(this),this.mode),this._handleFormDataUpdate(i)}_initializeSignaturePad(i){this.signatureManager.initializeSignaturePad(i,this.shadowRoot)&&this._updateValidationService()}_handleResize(){this.signatureManager.handleResize()}_clearSignature(i){this.signatureManager.clearSignature(i)}_startReplaceSignature(i){this._replacingSignatures=new Set([...this._replacingSignatures,i]),this.formStateManager.setFormField(i,!1),this.formStateManager.setFormField(`${i}_signatureData`,null),this._formData=this.formStateManager.getFormData(),this._savedSignatures=new Set([...this._savedSignatures].filter(e=>e!==i)),this.requestUpdate()}_cancelReplaceSignature(i){this._replacingSignatures=new Set([...this._replacingSignatures].filter(e=>e!==i))}_saveSignature(i){var n,s,r;const e=this.signatureManager.saveSignature(i);if(!e)return;const t=this._hasSignatureChanged(i,e.svgData);this._savedSignatures=new Set([...this._savedSignatures,i]),this._replacingSignatures.has(i)&&(this._replacingSignatures=new Set([...this._replacingSignatures].filter(o=>o!==i))),this._trackQuestionResponse(i,e.svgData),t&&this.mode!=="preview"?(console.log("Signature changed, calling callback for:",i),console.log("Callback function exists:",!!this.onSignatureCaptured),(r=this.onSignatureCaptured)==null||r.call(this,{instanceId:(n=this.instance)==null?void 0:n.id,stepId:(s=this._currentStep)==null?void 0:s.id,questionId:i,svgData:e.svgData,dataURL:e.dataURL})):this.mode==="preview"?console.log("Preview mode: skipping signature callback for:",i):console.log("Signature unchanged, skipping callback for:",i),this._clearValidationError(i),this.mode!=="admin"&&this._saveFormDataToHistory()}_hasSignatureChanged(i,e){return this.responseTracker.hasChangedFromPrevious(i,e,this._savedInstance)}_restoreInstanceResponses(){var i,e;!((i=this._savedInstance)!=null&&i.steps)||!((e=this.instance)!=null&&e.steps)||this._savedInstance.steps.forEach((t,n)=>{var s;(s=this.instance)!=null&&s.steps&&this.instance.steps[n]&&(this.instance.steps[n].responses=t.responses||[])})}_handleFileUpload(i,e){this.fileUploadManager.handleFileUpload(i,e,{instance:this.instance,currentStep:this._currentStep,mode:this.mode||"default",savedInstance:this._savedInstance,onFileUploaded:this.onFileUploaded,onFormDataSave:()=>this._saveFormDataToHistory(),onRequestUpdate:()=>{this._formData=this.formStateManager.getFormData(),this._validationErrors=this.formStateManager.getValidationErrors();const t=this._formData[i];t&&this._trackQuestionResponse(i,t),this.requestUpdate()}})}_captureSignaturesFromStep(i){console.log("Capturing signatures from step:",i.id)}_trackQuestionResponse(i,e){this.responseTracker.trackQuestionResponse(this._currentStep,i,e)}_renderQuestion(i){return S.render(i,this._getRenderContext())}_renderContentElement(i){return k.render(i,this._getRenderContext())}_isQuestionElement(i){return m.QUESTION_ELEMENT_TYPES.includes(i.type)}_isContentElement(i){return m.CONTENT_ELEMENT_TYPES.includes(i.type)}_renderStepElement(i){return this.mode==="print"?this._isQuestionElement(i)?this._renderQuestion(i):this._isContentElement(i)?this._renderContentElement(i):l`<div class="unknown-element">
+        <p>⚠️ Unknown element type: ${i.type}</p>
+      </div>`:this._isQuestionElement(i)?l`<div class="runner-card">
+        ${this._renderQuestion(i)}
+      </div>`:this._isContentElement(i)?l`<div class="runner-card">
+        ${this._renderContentElement(i)}
+      </div>`:l`<div class="runner-card">
+      <div class="unknown-element">
+        <p>⚠️ Unknown element type: ${i.type}</p>
+      </div>
+    </div>`}_renderStepWithElements(i){return l`
+      <div class="print-step">
+        <!-- Step Header -->
+        ${G.renderStepHeader({step:i,mode:"print"})}
+
+        <!-- Step Elements -->
+        ${i.elements.map(e=>this._renderStepElement(e))}
+      </div>
+    `}_renderAllStepsForPrint(){var i;return!((i=this.instance)!=null&&i.steps)||this.instance.steps.length===0?l`<div class="runner-content">
+        No workflow instance loaded or instance has no steps.
+      </div>`:l`
+      <div class="print-layout">
+        <!-- Instance Title at top -->
+        <div class="print-instance-title">
+          ${this.instance.name||"Untitled Form"}
+        </div>
+        <hr class="print-question-separator" />
+
+        ${this.instance.steps.map(e=>this._renderStepWithElements(e))}
+      </div>
+    `}_nextStep(){var t,n,s,r;if(!this._validateStep())return;const i=this._currentStep;i&&this._captureSignaturesFromStep(i);const e=this._findNextAssignedStep(this._currentStepIndex);if(e!==-1){const o=(t=this._currentStep)==null?void 0:t.id;if(this._currentStepIndex=e,o&&((n=this.instance)!=null&&n.steps)){const d=this.instance.steps.find(p=>p.id===o);d&&(d.status="completed")}const a=(r=(s=this.instance)==null?void 0:s.steps)==null?void 0:r[this._currentStepIndex];a&&(a.status="active"),this._updateInstanceData(o,"step_navigation",{direction:"next",fromStepIndex:this._currentStepIndex-1,toStepIndex:this._currentStepIndex,completedStepId:o}),this.mode!=="admin"&&this._saveFormDataToHistory(),this._scrollToTop()}}_findNextAssignedStep(i){return this.instance?this.navigationService.findNextAssignedStep(i,this.instance):-1}_isLastAssignedStep(){return this.navigationService.isLastAssignedStep(this._currentStepIndex,this.instance)}_isLastStepInWorkflow(){var e;const i=(e=this.instance)==null?void 0:e.steps;return i?this._currentStepIndex===i.length-1:!1}_goToStep(i){var n;console.log(`🎯 _goToStep called: stepIndex=${i}, mode=${this.mode}, currentStep=${this._currentStepIndex}`);const e=this.mode==="preview"?this.workflow:this.instance;if(console.log("📊 Data source:",e?`${((n=e.steps)==null?void 0:n.length)||0} steps`:"null"),!e){console.log("❌ No data source available");return}const t=this.navigationService.canNavigateToStep(i,this._currentStepIndex,e,this._internalCompletedSteps,this._isSubmitted,this._userStepsSubmitted);console.log("🚦 Navigation result:",t),t.canNavigate?(this._currentStepIndex=t.newStepIndex,console.log(`✅ Navigated to step ${t.newStepIndex}`),this._scrollToTop()):console.log("❌ Navigation blocked:",t.reason)}_submitUserSteps(){var t;if(!this._validateStep())return;const i=this._currentStep;if(i&&this._captureSignaturesFromStep(i),!this.instance){console.error("Cannot submit, instance data is missing.");return}const e=(t=this._currentStep)==null?void 0:t.id;e&&this._internalCompletedSteps.add(e),console.log("User completing their assigned steps:",this.instance.id),console.log("Form data:",this._formData),this._userStepsSubmitted=!0,this._clearSavedFormData("user steps submission"),this._updateInstanceData(e,"user_steps_submission"),this._scrollToTop()}_submit(){var t;if(!this._validateStep())return;const i=this._currentStep;if(i&&this._captureSignaturesFromStep(i),!this.instance){console.error("Cannot submit, instance data is missing.");return}const e=(t=this._currentStep)==null?void 0:t.id;e&&this._internalCompletedSteps.add(e),console.log("Submitting entire workflow:",this.instance.id),console.log("Final form data:",this._formData),this.instance&&(this.instance.status="completed",this.instance.updatedAt=new Date,this.instance.currentStepId=void 0,this.instance.completedSteps=Array.from(this._internalCompletedSteps)),this._isSubmitted=!0,this._clearSavedFormData("full workflow submission"),this._scrollToTop(),this._updateInstanceData(e,"submission")}_saveStep(){var t;if(!this._validateStep())return;const i=this._currentStep;if(i&&this._captureSignaturesFromStep(i),!this.instance){console.error("Cannot save, instance data is missing.");return}const e=(t=this._currentStep)==null?void 0:t.id;if(e&&(this._internalCompletedSteps.add(e),this.instance.steps)){const n=this.instance.steps.find(s=>s.id===e);n&&(n.status="completed")}this._updateInstanceData(e,"admin_save",{stepId:e,adminMode:!0}),this._justSaved=!0,this.requestUpdate(),setTimeout(()=>{this._justSaved=!1,this.requestUpdate()},2e3)}_clearSavedFormData(i){var e;this.persistenceManager.clearFormData((e=this.instance)==null?void 0:e.id,i)}_scrollToTop(){requestAnimationFrame(()=>{var t,n;this.scrollIntoView({behavior:"smooth",block:"start"});const i=(t=this.shadowRoot)==null?void 0:t.querySelector(".runner-layout");i&&i.scrollTo({top:0,behavior:"smooth"});const e=(n=this.shadowRoot)==null?void 0:n.querySelector(".runner-main-content");e&&e.scrollTo({top:0,behavior:"smooth"})})}_updateInstanceData(i,e,t){var d,p,c,u,h,f,b;i&&this._internalCompletedSteps.add(i);let n=(p=(d=this.instance)==null?void 0:d.steps)==null?void 0:p.find($=>$.id===i);if(!n&&this._internalCompletedSteps.size>0){const $=Array.from(this._internalCompletedSteps),ie=$[$.length-1];n=(u=(c=this.instance)==null?void 0:c.steps)==null?void 0:u.find(ne=>ne.id===ie)}const s=e==="submission",r=((h=this.instance)==null?void 0:h.steps)&&this._internalCompletedSteps.size>=this.instance.steps.length,o=s||r?null:this._currentStep?{id:this._currentStep.id,title:this._currentStep.title}:null,a={instanceId:(f=this.instance)==null?void 0:f.id,workflowId:(b=this.instance)==null?void 0:b.workflowId,completedStepId:i||(n?n.id:null),completedStepData:n?{id:n.id,title:n.title,responses:n.responses||[]}:null,completedSteps:Array.from(this._internalCompletedSteps),currentStep:o,mode:this.mode};this.dispatchEvent(new CustomEvent("instance-updated",{detail:a,bubbles:!0,composed:!0}))}_restoreFormData(){var e;if(!this.persistenceManager.shouldRestoreData(this.mode||"default")){console.log("Skipping form data restoration - showing official instance data");return}const i=this.persistenceManager.restoreFormData((e=this.instance)==null?void 0:e.id);i?(this.formStateManager.updateFormData(i.formData),this._formData=this.formStateManager.getFormData(),this._currentStepIndex=i.stepIndex,this._savedSignatures=i.savedSignatures,this._internalCompletedSteps=i.completedSteps,this._savedInstance=i.savedInstance||void 0):this._updateCompletedStepsFromCurrentIndex()}_updateCompletedStepsFromCurrentIndex(){var i;if((i=this.instance)!=null&&i.steps){this._internalCompletedSteps=new Set(this.instance.completedSteps||[]);for(let e=0;e<this._currentStepIndex;e++)this.instance.steps[e]&&this._internalCompletedSteps.add(this.instance.steps[e].id)}}_restoreFormDataFromDOM(){this._restoreFormData(),this._restoreFormValuesToDOM()}_restoreFormValuesToDOM(){this.updateComplete.then(()=>{var e,t;(e=this.shadowRoot)!=null&&e.querySelector(".runner-step-form")&&(Object.entries(this._formData).forEach(([n,s])=>{var o;if(n.endsWith("_signatureData"))return;const r=(o=this.shadowRoot)==null?void 0:o.getElementById(n);if(r){if(r.type==="checkbox"){const a=r;typeof s=="boolean"?a.checked=s:Array.isArray(s)&&(a.checked=s.includes(a.value))}else if(r.type==="radio"){const a=r;a.checked=a.value===s}else if(r.type==="file"){const a=r;a.value=""}else r.value=String(s||"");console.log(`Restored value for ${n}:`,s)}}),this._restoreSignatures(),console.log("Form values restored to DOM elements"),this._updateInstanceWithFormData(!0),(t=this._savedInstance)!=null&&t.steps&&this._restoreInstanceResponses())})}_updateInstanceWithFormData(i=!1){this.instance&&this.instance.steps&&this.instance.steps.forEach(e=>{e.responses||(e.responses=[]),e.elements.forEach(t=>{if(t.type==="text_input"||t.type==="textarea"||t.type==="select"||t.type==="number"||t.type==="radio"||t.type==="checkbox"||t.type==="date"||t.type==="file_upload"||t.type==="signature"){const n=t,s=this._formData[n.id];if(s!==void 0&&e.responses){let r=e.responses.find(o=>o.elementId===n.id);r?(r.value=s,r.answeredAt=new Date):(r={elementId:n.id,value:s,answeredAt:new Date},e.responses.push(r))}}})})}_restoreSignatures(){Object.entries(this._formData).forEach(([i,e])=>{if(i.endsWith("_signatureData")&&e){const t=i.replace("_signatureData",""),n=this.signatureManager.getSignaturePad(t);if(n&&e)try{n.clear(),n.fromData(e)}catch{}}})}_saveFormDataToHistory(){var i;this.persistenceManager.saveFormData((i=this.instance)==null?void 0:i.id,this._formData,this._currentStepIndex,this._savedSignatures,this._internalCompletedSteps,this.instance||null)}_extractFormDataFromDOM(){var n;const i={},e=(n=this.shadowRoot)==null?void 0:n.querySelector(".runner-step-form");if(!e)return i;const t=e.elements;for(let s=0;s<t.length;s++){const r=t[s];if(r.name||r.id){const o=r.id||r.name;if(r.type==="checkbox"){const a=r;a.name&&a.name===o?(i[o]||(i[o]=[]),a.checked&&i[o].push(a.value)):i[o]=a.checked}else if(r.type==="radio"){const a=r;a.checked&&(i[o]=a.value)}else i[o]=r.value}}return i}_updateInstanceFromFormData(i=!1){const e=this._extractFormDataFromDOM();Object.keys(e).length>0?(this.formStateManager.mergeFormData(e),this._formData=this.formStateManager.getFormData(),this.instance&&this.instance.steps&&this.instance.steps.forEach(n=>{n.responses||(n.responses=[]),n.elements.forEach(s=>{if(s.type==="text_input"||s.type==="textarea"||s.type==="select"||s.type==="number"||s.type==="radio"||s.type==="checkbox"||s.type==="date"||s.type==="file_upload"||s.type==="signature"){const r=s,o=this._formData[r.id];if(o!==void 0&&n.responses){let a=n.responses.find(d=>d.elementId===r.id);a?(a.value=o,a.answeredAt=new Date):(a={elementId:r.id,value:o,answeredAt:new Date},n.responses.push(a))}}})}),console.log("Instance updated from form data:",this.instance),i&&this._updateInstanceData(void 0,"form_data_update",{updatedFormDataKeys:Object.keys(this._formData),updatedCompletedSteps:Array.from(this._internalCompletedSteps)})):console.log("No new form data to update instance with")}updateInstanceFromFormData(i=!1){this._updateInstanceFromFormData(i)}getFormData(){return this.formStateManager.getFormData()}restoreFormData(){this._restoreFormDataFromDOM()}clearSavedFormData(i){this._clearSavedFormData(i)}_renderUnifiedSubmissionView(){const i={instance:this.instance,assignedSteps:this._getAssignedSteps(),completedSteps:this._internalCompletedSteps,isStepAssignedToUser:this._isStepAssignedToUser.bind(this)};return Oe.renderUnifiedSubmissionView(i)}_isInstanceCompleted(){var i;return((i=this.instance)==null?void 0:i.status)==="completed"}_areUserStepsCompleted(){var e;if(!((e=this.instance)!=null&&e.steps))return!1;const i=this._getAssignedSteps();return i.length===0?!1:i.every(t=>t.status==="completed")}_shouldShowCompletionView(){var i;return this.mode!=="default"?!1:!!(this._isInstanceCompleted()||((i=this.instance)==null?void 0:i.status)==="active"&&this._areUserStepsCompleted())}_renderModeBasedContent(){var e,t;if(this._shouldShowCompletionView())return this._renderUnifiedSubmissionView();if(this.mode==="print")return this._renderAllStepsForPrint();const i=this.mode==="preview"?(e=this.workflow)==null?void 0:e.steps:(t=this.instance)==null?void 0:t.steps;return!i||i.length===0?l`<div class="runner-content">
+        ${this.mode==="preview"?"No workflow loaded or workflow has no steps.":"No workflow instance loaded or instance has no steps."}
+      </div>`:this.mode==="default"&&this._getAssignedSteps().length===0?this._renderNotAssignedView():null}_validateCurrentStep(){return this._currentStep}_initializeStepAssets(i){this.updateComplete.then(()=>{i.elements.forEach(e=>{var t;e.type==="signature"&&((t=this.shadowRoot)!=null&&t.getElementById(`signature-${e.id}`))&&this._initializeSignaturePad(e.id)}),this._restoreSignatures(),setTimeout(()=>{this._formRestorationComplete||(this._restoreFormDataFromDOM(),this._formRestorationComplete=!0)},100)})}_renderCurrentStepLayout(i){var s,r;const e=this._isLastAssignedStep(),t=this._isLastStepInWorkflow(),n=this.mode==="preview"?(s=this.workflow)==null?void 0:s.steps:(r=this.instance)==null?void 0:r.steps;return l`
+      <!-- Mobile Steps Navigation (visible only on mobile) -->
+      ${G.renderMobileSteps({steps:n,currentStepIndex:this._currentStepIndex,mode:this.mode||"default",isSubmitted:this._isSubmitted,userStepsSubmitted:this._userStepsSubmitted,completedSteps:this._internalCompletedSteps,isLoading:this.isLoading,isStepAssignedToUser:this._isStepAssignedToUser.bind(this),goToStep:this._goToStep.bind(this)})}
+
+      <!-- Sidebar: Steps List (hidden on mobile) -->
+      ${G.renderSidebar({steps:n,currentStepIndex:this._currentStepIndex,mode:this.mode||"default",isSubmitted:this._isSubmitted,userStepsSubmitted:this._userStepsSubmitted,completedSteps:this._internalCompletedSteps,isLoading:this.isLoading,isStepAssignedToUser:this._isStepAssignedToUser.bind(this),goToStep:this._goToStep.bind(this)})}
+
+      <!-- Main Content: Step Details and Questions -->
+      <main class="runner-main-content">
+        ${this.mode==="print"?G.renderStepHeader({step:i,mode:this.mode}):l`<div class="runner-card">
+              ${G.renderStepHeader({step:i,mode:this.mode})}
+            </div>`}
+        <form
+          class="runner-step-form"
+          @submit=${o=>o.preventDefault()}
+        >
+          ${i.elements.map(o=>this._renderStepElement(o))}
+          ${Ct.renderFormActions({mode:this.mode||"default",isLastStep:e,isLastStepInWorkflow:t,justSaved:this._justSaved,isCurrentStepAssigned:this._isCurrentStepAssigned(),handlers:{saveStep:this._saveStep.bind(this),nextStep:this._nextStep.bind(this),submitUserSteps:this._submitUserSteps.bind(this),submit:this._submit.bind(this)}})}
+        </form>
+      </main>
+    `}_renderMainContent(){const i=this._renderModeBasedContent();if(i)return i;const e=this._validateCurrentStep();return e?(this._initializeStepAssets(e),this._renderCurrentStepLayout(e)):l`<div class="runner-content">Invalid current step.</div>`}render(){return l`
+      <div class="runner-layout">
+        ${this._renderMainContent()}
+
+        <!-- Loading overlay with white box (conditionally rendered) -->
+        ${this.isLoading?l`
+              <div class="runner-loading-overlay">
+                <div class="runner-loading-box">
+                  <div class="runner-loading-spinner"></div>
+                  <div class="runner-loading-text">Processing...</div>
+                </div>
+              </div>
+            `:""}
+      </div>
+    `}};m.styles=[Pe],m.QUESTION_ELEMENT_TYPES=["text_input","textarea","select","number","radio","checkbox","date","file_upload","signature"],m.CONTENT_ELEMENT_TYPES=["text","html","image","video","file","divider","markdown"],x([C({type:Object})],m.prototype,"instance",2),x([C({type:Object})],m.prototype,"workflow",2),x([C({type:String})],m.prototype,"mode",2),x([C({type:Boolean})],m.prototype,"isLoading",2),x([C({type:Object})],m.prototype,"currentUser",2),x([C({type:Function})],m.prototype,"onSignatureCaptured",2),x([C({type:Function})],m.prototype,"onFileUploaded",2),x([_()],m.prototype,"_currentStepIndex",2),x([_()],m.prototype,"_formData",2),x([_()],m.prototype,"_validationErrors",2),x([_()],m.prototype,"_internalCompletedSteps",2),x([_()],m.prototype,"_formRestorationComplete",2),x([_()],m.prototype,"_savedSignatures",2),x([_()],m.prototype,"_replacingSignatures",2),x([_()],m.prototype,"_savedInstance",2),x([_()],m.prototype,"_isSubmitted",2),x([_()],m.prototype,"_userStepsSubmitted",2),x([_()],m.prototype,"_justSaved",2),m=x([Ie("runner-widget")],m);function Mt(i,e={}){const{title:t=i.name||"Workflow Instance",includeStyles:n=!0,customCSS:s="",showTimestamps:r=!1}=e,o=new Date;if(!(i!=null&&i.steps)||i.steps.length===0)throw new Error("Instance must have at least one step to generate HTML");return{html:`<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>${g(t)}</title>
+  ${n?`<style>${Yt()}</style>`:""}
+  ${s?`<style>${s}</style>`:""}
+</head>
+<body>
+  <div class="print-layout">
+    <!-- Instance Title at top -->
+    <div class="print-instance-title">
+      ${g(i.name||"Untitled Form")}
+    </div>
+    <hr class="print-question-separator" />
+    
+    ${r?Bt(i,o):""}
+    ${i.steps.map(d=>Tt(d)).join(`
+`)}
+  </div>
+</body>
+</html>`,title:t,generatedAt:o}}function Tt(i){return`
+    <div class="print-step">
+      <!-- Step Header -->
+      ${Ft(i)}
+      
+      <!-- Step Elements -->
+      ${i.elements.map(e=>zt(e,i)).join(`
+`)}
+    </div>
+  `}function Ft(i){return`
+    <div class="step-print-header">
+      <div class="print-step-title">${g(i.title)}</div>
+      ${i.description?`<div class="print-step-description">${g(i.description)}</div>`:""}
+      <hr class="print-question-separator" />
+    </div>
+  `}function zt(i,e){return Vt(i)?It(i,e):Ut(i)}function It(i,e){const t=jt(i.id,e.responses),n=t==null?void 0:t.value,r=i.type==="checkbox"&&(!i.options||i.options.length===0)?"":`
+    <div class="print-question-title">
+      ${g(i.label)}:
+    </div>
+  `,o='<hr class="print-question-separator" />';switch(i.type){case"text_input":case"number":case"date":return r+Pt(i,n)+o;case"textarea":return r+Lt(i,n)+o;case"select":return r+Nt(i,n)+o;case"radio":return r+Ot(i,n)+o;case"checkbox":return r+Rt(i,n)+o;case"file_upload":return r+Wt(i,n)+o;case"signature":return r+Ht(i,n)+o;default:return r+`
+        <div class="unknown-element">
+          <p>⚠️ Unknown question type: ${g(i.type)}</p>
+        </div>
+      `+o}}function Ut(i){const e=i.type!=="divider"?'<hr class="print-question-separator" />':"";switch(i.type){case"text":return`
+        <div class="content-print">
+          <div class="content-element">
+            <div class="text-content">
+              <p>${g(i.content)}</p>
+            </div>
+          </div>
+          ${e}
+        </div>
+      `;case"html":return`
+        <div class="content-print">
+          <div class="content-element">
+            <div class="html-content-wrapper">
+              ${i.content}
+            </div>
+          </div>
+          ${e}
+        </div>
+      `;case"markdown":return`
+        <div class="content-print">
+          <div class="content-element">
+            <div class="markdown-content">
+              ${Gt(i.content)}
+            </div>
+          </div>
+          ${e}
+        </div>
+      `;case"divider":return`
+        <div class="content-print">
+          <div class="content-element">
+            <div class="divider-content">
+              <hr class="content-divider" />
+              ${i.caption?`<div class="divider-caption">${g(i.caption)}</div>`:""}
+            </div>
+          </div>
+        </div>
+      `;case"image":return`
+        <div class="content-print">
+          <div class="content-element">
+            <div class="image-placeholder">
+              <p>📷 Image: ${g(i.content)}</p>
+              ${i.caption?`<small>${g(i.caption)}</small>`:""}
+            </div>
+          </div>
+          ${e}
+        </div>
+      `;case"video":return`
+        <div class="content-print">
+          <div class="content-element">
+            <div class="video-placeholder">
+              <p>🎥 Video: ${g(i.content)}</p>
+              ${i.caption?`<small>${g(i.caption)}</small>`:""}
+            </div>
+          </div>
+          ${e}
+        </div>
+      `;case"file":return`
+        <div class="content-print">
+          <div class="content-element">
+            <div class="file-placeholder">
+              <p>📎 File: ${g(i.content)}</p>
+              ${i.caption?`<small>${g(i.caption)}</small>`:""}
+            </div>
+          </div>
+          ${e}
+        </div>
+      `;default:return`
+        <div class="content-print">
+          <div class="content-element">
+            <div class="unknown-element">
+              <p>⚠️ Unknown content type: ${g(i.type)}</p>
+            </div>
+          </div>
+          ${e}
+        </div>
+      `}}function Pt(i,e){const t=e!=null?g(String(e)):"";return`
+    <div class="print-response-value input-response">
+      ${(i.type==="date"&&e?new Date(e).toLocaleDateString():t)||'<span class="print-no-response">No response</span>'}
+    </div>
+  `}function Lt(i,e){return`
+    <div class="print-response-value textarea-response">
+      ${(e!=null?g(String(e)):"")||'<span class="print-no-response">No response</span>'}
+    </div>
+  `}function Nt(i,e){const t=e!=null?String(e):"";return`
+    <div class="print-response-value select-response">
+      ${t?g(t):'<span class="print-no-response">No selection made</span>'}
+    </div>
+  `}function Ot(i,e){const t=e!=null?String(e):"";return`
+    <div class="print-response-value radio-response">
+      ${t?g(t):'<span class="print-no-response">No selection made</span>'}
+    </div>
+  `}function Rt(i,e){if((i.options||[]).length===0)return`
+      <div class="print-response-value checkbox-response">
+        ${e===!0||e==="true"?"Yes":"No"}
+      </div>
+    `;{const n=Array.isArray(e)?e.map(String):[];return`
+      <div class="print-response-value checkbox-response">
+        ${n.length>0?n.map(s=>`<div>• ${g(s)}</div>`).join(""):'<span class="print-no-response">No selections made</span>'}
+      </div>
+    `}}function Wt(i,e){if(!e)return'<div class="print-response-value file-response"><span class="print-no-response">No file uploaded</span></div>';const t=typeof e=="string";if(typeof e=="object"&&e.name)return`
+      <div class="print-response-value file-response">
+        📎 ${g(e.name)}
+        ${e.size?` <span class="file-size">(${Qt(e.size)})</span>`:""}
+      </div>
+    `;if(t){const s=qt(e);return`
+      <div class="print-response-value file-response">
+        📎 ${g(s)}
+      </div>
+    `}else return`
+      <div class="print-response-value file-response">
+        📎 ${g(String(e))}
+      </div>
+    `}function Ht(i,e){if(!e)return'<div class="print-response-value signature-response"><span class="print-no-response">No signature provided</span></div>';const t=typeof e=="string"?e:e.url||e.dataURL;return t?`
+      <div class="print-response-value signature-response">
+        <img 
+          src="${g(t)}" 
+          alt="Digital Signature" 
+          class="signature-image"
+        />
+      </div>
+    `:`
+      <div class="signature-fallback">
+        <div class="signature-error">Unable to display signature</div>
+      </div>
+    `}function Vt(i){return["text_input","textarea","select","number","radio","checkbox","date","file_upload","signature"].includes(i.type)}function jt(i,e){return e==null?void 0:e.find(t=>t.elementId===i)}function Bt(i,e){return`
+    <div class="runner-card" style="margin-bottom: 40px; border-left: 4px solid #3b82f6;">
+      <div style="display: flex; justify-content: between; align-items: center; gap: 20px;">
+        <div>
+          <h3 style="margin: 0 0 8px 0; color: #111827; font-size: 1.25rem;">
+            ${g(i.name)}
+          </h3>
+          <p style="margin: 0; color: #6b7280; font-size: 0.875rem;">
+            <strong>Status:</strong> ${g(i.status)} | 
+            <strong>Generated:</strong> ${e.toLocaleString()}
+          </p>
+        </div>
+        <div style="text-align: right; color: #6b7280; font-size: 0.875rem;">
+          <p style="margin: 0;"><strong>Instance ID:</strong> ${g(i.id)}</p>
+          <p style="margin: 0;"><strong>Workflow ID:</strong> ${g(i.workflowId)}</p>
+        </div>
+      </div>
+    </div>
+  `}function g(i){if(i==null)return"";const e=String(i);return{innerHTML:""}.innerHTML||e.replace(/[&<>"']/g,n=>({"&":"&amp;","<":"&lt;",">":"&gt;",'"':"&quot;","'":"&#39;"})[n])}function Qt(i){if(i===0)return"0 Bytes";const e=1024,t=["Bytes","KB","MB","GB"],n=Math.floor(Math.log(i)/Math.log(e));return parseFloat((i/Math.pow(e,n)).toFixed(2))+" "+t[n]}function qt(i){try{return new URL(i).pathname.split("/").pop()||""||"Uploaded File"}catch{const e=i.split("/"),t=e[e.length-1];return t&&t.includes(".")?t:"Uploaded File"}}function Gt(i){return i==null?"":String(i).replace(/^### (.*$)/gim,"<h3>$1</h3>").replace(/^## (.*$)/gim,"<h2>$1</h2>").replace(/^# (.*$)/gim,"<h1>$1</h1>").replace(/\*\*(.*)\*\*/gim,"<strong>$1</strong>").replace(/\*(.*)\*/gim,"<em>$1</em>").replace(/`(.*)`/gim,"<code>$1</code>").replace(/\n/gim,"<br>")}function Yt(){return`
+    /* Print Layout Styles - Extracted from step-styles.ts */
+    .print-layout {
+      width: 100%;
+      max-width: none;
+      background: #fff;
+      padding: 40px;
+      box-sizing: border-box;
+      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
+    }
+
+    .print-step {
+      margin-bottom: 60px;
+      page-break-inside: avoid;
+      break-inside: avoid;
+    }
+
+    .print-step:last-child {
+      margin-bottom: 0;
+    }
+
+    .runner-card {
+      background: transparent;
+      border-radius: 0;
+      padding: 0;
+      margin: 0;
+      box-shadow: none;
+      border: none;
+    }
+
+    .runner-step-header h2.runner-step-title {
+      font-size: 1.5rem;
+      font-weight: 700;
+      color: #111827;
+      margin: 0;
+    }
+
+    .runner-step-divider {
+      border: none;
+      border-top: 1px solid #e5e7eb;
+      margin: 20px 0 20px 0;
+      width: 100%;
+    }
+
+    .runner-step-desc {
+      color: #6b7280;
+      font-size: 1rem;
+      margin: 0;
+    }
+
+    .runner-question-title {
+      font-size: 1rem;
+      font-weight: 600;
+      margin-bottom: 8px;
+      color: #111827;
+      display: flex;
+      align-items: center;
+    }
+
+    .runner-question-required {
+      color: #dc2626;
+      font-size: 1.1em;
+      margin-left: 4px;
+    }
+
+    .runner-question-divider {
+      border: none;
+      border-top: 1.5px solid #e5e7eb;
+      margin: 12px 0 20px 0;
+    }
+
+    /* Form input styling */
+    input[type="text"],
+    input[type="email"],
+    input[type="number"],
+    input[type="date"],
+    textarea,
+    select {
+      width: 100%;
+      padding: 12px 16px;
+      border: 1px solid #e5e7eb;
+      border-radius: 12px;
+      font-size: 14px;
+      background-color: #f9fafb;
+      color: #111827;
+      box-sizing: border-box;
+    }
+
+    textarea {
+      min-height: 120px;
+      resize: vertical;
+    }
+
+    select {
+      cursor: pointer;
+      width: auto;
+      min-width: 450px;
+      max-width: 900px;
+    }
+
+    /* Radio group styling */
+    .radio-group {
+      display: flex;
+      flex-direction: column;
+      gap: 8px;
+      background-color: #ffffff;
+      padding: 16px;
+    }
+
+    .radio-option {
+      display: flex;
+      align-items: center;
+      padding: 8px 0;
+    }
+
+    .radio-option input[type="radio"] {
+      margin-right: 12px;
+      width: 18px;
+      height: 18px;
+      accent-color: #3b82f6;
+    }
+
+    .radio-label {
+      font-size: 16px;
+      color: #374151;
+      flex: 1;
+    }
+
+    /* Checkbox group styling */
+    .checkbox-group {
+      display: flex;
+      flex-direction: column;
+      gap: 8px;
+      background-color: #ffffff;
+      padding: 16px;
+    }
+
+    .checkbox-option {
+      display: flex;
+      align-items: center;
+      padding: 8px 0;
+    }
+
+    .checkbox-option input[type="checkbox"] {
+      margin-right: 12px;
+      width: 18px;
+      height: 18px;
+      accent-color: #3b82f6;
+    }
+
+    .checkbox-label {
+      font-size: 16px;
+      color: #374151;
+      flex: 1;
+    }
+
+    /* Single checkbox styling */
+    .checkbox-single {
+      display: flex;
+      align-items: center;
+      padding: 8px 0;
+      margin-top: 8px;
+    }
+
+    .checkbox-single input[type="checkbox"] {
+      margin-right: 12px;
+      width: 18px;
+      height: 18px;
+      accent-color: #3b82f6;
+    }
+
+    /* Content Element Styles */
+    .content-element {
+      margin-bottom: 16px;
+    }
+
+    /* Print mode content layout */
+    .content-print {
+      margin: 0;
+      padding: 0;
+      background: transparent;
+      border: none;
+      box-shadow: none;
+    }
+
+    .text-content p {
+      font-size: 1rem;
+      line-height: 1.6;
+      color: #374151;
+      margin: 0;
+    }
+
+    .markdown-content {
+      font-size: 1rem;
+      line-height: 1.6;
+      color: #374151;
+    }
+
+    .markdown-content h1 {
+      font-size: 1.5rem;
+      font-weight: 700;
+      margin: 24px 0 16px 0;
+      color: #111827;
+    }
+
+    .markdown-content h2 {
+      font-size: 1.25rem;
+      font-weight: 600;
+      margin: 20px 0 12px 0;
+      color: #111827;
+    }
+
+    .markdown-content h3 {
+      font-size: 1.125rem;
+      font-weight: 600;
+      margin: 16px 0 8px 0;
+      color: #111827;
+    }
+
+    .markdown-content strong {
+      font-weight: 600;
+    }
+
+    .markdown-content em {
+      font-style: italic;
+    }
+
+    .markdown-content code {
+      background: #f3f4f6;
+      padding: 2px 6px;
+      border-radius: 4px;
+      font-family: "Courier New", monospace;
+      font-size: 0.9em;
+    }
+
+    .divider-content {
+      text-align: center;
+      margin: 24px 0;
+    }
+
+    .content-divider {
+      border: none;
+      border-top: 2px solid #e5e7eb;
+      margin: 0 0 8px 0;
+    }
+
+    .divider-caption {
+      font-size: 0.875rem;
+      color: #6b7280;
+      font-style: italic;
+    }
+
+    .html-content-wrapper {
+      line-height: 1.6;
+    }
+
+    .image-placeholder,
+    .video-placeholder,
+    .file-placeholder {
+      background: #f9fafb;
+      border: 2px dashed #d1d5db;
+      border-radius: 8px;
+      padding: 24px;
+      text-align: center;
+      color: #6b7280;
+    }
+
+    .image-placeholder p,
+    .video-placeholder p,
+    .file-placeholder p {
+      margin: 0 0 8px 0;
+      font-weight: 500;
+    }
+
+    .image-placeholder small,
+    .video-placeholder small,
+    .file-placeholder small {
+      font-size: 0.875rem;
+      color: #9ca3af;
+    }
+
+    .unknown-element {
+      background: #fef2f2;
+      border: 1px solid #fecaca;
+      border-radius: 8px;
+      padding: 16px;
+      color: #dc2626;
+      text-align: center;
+    }
+
+    .unknown-element p {
+      margin: 0;
+      font-weight: 500;
+    }
+
+    /* Print mode file info styles */
+    .file-upload-print-info {
+      background: #f8fafc;
+      border: 1px solid #e2e8f0;
+      border-radius: 6px;
+      padding: 16px;
+      margin: 8px 0;
+    }
+
+    .file-details {
+      display: flex;
+      flex-direction: column;
+      gap: 8px;
+    }
+
+    .file-detail-row {
+      display: flex;
+      align-items: center;
+      font-size: 0.875rem;
+      line-height: 1.4;
+    }
+
+    .file-detail-row strong {
+      min-width: 80px;
+      color: #374151;
+      font-weight: 600;
+      margin-right: 8px;
+    }
+
+    .no-file,
+    .no-signature {
+      color: #6b7280;
+      font-style: italic;
+      font-size: 0.875rem;
+    }
+
+    /* Signature styles */
+    .signature-view-only {
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      padding: 16px;
+      background: #f8fafc;
+      border: 1px solid #e2e8f0;
+      border-radius: 6px;
+    }
+
+    .signature-existing {
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      margin-bottom: 12px;
+    }
+
+    .signature-image {
+      max-width: 100%;
+      max-height: 200px;
+      border: 1px solid #e2e8f0;
+      border-radius: 4px;
+      background: white;
+      padding: 8px;
+      box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1);
+    }
+
+    .signature-fallback {
+      padding: 20px;
+      text-align: center;
+    }
+
+    .signature-error {
+      color: #dc2626;
+      font-style: italic;
+      font-size: 0.875rem;
+    }
+
+    /* Print media queries for actual printing */
+    @media print {
+      .print-layout {
+        padding: 20px;
+        background: #fff !important;
+      }
+
+      .print-step {
+        page-break-inside: avoid;
+        margin-bottom: 40px;
+      }
+
+      .runner-card {
+        box-shadow: none !important;
+        border: 1px solid #ccc !important;
+        margin-bottom: 15px;
+      }
+
+      /* Hide any interactive elements in print */
+      button,
+      input[type="button"],
+      input[type="submit"] {
+        display: none !important;
+      }
+
+      /* Ensure proper text color for print */
+      * {
+        color: #000 !important;
+        background: transparent !important;
+      }
+
+      /* Print-specific file info styling */
+      .file-upload-print-info {
+        border: 1px solid #000 !important;
+        background: transparent !important;
+        margin-bottom: 15px;
+      }
+
+      .file-detail-row strong {
+        color: #000 !important;
+      }
+    }
+
+    /* Clean print mode styles */
+    .print-response-value {
+      font-size: 1rem;
+      line-height: 1.5;
+      color: #111827;
+      padding: 0;
+      margin: 0 0 8px 0;
+      background: transparent;
+      border: none;
+      min-height: auto;
+    }
+
+    .print-response-value.textarea-response {
+      white-space: pre-wrap;
+      word-wrap: break-word;
+    }
+
+    .print-response-value.file-response {
+      font-weight: 500;
+    }
+
+    .print-response-value .file-size {
+      color: #6b7280;
+      font-weight: normal;
+      font-size: 0.9em;
+    }
+
+    .print-response-value.signature-response {
+      padding: 8px 0;
+    }
+
+    .print-response-value.signature-response .signature-image {
+      max-width: 200px;
+      max-height: 100px;
+      border: 1px solid #e5e7eb;
+      background: white;
+    }
+
+    .print-no-response {
+      color: #9ca3af;
+      font-style: italic;
+      font-size: 0.9em;
+    }
+
+    /* Print mode 3-level text hierarchy */
+    /* Title level (18pt) - Instance name */
+    .print-instance-title {
+      font-size: 18pt;
+      font-weight: 600;
+      color: #111827;
+      margin: 0 0 20px 0;
+      line-height: 1.3;
+    }
+
+    /* Step level (14pt) */
+    .print-step-title {
+      font-size: 14pt;
+      font-weight: 600;
+      color: #111827;
+      margin: 0 0 8px 0;
+      line-height: 1.4;
+    }
+
+    /* Question level (12pt) */
+    .print-question-title {
+      font-size: 12pt;
+      font-weight: 600;
+      color: #111827;
+      margin: 0 0 4px 0;
+      line-height: 1.4;
+    }
+
+    .print-step-description {
+      font-size: 1rem;
+      font-weight: 400;
+      color: #6b7280;
+      margin: 8px 0;
+      line-height: 1.5;
+    }
+
+    .print-question-separator {
+      border: none;
+      border-top: 1px solid #e5e7eb;
+      margin: 16px 0;
+      width: 100%;
+    }
+
+    /* Clean styling for checkbox lists in print */
+    .print-response-value.checkbox-response div {
+      margin: 2px 0;
+      line-height: 1.4;
+    }
+  `}function Jt(i,e={}){if(!customElements.get("builder-widget"))return console.error("Error: <builder-widget> is not defined. Make sure it was imported."),null;const t=document.getElementById(i);if(!t)return console.error(`Error: Target element with ID '${i}' not found.`),null;t.innerHTML="";const n=document.createElement("builder-widget");return e.onWorkflowCreated&&(n.onWorkflowCreated=e.onWorkflowCreated),e.onWorkflowDeleted&&(n.onWorkflowDeleted=e.onWorkflowDeleted),e.onWorkflowUpdated&&(n.onWorkflowUpdated=e.onWorkflowUpdated),t.appendChild(n),console.log(`Begin Builder mounted on #${i}`),n}function Kt(i,e){if(!customElements.get("runner-widget"))return console.error("Error: <runner-widget> is not defined. Make sure it was imported."),null;const t=document.getElementById(i);if(!t)return console.error(`Error: Target element with ID '${i}' not found.`),null;if(e.mode==="preview"){if(!e||!e.workflow)return console.error("Error: Workflow data must be provided for preview mode."),t.innerHTML='<p style="color: red;">Error: Workflow data required for preview mode.</p>',null;if(!e.workflow.steps||e.workflow.steps.length===0)return console.error("Error: Workflow provided to runner has no steps defined."),t.innerHTML='<p style="color: red;">Error: Workflow has no steps.</p>',null}else{if(!e||!e.instance)return console.error("Error: Instance data must be provided in runner config."),t.innerHTML='<p style="color: red;">Error: Instance data required.</p>',null;if(!e.instance.steps||e.instance.steps.length===0)return console.error("Error: Instance provided to runner has no steps defined."),t.innerHTML='<p style="color: red;">Error: Instance has no steps.</p>',null}t.innerHTML="";const n=document.createElement("runner-widget");return e.mode==="preview"?(n.workflow=e.workflow,n.mode="preview"):(n.instance=e.instance,n.mode=e.mode||"default"),e.mode&&(n.mode=e.mode),e.isLoading!==void 0&&(n.isLoading=e.isLoading),e.onSignatureCaptured&&(n.onSignatureCaptured=e.onSignatureCaptured),e.onFileUploaded&&(n.onFileUploaded=e.onFileUploaded),e.currentUser&&(n.currentUser=e.currentUser),e.onInstanceUpdated&&n.addEventListener("instance-updated",s=>{const r=s;try{e.onInstanceUpdated(r.detail)}catch(o){console.error("Error executing onInstanceUpdated callback:",o)}}),t.appendChild(n),console.log(`Begin Runner mounted on #${i}`),n}function Xt(i,e){const t=i.getFormData(),n=JSON.parse(JSON.stringify(e));return n.steps&&n.steps.forEach(s=>{s.responses||(s.responses=[]),s.elements.forEach(r=>{if(r.type==="text_input"||r.type==="textarea"||r.type==="select"||r.type==="number"||r.type==="radio"||r.type==="checkbox"||r.type==="date"||r.type==="file_upload"||r.type==="signature"){const o=t[r.id];if(o!==void 0){let a=s.responses.find(d=>d.elementId===r.id);a?(a.value=o,a.answeredAt=new Date):(a={elementId:r.id,value:o,answeredAt:new Date},s.responses.push(a))}}})}),n}function Zt(i,e){const t={};e.steps&&e.steps.forEach(n=>{n.responses&&n.responses.forEach(s=>{t[s.elementId]=s.value})}),i.restoreFormData(),console.log("Form data restored to runner widget:",t)}D.createBuilder=Jt,D.createRunner=Kt,D.generateInstanceHTML=Mt,D.restoreFormDataToRunner=Zt,D.updateInstanceFromRunnerForm=Xt,Object.defineProperty(D,Symbol.toStringTag,{value:"Module"})});