comisai 1.0.15 → 1.0.17

package/node_modules/@comis/web/dist/assets/index-CEcM1R_C.js

@@ -0,0 +1,2830 @@
+const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["assets/chat-console-CNmzl0JW.js","assets/session-key-parser-DPORMVyU.js","assets/ic-tool-call-7MaXSsCW.js","assets/ic-chat-message-CFyDJd0z.js","assets/directive-DoeGSK_T.js","assets/ic-icon-xeGTVhVG.js","assets/ic-search-input-CSOxY9g7.js","assets/ic-tag-CPPUnDLF.js","assets/ic-relative-time-3FqpjeAI.js","assets/ic-empty-state-60l2ePhd.js","assets/ic-budget-segment-bar-BtJ6x5mN.js","assets/memory-inspector-1hDGCGat.js","assets/ic-data-table-CKUNTxHw.js","assets/ic-detail-panel-BF83r-if.js","assets/ic-confirm-dialog-CCDbB04e.js","assets/agent-list-LHCJ4rw2.js","assets/agent-detail-BG9MGWWj.js","assets/ic-breadcrumb-CUMpp3BL.js","assets/agent-editor-C26Q_xCs.js","assets/ic-array-editor-B7m6x7-S.js","assets/workspace-manager-BQlr10iH.js","assets/skills-D8yVfSUy.js","assets/ic-tabs-B7QtM_v8.js","assets/mcp-management-BNZPnpDn.js","assets/models-C1qcU_j3.js","assets/ic-connection-dot-CnT1b8xr.js","assets/channel-list-B8dj3O9a.js","assets/channel-detail-CaInesJM.js","assets/message-center-CXefwsUu.js","assets/scheduler-BGgwKd06.js","assets/session-list-6ybUTxbY.js","assets/session-detail-SGEYNJ0M.js","assets/ic-layer-waterfall-COvEYMg5.js","assets/observe-view-C0VBhX4C.js","assets/observability-types-D7jUtSde.js","assets/ic-delivery-row-GP5Fkygs.js","assets/context-engine-BZ5Am6hA.js","assets/billing-view-CtYvBqTE.js","assets/ic-time-range-picker-CypCT68y.js","assets/delivery-view-OfBZof-m.js","assets/diagnostics-view-YFwCxgr2.js","assets/subagents-HHXMeHYo.js","assets/security-D15st4xx.js","assets/ic-select-Ce-Raudx.js","assets/config-editor-DX4ITw6y.js","assets/setup-wizard-nT0tz9QP.js","assets/pipeline-list-BPW8hV-q.js","assets/extract-variables-BM5qyK-s.js","assets/pipeline-builder-DcUUIrm0.js","assets/ic-graph-canvas-C8FuSMe1.js","assets/pipeline-monitor-Bip16T7e.js","assets/pipeline-history-DkfOQ6SW.js","assets/pipeline-history-detail-hyHgD0ai.js","assets/context-dag-browser-BwiaF5tf.js","assets/media-test-BkK3RCRK.js"])))=>i.map(i=>d[i]);
+(function(){const e=document.createElement("link").relList;if(e&&e.supports&&e.supports("modulepreload"))return;for(const s of document.querySelectorAll('link[rel="modulepreload"]'))r(s);new MutationObserver(s=>{for(const a of s)if(a.type==="childList")for(const n of a.addedNodes)n.tagName==="LINK"&&n.rel==="modulepreload"&&r(n)}).observe(document,{childList:!0,subtree:!0});function i(s){const a={};return s.integrity&&(a.integrity=s.integrity),s.referrerPolicy&&(a.referrerPolicy=s.referrerPolicy),s.crossOrigin==="use-credentials"?a.credentials="include":s.crossOrigin==="anonymous"?a.credentials="omit":a.credentials="same-origin",a}function r(s){if(s.ep)return;s.ep=!0;const a=i(s);fetch(s.href,a)}})();const Ct="modulepreload",St=function(t){return"/app/"+t},qe={},b=function(e,i,r){let s=Promise.resolve();if(i&&i.length>0){let c=function(d){return Promise.all(d.map(p=>Promise.resolve(p).then(h=>({status:"fulfilled",value:h}),h=>({status:"rejected",reason:h}))))};document.getElementsByTagName("link");const n=document.querySelector("meta[property=csp-nonce]"),l=n?.nonce||n?.getAttribute("nonce");s=c(i.map(d=>{if(d=St(d),d in qe)return;qe[d]=!0;const p=d.endsWith(".css"),h=p?'[rel="stylesheet"]':"";if(document.querySelector(`link[href="${d}"]${h}`))return;const m=document.createElement("link");if(m.rel=p?"stylesheet":Ct,p||(m.as="script"),m.crossOrigin="",m.href=d,l&&m.setAttribute("nonce",l),document.head.appendChild(m),p)return new Promise((f,T)=>{m.addEventListener("load",f),m.addEventListener("error",()=>T(new Error(`Unable to preload CSS for ${d}`)))})}))}function a(n){const l=new Event("vite:preloadError",{cancelable:!0});if(l.payload=n,window.dispatchEvent(l),!l.defaultPrevented)throw n}return s.then(n=>{for(const l of n||[])l.status==="rejected"&&a(l.reason);return e().catch(a)})};const xe=globalThis,Re=xe.ShadowRoot&&(xe.ShadyCSS===void 0||xe.ShadyCSS.nativeShadow)&&"adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.prototype,ze=Symbol(),Fe=new WeakMap;let ht=class{constructor(e,i,r){if(this._$cssResult$=!0,r!==ze)throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");this.cssText=e,this.t=i}get styleSheet(){let e=this.o;const i=this.t;if(Re&&e===void 0){const r=i!==void 0&&i.length===1;r&&(e=Fe.get(i)),e===void 0&&((this.o=e=new CSSStyleSheet).replaceSync(this.cssText),r&&Fe.set(i,e))}return e}toString(){return this.cssText}};const Et=t=>new ht(typeof t=="string"?t:t+"",void 0,ze),S=(t,...e)=>{const i=t.length===1?t[0]:e.reduce((r,s,a)=>r+(n=>{if(n._$cssResult$===!0)return n.cssText;if(typeof n=="number")return n;throw Error("Value passed to 'css' function must be a 'css' function result: "+n+". Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security.")})(s)+t[a+1],t[0]);return new ht(i,t,ze)},At=(t,e)=>{if(Re)t.adoptedStyleSheets=e.map(i=>i instanceof CSSStyleSheet?i:i.styleSheet);else for(const i of e){const r=document.createElement("style"),s=xe.litNonce;s!==void 0&&r.setAttribute("nonce",s),r.textContent=i.cssText,t.appendChild(r)}},Ge=Re?t=>t:t=>t instanceof CSSStyleSheet?(e=>{let i="";for(const r of e.cssRules)i+=r.cssText;return Et(i)})(t):t;const{is:Tt,defineProperty:Ot,getOwnPropertyDescriptor:Pt,getOwnPropertyNames:Dt,getOwnPropertySymbols:It,getPrototypeOf:Rt}=Object,Se=globalThis,We=Se.trustedTypes,zt=We?We.emptyScript:"",Mt=Se.reactiveElementPolyfillSupport,he=(t,e)=>t,ke={toAttribute(t,e){switch(e){case Boolean:t=t?zt:null;break;case Object:case Array:t=t==null?t:JSON.stringify(t)}return t},fromAttribute(t,e){let i=t;switch(e){case Boolean:i=t!==null;break;case Number:i=t===null?null:Number(t);break;case Object:case Array:try{i=JSON.parse(t)}catch{i=null}}return i}},Me=(t,e)=>!Tt(t,e),Je={attribute:!0,type:String,converter:ke,reflect:!1,useDefault:!1,hasChanged:Me};Symbol.metadata??=Symbol("metadata"),Se.litPropertyMetadata??=new WeakMap;let re=class extends HTMLElement{static addInitializer(e){this._$Ei(),(this.l??=[]).push(e)}static get observedAttributes(){return this.finalize(),this._$Eh&&[...this._$Eh.keys()]}static createProperty(e,i=Je){if(i.state&&(i.attribute=!1),this._$Ei(),this.prototype.hasOwnProperty(e)&&((i=Object.create(i)).wrapped=!0),this.elementProperties.set(e,i),!i.noAccessor){const r=Symbol(),s=this.getPropertyDescriptor(e,r,i);s!==void 0&&Ot(this.prototype,e,s)}}static getPropertyDescriptor(e,i,r){const{get:s,set:a}=Pt(this.prototype,e)??{get(){return this[i]},set(n){this[i]=n}};return{get:s,set(n){const l=s?.call(this);a?.call(this,n),this.requestUpdate(e,l,r)},configurable:!0,enumerable:!0}}static getPropertyOptions(e){return this.elementProperties.get(e)??Je}static _$Ei(){if(this.hasOwnProperty(he("elementProperties")))return;const e=Rt(this);e.finalize(),e.l!==void 0&&(this.l=[...e.l]),this.elementProperties=new Map(e.elementProperties)}static finalize(){if(this.hasOwnProperty(he("finalized")))return;if(this.finalized=!0,this._$Ei(),this.hasOwnProperty(he("properties"))){const i=this.properties,r=[...Dt(i),...It(i)];for(const s of r)this.createProperty(s,i[s])}const e=this[Symbol.metadata];if(e!==null){const i=litPropertyMetadata.get(e);if(i!==void 0)for(const[r,s]of i)this.elementProperties.set(r,s)}this._$Eh=new Map;for(const[i,r]of this.elementProperties){const s=this._$Eu(i,r);s!==void 0&&this._$Eh.set(s,i)}this.elementStyles=this.finalizeStyles(this.styles)}static finalizeStyles(e){const i=[];if(Array.isArray(e)){const r=new Set(e.flat(1/0).reverse());for(const s of r)i.unshift(Ge(s))}else e!==void 0&&i.push(Ge(e));return i}static _$Eu(e,i){const r=i.attribute;return r===!1?void 0:typeof r=="string"?r:typeof e=="string"?e.toLowerCase():void 0}constructor(){super(),this._$Ep=void 0,this.isUpdatePending=!1,this.hasUpdated=!1,this._$Em=null,this._$Ev()}_$Ev(){this._$ES=new Promise(e=>this.enableUpdating=e),this._$AL=new Map,this._$E_(),this.requestUpdate(),this.constructor.l?.forEach(e=>e(this))}addController(e){(this._$EO??=new Set).add(e),this.renderRoot!==void 0&&this.isConnected&&e.hostConnected?.()}removeController(e){this._$EO?.delete(e)}_$E_(){const e=new Map,i=this.constructor.elementProperties;for(const r of i.keys())this.hasOwnProperty(r)&&(e.set(r,this[r]),delete this[r]);e.size>0&&(this._$Ep=e)}createRenderRoot(){const e=this.shadowRoot??this.attachShadow(this.constructor.shadowRootOptions);return At(e,this.constructor.elementStyles),e}connectedCallback(){this.renderRoot??=this.createRenderRoot(),this.enableUpdating(!0),this._$EO?.forEach(e=>e.hostConnected?.())}enableUpdating(e){}disconnectedCallback(){this._$EO?.forEach(e=>e.hostDisconnected?.())}attributeChangedCallback(e,i,r){this._$AK(e,r)}_$ET(e,i){const r=this.constructor.elementProperties.get(e),s=this.constructor._$Eu(e,r);if(s!==void 0&&r.reflect===!0){const a=(r.converter?.toAttribute!==void 0?r.converter:ke).toAttribute(i,r.type);this._$Em=e,a==null?this.removeAttribute(s):this.setAttribute(s,a),this._$Em=null}}_$AK(e,i){const r=this.constructor,s=r._$Eh.get(e);if(s!==void 0&&this._$Em!==s){const a=r.getPropertyOptions(s),n=typeof a.converter=="function"?{fromAttribute:a.converter}:a.converter?.fromAttribute!==void 0?a.converter:ke;this._$Em=s;const l=n.fromAttribute(i,a.type);this[s]=l??this._$Ej?.get(s)??l,this._$Em=null}}requestUpdate(e,i,r,s=!1,a){if(e!==void 0){const n=this.constructor;if(s===!1&&(a=this[e]),r??=n.getPropertyOptions(e),!((r.hasChanged??Me)(a,i)||r.useDefault&&r.reflect&&a===this._$Ej?.get(e)&&!this.hasAttribute(n._$Eu(e,r))))return;this.C(e,i,r)}this.isUpdatePending===!1&&(this._$ES=this._$EP())}C(e,i,{useDefault:r,reflect:s,wrapped:a},n){r&&!(this._$Ej??=new Map).has(e)&&(this._$Ej.set(e,n??i??this[e]),a!==!0||n!==void 0)||(this._$AL.has(e)||(this.hasUpdated||r||(i=void 0),this._$AL.set(e,i)),s===!0&&this._$Em!==e&&(this._$Eq??=new Set).add(e))}async _$EP(){this.isUpdatePending=!0;try{await this._$ES}catch(i){Promise.reject(i)}const e=this.scheduleUpdate();return e!=null&&await e,!this.isUpdatePending}scheduleUpdate(){return this.performUpdate()}performUpdate(){if(!this.isUpdatePending)return;if(!this.hasUpdated){if(this.renderRoot??=this.createRenderRoot(),this._$Ep){for(const[s,a]of this._$Ep)this[s]=a;this._$Ep=void 0}const r=this.constructor.elementProperties;if(r.size>0)for(const[s,a]of r){const{wrapped:n}=a,l=this[s];n!==!0||this._$AL.has(s)||l===void 0||this.C(s,void 0,a,l)}}let e=!1;const i=this._$AL;try{e=this.shouldUpdate(i),e?(this.willUpdate(i),this._$EO?.forEach(r=>r.hostUpdate?.()),this.update(i)):this._$EM()}catch(r){throw e=!1,this._$EM(),r}e&&this._$AE(i)}willUpdate(e){}_$AE(e){this._$EO?.forEach(i=>i.hostUpdated?.()),this.hasUpdated||(this.hasUpdated=!0,this.firstUpdated(e)),this.updated(e)}_$EM(){this._$AL=new Map,this.isUpdatePending=!1}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this._$ES}shouldUpdate(e){return!0}update(e){this._$Eq&&=this._$Eq.forEach(i=>this._$ET(i,this[i])),this._$EM()}updated(e){}firstUpdated(e){}};re.elementStyles=[],re.shadowRootOptions={mode:"open"},re[he("elementProperties")]=new Map,re[he("finalized")]=new Map,Mt?.({ReactiveElement:re}),(Se.reactiveElementVersions??=[]).push("2.1.2");const Le=globalThis,Xe=t=>t,Ce=Le.trustedTypes,Ye=Ce?Ce.createPolicy("lit-html",{createHTML:t=>t}):void 0,ut="$lit$",q=`lit$${Math.random().toFixed(9).slice(2)}$`,vt="?"+q,Lt=`<${vt}>`,X=document,ue=()=>X.createComment(""),ve=t=>t===null||typeof t!="object"&&typeof t!="function",Ue=Array.isArray,Ut=t=>Ue(t)||typeof t?.[Symbol.iterator]=="function",Pe=`[ 	
+\f\r]`,de=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,Ze=/-->/g,Qe=/>/g,G=RegExp(`>|${Pe}(?:([^\\s"'>=/]+)(${Pe}*=${Pe}*(?:[^ 	
+\f\r"'\`<>=]|("|')|))|$)`,"g"),et=/'/g,tt=/"/g,mt=/^(?:script|style|textarea|title)$/i,gt=t=>(e,...i)=>({_$litType$:t,strings:e,values:i}),o=gt(1),W=gt(2),ne=Symbol.for("lit-noChange"),g=Symbol.for("lit-nothing"),it=new WeakMap,J=X.createTreeWalker(X,129);function ft(t,e){if(!Ue(t)||!t.hasOwnProperty("raw"))throw Error("invalid template strings array");return Ye!==void 0?Ye.createHTML(e):e}const Nt=(t,e)=>{const i=t.length-1,r=[];let s,a=e===2?"<svg>":e===3?"<math>":"",n=de;for(let l=0;l<i;l++){const c=t[l];let d,p,h=-1,m=0;for(;m<c.length&&(n.lastIndex=m,p=n.exec(c),p!==null);)m=n.lastIndex,n===de?p[1]==="!--"?n=Ze:p[1]!==void 0?n=Qe:p[2]!==void 0?(mt.test(p[2])&&(s=RegExp("</"+p[2],"g")),n=G):p[3]!==void 0&&(n=G):n===G?p[0]===">"?(n=s??de,h=-1):p[1]===void 0?h=-2:(h=n.lastIndex-p[2].length,d=p[1],n=p[3]===void 0?G:p[3]==='"'?tt:et):n===tt||n===et?n=G:n===Ze||n===Qe?n=de:(n=G,s=void 0);const f=n===G&&t[l+1].startsWith("/>")?" ":"";a+=n===de?c+Lt:h>=0?(r.push(d),c.slice(0,h)+ut+c.slice(h)+q+f):c+q+(h===-2?l:f)}return[ft(t,a+(t[i]||"<?>")+(e===2?"</svg>":e===3?"</math>":"")),r]};class me{constructor({strings:e,_$litType$:i},r){let s;this.parts=[];let a=0,n=0;const l=e.length-1,c=this.parts,[d,p]=Nt(e,i);if(this.el=me.createElement(d,r),J.currentNode=this.el.content,i===2||i===3){const h=this.el.content.firstChild;h.replaceWith(...h.childNodes)}for(;(s=J.nextNode())!==null&&c.length<l;){if(s.nodeType===1){if(s.hasAttributes())for(const h of s.getAttributeNames())if(h.endsWith(ut)){const m=p[n++],f=s.getAttribute(h).split(q),T=/([.?@])?(.*)/.exec(m);c.push({type:1,index:a,name:T[2],strings:f,ctor:T[1]==="."?Ht:T[1]==="?"?jt:T[1]==="@"?Bt:Ee}),s.removeAttribute(h)}else h.startsWith(q)&&(c.push({type:6,index:a}),s.removeAttribute(h));if(mt.test(s.tagName)){const h=s.textContent.split(q),m=h.length-1;if(m>0){s.textContent=Ce?Ce.emptyScript:"";for(let f=0;f<m;f++)s.append(h[f],ue()),J.nextNode(),c.push({type:2,index:++a});s.append(h[m],ue())}}}else if(s.nodeType===8)if(s.data===vt)c.push({type:2,index:a});else{let h=-1;for(;(h=s.data.indexOf(q,h+1))!==-1;)c.push({type:7,index:a}),h+=q.length-1}a++}}static createElement(e,i){const r=X.createElement("template");return r.innerHTML=e,r}}function ae(t,e,i=t,r){if(e===ne)return e;let s=r!==void 0?i._$Co?.[r]:i._$Cl;const a=ve(e)?void 0:e._$litDirective$;return s?.constructor!==a&&(s?._$AO?.(!1),a===void 0?s=void 0:(s=new a(t),s._$AT(t,i,r)),r!==void 0?(i._$Co??=[])[r]=s:i._$Cl=s),s!==void 0&&(e=ae(t,s._$AS(t,e.values),s,r)),e}class Vt{constructor(e,i){this._$AV=[],this._$AN=void 0,this._$AD=e,this._$AM=i}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}u(e){const{el:{content:i},parts:r}=this._$AD,s=(e?.creationScope??X).importNode(i,!0);J.currentNode=s;let a=J.nextNode(),n=0,l=0,c=r[0];for(;c!==void 0;){if(n===c.index){let d;c.type===2?d=new le(a,a.nextSibling,this,e):c.type===1?d=new c.ctor(a,c.name,c.strings,this,e):c.type===6&&(d=new Kt(a,this,e)),this._$AV.push(d),c=r[++l]}n!==c?.index&&(a=J.nextNode(),n++)}return J.currentNode=X,s}p(e){let i=0;for(const r of this._$AV)r!==void 0&&(r.strings!==void 0?(r._$AI(e,r,i),i+=r.strings.length-2):r._$AI(e[i])),i++}}class le{get _$AU(){return this._$AM?._$AU??this._$Cv}constructor(e,i,r,s){this.type=2,this._$AH=g,this._$AN=void 0,this._$AA=e,this._$AB=i,this._$AM=r,this.options=s,this._$Cv=s?.isConnected??!0}get parentNode(){let e=this._$AA.parentNode;const i=this._$AM;return i!==void 0&&e?.nodeType===11&&(e=i.parentNode),e}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(e,i=this){e=ae(this,e,i),ve(e)?e===g||e==null||e===""?(this._$AH!==g&&this._$AR(),this._$AH=g):e!==this._$AH&&e!==ne&&this._(e):e._$litType$!==void 0?this.$(e):e.nodeType!==void 0?this.T(e):Ut(e)?this.k(e):this._(e)}O(e){return this._$AA.parentNode.insertBefore(e,this._$AB)}T(e){this._$AH!==e&&(this._$AR(),this._$AH=this.O(e))}_(e){this._$AH!==g&&ve(this._$AH)?this._$AA.nextSibling.data=e:this.T(X.createTextNode(e)),this._$AH=e}$(e){const{values:i,_$litType$:r}=e,s=typeof r=="number"?this._$AC(e):(r.el===void 0&&(r.el=me.createElement(ft(r.h,r.h[0]),this.options)),r);if(this._$AH?._$AD===s)this._$AH.p(i);else{const a=new Vt(s,this),n=a.u(this.options);a.p(i),this.T(n),this._$AH=a}}_$AC(e){let i=it.get(e.strings);return i===void 0&&it.set(e.strings,i=new me(e)),i}k(e){Ue(this._$AH)||(this._$AH=[],this._$AR());const i=this._$AH;let r,s=0;for(const a of e)s===i.length?i.push(r=new le(this.O(ue()),this.O(ue()),this,this.options)):r=i[s],r._$AI(a),s++;s<i.length&&(this._$AR(r&&r._$AB.nextSibling,s),i.length=s)}_$AR(e=this._$AA.nextSibling,i){for(this._$AP?.(!1,!0,i);e!==this._$AB;){const r=Xe(e).nextSibling;Xe(e).remove(),e=r}}setConnected(e){this._$AM===void 0&&(this._$Cv=e,this._$AP?.(e))}}class Ee{get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}constructor(e,i,r,s,a){this.type=1,this._$AH=g,this._$AN=void 0,this.element=e,this.name=i,this._$AM=s,this.options=a,r.length>2||r[0]!==""||r[1]!==""?(this._$AH=Array(r.length-1).fill(new String),this.strings=r):this._$AH=g}_$AI(e,i=this,r,s){const a=this.strings;let n=!1;if(a===void 0)e=ae(this,e,i,0),n=!ve(e)||e!==this._$AH&&e!==ne,n&&(this._$AH=e);else{const l=e;let c,d;for(e=a[0],c=0;c<a.length-1;c++)d=ae(this,l[r+c],i,c),d===ne&&(d=this._$AH[c]),n||=!ve(d)||d!==this._$AH[c],d===g?e=g:e!==g&&(e+=(d??"")+a[c+1]),this._$AH[c]=d}n&&!s&&this.j(e)}j(e){e===g?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,e??"")}}class Ht extends Ee{constructor(){super(...arguments),this.type=3}j(e){this.element[this.name]=e===g?void 0:e}}class jt extends Ee{constructor(){super(...arguments),this.type=4}j(e){this.element.toggleAttribute(this.name,!!e&&e!==g)}}class Bt extends Ee{constructor(e,i,r,s,a){super(e,i,r,s,a),this.type=5}_$AI(e,i=this){if((e=ae(this,e,i,0)??g)===ne)return;const r=this._$AH,s=e===g&&r!==g||e.capture!==r.capture||e.once!==r.once||e.passive!==r.passive,a=e!==g&&(r===g||s);s&&this.element.removeEventListener(this.name,this,r),a&&this.element.addEventListener(this.name,this,e),this._$AH=e}handleEvent(e){typeof this._$AH=="function"?this._$AH.call(this.options?.host??this.element,e):this._$AH.handleEvent(e)}}class Kt{constructor(e,i,r){this.element=e,this.type=6,this._$AN=void 0,this._$AM=i,this.options=r}get _$AU(){return this._$AM._$AU}_$AI(e){ae(this,e)}}const fs={I:le},qt=Le.litHtmlPolyfillSupport;qt?.(me,le),(Le.litHtmlVersions??=[]).push("3.3.2");const Ft=(t,e,i)=>{const r=i?.renderBefore??e;let s=r._$litPart$;if(s===void 0){const a=i?.renderBefore??null;r._$litPart$=s=new le(e.insertBefore(ue(),a),a,void 0,i??{})}return s._$AI(t),s};const Ne=globalThis;class x extends re{constructor(){super(...arguments),this.renderOptions={host:this},this._$Do=void 0}createRenderRoot(){const e=super.createRenderRoot();return this.renderOptions.renderBefore??=e.firstChild,e}update(e){const i=this.render();this.hasUpdated||(this.renderOptions.isConnected=this.isConnected),super.update(e),this._$Do=Ft(i,this.renderRoot,this.renderOptions)}connectedCallback(){super.connectedCallback(),this._$Do?.setConnected(!0)}disconnectedCallback(){super.disconnectedCallback(),this._$Do?.setConnected(!1)}render(){return ne}}x._$litElement$=!0,x.finalized=!0,Ne.litElementHydrateSupport?.({LitElement:x});const Gt=Ne.litElementPolyfillSupport;Gt?.({LitElement:x});(Ne.litElementVersions??=[]).push("4.2.2");const A=t=>(e,i)=>{i!==void 0?i.addInitializer(()=>{customElements.define(t,e)}):customElements.define(t,e)};const Wt={attribute:!0,type:String,converter:ke,reflect:!1,hasChanged:Me},Jt=(t=Wt,e,i)=>{const{kind:r,metadata:s}=i;let a=globalThis.litPropertyMetadata.get(s);if(a===void 0&&globalThis.litPropertyMetadata.set(s,a=new Map),r==="setter"&&((t=Object.create(t)).wrapped=!0),a.set(i.name,t),r==="accessor"){const{name:n}=i;return{set(l){const c=e.get.call(this);e.set.call(this,l),this.requestUpdate(n,c,t,!0,l)},init(l){return l!==void 0&&this.C(n,void 0,t,l),l}}}if(r==="setter"){const{name:n}=i;return function(l){const c=this[n];e.call(this,l),this.requestUpdate(n,c,t,!0,l)}}throw Error("Unsupported decorator location: "+r)};function u(t){return(e,i)=>typeof i=="object"?Jt(t,e,i):((r,s,a)=>{const n=s.hasOwnProperty(a);return s.constructor.createProperty(a,r),n?Object.getOwnPropertyDescriptor(s,a):void 0})(t,e,i)}function v(t){return u({...t,state:!0,attribute:!1})}function st(t,e,i){const r={Authorization:`Bearer ${e}`,"Content-Type":"application/json"};async function s(n,l){const c=`${t}${n}`,d=await fetch(c,{...l,headers:{...r,...l?.headers}});if(!d.ok){const p=await d.text(),m=(p.length>200?p.slice(0,200)+"...":p).replace(/https?:\/\/[^\s"')]+/g,"[URL]").replace(/[A-Za-z0-9_-]{20,}/g,"[REDACTED]");throw new Error(`Request failed (${d.status}): ${m}`)}return d.json()}async function a(n,l){const c=`${t}${n}`,d=await fetch(c,{...l,headers:{...r,...l?.headers}});if(!d.ok){const p=await d.text(),m=(p.length>200?p.slice(0,200)+"...":p).replace(/https?:\/\/[^\s"')]+/g,"[URL]").replace(/[A-Za-z0-9_-]{20,}/g,"[REDACTED]");throw new Error(`Request failed (${d.status}): ${m}`)}return d.text()}return{async getAgents(){const n=await s("/api/agents"),l=n.agents??n.routing?.agents??[];return Array.isArray(l)?l:Object.entries(n).map(([c,d])=>({id:c,provider:d.provider??"unknown",model:d.model??"unknown",status:"active"}))},async getChannels(){const n=await s("/api/channels"),l=n.channels??[];return Array.isArray(l)?l:Object.entries(n).map(([c,d])=>({type:d.type??c,name:c,enabled:d.enabled??!1,status:d.enabled?"healthy":"disconnected"}))},async getActivity(n=50){return(await s(`/api/activity?limit=${n}`)).entries??[]},async searchMemory(n,l=10){return(await s(`/api/memory/search?q=${encodeURIComponent(n)}&limit=${l}`)).results??[]},async getMemoryStats(){return s("/api/memory/stats")},async chat(n,l,c){return s("/api/chat",{method:"POST",body:JSON.stringify({message:n,agentId:l,sessionKey:c})})},async getChatHistory(){return(await s("/api/chat/history")).messages??[]},async health(){return(await fetch(`${t}/api/health`)).json()},subscribeEvents(n){const l=`${t}/api/events?token=${encodeURIComponent(e)}`,c=new EventSource(l);c.onmessage=p=>{try{const h=JSON.parse(p.data);n("message",h)}catch{n("message",p.data)}};const d=["message:received","message:sent","message:streaming","session:created","session:expired","audit:event","skill:executed","scheduler:job_completed","scheduler:heartbeat_check","system:error","ping"];for(const p of d)c.addEventListener(p,(h=>{try{const m=h.data?JSON.parse(h.data):{};n(p,m)}catch{n(p,h.data)}}));return c.onerror=()=>{n("error",{message:"SSE connection error"})},()=>{c.close()}},async browseMemory(n){if(i)return i("memory.browse",n);const l=new URLSearchParams;n.offset!==void 0&&l.set("offset",String(n.offset)),n.limit!==void 0&&l.set("limit",String(n.limit)),n.type&&l.set("type",n.type),n.trust&&l.set("trust",n.trust),n.agentId&&l.set("agentId",n.agentId),n.from!==void 0&&l.set("from",String(n.from)),n.to!==void 0&&l.set("to",String(n.to));const c=l.toString();return s(`/api/memory/browse${c?`?${c}`:""}`)},async deleteMemory(n){if(i){await i("memory.delete",{id:n});return}await s(`/api/memory/${encodeURIComponent(n)}`,{method:"DELETE"})},async deleteMemoryBulk(n){return i?i("memory.delete",{ids:n}):s("/api/memory/bulk-delete",{method:"POST",body:JSON.stringify({ids:n})})},async exportMemory(n){return i?i("memory.export",n?{ids:n}:{}):a("/api/memory/export",{method:"POST",body:JSON.stringify({ids:n})})},async listSessions(n){if(i)return((await i("session.list",n??{})).sessions??[]).map(p=>{const h=String(p.sessionKey??p.key??"");let m="unknown";const f=h.split(":");return f[0]==="agent"&&f.length>=3&&(m=f[1]??"unknown"),{key:h,agentId:String(p.agentId??m),channelType:String(p.kind??p.channelType??"unknown"),messageCount:Number(p.messageCount??0),totalTokens:Number(p.totalTokens??0),inputTokens:Number(p.inputTokens??0),outputTokens:Number(p.outputTokens??0),toolCalls:Number(p.toolCalls??0),compactions:Number(p.compactions??0),resetCount:Number(p.resetCount??0),createdAt:Number(p.createdAt??Date.now()),lastActiveAt:Number(p.updatedAt??p.lastActiveAt??Date.now())}});const l=new URLSearchParams;n?.agentId&&l.set("agentId",n.agentId),n?.channelType&&l.set("channelType",n.channelType),n?.search&&l.set("search",n.search);const c=l.toString();return s(`/api/sessions${c?`?${c}`:""}`)},async getSessionDetail(n){return i?i("session.history",{session_key:n}):s(`/api/sessions/${encodeURIComponent(n)}`)},async resetSession(n){if(i){await i("session.reset",{session_key:n});return}await s(`/api/sessions/${encodeURIComponent(n)}/reset`,{method:"POST"})},async compactSession(n){if(i){await i("session.compact",{session_key:n});return}await s(`/api/sessions/${encodeURIComponent(n)}/compact`,{method:"POST"})},async deleteSession(n){if(i){await i("session.delete",{session_key:n});return}await s(`/api/sessions/${encodeURIComponent(n)}`,{method:"DELETE"})},async exportSession(n){return i?i("session.export",{session_key:n}):a(`/api/sessions/${encodeURIComponent(n)}/export`)},async resetSessionsBulk(n){return i?i("session.reset",{keys:n}):s("/api/sessions/bulk-reset",{method:"POST",body:JSON.stringify({keys:n})})},async exportSessionsBulk(n){return i?i("session.export",{keys:n}):a("/api/sessions/bulk-export",{method:"POST",body:JSON.stringify({keys:n})})},async deleteSessionsBulk(n){return i?i("session.delete",{keys:n}):s("/api/sessions/bulk-delete",{method:"POST",body:JSON.stringify({keys:n})})}}}const Xt=[{pattern:"dashboard",view:"ic-dashboard"},{pattern:"agents",view:"ic-agent-list"},{pattern:"agents/:id",view:"ic-agent-detail"},{pattern:"agents/:id/edit",view:"ic-agent-editor"},{pattern:"agents/:id/workspace",view:"ic-workspace-manager"},{pattern:"channels",view:"ic-channel-list"},{pattern:"channels/:type",view:"ic-channel-detail"},{pattern:"messages",view:"ic-message-center"},{pattern:"messages/:type",view:"ic-message-center"},{pattern:"skills",view:"ic-skills-view"},{pattern:"mcp",view:"ic-mcp-management"},{pattern:"chat",view:"ic-chat-console"},{pattern:"chat/:sessionKey",view:"ic-chat-console"},{pattern:"memory",view:"ic-memory-inspector"},{pattern:"sessions",view:"ic-session-list-view"},{pattern:"sessions/:key",view:"ic-session-detail"},{pattern:"scheduler",view:"ic-scheduler-view"},{pattern:"scheduler/:jobId",view:"ic-scheduler-view"},{pattern:"models",view:"ic-models-view"},{pattern:"observe/overview",view:"ic-observe-dashboard"},{pattern:"observe/context",view:"ic-context-engine-view"},{pattern:"observe/billing",view:"ic-billing-view"},{pattern:"observe/delivery",view:"ic-delivery-view"},{pattern:"observe/diagnostics",view:"ic-diagnostics-view"},{pattern:"context",view:"ic-context-dag-browser"},{pattern:"subagents",view:"ic-subagents-view"},{pattern:"media",view:"ic-media-test-view"},{pattern:"media/config",view:"ic-media-config-view"},{pattern:"security",view:"ic-security-view"},{pattern:"approvals",view:"ic-approvals-view"},{pattern:"config",view:"ic-config-editor"},{pattern:"setup",view:"ic-setup-wizard"},{pattern:"pipelines",view:"ic-pipeline-list"},{pattern:"pipelines/new",view:"ic-pipeline-builder"},{pattern:"pipelines/history",view:"ic-pipeline-history"},{pattern:"pipelines/history/:graphId",view:"ic-pipeline-history-detail"},{pattern:"pipelines/:graphId",view:"ic-pipeline-monitor"},{pattern:"pipelines/:graphId/edit",view:"ic-pipeline-builder"}];function Yt(){return Xt.map(t=>{const e=t.pattern.split("/");return{pattern:t.pattern,view:t.view,segments:e,segmentCount:e.length}}).sort((t,e)=>e.segmentCount-t.segmentCount)}const De={view:"ic-dashboard",route:"dashboard",params:{},query:{}};function rt(t,e){const i=t.split("/");for(const r of e){if(i.length!==r.segmentCount)continue;const s={};let a=!0;for(let n=0;n<r.segments.length;n++){const l=r.segments[n],c=i[n];if(l.startsWith(":"))s[l.slice(1)]=c;else if(l!==c){a=!1;break}}if(a)return{view:r.view,route:r.pattern,params:s,query:{}}}return null}const Zt=[{from:"observe",to:"observe/overview"}];function Qt(t,e="dashboard"){const i=Yt();function r(){const a=window.location.hash.replace(/^#\/?/,"");if(!a)return{...De};const n=a.indexOf("?"),l=n>=0?a.slice(0,n):a,c=n>=0?a.slice(n+1):"",d={};if(c)for(const h of c.split("&")){const m=h.indexOf("=");if(m>=0){const f=decodeURIComponent(h.slice(0,m)),T=decodeURIComponent(h.slice(m+1));f&&(d[f]=T)}else h&&(d[decodeURIComponent(h)]="")}for(const h of Zt)if(l===h.from){const m=c?`#/${h.to}?${c}`:`#/${h.to}`;history.replaceState(null,"",m);const f=rt(h.to,i);return f?{...f,query:d}:{...De,query:d}}const p=rt(l,i);return p?{...p,query:d}:{...De,query:d}}function s(){const a=r();t(a)}return{navigate(a){window.location.hash=`#/${a}`},current(){return r()},start(){window.addEventListener("hashchange",s),s()},stop(){window.removeEventListener("hashchange",s)},setQuery(a){const n=r(),l={...n.query,...a},d=Object.entries(l).filter(([,h])=>h!=="").map(([h,m])=>`${encodeURIComponent(h)}=${encodeURIComponent(m)}`).join("&"),p=d?`#/${n.route}?${d}`:`#/${n.route}`;history.replaceState(null,"",p)}}}const Ie=3e4,ei=3e4,ti=1e4,ii=1e3,si=3e4,ri=10;function ni(){let t=null,e="disconnected",i=1,r=0,s=null,a=null,n=null,l="",c="",d=!1;const p=new Map,h=new Set,m=new Set;function f(w){if(e!==w){e=w;for(const D of h)D(w)}}function T(){a!==null&&(clearInterval(a),a=null),n!==null&&(clearTimeout(n),n=null)}function $t(){s!==null&&(clearTimeout(s),s=null)}function Be(w){for(const[D,se]of p)clearTimeout(se.timer),se.reject(new Error(w)),p.delete(D)}function xt(){T(),a=setInterval(()=>{if(t===null||t.readyState!==globalThis.WebSocket.OPEN)return;const w=i++;t.send(JSON.stringify({jsonrpc:"2.0",method:"system.ping",id:w})),n=setTimeout(()=>{p.delete(w),t!==null&&t.close()},ti),p.set(w,{resolve:()=>{n!==null&&(clearTimeout(n),n=null)},reject:()=>{n!==null&&(clearTimeout(n),n=null)},timer:setTimeout(()=>{p.delete(w)},Ie)})},ei)}function kt(){if(d)return;if(r>=ri){f("disconnected");return}f("reconnecting");const w=Math.min(ii*Math.pow(2,r),si);r++,s=setTimeout(()=>{Ke(l,c)},w)}function Ke(w,D){const se=`${w}?token=${encodeURIComponent(D)}`;t=new globalThis.WebSocket(se),t.onopen=()=>{r=0,f("connected"),xt()},t.onmessage=M=>{let C;try{C=JSON.parse(M.data)}catch{return}if(!(C.method==="heartbeat"&&C.id==null)){if(C.method&&C.id==null){console.debug("[rpc] notification received:",C.method);for(const U of m)try{U(C.method,C.params)}catch(Te){console.warn("[rpc] notification handler error:",Te)}return}if(C.id!=null){const U=p.get(C.id);U&&(clearTimeout(U.timer),p.delete(C.id),C.error?U.reject(new Error(`RPC error (${C.error.code}): ${C.error.message}`)):U.resolve(C.result))}}},t.onclose=M=>{if(T(),t=null,M.code>=4e3&&M.code<5e3){Be("Connection rejected: "+(M.reason||"auth error")),f("disconnected");return}d||kt()},t.onerror=()=>{}}return{get status(){return e},connect(w,D){d=!1,l=w,c=D,r=0,Ke(w,D)},disconnect(){d=!0,$t(),T(),Be("Client disconnected"),f("disconnected"),t!==null&&(t.close(),t=null)},call(w,D){return new Promise((se,M)=>{if(t===null||t.readyState!==globalThis.WebSocket.OPEN){M(new Error("Not connected"));return}const C=i++,U=setTimeout(()=>{p.delete(C),M(new Error(`RPC request timed out after ${Ie}ms`))},Ie);p.set(C,{resolve:se,reject:M,timer:U});const Te=JSON.stringify({jsonrpc:"2.0",method:w,...D!==void 0?{params:D}:{},id:C});try{t.send(Te)}catch(Oe){clearTimeout(U),p.delete(C),M(new Error("Send failed: "+(Oe instanceof Error?Oe.message:String(Oe))))}})},onStatusChange(w){return h.add(w),()=>{h.delete(w)}},onNotification(w){return m.add(w),()=>{m.delete(w)}}}}function ai(){let e={...{connectionStatus:"disconnected",pendingApprovals:0,errorCount:0,agentCount:0,channelCount:0,sessionCount:0,systemHealth:null,activeAgents:[],activeChannels:[]}};const i=new Set;function r(){for(const s of i)s()}return{get connectionStatus(){return e.connectionStatus},get pendingApprovals(){return e.pendingApprovals},get errorCount(){return e.errorCount},get agentCount(){return e.agentCount},get channelCount(){return e.channelCount},get sessionCount(){return e.sessionCount},get systemHealth(){return e.systemHealth},get activeAgents(){return e.activeAgents},get activeChannels(){return e.activeChannels},subscribe(s){return i.add(s),()=>{i.delete(s)}},getSnapshot(){return Object.freeze({...e})},update(s){e={...e,...s},r()}}}const oi=["message:received","message:sent","message:streaming","session:created","session:expired","audit:event","skill:executed","skill:rejected","observability:metrics","observability:token_usage","scheduler:job_started","scheduler:job_completed","scheduler:heartbeat_check","scheduler:heartbeat_alert","scheduler:heartbeat_delivered","scheduler:task_extracted","system:error","approval:requested","approval:resolved","graph:started","graph:node_updated","graph:completed","config:patched","diagnostic:channel_health","diagnostic:billing_snapshot","skill:loaded","skill:registry_reset","model:catalog_loaded","observability:reset","channel:registered","channel:deregistered","agent:hot_added","agent:hot_removed","security:injection_detected","security:injection_rate_exceeded","security:memory_tainted","security:warn","secret:accessed","secret:modified","model:fallback_attempt","model:fallback_exhausted","model:auth_cooldown","provider:degraded","provider:recovered","session:sub_agent_spawned","session:sub_agent_completed","session:sub_agent_archived","session:sub_agent_spawn_rejected","session:sub_agent_spawn_started","session:sub_agent_spawn_queued","session:sub_agent_lifecycle_ended","ping"];function li(){let t=null,e=!1;const i=new Map;function r(a){if(!a)return{};try{return JSON.parse(a)}catch{return a}}function s(a,n){const l=i.get(a);if(l)for(const c of l)c(n);document.dispatchEvent(new CustomEvent(a,{detail:n}))}return{get connected(){return e},start(a,n){t!==null&&t.close();const l=`${a}/api/events?token=${encodeURIComponent(n)}`;t=new EventSource(l),t.onopen=()=>{e=!0},t.onerror=()=>{e=!1};for(const c of oi)t.addEventListener(c,(d=>{const p=r(d.data);s(c,p)}));t.onmessage=c=>{const d=r(c.data);s("message",d)}},stop(){t!==null&&(t.close(),t=null),e=!1,i.clear()},addEventListener(a,n){return i.has(a)||i.set(a,new Set),i.get(a).add(n),()=>{const l=i.get(a);l&&(l.delete(n),l.size===0&&i.delete(a))}}}}class ci{constructor(e,i,r,s=3e4){this._timer=null,this._host=e,this._rpcClient=i,this._onData=r,this._intervalMs=s,this._host.addController(this)}hostConnected(){this._poll(),this._timer=setInterval(()=>this._poll(),this._intervalMs)}hostDisconnected(){this._timer!==null&&(clearInterval(this._timer),this._timer=null)}async _poll(){try{const[e,i,r]=await Promise.all([this._rpcClient.call("agent.list"),this._rpcClient.call("channel.list"),this._rpcClient.call("session.list",{})]);this._onData({agents:e.agents.length,channels:i.channels.length,sessions:r.total,agentIds:e.agents,sessionEntries:r.sessions?.slice(0,20)??[]}),this._host.requestUpdate()}catch{}}}const O=S`
+  :host {
+    font-family: var(--ic-font-sans);
+  }
+
+  *,
+  *::before,
+  *::after {
+    box-sizing: border-box;
+  }
+
+  :host {
+    color: var(--ic-text);
+  }
+`,j=S`
+  .focusable:focus-visible,
+  button:focus-visible,
+  a:focus-visible,
+  input:focus-visible,
+  select:focus-visible,
+  textarea:focus-visible {
+    outline: 2px solid var(--ic-accent);
+    outline-offset: 2px;
+  }
+`,di=S`
+  .sr-only {
+    position: absolute;
+    width: 1px;
+    height: 1px;
+    padding: 0;
+    margin: -1px;
+    overflow: hidden;
+    clip: rect(0, 0, 0, 0);
+    white-space: nowrap;
+    border: 0;
+  }
+`;var pi=Object.defineProperty,hi=Object.getOwnPropertyDescriptor,B=(t,e,i,r)=>{for(var s=r>1?void 0:r?hi(e,i):e,a=t.length-1,n;a>=0;a--)(n=t[a])&&(s=(r?n(e,i,s):n(s))||s);return r&&s&&pi(e,i,s),s};const nt=[{id:"home",label:"Home",items:[{route:"dashboard",label:"Dashboard",icon:"▣"}]},{id:"operate",label:"Operate",items:[{route:"agents",label:"Agents",icon:"⬤",badge:"agentCount"},{route:"channels",label:"Channels",icon:"◎",badge:"channelCount"},{route:"messages",label:"Messages",icon:"○"},{route:"chat",label:"Chat",icon:"▬"},{route:"sessions",label:"Sessions",icon:"◷",badge:"sessionCount"},{route:"subagents",label:"Sub-Agents",icon:"◔"},{route:"pipelines",label:"Pipelines",icon:"◈"}]},{id:"observe",label:"Observe",items:[{route:"observe",label:"Overview",icon:"△",badge:"errorCount"},{route:"observe/context",label:"Context Engine",icon:"◥"},{route:"context",label:"Context DAG",icon:"◖"},{route:"observe/billing",label:"Billing",icon:"◇"},{route:"observe/delivery",label:"Delivery",icon:"▷"},{route:"observe/diagnostics",label:"Diagnostics",icon:"□"}]},{id:"configure",label:"Configure",items:[{route:"skills",label:"Skills",icon:"⚒"},{route:"mcp",label:"MCP Servers",icon:"⚖"},{route:"models",label:"Models",icon:"⌸"},{route:"memory",label:"Memory",icon:"◉"},{route:"scheduler",label:"Scheduler",icon:"▨"},{route:"security",label:"Security",icon:"☖"},{route:"media",label:"Media",icon:"▶"},{route:"approvals",label:"Approvals",icon:"✓",badge:"pendingApprovals"},{route:"config",label:"Config",icon:"⚙"}]}],ui={route:"setup",label:"Setup",icon:"▶"},at="ic_sidebar_collapsed";let I=class extends x{constructor(){super(...arguments),this.currentRoute="dashboard",this.pendingApprovals=0,this.errorCount=0,this.agentCount=0,this.channelCount=0,this.sessionCount=0,this.open=!1,this._collapsed=!1}connectedCallback(){super.connectedCallback();try{const t=localStorage.getItem(at);t!==null&&(this._collapsed=JSON.parse(t))}catch{}}_isActive(t){if(this.currentRoute===t)return!0;if(!this.currentRoute.startsWith(t+"/"))return!1;for(const e of nt)for(const i of e.items)if(i.route.length>t.length&&(this.currentRoute===i.route||this.currentRoute.startsWith(i.route+"/")))return!1;return!0}_navigate(t){this.dispatchEvent(new CustomEvent("navigate",{detail:t}))}_logout(){this.dispatchEvent(new CustomEvent("logout"))}_toggleCollapse(){this._collapsed=!this._collapsed;try{localStorage.setItem(at,JSON.stringify(this._collapsed))}catch{}}_closeOverlay(){this.dispatchEvent(new CustomEvent("close"))}_getBadgeValue(t){switch(t.badge){case"pendingApprovals":return this.pendingApprovals;case"errorCount":return this.errorCount;case"agentCount":return this.agentCount;case"channelCount":return this.channelCount;case"sessionCount":return this.sessionCount;default:return 0}}_renderNavItem(t){const e=this._isActive(t.route),i=this._getBadgeValue(t);return o`
+      <button
+        class="nav-item"
+        aria-current=${e?"page":g}
+        @click=${()=>this._navigate(t.route)}
+      >
+        <span class="nav-icon">${t.icon}</span>
+        <span class="nav-label">${t.label}</span>
+        ${i>0?o`<span class="badge">${i}</span>`:g}
+      </button>
+    `}render(){return o`
+      <div class="overlay" @click=${this._closeOverlay}></div>
+      <div class="sidebar ${this._collapsed?"collapsed":""}">
+        <nav role="navigation" aria-label="Main navigation">
+          ${nt.map(t=>o`
+            <div class="section-header">
+              <span class="section-label">${t.label}</span>
+            </div>
+            ${t.items.map(e=>this._renderNavItem(e))}
+          `)}
+          <div class="divider"></div>
+          ${this._renderNavItem(ui)}
+        </nav>
+        <div class="sidebar-footer">
+          <button
+            class="logout-btn"
+            @click=${this._logout}
+            aria-label="Logout"
+          >
+            <span class="nav-icon">\u2BBB</span>
+            <span class="logout-label">Logout</span>
+          </button>
+          <button
+            class="collapse-btn"
+            @click=${this._toggleCollapse}
+            aria-label=${this._collapsed?"Expand sidebar":"Collapse sidebar"}
+          >
+            ${this._collapsed?"»":"«"}
+          </button>
+        </div>
+      </div>
+    `}};I.styles=[O,j,S`
+      :host {
+        display: block;
+      }
+
+      .sidebar {
+        display: flex;
+        flex-direction: column;
+        width: 240px;
+        height: 100vh;
+        background: var(--ic-surface);
+        border-right: 1px solid var(--ic-border);
+        position: sticky;
+        top: 0;
+        transition: width var(--ic-transition);
+        overflow: hidden;
+      }
+
+      .sidebar.collapsed {
+        width: 64px;
+      }
+
+      nav {
+        flex: 1;
+        display: flex;
+        flex-direction: column;
+        padding: var(--ic-space-sm) 0;
+        overflow-y: auto;
+      }
+
+      .section-header {
+        display: flex;
+        align-items: center;
+        padding: 6px 16px 4px;
+        font-size: 11px;
+        font-weight: 600;
+        text-transform: uppercase;
+        letter-spacing: 0.05em;
+        color: var(--ic-text-dim);
+        user-select: none;
+        margin-top: 4px;
+      }
+
+      .section-header:first-of-type {
+        margin-top: 0;
+      }
+
+      .collapsed .section-header {
+        justify-content: center;
+        padding: 6px 0;
+      }
+
+      .collapsed .section-label {
+        display: none;
+      }
+
+      .collapsed .section-header::after {
+        content: "";
+        display: block;
+        width: 16px;
+        height: 1px;
+        background: var(--ic-border);
+      }
+
+      .nav-item {
+        display: flex;
+        align-items: center;
+        gap: var(--ic-space-sm);
+        padding: var(--ic-space-sm) var(--ic-space-md);
+        background: none;
+        border: none;
+        border-left: 3px solid transparent;
+        color: var(--ic-text-muted);
+        cursor: pointer;
+        font-family: inherit;
+        font-size: var(--ic-text-sm);
+        width: 100%;
+        text-align: left;
+        transition: color var(--ic-transition), background var(--ic-transition),
+          border-color var(--ic-transition);
+        white-space: nowrap;
+      }
+
+      .nav-item:hover {
+        color: var(--ic-text);
+        background: var(--ic-surface-2);
+      }
+
+      .nav-item[aria-current="page"] {
+        color: var(--ic-accent);
+        background: rgba(59, 130, 246, 0.1);
+        border-left-color: var(--ic-accent);
+      }
+
+      .nav-icon {
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        width: 20px;
+        height: 20px;
+        font-size: 14px;
+        flex-shrink: 0;
+      }
+
+      .nav-label {
+        flex: 1;
+        overflow: hidden;
+        text-overflow: ellipsis;
+      }
+
+      .collapsed .nav-label {
+        display: none;
+      }
+
+      .badge {
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        min-width: 18px;
+        height: 18px;
+        padding: 0 5px;
+        border-radius: 9px;
+        font-size: 11px;
+        font-weight: 600;
+        color: white;
+        background: var(--ic-error);
+        flex-shrink: 0;
+      }
+
+      .collapsed .badge {
+        display: none;
+      }
+
+      .divider {
+        height: 1px;
+        background: var(--ic-border);
+        margin: var(--ic-space-sm) var(--ic-space-md);
+      }
+
+      .sidebar-footer {
+        padding: var(--ic-space-sm);
+        border-top: 1px solid var(--ic-border);
+      }
+
+      .collapse-btn {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        width: 100%;
+        padding: var(--ic-space-sm);
+        background: none;
+        border: none;
+        color: var(--ic-text-dim);
+        cursor: pointer;
+        font-family: inherit;
+        font-size: var(--ic-text-sm);
+        transition: color var(--ic-transition);
+      }
+
+      .collapse-btn:hover {
+        color: var(--ic-text);
+      }
+
+      .logout-btn {
+        display: flex;
+        align-items: center;
+        gap: var(--ic-space-sm);
+        width: 100%;
+        padding: var(--ic-space-sm) var(--ic-space-md);
+        background: none;
+        border: none;
+        border-left: 3px solid transparent;
+        color: var(--ic-text-dim);
+        cursor: pointer;
+        font-family: inherit;
+        font-size: var(--ic-text-sm);
+        text-align: left;
+        transition: color var(--ic-transition);
+      }
+
+      .logout-btn:hover {
+        color: var(--ic-error);
+      }
+
+      .collapsed .logout-label {
+        display: none;
+      }
+
+      /* Mobile overlay */
+      .overlay {
+        display: none;
+      }
+
+      @media (max-width: 767px) {
+        .sidebar {
+          position: fixed;
+          z-index: 50;
+          left: 0;
+          top: 0;
+          transform: translateX(-100%);
+          transition: transform var(--ic-transition-slow);
+        }
+
+        :host([open]) .sidebar {
+          transform: translateX(0);
+          width: 240px;
+        }
+
+        :host([open]) .sidebar.collapsed {
+          width: 240px;
+        }
+
+        :host([open]) .collapsed .nav-label,
+        :host([open]) .collapsed .badge,
+        :host([open]) .collapsed .logout-label,
+        :host([open]) .collapsed .section-label {
+          display: inline;
+        }
+
+        :host([open]) .collapsed .section-header::after {
+          display: none;
+        }
+
+        :host([open]) .overlay {
+          display: block;
+          position: fixed;
+          inset: 0;
+          background: rgba(0, 0, 0, 0.5);
+          z-index: 49;
+        }
+      }
+
+      @media (min-width: 768px) and (max-width: 1023px) {
+        .sidebar:not(.collapsed) {
+          width: 64px;
+        }
+
+        .sidebar:not(.collapsed) .nav-label,
+        .sidebar:not(.collapsed) .badge,
+        .sidebar:not(.collapsed) .logout-label,
+        .sidebar:not(.collapsed) .section-label {
+          display: none;
+        }
+
+        .sidebar:not(.collapsed) .section-header {
+          justify-content: center;
+          padding: 6px 0;
+        }
+
+        .sidebar:not(.collapsed) .section-header::after {
+          content: "";
+          display: block;
+          width: 16px;
+          height: 1px;
+          background: var(--ic-border);
+        }
+      }
+    `];B([u()],I.prototype,"currentRoute",2);B([u({type:Number})],I.prototype,"pendingApprovals",2);B([u({type:Number})],I.prototype,"errorCount",2);B([u({type:Number})],I.prototype,"agentCount",2);B([u({type:Number})],I.prototype,"channelCount",2);B([u({type:Number})],I.prototype,"sessionCount",2);B([u({type:Boolean,reflect:!0})],I.prototype,"open",2);B([v()],I.prototype,"_collapsed",2);I=B([A("ic-sidebar")],I);var vi=Object.defineProperty,mi=Object.getOwnPropertyDescriptor,ce=(t,e,i,r)=>{for(var s=r>1?void 0:r?mi(e,i):e,a=t.length-1,n;a>=0;a--)(n=t[a])&&(s=(r?n(e,i,s):n(s))||s);return r&&s&&vi(e,i,s),s};let F=class extends x{constructor(){super(...arguments),this.connectionStatus="disconnected",this.notificationCount=0,this.sidebarCollapsed=!1,this.tokenId="",this._menuOpen=!1,this._boundCloseMenu=this._closeMenuOnOutsideClick.bind(this)}connectedCallback(){super.connectedCallback(),document.addEventListener("click",this._boundCloseMenu)}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener("click",this._boundCloseMenu)}_closeMenuOnOutsideClick(t){const e=t.composedPath();this._menuOpen&&!e.includes(this)&&(this._menuOpen=!1)}_toggleSidebar(){this.dispatchEvent(new CustomEvent("toggle-sidebar"))}_toggleMenu(){this._menuOpen=!this._menuOpen}_logout(){this._menuOpen=!1,this.dispatchEvent(new CustomEvent("logout"))}_getAvatarText(){return this.tokenId&&this.tokenId.length>=2?this.tokenId.slice(0,2).toUpperCase():"OP"}_getStatusText(){switch(this.connectionStatus){case"connected":return"Connected";case"reconnecting":return"Reconnecting";case"disconnected":return"Disconnected";default:return"Unknown"}}render(){return o`
+      <div class="topbar">
+        <button
+          class="hamburger"
+          @click=${this._toggleSidebar}
+          aria-label="Toggle navigation"
+        >
+          \u2630
+        </button>
+        <div class="brand">
+          <img class="brand-icon" src="${"/app/"}comis-logo.png" alt="Comis" />
+        </div>
+        <div class="spacer"></div>
+        <aside role="complementary" aria-label="System status">
+          <div class="status-area">
+            <div class="connection" aria-live="polite">
+              <span class="connection-dot ${this.connectionStatus}"></span>
+              <span class="connection-text">${this._getStatusText()}</span>
+            </div>
+            <button
+              class="bell-btn"
+              aria-label="Notifications${this.notificationCount>0?`, ${this.notificationCount} pending`:""}"
+            >
+              \u{1F514}
+              ${this.notificationCount>0?o`<span class="bell-badge">${this.notificationCount}</span>`:g}
+            </button>
+            <div class="user-menu">
+              <button
+                class="avatar-btn"
+                @click=${this._toggleMenu}
+                aria-label="User menu"
+                aria-expanded=${this._menuOpen}
+              >
+                ${this._getAvatarText()}
+              </button>
+              ${this._menuOpen?o`
+                    <div class="dropdown">
+                      <div class="dropdown-info">
+                        ${this.tokenId?`${this.tokenId.slice(0,6)}${"*".repeat(Math.min(8,Math.max(0,this.tokenId.length-10)))}${this.tokenId.length>10?this.tokenId.slice(-4):""}`:"Operator"}
+                      </div>
+                      <div class="dropdown-divider"></div>
+                      <button
+                        class="dropdown-action"
+                        @click=${this._logout}
+                      >
+                        Logout
+                      </button>
+                    </div>
+                  `:g}
+            </div>
+          </div>
+        </aside>
+      </div>
+    `}};F.styles=[O,j,S`
+      :host {
+        display: block;
+      }
+
+      .topbar {
+        display: flex;
+        align-items: center;
+        height: 48px;
+        padding: 0 var(--ic-space-md);
+        background: var(--ic-surface);
+        border-bottom: 1px solid var(--ic-border);
+      }
+
+      .hamburger {
+        display: none;
+        align-items: center;
+        justify-content: center;
+        width: 32px;
+        height: 32px;
+        padding: 0;
+        margin-right: var(--ic-space-sm);
+        background: none;
+        border: none;
+        color: var(--ic-text-muted);
+        cursor: pointer;
+        font-size: 18px;
+      }
+
+      .hamburger:hover {
+        color: var(--ic-text);
+      }
+
+      @media (max-width: 767px) {
+        .hamburger {
+          display: flex;
+        }
+      }
+
+      .brand {
+        font-size: 1.125rem;
+        font-weight: 700;
+        color: var(--ic-text);
+        display: flex;
+        align-items: center;
+        gap: var(--ic-space-xs);
+      }
+
+      .brand-icon {
+        width: 80px;
+        height: 32px;
+        object-fit: contain;
+      }
+
+      .spacer {
+        flex: 1;
+      }
+
+      .status-area {
+        display: flex;
+        align-items: center;
+        gap: var(--ic-space-md);
+      }
+
+      /* Connection status */
+      .connection {
+        display: flex;
+        align-items: center;
+        gap: var(--ic-space-xs);
+      }
+
+      .connection-dot {
+        width: 8px;
+        height: 8px;
+        border-radius: 50%;
+        flex-shrink: 0;
+      }
+
+      .connection-dot.connected {
+        background: var(--ic-success);
+      }
+
+      .connection-dot.reconnecting {
+        background: var(--ic-warning);
+        animation: pulse 1.5s ease-in-out infinite;
+      }
+
+      .connection-dot.disconnected {
+        background: var(--ic-error);
+      }
+
+      @keyframes pulse {
+        0%, 100% { opacity: 1; }
+        50% { opacity: 0.4; }
+      }
+
+      .connection-text {
+        font-size: var(--ic-text-xs);
+        color: var(--ic-text-dim);
+      }
+
+      /* Notification bell */
+      .bell-btn {
+        position: relative;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        width: 32px;
+        height: 32px;
+        padding: 0;
+        background: none;
+        border: none;
+        color: var(--ic-text-muted);
+        cursor: pointer;
+        font-size: 16px;
+      }
+
+      .bell-btn:hover {
+        color: var(--ic-text);
+      }
+
+      .bell-badge {
+        position: absolute;
+        top: 2px;
+        right: 2px;
+        min-width: 14px;
+        height: 14px;
+        padding: 0 3px;
+        border-radius: 7px;
+        font-size: 10px;
+        font-weight: 600;
+        color: white;
+        background: var(--ic-error);
+        display: flex;
+        align-items: center;
+        justify-content: center;
+      }
+
+      /* User menu */
+      .user-menu {
+        position: relative;
+      }
+
+      .avatar-btn {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        width: 32px;
+        height: 32px;
+        padding: 0;
+        border-radius: 50%;
+        background: var(--ic-surface-2);
+        border: 1px solid var(--ic-border);
+        color: var(--ic-text-muted);
+        cursor: pointer;
+        font-family: inherit;
+        font-size: var(--ic-text-xs);
+        font-weight: 600;
+      }
+
+      .avatar-btn:hover {
+        border-color: var(--ic-accent);
+        color: var(--ic-text);
+      }
+
+      .dropdown {
+        position: absolute;
+        top: 100%;
+        right: 0;
+        margin-top: var(--ic-space-xs);
+        min-width: 180px;
+        background: var(--ic-surface);
+        border: 1px solid var(--ic-border);
+        border-radius: var(--ic-radius-md);
+        box-shadow: var(--ic-shadow-lg);
+        z-index: 100;
+        padding: var(--ic-space-sm) 0;
+      }
+
+      .dropdown-info {
+        padding: var(--ic-space-sm) var(--ic-space-md);
+        font-size: var(--ic-text-xs);
+        color: var(--ic-text-dim);
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+      }
+
+      .dropdown-divider {
+        height: 1px;
+        background: var(--ic-border);
+        margin: var(--ic-space-xs) 0;
+      }
+
+      .dropdown-action {
+        display: block;
+        width: 100%;
+        padding: var(--ic-space-sm) var(--ic-space-md);
+        background: none;
+        border: none;
+        color: var(--ic-text-muted);
+        cursor: pointer;
+        font-family: inherit;
+        font-size: var(--ic-text-sm);
+        text-align: left;
+      }
+
+      .dropdown-action:hover {
+        background: var(--ic-surface-2);
+        color: var(--ic-error);
+      }
+    `];ce([u()],F.prototype,"connectionStatus",2);ce([u({type:Number})],F.prototype,"notificationCount",2);ce([u({type:Boolean})],F.prototype,"sidebarCollapsed",2);ce([u()],F.prototype,"tokenId",2);ce([v()],F.prototype,"_menuOpen",2);F=ce([A("ic-topbar")],F);var gi=Object.defineProperty,fi=Object.getOwnPropertyDescriptor,ee=(t,e,i,r)=>{for(var s=r>1?void 0:r?fi(e,i):e,a=t.length-1,n;a>=0;a--)(n=t[a])&&(s=(r?n(e,i,s):n(s))||s);return r&&s&&gi(e,i,s),s};const bi=[{id:"v-dashboard",label:"Dashboard",category:"view",icon:"home",action:"dashboard"},{id:"v-agents",label:"Agents",category:"view",icon:"users",action:"agents"},{id:"v-sessions",label:"Sessions",category:"view",icon:"message-circle",action:"sessions"},{id:"v-channels",label:"Channels",category:"view",icon:"radio",action:"channels"},{id:"v-chat",label:"Chat Console",category:"view",icon:"message-square",action:"chat"},{id:"v-memory",label:"Memory Inspector",category:"view",icon:"database",action:"memory"},{id:"v-skills",label:"Skills",category:"view",icon:"zap",action:"skills"},{id:"v-models",label:"Models",category:"view",icon:"cpu",action:"models"},{id:"v-scheduler",label:"Scheduler",category:"view",icon:"clock",action:"scheduler"},{id:"v-pipelines",label:"Pipelines",category:"view",icon:"git-branch",action:"pipelines"},{id:"v-observe",label:"Observability",category:"view",icon:"bar-chart-2",action:"observe/overview"},{id:"v-billing",label:"Billing",category:"view",icon:"dollar-sign",action:"observe/billing"},{id:"v-delivery",label:"Delivery",category:"view",icon:"send",action:"observe/delivery"},{id:"v-diagnostics",label:"Diagnostics",category:"view",icon:"activity",action:"observe/diagnostics"},{id:"v-context",label:"Context Engine",category:"view",icon:"layers",action:"observe/context"},{id:"v-security",label:"Security",category:"view",icon:"shield",action:"security"},{id:"v-config",label:"Settings",category:"view",icon:"settings",action:"config"},{id:"v-setup",label:"Setup Wizard",category:"view",icon:"compass",action:"setup"}],_i=[{id:"c-refresh",label:"Refresh Data",category:"command",icon:"refresh-cw",action:"refresh"},{id:"c-sidebar",label:"Toggle Sidebar",category:"command",icon:"sidebar",action:"toggle-sidebar"},{id:"c-logout",label:"Logout",category:"command",icon:"log-out",action:"logout"},{id:"c-shortcuts",label:"Show Keyboard Shortcuts",category:"command",icon:"help-circle",action:"show-shortcuts"}],yi=["view","agent","session","command"],wi={view:"Views",agent:"Agents",session:"Sessions",command:"Commands"};let N=class extends x{constructor(){super(...arguments),this.open=!1,this.agents=[],this.sessions=[],this._query="",this._activeIndex=-1,this._results=[]}updated(t){t.has("open")&&this.open&&(this._query="",this._activeIndex=-1,this._results=this._filterResults(""),this.updateComplete.then(()=>{this.shadowRoot?.querySelector(".search-input")?.focus()}))}_getAllItems(){const t=[...bi];for(const e of this.agents)t.push({id:`a-${e.id}`,label:e.name??e.id,category:"agent",icon:"user",action:`agents/${e.id}`});for(const e of this.sessions.slice(0,20))t.push({id:`s-${e.key}`,label:`${e.agentId}: ${e.key}`,category:"session",icon:"message-circle",action:`sessions/${e.key}`});return t.push(..._i),t}_filterResults(t){const e=this._getAllItems();if(!t)return e.filter(r=>r.category==="view"||r.category==="command").slice(0,20);const i=t.toLowerCase();return e.filter(r=>r.label.toLowerCase().includes(i)).slice(0,20)}_getGroupedResults(){const t=new Map;for(const e of this._results){let i=t.get(e.category);i||(i=[],t.set(e.category,i)),i.push(e)}return yi.filter(e=>t.has(e)).map(e=>({category:e,items:t.get(e)}))}_handleInput(t){this._query=t.target.value,this._results=this._filterResults(this._query),this._activeIndex=this._results.length>0?0:-1}_handleKeydown(t){switch(t.key){case"ArrowDown":t.preventDefault(),this._results.length>0&&(this._activeIndex=Math.min(this._activeIndex+1,this._results.length-1),this._scrollActiveIntoView());break;case"ArrowUp":t.preventDefault(),this._results.length>0&&(this._activeIndex=Math.max(this._activeIndex-1,0),this._scrollActiveIntoView());break;case"Enter":t.preventDefault(),this._activeIndex>=0&&this._activeIndex<this._results.length&&this._executeItem(this._results[this._activeIndex]);break;case"Escape":t.preventDefault(),this._close();break}}_scrollActiveIntoView(){this.updateComplete.then(()=>{this.shadowRoot?.querySelector(`#result-${this._activeIndex}`)?.scrollIntoView({block:"nearest"})})}_executeItem(t){t.category==="command"?this.dispatchEvent(new CustomEvent("command",{detail:t.action,bubbles:!0,composed:!0})):this.dispatchEvent(new CustomEvent("navigate",{detail:t.action,bubbles:!0,composed:!0})),this._close()}_close(){this._query="",this._activeIndex=-1,this.dispatchEvent(new CustomEvent("close",{bubbles:!0,composed:!0}))}_handleBackdropClick(t){t.target.classList.contains("backdrop")&&this._close()}render(){if(!this.open)return g;const t=this._getGroupedResults();let e=0;return o`
+      <div class="backdrop" @click=${this._handleBackdropClick}>
+        <div class="palette" role="dialog" aria-label="Command palette">
+          <input
+            class="search-input"
+            type="text"
+            placeholder="Search views, agents, sessions, commands..."
+            role="combobox"
+            aria-expanded="true"
+            aria-controls="palette-results"
+            aria-activedescendant=${this._activeIndex>=0?`result-${this._activeIndex}`:""}
+            aria-autocomplete="list"
+            .value=${this._query}
+            @input=${this._handleInput}
+            @keydown=${this._handleKeydown}
+          />
+          <div class="results" id="palette-results" role="listbox" aria-label="Search results">
+            ${this._results.length===0?o`<div class="no-results">No results found</div>`:t.map(i=>o`
+                  <div class="category-header">${wi[i.category]??i.category}</div>
+                  ${i.items.map(r=>{const s=e++;return o`
+                      <div
+                        id="result-${s}"
+                        class="result-item"
+                        role="option"
+                        aria-selected=${s===this._activeIndex?"true":"false"}
+                        @click=${()=>this._executeItem(r)}
+                        @pointerenter=${()=>{this._activeIndex=s}}
+                      >
+                        <ic-icon class="result-icon" name=${r.icon} size="16px"></ic-icon>
+                        <span class="result-label">${r.label}</span>
+                        ${r.shortcut?o`<span class="result-shortcut">${r.shortcut}</span>`:g}
+                      </div>
+                    `})}
+                `)}
+          </div>
+          <div class="footer">
+            <span><kbd>&uarr;</kbd><kbd>&darr;</kbd> Navigate</span>
+            <span><kbd>Enter</kbd> Select</span>
+            <span><kbd>Esc</kbd> Close</span>
+          </div>
+        </div>
+      </div>
+    `}};N.styles=[O,j,di,S`
+      :host {
+        display: block;
+      }
+
+      .backdrop {
+        position: fixed;
+        inset: 0;
+        background: rgba(0, 0, 0, 0.5);
+        z-index: 100;
+        display: flex;
+        align-items: flex-start;
+        justify-content: center;
+        padding-top: 15vh;
+      }
+
+      .palette {
+        background: var(--ic-surface, #111827);
+        border: 1px solid var(--ic-border, #374151);
+        border-radius: var(--ic-radius-lg, 0.75rem);
+        box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.4);
+        max-width: 640px;
+        width: 90%;
+        max-height: 400px;
+        display: flex;
+        flex-direction: column;
+        overflow: hidden;
+      }
+
+      .search-input {
+        width: 100%;
+        padding: var(--ic-space-md, 0.75rem) var(--ic-space-lg, 1rem);
+        background: transparent;
+        border: none;
+        border-bottom: 1px solid var(--ic-border, #374151);
+        color: var(--ic-text, #f3f4f6);
+        font-size: 1rem;
+        font-family: inherit;
+        outline: none;
+        box-sizing: border-box;
+      }
+
+      .search-input::placeholder {
+        color: var(--ic-text-dim, #6b7280);
+      }
+
+      .results {
+        overflow-y: auto;
+        flex: 1;
+        padding: var(--ic-space-xs, 0.25rem) 0;
+      }
+
+      .category-header {
+        padding: var(--ic-space-xs, 0.25rem) var(--ic-space-md, 0.75rem);
+        font-size: 0.6875rem;
+        font-weight: 600;
+        text-transform: uppercase;
+        letter-spacing: 0.05em;
+        color: var(--ic-text-dim, #6b7280);
+        margin-top: var(--ic-space-xs, 0.25rem);
+      }
+
+      .result-item {
+        display: flex;
+        align-items: center;
+        gap: var(--ic-space-sm, 0.5rem);
+        padding: var(--ic-space-sm, 0.5rem) var(--ic-space-md, 0.75rem);
+        cursor: pointer;
+        color: var(--ic-text, #f3f4f6);
+        font-size: var(--ic-text-sm, 0.875rem);
+        transition: background 0.1s;
+      }
+
+      .result-item:hover,
+      .result-item[aria-selected="true"] {
+        background: var(--ic-accent, #3b82f6);
+        color: #fff;
+      }
+
+      .result-icon {
+        width: 16px;
+        height: 16px;
+        flex-shrink: 0;
+        opacity: 0.7;
+      }
+
+      .result-label {
+        flex: 1;
+        min-width: 0;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+
+      .result-shortcut {
+        font-size: 0.6875rem;
+        color: var(--ic-text-dim, #6b7280);
+        font-family: var(--ic-font-mono, monospace);
+        flex-shrink: 0;
+      }
+
+      .result-item[aria-selected="true"] .result-shortcut {
+        color: rgba(255, 255, 255, 0.7);
+      }
+
+      .no-results {
+        padding: var(--ic-space-lg, 1rem);
+        text-align: center;
+        color: var(--ic-text-dim, #6b7280);
+        font-size: var(--ic-text-sm, 0.875rem);
+      }
+
+      .footer {
+        border-top: 1px solid var(--ic-border, #374151);
+        padding: var(--ic-space-xs, 0.25rem) var(--ic-space-md, 0.75rem);
+        display: flex;
+        gap: var(--ic-space-md, 0.75rem);
+        font-size: 0.6875rem;
+        color: var(--ic-text-dim, #6b7280);
+      }
+
+      .footer kbd {
+        background: var(--ic-surface-2, #1f2937);
+        border: 1px solid var(--ic-border, #374151);
+        border-radius: 3px;
+        padding: 1px 4px;
+        font-size: 0.625rem;
+        font-family: inherit;
+      }
+    `];ee([u({type:Boolean})],N.prototype,"open",2);ee([u({attribute:!1})],N.prototype,"agents",2);ee([u({attribute:!1})],N.prototype,"sessions",2);ee([v()],N.prototype,"_query",2);ee([v()],N.prototype,"_activeIndex",2);ee([v()],N.prototype,"_results",2);N=ee([A("ic-command-palette")],N);var $i=Object.defineProperty,xi=Object.getOwnPropertyDescriptor,Ae=(t,e,i,r)=>{for(var s=r>1?void 0:r?xi(e,i):e,a=t.length-1,n;a>=0;a--)(n=t[a])&&(s=(r?n(e,i,s):n(s))||s);return r&&s&&$i(e,i,s),s};const ot={sm:"16px",md:"24px",lg:"48px"};let oe=class extends x{constructor(){super(...arguments),this.mode="spinner",this.size="md",this.lines=3}render(){return this.mode==="skeleton"?this._renderSkeleton():this._renderSpinner()}_renderSpinner(){const t=ot[this.size]??ot.md;return o`
+      <div
+        class="spinner"
+        style="width: ${t}; height: ${t};"
+        role="status"
+        aria-label="Loading"
+      ></div>
+    `}_renderSkeleton(){const t=["100%","80%","60%"],e=Array.from({length:this.lines},(i,r)=>r);return o`
+      <div
+        class="skeleton-container"
+        role="status"
+        aria-label="Loading"
+      >
+        ${e.map(i=>o`<div
+              class="skeleton-line"
+              style="width: ${t[i%t.length]};"
+            ></div>`)}
+      </div>
+    `}};oe.styles=[O,S`
+      :host {
+        display: block;
+      }
+
+      /* --- Spinner --- */
+      .spinner {
+        border: 2px solid var(--ic-border);
+        border-top-color: var(--ic-accent);
+        border-radius: 50%;
+        animation: spin 0.8s linear infinite;
+      }
+
+      @keyframes spin {
+        to {
+          transform: rotate(360deg);
+        }
+      }
+
+      @media (prefers-reduced-motion: reduce) {
+        .spinner {
+          animation: none;
+          border-top-color: var(--ic-accent);
+          opacity: 0.7;
+        }
+      }
+
+      /* --- Skeleton --- */
+      .skeleton-container {
+        display: flex;
+        flex-direction: column;
+        gap: var(--ic-space-sm);
+      }
+
+      .skeleton-line {
+        height: 12px;
+        background: var(--ic-surface-2);
+        border-radius: var(--ic-radius-sm);
+        position: relative;
+        overflow: hidden;
+      }
+
+      .skeleton-line::after {
+        content: "";
+        position: absolute;
+        top: 0;
+        left: 0;
+        right: 0;
+        bottom: 0;
+        background: linear-gradient(
+          90deg,
+          transparent,
+          rgba(255, 255, 255, 0.05),
+          transparent
+        );
+        animation: shimmer 1.5s ease-in-out infinite;
+      }
+
+      @keyframes shimmer {
+        0% {
+          transform: translateX(-100%);
+        }
+        100% {
+          transform: translateX(100%);
+        }
+      }
+
+      @media (prefers-reduced-motion: reduce) {
+        .skeleton-line::after {
+          animation: none;
+          display: none;
+        }
+      }
+    `];Ae([u()],oe.prototype,"mode",2);Ae([u()],oe.prototype,"size",2);Ae([u({type:Number})],oe.prototype,"lines",2);oe=Ae([A("ic-loading")],oe);var ki=Object.defineProperty,Ci=Object.getOwnPropertyDescriptor,Ve=(t,e,i,r)=>{for(var s=r>1?void 0:r?Ci(e,i):e,a=t.length-1,n;a>=0;a--)(n=t[a])&&(s=(r?n(e,i,s):n(s))||s);return r&&s&&ki(e,i,s),s};let ge=class extends x{constructor(){super(...arguments),this.variant="dashboard",this._showSkeleton=!1,this._delayTimer=null}connectedCallback(){super.connectedCallback(),this._delayTimer=setTimeout(()=>{this._showSkeleton=!0},150)}disconnectedCallback(){super.disconnectedCallback(),this._delayTimer&&(clearTimeout(this._delayTimer),this._delayTimer=null)}_renderDashboard(){return o`
+      <div class="skeleton-stats">
+        <div class="skeleton-stat-card"><ic-loading mode="skeleton" lines="2"></ic-loading></div>
+        <div class="skeleton-stat-card"><ic-loading mode="skeleton" lines="2"></ic-loading></div>
+        <div class="skeleton-stat-card"><ic-loading mode="skeleton" lines="2"></ic-loading></div>
+      </div>
+      <div class="skeleton-content-block"><ic-loading mode="skeleton" lines="6"></ic-loading></div>
+    `}_renderList(){return o`
+      <div class="skeleton-search"></div>
+      <div class="skeleton-content-block">
+        ${Array.from({length:8},()=>o`
+          <div class="skeleton-row">
+            <div class="skeleton-row-cell"><ic-loading mode="skeleton" lines="1"></ic-loading></div>
+            <div class="skeleton-row-cell"><ic-loading mode="skeleton" lines="1"></ic-loading></div>
+            <div class="skeleton-row-cell"><ic-loading mode="skeleton" lines="1"></ic-loading></div>
+          </div>
+        `)}
+      </div>
+    `}_renderDetail(){return o`
+      <div class="skeleton-detail-header">
+        <ic-loading mode="skeleton" lines="2"></ic-loading>
+      </div>
+      <div class="skeleton-two-col">
+        <div class="skeleton-block"><ic-loading mode="skeleton" lines="5"></ic-loading></div>
+        <div class="skeleton-block"><ic-loading mode="skeleton" lines="5"></ic-loading></div>
+      </div>
+    `}_renderTable(){return o`
+      <div class="skeleton-content-block">
+        <ic-loading mode="skeleton" lines="1"></ic-loading>
+        ${Array.from({length:8},()=>o`
+          <div class="skeleton-row">
+            <div class="skeleton-row-cell"><ic-loading mode="skeleton" lines="1"></ic-loading></div>
+            <div class="skeleton-row-cell"><ic-loading mode="skeleton" lines="1"></ic-loading></div>
+          </div>
+        `)}
+      </div>
+    `}_renderEditor(){return o`
+      <div class="skeleton-detail-header">
+        <ic-loading mode="skeleton" lines="1"></ic-loading>
+      </div>
+      <div class="skeleton-editor-block"><ic-loading mode="skeleton" lines="8"></ic-loading></div>
+    `}render(){const t=this._showSkeleton?"skeleton-container":"skeleton-container skeleton-hidden";return o`
+      <div class=${t} role="status" aria-label="Loading content">
+        ${(()=>{switch(this.variant){case"dashboard":return this._renderDashboard();case"list":return this._renderList();case"detail":return this._renderDetail();case"table":return this._renderTable();case"editor":return this._renderEditor()}})()}
+      </div>
+    `}};ge.styles=[O,S`
+      :host {
+        display: block;
+      }
+
+      .skeleton-container {
+        padding: var(--ic-space-md, 0.75rem) 0;
+      }
+
+      .skeleton-hidden {
+        visibility: hidden;
+      }
+
+      /* Dashboard variant */
+      .skeleton-stats {
+        display: grid;
+        grid-template-columns: repeat(3, 1fr);
+        gap: var(--ic-space-md);
+        margin-bottom: var(--ic-space-lg);
+      }
+
+      @media (max-width: 639px) {
+        .skeleton-stats {
+          grid-template-columns: 1fr;
+        }
+      }
+
+      .skeleton-stat-card {
+        background: var(--ic-surface, #111827);
+        border: 1px solid var(--ic-border, #374151);
+        border-radius: var(--ic-radius-md);
+        padding: var(--ic-space-md) var(--ic-space-lg);
+        height: 80px;
+      }
+
+      .skeleton-content-block {
+        background: var(--ic-surface, #111827);
+        border: 1px solid var(--ic-border, #374151);
+        border-radius: var(--ic-radius-lg);
+        padding: var(--ic-space-lg);
+      }
+
+      /* List variant */
+      .skeleton-search {
+        height: 40px;
+        background: var(--ic-surface, #111827);
+        border: 1px solid var(--ic-border, #374151);
+        border-radius: var(--ic-radius-md);
+        margin-bottom: var(--ic-space-md);
+        max-width: 320px;
+      }
+
+      .skeleton-row {
+        display: flex;
+        gap: var(--ic-space-md);
+        padding: var(--ic-space-sm) var(--ic-space-md);
+        border-bottom: 1px solid var(--ic-border, #374151);
+      }
+
+      .skeleton-row-cell {
+        flex: 1;
+      }
+
+      /* Detail variant */
+      .skeleton-detail-header {
+        margin-bottom: var(--ic-space-lg);
+      }
+
+      .skeleton-two-col {
+        display: grid;
+        grid-template-columns: 1fr 1fr;
+        gap: var(--ic-space-lg);
+      }
+
+      @media (max-width: 767px) {
+        .skeleton-two-col {
+          grid-template-columns: 1fr;
+        }
+      }
+
+      .skeleton-block {
+        background: var(--ic-surface, #111827);
+        border: 1px solid var(--ic-border, #374151);
+        border-radius: var(--ic-radius-lg);
+        padding: var(--ic-space-lg);
+        min-height: 150px;
+      }
+
+      /* Editor variant */
+      .skeleton-editor-block {
+        background: var(--ic-surface, #111827);
+        border: 1px solid var(--ic-border, #374151);
+        border-radius: var(--ic-radius-lg);
+        padding: var(--ic-space-lg);
+        min-height: 300px;
+      }
+    `];Ve([u()],ge.prototype,"variant",2);Ve([v()],ge.prototype,"_showSkeleton",2);ge=Ve([A("ic-skeleton-view")],ge);var Si=Object.defineProperty,Ei=Object.getOwnPropertyDescriptor,bt=(t,e,i,r)=>{for(var s=r>1?void 0:r?Ei(e,i):e,a=t.length-1,n;a>=0;a--)(n=t[a])&&(s=(r?n(e,i,s):n(s))||s);return r&&s&&Si(e,i,s),s};const lt={success:"var(--ic-success)",error:"var(--ic-error)",warning:"var(--ic-warning)",info:"var(--ic-info)"},Ai=5;let Ti=0,L=class extends x{constructor(){super(...arguments),this._toasts=[],this._timers=new Map}connectedCallback(){super.connectedCallback(),L._instance=this,this._onDocumentToast=this._onDocumentToast.bind(this),document.addEventListener("ic-toast",this._onDocumentToast)}disconnectedCallback(){super.disconnectedCallback(),L._instance===this&&(L._instance=null),document.removeEventListener("ic-toast",this._onDocumentToast);for(const t of this._timers.values())clearTimeout(t);this._timers.clear()}static show(t,e="info",i=4e3){L._instance&&L._instance._addToast(t,e,i)}_onDocumentToast(t){const{message:e,variant:i="info",duration:r=4e3}=t.detail;this._addToast(e,i,r)}_addToast(t,e,i){const r=++Ti,s={id:r,message:t,variant:e,duration:i};let a=[...this._toasts,s];for(;a.length>Ai;){const l=a[0];this._clearTimer(l.id),a=a.slice(1)}this._toasts=a;const n=setTimeout(()=>{this._removeToast(r)},i);this._timers.set(r,n)}_removeToast(t){this._clearTimer(t),this._toasts=this._toasts.filter(e=>e.id!==t)}_clearTimer(t){const e=this._timers.get(t);e!==void 0&&(clearTimeout(e),this._timers.delete(t))}render(){return o`
+      <div role="alert" aria-live="polite">
+        ${this._toasts.map(t=>{const e=lt[t.variant]??lt.info;return o`
+            <div class="toast" data-variant=${t.variant}>
+              <div class="toast__border" style="background: ${e}"></div>
+              <span class="toast__message">${t.message}</span>
+              <button
+                class="toast__close"
+                aria-label="Close notification"
+                @click=${()=>this._removeToast(t.id)}
+              >\u2715</button>
+            </div>
+          `})}
+      </div>
+    `}};L.styles=[O,S`
+      :host {
+        position: fixed;
+        bottom: var(--ic-space-lg);
+        right: var(--ic-space-lg);
+        z-index: 10000;
+        display: flex;
+        flex-direction: column;
+        gap: var(--ic-space-sm);
+        pointer-events: none;
+      }
+
+      .toast {
+        display: flex;
+        align-items: center;
+        gap: var(--ic-space-sm);
+        background: var(--ic-surface);
+        border: 1px solid var(--ic-border);
+        border-radius: var(--ic-radius-md);
+        padding: var(--ic-space-sm) var(--ic-space-md);
+        min-width: 16rem;
+        max-width: 24rem;
+        box-shadow: var(--ic-shadow-lg);
+        pointer-events: auto;
+        animation: toast-enter var(--ic-transition-slow) ease forwards;
+      }
+
+      .toast--exiting {
+        animation: toast-exit var(--ic-transition) ease forwards;
+      }
+
+      @keyframes toast-enter {
+        from {
+          opacity: 0;
+          transform: translateX(1rem);
+        }
+        to {
+          opacity: 1;
+          transform: translateX(0);
+        }
+      }
+
+      @keyframes toast-exit {
+        from {
+          opacity: 1;
+        }
+        to {
+          opacity: 0;
+        }
+      }
+
+      @media (prefers-reduced-motion: reduce) {
+        .toast,
+        .toast--exiting {
+          animation: none;
+        }
+      }
+
+      .toast__border {
+        width: 4px;
+        align-self: stretch;
+        border-radius: 2px;
+        flex-shrink: 0;
+      }
+
+      .toast__message {
+        flex: 1;
+        font-size: var(--ic-text-sm);
+        color: var(--ic-text);
+      }
+
+      .toast__close {
+        background: none;
+        border: none;
+        color: var(--ic-text-dim);
+        cursor: pointer;
+        padding: var(--ic-space-xs);
+        font-size: var(--ic-text-sm);
+        line-height: 1;
+        flex-shrink: 0;
+        border-radius: var(--ic-radius-sm);
+        transition: color var(--ic-transition);
+      }
+
+      .toast__close:hover {
+        color: var(--ic-text);
+      }
+    `];L._instance=null;bt([v()],L.prototype,"_toasts",2);L=bt([A("ic-toast")],L);class Oi{constructor(e,i,r){this._unsubs=[],this._host=e,this._eventDispatcher=i,this._events=r,this._host.addController(this)}hostConnected(){for(const[e,i]of Object.entries(this._events)){const r=this._eventDispatcher.addEventListener(e,i);this._unsubs.push(r)}}hostDisconnected(){for(const e of this._unsubs)e();this._unsubs=[]}}var Pi=Object.defineProperty,Di=Object.getOwnPropertyDescriptor,_e=(t,e,i,r)=>{for(var s=r>1?void 0:r?Di(e,i):e,a=t.length-1,n;a>=0;a--)(n=t[a])&&(s=(r?n(e,i,s):n(s))||s);return r&&s&&Pi(e,i,s),s};let Y=class extends x{constructor(){super(...arguments),this.data=[],this.width=80,this.height=24,this.color="var(--ic-accent)"}_buildPoints(){const{data:t,width:e,height:i}=this;if(t.length===0)return"";if(t.length===1)return`${e/2},${i/2}`;const r=Math.max(...t),s=Math.min(...t),a=r-s,n=e/(t.length-1),l=1;return t.map((c,d)=>{const p=d*n,h=a===0?i/2:l+(r-c)/a*(i-l*2);return`${p},${h}`}).join(" ")}render(){if(this.data.length===0)return o``;const t=this._buildPoints();if(this.data.length===1){const[e,i]=t.split(",").map(Number);return o`
+        <svg
+          viewBox="0 0 ${this.width} ${this.height}"
+          preserveAspectRatio="none"
+        >
+          ${W`<circle cx=${e} cy=${i} r="2" fill=${this.color} />`}
+        </svg>
+      `}return o`
+      <svg
+        viewBox="0 0 ${this.width} ${this.height}"
+        preserveAspectRatio="none"
+      >
+        ${W`<polyline
+          points=${t}
+          fill="none"
+          stroke=${this.color}
+          stroke-width="1.5"
+          stroke-linecap="round"
+          stroke-linejoin="round"
+        />`}
+      </svg>
+    `}};Y.styles=[O,S`
+      :host {
+        display: inline-block;
+      }
+
+      svg {
+        display: block;
+        width: 100%;
+        height: 100%;
+      }
+    `];_e([u({attribute:!1})],Y.prototype,"data",2);_e([u({type:Number})],Y.prototype,"width",2);_e([u({type:Number})],Y.prototype,"height",2);_e([u()],Y.prototype,"color",2);Y=_e([A("ic-sparkline")],Y);var Ii=Object.defineProperty,Ri=Object.getOwnPropertyDescriptor,K=(t,e,i,r)=>{for(var s=r>1?void 0:r?Ri(e,i):e,a=t.length-1,n;a>=0;a--)(n=t[a])&&(s=(r?n(e,i,s):n(s))||s);return r&&s&&Ii(e,i,s),s};let R=class extends x{constructor(){super(...arguments),this.label="",this.value="",this.trend="",this.trendValue="",this.threshold="normal",this.sparklineData=[],this.delta="",this.deltaDirection="flat"}_renderTrend(){if(!this.trend)return g;const e={up:"↑",down:"↓",flat:"—"}[this.trend]??"",i=`trend trend--${this.trend}`;return o`<span class=${i}>${e}${this.trendValue?` ${this.trendValue}`:""}</span>`}_renderDelta(){if(!this.delta)return g;const e={up:"↑",down:"↓",flat:"—"}[this.deltaDirection]??"",i=`delta delta--${this.deltaDirection}`;return o`<span class=${i}>${e} ${this.delta}</span>`}_renderThresholdIcon(){return this.threshold==="warning"?o`<span class="threshold-icon threshold-icon--warning" aria-hidden="true">\u26A0</span>`:this.threshold==="critical"?o`<span class="threshold-icon threshold-icon--critical" aria-hidden="true">\u26D4</span>`:g}_renderSparkline(){return this.sparklineData.length===0?g:o`
+      <div class="sparkline-area">
+        <ic-sparkline
+          .data=${this.sparklineData}
+          height=${24}
+          color="var(--ic-accent)"
+        ></ic-sparkline>
+      </div>
+    `}render(){const t=this.threshold!=="normal"?`card card--${this.threshold}`:"card",e=this.delta?`, ${this.deltaDirection} ${this.delta}`:"",i=this.threshold!=="normal"?`${this.label}: ${this.value}${e} (${this.threshold})`:`${this.label}: ${this.value}${e}`;return o`
+      <div class=${t} role="group" aria-label=${i}>
+        <div class="value-row">
+          ${this._renderThresholdIcon()}
+          <span class="value">${this.value}</span>
+          ${this._renderTrend()}
+          ${this._renderDelta()}
+        </div>
+        ${this._renderSparkline()}
+        <div class="label">${this.label}</div>
+      </div>
+    `}};R.styles=[O,j,S`
+      :host {
+        display: block;
+        min-width: 8rem;
+        flex: 1;
+      }
+
+      .card {
+        background: var(--ic-surface);
+        border: 1px solid var(--ic-border);
+        border-radius: var(--ic-radius-md);
+        padding: var(--ic-space-md) var(--ic-space-lg);
+      }
+
+      .value-row {
+        display: flex;
+        align-items: baseline;
+        gap: var(--ic-space-sm);
+      }
+
+      .value {
+        font-size: var(--ic-text-2xl);
+        font-weight: 700;
+        color: var(--ic-text);
+        line-height: 1.2;
+      }
+
+      .trend {
+        display: inline-flex;
+        align-items: center;
+        gap: 2px;
+        font-size: var(--ic-text-xs);
+      }
+
+      .trend--up {
+        color: var(--ic-success);
+      }
+
+      .trend--down {
+        color: var(--ic-error);
+      }
+
+      .trend--flat {
+        color: var(--ic-text-dim);
+      }
+
+      .label {
+        font-size: var(--ic-text-xs);
+        color: var(--ic-text-dim);
+        text-transform: uppercase;
+        letter-spacing: 0.05em;
+        margin-top: var(--ic-space-xs);
+      }
+
+      .card--warning {
+        border-left: 3px solid var(--ic-warning);
+      }
+
+      .card--critical {
+        border-left: 3px solid var(--ic-error);
+      }
+
+      .threshold-icon {
+        font-size: var(--ic-text-sm);
+        flex-shrink: 0;
+      }
+
+      .threshold-icon--warning {
+        color: var(--ic-warning);
+      }
+
+      .threshold-icon--critical {
+        color: var(--ic-error);
+      }
+
+      /* Delta indicator */
+      .delta {
+        display: inline-flex;
+        align-items: center;
+        gap: 2px;
+        font-size: var(--ic-text-xs);
+        margin-left: auto;
+      }
+
+      .delta--up {
+        color: var(--ic-success);
+      }
+
+      .delta--down {
+        color: var(--ic-error);
+      }
+
+      .delta--flat {
+        color: var(--ic-text-dim);
+      }
+
+      /* Sparkline area */
+      .sparkline-area {
+        margin-top: var(--ic-space-xs);
+        width: 100%;
+        height: 24px;
+      }
+    `];K([u()],R.prototype,"label",2);K([u()],R.prototype,"value",2);K([u()],R.prototype,"trend",2);K([u()],R.prototype,"trendValue",2);K([u()],R.prototype,"threshold",2);K([u({attribute:!1})],R.prototype,"sparklineData",2);K([u()],R.prototype,"delta",2);K([u()],R.prototype,"deltaDirection",2);R=K([A("ic-stat-card")],R);var zi=Object.defineProperty,Mi=Object.getOwnPropertyDescriptor,ye=(t,e,i,r)=>{for(var s=r>1?void 0:r?Mi(e,i):e,a=t.length-1,n;a>=0;a--)(n=t[a])&&(s=(r?n(e,i,s):n(s))||s);return r&&s&&zi(e,i,s),s};let Z=class extends x{constructor(){super(...arguments),this.value=0,this.label="",this.showPercent=!0,this.thresholds={green:80,yellow:90}}_getColor(){const{value:t,thresholds:e}=this;return t<e.green?"var(--ic-success)":t<e.yellow?"var(--ic-warning)":"var(--ic-error)"}render(){const t=Math.min(this.value,100),e=this._getColor();return o`
+      ${this.label?o`<div class="label">${this.label}</div>`:g}
+      <div
+        class="bar-container"
+        role="progressbar"
+        aria-valuenow=${this.value}
+        aria-valuemin=${0}
+        aria-valuemax=${100}
+      >
+        <div class="track">
+          <div
+            class="fill"
+            style="width: ${t}%; background-color: ${e};"
+          ></div>
+        </div>
+        ${this.showPercent?o`<span class="percent">${Math.round(this.value)}%</span>`:g}
+      </div>
+    `}};Z.styles=[O,S`
+      :host {
+        display: block;
+      }
+
+      .label {
+        font-size: var(--ic-text-xs);
+        color: var(--ic-text-dim);
+        margin-bottom: var(--ic-space-xs);
+      }
+
+      .bar-container {
+        display: flex;
+        align-items: center;
+        gap: var(--ic-space-sm);
+      }
+
+      .track {
+        flex: 1;
+        height: 6px;
+        background: var(--ic-surface-alt, #1f2937);
+        border-radius: 3px;
+        overflow: hidden;
+      }
+
+      .fill {
+        height: 100%;
+        border-radius: 3px;
+        transition: width 0.3s ease;
+      }
+
+      .percent {
+        font-size: var(--ic-text-xs);
+        color: var(--ic-text-dim);
+        font-family: var(--ic-font-mono, ui-monospace, monospace);
+        min-width: 2.5em;
+        text-align: right;
+      }
+    `];ye([u({type:Number})],Z.prototype,"value",2);ye([u()],Z.prototype,"label",2);ye([u({type:Boolean})],Z.prototype,"showPercent",2);ye([u({attribute:!1})],Z.prototype,"thresholds",2);Z=ye([A("ic-progress-bar")],Z);var Li=Object.defineProperty,Ui=Object.getOwnPropertyDescriptor,we=(t,e,i,r)=>{for(var s=r>1?void 0:r?Ui(e,i):e,a=t.length-1,n;a>=0;a--)(n=t[a])&&(s=(r?n(e,i,s):n(s))||s);return r&&s&&Li(e,i,s),s};let Q=class extends x{constructor(){super(...arguments),this.value=0,this.label="",this.trend=0,this.size="md"}_getClampedValue(){return Math.max(0,Math.min(100,this.value))}_getArcColor(){const t=this._getClampedValue();return t<60?"var(--ic-success)":t<=80?"var(--ic-warning)":"var(--ic-error)"}_getTrendChar(){return this.trend>0?"↑":this.trend<0?"↓":"—"}_getTrendClass(){return this.trend>0?"trend-up":this.trend<0?"trend-down":"trend-flat"}render(){const t=this._getClampedValue(),e=50,i=50,r=42,s=2*Math.PI*r,a=t/100*s,n=s-a;return o`
+      <svg
+        class="gauge-svg"
+        viewBox="0 0 100 100"
+        preserveAspectRatio="xMidYMid meet"
+      >
+        <!-- Background circle -->
+        ${W`
+          <circle
+            cx=${e}
+            cy=${i}
+            r=${r}
+            fill="none"
+            stroke="var(--ic-surface-2, #1f2937)"
+            stroke-width="8"
+          />
+        `}
+        <!-- Value arc -->
+        ${W`
+          <circle
+            cx=${e}
+            cy=${i}
+            r=${r}
+            fill="none"
+            stroke=${this._getArcColor()}
+            stroke-width="8"
+            stroke-linecap="round"
+            stroke-dasharray=${s}
+            stroke-dashoffset=${n}
+            transform="rotate(-90 ${e} ${i})"
+            class="value-arc"
+          />
+        `}
+        <!-- Percentage text -->
+        ${W`
+          <text
+            x=${e}
+            y=${i-2}
+            text-anchor="middle"
+            dominant-baseline="central"
+            font-size="18"
+            class="value-text"
+          >${t}%</text>
+        `}
+        <!-- Trend indicator -->
+        ${W`
+          <text
+            x=${e}
+            y=${i+16}
+            text-anchor="middle"
+            dominant-baseline="central"
+            font-size="12"
+            class=${this._getTrendClass()}
+          >${this._getTrendChar()}</text>
+        `}
+      </svg>
+      ${this.label?o`<span class="label">${this.label}</span>`:""}
+    `}};Q.styles=[O,S`
+      :host {
+        display: inline-block;
+        text-align: center;
+      }
+
+      :host([size="sm"]) {
+        --gauge-size: 60px;
+      }
+
+      :host,
+      :host([size="md"]) {
+        --gauge-size: 100px;
+      }
+
+      :host([size="lg"]) {
+        --gauge-size: 140px;
+      }
+
+      .gauge-svg {
+        width: var(--gauge-size);
+        height: var(--gauge-size);
+      }
+
+      .value-text {
+        font-weight: 700;
+        fill: var(--ic-text, #f9fafb);
+      }
+
+      .trend-up {
+        fill: var(--ic-success);
+      }
+
+      .trend-down {
+        fill: var(--ic-error);
+      }
+
+      .trend-flat {
+        fill: var(--ic-text-dim);
+      }
+
+      .label {
+        display: block;
+        font-size: var(--ic-text-xs);
+        color: var(--ic-text-dim);
+        margin-top: var(--ic-space-xs);
+      }
+    `];we([u({type:Number})],Q.prototype,"value",2);we([u()],Q.prototype,"label",2);we([u({type:Number})],Q.prototype,"trend",2);we([u({reflect:!0})],Q.prototype,"size",2);Q=we([A("ic-metric-gauge")],Q);var Ni=Object.defineProperty,Vi=Object.getOwnPropertyDescriptor,z=(t,e,i,r)=>{for(var s=r>1?void 0:r?Vi(e,i):e,a=t.length-1,n;a>=0;a--)(n=t[a])&&(s=(r?n(e,i,s):n(s))||s);return r&&s&&Ni(e,i,s),s};const ct={active:"var(--ic-success)",idle:"var(--ic-warning)",suspended:"var(--ic-text-dim)",error:"var(--ic-error)",unknown:"var(--ic-text-dim)"},Hi=new Intl.NumberFormat("en-US",{style:"currency",currency:"USD"});let P=class extends x{constructor(){super(...arguments),this.name="",this.provider="",this.model="",this.status="unknown",this.agentId="",this.messagesToday=0,this.tokenUsageToday=0,this.costToday=0,this.budgetUtilization=0,this.suspended=!1}_formatTokens(t){if(t>=1e6){const e=t/1e6;return e%1===0?`${e}M`:`${e.toFixed(1)}M`}if(t>=1e3){const e=t/1e3;return e%1===0?`${e}K`:`${e.toFixed(1)}K`}return String(t)}_budgetColor(t){return t>=90?"var(--ic-error)":t>=70?"var(--ic-warning)":"var(--ic-success)"}_handleClick(){this.dispatchEvent(new CustomEvent("navigate",{detail:`agents/${this.agentId||this.name}`,bubbles:!0,composed:!0}))}_handleKeydown(t){(t.key==="Enter"||t.key===" ")&&(t.preventDefault(),this._handleClick())}_handleAction(t,e){e.stopPropagation(),this.dispatchEvent(new CustomEvent("agent-action",{detail:{action:t,agentId:this.agentId||this.name},bubbles:!0,composed:!0}))}render(){const t=this.suspended?"suspended":this.status,e=ct[t]??ct.unknown,i=t==="active"?"1a":"0d",r=this.messagesToday>0||this.tokenUsageToday>0,s=new Intl.NumberFormat("en-US"),a=this.costToday>0,n=this.budgetUtilization>0,l=Math.min(100,Math.max(0,this.budgetUtilization));return o`
+      <div
+        class="card ${this.suspended?"card--suspended":""}"
+        role="link"
+        tabindex="0"
+        @click=${this._handleClick}
+        @keydown=${this._handleKeydown}
+      >
+        <div class="card-header">
+          <span class="agent-name">${this.name||"Unnamed Agent"}</span>
+          <span
+            class="status-badge"
+            style="background: ${e}${i}; color: ${e}"
+          >
+            <span class="status-dot" style="background: ${e}"></span>
+            ${t}
+          </span>
+        </div>
+
+        <div class="card-details">
+          <div class="detail-row">
+            <span class="detail-label">Provider</span>
+            <span class="detail-value">${this.provider||"---"}</span>
+          </div>
+          <div class="detail-row">
+            <span class="detail-label">Model</span>
+            <span class="detail-value">${this.model||"---"}</span>
+          </div>
+          ${r?o`
+                <div class="detail-row">
+                  <span class="detail-label">Messages</span>
+                  <span class="detail-value">${s.format(this.messagesToday)}</span>
+                </div>
+                <div class="detail-row">
+                  <span class="detail-label">Tokens</span>
+                  <span class="detail-value">${this._formatTokens(this.tokenUsageToday)}</span>
+                </div>
+              `:""}
+          ${a?o`
+                <div class="detail-row">
+                  <span class="detail-label">Cost Today</span>
+                  <span class="detail-value">${Hi.format(this.costToday)}</span>
+                </div>
+              `:g}
+          ${n?o`
+                <div class="detail-row">
+                  <span class="detail-label">Budget</span>
+                  <div class="budget-bar">
+                    <div class="budget-track">
+                      <div
+                        class="budget-fill"
+                        style="width: ${l}%; background: ${this._budgetColor(l)}"
+                      ></div>
+                    </div>
+                    <span class="budget-pct">${l}%</span>
+                  </div>
+                </div>
+              `:g}
+        </div>
+
+        <div class="card-actions">
+          <button
+            class="action-btn"
+            aria-label="Configure ${this.name||"agent"}"
+            @click=${c=>this._handleAction("configure",c)}
+          >Configure</button>
+          ${this.suspended?o`<button
+                class="action-btn"
+                aria-label="Resume ${this.name||"agent"}"
+                @click=${c=>this._handleAction("resume",c)}
+              >Resume</button>`:o`<button
+                class="action-btn"
+                aria-label="Suspend ${this.name||"agent"}"
+                @click=${c=>this._handleAction("suspend",c)}
+              >Suspend</button>`}
+          <button
+            class="action-btn action-btn--danger"
+            aria-label="Delete ${this.name||"agent"}"
+            @click=${c=>this._handleAction("delete",c)}
+          >Delete</button>
+        </div>
+      </div>
+    `}};P.styles=[O,j,S`
+      :host {
+        display: block;
+      }
+
+      .card {
+        background: var(--ic-surface);
+        border: 1px solid var(--ic-border);
+        border-radius: 0.75rem;
+        padding: 1.25rem;
+        transition: border-color 0.15s;
+        cursor: pointer;
+        display: flex;
+        flex-direction: column;
+      }
+
+      .card:hover {
+        border-color: var(--ic-border-hover, #374151);
+      }
+
+      .card:focus-visible {
+        outline: 2px solid var(--ic-accent);
+        outline-offset: 2px;
+      }
+
+      .card--suspended {
+        opacity: 0.65;
+      }
+
+      .card-header {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        margin-bottom: 0.75rem;
+      }
+
+      .agent-name {
+        font-size: 1rem;
+        font-weight: 600;
+        color: var(--ic-text);
+      }
+
+      .status-badge {
+        display: flex;
+        align-items: center;
+        gap: 0.375rem;
+        padding: 0.25rem 0.625rem;
+        border-radius: 9999px;
+        font-size: 0.75rem;
+        font-weight: 500;
+        text-transform: capitalize;
+      }
+
+      .status-dot {
+        width: 0.375rem;
+        height: 0.375rem;
+        border-radius: 50%;
+      }
+
+      .card-details {
+        display: flex;
+        flex-direction: column;
+        gap: 0.375rem;
+        flex: 1;
+      }
+
+      .detail-row {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        font-size: 0.8125rem;
+      }
+
+      .detail-label {
+        color: var(--ic-text-dim);
+      }
+
+      .detail-value {
+        color: var(--ic-text-muted);
+        font-family: ui-monospace, monospace;
+        font-size: 0.75rem;
+      }
+
+      .budget-bar {
+        display: flex;
+        align-items: center;
+        gap: 0.5rem;
+      }
+
+      .budget-track {
+        flex: 1;
+        height: 4px;
+        background: var(--ic-surface-2, #1f2937);
+        border-radius: 2px;
+        overflow: hidden;
+        min-width: 40px;
+      }
+
+      .budget-fill {
+        height: 100%;
+        border-radius: 2px;
+        transition: width 0.3s;
+      }
+
+      .budget-pct {
+        font-family: ui-monospace, monospace;
+        font-size: 0.75rem;
+        color: var(--ic-text-muted);
+        min-width: 2.5rem;
+        text-align: right;
+      }
+
+      .card-actions {
+        display: flex;
+        gap: 0.5rem;
+        margin-top: 0.75rem;
+        padding-top: 0.75rem;
+        border-top: 1px solid var(--ic-border);
+      }
+
+      .action-btn {
+        flex: 1;
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        padding: 0.375rem 0.5rem;
+        background: transparent;
+        border: 1px solid var(--ic-border);
+        border-radius: 0.375rem;
+        color: var(--ic-text-dim);
+        font-size: 0.75rem;
+        font-family: inherit;
+        cursor: pointer;
+        transition: background 0.15s, color 0.15s, border-color 0.15s;
+      }
+
+      .action-btn:hover {
+        background: var(--ic-surface-2, #1f2937);
+        color: var(--ic-text);
+        border-color: var(--ic-text-dim);
+      }
+
+      .action-btn--danger:hover {
+        color: var(--ic-error, #f87171);
+        border-color: var(--ic-error, #f87171);
+      }
+    `];z([u({type:String})],P.prototype,"name",2);z([u({type:String})],P.prototype,"provider",2);z([u({type:String})],P.prototype,"model",2);z([u({type:String})],P.prototype,"status",2);z([u({type:String})],P.prototype,"agentId",2);z([u({type:Number})],P.prototype,"messagesToday",2);z([u({type:Number})],P.prototype,"tokenUsageToday",2);z([u({type:Number})],P.prototype,"costToday",2);z([u({type:Number})],P.prototype,"budgetUtilization",2);z([u({type:Boolean})],P.prototype,"suspended",2);P=z([A("ic-agent-card")],P);const _t={healthy:{color:"var(--ic-success)",label:"Healthy",severity:"green",pulse:!1,icon:"check-circle"},idle:{color:"var(--ic-success)",label:"Idle",severity:"green",pulse:!1,icon:"pause-circle"},stale:{color:"var(--ic-warning)",label:"Stale",severity:"yellow",pulse:!1,icon:"clock"},"startup-grace":{color:"var(--ic-warning)",label:"Starting",severity:"yellow",pulse:!0,icon:"loader"},stuck:{color:"var(--ic-error)",label:"Stuck",severity:"red",pulse:!1,icon:"alert-triangle"},errored:{color:"var(--ic-error)",label:"Error",severity:"red",pulse:!1,icon:"x-circle"},disconnected:{color:"var(--ic-text-dim)",label:"Disconnected",severity:"gray",pulse:!1,icon:"wifi-off"},unknown:{color:"var(--ic-text-dim)",label:"Unknown",severity:"gray",pulse:!1,icon:"help-circle"}},ji=new Set(Object.keys(_t)),Bi={connected:"healthy",running:"healthy",error:"errored",stopped:"disconnected",reconnecting:"healthy"};function yt(t){const e=t.toLowerCase().trim();return ji.has(e)?e:Bi[e]??"unknown"}function Ki(t){return _t[yt(t)]}function qi(t){return t==="healthy"||t==="idle"}var Fi=Object.defineProperty,Gi=Object.getOwnPropertyDescriptor,He=(t,e,i,r)=>{for(var s=r>1?void 0:r?Gi(e,i):e,a=t.length-1,n;a>=0;a--)(n=t[a])&&(s=(r?n(e,i,s):n(s))||s);return r&&s&&Fi(e,i,s),s};const Wi={telegram:"M20.3 3.5L2.6 10.3c-1.2.5-1.2 1.2-.2 1.5l4.5 1.4 1.7 5.3c.2.6.1.8.7.8.4 0 .7-.2.9-.4l2.2-2.1 4.5 3.3c.8.5 1.4.2 1.6-.8l2.9-13.6c.3-1.3-.5-1.9-1.6-1.2zM8.4 13l8.7-5.4c.4-.3.8-.1.5.2l-7.1 6.4-.3 3.1-1.8-4.3z",discord:"M19.5 5.6A16 16 0 0015.5 4a12 12 0 00-.5 1.1 15 15 0 00-6 0A12 12 0 008.5 4 16 16 0 004.5 5.6 17 17 0 002 18.6a16 16 0 005 2.5c.4-.6.8-1.2 1.1-1.8a10 10 0 01-1.7-1l.4-.3a11.5 11.5 0 0010.4 0l.4.3c-.5.4-1.1.7-1.7 1 .3.6.7 1.2 1.1 1.8a16 16 0 005-2.5A17 17 0 0019.5 5.6zM8.3 16c-1 0-1.8-1-1.8-2.1s.8-2.1 1.8-2.1 1.9 1 1.8 2.1S9.4 16 8.3 16zm7.4 0c-1 0-1.8-1-1.8-2.1s.8-2.1 1.8-2.1 1.9 1 1.8 2.1S16.8 16 15.7 16z",slack:"M5.1 15c0 1-.8 1.8-1.8 1.8S1.5 16 1.5 15s.8-1.8 1.8-1.8h1.8V15zm.9 0c0-1 .8-1.8 1.8-1.8s1.8.8 1.8 1.8v4.5c0 1-.8 1.8-1.8 1.8S6 20.5 6 19.5V15zM9 5.1c-1 0-1.8-.8-1.8-1.8S8 1.5 9 1.5s1.8.8 1.8 1.8v1.8H9zm0 .9c1 0 1.8.8 1.8 1.8S10 9.6 9 9.6H4.5c-1 0-1.8-.8-1.8-1.8S3.5 6 4.5 6H9zm9.9 1.8c0-1 .8-1.8 1.8-1.8s1.8.8 1.8 1.8-.8 1.8-1.8 1.8h-1.8V7.8zm-.9 0c0 1-.8 1.8-1.8 1.8S14.4 8.8 14.4 7.8V3.3c0-1 .8-1.8 1.8-1.8s1.8.8 1.8 1.8v4.5zM15 18.9c1 0 1.8.8 1.8 1.8s-.8 1.8-1.8 1.8-1.8-.8-1.8-1.8v-1.8H15zm0-.9c-1 0-1.8-.8-1.8-1.8s.8-1.8 1.8-1.8h4.5c1 0 1.8.8 1.8 1.8s-.8 1.8-1.8 1.8H15z",whatsapp:"M17.5 14.4c-.3-.1-1.6-.8-1.9-.9-.3-.1-.5-.1-.7.1-.2.3-.7.9-.9 1.1-.2.2-.3.2-.6.1-.3-.1-1.2-.4-2.3-1.4-.9-.8-1.4-1.7-1.6-2-.2-.3 0-.5.1-.6l.4-.5c.1-.2.2-.3.2-.5.1-.2 0-.3 0-.5s-.7-1.6-.9-2.2c-.3-.6-.5-.5-.7-.5h-.6c-.2 0-.5.1-.8.3-.3.3-1 1-1 2.5s1.1 2.9 1.2 3.1c.2.2 2.1 3.2 5 4.5.7.3 1.3.5 1.7.6.7.2 1.3.2 1.8.1.6-.1 1.6-.7 1.9-1.3.2-.6.2-1.2.2-1.3-.1-.1-.3-.2-.6-.3zM12 2C6.5 2 2 6.5 2 12c0 1.8.5 3.5 1.3 4.9L2 22l5.2-1.4c1.4.8 3 1.2 4.8 1.2 5.5 0 10-4.5 10-10S17.5 2 12 2z",line:"M22 10.8c0-4.8-4.8-8.7-10.8-8.7S.4 6 .4 10.8c0 4.3 3.8 7.9 9 8.6.3.1.8.2.9.5.1.3.1.6 0 .9l-.1.9c0 .3-.2 1.1.9.6s6.2-3.7 8.5-6.3c1.6-1.6 2.4-3.4 2.4-5.2zM7.5 13.3H5.7c-.3 0-.5-.2-.5-.5V9.2c0-.3.2-.5.5-.5s.5.2.5.5v3.1h1.3c.3 0 .5.2.5.5s-.2.5-.5.5zm1.9-.5c0 .3-.2.5-.5.5s-.5-.2-.5-.5V9.2c0-.3.2-.5.5-.5s.5.2.5.5v3.6zm5 0c0 .2-.1.4-.3.4l-.2.1-2.5-3.4v3c0 .3-.2.5-.5.5s-.5-.2-.5-.5V9.2c0-.2.1-.4.3-.4h.1l2.6 3.5V9.2c0-.3.2-.5.5-.5s.5.2.5.5v3.6zm3.5.5h-1.8c-.3 0-.5-.2-.5-.5V9.2c0-.3.2-.5.5-.5s.5.2.5.5v3.1h1.3c.3 0 .5.2.5.5s-.2.5-.5.5z",signal:"M12 2C6.5 2 2 6.5 2 12s4.5 10 10 10 10-4.5 10-10S17.5 2 12 2zm0 3c3.9 0 7 3.1 7 7s-3.1 7-7 7-7-3.1-7-7 3.1-7 7-7zm0 3a4 4 0 100 8 4 4 0 000-8zm0 2.5a1.5 1.5 0 110 3 1.5 1.5 0 010-3z",imessage:"M12 2C6.5 2 2 5.8 2 10.5c0 2.7 1.5 5.1 3.8 6.7-.2 1-.6 2.5-1.8 3.8 2.1-.3 3.8-1.1 4.8-1.8.9.2 2 .3 3.2.3 5.5 0 10-3.8 10-8.5S17.5 2 12 2z",irc:"M4 4h16v12H5.2L4 17.2V4zm2 2v8h12V6H6zm2 2h8v1H8V8zm0 3h6v1H8v-1z"},Ji={telegram:"var(--ic-telegram)",discord:"var(--ic-discord)",slack:"var(--ic-slack)",whatsapp:"var(--ic-whatsapp)",line:"var(--ic-line)",signal:"var(--ic-signal)",imessage:"var(--ic-imessage)",irc:"var(--ic-irc)"},Xi="M12 2C6.5 2 2 6.5 2 12s4.5 10 10 10 10-4.5 10-10S17.5 2 12 2z";let fe=class extends x{constructor(){super(...arguments),this.platform="",this.size="20px"}render(){const t=this.platform.toLowerCase(),e=Wi[t]??Xi,i=Ji[t]??"var(--ic-text-dim)";return o`
+      <svg
+        width=${this.size}
+        height=${this.size}
+        viewBox="0 0 24 24"
+        fill=${i}
+        aria-hidden="true"
+      >
+        ${W`<path d=${e} />`}
+      </svg>
+    `}};fe.styles=[O,S`
+      :host {
+        display: inline-flex;
+        align-items: center;
+      }
+
+      svg {
+        display: block;
+      }
+    `];He([u()],fe.prototype,"platform",2);He([u()],fe.prototype,"size",2);fe=He([A("ic-platform-icon")],fe);var Yi=Object.defineProperty,Zi=Object.getOwnPropertyDescriptor,te=(t,e,i,r)=>{for(var s=r>1?void 0:r?Zi(e,i):e,a=t.length-1,n;a>=0;a--)(n=t[a])&&(s=(r?n(e,i,s):n(s))||s);return r&&s&&Yi(e,i,s),s};let V=class extends x{constructor(){super(...arguments),this.channelType="",this.name="",this.status="disconnected",this.enabled=!1,this.uptime=0,this.channelId=""}_formatUptime(t){if(t<60)return"0m";const e=Math.floor(t/86400),i=Math.floor(t%86400/3600),r=Math.floor(t%3600/60);return e>0?`${e}d ${i}h`:i>0?`${i}h`:`${r}m`}_handleClick(){this.dispatchEvent(new CustomEvent("navigate",{detail:`channels/${this.channelId||this.channelType}`,bubbles:!0,composed:!0}))}_handleKeydown(t){(t.key==="Enter"||t.key===" ")&&(t.preventDefault(),this._handleClick())}render(){const t=Ki(this.status),e=this.name||this.channelType,i=this.uptime>0&&qi(yt(this.status));return o`
+      <div
+        class="badge"
+        role="link"
+        tabindex="0"
+        @click=${this._handleClick}
+        @keydown=${this._handleKeydown}
+      >
+        <ic-platform-icon .platform=${this.channelType} size="16px"></ic-platform-icon>
+        <span class="channel-name">${e}</span>
+        <span class="status-dot ${t.pulse?"pulse":""}" style="background: ${t.color}"></span>
+        <span class="status-label" style="font-size: 0.6875rem; color: ${t.color};">${t.label}</span>
+        ${i?o`<span class="uptime">${this._formatUptime(this.uptime)}</span>`:""}
+        ${this.enabled?"":o`<span class="disabled-label">(off)</span>`}
+      </div>
+    `}};V.styles=[O,j,S`
+      :host {
+        display: inline-block;
+      }
+
+      .badge {
+        display: inline-flex;
+        align-items: center;
+        gap: 0.5rem;
+        padding: 0.5rem 0.875rem;
+        background: var(--ic-surface);
+        border: 1px solid var(--ic-border);
+        border-radius: 0.5rem;
+        font-size: 0.8125rem;
+        transition: border-color 0.15s;
+        cursor: pointer;
+      }
+
+      .badge:hover {
+        border-color: var(--ic-border-hover, #374151);
+      }
+
+      .badge:focus-visible {
+        outline: 2px solid var(--ic-accent);
+        outline-offset: 2px;
+      }
+
+      .channel-name {
+        color: var(--ic-text-muted);
+        font-weight: 500;
+        text-transform: capitalize;
+      }
+
+      .status-dot {
+        width: 0.5rem;
+        height: 0.5rem;
+        border-radius: 50%;
+        margin-left: 0.25rem;
+      }
+
+      .status-dot.pulse {
+        animation: pulse 2s ease-in-out infinite;
+      }
+
+      @keyframes pulse {
+        0%, 100% { opacity: 1; }
+        50% { opacity: 0.4; }
+      }
+
+      @media (prefers-reduced-motion: reduce) {
+        .status-dot.pulse { animation: none; }
+      }
+
+      .uptime {
+        font-size: var(--ic-text-xs);
+        color: var(--ic-text-dim);
+      }
+
+      .disabled-label {
+        font-size: 0.6875rem;
+        color: var(--ic-text-dim);
+        margin-left: 0.125rem;
+      }
+    `];te([u({type:String})],V.prototype,"channelType",2);te([u({type:String})],V.prototype,"name",2);te([u({type:String})],V.prototype,"status",2);te([u({type:Boolean})],V.prototype,"enabled",2);te([u({type:Number})],V.prototype,"uptime",2);te([u({type:String})],V.prototype,"channelId",2);V=te([A("ic-channel-badge")],V);var Qi=Object.defineProperty,es=Object.getOwnPropertyDescriptor,je=(t,e,i,r)=>{for(var s=r>1?void 0:r?es(e,i):e,a=t.length-1,n;a>=0;a--)(n=t[a])&&(s=(r?n(e,i,s):n(s))||s);return r&&s&&Qi(e,i,s),s};let be=class extends x{constructor(){super(...arguments),this.options=[],this.selected=new Set}_toggleChip(t){const e=new Set(this.selected);e.has(t)?e.delete(t):e.add(t),this.selected=e,this.dispatchEvent(new CustomEvent("filter-change",{detail:{selected:e},bubbles:!0,composed:!0}))}_toggleAll(){const e=this.options.every(i=>this.selected.has(i.value))?new Set:new Set(this.options.map(i=>i.value));this.selected=e,this.dispatchEvent(new CustomEvent("filter-change",{detail:{selected:e},bubbles:!0,composed:!0}))}_renderChip(t,e,i,r){if(e){const s=r??"var(--ic-accent)";return o`
+        <button
+          class="chip"
+          style="background: ${s}33; color: ${s}; border: 1px solid ${s};"
+          @click=${i}
+        >
+          ${t}
+        </button>
+      `}return o`
+      <button class="chip chip--unselected" @click=${i}>
+        ${t}
+      </button>
+    `}render(){const t=this.options.length>0&&this.options.every(e=>this.selected.has(e.value));return o`
+      <div class="chips">
+        ${this._renderChip("All",t,()=>this._toggleAll())}
+        ${this.options.map(e=>this._renderChip(e.label,this.selected.has(e.value),()=>this._toggleChip(e.value),e.color))}
+      </div>
+    `}};be.styles=[O,j,S`
+      :host {
+        display: block;
+      }
+
+      .chips {
+        display: flex;
+        flex-wrap: wrap;
+        gap: var(--ic-space-xs);
+      }
+
+      .chip {
+        border-radius: 9999px;
+        padding: 0.25rem 0.75rem;
+        font-size: var(--ic-text-xs);
+        cursor: pointer;
+        transition: all 0.15s;
+        font-family: inherit;
+        line-height: 1.5;
+      }
+
+      .chip--unselected {
+        background: transparent;
+        color: var(--ic-text-dim);
+        border: 1px solid var(--ic-border);
+      }
+
+      .chip--unselected:hover {
+        border-color: var(--ic-text-dim);
+      }
+    `];je([u({attribute:!1})],be.prototype,"options",2);je([u({attribute:!1})],be.prototype,"selected",2);be=je([A("ic-filter-chips")],be);var ts=Object.defineProperty,is=Object.getOwnPropertyDescriptor,ie=(t,e,i,r)=>{for(var s=r>1?void 0:r?is(e,i):e,a=t.length-1,n;a>=0;a--)(n=t[a])&&(s=(r?n(e,i,s):n(s))||s);return r&&s&&ts(e,i,s),s};const wt={"message:received":{label:"MSG IN",color:"#3b82f6"},"message:sent":{label:"MSG OUT",color:"#22c55e"},"message:streaming":{label:"STREAM",color:"#8b5cf6"},"session:created":{label:"SESSION",color:"#06b6d4"},"session:expired":{label:"EXPIRED",color:"#6b7280"},"audit:event":{label:"AUDIT",color:"#f59e0b"},"skill:loaded":{label:"SKILL",color:"#10b981"},"skill:executed":{label:"SKILL RUN",color:"#10b981"},"skill:rejected":{label:"REJECTED",color:"#ef4444"},"scheduler:job_started":{label:"JOB START",color:"#8b5cf6"},"scheduler:job_completed":{label:"JOB DONE",color:"#22c55e"},"scheduler:heartbeat_check":{label:"HEARTBEAT",color:"#06b6d4"},"scheduler:task_extracted":{label:"TASK",color:"#f59e0b"},"system:error":{label:"ERROR",color:"#ef4444"}},ss=Object.entries(wt).map(([t,e])=>({value:t,label:e.label,color:e.color}));function rs(t){const e=Date.now()-t,i=Math.floor(e/1e3);if(i<60)return`${i}s ago`;const r=Math.floor(i/60);if(r<60)return`${r}m ago`;const s=Math.floor(r/60);return s<24?`${s}h ago`:`${Math.floor(s/24)}d ago`}function ns(t,e){if(t==="message:received"||t==="message:sent"){const r=e.channelType??e.channelId??"",s=e.text??"",a=s.length>60?s.slice(0,57)+"...":s;return r?`[${r}] ${a}`:a}if(t==="system:error")return(e.message??e.error??"Unknown error").slice(0,80);if(t==="skill:executed"||t==="skill:loaded")return e.skillName??e.name??"unknown skill";if(t==="scheduler:job_completed"||t==="scheduler:job_started")return e.taskId??e.jobId??"";if(t==="audit:event")return e.action??e.type??"audit event";const i=Object.keys(e).slice(0,2);return i.length===0?"":i.map(r=>`${r}: ${String(e[r]).slice(0,30)}`).join(", ")}let H=class extends x{constructor(){super(...arguments),this.entries=[],this.sseSubscribe=null,this._liveEntries=[],this._activeFilters=new Set,this._paused=!1,this._pauseBuffer=[],this._unsubscribe=null,this._nextLiveId=1e5}connectedCallback(){super.connectedCallback(),this._startSse()}disconnectedCallback(){super.disconnectedCallback(),this._stopSse()}updated(t){t.has("sseSubscribe")&&(this._stopSse(),this._startSse())}_startSse(){this.sseSubscribe&&(this._unsubscribe=this.sseSubscribe((t,e)=>{if(t==="ping"||t==="error")return;const i={id:this._nextLiveId++,event:t,payload:e??{},timestamp:Date.now()};this._paused?this._pauseBuffer=[i,...this._pauseBuffer].slice(0,200):this._liveEntries=[i,...this._liveEntries].slice(0,200)}))}_stopSse(){this._unsubscribe?.(),this._unsubscribe=null}_mergedEntries(){const t=[...this.entries].reverse(),e=[...this._liveEntries,...t],i=new Set,r=[];for(const s of e)if(!i.has(s.id)&&(i.add(s.id),r.push(s),r.length>=200))break;return r}_onFilterChange(t){this._activeFilters=t.detail.selected}_togglePause(){this._paused?(this._liveEntries=[...this._pauseBuffer,...this._liveEntries].slice(0,200),this._pauseBuffer=[],this._paused=!1):this._paused=!0}render(){const t=this._mergedEntries(),e=this._activeFilters.size===0?t:t.filter(r=>this._activeFilters.has(r.event)),i=this._unsubscribe!==null;return o`
+      <div class="feed-container" aria-label="Activity feed">
+        <div class="feed-header">
+          <span class="feed-title">Recent Activity</span>
+          <div class="header-controls">
+            ${i?this._paused?o`
+                      <span class="paused-indicator">
+                        <span class="paused-dot"></span>
+                        Paused
+                      </span>
+                    `:o`
+                      <span class="live-indicator">
+                        <span class="live-dot"></span>
+                        Live
+                      </span>
+                    `:g}
+            ${i?o`
+                    <button
+                      class="pause-btn"
+                      @click=${this._togglePause}
+                      aria-label=${this._paused?"Resume live feed":"Pause live feed"}
+                    >
+                      ${this._paused?`Resume (${this._pauseBuffer.length})`:"Pause"}
+                    </button>
+                  `:g}
+          </div>
+        </div>
+
+        <div class="feed-filters">
+          <ic-filter-chips
+            .options=${ss}
+            .selected=${this._activeFilters}
+            @filter-change=${this._onFilterChange}
+          ></ic-filter-chips>
+        </div>
+
+        <div class="feed-list" aria-live="polite">
+          ${e.length===0?o`
+                  <div class="empty-state">No activity yet</div>
+                `:e.map(r=>{const s=wt[r.event]??{label:r.event.toUpperCase(),color:"#6b7280"},a=ns(r.event,r.payload);return o`
+                  <div class="feed-item">
+                    <span
+                      class="event-badge"
+                      style="background: ${s.color}1a; color: ${s.color}"
+                    >
+                      ${s.label}
+                    </span>
+                    <span class="event-summary">${a}</span>
+                    <span class="event-time">${rs(r.timestamp)}</span>
+                  </div>
+                `})}
+        </div>
+      </div>
+    `}};H.styles=[O,j,S`
+      :host {
+        display: block;
+      }
+
+      .feed-container {
+        background: var(--ic-surface);
+        border: 1px solid var(--ic-border);
+        border-radius: 0.75rem;
+        overflow: hidden;
+      }
+
+      .feed-header {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        padding: 0.875rem 1.25rem;
+        border-bottom: 1px solid var(--ic-border);
+      }
+
+      .feed-title {
+        font-size: 0.875rem;
+        font-weight: 600;
+        color: var(--ic-text);
+      }
+
+      .header-controls {
+        display: flex;
+        align-items: center;
+        gap: 0.5rem;
+      }
+
+      .live-indicator {
+        display: flex;
+        align-items: center;
+        gap: 0.375rem;
+        font-size: 0.75rem;
+        color: var(--ic-success);
+      }
+
+      .live-dot {
+        width: 0.375rem;
+        height: 0.375rem;
+        border-radius: 50%;
+        background: var(--ic-success);
+        animation: pulse 2s infinite;
+      }
+
+      @keyframes pulse {
+        0%,
+        100% {
+          opacity: 1;
+        }
+        50% {
+          opacity: 0.4;
+        }
+      }
+
+      .paused-indicator {
+        display: flex;
+        align-items: center;
+        gap: 0.375rem;
+        font-size: 0.75rem;
+        color: var(--ic-warning);
+      }
+
+      .paused-dot {
+        width: 0.375rem;
+        height: 0.375rem;
+        border-radius: 50%;
+        background: var(--ic-warning);
+      }
+
+      .pause-btn {
+        background: transparent;
+        border: 1px solid var(--ic-border);
+        border-radius: var(--ic-radius-sm, 0.25rem);
+        padding: 0.125rem 0.5rem;
+        font-size: var(--ic-text-xs);
+        color: var(--ic-text-dim);
+        cursor: pointer;
+        font-family: inherit;
+      }
+
+      .pause-btn:hover {
+        border-color: var(--ic-text-dim);
+        color: var(--ic-text);
+      }
+
+      .feed-filters {
+        padding: 0.5rem 1.25rem;
+        border-bottom: 1px solid var(--ic-border);
+      }
+
+      .feed-list {
+        max-height: 28rem;
+        overflow-y: auto;
+      }
+
+      .feed-item {
+        display: flex;
+        align-items: flex-start;
+        gap: 0.75rem;
+        padding: 0.625rem 1.25rem;
+        border-bottom: 1px solid var(--ic-border);
+        font-size: 0.8125rem;
+      }
+
+      .feed-item:last-child {
+        border-bottom: none;
+      }
+
+      .event-badge {
+        padding: 0.125rem 0.5rem;
+        border-radius: 0.25rem;
+        font-size: 0.625rem;
+        font-weight: 600;
+        letter-spacing: 0.025em;
+        white-space: nowrap;
+        flex-shrink: 0;
+      }
+
+      .event-summary {
+        color: var(--ic-text-muted);
+        flex: 1;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+
+      .event-time {
+        color: var(--ic-text-dim);
+        font-size: 0.75rem;
+        white-space: nowrap;
+        flex-shrink: 0;
+      }
+
+      .empty-state {
+        padding: 2rem 1.25rem;
+        text-align: center;
+        color: var(--ic-text-dim);
+        font-size: 0.875rem;
+      }
+    `];ie([u({attribute:!1})],H.prototype,"entries",2);ie([u({attribute:!1})],H.prototype,"sseSubscribe",2);ie([v()],H.prototype,"_liveEntries",2);ie([v()],H.prototype,"_activeFilters",2);ie([v()],H.prototype,"_paused",2);ie([v()],H.prototype,"_pauseBuffer",2);H=ie([A("ic-activity-feed")],H);var as=Object.defineProperty,os=Object.getOwnPropertyDescriptor,$=(t,e,i,r)=>{for(var s=r>1?void 0:r?os(e,i):e,a=t.length-1,n;a>=0;a--)(n=t[a])&&(s=(r?n(e,i,s):n(s))||s);return r&&s&&as(e,i,s),s};const ls=6e4,_={agents:"agents",sessions:"sessions",messages:"observe/delivery",tokens:"observe/billing",cost:"observe/billing",errors:"observe/diagnostics",health:"observe/overview",context:"observe/context",channels:"channels"};function cs(t){if(t<0)return"0m";const e=Math.floor(t/86400),i=Math.floor(t%86400/3600),r=Math.floor(t%3600/60),s=[];return e>0&&s.push(`${e}d`),(i>0||e>0)&&s.push(`${i}h`),s.push(`${r}m`),s.join(" ")}function pe(t){return new Intl.NumberFormat("en-US").format(t)}function ds(t){if(t>=1e6){const e=t/1e6;return e%1===0?`${e}M`:`${e.toFixed(1)}M`}if(t>=1e3){const e=t/1e3;return e%1===0?`${e}K`:`${e.toFixed(1)}K`}return String(t)}const dt=new Intl.NumberFormat("en-US",{style:"currency",currency:"USD"});function ps(t,e,i){return t<e?"var(--ic-success)":t<i?"var(--ic-warning)":"var(--ic-error)"}function hs(t,e,i){return t<e?"":t<i?"(Warning)":"(Critical)"}let y=class extends x{constructor(){super(...arguments),this.apiClient=null,this.rpcClient=null,this.eventDispatcher=null,this._loadState="loading",this._error="",this._agents=[],this._channels=[],this._activity=[],this._systemHealth=null,this._deliveryStats=null,this._messagesToday=0,this._tokenUsageToday=0,this._sessionCount=0,this._errorCount=0,this._totalCost=0,this._prevMessages=0,this._prevTokens=0,this._prevCost=0,this._mcpStatus="---",this._contextSummary=null,this._tokenSparklineData=[],this._costSparklineData=[],this._agentBilling=new Map,this._sse=null,this._rpcRefreshInterval=null,this._reloadDebounce=null}connectedCallback(){super.connectedCallback(),this._initSse()}disconnectedCallback(){super.disconnectedCallback(),this._reloadDebounce!==null&&(clearTimeout(this._reloadDebounce),this._reloadDebounce=null),this._stopRpcRefresh()}updated(t){t.has("apiClient")&&this.apiClient&&this._loadData(),t.has("rpcClient")&&(this._stopRpcRefresh(),this._startRpcRefresh(),this._loadRpcData()),t.has("eventDispatcher")&&this.eventDispatcher&&!this._sse&&this._initSse()}_navigate(t){this.dispatchEvent(new CustomEvent("navigate",{detail:t,bubbles:!0,composed:!0}))}_makeKeyHandler(t){return e=>{(e.key==="Enter"||e.key===" ")&&(e.preventDefault(),this._navigate(t))}}_scheduleReload(t=300){this._reloadDebounce!==null&&clearTimeout(this._reloadDebounce),this._reloadDebounce=setTimeout(()=>{this._reloadDebounce=null,this._loadData()},t)}_initSse(){!this.eventDispatcher||this._sse||(this._sse=new Oi(this,this.eventDispatcher,{"message:received":()=>{this._messagesToday++},"message:sent":()=>{this._messagesToday++},"session:created":()=>{this._sessionCount++},"system:error":()=>{this._errorCount++},"observability:token_usage":()=>{this._scheduleReload()},"diagnostic:channel_health":()=>{this._scheduleReload(500)},"diagnostic:billing_snapshot":()=>{this._scheduleReload()},"agent:hot_added":()=>{this._scheduleReload()},"agent:hot_removed":()=>{this._scheduleReload()},"channel:registered":()=>{this._scheduleReload()},"channel:deregistered":()=>{this._scheduleReload()},"observability:metrics":()=>{this._scheduleReload(500)}}))}_startRpcRefresh(){this._rpcRefreshInterval===null&&(this._rpcRefreshInterval=setInterval(()=>{this._loadRpcData()},ls))}_stopRpcRefresh(){this._rpcRefreshInterval!==null&&(clearInterval(this._rpcRefreshInterval),this._rpcRefreshInterval=null)}async _loadRpcData(){if(!this.rpcClient||this.rpcClient.status!=="connected")return;const t=this.rpcClient,[e,i,r,s,a,n,l,c]=await Promise.allSettled([t.call("gateway.status"),t.call("obs.delivery.stats"),t.call("obs.billing.total",{sinceMs:864e5}),t.call("obs.billing.total",{sinceMs:1728e5}),t.call("session.list",{}),t.call("mcp.list"),t.call("obs.context.pipeline",{limit:50}),t.call("obs.billing.usage24h")]);if(e.status==="fulfilled"&&(this._systemHealth=e.value),i.status==="fulfilled"){const d=i.value,p=Number(d.total??d.totalDelivered??0),h=Number(d.successes??0),m=Number(d.failures??d.failed??0),f=Number(d.avgLatencyMs??0);this._deliveryStats={successRate:p>0?h/p*100:0,avgLatencyMs:f,totalDelivered:p,failed:m},this._messagesToday=p,this._errorCount=m}if(r.status==="fulfilled"){const d=Number(r.value.totalTokens??0),p=Number(r.value.totalCost??0);if(this._tokenUsageToday=d,this._totalCost=p,s.status==="fulfilled"){const h=Number(s.value.totalTokens??0),m=Number(s.value.totalCost??0);this._prevTokens=Math.max(0,h-d),this._prevCost=Math.max(0,m-p)}this._prevMessages=0}if(a.status==="fulfilled"&&(this._sessionCount=Number(a.value.total??0)),n.status==="fulfilled"){const d=n.value;if(!d.servers||d.total===0)this._mcpStatus="N/A";else{const p=d.servers.filter(h=>h.status==="connected").length;this._mcpStatus=`${p}/${d.total}`}}if(l.status==="fulfilled"){const d=l.value;if(d&&d.length>0){const p=d.filter(f=>f.cacheHitTokens>0).length,h=d.reduce((f,T)=>f+T.budgetUtilization,0)/d.length,m=d.reduce((f,T)=>f+T.tokensEvicted,0);this._contextSummary={cacheHitRate:Math.round(p/d.length*100),budgetUtilization:Math.round(h),totalEvictions:m,reReads:d.length-p}}else this._contextSummary=null}c.status==="fulfilled"&&Array.isArray(c.value)&&(this._tokenSparklineData=c.value.map(d=>d.tokens)),await Promise.allSettled([this._loadCostSparkline(),this._loadAgentBilling()])}async _loadCostSparkline(){if(!this.rpcClient)return;const t=864e5,e=Array.from({length:7},(a,n)=>this.rpcClient.call("obs.billing.total",{sinceMs:t*(n+1)})),r=(await Promise.allSettled(e)).map(a=>a.status==="fulfilled"?Number(a.value.totalCost??0):0),s=r.map((a,n)=>n===0?a:Math.max(0,a-r[n-1]));this._costSparklineData=s.reverse()}async _loadSparklineData(){!this.rpcClient||this.rpcClient.status!=="connected"||await Promise.allSettled([(async()=>{const t=await this.rpcClient.call("obs.billing.usage24h");this._tokenSparklineData=t.map(e=>e.tokens)})(),this._loadCostSparkline()])}async _loadAgentBilling(){if(!this.rpcClient||this._agents.length===0)return;const t=await Promise.allSettled(this._agents.slice(0,20).map(i=>this.rpcClient.call("obs.billing.byAgent",{agentId:i.id}))),e=new Map;t.forEach((i,r)=>{i.status==="fulfilled"&&e.set(this._agents[r].id,{cost:i.value.totalCost??0,tokens:i.value.totalTokens??0})}),this._agentBilling=e}async _loadData(){if(this.apiClient){this._loadState="loading",this._error="";try{const[t,e,i]=await Promise.all([this.apiClient.getAgents().catch(()=>[]),this.apiClient.getChannels().catch(()=>[]),this.apiClient.getActivity(50).catch(()=>[])]);this._agents=t,this._channels=e,this._activity=i,this._loadState="loaded",this._loadRpcData()}catch(t){this._error=t instanceof Error?t.message:"Failed to load dashboard data",this._loadState="error"}}}_computeDelta(t,e){if(e<=0)return t>0?{trend:"up",trendValue:"+100%"}:{trend:"flat",trendValue:""};const i=Math.round((t-e)/e*100);return i>0?{trend:"up",trendValue:`+${i}%`}:i<0?{trend:"down",trendValue:`${i}%`}:{trend:"flat",trendValue:""}}_getSseSubscriber(){return this.apiClient?this.apiClient.subscribeEvents.bind(this.apiClient):null}_renderSystemHealth(){if(!this._systemHealth)return o`
+        <div class="info-card info-card--link" role="link" tabindex="0"
+          @click=${()=>this._navigate(_.health)}
+          @keydown=${this._makeKeyHandler(_.health)}
+          aria-label="View system overview"
+        >
+          <div class="info-card-title">System Health</div>
+          <div class="info-row">
+            <span class="info-label">Loading...</span>
+            <span class="info-value">---</span>
+          </div>
+        </div>
+      `;const t=this._systemHealth,e=t.memoryUsage??0,i=Math.round(e/1024/1024),r=t.eventLoopDelay??0,s=ps(r,50,100),a=t.uptime??0,n=t.nodeVersion??"---";return o`
+      <div class="info-card info-card--link" role="link" tabindex="0"
+        @click=${()=>this._navigate(_.health)}
+        @keydown=${this._makeKeyHandler(_.health)}
+        aria-label="View system overview"
+      >
+        <div class="info-card-title">System Health</div>
+        <div class="info-row">
+          <span class="info-label">Uptime</span>
+          <span class="info-value">${cs(a)}</span>
+        </div>
+        <div class="info-row">
+          <span class="info-label">Memory (RSS)</span>
+          <span class="info-value">${i} MB</span>
+        </div>
+        <div class="info-row">
+          <span class="info-label">Event Loop Delay</span>
+          <span class="info-value" style="color: ${s}">
+            ${r.toFixed(1)}ms ${hs(r,50,100)}
+          </span>
+        </div>
+        <div class="info-row">
+          <span class="info-label">Node.js</span>
+          <span class="info-value">${n}</span>
+        </div>
+        <div class="info-row">
+          <span class="info-label">MCP Servers</span>
+          <span class="info-value">${this._mcpStatus}</span>
+        </div>
+        ${t.cpuUsage!=null?o`
+              <div class="info-row">
+                <span class="info-label">CPU</span>
+                <div style="flex: 1; max-width: 60%; margin-left: auto;">
+                  <ic-progress-bar
+                    .value=${Math.round(t.cpuUsage)}
+                    .showPercent=${!0}
+                    .thresholds=${{green:70,yellow:90}}
+                  ></ic-progress-bar>
+                </div>
+              </div>
+            `:g}
+      </div>
+    `}_renderContextSummary(){if(!this._contextSummary)return o`
+        <div class="info-card info-card--link" role="link" tabindex="0"
+          @click=${()=>this._navigate(_.context)}
+          @keydown=${this._makeKeyHandler(_.context)}
+          aria-label="View context engine"
+        >
+          <div class="info-card-title">Context Engine</div>
+          <div class="no-data-placeholder">No pipeline data</div>
+        </div>
+      `;const t=this._contextSummary;return o`
+      <div class="info-card info-card--link" role="link" tabindex="0"
+        @click=${()=>this._navigate(_.context)}
+        @keydown=${this._makeKeyHandler(_.context)}
+        aria-label="View context engine"
+      >
+        <div class="info-card-title">Context Engine</div>
+        <div class="context-summary-grid">
+          <div class="context-metric">
+            <span class="context-metric-value">${t.cacheHitRate}%</span>
+            <span class="context-metric-label">Cache Hit Rate</span>
+          </div>
+          <div class="context-metric">
+            <ic-metric-gauge
+              .value=${t.budgetUtilization}
+              label="Budget Used"
+              size="sm"
+            ></ic-metric-gauge>
+          </div>
+          <div class="context-metric">
+            <span class="context-metric-value">${pe(t.reReads)}</span>
+            <span class="context-metric-label">Re-reads</span>
+          </div>
+          <div class="context-metric">
+            <span class="context-metric-value">${pe(t.totalEvictions)}</span>
+            <span class="context-metric-label">Evictions</span>
+          </div>
+        </div>
+      </div>
+    `}render(){if(this._loadState==="loading")return o`<ic-skeleton-view variant="dashboard"></ic-skeleton-view>`;if(this._loadState==="error")return o`
+        <div class="error-container">
+          <span class="error-message">${this._error}</span>
+          <button class="retry-btn" @click=${()=>this._loadData()}>Retry</button>
+        </div>
+      `;const t=this._agents.filter(a=>a.status==="active").length,e=this.rpcClient!=null,i=this._computeDelta(this._messagesToday,this._prevMessages),r=this._computeDelta(this._tokenUsageToday,this._prevTokens),s=this._computeDelta(this._totalCost,this._prevCost);return o`
+      <div class="dashboard-grid" role="region" aria-label="Dashboard">
+        <!-- Stats row: 6 stat cards with click-to-navigate -->
+        <div class="stats-row" aria-live="polite">
+          <div class="stat-card-link" role="link" tabindex="0"
+            @click=${()=>this._navigate(_.agents)}
+            @keydown=${this._makeKeyHandler(_.agents)}
+            aria-label="View all agents"
+          >
+            <ic-stat-card
+              label="Active Agents"
+              .value=${`${t}/${this._agents.length}`}
+            ></ic-stat-card>
+          </div>
+          <div class="stat-card-link" role="link" tabindex="0"
+            @click=${()=>this._navigate(_.sessions)}
+            @keydown=${this._makeKeyHandler(_.sessions)}
+            aria-label="View all sessions"
+          >
+            <ic-stat-card
+              label="Sessions"
+              .value=${e?pe(this._sessionCount):"---"}
+            ></ic-stat-card>
+          </div>
+          <div class="stat-card-link" role="link" tabindex="0"
+            @click=${()=>this._navigate(_.messages)}
+            @keydown=${this._makeKeyHandler(_.messages)}
+            aria-label="View message delivery"
+          >
+            <ic-stat-card
+              label="Messages Today"
+              .value=${e?pe(this._messagesToday):"---"}
+              .trend=${e?i.trend:""}
+              .trendValue=${e?i.trendValue:""}
+            ></ic-stat-card>
+          </div>
+          <div class="stat-card-link" role="link" tabindex="0"
+            @click=${()=>this._navigate(_.tokens)}
+            @keydown=${this._makeKeyHandler(_.tokens)}
+            aria-label="View token billing"
+          >
+            <ic-stat-card
+              label="Tokens Today"
+              .value=${e?ds(this._tokenUsageToday):"---"}
+              .trend=${e?r.trend:""}
+              .trendValue=${e?r.trendValue:""}
+            ></ic-stat-card>
+          </div>
+          <div class="stat-card-link" role="link" tabindex="0"
+            @click=${()=>this._navigate(_.cost)}
+            @keydown=${this._makeKeyHandler(_.cost)}
+            aria-label="View cost billing"
+          >
+            <ic-stat-card
+              label="Cost Today"
+              .value=${e?dt.format(this._totalCost):"---"}
+              .trend=${e?s.trend:""}
+              .trendValue=${e?s.trendValue:""}
+            ></ic-stat-card>
+          </div>
+          <div class="stat-card-link" role="link" tabindex="0"
+            @click=${()=>this._navigate(_.errors)}
+            @keydown=${this._makeKeyHandler(_.errors)}
+            aria-label="View error diagnostics"
+          >
+            <ic-stat-card
+              label="Errors"
+              .value=${e?pe(this._errorCount):"---"}
+              .threshold=${this._errorCount>10?"critical":this._errorCount>3?"warning":"normal"}
+            ></ic-stat-card>
+          </div>
+        </div>
+
+        <!-- Info cards row: System Health + Context Engine Summary (clickable) -->
+        <div class="info-cards-row">
+          ${this._renderSystemHealth()}
+          ${this._renderContextSummary()}
+        </div>
+
+        <!-- Sparklines row -->
+        <div class="sparklines-row">
+          <div class="sparkline-card" role="link" tabindex="0"
+            @click=${()=>this._navigate(_.tokens)}
+            @keydown=${this._makeKeyHandler(_.tokens)}
+            aria-label="View token usage details"
+          >
+            <div class="sparkline-header">
+              <span class="sparkline-title">Token Usage (24h)</span>
+              <ic-sparkline
+                .data=${this._tokenSparklineData}
+                width=${120}
+                height=${32}
+                color="var(--ic-accent)"
+              ></ic-sparkline>
+            </div>
+          </div>
+          <div class="sparkline-card" role="link" tabindex="0"
+            @click=${()=>this._navigate(_.cost)}
+            @keydown=${this._makeKeyHandler(_.cost)}
+            aria-label="View cost trend details"
+          >
+            <div class="sparkline-header">
+              <span class="sparkline-title">Cost Trend (7d)</span>
+              <ic-sparkline
+                .data=${this._costSparklineData}
+                width=${120}
+                height=${32}
+                color="var(--ic-success)"
+              ></ic-sparkline>
+            </div>
+          </div>
+        </div>
+
+        <!-- Agents section -->
+        <div class="section">
+          <span class="section-title section-title--link"
+            role="link" tabindex="0"
+            @click=${()=>this._navigate(_.agents)}
+            @keydown=${this._makeKeyHandler(_.agents)}
+          >Agents</span>
+          <div class="agents-grid">
+            ${this._agents.length===0?o`<div class="empty-text">No agents configured</div>`:this._agents.map(a=>{const n=this._agentBilling.get(a.id);return o`
+                    <div class="agent-card-wrapper">
+                      <ic-agent-card
+                        .name=${a.name??a.id}
+                        .provider=${a.provider}
+                        .model=${a.model}
+                        .status=${a.status}
+                        .agentId=${a.id}
+                        .messagesToday=${a.messagesToday??0}
+                        .tokenUsageToday=${a.tokenUsageToday??0}
+                      ></ic-agent-card>
+                      ${n?o`<div class="agent-cost-badge">${dt.format(n.cost)}</div>`:g}
+                    </div>
+                  `})}
+          </div>
+        </div>
+
+        <!-- Channels section -->
+        <div class="section">
+          <span class="section-title section-title--link"
+            role="link" tabindex="0"
+            @click=${()=>this._navigate(_.channels)}
+            @keydown=${this._makeKeyHandler(_.channels)}
+          >Channels</span>
+          <div class="channels-row">
+            ${this._channels.length===0?o`<div class="empty-text">No channels configured</div>`:this._channels.map(a=>o`
+                    <ic-channel-badge
+                      .channelType=${a.type}
+                      .name=${a.name}
+                      .status=${a.status}
+                      .enabled=${a.enabled}
+                      .uptime=${a.uptime}
+                    ></ic-channel-badge>
+                  `)}
+          </div>
+        </div>
+
+        <!-- Activity section -->
+        <div class="section">
+          <ic-activity-feed
+            .entries=${this._activity}
+            .sseSubscribe=${this._getSseSubscriber()}
+          ></ic-activity-feed>
+        </div>
+      </div>
+    `}};y.styles=[O,j,S`
+      :host {
+        display: block;
+      }
+
+      .dashboard-grid {
+        display: grid;
+        grid-template-columns: 1fr;
+        gap: 1.5rem;
+      }
+
+      /* Stats row -- 3-column grid (responsive) */
+      .stats-row {
+        display: grid;
+        grid-template-columns: repeat(3, 1fr);
+        gap: var(--ic-space-md);
+      }
+
+      @media (max-width: 1023px) {
+        .stats-row {
+          grid-template-columns: repeat(2, 1fr);
+        }
+      }
+
+      @media (max-width: 639px) {
+        .stats-row {
+          grid-template-columns: 1fr;
+        }
+      }
+
+      /* Clickable stat card link wrappers */
+      .stat-card-link {
+        cursor: pointer;
+        border-radius: var(--ic-radius-md);
+        transition: transform 0.1s;
+      }
+
+      .stat-card-link:hover {
+        transform: translateY(-1px);
+      }
+
+      .stat-card-link:focus-visible {
+        outline: 2px solid var(--ic-accent);
+        outline-offset: 2px;
+      }
+
+      /* Info cards row */
+      .info-cards-row {
+        display: grid;
+        grid-template-columns: 1fr 1fr;
+        gap: var(--ic-space-lg);
+      }
+
+      @media (max-width: 767px) {
+        .info-cards-row {
+          grid-template-columns: 1fr;
+        }
+      }
+
+      .info-card {
+        background: var(--ic-surface);
+        border: 1px solid var(--ic-border);
+        border-radius: var(--ic-radius-lg);
+        padding: var(--ic-space-lg);
+      }
+
+      .info-card--link {
+        cursor: pointer;
+        transition: border-color 0.15s;
+      }
+
+      .info-card--link:hover {
+        border-color: var(--ic-border-hover, #374151);
+      }
+
+      .info-card--link:focus-visible {
+        outline: 2px solid var(--ic-accent);
+        outline-offset: 2px;
+      }
+
+      .info-card-title {
+        font-size: var(--ic-text-sm);
+        font-weight: 600;
+        color: var(--ic-text);
+        margin-bottom: var(--ic-space-md);
+      }
+
+      .info-row {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        padding: var(--ic-space-xs) 0;
+        font-size: var(--ic-text-sm);
+      }
+
+      .info-label {
+        color: var(--ic-text-dim);
+      }
+
+      .info-value {
+        color: var(--ic-text);
+        font-family: var(--ic-font-mono, ui-monospace, monospace);
+      }
+
+      /* Context engine summary grid */
+      .context-summary-grid {
+        display: grid;
+        grid-template-columns: 1fr 1fr;
+        gap: var(--ic-space-md);
+        align-items: start;
+      }
+
+      .context-metric {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        gap: var(--ic-space-xs);
+      }
+
+      .context-metric-label {
+        font-size: var(--ic-text-xs);
+        color: var(--ic-text-dim);
+      }
+
+      .context-metric-value {
+        font-size: var(--ic-text-lg);
+        font-weight: 600;
+        color: var(--ic-text);
+        font-family: var(--ic-font-mono, ui-monospace, monospace);
+      }
+
+      /* Sparklines row */
+      .sparklines-row {
+        display: grid;
+        grid-template-columns: 1fr 1fr;
+        gap: var(--ic-space-lg);
+      }
+
+      @media (max-width: 639px) {
+        .sparklines-row {
+          grid-template-columns: 1fr;
+        }
+      }
+
+      .sparkline-card {
+        background: var(--ic-surface);
+        border: 1px solid var(--ic-border);
+        border-radius: var(--ic-radius-lg);
+        padding: var(--ic-space-md) var(--ic-space-lg);
+        cursor: pointer;
+        transition: border-color 0.15s;
+      }
+
+      .sparkline-card:hover {
+        border-color: var(--ic-border-hover, #374151);
+      }
+
+      .sparkline-card:focus-visible {
+        outline: 2px solid var(--ic-accent);
+        outline-offset: 2px;
+      }
+
+      .sparkline-header {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        gap: var(--ic-space-md);
+      }
+
+      .sparkline-title {
+        font-size: var(--ic-text-sm);
+        font-weight: 600;
+        color: var(--ic-text-dim);
+      }
+
+      /* Section styles */
+      .section {
+        display: flex;
+        flex-direction: column;
+        gap: 1rem;
+      }
+
+      .section-title {
+        font-size: 0.875rem;
+        font-weight: 600;
+        color: var(--ic-text-dim);
+        text-transform: uppercase;
+        letter-spacing: 0.05em;
+      }
+
+      .section-title--link {
+        cursor: pointer;
+      }
+
+      .section-title--link:hover {
+        color: var(--ic-accent);
+      }
+
+      .section-title--link:focus-visible {
+        outline: 2px solid var(--ic-accent);
+        outline-offset: 2px;
+      }
+
+      .agents-grid {
+        display: grid;
+        grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
+        gap: 0.75rem;
+      }
+
+      .agent-card-wrapper {
+        position: relative;
+      }
+
+      .agent-cost-badge {
+        position: absolute;
+        top: 0.5rem;
+        right: 0.5rem;
+        padding: 0.125rem 0.5rem;
+        background: var(--ic-accent);
+        color: #fff;
+        font-size: 0.6875rem;
+        font-weight: 600;
+        border-radius: 9999px;
+        font-family: var(--ic-font-mono, ui-monospace, monospace);
+        pointer-events: none;
+      }
+
+      .channels-row {
+        display: flex;
+        flex-wrap: wrap;
+        gap: 0.5rem;
+      }
+
+      /* Loading & error states */
+      .state-container {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        padding: 3rem;
+        color: var(--ic-text-dim);
+        font-size: 0.875rem;
+      }
+
+      .error-container {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        gap: 0.75rem;
+        padding: 3rem;
+      }
+
+      .error-message {
+        color: var(--ic-error);
+        font-size: 0.875rem;
+      }
+
+      .retry-btn {
+        padding: 0.5rem 1rem;
+        background: var(--ic-surface);
+        border: 1px solid var(--ic-border);
+        border-radius: 0.375rem;
+        color: var(--ic-text);
+        font-size: 0.8125rem;
+        cursor: pointer;
+        font-family: inherit;
+      }
+
+      .retry-btn:hover {
+        background: var(--ic-surface-alt, #374151);
+      }
+
+      .loading-spinner {
+        width: 1.5rem;
+        height: 1.5rem;
+        border: 2px solid var(--ic-border);
+        border-top-color: var(--ic-accent);
+        border-radius: 50%;
+        animation: spin 0.8s linear infinite;
+      }
+
+      @keyframes spin {
+        to {
+          transform: rotate(360deg);
+        }
+      }
+
+      .empty-text {
+        color: var(--ic-text-dim);
+        font-size: 0.8125rem;
+      }
+
+      .stat-value-placeholder {
+        color: var(--ic-text-dim);
+      }
+
+      .no-data-placeholder {
+        color: var(--ic-text-dim);
+        font-size: var(--ic-text-sm);
+        padding: var(--ic-space-md) 0;
+      }
+    `];$([u({attribute:!1})],y.prototype,"apiClient",2);$([u({attribute:!1})],y.prototype,"rpcClient",2);$([u({attribute:!1})],y.prototype,"eventDispatcher",2);$([v()],y.prototype,"_loadState",2);$([v()],y.prototype,"_error",2);$([v()],y.prototype,"_agents",2);$([v()],y.prototype,"_channels",2);$([v()],y.prototype,"_activity",2);$([v()],y.prototype,"_systemHealth",2);$([v()],y.prototype,"_deliveryStats",2);$([v()],y.prototype,"_messagesToday",2);$([v()],y.prototype,"_tokenUsageToday",2);$([v()],y.prototype,"_sessionCount",2);$([v()],y.prototype,"_errorCount",2);$([v()],y.prototype,"_totalCost",2);$([v()],y.prototype,"_prevMessages",2);$([v()],y.prototype,"_prevTokens",2);$([v()],y.prototype,"_prevCost",2);$([v()],y.prototype,"_mcpStatus",2);$([v()],y.prototype,"_contextSummary",2);$([v()],y.prototype,"_tokenSparklineData",2);$([v()],y.prototype,"_costSparklineData",2);$([v()],y.prototype,"_agentBilling",2);y=$([A("ic-dashboard")],y);var us=Object.defineProperty,vs=Object.getOwnPropertyDescriptor,E=(t,e,i,r)=>{for(var s=r>1?void 0:r?vs(e,i):e,a=t.length-1,n;a>=0;a--)(n=t[a])&&(s=(r?n(e,i,s):n(s))||s);return r&&s&&us(e,i,s),s};const pt={"ic-chat-console":()=>b(()=>import("./chat-console-CNmzl0JW.js"),__vite__mapDeps([0,1,2,3,4,5,6,7,8,9,10])),"ic-memory-inspector":()=>b(()=>import("./memory-inspector-1hDGCGat.js"),__vite__mapDeps([11,12,7,8,6,13,14])),"ic-agent-list":()=>b(()=>import("./agent-list-LHCJ4rw2.js"),__vite__mapDeps([15,12,7,6,14,9,5])),"ic-agent-detail":()=>b(()=>import("./agent-detail-BG9MGWWj.js"),__vite__mapDeps([16,17,7,14,8])),"ic-agent-editor":()=>b(()=>import("./agent-editor-C26Q_xCs.js"),__vite__mapDeps([18,17,7,19])),"ic-workspace-manager":()=>b(()=>import("./workspace-manager-BQlr10iH.js"),__vite__mapDeps([20,17,7,14,9,5,8])),"ic-skills-view":()=>b(()=>import("./skills-D8yVfSUy.js"),__vite__mapDeps([21,22,6,9,5,14,7])),"ic-mcp-management":()=>b(()=>import("./mcp-management-BNZPnpDn.js"),__vite__mapDeps([23,9,5,14,7,8])),"ic-models-view":()=>b(()=>import("./models-C1qcU_j3.js"),__vite__mapDeps([24,22,9,5,7,25,6])),"ic-channel-list":()=>b(()=>import("./channel-list-B8dj3O9a.js"),__vite__mapDeps([26,14,9,5])),"ic-channel-detail":()=>b(()=>import("./channel-detail-CaInesJM.js"),__vite__mapDeps([27,17,22,5,25,8,7,9])),"ic-message-center":()=>b(()=>import("./message-center-CXefwsUu.js"),__vite__mapDeps([28,17,9,5,14,8])),"ic-scheduler-view":()=>b(()=>import("./scheduler-BGgwKd06.js"),__vite__mapDeps([29,22,9,5,8,7])),"ic-session-list-view":()=>b(()=>import("./session-list-6ybUTxbY.js"),__vite__mapDeps([30,1,12,7,8,6,9,5,14])),"ic-session-detail":()=>b(()=>import("./session-detail-SGEYNJ0M.js"),__vite__mapDeps([31,1,2,3,4,5,17,7,8,10,32,14,9])),"ic-observe-dashboard":()=>b(()=>import("./observe-view-C0VBhX4C.js"),__vite__mapDeps([33,34,22,7,8,9,5,35])),"ic-context-engine-view":()=>b(()=>import("./context-engine-BZ5Am6hA.js"),__vite__mapDeps([36,10,32,8,9,5])),"ic-billing-view":()=>b(()=>import("./billing-view-CtYvBqTE.js"),__vite__mapDeps([37,38,9,5])),"ic-delivery-view":()=>b(()=>import("./delivery-view-OfBZof-m.js"),__vite__mapDeps([39,38,8,35,7,13,9,5])),"ic-diagnostics-view":()=>b(()=>import("./diagnostics-view-YFwCxgr2.js"),__vite__mapDeps([40,34,38,7,8,9,5])),"ic-subagents-view":()=>b(()=>import("./subagents-HHXMeHYo.js"),__vite__mapDeps([41,9,5,14,7,8])),"ic-security-view":()=>b(()=>import("./security-D15st4xx.js"),__vite__mapDeps([42,22,9,5,7,8,25,43,19])),"ic-approvals-view":()=>b(()=>import("./approvals-q9VH_IKr.js"),[]),"ic-config-editor":()=>b(()=>import("./config-editor-DX4ITw6y.js"),__vite__mapDeps([44,9,5,14,7,8,22,43,19])),"ic-setup-wizard":()=>b(()=>import("./setup-wizard-nT0tz9QP.js"),__vite__mapDeps([45,5])),"ic-pipeline-list":()=>b(()=>import("./pipeline-list-BPW8hV-q.js"),__vite__mapDeps([46,17,14,47,9,5])),"ic-pipeline-builder":()=>b(()=>import("./pipeline-builder-DcUUIrm0.js"),__vite__mapDeps([48,17,49,4,14,47])),"ic-pipeline-monitor":()=>b(()=>import("./pipeline-monitor-Bip16T7e.js"),__vite__mapDeps([50,49,4,17,14])),"ic-pipeline-history":()=>b(()=>import("./pipeline-history-DkfOQ6SW.js"),__vite__mapDeps([51,17,14,9,5])),"ic-pipeline-history-detail":()=>b(()=>import("./pipeline-history-detail-hyHgD0ai.js"),__vite__mapDeps([52,3,4,5,17,14])),"ic-context-dag-browser":()=>b(()=>import("./context-dag-browser-BwiaF5tf.js"),__vite__mapDeps([53,9,5,6,7,8,13])),"ic-media-test-view":()=>b(()=>import("./media-test-BkK3RCRK.js"),__vite__mapDeps([54,22,9,5])),"ic-media-config-view":()=>b(()=>import("./media-config-BBvTYxOX.js"),[])},$e="comis_token";let k=class extends x{constructor(){super(...arguments),this._authenticated=!1,this._authError="",this._currentView="ic-dashboard",this._currentRoute="dashboard",this._routeParams={},this._connectionStatus="disconnected",this._pendingApprovals=0,this._errorCount=0,this._agentCount=0,this._channelCount=0,this._sessionCount=0,this._sidebarOpen=!1,this._viewLoading=!1,this._commandPaletteOpen=!1,this._shortcutsHelpOpen=!1,this._agentList=[],this._sessionList=[],this._loadedViews=new Set,this._pendingGotoKey=null,this._apiClient=null,this._router=null,this._rpcClient=null,this._globalState=null,this._eventDispatcher=null,this._stateUnsubscribe=null,this._approvalUnsub=null,this._approvalResolvedUnsub=null,this._errorUnsub=null,this._pollingController=null,this._token="",this._boundKeyHandler=this._handleGlobalKeydown.bind(this),this._gotoWaiting=!1}connectedCallback(){super.connectedCallback();const t=sessionStorage.getItem($e);t&&this._initWithToken(t),document.addEventListener("keydown",this._boundKeyHandler)}disconnectedCallback(){super.disconnectedCallback(),this._cleanup(),document.removeEventListener("keydown",this._boundKeyHandler),this._pendingGotoKey&&(clearTimeout(this._pendingGotoKey),this._pendingGotoKey=null)}_isInputTarget(t){const e=t.target?.tagName;return!!(e==="INPUT"||e==="TEXTAREA"||e==="SELECT"||t.target?.isContentEditable)}_handleGlobalKeydown(t){if((t.ctrlKey||t.metaKey)&&t.key==="k"){t.preventDefault(),this._commandPaletteOpen=!this._commandPaletteOpen;return}if(t.key==="Escape"){if(this._commandPaletteOpen){this._commandPaletteOpen=!1;return}if(this._shortcutsHelpOpen){this._shortcutsHelpOpen=!1;return}this.dispatchEvent(new CustomEvent("close-overlay",{bubbles:!0,composed:!0})),this._sidebarOpen&&(this._sidebarOpen=!1);return}if(!this._isInputTarget(t)&&!this._commandPaletteOpen){if(t.key==="?"&&!t.ctrlKey&&!t.metaKey&&!t.altKey){this._shortcutsHelpOpen=!this._shortcutsHelpOpen;return}if(this._gotoWaiting){switch(this._gotoWaiting=!1,this._pendingGotoKey&&(clearTimeout(this._pendingGotoKey),this._pendingGotoKey=null),t.key.toLowerCase()){case"d":this._router?.navigate("dashboard");return;case"a":this._router?.navigate("agents");return;case"c":this._router?.navigate("chat");return;case"s":this._router?.navigate("sessions");return;case"o":this._router?.navigate("observe/overview");return}return}t.key==="g"&&!t.ctrlKey&&!t.metaKey&&!t.altKey&&(this._gotoWaiting=!0,this._pendingGotoKey=setTimeout(()=>{this._gotoWaiting=!1,this._pendingGotoKey=null},500))}}_handleCommand(t){switch(t){case"refresh":window.location.reload();break;case"toggle-sidebar":this._sidebarOpen=!this._sidebarOpen;break;case"logout":this._handleLogout();break;case"show-shortcuts":this._shortcutsHelpOpen=!0;break}}_initWithToken(t){this._token=t;const e=`${window.location.protocol}//${window.location.host}`;this._apiClient=st(e,t),this._apiClient.getAgents().then(()=>{sessionStorage.setItem($e,t),this._authenticated=!0,this._authError="",this._rpcClient=ni();const r=`${window.location.protocol==="https:"?"wss:":"ws:"}//${window.location.host}/ws`;this._rpcClient.connect(r,t);const s=this._rpcClient;this._apiClient=st(e,t,(a,n)=>s.call(a,n)),this._globalState=ai(),this._rpcClient.onStatusChange(a=>{this._globalState?.update({connectionStatus:a})}),this._eventDispatcher=li(),this._eventDispatcher.start(e,t),this._approvalUnsub=this._eventDispatcher.addEventListener("approval:requested",()=>{const a=this._globalState.getSnapshot();this._globalState.update({pendingApprovals:a.pendingApprovals+1})}),this._approvalResolvedUnsub=this._eventDispatcher.addEventListener("approval:resolved",()=>{const a=this._globalState.getSnapshot();this._globalState.update({pendingApprovals:Math.max(0,a.pendingApprovals-1)})}),this._errorUnsub=this._eventDispatcher.addEventListener("system:error",()=>{const a=this._globalState.getSnapshot();this._globalState.update({errorCount:(a.errorCount??0)+1})}),this._stateUnsubscribe=this._globalState.subscribe(()=>{const a=this._globalState.getSnapshot();this._connectionStatus=a.connectionStatus,this._pendingApprovals=a.pendingApprovals,this._errorCount=a.errorCount,this._agentCount=a.agentCount,this._channelCount=a.channelCount,this._sessionCount=a.sessionCount}),this._pollingController=new ci(this,this._rpcClient,a=>{this._agentCount=a.agents,this._channelCount=a.channels,this._sessionCount=a.sessions,this._agentList=a.agentIds.map(n=>({id:n})),this._sessionList=a.sessionEntries.map(n=>({key:n.sessionKey,agentId:n.agentId}))},3e4),this._pollingController.hostConnected(),this._router=Qt(a=>{this._currentView=a.view,this._currentRoute=a.route,this._routeParams=a.params}),this._router.start()}).catch(()=>{this._authError="Invalid token or server unreachable",sessionStorage.removeItem($e)})}_handleLogin(t){t.preventDefault();const r=t.target.querySelector("input").value.trim();if(!r){this._authError="Please enter a token";return}this._initWithToken(r)}_handleLogout(){sessionStorage.removeItem($e),this._authenticated=!1,this._cleanup(),this._apiClient=null,this._token=""}_cleanup(){this._pollingController&&(this._pollingController.hostDisconnected(),this._pollingController=null),this._rpcClient?.disconnect(),this._rpcClient=null,this._eventDispatcher?.stop(),this._eventDispatcher=null,this._stateUnsubscribe?.(),this._stateUnsubscribe=null,this._approvalUnsub?.(),this._approvalUnsub=null,this._approvalResolvedUnsub?.(),this._approvalResolvedUnsub=null,this._errorUnsub?.(),this._errorUnsub=null,this._globalState=null,this._router?.stop(),this._router=null}_renderAuth(){return o`
+      <div class="auth-container">
+        <div class="auth-card">
+          <div class="auth-title">Comis</div>
+          <div class="auth-subtitle">Enter your gateway token to continue</div>
+          <form @submit=${this._handleLogin}>
+            <input
+              class="auth-input"
+              type="password"
+              placeholder="Gateway bearer token"
+              autocomplete="off"
+            />
+            ${this._authError?o`<div class="auth-error">${this._authError}</div>`:g}
+            <button class="auth-btn" type="submit">Connect</button>
+          </form>
+        </div>
+      </div>
+    `}_renderApp(){return o`
+      <div class="shell">
+        <ic-sidebar
+          .currentRoute=${this._currentRoute}
+          .pendingApprovals=${this._pendingApprovals}
+          .errorCount=${this._errorCount}
+          .agentCount=${this._agentCount}
+          .channelCount=${this._channelCount}
+          .sessionCount=${this._sessionCount}
+          ?open=${this._sidebarOpen}
+          @navigate=${t=>{this._router?.navigate(t.detail),this._sidebarOpen=!1}}
+          @logout=${()=>this._handleLogout()}
+          @close=${()=>{this._sidebarOpen=!1}}
+        ></ic-sidebar>
+        <div class="shell-main">
+          <ic-topbar
+            .connectionStatus=${this._connectionStatus}
+            .notificationCount=${this._pendingApprovals}
+            .tokenId=${this._token}
+            @toggle-sidebar=${()=>{this._sidebarOpen=!this._sidebarOpen}}
+            @logout=${()=>this._handleLogout()}
+          ></ic-topbar>
+          <main class="content" role="main" aria-label="Main content" @navigate=${t=>{this._router?.navigate(t.detail)}}>
+            ${this._renderView()}
+          </main>
+        </div>
+      </div>
+      ${this._commandPaletteOpen?o`
+        <ic-command-palette
+          ?open=${this._commandPaletteOpen}
+          .agents=${this._agentList}
+          .sessions=${this._sessionList}
+          @navigate=${t=>{this._router?.navigate(t.detail),this._commandPaletteOpen=!1}}
+          @close=${()=>{this._commandPaletteOpen=!1}}
+          @command=${t=>this._handleCommand(t.detail)}
+        ></ic-command-palette>
+      `:g}
+      ${this._shortcutsHelpOpen?this._renderShortcutsHelp():g}
+      <ic-toast></ic-toast>
+    `}_renderShortcutsHelp(){return o`
+      <div class="shortcuts-backdrop" @click=${t=>{t.target.classList.contains("shortcuts-backdrop")&&(this._shortcutsHelpOpen=!1)}}>
+        <div class="shortcuts-panel" role="dialog" aria-label="Keyboard shortcuts">
+          <div class="shortcuts-title">Keyboard Shortcuts</div>
+          <table class="shortcuts-table">
+            <tbody>
+              <tr><td><kbd>Ctrl</kbd>+<kbd>K</kbd></td><td>Command Palette</td></tr>
+              <tr><td><kbd>Esc</kbd></td><td>Close Overlay</td></tr>
+              <tr><td><kbd>?</kbd></td><td>Toggle This Help</td></tr>
+              <tr><td><kbd>G</kbd> then <kbd>D</kbd></td><td>Go to Dashboard</td></tr>
+              <tr><td><kbd>G</kbd> then <kbd>A</kbd></td><td>Go to Agents</td></tr>
+              <tr><td><kbd>G</kbd> then <kbd>C</kbd></td><td>Go to Chat</td></tr>
+              <tr><td><kbd>G</kbd> then <kbd>S</kbd></td><td>Go to Sessions</td></tr>
+              <tr><td><kbd>G</kbd> then <kbd>O</kbd></td><td>Go to Observability</td></tr>
+            </tbody>
+          </table>
+        </div>
+      </div>
+    `}async _loadViewIfNeeded(t){if(this._loadedViews.has(t))return;const e=pt[t];if(e){this._viewLoading=!0;try{await e(),this._loadedViews.add(t)}finally{this._viewLoading=!1}}}_getSkeletonVariant(){switch(this._currentView){case"ic-dashboard":return"dashboard";case"ic-agent-detail":case"ic-session-detail":case"ic-channel-detail":case"ic-chat-console":case"ic-message-center":return"detail";case"ic-config-editor":case"ic-pipeline-builder":case"ic-workspace-manager":return"editor";case"ic-billing-view":case"ic-delivery-view":case"ic-diagnostics-view":case"ic-observe-dashboard":case"ic-context-engine-view":case"ic-memory-inspector":case"ic-media-test-view":case"ic-media-config-view":return"table";default:return"list"}}_renderView(){if(!this._loadedViews.has(this._currentView)&&pt[this._currentView])return this._loadViewIfNeeded(this._currentView),o`<ic-skeleton-view variant=${this._getSkeletonVariant()}></ic-skeleton-view>`;switch(this._currentView){case"ic-dashboard":return o`<ic-dashboard .apiClient=${this._apiClient} .rpcClient=${this._rpcClient} .eventDispatcher=${this._eventDispatcher}></ic-dashboard>`;case"ic-chat-console":return o`<ic-chat-console
+          .apiClient=${this._apiClient}
+          .rpcClient=${this._rpcClient}
+          .eventDispatcher=${this._eventDispatcher}
+          .sessionKey=${this._routeParams.sessionKey??""}
+          .authToken=${this._token}
+        ></ic-chat-console>`;case"ic-memory-inspector":return o`<ic-memory-inspector .apiClient=${this._apiClient} .rpcClient=${this._rpcClient}></ic-memory-inspector>`;case"ic-agent-list":return o`<ic-agent-list .apiClient=${this._apiClient} .rpcClient=${this._rpcClient} .eventDispatcher=${this._eventDispatcher}></ic-agent-list>`;case"ic-agent-detail":return o`<ic-agent-detail .apiClient=${this._apiClient} .rpcClient=${this._rpcClient} .eventDispatcher=${this._eventDispatcher} .agentId=${this._routeParams.id??""}></ic-agent-detail>`;case"ic-agent-editor":return o`<ic-agent-editor .rpcClient=${this._rpcClient} .agentId=${this._routeParams.id??""}></ic-agent-editor>`;case"ic-workspace-manager":return o`<ic-workspace-manager
+          .rpcClient=${this._rpcClient}
+          .agentId=${this._routeParams.id??""}
+        ></ic-workspace-manager>`;case"ic-skills-view":return o`<ic-skills-view .apiClient=${this._apiClient} .rpcClient=${this._rpcClient} .eventDispatcher=${this._eventDispatcher}></ic-skills-view>`;case"ic-mcp-management":return o`<ic-mcp-management .rpcClient=${this._rpcClient} .apiClient=${this._apiClient} .eventDispatcher=${this._eventDispatcher}></ic-mcp-management>`;case"ic-models-view":return o`<ic-models-view .apiClient=${this._apiClient} .rpcClient=${this._rpcClient} .eventDispatcher=${this._eventDispatcher}></ic-models-view>`;case"ic-channel-list":return o`<ic-channel-list
+          .apiClient=${this._apiClient}
+          .rpcClient=${this._rpcClient}
+          .eventDispatcher=${this._eventDispatcher}
+          @navigate=${t=>{this._router?.navigate(t.detail)}}
+        ></ic-channel-list>`;case"ic-channel-detail":return o`<ic-channel-detail
+          .apiClient=${this._apiClient}
+          .rpcClient=${this._rpcClient}
+          .eventDispatcher=${this._eventDispatcher}
+          .channelType=${this._routeParams.type??""}
+          @navigate=${t=>{this._router?.navigate(t.detail)}}
+        ></ic-channel-detail>`;case"ic-message-center":return o`<ic-message-center
+          .rpcClient=${this._rpcClient}
+          .eventDispatcher=${this._eventDispatcher}
+          .channelType=${this._routeParams.type??""}
+          @navigate=${t=>{this._router?.navigate(t.detail)}}
+        ></ic-message-center>`;case"ic-scheduler-view":return o`<ic-scheduler-view
+          .rpcClient=${this._rpcClient}
+          .eventDispatcher=${this._eventDispatcher}
+          .routeParams=${this._routeParams}
+        ></ic-scheduler-view>`;case"ic-session-list-view":return o`<ic-session-list-view .apiClient=${this._apiClient} .rpcClient=${this._rpcClient} .eventDispatcher=${this._eventDispatcher}></ic-session-list-view>`;case"ic-session-detail":return o`<ic-session-detail .apiClient=${this._apiClient} .rpcClient=${this._rpcClient} .sessionKey=${this._routeParams.key??""}></ic-session-detail>`;case"ic-subagents-view":return o`<ic-subagents-view .rpcClient=${this._rpcClient} .apiClient=${this._apiClient} .eventDispatcher=${this._eventDispatcher}></ic-subagents-view>`;case"ic-security-view":return o`<ic-security-view .rpcClient=${this._rpcClient} .apiClient=${this._apiClient} .eventDispatcher=${this._eventDispatcher}></ic-security-view>`;case"ic-approvals-view":return o`<ic-approvals-view .rpcClient=${this._rpcClient} .apiClient=${this._apiClient}></ic-approvals-view>`;case"ic-config-editor":return o`<ic-config-editor .rpcClient=${this._rpcClient}></ic-config-editor>`;case"ic-setup-wizard":return o`<ic-setup-wizard .rpcClient=${this._rpcClient}></ic-setup-wizard>`;case"ic-observe-dashboard":return o`<ic-observe-view .rpcClient=${this._rpcClient} .eventDispatcher=${this._eventDispatcher} .initialTab=${"overview"}></ic-observe-view>`;case"ic-context-engine-view":return o`<ic-context-engine-view .rpcClient=${this._rpcClient} .eventDispatcher=${this._eventDispatcher}></ic-context-engine-view>`;case"ic-context-dag-browser":return o`<ic-context-dag-browser .rpcClient=${this._rpcClient}></ic-context-dag-browser>`;case"ic-media-test-view":return o`<ic-media-test-view .rpcClient=${this._rpcClient} .apiClient=${this._apiClient}></ic-media-test-view>`;case"ic-media-config-view":return o`<ic-media-config-view .rpcClient=${this._rpcClient}></ic-media-config-view>`;case"ic-billing-view":return o`<ic-billing-view .rpcClient=${this._rpcClient} .eventDispatcher=${this._eventDispatcher}></ic-billing-view>`;case"ic-delivery-view":return o`<ic-delivery-view .rpcClient=${this._rpcClient}></ic-delivery-view>`;case"ic-diagnostics-view":return o`<ic-diagnostics-view .rpcClient=${this._rpcClient} .eventDispatcher=${this._eventDispatcher}></ic-diagnostics-view>`;case"ic-pipeline-list":return o`<ic-pipeline-list .rpcClient=${this._rpcClient}></ic-pipeline-list>`;case"ic-pipeline-builder":return o`<ic-pipeline-builder .rpcClient=${this._rpcClient} .graphId=${this._routeParams.graphId??""}></ic-pipeline-builder>`;case"ic-pipeline-monitor":return o`<ic-pipeline-monitor .rpcClient=${this._rpcClient} .graphId=${this._routeParams.graphId??""} .eventDispatcher=${this._eventDispatcher}></ic-pipeline-monitor>`;case"ic-pipeline-history":return o`<ic-pipeline-history .rpcClient=${this._rpcClient}></ic-pipeline-history>`;case"ic-pipeline-history-detail":return o`<ic-pipeline-history-detail .rpcClient=${this._rpcClient} .graphId=${this._routeParams.graphId??""}></ic-pipeline-history-detail>`;default:return this._renderPlaceholder()}}_renderPlaceholder(){const t=this._currentView.replace(/^ic-/,"").replace(/-/g," ").replace(/\b\w/g,e=>e.toUpperCase());return o`
+      <div class="placeholder">
+        <div class="placeholder-title">${t}</div>
+        <div>Coming soon</div>
+      </div>
+    `}render(){return this._authenticated?this._renderApp():this._renderAuth()}};k.styles=S`
+    :host {
+      display: block;
+      min-height: 100vh;
+      background: var(--ic-bg, #030712);
+      color: var(--ic-text, #f3f4f6);
+      font-family: var(--ic-font-sans, ui-sans-serif, system-ui, sans-serif);
+    }
+
+    .auth-container {
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      justify-content: center;
+      min-height: 100vh;
+      padding: 1rem;
+    }
+
+    .auth-card {
+      background: var(--ic-surface, #111827);
+      border: 1px solid var(--ic-border, #374151);
+      border-radius: var(--ic-radius-lg, 0.75rem);
+      padding: 2rem;
+      max-width: 24rem;
+      width: 100%;
+    }
+
+    .auth-title {
+      font-size: 1.5rem;
+      font-weight: 700;
+      margin-bottom: 0.25rem;
+    }
+
+    .auth-subtitle {
+      color: var(--ic-text-muted, #9ca3af);
+      margin-bottom: 1.5rem;
+      font-size: 0.875rem;
+    }
+
+    .auth-input {
+      width: 100%;
+      padding: 0.625rem 0.75rem;
+      background: var(--ic-surface-2, #1f2937);
+      border: 1px solid #4b5563;
+      border-radius: var(--ic-radius-md, 0.5rem);
+      color: var(--ic-text, #f3f4f6);
+      font-size: 0.875rem;
+      outline: none;
+      box-sizing: border-box;
+    }
+
+    .auth-input:focus {
+      border-color: var(--ic-accent, #3b82f6);
+    }
+
+    .auth-input::placeholder {
+      color: var(--ic-text-dim, #6b7280);
+    }
+
+    .auth-btn {
+      width: 100%;
+      padding: 0.625rem;
+      margin-top: 1rem;
+      background: var(--ic-accent, #3b82f6);
+      color: white;
+      border: none;
+      border-radius: var(--ic-radius-md, 0.5rem);
+      font-size: 0.875rem;
+      font-weight: 500;
+      cursor: pointer;
+    }
+
+    .auth-btn:hover {
+      background: var(--ic-accent-hover, #2563eb);
+    }
+
+    .auth-error {
+      color: var(--ic-error, #f87171);
+      font-size: 0.75rem;
+      margin-top: 0.5rem;
+    }
+
+    /* Shell layout: sidebar + main area */
+    .shell {
+      display: flex;
+      min-height: 100vh;
+    }
+
+    .shell-main {
+      flex: 1;
+      display: flex;
+      flex-direction: column;
+      min-width: 0;
+    }
+
+    .content {
+      flex: 1;
+      padding: var(--ic-space-lg, 1.5rem);
+      max-width: 1440px;
+      width: 100%;
+      margin: 0 auto;
+      box-sizing: border-box;
+      overflow-y: auto;
+    }
+
+    /* Placeholder for unimplemented views */
+    .placeholder {
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      justify-content: center;
+      min-height: 300px;
+      color: var(--ic-text-dim, #6b7280);
+      font-size: 1rem;
+    }
+
+    .placeholder-title {
+      font-size: 1.25rem;
+      font-weight: 600;
+      margin-bottom: 0.5rem;
+      color: var(--ic-text-muted, #9ca3af);
+    }
+
+    /* Keyboard shortcuts help overlay */
+    .shortcuts-backdrop {
+      position: fixed;
+      inset: 0;
+      background: rgba(0, 0, 0, 0.5);
+      z-index: 99;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+    }
+
+    .shortcuts-panel {
+      background: var(--ic-surface, #111827);
+      border: 1px solid var(--ic-border, #374151);
+      border-radius: var(--ic-radius-lg, 0.75rem);
+      padding: 1.5rem;
+      max-width: 400px;
+      width: 90%;
+      box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.4);
+    }
+
+    .shortcuts-title {
+      font-size: 1.125rem;
+      font-weight: 600;
+      margin-bottom: 1rem;
+    }
+
+    .shortcuts-table {
+      width: 100%;
+      border-collapse: collapse;
+    }
+
+    .shortcuts-table td {
+      padding: 0.375rem 0;
+      font-size: 0.875rem;
+    }
+
+    .shortcuts-table td:first-child {
+      color: var(--ic-text-dim, #6b7280);
+      padding-right: 1rem;
+      white-space: nowrap;
+    }
+
+    .shortcuts-table kbd {
+      background: var(--ic-surface-2, #1f2937);
+      border: 1px solid var(--ic-border, #374151);
+      border-radius: 3px;
+      padding: 2px 6px;
+      font-size: 0.75rem;
+      font-family: inherit;
+    }
+  `;E([v()],k.prototype,"_authenticated",2);E([v()],k.prototype,"_authError",2);E([v()],k.prototype,"_currentView",2);E([v()],k.prototype,"_currentRoute",2);E([v()],k.prototype,"_routeParams",2);E([v()],k.prototype,"_connectionStatus",2);E([v()],k.prototype,"_pendingApprovals",2);E([v()],k.prototype,"_errorCount",2);E([v()],k.prototype,"_agentCount",2);E([v()],k.prototype,"_channelCount",2);E([v()],k.prototype,"_sessionCount",2);E([v()],k.prototype,"_sidebarOpen",2);E([v()],k.prototype,"_viewLoading",2);E([v()],k.prototype,"_commandPaletteOpen",2);E([v()],k.prototype,"_shortcutsHelpOpen",2);E([v()],k.prototype,"_agentList",2);E([v()],k.prototype,"_sessionList",2);E([v()],k.prototype,"_token",2);k=E([A("ic-app")],k);export{g as A,ne as E,L as I,Oi as S,x as a,o as b,qi as c,yt as d,j as f,Ki as g,S as i,fs as j,u as n,v as r,O as s,A as t,W as w};