@copilotkit/web-inspector 1.62.2 → 1.63.0

package/dist/index.umd.js

@@ -6,7 +6,7 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 //#region src/styles/generated.css
-	var generated_default = "/*! tailwindcss v4.1.18 | MIT License | https://tailwindcss.com */\n@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-space-y-reverse:0;--tw-divide-y-reverse:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-outline-style:solid;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-backdrop-blur:initial;--tw-backdrop-brightness:initial;--tw-backdrop-contrast:initial;--tw-backdrop-grayscale:initial;--tw-backdrop-hue-rotate:initial;--tw-backdrop-invert:initial;--tw-backdrop-opacity:initial;--tw-backdrop-saturate:initial;--tw-backdrop-sepia:initial;--tw-scale-x:1;--tw-scale-y:1;--tw-scale-z:1}}}@layer theme{:root,:host{--font-sans:ui-sans-serif,system-ui,sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\",\"Segoe UI Symbol\",\"Noto Color Emoji\";--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,\"Liberation Mono\",\"Courier New\",monospace;--color-amber-50:oklch(98.7% .022 95.277);--color-amber-100:oklch(96.2% .059 95.617);--color-amber-200:oklch(92.4% .12 95.746);--color-amber-600:oklch(66.6% .179 58.318);--color-amber-700:oklch(55.5% .163 48.998);--color-amber-800:oklch(47.3% .137 46.201);--color-amber-900:oklch(41.4% .112 45.904);--color-green-100:oklch(96.2% .044 156.743);--color-green-700:oklch(52.7% .154 150.069);--color-green-800:oklch(44.8% .119 151.328);--color-emerald-50:oklch(97.9% .021 166.113);--color-emerald-200:oklch(90.5% .093 164.15);--color-emerald-500:oklch(69.6% .17 162.48);--color-emerald-700:oklch(50.8% .118 165.612);--color-sky-50:oklch(97.7% .013 236.62);--color-sky-200:oklch(90.1% .058 230.902);--color-sky-700:oklch(50% .134 242.749);--color-blue-50:oklch(97% .014 254.604);--color-blue-100:oklch(93.2% .032 255.585);--color-blue-200:oklch(88.2% .059 254.128);--color-blue-600:oklch(54.6% .245 262.881);--color-blue-700:oklch(48.8% .243 264.376);--color-blue-800:oklch(42.4% .199 265.638);--color-violet-50:oklch(96.9% .016 293.756);--color-violet-200:oklch(89.4% .057 293.283);--color-violet-700:oklch(49.1% .27 292.581);--color-purple-50:oklch(97.7% .014 308.299);--color-purple-200:oklch(90.2% .063 306.703);--color-purple-700:oklch(49.6% .265 301.924);--color-fuchsia-50:oklch(97.7% .017 320.058);--color-fuchsia-200:oklch(90.3% .076 319.62);--color-fuchsia-700:oklch(51.8% .253 323.949);--color-rose-50:oklch(96.9% .015 12.422);--color-rose-200:oklch(89.2% .058 10.001);--color-rose-500:oklch(64.5% .246 16.439);--color-rose-700:oklch(51.4% .222 16.935);--color-slate-200:oklch(92.9% .013 255.508);--color-slate-500:oklch(55.4% .046 257.417);--color-slate-700:oklch(37.2% .044 257.287);--color-slate-800:oklch(27.9% .041 260.031);--color-slate-900:oklch(20.8% .042 265.755);--color-slate-950:oklch(12.9% .042 264.695);--color-gray-50:oklch(98.5% .002 247.839);--color-gray-100:oklch(96.7% .003 264.542);--color-gray-200:oklch(92.8% .006 264.531);--color-gray-300:oklch(87.2% .01 258.338);--color-gray-400:oklch(70.7% .022 261.325);--color-gray-500:oklch(55.1% .027 264.364);--color-gray-600:oklch(44.6% .03 256.802);--color-gray-700:oklch(37.3% .034 259.733);--color-gray-800:oklch(27.8% .033 256.848);--color-gray-900:oklch(21% .034 264.665);--color-black:#000;--color-white:#fff;--spacing:.25rem;--container-xs:20rem;--container-md:28rem;--text-xs:.75rem;--text-xs--line-height:calc(1/.75);--text-sm:.875rem;--text-sm--line-height:calc(1.25/.875);--text-lg:1.125rem;--text-lg--line-height:calc(1.75/1.125);--font-weight-medium:500;--font-weight-semibold:600;--leading-snug:1.375;--leading-relaxed:1.625;--radius-sm:.25rem;--radius-md:.375rem;--radius-lg:.5rem;--radius-xl:.75rem;--animate-pulse:pulse 2s cubic-bezier(.4,0,.6,1)infinite;--blur-sm:8px;--blur-md:12px;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4,0,.2,1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\",\"Segoe UI Symbol\",\"Noto Color Emoji\");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,\"Liberation Mono\",\"Courier New\",monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}:host{font-family:var(--font-sans);color:var(--color-slate-900);background-color:#0000;display:block}}@layer components;@layer utilities{.pointer-events-auto{pointer-events:auto}.visible{visibility:visible}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.static{position:static}.sticky{position:sticky}.top-0{top:calc(var(--spacing)*0)}.right-0{right:calc(var(--spacing)*0)}.right-1{right:calc(var(--spacing)*1)}.bottom-1{bottom:calc(var(--spacing)*1)}.left-0{left:calc(var(--spacing)*0)}.z-10{z-index:10}.z-30{z-index:30}.z-40{z-index:40}.z-50{z-index:50}.m-0{margin:calc(var(--spacing)*0)}.mx-4{margin-inline:calc(var(--spacing)*4)}.my-1{margin-block:calc(var(--spacing)*1)}.my-3{margin-block:calc(var(--spacing)*3)}.mt-0\\.5{margin-top:calc(var(--spacing)*.5)}.mt-1{margin-top:calc(var(--spacing)*1)}.mt-1\\.5{margin-top:calc(var(--spacing)*1.5)}.mt-2{margin-top:calc(var(--spacing)*2)}.mt-3{margin-top:calc(var(--spacing)*3)}.mb-1{margin-bottom:calc(var(--spacing)*1)}.mb-2{margin-bottom:calc(var(--spacing)*2)}.mb-3{margin-bottom:calc(var(--spacing)*3)}.mb-4{margin-bottom:calc(var(--spacing)*4)}.ml-auto{margin-left:auto}.box-border{box-sizing:border-box}.block{display:block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline{display:inline}.inline-block{display:inline-block}.inline-flex{display:inline-flex}.table{display:table}.h-1\\.5{height:calc(var(--spacing)*1.5)}.h-3{height:calc(var(--spacing)*3)}.h-3\\.5{height:calc(var(--spacing)*3.5)}.h-5{height:calc(var(--spacing)*5)}.h-6{height:calc(var(--spacing)*6)}.h-8{height:calc(var(--spacing)*8)}.h-10{height:calc(var(--spacing)*10)}.h-12{height:calc(var(--spacing)*12)}.h-full{height:100%}.max-h-64{max-height:calc(var(--spacing)*64)}.w-1\\.5{width:calc(var(--spacing)*1.5)}.w-3{width:calc(var(--spacing)*3)}.w-3\\.5{width:calc(var(--spacing)*3.5)}.w-5{width:calc(var(--spacing)*5)}.w-6{width:calc(var(--spacing)*6)}.w-8{width:calc(var(--spacing)*8)}.w-10{width:calc(var(--spacing)*10)}.w-12{width:calc(var(--spacing)*12)}.w-40{width:calc(var(--spacing)*40)}.w-auto{width:auto}.w-full{width:100%}.max-w-\\[240px\\]{max-width:240px}.max-w-md{max-width:var(--container-md)}.max-w-xs{max-width:var(--container-xs)}.min-w-0{min-width:calc(var(--spacing)*0)}.min-w-\\[160px\\]{min-width:160px}.min-w-\\[200px\\]{min-width:200px}.flex-1{flex:1}.flex-shrink,.shrink{flex-shrink:1}.shrink-0{flex-shrink:0}.table-fixed{table-layout:fixed}.border-collapse{border-collapse:collapse}.-translate-y-\\[2px\\]{--tw-translate-y:calc(2px*-1);translate:var(--tw-translate-x)var(--tw-translate-y)}.rotate-180{rotate:180deg}.transform{transform:var(--tw-rotate-x,)var(--tw-rotate-y,)var(--tw-rotate-z,)var(--tw-skew-x,)var(--tw-skew-y,)}.animate-pulse{animation:var(--animate-pulse)}.cursor-grab{cursor:grab}.cursor-grabbing{cursor:grabbing}.cursor-nwse-resize{cursor:nwse-resize}.cursor-pointer{cursor:pointer}.touch-none{touch-action:none}.resize{resize:both}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.items-start{align-items:flex-start}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.gap-1{gap:calc(var(--spacing)*1)}.gap-1\\.5{gap:calc(var(--spacing)*1.5)}.gap-2{gap:calc(var(--spacing)*2)}.gap-3{gap:calc(var(--spacing)*3)}.gap-4{gap:calc(var(--spacing)*4)}:where(.space-y-1>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing)*1)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing)*1)*calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-2>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing)*2)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing)*2)*calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-3>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing)*3)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing)*3)*calc(1 - var(--tw-space-y-reverse)))}:where(.divide-y>:not(:last-child)){--tw-divide-y-reverse:0;border-bottom-style:var(--tw-border-style);border-top-style:var(--tw-border-style);border-top-width:calc(1px*var(--tw-divide-y-reverse));border-bottom-width:calc(1px*calc(1 - var(--tw-divide-y-reverse)))}:where(.divide-gray-200>:not(:last-child)){border-color:var(--color-gray-200)}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-x-hidden{overflow-x:hidden}.overflow-y-auto{overflow-y:auto}.rounded{border-radius:.25rem}.rounded-full{border-radius:3.40282e38px}.rounded-lg{border-radius:var(--radius-lg)}.rounded-md{border-radius:var(--radius-md)}.rounded-sm{border-radius:var(--radius-sm)}.rounded-xl{border-radius:var(--radius-xl)}.border{border-style:var(--tw-border-style);border-width:1px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-r{border-right-style:var(--tw-border-style);border-right-width:1px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-l{border-left-style:var(--tw-border-style);border-left-width:1px}.border-dashed{--tw-border-style:dashed;border-style:dashed}.border-amber-200{border-color:var(--color-amber-200)}.border-blue-200{border-color:var(--color-blue-200)}.border-emerald-200{border-color:var(--color-emerald-200)}.border-fuchsia-200{border-color:var(--color-fuchsia-200)}.border-gray-100{border-color:var(--color-gray-100)}.border-gray-200{border-color:var(--color-gray-200)}.border-purple-200{border-color:var(--color-purple-200)}.border-rose-200{border-color:var(--color-rose-200)}.border-sky-200{border-color:var(--color-sky-200)}.border-slate-200{border-color:var(--color-slate-200)}.border-violet-200{border-color:var(--color-violet-200)}.border-white\\/20{border-color:#fff3}@supports (color:color-mix(in lab, red, red)){.border-white\\/20{border-color:color-mix(in oklab,var(--color-white)20%,transparent)}}.bg-amber-50{background-color:var(--color-amber-50)}.bg-amber-100{background-color:var(--color-amber-100)}.bg-blue-50{background-color:var(--color-blue-50)}.bg-blue-100{background-color:var(--color-blue-100)}.bg-emerald-50{background-color:var(--color-emerald-50)}.bg-emerald-500{background-color:var(--color-emerald-500)}.bg-fuchsia-50{background-color:var(--color-fuchsia-50)}.bg-gray-50{background-color:var(--color-gray-50)}.bg-gray-50\\/50{background-color:#f9fafb80}@supports (color:color-mix(in lab, red, red)){.bg-gray-50\\/50{background-color:color-mix(in oklab,var(--color-gray-50)50%,transparent)}}.bg-gray-100{background-color:var(--color-gray-100)}.bg-gray-400{background-color:var(--color-gray-400)}.bg-gray-800{background-color:var(--color-gray-800)}.bg-gray-900{background-color:var(--color-gray-900)}.bg-green-100{background-color:var(--color-green-100)}.bg-purple-50{background-color:var(--color-purple-50)}.bg-rose-50{background-color:var(--color-rose-50)}.bg-rose-500{background-color:var(--color-rose-500)}.bg-sky-50{background-color:var(--color-sky-50)}.bg-slate-900{background-color:var(--color-slate-900)}.bg-slate-950\\/95{background-color:#020618f2}@supports (color:color-mix(in lab, red, red)){.bg-slate-950\\/95{background-color:color-mix(in oklab,var(--color-slate-950)95%,transparent)}}.bg-violet-50{background-color:var(--color-violet-50)}.bg-white{background-color:var(--color-white)}.bg-white\\/60{background-color:#fff9}@supports (color:color-mix(in lab, red, red)){.bg-white\\/60{background-color:color-mix(in oklab,var(--color-white)60%,transparent)}}.bg-white\\/95{background-color:#fffffff2}@supports (color:color-mix(in lab, red, red)){.bg-white\\/95{background-color:color-mix(in oklab,var(--color-white)95%,transparent)}}.p-2{padding:calc(var(--spacing)*2)}.p-3{padding:calc(var(--spacing)*3)}.p-4{padding:calc(var(--spacing)*4)}.px-1{padding-inline:calc(var(--spacing)*1)}.px-1\\.5{padding-inline:calc(var(--spacing)*1.5)}.px-2{padding-inline:calc(var(--spacing)*2)}.px-3{padding-inline:calc(var(--spacing)*3)}.px-4{padding-inline:calc(var(--spacing)*4)}.py-0\\.5{padding-block:calc(var(--spacing)*.5)}.py-1{padding-block:calc(var(--spacing)*1)}.py-1\\.5{padding-block:calc(var(--spacing)*1.5)}.py-2{padding-block:calc(var(--spacing)*2)}.py-2\\.5{padding-block:calc(var(--spacing)*2.5)}.py-3{padding-block:calc(var(--spacing)*3)}.py-4{padding-block:calc(var(--spacing)*4)}.py-8{padding-block:calc(var(--spacing)*8)}.py-10{padding-block:calc(var(--spacing)*10)}.text-center{text-align:center}.text-left{text-align:left}.align-middle{vertical-align:middle}.font-mono{font-family:var(--font-mono)}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.text-\\[9px\\]{font-size:9px}.text-\\[10px\\]{font-size:10px}.text-\\[11px\\]{font-size:11px}.leading-relaxed{--tw-leading:var(--leading-relaxed);line-height:var(--leading-relaxed)}.leading-snug{--tw-leading:var(--leading-snug);line-height:var(--leading-snug)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.break-words{overflow-wrap:break-word}.whitespace-nowrap{white-space:nowrap}.whitespace-pre-line{white-space:pre-line}.whitespace-pre-wrap{white-space:pre-wrap}.text-amber-600{color:var(--color-amber-600)}.text-amber-700{color:var(--color-amber-700)}.text-amber-800{color:var(--color-amber-800)}.text-amber-900{color:var(--color-amber-900)}.text-blue-600{color:var(--color-blue-600)}.text-blue-700{color:var(--color-blue-700)}.text-blue-800{color:var(--color-blue-800)}.text-emerald-700{color:var(--color-emerald-700)}.text-fuchsia-700{color:var(--color-fuchsia-700)}.text-gray-300{color:var(--color-gray-300)}.text-gray-400{color:var(--color-gray-400)}.text-gray-500{color:var(--color-gray-500)}.text-gray-600{color:var(--color-gray-600)}.text-gray-700{color:var(--color-gray-700)}.text-gray-800{color:var(--color-gray-800)}.text-gray-900{color:var(--color-gray-900)}.text-green-700{color:var(--color-green-700)}.text-green-800{color:var(--color-green-800)}.text-purple-700{color:var(--color-purple-700)}.text-rose-700{color:var(--color-rose-700)}.text-sky-700{color:var(--color-sky-700)}.text-slate-500{color:var(--color-slate-500)}.text-slate-700{color:var(--color-slate-700)}.text-slate-800{color:var(--color-slate-800)}.text-slate-900{color:var(--color-slate-900)}.text-violet-700{color:var(--color-violet-700)}.text-white{color:var(--color-white)}.italic{font-style:italic}.underline{text-decoration-line:underline}.opacity-0{opacity:0}.opacity-80{opacity:.8}.shadow{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a),0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-lg{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a),0 4px 6px -4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-md{--tw-shadow:0 4px 6px -1px var(--tw-shadow-color,#0000001a),0 2px 4px -2px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a),0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ring-1{--tw-ring-shadow:var(--tw-ring-inset,)0 0 0 calc(1px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ring-black\\/5{--tw-ring-color:#0000000d}@supports (color:color-mix(in lab, red, red)){.ring-black\\/5{--tw-ring-color:color-mix(in oklab,var(--color-black)5%,transparent)}}.ring-transparent{--tw-ring-color:transparent}.ring-white\\/10{--tw-ring-color:#ffffff1a}@supports (color:color-mix(in lab, red, red)){.ring-white\\/10{--tw-ring-color:color-mix(in oklab,var(--color-white)10%,transparent)}}.outline{outline-style:var(--tw-outline-style);outline-width:1px}.filter{filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}.backdrop-blur-md{--tw-backdrop-blur:blur(var(--blur-md));-webkit-backdrop-filter:var(--tw-backdrop-blur,)var(--tw-backdrop-brightness,)var(--tw-backdrop-contrast,)var(--tw-backdrop-grayscale,)var(--tw-backdrop-hue-rotate,)var(--tw-backdrop-invert,)var(--tw-backdrop-opacity,)var(--tw-backdrop-saturate,)var(--tw-backdrop-sepia,);backdrop-filter:var(--tw-backdrop-blur,)var(--tw-backdrop-brightness,)var(--tw-backdrop-contrast,)var(--tw-backdrop-grayscale,)var(--tw-backdrop-hue-rotate,)var(--tw-backdrop-invert,)var(--tw-backdrop-opacity,)var(--tw-backdrop-saturate,)var(--tw-backdrop-sepia,)}.backdrop-blur-sm{--tw-backdrop-blur:blur(var(--blur-sm));-webkit-backdrop-filter:var(--tw-backdrop-blur,)var(--tw-backdrop-brightness,)var(--tw-backdrop-contrast,)var(--tw-backdrop-grayscale,)var(--tw-backdrop-hue-rotate,)var(--tw-backdrop-invert,)var(--tw-backdrop-opacity,)var(--tw-backdrop-saturate,)var(--tw-backdrop-sepia,);backdrop-filter:var(--tw-backdrop-blur,)var(--tw-backdrop-brightness,)var(--tw-backdrop-contrast,)var(--tw-backdrop-grayscale,)var(--tw-backdrop-hue-rotate,)var(--tw-backdrop-invert,)var(--tw-backdrop-opacity,)var(--tw-backdrop-saturate,)var(--tw-backdrop-sepia,)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.outline-none{--tw-outline-style:none;outline-style:none}.select-none{-webkit-user-select:none;user-select:none}@media (hover:hover){.group-hover\\:opacity-100:is(:where(.group):hover *){opacity:1}.hover\\:scale-105:hover{--tw-scale-x:105%;--tw-scale-y:105%;--tw-scale-z:105%;scale:var(--tw-scale-x)var(--tw-scale-y)}.hover\\:border-gray-300:hover{border-color:var(--color-gray-300)}.hover\\:border-white\\/30:hover{border-color:#ffffff4d}@supports (color:color-mix(in lab, red, red)){.hover\\:border-white\\/30:hover{border-color:color-mix(in oklab,var(--color-white)30%,transparent)}}.hover\\:bg-blue-50\\/50:hover{background-color:#eff6ff80}@supports (color:color-mix(in lab, red, red)){.hover\\:bg-blue-50\\/50:hover{background-color:color-mix(in oklab,var(--color-blue-50)50%,transparent)}}.hover\\:bg-gray-50:hover{background-color:var(--color-gray-50)}.hover\\:bg-gray-100:hover{background-color:var(--color-gray-100)}.hover\\:bg-gray-200:hover{background-color:var(--color-gray-200)}.hover\\:bg-gray-800:hover{background-color:var(--color-gray-800)}.hover\\:bg-slate-900\\/95:hover{background-color:#0f172bf2}@supports (color:color-mix(in lab, red, red)){.hover\\:bg-slate-900\\/95:hover{background-color:color-mix(in oklab,var(--color-slate-900)95%,transparent)}}.hover\\:text-gray-600:hover{color:var(--color-gray-600)}.hover\\:text-gray-900:hover{color:var(--color-gray-900)}.hover\\:text-slate-900:hover{color:var(--color-slate-900)}}.focus\\:border-gray-300:focus{border-color:var(--color-gray-300)}.focus\\:bg-gray-50:focus{background-color:var(--color-gray-50)}.focus\\:ring-2:focus{--tw-ring-shadow:var(--tw-ring-inset,)0 0 0 calc(2px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.focus\\:ring-gray-200:focus{--tw-ring-color:var(--color-gray-200)}.focus\\:outline-none:focus{--tw-outline-style:none;outline-style:none}.focus-visible\\:outline:focus-visible{outline-style:var(--tw-outline-style);outline-width:1px}.focus-visible\\:outline-2:focus-visible{outline-style:var(--tw-outline-style);outline-width:2px}.focus-visible\\:outline-offset-2:focus-visible{outline-offset:2px}.focus-visible\\:outline-\\[\\#BEC2FF\\]:focus-visible{outline-color:#bec2ff}.focus-visible\\:outline-gray-300:focus-visible{outline-color:var(--color-gray-300)}.focus-visible\\:outline-gray-400:focus-visible{outline-color:var(--color-gray-400)}.disabled\\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\\:opacity-50:disabled{opacity:.5}@media (min-width:48rem){.md\\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}}.\\[\\&\\>svg\\]\\:\\!h-8>svg{height:calc(var(--spacing)*8)!important}.\\[\\&\\>svg\\]\\:\\!w-8>svg{width:calc(var(--spacing)*8)!important}.sr-only{clip:rect(0,0,0,0);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}}@property --tw-translate-x{syntax:\"*\";inherits:false;initial-value:0}@property --tw-translate-y{syntax:\"*\";inherits:false;initial-value:0}@property --tw-translate-z{syntax:\"*\";inherits:false;initial-value:0}@property --tw-rotate-x{syntax:\"*\";inherits:false}@property --tw-rotate-y{syntax:\"*\";inherits:false}@property --tw-rotate-z{syntax:\"*\";inherits:false}@property --tw-skew-x{syntax:\"*\";inherits:false}@property --tw-skew-y{syntax:\"*\";inherits:false}@property --tw-space-y-reverse{syntax:\"*\";inherits:false;initial-value:0}@property --tw-divide-y-reverse{syntax:\"*\";inherits:false;initial-value:0}@property --tw-border-style{syntax:\"*\";inherits:false;initial-value:solid}@property --tw-leading{syntax:\"*\";inherits:false}@property --tw-font-weight{syntax:\"*\";inherits:false}@property --tw-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:\"*\";inherits:false}@property --tw-shadow-alpha{syntax:\"<percentage>\";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:\"*\";inherits:false}@property --tw-inset-shadow-alpha{syntax:\"<percentage>\";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:\"*\";inherits:false}@property --tw-ring-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:\"*\";inherits:false}@property --tw-inset-ring-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:\"*\";inherits:false}@property --tw-ring-offset-width{syntax:\"<length>\";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:\"*\";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-outline-style{syntax:\"*\";inherits:false;initial-value:solid}@property --tw-blur{syntax:\"*\";inherits:false}@property --tw-brightness{syntax:\"*\";inherits:false}@property --tw-contrast{syntax:\"*\";inherits:false}@property --tw-grayscale{syntax:\"*\";inherits:false}@property --tw-hue-rotate{syntax:\"*\";inherits:false}@property --tw-invert{syntax:\"*\";inherits:false}@property --tw-opacity{syntax:\"*\";inherits:false}@property --tw-saturate{syntax:\"*\";inherits:false}@property --tw-sepia{syntax:\"*\";inherits:false}@property --tw-drop-shadow{syntax:\"*\";inherits:false}@property --tw-drop-shadow-color{syntax:\"*\";inherits:false}@property --tw-drop-shadow-alpha{syntax:\"<percentage>\";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:\"*\";inherits:false}@property --tw-backdrop-blur{syntax:\"*\";inherits:false}@property --tw-backdrop-brightness{syntax:\"*\";inherits:false}@property --tw-backdrop-contrast{syntax:\"*\";inherits:false}@property --tw-backdrop-grayscale{syntax:\"*\";inherits:false}@property --tw-backdrop-hue-rotate{syntax:\"*\";inherits:false}@property --tw-backdrop-invert{syntax:\"*\";inherits:false}@property --tw-backdrop-opacity{syntax:\"*\";inherits:false}@property --tw-backdrop-saturate{syntax:\"*\";inherits:false}@property --tw-backdrop-sepia{syntax:\"*\";inherits:false}@property --tw-scale-x{syntax:\"*\";inherits:false;initial-value:1}@property --tw-scale-y{syntax:\"*\";inherits:false;initial-value:1}@property --tw-scale-z{syntax:\"*\";inherits:false;initial-value:1}@keyframes pulse{50%{opacity:.5}}";
+	var generated_default = "/*! tailwindcss v4.1.18 | MIT License | https://tailwindcss.com */\n@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-space-y-reverse:0;--tw-divide-y-reverse:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-outline-style:solid;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-backdrop-blur:initial;--tw-backdrop-brightness:initial;--tw-backdrop-contrast:initial;--tw-backdrop-grayscale:initial;--tw-backdrop-hue-rotate:initial;--tw-backdrop-invert:initial;--tw-backdrop-opacity:initial;--tw-backdrop-saturate:initial;--tw-backdrop-sepia:initial;--tw-scale-x:1;--tw-scale-y:1;--tw-scale-z:1}}}@layer theme{:root,:host{--font-sans:ui-sans-serif,system-ui,sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\",\"Segoe UI Symbol\",\"Noto Color Emoji\";--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,\"Liberation Mono\",\"Courier New\",monospace;--color-amber-50:oklch(98.7% .022 95.277);--color-amber-100:oklch(96.2% .059 95.617);--color-amber-200:oklch(92.4% .12 95.746);--color-amber-600:oklch(66.6% .179 58.318);--color-amber-700:oklch(55.5% .163 48.998);--color-amber-800:oklch(47.3% .137 46.201);--color-amber-900:oklch(41.4% .112 45.904);--color-green-100:oklch(96.2% .044 156.743);--color-green-700:oklch(52.7% .154 150.069);--color-green-800:oklch(44.8% .119 151.328);--color-emerald-50:oklch(97.9% .021 166.113);--color-emerald-200:oklch(90.5% .093 164.15);--color-emerald-500:oklch(69.6% .17 162.48);--color-emerald-700:oklch(50.8% .118 165.612);--color-sky-50:oklch(97.7% .013 236.62);--color-sky-200:oklch(90.1% .058 230.902);--color-sky-700:oklch(50% .134 242.749);--color-blue-50:oklch(97% .014 254.604);--color-blue-100:oklch(93.2% .032 255.585);--color-blue-200:oklch(88.2% .059 254.128);--color-blue-600:oklch(54.6% .245 262.881);--color-blue-700:oklch(48.8% .243 264.376);--color-blue-800:oklch(42.4% .199 265.638);--color-violet-50:oklch(96.9% .016 293.756);--color-violet-200:oklch(89.4% .057 293.283);--color-violet-700:oklch(49.1% .27 292.581);--color-purple-50:oklch(97.7% .014 308.299);--color-purple-200:oklch(90.2% .063 306.703);--color-purple-700:oklch(49.6% .265 301.924);--color-fuchsia-50:oklch(97.7% .017 320.058);--color-fuchsia-200:oklch(90.3% .076 319.62);--color-fuchsia-700:oklch(51.8% .253 323.949);--color-rose-50:oklch(96.9% .015 12.422);--color-rose-200:oklch(89.2% .058 10.001);--color-rose-500:oklch(64.5% .246 16.439);--color-rose-700:oklch(51.4% .222 16.935);--color-slate-200:oklch(92.9% .013 255.508);--color-slate-500:oklch(55.4% .046 257.417);--color-slate-700:oklch(37.2% .044 257.287);--color-slate-800:oklch(27.9% .041 260.031);--color-slate-900:oklch(20.8% .042 265.755);--color-slate-950:oklch(12.9% .042 264.695);--color-gray-50:oklch(98.5% .002 247.839);--color-gray-100:oklch(96.7% .003 264.542);--color-gray-200:oklch(92.8% .006 264.531);--color-gray-300:oklch(87.2% .01 258.338);--color-gray-400:oklch(70.7% .022 261.325);--color-gray-500:oklch(55.1% .027 264.364);--color-gray-600:oklch(44.6% .03 256.802);--color-gray-700:oklch(37.3% .034 259.733);--color-gray-800:oklch(27.8% .033 256.848);--color-gray-900:oklch(21% .034 264.665);--color-black:#000;--color-white:#fff;--spacing:.25rem;--container-xs:20rem;--container-md:28rem;--text-xs:.75rem;--text-xs--line-height:calc(1/.75);--text-sm:.875rem;--text-sm--line-height:calc(1.25/.875);--text-lg:1.125rem;--text-lg--line-height:calc(1.75/1.125);--font-weight-medium:500;--font-weight-semibold:600;--leading-snug:1.375;--leading-relaxed:1.625;--radius-sm:.25rem;--radius-md:.375rem;--radius-lg:.5rem;--radius-xl:.75rem;--animate-pulse:pulse 2s cubic-bezier(.4,0,.6,1)infinite;--blur-sm:8px;--blur-md:12px;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4,0,.2,1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\",\"Segoe UI Symbol\",\"Noto Color Emoji\");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,\"Liberation Mono\",\"Courier New\",monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}:host{font-family:var(--font-sans);color:var(--color-slate-900);background-color:#0000;display:block}}@layer components;@layer utilities{.pointer-events-auto{pointer-events:auto}.visible{visibility:visible}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.static{position:static}.sticky{position:sticky}.top-0{top:calc(var(--spacing)*0)}.right-0{right:calc(var(--spacing)*0)}.right-1{right:calc(var(--spacing)*1)}.bottom-1{bottom:calc(var(--spacing)*1)}.left-0{left:calc(var(--spacing)*0)}.z-10{z-index:10}.z-30{z-index:30}.z-40{z-index:40}.z-50{z-index:50}.m-0{margin:calc(var(--spacing)*0)}.mx-4{margin-inline:calc(var(--spacing)*4)}.my-1{margin-block:calc(var(--spacing)*1)}.my-3{margin-block:calc(var(--spacing)*3)}.mt-0\\.5{margin-top:calc(var(--spacing)*.5)}.mt-1{margin-top:calc(var(--spacing)*1)}.mt-1\\.5{margin-top:calc(var(--spacing)*1.5)}.mt-2{margin-top:calc(var(--spacing)*2)}.mt-3{margin-top:calc(var(--spacing)*3)}.mb-1{margin-bottom:calc(var(--spacing)*1)}.mb-2{margin-bottom:calc(var(--spacing)*2)}.mb-3{margin-bottom:calc(var(--spacing)*3)}.mb-4{margin-bottom:calc(var(--spacing)*4)}.ml-auto{margin-left:auto}.box-border{box-sizing:border-box}.block{display:block}.contents{display:contents}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline{display:inline}.inline-block{display:inline-block}.inline-flex{display:inline-flex}.table{display:table}.h-1\\.5{height:calc(var(--spacing)*1.5)}.h-3{height:calc(var(--spacing)*3)}.h-3\\.5{height:calc(var(--spacing)*3.5)}.h-5{height:calc(var(--spacing)*5)}.h-6{height:calc(var(--spacing)*6)}.h-8{height:calc(var(--spacing)*8)}.h-10{height:calc(var(--spacing)*10)}.h-12{height:calc(var(--spacing)*12)}.h-full{height:100%}.max-h-64{max-height:calc(var(--spacing)*64)}.w-1\\.5{width:calc(var(--spacing)*1.5)}.w-3{width:calc(var(--spacing)*3)}.w-3\\.5{width:calc(var(--spacing)*3.5)}.w-5{width:calc(var(--spacing)*5)}.w-6{width:calc(var(--spacing)*6)}.w-8{width:calc(var(--spacing)*8)}.w-10{width:calc(var(--spacing)*10)}.w-12{width:calc(var(--spacing)*12)}.w-40{width:calc(var(--spacing)*40)}.w-auto{width:auto}.w-full{width:100%}.max-w-\\[240px\\]{max-width:240px}.max-w-md{max-width:var(--container-md)}.max-w-xs{max-width:var(--container-xs)}.min-w-0{min-width:calc(var(--spacing)*0)}.min-w-\\[160px\\]{min-width:160px}.min-w-\\[200px\\]{min-width:200px}.flex-1{flex:1}.flex-shrink,.shrink{flex-shrink:1}.shrink-0{flex-shrink:0}.table-fixed{table-layout:fixed}.border-collapse{border-collapse:collapse}.-translate-y-\\[2px\\]{--tw-translate-y:calc(2px*-1);translate:var(--tw-translate-x)var(--tw-translate-y)}.rotate-180{rotate:180deg}.transform{transform:var(--tw-rotate-x,)var(--tw-rotate-y,)var(--tw-rotate-z,)var(--tw-skew-x,)var(--tw-skew-y,)}.animate-pulse{animation:var(--animate-pulse)}.cursor-grab{cursor:grab}.cursor-grabbing{cursor:grabbing}.cursor-nwse-resize{cursor:nwse-resize}.cursor-pointer{cursor:pointer}.touch-none{touch-action:none}.resize{resize:both}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.items-start{align-items:flex-start}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.gap-1{gap:calc(var(--spacing)*1)}.gap-1\\.5{gap:calc(var(--spacing)*1.5)}.gap-2{gap:calc(var(--spacing)*2)}.gap-3{gap:calc(var(--spacing)*3)}.gap-4{gap:calc(var(--spacing)*4)}:where(.space-y-1>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing)*1)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing)*1)*calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-2>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing)*2)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing)*2)*calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-3>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing)*3)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing)*3)*calc(1 - var(--tw-space-y-reverse)))}:where(.divide-y>:not(:last-child)){--tw-divide-y-reverse:0;border-bottom-style:var(--tw-border-style);border-top-style:var(--tw-border-style);border-top-width:calc(1px*var(--tw-divide-y-reverse));border-bottom-width:calc(1px*calc(1 - var(--tw-divide-y-reverse)))}:where(.divide-gray-200>:not(:last-child)){border-color:var(--color-gray-200)}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-x-hidden{overflow-x:hidden}.overflow-y-auto{overflow-y:auto}.rounded{border-radius:.25rem}.rounded-full{border-radius:3.40282e38px}.rounded-lg{border-radius:var(--radius-lg)}.rounded-md{border-radius:var(--radius-md)}.rounded-sm{border-radius:var(--radius-sm)}.rounded-xl{border-radius:var(--radius-xl)}.border{border-style:var(--tw-border-style);border-width:1px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-r{border-right-style:var(--tw-border-style);border-right-width:1px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-l{border-left-style:var(--tw-border-style);border-left-width:1px}.border-dashed{--tw-border-style:dashed;border-style:dashed}.border-amber-200{border-color:var(--color-amber-200)}.border-blue-200{border-color:var(--color-blue-200)}.border-emerald-200{border-color:var(--color-emerald-200)}.border-fuchsia-200{border-color:var(--color-fuchsia-200)}.border-gray-100{border-color:var(--color-gray-100)}.border-gray-200{border-color:var(--color-gray-200)}.border-purple-200{border-color:var(--color-purple-200)}.border-rose-200{border-color:var(--color-rose-200)}.border-sky-200{border-color:var(--color-sky-200)}.border-slate-200{border-color:var(--color-slate-200)}.border-violet-200{border-color:var(--color-violet-200)}.border-white\\/20{border-color:#fff3}@supports (color:color-mix(in lab, red, red)){.border-white\\/20{border-color:color-mix(in oklab,var(--color-white)20%,transparent)}}.bg-amber-50{background-color:var(--color-amber-50)}.bg-amber-100{background-color:var(--color-amber-100)}.bg-blue-50{background-color:var(--color-blue-50)}.bg-blue-100{background-color:var(--color-blue-100)}.bg-emerald-50{background-color:var(--color-emerald-50)}.bg-emerald-500{background-color:var(--color-emerald-500)}.bg-fuchsia-50{background-color:var(--color-fuchsia-50)}.bg-gray-50{background-color:var(--color-gray-50)}.bg-gray-50\\/50{background-color:#f9fafb80}@supports (color:color-mix(in lab, red, red)){.bg-gray-50\\/50{background-color:color-mix(in oklab,var(--color-gray-50)50%,transparent)}}.bg-gray-100{background-color:var(--color-gray-100)}.bg-gray-400{background-color:var(--color-gray-400)}.bg-gray-800{background-color:var(--color-gray-800)}.bg-gray-900{background-color:var(--color-gray-900)}.bg-green-100{background-color:var(--color-green-100)}.bg-purple-50{background-color:var(--color-purple-50)}.bg-rose-50{background-color:var(--color-rose-50)}.bg-rose-500{background-color:var(--color-rose-500)}.bg-sky-50{background-color:var(--color-sky-50)}.bg-slate-900{background-color:var(--color-slate-900)}.bg-slate-950\\/95{background-color:#020618f2}@supports (color:color-mix(in lab, red, red)){.bg-slate-950\\/95{background-color:color-mix(in oklab,var(--color-slate-950)95%,transparent)}}.bg-violet-50{background-color:var(--color-violet-50)}.bg-white{background-color:var(--color-white)}.bg-white\\/60{background-color:#fff9}@supports (color:color-mix(in lab, red, red)){.bg-white\\/60{background-color:color-mix(in oklab,var(--color-white)60%,transparent)}}.bg-white\\/95{background-color:#fffffff2}@supports (color:color-mix(in lab, red, red)){.bg-white\\/95{background-color:color-mix(in oklab,var(--color-white)95%,transparent)}}.p-2{padding:calc(var(--spacing)*2)}.p-3{padding:calc(var(--spacing)*3)}.p-4{padding:calc(var(--spacing)*4)}.px-1{padding-inline:calc(var(--spacing)*1)}.px-1\\.5{padding-inline:calc(var(--spacing)*1.5)}.px-2{padding-inline:calc(var(--spacing)*2)}.px-3{padding-inline:calc(var(--spacing)*3)}.px-4{padding-inline:calc(var(--spacing)*4)}.py-0\\.5{padding-block:calc(var(--spacing)*.5)}.py-1{padding-block:calc(var(--spacing)*1)}.py-1\\.5{padding-block:calc(var(--spacing)*1.5)}.py-2{padding-block:calc(var(--spacing)*2)}.py-2\\.5{padding-block:calc(var(--spacing)*2.5)}.py-3{padding-block:calc(var(--spacing)*3)}.py-4{padding-block:calc(var(--spacing)*4)}.py-8{padding-block:calc(var(--spacing)*8)}.py-10{padding-block:calc(var(--spacing)*10)}.text-center{text-align:center}.text-left{text-align:left}.align-middle{vertical-align:middle}.font-mono{font-family:var(--font-mono)}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.text-\\[9px\\]{font-size:9px}.text-\\[10px\\]{font-size:10px}.text-\\[11px\\]{font-size:11px}.leading-relaxed{--tw-leading:var(--leading-relaxed);line-height:var(--leading-relaxed)}.leading-snug{--tw-leading:var(--leading-snug);line-height:var(--leading-snug)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.break-words{overflow-wrap:break-word}.whitespace-nowrap{white-space:nowrap}.whitespace-pre-line{white-space:pre-line}.whitespace-pre-wrap{white-space:pre-wrap}.text-amber-600{color:var(--color-amber-600)}.text-amber-700{color:var(--color-amber-700)}.text-amber-800{color:var(--color-amber-800)}.text-amber-900{color:var(--color-amber-900)}.text-blue-600{color:var(--color-blue-600)}.text-blue-700{color:var(--color-blue-700)}.text-blue-800{color:var(--color-blue-800)}.text-emerald-700{color:var(--color-emerald-700)}.text-fuchsia-700{color:var(--color-fuchsia-700)}.text-gray-300{color:var(--color-gray-300)}.text-gray-400{color:var(--color-gray-400)}.text-gray-500{color:var(--color-gray-500)}.text-gray-600{color:var(--color-gray-600)}.text-gray-700{color:var(--color-gray-700)}.text-gray-800{color:var(--color-gray-800)}.text-gray-900{color:var(--color-gray-900)}.text-green-700{color:var(--color-green-700)}.text-green-800{color:var(--color-green-800)}.text-purple-700{color:var(--color-purple-700)}.text-rose-700{color:var(--color-rose-700)}.text-sky-700{color:var(--color-sky-700)}.text-slate-500{color:var(--color-slate-500)}.text-slate-700{color:var(--color-slate-700)}.text-slate-800{color:var(--color-slate-800)}.text-slate-900{color:var(--color-slate-900)}.text-violet-700{color:var(--color-violet-700)}.text-white{color:var(--color-white)}.italic{font-style:italic}.underline{text-decoration-line:underline}.opacity-0{opacity:0}.opacity-80{opacity:.8}.shadow{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a),0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-lg{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a),0 4px 6px -4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-md{--tw-shadow:0 4px 6px -1px var(--tw-shadow-color,#0000001a),0 2px 4px -2px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a),0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ring-1{--tw-ring-shadow:var(--tw-ring-inset,)0 0 0 calc(1px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ring-black\\/5{--tw-ring-color:#0000000d}@supports (color:color-mix(in lab, red, red)){.ring-black\\/5{--tw-ring-color:color-mix(in oklab,var(--color-black)5%,transparent)}}.ring-transparent{--tw-ring-color:transparent}.ring-white\\/10{--tw-ring-color:#ffffff1a}@supports (color:color-mix(in lab, red, red)){.ring-white\\/10{--tw-ring-color:color-mix(in oklab,var(--color-white)10%,transparent)}}.outline{outline-style:var(--tw-outline-style);outline-width:1px}.filter{filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}.backdrop-blur-md{--tw-backdrop-blur:blur(var(--blur-md));-webkit-backdrop-filter:var(--tw-backdrop-blur,)var(--tw-backdrop-brightness,)var(--tw-backdrop-contrast,)var(--tw-backdrop-grayscale,)var(--tw-backdrop-hue-rotate,)var(--tw-backdrop-invert,)var(--tw-backdrop-opacity,)var(--tw-backdrop-saturate,)var(--tw-backdrop-sepia,);backdrop-filter:var(--tw-backdrop-blur,)var(--tw-backdrop-brightness,)var(--tw-backdrop-contrast,)var(--tw-backdrop-grayscale,)var(--tw-backdrop-hue-rotate,)var(--tw-backdrop-invert,)var(--tw-backdrop-opacity,)var(--tw-backdrop-saturate,)var(--tw-backdrop-sepia,)}.backdrop-blur-sm{--tw-backdrop-blur:blur(var(--blur-sm));-webkit-backdrop-filter:var(--tw-backdrop-blur,)var(--tw-backdrop-brightness,)var(--tw-backdrop-contrast,)var(--tw-backdrop-grayscale,)var(--tw-backdrop-hue-rotate,)var(--tw-backdrop-invert,)var(--tw-backdrop-opacity,)var(--tw-backdrop-saturate,)var(--tw-backdrop-sepia,);backdrop-filter:var(--tw-backdrop-blur,)var(--tw-backdrop-brightness,)var(--tw-backdrop-contrast,)var(--tw-backdrop-grayscale,)var(--tw-backdrop-hue-rotate,)var(--tw-backdrop-invert,)var(--tw-backdrop-opacity,)var(--tw-backdrop-saturate,)var(--tw-backdrop-sepia,)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.outline-none{--tw-outline-style:none;outline-style:none}.select-none{-webkit-user-select:none;user-select:none}@media (hover:hover){.group-hover\\:opacity-100:is(:where(.group):hover *){opacity:1}.hover\\:scale-105:hover{--tw-scale-x:105%;--tw-scale-y:105%;--tw-scale-z:105%;scale:var(--tw-scale-x)var(--tw-scale-y)}.hover\\:border-gray-300:hover{border-color:var(--color-gray-300)}.hover\\:border-white\\/30:hover{border-color:#ffffff4d}@supports (color:color-mix(in lab, red, red)){.hover\\:border-white\\/30:hover{border-color:color-mix(in oklab,var(--color-white)30%,transparent)}}.hover\\:bg-blue-50\\/50:hover{background-color:#eff6ff80}@supports (color:color-mix(in lab, red, red)){.hover\\:bg-blue-50\\/50:hover{background-color:color-mix(in oklab,var(--color-blue-50)50%,transparent)}}.hover\\:bg-gray-50:hover{background-color:var(--color-gray-50)}.hover\\:bg-gray-100:hover{background-color:var(--color-gray-100)}.hover\\:bg-gray-200:hover{background-color:var(--color-gray-200)}.hover\\:bg-gray-800:hover{background-color:var(--color-gray-800)}.hover\\:bg-slate-900\\/95:hover{background-color:#0f172bf2}@supports (color:color-mix(in lab, red, red)){.hover\\:bg-slate-900\\/95:hover{background-color:color-mix(in oklab,var(--color-slate-900)95%,transparent)}}.hover\\:text-gray-600:hover{color:var(--color-gray-600)}.hover\\:text-gray-900:hover{color:var(--color-gray-900)}.hover\\:text-slate-900:hover{color:var(--color-slate-900)}}.focus\\:border-gray-300:focus{border-color:var(--color-gray-300)}.focus\\:bg-gray-50:focus{background-color:var(--color-gray-50)}.focus\\:ring-2:focus{--tw-ring-shadow:var(--tw-ring-inset,)0 0 0 calc(2px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.focus\\:ring-gray-200:focus{--tw-ring-color:var(--color-gray-200)}.focus\\:outline-none:focus{--tw-outline-style:none;outline-style:none}.focus-visible\\:outline:focus-visible{outline-style:var(--tw-outline-style);outline-width:1px}.focus-visible\\:outline-2:focus-visible{outline-style:var(--tw-outline-style);outline-width:2px}.focus-visible\\:outline-offset-2:focus-visible{outline-offset:2px}.focus-visible\\:outline-\\[\\#BEC2FF\\]:focus-visible{outline-color:#bec2ff}.focus-visible\\:outline-gray-300:focus-visible{outline-color:var(--color-gray-300)}.focus-visible\\:outline-gray-400:focus-visible{outline-color:var(--color-gray-400)}.disabled\\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\\:opacity-50:disabled{opacity:.5}@media (min-width:48rem){.md\\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}}.\\[\\&\\>svg\\]\\:\\!h-8>svg{height:calc(var(--spacing)*8)!important}.\\[\\&\\>svg\\]\\:\\!w-8>svg{width:calc(var(--spacing)*8)!important}.sr-only{clip:rect(0,0,0,0);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}}@property --tw-translate-x{syntax:\"*\";inherits:false;initial-value:0}@property --tw-translate-y{syntax:\"*\";inherits:false;initial-value:0}@property --tw-translate-z{syntax:\"*\";inherits:false;initial-value:0}@property --tw-rotate-x{syntax:\"*\";inherits:false}@property --tw-rotate-y{syntax:\"*\";inherits:false}@property --tw-rotate-z{syntax:\"*\";inherits:false}@property --tw-skew-x{syntax:\"*\";inherits:false}@property --tw-skew-y{syntax:\"*\";inherits:false}@property --tw-space-y-reverse{syntax:\"*\";inherits:false;initial-value:0}@property --tw-divide-y-reverse{syntax:\"*\";inherits:false;initial-value:0}@property --tw-border-style{syntax:\"*\";inherits:false;initial-value:solid}@property --tw-leading{syntax:\"*\";inherits:false}@property --tw-font-weight{syntax:\"*\";inherits:false}@property --tw-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:\"*\";inherits:false}@property --tw-shadow-alpha{syntax:\"<percentage>\";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:\"*\";inherits:false}@property --tw-inset-shadow-alpha{syntax:\"<percentage>\";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:\"*\";inherits:false}@property --tw-ring-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:\"*\";inherits:false}@property --tw-inset-ring-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:\"*\";inherits:false}@property --tw-ring-offset-width{syntax:\"<length>\";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:\"*\";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:\"*\";inherits:false;initial-value:0 0 #0000}@property --tw-outline-style{syntax:\"*\";inherits:false;initial-value:solid}@property --tw-blur{syntax:\"*\";inherits:false}@property --tw-brightness{syntax:\"*\";inherits:false}@property --tw-contrast{syntax:\"*\";inherits:false}@property --tw-grayscale{syntax:\"*\";inherits:false}@property --tw-hue-rotate{syntax:\"*\";inherits:false}@property --tw-invert{syntax:\"*\";inherits:false}@property --tw-opacity{syntax:\"*\";inherits:false}@property --tw-saturate{syntax:\"*\";inherits:false}@property --tw-sepia{syntax:\"*\";inherits:false}@property --tw-drop-shadow{syntax:\"*\";inherits:false}@property --tw-drop-shadow-color{syntax:\"*\";inherits:false}@property --tw-drop-shadow-alpha{syntax:\"<percentage>\";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:\"*\";inherits:false}@property --tw-backdrop-blur{syntax:\"*\";inherits:false}@property --tw-backdrop-brightness{syntax:\"*\";inherits:false}@property --tw-backdrop-contrast{syntax:\"*\";inherits:false}@property --tw-backdrop-grayscale{syntax:\"*\";inherits:false}@property --tw-backdrop-hue-rotate{syntax:\"*\";inherits:false}@property --tw-backdrop-invert{syntax:\"*\";inherits:false}@property --tw-backdrop-opacity{syntax:\"*\";inherits:false}@property --tw-backdrop-saturate{syntax:\"*\";inherits:false}@property --tw-backdrop-sepia{syntax:\"*\";inherits:false}@property --tw-scale-x{syntax:\"*\";inherits:false;initial-value:1}@property --tw-scale-y{syntax:\"*\";inherits:false;initial-value:1}@property --tw-scale-z{syntax:\"*\";inherits:false;initial-value:1}@keyframes pulse{50%{opacity:.5}}";
 
 //#endregion
 //#region src/assets/inspector-logo.svg
