vanilla-breeze 0.1.2 → 0.1.3

package/dist/cdn/packs/design-system.full.js

@@ -1,6 +1,6 @@
-var Ft=window.matchMedia("(prefers-reduced-motion: reduce)");var K=new Map;function h(n,t,e={}){let s=e.priority??10,o={impl:t,bundle:e.bundle,contract:e.contract,priority:s},r=K.get(n);if(customElements.get(n)){if(!r||r.priority>=s){r&&r.priority===s&&r.impl!==t&&console.warn(`[VB Bundle] Tag <${n}> already registered by "${r.bundle}" (priority ${r.priority}). Skipping "${e.bundle}".`);return}console.warn(`[VB Bundle] Tag <${n}> defined by "${r.bundle}" cannot be replaced (customElements.define is permanent). "${e.bundle}" has higher priority but arrived late.`);return}if(r&&r.priority>=s){r.priority===s&&console.warn(`[VB Bundle] Tag <${n}> already registered by "${r.bundle}". Skipping "${e.bundle}" (first wins at equal priority).`);return}K.set(n,o),customElements.define(n,t)}var u=class extends HTMLElement{#t=[];connectedCallback(){this.hasAttribute("data-upgraded")||this.setup()!==!1&&this.setAttribute("data-upgraded","")}disconnectedCallback(){for(let t of this.#t)t();this.#t=[],this.removeAttribute("data-upgraded"),this.teardown()}listen(t,e,s,o){t.addEventListener(e,s,o),this.#t.push(()=>t.removeEventListener(e,s,o))}setup(){}teardown(){}};var C=class extends u{static observedAttributes=["colors","names","layout","show-values","show-names","size","editable"];#t=[];setup(){this.#e()}attributeChangedCallback(){this.isConnected&&this.#e()}#e(){let t=this.getAttribute("colors")||"",e=this.getAttribute("names")||"",s=this.getAttribute("layout")||"inline",o=this.getAttribute("size")||"md",r=this.hasAttribute("show-values"),i=this.hasAttribute("show-names")||e.length>0,a=this.hasAttribute("editable"),l=this.#c(t);this.#t=l.slice();let c=e?e.split(",").map(b=>b.trim()):[],p={sm:48,md:80,lg:120}[o]||80,d="display:flex;flex-wrap:wrap;gap:var(--size-xs,0.5rem)";s==="grid"?d=`display:grid;grid-template-columns:repeat(auto-fill,minmax(${p}px,1fr));gap:var(--size-xs,0.5rem)`:s==="list"&&(d="display:flex;flex-direction:column;gap:var(--size-xs,0.5rem)");let x=l.map((b,y)=>{let g=c[y]||"",$=this.#l(b),_=s==="list"?"display:flex;flex-direction:row;align-items:center;gap:0.75rem":`display:flex;flex-direction:column;align-items:center;gap:0.25rem;max-inline-size:${p}px`,W=s==="list"?36:p,J=`background:${b};color:${$};width:${W}px;height:${W}px;border:1px solid oklch(0% 0 0/0.15);border-radius:var(--radius-s,0.25rem);cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;font-family:var(--font-mono,monospace);position:relative;overflow:hidden;flex-shrink:0`;if(a){let mt=this.#a(b);return`<div class="swatch-wrap" role="listitem" style="${_}">
+var Ft=window.matchMedia("(prefers-reduced-motion: reduce)");var K=new Map;function h(n,t,e={}){let s=e.priority??10,o={impl:t,bundle:e.bundle,contract:e.contract,priority:s},r=K.get(n);if(customElements.get(n)){if(!r||r.priority>=s){r&&r.priority===s&&r.impl!==t&&console.warn(`[VB Bundle] Tag <${n}> already registered by "${r.bundle}" (priority ${r.priority}). Skipping "${e.bundle}".`);return}console.warn(`[VB Bundle] Tag <${n}> defined by "${r.bundle}" cannot be replaced (customElements.define is permanent). "${e.bundle}" has higher priority but arrived late.`);return}if(r&&r.priority>=s){r.priority===s&&console.warn(`[VB Bundle] Tag <${n}> already registered by "${r.bundle}". Skipping "${e.bundle}" (first wins at equal priority).`);return}K.set(n,o),customElements.define(n,t)}var m=class extends HTMLElement{#t=[];connectedCallback(){this.hasAttribute("data-upgraded")||this.setup()!==!1&&(this.setAttribute("data-upgraded",""),this.dispatchEvent(new CustomEvent(`${this.localName}:upgraded`,{bubbles:!0})))}disconnectedCallback(){for(let t of this.#t)t();this.#t=[],this.removeAttribute("data-upgraded"),this.teardown()}listen(t,e,s,o){t.addEventListener(e,s,o),this.#t.push(()=>t.removeEventListener(e,s,o))}setup(){}teardown(){}};var C=class extends m{static observedAttributes=["colors","names","layout","show-values","show-names","size","editable"];#t=[];setup(){this.#e()}attributeChangedCallback(){this.isConnected&&this.#e()}#e(){let t=this.getAttribute("colors")||"",e=this.getAttribute("names")||"",s=this.getAttribute("layout")||"inline",o=this.getAttribute("size")||"md",r=this.hasAttribute("show-values"),i=this.hasAttribute("show-names")||e.length>0,a=this.hasAttribute("editable"),l=this.#c(t);this.#t=l.slice();let c=e?e.split(",").map(b=>b.trim()):[],p={sm:48,md:80,lg:120}[o]||80,d="display:flex;flex-wrap:wrap;gap:var(--size-xs,0.5rem)";s==="grid"?d=`display:grid;grid-template-columns:repeat(auto-fill,minmax(${p}px,1fr));gap:var(--size-xs,0.5rem)`:s==="list"&&(d="display:flex;flex-direction:column;gap:var(--size-xs,0.5rem)");let x=l.map((b,y)=>{let g=c[y]||"",$=this.#l(b),_=s==="list"?"display:flex;flex-direction:row;align-items:center;gap:0.75rem":`display:flex;flex-direction:column;align-items:center;gap:0.25rem;max-inline-size:${p}px`,W=s==="list"?36:p,J=`background:${b};color:${$};width:${W}px;height:${W}px;border:1px solid oklch(0% 0 0/0.15);border-radius:var(--radius-s,0.25rem);cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;font-family:var(--font-mono,monospace);position:relative;overflow:hidden;flex-shrink:0`;if(a){let ut=this.#a(b);return`<div class="swatch-wrap" role="listitem" style="${_}">
           <label class="color-box color-box-edit" style="${J};cursor:pointer" data-index="${y}" title="Click to edit${g?": "+g:""}" aria-label="${g||"Color "+(y+1)}: ${b}. Click to edit.">
-            <input type="color" class="color-input" value="${mt}" data-index="${y}" style="position:absolute;inset:0;opacity:0;cursor:pointer;inline-size:100%;block-size:100%" aria-label="${g||"Color "+(y+1)} picker">
+            <input type="color" class="color-input" value="${ut}" data-index="${y}" style="position:absolute;inset:0;opacity:0;cursor:pointer;inline-size:100%;block-size:100%" aria-label="${g||"Color "+(y+1)} picker">
             <span class="color-value" style="font-size:0.625rem;line-height:1.2;opacity:${r?"1":"0"};text-align:center;padding:2px 4px;word-break:break-all;transition:opacity 0.15s ease;pointer-events:none">${this.#i(b)}</span>
           </label>
           ${i&&g?`<span style="font-size:var(--font-size-xs,0.75rem);color:var(--color-text-muted,#666);text-align:center;max-inline-size:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap">${g}</span>`:""}
@@ -12,9 +12,9 @@ var Ft=window.matchMedia("(prefers-reduced-motion: reduce)");var K=new Map;funct
           <span class="color-value" style="font-size:0.625rem;line-height:1.2;opacity:${r?"1":"0"};text-align:center;padding:2px 4px;word-break:break-all;transition:opacity 0.15s ease">${this.#i(b)}</span>
         </button>
         ${i&&g?`<span style="font-size:var(--font-size-xs,0.75rem);color:var(--color-text-muted,#666);text-align:center;max-inline-size:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap">${g}</span>`:""}
-      </div>`}).join("");this.innerHTML=`<div class="palette ${s}" role="list" aria-label="Color palette" style="${d}">${x}</div>`,a?this.#r(c):(this.#o(l,c),this.#s(l,c,r))}#s(t,e,s){this.querySelectorAll(".color-box").forEach(o=>{s||(o.addEventListener("pointerenter",()=>{let r=o.querySelector(".color-value");r&&(r.style.opacity="1")}),o.addEventListener("pointerleave",()=>{let r=o.querySelector(".color-value");r&&(r.style.opacity="0")})),o.addEventListener("click",()=>{let r=Number(o.dataset.index),i=t[r],a=e[r]||"";navigator.clipboard?.writeText(i),this.dispatchEvent(new CustomEvent("color-palette:select",{bubbles:!0,detail:{color:i,name:a,index:r}})),o.style.outline="3px solid currentColor",o.style.outlineOffset="2px",setTimeout(()=>{o.style.outline="",o.style.outlineOffset=""},600)})})}#r(t){this.querySelectorAll(".color-input").forEach(e=>{e.addEventListener("input",()=>{let s=Number(e.dataset.index),o=e.value;this.#t[s]=o;let r=e.parentElement;if(r){r.style.background=o,r.style.color=this.#l(o);let i=r.querySelector(".color-value");i&&(i.textContent=this.#i(o)),r.title=`Click to edit${t[s]?": "+t[s]:""} (${o})`,r.setAttribute("aria-label",`${t[s]||"Color "+(s+1)}: ${o}. Click to edit.`)}this.setAttribute("colors",this.#t.join(",")),this.dispatchEvent(new CustomEvent("color-palette:change",{bubbles:!0,detail:{color:o,name:t[s]||"",index:s,colors:this.#t.slice()}}))})})}get colors(){return this.#t.slice()}#o(t,e){this.querySelectorAll(".color-box").forEach(s=>{let o=Number(s.dataset.index),r=t[o];if(!r||!r.includes("var("))return;let i=getComputedStyle(s).backgroundColor,a=this.#n(i)||i;t[o]=a,this.#t[o]=a;let l=s.querySelector(".color-value");l&&(l.textContent=a),s.style.color=this.#l(a);let c=e[o]||"";s.title=`Click to copy${c?": "+c:""} (${a})`,s.setAttribute("aria-label",`${c||"Color "+(o+1)}: ${a}`)})}#n(t){let e=t.match(/rgba?\(\s*([\d.]+),?\s*([\d.]+),?\s*([\d.]+)/);if(!e)return null;let[,s,o,r]=e,i=a=>Math.round(Number(a)).toString(16).padStart(2,"0");return`#${i(s)}${i(o)}${i(r)}`}#a(t){if(/^#[0-9a-f]{6}$/i.test(t))return t.toLowerCase();if(/^#[0-9a-f]{3}$/i.test(t))return("#"+t.slice(1).split("").map(o=>o+o).join("")).toLowerCase();if(typeof document>"u")return"#000000";let e=document.createElement("span");e.style.color=t,e.style.display="none",document.body.appendChild(e);let s=getComputedStyle(e).color;return e.remove(),this.#n(s)||"#000000"}#i(t){if(t.startsWith("#"))return t;let e=t.match(/oklch\(\s*([\d.]+)%?\s+([\d.]+)\s+([\d.]+)/);return e?`${e[1]}% .${e[2].replace("0.","")}`:t.length>12?t.slice(0,12)+"\u2026":t}#c(t){if(!t)return[];let e=[],s=0,o="";for(let r of t)r==="("?s++:r===")"&&s--,r===","&&s===0?(e.push(o.trim()),o=""):o+=r;return o.trim()&&e.push(o.trim()),e}#l(t){let e=t.match(/oklch\(\s*([\d.]+)%?\s/);if(e){let s=parseFloat(e[1]);return(s>1?s/100:s)>.6?"#000":"#fff"}if(t.startsWith("#")){let s=t.replace("#",""),o=parseInt(s.substring(0,2),16)/255,r=parseInt(s.substring(2,4),16)/255,i=parseInt(s.substring(4,6),16)/255;return .2126*o+.7152*r+.0722*i>.4?"#000":"#fff"}return"#000"}};h("color-palette",C);var ut=["system-ui","Georgia","Inter, sans-serif",'"JetBrains Mono", monospace',"Verdana","Cambria","ui-serif"],T=class extends u{static observedAttributes=["font-family","label","sample","show-scale","show-weights","show-characters","weights","editable","target","token"];setup(){this.#t(),this.#e()}attributeChangedCallback(){this.isConnected&&(this.#t(),this.#e())}#t(){let t=this.getAttribute("font-family")||"system-ui",e=this.getAttribute("label")||t.replace(/['"]/g,"").split(",")[0],s=this.getAttribute("sample")||"The quick brown fox jumps over the lazy dog",o=this.hasAttribute("show-scale"),r=this.hasAttribute("show-weights"),i=this.hasAttribute("show-characters"),l=(this.getAttribute("weights")||"300,400,500,600,700").split(",").map(d=>d.trim()),c="",p=this.hasAttribute("editable")?`<input type="text" class="specimen-font-input" value="${t.replace(/"/g,"&quot;")}" aria-label="Font family" style="font:inherit;padding:0.25rem 0.5rem;border:1px solid var(--color-border,#ccc);border-radius:var(--radius-s,0.25rem);min-inline-size:18rem;max-inline-size:100%;font-family:${t};font-size:var(--font-size-sm,0.875rem)">
+      </div>`}).join("");this.innerHTML=`<div class="palette ${s}" role="list" aria-label="Color palette" style="${d}">${x}</div>`,a?this.#r(c):(this.#o(l,c),this.#s(l,c,r))}#s(t,e,s){this.querySelectorAll(".color-box").forEach(o=>{s||(o.addEventListener("pointerenter",()=>{let r=o.querySelector(".color-value");r&&(r.style.opacity="1")}),o.addEventListener("pointerleave",()=>{let r=o.querySelector(".color-value");r&&(r.style.opacity="0")})),o.addEventListener("click",()=>{let r=Number(o.dataset.index),i=t[r],a=e[r]||"";navigator.clipboard?.writeText(i),this.dispatchEvent(new CustomEvent("color-palette:select",{bubbles:!0,detail:{color:i,name:a,index:r}})),o.style.outline="3px solid currentColor",o.style.outlineOffset="2px",setTimeout(()=>{o.style.outline="",o.style.outlineOffset=""},600)})})}#r(t){this.querySelectorAll(".color-input").forEach(e=>{e.addEventListener("input",()=>{let s=Number(e.dataset.index),o=e.value;this.#t[s]=o;let r=e.parentElement;if(r){r.style.background=o,r.style.color=this.#l(o);let i=r.querySelector(".color-value");i&&(i.textContent=this.#i(o)),r.title=`Click to edit${t[s]?": "+t[s]:""} (${o})`,r.setAttribute("aria-label",`${t[s]||"Color "+(s+1)}: ${o}. Click to edit.`)}this.setAttribute("colors",this.#t.join(",")),this.dispatchEvent(new CustomEvent("color-palette:change",{bubbles:!0,detail:{color:o,name:t[s]||"",index:s,colors:this.#t.slice()}}))})})}get colors(){return this.#t.slice()}#o(t,e){this.querySelectorAll(".color-box").forEach(s=>{let o=Number(s.dataset.index),r=t[o];if(!r||!r.includes("var("))return;let i=getComputedStyle(s).backgroundColor,a=this.#n(i)||i;t[o]=a,this.#t[o]=a;let l=s.querySelector(".color-value");l&&(l.textContent=a),s.style.color=this.#l(a);let c=e[o]||"";s.title=`Click to copy${c?": "+c:""} (${a})`,s.setAttribute("aria-label",`${c||"Color "+(o+1)}: ${a}`)})}#n(t){let e=t.match(/rgba?\(\s*([\d.]+),?\s*([\d.]+),?\s*([\d.]+)/);if(!e)return null;let[,s,o,r]=e,i=a=>Math.round(Number(a)).toString(16).padStart(2,"0");return`#${i(s)}${i(o)}${i(r)}`}#a(t){if(/^#[0-9a-f]{6}$/i.test(t))return t.toLowerCase();if(/^#[0-9a-f]{3}$/i.test(t))return("#"+t.slice(1).split("").map(o=>o+o).join("")).toLowerCase();if(typeof document>"u")return"#000000";let e=document.createElement("span");e.style.color=t,e.style.display="none",document.body.appendChild(e);let s=getComputedStyle(e).color;return e.remove(),this.#n(s)||"#000000"}#i(t){if(t.startsWith("#"))return t;let e=t.match(/oklch\(\s*([\d.]+)%?\s+([\d.]+)\s+([\d.]+)/);return e?`${e[1]}% .${e[2].replace("0.","")}`:t.length>12?t.slice(0,12)+"\u2026":t}#c(t){if(!t)return[];let e=[],s=0,o="";for(let r of t)r==="("?s++:r===")"&&s--,r===","&&s===0?(e.push(o.trim()),o=""):o+=r;return o.trim()&&e.push(o.trim()),e}#l(t){let e=t.match(/oklch\(\s*([\d.]+)%?\s/);if(e){let s=parseFloat(e[1]);return(s>1?s/100:s)>.6?"#000":"#fff"}if(t.startsWith("#")){let s=t.replace("#",""),o=parseInt(s.substring(0,2),16)/255,r=parseInt(s.substring(2,4),16)/255,i=parseInt(s.substring(4,6),16)/255;return .2126*o+.7152*r+.0722*i>.4?"#000":"#fff"}return"#000"}};h("color-palette",C);var mt=["system-ui","Georgia","Inter, sans-serif",'"JetBrains Mono", monospace',"Verdana","Cambria","ui-serif"],T=class extends m{static observedAttributes=["font-family","label","sample","show-scale","show-weights","show-characters","weights","editable","target","token"];setup(){this.#t(),this.#e()}attributeChangedCallback(){this.isConnected&&(this.#t(),this.#e())}#t(){let t=this.getAttribute("font-family")||"system-ui",e=this.getAttribute("label")||t.replace(/['"]/g,"").split(",")[0],s=this.getAttribute("sample")||"The quick brown fox jumps over the lazy dog",o=this.hasAttribute("show-scale"),r=this.hasAttribute("show-weights"),i=this.hasAttribute("show-characters"),l=(this.getAttribute("weights")||"300,400,500,600,700").split(",").map(d=>d.trim()),c="",p=this.hasAttribute("editable")?`<input type="text" class="specimen-font-input" value="${t.replace(/"/g,"&quot;")}" aria-label="Font family" style="font:inherit;padding:0.25rem 0.5rem;border:1px solid var(--color-border,#ccc);border-radius:var(--radius-s,0.25rem);min-inline-size:18rem;max-inline-size:100%;font-family:${t};font-size:var(--font-size-sm,0.875rem)">
           <span class="specimen-quick" style="display:inline-flex;flex-wrap:wrap;gap:0.25rem;margin-inline-start:0.5rem">
-            ${ut.map(d=>`<button type="button" class="specimen-quick-btn" data-font="${d.replace(/"/g,"&quot;")}" style="font:inherit;font-size:var(--font-size-xs,0.75rem);padding:0.125rem 0.5rem;border:1px solid var(--color-border,#ccc);border-radius:999px;background:var(--color-surface,#fff);color:var(--color-text,#222);cursor:pointer">${d.split(",")[0].replace(/["']/g,"")}</button>`).join("")}
+            ${mt.map(d=>`<button type="button" class="specimen-quick-btn" data-font="${d.replace(/"/g,"&quot;")}" style="font:inherit;font-size:var(--font-size-xs,0.75rem);padding:0.125rem 0.5rem;border:1px solid var(--color-border,#ccc);border-radius:999px;background:var(--color-surface,#fff);color:var(--color-text,#222);cursor:pointer">${d.split(",")[0].replace(/["']/g,"")}</button>`).join("")}
           </span>`:`<span class="specimen-label">${e}</span>`;if(c+=`<div class="specimen-header" style="font-family:${t}">
       ${p}
       <p class="specimen-sample" contenteditable="plaintext-only" spellcheck="false">${s}</p>
@@ -29,11 +29,11 @@ var Ft=window.matchMedia("(prefers-reduced-motion: reduce)");var K=new Map;funct
         </div>`;c+="</div>"}if(o){let d=[{name:"xs",rem:.75},{name:"sm",rem:.875},{name:"md",rem:1},{name:"lg",rem:1.125},{name:"xl",rem:1.25},{name:"2xl",rem:1.5},{name:"3xl",rem:1.875},{name:"4xl",rem:2.25},{name:"5xl",rem:3}];c+='<div class="specimen-scale">';for(let x of d)c+=`<div class="scale-step" style="font-family:${t};font-size:${x.rem}rem">
           <span class="scale-label">${x.name}</span>
           <span class="scale-text">${s.substring(0,30)}</span>
-        </div>`;c+="</div>"}this.innerHTML=c}#e(){if(!this.hasAttribute("editable"))return;let t=this.querySelector(".specimen-font-input");t&&this.listen(t,"input",()=>this.#s(t.value)),this.querySelectorAll(".specimen-quick-btn").forEach(e=>{this.listen(e,"click",()=>{let s=e.getAttribute("data-font")||"";t&&(t.value=s),this.#s(s)})})}#s(t){let e=this.#r(),s=this.getAttribute("token")||"font-family-base";e&&e.style.setProperty(`--${s}`,t),this.setAttribute("font-family",t),this.dispatchEvent(new CustomEvent("type-specimen:change",{bubbles:!0,detail:{fontFamily:t,token:s,target:this.getAttribute("target")||":root"}}))}#r(){let t=this.getAttribute("target")||":root";try{return t===":root"?document.documentElement:document.querySelector(t)}catch{return document.documentElement}}};h("type-specimen",T);var M=class extends u{static observedAttributes=["tokens","prefix","show-values","label","editable","target"];setup(){this.#t(),this.#e()}attributeChangedCallback(){this.isConnected&&(this.#t(),this.#e())}#t(){let t=this.getAttribute("tokens")||"3xs,2xs,xs,s,m,l,xl,2xl,3xl",e=this.getAttribute("prefix")||"--size-",s=this.getAttribute("show-values")!=="false",o=this.getAttribute("label")||"",r=this.hasAttribute("editable"),i=t.split(",").map(l=>l.trim()),a="";o&&(a+=`<div style="font-size:0.75rem;font-weight:700;text-transform:uppercase;letter-spacing:0.08em;color:var(--color-text-muted,#666);margin-block-end:0.75rem;font-family:var(--font-sans,system-ui)">${o}</div>`),a+=`<div role="list" aria-label="${o||"Spacing scale"}" style="display:flex;flex-direction:column;gap:0.25rem">`;for(let l of i){let c=`${e}${l}`,m=r?`<input type="text" class="scale-edit" data-token="${l}" aria-label="${l} value" style="font-family:var(--font-mono,monospace);font-size:0.75rem;padding:0.125rem 0.375rem;border:1px solid var(--color-border,#ccc);border-radius:var(--radius-s,0.25rem);background:var(--color-surface,#fff);color:var(--color-text,#222);inline-size:6rem;text-align:end">`:s?'<span class="scale-value" style="font-family:var(--font-mono,monospace);font-size:0.75rem;color:var(--color-text-muted,#666);font-variant-numeric:tabular-nums;min-inline-size:3.5rem;text-align:end"></span>':"";a+=`<div role="listitem" style="display:grid;grid-template-columns:3rem 1fr auto;align-items:center;gap:0.75rem;min-block-size:1.75rem">
+        </div>`;c+="</div>"}this.innerHTML=c}#e(){if(!this.hasAttribute("editable"))return;let t=this.querySelector(".specimen-font-input");t&&this.listen(t,"input",()=>this.#s(t.value)),this.querySelectorAll(".specimen-quick-btn").forEach(e=>{this.listen(e,"click",()=>{let s=e.getAttribute("data-font")||"";t&&(t.value=s),this.#s(s)})})}#s(t){let e=this.#r(),s=this.getAttribute("token")||"font-family-base";e&&e.style.setProperty(`--${s}`,t),this.setAttribute("font-family",t),this.dispatchEvent(new CustomEvent("type-specimen:change",{bubbles:!0,detail:{fontFamily:t,token:s,target:this.getAttribute("target")||":root"}}))}#r(){let t=this.getAttribute("target")||":root";try{return t===":root"?document.documentElement:document.querySelector(t)}catch{return document.documentElement}}};h("type-specimen",T);var M=class extends m{static observedAttributes=["tokens","prefix","show-values","label","editable","target"];setup(){this.#t(),this.#e()}attributeChangedCallback(){this.isConnected&&(this.#t(),this.#e())}#t(){let t=this.getAttribute("tokens")||"3xs,2xs,xs,s,m,l,xl,2xl,3xl",e=this.getAttribute("prefix")||"--size-",s=this.getAttribute("show-values")!=="false",o=this.getAttribute("label")||"",r=this.hasAttribute("editable"),i=t.split(",").map(l=>l.trim()),a="";o&&(a+=`<div style="font-size:0.75rem;font-weight:700;text-transform:uppercase;letter-spacing:0.08em;color:var(--color-text-muted,#666);margin-block-end:0.75rem;font-family:var(--font-sans,system-ui)">${o}</div>`),a+=`<div role="list" aria-label="${o||"Spacing scale"}" style="display:flex;flex-direction:column;gap:0.25rem">`;for(let l of i){let c=`${e}${l}`,u=r?`<input type="text" class="scale-edit" data-token="${l}" aria-label="${l} value" style="font-family:var(--font-mono,monospace);font-size:0.75rem;padding:0.125rem 0.375rem;border:1px solid var(--color-border,#ccc);border-radius:var(--radius-s,0.25rem);background:var(--color-surface,#fff);color:var(--color-text,#222);inline-size:6rem;text-align:end">`:s?'<span class="scale-value" style="font-family:var(--font-mono,monospace);font-size:0.75rem;color:var(--color-text-muted,#666);font-variant-numeric:tabular-nums;min-inline-size:3.5rem;text-align:end"></span>':"";a+=`<div role="listitem" style="display:grid;grid-template-columns:3rem 1fr auto;align-items:center;gap:0.75rem;min-block-size:1.75rem">
         <span style="font-family:var(--font-mono,monospace);font-size:0.875rem;color:var(--color-text-muted,#666);text-align:end">${l}</span>
         <div class="scale-bar" style="display:block;block-size:var(--size-m,1rem);min-inline-size:2px;inline-size:var(${c});background:var(--color-interactive,oklch(55% 0.2 260));border-radius:var(--radius-s,0.25rem)" aria-hidden="true"></div>
-        ${m}
-      </div>`}a+="</div>",this.innerHTML=a,requestAnimationFrame(()=>{if(r){let l=getComputedStyle(this);this.querySelectorAll(".scale-edit").forEach(c=>{let m=c.getAttribute("data-token"),p=l.getPropertyValue(`${e}${m}`).trim();c.value=p||""})}else s&&this.querySelectorAll(".scale-bar").forEach(l=>{let c=l.getBoundingClientRect().width,m=l.nextElementSibling;m&&(m.textContent=`${Math.round(c*100)/100}px`)})})}#e(){if(!this.hasAttribute("editable"))return;let t=this.getAttribute("prefix")||"--size-";this.querySelectorAll(".scale-edit").forEach(e=>{this.listen(e,"change",()=>this.#s(e,t)),this.listen(e,"keydown",s=>{s.key==="Enter"&&this.#s(e,t)})})}#s(t,e){let s=t.getAttribute("data-token"),o=t.value.trim();if(!s||!o)return;let r=this.#r(),i=`${e}${s}`;r&&r.style.setProperty(i,o),this.dispatchEvent(new CustomEvent("spacing-specimen:change",{bubbles:!0,detail:{name:s,value:o,token:i,target:this.getAttribute("target")||":root"}}))}#r(){let t=this.getAttribute("target")||":root";try{return t===":root"?document.documentElement:document.querySelector(t)}catch{return document.documentElement}}};h("spacing-specimen",M);var X={shadow:{prefix:"--shadow-",tokens:"xs,s,m,l,xl,2xl"},radius:{prefix:"--radius-",tokens:"xs,s,m,l,xl,2xl,full"},border:{prefix:"--border-width-",tokens:"thin,medium,thick"},color:{prefix:"--color-",tokens:"primary,secondary,accent,success,warning,error,info"},size:{prefix:"--size-",tokens:"3xs,2xs,xs,s,m,l,xl,2xl,3xl"},icon:{prefix:"",tokens:"home,search,settings,user,bell,heart,star,check,x,chevron-right,menu,trash"}},Y={shadow:pt,radius:ft,border:ht,color:bt,size:gt,icon:yt},L=class extends u{static observedAttributes=["type","tokens","prefix","show-values","label","size","icon-set","editable","target"];setup(){this.#t()}attributeChangedCallback(){this.isConnected&&this.#t()}#t(){let t=this.getAttribute("type")||"shadow",e=X[t]||X.shadow,s=this.getAttribute("prefix")||e.prefix,o=this.getAttribute("tokens")||e.tokens,r=this.getAttribute("show-values")!=="false",i=this.getAttribute("label")||"",a=o.split(",").map(p=>p.trim()),l=Y[t]||Y.shadow,c="";i&&(c+=`<p style="font-size:0.75rem;font-weight:700;text-transform:uppercase;letter-spacing:0.08em;color:var(--color-text-muted,#666);margin-block-end:0.75rem;font-family:var(--font-sans,system-ui)">${i}</p>`),c+=l(a,s,r,this),this.innerHTML=c;let m=this.hasAttribute("editable")&&t!=="icon";r&&t!=="icon"?requestAnimationFrame(()=>{this.#o(t,s,a),m&&this.#e(t,s)}):m&&requestAnimationFrame(()=>this.#e(t,s))}#e(t,e){let s=getComputedStyle(this);this.querySelectorAll("[data-token-value]").forEach(o=>{let r=o.dataset.tokenValue,i=s.getPropertyValue(`${e}${r}`).trim(),a=document.createElement("input");a.type=t==="color"&&/^#[0-9a-f]{3,8}$/i.test(i)?"color":"text",a.value=i||"",a.className="ts-edit",a.setAttribute("data-token",r),a.setAttribute("aria-label",`${r} value`),a.style.cssText=`font-family:var(--font-mono,monospace);font-size:0.625rem;padding:0.125rem 0.25rem;border:1px solid var(--color-border,#ccc);border-radius:var(--radius-s,0.25rem);background:var(--color-surface,#fff);color:var(--color-text,#222);inline-size:${t==="color"?"3rem":"100%"};${t==="color"?"block-size:1.5rem;padding:0;":"max-inline-size:8rem;"}`,o.replaceWith(a),this.listen(a,"change",()=>this.#s(a,e)),this.listen(a,"keydown",l=>{l.key==="Enter"&&this.#s(a,e)})})}#s(t,e){let s=t.getAttribute("data-token"),o=t.value.trim();if(!s||!o)return;let r=this.#r(),i=`${e}${s}`;r&&r.style.setProperty(i,o),this.dispatchEvent(new CustomEvent("token-specimen:change",{bubbles:!0,detail:{name:s,value:o,token:i,target:this.getAttribute("target")||":root"}}))}#r(){let t=this.getAttribute("target")||":root";try{return t===":root"?document.documentElement:document.querySelector(t)}catch{return document.documentElement}}#o(t,e,s){let o=getComputedStyle(this);this.querySelectorAll("[data-token-value]").forEach(r=>{let i=r.dataset.tokenValue,a=o.getPropertyValue(`${e}${i}`).trim();if(t==="radius"||t==="size"){let l=this.querySelector(`[data-token-sample="${i}"]`);if(l){let c=t==="radius"?"borderRadius":"width",m=t==="size"?l.getBoundingClientRect().width:null;r.textContent=m!=null?`${Math.round(m*100)/100}px`:a||"\u2014"}}else r.textContent=a||"\u2014"})}};function pt(n,t,e){let s='<div role="list" style="display:flex;flex-wrap:wrap;gap:1rem;align-items:end">';for(let o of n)s+=`<div role="listitem" style="text-align:center">
+        ${u}
+      </div>`}a+="</div>",this.innerHTML=a,requestAnimationFrame(()=>{if(r){let l=getComputedStyle(this);this.querySelectorAll(".scale-edit").forEach(c=>{let u=c.getAttribute("data-token"),p=l.getPropertyValue(`${e}${u}`).trim();c.value=p||""})}else s&&this.querySelectorAll(".scale-bar").forEach(l=>{let c=l.getBoundingClientRect().width,u=l.nextElementSibling;u&&(u.textContent=`${Math.round(c*100)/100}px`)})})}#e(){if(!this.hasAttribute("editable"))return;let t=this.getAttribute("prefix")||"--size-";this.querySelectorAll(".scale-edit").forEach(e=>{this.listen(e,"change",()=>this.#s(e,t)),this.listen(e,"keydown",s=>{s.key==="Enter"&&this.#s(e,t)})})}#s(t,e){let s=t.getAttribute("data-token"),o=t.value.trim();if(!s||!o)return;let r=this.#r(),i=`${e}${s}`;r&&r.style.setProperty(i,o),this.dispatchEvent(new CustomEvent("spacing-specimen:change",{bubbles:!0,detail:{name:s,value:o,token:i,target:this.getAttribute("target")||":root"}}))}#r(){let t=this.getAttribute("target")||":root";try{return t===":root"?document.documentElement:document.querySelector(t)}catch{return document.documentElement}}};h("spacing-specimen",M);var X={shadow:{prefix:"--shadow-",tokens:"xs,s,m,l,xl,2xl"},radius:{prefix:"--radius-",tokens:"xs,s,m,l,xl,2xl,full"},border:{prefix:"--border-width-",tokens:"thin,medium,thick"},color:{prefix:"--color-",tokens:"primary,secondary,accent,success,warning,error,info"},size:{prefix:"--size-",tokens:"3xs,2xs,xs,s,m,l,xl,2xl,3xl"},icon:{prefix:"",tokens:"home,search,settings,user,bell,heart,star,check,x,chevron-right,menu,trash"}},Y={shadow:pt,radius:ft,border:ht,color:bt,size:gt,icon:yt},L=class extends m{static observedAttributes=["type","tokens","prefix","show-values","label","size","icon-set","editable","target"];setup(){this.#t()}attributeChangedCallback(){this.isConnected&&this.#t()}#t(){let t=this.getAttribute("type")||"shadow",e=X[t]||X.shadow,s=this.getAttribute("prefix")||e.prefix,o=this.getAttribute("tokens")||e.tokens,r=this.getAttribute("show-values")!=="false",i=this.getAttribute("label")||"",a=o.split(",").map(p=>p.trim()),l=Y[t]||Y.shadow,c="";i&&(c+=`<p style="font-size:0.75rem;font-weight:700;text-transform:uppercase;letter-spacing:0.08em;color:var(--color-text-muted,#666);margin-block-end:0.75rem;font-family:var(--font-sans,system-ui)">${i}</p>`),c+=l(a,s,r,this),this.innerHTML=c;let u=this.hasAttribute("editable")&&t!=="icon";r&&t!=="icon"?requestAnimationFrame(()=>{this.#o(t,s,a),u&&this.#e(t,s)}):u&&requestAnimationFrame(()=>this.#e(t,s))}#e(t,e){let s=getComputedStyle(this);this.querySelectorAll("[data-token-value]").forEach(o=>{let r=o.dataset.tokenValue,i=s.getPropertyValue(`${e}${r}`).trim(),a=document.createElement("input");a.type=t==="color"&&/^#[0-9a-f]{3,8}$/i.test(i)?"color":"text",a.value=i||"",a.className="ts-edit",a.setAttribute("data-token",r),a.setAttribute("aria-label",`${r} value`),a.style.cssText=`font-family:var(--font-mono,monospace);font-size:0.625rem;padding:0.125rem 0.25rem;border:1px solid var(--color-border,#ccc);border-radius:var(--radius-s,0.25rem);background:var(--color-surface,#fff);color:var(--color-text,#222);inline-size:${t==="color"?"3rem":"100%"};${t==="color"?"block-size:1.5rem;padding:0;":"max-inline-size:8rem;"}`,o.replaceWith(a),this.listen(a,"change",()=>this.#s(a,e)),this.listen(a,"keydown",l=>{l.key==="Enter"&&this.#s(a,e)})})}#s(t,e){let s=t.getAttribute("data-token"),o=t.value.trim();if(!s||!o)return;let r=this.#r(),i=`${e}${s}`;r&&r.style.setProperty(i,o),this.dispatchEvent(new CustomEvent("token-specimen:change",{bubbles:!0,detail:{name:s,value:o,token:i,target:this.getAttribute("target")||":root"}}))}#r(){let t=this.getAttribute("target")||":root";try{return t===":root"?document.documentElement:document.querySelector(t)}catch{return document.documentElement}}#o(t,e,s){let o=getComputedStyle(this);this.querySelectorAll("[data-token-value]").forEach(r=>{let i=r.dataset.tokenValue,a=o.getPropertyValue(`${e}${i}`).trim();if(t==="radius"||t==="size"){let l=this.querySelector(`[data-token-sample="${i}"]`);if(l){let c=t==="radius"?"borderRadius":"width",u=t==="size"?l.getBoundingClientRect().width:null;r.textContent=u!=null?`${Math.round(u*100)/100}px`:a||"\u2014"}}else r.textContent=a||"\u2014"})}};function pt(n,t,e){let s='<div role="list" style="display:flex;flex-wrap:wrap;gap:1rem;align-items:end">';for(let o of n)s+=`<div role="listitem" style="text-align:center">
       <div style="width:7rem;height:5rem;background:var(--color-surface,#fff);border-radius:var(--radius-m,0.5rem);box-shadow:var(${t}${o})" aria-hidden="true"></div>
       <p style="font-family:var(--font-mono,monospace);font-size:0.75rem;color:var(--color-text-muted,#666);margin-block-start:0.5rem">${o}</p>
       ${e?`<p data-token-value="${o}" style="font-family:var(--font-mono,monospace);font-size:0.625rem;color:var(--color-text-muted,#999);max-width:7rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap"></p>`:""}
@@ -97,10 +97,10 @@ var Ft=window.matchMedia("(prefers-reduced-motion: reduce)");var K=new Map;funct
       <progress value="100" max="100">100%</progress>
     </layout-stack>`,range:()=>`
     <input type="range" min="0" max="100" value="50" aria-label="Sample range"/>`,textarea:()=>`
-    <textarea rows="3" placeholder="Textarea sample" aria-label="Sample textarea" style="width:100%"></textarea>`},q=class extends u{static observedAttributes=["components","label","compact"];setup(){this.#t()}attributeChangedCallback(){this.isConnected&&this.#t()}#t(){let t=this.getAttribute("components")||"button,input,select,checkbox,radio,badge,progress",e=this.getAttribute("label")||"",s=this.hasAttribute("compact"),o=t.split(",").map(a=>a.trim()),r=s?"0.75rem":"1.25rem",i="";e&&(i+=`<p style="font-size:0.75rem;font-weight:700;text-transform:uppercase;letter-spacing:0.08em;color:var(--color-text-muted,#666);margin-block-end:0.75rem;font-family:var(--font-sans,system-ui)">${e}</p>`),i+=`<section style="display:grid;grid-template-columns:repeat(auto-fit,minmax(14rem,1fr));gap:${r}">`;for(let a of o){let l=vt[a];l&&(i+=`<article style="border:1px solid var(--color-border,#ddd);border-radius:var(--radius-m,0.5rem);padding:var(--size-m,1rem);background:var(--color-surface,#fff)">
+    <textarea rows="3" placeholder="Textarea sample" aria-label="Sample textarea" style="width:100%"></textarea>`},q=class extends m{static observedAttributes=["components","label","compact"];setup(){this.#t()}attributeChangedCallback(){this.isConnected&&this.#t()}#t(){let t=this.getAttribute("components")||"button,input,select,checkbox,radio,badge,progress",e=this.getAttribute("label")||"",s=this.hasAttribute("compact"),o=t.split(",").map(a=>a.trim()),r=s?"0.75rem":"1.25rem",i="";e&&(i+=`<p style="font-size:0.75rem;font-weight:700;text-transform:uppercase;letter-spacing:0.08em;color:var(--color-text-muted,#666);margin-block-end:0.75rem;font-family:var(--font-sans,system-ui)">${e}</p>`),i+=`<section style="display:grid;grid-template-columns:repeat(auto-fit,minmax(14rem,1fr));gap:${r}">`;for(let a of o){let l=vt[a];l&&(i+=`<article style="border:1px solid var(--color-border,#ddd);border-radius:var(--radius-m,0.5rem);padding:var(--size-m,1rem);background:var(--color-surface,#fff)">
         <p style="font-size:0.625rem;font-weight:700;text-transform:uppercase;letter-spacing:0.08em;color:var(--color-text-muted,#999);margin-block-end:var(--size-s,0.5rem);font-family:var(--font-sans,system-ui)">${a}</p>
         ${l()}
-      </article>`)}i+="</section>",this.innerHTML=i}};h("component-sampler",q);function xt(n,t,e){t/=100,e/=100;let s=i=>(i+n/30)%12,o=t*Math.min(e,1-e),r=i=>e-o*Math.max(-1,Math.min(s(i)-3,9-s(i),1));return{r:Math.round(r(0)*255),g:Math.round(r(8)*255),b:Math.round(r(4)*255)}}function $t(n,t,e){n/=255,t/=255,e/=255;let s=Math.max(n,t,e),o=Math.min(n,t,e),r=(s+o)/2,i=0,a=0;if(s!==o){let l=s-o;switch(a=r>.5?l/(2-s-o):l/(s+o),s){case n:i=((t-e)/l+(t<e?6:0))/6;break;case t:i=((e-n)/l+2)/6;break;case e:i=((n-t)/l+4)/6;break}}return{h:Math.round(i*360),s:Math.round(a*100),l:Math.round(r*100)}}function A(n){n=n.replace(/^#/,""),n.length===3&&(n=n[0]+n[0]+n[1]+n[1]+n[2]+n[2]);let t=parseInt(n,16);return{r:t>>16&255,g:t>>8&255,b:t&255}}function S(n,t,e){return"#"+[n,t,e].map(s=>Math.max(0,Math.min(255,Math.round(s))).toString(16).padStart(2,"0")).join("")}function G(n){let{r:t,g:e,b:s}=A(n);return $t(t,e,s)}function f(n,t,e){let{r:s,g:o,b:r}=xt(n,t,e);return S(s,o,r)}var B=n=>n<=.04045?n/12.92:Math.pow((n+.055)/1.055,2.4),R=n=>n<=.0031308?12.92*n:1.055*Math.pow(n,1/2.4)-.055,O=n=>n<0?0:n>1?1:n;function w(n){let{r:t,g:e,b:s}=A(n),o=B(t/255),r=B(e/255),i=B(s/255),a=.4122214708*o+.5363325363*r+.0514459929*i,l=.2119034982*o+.6806995451*r+.1073969566*i,c=.0883024619*o+.2817188376*r+.6299787005*i,m=Math.cbrt(a),p=Math.cbrt(l),d=Math.cbrt(c),x=.2104542553*m+.793617785*p-.0040720468*d,b=1.9779984951*m-2.428592205*p+.4505937099*d,y=.0259040371*m+.7827717662*p-.808675766*d,g=Math.sqrt(b*b+y*y),$=Math.atan2(y,b)*180/Math.PI;return $<0&&($+=360),{l:x,c:g,h:$}}function z(n,t,e){let s=e*Math.PI/180,o=t*Math.cos(s),r=t*Math.sin(s),i=n+.3963377774*o+.2158037573*r,a=n-.1055613458*o-.0638541728*r,l=n-.0894841775*o-1.291485548*r,c=i*i*i,m=a*a*a,p=l*l*l,d=4.0767416621*c-3.3077115913*m+.2309699292*p,x=-1.2684380046*c+2.6097574011*m-.3413193965*p,b=-.0041960863*c-.7034186147*m+1.707614701*p,y=O(R(d)),g=O(R(x)),$=O(R(b));return S(Math.round(y*255),Math.round(g*255),Math.round($*255))}function N(n,t){if(!n)return null;let e=String(n).trim();if(/^#[0-9a-f]{6}$/i.test(e))return e.toLowerCase();if(/^#[0-9a-f]{3}$/i.test(e))return("#"+e.slice(1).split("").map(i=>i+i).join("")).toLowerCase();if(typeof document>"u")return null;let s=t||document.createElement("span");t||(s.style.display="none",document.body.appendChild(s)),s.style.color="",s.style.color=e;let o=getComputedStyle(s).color;t||s.remove();let r=o.match(/rgba?\(\s*([0-9.]+)[\s,]+([0-9.]+)[\s,]+([0-9.]+)/);return r?S(Math.round(+r[1]),Math.round(+r[2]),Math.round(+r[3])):null}function Q({l:n,c:t,h:e}){return`oklch(${(n*100).toFixed(1)}% ${t.toFixed(3)} ${e.toFixed(1)})`}function j(n){let{r:t,g:e,b:s}=A(n),o=r=>{let i=r/255;return i<=.03928?i/12.92:Math.pow((i+.055)/1.055,2.4)};return .2126*o(t)+.7152*o(e)+.0722*o(s)}function Z(n,t){let e=j(n),s=j(t),o=Math.max(e,s),r=Math.min(e,s);return(o+.05)/(r+.05)}function tt(n){return n>=7?"AAA":n>=4.5?"AA":"Fail"}function V(n){return j(n)>.4?"#000000":"#ffffff"}var v=n=>(n%360+360)%360;function kt(n,t,e){return{colors:[f(n,t,e),f(v(n+180),t,e)],names:["Base","Complement"]}}function wt(n,t,e){return{colors:[f(v(n-30),t,e),f(n,t,e),f(v(n+30),t,e)],names:["Analog A","Base","Analog B"]}}function zt(n,t,e){return{colors:[f(n,t,e),f(v(n+120),t,e),f(v(n+240),t,e)],names:["Base","Triad A","Triad B"]}}function At(n,t,e){return{colors:[f(n,t,e),f(v(n+150),t,e),f(v(n+210),t,e)],names:["Base","Split A","Split B"]}}function St(n,t,e){return{colors:[f(n,t,e),f(v(n+90),t,e),f(v(n+180),t,e),f(v(n+270),t,e)],names:["Base","Tetrad A","Tetrad B","Tetrad C"]}}var Et=[{label:"50",l:96},{label:"100",l:90},{label:"200",l:80},{label:"300",l:70},{label:"400",l:60},{label:"500",l:50},{label:"600",l:40},{label:"700",l:30},{label:"800",l:22},{label:"900",l:15},{label:"950",l:10}];function Ct(n,t,e){let s=[],o=[];for(let r of Et){let i=r.l>85||r.l<20?Math.max(t*.6,5):t;s.push(f(n,Math.round(i),r.l)),o.push(r.label)}return{colors:s,names:o}}var et={complementary:kt,analogous:wt,triadic:zt,"split-complementary":At,tetradic:St,monochromatic:Ct};function st(n,t){let{h:e,s,l:o}=G(n);return(et[t]||et.complementary)(e,s,o)}var E=["primary","secondary","accent"],nt=["success","warning","error","info"],Tt=[...E,...nt],ot={primary:"Primary",secondary:"Secondary",accent:"Accent",success:"Success",warning:"Warning",error:"Error",info:"Info"},Mt={aaa:{bg:"oklch(92% 0.08 145)",fg:"oklch(30% 0.12 145)"},aa:{bg:"oklch(94% 0.08 90)",fg:"oklch(35% 0.12 70)"},fail:{bg:"oklch(92% 0.08 25)",fg:"oklch(35% 0.15 25)"}},F="var(--font-mono, monospace)",H="var(--color-text-muted, #666)",D="var(--color-border, #ddd)",rt="var(--color-surface, #fff)",Lt="var(--color-text, #222)",k="var(--radius-s, 0.25rem)",qt="var(--radius-m, 0.5rem)",P=class extends u{static observedAttributes=["colors","roles","show-export","label"];#t=[];#e=[];#s=null;#r=null;#o=null;setup(){this.#o=document.createElement("span"),this.#o.style.cssText="position:absolute;visibility:hidden;pointer-events:none",this.append(this.#o),this.#s=this.querySelector("color-palette, palette-generator"),this.#a(),this.#n(),this.#c(),this.#l("init"),this.#$(),this.#p(),this.#u("init")}attributeChangedCallback(t){!this.isConnected||!this.hasAttribute("data-upgraded")||(t==="roles"&&this.#a(),t==="colors"&&this.#n(),this.#c(),this.#l("attribute"),this.#p(),this.#u("attribute"))}teardown(){this.#o?.remove(),this.#o=null}#n(){let t=this.querySelector("color-palette");if(t){if(typeof t.colors<"u"&&t.colors.length){this.#t=t.colors.slice();return}let r=(t.getAttribute("colors")||"").split(",").map(i=>i.trim()).filter(Boolean);if(r.length){this.#t=r;return}}let e=this.querySelector("palette-generator");if(e){let o=e.getAttribute("seed")||e.querySelector('input[type="color"]')?.value||"",r=e.getAttribute("harmony")||"complementary";if(o)try{let{colors:i}=st(o,r);this.#t=i.slice();return}catch{}}let s=this.getAttribute("colors")||"";this.#t=s.split(",").map(o=>o.trim()).filter(Boolean)}#a(){let e=(this.getAttribute("roles")||E.join(",")).split(",").map(s=>s.trim().toLowerCase()).filter(s=>Tt.includes(s));this.#e=e.length?e:[...E]}#i(){let t={};for(let e=0;e<this.#e.length;e++)t[this.#e[e]]=this.#t[e]||this.#t[this.#t.length-1]||"#888888";return t}#c(){let t=this.querySelector(":scope > .sp-shell");t&&t.remove();let e=this.getAttribute("label"),s=this.hasAttribute("show-export"),o=document.createElement("div");if(o.className="sp-shell",o.style.cssText="display:flex;flex-direction:column;gap:var(--size-m,1rem);margin-block-start:var(--size-s,0.75rem)",e){let i=document.createElement("p");i.style.cssText="font-weight:600;margin:0",i.textContent=e,o.append(i)}let r=document.createElement("section");r.className="sp-previews",r.setAttribute("aria-label","Role previews"),r.style.cssText="display:grid;grid-template-columns:repeat(auto-fill,minmax(min(22rem,100%),1fr));gap:var(--size-m,1rem)",o.append(r),this.#r=r,s&&o.insertAdjacentHTML("beforeend",this.#x()),this.append(o)}#l(t){if(!this.#r)return;let e=this.#i();this.#r.innerHTML=this.#e.map(s=>this.#g(s,e[s])).join("")}#g(t,e){let s=ot[t]||t,r=nt.includes(t)?this.#v(t,e):this.#y(t,e),i=`display:flex;flex-direction:column;gap:var(--size-s,0.75rem);padding:var(--size-m,1rem);border:1px solid ${D};border-radius:${qt};background:${rt};min-inline-size:0`;return`<article class="sp-card" data-role="${t}" aria-label="${s} role preview" style="${i}">
+      </article>`)}i+="</section>",this.innerHTML=i}};h("component-sampler",q);function xt(n,t,e){t/=100,e/=100;let s=i=>(i+n/30)%12,o=t*Math.min(e,1-e),r=i=>e-o*Math.max(-1,Math.min(s(i)-3,9-s(i),1));return{r:Math.round(r(0)*255),g:Math.round(r(8)*255),b:Math.round(r(4)*255)}}function $t(n,t,e){n/=255,t/=255,e/=255;let s=Math.max(n,t,e),o=Math.min(n,t,e),r=(s+o)/2,i=0,a=0;if(s!==o){let l=s-o;switch(a=r>.5?l/(2-s-o):l/(s+o),s){case n:i=((t-e)/l+(t<e?6:0))/6;break;case t:i=((e-n)/l+2)/6;break;case e:i=((n-t)/l+4)/6;break}}return{h:Math.round(i*360),s:Math.round(a*100),l:Math.round(r*100)}}function A(n){n=n.replace(/^#/,""),n.length===3&&(n=n[0]+n[0]+n[1]+n[1]+n[2]+n[2]);let t=parseInt(n,16);return{r:t>>16&255,g:t>>8&255,b:t&255}}function S(n,t,e){return"#"+[n,t,e].map(s=>Math.max(0,Math.min(255,Math.round(s))).toString(16).padStart(2,"0")).join("")}function G(n){let{r:t,g:e,b:s}=A(n);return $t(t,e,s)}function f(n,t,e){let{r:s,g:o,b:r}=xt(n,t,e);return S(s,o,r)}var B=n=>n<=.04045?n/12.92:Math.pow((n+.055)/1.055,2.4),R=n=>n<=.0031308?12.92*n:1.055*Math.pow(n,1/2.4)-.055,O=n=>n<0?0:n>1?1:n;function w(n){let{r:t,g:e,b:s}=A(n),o=B(t/255),r=B(e/255),i=B(s/255),a=.4122214708*o+.5363325363*r+.0514459929*i,l=.2119034982*o+.6806995451*r+.1073969566*i,c=.0883024619*o+.2817188376*r+.6299787005*i,u=Math.cbrt(a),p=Math.cbrt(l),d=Math.cbrt(c),x=.2104542553*u+.793617785*p-.0040720468*d,b=1.9779984951*u-2.428592205*p+.4505937099*d,y=.0259040371*u+.7827717662*p-.808675766*d,g=Math.sqrt(b*b+y*y),$=Math.atan2(y,b)*180/Math.PI;return $<0&&($+=360),{l:x,c:g,h:$}}function z(n,t,e){let s=e*Math.PI/180,o=t*Math.cos(s),r=t*Math.sin(s),i=n+.3963377774*o+.2158037573*r,a=n-.1055613458*o-.0638541728*r,l=n-.0894841775*o-1.291485548*r,c=i*i*i,u=a*a*a,p=l*l*l,d=4.0767416621*c-3.3077115913*u+.2309699292*p,x=-1.2684380046*c+2.6097574011*u-.3413193965*p,b=-.0041960863*c-.7034186147*u+1.707614701*p,y=O(R(d)),g=O(R(x)),$=O(R(b));return S(Math.round(y*255),Math.round(g*255),Math.round($*255))}function N(n,t){if(!n)return null;let e=String(n).trim();if(/^#[0-9a-f]{6}$/i.test(e))return e.toLowerCase();if(/^#[0-9a-f]{3}$/i.test(e))return("#"+e.slice(1).split("").map(i=>i+i).join("")).toLowerCase();if(typeof document>"u")return null;let s=t||document.createElement("span");t||(s.style.display="none",document.body.appendChild(s)),s.style.color="",s.style.color=e;let o=getComputedStyle(s).color;t||s.remove();let r=o.match(/rgba?\(\s*([0-9.]+)[\s,]+([0-9.]+)[\s,]+([0-9.]+)/);return r?S(Math.round(+r[1]),Math.round(+r[2]),Math.round(+r[3])):null}function Q({l:n,c:t,h:e}){return`oklch(${(n*100).toFixed(1)}% ${t.toFixed(3)} ${e.toFixed(1)})`}function j(n){let{r:t,g:e,b:s}=A(n),o=r=>{let i=r/255;return i<=.03928?i/12.92:Math.pow((i+.055)/1.055,2.4)};return .2126*o(t)+.7152*o(e)+.0722*o(s)}function Z(n,t){let e=j(n),s=j(t),o=Math.max(e,s),r=Math.min(e,s);return(o+.05)/(r+.05)}function tt(n){return n>=7?"AAA":n>=4.5?"AA":"Fail"}function V(n){return j(n)>.4?"#000000":"#ffffff"}var v=n=>(n%360+360)%360;function kt(n,t,e){return{colors:[f(n,t,e),f(v(n+180),t,e)],names:["Base","Complement"]}}function wt(n,t,e){return{colors:[f(v(n-30),t,e),f(n,t,e),f(v(n+30),t,e)],names:["Analog A","Base","Analog B"]}}function zt(n,t,e){return{colors:[f(n,t,e),f(v(n+120),t,e),f(v(n+240),t,e)],names:["Base","Triad A","Triad B"]}}function At(n,t,e){return{colors:[f(n,t,e),f(v(n+150),t,e),f(v(n+210),t,e)],names:["Base","Split A","Split B"]}}function St(n,t,e){return{colors:[f(n,t,e),f(v(n+90),t,e),f(v(n+180),t,e),f(v(n+270),t,e)],names:["Base","Tetrad A","Tetrad B","Tetrad C"]}}var Et=[{label:"50",l:96},{label:"100",l:90},{label:"200",l:80},{label:"300",l:70},{label:"400",l:60},{label:"500",l:50},{label:"600",l:40},{label:"700",l:30},{label:"800",l:22},{label:"900",l:15},{label:"950",l:10}];function Ct(n,t,e){let s=[],o=[];for(let r of Et){let i=r.l>85||r.l<20?Math.max(t*.6,5):t;s.push(f(n,Math.round(i),r.l)),o.push(r.label)}return{colors:s,names:o}}var et={complementary:kt,analogous:wt,triadic:zt,"split-complementary":At,tetradic:St,monochromatic:Ct};function st(n,t){let{h:e,s,l:o}=G(n);return(et[t]||et.complementary)(e,s,o)}var E=["primary","secondary","accent"],nt=["success","warning","error","info"],Tt=[...E,...nt],ot={primary:"Primary",secondary:"Secondary",accent:"Accent",success:"Success",warning:"Warning",error:"Error",info:"Info"},Mt={aaa:{bg:"oklch(92% 0.08 145)",fg:"oklch(30% 0.12 145)"},aa:{bg:"oklch(94% 0.08 90)",fg:"oklch(35% 0.12 70)"},fail:{bg:"oklch(92% 0.08 25)",fg:"oklch(35% 0.15 25)"}},F="var(--font-mono, monospace)",H="var(--color-text-muted, #666)",D="var(--color-border, #ddd)",rt="var(--color-surface, #fff)",Lt="var(--color-text, #222)",k="var(--radius-s, 0.25rem)",qt="var(--radius-m, 0.5rem)",P=class extends m{static observedAttributes=["colors","roles","show-export","label"];#t=[];#e=[];#s=null;#r=null;#o=null;setup(){this.#o=document.createElement("span"),this.#o.style.cssText="position:absolute;visibility:hidden;pointer-events:none",this.append(this.#o),this.#s=this.querySelector("color-palette, palette-generator"),this.#a(),this.#n(),this.#c(),this.#l("init"),this.#$(),this.#p(),this.#m("init")}attributeChangedCallback(t){!this.isConnected||!this.hasAttribute("data-upgraded")||(t==="roles"&&this.#a(),t==="colors"&&this.#n(),this.#c(),this.#l("attribute"),this.#p(),this.#m("attribute"))}teardown(){this.#o?.remove(),this.#o=null}#n(){let t=this.querySelector("color-palette");if(t){if(typeof t.colors<"u"&&t.colors.length){this.#t=t.colors.slice();return}let r=(t.getAttribute("colors")||"").split(",").map(i=>i.trim()).filter(Boolean);if(r.length){this.#t=r;return}}let e=this.querySelector("palette-generator");if(e){let o=e.getAttribute("seed")||e.querySelector('input[type="color"]')?.value||"",r=e.getAttribute("harmony")||"complementary";if(o)try{let{colors:i}=st(o,r);this.#t=i.slice();return}catch{}}let s=this.getAttribute("colors")||"";this.#t=s.split(",").map(o=>o.trim()).filter(Boolean)}#a(){let e=(this.getAttribute("roles")||E.join(",")).split(",").map(s=>s.trim().toLowerCase()).filter(s=>Tt.includes(s));this.#e=e.length?e:[...E]}#i(){let t={};for(let e=0;e<this.#e.length;e++)t[this.#e[e]]=this.#t[e]||this.#t[this.#t.length-1]||"#888888";return t}#c(){let t=this.querySelector(":scope > .sp-shell");t&&t.remove();let e=this.getAttribute("label"),s=this.hasAttribute("show-export"),o=document.createElement("div");if(o.className="sp-shell",o.style.cssText="display:flex;flex-direction:column;gap:var(--size-m,1rem);margin-block-start:var(--size-s,0.75rem)",e){let i=document.createElement("p");i.style.cssText="font-weight:600;margin:0",i.textContent=e,o.append(i)}let r=document.createElement("section");r.className="sp-previews",r.setAttribute("aria-label","Role previews"),r.style.cssText="display:grid;grid-template-columns:repeat(auto-fill,minmax(min(22rem,100%),1fr));gap:var(--size-m,1rem)",o.append(r),this.#r=r,s&&o.insertAdjacentHTML("beforeend",this.#x()),this.append(o)}#l(t){if(!this.#r)return;let e=this.#i();this.#r.innerHTML=this.#e.map(s=>this.#g(s,e[s])).join("")}#g(t,e){let s=ot[t]||t,r=nt.includes(t)?this.#v(t,e):this.#y(t,e),i=`display:flex;flex-direction:column;gap:var(--size-s,0.75rem);padding:var(--size-m,1rem);border:1px solid ${D};border-radius:${qt};background:${rt};min-inline-size:0`;return`<article class="sp-card" data-role="${t}" aria-label="${s} role preview" style="${i}">
       <header style="display:flex;align-items:center;justify-content:space-between;gap:var(--size-s,0.75rem)">
         <div>
           <code style="font-family:${F};font-size:var(--font-size-sm,0.875rem);font-weight:600">${t}</code>
@@ -115,27 +115,27 @@ var Ft=window.matchMedia("(prefers-reduced-motion: reduce)");var K=new Map;funct
     </article>`}#y(t,e){let s=this.#k(t,e),o=this.#f(),r=this.#w(t,e),i=this.#S(e);return[this.#d({render:`<button type="button" tabindex="-1" style="all:unset;display:inline-block;padding:0.375rem 0.875rem;border-radius:${k};background:${e};color:${s};font-family:inherit;font-size:var(--font-size-sm,0.875rem);font-weight:600;cursor:default">Button</button>`,fg:s,bg:e,caption:"On role"}),this.#d({render:`<span style="color:${e};background:${o};padding:0.25rem 0.5rem;border-radius:${k};font-size:var(--font-size-sm,0.875rem);font-weight:500;text-decoration:underline">Linked text</span>`,fg:e,bg:o||"#ffffff",caption:"On surface"}),this.#d({render:`<span style="display:inline-block;padding:0.125rem 0.5rem;border-radius:999px;background:${r};color:${i};font-size:var(--font-size-xs,0.75rem);font-weight:600;letter-spacing:0.04em;text-transform:uppercase">Badge</span>`,fg:i,bg:r,caption:"Subtle"})].join("")}#v(t,e){let s=this.#f(),o=this.#z(t,e),r=this.#A(t,e),i=V(e);return[this.#d({render:`<div style="display:flex;align-items:center;gap:0.5rem;padding:0.5rem 0.75rem;border-radius:${k};background:${o};color:${r};border:1px solid ${e};font-size:var(--font-size-sm,0.875rem);max-inline-size:100%">
           <span style="display:inline-block;inline-size:0.5rem;block-size:0.5rem;border-radius:50%;background:${e};flex-shrink:0"></span>
           <span><strong>${ot[t]||t}</strong> \u2014 message text</span>
-        </div>`,fg:r,bg:o,caption:"Alert"}),this.#d({render:`<span style="display:inline-block;padding:0.125rem 0.5rem;border-radius:999px;background:${e};color:${i};font-size:var(--font-size-xs,0.75rem);font-weight:700;letter-spacing:0.04em;text-transform:uppercase">${t}</span>`,fg:i,bg:e,caption:"Badge"}),this.#d({render:`<span style="color:${e};background:${s};padding:0.25rem 0.5rem;border-radius:${k};font-size:var(--font-size-sm,0.875rem);font-weight:600">Inline status</span>`,fg:e,bg:s||"#ffffff",caption:"On surface"})].join("")}#d({render:t,fg:e,bg:s,caption:o}){let r=N(e,this.#o)||"#000000",i=N(s,this.#o)||"#ffffff",a=Z(r,i),l=tt(a).toLowerCase(),c=Mt[l],m=`display:inline-flex;align-items:center;gap:0.25rem;padding:0.125rem 0.375rem;border-radius:${k};font-family:${F};font-size:var(--font-size-xs,0.75rem);background:${c.bg};color:${c.fg}`;return`<div style="display:flex;flex-direction:column;gap:0.25rem;align-items:flex-start;min-inline-size:0;max-inline-size:100%">
+        </div>`,fg:r,bg:o,caption:"Alert"}),this.#d({render:`<span style="display:inline-block;padding:0.125rem 0.5rem;border-radius:999px;background:${e};color:${i};font-size:var(--font-size-xs,0.75rem);font-weight:700;letter-spacing:0.04em;text-transform:uppercase">${t}</span>`,fg:i,bg:e,caption:"Badge"}),this.#d({render:`<span style="color:${e};background:${s};padding:0.25rem 0.5rem;border-radius:${k};font-size:var(--font-size-sm,0.875rem);font-weight:600">Inline status</span>`,fg:e,bg:s||"#ffffff",caption:"On surface"})].join("")}#d({render:t,fg:e,bg:s,caption:o}){let r=N(e,this.#o)||"#000000",i=N(s,this.#o)||"#ffffff",a=Z(r,i),l=tt(a).toLowerCase(),c=Mt[l],u=`display:inline-flex;align-items:center;gap:0.25rem;padding:0.125rem 0.375rem;border-radius:${k};font-family:${F};font-size:var(--font-size-xs,0.75rem);background:${c.bg};color:${c.fg}`;return`<div style="display:flex;flex-direction:column;gap:0.25rem;align-items:flex-start;min-inline-size:0;max-inline-size:100%">
       <div style="max-inline-size:100%">${t}</div>
       <div style="display:flex;align-items:center;gap:0.375rem;font-size:var(--font-size-xs,0.75rem);color:${H}">
-        <span style="${m}" title="${o}: ${a.toFixed(2)}:1">${a.toFixed(2)} <small>${l.toUpperCase()}</small></span>
+        <span style="${u}" title="${o}: ${a.toFixed(2)}:1">${a.toFixed(2)} <small>${l.toUpperCase()}</small></span>
         <span>${o}</span>
       </div>
     </div>`}#x(){let t=`display:flex;gap:var(--size-2xs,0.375rem);padding-block-start:var(--size-xs,0.5rem);border-block-start:1px solid ${D}`,e=`padding:0.375rem 0.875rem;border:1px solid ${D};border-radius:${k};background:${rt};color:${Lt};cursor:pointer;font:inherit;font-size:var(--font-size-sm,0.875rem)`;return`<div class="sp-export" role="toolbar" aria-label="Export semantic palette" style="${t}">
       <button type="button" class="sp-copy-css" style="${e}">Copy Theme CSS</button>
       <button type="button" class="sp-copy-json" style="${e}">Copy JSON</button>
-    </div>`}#$(){let t=this.querySelector("color-palette");t&&this.listen(t,"color-palette:change",()=>{this.#n(),this.#l("palette"),this.#u("palette")});let e=this.querySelector("palette-generator");e&&this.listen(e,"palette-generator:generate",()=>{this.#n(),this.#l("palette"),this.#u("palette")})}#p(){let t=this.querySelector(".sp-copy-css"),e=this.querySelector(".sp-copy-json");t&&this.listen(t,"click",()=>{navigator.clipboard?.writeText(this.#h()),this.#b(t,"Copy Theme CSS")}),e&&this.listen(e,"click",()=>{navigator.clipboard?.writeText(JSON.stringify(this.#i(),null,2)),this.#b(e,"Copy JSON")})}#m(){return getComputedStyle(this)}#f(){return this.#m().getPropertyValue("--color-surface").trim()||"#ffffff"}#k(t,e){return this.#m().getPropertyValue(`--color-text-on-${t}`).trim()||V(e)}#w(t,e){let s=this.#m().getPropertyValue(`--color-${t}-subtle`).trim();if(s)return s;let{h:o}=w(e);return z(.95,.03,o)}#z(t,e){let s=this.#m().getPropertyValue(`--color-${t}-subtle`).trim();if(s)return s;let{h:o}=w(e);return z(.94,.05,o)}#A(t,e){let s=this.#m().getPropertyValue(`--color-${t}-text`).trim();if(s)return s;let{h:o}=w(e);return z(.3,.14,o)}#S(t){let{l:e,c:s,h:o}=w(t);return z(Math.max(.2,e-.25),s,o)}#h(){let t=this.#i(),e=[],s=[];for(let r of this.#e){let i=t[r];if(!i)continue;let{l:a,c:l,h:c}=w(i);E.includes(r)?e.push(`  --hue-${r}: ${c.toFixed(1)};`,`  --lightness-${r}: ${(a*100).toFixed(1)}%;`,`  --chroma-${r}: ${l.toFixed(3)};`):s.push(`  --color-${r}: ${Q({l:a,c:l,h:c})};`)}let o=[];return e.length&&o.push("  /* Brand seeds */",...e),s.length&&(e.length&&o.push(""),o.push("  /* Status colors */",...s)),`:root {
+    </div>`}#$(){let t=this.querySelector("color-palette");t&&this.listen(t,"color-palette:change",()=>{this.#n(),this.#l("palette"),this.#m("palette")});let e=this.querySelector("palette-generator");e&&this.listen(e,"palette-generator:generate",()=>{this.#n(),this.#l("palette"),this.#m("palette")})}#p(){let t=this.querySelector(".sp-copy-css"),e=this.querySelector(".sp-copy-json");t&&this.listen(t,"click",()=>{navigator.clipboard?.writeText(this.#h()),this.#b(t,"Copy Theme CSS")}),e&&this.listen(e,"click",()=>{navigator.clipboard?.writeText(JSON.stringify(this.#i(),null,2)),this.#b(e,"Copy JSON")})}#u(){return getComputedStyle(this)}#f(){return this.#u().getPropertyValue("--color-surface").trim()||"#ffffff"}#k(t,e){return this.#u().getPropertyValue(`--color-text-on-${t}`).trim()||V(e)}#w(t,e){let s=this.#u().getPropertyValue(`--color-${t}-subtle`).trim();if(s)return s;let{h:o}=w(e);return z(.95,.03,o)}#z(t,e){let s=this.#u().getPropertyValue(`--color-${t}-subtle`).trim();if(s)return s;let{h:o}=w(e);return z(.94,.05,o)}#A(t,e){let s=this.#u().getPropertyValue(`--color-${t}-text`).trim();if(s)return s;let{h:o}=w(e);return z(.3,.14,o)}#S(t){let{l:e,c:s,h:o}=w(t);return z(Math.max(.2,e-.25),s,o)}#h(){let t=this.#i(),e=[],s=[];for(let r of this.#e){let i=t[r];if(!i)continue;let{l:a,c:l,h:c}=w(i);E.includes(r)?e.push(`  --hue-${r}: ${c.toFixed(1)};`,`  --lightness-${r}: ${(a*100).toFixed(1)}%;`,`  --chroma-${r}: ${l.toFixed(3)};`):s.push(`  --color-${r}: ${Q({l:a,c:l,h:c})};`)}let o=[];return e.length&&o.push("  /* Brand seeds */",...e),s.length&&(e.length&&o.push(""),o.push("  /* Status colors */",...s)),`:root {
 ${o.join(`
 `)}
 }
-`}#b(t,e){t.textContent="Copied!",setTimeout(()=>{t.textContent=e},1500)}#u(t){this.dispatchEvent(new CustomEvent("semantic-palette:change",{bubbles:!0,detail:{mapping:this.#i(),tokens:this.#h(),source:t}}))}};h("semantic-palette",P);var Bt="1,2,3,4,5,in-1,in-2,in-3,out-1,out-2,out-3,out-4,out-5,elastic-1,elastic-2,squish-1,squish-2",Rt="instant,fast,normal,slow,slower",it="ms-keyframes",Ot=`
+`}#b(t,e){t.textContent="Copied!",setTimeout(()=>{t.textContent=e},1500)}#m(t){this.dispatchEvent(new CustomEvent("semantic-palette:change",{bubbles:!0,detail:{mapping:this.#i(),tokens:this.#h(),source:t}}))}};h("semantic-palette",P);var Bt="1,2,3,4,5,in-1,in-2,in-3,out-1,out-2,out-3,out-4,out-5,elastic-1,elastic-2,squish-1,squish-2",Rt="instant,fast,normal,slow,slower",it="ms-keyframes",Ot=`
 @keyframes ms-slide { from { inset-inline-start: 0 } to { inset-inline-start: calc(100% - 1rem) } }
 @keyframes ms-fill { 0% { transform: scaleX(0) } 60% { transform: scaleX(1) } 100% { transform: scaleX(1); opacity: 0.3 } }
 @media (prefers-reduced-motion: reduce) {
   motion-specimen .ms-dot { animation: none !important; inset-inline-start: calc(50% - 0.5rem) !important }
   motion-specimen .ms-bar-fill { animation: none !important; transform: scaleX(0.6) !important; opacity: 0.6 !important }
 }
-`;function jt(){if(typeof document>"u"||document.getElementById(it))return;let n=document.createElement("style");n.id=it,n.textContent=Ot,document.head.append(n)}var at="var(--font-mono, monospace)",lt="var(--color-text-muted, #666)",ct="var(--color-interactive, oklch(55% 0.2 260))",dt="var(--color-surface-sunken, #f1f1f1)",I=class extends u{static observedAttributes=["type","tokens","prefix","duration","show-values","label"];setup(){jt(),this.#t()}attributeChangedCallback(){this.isConnected&&this.hasAttribute("data-upgraded")&&this.#t()}#t(){let t=this.getAttribute("type")||"easing",e=this.getAttribute("duration")||"1.2s",s=this.getAttribute("show-values")!=="false",o=this.getAttribute("label")||"",r="";o&&(r+=`<p style="font-weight:600;margin:0 0 var(--size-s,0.75rem)">${o}</p>`),(t==="easing"||t==="both")&&(r+=this.#n(e,s)),(t==="duration"||t==="both")&&(t==="both"&&(r+='<div aria-hidden="true" style="block-size:var(--size-m,1rem)"></div>'),r+=this.#a(s)),this.innerHTML=r,s&&requestAnimationFrame(()=>this.#i())}#e(){return"display:grid;grid-template-columns:5rem 1fr auto;align-items:center;gap:var(--size-s,0.75rem);min-block-size:1.75rem"}#s(){return`font-family:${at};font-size:var(--font-size-sm,0.875rem);color:${lt};text-align:end`}#r(){return`font-family:${at};font-size:var(--font-size-xs,0.75rem);color:${lt};font-variant-numeric:tabular-nums;white-space:nowrap`}#o(){return"list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--size-2xs,0.375rem)"}#n(t,e){let s=(this.getAttribute("tokens")||Bt).split(",").map(l=>l.trim()),o=this.getAttribute("prefix")||"--ease-",r=`position:relative;display:block;block-size:0.5rem;background:${dt};border-radius:999px`,i=`position:absolute;inset-block-start:50%;inset-inline-start:0;inline-size:1rem;block-size:1rem;background:${ct};border-radius:50%;transform:translateY(-50%)`,a=s.map(l=>{let c=`${o}${l}`;return`<li class="ms-row ms-row-ease" role="listitem" style="${this.#e()}">
+`;function jt(){if(typeof document>"u"||document.getElementById(it))return;let n=document.createElement("style");n.id=it,n.textContent=Ot,document.head.append(n)}var at="var(--font-mono, monospace)",lt="var(--color-text-muted, #666)",ct="var(--color-interactive, oklch(55% 0.2 260))",dt="var(--color-surface-sunken, #f1f1f1)",I=class extends m{static observedAttributes=["type","tokens","prefix","duration","show-values","label"];setup(){jt(),this.#t()}attributeChangedCallback(){this.isConnected&&this.hasAttribute("data-upgraded")&&this.#t()}#t(){let t=this.getAttribute("type")||"easing",e=this.getAttribute("duration")||"1.2s",s=this.getAttribute("show-values")!=="false",o=this.getAttribute("label")||"",r="";o&&(r+=`<p style="font-weight:600;margin:0 0 var(--size-s,0.75rem)">${o}</p>`),(t==="easing"||t==="both")&&(r+=this.#n(e,s)),(t==="duration"||t==="both")&&(t==="both"&&(r+='<div aria-hidden="true" style="block-size:var(--size-m,1rem)"></div>'),r+=this.#a(s)),this.innerHTML=r,s&&requestAnimationFrame(()=>this.#i())}#e(){return"display:grid;grid-template-columns:5rem 1fr auto;align-items:center;gap:var(--size-s,0.75rem);min-block-size:1.75rem"}#s(){return`font-family:${at};font-size:var(--font-size-sm,0.875rem);color:${lt};text-align:end`}#r(){return`font-family:${at};font-size:var(--font-size-xs,0.75rem);color:${lt};font-variant-numeric:tabular-nums;white-space:nowrap`}#o(){return"list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--size-2xs,0.375rem)"}#n(t,e){let s=(this.getAttribute("tokens")||Bt).split(",").map(l=>l.trim()),o=this.getAttribute("prefix")||"--ease-",r=`position:relative;display:block;block-size:0.5rem;background:${dt};border-radius:999px`,i=`position:absolute;inset-block-start:50%;inset-inline-start:0;inline-size:1rem;block-size:1rem;background:${ct};border-radius:50%;transform:translateY(-50%)`,a=s.map(l=>{let c=`${o}${l}`;return`<li class="ms-row ms-row-ease" role="listitem" style="${this.#e()}">
         <span style="${this.#s()}">${l}</span>
         <span style="${r}" aria-hidden="true">
           <span class="ms-dot" style="${i};animation: ms-slide ${t} var(${c}) infinite alternate"></span>
@@ -147,7 +147,7 @@ ${o.join(`
           <span class="ms-bar-fill" style="${r};animation-duration: var(${l})"></span>
         </span>
         ${t?`<span class="ms-value" data-var="${l}" style="${this.#r()}"></span>`:""}
-      </li>`}).join("");return`<ul class="ms-list" role="list" aria-label="Duration scale" style="${this.#o()}">${i}</ul>`}#i(){this.querySelectorAll(".ms-value").forEach(t=>{let e=t.getAttribute("data-var");if(!e)return;let s=getComputedStyle(this).getPropertyValue(e).trim();t.textContent=s||"\u2014"})}};h("motion-specimen",I);var Nt="--color-,--hue-,--lightness-,--chroma-,--font-,--size-,--radius-,--shadow-,--border-width-,--ease-,--duration-",Vt=["type-specimen:change","spacing-specimen:change","token-specimen:change","semantic-palette:change"],U=class extends u{static observedAttributes=["scope","selector","include","format","label","live"];setup(){this.#o(),this.#n(),this.#a(),this.#c()}attributeChangedCallback(){this.isConnected&&this.hasAttribute("data-upgraded")&&(this.#o(),this.#n(),this.#a(),this.#c())}#t(){let t=this.getAttribute("scope")||":root";try{return t===":root"?document.documentElement:document.querySelector(t)}catch{return document.documentElement}}#e(){return(this.getAttribute("include")||Nt).split(",").map(e=>e.trim()).filter(Boolean)}#s(){let t=this.#t();if(!t)return[];let e=this.#e(),s=t.style,o=[];for(let r=0;r<s.length;r++){let i=s.item(r);if(!i.startsWith("--")||!e.some(l=>i.startsWith(l)))continue;let a=s.getPropertyValue(i).trim();a&&o.push([i,a])}return o}#r(t){if((this.getAttribute("format")||"css")==="json"){let r=Object.fromEntries(t);return JSON.stringify(r,null,2)}let s=this.getAttribute("selector")||":root";if(!t.length)return`${s} {
+      </li>`}).join("");return`<ul class="ms-list" role="list" aria-label="Duration scale" style="${this.#o()}">${i}</ul>`}#i(){this.querySelectorAll(".ms-value").forEach(t=>{let e=t.getAttribute("data-var");if(!e)return;let s=getComputedStyle(this).getPropertyValue(e).trim();t.textContent=s||"\u2014"})}};h("motion-specimen",I);var Nt="--color-,--hue-,--lightness-,--chroma-,--font-,--size-,--radius-,--shadow-,--border-width-,--ease-,--duration-",Vt=["type-specimen:change","spacing-specimen:change","token-specimen:change","semantic-palette:change"],U=class extends m{static observedAttributes=["scope","selector","include","format","label","live"];setup(){this.#o(),this.#n(),this.#a(),this.#c()}attributeChangedCallback(){this.isConnected&&this.hasAttribute("data-upgraded")&&(this.#o(),this.#n(),this.#a(),this.#c())}#t(){let t=this.getAttribute("scope")||":root";try{return t===":root"?document.documentElement:document.querySelector(t)}catch{return document.documentElement}}#e(){return(this.getAttribute("include")||Nt).split(",").map(e=>e.trim()).filter(Boolean)}#s(){let t=this.#t();if(!t)return[];let e=this.#e(),s=t.style,o=[];for(let r=0;r<s.length;r++){let i=s.item(r);if(!i.startsWith("--")||!e.some(l=>i.startsWith(l)))continue;let a=s.getPropertyValue(i).trim();a&&o.push([i,a])}return o}#r(t){if((this.getAttribute("format")||"css")==="json"){let r=Object.fromEntries(t);return JSON.stringify(r,null,2)}let s=this.getAttribute("selector")||":root";if(!t.length)return`${s} {
   /* No theme overrides detected yet. Edit a specimen to populate. */
 }
 `;let o=t.map(([r,i])=>`  ${r}: ${i};`).join(`

package/dist/cdn/packs/effects.full.js

@@ -1,2 +1,2 @@
-var k=window.matchMedia("(prefers-reduced-motion: reduce)");function v(){return k.matches||document.documentElement.hasAttribute("data-motion-reduced")}var A=0,f={_effects:new Map,_triggers:new Map,_transitions:new Map,_instances:new WeakMap,_triggerCleanups:new WeakMap,_transitionCleanups:new WeakMap,_observer:null,effect(t,e){this._effects.set(t,e),document.querySelectorAll("[data-effect]").forEach(r=>{(r.getAttribute("data-effect")||"").split(/\s+/).includes(t)&&this._initEffect(r,t)})},trigger(t,e){this._triggers.set(t,e)},transition(t,e){this._transitions.set(t,e)},uid(t){return t.id?t.id:(t._vbUid||(A++,t._vbUid=`vb-${A}`),t._vbUid)},theme(t,e){this._themes=this._themes||new Map,this._themes.set(t,e)},applyTheme(t,e=document.documentElement){let r=this._themes?.get(t);if(r)for(let[i,n]of Object.entries(r))e.style.setProperty(i,n)},swap(t){return document.startViewTransition?document.startViewTransition(t):t()},observe(t=document){if(t.querySelectorAll("[data-effect]").forEach(r=>this._processElement(r)),t.querySelectorAll("[data-stagger]").forEach(r=>this._processStagger(r)),t.querySelectorAll("[data-transition]").forEach(r=>this._processTransition(r)),this._observer)return;this._observer=new MutationObserver(r=>{for(let i of r){if(i.type==="childList"){for(let n of i.addedNodes)n.nodeType===Node.ELEMENT_NODE&&this._processTree(n);for(let n of i.removedNodes)n.nodeType===Node.ELEMENT_NODE&&this._cleanupTree(n)}if(i.type==="attributes"){let n=i.target;i.attributeName==="data-effect"&&this._reconcileEffects(n),i.attributeName==="data-trigger"&&this._reconcileTrigger(n),i.attributeName==="data-stagger"&&this._processStagger(n),i.attributeName==="data-transition"&&this._processTransition(n)}}});let e=t===document?document.body:t;this._observer.observe(e,{childList:!0,subtree:!0,attributes:!0,attributeFilter:["data-effect","data-trigger","data-stagger","data-transition"]})},disconnect(){this._observer&&(this._observer.disconnect(),this._observer=null)},params(t){let e=getComputedStyle(t);return{get(r){return e.getPropertyValue(`--vb-${r}`).trim()},getNumber(r,i=0){let n=e.getPropertyValue(`--vb-${r}`).trim();return n?parseFloat(n):i},getTime(r,i=0){let n=e.getPropertyValue(`--vb-${r}`).trim();if(!n)return i;let s=parseFloat(n);return Number.isFinite(s)?/s\s*$/.test(n)&&!/ms\s*$/.test(n)?s*1e3:s:i},hasClass(r){return t.classList.contains(r)}}},emit(t,e,r={}){t.dispatchEvent(new CustomEvent(e,{bubbles:!0,detail:r}))},prefersReducedMotion:v,_processTree(t){t.hasAttribute?.("data-effect")&&this._processElement(t),t.hasAttribute?.("data-stagger")&&this._processStagger(t),t.hasAttribute?.("data-transition")&&this._processTransition(t),t.querySelectorAll?.("[data-effect]").forEach(e=>this._processElement(e)),t.querySelectorAll?.("[data-stagger]").forEach(e=>this._processStagger(e)),t.querySelectorAll?.("[data-transition]").forEach(e=>this._processTransition(e))},_cleanupTree(t){t.hasAttribute?.("data-effect")&&this._cleanupElement(t),t.hasAttribute?.("data-transition")&&this._cleanupTransition(t),t.querySelectorAll?.("[data-effect]").forEach(e=>this._cleanupElement(e)),t.querySelectorAll?.("[data-transition]").forEach(e=>this._cleanupTransition(e))},_processElement(t){if(t.hasAttribute("data-effect-processed"))return;t.setAttribute("data-effect-processed","");let e=t.getAttribute("data-effect")?.split(/\s+/).filter(Boolean)||[];for(let r of e)this._initEffect(t,r);this._wireTrigger(t,e)},_initEffect(t,e){let r=this._effects.get(e);if(!r)return;let i=this._instances.get(t);if(i?.has(e))return;v();let n=r(t);n&&(i||(i=new Map,this._instances.set(t,i)),typeof n=="function"?i.set(e,{cleanup:n}):i.set(e,n))},_wireTrigger(t,e){let r=t.getAttribute("data-trigger");if(!r){this._activateEffects(t);return}let i=r.split(/\s+/).filter(Boolean);for(let n of i){let s=n.indexOf(":"),o=s>-1?n.slice(0,s):n,a=s>-1?n.slice(s+1):null,u=this._triggers.get(o);if(!u)continue;let c=u(t,()=>this._activateEffects(t),a);if(c){let d=this._triggerCleanups.get(t);if(d){let l=d;this._triggerCleanups.set(t,()=>{l(),c()})}else this._triggerCleanups.set(t,c)}}},_activateEffects(t){t.setAttribute("data-effect-active","");let e=this._instances.get(t);if(e)for(let[,r]of e)r.activate&&r.activate()},_cleanupElement(t){let e=this._instances.get(t);if(e){for(let[,i]of e)i.cleanup&&i.cleanup();this._instances.delete(t)}let r=this._triggerCleanups.get(t);r&&(r(),this._triggerCleanups.delete(t))},_reconcileEffects(t){let e=t.getAttribute("data-effect")?.split(/\s+/).filter(Boolean)||[],r=this._instances.get(t);if(r)for(let[i,n]of r)e.includes(i)||(n.cleanup&&n.cleanup(),r.delete(i));for(let i of e)r?.has(i)||this._initEffect(t,i);t.hasAttribute("data-effect-processed")||(t.setAttribute("data-effect-processed",""),this._wireTrigger(t,e))},_reconcileTrigger(t){let e=this._triggerCleanups.get(t);e&&(e(),this._triggerCleanups.delete(t));let r=t.getAttribute("data-effect")?.split(/\s+/).filter(Boolean)||[];this._wireTrigger(t,r)},_processStagger(t){let e=t.children;for(let r=0;r<e.length;r++)e[r].style.setProperty("--vb-stagger-index",String(r))},_processTransition(t){if(t.hasAttribute("data-transition-processed"))return;t.setAttribute("data-transition-processed","");let e=t.getAttribute("data-transition");if(!e)return;let r=this._transitions.get(e);if(r){let i=r(t);i&&this._transitionCleanups.set(t,i)}else t.style.viewTransitionName=`${e}-${this.uid(t)}`},_cleanupTransition(t){let e=this._transitionCleanups.get(t);e&&(e(),this._transitionCleanups.delete(t)),t.style.viewTransitionName=""}};typeof window<"u"&&(window.VB=f);f.effect("glitch",t=>{t.hasAttribute("data-effect-glitch-init")||(t.setAttribute("data-effect-glitch-init",""),t.setAttribute("data-glitch-text",t.textContent))});function S(t,e,r,i){let n=0;function s(){n<=e.length?(t.firstChild.textContent=e.slice(0,n),n++,setTimeout(s,r)):i&&i()}s()}function L(t,e,r){let i=t.firstChild.textContent,n=i.length;function s(){n>=0?(t.firstChild.textContent=i.slice(0,n),n--,setTimeout(s,e/2)):r&&r()}s()}function M(t){let e=t.getAttribute("data-typewriter-text"),r=f.params(t),i=r.getTime("typewriter-speed",50),n=r.getTime("typewriter-delay",0),o=t.classList.contains("loop")?2e3:null;t.textContent="";let a=document.createTextNode("");if(t.appendChild(a),!t.classList.contains("no-cursor")){let d=document.createElement("span");d.className="vb-typewriter-cursor",d.textContent="|",d.setAttribute("aria-hidden","true"),t.appendChild(d)}function c(){S(t,e,i,()=>{o!==null&&setTimeout(()=>{L(t,i,()=>{setTimeout(c,400)})},o)})}setTimeout(c,n)}f.effect("typewriter",t=>{if(t.hasAttribute("data-effect-typewriter-init"))return;t.setAttribute("data-effect-typewriter-init","");let e=t.textContent.trim();if(t.setAttribute("data-typewriter-text",e),t.setAttribute("aria-label",e),!f.prefersReducedMotion())return t.textContent="",{activate(){M(t)},cleanup(){}}});var E="!<>-_\\/[]{}=+*^?#";function _(t){return t[Math.floor(Math.random()*t.length)]}function $(t){let e=t.getAttribute("data-scramble-text"),r=f.params(t),i=r.getTime("scramble-duration",1500),n=r.get("scramble-chars")||E,s=r.getTime("scramble-speed",30),o=e.length,a=0,u=Math.ceil(i/s);function c(){let d=a/u,l=Math.floor(d*o),h="";for(let p=0;p<o;p++)p<l?h+=e[p]:e[p]===" "?h+=" ":h+=_(n);t.textContent=h,a++,a<=u?setTimeout(c,s):t.textContent=e}c()}f.effect("scramble",t=>{if(t.hasAttribute("data-effect-scramble-init"))return;t.setAttribute("data-effect-scramble-init","");let e=t.textContent.trim();if(t.setAttribute("data-scramble-text",e),t.setAttribute("aria-label",e),f.prefersReducedMotion())return;let r=f.params(t).get("scramble-chars")||E;return t.textContent=e.replace(/\S/g,()=>_(r)),{activate(){$(t)},cleanup(){}}});function V(t){let e=t.textContent;t.setAttribute("aria-label",e),t.innerHTML="",e.split(/(\s+)/).forEach((i,n)=>{if(/^\s+$/.test(i)){t.appendChild(document.createTextNode(i));return}let s=document.createElement("span");s.className="vb-blur-chunk",s.textContent=i,s.style.setProperty("--i",String(Math.floor(n/2))),s.setAttribute("aria-hidden","true"),t.appendChild(s)})}function q(t){let e=t.textContent;t.setAttribute("aria-label",e);let r=e.split(/\s+/).filter(Boolean),i=[],n="",s=t.offsetWidth,o=document.createElement("span");o.style.visibility="hidden",o.style.position="absolute",o.style.font=getComputedStyle(t).font,document.body.appendChild(o),r.forEach(a=>{let u=n?n+" "+a:a;o.textContent=u,o.offsetWidth>s&&n?(i.push(n),n=a):n=u}),n&&i.push(n),document.body.removeChild(o),i.length===0&&i.push(e),t.innerHTML="",i.forEach((a,u)=>{let c=document.createElement("span");c.className="vb-blur-chunk",c.textContent=a,c.style.setProperty("--i",String(u)),c.setAttribute("aria-hidden","true"),t.appendChild(c),u<i.length-1&&t.appendChild(document.createTextNode(" "))})}f.effect("blur-reveal",t=>{if(t.hasAttribute("data-effect-blur-reveal-init")||(t.setAttribute("data-effect-blur-reveal-init",""),f.prefersReducedMotion()))return;let e=t.classList.contains("line")?"line":"word",r=f.params(t).get("blur-reveal-delay")||"80ms";return t.style.setProperty("--blur-delay",r),e==="line"?q(t):V(t),{activate(){t.setAttribute("data-effect-active","")},cleanup(){}}});f.effect("animate-image",t=>{if(t.hasAttribute("data-effect-animate-image-init"))return;t.setAttribute("data-effect-animate-image-init","");let e=t,r=document.createElement("div");if(r.className="animate-image-wrapper",!e.parentNode)return;e.parentNode.insertBefore(r,e),r.appendChild(e);let i=document.createElement("button");i.type="button",i.className="animate-image-toggle",i.setAttribute("aria-label","Pause animation"),r.appendChild(i);let n=e.src,s=null,o=!1;function a(){let l=document.createElement("canvas");l.width=e.naturalWidth||e.width,l.height=e.naturalHeight||e.height;let h=l.getContext("2d");if(h){h.drawImage(e,0,0);try{s=l.toDataURL("image/png")}catch{s=null}}}function u(){o||(o=!0,e.setAttribute("data-animate-image-paused",""),i.setAttribute("aria-label","Play animation"),i.classList.add("paused"),s&&(e.src=s))}function c(){o&&(o=!1,e.removeAttribute("data-animate-image-paused"),i.setAttribute("aria-label","Pause animation"),i.classList.remove("paused"),e.src=n)}i.addEventListener("click",()=>o?c():u()),e.complete&&e.naturalWidth?a():e.addEventListener("load",a,{once:!0});let d=window.matchMedia("(prefers-reduced-motion: reduce)");return(d.matches||document.documentElement.dataset.motionReduced!==void 0)&&(e.complete?(a(),u()):e.addEventListener("load",()=>{a(),u()},{once:!0})),d.addEventListener("change",l=>{l.matches&&u()}),e.hasAttribute("data-animate-image-paused")&&(e.complete?(a(),o=!1,u()):e.addEventListener("load",()=>{a(),o=!1,u()},{once:!0})),{cleanup(){r.parentNode&&(r.parentNode.insertBefore(e,r),r.remove())}}});function C(){return document.documentElement.lang||navigator.language||"en"}function F(t){return t===1?1:1-Math.pow(2,-10*t)}function B(t){let e=t.indexOf(".");return e===-1?0:t.length-e-1}function R(t,e){let r=t.getAttribute("data-locale")||C(),i=t.getAttribute("data-format-number");if(i!=null){let n={minimumFractionDigits:e,maximumFractionDigits:e};switch(i){case"currency":n.style="currency",n.currency=t.getAttribute("data-currency")||"USD";break;case"percent":n.style="percent";break;case"compact":n.notation="compact";break}try{return new Intl.NumberFormat(r,n)}catch{return null}}try{return new Intl.NumberFormat(r,{minimumFractionDigits:e,maximumFractionDigits:e})}catch{return null}}function O(t){let e=t.getAttribute("value");if(e==null)return;let r=Number(e);if(isNaN(r))return;let i=f.params(t),n=i.getNumber("ticker-start",0),s=i.getTime("ticker-duration",1e3),o=i.get("ticker-decimals")?parseInt(i.get("ticker-decimals"),10):B(e),a=R(t,o),u=r-n;if(u===0)return;let c=null;function d(l){c||(c=l);let h=l-c,p=Math.min(h/s,1),m=F(p),y=n+u*m;t.textContent=a?a.format(y):y.toFixed(o),p<1?requestAnimationFrame(d):(t.textContent=a?a.format(r):r.toFixed(o),t.hasAttribute("data-format-number")&&t.setAttribute("data-format-number-init",""))}requestAnimationFrame(d)}f.effect("ticker",t=>{if(!t.hasAttribute("data-effect-ticker-init")&&(t.setAttribute("data-effect-ticker-init",""),!f.prefersReducedMotion()))return{activate(){O(t)},cleanup(){}}});var X=window.matchMedia("(prefers-reduced-motion: reduce)");var w=new Map;function x(t,e,r={}){let i=r.priority??10,n={impl:e,bundle:r.bundle,contract:r.contract,priority:i},s=w.get(t);if(customElements.get(t)){if(!s||s.priority>=i){s&&s.priority===i&&s.impl!==e&&console.warn(`[VB Bundle] Tag <${t}> already registered by "${s.bundle}" (priority ${s.priority}). Skipping "${r.bundle}".`);return}console.warn(`[VB Bundle] Tag <${t}> defined by "${s.bundle}" cannot be replaced (customElements.define is permanent). "${r.bundle}" has higher priority but arrived late.`);return}if(s&&s.priority>=i){s.priority===i&&console.warn(`[VB Bundle] Tag <${t}> already registered by "${s.bundle}". Skipping "${r.bundle}" (first wins at equal priority).`);return}w.set(t,n),customElements.define(t,e)}var g=class extends HTMLElement{#e=[];connectedCallback(){this.hasAttribute("data-upgraded")||this.setup()!==!1&&this.setAttribute("data-upgraded","")}disconnectedCallback(){for(let e of this.#e)e();this.#e=[],this.removeAttribute("data-upgraded"),this.teardown()}listen(e,r,i,n){e.addEventListener(r,i,n),this.#e.push(()=>e.removeEventListener(r,i,n))}setup(){}teardown(){}};var b=class extends g{static formAssociated=!0;#e;#s;#t;constructor(){super(),this.#e=this.attachInternals()}setup(){this.#a()}#a(){if(this.querySelector("fieldset"))return;let e=Number(this.getAttribute("value")||0);this.#s=e;let r=Number(this.getAttribute("max")||5),i=this.getAttribute("label")||"Rating",n=this.hasAttribute("allow-half"),s=this.hasAttribute("readonly"),o=this.getAttribute("icon"),u=`_sr_${this.getAttribute("name")||`star-rating-${crypto.randomUUID().slice(0,8)}`}`;s?this.#c(e,r,i,o):this.#o(e,r,i,u,n,o),this.#r(e),this.#i()}#o(e,r,i,n,s,o){let a=document.createElement("fieldset");a.setAttribute("data-rating",""),s&&a.setAttribute("data-rating-half",""),a.setAttribute("data-effect","rating");let u=document.createElement("legend");if(u.textContent=i,a.appendChild(u),s)for(let c=1;c<=r;c++){let d=c-.5,l=document.createElement("label");l.setAttribute("data-half","left");let h=document.createElement("input");h.type="radio",h.name=n,h.value=String(d),h.setAttribute("aria-label",`${d} ${d===1?"star":"stars"}`),e===d&&(h.checked=!0),l.appendChild(h),l.append(this.#n(o)),a.appendChild(l);let p=document.createElement("label");p.setAttribute("data-half","right");let m=document.createElement("input");m.type="radio",m.name=n,m.value=String(c),m.setAttribute("aria-label",`${c} ${c===1?"star":"stars"}`),e===c&&(m.checked=!0),p.appendChild(m),p.append(this.#n(o)),a.appendChild(p)}else for(let c=1;c<=r;c++){let d=document.createElement("label"),l=document.createElement("input");l.type="radio",l.name=n,l.value=String(c),l.setAttribute("aria-label",`${c} ${c===1?"star":"stars"}`),e===c&&(l.checked=!0),d.appendChild(l),d.append(this.#n(o)),a.appendChild(d)}this.appendChild(a),this.#t=a,a.addEventListener("rating:change",c=>{this.#r(c.detail.value),this.#i()}),a.addEventListener("change",c=>{let d=c.target;d.type==="radio"&&d.checked&&(this.#r(Number(d.value)),this.#i())})}#c(e,r,i,n){let s=document.createElement("fieldset");s.setAttribute("data-rating",""),s.setAttribute("data-rating-readonly",""),s.setAttribute("role","img"),s.setAttribute("aria-label",`${i}: ${e} out of ${r}`);let o=document.createElement("legend");o.textContent=i,s.appendChild(o);let a=Math.floor(e),u=e-a;for(let c=1;c<=r;c++){let d=document.createElement("span");if(d.setAttribute("aria-hidden","true"),c<=a)d.classList.add("star-filled");else if(c===a+1&&u>0){d.classList.add("star-partial"),d.style.setProperty("--_star-fill",`${u*100}%`);let l=document.createElement("span");l.classList.add("star-partial-fill"),l.append(this.#n(n)),d.appendChild(l)}else d.classList.add("star-empty");d.append(this.#n(n)),s.appendChild(d)}this.appendChild(s),this.#t=s}#n(e){if(e){let r=document.createElement("icon-wc");return r.setAttribute("name",e),r}return document.createTextNode("\u2605")}#r(e){let r=Number(e);r>0?this.#e.setFormValue(String(r)):this.#e.setFormValue(null)}#i(){this.hasAttribute("required")?this.#t?.querySelector('input[type="radio"]:checked')?this.#e.setValidity({}):this.#e.setValidity({valueMissing:!0},"Please select a rating",this.#t||this):this.#e.setValidity({})}formResetCallback(){if(this.#t){if(this.#t.querySelectorAll('input[type="radio"]').forEach(e=>{e.checked=!1}),this.#s>0){let e=this.#t.querySelector(`input[value="${this.#s}"]`);e&&(e.checked=!0)}this.#r(this.#s),this.#i()}}formStateRestoreCallback(e){if(!e||!this.#t)return;let r=this.#t.querySelector(`input[value="${e}"]`);r&&(r.checked=!0,this.#r(Number(e)),this.#i())}get value(){if(!this.#t)return Number(this.getAttribute("value")||0);let e=this.#t.querySelector('input[type="radio"]:checked');return e?Number(e.value):0}set value(e){if(!this.#t)return;this.#t.querySelectorAll('input[type="radio"]').forEach(i=>{i.checked=!1});let r=Number(e);if(r>0){let i=this.#t.querySelector(`input[value="${r}"]`);i&&(i.checked=!0)}this.#r(r),this.#i()}};x("star-rating",b);var P=1e3;function N(t){let e=document.createElement("div");e.setAttribute("role","status"),e.setAttribute("aria-live","polite"),Object.assign(e.style,{position:"absolute",width:"1px",height:"1px",padding:"0",margin:"-1px",overflow:"hidden",clip:"rect(0,0,0,0)",whiteSpace:"nowrap",border:"0"}),e.textContent=t,document.body.appendChild(e),setTimeout(()=>e.remove(),P)}function T(t,e){t.dispatchEvent(new CustomEvent("rating:change",{bubbles:!0,detail:{value:e}}))}function D(t){let e=t.querySelector('input[type="radio"]:checked');return e?e.value:"0"}f.effect("rating",t=>{if(t.hasAttribute("data-effect-rating-init")||(t.setAttribute("data-effect-rating-init",""),t.hasAttribute("data-rating-readonly")))return;let e=D(t),r=!1;function i(o){let a=o.target.closest("label");if(!a)return;let u=a.querySelector('input[type="radio"]');u&&(r=u.checked&&u.value===e)}function n(o){if(!r)return;r=!1;let a=o.target.closest("label");if(!a)return;let u=a.querySelector('input[type="radio"]');u&&(u.checked=!1,e="0",T(t,0),N("Rating cleared"))}function s(o){o.target.type==="radio"&&(r||(e=o.target.value,T(t,Number(o.target.value)),N(`Rating: ${o.target.value} ${Number(o.target.value)===1?"star":"stars"}`)))}return t.addEventListener("mousedown",i),t.addEventListener("click",n),t.addEventListener("change",s),{cleanup(){t.removeEventListener("mousedown",i),t.removeEventListener("click",n),t.removeEventListener("change",s)}}});
+var k=window.matchMedia("(prefers-reduced-motion: reduce)");function v(){return k.matches||document.documentElement.hasAttribute("data-motion-reduced")}var E=0,f={_effects:new Map,_triggers:new Map,_transitions:new Map,_instances:new WeakMap,_triggerCleanups:new WeakMap,_transitionCleanups:new WeakMap,_observer:null,effect(t,e){this._effects.set(t,e),document.querySelectorAll("[data-effect]").forEach(r=>{(r.getAttribute("data-effect")||"").split(/\s+/).includes(t)&&this._initEffect(r,t)})},trigger(t,e){this._triggers.set(t,e)},transition(t,e){this._transitions.set(t,e)},uid(t){return t.id?t.id:(t._vbUid||(E++,t._vbUid=`vb-${E}`),t._vbUid)},theme(t,e){this._themes=this._themes||new Map,this._themes.set(t,e)},applyTheme(t,e=document.documentElement){let r=this._themes?.get(t);if(r)for(let[i,n]of Object.entries(r))e.style.setProperty(i,n)},swap(t){return document.startViewTransition?document.startViewTransition(t):t()},observe(t=document){if(t.querySelectorAll("[data-effect]").forEach(r=>this._processElement(r)),t.querySelectorAll("[data-stagger]").forEach(r=>this._processStagger(r)),t.querySelectorAll("[data-transition]").forEach(r=>this._processTransition(r)),this._observer)return;this._observer=new MutationObserver(r=>{for(let i of r){if(i.type==="childList"){for(let n of i.addedNodes)n.nodeType===Node.ELEMENT_NODE&&this._processTree(n);for(let n of i.removedNodes)n.nodeType===Node.ELEMENT_NODE&&this._cleanupTree(n)}if(i.type==="attributes"){let n=i.target;i.attributeName==="data-effect"&&this._reconcileEffects(n),i.attributeName==="data-trigger"&&this._reconcileTrigger(n),i.attributeName==="data-stagger"&&this._processStagger(n),i.attributeName==="data-transition"&&this._processTransition(n)}}});let e=t===document?document.body:t;this._observer.observe(e,{childList:!0,subtree:!0,attributes:!0,attributeFilter:["data-effect","data-trigger","data-stagger","data-transition"]})},disconnect(){this._observer&&(this._observer.disconnect(),this._observer=null)},params(t){let e=getComputedStyle(t);return{get(r){return e.getPropertyValue(`--vb-${r}`).trim()},getNumber(r,i=0){let n=e.getPropertyValue(`--vb-${r}`).trim();return n?parseFloat(n):i},getTime(r,i=0){let n=e.getPropertyValue(`--vb-${r}`).trim();if(!n)return i;let s=parseFloat(n);return Number.isFinite(s)?/s\s*$/.test(n)&&!/ms\s*$/.test(n)?s*1e3:s:i},hasClass(r){return t.classList.contains(r)}}},emit(t,e,r={}){t.dispatchEvent(new CustomEvent(e,{bubbles:!0,detail:r}))},prefersReducedMotion:v,_processTree(t){t.hasAttribute?.("data-effect")&&this._processElement(t),t.hasAttribute?.("data-stagger")&&this._processStagger(t),t.hasAttribute?.("data-transition")&&this._processTransition(t),t.querySelectorAll?.("[data-effect]").forEach(e=>this._processElement(e)),t.querySelectorAll?.("[data-stagger]").forEach(e=>this._processStagger(e)),t.querySelectorAll?.("[data-transition]").forEach(e=>this._processTransition(e))},_cleanupTree(t){t.hasAttribute?.("data-effect")&&this._cleanupElement(t),t.hasAttribute?.("data-transition")&&this._cleanupTransition(t),t.querySelectorAll?.("[data-effect]").forEach(e=>this._cleanupElement(e)),t.querySelectorAll?.("[data-transition]").forEach(e=>this._cleanupTransition(e))},_processElement(t){if(t.hasAttribute("data-effect-processed"))return;t.setAttribute("data-effect-processed","");let e=t.getAttribute("data-effect")?.split(/\s+/).filter(Boolean)||[];for(let r of e)this._initEffect(t,r);this._wireTrigger(t,e)},_initEffect(t,e){let r=this._effects.get(e);if(!r)return;let i=this._instances.get(t);if(i?.has(e))return;v();let n=r(t);n&&(i||(i=new Map,this._instances.set(t,i)),typeof n=="function"?i.set(e,{cleanup:n}):i.set(e,n))},_wireTrigger(t,e){let r=t.getAttribute("data-trigger");if(!r){this._activateEffects(t);return}let i=r.split(/\s+/).filter(Boolean);for(let n of i){let s=n.indexOf(":"),o=s>-1?n.slice(0,s):n,a=s>-1?n.slice(s+1):null,u=this._triggers.get(o);if(!u)continue;let c=u(t,()=>this._activateEffects(t),a);if(c){let d=this._triggerCleanups.get(t);if(d){let l=d;this._triggerCleanups.set(t,()=>{l(),c()})}else this._triggerCleanups.set(t,c)}}},_activateEffects(t){t.setAttribute("data-effect-active","");let e=this._instances.get(t);if(e)for(let[,r]of e)r.activate&&r.activate()},_cleanupElement(t){let e=this._instances.get(t);if(e){for(let[,i]of e)i.cleanup&&i.cleanup();this._instances.delete(t)}let r=this._triggerCleanups.get(t);r&&(r(),this._triggerCleanups.delete(t))},_reconcileEffects(t){let e=t.getAttribute("data-effect")?.split(/\s+/).filter(Boolean)||[],r=this._instances.get(t);if(r)for(let[i,n]of r)e.includes(i)||(n.cleanup&&n.cleanup(),r.delete(i));for(let i of e)r?.has(i)||this._initEffect(t,i);t.hasAttribute("data-effect-processed")||(t.setAttribute("data-effect-processed",""),this._wireTrigger(t,e))},_reconcileTrigger(t){let e=this._triggerCleanups.get(t);e&&(e(),this._triggerCleanups.delete(t));let r=t.getAttribute("data-effect")?.split(/\s+/).filter(Boolean)||[];this._wireTrigger(t,r)},_processStagger(t){let e=t.children;for(let r=0;r<e.length;r++)e[r].style.setProperty("--vb-stagger-index",String(r))},_processTransition(t){if(t.hasAttribute("data-transition-processed"))return;t.setAttribute("data-transition-processed","");let e=t.getAttribute("data-transition");if(!e)return;let r=this._transitions.get(e);if(r){let i=r(t);i&&this._transitionCleanups.set(t,i)}else t.style.viewTransitionName=`${e}-${this.uid(t)}`},_cleanupTransition(t){let e=this._transitionCleanups.get(t);e&&(e(),this._transitionCleanups.delete(t)),t.style.viewTransitionName=""}};typeof window<"u"&&(window.VB=f);f.effect("glitch",t=>{t.hasAttribute("data-effect-glitch-init")||(t.setAttribute("data-effect-glitch-init",""),t.setAttribute("data-glitch-text",t.textContent))});function S(t,e,r,i){let n=0;function s(){n<=e.length?(t.firstChild.textContent=e.slice(0,n),n++,setTimeout(s,r)):i&&i()}s()}function L(t,e,r){let i=t.firstChild.textContent,n=i.length;function s(){n>=0?(t.firstChild.textContent=i.slice(0,n),n--,setTimeout(s,e/2)):r&&r()}s()}function M(t){let e=t.getAttribute("data-typewriter-text"),r=f.params(t),i=r.getTime("typewriter-speed",50),n=r.getTime("typewriter-delay",0),o=t.classList.contains("loop")?2e3:null;t.textContent="";let a=document.createTextNode("");if(t.appendChild(a),!t.classList.contains("no-cursor")){let d=document.createElement("span");d.className="vb-typewriter-cursor",d.textContent="|",d.setAttribute("aria-hidden","true"),t.appendChild(d)}function c(){S(t,e,i,()=>{o!==null&&setTimeout(()=>{L(t,i,()=>{setTimeout(c,400)})},o)})}setTimeout(c,n)}f.effect("typewriter",t=>{if(t.hasAttribute("data-effect-typewriter-init"))return;t.setAttribute("data-effect-typewriter-init","");let e=t.textContent.trim();if(t.setAttribute("data-typewriter-text",e),t.setAttribute("aria-label",e),!f.prefersReducedMotion())return t.textContent="",{activate(){M(t)},cleanup(){}}});var A="!<>-_\\/[]{}=+*^?#";function _(t){return t[Math.floor(Math.random()*t.length)]}function $(t){let e=t.getAttribute("data-scramble-text"),r=f.params(t),i=r.getTime("scramble-duration",1500),n=r.get("scramble-chars")||A,s=r.getTime("scramble-speed",30),o=e.length,a=0,u=Math.ceil(i/s);function c(){let d=a/u,l=Math.floor(d*o),h="";for(let p=0;p<o;p++)p<l?h+=e[p]:e[p]===" "?h+=" ":h+=_(n);t.textContent=h,a++,a<=u?setTimeout(c,s):t.textContent=e}c()}f.effect("scramble",t=>{if(t.hasAttribute("data-effect-scramble-init"))return;t.setAttribute("data-effect-scramble-init","");let e=t.textContent.trim();if(t.setAttribute("data-scramble-text",e),t.setAttribute("aria-label",e),f.prefersReducedMotion())return;let r=f.params(t).get("scramble-chars")||A;return t.textContent=e.replace(/\S/g,()=>_(r)),{activate(){$(t)},cleanup(){}}});function V(t){let e=t.textContent;t.setAttribute("aria-label",e),t.innerHTML="",e.split(/(\s+)/).forEach((i,n)=>{if(/^\s+$/.test(i)){t.appendChild(document.createTextNode(i));return}let s=document.createElement("span");s.className="vb-blur-chunk",s.textContent=i,s.style.setProperty("--i",String(Math.floor(n/2))),s.setAttribute("aria-hidden","true"),t.appendChild(s)})}function q(t){let e=t.textContent;t.setAttribute("aria-label",e);let r=e.split(/\s+/).filter(Boolean),i=[],n="",s=t.offsetWidth,o=document.createElement("span");o.style.visibility="hidden",o.style.position="absolute",o.style.font=getComputedStyle(t).font,document.body.appendChild(o),r.forEach(a=>{let u=n?n+" "+a:a;o.textContent=u,o.offsetWidth>s&&n?(i.push(n),n=a):n=u}),n&&i.push(n),document.body.removeChild(o),i.length===0&&i.push(e),t.innerHTML="",i.forEach((a,u)=>{let c=document.createElement("span");c.className="vb-blur-chunk",c.textContent=a,c.style.setProperty("--i",String(u)),c.setAttribute("aria-hidden","true"),t.appendChild(c),u<i.length-1&&t.appendChild(document.createTextNode(" "))})}f.effect("blur-reveal",t=>{if(t.hasAttribute("data-effect-blur-reveal-init")||(t.setAttribute("data-effect-blur-reveal-init",""),f.prefersReducedMotion()))return;let e=t.classList.contains("line")?"line":"word",r=f.params(t).get("blur-reveal-delay")||"80ms";return t.style.setProperty("--blur-delay",r),e==="line"?q(t):V(t),{activate(){t.setAttribute("data-effect-active","")},cleanup(){}}});f.effect("animate-image",t=>{if(t.hasAttribute("data-effect-animate-image-init"))return;t.setAttribute("data-effect-animate-image-init","");let e=t,r=document.createElement("div");if(r.className="animate-image-wrapper",!e.parentNode)return;e.parentNode.insertBefore(r,e),r.appendChild(e);let i=document.createElement("button");i.type="button",i.className="animate-image-toggle",i.setAttribute("aria-label","Pause animation"),r.appendChild(i);let n=e.src,s=null,o=!1;function a(){let l=document.createElement("canvas");l.width=e.naturalWidth||e.width,l.height=e.naturalHeight||e.height;let h=l.getContext("2d");if(h){h.drawImage(e,0,0);try{s=l.toDataURL("image/png")}catch{s=null}}}function u(){o||(o=!0,e.setAttribute("data-animate-image-paused",""),i.setAttribute("aria-label","Play animation"),i.classList.add("paused"),s&&(e.src=s))}function c(){o&&(o=!1,e.removeAttribute("data-animate-image-paused"),i.setAttribute("aria-label","Pause animation"),i.classList.remove("paused"),e.src=n)}i.addEventListener("click",()=>o?c():u()),e.complete&&e.naturalWidth?a():e.addEventListener("load",a,{once:!0});let d=window.matchMedia("(prefers-reduced-motion: reduce)");return(d.matches||document.documentElement.dataset.motionReduced!==void 0)&&(e.complete?(a(),u()):e.addEventListener("load",()=>{a(),u()},{once:!0})),d.addEventListener("change",l=>{l.matches&&u()}),e.hasAttribute("data-animate-image-paused")&&(e.complete?(a(),o=!1,u()):e.addEventListener("load",()=>{a(),o=!1,u()},{once:!0})),{cleanup(){r.parentNode&&(r.parentNode.insertBefore(e,r),r.remove())}}});function C(){return document.documentElement.lang||navigator.language||"en"}function F(t){return t===1?1:1-Math.pow(2,-10*t)}function B(t){let e=t.indexOf(".");return e===-1?0:t.length-e-1}function R(t,e){let r=t.getAttribute("data-locale")||C(),i=t.getAttribute("data-format-number");if(i!=null){let n={minimumFractionDigits:e,maximumFractionDigits:e};switch(i){case"currency":n.style="currency",n.currency=t.getAttribute("data-currency")||"USD";break;case"percent":n.style="percent";break;case"compact":n.notation="compact";break}try{return new Intl.NumberFormat(r,n)}catch{return null}}try{return new Intl.NumberFormat(r,{minimumFractionDigits:e,maximumFractionDigits:e})}catch{return null}}function O(t){let e=t.getAttribute("value");if(e==null)return;let r=Number(e);if(isNaN(r))return;let i=f.params(t),n=i.getNumber("ticker-start",0),s=i.getTime("ticker-duration",1e3),o=i.get("ticker-decimals")?parseInt(i.get("ticker-decimals"),10):B(e),a=R(t,o),u=r-n;if(u===0)return;let c=null;function d(l){c||(c=l);let h=l-c,p=Math.min(h/s,1),m=F(p),y=n+u*m;t.textContent=a?a.format(y):y.toFixed(o),p<1?requestAnimationFrame(d):(t.textContent=a?a.format(r):r.toFixed(o),t.hasAttribute("data-format-number")&&t.setAttribute("data-format-number-init",""))}requestAnimationFrame(d)}f.effect("ticker",t=>{if(!t.hasAttribute("data-effect-ticker-init")&&(t.setAttribute("data-effect-ticker-init",""),!f.prefersReducedMotion()))return{activate(){O(t)},cleanup(){}}});var X=window.matchMedia("(prefers-reduced-motion: reduce)");var w=new Map;function x(t,e,r={}){let i=r.priority??10,n={impl:e,bundle:r.bundle,contract:r.contract,priority:i},s=w.get(t);if(customElements.get(t)){if(!s||s.priority>=i){s&&s.priority===i&&s.impl!==e&&console.warn(`[VB Bundle] Tag <${t}> already registered by "${s.bundle}" (priority ${s.priority}). Skipping "${r.bundle}".`);return}console.warn(`[VB Bundle] Tag <${t}> defined by "${s.bundle}" cannot be replaced (customElements.define is permanent). "${r.bundle}" has higher priority but arrived late.`);return}if(s&&s.priority>=i){s.priority===i&&console.warn(`[VB Bundle] Tag <${t}> already registered by "${s.bundle}". Skipping "${r.bundle}" (first wins at equal priority).`);return}w.set(t,n),customElements.define(t,e)}var g=class extends HTMLElement{#e=[];connectedCallback(){this.hasAttribute("data-upgraded")||this.setup()!==!1&&(this.setAttribute("data-upgraded",""),this.dispatchEvent(new CustomEvent(`${this.localName}:upgraded`,{bubbles:!0})))}disconnectedCallback(){for(let e of this.#e)e();this.#e=[],this.removeAttribute("data-upgraded"),this.teardown()}listen(e,r,i,n){e.addEventListener(r,i,n),this.#e.push(()=>e.removeEventListener(r,i,n))}setup(){}teardown(){}};var b=class extends g{static formAssociated=!0;#e;#s;#t;constructor(){super(),this.#e=this.attachInternals()}setup(){this.#a()}#a(){if(this.querySelector("fieldset"))return;let e=Number(this.getAttribute("value")||0);this.#s=e;let r=Number(this.getAttribute("max")||5),i=this.getAttribute("label")||"Rating",n=this.hasAttribute("allow-half"),s=this.hasAttribute("readonly"),o=this.getAttribute("icon"),u=`_sr_${this.getAttribute("name")||`star-rating-${crypto.randomUUID().slice(0,8)}`}`;s?this.#c(e,r,i,o):this.#o(e,r,i,u,n,o),this.#r(e),this.#i()}#o(e,r,i,n,s,o){let a=document.createElement("fieldset");a.setAttribute("data-rating",""),s&&a.setAttribute("data-rating-half",""),a.setAttribute("data-effect","rating");let u=document.createElement("legend");if(u.textContent=i,a.appendChild(u),s)for(let c=1;c<=r;c++){let d=c-.5,l=document.createElement("label");l.setAttribute("data-half","left");let h=document.createElement("input");h.type="radio",h.name=n,h.value=String(d),h.setAttribute("aria-label",`${d} ${d===1?"star":"stars"}`),e===d&&(h.checked=!0),l.appendChild(h),l.append(this.#n(o)),a.appendChild(l);let p=document.createElement("label");p.setAttribute("data-half","right");let m=document.createElement("input");m.type="radio",m.name=n,m.value=String(c),m.setAttribute("aria-label",`${c} ${c===1?"star":"stars"}`),e===c&&(m.checked=!0),p.appendChild(m),p.append(this.#n(o)),a.appendChild(p)}else for(let c=1;c<=r;c++){let d=document.createElement("label"),l=document.createElement("input");l.type="radio",l.name=n,l.value=String(c),l.setAttribute("aria-label",`${c} ${c===1?"star":"stars"}`),e===c&&(l.checked=!0),d.appendChild(l),d.append(this.#n(o)),a.appendChild(d)}this.appendChild(a),this.#t=a,a.addEventListener("rating:change",c=>{this.#r(c.detail.value),this.#i()}),a.addEventListener("change",c=>{let d=c.target;d.type==="radio"&&d.checked&&(this.#r(Number(d.value)),this.#i())})}#c(e,r,i,n){let s=document.createElement("fieldset");s.setAttribute("data-rating",""),s.setAttribute("data-rating-readonly",""),s.setAttribute("role","img"),s.setAttribute("aria-label",`${i}: ${e} out of ${r}`);let o=document.createElement("legend");o.textContent=i,s.appendChild(o);let a=Math.floor(e),u=e-a;for(let c=1;c<=r;c++){let d=document.createElement("span");if(d.setAttribute("aria-hidden","true"),c<=a)d.classList.add("star-filled");else if(c===a+1&&u>0){d.classList.add("star-partial"),d.style.setProperty("--_star-fill",`${u*100}%`);let l=document.createElement("span");l.classList.add("star-partial-fill"),l.append(this.#n(n)),d.appendChild(l)}else d.classList.add("star-empty");d.append(this.#n(n)),s.appendChild(d)}this.appendChild(s),this.#t=s}#n(e){if(e){let r=document.createElement("icon-wc");return r.setAttribute("name",e),r}return document.createTextNode("\u2605")}#r(e){let r=Number(e);r>0?this.#e.setFormValue(String(r)):this.#e.setFormValue(null)}#i(){this.hasAttribute("required")?this.#t?.querySelector('input[type="radio"]:checked')?this.#e.setValidity({}):this.#e.setValidity({valueMissing:!0},"Please select a rating",this.#t||this):this.#e.setValidity({})}formResetCallback(){if(this.#t){if(this.#t.querySelectorAll('input[type="radio"]').forEach(e=>{e.checked=!1}),this.#s>0){let e=this.#t.querySelector(`input[value="${this.#s}"]`);e&&(e.checked=!0)}this.#r(this.#s),this.#i()}}formStateRestoreCallback(e){if(!e||!this.#t)return;let r=this.#t.querySelector(`input[value="${e}"]`);r&&(r.checked=!0,this.#r(Number(e)),this.#i())}get value(){if(!this.#t)return Number(this.getAttribute("value")||0);let e=this.#t.querySelector('input[type="radio"]:checked');return e?Number(e.value):0}set value(e){if(!this.#t)return;this.#t.querySelectorAll('input[type="radio"]').forEach(i=>{i.checked=!1});let r=Number(e);if(r>0){let i=this.#t.querySelector(`input[value="${r}"]`);i&&(i.checked=!0)}this.#r(r),this.#i()}};x("star-rating",b);var P=1e3;function N(t){let e=document.createElement("div");e.setAttribute("role","status"),e.setAttribute("aria-live","polite"),Object.assign(e.style,{position:"absolute",width:"1px",height:"1px",padding:"0",margin:"-1px",overflow:"hidden",clip:"rect(0,0,0,0)",whiteSpace:"nowrap",border:"0"}),e.textContent=t,document.body.appendChild(e),setTimeout(()=>e.remove(),P)}function T(t,e){t.dispatchEvent(new CustomEvent("rating:change",{bubbles:!0,detail:{value:e}}))}function D(t){let e=t.querySelector('input[type="radio"]:checked');return e?e.value:"0"}f.effect("rating",t=>{if(t.hasAttribute("data-effect-rating-init")||(t.setAttribute("data-effect-rating-init",""),t.hasAttribute("data-rating-readonly")))return;let e=D(t),r=!1;function i(o){let a=o.target.closest("label");if(!a)return;let u=a.querySelector('input[type="radio"]');u&&(r=u.checked&&u.value===e)}function n(o){if(!r)return;r=!1;let a=o.target.closest("label");if(!a)return;let u=a.querySelector('input[type="radio"]');u&&(u.checked=!1,e="0",T(t,0),N("Rating cleared"))}function s(o){o.target.type==="radio"&&(r||(e=o.target.value,T(t,Number(o.target.value)),N(`Rating: ${o.target.value} ${Number(o.target.value)===1?"star":"stars"}`)))}return t.addEventListener("mousedown",i),t.addEventListener("click",n),t.addEventListener("change",s),{cleanup(){t.removeEventListener("mousedown",i),t.removeEventListener("click",n),t.removeEventListener("change",s)}}});
 //# sourceMappingURL=effects.full.js.map

package/dist/cdn/packs/manifest.json

@@ -2,7 +2,7 @@
   "design-system": {
     "fullJs": {
       "file": "design-system.full.js",
-      "size": 47130
+      "size": 47211
     },
     "fullCss": {
       "file": "design-system.full.css",
@@ -12,7 +12,7 @@
   "effects": {
     "fullJs": {
       "file": "effects.full.js",
-      "size": 18678
+      "size": 18759
     },
     "fullCss": {
       "file": "effects.full.css",
@@ -160,11 +160,11 @@
   "ui": {
     "fullJs": {
       "file": "ui.full.js",
-      "size": 41904
+      "size": 42001
     },
     "fullCss": {
       "file": "ui.full.css",
-      "size": 10749
+      "size": 10606
     },
     "packJs": {
       "file": "ui.pack.js",
@@ -174,7 +174,7 @@
   "ux-planning": {
     "fullJs": {
       "file": "ux-planning.full.js",
-      "size": 212411
+      "size": 218563
     },
     "fullCss": {
       "file": "ux-planning.full.css",

package/dist/cdn/packs/ui.full.css

@@ -1,2 +1,2 @@
-theme-picker:not(:defined){display:block}theme-picker{display:inline-block;position:relative;&[variant=inline]{display:block}&[open] .panel{opacity:1;visibility:visible;transform:translateY(0);transition:opacity var(--motion-enter-duration) var(--ease-out),visibility var(--motion-enter-duration) var(--ease-out),transform var(--motion-enter-duration) var(--ease-out)}&[variant=inline] .panel{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;border:none;padding:0;background:transparent}}@scope(theme-picker){.panel{--panel-top: calc(100% + var(--size-xs));--panel-left: 0px;position:absolute;top:var(--panel-top);left:var(--panel-left);z-index:1000;min-inline-size:16rem;padding:var(--size-m);background:var(--color-surface-overlay);border:var(--border-width-thin) solid var(--color-border);border-radius:var(--radius-m);box-shadow:var(--shadow-m);opacity:0;visibility:hidden;transform:translateY(-.25rem);transition:opacity var(--motion-exit-duration) var(--ease-out),visibility var(--motion-exit-duration) var(--ease-out),transform var(--motion-exit-duration) var(--ease-out);&[data-position=top]{transform:translateY(.25rem)}}.section{margin:0;padding:0;border:none;border-radius:0}.section+.section{margin-block-start:var(--size-m);padding-block-start:var(--size-m);border-block-start:var(--border-width-thin) solid var(--color-border)}.section>legend{padding:0;padding-inline:0;margin-block-end:var(--size-s);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-muted)}.options{display:flex;gap:var(--size-xs)}.option{display:block;flex:1;min-inline-size:0;cursor:pointer;& input[type=radio]{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}&:hover .option-content{background:var(--color-hover-bg)}& input:focus-visible+.option-content{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}& input:checked+.option-content{border-color:var(--color-primary);background:var(--color-primary-subtle);color:var(--color-gray-900);& icon-wc{color:var(--color-primary)}}}.option-content{display:flex;flex-direction:column;align-items:center;gap:var(--size-2xs);padding:var(--size-s);border:var(--border-width-thin) solid var(--color-border);border-radius:var(--radius-s);font-size:var(--font-size-sm);text-align:center;transition:border-color var(--duration-fast) var(--ease-default),background-color var(--duration-fast) var(--ease-default);& icon-wc{font-size:1.25em;color:var(--color-text-muted)}}.options--sizing{display:grid;grid-template-columns:1fr 1fr}.option--sizing .option-content{flex-direction:row;align-items:start;gap:var(--size-xs);text-align:start;padding:var(--size-xs) var(--size-s);& icon-wc{flex-shrink:0;margin-block-start:.15em}}.option-text{display:flex;flex-direction:column;& small{font-size:var(--font-size-xs);color:var(--color-text-muted);line-height:1.3}}.option--sizing input:checked+.option-content .option-text small{color:var(--color-primary)}.options--swatch-grid{display:flex;flex-wrap:wrap;gap:var(--size-xs)}.swatch-cell{cursor:pointer;& input[type=radio]{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.swatch-visual{display:flex;align-items:center;justify-content:center;inline-size:2.5rem;block-size:2.5rem;border-radius:var(--radius-s);background:var(--swatch-bg);color:var(--swatch-fg, white);border:var(--border-width-thin) solid oklch(0 0 0 / .15);transition:transform var(--duration-fast) var(--ease-default),border-color var(--duration-fast) var(--ease-default);& icon-wc{font-size:1rem}}&:hover .swatch-visual{transform:scale(1.1);border-color:var(--color-text-muted)}& input:focus-visible+.swatch-visual{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}& input:checked+.swatch-visual{outline:2px solid var(--color-primary);outline-offset:2px;border-color:transparent}&[aria-busy=true] .swatch-visual{opacity:.5;pointer-events:none}}.options--accent-dots{display:flex;flex-wrap:wrap;gap:var(--size-2xs);align-items:center}.accent-dot{cursor:pointer;& input[type=radio]{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}}.accent-dot-visual{display:block;inline-size:1.5rem;block-size:1.5rem;border-radius:50%;border:2px solid oklch(0 0 0 / .1);transition:transform var(--duration-fast) var(--ease-default)}.accent-dot:hover .accent-dot-visual{transform:scale(1.15)}.accent-dot input:checked+.accent-dot-visual{outline:2px solid var(--color-primary);outline-offset:2px;border-color:transparent}.accent-dot input:focus-visible+.accent-dot-visual{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}.compact-select{display:block;inline-size:100%;padding:var(--size-xs) var(--size-s);font:inherit;font-size:var(--font-size-sm);color:var(--color-text);background-color:var(--color-surface);border:var(--border-width-thin) solid var(--color-border);border-radius:var(--radius-s);cursor:pointer;&:focus-visible{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}}@supports (appearance: base-select){.compact-select:not([multiple]){display:flex;align-items:center}}.compact-segmented{display:flex;border:var(--border-width-thin) solid var(--color-border);border-radius:var(--radius-s);overflow:hidden}.compact-seg{flex:1;cursor:pointer;& input[type=radio]{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}& span{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;padding:var(--size-2xs) var(--size-xs);min-block-size:2.5rem;text-align:center;font-size:var(--font-size-sm);line-height:1.2;transition:background-color var(--duration-fast) var(--ease-default),color var(--duration-fast) var(--ease-default)}& span icon-wc{flex-shrink:0}&:not(:last-child) span{border-inline-end:var(--border-width-thin) solid var(--color-border)}&:hover span{background:var(--color-surface-alt)}& input:checked+span{background:var(--color-primary);color:#fff}& input:focus-visible+span{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}}.compact-toggles{display:flex;flex-direction:column;gap:var(--size-xs)}.sr-only{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.theme-category{+.theme-category{margin-block-start:var(--size-s)}}.category-label{display:block;font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.05em;margin-block-end:var(--size-2xs)}.section--more-themes{border-block-start:var(--border-width-thin) solid var(--color-border);&[open] .chevron{transform:rotate(180deg)}}.more-themes-toggle{display:flex;align-items:center;gap:var(--size-xs);padding:var(--size-s) 0;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-muted);cursor:pointer;list-style:none;&::-webkit-details-marker{display:none}&::marker{display:none}.chevron{margin-inline-start:auto;transition:transform var(--duration-fast) var(--ease-default)}&:hover{color:var(--color-text)}}.section--extensions{border-block-start:var(--border-width-thin) solid var(--color-border);&[open] .chevron{transform:rotate(180deg)}}.extensions-toggle{display:flex;align-items:center;gap:var(--size-xs);padding:var(--size-s) 0;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-muted);cursor:pointer;list-style:none;&::-webkit-details-marker{display:none}&::marker{display:none}.chevron{margin-inline-start:auto;transition:transform var(--duration-fast) var(--ease-default)}&:hover{color:var(--color-text)}}.extensions-content{display:flex;flex-direction:column;gap:var(--size-xs);padding-block-end:var(--size-xs)}.extension-toggle{display:flex;align-items:center;justify-content:space-between;gap:var(--size-s);padding:var(--size-xs) var(--size-s);border:var(--border-width-thin) solid var(--color-border);border-radius:var(--radius-s);cursor:pointer;transition:background var(--duration-fast) var(--ease-default);&:hover{background:var(--color-surface-alt)}}.extension-info{display:flex;align-items:center;gap:var(--size-xs);& icon-wc{color:var(--color-text-muted);font-size:1rem}}.extension-name{font-size:var(--font-size-sm)}.section--a11y{border-block-start:var(--border-width-thin) solid var(--color-border)}.options--a11y{display:flex;flex-direction:column;gap:var(--size-xs)}.option--a11y{display:flex;flex:none;cursor:pointer;& input[type=checkbox]{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.option-content{display:flex;flex-direction:row;align-items:center;gap:var(--size-s);inline-size:100%;padding:var(--size-s);border:var(--border-width-thin) solid var(--color-border);border-radius:var(--radius-s);font-size:var(--font-size-sm);text-align:start;transition:border-color var(--duration-fast) var(--ease-default),background-color var(--duration-fast) var(--ease-default)}.option-content:before{content:"";display:block;inline-size:1rem;block-size:1rem;flex-shrink:0;border:var(--border-width-thin) solid var(--color-border);border-radius:var(--radius-xs);background:var(--color-surface);transition:background var(--duration-fast) var(--ease-default),border-color var(--duration-fast) var(--ease-default)}&:hover .option-content{background:var(--color-hover-bg)}& input:focus-visible+.option-content{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}& input:checked+.option-content{border-color:var(--color-primary);background:var(--color-primary-subtle);color:var(--color-gray-900)}& input:checked+.option-content:before{background:var(--color-primary);border-color:var(--color-primary);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");background-size:.75rem;background-repeat:no-repeat;background-position:center}& input:checked+.option-content icon-wc{color:var(--color-primary)}}}@media(prefers-reduced-motion:reduce){@scope(theme-picker){.panel{transition:none;transform:none}.option-content{transition:none}}}
+theme-picker:not(:defined){display:block}theme-picker{display:inline-block;position:relative;&[variant=inline]{display:block}&[open] .panel{opacity:1;visibility:visible;transform:translateY(0);transition:opacity var(--motion-enter-duration) var(--ease-out),visibility var(--motion-enter-duration) var(--ease-out),transform var(--motion-enter-duration) var(--ease-out)}&[variant=inline] .panel{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;border:none;padding:0;background:transparent}}@scope(theme-picker){.panel{--panel-top: calc(100% + var(--size-xs));--panel-left: 0px;position:absolute;top:var(--panel-top);left:var(--panel-left);z-index:1000;min-inline-size:16rem;padding:var(--size-m);background:var(--color-surface-overlay);border:var(--border-width-thin) solid var(--color-border);border-radius:var(--radius-m);box-shadow:var(--shadow-m);opacity:0;visibility:hidden;transform:translateY(-.25rem);transition:opacity var(--motion-exit-duration) var(--ease-out),visibility var(--motion-exit-duration) var(--ease-out),transform var(--motion-exit-duration) var(--ease-out);&[data-position=top]{transform:translateY(.25rem)}}.section{margin:0;padding:0;border:none;border-radius:0}.section+.section{margin-block-start:var(--size-m);padding-block-start:var(--size-m);border-block-start:var(--border-width-thin) solid var(--color-border)}.section>legend{padding:0;padding-inline:0;margin-block-end:var(--size-s);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-muted)}.options{display:flex;gap:var(--size-xs)}.option{display:block;flex:1;min-inline-size:0;cursor:pointer;& input[type=radio]{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}&:hover .option-content{background:var(--color-hover-bg)}& input:focus-visible+.option-content{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}& input:checked+.option-content{border-color:var(--color-primary);background:var(--color-primary-subtle);color:var(--color-gray-900);& icon-wc{color:var(--color-primary)}}}.option-content{display:flex;flex-direction:column;align-items:center;gap:var(--size-2xs);padding:var(--size-s);border:var(--border-width-thin) solid var(--color-border);border-radius:var(--radius-s);font-size:var(--font-size-sm);text-align:center;transition:border-color var(--duration-fast) var(--ease-default),background-color var(--duration-fast) var(--ease-default);& icon-wc{font-size:1.25em;color:var(--color-text-muted)}}.options--sizing{display:grid;grid-template-columns:1fr 1fr}.option--sizing .option-content{flex-direction:row;align-items:start;gap:var(--size-xs);text-align:start;padding:var(--size-xs) var(--size-s);& icon-wc{flex-shrink:0;margin-block-start:.15em}}.option-text{display:flex;flex-direction:column;& small{font-size:var(--font-size-xs);color:var(--color-text-muted);line-height:1.3}}.option--sizing input:checked+.option-content .option-text small{color:var(--color-primary)}.options--swatch-grid{display:flex;flex-wrap:wrap;gap:var(--size-xs)}.swatch-cell{cursor:pointer;& input[type=radio]{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.swatch-visual{display:flex;align-items:center;justify-content:center;inline-size:2.5rem;block-size:2.5rem;border-radius:var(--radius-s);background:var(--swatch-bg);color:var(--swatch-fg, white);border:var(--border-width-thin) solid oklch(0 0 0 / .15);transition:transform var(--duration-fast) var(--ease-default),border-color var(--duration-fast) var(--ease-default);& icon-wc{font-size:1rem}}&:hover .swatch-visual{transform:scale(1.1);border-color:var(--color-text-muted)}& input:focus-visible+.swatch-visual{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}& input:checked+.swatch-visual{outline:2px solid var(--color-primary);outline-offset:2px;border-color:transparent}&[aria-busy=true] .swatch-visual{opacity:.5;pointer-events:none}}.options--accent-dots{display:flex;flex-wrap:wrap;gap:var(--size-2xs);align-items:center}.accent-dot{cursor:pointer;& input[type=radio]{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}}.accent-dot-visual{display:block;inline-size:1.5rem;block-size:1.5rem;border-radius:50%;border:2px solid oklch(0 0 0 / .1);transition:transform var(--duration-fast) var(--ease-default)}.accent-dot:hover .accent-dot-visual{transform:scale(1.15)}.accent-dot input:checked+.accent-dot-visual{outline:2px solid var(--color-primary);outline-offset:2px;border-color:transparent}.accent-dot input:focus-visible+.accent-dot-visual{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}.compact-select{display:block;inline-size:100%;padding:var(--size-xs) var(--size-s);font:inherit;font-size:var(--font-size-sm);color:var(--color-text);background-color:var(--color-surface);border:var(--border-width-thin) solid var(--color-border);border-radius:var(--radius-s);cursor:pointer;&:focus-visible{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}}@supports (appearance: base-select){.compact-select:not([multiple]){display:flex;align-items:center}}.compact-segmented{display:flex;border:var(--border-width-thin) solid var(--color-border);border-radius:var(--radius-s);overflow:hidden}.compact-seg{flex:1;cursor:pointer;& input[type=radio]{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}& span{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;padding:var(--size-2xs) var(--size-xs);min-block-size:2.5rem;text-align:center;font-size:var(--font-size-sm);line-height:1.2;transition:background-color var(--duration-fast) var(--ease-default),color var(--duration-fast) var(--ease-default)}& span icon-wc{flex-shrink:0}&:not(:last-child) span{border-inline-end:var(--border-width-thin) solid var(--color-border)}&:hover span{background:var(--color-surface-alt)}& input:checked+span{background:var(--color-primary);color:#fff}& input:focus-visible+span{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}}.compact-toggles{display:flex;flex-direction:column;gap:var(--size-xs)}.theme-category{+.theme-category{margin-block-start:var(--size-s)}}.category-label{display:block;font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.05em;margin-block-end:var(--size-2xs)}.section--more-themes{border-block-start:var(--border-width-thin) solid var(--color-border);&[open] .chevron{transform:rotate(180deg)}}.more-themes-toggle{display:flex;align-items:center;gap:var(--size-xs);padding:var(--size-s) 0;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-muted);cursor:pointer;list-style:none;&::-webkit-details-marker{display:none}&::marker{display:none}.chevron{margin-inline-start:auto;transition:transform var(--duration-fast) var(--ease-default)}&:hover{color:var(--color-text)}}.section--extensions{border-block-start:var(--border-width-thin) solid var(--color-border);&[open] .chevron{transform:rotate(180deg)}}.extensions-toggle{display:flex;align-items:center;gap:var(--size-xs);padding:var(--size-s) 0;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-muted);cursor:pointer;list-style:none;&::-webkit-details-marker{display:none}&::marker{display:none}.chevron{margin-inline-start:auto;transition:transform var(--duration-fast) var(--ease-default)}&:hover{color:var(--color-text)}}.extensions-content{display:flex;flex-direction:column;gap:var(--size-xs);padding-block-end:var(--size-xs)}.extension-toggle{display:flex;align-items:center;justify-content:space-between;gap:var(--size-s);padding:var(--size-xs) var(--size-s);border:var(--border-width-thin) solid var(--color-border);border-radius:var(--radius-s);cursor:pointer;transition:background var(--duration-fast) var(--ease-default);&:hover{background:var(--color-surface-alt)}}.extension-info{display:flex;align-items:center;gap:var(--size-xs);& icon-wc{color:var(--color-text-muted);font-size:1rem}}.extension-name{font-size:var(--font-size-sm)}.section--a11y{border-block-start:var(--border-width-thin) solid var(--color-border)}.options--a11y{display:flex;flex-direction:column;gap:var(--size-xs)}.option--a11y{display:flex;flex:none;cursor:pointer;& input[type=checkbox]{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.option-content{display:flex;flex-direction:row;align-items:center;gap:var(--size-s);inline-size:100%;padding:var(--size-s);border:var(--border-width-thin) solid var(--color-border);border-radius:var(--radius-s);font-size:var(--font-size-sm);text-align:start;transition:border-color var(--duration-fast) var(--ease-default),background-color var(--duration-fast) var(--ease-default)}.option-content:before{content:"";display:block;inline-size:1rem;block-size:1rem;flex-shrink:0;border:var(--border-width-thin) solid var(--color-border);border-radius:var(--radius-xs);background:var(--color-surface);transition:background var(--duration-fast) var(--ease-default),border-color var(--duration-fast) var(--ease-default)}&:hover .option-content{background:var(--color-hover-bg)}& input:focus-visible+.option-content{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}& input:checked+.option-content{border-color:var(--color-primary);background:var(--color-primary-subtle);color:var(--color-gray-900)}& input:checked+.option-content:before{background:var(--color-primary);border-color:var(--color-primary);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");background-size:.75rem;background-repeat:no-repeat;background-position:center}& input:checked+.option-content icon-wc{color:var(--color-primary)}}}@media(prefers-reduced-motion:reduce){@scope(theme-picker){.panel{transition:none;transform:none}.option-content{transition:none}}}
 /*# sourceMappingURL=ui.full.css.map */