@patimweb/crtstyleguide 1.0.18 → 1.0.20

package/dist/lib/index.js

@@ -1,21 +1,21 @@
-import { css as d, LitElement as h, html as l } from "lit";
-const u = (e) => (t, a) => {
+import { css as c, LitElement as p, html as l } from "lit";
+const d = (e) => (t, a) => {
   a !== void 0 ? a.addInitializer(() => {
     customElements.define(e, t);
   }) : customElements.define(e, t);
 };
-const Tt = globalThis, Jt = Tt.ShadowRoot && (Tt.ShadyCSS === void 0 || Tt.ShadyCSS.nativeShadow) && "adoptedStyleSheets" in Document.prototype && "replace" in CSSStyleSheet.prototype, ke = /* @__PURE__ */ Symbol(), de = /* @__PURE__ */ new WeakMap();
-let Oe = class {
-  constructor(t, a, s) {
-    if (this._$cssResult$ = !0, s !== ke) throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");
+const zt = globalThis, Nt = zt.ShadowRoot && (zt.ShadyCSS === void 0 || zt.ShadyCSS.nativeShadow) && "adoptedStyleSheets" in Document.prototype && "replace" in CSSStyleSheet.prototype, te = /* @__PURE__ */ Symbol(), Gt = /* @__PURE__ */ new WeakMap();
+let se = class {
+  constructor(t, a, i) {
+    if (this._$cssResult$ = !0, i !== te) throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");
     this.cssText = t, this.t = a;
   }
   get styleSheet() {
     let t = this.o;
     const a = this.t;
-    if (Jt && t === void 0) {
-      const s = a !== void 0 && a.length === 1;
-      s && (t = de.get(a)), t === void 0 && ((this.o = t = new CSSStyleSheet()).replaceSync(this.cssText), s && de.set(a, t));
+    if (Nt && t === void 0) {
+      const i = a !== void 0 && a.length === 1;
+      i && (t = Gt.get(a)), t === void 0 && ((this.o = t = new CSSStyleSheet()).replaceSync(this.cssText), i && Gt.set(a, t));
     }
     return t;
   }
@@ -23,21 +23,21 @@ let Oe = class {
     return this.cssText;
   }
 };
-const Ae = (e) => new Oe(typeof e == "string" ? e : e + "", void 0, ke), Se = (e, t) => {
-  if (Jt) e.adoptedStyleSheets = t.map((a) => a instanceof CSSStyleSheet ? a : a.styleSheet);
+const oe = (e) => new se(typeof e == "string" ? e : e + "", void 0, te), ne = (e, t) => {
+  if (Nt) e.adoptedStyleSheets = t.map((a) => a instanceof CSSStyleSheet ? a : a.styleSheet);
   else for (const a of t) {
-    const s = document.createElement("style"), r = Tt.litNonce;
-    r !== void 0 && s.setAttribute("nonce", r), s.textContent = a.cssText, e.appendChild(s);
+    const i = document.createElement("style"), r = zt.litNonce;
+    r !== void 0 && i.setAttribute("nonce", r), i.textContent = a.cssText, e.appendChild(i);
   }
-}, he = Jt ? (e) => e : (e) => e instanceof CSSStyleSheet ? ((t) => {
+}, Qt = Nt ? (e) => e : (e) => e instanceof CSSStyleSheet ? ((t) => {
   let a = "";
-  for (const s of t.cssRules) a += s.cssText;
-  return Ae(a);
+  for (const i of t.cssRules) a += i.cssText;
+  return oe(a);
 })(e) : e;
-const { is: Ee, defineProperty: Me, getOwnPropertyDescriptor: De, getOwnPropertyNames: Te, getOwnPropertySymbols: je, getPrototypeOf: Le } = Object, Vt = globalThis, ue = Vt.trustedTypes, Ie = ue ? ue.emptyScript : "", Be = Vt.reactiveElementPolyfillSupport, bt = (e, t) => e, jt = { toAttribute(e, t) {
+const { is: le, defineProperty: ce, getOwnPropertyDescriptor: pe, getOwnPropertyNames: de, getOwnPropertySymbols: he, getPrototypeOf: ve } = Object, It = globalThis, Jt = It.trustedTypes, ue = Jt ? Jt.emptyScript : "", ge = It.reactiveElementPolyfillSupport, pt = (e, t) => e, Ct = { toAttribute(e, t) {
   switch (t) {
     case Boolean:
-      e = e ? Ie : null;
+      e = e ? ue : null;
       break;
     case Object:
     case Array:
@@ -62,54 +62,54 @@ const { is: Ee, defineProperty: Me, getOwnPropertyDescriptor: De, getOwnProperty
       }
   }
   return a;
-} }, te = (e, t) => !Ee(e, t), ve = { attribute: !0, type: String, converter: jt, reflect: !1, useDefault: !1, hasChanged: te };
-Symbol.metadata ??= /* @__PURE__ */ Symbol("metadata"), Vt.litPropertyMetadata ??= /* @__PURE__ */ new WeakMap();
-let mt = class extends HTMLElement {
+} }, Rt = (e, t) => !le(e, t), Zt = { attribute: !0, type: String, converter: Ct, reflect: !1, useDefault: !1, hasChanged: Rt };
+Symbol.metadata ??= /* @__PURE__ */ Symbol("metadata"), It.litPropertyMetadata ??= /* @__PURE__ */ new WeakMap();
+class ct extends HTMLElement {
   static addInitializer(t) {
     this._$Ei(), (this.l ??= []).push(t);
   }
   static get observedAttributes() {
     return this.finalize(), this._$Eh && [...this._$Eh.keys()];
   }
-  static createProperty(t, a = ve) {
+  static createProperty(t, a = Zt) {
     if (a.state && (a.attribute = !1), this._$Ei(), this.prototype.hasOwnProperty(t) && ((a = Object.create(a)).wrapped = !0), this.elementProperties.set(t, a), !a.noAccessor) {
-      const s = /* @__PURE__ */ Symbol(), r = this.getPropertyDescriptor(t, s, a);
-      r !== void 0 && Me(this.prototype, t, r);
+      const i = /* @__PURE__ */ Symbol(), r = this.getPropertyDescriptor(t, i, a);
+      r !== void 0 && ce(this.prototype, t, r);
     }
   }
-  static getPropertyDescriptor(t, a, s) {
-    const { get: r, set: i } = De(this.prototype, t) ?? { get() {
+  static getPropertyDescriptor(t, a, i) {
+    const { get: r, set: s } = pe(this.prototype, t) ?? { get() {
       return this[a];
     }, set(o) {
       this[a] = o;
     } };
     return { get: r, set(o) {
-      const c = r?.call(this);
-      i?.call(this, o), this.requestUpdate(t, c, s);
+      const h = r?.call(this);
+      s?.call(this, o), this.requestUpdate(t, h, i);
     }, configurable: !0, enumerable: !0 };
   }
   static getPropertyOptions(t) {
-    return this.elementProperties.get(t) ?? ve;
+    return this.elementProperties.get(t) ?? Zt;
   }
   static _$Ei() {
-    if (this.hasOwnProperty(bt("elementProperties"))) return;
-    const t = Le(this);
+    if (this.hasOwnProperty(pt("elementProperties"))) return;
+    const t = ve(this);
     t.finalize(), t.l !== void 0 && (this.l = [...t.l]), this.elementProperties = new Map(t.elementProperties);
   }
   static finalize() {
-    if (this.hasOwnProperty(bt("finalized"))) return;
-    if (this.finalized = !0, this._$Ei(), this.hasOwnProperty(bt("properties"))) {
-      const a = this.properties, s = [...Te(a), ...je(a)];
-      for (const r of s) this.createProperty(r, a[r]);
+    if (this.hasOwnProperty(pt("finalized"))) return;
+    if (this.finalized = !0, this._$Ei(), this.hasOwnProperty(pt("properties"))) {
+      const a = this.properties, i = [...de(a), ...he(a)];
+      for (const r of i) this.createProperty(r, a[r]);
     }
     const t = this[Symbol.metadata];
     if (t !== null) {
       const a = litPropertyMetadata.get(t);
-      if (a !== void 0) for (const [s, r] of a) this.elementProperties.set(s, r);
+      if (a !== void 0) for (const [i, r] of a) this.elementProperties.set(i, r);
     }
     this._$Eh = /* @__PURE__ */ new Map();
-    for (const [a, s] of this.elementProperties) {
-      const r = this._$Eu(a, s);
+    for (const [a, i] of this.elementProperties) {
+      const r = this._$Eu(a, i);
       r !== void 0 && this._$Eh.set(r, a);
     }
     this.elementStyles = this.finalizeStyles(this.styles);
@@ -117,14 +117,14 @@ let mt = class extends HTMLElement {
   static finalizeStyles(t) {
     const a = [];
     if (Array.isArray(t)) {
-      const s = new Set(t.flat(1 / 0).reverse());
-      for (const r of s) a.unshift(he(r));
-    } else t !== void 0 && a.push(he(t));
+      const i = new Set(t.flat(1 / 0).reverse());
+      for (const r of i) a.unshift(Qt(r));
+    } else t !== void 0 && a.push(Qt(t));
     return a;
   }
   static _$Eu(t, a) {
-    const s = a.attribute;
-    return s === !1 ? void 0 : typeof s == "string" ? s : typeof t == "string" ? t.toLowerCase() : void 0;
+    const i = a.attribute;
+    return i === !1 ? void 0 : typeof i == "string" ? i : typeof t == "string" ? t.toLowerCase() : void 0;
   }
   constructor() {
     super(), this._$Ep = void 0, this.isUpdatePending = !1, this.hasUpdated = !1, this._$Em = null, this._$Ev();
@@ -140,12 +140,12 @@ let mt = class extends HTMLElement {
   }
   _$E_() {
     const t = /* @__PURE__ */ new Map(), a = this.constructor.elementProperties;
-    for (const s of a.keys()) this.hasOwnProperty(s) && (t.set(s, this[s]), delete this[s]);
+    for (const i of a.keys()) this.hasOwnProperty(i) && (t.set(i, this[i]), delete this[i]);
     t.size > 0 && (this._$Ep = t);
   }
   createRenderRoot() {
     const t = this.shadowRoot ?? this.attachShadow(this.constructor.shadowRootOptions);
-    return Se(t, this.constructor.elementStyles), t;
+    return ne(t, this.constructor.elementStyles), t;
   }
   connectedCallback() {
     this.renderRoot ??= this.createRenderRoot(), this.enableUpdating(!0), this._$EO?.forEach((t) => t.hostConnected?.());
@@ -155,35 +155,35 @@ let mt = class extends HTMLElement {
   disconnectedCallback() {
     this._$EO?.forEach((t) => t.hostDisconnected?.());
   }
-  attributeChangedCallback(t, a, s) {
-    this._$AK(t, s);
+  attributeChangedCallback(t, a, i) {
+    this._$AK(t, i);
   }
   _$ET(t, a) {
-    const s = this.constructor.elementProperties.get(t), r = this.constructor._$Eu(t, s);
-    if (r !== void 0 && s.reflect === !0) {
-      const i = (s.converter?.toAttribute !== void 0 ? s.converter : jt).toAttribute(a, s.type);
-      this._$Em = t, i == null ? this.removeAttribute(r) : this.setAttribute(r, i), this._$Em = null;
+    const i = this.constructor.elementProperties.get(t), r = this.constructor._$Eu(t, i);
+    if (r !== void 0 && i.reflect === !0) {
+      const s = (i.converter?.toAttribute !== void 0 ? i.converter : Ct).toAttribute(a, i.type);
+      this._$Em = t, s == null ? this.removeAttribute(r) : this.setAttribute(r, s), this._$Em = null;
     }
   }
   _$AK(t, a) {
-    const s = this.constructor, r = s._$Eh.get(t);
+    const i = this.constructor, r = i._$Eh.get(t);
     if (r !== void 0 && this._$Em !== r) {
-      const i = s.getPropertyOptions(r), o = typeof i.converter == "function" ? { fromAttribute: i.converter } : i.converter?.fromAttribute !== void 0 ? i.converter : jt;
+      const s = i.getPropertyOptions(r), o = typeof s.converter == "function" ? { fromAttribute: s.converter } : s.converter?.fromAttribute !== void 0 ? s.converter : Ct;
       this._$Em = r;
-      const c = o.fromAttribute(a, i.type);
-      this[r] = c ?? this._$Ej?.get(r) ?? c, this._$Em = null;
+      const h = o.fromAttribute(a, s.type);
+      this[r] = h ?? this._$Ej?.get(r) ?? h, this._$Em = null;
     }
   }
-  requestUpdate(t, a, s, r = !1, i) {
+  requestUpdate(t, a, i, r = !1, s) {
     if (t !== void 0) {
       const o = this.constructor;
-      if (r === !1 && (i = this[t]), s ??= o.getPropertyOptions(t), !((s.hasChanged ?? te)(i, a) || s.useDefault && s.reflect && i === this._$Ej?.get(t) && !this.hasAttribute(o._$Eu(t, s)))) return;
-      this.C(t, a, s);
+      if (r === !1 && (s = this[t]), i ??= o.getPropertyOptions(t), !((i.hasChanged ?? Rt)(s, a) || i.useDefault && i.reflect && s === this._$Ej?.get(t) && !this.hasAttribute(o._$Eu(t, i)))) return;
+      this.C(t, a, i);
     }
     this.isUpdatePending === !1 && (this._$ES = this._$EP());
   }
-  C(t, a, { useDefault: s, reflect: r, wrapped: i }, o) {
-    s && !(this._$Ej ??= /* @__PURE__ */ new Map()).has(t) && (this._$Ej.set(t, o ?? a ?? this[t]), i !== !0 || o !== void 0) || (this._$AL.has(t) || (this.hasUpdated || s || (a = void 0), this._$AL.set(t, a)), r === !0 && this._$Em !== t && (this._$Eq ??= /* @__PURE__ */ new Set()).add(t));
+  C(t, a, { useDefault: i, reflect: r, wrapped: s }, o) {
+    i && !(this._$Ej ??= /* @__PURE__ */ new Map()).has(t) && (this._$Ej.set(t, o ?? a ?? this[t]), s !== !0 || o !== void 0) || (this._$AL.has(t) || (this.hasUpdated || i || (a = void 0), this._$AL.set(t, a)), r === !0 && this._$Em !== t && (this._$Eq ??= /* @__PURE__ */ new Set()).add(t));
   }
   async _$EP() {
     this.isUpdatePending = !0;
@@ -202,21 +202,21 @@ let mt = class extends HTMLElement {
     if (!this.isUpdatePending) return;
     if (!this.hasUpdated) {
       if (this.renderRoot ??= this.createRenderRoot(), this._$Ep) {
-        for (const [r, i] of this._$Ep) this[r] = i;
+        for (const [r, s] of this._$Ep) this[r] = s;
         this._$Ep = void 0;
       }
-      const s = this.constructor.elementProperties;
-      if (s.size > 0) for (const [r, i] of s) {
-        const { wrapped: o } = i, c = this[r];
-        o !== !0 || this._$AL.has(r) || c === void 0 || this.C(r, void 0, i, c);
+      const i = this.constructor.elementProperties;
+      if (i.size > 0) for (const [r, s] of i) {
+        const { wrapped: o } = s, h = this[r];
+        o !== !0 || this._$AL.has(r) || h === void 0 || this.C(r, void 0, s, h);
       }
     }
     let t = !1;
     const a = this._$AL;
     try {
-      t = this.shouldUpdate(a), t ? (this.willUpdate(a), this._$EO?.forEach((s) => s.hostUpdate?.()), this.update(a)) : this._$EM();
-    } catch (s) {
-      throw t = !1, this._$EM(), s;
+      t = this.shouldUpdate(a), t ? (this.willUpdate(a), this._$EO?.forEach((i) => i.hostUpdate?.()), this.update(a)) : this._$EM();
+    } catch (i) {
+      throw t = !1, this._$EM(), i;
     }
     t && this._$AE(a);
   }
@@ -244,302 +244,53 @@ let mt = class extends HTMLElement {
   }
   firstUpdated(t) {
   }
-};
-mt.elementStyles = [], mt.shadowRootOptions = { mode: "open" }, mt[bt("elementProperties")] = /* @__PURE__ */ new Map(), mt[bt("finalized")] = /* @__PURE__ */ new Map(), Be?.({ ReactiveElement: mt }), (Vt.reactiveElementVersions ??= []).push("2.1.2");
-const Ne = { attribute: !0, type: String, converter: jt, reflect: !1, hasChanged: te }, Ue = (e = Ne, t, a) => {
-  const { kind: s, metadata: r } = a;
-  let i = globalThis.litPropertyMetadata.get(r);
-  if (i === void 0 && globalThis.litPropertyMetadata.set(r, i = /* @__PURE__ */ new Map()), s === "setter" && ((e = Object.create(e)).wrapped = !0), i.set(a.name, e), s === "accessor") {
+}
+ct.elementStyles = [], ct.shadowRootOptions = { mode: "open" }, ct[pt("elementProperties")] = /* @__PURE__ */ new Map(), ct[pt("finalized")] = /* @__PURE__ */ new Map(), ge?.({ ReactiveElement: ct }), (It.reactiveElementVersions ??= []).push("2.1.2");
+const me = { attribute: !0, type: String, converter: Ct, reflect: !1, hasChanged: Rt }, fe = (e = me, t, a) => {
+  const { kind: i, metadata: r } = a;
+  let s = globalThis.litPropertyMetadata.get(r);
+  if (s === void 0 && globalThis.litPropertyMetadata.set(r, s = /* @__PURE__ */ new Map()), i === "setter" && ((e = Object.create(e)).wrapped = !0), s.set(a.name, e), i === "accessor") {
     const { name: o } = a;
-    return { set(c) {
-      const p = t.get.call(this);
-      t.set.call(this, c), this.requestUpdate(o, p, e, !0, c);
-    }, init(c) {
-      return c !== void 0 && this.C(o, void 0, e, c), c;
+    return { set(h) {
+      const f = t.get.call(this);
+      t.set.call(this, h), this.requestUpdate(o, f, e, !0, h);
+    }, init(h) {
+      return h !== void 0 && this.C(o, void 0, e, h), h;
     } };
   }
-  if (s === "setter") {
+  if (i === "setter") {
     const { name: o } = a;
-    return function(c) {
-      const p = this[o];
-      t.call(this, c), this.requestUpdate(o, p, e, !0, c);
+    return function(h) {
+      const f = this[o];
+      t.call(this, h), this.requestUpdate(o, f, e, !0, h);
     };
   }
-  throw Error("Unsupported decorator location: " + s);
+  throw Error("Unsupported decorator location: " + i);
 };
 function n(e) {
-  return (t, a) => typeof a == "object" ? Ue(e, t, a) : ((s, r, i) => {
-    const o = r.hasOwnProperty(i);
-    return r.constructor.createProperty(i, s), o ? Object.getOwnPropertyDescriptor(r, i) : void 0;
+  return (t, a) => typeof a == "object" ? fe(e, t, a) : ((i, r, s) => {
+    const o = r.hasOwnProperty(s);
+    return r.constructor.createProperty(s, i), o ? Object.getOwnPropertyDescriptor(r, s) : void 0;
   })(e, t, a);
 }
-function m(e) {
+function v(e) {
   return n({ ...e, state: !0, attribute: !1 });
 }
-const Re = (e, t, a) => (a.configurable = !0, a.enumerable = !0, Reflect.decorate && typeof t != "object" && Object.defineProperty(e, t, a), a);
-function ee(e, t) {
-  return (a, s, r) => {
-    const i = (o) => o.renderRoot?.querySelector(e) ?? null;
-    return Re(a, s, { get() {
-      return i(this);
+const be = (e, t, a) => (a.configurable = !0, a.enumerable = !0, Reflect.decorate && typeof t != "object" && Object.defineProperty(e, t, a), a);
+function Ft(e, t) {
+  return (a, i, r) => {
+    const s = (o) => o.renderRoot?.querySelector(e) ?? null;
+    return be(a, i, { get() {
+      return s(this);
     } });
   };
 }
-const re = globalThis, ge = (e) => e, Lt = re.trustedTypes, me = Lt ? Lt.createPolicy("lit-html", { createHTML: (e) => e }) : void 0, $e = "$lit$", F = `lit$${Math.random().toFixed(9).slice(2)}$`, _e = "?" + F, Fe = `<${_e}>`, Q = document, It = () => Q.createComment(""), yt = (e) => e === null || typeof e != "object" && typeof e != "function", ae = Array.isArray, He = (e) => ae(e) || typeof e?.[Symbol.iterator] == "function", Gt = `[ 	
-\f\r]`, ft = /<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g, fe = /-->/g, be = />/g, G = RegExp(`>|${Gt}(?:([^\\s"'>=/]+)(${Gt}*=${Gt}*(?:[^ 	
-\f\r"'\`<>=]|("|')|))|$)`, "g"), ye = /'/g, xe = /"/g, ze = /^(?:script|style|textarea|title)$/i, ct = /* @__PURE__ */ Symbol.for("lit-noChange"), f = /* @__PURE__ */ Symbol.for("lit-nothing"), we = /* @__PURE__ */ new WeakMap(), Z = Q.createTreeWalker(Q, 129);
-function Ce(e, t) {
-  if (!ae(e) || !e.hasOwnProperty("raw")) throw Error("invalid template strings array");
-  return me !== void 0 ? me.createHTML(t) : t;
-}
-const Ye = (e, t) => {
-  const a = e.length - 1, s = [];
-  let r, i = t === 2 ? "<svg>" : t === 3 ? "<math>" : "", o = ft;
-  for (let c = 0; c < a; c++) {
-    const p = e[c];
-    let v, b, g = -1, E = 0;
-    for (; E < p.length && (o.lastIndex = E, b = o.exec(p), b !== null); ) E = o.lastIndex, o === ft ? b[1] === "!--" ? o = fe : b[1] !== void 0 ? o = be : b[2] !== void 0 ? (ze.test(b[2]) && (r = RegExp("</" + b[2], "g")), o = G) : b[3] !== void 0 && (o = G) : o === G ? b[0] === ">" ? (o = r ?? ft, g = -1) : b[1] === void 0 ? g = -2 : (g = o.lastIndex - b[2].length, v = b[1], o = b[3] === void 0 ? G : b[3] === '"' ? xe : ye) : o === xe || o === ye ? o = G : o === fe || o === be ? o = ft : (o = G, r = void 0);
-    const R = o === G && e[c + 1].startsWith("/>") ? " " : "";
-    i += o === ft ? p + Fe : g >= 0 ? (s.push(v), p.slice(0, g) + $e + p.slice(g) + F + R) : p + F + (g === -2 ? c : R);
-  }
-  return [Ce(e, i + (e[a] || "<?>") + (t === 2 ? "</svg>" : t === 3 ? "</math>" : "")), s];
-};
-class xt {
-  constructor({ strings: t, _$litType$: a }, s) {
-    let r;
-    this.parts = [];
-    let i = 0, o = 0;
-    const c = t.length - 1, p = this.parts, [v, b] = Ye(t, a);
-    if (this.el = xt.createElement(v, s), Z.currentNode = this.el.content, a === 2 || a === 3) {
-      const g = this.el.content.firstChild;
-      g.replaceWith(...g.childNodes);
-    }
-    for (; (r = Z.nextNode()) !== null && p.length < c; ) {
-      if (r.nodeType === 1) {
-        if (r.hasAttributes()) for (const g of r.getAttributeNames()) if (g.endsWith($e)) {
-          const E = b[o++], R = r.getAttribute(g).split(F), Dt = /([.?@])?(.*)/.exec(E);
-          p.push({ type: 1, index: i, name: Dt[2], strings: R, ctor: Dt[1] === "." ? qe : Dt[1] === "?" ? We : Dt[1] === "@" ? Xe : Wt }), r.removeAttribute(g);
-        } else g.startsWith(F) && (p.push({ type: 6, index: i }), r.removeAttribute(g));
-        if (ze.test(r.tagName)) {
-          const g = r.textContent.split(F), E = g.length - 1;
-          if (E > 0) {
-            r.textContent = Lt ? Lt.emptyScript : "";
-            for (let R = 0; R < E; R++) r.append(g[R], It()), Z.nextNode(), p.push({ type: 2, index: ++i });
-            r.append(g[E], It());
-          }
-        }
-      } else if (r.nodeType === 8) if (r.data === _e) p.push({ type: 2, index: i });
-      else {
-        let g = -1;
-        for (; (g = r.data.indexOf(F, g + 1)) !== -1; ) p.push({ type: 7, index: i }), g += F.length - 1;
-      }
-      i++;
-    }
-  }
-  static createElement(t, a) {
-    const s = Q.createElement("template");
-    return s.innerHTML = t, s;
-  }
-}
-function pt(e, t, a = e, s) {
-  if (t === ct) return t;
-  let r = s !== void 0 ? a._$Co?.[s] : a._$Cl;
-  const i = yt(t) ? void 0 : t._$litDirective$;
-  return r?.constructor !== i && (r?._$AO?.(!1), i === void 0 ? r = void 0 : (r = new i(e), r._$AT(e, a, s)), s !== void 0 ? (a._$Co ??= [])[s] = r : a._$Cl = r), r !== void 0 && (t = pt(e, r._$AS(e, t.values), r, s)), t;
-}
-class Ve {
-  constructor(t, a) {
-    this._$AV = [], this._$AN = void 0, this._$AD = t, this._$AM = a;
-  }
-  get parentNode() {
-    return this._$AM.parentNode;
-  }
-  get _$AU() {
-    return this._$AM._$AU;
-  }
-  u(t) {
-    const { el: { content: a }, parts: s } = this._$AD, r = (t?.creationScope ?? Q).importNode(a, !0);
-    Z.currentNode = r;
-    let i = Z.nextNode(), o = 0, c = 0, p = s[0];
-    for (; p !== void 0; ) {
-      if (o === p.index) {
-        let v;
-        p.type === 2 ? v = new qt(i, i.nextSibling, this, t) : p.type === 1 ? v = new p.ctor(i, p.name, p.strings, this, t) : p.type === 6 && (v = new Ke(i, this, t)), this._$AV.push(v), p = s[++c];
-      }
-      o !== p?.index && (i = Z.nextNode(), o++);
-    }
-    return Z.currentNode = Q, r;
-  }
-  p(t) {
-    let a = 0;
-    for (const s of this._$AV) s !== void 0 && (s.strings !== void 0 ? (s._$AI(t, s, a), a += s.strings.length - 2) : s._$AI(t[a])), a++;
-  }
-}
-class qt {
-  get _$AU() {
-    return this._$AM?._$AU ?? this._$Cv;
-  }
-  constructor(t, a, s, r) {
-    this.type = 2, this._$AH = f, this._$AN = void 0, this._$AA = t, this._$AB = a, this._$AM = s, this.options = r, this._$Cv = r?.isConnected ?? !0;
-  }
-  get parentNode() {
-    let t = this._$AA.parentNode;
-    const a = this._$AM;
-    return a !== void 0 && t?.nodeType === 11 && (t = a.parentNode), t;
-  }
-  get startNode() {
-    return this._$AA;
-  }
-  get endNode() {
-    return this._$AB;
-  }
-  _$AI(t, a = this) {
-    t = pt(this, t, a), yt(t) ? t === f || t == null || t === "" ? (this._$AH !== f && this._$AR(), this._$AH = f) : t !== this._$AH && t !== ct && this._(t) : t._$litType$ !== void 0 ? this.$(t) : t.nodeType !== void 0 ? this.T(t) : He(t) ? this.k(t) : this._(t);
-  }
-  O(t) {
-    return this._$AA.parentNode.insertBefore(t, this._$AB);
-  }
-  T(t) {
-    this._$AH !== t && (this._$AR(), this._$AH = this.O(t));
-  }
-  _(t) {
-    this._$AH !== f && yt(this._$AH) ? this._$AA.nextSibling.data = t : this.T(Q.createTextNode(t)), this._$AH = t;
-  }
-  $(t) {
-    const { values: a, _$litType$: s } = t, r = typeof s == "number" ? this._$AC(t) : (s.el === void 0 && (s.el = xt.createElement(Ce(s.h, s.h[0]), this.options)), s);
-    if (this._$AH?._$AD === r) this._$AH.p(a);
-    else {
-      const i = new Ve(r, this), o = i.u(this.options);
-      i.p(a), this.T(o), this._$AH = i;
-    }
-  }
-  _$AC(t) {
-    let a = we.get(t.strings);
-    return a === void 0 && we.set(t.strings, a = new xt(t)), a;
-  }
-  k(t) {
-    ae(this._$AH) || (this._$AH = [], this._$AR());
-    const a = this._$AH;
-    let s, r = 0;
-    for (const i of t) r === a.length ? a.push(s = new qt(this.O(It()), this.O(It()), this, this.options)) : s = a[r], s._$AI(i), r++;
-    r < a.length && (this._$AR(s && s._$AB.nextSibling, r), a.length = r);
-  }
-  _$AR(t = this._$AA.nextSibling, a) {
-    for (this._$AP?.(!1, !0, a); t !== this._$AB; ) {
-      const s = ge(t).nextSibling;
-      ge(t).remove(), t = s;
-    }
-  }
-  setConnected(t) {
-    this._$AM === void 0 && (this._$Cv = t, this._$AP?.(t));
-  }
-}
-class Wt {
-  get tagName() {
-    return this.element.tagName;
-  }
-  get _$AU() {
-    return this._$AM._$AU;
-  }
-  constructor(t, a, s, r, i) {
-    this.type = 1, this._$AH = f, this._$AN = void 0, this.element = t, this.name = a, this._$AM = r, this.options = i, s.length > 2 || s[0] !== "" || s[1] !== "" ? (this._$AH = Array(s.length - 1).fill(new String()), this.strings = s) : this._$AH = f;
-  }
-  _$AI(t, a = this, s, r) {
-    const i = this.strings;
-    let o = !1;
-    if (i === void 0) t = pt(this, t, a, 0), o = !yt(t) || t !== this._$AH && t !== ct, o && (this._$AH = t);
-    else {
-      const c = t;
-      let p, v;
-      for (t = i[0], p = 0; p < i.length - 1; p++) v = pt(this, c[s + p], a, p), v === ct && (v = this._$AH[p]), o ||= !yt(v) || v !== this._$AH[p], v === f ? t = f : t !== f && (t += (v ?? "") + i[p + 1]), this._$AH[p] = v;
-    }
-    o && !r && this.j(t);
-  }
-  j(t) {
-    t === f ? this.element.removeAttribute(this.name) : this.element.setAttribute(this.name, t ?? "");
-  }
-}
-class qe extends Wt {
-  constructor() {
-    super(...arguments), this.type = 3;
-  }
-  j(t) {
-    this.element[this.name] = t === f ? void 0 : t;
-  }
-}
-class We extends Wt {
-  constructor() {
-    super(...arguments), this.type = 4;
-  }
-  j(t) {
-    this.element.toggleAttribute(this.name, !!t && t !== f);
-  }
-}
-class Xe extends Wt {
-  constructor(t, a, s, r, i) {
-    super(t, a, s, r, i), this.type = 5;
-  }
-  _$AI(t, a = this) {
-    if ((t = pt(this, t, a, 0) ?? f) === ct) return;
-    const s = this._$AH, r = t === f && s !== f || t.capture !== s.capture || t.once !== s.once || t.passive !== s.passive, i = t !== f && (s === f || r);
-    r && this.element.removeEventListener(this.name, this, s), i && this.element.addEventListener(this.name, this, t), this._$AH = t;
-  }
-  handleEvent(t) {
-    typeof this._$AH == "function" ? this._$AH.call(this.options?.host ?? this.element, t) : this._$AH.handleEvent(t);
-  }
-}
-class Ke {
-  constructor(t, a, s) {
-    this.element = t, this.type = 6, this._$AN = void 0, this._$AM = a, this.options = s;
-  }
-  get _$AU() {
-    return this._$AM._$AU;
-  }
-  _$AI(t) {
-    pt(this, t);
-  }
-}
-const Ge = re.litHtmlPolyfillSupport;
-Ge?.(xt, qt), (re.litHtmlVersions ??= []).push("3.3.2");
-const Ze = { CHILD: 2 }, Qe = (e) => (...t) => ({ _$litDirective$: e, values: t });
-class Je {
-  constructor(t) {
-  }
-  get _$AU() {
-    return this._$AM._$AU;
-  }
-  _$AT(t, a, s) {
-    this._$Ct = t, this._$AM = a, this._$Ci = s;
-  }
-  _$AS(t, a) {
-    return this.update(t, a);
-  }
-  update(t, a) {
-    return this.render(...a);
-  }
-}
-class Zt extends Je {
-  constructor(t) {
-    if (super(t), this.it = f, t.type !== Ze.CHILD) throw Error(this.constructor.directiveName + "() can only be used in child bindings");
-  }
-  render(t) {
-    if (t === f || t == null) return this._t = void 0, this.it = t;
-    if (t === ct) return t;
-    if (typeof t != "string") throw Error(this.constructor.directiveName + "() called with a non-string value");
-    if (t === this.it) return this._t;
-    this.it = t;
-    const a = [t];
-    return a.raw = a, this._t = { _$litType$: this.constructor.resultType, strings: a, values: [] };
-  }
-}
-Zt.directiveName = "unsafeHTML", Zt.resultType = 1;
-const tr = Qe(Zt);
-var er = Object.defineProperty, rr = Object.getOwnPropertyDescriptor, se = (e, t, a, s) => {
-  for (var r = s > 1 ? void 0 : s ? rr(t, a) : t, i = e.length - 1, o; i >= 0; i--)
-    (o = e[i]) && (r = (s ? o(t, a, r) : o(r)) || r);
-  return s && r && er(t, a, r), r;
+var ye = Object.defineProperty, xe = Object.getOwnPropertyDescriptor, Vt = (e, t, a, i) => {
+  for (var r = i > 1 ? void 0 : i ? xe(t, a) : t, s = e.length - 1, o; s >= 0; s--)
+    (o = e[s]) && (r = (i ? o(t, a, r) : o(r)) || r);
+  return i && r && ye(t, a, r), r;
 };
-const ar = {
+const we = {
   check: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" xmlns="http://www.w3.org/2000/svg"><path d="M20 6L9 17l-5-5"/></svg>',
   checkmark: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" xmlns="http://www.w3.org/2000/svg"><path d="M20 6L9 17l-5-5"/></svg>',
   close: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" xmlns="http://www.w3.org/2000/svg"><path d="M18 6L6 18M6 6l12 12"/></svg>',
@@ -593,16 +344,16 @@ const ar = {
   "volume-mute": '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" xmlns="http://www.w3.org/2000/svg"><polygon points="11 5 6 9 2 9 2 15 6 15 11 19 11 5"/><line x1="23" y1="9" x2="17" y2="15"/></svg>',
   music: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" xmlns="http://www.w3.org/2000/svg"><path d="M9 18V5l12-2v13"/><circle cx="6" cy="18" r="3"/><circle cx="18" cy="16" r="3"/></svg>'
 };
-let wt = class extends h {
+let dt = class extends p {
   constructor() {
     super(...arguments), this.name = "", this.size = "md";
   }
   render() {
-    const e = ar[this.name] || '<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><text x="0" y="14">?</text></svg>';
-    return l`<span class="icon" aria-hidden="true">${tr(e)}</span>`;
+    const e = we[this.name] || '<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><text x="0" y="14">?</text></svg>';
+    return l`<span class="icon" aria-hidden="true" .innerHTML=${e}></span>`;
   }
 };
-wt.styles = d`
+dt.styles = c`
     :host {
       display: inline-flex;
       align-items: center;
@@ -619,29 +370,29 @@ wt.styles = d`
       height: 100%;
     }
   `;
-se([
+Vt([
   n()
-], wt.prototype, "name", 2);
-se([
+], dt.prototype, "name", 2);
+Vt([
   n()
-], wt.prototype, "size", 2);
-wt = se([
-  u("crt-icon")
-], wt);
-var sr = Object.defineProperty, ir = Object.getOwnPropertyDescriptor, K = (e, t, a, s) => {
-  for (var r = s > 1 ? void 0 : s ? ir(t, a) : t, i = e.length - 1, o; i >= 0; i--)
-    (o = e[i]) && (r = (s ? o(t, a, r) : o(r)) || r);
-  return s && r && sr(t, a, r), r;
+], dt.prototype, "size", 2);
+dt = Vt([
+  d("crt-icon")
+], dt);
+var ke = Object.defineProperty, _e = Object.getOwnPropertyDescriptor, q = (e, t, a, i) => {
+  for (var r = i > 1 ? void 0 : i ? _e(t, a) : t, s = e.length - 1, o; s >= 0; s--)
+    (o = e[s]) && (r = (i ? o(t, a, r) : o(r)) || r);
+  return i && r && ke(t, a, r), r;
 };
-let C = class extends h {
+let $ = class extends p {
   constructor() {
-    super(), this.size = "medium", this.variant = "primary", this.disabled = !1, this.type = "button", this.iconOnly = !1, this.iconLeft = "", this.iconRight = "", console.log("Button constructor called");
+    super(), this.size = "medium", this.variant = "primary", this.disabled = !1, this.type = "button", this.iconOnly = !1, this.iconLeft = "", this.iconRight = "";
   }
   connectedCallback() {
-    super.connectedCallback(), console.log("Button connected to DOM", this);
+    super.connectedCallback();
   }
   render() {
-    if (console.log("Button render called"), this.iconOnly) {
+    if (this.iconOnly) {
       const e = this.iconLeft || this.iconRight;
       return l`
         <button type="${this.type}" ?disabled="${this.disabled}">
@@ -658,7 +409,7 @@ let C = class extends h {
     `;
   }
 };
-C.styles = d`
+$.styles = c`
     :host {
       display: inline-block;
     }
@@ -814,36 +565,36 @@ C.styles = d`
       flex-shrink: 0;
     }
   `;
-K([
+q([
   n({ reflect: !0 })
-], C.prototype, "size", 2);
-K([
+], $.prototype, "size", 2);
+q([
   n({ reflect: !0 })
-], C.prototype, "variant", 2);
-K([
+], $.prototype, "variant", 2);
+q([
   n({ type: Boolean })
-], C.prototype, "disabled", 2);
-K([
+], $.prototype, "disabled", 2);
+q([
   n()
-], C.prototype, "type", 2);
-K([
+], $.prototype, "type", 2);
+q([
   n({ attribute: "icon-only", type: Boolean })
-], C.prototype, "iconOnly", 2);
-K([
+], $.prototype, "iconOnly", 2);
+q([
   n({ attribute: "icon-left" })
-], C.prototype, "iconLeft", 2);
-K([
+], $.prototype, "iconLeft", 2);
+q([
   n({ attribute: "icon-right" })
-], C.prototype, "iconRight", 2);
-C = K([
-  u("crt-button")
-], C);
-var or = Object.defineProperty, nr = Object.getOwnPropertyDescriptor, Pe = (e, t, a, s) => {
-  for (var r = s > 1 ? void 0 : s ? nr(t, a) : t, i = e.length - 1, o; i >= 0; i--)
-    (o = e[i]) && (r = (s ? o(t, a, r) : o(r)) || r);
-  return s && r && or(t, a, r), r;
+], $.prototype, "iconRight", 2);
+$ = q([
+  d("crt-button")
+], $);
+var $e = Object.defineProperty, ze = Object.getOwnPropertyDescriptor, ee = (e, t, a, i) => {
+  for (var r = i > 1 ? void 0 : i ? ze(t, a) : t, s = e.length - 1, o; s >= 0; s--)
+    (o = e[s]) && (r = (i ? o(t, a, r) : o(r)) || r);
+  return i && r && $e(t, a, r), r;
 };
-let Bt = class extends h {
+let Pt = class extends p {
   constructor() {
     super(...arguments), this.variant = "primary";
   }
@@ -851,7 +602,7 @@ let Bt = class extends h {
     return l`<span class="badge"><slot></slot></span>`;
   }
 };
-Bt.styles = d`
+Pt.styles = c`
     :host {
       --badge-bg: transparent;
       --badge-color: var(--crt-primary);
@@ -892,18 +643,18 @@ Bt.styles = d`
       --badge-border: 1px solid var(--crt-info);
     }
   `;
-Pe([
+ee([
   n()
-], Bt.prototype, "variant", 2);
-Bt = Pe([
-  u("crt-badge")
-], Bt);
-var lr = Object.defineProperty, cr = Object.getOwnPropertyDescriptor, Xt = (e, t, a, s) => {
-  for (var r = s > 1 ? void 0 : s ? cr(t, a) : t, i = e.length - 1, o; i >= 0; i--)
-    (o = e[i]) && (r = (s ? o(t, a, r) : o(r)) || r);
-  return s && r && lr(t, a, r), r;
+], Pt.prototype, "variant", 2);
+Pt = ee([
+  d("crt-badge")
+], Pt);
+var Ce = Object.defineProperty, Pe = Object.getOwnPropertyDescriptor, Lt = (e, t, a, i) => {
+  for (var r = i > 1 ? void 0 : i ? Pe(t, a) : t, s = e.length - 1, o; s >= 0; s--)
+    (o = e[s]) && (r = (i ? o(t, a, r) : o(r)) || r);
+  return i && r && Ce(t, a, r), r;
 };
-let Nt = class extends h {
+let Ot = class extends p {
   constructor() {
     super(...arguments), this.level = 1;
   }
@@ -926,7 +677,7 @@ let Nt = class extends h {
     }
   }
 };
-Nt.styles = d`
+Ot.styles = c`
     h1, h2, h3, h4, h5, h6 {
       font-family: var(--crt-font-family);
       color: var(--crt-text-primary);
@@ -955,13 +706,13 @@ Nt.styles = d`
       font-size: var(--crt-font-size-base);
     }
   `;
-Xt([
+Lt([
   n({ type: Number })
-], Nt.prototype, "level", 2);
-Nt = Xt([
-  u("crt-heading")
-], Nt);
-let Ut = class extends h {
+], Ot.prototype, "level", 2);
+Ot = Lt([
+  d("crt-heading")
+], Ot);
+let St = class extends p {
   constructor() {
     super(...arguments), this.muted = !1;
   }
@@ -969,7 +720,7 @@ let Ut = class extends h {
     return l`<p><slot></slot></p>`;
   }
 };
-Ut.styles = d`
+St.styles = c`
     p {
       font-family: var(--crt-font-family);
       color: var(--crt-text-secondary);
@@ -981,18 +732,18 @@ Ut.styles = d`
       color: var(--crt-text-muted);
     }
   `;
-Xt([
+Lt([
   n()
-], Ut.prototype, "muted", 2);
-Ut = Xt([
-  u("crt-text")
-], Ut);
-var pr = Object.defineProperty, dr = Object.getOwnPropertyDescriptor, ie = (e, t, a, s) => {
-  for (var r = s > 1 ? void 0 : s ? dr(t, a) : t, i = e.length - 1, o; i >= 0; i--)
-    (o = e[i]) && (r = (s ? o(t, a, r) : o(r)) || r);
-  return s && r && pr(t, a, r), r;
+], St.prototype, "muted", 2);
+St = Lt([
+  d("crt-text")
+], St);
+var Oe = Object.defineProperty, Se = Object.getOwnPropertyDescriptor, Yt = (e, t, a, i) => {
+  for (var r = i > 1 ? void 0 : i ? Se(t, a) : t, s = e.length - 1, o; s >= 0; s--)
+    (o = e[s]) && (r = (i ? o(t, a, r) : o(r)) || r);
+  return i && r && Oe(t, a, r), r;
 };
-let kt = class extends h {
+let ht = class extends p {
   constructor() {
     super(...arguments), this.activeTab = 0, this.tabs = [];
   }
@@ -1017,7 +768,7 @@ let kt = class extends h {
         ${this.tabs.map(
       (e, t) => l`
             <div class="tab-pane ${t === this.activeTab ? "active" : ""}">
-              ${e.label.toLowerCase() === "code" ? l`<pre><code>${e.content}</code></pre>` : l`<div>${hr(e.content)}</div>`}
+              ${e.label.toLowerCase() === "code" ? l`<pre><code>${e.content}</code></pre>` : l`<div>${Ee(e.content)}</div>`}
             </div>
           `
     )}
@@ -1025,7 +776,7 @@ let kt = class extends h {
     `;
   }
 };
-kt.styles = d`
+ht.styles = c`
     :host {
       display: block;
     }
@@ -1092,25 +843,25 @@ kt.styles = d`
       font-family: var(--crt-font-family);
     }
   `;
-ie([
-  m()
-], kt.prototype, "activeTab", 2);
-ie([
+Yt([
+  v()
+], ht.prototype, "activeTab", 2);
+Yt([
   n({ type: Array })
-], kt.prototype, "tabs", 2);
-kt = ie([
-  u("crt-tabs")
-], kt);
-function hr(e) {
+], ht.prototype, "tabs", 2);
+ht = Yt([
+  d("crt-tabs")
+], ht);
+function Ee(e) {
   const t = document.createElement("div");
   return t.innerHTML = e, t;
 }
-var ur = Object.defineProperty, vr = Object.getOwnPropertyDescriptor, P = (e, t, a, s) => {
-  for (var r = s > 1 ? void 0 : s ? vr(t, a) : t, i = e.length - 1, o; i >= 0; i--)
-    (o = e[i]) && (r = (s ? o(t, a, r) : o(r)) || r);
-  return s && r && ur(t, a, r), r;
+var De = Object.defineProperty, Me = Object.getOwnPropertyDescriptor, z = (e, t, a, i) => {
+  for (var r = i > 1 ? void 0 : i ? Me(t, a) : t, s = e.length - 1, o; s >= 0; s--)
+    (o = e[s]) && (r = (i ? o(t, a, r) : o(r)) || r);
+  return i && r && De(t, a, r), r;
 };
-let J = class extends h {
+let H = class extends p {
   constructor() {
     super(...arguments), this.type = "text", this.placeholder = "", this.value = "", this.disabled = !1;
   }
@@ -1128,7 +879,7 @@ let J = class extends h {
     `;
   }
 };
-J.styles = d`
+H.styles = c`
     :host {
       display: block;
     }
@@ -1174,22 +925,22 @@ J.styles = d`
       padding-right: var(--crt-spacing-lg);
     }
   `;
-P([
+z([
   n()
-], J.prototype, "type", 2);
-P([
+], H.prototype, "type", 2);
+z([
   n()
-], J.prototype, "placeholder", 2);
-P([
+], H.prototype, "placeholder", 2);
+z([
   n()
-], J.prototype, "value", 2);
-P([
+], H.prototype, "value", 2);
+z([
   n()
-], J.prototype, "disabled", 2);
-J = P([
-  u("crt-input")
-], J);
-let tt = class extends h {
+], H.prototype, "disabled", 2);
+H = z([
+  d("crt-input")
+], H);
+let K = class extends p {
   constructor() {
     super(...arguments), this.placeholder = "", this.value = "", this.disabled = !1, this.rows = 4;
   }
@@ -1207,7 +958,7 @@ let tt = class extends h {
     `;
   }
 };
-tt.styles = d`
+K.styles = c`
     :host {
       display: block;
     }
@@ -1249,33 +1000,40 @@ tt.styles = d`
       border-style: dashed;
     }
   `;
-P([
+z([
   n()
-], tt.prototype, "placeholder", 2);
-P([
+], K.prototype, "placeholder", 2);
+z([
   n()
-], tt.prototype, "value", 2);
-P([
+], K.prototype, "value", 2);
+z([
   n()
-], tt.prototype, "disabled", 2);
-P([
+], K.prototype, "disabled", 2);
+z([
   n()
-], tt.prototype, "rows", 2);
-tt = P([
-  u("crt-textarea")
-], tt);
-var gr = Object.defineProperty, mr = Object.getOwnPropertyDescriptor, ut = (e, t, a, s) => {
-  for (var r = s > 1 ? void 0 : s ? mr(t, a) : t, i = e.length - 1, o; i >= 0; i--)
-    (o = e[i]) && (r = (s ? o(t, a, r) : o(r)) || r);
-  return s && r && gr(t, a, r), r;
+], K.prototype, "rows", 2);
+K = z([
+  d("crt-textarea")
+], K);
+var je = Object.defineProperty, Te = Object.getOwnPropertyDescriptor, ot = (e, t, a, i) => {
+  for (var r = i > 1 ? void 0 : i ? Te(t, a) : t, s = e.length - 1, o; s >= 0; s--)
+    (o = e[s]) && (r = (i ? o(t, a, r) : o(r)) || r);
+  return i && r && je(t, a, r), r;
 };
-let H = class extends h {
+let U = class extends p {
   constructor() {
     super(...arguments), this.href = "#", this.target = "", this.iconLeft = !1, this.iconRight = !1, this.icon = "";
   }
+  _onClick(e) {
+    this.href && this.href.startsWith("#") && (e.preventDefault(), this.dispatchEvent(new CustomEvent("navigate", {
+      detail: { href: this.href },
+      bubbles: !0,
+      composed: !0
+    })));
+  }
   render() {
     return l`
-      <a href="${this.href}" ${this.target ? `target="${this.target}"` : ""}>
+      <a href="${this.href}" ${this.target ? `target="${this.target}"` : ""} @click="${(e) => this._onClick(e)}">
         ${this.iconLeft ? l`<crt-icon name="${this.icon}"></crt-icon>` : ""}
         <slot></slot>
         ${this.iconRight ? l`<crt-icon name="${this.icon}"></crt-icon>` : ""}
@@ -1283,7 +1041,7 @@ let H = class extends h {
     `;
   }
 };
-H.styles = d`
+U.styles = c`
     :host {
       --crt-link-color: var(--crt-primary);
     }
@@ -1309,30 +1067,30 @@ H.styles = d`
       color: var(--crt-primary-dark);
     }
   `;
-ut([
+ot([
   n({ type: String })
-], H.prototype, "href", 2);
-ut([
+], U.prototype, "href", 2);
+ot([
   n({ type: String })
-], H.prototype, "target", 2);
-ut([
+], U.prototype, "target", 2);
+ot([
   n({ type: Boolean })
-], H.prototype, "iconLeft", 2);
-ut([
+], U.prototype, "iconLeft", 2);
+ot([
   n({ type: Boolean })
-], H.prototype, "iconRight", 2);
-ut([
+], U.prototype, "iconRight", 2);
+ot([
   n({ type: String })
-], H.prototype, "icon", 2);
-H = ut([
-  u("crt-link")
-], H);
-var fr = Object.defineProperty, br = Object.getOwnPropertyDescriptor, st = (e, t, a, s) => {
-  for (var r = s > 1 ? void 0 : s ? br(t, a) : t, i = e.length - 1, o; i >= 0; i--)
-    (o = e[i]) && (r = (s ? o(t, a, r) : o(r)) || r);
-  return s && r && fr(t, a, r), r;
+], U.prototype, "icon", 2);
+U = ot([
+  d("crt-link")
+], U);
+var Ae = Object.defineProperty, Ie = Object.getOwnPropertyDescriptor, Z = (e, t, a, i) => {
+  for (var r = i > 1 ? void 0 : i ? Ie(t, a) : t, s = e.length - 1, o; s >= 0; s--)
+    (o = e[s]) && (r = (i ? o(t, a, r) : o(r)) || r);
+  return i && r && Ae(t, a, r), r;
 };
-let M = class extends h {
+let E = class extends p {
   constructor() {
     super(...arguments), this.accept = "", this.multiple = !0, this.name = "", this.maxSize = 10485760, this.maxFiles = 10, this.files = [], this._handleFileSelect = (e) => {
       const t = e.target;
@@ -1359,12 +1117,12 @@ let M = class extends h {
     return Math.random().toString(36).substring(2, 9);
   }
   _addFiles(e) {
-    const s = e.filter((r) => {
+    const i = e.filter((r) => {
       if (r.size > this.maxSize)
         return console.warn(`File ${r.name} exceeds max size`), !1;
       if (this.accept) {
-        const i = this.accept.split(",").map((v) => v.trim()), o = r.type, c = "." + r.name.split(".").pop()?.toLowerCase();
-        if (!i.some((v) => v.startsWith(".") ? c === v.toLowerCase() : v.endsWith("/*") ? o.startsWith(v.replace("/*", "/")) : o === v))
+        const s = this.accept.split(",").map((S) => S.trim()), o = r.type, h = "." + r.name.split(".").pop()?.toLowerCase();
+        if (!s.some((S) => S.startsWith(".") ? h === S.toLowerCase() : S.endsWith("/*") ? o.startsWith(S.replace("/*", "/")) : o === S))
           return console.warn(`File ${r.name} type not accepted`), !1;
       }
       return !0;
@@ -1374,7 +1132,7 @@ let M = class extends h {
       progress: 100,
       status: "complete"
     }));
-    this.files = [...this.files, ...s], this.dispatchEvent(new CustomEvent("files-changed", {
+    this.files = [...this.files, ...i], this.dispatchEvent(new CustomEvent("files-changed", {
       detail: { files: this.files.map((r) => r.file) }
     }));
   }
@@ -1384,8 +1142,8 @@ let M = class extends h {
   }
   _formatFileSize(e) {
     if (e === 0) return "0 B";
-    const t = 1024, a = ["B", "KB", "MB", "GB"], s = Math.floor(Math.log(e) / Math.log(t));
-    return parseFloat((e / Math.pow(t, s)).toFixed(1)) + " " + a[s];
+    const t = 1024, a = ["B", "KB", "MB", "GB"], i = Math.floor(Math.log(e) / Math.log(t));
+    return parseFloat((e / Math.pow(t, i)).toFixed(1)) + " " + a[i];
   }
   _getFileIcon(e) {
     const t = e.name.split(".").pop()?.toLowerCase() || "", a = e.type;
@@ -1473,7 +1231,7 @@ let M = class extends h {
     `;
   }
 };
-M.styles = d`
+E.styles = c`
     :host {
       display: block;
       font-family: var(--crt-font-family);
@@ -1768,33 +1526,33 @@ M.styles = d`
       transition: width 0.3s ease;
     }
   `;
-st([
+Z([
   n({ type: String })
-], M.prototype, "accept", 2);
-st([
+], E.prototype, "accept", 2);
+Z([
   n({ type: Boolean })
-], M.prototype, "multiple", 2);
-st([
+], E.prototype, "multiple", 2);
+Z([
   n({ type: String })
-], M.prototype, "name", 2);
-st([
+], E.prototype, "name", 2);
+Z([
   n({ type: Number })
-], M.prototype, "maxSize", 2);
-st([
+], E.prototype, "maxSize", 2);
+Z([
   n({ type: Number })
-], M.prototype, "maxFiles", 2);
-st([
-  m()
-], M.prototype, "files", 2);
-M = st([
-  u("crt-file-upload")
-], M);
-var yr = Object.defineProperty, xr = Object.getOwnPropertyDescriptor, O = (e, t, a, s) => {
-  for (var r = s > 1 ? void 0 : s ? xr(t, a) : t, i = e.length - 1, o; i >= 0; i--)
-    (o = e[i]) && (r = (s ? o(t, a, r) : o(r)) || r);
-  return s && r && yr(t, a, r), r;
+], E.prototype, "maxFiles", 2);
+Z([
+  v()
+], E.prototype, "files", 2);
+E = Z([
+  d("crt-file-upload")
+], E);
+var Le = Object.defineProperty, Be = Object.getOwnPropertyDescriptor, C = (e, t, a, i) => {
+  for (var r = i > 1 ? void 0 : i ? Be(t, a) : t, s = e.length - 1, o; s >= 0; s--)
+    (o = e[s]) && (r = (i ? o(t, a, r) : o(r)) || r);
+  return i && r && Le(t, a, r), r;
 };
-let w = class extends h {
+let b = class extends p {
   constructor() {
     super(...arguments), this.value = "", this.placeholder = "Select date...", this.format = "DD.MM.YYYY", this.min = "", this.max = "", this.disabled = !1, this._isOpen = !1, this._viewDate = /* @__PURE__ */ new Date(), this._selectedDate = null, this._weekdays = ["Mo", "Di", "Mi", "Do", "Fr", "Sa", "So"], this._months = [
       "Januar",
@@ -1822,13 +1580,13 @@ let w = class extends h {
   _parseValue() {
     const e = this.value.split(".");
     if (e.length === 3) {
-      const [t, a, s] = e.map(Number);
-      this._selectedDate = new Date(s, a - 1, t), this._viewDate = new Date(this._selectedDate);
+      const [t, a, i] = e.map(Number);
+      this._selectedDate = new Date(i, a - 1, t), this._viewDate = new Date(this._selectedDate);
     }
   }
   _formatDate(e) {
-    const t = String(e.getDate()).padStart(2, "0"), a = String(e.getMonth() + 1).padStart(2, "0"), s = e.getFullYear();
-    return `${t}.${a}.${s}`;
+    const t = String(e.getDate()).padStart(2, "0"), a = String(e.getMonth() + 1).padStart(2, "0"), i = e.getFullYear();
+    return `${t}.${a}.${i}`;
   }
   _toggleCalendar() {
     this.disabled || (this._isOpen = !this._isOpen);
@@ -1875,36 +1633,36 @@ let w = class extends h {
     return this._selectedDate ? e.getDate() === this._selectedDate.getDate() && e.getMonth() === this._selectedDate.getMonth() && e.getFullYear() === this._selectedDate.getFullYear() : !1;
   }
   _renderDays() {
-    const e = this._viewDate.getFullYear(), t = this._viewDate.getMonth(), a = this._getDaysInMonth(e, t), s = this._getFirstDayOfMonth(e, t), r = this._getDaysInMonth(e, t - 1), i = [];
-    for (let c = s - 1; c >= 0; c--) {
-      const p = new Date(e, t - 1, r - c);
-      i.push(l`
-        <div class="day other-month" @click="${() => this._selectDate(p)}">
-          ${r - c}
+    const e = this._viewDate.getFullYear(), t = this._viewDate.getMonth(), a = this._getDaysInMonth(e, t), i = this._getFirstDayOfMonth(e, t), r = this._getDaysInMonth(e, t - 1), s = [];
+    for (let h = i - 1; h >= 0; h--) {
+      const f = new Date(e, t - 1, r - h);
+      s.push(l`
+        <div class="day other-month" @click="${() => this._selectDate(f)}">
+          ${r - h}
         </div>
       `);
     }
-    for (let c = 1; c <= a; c++) {
-      const p = new Date(e, t, c), v = this._isToday(p), b = this._isSelected(p);
-      i.push(l`
+    for (let h = 1; h <= a; h++) {
+      const f = new Date(e, t, h), S = this._isToday(f), ie = this._isSelected(f);
+      s.push(l`
         <div 
-          class="day ${v ? "today" : ""} ${b ? "selected" : ""}"
-          @click="${() => this._selectDate(p)}"
+          class="day ${S ? "today" : ""} ${ie ? "selected" : ""}"
+          @click="${() => this._selectDate(f)}"
         >
-          ${c}
+          ${h}
         </div>
       `);
     }
-    const o = 42 - i.length;
-    for (let c = 1; c <= o; c++) {
-      const p = new Date(e, t + 1, c);
-      i.push(l`
-        <div class="day other-month" @click="${() => this._selectDate(p)}">
-          ${c}
+    const o = 42 - s.length;
+    for (let h = 1; h <= o; h++) {
+      const f = new Date(e, t + 1, h);
+      s.push(l`
+        <div class="day other-month" @click="${() => this._selectDate(f)}">
+          ${h}
         </div>
       `);
     }
-    return i;
+    return s;
   }
   render() {
     const e = `${this._months[this._viewDate.getMonth()]} ${this._viewDate.getFullYear()}`;
@@ -1953,7 +1711,7 @@ let w = class extends h {
     `;
   }
 };
-w.styles = d`
+b.styles = c`
     :host {
       display: inline-block;
       font-family: var(--crt-font-family);
@@ -2158,42 +1916,42 @@ w.styles = d`
       color: var(--crt-bg-dark);
     }
   `;
-O([
+C([
   n({ type: String })
-], w.prototype, "value", 2);
-O([
+], b.prototype, "value", 2);
+C([
   n({ type: String })
-], w.prototype, "placeholder", 2);
-O([
+], b.prototype, "placeholder", 2);
+C([
   n({ type: String })
-], w.prototype, "format", 2);
-O([
+], b.prototype, "format", 2);
+C([
   n({ type: String })
-], w.prototype, "min", 2);
-O([
+], b.prototype, "min", 2);
+C([
   n({ type: String })
-], w.prototype, "max", 2);
-O([
+], b.prototype, "max", 2);
+C([
   n({ type: Boolean })
-], w.prototype, "disabled", 2);
-O([
-  m()
-], w.prototype, "_isOpen", 2);
-O([
-  m()
-], w.prototype, "_viewDate", 2);
-O([
-  m()
-], w.prototype, "_selectedDate", 2);
-w = O([
-  u("crt-calendar")
-], w);
-var wr = Object.defineProperty, kr = Object.getOwnPropertyDescriptor, it = (e, t, a, s) => {
-  for (var r = s > 1 ? void 0 : s ? kr(t, a) : t, i = e.length - 1, o; i >= 0; i--)
-    (o = e[i]) && (r = (s ? o(t, a, r) : o(r)) || r);
-  return s && r && wr(t, a, r), r;
+], b.prototype, "disabled", 2);
+C([
+  v()
+], b.prototype, "_isOpen", 2);
+C([
+  v()
+], b.prototype, "_viewDate", 2);
+C([
+  v()
+], b.prototype, "_selectedDate", 2);
+b = C([
+  d("crt-calendar")
+], b);
+var Ue = Object.defineProperty, Ne = Object.getOwnPropertyDescriptor, tt = (e, t, a, i) => {
+  for (var r = i > 1 ? void 0 : i ? Ne(t, a) : t, s = e.length - 1, o; s >= 0; s--)
+    (o = e[s]) && (r = (i ? o(t, a, r) : o(r)) || r);
+  return i && r && Ue(t, a, r), r;
 };
-let D = class extends h {
+let D = class extends p {
   constructor() {
     super(...arguments), this.value = "", this.placeholder = "Select...", this.label = "", this.disabled = !1, this.options = [], this._isOpen = !1, this._handleOutsideClick = (e) => {
       this.contains(e.target) || (this._isOpen = !1);
@@ -2231,15 +1989,15 @@ let D = class extends h {
     e.forEach((r) => {
       r.group ? (t.has(r.group) || t.set(r.group, []), t.get(r.group).push(r)) : a.push(r);
     });
-    const s = [];
+    const i = [];
     for (const r of a)
-      s.push(this._renderOption(r));
-    for (const [r, i] of t) {
-      s.push(l`<div class="select-group-label">${r}</div>`);
-      for (const o of i)
-        s.push(this._renderOption(o));
+      i.push(this._renderOption(r));
+    for (const [r, s] of t) {
+      i.push(l`<div class="select-group-label">${r}</div>`);
+      for (const o of s)
+        i.push(this._renderOption(o));
     }
-    return s;
+    return i;
   }
   _renderOption(e) {
     const t = e.value === this.value;
@@ -2274,7 +2032,7 @@ let D = class extends h {
     `;
   }
 };
-D.styles = d`
+D.styles = c`
     :host {
       display: inline-block;
       font-family: var(--crt-font-family);
@@ -2431,33 +2189,256 @@ D.styles = d`
       box-shadow: var(--crt-glow-sm);
     }
   `;
-it([
+tt([
   n({ type: String })
 ], D.prototype, "value", 2);
-it([
+tt([
   n({ type: String })
 ], D.prototype, "placeholder", 2);
-it([
+tt([
   n({ type: String })
 ], D.prototype, "label", 2);
-it([
+tt([
   n({ type: Boolean })
 ], D.prototype, "disabled", 2);
-it([
+tt([
   n({ type: Array })
 ], D.prototype, "options", 2);
-it([
-  m()
+tt([
+  v()
 ], D.prototype, "_isOpen", 2);
-D = it([
-  u("crt-select")
+D = tt([
+  d("crt-select")
 ], D);
-var $r = Object.defineProperty, _r = Object.getOwnPropertyDescriptor, y = (e, t, a, s) => {
-  for (var r = s > 1 ? void 0 : s ? _r(t, a) : t, i = e.length - 1, o; i >= 0; i--)
-    (o = e[i]) && (r = (s ? o(t, a, r) : o(r)) || r);
-  return s && r && $r(t, a, r), r;
+var Re = Object.defineProperty, Fe = Object.getOwnPropertyDescriptor, _ = (e, t, a, i) => {
+  for (var r = i > 1 ? void 0 : i ? Fe(t, a) : t, s = e.length - 1, o; s >= 0; s--)
+    (o = e[s]) && (r = (i ? o(t, a, r) : o(r)) || r);
+  return i && r && Re(t, a, r), r;
 };
-let Y = class extends h {
+let m = class extends p {
+  constructor() {
+    super(...arguments), this.value = "", this.placeholder = "Search...", this.debounceMs = 300, this.minLength = 1, this.suggestions = [], this._open = !1, this._activeIndex = -1, this._filtered = [], this._loading = !1, this._id = `crt-search-${Math.random().toString(36).slice(2, 9)}`;
+  }
+  connectedCallback() {
+    super.connectedCallback(), this._filtered = [...this.suggestions];
+  }
+  updated(e) {
+    e.has("suggestions") && (this._filtered = [...this.suggestions]);
+  }
+  _onInput(e) {
+    const t = e.target.value;
+    if (this.value = t, this.dispatchEvent(new CustomEvent("input-change", { detail: { value: this.value } })), this._debounceTimer && window.clearTimeout(this._debounceTimer), this.value.length < this.minLength) {
+      this._open = !1, this._filtered = [];
+      return;
+    }
+    this._debounceTimer = window.setTimeout(async () => {
+      if (this._loading = !0, this.fetcher)
+        try {
+          const a = await this.fetcher(this.value);
+          this._filtered = (a || []).slice(0, 50);
+        } catch (a) {
+          console.warn("crt-search: fetcher error", a), this._filtered = [];
+        }
+      else {
+        const a = this.value.toLowerCase();
+        this._filtered = this.suggestions.filter((i) => (i.label || i.value).toLowerCase().includes(a)).slice(0, 50);
+      }
+      this._activeIndex = this._filtered.length > 0 ? 0 : -1, this._open = this._filtered.length > 0, this._loading = !1;
+    }, this.debounceMs);
+  }
+  _onKeyDown(e) {
+    if (!this._open && (e.key === "ArrowDown" || e.key === "ArrowUp") && this._filtered.length > 0 && (this._open = !0), !this._open) {
+      e.key === "Enter" && this.dispatchEvent(new CustomEvent("search", { detail: { value: this.value } }));
+      return;
+    }
+    switch (e.key) {
+      case "ArrowDown":
+        e.preventDefault(), this._activeIndex = (this._activeIndex + 1) % this._filtered.length, this._scrollIntoView();
+        break;
+      case "ArrowUp":
+        e.preventDefault(), this._activeIndex = (this._activeIndex - 1 + this._filtered.length) % this._filtered.length, this._scrollIntoView();
+        break;
+      case "Home":
+        e.preventDefault(), this._activeIndex = 0, this._scrollIntoView();
+        break;
+      case "End":
+        e.preventDefault(), this._activeIndex = this._filtered.length - 1, this._scrollIntoView();
+        break;
+      case "Enter":
+        e.preventDefault(), this._activeIndex >= 0 && this._filtered[this._activeIndex] ? this._select(this._activeIndex) : this.dispatchEvent(new CustomEvent("search", { detail: { value: this.value } }));
+        break;
+      case "Escape":
+        e.preventDefault(), this._open = !1;
+        break;
+    }
+  }
+  _scrollIntoView() {
+    const e = this.shadowRoot?.querySelector(".list"), t = e?.querySelectorAll(".item")[this._activeIndex];
+    if (t && e) {
+      const a = t.getBoundingClientRect(), i = e.getBoundingClientRect();
+      a.top < i.top && t.scrollIntoView({ block: "nearest" }), a.bottom > i.bottom && t.scrollIntoView({ block: "nearest" });
+    }
+  }
+  _select(e) {
+    const t = this._filtered[e];
+    t && (this.value = t.value, this._open = !1, this._activeIndex = -1, this.dispatchEvent(new CustomEvent("select", { detail: { item: t, value: t.value, label: t.label, index: e } })));
+  }
+  _onBlur() {
+    setTimeout(() => {
+      const e = this.shadowRoot?.activeElement;
+      (!e || !e.classList?.contains("item")) && (this._open = !1, this._activeIndex = -1);
+    }, 150);
+  }
+  render() {
+    const e = `${this._id}-list`;
+    return l`
+      <div class="search">
+        <input
+          class="input"
+          role="combobox"
+          aria-autocomplete="list"
+          aria-expanded="${this._open ? "true" : "false"}"
+          aria-controls="${e}"
+          aria-activedescendant="${this._activeIndex >= 0 ? `${this._id}-option-${this._activeIndex}` : ""}"
+          .value=${this.value}
+          placeholder=${this.placeholder}
+          @input=${this._onInput}
+          @keydown=${this._onKeyDown}
+          @blur=${this._onBlur}
+        />
+
+        ${this._open ? l`
+          <ul class="list" id="${e}" role="listbox">
+            ${this._loading ? l`<li class="loading">Loading...</li>` : ""}
+            ${this._filtered.length === 0 && !this._loading ? l`<li class="empty">No results</li>` : ""}
+            ${this._filtered.map((t, a) => l`
+              <li
+                id="${this._id}-option-${a}"
+                class="item"
+                role="option"
+                aria-selected="${this._activeIndex === a ? "true" : "false"}"
+                @click="${() => this._select(a)}"
+              >
+                ${t.label ?? t.value}
+              </li>
+            `)}
+          </ul>
+        ` : ""}
+      </div>
+    `;
+  }
+};
+m.styles = c`
+    :host { display: block; font-family: var(--crt-font-family); }
+
+    .search {
+      position: relative;
+      width: 100%;
+      min-width: 0;
+    }
+
+    .input {
+      width: 100%;
+      padding: var(--crt-spacing-md);
+      font-family: var(--crt-font-family);
+      background: var(--crt-bg-dark);
+      color: var(--crt-text-primary);
+      border: 2px solid var(--crt-primary);
+      box-shadow: var(--crt-glow-inset);
+      box-sizing: border-box;
+      transition: var(--crt-transition);
+      cursor: var(--crt-cursor-text);
+    }
+
+    .input:focus {
+      outline: none;
+      box-shadow: inset 0 0 10px rgba(51,255,51,0.2), var(--crt-glow);
+    }
+
+    .list {
+      position: absolute;
+      top: calc(100% + var(--crt-spacing-xs));
+      left: 0;
+      right: 0;
+      background: var(--crt-bg-dark);
+      border: 2px solid var(--crt-primary);
+      box-shadow: 0 10px 20px color-mix(in srgb, var(--crt-primary) 20%, transparent), var(--crt-glow-inset);
+      max-height: 240px;
+      overflow-y: auto;
+      z-index: 1000;
+      padding: 0;
+      margin: 0;
+    }
+
+    .item {
+      list-style: none;
+      padding: var(--crt-spacing-md);
+      cursor: var(--crt-cursor-pointer);
+      color: var(--crt-text-primary);
+      transition: var(--crt-transition);
+      display: flex;
+      align-items: center;
+      gap: var(--crt-spacing-sm);
+    }
+
+    .item:hover,
+    .item[aria-selected="true"] {
+      background: color-mix(in srgb, var(--crt-primary) 10%, transparent);
+      box-shadow: var(--crt-glow-sm);
+      color: var(--crt-primary);
+    }
+
+    .empty {
+      padding: var(--crt-spacing-md);
+      color: var(--crt-text-muted);
+      text-align: center;
+    }
+
+    .loading {
+      padding: var(--crt-spacing-md);
+      color: var(--crt-text-muted);
+      text-align: center;
+    }
+  `;
+_([
+  n({ type: String })
+], m.prototype, "value", 2);
+_([
+  n({ type: String })
+], m.prototype, "placeholder", 2);
+_([
+  n({ type: Number })
+], m.prototype, "debounceMs", 2);
+_([
+  n({ type: Number })
+], m.prototype, "minLength", 2);
+_([
+  n({ type: Array })
+], m.prototype, "suggestions", 2);
+_([
+  n()
+], m.prototype, "fetcher", 2);
+_([
+  v()
+], m.prototype, "_open", 2);
+_([
+  v()
+], m.prototype, "_activeIndex", 2);
+_([
+  v()
+], m.prototype, "_filtered", 2);
+_([
+  v()
+], m.prototype, "_loading", 2);
+m = _([
+  d("crt-search")
+], m);
+var Ve = Object.defineProperty, Ye = Object.getOwnPropertyDescriptor, u = (e, t, a, i) => {
+  for (var r = i > 1 ? void 0 : i ? Ye(t, a) : t, s = e.length - 1, o; s >= 0; s--)
+    (o = e[s]) && (r = (i ? o(t, a, r) : o(r)) || r);
+  return i && r && Ve(t, a, r), r;
+};
+let N = class extends p {
   constructor() {
     super(...arguments), this.checked = !1, this.disabled = !1, this.indeterminate = !1, this.label = "", this.value = "";
   }
@@ -2485,7 +2466,7 @@ let Y = class extends h {
     `;
   }
 };
-Y.styles = d`
+N.styles = c`
     :host {
       display: inline-flex;
       align-items: center;
@@ -2567,25 +2548,25 @@ Y.styles = d`
       transform: scale(1);
     }
   `;
-y([
+u([
   n({ type: Boolean, reflect: !0 })
-], Y.prototype, "checked", 2);
-y([
+], N.prototype, "checked", 2);
+u([
   n({ type: Boolean, reflect: !0 })
-], Y.prototype, "disabled", 2);
-y([
+], N.prototype, "disabled", 2);
+u([
   n({ type: Boolean })
-], Y.prototype, "indeterminate", 2);
-y([
+], N.prototype, "indeterminate", 2);
+u([
   n({ type: String })
-], Y.prototype, "label", 2);
-y([
+], N.prototype, "label", 2);
+u([
   n({ type: String })
-], Y.prototype, "value", 2);
-Y = y([
-  u("crt-checkbox")
-], Y);
-let V = class extends h {
+], N.prototype, "value", 2);
+N = u([
+  d("crt-checkbox")
+], N);
+let R = class extends p {
   constructor() {
     super(...arguments), this.checked = !1, this.disabled = !1, this.label = "", this.value = "", this.name = "";
   }
@@ -2614,7 +2595,7 @@ let V = class extends h {
     `;
   }
 };
-V.styles = d`
+R.styles = c`
     :host {
       display: inline-flex;
       align-items: center;
@@ -2688,25 +2669,25 @@ V.styles = d`
       user-select: none;
     }
   `;
-y([
+u([
   n({ type: Boolean, reflect: !0 })
-], V.prototype, "checked", 2);
-y([
+], R.prototype, "checked", 2);
+u([
   n({ type: Boolean, reflect: !0 })
-], V.prototype, "disabled", 2);
-y([
+], R.prototype, "disabled", 2);
+u([
   n({ type: String })
-], V.prototype, "label", 2);
-y([
+], R.prototype, "label", 2);
+u([
   n({ type: String })
-], V.prototype, "value", 2);
-y([
+], R.prototype, "value", 2);
+u([
   n({ type: String })
-], V.prototype, "name", 2);
-V = y([
-  u("crt-radio")
-], V);
-let dt = class extends h {
+], R.prototype, "name", 2);
+R = u([
+  d("crt-radio")
+], R);
+let it = class extends p {
   constructor() {
     super(...arguments), this.name = "", this.value = "", this.horizontal = !1, this._handleChange = (e) => {
       const t = e.target;
@@ -2727,7 +2708,7 @@ let dt = class extends h {
     return l`<slot></slot>`;
   }
 };
-dt.styles = d`
+it.styles = c`
     :host {
       display: flex;
       flex-direction: column;
@@ -2740,24 +2721,24 @@ dt.styles = d`
       gap: var(--crt-spacing-lg);
     }
   `;
-y([
+u([
   n({ type: String })
-], dt.prototype, "name", 2);
-y([
+], it.prototype, "name", 2);
+u([
   n({ type: String })
-], dt.prototype, "value", 2);
-y([
+], it.prototype, "value", 2);
+u([
   n({ type: Boolean, reflect: !0 })
-], dt.prototype, "horizontal", 2);
-dt = y([
-  u("crt-radio-group")
-], dt);
-var zr = Object.defineProperty, Cr = Object.getOwnPropertyDescriptor, A = (e, t, a, s) => {
-  for (var r = s > 1 ? void 0 : s ? Cr(t, a) : t, i = e.length - 1, o; i >= 0; i--)
-    (o = e[i]) && (r = (s ? o(t, a, r) : o(r)) || r);
-  return s && r && zr(t, a, r), r;
+], it.prototype, "horizontal", 2);
+it = u([
+  d("crt-radio-group")
+], it);
+var qe = Object.defineProperty, He = Object.getOwnPropertyDescriptor, P = (e, t, a, i) => {
+  for (var r = i > 1 ? void 0 : i ? He(t, a) : t, s = e.length - 1, o; s >= 0; s--)
+    (o = e[s]) && (r = (i ? o(t, a, r) : o(r)) || r);
+  return i && r && qe(t, a, r), r;
 };
-let k = class extends h {
+let y = class extends p {
   constructor() {
     super(...arguments), this.value = 0, this.max = 100, this.label = "", this.animated = !1, this.indeterminate = !1, this.segmented = !1, this.size = "medium", this.variant = "default", this.showValue = !0;
   }
@@ -2783,7 +2764,7 @@ let k = class extends h {
     `;
   }
 };
-k.styles = d`
+y.styles = c`
     :host {
       display: block;
       font-family: var(--crt-font-family);
@@ -2907,42 +2888,42 @@ k.styles = d`
       );
     }
   `;
-A([
+P([
   n({ type: Number })
-], k.prototype, "value", 2);
-A([
+], y.prototype, "value", 2);
+P([
   n({ type: Number })
-], k.prototype, "max", 2);
-A([
+], y.prototype, "max", 2);
+P([
   n({ type: String })
-], k.prototype, "label", 2);
-A([
+], y.prototype, "label", 2);
+P([
   n({ type: Boolean, reflect: !0 })
-], k.prototype, "animated", 2);
-A([
+], y.prototype, "animated", 2);
+P([
   n({ type: Boolean, reflect: !0 })
-], k.prototype, "indeterminate", 2);
-A([
+], y.prototype, "indeterminate", 2);
+P([
   n({ type: Boolean, reflect: !0 })
-], k.prototype, "segmented", 2);
-A([
+], y.prototype, "segmented", 2);
+P([
   n({ type: String, reflect: !0 })
-], k.prototype, "size", 2);
-A([
+], y.prototype, "size", 2);
+P([
   n({ type: String, reflect: !0 })
-], k.prototype, "variant", 2);
-A([
+], y.prototype, "variant", 2);
+P([
   n({ type: Boolean })
-], k.prototype, "showValue", 2);
-k = A([
-  u("crt-progress")
-], k);
-var Pr = Object.defineProperty, Or = Object.getOwnPropertyDescriptor, At = (e, t, a, s) => {
-  for (var r = s > 1 ? void 0 : s ? Or(t, a) : t, i = e.length - 1, o; i >= 0; i--)
-    (o = e[i]) && (r = (s ? o(t, a, r) : o(r)) || r);
-  return s && r && Pr(t, a, r), r;
+], y.prototype, "showValue", 2);
+y = P([
+  d("crt-progress")
+], y);
+var Ke = Object.defineProperty, Xe = Object.getOwnPropertyDescriptor, yt = (e, t, a, i) => {
+  for (var r = i > 1 ? void 0 : i ? Xe(t, a) : t, s = e.length - 1, o; s >= 0; s--)
+    (o = e[s]) && (r = (i ? o(t, a, r) : o(r)) || r);
+  return i && r && Ke(t, a, r), r;
 };
-let et = class extends h {
+let X = class extends p {
   constructor() {
     super(...arguments), this.text = "", this.position = "top", this.delay = 200, this._visible = !1;
   }
@@ -2971,7 +2952,7 @@ let et = class extends h {
     `;
   }
 };
-et.styles = d`
+X.styles = c`
     :host {
       display: inline-block;
       position: relative;
@@ -3078,27 +3059,27 @@ et.styles = d`
       border-right-color: var(--crt-primary);
     }
   `;
-At([
+yt([
   n({ type: String })
-], et.prototype, "text", 2);
-At([
+], X.prototype, "text", 2);
+yt([
   n({ type: String, reflect: !0 })
-], et.prototype, "position", 2);
-At([
+], X.prototype, "position", 2);
+yt([
   n({ type: Number })
-], et.prototype, "delay", 2);
-At([
-  m()
-], et.prototype, "_visible", 2);
-et = At([
-  u("crt-tooltip")
-], et);
-var Ar = Object.defineProperty, Sr = Object.getOwnPropertyDescriptor, oe = (e, t, a, s) => {
-  for (var r = s > 1 ? void 0 : s ? Sr(t, a) : t, i = e.length - 1, o; i >= 0; i--)
-    (o = e[i]) && (r = (s ? o(t, a, r) : o(r)) || r);
-  return s && r && Ar(t, a, r), r;
+], X.prototype, "delay", 2);
+yt([
+  v()
+], X.prototype, "_visible", 2);
+X = yt([
+  d("crt-tooltip")
+], X);
+var We = Object.defineProperty, Ge = Object.getOwnPropertyDescriptor, qt = (e, t, a, i) => {
+  for (var r = i > 1 ? void 0 : i ? Ge(t, a) : t, s = e.length - 1, o; s >= 0; s--)
+    (o = e[s]) && (r = (i ? o(t, a, r) : o(r)) || r);
+  return i && r && We(t, a, r), r;
 };
-let $t = class extends h {
+let vt = class extends p {
   constructor() {
     super(...arguments), this.items = [], this.separator = ">";
   }
@@ -3116,7 +3097,7 @@ let $t = class extends h {
     `;
   }
 };
-$t.styles = d`
+vt.styles = c`
     :host {
       display: block;
       font-family: var(--crt-font-family);
@@ -3165,21 +3146,21 @@ $t.styles = d`
       font-size: var(--crt-font-size-sm);
     }
   `;
-oe([
+qt([
   n({ type: Array })
-], $t.prototype, "items", 2);
-oe([
+], vt.prototype, "items", 2);
+qt([
   n({ type: String })
-], $t.prototype, "separator", 2);
-$t = oe([
-  u("crt-breadcrumb")
-], $t);
-var Er = Object.defineProperty, Mr = Object.getOwnPropertyDescriptor, St = (e, t, a, s) => {
-  for (var r = s > 1 ? void 0 : s ? Mr(t, a) : t, i = e.length - 1, o; i >= 0; i--)
-    (o = e[i]) && (r = (s ? o(t, a, r) : o(r)) || r);
-  return s && r && Er(t, a, r), r;
+], vt.prototype, "separator", 2);
+vt = qt([
+  d("crt-breadcrumb")
+], vt);
+var Qe = Object.defineProperty, Je = Object.getOwnPropertyDescriptor, xt = (e, t, a, i) => {
+  for (var r = i > 1 ? void 0 : i ? Je(t, a) : t, s = e.length - 1, o; s >= 0; s--)
+    (o = e[s]) && (r = (i ? o(t, a, r) : o(r)) || r);
+  return i && r && Qe(t, a, r), r;
 };
-let rt = class extends h {
+let W = class extends p {
   constructor() {
     super(...arguments), this.current = 1, this.total = 1, this.siblings = 1, this.showInfo = !0;
   }
@@ -3191,9 +3172,9 @@ let rt = class extends h {
   _getPageNumbers() {
     const e = [], t = this.current > this.siblings + 2, a = this.current < this.total - this.siblings - 1;
     e.push(1), t && e.push("...");
-    const s = Math.max(2, this.current - this.siblings), r = Math.min(this.total - 1, this.current + this.siblings);
-    for (let i = s; i <= r; i++)
-      e.includes(i) || e.push(i);
+    const i = Math.max(2, this.current - this.siblings), r = Math.min(this.total - 1, this.current + this.siblings);
+    for (let s = i; s <= r; s++)
+      e.includes(s) || e.push(s);
     return a && e.push("..."), this.total > 1 && !e.includes(this.total) && e.push(this.total), e;
   }
   render() {
@@ -3238,7 +3219,7 @@ let rt = class extends h {
     `;
   }
 };
-rt.styles = d`
+W.styles = c`
     :host {
       display: block;
       font-family: var(--crt-font-family);
@@ -3293,27 +3274,27 @@ rt.styles = d`
       margin-left: var(--crt-spacing-md);
     }
   `;
-St([
+xt([
   n({ type: Number })
-], rt.prototype, "current", 2);
-St([
+], W.prototype, "current", 2);
+xt([
   n({ type: Number })
-], rt.prototype, "total", 2);
-St([
+], W.prototype, "total", 2);
+xt([
   n({ type: Number })
-], rt.prototype, "siblings", 2);
-St([
+], W.prototype, "siblings", 2);
+xt([
   n({ type: Boolean })
-], rt.prototype, "showInfo", 2);
-rt = St([
-  u("crt-pagination")
-], rt);
-var Dr = Object.defineProperty, Tr = Object.getOwnPropertyDescriptor, B = (e, t, a, s) => {
-  for (var r = s > 1 ? void 0 : s ? Tr(t, a) : t, i = e.length - 1, o; i >= 0; i--)
-    (o = e[i]) && (r = (s ? o(t, a, r) : o(r)) || r);
-  return s && r && Dr(t, a, r), r;
+], W.prototype, "showInfo", 2);
+W = xt([
+  d("crt-pagination")
+], W);
+var Ze = Object.defineProperty, tr = Object.getOwnPropertyDescriptor, I = (e, t, a, i) => {
+  for (var r = i > 1 ? void 0 : i ? tr(t, a) : t, s = e.length - 1, o; s >= 0; s--)
+    (o = e[s]) && (r = (i ? o(t, a, r) : o(r)) || r);
+  return i && r && Ze(t, a, r), r;
 };
-let _ = class extends h {
+let w = class extends p {
   constructor() {
     super(...arguments), this.value = 50, this.min = 0, this.max = 100, this.step = 1, this.label = "", this.disabled = !1, this.showMarks = !1, this.unit = "";
   }
@@ -3370,7 +3351,7 @@ let _ = class extends h {
     `;
   }
 };
-_.styles = d`
+w.styles = c`
     :host {
       display: block;
       font-family: var(--crt-font-family);
@@ -3504,39 +3485,39 @@ _.styles = d`
       cursor: not-allowed;
     }
   `;
-B([
+I([
   n({ type: Number })
-], _.prototype, "value", 2);
-B([
+], w.prototype, "value", 2);
+I([
   n({ type: Number })
-], _.prototype, "min", 2);
-B([
+], w.prototype, "min", 2);
+I([
   n({ type: Number })
-], _.prototype, "max", 2);
-B([
+], w.prototype, "max", 2);
+I([
   n({ type: Number })
-], _.prototype, "step", 2);
-B([
+], w.prototype, "step", 2);
+I([
   n({ type: String })
-], _.prototype, "label", 2);
-B([
+], w.prototype, "label", 2);
+I([
   n({ type: Boolean, reflect: !0 })
-], _.prototype, "disabled", 2);
-B([
+], w.prototype, "disabled", 2);
+I([
   n({ type: Boolean })
-], _.prototype, "showMarks", 2);
-B([
+], w.prototype, "showMarks", 2);
+I([
   n({ type: String })
-], _.prototype, "unit", 2);
-_ = B([
-  u("crt-slider")
-], _);
-var jr = Object.defineProperty, Lr = Object.getOwnPropertyDescriptor, ot = (e, t, a, s) => {
-  for (var r = s > 1 ? void 0 : s ? Lr(t, a) : t, i = e.length - 1, o; i >= 0; i--)
-    (o = e[i]) && (r = (s ? o(t, a, r) : o(r)) || r);
-  return s && r && jr(t, a, r), r;
+], w.prototype, "unit", 2);
+w = I([
+  d("crt-slider")
+], w);
+var er = Object.defineProperty, rr = Object.getOwnPropertyDescriptor, et = (e, t, a, i) => {
+  for (var r = i > 1 ? void 0 : i ? rr(t, a) : t, s = e.length - 1, o; s >= 0; s--)
+    (o = e[s]) && (r = (i ? o(t, a, r) : o(r)) || r);
+  return i && r && er(t, a, r), r;
 };
-let T = class extends h {
+let M = class extends p {
   constructor() {
     super(...arguments), this.checked = !1, this.disabled = !1, this.label = "", this.onLabel = "1", this.offLabel = "0", this.size = "medium";
   }
@@ -3567,7 +3548,7 @@ let T = class extends h {
     `;
   }
 };
-T.styles = d`
+M.styles = c`
     :host {
       display: inline-flex;
       align-items: center;
@@ -3689,33 +3670,33 @@ T.styles = d`
       left: 35px;
     }
   `;
-ot([
+et([
   n({ type: Boolean, reflect: !0 })
-], T.prototype, "checked", 2);
-ot([
+], M.prototype, "checked", 2);
+et([
   n({ type: Boolean, reflect: !0 })
-], T.prototype, "disabled", 2);
-ot([
+], M.prototype, "disabled", 2);
+et([
   n({ type: String })
-], T.prototype, "label", 2);
-ot([
+], M.prototype, "label", 2);
+et([
   n({ type: String })
-], T.prototype, "onLabel", 2);
-ot([
+], M.prototype, "onLabel", 2);
+et([
   n({ type: String })
-], T.prototype, "offLabel", 2);
-ot([
+], M.prototype, "offLabel", 2);
+et([
   n({ type: String, reflect: !0 })
-], T.prototype, "size", 2);
-T = ot([
-  u("crt-toggle")
-], T);
-var Ir = Object.defineProperty, Br = Object.getOwnPropertyDescriptor, N = (e, t, a, s) => {
-  for (var r = s > 1 ? void 0 : s ? Br(t, a) : t, i = e.length - 1, o; i >= 0; i--)
-    (o = e[i]) && (r = (s ? o(t, a, r) : o(r)) || r);
-  return s && r && Ir(t, a, r), r;
+], M.prototype, "size", 2);
+M = et([
+  d("crt-toggle")
+], M);
+var ar = Object.defineProperty, ir = Object.getOwnPropertyDescriptor, L = (e, t, a, i) => {
+  for (var r = i > 1 ? void 0 : i ? ir(t, a) : t, s = e.length - 1, o; s >= 0; s--)
+    (o = e[s]) && (r = (i ? o(t, a, r) : o(r)) || r);
+  return i && r && ar(t, a, r), r;
 };
-let j = class extends h {
+let j = class extends p {
   constructor() {
     super(...arguments), this.src = "", this.alt = "", this.name = "", this.size = "md", this.shape = "square", this.status = "";
   }
@@ -3748,7 +3729,7 @@ let j = class extends h {
     `;
   }
 };
-j.styles = d`
+j.styles = c`
     :host {
       display: inline-block;
       font-family: var(--crt-font-family);
@@ -3876,28 +3857,28 @@ j.styles = d`
       border-color: var(--crt-bg-dark);
     }
   `;
-N([
+L([
   n({ type: String })
 ], j.prototype, "src", 2);
-N([
+L([
   n({ type: String })
 ], j.prototype, "alt", 2);
-N([
+L([
   n({ type: String })
 ], j.prototype, "name", 2);
-N([
+L([
   n({ type: String, reflect: !0 })
 ], j.prototype, "size", 2);
-N([
+L([
   n({ type: String, reflect: !0 })
 ], j.prototype, "shape", 2);
-N([
+L([
   n({ type: String, reflect: !0 })
 ], j.prototype, "status", 2);
-j = N([
-  u("crt-avatar")
+j = L([
+  d("crt-avatar")
 ], j);
-let Rt = class extends h {
+let Et = class extends p {
   constructor() {
     super(...arguments), this.max = 5;
   }
@@ -3907,7 +3888,7 @@ let Rt = class extends h {
     `;
   }
 };
-Rt.styles = d`
+Et.styles = c`
     :host {
       display: inline-flex;
       align-items: center;
@@ -3936,18 +3917,18 @@ Rt.styles = d`
       box-shadow: var(--crt-glow-sm);
     }
   `;
-N([
+L([
   n({ type: Number })
-], Rt.prototype, "max", 2);
-Rt = N([
-  u("crt-avatar-group")
-], Rt);
-var Nr = Object.defineProperty, Ur = Object.getOwnPropertyDescriptor, S = (e, t, a, s) => {
-  for (var r = s > 1 ? void 0 : s ? Ur(t, a) : t, i = e.length - 1, o; i >= 0; i--)
-    (o = e[i]) && (r = (s ? o(t, a, r) : o(r)) || r);
-  return s && r && Nr(t, a, r), r;
+], Et.prototype, "max", 2);
+Et = L([
+  d("crt-avatar-group")
+], Et);
+var sr = Object.defineProperty, or = Object.getOwnPropertyDescriptor, O = (e, t, a, i) => {
+  for (var r = i > 1 ? void 0 : i ? or(t, a) : t, s = e.length - 1, o; s >= 0; s--)
+    (o = e[s]) && (r = (i ? o(t, a, r) : o(r)) || r);
+  return i && r && sr(t, a, r), r;
 };
-let q = class extends h {
+let F = class extends p {
   constructor() {
     super(...arguments), this.variant = "rectangular", this.animation = "shimmer", this.width = "100%", this.height = "20px", this.effect = !1;
   }
@@ -3960,7 +3941,7 @@ let q = class extends h {
     `;
   }
 };
-q.styles = d`
+F.styles = c`
     :host {
       display: block;
     }
@@ -4075,25 +4056,25 @@ q.styles = d`
       pointer-events: none;
     }
   `;
-S([
+O([
   n({ type: String, reflect: !0 })
-], q.prototype, "variant", 2);
-S([
+], F.prototype, "variant", 2);
+O([
   n({ type: String, reflect: !0 })
-], q.prototype, "animation", 2);
-S([
+], F.prototype, "animation", 2);
+O([
   n({ type: String })
-], q.prototype, "width", 2);
-S([
+], F.prototype, "width", 2);
+O([
   n({ type: String })
-], q.prototype, "height", 2);
-S([
+], F.prototype, "height", 2);
+O([
   n({ type: Boolean, reflect: !0 })
-], q.prototype, "effect", 2);
-q = S([
-  u("crt-skeleton")
-], q);
-let Ft = class extends h {
+], F.prototype, "effect", 2);
+F = O([
+  d("crt-skeleton")
+], F);
+let Dt = class extends p {
   constructor() {
     super(...arguments), this.lines = 3;
   }
@@ -4105,7 +4086,7 @@ let Ft = class extends h {
     `;
   }
 };
-Ft.styles = d`
+Dt.styles = c`
     :host {
       display: block;
     }
@@ -4137,13 +4118,13 @@ Ft.styles = d`
       }
     }
   `;
-S([
+O([
   n({ type: Number })
-], Ft.prototype, "lines", 2);
-Ft = S([
-  u("crt-skeleton-text")
-], Ft);
-let Ht = class extends h {
+], Dt.prototype, "lines", 2);
+Dt = O([
+  d("crt-skeleton-text")
+], Dt);
+let Mt = class extends p {
   constructor() {
     super(...arguments), this.hideImage = !1;
   }
@@ -4159,7 +4140,7 @@ let Ht = class extends h {
     `;
   }
 };
-Ht.styles = d`
+Mt.styles = c`
     :host {
       display: block;
     }
@@ -4210,18 +4191,18 @@ Ht.styles = d`
       }
     }
   `;
-S([
+O([
   n({ type: Boolean })
-], Ht.prototype, "hideImage", 2);
-Ht = S([
-  u("crt-skeleton-card")
-], Ht);
-var Rr = Object.defineProperty, Fr = Object.getOwnPropertyDescriptor, U = (e, t, a, s) => {
-  for (var r = s > 1 ? void 0 : s ? Fr(t, a) : t, i = e.length - 1, o; i >= 0; i--)
-    (o = e[i]) && (r = (s ? o(t, a, r) : o(r)) || r);
-  return s && r && Rr(t, a, r), r;
+], Mt.prototype, "hideImage", 2);
+Mt = O([
+  d("crt-skeleton-card")
+], Mt);
+var nr = Object.defineProperty, lr = Object.getOwnPropertyDescriptor, B = (e, t, a, i) => {
+  for (var r = i > 1 ? void 0 : i ? lr(t, a) : t, s = e.length - 1, o; s >= 0; s--)
+    (o = e[s]) && (r = (i ? o(t, a, r) : o(r)) || r);
+  return i && r && nr(t, a, r), r;
 };
-let z = class extends h {
+let k = class extends p {
   constructor() {
     super(...arguments), this.variant = "info", this.title = "", this.closable = !1, this.filled = !1, this.outlined = !1, this.banner = !1, this.animated = !1, this.icon = "";
   }
@@ -4256,7 +4237,7 @@ let z = class extends h {
     `;
   }
 };
-z.styles = d`
+k.styles = c`
     :host {
       display: block;
       font-family: var(--crt-font-family);
@@ -4421,39 +4402,39 @@ z.styles = d`
       border-top: none;
     }
   `;
-U([
+B([
   n({ type: String, reflect: !0 })
-], z.prototype, "variant", 2);
-U([
+], k.prototype, "variant", 2);
+B([
   n({ type: String })
-], z.prototype, "title", 2);
-U([
+], k.prototype, "title", 2);
+B([
   n({ type: Boolean, reflect: !0 })
-], z.prototype, "closable", 2);
-U([
+], k.prototype, "closable", 2);
+B([
   n({ type: Boolean, reflect: !0 })
-], z.prototype, "filled", 2);
-U([
+], k.prototype, "filled", 2);
+B([
   n({ type: Boolean, reflect: !0 })
-], z.prototype, "outlined", 2);
-U([
+], k.prototype, "outlined", 2);
+B([
   n({ type: Boolean, reflect: !0 })
-], z.prototype, "banner", 2);
-U([
+], k.prototype, "banner", 2);
+B([
   n({ type: Boolean, reflect: !0 })
-], z.prototype, "animated", 2);
-U([
+], k.prototype, "animated", 2);
+B([
   n({ type: String })
-], z.prototype, "icon", 2);
-z = U([
-  u("crt-alert")
-], z);
-var Hr = Object.defineProperty, Yr = Object.getOwnPropertyDescriptor, ne = (e, t, a, s) => {
-  for (var r = s > 1 ? void 0 : s ? Yr(t, a) : t, i = e.length - 1, o; i >= 0; i--)
-    (o = e[i]) && (r = (s ? o(t, a, r) : o(r)) || r);
-  return s && r && Hr(t, a, r), r;
+], k.prototype, "icon", 2);
+k = B([
+  d("crt-alert")
+], k);
+var cr = Object.defineProperty, pr = Object.getOwnPropertyDescriptor, Ht = (e, t, a, i) => {
+  for (var r = i > 1 ? void 0 : i ? pr(t, a) : t, s = e.length - 1, o; s >= 0; s--)
+    (o = e[s]) && (r = (i ? o(t, a, r) : o(r)) || r);
+  return i && r && cr(t, a, r), r;
 };
-let _t = class extends h {
+let ut = class extends p {
   constructor() {
     super(...arguments), this.open = !1, this.message = "LOADING...";
   }
@@ -4477,7 +4458,7 @@ let _t = class extends h {
     ` : l``;
   }
 };
-_t.styles = d`
+ut.styles = c`
     :host {
       display: block;
     }
@@ -4699,21 +4680,21 @@ _t.styles = d`
       50% { opacity: 0.5; }
     }
   `;
-ne([
+Ht([
   n({ type: Boolean, reflect: !0 })
-], _t.prototype, "open", 2);
-ne([
+], ut.prototype, "open", 2);
+Ht([
   n({ type: String })
-], _t.prototype, "message", 2);
-_t = ne([
-  u("crt-spinner")
-], _t);
-var Vr = Object.getOwnPropertyDescriptor, qr = (e, t, a, s) => {
-  for (var r = s > 1 ? void 0 : s ? Vr(t, a) : t, i = e.length - 1, o; i >= 0; i--)
-    (o = e[i]) && (r = o(r) || r);
+], ut.prototype, "message", 2);
+ut = Ht([
+  d("crt-spinner")
+], ut);
+var dr = Object.getOwnPropertyDescriptor, hr = (e, t, a, i) => {
+  for (var r = i > 1 ? void 0 : i ? dr(t, a) : t, s = e.length - 1, o; s >= 0; s--)
+    (o = e[s]) && (r = o(r) || r);
   return r;
 };
-let Qt = class extends h {
+let Ut = class extends p {
   render() {
     return l`
       <div class="card">
@@ -4730,7 +4711,7 @@ let Qt = class extends h {
     `;
   }
 };
-Qt.styles = d`
+Ut.styles = c`
     :host {
       /* Make the card element act like a normal block-level container
          so external width/height styles can be applied responsively. */
@@ -4772,15 +4753,15 @@ Qt.styles = d`
       margin-top: var(--crt-spacing-md);
     }
   `;
-Qt = qr([
-  u("crt-card")
-], Qt);
-var Wr = Object.defineProperty, Xr = Object.getOwnPropertyDescriptor, le = (e, t, a, s) => {
-  for (var r = s > 1 ? void 0 : s ? Xr(t, a) : t, i = e.length - 1, o; i >= 0; i--)
-    (o = e[i]) && (r = (s ? o(t, a, r) : o(r)) || r);
-  return s && r && Wr(t, a, r), r;
+Ut = hr([
+  d("crt-card")
+], Ut);
+var vr = Object.defineProperty, ur = Object.getOwnPropertyDescriptor, Kt = (e, t, a, i) => {
+  for (var r = i > 1 ? void 0 : i ? ur(t, a) : t, s = e.length - 1, o; s >= 0; s--)
+    (o = e[s]) && (r = (i ? o(t, a, r) : o(r)) || r);
+  return i && r && vr(t, a, r), r;
 };
-let zt = class extends h {
+let gt = class extends p {
   constructor() {
     super(...arguments), this.headers = [], this.rows = [];
   }
@@ -4799,7 +4780,7 @@ let zt = class extends h {
     `;
   }
 };
-zt.styles = d`
+gt.styles = c`
     :host {
       display: block;
     }
@@ -4851,21 +4832,21 @@ zt.styles = d`
       border-bottom: none;
     }
   `;
-le([
+Kt([
   n({ type: Array })
-], zt.prototype, "headers", 2);
-le([
+], gt.prototype, "headers", 2);
+Kt([
   n({ type: Array })
-], zt.prototype, "rows", 2);
-zt = le([
-  u("crt-table")
-], zt);
-var Kr = Object.defineProperty, Gr = Object.getOwnPropertyDescriptor, ce = (e, t, a, s) => {
-  for (var r = s > 1 ? void 0 : s ? Gr(t, a) : t, i = e.length - 1, o; i >= 0; i--)
-    (o = e[i]) && (r = (s ? o(t, a, r) : o(r)) || r);
-  return s && r && Kr(t, a, r), r;
+], gt.prototype, "rows", 2);
+gt = Kt([
+  d("crt-table")
+], gt);
+var gr = Object.defineProperty, mr = Object.getOwnPropertyDescriptor, Xt = (e, t, a, i) => {
+  for (var r = i > 1 ? void 0 : i ? mr(t, a) : t, s = e.length - 1, o; s >= 0; s--)
+    (o = e[s]) && (r = (i ? o(t, a, r) : o(r)) || r);
+  return i && r && gr(t, a, r), r;
 };
-let Ct = class extends h {
+let mt = class extends p {
   constructor() {
     super(...arguments), this.columns = 3, this.gap = "var(--crt-spacing-lg)";
   }
@@ -4883,7 +4864,7 @@ let Ct = class extends h {
     `;
   }
 };
-Ct.styles = d`
+mt.styles = c`
     :host {
       display: block;
     }
@@ -4912,21 +4893,21 @@ Ct.styles = d`
       }
     }
   `;
-ce([
+Xt([
   n({ type: Number })
-], Ct.prototype, "columns", 2);
-ce([
+], mt.prototype, "columns", 2);
+Xt([
   n({ type: String })
-], Ct.prototype, "gap", 2);
-Ct = ce([
-  u("crt-grid")
-], Ct);
-var Zr = Object.defineProperty, Qr = Object.getOwnPropertyDescriptor, vt = (e, t, a, s) => {
-  for (var r = s > 1 ? void 0 : s ? Qr(t, a) : t, i = e.length - 1, o; i >= 0; i--)
-    (o = e[i]) && (r = (s ? o(t, a, r) : o(r)) || r);
-  return s && r && Zr(t, a, r), r;
+], mt.prototype, "gap", 2);
+mt = Xt([
+  d("crt-grid")
+], mt);
+var fr = Object.defineProperty, br = Object.getOwnPropertyDescriptor, nt = (e, t, a, i) => {
+  for (var r = i > 1 ? void 0 : i ? br(t, a) : t, s = e.length - 1, o; s >= 0; s--)
+    (o = e[s]) && (r = (i ? o(t, a, r) : o(r)) || r);
+  return i && r && fr(t, a, r), r;
 };
-let W = class extends h {
+let V = class extends p {
   constructor() {
     super(...arguments), this.title = "", this.description = "", this.code = "", this.activeTab = "preview", this.copied = !1;
   }
@@ -4983,7 +4964,7 @@ let W = class extends h {
     `;
   }
 };
-W.styles = d`
+V.styles = c`
     :host {
       display: block;
       margin-bottom: var(--crt-spacing-xl);
@@ -5132,30 +5113,30 @@ W.styles = d`
       color: var(--crt-bg-dark);
     }
   `;
-vt([
+nt([
   n()
-], W.prototype, "title", 2);
-vt([
+], V.prototype, "title", 2);
+nt([
   n()
-], W.prototype, "description", 2);
-vt([
+], V.prototype, "description", 2);
+nt([
   n()
-], W.prototype, "code", 2);
-vt([
-  m()
-], W.prototype, "activeTab", 2);
-vt([
-  m()
-], W.prototype, "copied", 2);
-W = vt([
-  u("crt-code-example")
-], W);
-var Jr = Object.defineProperty, ta = Object.getOwnPropertyDescriptor, Kt = (e, t, a, s) => {
-  for (var r = s > 1 ? void 0 : s ? ta(t, a) : t, i = e.length - 1, o; i >= 0; i--)
-    (o = e[i]) && (r = (s ? o(t, a, r) : o(r)) || r);
-  return s && r && Jr(t, a, r), r;
+], V.prototype, "code", 2);
+nt([
+  v()
+], V.prototype, "activeTab", 2);
+nt([
+  v()
+], V.prototype, "copied", 2);
+V = nt([
+  d("crt-code-example")
+], V);
+var yr = Object.defineProperty, xr = Object.getOwnPropertyDescriptor, Bt = (e, t, a, i) => {
+  for (var r = i > 1 ? void 0 : i ? xr(t, a) : t, s = e.length - 1, o; s >= 0; s--)
+    (o = e[s]) && (r = (i ? o(t, a, r) : o(r)) || r);
+  return i && r && yr(t, a, r), r;
 };
-let ht = class extends h {
+let st = class extends p {
   constructor() {
     super(...arguments), this.open = !1, this.title = "Modal", this.size = "medium", this._handleKeydown = (e) => {
       e.key === "Escape" && this.open && this.close();
@@ -5192,7 +5173,7 @@ let ht = class extends h {
     `;
   }
 };
-ht.styles = d`
+st.styles = c`
     :host {
       display: none;
     }
@@ -5319,24 +5300,24 @@ ht.styles = d`
       height: calc(95vh - 120px);
     }
   `;
-Kt([
+Bt([
   n({ type: Boolean, reflect: !0 })
-], ht.prototype, "open", 2);
-Kt([
+], st.prototype, "open", 2);
+Bt([
   n({ type: String })
-], ht.prototype, "title", 2);
-Kt([
+], st.prototype, "title", 2);
+Bt([
   n({ type: String })
-], ht.prototype, "size", 2);
-ht = Kt([
-  u("crt-modal")
-], ht);
-var ea = Object.defineProperty, ra = Object.getOwnPropertyDescriptor, nt = (e, t, a, s) => {
-  for (var r = s > 1 ? void 0 : s ? ra(t, a) : t, i = e.length - 1, o; i >= 0; i--)
-    (o = e[i]) && (r = (s ? o(t, a, r) : o(r)) || r);
-  return s && r && ea(t, a, r), r;
+], st.prototype, "size", 2);
+st = Bt([
+  d("crt-modal")
+], st);
+var wr = Object.defineProperty, kr = Object.getOwnPropertyDescriptor, rt = (e, t, a, i) => {
+  for (var r = i > 1 ? void 0 : i ? kr(t, a) : t, s = e.length - 1, o; s >= 0; s--)
+    (o = e[s]) && (r = (i ? o(t, a, r) : o(r)) || r);
+  return i && r && wr(t, a, r), r;
 };
-let L = class extends h {
+let T = class extends p {
   constructor() {
     super(...arguments), this.position = "top-right", this.message = "", this.title = "", this.variant = "default", this.duration = 4e3, this._toasts = [], this._counter = 0, this._initialized = !1;
   }
@@ -5401,7 +5382,7 @@ let L = class extends h {
     `;
   }
 };
-L.styles = d`
+T.styles = c`
     :host {
       position: fixed;
       z-index: 10001;
@@ -5568,33 +5549,33 @@ L.styles = d`
       to { width: 0%; }
     }
   `;
-nt([
+rt([
   n({ type: String, reflect: !0 })
-], L.prototype, "position", 2);
-nt([
+], T.prototype, "position", 2);
+rt([
   n({ type: String })
-], L.prototype, "message", 2);
-nt([
+], T.prototype, "message", 2);
+rt([
   n({ type: String })
-], L.prototype, "title", 2);
-nt([
+], T.prototype, "title", 2);
+rt([
   n({ type: String })
-], L.prototype, "variant", 2);
-nt([
+], T.prototype, "variant", 2);
+rt([
   n({ type: Number })
-], L.prototype, "duration", 2);
-nt([
-  m()
-], L.prototype, "_toasts", 2);
-L = nt([
-  u("crt-toast")
-], L);
-var aa = Object.defineProperty, sa = Object.getOwnPropertyDescriptor, Et = (e, t, a, s) => {
-  for (var r = s > 1 ? void 0 : s ? sa(t, a) : t, i = e.length - 1, o; i >= 0; i--)
-    (o = e[i]) && (r = (s ? o(t, a, r) : o(r)) || r);
-  return s && r && aa(t, a, r), r;
+], T.prototype, "duration", 2);
+rt([
+  v()
+], T.prototype, "_toasts", 2);
+T = rt([
+  d("crt-toast")
+], T);
+var _r = Object.defineProperty, $r = Object.getOwnPropertyDescriptor, wt = (e, t, a, i) => {
+  for (var r = i > 1 ? void 0 : i ? $r(t, a) : t, s = e.length - 1, o; s >= 0; s--)
+    (o = e[s]) && (r = (i ? o(t, a, r) : o(r)) || r);
+  return i && r && _r(t, a, r), r;
 };
-let Pt = class extends h {
+let ft = class extends p {
   constructor() {
     super(...arguments), this.header = "", this.open = !1;
   }
@@ -5623,7 +5604,7 @@ let Pt = class extends h {
     `;
   }
 };
-Pt.styles = d`
+ft.styles = c`
     :host {
       display: block;
       font-family: var(--crt-font-family);
@@ -5694,16 +5675,16 @@ Pt.styles = d`
       color: var(--crt-text-secondary);
     }
   `;
-Et([
+wt([
   n({ type: String })
-], Pt.prototype, "header", 2);
-Et([
+], ft.prototype, "header", 2);
+wt([
   n({ type: Boolean, reflect: !0 })
-], Pt.prototype, "open", 2);
-Pt = Et([
-  u("crt-accordion-item")
-], Pt);
-let Yt = class extends h {
+], ft.prototype, "open", 2);
+ft = wt([
+  d("crt-accordion-item")
+], ft);
+let jt = class extends p {
   constructor() {
     super(...arguments), this.multiple = !1, this._handleToggle = (e) => {
       !this.multiple && e.detail.open && this.querySelectorAll("crt-accordion-item").forEach((t) => {
@@ -5721,33 +5702,33 @@ let Yt = class extends h {
     return l`<slot></slot>`;
   }
 };
-Yt.styles = d`
+jt.styles = c`
     :host {
       display: block;
     }
   `;
-Et([
+wt([
   n({ type: Boolean })
-], Yt.prototype, "multiple", 2);
-Yt = Et([
-  u("crt-accordion")
-], Yt);
-var ia = Object.defineProperty, oa = Object.getOwnPropertyDescriptor, Mt = (e, t, a, s) => {
-  for (var r = s > 1 ? void 0 : s ? oa(t, a) : t, i = e.length - 1, o; i >= 0; i--)
-    (o = e[i]) && (r = (s ? o(t, a, r) : o(r)) || r);
-  return s && r && ia(t, a, r), r;
+], jt.prototype, "multiple", 2);
+jt = wt([
+  d("crt-accordion")
+], jt);
+var zr = Object.defineProperty, Cr = Object.getOwnPropertyDescriptor, kt = (e, t, a, i) => {
+  for (var r = i > 1 ? void 0 : i ? Cr(t, a) : t, s = e.length - 1, o; s >= 0; s--)
+    (o = e[s]) && (r = (i ? o(t, a, r) : o(r)) || r);
+  return i && r && zr(t, a, r), r;
 };
-let at = class extends h {
+let G = class extends p {
   constructor() {
     super(...arguments), this.bars = 20, this.mode = 1, this.barHeights = [], this.isActive = !1, this.visualize = () => {
       if (!this.isActive || !this.analyser || !this.dataArray) return;
       this.analyser.getByteFrequencyData(this.dataArray);
       const e = Math.floor(this.dataArray.length / this.bars), t = [];
       for (let a = 0; a < this.bars; a++) {
-        let s;
-        this.mode === 1 ? s = a * e : this.mode === 2 ? a < this.bars / 2 ? s = Math.floor((this.bars / 2 - a - 1) * e) : s = Math.floor((a - this.bars / 2) * e) : a < this.bars / 2 ? s = Math.floor(a * e) : s = Math.floor((this.bars - a - 1) * e);
-        const i = (this.dataArray[s] || 0) / 255 * 100;
-        t.push(Math.max(20, i));
+        let i;
+        this.mode === 1 ? i = a * e : this.mode === 2 ? a < this.bars / 2 ? i = Math.floor((this.bars / 2 - a - 1) * e) : i = Math.floor((a - this.bars / 2) * e) : a < this.bars / 2 ? i = Math.floor(a * e) : i = Math.floor((this.bars - a - 1) * e);
+        const s = (this.dataArray[i] || 0) / 255 * 100;
+        t.push(Math.max(20, s));
       }
       this.barHeights = t, this.animationId = requestAnimationFrame(this.visualize);
     };
@@ -5790,7 +5771,7 @@ let at = class extends h {
     `;
   }
 };
-at.styles = d`
+G.styles = c`
     :host {
       display: block;
     }
@@ -5865,27 +5846,27 @@ at.styles = d`
       animation: none;
     }
   `;
-Mt([
+kt([
   n({ type: Number })
-], at.prototype, "bars", 2);
-Mt([
+], G.prototype, "bars", 2);
+kt([
   n({ type: Number })
-], at.prototype, "mode", 2);
-Mt([
-  m()
-], at.prototype, "barHeights", 2);
-Mt([
-  m()
-], at.prototype, "isActive", 2);
-at = Mt([
-  u("crt-visualizer")
-], at);
-var na = Object.defineProperty, la = Object.getOwnPropertyDescriptor, pe = (e, t, a, s) => {
-  for (var r = s > 1 ? void 0 : s ? la(t, a) : t, i = e.length - 1, o; i >= 0; i--)
-    (o = e[i]) && (r = (s ? o(t, a, r) : o(r)) || r);
-  return s && r && na(t, a, r), r;
+], G.prototype, "mode", 2);
+kt([
+  v()
+], G.prototype, "barHeights", 2);
+kt([
+  v()
+], G.prototype, "isActive", 2);
+G = kt([
+  d("crt-visualizer")
+], G);
+var Pr = Object.defineProperty, Or = Object.getOwnPropertyDescriptor, Wt = (e, t, a, i) => {
+  for (var r = i > 1 ? void 0 : i ? Or(t, a) : t, s = e.length - 1, o; s >= 0; s--)
+    (o = e[s]) && (r = (i ? o(t, a, r) : o(r)) || r);
+  return i && r && Pr(t, a, r), r;
 };
-let Ot = class extends h {
+let bt = class extends p {
   constructor() {
     super(...arguments), this.tracks = [], this.currentIndex = 0;
   }
@@ -5954,7 +5935,7 @@ let Ot = class extends h {
     `;
   }
 };
-Ot.styles = d`
+bt.styles = c`
     :host {
       display: block;
       width: 100%;
@@ -6124,21 +6105,21 @@ Ot.styles = d`
       box-shadow: var(--crt-glow-sm);
     }
   `;
-pe([
+Wt([
   n({ type: Array })
-], Ot.prototype, "tracks", 2);
-pe([
+], bt.prototype, "tracks", 2);
+Wt([
   n({ type: Number })
-], Ot.prototype, "currentIndex", 2);
-Ot = pe([
-  u("crt-playlist")
-], Ot);
-var ca = Object.defineProperty, pa = Object.getOwnPropertyDescriptor, $ = (e, t, a, s) => {
-  for (var r = s > 1 ? void 0 : s ? pa(t, a) : t, i = e.length - 1, o; i >= 0; i--)
-    (o = e[i]) && (r = (s ? o(t, a, r) : o(r)) || r);
-  return s && r && ca(t, a, r), r;
+], bt.prototype, "currentIndex", 2);
+bt = Wt([
+  d("crt-playlist")
+], bt);
+var Sr = Object.defineProperty, Er = Object.getOwnPropertyDescriptor, x = (e, t, a, i) => {
+  for (var r = i > 1 ? void 0 : i ? Er(t, a) : t, s = e.length - 1, o; s >= 0; s--)
+    (o = e[s]) && (r = (i ? o(t, a, r) : o(r)) || r);
+  return i && r && Sr(t, a, r), r;
 };
-let x = class extends h {
+let g = class extends p {
   constructor() {
     super(...arguments), this.tracks = [], this.currentIndex = 0, this.autoplay = !1, this.autoplayDelay = 500, this.isPlaying = !1, this.currentTime = 0, this.duration = 0, this.volume = 80, this.autoplayMuted = !1, this.togglePlay = async () => {
       this.isPlaying ? this.pause() : await this.play();
@@ -6153,8 +6134,8 @@ let x = class extends h {
     }, this.handleEnded = () => {
       this.nextTrack();
     }, this.handleProgressClick = (e) => {
-      const a = e.currentTarget.getBoundingClientRect(), s = (e.clientX - a.left) / a.width;
-      this.audio && (this.audio.currentTime = this.duration * s);
+      const a = e.currentTarget.getBoundingClientRect(), i = (e.clientX - a.left) / a.width;
+      this.audio && (this.audio.currentTime = this.duration * i);
     }, this.handleVolumeChange = (e) => {
       this.volume = e.detail.value, this.audio && (this.audio.volume = this.volume / 100), localStorage.setItem("crtPlayerVolume", this.volume.toString());
     };
@@ -6322,7 +6303,7 @@ let x = class extends h {
     `;
   }
 };
-x.styles = d`
+g.styles = c`
     :host {
       display: block;
       font-family: var(--crt-font-family);
@@ -6475,48 +6456,48 @@ x.styles = d`
       opacity: 0.5;
     }
   `;
-$([
+x([
   n({ type: Array })
-], x.prototype, "tracks", 2);
-$([
+], g.prototype, "tracks", 2);
+x([
   n({ type: Number })
-], x.prototype, "currentIndex", 2);
-$([
+], g.prototype, "currentIndex", 2);
+x([
   n({ type: Boolean })
-], x.prototype, "autoplay", 2);
-$([
+], g.prototype, "autoplay", 2);
+x([
   n({ type: Number })
-], x.prototype, "autoplayDelay", 2);
-$([
-  m()
-], x.prototype, "isPlaying", 2);
-$([
-  m()
-], x.prototype, "currentTime", 2);
-$([
-  m()
-], x.prototype, "duration", 2);
-$([
-  m()
-], x.prototype, "volume", 2);
-$([
-  m()
-], x.prototype, "autoplayMuted", 2);
-$([
-  ee("audio")
-], x.prototype, "audio", 2);
-$([
-  ee("crt-visualizer")
-], x.prototype, "visualizer", 2);
-x = $([
-  u("crt-music-player")
-], x);
-var da = Object.defineProperty, ha = Object.getOwnPropertyDescriptor, gt = (e, t, a, s) => {
-  for (var r = s > 1 ? void 0 : s ? ha(t, a) : t, i = e.length - 1, o; i >= 0; i--)
-    (o = e[i]) && (r = (s ? o(t, a, r) : o(r)) || r);
-  return s && r && da(t, a, r), r;
+], g.prototype, "autoplayDelay", 2);
+x([
+  v()
+], g.prototype, "isPlaying", 2);
+x([
+  v()
+], g.prototype, "currentTime", 2);
+x([
+  v()
+], g.prototype, "duration", 2);
+x([
+  v()
+], g.prototype, "volume", 2);
+x([
+  v()
+], g.prototype, "autoplayMuted", 2);
+x([
+  Ft("audio")
+], g.prototype, "audio", 2);
+x([
+  Ft("crt-visualizer")
+], g.prototype, "visualizer", 2);
+g = x([
+  d("crt-music-player")
+], g);
+var Dr = Object.defineProperty, Mr = Object.getOwnPropertyDescriptor, lt = (e, t, a, i) => {
+  for (var r = i > 1 ? void 0 : i ? Mr(t, a) : t, s = e.length - 1, o; s >= 0; s--)
+    (o = e[s]) && (r = (i ? o(t, a, r) : o(r)) || r);
+  return i && r && Dr(t, a, r), r;
 };
-let X = class extends h {
+let Y = class extends p {
   constructor() {
     super(), this.rows = 10, this.prompt = "$", this.disabled = !1, this.outputs = [], this.input = "", this.handleFocus = () => {
       this.disabled || this.focus();
@@ -6572,14 +6553,14 @@ let X = class extends h {
         const { text: e, speed: t } = this.typeQueue.shift();
         await new Promise((a) => {
           this.outputs = [...this.outputs, ""];
-          let s = 0;
+          let i = 0;
           const r = () => {
-            if (s >= e.length) {
+            if (i >= e.length) {
               a();
               return;
             }
-            const i = this.outputs.length - 1;
-            this.outputs[i] = (this.outputs[i] || "") + e[s++], this.requestUpdate(), this.scrollToBottom(), setTimeout(r, t);
+            const s = this.outputs.length - 1;
+            this.outputs[s] = (this.outputs[s] || "") + e[i++], this.requestUpdate(), this.scrollToBottom(), setTimeout(r, t);
           };
           r();
         });
@@ -6601,7 +6582,7 @@ let X = class extends h {
     `;
   }
 };
-X.styles = d`
+Y.styles = c`
     :host { display: block; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, 'Roboto Mono', monospace; width: 100%; max-width: none; box-sizing: border-box; min-width: 0; }
     .term {
       width: 100%;
@@ -6641,43 +6622,478 @@ X.styles = d`
     .fake-input .input-text { display:inline-block; white-space:pre; }
     .muted { opacity: 0.7; font-size: 0.9em; }
   `;
-gt([
+lt([
   n({ type: Number })
-], X.prototype, "rows", 2);
-gt([
+], Y.prototype, "rows", 2);
+lt([
   n({ type: String })
-], X.prototype, "prompt", 2);
-gt([
+], Y.prototype, "prompt", 2);
+lt([
   n({ type: Boolean, reflect: !0 })
-], X.prototype, "disabled", 2);
-gt([
-  m()
-], X.prototype, "outputs", 2);
-gt([
-  m()
-], X.prototype, "input", 2);
-X = gt([
-  u("crt-terminal")
-], X);
-var ua = Object.defineProperty, va = Object.getOwnPropertyDescriptor, lt = (e, t, a, s) => {
-  for (var r = s > 1 ? void 0 : s ? va(t, a) : t, i = e.length - 1, o; i >= 0; i--)
-    (o = e[i]) && (r = (s ? o(t, a, r) : o(r)) || r);
-  return s && r && ua(t, a, r), r;
+], Y.prototype, "disabled", 2);
+lt([
+  v()
+], Y.prototype, "outputs", 2);
+lt([
+  v()
+], Y.prototype, "input", 2);
+Y = lt([
+  d("crt-terminal")
+], Y);
+var jr = Object.defineProperty, Tr = Object.getOwnPropertyDescriptor, _t = (e, t, a, i) => {
+  for (var r = i > 1 ? void 0 : i ? Tr(t, a) : t, s = e.length - 1, o; s >= 0; s--)
+    (o = e[s]) && (r = (i ? o(t, a, r) : o(r)) || r);
+  return i && r && jr(t, a, r), r;
+};
+let Q = class extends p {
+  constructor() {
+    super(...arguments), this.items = [], this.brand = "", this._open = !1;
+  }
+  _toggle() {
+    this._open = !this._open;
+  }
+  _onLinkClick(e, t) {
+    try {
+      const a = (t.href || "").trim();
+      if (a && a.startsWith("#")) {
+        e.preventDefault();
+        const i = document.querySelector(a);
+        if (i) {
+          i.scrollIntoView({ behavior: "smooth", block: "start" });
+          try {
+            history.replaceState(null, "", a);
+          } catch {
+            location.hash = a;
+          }
+        } else
+          console.warn("crt-navbar: target not found for", a);
+      }
+    } catch {
+    }
+    this.dispatchEvent(new CustomEvent("nav-select", { detail: t })), this.items = this.items.map((a) => ({ ...a, active: a.href === t.href }));
+  }
+  _onMenuSelect(e) {
+    const t = e.detail?.item;
+    t && (this._handleNavHref(t.href), this.items = this.items.map((a) => ({ ...a, active: a.href === t.href })));
+  }
+  _onLinkNavigate(e, t) {
+    e.stopPropagation(), this._handleNavHref(t.href), this.items = this.items.map((a) => ({ ...a, active: a.href === t.href }));
+  }
+  _handleNavHref(e) {
+    const t = (e || "").trim();
+    if (t && t.startsWith("#")) {
+      const a = document.querySelector(t);
+      if (a) {
+        a.scrollIntoView({ behavior: "smooth", block: "start" });
+        try {
+          history.replaceState(null, "", t);
+        } catch {
+          location.hash = t;
+        }
+      }
+    }
+  }
+  render() {
+    const e = typeof this.maxVisible == "number" ? this.items.slice(0, this.maxVisible) : this.items.slice(0), t = typeof this.maxVisible == "number" ? this.items.slice(this.maxVisible) : [];
+    return l`
+      <nav class="nav" role="navigation" aria-label="Main Navigation">
+        <div style="display:flex;align-items:center;justify-content:space-between;gap:12px;">
+          <div class="brand">
+            <slot name="brand">${this.brand || "CRT"}</slot>
+          </div>
+          <button class="toggle" @click="${this._toggle}" aria-expanded="${this._open ? "true" : "false"}" aria-label="Toggle navigation">☰</button>
+        </div>
+
+        <div class="menu ${this._open ? "open" : ""}" role="menubar">
+          ${e.map((a) => l`
+            <crt-link
+              href="${a.href}"
+              class="link"
+              ?aria-current="${a.active ? !0 : void 0}"
+              @click=${(i) => this._onLinkClick(i, a)}
+              @navigate=${(i) => this._onLinkNavigate(i, a)}
+              >${a.label}</crt-link>
+          `)}
+
+          ${t.length > 0 ? l`
+            <div style="position:relative;">
+              <crt-menu .items="${t}" label="MORE" class="more-dropdown-container" @select="${(a) => this._onMenuSelect(a)}"></crt-menu>
+            </div>
+          ` : ""}
+
+          <slot name="end"></slot>
+        </div>
+      </nav>
+    `;
+  }
+};
+Q.styles = c`
+    :host { display: block; font-family: var(--crt-font-family); }
+    .nav {
+      position: relative;
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      gap: 12px;
+      padding: var(--crt-spacing-md) var(--crt-spacing-lg);
+      background: var(--crt-bg-darker);
+      border-bottom: 2px solid var(--crt-primary);
+      box-shadow: var(--crt-glow-inset);
+    }
+
+    .brand {
+      display: flex;
+      gap: 12px;
+      align-items: center;
+      color: var(--crt-primary);
+      text-shadow: var(--crt-glow);
+      font-weight: 700;
+      text-transform: uppercase;
+      letter-spacing: 2px;
+    }
+
+    .menu {
+      display: flex;
+      gap: 12px;
+      align-items: center;
+      overflow: hidden;
+      min-width: 0;
+    }
+
+    .link {
+      color: var(--crt-primary);
+      padding: 8px 12px;
+      text-decoration: none;
+      border: 1px solid transparent;
+      transition: var(--crt-transition);
+      font-family: var(--crt-font-family);
+      text-transform: uppercase;
+      letter-spacing: 1px;
+      white-space: nowrap;
+    }
+
+    .link:hover {
+      background: color-mix(in srgb, var(--crt-primary) 10%, transparent);
+      box-shadow: var(--crt-glow-sm);
+    }
+
+    .link[aria-current="true"] {
+      background: color-mix(in srgb, var(--crt-primary) 18%, transparent);
+      box-shadow: var(--crt-glow);
+      color: var(--crt-bg-dark);
+    }
+
+    /* .more-button replaced with crt-button - keep visual spacing rules */
+    .more-button {
+      background: transparent;
+      border: 1px solid transparent;
+      color: var(--crt-primary);
+      padding: 0;
+    }
+
+    .more-dropdown-container {
+      position: absolute;
+      right: 0;
+      margin-top: 8px;
+    }
+
+    .toggle {
+      display: none;
+      background: transparent;
+      border: 1px solid var(--crt-primary);
+      color: var(--crt-primary);
+      padding: 8px;
+      cursor: var(--crt-cursor-pointer);
+      font-family: var(--crt-font-family);
+    }
+
+    @media (max-width: 720px) {
+      .menu { display: none; }
+      .menu.open { display: flex; flex-direction: column; gap: 6px; margin-top: 8px; }
+      .toggle { display: inline-flex; }
+      .nav { flex-direction: column; align-items: stretch; }
+      .brand { justify-content: space-between; width: 100%; }
+    }
+  `;
+_t([
+  n({ type: Array })
+], Q.prototype, "items", 2);
+_t([
+  n({ type: String })
+], Q.prototype, "brand", 2);
+_t([
+  v()
+], Q.prototype, "_open", 2);
+_t([
+  n({ type: Number })
+], Q.prototype, "maxVisible", 2);
+Q = _t([
+  d("crt-navbar")
+], Q);
+var Ar = Object.defineProperty, Ir = Object.getOwnPropertyDescriptor, re = (e, t, a, i) => {
+  for (var r = i > 1 ? void 0 : i ? Ir(t, a) : t, s = e.length - 1, o; s >= 0; s--)
+    (o = e[s]) && (r = (i ? o(t, a, r) : o(r)) || r);
+  return i && r && Ar(t, a, r), r;
 };
-let I = class extends h {
+let Tt = class extends p {
+  constructor() {
+    super(...arguments), this.title = "";
+  }
+  render() {
+    return l`
+      <header class="header-wrap" role="banner">
+        <div style="display:flex;align-items:center;gap:12px;min-width:0;">
+          <slot name="brand">
+            <div style="display:flex;flex-direction:column;gap:2px;min-width:0;">
+              <crt-heading level="4">${this.title || "CRT LIVING STYLE GUIDE"}</crt-heading>
+              <crt-text muted style="font-size:var(--crt-font-size-xs);">Component Library · Lit Web Components</crt-text>
+            </div>
+          </slot>
+        </div>
+
+        <div class="actions">
+          <slot name="actions">
+            <!-- default action: search -->
+            <crt-search placeholder="Search styleguide..." style="width:220px;"></crt-search>
+          </slot>
+        </div>
+      </header>
+    `;
+  }
+};
+Tt.styles = c`
+    :host { display: block; }
+    .header-wrap {
+      padding: var(--crt-spacing-lg) var(--crt-spacing-md);
+      background: linear-gradient(180deg, rgba(0,0,0,0.65), rgba(0,0,0,0.75));
+      border-bottom: 2px solid var(--crt-primary);
+      box-shadow: var(--crt-glow-inset);
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      gap: 12px;
+    }
+
+    .title {
+      display: flex;
+      flex-direction: column;
+      gap: 4px;
+    }
+
+    /* Make nested atoms adopt spacing */
+    .title ::slotted(crt-heading) { margin: 0; }
+    .title ::slotted(crt-text) { margin: 0; }
+
+    .actions { display: flex; align-items: center; gap: 12px; }
+
+    @media (max-width: 720px) {
+      .header-wrap { flex-direction: column; align-items: stretch; }
+      .actions { justify-content: flex-end; width: 100%; }
+    }
+  `;
+re([
+  n({ type: String })
+], Tt.prototype, "title", 2);
+Tt = re([
+  d("crt-header")
+], Tt);
+var Lr = Object.defineProperty, Br = Object.getOwnPropertyDescriptor, ae = (e, t, a, i) => {
+  for (var r = i > 1 ? void 0 : i ? Br(t, a) : t, s = e.length - 1, o; s >= 0; s--)
+    (o = e[s]) && (r = (i ? o(t, a, r) : o(r)) || r);
+  return i && r && Lr(t, a, r), r;
+};
+let At = class extends p {
+  constructor() {
+    super(...arguments), this.copyright = "";
+  }
+  render() {
+    return l`
+      <footer class="footer">
+        <div><slot name="left">${this.copyright || "© 2026 CRT Style Guide"}</slot></div>
+        <div><slot name="right">Made with ♥ · <crt-link href="https://github.com/" target="_blank">GitHub</crt-link></slot></div>
+      </footer>
+    `;
+  }
+};
+At.styles = c`
+    :host { display: block; }
+    .footer {
+      padding: var(--crt-spacing-md) var(--crt-spacing-lg);
+      border-top: 2px solid var(--crt-primary);
+      background: var(--crt-bg-darker);
+      color: var(--crt-text-muted);
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      gap: 12px;
+      font-family: var(--crt-font-family);
+      font-size: var(--crt-font-size-sm);
+    }
+  `;
+ae([
+  n({ type: String })
+], At.prototype, "copyright", 2);
+At = ae([
+  d("crt-footer")
+], At);
+var Ur = Object.defineProperty, Nr = Object.getOwnPropertyDescriptor, $t = (e, t, a, i) => {
+  for (var r = i > 1 ? void 0 : i ? Nr(t, a) : t, s = e.length - 1, o; s >= 0; s--)
+    (o = e[s]) && (r = (i ? o(t, a, r) : o(r)) || r);
+  return i && r && Ur(t, a, r), r;
+};
+let J = class extends p {
+  constructor() {
+    super(...arguments), this.items = [], this.open = !1, this.label = "Menu", this._active = -1, this._triggerId = `crt-menu-trigger-${Math.random().toString(36).slice(2, 8)}`, this._listId = `crt-menu-list-${Math.random().toString(36).slice(2, 8)}`, this._onDocClick = (e) => {
+      this.open && (this.contains(e.target) || (this.open = !1, this._active = -1, this.shadowRoot?.querySelector("button.trigger")?.focus()));
+    }, this._onDocKeydown = (e) => {
+      this.open && e.key === "Escape" && (this.open = !1, this._active = -1, this.shadowRoot?.querySelector("button.trigger")?.focus());
+    }, this._toggle = () => {
+      this.open = !this.open, this.open ? (this._active = this.items.findIndex((e) => !e.disabled), this.updateComplete.then(() => {
+        this._focusActive();
+      })) : (this._active = -1, this.shadowRoot?.querySelector("button.trigger")?.focus());
+    };
+  }
+  connectedCallback() {
+    super.connectedCallback(), document.addEventListener("click", this._onDocClick), document.addEventListener("keydown", this._onDocKeydown);
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback(), document.removeEventListener("click", this._onDocClick), document.removeEventListener("keydown", this._onDocKeydown);
+  }
+  _focusActive() {
+    const e = this.shadowRoot?.querySelectorAll(".item");
+    if (!e) return;
+    e.forEach((a, i) => a.setAttribute("tabindex", this._active === i ? "0" : "-1")), e[this._active]?.focus();
+  }
+  _onKey(e) {
+    if (!this.open) return;
+    if (e.key === "Tab") {
+      this.open = !1, this._active = -1;
+      return;
+    }
+    const t = this.items.map((a, i) => ({ it: a, idx: i })).filter((a) => !a.it.disabled);
+    switch (["ArrowDown", "ArrowUp", "Home", "End", "Enter", " "].includes(e.key) && e.preventDefault(), e.key) {
+      case "ArrowDown": {
+        const a = t.find((i) => i.idx > this._active) || t[0];
+        this._active = a?.idx ?? this._active, this._focusActive();
+        break;
+      }
+      case "ArrowUp": {
+        const a = t.filter((r) => r.idx < this._active), i = a[a.length - 1] || t[t.length - 1];
+        this._active = i?.idx ?? this._active, this._focusActive();
+        break;
+      }
+      case "Home":
+        this._active = t[0]?.idx ?? this._active, this._focusActive();
+        break;
+      case "End":
+        this._active = t[t.length - 1]?.idx ?? this._active, this._focusActive();
+        break;
+      case "Enter":
+      case " ":
+        this._active >= 0 && this._select(this._active);
+        break;
+    }
+  }
+  _select(e) {
+    const t = this.items[e];
+    !t || t.disabled || (this.open = !1, this._active = -1, this.dispatchEvent(new CustomEvent("select", { detail: { item: t, index: e } })), t.href && (window.location.href = t.href), this.shadowRoot?.querySelector("button.trigger")?.focus());
+  }
+  render() {
+    return l`
+      <div style="display:flex;align-items:center;gap:8px;">
+        <button id="${this._triggerId}" class="trigger" @click=${this._toggle} aria-expanded="${this.open ? "true" : "false"}" aria-haspopup="true" aria-controls="${this._listId}" aria-label="${this.label}">${this.label} ▾</button>
+        <div id="${this._listId}" class="dropdown ${this.open ? "open" : ""}" role="menu" aria-labelledby="${this._triggerId}" @keydown=${(e) => this._onKey(e)}>
+          ${this.items.map((e, t) => l`
+            <div
+              class="item"
+              role="menuitem"
+              tabindex="${this._active === t ? "0" : "-1"}"
+              aria-disabled="${e.disabled ? "true" : "false"}"
+              aria-selected="${this._active === t ? "true" : "false"}"
+              @click=${() => this._select(t)}
+              @keydown=${(a) => this._onKey(a)}
+            >${e.label}</div>
+          `)}
+        </div>
+      </div>
+    `;
+  }
+};
+J.styles = c`
+    :host { display: inline-block; position: relative; font-family: var(--crt-font-family); }
+    button.trigger {
+      background: transparent;
+      border: 1px solid var(--crt-primary);
+      color: var(--crt-primary);
+      padding: 8px 10px;
+      cursor: var(--crt-cursor-pointer);
+      font-family: var(--crt-font-family);
+    }
+
+    .dropdown {
+      position: absolute;
+      right: 0;
+      background: var(--crt-bg-dark);
+      border: 2px solid var(--crt-primary);
+      box-shadow: var(--crt-glow-sm);
+      margin-top: 8px;
+      min-width: 160px;
+      display: none;
+      flex-direction: column;
+      z-index: 2000;
+    }
+
+    .dropdown.open { display: flex; }
+
+    .item {
+      padding: var(--crt-spacing-sm) var(--crt-spacing-md);
+      cursor: var(--crt-cursor-pointer);
+      color: var(--crt-primary);
+      white-space: nowrap;
+    }
+
+    .item[aria-disabled='true'] { opacity: 0.5; cursor: not-allowed; }
+
+    .item[aria-selected='true'] {
+      background: color-mix(in srgb, var(--crt-primary) 18%, transparent);
+      box-shadow: var(--crt-glow-sm);
+      color: var(--crt-bg-dark);
+    }
+  `;
+$t([
+  n({ type: Array })
+], J.prototype, "items", 2);
+$t([
+  n({ type: Boolean, reflect: !0 })
+], J.prototype, "open", 2);
+$t([
+  n({ type: String })
+], J.prototype, "label", 2);
+$t([
+  v()
+], J.prototype, "_active", 2);
+J = $t([
+  d("crt-menu")
+], J);
+var Rr = Object.defineProperty, Fr = Object.getOwnPropertyDescriptor, at = (e, t, a, i) => {
+  for (var r = i > 1 ? void 0 : i ? Fr(t, a) : t, s = e.length - 1, o; s >= 0; s--)
+    (o = e[s]) && (r = (i ? o(t, a, r) : o(r)) || r);
+  return i && r && Rr(t, a, r), r;
+};
+let A = class extends p {
   constructor() {
     super(...arguments), this.autoplay = !1, this.autoplayDelay = 500, this.tracks = [], this.currentIndex = 0, this.showUploadModal = !1, this.handleFilesChanged = (e) => {
-      const a = e.detail.files.filter((s) => s.type.startsWith("audio/") || s.name.endsWith(".mp3") || s.name.endsWith(".wav") || s.name.endsWith(".ogg") || s.name.endsWith(".flac")).map((s) => {
-        const r = s.name.replace(/\.[^/.]+$/, "");
-        let i = "UNKNOWN ARTIST", o = r.toUpperCase();
+      const a = e.detail.files.filter((i) => i.type.startsWith("audio/") || i.name.endsWith(".mp3") || i.name.endsWith(".wav") || i.name.endsWith(".ogg") || i.name.endsWith(".flac")).map((i) => {
+        const r = i.name.replace(/\.[^/.]+$/, "");
+        let s = "UNKNOWN ARTIST", o = r.toUpperCase();
         if (r.includes(" - ")) {
-          const c = r.split(" - ");
-          i = c[0].trim().toUpperCase(), o = c.slice(1).join(" - ").trim().toUpperCase();
+          const h = r.split(" - ");
+          s = h[0].trim().toUpperCase(), o = h.slice(1).join(" - ").trim().toUpperCase();
         }
         return {
           title: o,
-          artist: i,
-          url: URL.createObjectURL(s)
+          artist: s,
+          url: URL.createObjectURL(i)
         };
       });
       this.tracks = [...this.tracks, ...a];
@@ -6685,7 +7101,7 @@ let I = class extends h {
       this.currentIndex = e.detail.index;
     }, this.handleTrackRemove = (e) => {
       const t = e.detail.index, a = this.tracks[t];
-      URL.revokeObjectURL(a.url), this.tracks = this.tracks.filter((s, r) => r !== t), this.tracks.length === 0 ? this.currentIndex = 0 : t <= this.currentIndex && (this.currentIndex = Math.max(0, this.currentIndex - 1));
+      URL.revokeObjectURL(a.url), this.tracks = this.tracks.filter((i, r) => r !== t), this.tracks.length === 0 ? this.currentIndex = 0 : t <= this.currentIndex && (this.currentIndex = Math.max(0, this.currentIndex - 1));
     }, this.handleTrackChange = (e) => {
       this.currentIndex = e.detail.index;
     }, this.openUploadModal = () => {
@@ -6754,7 +7170,7 @@ let I = class extends h {
     `;
   }
 };
-I.styles = d`
+A.styles = c`
     :host {
       display: block;
       font-family: var(--crt-font-family);
@@ -6827,67 +7243,72 @@ I.styles = d`
       padding-top: var(--crt-spacing-md);
     }
   `;
-lt([
+at([
   n({ type: Boolean })
-], I.prototype, "autoplay", 2);
-lt([
+], A.prototype, "autoplay", 2);
+at([
   n({ type: Number })
-], I.prototype, "autoplayDelay", 2);
-lt([
-  m()
-], I.prototype, "tracks", 2);
-lt([
-  m()
-], I.prototype, "currentIndex", 2);
-lt([
-  m()
-], I.prototype, "showUploadModal", 2);
-lt([
-  ee("crt-file-upload")
-], I.prototype, "fileUpload", 2);
-I = lt([
-  u("crt-music-station")
-], I);
+], A.prototype, "autoplayDelay", 2);
+at([
+  v()
+], A.prototype, "tracks", 2);
+at([
+  v()
+], A.prototype, "currentIndex", 2);
+at([
+  v()
+], A.prototype, "showUploadModal", 2);
+at([
+  Ft("crt-file-upload")
+], A.prototype, "fileUpload", 2);
+A = at([
+  d("crt-music-station")
+], A);
 export {
-  Yt as Accordion,
-  Pt as AccordionItem,
-  z as Alert,
+  jt as Accordion,
+  ft as AccordionItem,
+  k as Alert,
   j as Avatar,
-  Rt as AvatarGroup,
-  Bt as Badge,
-  $t as Breadcrumb,
-  C as Button,
-  w as Calendar,
-  Qt as Card,
-  Y as Checkbox,
-  W as CodeExample,
-  M as FileUpload,
-  Ct as Grid,
-  Nt as Heading,
-  wt as Icon,
-  J as Input,
-  H as Link,
-  ht as Modal,
-  x as MusicPlayer,
-  I as MusicStation,
-  rt as Pagination,
-  Ot as Playlist,
-  k as Progress,
-  V as Radio,
-  dt as RadioGroup,
+  Et as AvatarGroup,
+  Pt as Badge,
+  vt as Breadcrumb,
+  $ as Button,
+  b as Calendar,
+  Ut as Card,
+  N as Checkbox,
+  V as CodeExample,
+  E as FileUpload,
+  At as Footer,
+  mt as Grid,
+  Tt as Header,
+  Ot as Heading,
+  dt as Icon,
+  H as Input,
+  U as Link,
+  J as Menu,
+  st as Modal,
+  g as MusicPlayer,
+  A as MusicStation,
+  Q as Navbar,
+  W as Pagination,
+  bt as Playlist,
+  y as Progress,
+  R as Radio,
+  it as RadioGroup,
+  m as Search,
   D as Select,
-  q as Skeleton,
-  Ht as SkeletonCard,
-  Ft as SkeletonText,
-  _ as Slider,
-  _t as Spinner,
-  zt as Table,
-  kt as Tabs,
-  X as Terminal,
-  Ut as Text,
-  tt as Textarea,
-  L as Toast,
-  T as Toggle,
-  et as Tooltip,
-  at as Visualizer
+  F as Skeleton,
+  Mt as SkeletonCard,
+  Dt as SkeletonText,
+  w as Slider,
+  ut as Spinner,
+  gt as Table,
+  ht as Tabs,
+  Y as Terminal,
+  St as Text,
+  K as Textarea,
+  T as Toast,
+  M as Toggle,
+  X as Tooltip,
+  G as Visualizer
 };