@@ -191,7 +191,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 //#endregion
 //#region package.json
-	var version = "1.62.2";
+	var version = "1.63.0";
 
 //#endregion
 //#region src/lib/telemetry.ts
@@ -204,7 +204,15 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 		threadsTalkToEngineerClicked: "oss.inspector.threads_talk_to_engineer_clicked",
 		talkToEngineerClicked: "oss.inspector.talk_to_engineer_clicked",
 		threadsEmptyEnabledViewed: "oss.inspector.threads_empty_enabled_viewed",
-		threadsEnabledViewed: "oss.inspector.threads_enabled_viewed"
+		threadsEnabledViewed: "oss.inspector.threads_enabled_viewed",
+		threadsExampleViewed: "oss.inspector.threads_example_viewed",
+		threadsExampleSelected: "oss.inspector.threads_example_selected",
+		threadsExampleTourStarted: "oss.inspector.threads_example_tour_started",
+		threadsExampleTourStepViewed: "oss.inspector.threads_example_tour_step_viewed",
+		threadsExampleTourDismissed: "oss.inspector.threads_example_tour_dismissed",
+		threadsExampleTourCompleted: "oss.inspector.threads_example_tour_completed",
+		threadsExampleTourReopened: "oss.inspector.threads_example_tour_reopened",
+		memoriesTabClicked: "oss.inspector.memories_tab_clicked"
 	};
 	const TELEMETRY_INGEST_URL = "https://telemetry.copilotkit.ai/ingest";
 	const TELEMETRY_DOCS_URL = "https://docs.copilotkit.ai/telemetry";
