@patimweb/crtstyleguide 1.0.9 → 1.0.10

package/dist/lib/index.js

@@ -4,18 +4,18 @@ const d = (r) => (t, a) => {
     customElements.define(r, t);
   }) : customElements.define(r, t);
 };
-const bt = globalThis, Dt = bt.ShadowRoot && (bt.ShadyCSS === void 0 || bt.ShadyCSS.nativeShadow) && "adoptedStyleSheets" in Document.prototype && "replace" in CSSStyleSheet.prototype, Vt = /* @__PURE__ */ Symbol(), Rt = /* @__PURE__ */ new WeakMap();
-let Wt = class {
-  constructor(t, a, s) {
-    if (this._$cssResult$ = !0, s !== Vt) throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");
+const yt = globalThis, Tt = yt.ShadowRoot && (yt.ShadyCSS === void 0 || yt.ShadyCSS.nativeShadow) && "adoptedStyleSheets" in Document.prototype && "replace" in CSSStyleSheet.prototype, Xt = /* @__PURE__ */ Symbol(), Bt = /* @__PURE__ */ new WeakMap();
+let Ht = class {
+  constructor(t, a, i) {
+    if (this._$cssResult$ = !0, i !== Xt) 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 (Dt && t === void 0) {
-      const s = a !== void 0 && a.length === 1;
-      s && (t = Rt.get(a)), t === void 0 && ((this.o = t = new CSSStyleSheet()).replaceSync(this.cssText), s && Rt.set(a, t));
+    if (Tt && t === void 0) {
+      const i = a !== void 0 && a.length === 1;
+      i && (t = Bt.get(a)), t === void 0 && ((this.o = t = new CSSStyleSheet()).replaceSync(this.cssText), i && Bt.set(a, t));
     }
     return t;
   }
@@ -23,21 +23,21 @@ let Wt = class {
     return this.cssText;
   }
 };
-const Ht = (r) => new Wt(typeof r == "string" ? r : r + "", void 0, Vt), Kt = (r, t) => {
-  if (Dt) r.adoptedStyleSheets = t.map((a) => a instanceof CSSStyleSheet ? a : a.styleSheet);
+const Gt = (r) => new Ht(typeof r == "string" ? r : r + "", void 0, Xt), Qt = (r, t) => {
+  if (Tt) r.adoptedStyleSheets = t.map((a) => a instanceof CSSStyleSheet ? a : a.styleSheet);
   else for (const a of t) {
-    const s = document.createElement("style"), e = bt.litNonce;
-    e !== void 0 && s.setAttribute("nonce", e), s.textContent = a.cssText, r.appendChild(s);
+    const i = document.createElement("style"), e = yt.litNonce;
+    e !== void 0 && i.setAttribute("nonce", e), i.textContent = a.cssText, r.appendChild(i);
   }
-}, Ft = Dt ? (r) => r : (r) => r instanceof CSSStyleSheet ? ((t) => {
+}, Yt = Tt ? (r) => r : (r) => r instanceof CSSStyleSheet ? ((t) => {
   let a = "";
-  for (const s of t.cssRules) a += s.cssText;
-  return Ht(a);
+  for (const i of t.cssRules) a += i.cssText;
+  return Gt(a);
 })(r) : r;
-const { is: Gt, defineProperty: Jt, getOwnPropertyDescriptor: Zt, getOwnPropertyNames: Qt, getOwnPropertySymbols: tr, getPrototypeOf: rr } = Object, Ot = globalThis, Bt = Ot.trustedTypes, er = Bt ? Bt.emptyScript : "", ar = Ot.reactiveElementPolyfillSupport, at = (r, t) => r, ft = { toAttribute(r, t) {
+const { is: Jt, defineProperty: Zt, getOwnPropertyDescriptor: tr, getOwnPropertyNames: rr, getOwnPropertySymbols: er, getPrototypeOf: ar } = Object, Ct = globalThis, qt = Ct.trustedTypes, ir = qt ? qt.emptyScript : "", sr = Ct.reactiveElementPolyfillSupport, st = (r, t) => r, xt = { toAttribute(r, t) {
   switch (t) {
     case Boolean:
-      r = r ? er : null;
+      r = r ? ir : null;
       break;
     case Object:
     case Array:
@@ -62,54 +62,54 @@ const { is: Gt, defineProperty: Jt, getOwnPropertyDescriptor: Zt, getOwnProperty
       }
   }
   return a;
-} }, Et = (r, t) => !Gt(r, t), Yt = { attribute: !0, type: String, converter: ft, reflect: !1, useDefault: !1, hasChanged: Et };
-Symbol.metadata ??= /* @__PURE__ */ Symbol("metadata"), Ot.litPropertyMetadata ??= /* @__PURE__ */ new WeakMap();
-class et extends HTMLElement {
+} }, jt = (r, t) => !Jt(r, t), Vt = { attribute: !0, type: String, converter: xt, reflect: !1, useDefault: !1, hasChanged: jt };
+Symbol.metadata ??= /* @__PURE__ */ Symbol("metadata"), Ct.litPropertyMetadata ??= /* @__PURE__ */ new WeakMap();
+class it 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 = Yt) {
+  static createProperty(t, a = Vt) {
     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(), e = this.getPropertyDescriptor(t, s, a);
-      e !== void 0 && Jt(this.prototype, t, e);
+      const i = /* @__PURE__ */ Symbol(), e = this.getPropertyDescriptor(t, i, a);
+      e !== void 0 && Zt(this.prototype, t, e);
     }
   }
-  static getPropertyDescriptor(t, a, s) {
-    const { get: e, set: i } = Zt(this.prototype, t) ?? { get() {
+  static getPropertyDescriptor(t, a, i) {
+    const { get: e, set: s } = tr(this.prototype, t) ?? { get() {
       return this[a];
     }, set(o) {
       this[a] = o;
     } };
     return { get: e, set(o) {
       const h = e?.call(this);
-      i?.call(this, o), this.requestUpdate(t, h, s);
+      s?.call(this, o), this.requestUpdate(t, h, i);
     }, configurable: !0, enumerable: !0 };
   }
   static getPropertyOptions(t) {
-    return this.elementProperties.get(t) ?? Yt;
+    return this.elementProperties.get(t) ?? Vt;
   }
   static _$Ei() {
-    if (this.hasOwnProperty(at("elementProperties"))) return;
-    const t = rr(this);
+    if (this.hasOwnProperty(st("elementProperties"))) return;
+    const t = ar(this);
     t.finalize(), t.l !== void 0 && (this.l = [...t.l]), this.elementProperties = new Map(t.elementProperties);
   }
   static finalize() {
-    if (this.hasOwnProperty(at("finalized"))) return;
-    if (this.finalized = !0, this._$Ei(), this.hasOwnProperty(at("properties"))) {
-      const a = this.properties, s = [...Qt(a), ...tr(a)];
-      for (const e of s) this.createProperty(e, a[e]);
+    if (this.hasOwnProperty(st("finalized"))) return;
+    if (this.finalized = !0, this._$Ei(), this.hasOwnProperty(st("properties"))) {
+      const a = this.properties, i = [...rr(a), ...er(a)];
+      for (const e of i) this.createProperty(e, a[e]);
     }
     const t = this[Symbol.metadata];
     if (t !== null) {
       const a = litPropertyMetadata.get(t);
-      if (a !== void 0) for (const [s, e] of a) this.elementProperties.set(s, e);
+      if (a !== void 0) for (const [i, e] of a) this.elementProperties.set(i, e);
     }
     this._$Eh = /* @__PURE__ */ new Map();
-    for (const [a, s] of this.elementProperties) {
-      const e = this._$Eu(a, s);
+    for (const [a, i] of this.elementProperties) {
+      const e = this._$Eu(a, i);
       e !== void 0 && this._$Eh.set(e, a);
     }
     this.elementStyles = this.finalizeStyles(this.styles);
@@ -117,14 +117,14 @@ class et extends HTMLElement {
   static finalizeStyles(t) {
     const a = [];
     if (Array.isArray(t)) {
-      const s = new Set(t.flat(1 / 0).reverse());
-      for (const e of s) a.unshift(Ft(e));
-    } else t !== void 0 && a.push(Ft(t));
+      const i = new Set(t.flat(1 / 0).reverse());
+      for (const e of i) a.unshift(Yt(e));
+    } else t !== void 0 && a.push(Yt(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 @@ class et 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 Kt(t, this.constructor.elementStyles), t;
+    return Qt(t, this.constructor.elementStyles), t;
   }
   connectedCallback() {
     this.renderRoot ??= this.createRenderRoot(), this.enableUpdating(!0), this._$EO?.forEach((t) => t.hostConnected?.());
@@ -155,35 +155,35 @@ class et 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), e = this.constructor._$Eu(t, s);
-    if (e !== void 0 && s.reflect === !0) {
-      const i = (s.converter?.toAttribute !== void 0 ? s.converter : ft).toAttribute(a, s.type);
-      this._$Em = t, i == null ? this.removeAttribute(e) : this.setAttribute(e, i), this._$Em = null;
+    const i = this.constructor.elementProperties.get(t), e = this.constructor._$Eu(t, i);
+    if (e !== void 0 && i.reflect === !0) {
+      const s = (i.converter?.toAttribute !== void 0 ? i.converter : xt).toAttribute(a, i.type);
+      this._$Em = t, s == null ? this.removeAttribute(e) : this.setAttribute(e, s), this._$Em = null;
     }
   }
   _$AK(t, a) {
-    const s = this.constructor, e = s._$Eh.get(t);
+    const i = this.constructor, e = i._$Eh.get(t);
     if (e !== void 0 && this._$Em !== e) {
-      const i = s.getPropertyOptions(e), o = typeof i.converter == "function" ? { fromAttribute: i.converter } : i.converter?.fromAttribute !== void 0 ? i.converter : ft;
+      const s = i.getPropertyOptions(e), o = typeof s.converter == "function" ? { fromAttribute: s.converter } : s.converter?.fromAttribute !== void 0 ? s.converter : xt;
       this._$Em = e;
-      const h = o.fromAttribute(a, i.type);
+      const h = o.fromAttribute(a, s.type);
       this[e] = h ?? this._$Ej?.get(e) ?? h, this._$Em = null;
     }
   }
-  requestUpdate(t, a, s, e = !1, i) {
+  requestUpdate(t, a, i, e = !1, s) {
     if (t !== void 0) {
       const o = this.constructor;
-      if (e === !1 && (i = this[t]), s ??= o.getPropertyOptions(t), !((s.hasChanged ?? Et)(i, a) || s.useDefault && s.reflect && i === this._$Ej?.get(t) && !this.hasAttribute(o._$Eu(t, s)))) return;
-      this.C(t, a, s);
+      if (e === !1 && (s = this[t]), i ??= o.getPropertyOptions(t), !((i.hasChanged ?? jt)(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: e, 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)), e === !0 && this._$Em !== t && (this._$Eq ??= /* @__PURE__ */ new Set()).add(t));
+  C(t, a, { useDefault: i, reflect: e, 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)), e === !0 && this._$Em !== t && (this._$Eq ??= /* @__PURE__ */ new Set()).add(t));
   }
   async _$EP() {
     this.isUpdatePending = !0;
@@ -202,21 +202,21 @@ class et extends HTMLElement {
     if (!this.isUpdatePending) return;
     if (!this.hasUpdated) {
       if (this.renderRoot ??= this.createRenderRoot(), this._$Ep) {
-        for (const [e, i] of this._$Ep) this[e] = i;
+        for (const [e, s] of this._$Ep) this[e] = s;
         this._$Ep = void 0;
       }
-      const s = this.constructor.elementProperties;
-      if (s.size > 0) for (const [e, i] of s) {
-        const { wrapped: o } = i, h = this[e];
-        o !== !0 || this._$AL.has(e) || h === void 0 || this.C(e, void 0, i, h);
+      const i = this.constructor.elementProperties;
+      if (i.size > 0) for (const [e, s] of i) {
+        const { wrapped: o } = s, h = this[e];
+        o !== !0 || this._$AL.has(e) || h === void 0 || this.C(e, 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);
   }
@@ -245,11 +245,11 @@ class et extends HTMLElement {
   firstUpdated(t) {
   }
 }
-et.elementStyles = [], et.shadowRootOptions = { mode: "open" }, et[at("elementProperties")] = /* @__PURE__ */ new Map(), et[at("finalized")] = /* @__PURE__ */ new Map(), ar?.({ ReactiveElement: et }), (Ot.reactiveElementVersions ??= []).push("2.1.2");
-const sr = { attribute: !0, type: String, converter: ft, reflect: !1, hasChanged: Et }, ir = (r = sr, t, a) => {
-  const { kind: s, metadata: e } = a;
-  let i = globalThis.litPropertyMetadata.get(e);
-  if (i === void 0 && globalThis.litPropertyMetadata.set(e, i = /* @__PURE__ */ new Map()), s === "setter" && ((r = Object.create(r)).wrapped = !0), i.set(a.name, r), s === "accessor") {
+it.elementStyles = [], it.shadowRootOptions = { mode: "open" }, it[st("elementProperties")] = /* @__PURE__ */ new Map(), it[st("finalized")] = /* @__PURE__ */ new Map(), sr?.({ ReactiveElement: it }), (Ct.reactiveElementVersions ??= []).push("2.1.2");
+const or = { attribute: !0, type: String, converter: xt, reflect: !1, hasChanged: jt }, nr = (r = or, t, a) => {
+  const { kind: i, metadata: e } = a;
+  let s = globalThis.litPropertyMetadata.get(e);
+  if (s === void 0 && globalThis.litPropertyMetadata.set(e, s = /* @__PURE__ */ new Map()), i === "setter" && ((r = Object.create(r)).wrapped = !0), s.set(a.name, r), i === "accessor") {
     const { name: o } = a;
     return { set(h) {
       const u = t.get.call(this);
@@ -258,39 +258,39 @@ const sr = { attribute: !0, type: String, converter: ft, reflect: !1, hasChanged
       return h !== void 0 && this.C(o, void 0, r, h), h;
     } };
   }
-  if (s === "setter") {
+  if (i === "setter") {
     const { name: o } = a;
     return function(h) {
       const u = this[o];
       t.call(this, h), this.requestUpdate(o, u, r, !0, h);
     };
   }
-  throw Error("Unsupported decorator location: " + s);
+  throw Error("Unsupported decorator location: " + i);
 };
 function n(r) {
-  return (t, a) => typeof a == "object" ? ir(r, t, a) : ((s, e, i) => {
-    const o = e.hasOwnProperty(i);
-    return e.constructor.createProperty(i, s), o ? Object.getOwnPropertyDescriptor(e, i) : void 0;
+  return (t, a) => typeof a == "object" ? nr(r, t, a) : ((i, e, s) => {
+    const o = e.hasOwnProperty(s);
+    return e.constructor.createProperty(s, i), o ? Object.getOwnPropertyDescriptor(e, s) : void 0;
   })(r, t, a);
 }
 function v(r) {
   return n({ ...r, state: !0, attribute: !1 });
 }
-const or = (r, t, a) => (a.configurable = !0, a.enumerable = !0, Reflect.decorate && typeof t != "object" && Object.defineProperty(r, t, a), a);
-function Tt(r, t) {
-  return (a, s, e) => {
-    const i = (o) => o.renderRoot?.querySelector(r) ?? null;
-    return or(a, s, { get() {
-      return i(this);
+const cr = (r, t, a) => (a.configurable = !0, a.enumerable = !0, Reflect.decorate && typeof t != "object" && Object.defineProperty(r, t, a), a);
+function At(r, t) {
+  return (a, i, e) => {
+    const s = (o) => o.renderRoot?.querySelector(r) ?? null;
+    return cr(a, i, { get() {
+      return s(this);
     } });
   };
 }
-var nr = Object.defineProperty, cr = Object.getOwnPropertyDescriptor, jt = (r, t, a, s) => {
-  for (var e = s > 1 ? void 0 : s ? cr(t, a) : t, i = r.length - 1, o; i >= 0; i--)
-    (o = r[i]) && (e = (s ? o(t, a, e) : o(e)) || e);
-  return s && e && nr(t, a, e), e;
+var lr = Object.defineProperty, pr = Object.getOwnPropertyDescriptor, Mt = (r, t, a, i) => {
+  for (var e = i > 1 ? void 0 : i ? pr(t, a) : t, s = r.length - 1, o; s >= 0; s--)
+    (o = r[s]) && (e = (i ? o(t, a, e) : o(e)) || e);
+  return i && e && lr(t, a, e), e;
 };
-let st = class extends p {
+let ot = class extends p {
   constructor() {
     super(...arguments), this.name = "", this.size = "md", this.icons = {
       checkmark: "✓",
@@ -335,7 +335,7 @@ let st = class extends p {
     return c`<span class="icon">${this.icons[this.name] || "?"}</span>`;
   }
 };
-st.styles = l`
+ot.styles = l`
     :host {
       display: inline-flex;
       align-items: center;
@@ -352,19 +352,19 @@ st.styles = l`
       height: 100%;
     }
   `;
-jt([
+Mt([
   n()
-], st.prototype, "name", 2);
-jt([
+], ot.prototype, "name", 2);
+Mt([
   n()
-], st.prototype, "size", 2);
-st = jt([
+], ot.prototype, "size", 2);
+ot = Mt([
   d("crt-icon")
-], st);
-var lr = Object.defineProperty, pr = Object.getOwnPropertyDescriptor, F = (r, t, a, s) => {
-  for (var e = s > 1 ? void 0 : s ? pr(t, a) : t, i = r.length - 1, o; i >= 0; i--)
-    (o = r[i]) && (e = (s ? o(t, a, e) : o(e)) || e);
-  return s && e && lr(t, a, e), e;
+], ot);
+var dr = Object.defineProperty, hr = Object.getOwnPropertyDescriptor, B = (r, t, a, i) => {
+  for (var e = i > 1 ? void 0 : i ? hr(t, a) : t, s = r.length - 1, o; s >= 0; s--)
+    (o = r[s]) && (e = (i ? o(t, a, e) : o(e)) || e);
+  return i && e && dr(t, a, e), e;
 };
 let w = class extends p {
   constructor() {
@@ -400,6 +400,8 @@ w.styles = l`
       background-color: transparent;
       color: #33ff33;
       border: 2px solid #33ff33;
+      box-sizing: border-box;
+      height: 100%;
       padding: 16px 32px;
       font-family: 'VT323', 'Courier New', monospace;
       font-size: 1rem;
@@ -545,36 +547,36 @@ w.styles = l`
       flex-shrink: 0;
     }
   `;
-F([
+B([
   n({ reflect: !0 })
 ], w.prototype, "size", 2);
-F([
+B([
   n({ reflect: !0 })
 ], w.prototype, "variant", 2);
-F([
+B([
   n({ type: Boolean })
 ], w.prototype, "disabled", 2);
-F([
+B([
   n()
 ], w.prototype, "type", 2);
-F([
+B([
   n({ attribute: "icon-only", type: Boolean })
 ], w.prototype, "iconOnly", 2);
-F([
+B([
   n({ attribute: "icon-left" })
 ], w.prototype, "iconLeft", 2);
-F([
+B([
   n({ attribute: "icon-right" })
 ], w.prototype, "iconRight", 2);
-w = F([
+w = B([
   d("crt-button")
 ], w);
-var dr = Object.defineProperty, hr = Object.getOwnPropertyDescriptor, Xt = (r, t, a, s) => {
-  for (var e = s > 1 ? void 0 : s ? hr(t, a) : t, i = r.length - 1, o; i >= 0; i--)
-    (o = r[i]) && (e = (s ? o(t, a, e) : o(e)) || e);
-  return s && e && dr(t, a, e), e;
+var vr = Object.defineProperty, gr = Object.getOwnPropertyDescriptor, Kt = (r, t, a, i) => {
+  for (var e = i > 1 ? void 0 : i ? gr(t, a) : t, s = r.length - 1, o; s >= 0; s--)
+    (o = r[s]) && (e = (i ? o(t, a, e) : o(e)) || e);
+  return i && e && vr(t, a, e), e;
 };
-let yt = class extends p {
+let wt = class extends p {
   constructor() {
     super(...arguments), this.variant = "primary";
   }
@@ -582,7 +584,7 @@ let yt = class extends p {
     return c`<span class="badge"><slot></slot></span>`;
   }
 };
-yt.styles = l`
+wt.styles = l`
     :host {
       --badge-bg: transparent;
       --badge-color: var(--crt-primary);
@@ -623,18 +625,18 @@ yt.styles = l`
       --badge-border: 1px solid var(--crt-info);
     }
   `;
-Xt([
+Kt([
   n()
-], yt.prototype, "variant", 2);
-yt = Xt([
+], wt.prototype, "variant", 2);
+wt = Kt([
   d("crt-badge")
-], yt);
-var vr = Object.defineProperty, gr = Object.getOwnPropertyDescriptor, Pt = (r, t, a, s) => {
-  for (var e = s > 1 ? void 0 : s ? gr(t, a) : t, i = r.length - 1, o; i >= 0; i--)
-    (o = r[i]) && (e = (s ? o(t, a, e) : o(e)) || e);
-  return s && e && vr(t, a, e), e;
+], wt);
+var ur = Object.defineProperty, mr = Object.getOwnPropertyDescriptor, St = (r, t, a, i) => {
+  for (var e = i > 1 ? void 0 : i ? mr(t, a) : t, s = r.length - 1, o; s >= 0; s--)
+    (o = r[s]) && (e = (i ? o(t, a, e) : o(e)) || e);
+  return i && e && ur(t, a, e), e;
 };
-let xt = class extends p {
+let kt = class extends p {
   constructor() {
     super(...arguments), this.level = 1;
   }
@@ -657,7 +659,7 @@ let xt = class extends p {
     }
   }
 };
-xt.styles = l`
+kt.styles = l`
     h1, h2, h3, h4, h5, h6 {
       font-family: var(--crt-font-family);
       color: var(--crt-text-primary);
@@ -686,13 +688,13 @@ xt.styles = l`
       font-size: var(--crt-font-size-base);
     }
   `;
-Pt([
+St([
   n({ type: Number })
-], xt.prototype, "level", 2);
-xt = Pt([
+], kt.prototype, "level", 2);
+kt = St([
   d("crt-heading")
-], xt);
-let wt = class extends p {
+], kt);
+let $t = class extends p {
   constructor() {
     super(...arguments), this.muted = !1;
   }
@@ -700,7 +702,7 @@ let wt = class extends p {
     return c`<p><slot></slot></p>`;
   }
 };
-wt.styles = l`
+$t.styles = l`
     p {
       font-family: var(--crt-font-family);
       color: var(--crt-text-secondary);
@@ -712,18 +714,18 @@ wt.styles = l`
       color: var(--crt-text-muted);
     }
   `;
-Pt([
+St([
   n()
-], wt.prototype, "muted", 2);
-wt = Pt([
+], $t.prototype, "muted", 2);
+$t = St([
   d("crt-text")
-], wt);
-var ur = Object.defineProperty, mr = Object.getOwnPropertyDescriptor, At = (r, t, a, s) => {
-  for (var e = s > 1 ? void 0 : s ? mr(t, a) : t, i = r.length - 1, o; i >= 0; i--)
-    (o = r[i]) && (e = (s ? o(t, a, e) : o(e)) || e);
-  return s && e && ur(t, a, e), e;
+], $t);
+var br = Object.defineProperty, fr = Object.getOwnPropertyDescriptor, It = (r, t, a, i) => {
+  for (var e = i > 1 ? void 0 : i ? fr(t, a) : t, s = r.length - 1, o; s >= 0; s--)
+    (o = r[s]) && (e = (i ? o(t, a, e) : o(e)) || e);
+  return i && e && br(t, a, e), e;
 };
-let it = class extends p {
+let nt = class extends p {
   constructor() {
     super(...arguments), this.activeTab = 0, this.tabs = [];
   }
@@ -748,7 +750,7 @@ let it = class extends p {
         ${this.tabs.map(
       (r, t) => c`
             <div class="tab-pane ${t === this.activeTab ? "active" : ""}">
-              ${r.label.toLowerCase() === "code" ? c`<pre><code>${r.content}</code></pre>` : c`<div>${br(r.content)}</div>`}
+              ${r.label.toLowerCase() === "code" ? c`<pre><code>${r.content}</code></pre>` : c`<div>${yr(r.content)}</div>`}
             </div>
           `
     )}
@@ -756,7 +758,7 @@ let it = class extends p {
     `;
   }
 };
-it.styles = l`
+nt.styles = l`
     :host {
       display: block;
     }
@@ -823,25 +825,25 @@ it.styles = l`
       font-family: var(--crt-font-family);
     }
   `;
-At([
+It([
   v()
-], it.prototype, "activeTab", 2);
-At([
+], nt.prototype, "activeTab", 2);
+It([
   n({ type: Array })
-], it.prototype, "tabs", 2);
-it = At([
+], nt.prototype, "tabs", 2);
+nt = It([
   d("crt-tabs")
-], it);
-function br(r) {
+], nt);
+function yr(r) {
   const t = document.createElement("div");
   return t.innerHTML = r, t;
 }
-var fr = Object.defineProperty, yr = Object.getOwnPropertyDescriptor, k = (r, t, a, s) => {
-  for (var e = s > 1 ? void 0 : s ? yr(t, a) : t, i = r.length - 1, o; i >= 0; i--)
-    (o = r[i]) && (e = (s ? o(t, a, e) : o(e)) || e);
-  return s && e && fr(t, a, e), e;
+var xr = Object.defineProperty, wr = Object.getOwnPropertyDescriptor, k = (r, t, a, i) => {
+  for (var e = i > 1 ? void 0 : i ? wr(t, a) : t, s = r.length - 1, o; s >= 0; s--)
+    (o = r[s]) && (e = (i ? o(t, a, e) : o(e)) || e);
+  return i && e && xr(t, a, e), e;
 };
-let B = class extends p {
+let Y = class extends p {
   constructor() {
     super(...arguments), this.type = "text", this.placeholder = "", this.value = "", this.disabled = !1;
   }
@@ -859,7 +861,7 @@ let B = class extends p {
     `;
   }
 };
-B.styles = l`
+Y.styles = l`
     :host {
       display: block;
     }
@@ -907,20 +909,20 @@ B.styles = l`
   `;
 k([
   n()
-], B.prototype, "type", 2);
+], Y.prototype, "type", 2);
 k([
   n()
-], B.prototype, "placeholder", 2);
+], Y.prototype, "placeholder", 2);
 k([
   n()
-], B.prototype, "value", 2);
+], Y.prototype, "value", 2);
 k([
   n()
-], B.prototype, "disabled", 2);
-B = k([
+], Y.prototype, "disabled", 2);
+Y = k([
   d("crt-input")
-], B);
-let Y = class extends p {
+], Y);
+let q = class extends p {
   constructor() {
     super(...arguments), this.placeholder = "", this.value = "", this.disabled = !1, this.rows = 4;
   }
@@ -939,7 +941,7 @@ ${this.value}</textarea
     `;
   }
 };
-Y.styles = l`
+q.styles = l`
     :host {
       display: block;
     }
@@ -983,23 +985,23 @@ Y.styles = l`
   `;
 k([
   n()
-], Y.prototype, "placeholder", 2);
+], q.prototype, "placeholder", 2);
 k([
   n()
-], Y.prototype, "value", 2);
+], q.prototype, "value", 2);
 k([
   n()
-], Y.prototype, "disabled", 2);
+], q.prototype, "disabled", 2);
 k([
   n()
-], Y.prototype, "rows", 2);
-Y = k([
+], q.prototype, "rows", 2);
+q = k([
   d("crt-textarea")
-], Y);
-var xr = Object.defineProperty, wr = Object.getOwnPropertyDescriptor, tt = (r, t, a, s) => {
-  for (var e = s > 1 ? void 0 : s ? wr(t, a) : t, i = r.length - 1, o; i >= 0; i--)
-    (o = r[i]) && (e = (s ? o(t, a, e) : o(e)) || e);
-  return s && e && xr(t, a, e), e;
+], q);
+var kr = Object.defineProperty, $r = Object.getOwnPropertyDescriptor, rt = (r, t, a, i) => {
+  for (var e = i > 1 ? void 0 : i ? $r(t, a) : t, s = r.length - 1, o; s >= 0; s--)
+    (o = r[s]) && (e = (i ? o(t, a, e) : o(e)) || e);
+  return i && e && kr(t, a, e), e;
 };
 let I = class extends p {
   constructor() {
@@ -1041,28 +1043,28 @@ I.styles = l`
       color: var(--crt-primary-dark);
     }
   `;
-tt([
+rt([
   n({ type: String })
 ], I.prototype, "href", 2);
-tt([
+rt([
   n({ type: String })
 ], I.prototype, "target", 2);
-tt([
+rt([
   n({ type: Boolean })
 ], I.prototype, "iconLeft", 2);
-tt([
+rt([
   n({ type: Boolean })
 ], I.prototype, "iconRight", 2);
-tt([
+rt([
   n({ type: String })
 ], I.prototype, "icon", 2);
-I = tt([
+I = rt([
   d("crt-link")
 ], I);
-var kr = Object.defineProperty, $r = Object.getOwnPropertyDescriptor, H = (r, t, a, s) => {
-  for (var e = s > 1 ? void 0 : s ? $r(t, a) : t, i = r.length - 1, o; i >= 0; i--)
-    (o = r[i]) && (e = (s ? o(t, a, e) : o(e)) || e);
-  return s && e && kr(t, a, e), e;
+var _r = Object.defineProperty, zr = Object.getOwnPropertyDescriptor, H = (r, t, a, i) => {
+  for (var e = i > 1 ? void 0 : i ? zr(t, a) : t, s = r.length - 1, o; s >= 0; s--)
+    (o = r[s]) && (e = (i ? o(t, a, e) : o(e)) || e);
+  return i && e && _r(t, a, e), e;
 };
 let P = class extends p {
   constructor() {
@@ -1091,12 +1093,12 @@ let P = class extends p {
     return Math.random().toString(36).substring(2, 9);
   }
   _addFiles(r) {
-    const s = r.filter((e) => {
+    const i = r.filter((e) => {
       if (e.size > this.maxSize)
         return console.warn(`File ${e.name} exceeds max size`), !1;
       if (this.accept) {
-        const i = this.accept.split(",").map((O) => O.trim()), o = e.type, h = "." + e.name.split(".").pop()?.toLowerCase();
-        if (!i.some((O) => O.startsWith(".") ? h === O.toLowerCase() : O.endsWith("/*") ? o.startsWith(O.replace("/*", "/")) : o === O))
+        const s = this.accept.split(",").map((O) => O.trim()), o = e.type, h = "." + e.name.split(".").pop()?.toLowerCase();
+        if (!s.some((O) => O.startsWith(".") ? h === O.toLowerCase() : O.endsWith("/*") ? o.startsWith(O.replace("/*", "/")) : o === O))
           return console.warn(`File ${e.name} type not accepted`), !1;
       }
       return !0;
@@ -1106,7 +1108,7 @@ let P = class extends p {
       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((e) => e.file) }
     }));
   }
@@ -1116,8 +1118,8 @@ let P = class extends p {
   }
   _formatFileSize(r) {
     if (r === 0) return "0 B";
-    const t = 1024, a = ["B", "KB", "MB", "GB"], s = Math.floor(Math.log(r) / Math.log(t));
-    return parseFloat((r / Math.pow(t, s)).toFixed(1)) + " " + a[s];
+    const t = 1024, a = ["B", "KB", "MB", "GB"], i = Math.floor(Math.log(r) / Math.log(t));
+    return parseFloat((r / Math.pow(t, i)).toFixed(1)) + " " + a[i];
   }
   _getFileIcon(r) {
     const t = r.name.split(".").pop()?.toLowerCase() || "", a = r.type;
@@ -1210,7 +1212,7 @@ P.styles = l`
       display: block;
       font-family: var(--crt-font-family);
       width: 100%;
-      min-width: 500px;
+      min-width: 0;
     }
 
     .file-manager {
@@ -1312,6 +1314,7 @@ P.styles = l`
     .file-list {
       max-height: 300px;
       overflow-y: auto;
+      width: 100%;
     }
 
     .file-list-header {
@@ -1365,6 +1368,26 @@ P.styles = l`
       min-width: 0;
     }
 
+    /* Responsive adjustments */
+    @media (max-width: 700px) {
+      .file-list-header,
+      .file-item {
+        grid-template-columns: 1fr 70px 70px 40px;
+      }
+      .drop-zone {
+        padding: var(--crt-spacing-md);
+      }
+    }
+
+    @media (max-width: 420px) {
+      .file-list-header,
+      .file-item {
+        grid-template-columns: 1fr 60px 60px 40px;
+      }
+      .file-list-header { font-size: 0.75rem; }
+      .drop-zone { padding: var(--crt-spacing-sm); min-height: 100px; }
+    }
+
     .file-size {
       color: var(--crt-text-muted);
       font-size: var(--crt-font-size-sm);
@@ -1500,10 +1523,10 @@ H([
 P = H([
   d("crt-file-upload")
 ], P);
-var _r = Object.defineProperty, zr = Object.getOwnPropertyDescriptor, $ = (r, t, a, s) => {
-  for (var e = s > 1 ? void 0 : s ? zr(t, a) : t, i = r.length - 1, o; i >= 0; i--)
-    (o = r[i]) && (e = (s ? o(t, a, e) : o(e)) || e);
-  return s && e && _r(t, a, e), e;
+var Or = Object.defineProperty, Pr = Object.getOwnPropertyDescriptor, $ = (r, t, a, i) => {
+  for (var e = i > 1 ? void 0 : i ? Pr(t, a) : t, s = r.length - 1, o; s >= 0; s--)
+    (o = r[s]) && (e = (i ? o(t, a, e) : o(e)) || e);
+  return i && e && Or(t, a, e), e;
 };
 let m = class extends p {
   constructor() {
@@ -1533,13 +1556,13 @@ let m = class extends p {
   _parseValue() {
     const r = this.value.split(".");
     if (r.length === 3) {
-      const [t, a, s] = r.map(Number);
-      this._selectedDate = new Date(s, a - 1, t), this._viewDate = new Date(this._selectedDate);
+      const [t, a, i] = r.map(Number);
+      this._selectedDate = new Date(i, a - 1, t), this._viewDate = new Date(this._selectedDate);
     }
   }
   _formatDate(r) {
-    const t = String(r.getDate()).padStart(2, "0"), a = String(r.getMonth() + 1).padStart(2, "0"), s = r.getFullYear();
-    return `${t}.${a}.${s}`;
+    const t = String(r.getDate()).padStart(2, "0"), a = String(r.getMonth() + 1).padStart(2, "0"), i = r.getFullYear();
+    return `${t}.${a}.${i}`;
   }
   _toggleCalendar() {
     this.disabled || (this._isOpen = !this._isOpen);
@@ -1586,36 +1609,36 @@ let m = class extends p {
     return this._selectedDate ? r.getDate() === this._selectedDate.getDate() && r.getMonth() === this._selectedDate.getMonth() && r.getFullYear() === this._selectedDate.getFullYear() : !1;
   }
   _renderDays() {
-    const r = this._viewDate.getFullYear(), t = this._viewDate.getMonth(), a = this._getDaysInMonth(r, t), s = this._getFirstDayOfMonth(r, t), e = this._getDaysInMonth(r, t - 1), i = [];
-    for (let h = s - 1; h >= 0; h--) {
+    const r = this._viewDate.getFullYear(), t = this._viewDate.getMonth(), a = this._getDaysInMonth(r, t), i = this._getFirstDayOfMonth(r, t), e = this._getDaysInMonth(r, t - 1), s = [];
+    for (let h = i - 1; h >= 0; h--) {
       const u = new Date(r, t - 1, e - h);
-      i.push(c`
+      s.push(c`
         <div class="day other-month" @click="${() => this._selectDate(u)}">
           ${e - h}
         </div>
       `);
     }
     for (let h = 1; h <= a; h++) {
-      const u = new Date(r, t, h), O = this._isToday(u), qt = this._isSelected(u);
-      i.push(c`
+      const u = new Date(r, t, h), O = this._isToday(u), Wt = this._isSelected(u);
+      s.push(c`
         <div 
-          class="day ${O ? "today" : ""} ${qt ? "selected" : ""}"
+          class="day ${O ? "today" : ""} ${Wt ? "selected" : ""}"
           @click="${() => this._selectDate(u)}"
         >
           ${h}
         </div>
       `);
     }
-    const o = 42 - i.length;
+    const o = 42 - s.length;
     for (let h = 1; h <= o; h++) {
       const u = new Date(r, t + 1, h);
-      i.push(c`
+      s.push(c`
         <div class="day other-month" @click="${() => this._selectDate(u)}">
           ${h}
         </div>
       `);
     }
-    return i;
+    return s;
   }
   render() {
     const r = `${this._months[this._viewDate.getMonth()]} ${this._viewDate.getFullYear()}`;
@@ -1899,10 +1922,10 @@ $([
 m = $([
   d("crt-calendar")
 ], m);
-var Or = Object.defineProperty, Pr = Object.getOwnPropertyDescriptor, K = (r, t, a, s) => {
-  for (var e = s > 1 ? void 0 : s ? Pr(t, a) : t, i = r.length - 1, o; i >= 0; i--)
-    (o = r[i]) && (e = (s ? o(t, a, e) : o(e)) || e);
-  return s && e && Or(t, a, e), e;
+var Cr = Object.defineProperty, Sr = Object.getOwnPropertyDescriptor, G = (r, t, a, i) => {
+  for (var e = i > 1 ? void 0 : i ? Sr(t, a) : t, s = r.length - 1, o; s >= 0; s--)
+    (o = r[s]) && (e = (i ? o(t, a, e) : o(e)) || e);
+  return i && e && Cr(t, a, e), e;
 };
 let C = class extends p {
   constructor() {
@@ -1942,15 +1965,15 @@ let C = class extends p {
     r.forEach((e) => {
       e.group ? (t.has(e.group) || t.set(e.group, []), t.get(e.group).push(e)) : a.push(e);
     });
-    const s = [];
+    const i = [];
     for (const e of a)
-      s.push(this._renderOption(e));
-    for (const [e, i] of t) {
-      s.push(c`<div class="select-group-label">${e}</div>`);
-      for (const o of i)
-        s.push(this._renderOption(o));
+      i.push(this._renderOption(e));
+    for (const [e, s] of t) {
+      i.push(c`<div class="select-group-label">${e}</div>`);
+      for (const o of s)
+        i.push(this._renderOption(o));
     }
-    return s;
+    return i;
   }
   _renderOption(r) {
     const t = r.value === this.value;
@@ -2142,31 +2165,31 @@ C.styles = l`
       box-shadow: var(--crt-glow-sm);
     }
   `;
-K([
+G([
   n({ type: String })
 ], C.prototype, "value", 2);
-K([
+G([
   n({ type: String })
 ], C.prototype, "placeholder", 2);
-K([
+G([
   n({ type: String })
 ], C.prototype, "label", 2);
-K([
+G([
   n({ type: Boolean })
 ], C.prototype, "disabled", 2);
-K([
+G([
   n({ type: Array })
 ], C.prototype, "options", 2);
-K([
+G([
   v()
 ], C.prototype, "_isOpen", 2);
-C = K([
+C = G([
   d("crt-select")
 ], C);
-var Cr = Object.defineProperty, Sr = Object.getOwnPropertyDescriptor, g = (r, t, a, s) => {
-  for (var e = s > 1 ? void 0 : s ? Sr(t, a) : t, i = r.length - 1, o; i >= 0; i--)
-    (o = r[i]) && (e = (s ? o(t, a, e) : o(e)) || e);
-  return s && e && Cr(t, a, e), e;
+var Er = Object.defineProperty, Dr = Object.getOwnPropertyDescriptor, g = (r, t, a, i) => {
+  for (var e = i > 1 ? void 0 : i ? Dr(t, a) : t, s = r.length - 1, o; s >= 0; s--)
+    (o = r[s]) && (e = (i ? o(t, a, e) : o(e)) || e);
+  return i && e && Er(t, a, e), e;
 };
 let L = class extends p {
   constructor() {
@@ -2463,10 +2486,10 @@ g([
 Z = g([
   d("crt-radio-group")
 ], Z);
-var Dr = Object.defineProperty, Er = Object.getOwnPropertyDescriptor, _ = (r, t, a, s) => {
-  for (var e = s > 1 ? void 0 : s ? Er(t, a) : t, i = r.length - 1, o; i >= 0; i--)
-    (o = r[i]) && (e = (s ? o(t, a, e) : o(e)) || e);
-  return s && e && Dr(t, a, e), e;
+var Tr = Object.defineProperty, jr = Object.getOwnPropertyDescriptor, _ = (r, t, a, i) => {
+  for (var e = i > 1 ? void 0 : i ? jr(t, a) : t, s = r.length - 1, o; s >= 0; s--)
+    (o = r[s]) && (e = (i ? o(t, a, e) : o(e)) || e);
+  return i && e && Tr(t, a, e), e;
 };
 let b = class extends p {
   constructor() {
@@ -2648,10 +2671,10 @@ _([
 b = _([
   d("crt-progress")
 ], b);
-var Tr = Object.defineProperty, jr = Object.getOwnPropertyDescriptor, ht = (r, t, a, s) => {
-  for (var e = s > 1 ? void 0 : s ? jr(t, a) : t, i = r.length - 1, o; i >= 0; i--)
-    (o = r[i]) && (e = (s ? o(t, a, e) : o(e)) || e);
-  return s && e && Tr(t, a, e), e;
+var Ar = Object.defineProperty, Mr = Object.getOwnPropertyDescriptor, gt = (r, t, a, i) => {
+  for (var e = i > 1 ? void 0 : i ? Mr(t, a) : t, s = r.length - 1, o; s >= 0; s--)
+    (o = r[s]) && (e = (i ? o(t, a, e) : o(e)) || e);
+  return i && e && Ar(t, a, e), e;
 };
 let V = class extends p {
   constructor() {
@@ -2789,27 +2812,27 @@ V.styles = l`
       border-right-color: var(--crt-primary);
     }
   `;
-ht([
+gt([
   n({ type: String })
 ], V.prototype, "text", 2);
-ht([
+gt([
   n({ type: String, reflect: !0 })
 ], V.prototype, "position", 2);
-ht([
+gt([
   n({ type: Number })
 ], V.prototype, "delay", 2);
-ht([
+gt([
   v()
 ], V.prototype, "_visible", 2);
-V = ht([
+V = gt([
   d("crt-tooltip")
 ], V);
-var Ar = Object.defineProperty, Mr = Object.getOwnPropertyDescriptor, Mt = (r, t, a, s) => {
-  for (var e = s > 1 ? void 0 : s ? Mr(t, a) : t, i = r.length - 1, o; i >= 0; i--)
-    (o = r[i]) && (e = (s ? o(t, a, e) : o(e)) || e);
-  return s && e && Ar(t, a, e), e;
+var Ir = Object.defineProperty, Lr = Object.getOwnPropertyDescriptor, Lt = (r, t, a, i) => {
+  for (var e = i > 1 ? void 0 : i ? Lr(t, a) : t, s = r.length - 1, o; s >= 0; s--)
+    (o = r[s]) && (e = (i ? o(t, a, e) : o(e)) || e);
+  return i && e && Ir(t, a, e), e;
 };
-let ot = class extends p {
+let ct = class extends p {
   constructor() {
     super(...arguments), this.items = [], this.separator = ">";
   }
@@ -2827,7 +2850,7 @@ let ot = class extends p {
     `;
   }
 };
-ot.styles = l`
+ct.styles = l`
     :host {
       display: block;
       font-family: var(--crt-font-family);
@@ -2876,19 +2899,19 @@ ot.styles = l`
       font-size: var(--crt-font-size-sm);
     }
   `;
-Mt([
+Lt([
   n({ type: Array })
-], ot.prototype, "items", 2);
-Mt([
+], ct.prototype, "items", 2);
+Lt([
   n({ type: String })
-], ot.prototype, "separator", 2);
-ot = Mt([
+], ct.prototype, "separator", 2);
+ct = Lt([
   d("crt-breadcrumb")
-], ot);
-var Ir = Object.defineProperty, Lr = Object.getOwnPropertyDescriptor, vt = (r, t, a, s) => {
-  for (var e = s > 1 ? void 0 : s ? Lr(t, a) : t, i = r.length - 1, o; i >= 0; i--)
-    (o = r[i]) && (e = (s ? o(t, a, e) : o(e)) || e);
-  return s && e && Ir(t, a, e), e;
+], ct);
+var Ur = Object.defineProperty, Nr = Object.getOwnPropertyDescriptor, ut = (r, t, a, i) => {
+  for (var e = i > 1 ? void 0 : i ? Nr(t, a) : t, s = r.length - 1, o; s >= 0; s--)
+    (o = r[s]) && (e = (i ? o(t, a, e) : o(e)) || e);
+  return i && e && Ur(t, a, e), e;
 };
 let X = class extends p {
   constructor() {
@@ -2902,9 +2925,9 @@ let X = class extends p {
   _getPageNumbers() {
     const r = [], t = this.current > this.siblings + 2, a = this.current < this.total - this.siblings - 1;
     r.push(1), t && r.push("...");
-    const s = Math.max(2, this.current - this.siblings), e = Math.min(this.total - 1, this.current + this.siblings);
-    for (let i = s; i <= e; i++)
-      r.includes(i) || r.push(i);
+    const i = Math.max(2, this.current - this.siblings), e = Math.min(this.total - 1, this.current + this.siblings);
+    for (let s = i; s <= e; s++)
+      r.includes(s) || r.push(s);
     return a && r.push("..."), this.total > 1 && !r.includes(this.total) && r.push(this.total), r;
   }
   render() {
@@ -3004,25 +3027,25 @@ X.styles = l`
       margin-left: var(--crt-spacing-md);
     }
   `;
-vt([
+ut([
   n({ type: Number })
 ], X.prototype, "current", 2);
-vt([
+ut([
   n({ type: Number })
 ], X.prototype, "total", 2);
-vt([
+ut([
   n({ type: Number })
 ], X.prototype, "siblings", 2);
-vt([
+ut([
   n({ type: Boolean })
 ], X.prototype, "showInfo", 2);
-X = vt([
+X = ut([
   d("crt-pagination")
 ], X);
-var Ur = Object.defineProperty, Nr = Object.getOwnPropertyDescriptor, T = (r, t, a, s) => {
-  for (var e = s > 1 ? void 0 : s ? Nr(t, a) : t, i = r.length - 1, o; i >= 0; i--)
-    (o = r[i]) && (e = (s ? o(t, a, e) : o(e)) || e);
-  return s && e && Ur(t, a, e), e;
+var Rr = Object.defineProperty, Fr = Object.getOwnPropertyDescriptor, T = (r, t, a, i) => {
+  for (var e = i > 1 ? void 0 : i ? Fr(t, a) : t, s = r.length - 1, o; s >= 0; s--)
+    (o = r[s]) && (e = (i ? o(t, a, e) : o(e)) || e);
+  return i && e && Rr(t, a, e), e;
 };
 let f = class extends p {
   constructor() {
@@ -3105,7 +3128,8 @@ f.styles = l`
     .slider-value {
       color: var(--crt-primary);
       font-size: var(--crt-font-size-base);
-      min-width: 50px;
+      min-width: 36px;
+      flex: 0 0 auto;
       text-align: right;
     }
 
@@ -3116,6 +3140,13 @@ f.styles = l`
       align-items: center;
     }
 
+    /* Allow range input and wrapper to shrink inside flexible containers */
+    .slider-wrapper, .slider-track, input[type="range"] {
+      box-sizing: border-box;
+      min-width: 0;
+      width: 100%;
+    }
+
     input[type="range"] {
       -webkit-appearance: none;
       appearance: none;
@@ -3230,10 +3261,10 @@ T([
 f = T([
   d("crt-slider")
 ], f);
-var Rr = Object.defineProperty, Fr = Object.getOwnPropertyDescriptor, G = (r, t, a, s) => {
-  for (var e = s > 1 ? void 0 : s ? Fr(t, a) : t, i = r.length - 1, o; i >= 0; i--)
-    (o = r[i]) && (e = (s ? o(t, a, e) : o(e)) || e);
-  return s && e && Rr(t, a, e), e;
+var Br = Object.defineProperty, Yr = Object.getOwnPropertyDescriptor, Q = (r, t, a, i) => {
+  for (var e = i > 1 ? void 0 : i ? Yr(t, a) : t, s = r.length - 1, o; s >= 0; s--)
+    (o = r[s]) && (e = (i ? o(t, a, e) : o(e)) || e);
+  return i && e && Br(t, a, e), e;
 };
 let S = class extends p {
   constructor() {
@@ -3388,33 +3419,33 @@ S.styles = l`
       left: 35px;
     }
   `;
-G([
+Q([
   n({ type: Boolean, reflect: !0 })
 ], S.prototype, "checked", 2);
-G([
+Q([
   n({ type: Boolean, reflect: !0 })
 ], S.prototype, "disabled", 2);
-G([
+Q([
   n({ type: String })
 ], S.prototype, "label", 2);
-G([
+Q([
   n({ type: String })
 ], S.prototype, "onLabel", 2);
-G([
+Q([
   n({ type: String })
 ], S.prototype, "offLabel", 2);
-G([
+Q([
   n({ type: String, reflect: !0 })
 ], S.prototype, "size", 2);
-S = G([
+S = Q([
   d("crt-toggle")
 ], S);
-var Br = Object.defineProperty, Yr = Object.getOwnPropertyDescriptor, j = (r, t, a, s) => {
-  for (var e = s > 1 ? void 0 : s ? Yr(t, a) : t, i = r.length - 1, o; i >= 0; i--)
-    (o = r[i]) && (e = (s ? o(t, a, e) : o(e)) || e);
-  return s && e && Br(t, a, e), e;
+var qr = Object.defineProperty, Vr = Object.getOwnPropertyDescriptor, j = (r, t, a, i) => {
+  for (var e = i > 1 ? void 0 : i ? Vr(t, a) : t, s = r.length - 1, o; s >= 0; s--)
+    (o = r[s]) && (e = (i ? o(t, a, e) : o(e)) || e);
+  return i && e && qr(t, a, e), e;
 };
-let D = class extends p {
+let E = class extends p {
   constructor() {
     super(...arguments), this.src = "", this.alt = "", this.name = "", this.size = "md", this.shape = "square", this.status = "";
   }
@@ -3447,7 +3478,7 @@ let D = class extends p {
     `;
   }
 };
-D.styles = l`
+E.styles = l`
     :host {
       display: inline-block;
       font-family: var(--crt-font-family);
@@ -3577,26 +3608,26 @@ D.styles = l`
   `;
 j([
   n({ type: String })
-], D.prototype, "src", 2);
+], E.prototype, "src", 2);
 j([
   n({ type: String })
-], D.prototype, "alt", 2);
+], E.prototype, "alt", 2);
 j([
   n({ type: String })
-], D.prototype, "name", 2);
+], E.prototype, "name", 2);
 j([
   n({ type: String, reflect: !0 })
-], D.prototype, "size", 2);
+], E.prototype, "size", 2);
 j([
   n({ type: String, reflect: !0 })
-], D.prototype, "shape", 2);
+], E.prototype, "shape", 2);
 j([
   n({ type: String, reflect: !0 })
-], D.prototype, "status", 2);
-D = j([
+], E.prototype, "status", 2);
+E = j([
   d("crt-avatar")
-], D);
-let kt = class extends p {
+], E);
+let _t = class extends p {
   constructor() {
     super(...arguments), this.max = 5;
   }
@@ -3606,7 +3637,7 @@ let kt = class extends p {
     `;
   }
 };
-kt.styles = l`
+_t.styles = l`
     :host {
       display: inline-flex;
       align-items: center;
@@ -3637,14 +3668,14 @@ kt.styles = l`
   `;
 j([
   n({ type: Number })
-], kt.prototype, "max", 2);
-kt = j([
+], _t.prototype, "max", 2);
+_t = j([
   d("crt-avatar-group")
-], kt);
-var Vr = Object.defineProperty, Xr = Object.getOwnPropertyDescriptor, z = (r, t, a, s) => {
-  for (var e = s > 1 ? void 0 : s ? Xr(t, a) : t, i = r.length - 1, o; i >= 0; i--)
-    (o = r[i]) && (e = (s ? o(t, a, e) : o(e)) || e);
-  return s && e && Vr(t, a, e), e;
+], _t);
+var Xr = Object.defineProperty, Kr = Object.getOwnPropertyDescriptor, z = (r, t, a, i) => {
+  for (var e = i > 1 ? void 0 : i ? Kr(t, a) : t, s = r.length - 1, o; s >= 0; s--)
+    (o = r[s]) && (e = (i ? o(t, a, e) : o(e)) || e);
+  return i && e && Xr(t, a, e), e;
 };
 let N = class extends p {
   constructor() {
@@ -3792,7 +3823,7 @@ z([
 N = z([
   d("crt-skeleton")
 ], N);
-let $t = class extends p {
+let zt = class extends p {
   constructor() {
     super(...arguments), this.lines = 3;
   }
@@ -3804,7 +3835,7 @@ let $t = class extends p {
     `;
   }
 };
-$t.styles = l`
+zt.styles = l`
     :host {
       display: block;
     }
@@ -3838,11 +3869,11 @@ $t.styles = l`
   `;
 z([
   n({ type: Number })
-], $t.prototype, "lines", 2);
-$t = z([
+], zt.prototype, "lines", 2);
+zt = z([
   d("crt-skeleton-text")
-], $t);
-let _t = class extends p {
+], zt);
+let Ot = class extends p {
   constructor() {
     super(...arguments), this.hideImage = !1;
   }
@@ -3858,7 +3889,7 @@ let _t = class extends p {
     `;
   }
 };
-_t.styles = l`
+Ot.styles = l`
     :host {
       display: block;
     }
@@ -3911,14 +3942,14 @@ _t.styles = l`
   `;
 z([
   n({ type: Boolean })
-], _t.prototype, "hideImage", 2);
-_t = z([
+], Ot.prototype, "hideImage", 2);
+Ot = z([
   d("crt-skeleton-card")
-], _t);
-var qr = Object.defineProperty, Wr = Object.getOwnPropertyDescriptor, A = (r, t, a, s) => {
-  for (var e = s > 1 ? void 0 : s ? Wr(t, a) : t, i = r.length - 1, o; i >= 0; i--)
-    (o = r[i]) && (e = (s ? o(t, a, e) : o(e)) || e);
-  return s && e && qr(t, a, e), e;
+], Ot);
+var Wr = Object.defineProperty, Hr = Object.getOwnPropertyDescriptor, A = (r, t, a, i) => {
+  for (var e = i > 1 ? void 0 : i ? Hr(t, a) : t, s = r.length - 1, o; s >= 0; s--)
+    (o = r[s]) && (e = (i ? o(t, a, e) : o(e)) || e);
+  return i && e && Wr(t, a, e), e;
 };
 let y = class extends p {
   constructor() {
@@ -4147,12 +4178,12 @@ A([
 y = A([
   d("crt-alert")
 ], y);
-var Hr = Object.defineProperty, Kr = Object.getOwnPropertyDescriptor, It = (r, t, a, s) => {
-  for (var e = s > 1 ? void 0 : s ? Kr(t, a) : t, i = r.length - 1, o; i >= 0; i--)
-    (o = r[i]) && (e = (s ? o(t, a, e) : o(e)) || e);
-  return s && e && Hr(t, a, e), e;
+var Gr = Object.defineProperty, Qr = Object.getOwnPropertyDescriptor, Ut = (r, t, a, i) => {
+  for (var e = i > 1 ? void 0 : i ? Qr(t, a) : t, s = r.length - 1, o; s >= 0; s--)
+    (o = r[s]) && (e = (i ? o(t, a, e) : o(e)) || e);
+  return i && e && Gr(t, a, e), e;
 };
-let nt = class extends p {
+let lt = class extends p {
   constructor() {
     super(...arguments), this.open = !1, this.message = "LOADING...";
   }
@@ -4176,7 +4207,7 @@ let nt = class extends p {
     ` : c``;
   }
 };
-nt.styles = l`
+lt.styles = l`
     :host {
       display: block;
     }
@@ -4398,21 +4429,21 @@ nt.styles = l`
       50% { opacity: 0.5; }
     }
   `;
-It([
+Ut([
   n({ type: Boolean, reflect: !0 })
-], nt.prototype, "open", 2);
-It([
+], lt.prototype, "open", 2);
+Ut([
   n({ type: String })
-], nt.prototype, "message", 2);
-nt = It([
+], lt.prototype, "message", 2);
+lt = Ut([
   d("crt-spinner")
-], nt);
-var Gr = Object.getOwnPropertyDescriptor, Jr = (r, t, a, s) => {
-  for (var e = s > 1 ? void 0 : s ? Gr(t, a) : t, i = r.length - 1, o; i >= 0; i--)
-    (o = r[i]) && (e = o(e) || e);
+], lt);
+var Jr = Object.getOwnPropertyDescriptor, Zr = (r, t, a, i) => {
+  for (var e = i > 1 ? void 0 : i ? Jr(t, a) : t, s = r.length - 1, o; s >= 0; s--)
+    (o = r[s]) && (e = o(e) || e);
   return e;
 };
-let St = class extends p {
+let Dt = class extends p {
   render() {
     return c`
       <div class="card">
@@ -4429,7 +4460,7 @@ let St = class extends p {
     `;
   }
 };
-St.styles = l`
+Dt.styles = l`
     .card {
       border: 3px double var(--crt-primary);
       padding: var(--crt-spacing-lg);
@@ -4461,15 +4492,15 @@ St.styles = l`
       margin-top: var(--crt-spacing-md);
     }
   `;
-St = Jr([
+Dt = Zr([
   d("crt-card")
-], St);
-var Zr = Object.defineProperty, Qr = Object.getOwnPropertyDescriptor, Lt = (r, t, a, s) => {
-  for (var e = s > 1 ? void 0 : s ? Qr(t, a) : t, i = r.length - 1, o; i >= 0; i--)
-    (o = r[i]) && (e = (s ? o(t, a, e) : o(e)) || e);
-  return s && e && Zr(t, a, e), e;
+], Dt);
+var te = Object.defineProperty, re = Object.getOwnPropertyDescriptor, Nt = (r, t, a, i) => {
+  for (var e = i > 1 ? void 0 : i ? re(t, a) : t, s = r.length - 1, o; s >= 0; s--)
+    (o = r[s]) && (e = (i ? o(t, a, e) : o(e)) || e);
+  return i && e && te(t, a, e), e;
 };
-let ct = class extends p {
+let pt = class extends p {
   constructor() {
     super(...arguments), this.headers = [], this.rows = [];
   }
@@ -4488,7 +4519,7 @@ let ct = class extends p {
     `;
   }
 };
-ct.styles = l`
+pt.styles = l`
     :host {
       display: block;
     }
@@ -4540,21 +4571,21 @@ ct.styles = l`
       border-bottom: none;
     }
   `;
-Lt([
+Nt([
   n({ type: Array })
-], ct.prototype, "headers", 2);
-Lt([
+], pt.prototype, "headers", 2);
+Nt([
   n({ type: Array })
-], ct.prototype, "rows", 2);
-ct = Lt([
+], pt.prototype, "rows", 2);
+pt = Nt([
   d("crt-table")
-], ct);
-var te = Object.defineProperty, re = Object.getOwnPropertyDescriptor, Ut = (r, t, a, s) => {
-  for (var e = s > 1 ? void 0 : s ? re(t, a) : t, i = r.length - 1, o; i >= 0; i--)
-    (o = r[i]) && (e = (s ? o(t, a, e) : o(e)) || e);
-  return s && e && te(t, a, e), e;
+], pt);
+var ee = Object.defineProperty, ae = Object.getOwnPropertyDescriptor, Rt = (r, t, a, i) => {
+  for (var e = i > 1 ? void 0 : i ? ae(t, a) : t, s = r.length - 1, o; s >= 0; s--)
+    (o = r[s]) && (e = (i ? o(t, a, e) : o(e)) || e);
+  return i && e && ee(t, a, e), e;
 };
-let lt = class extends p {
+let dt = class extends p {
   constructor() {
     super(...arguments), this.columns = 3, this.gap = "var(--crt-spacing-lg)";
   }
@@ -4572,7 +4603,7 @@ let lt = class extends p {
     `;
   }
 };
-lt.styles = l`
+dt.styles = l`
     :host {
       display: block;
     }
@@ -4601,19 +4632,19 @@ lt.styles = l`
       }
     }
   `;
-Ut([
+Rt([
   n({ type: Number })
-], lt.prototype, "columns", 2);
-Ut([
+], dt.prototype, "columns", 2);
+Rt([
   n({ type: String })
-], lt.prototype, "gap", 2);
-lt = Ut([
+], dt.prototype, "gap", 2);
+dt = Rt([
   d("crt-grid")
-], lt);
-var ee = Object.defineProperty, ae = Object.getOwnPropertyDescriptor, rt = (r, t, a, s) => {
-  for (var e = s > 1 ? void 0 : s ? ae(t, a) : t, i = r.length - 1, o; i >= 0; i--)
-    (o = r[i]) && (e = (s ? o(t, a, e) : o(e)) || e);
-  return s && e && ee(t, a, e), e;
+], dt);
+var ie = Object.defineProperty, se = Object.getOwnPropertyDescriptor, et = (r, t, a, i) => {
+  for (var e = i > 1 ? void 0 : i ? se(t, a) : t, s = r.length - 1, o; s >= 0; s--)
+    (o = r[s]) && (e = (i ? o(t, a, e) : o(e)) || e);
+  return i && e && ie(t, a, e), e;
 };
 let R = class extends p {
   constructor() {
@@ -4805,30 +4836,30 @@ R.styles = l`
       color: var(--crt-bg-dark);
     }
   `;
-rt([
+et([
   n()
 ], R.prototype, "title", 2);
-rt([
+et([
   n()
 ], R.prototype, "description", 2);
-rt([
+et([
   n()
 ], R.prototype, "code", 2);
-rt([
+et([
   v()
 ], R.prototype, "activeTab", 2);
-rt([
+et([
   v()
 ], R.prototype, "copied", 2);
-R = rt([
+R = et([
   d("crt-code-example")
 ], R);
-var se = Object.defineProperty, ie = Object.getOwnPropertyDescriptor, Ct = (r, t, a, s) => {
-  for (var e = s > 1 ? void 0 : s ? ie(t, a) : t, i = r.length - 1, o; i >= 0; i--)
-    (o = r[i]) && (e = (s ? o(t, a, e) : o(e)) || e);
-  return s && e && se(t, a, e), e;
+var oe = Object.defineProperty, ne = Object.getOwnPropertyDescriptor, Et = (r, t, a, i) => {
+  for (var e = i > 1 ? void 0 : i ? ne(t, a) : t, s = r.length - 1, o; s >= 0; s--)
+    (o = r[s]) && (e = (i ? o(t, a, e) : o(e)) || e);
+  return i && e && oe(t, a, e), e;
 };
-let Q = class extends p {
+let tt = class extends p {
   constructor() {
     super(...arguments), this.open = !1, this.title = "Modal", this.size = "medium", this._handleKeydown = (r) => {
       r.key === "Escape" && this.open && this.close();
@@ -4865,7 +4896,7 @@ let Q = class extends p {
     `;
   }
 };
-Q.styles = l`
+tt.styles = l`
     :host {
       display: none;
     }
@@ -4992,24 +5023,24 @@ Q.styles = l`
       height: calc(95vh - 120px);
     }
   `;
-Ct([
+Et([
   n({ type: Boolean, reflect: !0 })
-], Q.prototype, "open", 2);
-Ct([
+], tt.prototype, "open", 2);
+Et([
   n({ type: String })
-], Q.prototype, "title", 2);
-Ct([
+], tt.prototype, "title", 2);
+Et([
   n({ type: String })
-], Q.prototype, "size", 2);
-Q = Ct([
+], tt.prototype, "size", 2);
+tt = Et([
   d("crt-modal")
-], Q);
-var oe = Object.defineProperty, ne = Object.getOwnPropertyDescriptor, J = (r, t, a, s) => {
-  for (var e = s > 1 ? void 0 : s ? ne(t, a) : t, i = r.length - 1, o; i >= 0; i--)
-    (o = r[i]) && (e = (s ? o(t, a, e) : o(e)) || e);
-  return s && e && oe(t, a, e), e;
+], tt);
+var ce = Object.defineProperty, le = Object.getOwnPropertyDescriptor, J = (r, t, a, i) => {
+  for (var e = i > 1 ? void 0 : i ? le(t, a) : t, s = r.length - 1, o; s >= 0; s--)
+    (o = r[s]) && (e = (i ? o(t, a, e) : o(e)) || e);
+  return i && e && ce(t, a, e), e;
 };
-let E = class extends p {
+let D = 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;
   }
@@ -5074,7 +5105,7 @@ let E = class extends p {
     `;
   }
 };
-E.styles = l`
+D.styles = l`
     :host {
       position: fixed;
       z-index: 10001;
@@ -5243,31 +5274,31 @@ E.styles = l`
   `;
 J([
   n({ type: String, reflect: !0 })
-], E.prototype, "position", 2);
+], D.prototype, "position", 2);
 J([
   n({ type: String })
-], E.prototype, "message", 2);
+], D.prototype, "message", 2);
 J([
   n({ type: String })
-], E.prototype, "title", 2);
+], D.prototype, "title", 2);
 J([
   n({ type: String })
-], E.prototype, "variant", 2);
+], D.prototype, "variant", 2);
 J([
   n({ type: Number })
-], E.prototype, "duration", 2);
+], D.prototype, "duration", 2);
 J([
   v()
-], E.prototype, "_toasts", 2);
-E = J([
+], D.prototype, "_toasts", 2);
+D = J([
   d("crt-toast")
-], E);
-var ce = Object.defineProperty, le = Object.getOwnPropertyDescriptor, gt = (r, t, a, s) => {
-  for (var e = s > 1 ? void 0 : s ? le(t, a) : t, i = r.length - 1, o; i >= 0; i--)
-    (o = r[i]) && (e = (s ? o(t, a, e) : o(e)) || e);
-  return s && e && ce(t, a, e), e;
+], D);
+var pe = Object.defineProperty, de = Object.getOwnPropertyDescriptor, mt = (r, t, a, i) => {
+  for (var e = i > 1 ? void 0 : i ? de(t, a) : t, s = r.length - 1, o; s >= 0; s--)
+    (o = r[s]) && (e = (i ? o(t, a, e) : o(e)) || e);
+  return i && e && pe(t, a, e), e;
 };
-let pt = class extends p {
+let ht = class extends p {
   constructor() {
     super(...arguments), this.header = "", this.open = !1;
   }
@@ -5296,7 +5327,7 @@ let pt = class extends p {
     `;
   }
 };
-pt.styles = l`
+ht.styles = l`
     :host {
       display: block;
       font-family: var(--crt-font-family);
@@ -5367,16 +5398,16 @@ pt.styles = l`
       color: var(--crt-text-secondary);
     }
   `;
-gt([
+mt([
   n({ type: String })
-], pt.prototype, "header", 2);
-gt([
+], ht.prototype, "header", 2);
+mt([
   n({ type: Boolean, reflect: !0 })
-], pt.prototype, "open", 2);
-pt = gt([
+], ht.prototype, "open", 2);
+ht = mt([
   d("crt-accordion-item")
-], pt);
-let zt = class extends p {
+], ht);
+let Pt = class extends p {
   constructor() {
     super(...arguments), this.multiple = !1, this._handleToggle = (r) => {
       !this.multiple && r.detail.open && this.querySelectorAll("crt-accordion-item").forEach((t) => {
@@ -5394,33 +5425,33 @@ let zt = class extends p {
     return c`<slot></slot>`;
   }
 };
-zt.styles = l`
+Pt.styles = l`
     :host {
       display: block;
     }
   `;
-gt([
+mt([
   n({ type: Boolean })
-], zt.prototype, "multiple", 2);
-zt = gt([
+], Pt.prototype, "multiple", 2);
+Pt = mt([
   d("crt-accordion")
-], zt);
-var pe = Object.defineProperty, de = Object.getOwnPropertyDescriptor, ut = (r, t, a, s) => {
-  for (var e = s > 1 ? void 0 : s ? de(t, a) : t, i = r.length - 1, o; i >= 0; i--)
-    (o = r[i]) && (e = (s ? o(t, a, e) : o(e)) || e);
-  return s && e && pe(t, a, e), e;
+], Pt);
+var he = Object.defineProperty, ve = Object.getOwnPropertyDescriptor, bt = (r, t, a, i) => {
+  for (var e = i > 1 ? void 0 : i ? ve(t, a) : t, s = r.length - 1, o; s >= 0; s--)
+    (o = r[s]) && (e = (i ? o(t, a, e) : o(e)) || e);
+  return i && e && he(t, a, e), e;
 };
-let q = class extends p {
+let K = 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 r = Math.floor(this.dataArray.length / this.bars), t = [];
       for (let a = 0; a < this.bars; a++) {
-        let s;
-        this.mode === 1 ? s = a * r : this.mode === 2 ? a < this.bars / 2 ? s = Math.floor((this.bars / 2 - a - 1) * r) : s = Math.floor((a - this.bars / 2) * r) : a < this.bars / 2 ? s = Math.floor(a * r) : s = Math.floor((this.bars - a - 1) * r);
-        const i = (this.dataArray[s] || 0) / 255 * 100;
-        t.push(Math.max(20, i));
+        let i;
+        this.mode === 1 ? i = a * r : this.mode === 2 ? a < this.bars / 2 ? i = Math.floor((this.bars / 2 - a - 1) * r) : i = Math.floor((a - this.bars / 2) * r) : a < this.bars / 2 ? i = Math.floor(a * r) : i = Math.floor((this.bars - a - 1) * r);
+        const s = (this.dataArray[i] || 0) / 255 * 100;
+        t.push(Math.max(20, s));
       }
       this.barHeights = t, this.animationId = requestAnimationFrame(this.visualize);
     };
@@ -5463,7 +5494,7 @@ let q = class extends p {
     `;
   }
 };
-q.styles = l`
+K.styles = l`
     :host {
       display: block;
     }
@@ -5472,8 +5503,8 @@ q.styles = l`
       display: flex;
       justify-content: space-between;
       align-items: flex-end;
-      /* give a concrete height so percent heights on bars resolve reliably */
-      height: 160px;
+      /* allow configurable height and responsive fallback */
+      height: var(--crt-visualizer-height, 160px);
       gap: 6px;
       border: 2px solid var(--crt-primary);
       padding: var(--crt-spacing-md);
@@ -5484,6 +5515,11 @@ q.styles = l`
       overflow: hidden;
     }
 
+    @media (max-width: 520px) {
+      .visualizer { height: var(--crt-visualizer-height-sm, 110px); padding: calc(var(--crt-spacing-sm) + 2px); }
+      .bar { min-width: 4px; }
+    }
+
     .label {
       position: absolute;
       top: 10px;
@@ -5519,9 +5555,9 @@ q.styles = l`
     }
 
     .bar {
-      flex: 1 1 auto;
+      flex: 1 1 0;
       align-self: flex-end;
-      min-width: 6px;
+      min-width: 4px;
       background: linear-gradient(180deg, color-mix(in srgb, var(--crt-primary) 80%, white 20%), var(--crt-primary));
       box-shadow: 0 0 8px color-mix(in srgb, var(--crt-primary) 40%, transparent);
       transition: height 0.05s ease, background 0.2s ease;
@@ -5533,27 +5569,27 @@ q.styles = l`
       animation: none;
     }
   `;
-ut([
+bt([
   n({ type: Number })
-], q.prototype, "bars", 2);
-ut([
+], K.prototype, "bars", 2);
+bt([
   n({ type: Number })
-], q.prototype, "mode", 2);
-ut([
+], K.prototype, "mode", 2);
+bt([
   v()
-], q.prototype, "barHeights", 2);
-ut([
+], K.prototype, "barHeights", 2);
+bt([
   v()
-], q.prototype, "isActive", 2);
-q = ut([
+], K.prototype, "isActive", 2);
+K = bt([
   d("crt-visualizer")
-], q);
-var he = Object.defineProperty, ve = Object.getOwnPropertyDescriptor, Nt = (r, t, a, s) => {
-  for (var e = s > 1 ? void 0 : s ? ve(t, a) : t, i = r.length - 1, o; i >= 0; i--)
-    (o = r[i]) && (e = (s ? o(t, a, e) : o(e)) || e);
-  return s && e && he(t, a, e), e;
+], K);
+var ge = Object.defineProperty, ue = Object.getOwnPropertyDescriptor, Ft = (r, t, a, i) => {
+  for (var e = i > 1 ? void 0 : i ? ue(t, a) : t, s = r.length - 1, o; s >= 0; s--)
+    (o = r[s]) && (e = (i ? o(t, a, e) : o(e)) || e);
+  return i && e && ge(t, a, e), e;
 };
-let dt = class extends p {
+let vt = class extends p {
   constructor() {
     super(...arguments), this.tracks = [], this.currentIndex = 0;
   }
@@ -5622,7 +5658,7 @@ let dt = class extends p {
     `;
   }
 };
-dt.styles = l`
+vt.styles = l`
     :host {
       display: block;
     }
@@ -5635,6 +5671,8 @@ dt.styles = l`
       font-size: var(--crt-font-size-sm);
       border: 2px solid var(--crt-primary);
       box-shadow: var(--crt-glow-sm);
+      box-sizing: border-box;
+      table-layout: fixed;
     }
 
     thead {
@@ -5653,10 +5691,15 @@ dt.styles = l`
     }
 
     th.actions {
-      width: 50px;
+      width: 48px;
       text-align: center;
     }
 
+    /* Fix column widths in fixed table layout so title column can shrink
+       without forcing the whole table to overflow */
+    thead th:first-child { width: 48px; }
+    thead th:nth-child(2) { width: auto; }
+
     tbody tr {
       border-bottom: 1px solid rgba(51, 255, 51, 0.2);
       transition: var(--crt-transition);
@@ -5693,16 +5736,17 @@ dt.styles = l`
     }
 
     td.track-number {
-      width: 60px;
+      min-width: 48px;
+      width: 48px;
       text-align: center;
       opacity: 0.7;
     }
 
     td.track-title {
-      max-width: 200px;
       white-space: nowrap;
       overflow: hidden;
       text-overflow: ellipsis;
+      min-width: 0;
     }
 
     td.track-artist {
@@ -5745,10 +5789,18 @@ dt.styles = l`
     .table-wrapper {
       max-height: 400px;
       overflow-y: auto;
+      min-width: 0;
       scrollbar-width: thin;
       scrollbar-color: var(--crt-primary) var(--crt-bg-dark);
     }
 
+    /* Responsive: hide artist on narrow screens and allow horizontal scroll fallback */
+    @media (max-width: 520px) {
+      td.track-artist { display: none; }
+      td.track-title { max-width: 140px; min-width: 0; }
+      .table-wrapper { overflow-x: auto; min-width: 0; }
+    }
+
     .table-wrapper::-webkit-scrollbar {
       width: 10px;
     }
@@ -5763,19 +5815,19 @@ dt.styles = l`
       box-shadow: var(--crt-glow-sm);
     }
   `;
-Nt([
+Ft([
   n({ type: Array })
-], dt.prototype, "tracks", 2);
-Nt([
+], vt.prototype, "tracks", 2);
+Ft([
   n({ type: Number })
-], dt.prototype, "currentIndex", 2);
-dt = Nt([
+], vt.prototype, "currentIndex", 2);
+vt = Ft([
   d("crt-playlist")
-], dt);
-var ge = Object.defineProperty, ue = Object.getOwnPropertyDescriptor, M = (r, t, a, s) => {
-  for (var e = s > 1 ? void 0 : s ? ue(t, a) : t, i = r.length - 1, o; i >= 0; i--)
-    (o = r[i]) && (e = (s ? o(t, a, e) : o(e)) || e);
-  return s && e && ge(t, a, e), e;
+], vt);
+var me = Object.defineProperty, be = Object.getOwnPropertyDescriptor, M = (r, t, a, i) => {
+  for (var e = i > 1 ? void 0 : i ? be(t, a) : t, s = r.length - 1, o; s >= 0; s--)
+    (o = r[s]) && (e = (i ? o(t, a, e) : o(e)) || e);
+  return i && e && me(t, a, e), e;
 };
 let x = class extends p {
   constructor() {
@@ -5792,8 +5844,8 @@ let x = class extends p {
     }, this.handleEnded = () => {
       this.nextTrack();
     }, this.handleProgressClick = (r) => {
-      const a = r.currentTarget.getBoundingClientRect(), s = (r.clientX - a.left) / a.width;
-      this.audio && (this.audio.currentTime = this.duration * s);
+      const a = r.currentTarget.getBoundingClientRect(), i = (r.clientX - a.left) / a.width;
+      this.audio && (this.audio.currentTime = this.duration * i);
     }, this.handleVolumeChange = (r) => {
       this.volume = r.detail.value, this.audio && (this.audio.volume = this.volume / 100), localStorage.setItem("crtPlayerVolume", this.volume.toString());
     };
@@ -5921,12 +5973,22 @@ x.styles = l`
     :host {
       display: block;
       font-family: var(--crt-font-family);
+      width: 100%;
+      box-sizing: border-box;
     }
 
     .player {
       border: 3px double var(--crt-primary);
       background: var(--crt-bg-dark);
       box-shadow: var(--crt-glow-inset);
+      width: 100%;
+      box-sizing: border-box;
+      overflow: hidden;
+    }
+
+    /* Ensure nested controls can shrink and respect host width */
+    .player, .player * {
+      box-sizing: border-box;
     }
 
     /* Header */
@@ -5972,6 +6034,8 @@ x.styles = l`
 
     .track-details {
       overflow: hidden;
+      flex: 1 1 auto;
+      min-width: 0;
     }
 
     .track-title {
@@ -5995,6 +6059,9 @@ x.styles = l`
       margin-left: var(--crt-spacing-md);
     }
 
+    .visualizer-section { width: 100%; }
+    .now-playing { width: 100%; }
+
     /* Progress */
     .progress-section {
       margin-bottom: var(--crt-spacing-md);
@@ -6019,18 +6086,27 @@ x.styles = l`
       align-items: center;
       gap: var(--crt-spacing-md);
       flex-wrap: wrap;
+      min-width: 0;
     }
 
     .control-buttons {
       display: flex;
       gap: var(--crt-spacing-sm);
       align-items: center;
+      min-width: 0;
     }
 
     .volume-section {
-      flex: 1;
+      flex: 1 1 auto;
       max-width: 200px;
-      min-width: 150px;
+      min-width: 0;
+    }
+
+    /* Responsive: stack controls on narrow viewports */
+    @media (max-width: 520px) {
+      .controls { flex-direction: column; align-items: stretch; }
+      .control-buttons { justify-content: center; margin-bottom: var(--crt-spacing-sm); }
+      .volume-section { max-width: 100%; min-width: 0; }
     }
 
     /* Empty State */
@@ -6065,33 +6141,179 @@ M([
   v()
 ], x.prototype, "volume", 2);
 M([
-  Tt("audio")
+  At("audio")
 ], x.prototype, "audio", 2);
 M([
-  Tt("crt-visualizer")
+  At("crt-visualizer")
 ], x.prototype, "visualizer", 2);
 x = M([
   d("crt-music-player")
 ], x);
-var me = Object.defineProperty, be = Object.getOwnPropertyDescriptor, mt = (r, t, a, s) => {
-  for (var e = s > 1 ? void 0 : s ? be(t, a) : t, i = r.length - 1, o; i >= 0; i--)
-    (o = r[i]) && (e = (s ? o(t, a, e) : o(e)) || e);
-  return s && e && me(t, a, e), e;
+var fe = Object.defineProperty, ye = Object.getOwnPropertyDescriptor, at = (r, t, a, i) => {
+  for (var e = i > 1 ? void 0 : i ? ye(t, a) : t, s = r.length - 1, o; s >= 0; s--)
+    (o = r[s]) && (e = (i ? o(t, a, e) : o(e)) || e);
+  return i && e && fe(t, a, e), e;
+};
+let F = class extends p {
+  constructor() {
+    super(), this.rows = 10, this.prompt = "$", this.disabled = !1, this.outputs = [], this.input = "", this.handleFocus = () => {
+      this.disabled || this.focus();
+    }, this.handleKeydown = (r) => {
+      if (!this.disabled) {
+        if (r.key === "Backspace") {
+          r.preventDefault(), this.input = this.input.slice(0, -1), this.requestUpdate();
+          return;
+        }
+        if (r.key === "Enter") {
+          r.preventDefault();
+          const t = this.input.trim();
+          this.println(`${this.prompt} ${t}`), this.dispatchEvent(new CustomEvent("command", { detail: t })), this.input = "", this.requestUpdate();
+          return;
+        }
+        r.key.length === 1 && !r.ctrlKey && !r.metaKey && (this.input += r.key, this.requestUpdate());
+      }
+    }, this.typing = !1, this.typeQueue = [], this.outputs = ["$ SYSTEM READY _"];
+  }
+  connectedCallback() {
+    super.connectedCallback(), this.addEventListener("click", this.handleFocus), this.addEventListener("keydown", this.handleKeydown), this.setAttribute("tabindex", this.disabled ? "-1" : "0");
+  }
+  disconnectedCallback() {
+    this.removeEventListener("click", this.handleFocus), this.removeEventListener("keydown", this.handleKeydown), super.disconnectedCallback();
+  }
+  // Public API
+  write(r) {
+    this.outputs.length === 0 && (this.outputs = []);
+    const t = this.outputs[this.outputs.length - 1] || "";
+    this.outputs[this.outputs.length - 1] = t + r, this.requestUpdate(), this.scrollToBottom();
+  }
+  println(r) {
+    this.outputs = [...this.outputs, r], this.requestUpdate(), this.scrollToBottom();
+  }
+  clear() {
+    this.outputs = [], this.requestUpdate();
+  }
+  focus() {
+    super.focus();
+  }
+  scrollToBottom() {
+    requestAnimationFrame(() => {
+      const r = this.shadowRoot?.querySelector(".term");
+      r && (r.scrollTop = r.scrollHeight);
+    });
+  }
+  type(r, t = 30) {
+    this.typeQueue.push({ text: r, speed: t }), this.typing || this.processTypeQueue();
+  }
+  async processTypeQueue() {
+    if (!this.typing) {
+      for (this.typing = !0; this.typeQueue.length > 0; ) {
+        const { text: r, speed: t } = this.typeQueue.shift();
+        await new Promise((a) => {
+          this.outputs = [...this.outputs, ""];
+          let i = 0;
+          const e = () => {
+            if (i >= r.length) {
+              a();
+              return;
+            }
+            const s = this.outputs.length - 1;
+            this.outputs[s] = (this.outputs[s] || "") + r[i++], this.requestUpdate(), this.scrollToBottom(), setTimeout(e, t);
+          };
+          e();
+        });
+      }
+      this.typing = !1;
+    }
+  }
+  render() {
+    const r = this.outputs.slice(-this.rows);
+    return c`
+      <div class="term" role="textbox" aria-label="Terminal" tabindex="0" aria-disabled="${this.disabled}">
+        ${r.map((t) => c`<div class="line">${t}</div>`)}
+        <div class="line input-line">
+          <span class="prompt">${this.prompt}</span>
+          <div class="fake-input"><span class="input-text">${this.input}</span></div>
+          <span class="caret">_</span>
+        </div>
+      </div>
+    `;
+  }
+};
+F.styles = l`
+    :host { display: block; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, 'Roboto Mono', monospace; }
+    .term {
+      background: #0b0f0b;
+      color: #8aff8a;
+      padding: 12px;
+      border: 2px solid var(--crt-primary);
+      min-height: calc(var(--crt-font-size-md, 16px) * 1.2 * 6);
+      max-height: min(380px, 50vh);
+      overflow: auto;
+      box-sizing: border-box;
+      border-radius: 6px;
+    }
+    @media (max-width: 480px) {
+      .term { min-height: calc(var(--crt-font-size-md, 16px) * 1.2 * 4); max-height: 40vh; padding: 8px; }
+    }
+    .term[aria-disabled="true"] {
+      opacity: 0.65;
+      filter: grayscale(20%);
+      pointer-events: none;
+    }
+    .line { white-space: pre-wrap; word-break: break-word; margin: 2px 0; }
+    .input-line { display:flex; gap:4px; align-items:center; justify-content:flex-start; }
+    .prompt { opacity: 0.9; color: var(--crt-primary); }
+    .term[aria-disabled="true"] .prompt { opacity: 0.6; }
+    .caret {
+      display:inline-block;
+      width:10px;
+      margin-left:2px;
+      animation: blink 1s steps(2,start) infinite;
+      color: var(--crt-primary);
+    }
+    .term[aria-disabled="true"] .caret { visibility: hidden; }
+    @keyframes blink { to { visibility: hidden; } }
+    .fake-input { outline: none; flex: 0 1 auto; min-width: 4px; display:inline-flex; align-items:center; gap:0; }
+    .fake-input .input-text { display:inline-block; white-space:pre; }
+    .muted { opacity: 0.7; font-size: 0.9em; }
+  `;
+at([
+  n({ type: Number })
+], F.prototype, "rows", 2);
+at([
+  n({ type: String })
+], F.prototype, "prompt", 2);
+at([
+  n({ type: Boolean, reflect: !0 })
+], F.prototype, "disabled", 2);
+at([
+  v()
+], F.prototype, "outputs", 2);
+at([
+  v()
+], F.prototype, "input", 2);
+F = at([
+  d("crt-terminal")
+], F);
+var xe = Object.defineProperty, we = Object.getOwnPropertyDescriptor, ft = (r, t, a, i) => {
+  for (var e = i > 1 ? void 0 : i ? we(t, a) : t, s = r.length - 1, o; s >= 0; s--)
+    (o = r[s]) && (e = (i ? o(t, a, e) : o(e)) || e);
+  return i && e && xe(t, a, e), e;
 };
 let W = class extends p {
   constructor() {
     super(...arguments), this.tracks = [], this.currentIndex = 0, this.showUploadModal = !1, this.handleFilesChanged = (r) => {
-      const a = r.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 e = s.name.replace(/\.[^/.]+$/, "");
-        let i = "UNKNOWN ARTIST", o = e.toUpperCase();
+      const a = r.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 e = i.name.replace(/\.[^/.]+$/, "");
+        let s = "UNKNOWN ARTIST", o = e.toUpperCase();
         if (e.includes(" - ")) {
           const h = e.split(" - ");
-          i = h[0].trim().toUpperCase(), o = h.slice(1).join(" - ").trim().toUpperCase();
+          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];
@@ -6099,7 +6321,7 @@ let W = class extends p {
       this.currentIndex = r.detail.index;
     }, this.handleTrackRemove = (r) => {
       const t = r.detail.index, a = this.tracks[t];
-      URL.revokeObjectURL(a.url), this.tracks = this.tracks.filter((s, e) => e !== 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, e) => e !== t), this.tracks.length === 0 ? this.currentIndex = 0 : t <= this.currentIndex && (this.currentIndex = Math.max(0, this.currentIndex - 1));
     }, this.handleTrackChange = (r) => {
       this.currentIndex = r.detail.index;
     }, this.openUploadModal = () => {
@@ -6239,60 +6461,61 @@ W.styles = l`
       padding-top: var(--crt-spacing-md);
     }
   `;
-mt([
+ft([
   v()
 ], W.prototype, "tracks", 2);
-mt([
+ft([
   v()
 ], W.prototype, "currentIndex", 2);
-mt([
+ft([
   v()
 ], W.prototype, "showUploadModal", 2);
-mt([
-  Tt("crt-file-upload")
+ft([
+  At("crt-file-upload")
 ], W.prototype, "fileUpload", 2);
-W = mt([
+W = ft([
   d("crt-music-station")
 ], W);
 export {
-  zt as Accordion,
-  pt as AccordionItem,
+  Pt as Accordion,
+  ht as AccordionItem,
   y as Alert,
-  D as Avatar,
-  kt as AvatarGroup,
-  yt as Badge,
-  ot as Breadcrumb,
+  E as Avatar,
+  _t as AvatarGroup,
+  wt as Badge,
+  ct as Breadcrumb,
   w as Button,
   m as Calendar,
-  St as Card,
+  Dt as Card,
   L as Checkbox,
   R as CodeExample,
   P as FileUpload,
-  lt as Grid,
-  xt as Heading,
-  st as Icon,
-  B as Input,
+  dt as Grid,
+  kt as Heading,
+  ot as Icon,
+  Y as Input,
   I as Link,
-  Q as Modal,
+  tt as Modal,
   x as MusicPlayer,
   W as MusicStation,
   X as Pagination,
-  dt as Playlist,
+  vt as Playlist,
   b as Progress,
   U as Radio,
   Z as RadioGroup,
   C as Select,
   N as Skeleton,
-  _t as SkeletonCard,
-  $t as SkeletonText,
+  Ot as SkeletonCard,
+  zt as SkeletonText,
   f as Slider,
-  nt as Spinner,
-  ct as Table,
-  it as Tabs,
-  wt as Text,
-  Y as Textarea,
-  E as Toast,
+  lt as Spinner,
+  pt as Table,
+  nt as Tabs,
+  F as Terminal,
+  $t as Text,
+  q as Textarea,
+  D as Toast,
   S as Toggle,
   V as Tooltip,
-  q as Visualizer
+  K as Visualizer
 };