@@ -212,7 +220,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 	const PACKAGE_VERSION = version;
 	const FETCH_TIMEOUT_MS = 3e3;
 	function isThreadsTelemetryEvent(event) {
-		return event === TELEMETRY_EVENTS.threadsTabClicked || event === TELEMETRY_EVENTS.threadsLockedViewed || event === TELEMETRY_EVENTS.threadsIntelligenceSignupClicked || event === TELEMETRY_EVENTS.threadsTalkToEngineerClicked || event === TELEMETRY_EVENTS.talkToEngineerClicked || event === TELEMETRY_EVENTS.threadsEmptyEnabledViewed || event === TELEMETRY_EVENTS.threadsEnabledViewed;
+		return event === TELEMETRY_EVENTS.threadsTabClicked || event === TELEMETRY_EVENTS.threadsLockedViewed || event === TELEMETRY_EVENTS.threadsIntelligenceSignupClicked || event === TELEMETRY_EVENTS.threadsTalkToEngineerClicked || event === TELEMETRY_EVENTS.talkToEngineerClicked || event === TELEMETRY_EVENTS.threadsEmptyEnabledViewed || event === TELEMETRY_EVENTS.threadsEnabledViewed || event === TELEMETRY_EVENTS.threadsExampleViewed || event === TELEMETRY_EVENTS.threadsExampleSelected || event === TELEMETRY_EVENTS.threadsExampleTourStarted || event === TELEMETRY_EVENTS.threadsExampleTourStepViewed || event === TELEMETRY_EVENTS.threadsExampleTourDismissed || event === TELEMETRY_EVENTS.threadsExampleTourCompleted || event === TELEMETRY_EVENTS.threadsExampleTourReopened || event === TELEMETRY_EVENTS.memoriesTabClicked;
 	}
 	function getRuntimeUrlType(runtimeUrl) {
 		if (!runtimeUrl) return "missing";
@@ -291,6 +299,30 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 	function trackThreadsEnabledViewed(props) {
 		track(TELEMETRY_EVENTS.threadsEnabledViewed, props);
 	}
+	function trackThreadsExampleViewed(props) {
+		track(TELEMETRY_EVENTS.threadsExampleViewed, props);
+	}
+	function trackThreadsExampleSelected(props) {
+		track(TELEMETRY_EVENTS.threadsExampleSelected, props);
+	}
+	function trackThreadsExampleTourStarted(props) {
+		track(TELEMETRY_EVENTS.threadsExampleTourStarted, props);
+	}
+	function trackThreadsExampleTourStepViewed(props) {
+		track(TELEMETRY_EVENTS.threadsExampleTourStepViewed, props);
+	}
+	function trackThreadsExampleTourDismissed(props) {
+		track(TELEMETRY_EVENTS.threadsExampleTourDismissed, props);
+	}
+	function trackThreadsExampleTourCompleted(props) {
+		track(TELEMETRY_EVENTS.threadsExampleTourCompleted, props);
+	}
+	function trackThreadsExampleTourReopened(props) {
+		track(TELEMETRY_EVENTS.threadsExampleTourReopened, props);
+	}
+	function trackMemoriesTabClicked(props = {}) {
+		track(TELEMETRY_EVENTS.memoriesTabClicked, props);
+	}
 	/**
 	* Returns the inspector's anonymous distinct-ID for cross-domain
 	* propagation onto outbound banner-CTA links, or `null` when the user
@@ -377,7 +409,13 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 	const MAX_AGENT_EVENTS = 200;
 	const MAX_TOTAL_EVENTS = 500;
 	const INTELLIGENCE_SIGNUP_URL = "https://go.copilotkit.ai/intelligence-signup";
+	const THREADS_INTELLIGENCE_SIGNIN_URL = "https://dashboard.operations.copilotkit.ai/sign-in";
 	const TALK_TO_ENGINEER_URL = "https://www.copilotkit.ai/talk-to-an-engineer";
+	const THREADS_DOCS_URL = "https://docs.copilotkit.ai/threads";
+	const SELF_HOSTED_INTELLIGENCE_URL = "https://docs.copilotkit.ai/premium/self-hosting";
+	const THREADS_EXAMPLE_OVERVIEW_VIDEO_URL = "https://cdn.copilotkit.ai/corp-site/videos/copilotkit-generative-ui-agentic-frontend-demo.webm";
+	const THREADS_EXAMPLE_TOUR_STORAGE_KEY = "cpk:inspector:threads-example-tour:v1";
+	const THREADS_EXAMPLE_AGENT_ID = "threads-feature";
 	const AGENT_EVENT_TYPES = [
 		"RUN_STARTED",
 		"RUN_FINISHED",
@@ -403,6 +441,201 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 		"ACTIVITY_SNAPSHOT",
 		"ACTIVITY_DELTA"
 	];
+	const THREADS_EXAMPLE_THREADS = [
+		{
+			id: "example-realtime-sync",
+			name: "Realtime thread sync",
+			agentId: THREADS_EXAMPLE_AGENT_ID,
+			organizationId: "example-organization",
+			createdById: "example-user",
+			archived: false,
+			createdAt: "2026-07-08T16:00:00.000Z",
+			updatedAt: "2026-07-08T16:30:00.000Z",
+			isExample: true
+		},
+		{
+			id: "example-manage-history",
+			name: "Manage saved conversations",
+			agentId: THREADS_EXAMPLE_AGENT_ID,
+			organizationId: "example-organization",
+			createdById: "example-user",
+			archived: false,
+			createdAt: "2026-07-07T17:45:00.000Z",
+			updatedAt: "2026-07-07T18:15:00.000Z",
+			isExample: true
+		},
+		{
+			id: "example-inspect-runs",
+			name: "Inspect durable run history",
+			agentId: THREADS_EXAMPLE_AGENT_ID,
+			organizationId: "example-organization",
+			createdById: "example-user",
+			archived: false,
+			createdAt: "2026-07-06T20:15:00.000Z",
+			updatedAt: "2026-07-06T20:45:00.000Z",
+			isExample: true
+		}
+	];
+	const THREADS_EXAMPLE_DETAILS = {
+		"example-realtime-sync": {
+			messages: [{
+				id: "example-sync-user",
+				role: "user",
+				content: "Resume the checkout support thread from yesterday."
+			}, {
+				id: "example-sync-assistant",
+				role: "assistant",
+				content: "I found the saved thread, restored the cart state, and continued from the latest user message."
+			}],
+			events: [
+				{
+					type: "RUN_STARTED",
+					timestamp: "2026-07-08T16:30:00.000Z",
+					payload: {
+						threadId: "example-realtime-sync",
+						agentId: THREADS_EXAMPLE_AGENT_ID
+					}
+				},
+				{
+					type: "MESSAGES_SNAPSHOT",
+					timestamp: "2026-07-08T16:30:01.000Z",
+					payload: {
+						messageCount: 6,
+						source: "thread-history"
+					}
+				},
+				{
+					type: "STATE_SNAPSHOT",
+					timestamp: "2026-07-08T16:30:02.000Z",
+					payload: {
+						cartId: "cart_demo_42",
+						checkoutStep: "shipping",
+						resumed: true
+					}
+				},
+				{
+					type: "RUN_FINISHED",
+					timestamp: "2026-07-08T16:30:04.000Z",
+					payload: { status: "completed" }
+				}
+			],
+			state: {
+				cartId: "cart_demo_42",
+				checkoutStep: "shipping",
+				userIntent: "resume_previous_checkout",
+				persistedThread: true
+			}
+		},
+		"example-manage-history": {
+			messages: [{
+				id: "example-history-user",
+				role: "user",
+				content: "Rename this saved support conversation for the handoff."
+			}, {
+				id: "example-history-assistant",
+				role: "assistant",
+				content: "Renamed the thread and kept the prior messages available for the next session."
+			}],
+			events: [
+				{
+					type: "RUN_STARTED",
+					timestamp: "2026-07-07T18:15:00.000Z",
+					payload: {
+						threadId: "example-manage-history",
+						agentId: THREADS_EXAMPLE_AGENT_ID
+					}
+				},
+				{
+					type: "CUSTOM_EVENT",
+					timestamp: "2026-07-07T18:15:01.000Z",
+					payload: {
+						action: "thread_renamed",
+						previousName: "Untitled",
+						name: "Billing escalation handoff"
+					}
+				},
+				{
+					type: "RUN_FINISHED",
+					timestamp: "2026-07-07T18:15:03.000Z",
+					payload: { status: "completed" }
+				}
+			],
+			state: {
+				name: "Billing escalation handoff",
+				savedMessages: 14,
+				lastHandoff: "support-team"
+			}
+		},
+		"example-inspect-runs": {
+			messages: [{
+				id: "example-inspect-user",
+				role: "user",
+				content: "Why did the assistant recommend the enterprise plan?"
+			}, {
+				id: "example-inspect-assistant",
+				role: "assistant",
+				content: "The recommendation came from the account size, SSO requirement, and audit-log constraint in state."
+			}],
+			events: [
+				{
+					type: "RUN_STARTED",
+					timestamp: "2026-07-06T20:45:00.000Z",
+					payload: {
+						threadId: "example-inspect-runs",
+						agentId: THREADS_EXAMPLE_AGENT_ID
+					}
+				},
+				{
+					type: "TOOL_CALL_START",
+					timestamp: "2026-07-06T20:45:01.000Z",
+					payload: {
+						toolCallId: "call_account_lookup",
+						toolName: "lookupAccount"
+					}
+				},
+				{
+					type: "TOOL_CALL_RESULT",
+					timestamp: "2026-07-06T20:45:02.000Z",
+					payload: {
+						toolCallId: "call_account_lookup",
+						seats: 220,
+						requiresSso: true
+					}
+				},
+				{
+					type: "RUN_FINISHED",
+					timestamp: "2026-07-06T20:45:04.000Z",
+					payload: { status: "completed" }
+				}
+			],
+			state: {
+				accountTier: "growth",
+				seats: 220,
+				requiresSso: true,
+				auditLogsRequired: true
+			}
+		}
+	};
+	const THREADS_EXAMPLE_TOUR_STEPS = [
+		{
+			tab: "timeline",
+			label: "Timeline",
+			title: "Read the run as a story",
+			body: "The timeline turns messages, tool calls, state changes, and run markers into a scannable debugging trail."
+		},
+		{
+			tab: "raw-events",
+			label: "Raw AG-UI Events",
+			title: "Drop into the protocol payloads",
+			body: "Raw events show the exact AG-UI stream behind the timeline when you need to verify ordering or payload shape."
+		},
+		{
+			tab: "state",
+			label: "State",
+			title: "Check the durable state",
+			body: "The state tab shows the saved values that make a thread resumable across sessions."
+		}
+	];
 	function escapeHtml(s) {
 		return s.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
 	}
@@ -549,6 +782,9 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
                 </div>
                 <div class="cpk-tl__meta">
                   <span class="cpk-tl__pill">${thread.agentId}</span>
+                  ${thread.isExample ? lit.html`
+                          <span class="cpk-tl__pill cpk-tl__pill--example">Example</span>
+                        ` : lit.nothing}
                 </div>
               </div>
             `;
@@ -731,6 +967,11 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
       color: #57575b;
     }
 
+    .cpk-tl__pill--example {
+      background: rgba(133, 236, 206, 0.22);
+      color: #189370;
+    }
+
     /* ── Empty state ── */
     .cpk-tl__empty {
       padding: 32px 16px;
@@ -857,6 +1098,9 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 			}
 			this.maybeFetchTabData(id);
 		}
+		selectTab(id) {
+			this.activateTab(id);
+		}
 		maybeFetchTabData(id) {
 			if (!this.threadId) return;
 			if ((id === "timeline" || id === "raw-events") && !this._eventsFetched) {
@@ -3004,201 +3248,558 @@ ${(0, lit_directives_unsafe_html_js.unsafeHTML)(highlightedJson(stateValue))}</p
       text-align: right;
     }
   `;
-	var ɵCpkThreadDetails = class extends CpkThreadInspector {};
-	if (!customElements.get("cpk-thread-list")) customElements.define("cpk-thread-list", CpkThreadList);
-	if (!customElements.get(THREAD_INSPECTOR_TAG)) customElements.define(THREAD_INSPECTOR_TAG, CpkThreadInspector);
-	if (!customElements.get("cpk-thread-details")) customElements.define("cpk-thread-details", ɵCpkThreadDetails);
-	var WebInspectorElement = class extends lit.LitElement {
+	var CpkMemoryList = class extends lit.LitElement {
 		constructor(..._args3) {
 			super(..._args3);
-			this._core = null;
-			this.coreSubscriber = null;
-			this.coreUnsubscribe = null;
-			this.runtimeStatus = null;
-			this.coreProperties = {};
-			this.lastCoreError = null;
-			this.agentSubscriptions = /* @__PURE__ */ new Map();
-			this.agentEvents = /* @__PURE__ */ new Map();
-			this.agentMessages = /* @__PURE__ */ new Map();
-			this.liveMessageVersion = /* @__PURE__ */ new Map();
-			this.agentStates = /* @__PURE__ */ new Map();
-			this.flattenedEvents = [];
-			this.eventCounter = 0;
-			this.contextStore = {};
-			this.pointerId = null;
-			this.dragStart = null;
-			this.dragOffset = {
-				x: 0,
-				y: 0
-			};
-			this.isDragging = false;
-			this.pointerContext = null;
-			this.isOpen = false;
-			this.draggedDuringInteraction = false;
-			this.ignoreNextButtonClick = false;
-			this.selectedMenu = "ag-ui-events";
-			this.selectedThreadId = null;
-			this.threadListWidth = 290;
-			this.threadDividerResizing = false;
-			this.threadDividerPointerId = -1;
-			this.threadDividerStartX = 0;
-			this.threadDividerStartWidth = 0;
-			this._threads = [];
-			this._threadStoreSubscriptions = /* @__PURE__ */ new Map();
-			this._threadsByAgent = /* @__PURE__ */ new Map();
-			this._threadsErrorByAgent = /* @__PURE__ */ new Map();
-			this._ownedThreadStores = /* @__PURE__ */ new Map();
-			this.contextMenuOpen = false;
-			this.dockMode = "floating";
-			this.previousBodyMargins = null;
-			this.transitionTimeoutId = null;
-			this.bodyTransitionTimeoutIds = /* @__PURE__ */ new Set();
-			this.pendingSelectedContext = null;
-			this.autoAttachCore = true;
-			this.attemptedAutoAttach = false;
-			this.cachedTools = [];
-			this.toolSignature = "";
-			this.eventFilterText = "";
-			this.eventTypeFilter = "all";
-			this.evtColWidths = [
-				100,
-				80,
-				150
-			];
-			this._evtColResize = null;
-			this.announcementHtml = null;
-			this.announcementTimestamp = null;
-			this.announcementPreviewText = null;
-			this.announcementCtaLabel = null;
-			this.hasUnseenAnnouncement = false;
-			this.announcementLoaded = false;
-			this.announcementPromise = null;
-			this.showAnnouncementPreview = true;
-			this.announcementExpanded = false;
-			this.viewedBannerTimestamps = /* @__PURE__ */ new Set();
-			this.pendingBannerViewed = null;
-			this.clickedBannerIds = /* @__PURE__ */ new Set();
-			this.viewedThreadsTelemetryStates = /* @__PURE__ */ new Set();
-			this.contextState = {
-				button: {
-					position: {
-						x: EDGE_MARGIN,
-						y: EDGE_MARGIN
-					},
-					size: { ...DEFAULT_BUTTON_SIZE },
-					anchor: {
-						horizontal: "right",
-						vertical: "top"
-					},
-					anchorOffset: {
-						x: EDGE_MARGIN,
-						y: EDGE_MARGIN
-					}
-				},
-				window: {
-					position: {
-						x: EDGE_MARGIN,
-						y: EDGE_MARGIN
-					},
-					size: { ...DEFAULT_WINDOW_SIZE },
-					anchor: {
-						horizontal: "right",
-						vertical: "top"
-					},
-					anchorOffset: {
-						x: EDGE_MARGIN,
-						y: EDGE_MARGIN
-					}
-				}
-			};
-			this.hasCustomPosition = {
-				button: false,
-				window: false
-			};
-			this.resizePointerId = null;
-			this.resizeStart = null;
-			this.resizeInitialSize = null;
-			this.isResizing = false;
-			this.customTabIcons = { threads: `<svg class="h-3.5 w-3.5" width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M9.04167 15C8.29167 15 7.65972 14.7431 7.14583 14.2292C6.63194 13.7153 6.375 13.0972 6.375 12.375C6.375 11.3194 6.80208 10.3646 7.65625 9.51042C8.51042 8.65625 9.57639 8.125 10.8542 7.91667C10.8125 7.41667 10.6875 7.03819 10.4792 6.78125C10.2708 6.52431 9.98611 6.39583 9.625 6.39583C9.20833 6.39583 8.75694 6.56944 8.27083 6.91667C7.78472 7.26389 7.20833 7.83333 6.54167 8.625C5.45833 9.91667 4.66319 10.7569 4.15625 11.1458C3.64931 11.5347 3.10417 11.7292 2.52083 11.7292C1.8125 11.7292 1.21528 11.4653 0.729167 10.9375C0.243056 10.4097 0 9.77083 0 9.02083C0 8.27083 0.163194 7.50347 0.489583 6.71875C0.815972 5.93403 1.36806 4.99306 2.14583 3.89583C2.40972 3.53472 2.60417 3.22917 2.72917 2.97917C2.85417 2.72917 2.91667 2.52778 2.91667 2.375C2.91667 2.27778 2.89931 2.20486 2.86458 2.15625C2.82986 2.10764 2.77778 2.08333 2.70833 2.08333C2.56944 2.08333 2.39583 2.17014 2.1875 2.34375C1.97917 2.51736 1.73611 2.78472 1.45833 3.14583L0 1.66667C0.444444 1.125 0.895833 0.711806 1.35417 0.427083C1.8125 0.142361 2.26389 0 2.70833 0C3.34722 0 3.88889 0.222222 4.33333 0.666667C4.77778 1.11111 5 1.66667 5 2.33333C5 2.73611 4.89583 3.18056 4.6875 3.66667C4.47917 4.15278 4.13194 4.73611 3.64583 5.41667C3.11806 6.16667 2.72569 6.82639 2.46875 7.39583C2.21181 7.96528 2.08333 8.46528 2.08333 8.89583C2.08333 9.13194 2.12153 9.31597 2.19792 9.44792C2.27431 9.57986 2.38194 9.64583 2.52083 9.64583C2.65972 9.64583 2.78125 9.60764 2.88542 9.53125C2.98958 9.45486 3.18056 9.27083 3.45833 8.97917C3.63889 8.78472 3.85417 8.54514 4.10417 8.26042C4.35417 7.97569 4.65972 7.625 5.02083 7.20833C5.89583 6.16667 6.6875 5.42361 7.39583 4.97917C8.10417 4.53472 8.84722 4.3125 9.625 4.3125C10.5556 4.3125 11.3194 4.625 11.9167 5.25C12.5139 5.875 12.8542 6.72917 12.9375 7.8125H15V9.89583H12.9375C12.8264 11.4514 12.4201 12.691 11.7188 13.6146C11.0174 14.5382 10.125 15 9.04167 15ZM9.08333 12.9167C9.52778 12.9167 9.90278 12.6632 10.2083 12.1562C10.5139 11.6493 10.7222 10.9444 10.8333 10.0417C10.1944 10.1944 9.63889 10.4965 9.16667 10.9479C8.69444 11.3993 8.45833 11.8472 8.45833 12.2917C8.45833 12.4861 8.51389 12.6389 8.625 12.75C8.73611 12.8611 8.88889 12.9167 9.08333 12.9167Z" fill="currentColor"/></svg>` };
-			this.handlePointerDown = (event) => {
-				var _target$setPointerCap;
-				if (this.dockMode !== "floating" && this.isOpen) return;
-				const target = event.currentTarget;
-				const context = (target === null || target === void 0 ? void 0 : target.dataset.dragContext) === "window" ? "window" : "button";
-				const eventTarget = event.target;
-				if (context === "window" && (eventTarget === null || eventTarget === void 0 ? void 0 : eventTarget.closest("button"))) return;
-				this.pointerContext = context;
-				this.measureContext(context);
-				event.preventDefault();
-				this.pointerId = event.pointerId;
-				this.dragStart = {
-					x: event.clientX,
-					y: event.clientY
-				};
-				const state = this.contextState[context];
-				this.dragOffset = {
-					x: event.clientX - state.position.x,
-					y: event.clientY - state.position.y
-				};
-				this.isDragging = false;
-				this.draggedDuringInteraction = false;
-				this.ignoreNextButtonClick = false;
-				target === null || target === void 0 || (_target$setPointerCap = target.setPointerCapture) === null || _target$setPointerCap === void 0 || _target$setPointerCap.call(target, this.pointerId);
-			};
-			this.handlePointerMove = (event) => {
-				if (this.pointerId !== event.pointerId || !this.dragStart || !this.pointerContext) return;
-				const distance = Math.hypot(event.clientX - this.dragStart.x, event.clientY - this.dragStart.y);
-				if (!this.isDragging && distance < DRAG_THRESHOLD) return;
-				event.preventDefault();
-				this.setDragging(true);
-				this.draggedDuringInteraction = true;
-				const desired = {
-					x: event.clientX - this.dragOffset.x,
-					y: event.clientY - this.dragOffset.y
-				};
-				const constrained = this.constrainToViewport(desired, this.pointerContext);
-				this.contextState[this.pointerContext].position = constrained;
-				this.updateHostTransform(this.pointerContext);
-			};
-			this.handlePointerUp = (event) => {
-				var _this$pointerContext;
-				if (this.pointerId !== event.pointerId) return;
-				const target = event.currentTarget;
-				if (target === null || target === void 0 ? void 0 : target.hasPointerCapture(this.pointerId)) target.releasePointerCapture(this.pointerId);
-				const context = (_this$pointerContext = this.pointerContext) !== null && _this$pointerContext !== void 0 ? _this$pointerContext : this.activeContext;
-				if (this.isDragging && this.pointerContext) {
-					event.preventDefault();
-					this.setDragging(false);
-					if (this.pointerContext === "window") {
-						this.updateAnchorFromPosition(this.pointerContext);
-						this.hasCustomPosition.window = true;
-						this.applyAnchorPosition(this.pointerContext);
-					} else if (this.pointerContext === "button") {
-						this.snapButtonToCorner();
-						this.hasCustomPosition.button = true;
-						if (this.draggedDuringInteraction) this.ignoreNextButtonClick = true;
-					}
-				} else if (context === "button" && !this.isOpen && !this.draggedDuringInteraction) this.openInspector();
-				this.resetPointerTracking();
+			this.memories = [];
+			this.search = "";
+			this.kind = "all";
+			this.onSearchInput = (event) => {
+				this.search = event.target.value;
 			};
-			this.handlePointerCancel = (event) => {
-				if (this.pointerId !== event.pointerId) return;
-				const target = event.currentTarget;
-				if (target === null || target === void 0 ? void 0 : target.hasPointerCapture(this.pointerId)) target.releasePointerCapture(this.pointerId);
-				this.resetPointerTracking();
+			this.onKindClick = (event) => {
+				const seg = event.target.closest("[data-kind]");
+				if (!seg) return;
+				this.kind = seg.dataset["kind"];
 			};
-			this.handleButtonClick = (event) => {
-				if (this.isDragging) {
-					event.preventDefault();
-					return;
-				}
-				if (this.ignoreNextButtonClick) {
-					event.preventDefault();
-					this.ignoreNextButtonClick = false;
-					return;
-				}
-				if (!this.isOpen) {
-					event.preventDefault();
+		}
+		/** Memories that pass the current text search (before kind filter). */
+		get searchFiltered() {
+			const q = this.search.trim().toLowerCase();
+			if (!q) return this.memories;
+			return this.memories.filter((m) => m.content.toLowerCase().includes(q));
+		}
+		/** Memories that pass both search and kind filter. */
+		get filtered() {
+			const searched = this.searchFiltered;
+			if (this.kind === "all") return searched;
+			return searched.filter((m) => m.kind === this.kind);
+		}
+		/** Count of search-filtered memories for a given kind (for segment labels). */
+		countForKind(kind) {
+			return this.searchFiltered.filter((m) => m.kind === kind).length;
+		}
+		/** Truncate an id to first-4…last-4 characters. */
+		shortId(id) {
+			if (id.length <= 12) return id;
+			return `${id.slice(0, 4)}…${id.slice(-4)}`;
+		}
+		renderKindBadge(kind) {
+			return lit.html`<span class="cpk-ml__kind-badge cpk-ml__kind-badge--${kind}"
+      >${kind}</span
+    >`;
+		}
+		renderEmpty() {
+			const q = this.search.trim();
+			if (this.memories.length === 0) return lit.html`
+        <div class="cpk-ml__empty">
+          <svg
+            width="24"
+            height="24"
+            viewBox="0 0 24 24"
+            fill="none"
+            stroke="currentColor"
+            stroke-width="1.5"
+            stroke-linecap="round"
+            stroke-linejoin="round"
+            class="cpk-ml__empty-icon"
+          >
+            <ellipse cx="12" cy="5" rx="9" ry="3" />
+            <path d="M21 12c0 1.66-4 3-9 3s-9-1.34-9-3" />
+            <path d="M3 5v14c0 1.66 4 3 9 3s9-1.34 9-3V5" />
+          </svg>
+          No memories yet — tell the agent a durable fact and watch it appear.
+        </div>
+      `;
+			if (q) return lit.html`
+        <div class="cpk-ml__empty">
+          No memories match &ldquo;${q}&rdquo;.
+        </div>
+      `;
+			return lit.html`
+      <div class="cpk-ml__empty">No ${this.kind} memories yet.</div>
+    `;
+		}
+		render() {
+			const filtered = this.filtered;
+			return lit.html`
+      <div class="cpk-ml">
+        <!-- Search -->
+        <div class="cpk-ml__search">
+          <input
+            type="text"
+            placeholder="Search memories…"
+            .value=${this.search}
+            @input=${this.onSearchInput}
+            class="cpk-ml__search-input"
+          />
+        </div>
+
+        <!-- Kind filter -->
+        <div class="cpk-ml__filter" @click=${this.onKindClick}>
+          <button
+            class="cpk-ml__filter-seg ${this.kind === "all" ? "cpk-ml__filter-seg--active" : ""}"
+            data-kind="all"
+          >
+            All<span class="cpk-ml__filter-count">${this.searchFiltered.length}</span>
+          </button>
+          ${[
+				"topical",
+				"episodic",
+				"operational"
+			].map((k) => lit.html`
+              <button
+                class="cpk-ml__filter-seg ${this.kind === k ? "cpk-ml__filter-seg--active" : ""}"
+                data-kind="${k}"
+              >
+                ${k}<span class="cpk-ml__filter-count">${this.countForKind(k)}</span>
+              </button>
+            `)}
+        </div>
+
+        <!-- Memory list -->
+        <div class="cpk-ml__list">
+          ${filtered.map((m) => lit.html`
+              <div class="cpk-ml__card">
+                <div class="cpk-ml__card-badges">
+                  ${this.renderKindBadge(m.kind)}
+                  <span class="cpk-ml__scope-badge">${m.scope}</span>
+                </div>
+                <div class="cpk-ml__content">${m.content}</div>
+                <div class="cpk-ml__footer">
+                  <span class="cpk-ml__footer-threads"
+                    >${m.sourceThreadIds.length} source thread${m.sourceThreadIds.length === 1 ? "" : "s"}</span
+                  >
+                  <span class="cpk-ml__footer-id">${this.shortId(m.id)}</span>
+                </div>
+              </div>
+            `)}
+          ${filtered.length === 0 ? this.renderEmpty() : lit.nothing}
+        </div>
+      </div>
+    `;
+		}
+	};
+	CpkMemoryList.properties = {
+		memories: { attribute: false },
+		search: { state: true },
+		kind: { state: true }
+	};
+	CpkMemoryList.styles = lit.css`
+    @import url("https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600&family=Spline+Sans+Mono:wght@400;500&display=swap");
+
+    :host {
+      display: flex;
+      flex-direction: column;
+      height: 100%;
+      overflow: hidden;
+    }
+
+    .cpk-ml {
+      font-family: "Plus Jakarta Sans", sans-serif;
+      display: flex;
+      flex-direction: column;
+      height: 100%;
+      overflow: hidden;
+      background: #f7f7f9;
+    }
+
+    /* ── Search ── */
+    .cpk-ml__search {
+      padding: 10px 12px;
+      border-bottom: 1px solid #dbdbe5;
+      flex-shrink: 0;
+    }
+
+    .cpk-ml__search-input {
+      width: 100%;
+      box-sizing: border-box;
+      font-family: "Plus Jakarta Sans", sans-serif;
+      font-size: 12px;
+      padding: 7px 10px;
+      border-radius: 6px;
+      border: 1px solid #dbdbe5;
+      background: #ffffff;
+      color: #010507;
+      outline: none;
+      transition: border-color 0.15s;
+    }
+
+    .cpk-ml__search-input:focus {
+      border-color: #bec2ff;
+    }
+
+    /* ── Kind filter ── */
+    .cpk-ml__filter {
+      display: flex;
+      gap: 4px;
+      padding: 8px 12px;
+      border-bottom: 1px solid #dbdbe5;
+      flex-shrink: 0;
+      flex-wrap: wrap;
+    }
+
+    .cpk-ml__filter-seg {
+      font-family: "Plus Jakarta Sans", sans-serif;
+      font-size: 11px;
+      font-weight: 500;
+      padding: 3px 9px;
+      border-radius: 5px;
+      border: 1px solid #dbdbe5;
+      background: #ffffff;
+      color: #57575b;
+      cursor: pointer;
+      transition:
+        background 0.1s,
+        border-color 0.1s,
+        color 0.1s;
+      user-select: none;
+    }
+
+    .cpk-ml__filter-seg:hover {
+      background: #f0f0f5;
+    }
+
+    .cpk-ml__filter-seg--active {
+      background: #bec2ff1a;
+      border-color: #bec2ff;
+      color: #010507;
+    }
+
+    .cpk-ml__filter-count {
+      font-family: "Spline Sans Mono", monospace;
+      font-size: 9px;
+      margin-left: 4px;
+      color: #838389;
+    }
+
+    /* ── List ── */
+    .cpk-ml__list {
+      flex: 1;
+      overflow-y: auto;
+      padding: 8px 12px;
+      display: flex;
+      flex-direction: column;
+      gap: 8px;
+    }
+
+    /* ── Card ── */
+    .cpk-ml__card {
+      background: #ffffff;
+      border: 1px solid #e9e9ef;
+      border-radius: 8px;
+      padding: 10px 12px;
+      display: flex;
+      flex-direction: column;
+      gap: 6px;
+    }
+
+    .cpk-ml__card-badges {
+      display: flex;
+      gap: 6px;
+      align-items: center;
+      flex-wrap: wrap;
+    }
+
+    /* Kind badge — color per kind */
+    .cpk-ml__kind-badge {
+      font-family: "Spline Sans Mono", monospace;
+      font-size: 9px;
+      padding: 1px 7px;
+      border-radius: 4px;
+      text-transform: uppercase;
+      font-weight: 500;
+      white-space: nowrap;
+    }
+
+    .cpk-ml__kind-badge--topical {
+      background: #eee6fe;
+      color: #57575b;
+    }
+
+    .cpk-ml__kind-badge--episodic {
+      background: #e6f4fe;
+      color: #2d5f80;
+    }
+
+    .cpk-ml__kind-badge--operational {
+      background: #e6feee;
+      color: #2d6645;
+    }
+
+    /* Scope badge */
+    .cpk-ml__scope-badge {
+      font-family: "Spline Sans Mono", monospace;
+      font-size: 9px;
+      padding: 1px 7px;
+      border-radius: 4px;
+      text-transform: uppercase;
+      font-weight: 500;
+      white-space: nowrap;
+      background: #f0f0f5;
+      color: #838389;
+    }
+
+    /* Content */
+    .cpk-ml__content {
+      font-size: 12px;
+      color: #010507;
+      line-height: 1.5;
+      word-break: break-word;
+    }
+
+    /* Footer */
+    .cpk-ml__footer {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      gap: 8px;
+      margin-top: 2px;
+    }
+
+    .cpk-ml__footer-threads {
+      font-size: 10px;
+      color: #838389;
+    }
+
+    .cpk-ml__footer-id {
+      font-family: "Spline Sans Mono", monospace;
+      font-size: 9px;
+      color: #c0c0c8;
+    }
+
+    /* ── Empty state ── */
+    .cpk-ml__empty {
+      padding: 32px 16px;
+      text-align: center;
+      color: #838389;
+      font-size: 12px;
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      gap: 8px;
+    }
+
+    .cpk-ml__empty-icon {
+      color: #c0c0c8;
+    }
+  `;
+	var ɵCpkThreadDetails = class extends CpkThreadInspector {};
+	if (!customElements.get("cpk-thread-list")) customElements.define("cpk-thread-list", CpkThreadList);
+	if (!customElements.get(THREAD_INSPECTOR_TAG)) customElements.define(THREAD_INSPECTOR_TAG, CpkThreadInspector);
+	if (!customElements.get("cpk-thread-details")) customElements.define("cpk-thread-details", ɵCpkThreadDetails);
+	if (!customElements.get("cpk-memory-list")) customElements.define("cpk-memory-list", CpkMemoryList);
+	var WebInspectorElement = class extends lit.LitElement {
+		constructor(..._args4) {
+			super(..._args4);
+			this._core = null;
+			this.coreSubscriber = null;
+			this.coreUnsubscribe = null;
+			this._memories = [];
+			this._memoriesLoading = false;
+			this._memoriesError = null;
+			this._memoriesAvailable = true;
+			this._memoriesRealtimeStatus = "connecting";
+			this._memoryUnsub = null;
+			this._memorySubscribed = false;
+			this._memoryStoreUnsupported = false;
+			this.runtimeStatus = null;
+			this.coreProperties = {};
+			this.lastCoreError = null;
+			this.agentSubscriptions = /* @__PURE__ */ new Map();
+			this.agentEvents = /* @__PURE__ */ new Map();
+			this.agentMessages = /* @__PURE__ */ new Map();
+			this.liveMessageVersion = /* @__PURE__ */ new Map();
+			this.agentStates = /* @__PURE__ */ new Map();
+			this.flattenedEvents = [];
+			this.eventCounter = 0;
+			this.contextStore = {};
+			this.pointerId = null;
+			this.dragStart = null;
+			this.dragOffset = {
+				x: 0,
+				y: 0
+			};
+			this.isDragging = false;
+			this.pointerContext = null;
+			this.isOpen = false;
+			this.draggedDuringInteraction = false;
+			this.ignoreNextButtonClick = false;
+			this.selectedMenu = "ag-ui-events";
+			this.selectedThreadId = null;
+			this.threadListWidth = 290;
+			this.threadDividerResizing = false;
+			this.threadDividerPointerId = -1;
+			this.threadDividerStartX = 0;
+			this.threadDividerStartWidth = 0;
+			this._threads = [];
+			this._threadStoreSubscriptions = /* @__PURE__ */ new Map();
+			this._threadsByAgent = /* @__PURE__ */ new Map();
+			this._threadsErrorByAgent = /* @__PURE__ */ new Map();
+			this._ownedThreadStores = /* @__PURE__ */ new Map();
+			this.contextMenuOpen = false;
+			this.dockMode = "floating";
+			this.previousBodyMargins = null;
+			this.transitionTimeoutId = null;
+			this.bodyTransitionTimeoutIds = /* @__PURE__ */ new Set();
+			this.pendingSelectedContext = null;
+			this.autoAttachCore = true;
+			this.attemptedAutoAttach = false;
+			this.cachedTools = [];
+			this.toolSignature = "";
+			this.eventFilterText = "";
+			this.eventTypeFilter = "all";
+			this.evtColWidths = [
+				100,
+				80,
+				150
+			];
+			this._evtColResize = null;
+			this.announcementHtml = null;
+			this.announcementTimestamp = null;
+			this.announcementPreviewText = null;
+			this.announcementCtaLabel = null;
+			this.hasUnseenAnnouncement = false;
+			this.announcementLoaded = false;
+			this.announcementPromise = null;
+			this.showAnnouncementPreview = true;
+			this.announcementExpanded = false;
+			this.viewedBannerTimestamps = /* @__PURE__ */ new Set();
+			this.pendingBannerViewed = null;
+			this.clickedBannerIds = /* @__PURE__ */ new Set();
+			this.viewedThreadsTelemetryStates = /* @__PURE__ */ new Set();
+			this.viewedExampleThreadIds = /* @__PURE__ */ new Set();
+			this.selectedExampleThreadIds = /* @__PURE__ */ new Set();
+			this.viewedExampleTourSteps = /* @__PURE__ */ new Set();
+			this.exampleThreadProviders = /* @__PURE__ */ new Map();
+			this.exampleTourDismissed = false;
+			this.exampleTourActive = false;
+			this.exampleTourStep = 0;
+			this.exampleTourAutoShown = false;
+			this.threadsExampleOverviewVideoShouldLoad = false;
+			this.threadsExampleOverviewVideoReady = false;
+			this.threadsExampleOverviewVideoLoadTimer = null;
+			this.threadsExampleOverviewVideoIdleCallbackId = null;
+			this.contextState = {
+				button: {
+					position: {
+						x: EDGE_MARGIN,
+						y: EDGE_MARGIN
+					},
+					size: { ...DEFAULT_BUTTON_SIZE },
+					anchor: {
+						horizontal: "right",
+						vertical: "top"
+					},
+					anchorOffset: {
+						x: EDGE_MARGIN,
+						y: EDGE_MARGIN
+					}
+				},
+				window: {
+					position: {
+						x: EDGE_MARGIN,
+						y: EDGE_MARGIN
+					},
+					size: { ...DEFAULT_WINDOW_SIZE },
+					anchor: {
+						horizontal: "right",
+						vertical: "top"
+					},
+					anchorOffset: {
+						x: EDGE_MARGIN,
+						y: EDGE_MARGIN
+					}
+				}
+			};
+			this.hasCustomPosition = {
+				button: false,
+				window: false
+			};
+			this.resizePointerId = null;
+			this.resizeStart = null;
+			this.resizeInitialSize = null;
+			this.isResizing = false;
+			this.customTabIcons = { threads: `<svg class="h-3.5 w-3.5" width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M9.04167 15C8.29167 15 7.65972 14.7431 7.14583 14.2292C6.63194 13.7153 6.375 13.0972 6.375 12.375C6.375 11.3194 6.80208 10.3646 7.65625 9.51042C8.51042 8.65625 9.57639 8.125 10.8542 7.91667C10.8125 7.41667 10.6875 7.03819 10.4792 6.78125C10.2708 6.52431 9.98611 6.39583 9.625 6.39583C9.20833 6.39583 8.75694 6.56944 8.27083 6.91667C7.78472 7.26389 7.20833 7.83333 6.54167 8.625C5.45833 9.91667 4.66319 10.7569 4.15625 11.1458C3.64931 11.5347 3.10417 11.7292 2.52083 11.7292C1.8125 11.7292 1.21528 11.4653 0.729167 10.9375C0.243056 10.4097 0 9.77083 0 9.02083C0 8.27083 0.163194 7.50347 0.489583 6.71875C0.815972 5.93403 1.36806 4.99306 2.14583 3.89583C2.40972 3.53472 2.60417 3.22917 2.72917 2.97917C2.85417 2.72917 2.91667 2.52778 2.91667 2.375C2.91667 2.27778 2.89931 2.20486 2.86458 2.15625C2.82986 2.10764 2.77778 2.08333 2.70833 2.08333C2.56944 2.08333 2.39583 2.17014 2.1875 2.34375C1.97917 2.51736 1.73611 2.78472 1.45833 3.14583L0 1.66667C0.444444 1.125 0.895833 0.711806 1.35417 0.427083C1.8125 0.142361 2.26389 0 2.70833 0C3.34722 0 3.88889 0.222222 4.33333 0.666667C4.77778 1.11111 5 1.66667 5 2.33333C5 2.73611 4.89583 3.18056 4.6875 3.66667C4.47917 4.15278 4.13194 4.73611 3.64583 5.41667C3.11806 6.16667 2.72569 6.82639 2.46875 7.39583C2.21181 7.96528 2.08333 8.46528 2.08333 8.89583C2.08333 9.13194 2.12153 9.31597 2.19792 9.44792C2.27431 9.57986 2.38194 9.64583 2.52083 9.64583C2.65972 9.64583 2.78125 9.60764 2.88542 9.53125C2.98958 9.45486 3.18056 9.27083 3.45833 8.97917C3.63889 8.78472 3.85417 8.54514 4.10417 8.26042C4.35417 7.97569 4.65972 7.625 5.02083 7.20833C5.89583 6.16667 6.6875 5.42361 7.39583 4.97917C8.10417 4.53472 8.84722 4.3125 9.625 4.3125C10.5556 4.3125 11.3194 4.625 11.9167 5.25C12.5139 5.875 12.8542 6.72917 12.9375 7.8125H15V9.89583H12.9375C12.8264 11.4514 12.4201 12.691 11.7188 13.6146C11.0174 14.5382 10.125 15 9.04167 15ZM9.08333 12.9167C9.52778 12.9167 9.90278 12.6632 10.2083 12.1562C10.5139 11.6493 10.7222 10.9444 10.8333 10.0417C10.1944 10.1944 9.63889 10.4965 9.16667 10.9479C8.69444 11.3993 8.45833 11.8472 8.45833 12.2917C8.45833 12.4861 8.51389 12.6389 8.625 12.75C8.73611 12.8611 8.88889 12.9167 9.08333 12.9167Z" fill="currentColor"/></svg>` };
+			this.handlePointerDown = (event) => {
+				var _target$setPointerCap;
+				if (this.dockMode !== "floating" && this.isOpen) return;
+				const target = event.currentTarget;
+				const context = (target === null || target === void 0 ? void 0 : target.dataset.dragContext) === "window" ? "window" : "button";
+				const eventTarget = event.target;
+				if (context === "window" && (eventTarget === null || eventTarget === void 0 ? void 0 : eventTarget.closest("button"))) return;
+				this.pointerContext = context;
+				this.measureContext(context);
+				event.preventDefault();
+				this.pointerId = event.pointerId;
+				this.dragStart = {
+					x: event.clientX,
+					y: event.clientY
+				};
+				const state = this.contextState[context];
+				this.dragOffset = {
+					x: event.clientX - state.position.x,
+					y: event.clientY - state.position.y
+				};
+				this.isDragging = false;
+				this.draggedDuringInteraction = false;
+				this.ignoreNextButtonClick = false;
+				target === null || target === void 0 || (_target$setPointerCap = target.setPointerCapture) === null || _target$setPointerCap === void 0 || _target$setPointerCap.call(target, this.pointerId);
+			};
+			this.handlePointerMove = (event) => {
+				if (this.pointerId !== event.pointerId || !this.dragStart || !this.pointerContext) return;
+				const distance = Math.hypot(event.clientX - this.dragStart.x, event.clientY - this.dragStart.y);
+				if (!this.isDragging && distance < DRAG_THRESHOLD) return;
+				event.preventDefault();
+				this.setDragging(true);
+				this.draggedDuringInteraction = true;
+				const desired = {
+					x: event.clientX - this.dragOffset.x,
+					y: event.clientY - this.dragOffset.y
+				};
+				const constrained = this.constrainToViewport(desired, this.pointerContext);
+				this.contextState[this.pointerContext].position = constrained;
+				this.updateHostTransform(this.pointerContext);
+			};
+			this.handlePointerUp = (event) => {
+				var _this$pointerContext;
+				if (this.pointerId !== event.pointerId) return;
+				const target = event.currentTarget;
+				if (target === null || target === void 0 ? void 0 : target.hasPointerCapture(this.pointerId)) target.releasePointerCapture(this.pointerId);
+				const context = (_this$pointerContext = this.pointerContext) !== null && _this$pointerContext !== void 0 ? _this$pointerContext : this.activeContext;
+				if (this.isDragging && this.pointerContext) {
+					event.preventDefault();
+					this.setDragging(false);
+					if (this.pointerContext === "window") {
+						this.updateAnchorFromPosition(this.pointerContext);
+						this.hasCustomPosition.window = true;
+						this.applyAnchorPosition(this.pointerContext);
+					} else if (this.pointerContext === "button") {
+						this.snapButtonToCorner();
+						this.hasCustomPosition.button = true;
+						if (this.draggedDuringInteraction) this.ignoreNextButtonClick = true;
+					}
+				} else if (context === "button" && !this.isOpen && !this.draggedDuringInteraction) this.openInspector();
+				this.resetPointerTracking();
+			};
+			this.handlePointerCancel = (event) => {
+				if (this.pointerId !== event.pointerId) return;
+				const target = event.currentTarget;
+				if (target === null || target === void 0 ? void 0 : target.hasPointerCapture(this.pointerId)) target.releasePointerCapture(this.pointerId);
+				this.resetPointerTracking();
+			};
+			this.handleButtonClick = (event) => {
+				if (this.isDragging) {
+					event.preventDefault();
+					return;
+				}
+				if (this.ignoreNextButtonClick) {
+					event.preventDefault();
+					this.ignoreNextButtonClick = false;
+					return;
+				}
+				if (!this.isOpen) {
+					event.preventDefault();
 					this.openInspector();
 				}
 			};
@@ -3332,6 +3933,10 @@ ${(0, lit_directives_unsafe_html_js.unsafeHTML)(highlightedJson(stateValue))}</p
 				if (target.hasPointerCapture(this.threadDividerPointerId)) target.releasePointerCapture(this.threadDividerPointerId);
 				this.threadDividerResizing = false;
 			};
+			this.handleThreadsExampleOverviewVideoLoaded = () => {
+				this.threadsExampleOverviewVideoReady = true;
+				this.requestUpdate();
+			};
 			this.handleClearEvents = () => {
 				if (this.selectedContext === "all-agents") {
 					this.agentEvents.clear();
@@ -3431,6 +4036,11 @@ ${(0, lit_directives_unsafe_html_js.unsafeHTML)(highlightedJson(stateValue))}</p
 					key: "threads",
 					label: "Threads",
 					icon: "MessageSquare"
+				},
+				{
+					key: "memories",
+					label: "Learning",
+					icon: "Brain"
 				}
 			];
 		}
@@ -3443,6 +4053,23 @@ ${(0, lit_directives_unsafe_html_js.unsafeHTML)(highlightedJson(stateValue))}</p
 		areThreadEndpointsAvailable() {
 			return this.getThreadServiceStatus() !== "unavailable";
 		}
+		getActiveThreadsState() {
+			var _this$_threadsByAgent;
+			const displayThreads = this.selectedContext === "all-agents" ? this._threads : (_this$_threadsByAgent = this._threadsByAgent.get(this.selectedContext)) !== null && _this$_threadsByAgent !== void 0 ? _this$_threadsByAgent : [];
+			let threadsErrorMessage = null;
+			if (this.selectedContext === "all-agents") {
+				var _firstError$message;
+				const firstError = this._threadsErrorByAgent.values().next().value;
+				threadsErrorMessage = (_firstError$message = firstError === null || firstError === void 0 ? void 0 : firstError.message) !== null && _firstError$message !== void 0 ? _firstError$message : null;
+			} else {
+				var _this$_threadsErrorBy, _this$_threadsErrorBy2;
+				threadsErrorMessage = (_this$_threadsErrorBy = (_this$_threadsErrorBy2 = this._threadsErrorByAgent.get(this.selectedContext)) === null || _this$_threadsErrorBy2 === void 0 ? void 0 : _this$_threadsErrorBy2.message) !== null && _this$_threadsErrorBy !== void 0 ? _this$_threadsErrorBy : null;
+			}
+			return {
+				displayThreads,
+				threadsErrorMessage
+			};
+		}
 		getThreadsTelemetryProps(extra = {}, options = {}) {
 			var _this$core4, _this$core$licenseSta, _this$core5, _this$core$runtimeMod, _this$core6, _this$core7, _this$core$telemetryD, _this$core8;
 			const distinctId = options.includeUrlAttribution && !((_this$core4 = this.core) === null || _this$core4 === void 0 ? void 0 : _this$core4.telemetryDisabled) ? getTelemetryDistinctIdForUrl() : null;
@@ -3458,12 +4085,33 @@ ${(0, lit_directives_unsafe_html_js.unsafeHTML)(highlightedJson(stateValue))}</p
 				...extra
 			};
 		}
+		getMemoriesTelemetryProps() {
+			var _this$core9;
+			const distinctId = !((_this$core9 = this.core) === null || _this$core9 === void 0 ? void 0 : _this$core9.telemetryDisabled) ? getTelemetryDistinctIdForUrl() : null;
+			return {
+				posthog_distinct_id: distinctId !== null && distinctId !== void 0 ? distinctId : void 0,
+				memory_count: this._memories.length,
+				available: this._memoriesAvailable
+			};
+		}
 		getIntelligenceSignupUrl() {
 			return this.appendRefParam(INTELLIGENCE_SIGNUP_URL, "cpk-inspector");
 		}
+		getThreadsIntelligenceSignupUrl() {
+			return this.appendRefParam(THREADS_INTELLIGENCE_SIGNIN_URL, "cpk-inspector");
+		}
 		getTalkToEngineerUrl() {
 			return this.appendRefParam(TALK_TO_ENGINEER_URL, "cpk-inspector-threads");
 		}
+		getThreadsTalkToEngineerUrl() {
+			return this.appendRefParam(TALK_TO_ENGINEER_URL, "cpk-inspector-threads");
+		}
+		getThreadsDocsUrl() {
+			return this.appendRefParam(THREADS_DOCS_URL, "cpk-inspector-threads");
+		}
+		getSelfHostedIntelligenceUrl() {
+			return this.appendRefParam(SELF_HOSTED_INTELLIGENCE_URL, "cpk-inspector-threads");
+		}
 		subscribeToThreadStore(agentId, store) {
 			if (!this.areThreadEndpointsAvailable()) return;
 			if (this._threadStoreSubscriptions.has(agentId)) return;
@@ -3492,7 +4140,7 @@ ${(0, lit_directives_unsafe_html_js.unsafeHTML)(highlightedJson(stateValue))}</p
 		}
 		autoSelectLatestThread() {
 			if (this._threads.length === 0) return;
-			if (!(this.selectedThreadId != null && this._threads.some((t) => t.id === this.selectedThreadId))) this.selectedThreadId = this._threads[0].id;
+			if (!(this.selectedThreadId != null && !this.isExampleThreadId(this.selectedThreadId) && this._threads.some((t) => t.id === this.selectedThreadId))) this.selectedThreadId = this._threads[0].id;
 		}
 		teardownThreadStoreSubscriptions() {
 			for (const unsub of this._threadStoreSubscriptions.values()) unsub();
@@ -3502,9 +4150,9 @@ ${(0, lit_directives_unsafe_html_js.unsafeHTML)(highlightedJson(stateValue))}</p
 			this._threads = [];
 		}
 		ensureOwnedThreadStore(agentId) {
-			var _this$core9, _core$intelligence;
+			var _this$core10, _core$intelligence;
 			if (this._ownedThreadStores.has(agentId)) return;
-			if ((_this$core9 = this.core) === null || _this$core9 === void 0 ? void 0 : _this$core9.getThreadStore(agentId)) return;
+			if ((_this$core10 = this.core) === null || _this$core10 === void 0 ? void 0 : _this$core10.getThreadStore(agentId)) return;
 			const core = this.core;
 			if (!(core === null || core === void 0 ? void 0 : core.runtimeUrl)) return;
 			if (!this.areThreadEndpointsAvailable()) return;
@@ -3539,18 +4187,18 @@ ${(0, lit_directives_unsafe_html_js.unsafeHTML)(highlightedJson(stateValue))}</p
 			}
 		}
 		removeOwnedThreadStore(agentId) {
-			var _this$core10;
+			var _this$core11;
 			const store = this._ownedThreadStores.get(agentId);
 			if (!store) return;
 			store.stop();
-			(_this$core10 = this.core) === null || _this$core10 === void 0 || _this$core10.unregisterThreadStore(agentId);
+			(_this$core11 = this.core) === null || _this$core11 === void 0 || _this$core11.unregisterThreadStore(agentId);
 			this._ownedThreadStores.delete(agentId);
 		}
 		teardownOwnedThreadStores() {
 			for (const [agentId, store] of this._ownedThreadStores) {
-				var _this$core11;
+				var _this$core12;
 				store.stop();
-				(_this$core11 = this.core) === null || _this$core11 === void 0 || _this$core11.unregisterThreadStore(agentId);
+				(_this$core12 = this.core) === null || _this$core12 === void 0 || _this$core12.unregisterThreadStore(agentId);
 			}
 			this._ownedThreadStores.clear();
 		}
@@ -3628,12 +4276,76 @@ ${(0, lit_directives_unsafe_html_js.unsafeHTML)(highlightedJson(stateValue))}</p
 			const threadStores = typeof core.getThreadStores === "function" ? core.getThreadStores() : {};
 			for (const [agentId, store] of Object.entries(threadStores)) this.subscribeToThreadStore(agentId, store);
 			if (core.context) this.contextStore = this.normalizeContextStore(core.context);
+			if (this.selectedMenu === "memories") this.ensureMemorySubscription();
+		}
+		/**
+		* Lazily subscribes to the singleton memory store the first time the user
+		* activates the Memories tab. This is deferred out of `attachToCore` because
+		* `core.getMemoryStore()` is what creates + starts the store and opens
+		* realtime — doing it on attach would start memory for apps that never use
+		* it. Idempotent: repeated tab activations are guarded by
+		* `_memorySubscribed`. On an older @copilotkit/core without `getMemoryStore`,
+		* records the unsupported state so the teaser can guide an SDK upgrade.
+		*/
+		ensureMemorySubscription() {
+			if (this._memorySubscribed) return;
+			const core = this._core;
+			if (!core) return;
+			if (typeof core.getMemoryStore !== "function") {
+				this._memoryStoreUnsupported = true;
+				this._memoriesAvailable = false;
+				this.requestUpdate();
+				return;
+			}
+			this._memorySubscribed = true;
+			this._memoryStoreUnsupported = false;
+			const memoryStore = core.getMemoryStore();
+			const ms = memoryStore.getState();
+			this._memories = (0, _copilotkit_core.ɵselectMemories)(ms);
+			this._memoriesLoading = (0, _copilotkit_core.ɵselectMemoriesIsLoading)(ms);
+			this._memoriesError = (0, _copilotkit_core.ɵselectMemoriesError)(ms);
+			this._memoriesAvailable = (0, _copilotkit_core.ɵselectMemoriesAvailable)(ms);
+			this._memoriesRealtimeStatus = (0, _copilotkit_core.ɵselectMemoriesRealtimeStatus)(ms);
+			const memSubs = [
+				memoryStore.select(_copilotkit_core.ɵselectMemories).subscribe((v) => {
+					this._memories = v;
+					this.requestUpdate();
+				}),
+				memoryStore.select(_copilotkit_core.ɵselectMemoriesIsLoading).subscribe((v) => {
+					this._memoriesLoading = v;
+					this.requestUpdate();
+				}),
+				memoryStore.select(_copilotkit_core.ɵselectMemoriesError).subscribe((v) => {
+					this._memoriesError = v;
+					this.requestUpdate();
+				}),
+				memoryStore.select(_copilotkit_core.ɵselectMemoriesAvailable).subscribe((v) => {
+					this._memoriesAvailable = v;
+					this.requestUpdate();
+				}),
+				memoryStore.select(_copilotkit_core.ɵselectMemoriesRealtimeStatus).subscribe((v) => {
+					this._memoriesRealtimeStatus = v;
+					this.requestUpdate();
+				})
+			];
+			this._memoryUnsub = () => memSubs.forEach((s) => s.unsubscribe());
+			this.requestUpdate();
 		}
 		detachFromCore() {
+			var _this$_memoryUnsub;
 			if (this.coreUnsubscribe) {
 				this.coreUnsubscribe();
 				this.coreUnsubscribe = null;
 			}
+			(_this$_memoryUnsub = this._memoryUnsub) === null || _this$_memoryUnsub === void 0 || _this$_memoryUnsub.call(this);
+			this._memoryUnsub = null;
+			this._memories = [];
+			this._memoriesLoading = false;
+			this._memoriesError = null;
+			this._memoriesAvailable = true;
+			this._memoriesRealtimeStatus = "connecting";
+			this._memorySubscribed = false;
+			this._memoryStoreUnsupported = false;
 			this.coreSubscriber = null;
 			this.runtimeStatus = null;
 			this.lastCoreError = null;
@@ -4098,6 +4810,7 @@ ${argsString}</pre
 				window.addEventListener("resize", this.handleResize);
 				window.addEventListener("pointerdown", this.handleGlobalPointerDown);
 				this.hydrateStateFromStorageEarly();
+				this.exampleTourDismissed = this.readThreadsExampleTourDismissed();
 				this.tryAutoAttachCore();
 				this.ensureAnnouncementLoading();
 			}
@@ -4123,6 +4836,14 @@ ${argsString}</pre
 				clearTimeout(this.transitionTimeoutId);
 				this.transitionTimeoutId = null;
 			}
+			if (this.threadsExampleOverviewVideoLoadTimer !== null) {
+				window.clearTimeout(this.threadsExampleOverviewVideoLoadTimer);
+				this.threadsExampleOverviewVideoLoadTimer = null;
+			}
+			if (this.threadsExampleOverviewVideoIdleCallbackId !== null && typeof window.cancelIdleCallback === "function") {
+				window.cancelIdleCallback(this.threadsExampleOverviewVideoIdleCallbackId);
+				this.threadsExampleOverviewVideoIdleCallbackId = null;
+			}
 			this.removeDockStyles(true);
 			this.detachFromCore();
 		}
@@ -4148,6 +4869,7 @@ ${argsString}</pre
 				y: EDGE_MARGIN
 			};
 			this.hydrateStateFromStorage();
+			if (this.selectedMenu === "memories") this.ensureMemorySubscription();
 			if (this.isOpen && this.dockMode !== "floating") this.applyDockStyles(true);
 			this.applyAnchorPosition("button");
 			if (this.dockMode === "floating") if (this.hasCustomPosition.window) this.applyAnchorPosition("window");
@@ -4318,6 +5040,17 @@ ${argsString}</pre
                   </button>
                 `;
 			})}
+              ${this.selectedMenu === "threads" ? lit.html`
+                      <a
+                        href=${this.getThreadsTalkToEngineerUrl()}
+                        target="_blank"
+                        rel="noopener"
+                        style="margin-left:auto;display:inline-flex;align-items:center;gap:6px;border-radius:6px;border:1px solid #dbdbe5;background:#ffffff;padding:7px 10px;font-size:12px;font-weight:600;color:#57575b;text-decoration:none;"
+                        @click=${this.handleTalkToEngineerClick}
+                      >
+                        Talk to an Engineer
+                      </a>
+                    ` : lit.nothing}
             </div>
           </div>
           <div class="flex flex-1 flex-col overflow-hidden">
@@ -4846,12 +5579,13 @@ ${argsString}</pre
 			if (this.selectedMenu === "frontend-tools") return this.renderToolsView();
 			if (this.selectedMenu === "agent-context") return this.renderContextView();
 			if (this.selectedMenu === "threads") return this.renderThreadsView();
+			if (this.selectedMenu === "memories") return this.renderMemoriesView();
 			if (this.selectedMenu === "settings") return this.renderSettingsPanel();
 			return lit.nothing;
 		}
 		renderSettingsPanel() {
-			var _this$core$telemetryD2, _this$core12;
-			const optedOut = (_this$core$telemetryD2 = (_this$core12 = this.core) === null || _this$core12 === void 0 ? void 0 : _this$core12.telemetryDisabled) !== null && _this$core$telemetryD2 !== void 0 ? _this$core$telemetryD2 : false;
+			var _this$core$telemetryD2, _this$core13;
+			const optedOut = (_this$core$telemetryD2 = (_this$core13 = this.core) === null || _this$core13 === void 0 ? void 0 : _this$core13.telemetryDisabled) !== null && _this$core$telemetryD2 !== void 0 ? _this$core$telemetryD2 : false;
 			return lit.html`
       <div class="flex h-full flex-col overflow-hidden">
         <div class="overflow-auto p-4">
@@ -4883,30 +5617,417 @@ ${argsString}</pre
       </div>
     `;
 		}
-		trackBannerClickedOnce(opts) {
-			var _this$core13, _this$announcementCta;
-			if ((_this$core13 = this.core) === null || _this$core13 === void 0 ? void 0 : _this$core13.telemetryDisabled) return;
-			const id = this.announcementTimestamp;
-			if (!id) return;
-			const key = `${id}:${opts.cta}`;
-			if (this.clickedBannerIds.has(key)) return;
-			this.clickedBannerIds.add(key);
-			trackBannerClicked({
-				banner_id: id,
-				cta: opts.cta,
-				cta_label: (_this$announcementCta = this.announcementCtaLabel) !== null && _this$announcementCta !== void 0 ? _this$announcementCta : void 0
-			});
-		}
-		trackThreadsViewStateOnce(state, threadCount) {
-			var _this$core14;
-			if ((_this$core14 = this.core) === null || _this$core14 === void 0 ? void 0 : _this$core14.telemetryDisabled) return;
-			const key = `${state}:${this.getThreadServiceStatus()}`;
-			if (this.viewedThreadsTelemetryStates.has(key)) return;
-			this.viewedThreadsTelemetryStates.add(key);
-			const props = this.getThreadsTelemetryProps({ thread_count: threadCount });
-			if (state === "locked") trackThreadsLockedViewed(props);
-			else if (state === "empty_enabled") trackThreadsEmptyEnabledViewed(props);
-			else trackThreadsEnabledViewed(props);
+		trackBannerClickedOnce(opts) {
+			var _this$core14, _this$announcementCta;
+			if ((_this$core14 = this.core) === null || _this$core14 === void 0 ? void 0 : _this$core14.telemetryDisabled) return;
+			const id = this.announcementTimestamp;
+			if (!id) return;
+			const key = `${id}:${opts.cta}`;
+			if (this.clickedBannerIds.has(key)) return;
+			this.clickedBannerIds.add(key);
+			trackBannerClicked({
+				banner_id: id,
+				cta: opts.cta,
+				cta_label: (_this$announcementCta = this.announcementCtaLabel) !== null && _this$announcementCta !== void 0 ? _this$announcementCta : void 0
+			});
+		}
+		trackThreadsViewStateOnce(state, threadCount) {
+			var _this$core15;
+			if ((_this$core15 = this.core) === null || _this$core15 === void 0 ? void 0 : _this$core15.telemetryDisabled) return;
+			const key = `${state}:${this.getThreadServiceStatus()}`;
+			if (this.viewedThreadsTelemetryStates.has(key)) return;
+			this.viewedThreadsTelemetryStates.add(key);
+			const props = this.getThreadsTelemetryProps({ thread_count: threadCount });
+			if (state === "locked") trackThreadsLockedViewed(props);
+			else if (state === "empty_enabled") trackThreadsEmptyEnabledViewed(props);
+			else trackThreadsEnabledViewed(props);
+		}
+		shouldRenderExampleThreads(displayThreads, threadsErrorMessage) {
+			return this.areThreadEndpointsAvailable() && !threadsErrorMessage && displayThreads.length === 0;
+		}
+		getVisibleThreads(displayThreads, threadsErrorMessage) {
+			return this.shouldRenderExampleThreads(displayThreads, threadsErrorMessage) ? THREADS_EXAMPLE_THREADS : displayThreads;
+		}
+		isExampleThreadId(threadId) {
+			return THREADS_EXAMPLE_THREADS.some((thread) => thread.id === threadId);
+		}
+		getExampleThreadProvider(threadId) {
+			const cached = this.exampleThreadProviders.get(threadId);
+			if (cached) return cached;
+			const thread = THREADS_EXAMPLE_THREADS.find((item) => item.id === threadId);
+			const details = THREADS_EXAMPLE_DETAILS[threadId];
+			const provider = {
+				getThreadMetadata: async () => thread ? {
+					id: thread.id,
+					name: thread.name,
+					agentId: thread.agentId,
+					endUserId: "example-user",
+					status: "completed",
+					updatedAt: thread.updatedAt
+				} : null,
+				getMessages: async () => {
+					var _details$messages;
+					return (_details$messages = details === null || details === void 0 ? void 0 : details.messages) !== null && _details$messages !== void 0 ? _details$messages : [];
+				},
+				getEvents: async () => {
+					var _details$events;
+					return (_details$events = details === null || details === void 0 ? void 0 : details.events) !== null && _details$events !== void 0 ? _details$events : [];
+				},
+				getState: async () => {
+					var _details$state;
+					return (_details$state = details === null || details === void 0 ? void 0 : details.state) !== null && _details$state !== void 0 ? _details$state : null;
+				}
+			};
+			this.exampleThreadProviders.set(threadId, provider);
+			return provider;
+		}
+		trackThreadsExampleViewedOnce() {
+			var _this$core16;
+			if ((_this$core16 = this.core) === null || _this$core16 === void 0 ? void 0 : _this$core16.telemetryDisabled) return;
+			for (const thread of THREADS_EXAMPLE_THREADS) {
+				if (this.viewedExampleThreadIds.has(thread.id)) continue;
+				this.viewedExampleThreadIds.add(thread.id);
+				trackThreadsExampleViewed(this.getThreadsTelemetryProps({
+					example_thread_id: thread.id,
+					thread_count: 0
+				}));
+			}
+		}
+		trackThreadsExampleSelectedOnce(threadId) {
+			var _this$core17;
+			if ((_this$core17 = this.core) === null || _this$core17 === void 0 ? void 0 : _this$core17.telemetryDisabled) return;
+			if (this.selectedExampleThreadIds.has(threadId)) return;
+			this.selectedExampleThreadIds.add(threadId);
+			trackThreadsExampleSelected(this.getThreadsTelemetryProps({
+				example_thread_id: threadId,
+				thread_count: 0
+			}));
+		}
+		getCurrentExampleTourProps() {
+			var _THREADS_EXAMPLE_TOUR, _this$selectedThreadI;
+			const step = (_THREADS_EXAMPLE_TOUR = THREADS_EXAMPLE_TOUR_STEPS[this.exampleTourStep]) !== null && _THREADS_EXAMPLE_TOUR !== void 0 ? _THREADS_EXAMPLE_TOUR : THREADS_EXAMPLE_TOUR_STEPS[0];
+			return this.getThreadsTelemetryProps({
+				example_thread_id: (_this$selectedThreadI = this.selectedThreadId) !== null && _this$selectedThreadI !== void 0 ? _this$selectedThreadI : void 0,
+				thread_count: 0,
+				tour_step: this.exampleTourStep + 1,
+				tour_tab: step === null || step === void 0 ? void 0 : step.tab
+			});
+		}
+		trackThreadsExampleTourStepViewedOnce() {
+			var _this$core18, _THREADS_EXAMPLE_TOUR2;
+			if (((_this$core18 = this.core) === null || _this$core18 === void 0 ? void 0 : _this$core18.telemetryDisabled) || !this.selectedThreadId) return;
+			if (!((_THREADS_EXAMPLE_TOUR2 = THREADS_EXAMPLE_TOUR_STEPS[this.exampleTourStep]) !== null && _THREADS_EXAMPLE_TOUR2 !== void 0 ? _THREADS_EXAMPLE_TOUR2 : THREADS_EXAMPLE_TOUR_STEPS[0])) return;
+			const key = `${this.selectedThreadId}:${this.exampleTourStep}`;
+			if (this.viewedExampleTourSteps.has(key)) return;
+			this.viewedExampleTourSteps.add(key);
+			trackThreadsExampleTourStepViewed(this.getCurrentExampleTourProps());
+		}
+		syncExampleTourTab() {
+			var _THREADS_EXAMPLE_TOUR3;
+			const step = (_THREADS_EXAMPLE_TOUR3 = THREADS_EXAMPLE_TOUR_STEPS[this.exampleTourStep]) !== null && _THREADS_EXAMPLE_TOUR3 !== void 0 ? _THREADS_EXAMPLE_TOUR3 : THREADS_EXAMPLE_TOUR_STEPS[0];
+			if (!step) return;
+			this.updateComplete.then(() => {
+				var _this$shadowRoot2, _details$selectTab;
+				const details = (_this$shadowRoot2 = this.shadowRoot) === null || _this$shadowRoot2 === void 0 ? void 0 : _this$shadowRoot2.querySelector("cpk-thread-details");
+				details === null || details === void 0 || (_details$selectTab = details.selectTab) === null || _details$selectTab === void 0 || _details$selectTab.call(details, step.tab);
+			});
+		}
+		startExampleTour(autoStarted) {
+			var _this$core20;
+			if (!this.selectedThreadId) return;
+			this.exampleTourActive = true;
+			this.exampleTourStep = 0;
+			if (autoStarted) {
+				var _this$core19;
+				this.exampleTourAutoShown = true;
+				if (!((_this$core19 = this.core) === null || _this$core19 === void 0 ? void 0 : _this$core19.telemetryDisabled)) trackThreadsExampleTourStarted(this.getCurrentExampleTourProps());
+			} else if (!((_this$core20 = this.core) === null || _this$core20 === void 0 ? void 0 : _this$core20.telemetryDisabled)) trackThreadsExampleTourReopened(this.getCurrentExampleTourProps());
+			this.trackThreadsExampleTourStepViewedOnce();
+			this.syncExampleTourTab();
+			this.requestUpdate();
+		}
+		setExampleTourStep(nextStep) {
+			this.exampleTourStep = Math.max(0, Math.min(THREADS_EXAMPLE_TOUR_STEPS.length - 1, nextStep));
+			this.trackThreadsExampleTourStepViewedOnce();
+			this.syncExampleTourTab();
+			this.requestUpdate();
+		}
+		dismissExampleTour(method) {
+			var _this$core21;
+			if (!this.selectedThreadId) return;
+			const props = {
+				...this.getCurrentExampleTourProps(),
+				dismiss_method: method
+			};
+			this.exampleTourActive = false;
+			this.exampleTourDismissed = true;
+			this.writeThreadsExampleTourDismissed();
+			if (!((_this$core21 = this.core) === null || _this$core21 === void 0 ? void 0 : _this$core21.telemetryDisabled)) if (method === "done") trackThreadsExampleTourCompleted(props);
+			else trackThreadsExampleTourDismissed(props);
+			this.requestUpdate();
+		}
+		handleThreadsThreadSelected(threadId, showingExamples) {
+			if (showingExamples && this.selectedThreadId === threadId) {
+				this.selectedThreadId = null;
+				this.exampleTourActive = false;
+				this.requestUpdate();
+				return;
+			}
+			this.selectedThreadId = threadId;
+			if (showingExamples && this.isExampleThreadId(threadId)) {
+				this.trackThreadsExampleSelectedOnce(threadId);
+				if (!this.exampleTourDismissed && !this.exampleTourAutoShown) this.startExampleTour(true);
+				else this.exampleTourActive = false;
+			} else this.exampleTourActive = false;
+			this.requestUpdate();
+		}
+		readThreadsExampleTourDismissed() {
+			if (typeof window === "undefined") return false;
+			try {
+				const raw = window.localStorage.getItem(THREADS_EXAMPLE_TOUR_STORAGE_KEY);
+				if (!raw) return false;
+				return JSON.parse(raw).dismissed === true;
+			} catch (_unused8) {
+				return false;
+			}
+		}
+		writeThreadsExampleTourDismissed() {
+			if (typeof window === "undefined") return;
+			try {
+				window.localStorage.setItem(THREADS_EXAMPLE_TOUR_STORAGE_KEY, JSON.stringify({ dismissed: true }));
+			} catch (_unused9) {}
+		}
+		scheduleThreadsExampleOverviewVideoLoad() {
+			var _window$matchMedia, _window;
+			if (this.threadsExampleOverviewVideoShouldLoad || this.threadsExampleOverviewVideoLoadTimer !== null || this.threadsExampleOverviewVideoIdleCallbackId !== null || typeof window === "undefined") return;
+			if ((_window$matchMedia = (_window = window).matchMedia) === null || _window$matchMedia === void 0 ? void 0 : _window$matchMedia.call(_window, "(prefers-reduced-motion: reduce)").matches) return;
+			const loadVideo = () => {
+				this.threadsExampleOverviewVideoLoadTimer = null;
+				this.threadsExampleOverviewVideoIdleCallbackId = null;
+				this.threadsExampleOverviewVideoShouldLoad = true;
+				this.requestUpdate();
+			};
+			if (typeof window.requestIdleCallback === "function") {
+				this.threadsExampleOverviewVideoIdleCallbackId = window.requestIdleCallback(loadVideo, { timeout: 1200 });
+				return;
+			}
+			this.threadsExampleOverviewVideoLoadTimer = window.setTimeout(loadVideo, 450);
+		}
+		renderThreadsExampleOverviewVideo() {
+			this.scheduleThreadsExampleOverviewVideoLoad();
+			return lit.html`
+      <div class="cpk-threads-overview-video-frame" aria-hidden="true">
+        ${this.threadsExampleOverviewVideoShouldLoad ? lit.html`
+                <video
+                  class="cpk-threads-overview-video"
+                  data-ready=${this.threadsExampleOverviewVideoReady}
+                  src=${THREADS_EXAMPLE_OVERVIEW_VIDEO_URL}
+                  autoplay
+                  loop
+                  muted
+                  playsinline
+                  preload="metadata"
+                  @loadeddata=${this.handleThreadsExampleOverviewVideoLoaded}
+                ></video>
+              ` : lit.nothing}
+      </div>
+    `;
+		}
+		renderThreadsExampleOverview() {
+			return lit.html`
+      <div
+        style="
+          flex: 1;
+          min-width: 0;
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          padding: 32px;
+          background: #f7f7f9;
+        "
+      >
+        <div style="max-width: 440px; color: #57575b;">
+          <h2
+            style="
+              margin: 0 0 10px;
+              font-size: 20px;
+              line-height: 1.25;
+              font-weight: 600;
+              color: #010507;
+            "
+          >
+            Threads are persistent, inspectable conversations
+          </h2>
+          ${this.renderThreadsExampleOverviewVideo()}
+          <p
+            style="
+              margin: 0 0 16px;
+              font-size: 13px;
+              line-height: 1.55;
+              color: #57575b;
+            "
+          >
+            Take a tour with the example threads in the sidebar. Then, start
+            chatting in your app to create the first real thread.
+          </p>
+          <div style="display:flex;flex-wrap:wrap;gap:8px;">
+            <a
+              href=${this.getThreadsDocsUrl()}
+              target="_blank"
+              rel="noopener"
+              style="
+                display: inline-flex;
+                align-items: center;
+                justify-content: center;
+                gap: 6px;
+                min-height: 34px;
+                border-radius: 6px;
+                background: #010507;
+                padding: 8px 12px;
+                font-size: 12px;
+                font-weight: 600;
+                color: #ffffff;
+                text-decoration: none;
+              "
+            >
+              Learn how Threads work
+            </a>
+            <a
+              href=${this.getSelfHostedIntelligenceUrl()}
+              target="_blank"
+              rel="noopener"
+              style="
+                display: inline-flex;
+                align-items: center;
+                justify-content: center;
+                gap: 6px;
+                min-height: 34px;
+                border-radius: 6px;
+                border: 1px solid #dbdbe5;
+                background: #ffffff;
+                padding: 8px 12px;
+                font-size: 12px;
+                font-weight: 600;
+                color: #010507;
+                text-decoration: none;
+              "
+            >
+              Explore self-hosted Intelligence
+            </a>
+          </div>
+        </div>
+      </div>
+    `;
+		}
+		renderThreadsExampleTour() {
+			var _THREADS_EXAMPLE_TOUR4;
+			if (!this.selectedThreadId || !this.isExampleThreadId(this.selectedThreadId)) return lit.nothing;
+			if (!this.exampleTourActive) return lit.html`
+        <button
+          type="button"
+          style="
+            position: absolute;
+            right: 16px;
+            bottom: 16px;
+            z-index: 2;
+            border: 1px solid #dbdbe5;
+            border-radius: 6px;
+            background: #ffffff;
+            padding: 7px 10px;
+            color: #57575b;
+            font-size: 12px;
+            font-weight: 600;
+            cursor: pointer;
+            box-shadow: 0 8px 18px rgba(1, 5, 7, 0.08);
+          "
+          @click=${() => this.startExampleTour(false)}
+        >
+          Show tour
+        </button>
+      `;
+			const step = (_THREADS_EXAMPLE_TOUR4 = THREADS_EXAMPLE_TOUR_STEPS[this.exampleTourStep]) !== null && _THREADS_EXAMPLE_TOUR4 !== void 0 ? _THREADS_EXAMPLE_TOUR4 : THREADS_EXAMPLE_TOUR_STEPS[0];
+			const isFirst = this.exampleTourStep === 0;
+			const isLast = this.exampleTourStep === THREADS_EXAMPLE_TOUR_STEPS.length - 1;
+			return lit.html`
+      <div
+        role="dialog"
+        aria-label="Example thread tour"
+        style="
+          position: absolute;
+          right: 16px;
+          bottom: 16px;
+          z-index: 3;
+          width: min(340px, calc(100% - 32px));
+          border: 1px solid #dbdbe5;
+          border-radius: 8px;
+          background: #ffffff;
+          padding: 14px;
+          box-shadow: 0 16px 36px rgba(1, 5, 7, 0.14);
+          color: #57575b;
+        "
+      >
+        <div
+          style="
+            margin-bottom: 8px;
+            font-family: 'Spline Sans Mono', monospace;
+            font-size: 10px;
+            font-weight: 600;
+            color: #189370;
+            text-transform: uppercase;
+          "
+        >
+          ${this.exampleTourStep + 1}/${THREADS_EXAMPLE_TOUR_STEPS.length}
+          ${step.label}
+        </div>
+        <div
+          style="
+            margin-bottom: 6px;
+            font-size: 14px;
+            line-height: 1.35;
+            font-weight: 600;
+            color: #010507;
+          "
+        >
+          ${step.title}
+        </div>
+        <div style="font-size: 12px; line-height: 1.5; color: #57575b;">
+          ${step.body}
+        </div>
+        <div
+          style="
+            display: flex;
+            justify-content: space-between;
+            gap: 8px;
+            margin-top: 14px;
+          "
+        >
+          <button
+            type="button"
+            style="border:0;background:transparent;color:#838389;font-size:12px;font-weight:600;cursor:pointer;padding:7px 0;"
+            @click=${() => this.dismissExampleTour("skip")}
+          >
+            Skip
+          </button>
+          <div style="display:flex;gap:8px;">
+            <button
+              type="button"
+              style="border:1px solid #dbdbe5;border-radius:6px;background:#ffffff;color:#57575b;font-size:12px;font-weight:600;cursor:pointer;padding:7px 10px;"
+              ?disabled=${isFirst}
+              @click=${() => this.setExampleTourStep(this.exampleTourStep - 1)}
+            >
+              Back
+            </button>
+            <button
+              type="button"
+              style="border:1px solid #010507;border-radius:6px;background:#010507;color:#ffffff;font-size:12px;font-weight:600;cursor:pointer;padding:7px 10px;"
+              @click=${() => isLast ? this.dismissExampleTour("done") : this.setExampleTourStep(this.exampleTourStep + 1)}
+            >
+              ${isLast ? "Done" : "Next"}
+            </button>
+          </div>
+        </div>
+      </div>
+    `;
 		}
 		renderThreadsLockedBackgroundMockup() {
 			return lit.html`
@@ -5153,7 +6274,7 @@ ${argsString}</pre
             "
           >
             <a
-              href=${this.getTalkToEngineerUrl()}
+              href=${this.getThreadsIntelligenceSignupUrl()}
               target="_blank"
               rel="noopener"
               style="
@@ -5163,75 +6284,340 @@ ${argsString}</pre
                 justify-content: center;
                 gap: 6px;
                 border-radius: 6px;
-                background: #010507;
+                border: 1px solid #dbdbe5;
+                background: #ffffff;
                 padding: 8px 12px;
                 font-size: 12px;
                 font-weight: 600;
-                color: #ffffff;
+                color: #57575b;
                 text-decoration: none;
               "
-              @click=${this.handleThreadsTalkToEngineerClick}
+              @click=${this.handleThreadsIntelligenceSignupClick}
             >
-              Talk to an Engineer
+              Sign up for Intelligence
             </a>
-            <a
-              href=${this.getIntelligenceSignupUrl()}
-              target="_blank"
-              rel="noopener"
+          </div>
+        </div>
+      </div>
+    `;
+		}
+		/**
+		* Renders the realtime-connection indicator in the memory-store header.
+		* Only `"connected"` shows the live (green-dot) state; `"connecting"` shows a
+		* muted amber "reconnecting" and `"unavailable"` a muted grey "offline", so
+		* the indicator never claims "live" over a frozen snapshot once the realtime
+		* socket has permanently given up.
+		*/
+		renderMemoryRealtimeIndicator() {
+			const status = this._memoriesRealtimeStatus;
+			const connected = status === "connected";
+			return lit.html`
+      <span
+        style="
+          display: inline-flex;
+          align-items: center;
+          gap: 4px;
+          font-size: 10px;
+          font-weight: 500;
+          color: ${connected ? "#57575b" : "#838389"};
+        "
+      >
+        <span
+          style="
+            display: inline-block;
+            width: 6px;
+            height: 6px;
+            border-radius: 50%;
+            background: ${connected ? "#22c55e" : status === "connecting" ? "#f59e0b" : "#9ca3af"};
+          "
+        ></span>
+        ${status === "connected" ? "live" : status === "connecting" ? "reconnecting" : "offline"}
+      </span>
+    `;
+		}
+		renderMemoriesView() {
+			var _this$core22;
+			if (!((_this$core22 = this.core) === null || _this$core22 === void 0 ? void 0 : _this$core22.intelligence) || !this._memoriesAvailable) return lit.html`
+        <div
+          style="
+            position: relative;
+            height: 100%;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            padding: 32px;
+            overflow: hidden;
+            background: #ffffff;
+          "
+        >
+          ${this.renderThreadsLockedBackgroundMockup()}
+          <div
+            aria-hidden="true"
+            style="
+              position: absolute;
+              inset: 0;
+              pointer-events: none;
+              background:
+                radial-gradient(circle at center, rgba(255,255,255,0.9) 0, rgba(255,255,255,0.78) 24%, rgba(255,255,255,0.34) 48%, rgba(255,255,255,0.56) 100%);
+            "
+          ></div>
+          <div
+            style="
+              position: relative;
+              z-index: 1;
+              max-width: 440px;
+              text-align: center;
+              color: #57575b;
+            "
+          >
+            <div
+              aria-hidden="true"
               style="
-                display: inline-flex;
-                min-height: 34px;
-                align-items: center;
+                margin: 0 auto 18px;
+                display: flex;
                 justify-content: center;
-                gap: 6px;
-                border-radius: 6px;
-                border: 1px solid #dbdbe5;
-                background: #ffffff;
-                padding: 8px 12px;
-                font-size: 12px;
+              "
+            >
+              <div
+                style="
+                  display: flex;
+                  height: 44px;
+                  width: 44px;
+                  align-items: center;
+                  justify-content: center;
+                  border: 1px solid #dfd6fb;
+                  border-radius: 8px;
+                  background: #eee6fe;
+                  color: #57575b;
+                  box-shadow: 0 8px 18px rgba(87, 87, 91, 0.14);
+                "
+              >
+                ${this.renderIcon("Lock")}
+              </div>
+            </div>
+            <h2
+              style="
+                margin: 0 0 8px;
+                font-size: 16px;
+                line-height: 1.35;
                 font-weight: 600;
+                color: #010507;
+              "
+            >
+              Long-term memory
+            </h2>
+            <p
+              style="
+                margin: 0 auto 18px;
+                max-width: 380px;
+                font-size: 13px;
+                line-height: 1.55;
                 color: #57575b;
-                text-decoration: none;
               "
-              @click=${this.handleThreadsIntelligenceSignupClick}
             >
-              Sign up for Intelligence
-            </a>
+              ${this._memoryStoreUnsupported ? "Long-term memory isn't available in this version of the @copilotkit SDK. Upgrade @copilotkit/core (and @copilotkit/react) to a version that supports memory." : "Long-term memory isn't enabled on this deployment."}
+            </p>
+            <div
+              style="
+                display: flex;
+                flex-wrap: wrap;
+                justify-content: center;
+                gap: 8px;
+              "
+            >
+              <a
+                href=${this.getTalkToEngineerUrl()}
+                target="_blank"
+                rel="noopener"
+                style="
+                  display: inline-flex;
+                  min-height: 34px;
+                  align-items: center;
+                  justify-content: center;
+                  gap: 6px;
+                  border-radius: 6px;
+                  background: #010507;
+                  padding: 8px 12px;
+                  font-size: 12px;
+                  font-weight: 600;
+                  color: #ffffff;
+                  text-decoration: none;
+                "
+                @click=${this.handleThreadsTalkToEngineerClick}
+              >
+                Talk to an Engineer
+              </a>
+              <a
+                href=${this.getIntelligenceSignupUrl()}
+                target="_blank"
+                rel="noopener"
+                style="
+                  display: inline-flex;
+                  min-height: 34px;
+                  align-items: center;
+                  justify-content: center;
+                  gap: 6px;
+                  border-radius: 6px;
+                  border: 1px solid #dbdbe5;
+                  background: #ffffff;
+                  padding: 8px 12px;
+                  font-size: 12px;
+                  font-weight: 600;
+                  color: #57575b;
+                  text-decoration: none;
+                "
+                @click=${this.handleThreadsIntelligenceSignupClick}
+              >
+                Sign up for Intelligence
+              </a>
+            </div>
+          </div>
+        </div>
+      `;
+			if (this._memoriesError && this._memories.length === 0) return lit.html`
+        <div
+          style="
+            display: flex;
+            height: 100%;
+            flex-direction: column;
+            align-items: center;
+            justify-content: center;
+            gap: 8px;
+            color: #838389;
+          "
+        >
+          <svg
+            width="24"
+            height="24"
+            viewBox="0 0 24 24"
+            fill="none"
+            stroke="#c0333a"
+            stroke-width="1.5"
+            stroke-linecap="round"
+            stroke-linejoin="round"
+          >
+            <circle cx="12" cy="12" r="10" />
+            <line x1="12" y1="8" x2="12" y2="12" />
+            <line x1="12" y1="16" x2="12.01" y2="16" />
+          </svg>
+          <span style="font-size: 13px; color: #c0333a;">
+            Failed to load memories
+          </span>
+          <span
+            style="
+              max-width: 320px;
+              text-align: center;
+              font-size: 11px;
+              line-height: 1.5;
+              color: #c0333a;
+            "
+          >
+            ${this._memoriesError.message}
+          </span>
+        </div>
+      `;
+			if (this._memoriesLoading && this._memories.length === 0) return lit.html`
+        <div
+          style="
+            display: flex;
+            height: 100%;
+            flex-direction: column;
+            align-items: center;
+            justify-content: center;
+            gap: 8px;
+            color: #838389;
+          "
+        >
+          <svg
+            width="24"
+            height="24"
+            viewBox="0 0 24 24"
+            fill="none"
+            stroke="#c0c0c8"
+            stroke-width="1.5"
+            stroke-linecap="round"
+            stroke-linejoin="round"
+          >
+            <path d="M21 12a9 9 0 1 1-6.219-8.56" />
+          </svg>
+          <span style="font-size: 13px">Loading memories…</span>
+        </div>
+      `;
+			return lit.html`
+      <div style="display:flex;height:100%;overflow:hidden;flex-direction:column;">
+        <div class="cpk-section-header" style="display:flex;align-items:center;justify-content:space-between;">
+          <h4>Learning</h4>
+          <div style="display:flex;align-items:center;gap:6px;">
+            ${this.renderMemoryRealtimeIndicator()}
+            <span
+              style="
+                font-size: 11px;
+                font-weight: 500;
+                color: #57575b;
+                background: rgba(0,0,0,0.07);
+                border-radius: 9999px;
+                padding: 1px 7px;
+              "
+            >
+              ${this._memories.length}
+            </span>
           </div>
         </div>
+        ${this._memoriesError ? lit.html`
+                <div
+                  role="alert"
+                  style="
+                    display: flex;
+                    align-items: flex-start;
+                    gap: 8px;
+                    flex-shrink: 0;
+                    border-bottom: 1px solid #f1c7c9;
+                    background: #fdf3f3;
+                    padding: 8px 12px;
+                    color: #c0333a;
+                    font-size: 12px;
+                    line-height: 1.45;
+                  "
+                >
+                  <svg
+                    width="16"
+                    height="16"
+                    viewBox="0 0 24 24"
+                    fill="none"
+                    stroke="#c0333a"
+                    stroke-width="1.5"
+                    stroke-linecap="round"
+                    stroke-linejoin="round"
+                    style="flex-shrink:0;margin-top:1px;"
+                  >
+                    <circle cx="12" cy="12" r="10" />
+                    <line x1="12" y1="8" x2="12" y2="12" />
+                    <line x1="12" y1="16" x2="12.01" y2="16" />
+                  </svg>
+                  <span>Action failed: ${this._memoriesError.message}</span>
+                </div>
+              ` : lit.nothing}
+        <div style="flex:1;min-height:0;overflow:hidden;">
+          <cpk-memory-list
+            style="height:100%;"
+            .memories=${this._memories}
+          ></cpk-memory-list>
+        </div>
       </div>
     `;
 		}
 		renderThreadsView() {
-			var _this$_threadsByAgent, _displayThreads$find, _this$_core$runtimeUr, _this$_core2, _this$_core$headers, _this$_core3, _this$_core4, _this$liveMessageVers2, _this$agentEvents$get6;
+			var _visibleThreads$find, _this$_core$runtimeUr, _this$_core2, _this$_core$headers, _this$_core3, _this$_core4, _this$liveMessageVers2, _this$agentEvents$get6;
 			if (!this.areThreadEndpointsAvailable()) return this.renderThreadsLockedView();
-			const displayThreads = this.selectedContext === "all-agents" ? this._threads : (_this$_threadsByAgent = this._threadsByAgent.get(this.selectedContext)) !== null && _this$_threadsByAgent !== void 0 ? _this$_threadsByAgent : [];
-			let threadsErrorMessage = null;
-			if (this.selectedContext === "all-agents") {
-				var _firstError$message;
-				const firstError = this._threadsErrorByAgent.values().next().value;
-				threadsErrorMessage = (_firstError$message = firstError === null || firstError === void 0 ? void 0 : firstError.message) !== null && _firstError$message !== void 0 ? _firstError$message : null;
-			} else {
-				var _this$_threadsErrorBy, _this$_threadsErrorBy2;
-				threadsErrorMessage = (_this$_threadsErrorBy = (_this$_threadsErrorBy2 = this._threadsErrorByAgent.get(this.selectedContext)) === null || _this$_threadsErrorBy2 === void 0 ? void 0 : _this$_threadsErrorBy2.message) !== null && _this$_threadsErrorBy !== void 0 ? _this$_threadsErrorBy : null;
-			}
-			const selectedThread = this.selectedThreadId != null ? (_displayThreads$find = displayThreads.find((t) => t.id === this.selectedThreadId)) !== null && _displayThreads$find !== void 0 ? _displayThreads$find : null : null;
+			const { displayThreads, threadsErrorMessage } = this.getActiveThreadsState();
+			const showingExamples = this.shouldRenderExampleThreads(displayThreads, threadsErrorMessage);
+			const visibleThreads = this.getVisibleThreads(displayThreads, threadsErrorMessage);
+			if (showingExamples) this.trackThreadsExampleViewedOnce();
+			const selectedThread = this.selectedThreadId != null ? (_visibleThreads$find = visibleThreads.find((t) => t.id === this.selectedThreadId)) !== null && _visibleThreads$find !== void 0 ? _visibleThreads$find : null : null;
+			const selectedThreadIsExample = this.isExampleThreadId(selectedThread === null || selectedThread === void 0 ? void 0 : selectedThread.id);
 			if (!threadsErrorMessage) this.trackThreadsViewStateOnce(displayThreads.length === 0 ? "empty_enabled" : "enabled", displayThreads.length);
 			return lit.html`
       <div style="display:flex;height:100%;overflow:hidden;flex-direction:column;">
-        <div
-          style="display:flex;align-items:center;justify-content:flex-end;border-bottom:1px solid #DBDBE5;background:#ffffff;padding:8px 12px;flex-shrink:0;"
-        >
-          <a
-            href=${this.getTalkToEngineerUrl()}
-            target="_blank"
-            rel="noopener"
-            style="display:inline-flex;align-items:center;gap:6px;border-radius:6px;border:1px solid #dbdbe5;background:#ffffff;padding:7px 10px;font-size:12px;font-weight:600;color:#57575b;text-decoration:none;"
-            @click=${this.handleTalkToEngineerClick}
-          >
-            Talk to an Engineer
-          </a>
-        </div>
         <div style="display:flex;min-height:0;flex:1;overflow:hidden;">
           <!-- Left sidebar: thread list -->
           <div
@@ -5239,12 +6625,11 @@ ${argsString}</pre
           >
             <cpk-thread-list
               style="height:100%;"
-              .threads=${displayThreads}
+              .threads=${visibleThreads}
               .selectedThreadId=${this.selectedThreadId}
               .errorMessage=${threadsErrorMessage}
               @threadSelected=${(e) => {
-				this.selectedThreadId = e.detail;
-				this.requestUpdate();
+				this.handleThreadsThreadSelected(e.detail, showingExamples);
 			}}
             ></cpk-thread-list>
           </div>
@@ -5259,18 +6644,20 @@ ${argsString}</pre
           ></div>
 
           <!-- Center + right: thread details or empty state -->
-          <div style="flex:1;min-width:0;overflow:hidden;display:flex;">
+          <div style="flex:1;min-width:0;overflow:hidden;display:flex;position:relative;">
             ${selectedThread ? lit.html`<cpk-thread-details
                     style="flex:1;min-width:0;"
                     .threadId=${selectedThread.id}
                     .thread=${selectedThread}
+                    .provider=${selectedThreadIsExample ? this.getExampleThreadProvider(selectedThread.id) : null}
                     .runtimeUrl=${(_this$_core$runtimeUr = (_this$_core2 = this._core) === null || _this$_core2 === void 0 ? void 0 : _this$_core2.runtimeUrl) !== null && _this$_core$runtimeUr !== void 0 ? _this$_core$runtimeUr : ""}
                     .headers=${(_this$_core$headers = (_this$_core3 = this._core) === null || _this$_core3 === void 0 ? void 0 : _this$_core3.headers) !== null && _this$_core$headers !== void 0 ? _this$_core$headers : {}}
-                    .threadInspectionAvailable=${((_this$_core4 = this._core) === null || _this$_core4 === void 0 || (_this$_core4 = _this$_core4.threadEndpoints) === null || _this$_core4 === void 0 ? void 0 : _this$_core4.inspect) !== false}
+                    .threadInspectionAvailable=${selectedThreadIsExample || ((_this$_core4 = this._core) === null || _this$_core4 === void 0 || (_this$_core4 = _this$_core4.threadEndpoints) === null || _this$_core4 === void 0 ? void 0 : _this$_core4.inspect) !== false}
                     .liveMessageVersion=${(_this$liveMessageVers2 = this.liveMessageVersion.get(selectedThread.id)) !== null && _this$liveMessageVers2 !== void 0 ? _this$liveMessageVers2 : 0}
                     .agentStateInput=${this.getLatestStateForAgent(selectedThread.agentId)}
                     .agentEventsInput=${(_this$agentEvents$get6 = this.agentEvents.get(selectedThread.agentId)) !== null && _this$agentEvents$get6 !== void 0 ? _this$agentEvents$get6 : []}
-                  ></cpk-thread-details>` : lit.html`
+                  ></cpk-thread-details>
+                  ${selectedThreadIsExample ? this.renderThreadsExampleTour() : lit.nothing}` : showingExamples ? this.renderThreadsExampleOverview() : lit.html`
                     <div
                       style="
                         flex: 1;
@@ -5830,13 +7217,18 @@ ${prettyEvent}</pre
 				if (this.contextOptions.filter((opt) => opt.key !== "all-agents").length > 1) this.selectedContext = "all-agents";
 			}
 			if (key === "threads") {
-				var _this$core15;
-				if (previousMenu !== "threads" && !((_this$core15 = this.core) === null || _this$core15 === void 0 ? void 0 : _this$core15.telemetryDisabled)) trackThreadsTabClicked(this.getThreadsTelemetryProps());
+				var _this$core23;
+				if (previousMenu !== "threads" && !((_this$core23 = this.core) === null || _this$core23 === void 0 ? void 0 : _this$core23.telemetryDisabled)) trackThreadsTabClicked(this.getThreadsTelemetryProps());
 				this.autoSelectLatestThread();
 			}
+			if (key === "memories") {
+				var _this$core24;
+				this.ensureMemorySubscription();
+				if (previousMenu !== "memories" && !((_this$core24 = this.core) === null || _this$core24 === void 0 ? void 0 : _this$core24.telemetryDisabled)) trackMemoriesTabClicked(this.getMemoriesTelemetryProps());
+			}
 			if (key === "ag-ui-events" || key === "agents") requestAnimationFrame(() => {
-				var _this$shadowRoot2;
-				const scroller = (_this$shadowRoot2 = this.shadowRoot) === null || _this$shadowRoot2 === void 0 ? void 0 : _this$shadowRoot2.getElementById("cpk-main-scroll");
+				var _this$shadowRoot3;
+				const scroller = (_this$shadowRoot3 = this.shadowRoot) === null || _this$shadowRoot3 === void 0 ? void 0 : _this$shadowRoot3.getElementById("cpk-main-scroll");
 				if (scroller) scroller.scrollTop = 0;
 			});
 			this.contextMenuOpen = false;
@@ -6308,7 +7700,7 @@ ${prettyEvent}</pre
 			if (typeof value === "function") return value.toString();
 			try {
 				return JSON.stringify(value, null, 2);
-			} catch (_unused8) {
+			} catch (_unused10) {
 				return String(value);
 			}
 		}
@@ -6403,8 +7795,8 @@ ${prettyEvent}</pre
     </div>`;
 		}
 		flushPendingBannerViewed() {
-			var _this$core16;
-			if (!this.pendingBannerViewed || ((_this$core16 = this.core) === null || _this$core16 === void 0 ? void 0 : _this$core16.telemetryDisabled)) {
+			var _this$core25;
+			if (!this.pendingBannerViewed || ((_this$core25 = this.core) === null || _this$core25 === void 0 ? void 0 : _this$core25.telemetryDisabled)) {
 				this.pendingBannerViewed = null;
 				return;
 			}
@@ -6492,7 +7884,7 @@ ${prettyEvent}</pre
 			try {
 				const url = new URL(href, typeof window !== "undefined" ? window.location.href : "https://copilotkit.ai");
 				return url.protocol === "http:" || url.protocol === "https:" || url.protocol === "mailto:";
-			} catch (_unused9) {
+			} catch (_unused11) {
 				return false;
 			}
 		}
@@ -6512,17 +7904,17 @@ ${prettyEvent}</pre
 		}
 		appendRefParam(href, ref = "cpk-inspector") {
 			try {
-				var _this$core17;
+				var _this$core26;
 				const isRootRelative = href.startsWith("/") && !href.startsWith("//");
 				const url = new URL(href, typeof window !== "undefined" ? window.location.href : "https://copilotkit.ai");
 				if (!url.searchParams.has("ref")) url.searchParams.append("ref", ref);
-				if (!url.searchParams.has("posthog_distinct_id") && !((_this$core17 = this.core) === null || _this$core17 === void 0 ? void 0 : _this$core17.telemetryDisabled) && this.isCopilotKitDestination(url)) {
+				if (!url.searchParams.has("posthog_distinct_id") && !((_this$core26 = this.core) === null || _this$core26 === void 0 ? void 0 : _this$core26.telemetryDisabled) && this.isCopilotKitDestination(url)) {
 					const distinctId = getTelemetryDistinctIdForUrl();
 					if (distinctId) url.searchParams.append("posthog_distinct_id", distinctId);
 				}
 				if (isRootRelative) return `${url.pathname}${url.search}${url.hash}`;
 				return url.toString();
-			} catch (_unused10) {
+			} catch (_unused12) {
 				return href;
 			}
 		}
@@ -6541,7 +7933,7 @@ ${prettyEvent}</pre
 				const parsed = JSON.parse(raw);
 				if (parsed && typeof parsed.timestamp === "string") return parsed.timestamp;
 				return null;
-			} catch (_unused11) {}
+			} catch (_unused13) {}
 			return null;
 		}
 		persistAnnouncementTimestamp(timestamp) {
@@ -6549,7 +7941,7 @@ ${prettyEvent}</pre
 			try {
 				const payload = JSON.stringify({ timestamp });
 				window.localStorage.setItem(ANNOUNCEMENT_STORAGE_KEY, payload);
-			} catch (_unused12) {}
+			} catch (_unused14) {}
 		}
 		markAnnouncementSeen() {
 			this.hasUnseenAnnouncement = false;
@@ -7129,6 +8521,35 @@ ${prettyEvent}</pre
       .cpk-tab-active {
         cursor: pointer;
       }
+      .cpk-threads-overview-video-frame {
+        position: relative;
+        display: block;
+        width: 100%;
+        max-width: 440px;
+        aspect-ratio: 16 / 9;
+        margin: 0 0 14px;
+        overflow: hidden;
+        border: 1px solid #dbdbe5;
+        border-radius: 8px;
+        background:
+          linear-gradient(
+            135deg,
+            rgba(190, 194, 255, 0.18),
+            rgba(133, 236, 206, 0.12)
+          ),
+          #ffffff;
+        box-shadow: 0 8px 20px rgba(1, 5, 7, 0.08);
+      }
+      .cpk-threads-overview-video {
+        width: 100%;
+        height: 100%;
+        object-fit: cover;
+        opacity: 0;
+        transition: opacity 220ms ease;
+      }
+      .cpk-threads-overview-video[data-ready="true"] {
+        opacity: 1;
+      }
 
       /* ── Header control buttons (dock, close) — first row only ───── */
       .drag-handle > div:first-child button {