From 3a0bd937805b80cb651e736b804db02df0dc4408 Mon Sep 17 00:00:00 2001 From: "exe.dev user" Date: Fri, 18 Sep 2026 21:51:44 +0000 Subject: [PATCH] Improve trace presentation with safe formatting and thinking indicators --- packages/app/public/styles.css | 2 +- packages/app/src/tailwind.css | 47 +++++++++++++++ packages/app/src/trace-presentation.ts | 49 ++++++++++++++++ packages/app/src/ui.ts | 10 ++-- packages/app/test/trace-presentation.test.ts | 61 ++++++++++++++++++++ packages/app/test/ui.test.ts | 2 +- 6 files changed, 164 insertions(+), 7 deletions(-) create mode 100644 packages/app/src/trace-presentation.ts create mode 100644 packages/app/test/trace-presentation.test.ts diff --git a/packages/app/public/styles.css b/packages/app/public/styles.css index 0f8df80..e3e3a04 100644 --- a/packages/app/public/styles.css +++ b/packages/app/public/styles.css @@ -1,2 +1,2 @@ /*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */ -@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-space-y-reverse:0;--tw-divide-y-reverse:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking: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-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-translate-x:0;--tw-translate-y:0;--tw-translate-z:0}}}@layer theme{:root,:host{--font-sans:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, 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-red-50:oklch(97.1% .013 17.38);--color-red-100:oklch(93.6% .032 17.717);--color-red-200:oklch(88.5% .062 18.334);--color-red-300:oklch(80.8% .114 19.571);--color-red-500:oklch(63.7% .237 25.331);--color-red-700:oklch(50.5% .213 27.518);--color-red-800:oklch(44.4% .177 26.899);--color-red-900:oklch(39.6% .141 25.723);--color-red-950:oklch(25.8% .092 26.042);--color-orange-100:oklch(95.4% .038 75.164);--color-orange-200:oklch(90.1% .076 70.697);--color-orange-800:oklch(47% .157 37.304);--color-orange-950:oklch(26.6% .079 36.259);--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-300:oklch(87.9% .169 91.605);--color-amber-400:oklch(82.8% .189 84.429);--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-amber-950:oklch(27.9% .077 45.635);--color-green-100:oklch(96.2% .044 156.743);--color-green-200:oklch(92.5% .084 155.995);--color-green-800:oklch(44.8% .119 151.328);--color-green-950:oklch(26.6% .065 152.934);--color-blue-100:oklch(93.2% .032 255.585);--color-blue-200:oklch(88.2% .059 254.128);--color-blue-500:oklch(62.3% .214 259.815);--color-blue-800:oklch(42.4% .199 265.638);--color-blue-900:oklch(37.9% .146 265.522);--color-blue-950:oklch(28.2% .091 267.935);--color-violet-100:oklch(94.3% .029 294.588);--color-violet-200:oklch(89.4% .057 293.283);--color-violet-800:oklch(43.2% .232 292.759);--color-violet-950:oklch(28.3% .141 291.089);--color-slate-100:#f5f1e8;--color-slate-200:#e7e1d4;--color-slate-300:#cec5b4;--color-slate-400:#9b9282;--color-slate-500:#71695e;--color-slate-600:#575047;--color-slate-700:#403b34;--color-slate-800:#2c2924;--color-slate-900:#201e1a;--color-slate-950:#151410;--color-stone-50:#fcfbf6;--color-stone-100:#f6f3e9;--color-stone-200:#e6e0d1;--color-stone-300:#d4cbb9;--color-white:#fff;--spacing:.25rem;--container-xs:20rem;--container-md:28rem;--container-2xl:42rem;--container-3xl:48rem;--container-4xl:56rem;--container-5xl:64rem;--container-6xl:72rem;--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);--text-xl:1.25rem;--text-xl--line-height:calc(1.75 / 1.25);--text-2xl:1.5rem;--text-2xl--line-height:calc(2 / 1.5);--text-3xl:1.875rem;--text-3xl--line-height:calc(2.25 / 1.875);--text-4xl:2.25rem;--text-4xl--line-height:calc(2.5 / 2.25);--text-5xl:3rem;--text-5xl--line-height:1;--text-7xl:4.5rem;--text-7xl--line-height:1;--font-weight-normal:400;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--tracking-tight:-.025em;--tracking-wide:.025em;--radius-md:.375rem;--radius-lg:.5rem;--radius-xl:.75rem;--radius-2xl:1rem;--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);--color-factorize-50:#fff9e6;--color-factorize-100:#fff0b8;--color-factorize-500:#fdc901;--color-factorize-600:#896300;--color-factorize-700:#705000}}@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,-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, 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:where(:not(iframe)){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}html{scrollbar-gutter:stable}body>main{flex:1;width:100%;min-width:0}body>footer{padding-bottom:calc(1.5rem + env(safe-area-inset-bottom))}}@layer components{.field{margin-top:calc(var(--spacing) * 1.5);border-radius:var(--radius-lg);border-style:var(--tw-border-style);border-width:1px;border-color:var(--color-slate-300);background-color:var(--color-white);width:100%;min-width:0;max-width:100%;padding-inline:calc(var(--spacing) * 3);padding-block:calc(var(--spacing) * 2.5);color:var(--color-slate-950);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));--tw-outline-style:none;outline-style:none}.field::placeholder{color:var(--color-slate-400)}.field:focus{border-color:var(--color-factorize-500);--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(3px + 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);--tw-ring-color:#fdc90126}@supports (color:color-mix(in lab, red, red)){.field:focus{--tw-ring-color:color-mix(in oklab, var(--color-factorize-500) 15%, transparent)}}.field:where(.dark,.dark *){border-color:var(--color-slate-700);background-color:var(--color-slate-950);color:var(--color-white)}.field:where(.dark,.dark *)::placeholder{color:var(--color-slate-500)}select.field:not([multiple]){appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%23575047' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5'%3E%3Cpath d='m6 8 4 4 4-4'/%3E%3C/svg%3E");background-position:right .75rem center;background-repeat:no-repeat;background-size:1.25rem 1.25rem;padding-right:2.75rem}.dark select.field:not([multiple]){background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%23cec5b4' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5'%3E%3Cpath d='m6 8 4 4 4-4'/%3E%3C/svg%3E")}.label{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height));--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold);color:var(--color-slate-700);display:block}.label:where(.dark,.dark *){color:var(--color-slate-300)}.template-editor{min-width:0;max-width:100%;position:relative}.template-editor textarea,.template-editor pre{scrollbar-gutter:stable;white-space:pre-wrap;overflow-wrap:break-word;min-height:11rem;font-family:var(--font-mono);font-size:var(--text-sm);tab-size:4;margin:0;padding:.625rem .75rem;line-height:1.25rem;overflow:auto}.template-editor pre{pointer-events:none;color:var(--color-slate-950);border:1px solid #0000;position:absolute;inset:0}.template-editor textarea{resize:vertical;color:#0000;caret-color:var(--color-slate-950);-webkit-text-fill-color:transparent;background-color:#0000;position:relative}.template-editor textarea::placeholder{color:var(--color-slate-400);-webkit-text-fill-color:var(--color-slate-400)}.template-delimiter{color:var(--color-factorize-600);font-weight:700}.template-expression{color:#2563eb}.dark .template-editor pre{color:var(--color-slate-100)}.dark .template-editor textarea{caret-color:var(--color-slate-100)}.dark .template-delimiter{color:var(--color-factorize-500)}.dark .template-expression{color:#93c5fd}.navbar-bee{transition:filter .15s}.dark .navbar-bee{filter:invert()}.landing-honeycomb{background-color:var(--color-stone-50);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='720' height='520' viewBox='0 0 720 520'%3E%3Cg transform='rotate(-7 360 260)' fill='none' stroke='%23705000' stroke-opacity='.07' stroke-width='1.5'%3E%3Cpath d='M25 140 87.5 31.75h125L275 140l-62.5 108.25h-125zM385 380l62.5-108.25h125L635 380l-62.5 108.25h-125z'/%3E%3C/g%3E%3C/svg%3E");background-position:top;background-size:720px 520px}.dark .landing-honeycomb{background-color:var(--color-slate-950);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='720' height='520' viewBox='0 0 720 520'%3E%3Cg transform='rotate(-7 360 260)' fill='none' stroke='%23fdc901' stroke-opacity='.05' stroke-width='1.5'%3E%3Cpath d='M25 140 87.5 31.75h125L275 140l-62.5 108.25h-125zM385 380l62.5-108.25h125L635 380l-62.5 108.25h-125z'/%3E%3C/g%3E%3C/svg%3E")}dialog[id$=-setup]{max-height:calc(100dvh - 2rem);margin:auto;overflow-y:auto}#trigger-dialog{width:min(44rem,100vw - 2rem);max-width:calc(100vw - 2rem)}#trigger-dialog>form,#trigger-dialog>form>div{min-width:0;max-width:100%}#trigger-rows td{overflow-wrap:anywhere}@media (min-width:40rem){div:has(>label>select[name=agentKind]){grid-template-columns:max-content minmax(0,1fr)}div:has(>label>select[name=agentKind])>label:first-child{width:11rem}}}@layer utilities{.invisible{visibility:hidden}.sr-only{clip-path:inset(50%);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.top-2\.5{top:calc(var(--spacing) * 2.5)}.top-5{top:calc(var(--spacing) * 5)}.right-0{right:0}.right-2\.5{right:calc(var(--spacing) * 2.5)}.right-5{right:calc(var(--spacing) * 5)}.z-20{z-index:20}.m-auto{margin:auto}.mx-auto{margin-inline:auto}.mt-0\.5{margin-top:calc(var(--spacing) * .5)}.mt-1{margin-top:var(--spacing)}.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)}.mt-4{margin-top:calc(var(--spacing) * 4)}.mt-5{margin-top:calc(var(--spacing) * 5)}.mt-6{margin-top:calc(var(--spacing) * 6)}.mt-8{margin-top:calc(var(--spacing) * 8)}.mt-9{margin-top:calc(var(--spacing) * 9)}.mt-10{margin-top:calc(var(--spacing) * 10)}.mt-12{margin-top:calc(var(--spacing) * 12)}.mt-24{margin-top:calc(var(--spacing) * 24)}.ml-1{margin-left:var(--spacing)}.ml-2{margin-left:calc(var(--spacing) * 2)}.block{display:block}.contents{display:contents}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline-flex{display:inline-flex}.table{display:table}.size-4{width:calc(var(--spacing) * 4);height:calc(var(--spacing) * 4)}.size-9{width:calc(var(--spacing) * 9);height:calc(var(--spacing) * 9)}.h-3{height:calc(var(--spacing) * 3)}.h-3\.5{height:calc(var(--spacing) * 3.5)}.h-4{height:calc(var(--spacing) * 4)}.h-5{height:calc(var(--spacing) * 5)}.h-6{height:calc(var(--spacing) * 6)}.h-7{height:calc(var(--spacing) * 7)}.h-8{height:calc(var(--spacing) * 8)}.h-9{height:calc(var(--spacing) * 9)}.h-10{height:calc(var(--spacing) * 10)}.h-11{height:calc(var(--spacing) * 11)}.h-16{height:calc(var(--spacing) * 16)}.max-h-56{max-height:calc(var(--spacing) * 56)}.max-h-\[70vh\]{max-height:70vh}.max-h-\[calc\(100vh-12rem\)\]{max-height:calc(100vh - 12rem)}.max-h-\[min\(60vh\,32rem\)\]{max-height:min(60vh,32rem)}.min-h-9{min-height:calc(var(--spacing) * 9)}.min-h-11{min-height:calc(var(--spacing) * 11)}.min-h-12{min-height:calc(var(--spacing) * 12)}.min-h-24{min-height:calc(var(--spacing) * 24)}.min-h-32{min-height:calc(var(--spacing) * 32)}.min-h-36{min-height:calc(var(--spacing) * 36)}.min-h-44{min-height:calc(var(--spacing) * 44)}.min-h-\[100dvh\]{min-height:100dvh}.w-3{width:calc(var(--spacing) * 3)}.w-3\.5{width:calc(var(--spacing) * 3.5)}.w-4{width:calc(var(--spacing) * 4)}.w-5{width:calc(var(--spacing) * 5)}.w-6{width:calc(var(--spacing) * 6)}.w-7{width:calc(var(--spacing) * 7)}.w-8{width:calc(var(--spacing) * 8)}.w-9{width:calc(var(--spacing) * 9)}.w-10{width:calc(var(--spacing) * 10)}.w-11{width:calc(var(--spacing) * 11)}.w-56{width:calc(var(--spacing) * 56)}.w-\[min\(32rem\,calc\(100vw-4rem\)\)\]{width:min(32rem,100vw - 4rem)}.w-\[min\(34rem\,calc\(100\%-2rem\)\)\]{width:min(34rem,100% - 2rem)}.w-\[min\(42rem\,calc\(100\%-2rem\)\)\]{width:min(42rem,100% - 2rem)}.w-\[min\(42rem\,calc\(100vw-2rem\)\)\]{width:min(42rem,100vw - 2rem)}.w-\[min\(44rem\,calc\(100\%-2rem\)\)\]{width:min(44rem,100% - 2rem)}.w-fit{width:fit-content}.w-full{width:100%}.max-w-2xl{max-width:var(--container-2xl)}.max-w-3xl{max-width:var(--container-3xl)}.max-w-4xl{max-width:var(--container-4xl)}.max-w-5xl{max-width:var(--container-5xl)}.max-w-6xl{max-width:var(--container-6xl)}.max-w-full{max-width:100%}.max-w-md{max-width:var(--container-md)}.max-w-none{max-width:none}.max-w-xs{max-width:var(--container-xs)}.min-w-0{min-width:0}.min-w-36{min-width:calc(var(--spacing) * 36)}.min-w-\[48rem\]{min-width:48rem}.flex-1{flex:1}.shrink-0{flex-shrink:0}.cursor-pointer{cursor:pointer}.resize-y{resize:vertical}.list-none{list-style-type:none}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.place-items-center{place-items:center}.items-center{align-items:center}.items-end{align-items:flex-end}.items-start{align-items:flex-start}.items-stretch{align-items:stretch}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.gap-1{gap:var(--spacing)}.gap-1\.5{gap:calc(var(--spacing) * 1.5)}.gap-2{gap:calc(var(--spacing) * 2)}.gap-2\.5{gap:calc(var(--spacing) * 2.5)}.gap-3{gap:calc(var(--spacing) * 3)}.gap-4{gap:calc(var(--spacing) * 4)}.gap-5{gap:calc(var(--spacing) * 5)}.gap-8{gap:calc(var(--spacing) * 8)}: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(.space-y-4>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-6>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)))}.gap-x-2{column-gap:calc(var(--spacing) * 2)}.gap-x-6{column-gap:calc(var(--spacing) * 6)}.gap-y-1{row-gap:var(--spacing)}.gap-y-2{row-gap:calc(var(--spacing) * 2)}: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-stone-200>:not(:last-child)){border-color:var(--color-stone-200)}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.overflow-y-auto{overflow-y:auto}.rounded{border-radius:.25rem}.rounded-2xl{border-radius:var(--radius-2xl)}.rounded-full{border-radius:3.40282e38px}.rounded-lg{border-radius:var(--radius-lg)}.rounded-md{border-radius:var(--radius-md)}.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-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-amber-300{border-color:var(--color-amber-300)}.border-amber-400{border-color:var(--color-amber-400)}.border-red-200{border-color:var(--color-red-200)}.border-stone-200{border-color:var(--color-stone-200)}.border-stone-300{border-color:var(--color-stone-300)}.bg-amber-50{background-color:var(--color-amber-50)}.bg-amber-100{background-color:var(--color-amber-100)}.bg-blue-100{background-color:var(--color-blue-100)}.bg-blue-500{background-color:var(--color-blue-500)}.bg-factorize-50{background-color:var(--color-factorize-50)}.bg-factorize-100{background-color:var(--color-factorize-100)}.bg-factorize-500{background-color:var(--color-factorize-500)}.bg-green-100{background-color:var(--color-green-100)}.bg-orange-100{background-color:var(--color-orange-100)}.bg-red-50{background-color:var(--color-red-50)}.bg-red-100{background-color:var(--color-red-100)}.bg-slate-900{background-color:var(--color-slate-900)}.bg-slate-950{background-color:var(--color-slate-950)}.bg-stone-50{background-color:var(--color-stone-50)}.bg-stone-100{background-color:var(--color-stone-100)}.bg-stone-200{background-color:var(--color-stone-200)}.bg-stone-300{background-color:var(--color-stone-300)}.bg-violet-100{background-color:var(--color-violet-100)}.bg-white{background-color:var(--color-white)}.object-contain{object-fit:contain}.p-0{padding:0}.p-1\.5{padding:calc(var(--spacing) * 1.5)}.p-2{padding:calc(var(--spacing) * 2)}.p-3{padding:calc(var(--spacing) * 3)}.p-4{padding:calc(var(--spacing) * 4)}.p-5{padding:calc(var(--spacing) * 5)}.p-6{padding:calc(var(--spacing) * 6)}.p-8{padding:calc(var(--spacing) * 8)}.px-1\.5{padding-inline:calc(var(--spacing) * 1.5)}.px-2{padding-inline:calc(var(--spacing) * 2)}.px-2\.5{padding-inline:calc(var(--spacing) * 2.5)}.px-3{padding-inline:calc(var(--spacing) * 3)}.px-4{padding-inline:calc(var(--spacing) * 4)}.px-5{padding-inline:calc(var(--spacing) * 5)}.px-6{padding-inline:calc(var(--spacing) * 6)}.py-0\.5{padding-block:calc(var(--spacing) * .5)}.py-1{padding-block:var(--spacing)}.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-3\.5{padding-block:calc(var(--spacing) * 3.5)}.py-4{padding-block:calc(var(--spacing) * 4)}.py-6{padding-block:calc(var(--spacing) * 6)}.py-8{padding-block:calc(var(--spacing) * 8)}.py-16{padding-block:calc(var(--spacing) * 16)}.py-20{padding-block:calc(var(--spacing) * 20)}.pt-1{padding-top:var(--spacing)}.pt-5{padding-top:calc(var(--spacing) * 5)}.pb-3{padding-bottom:calc(var(--spacing) * 3)}.pb-5{padding-bottom:calc(var(--spacing) * 5)}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.font-mono{font-family:var(--font-mono)}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.text-3xl{font-size:var(--text-3xl);line-height:var(--tw-leading,var(--text-3xl--line-height))}.text-5xl{font-size:var(--text-5xl);line-height:var(--tw-leading,var(--text-5xl--line-height))}.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-xl{font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.text-\[10px\]{font-size:10px}.leading-5{--tw-leading:calc(var(--spacing) * 5);line-height:calc(var(--spacing) * 5)}.leading-7{--tw-leading:calc(var(--spacing) * 7);line-height:calc(var(--spacing) * 7)}.leading-8{--tw-leading:calc(var(--spacing) * 8);line-height:calc(var(--spacing) * 8)}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-normal{--tw-font-weight:var(--font-weight-normal);font-weight:var(--font-weight-normal)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-\[\.18em\]{--tw-tracking:.18em;letter-spacing:.18em}.tracking-tight{--tw-tracking:var(--tracking-tight);letter-spacing:var(--tracking-tight)}.tracking-wide{--tw-tracking:var(--tracking-wide);letter-spacing:var(--tracking-wide)}.break-words{overflow-wrap:break-word}.break-all{word-break:break-all}.whitespace-pre-wrap{white-space:pre-wrap}.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-amber-950{color:var(--color-amber-950)}.text-blue-800{color:var(--color-blue-800)}.text-factorize-600{color:var(--color-factorize-600)}.text-factorize-700{color:var(--color-factorize-700)}.text-green-800{color:var(--color-green-800)}.text-orange-800{color:var(--color-orange-800)}.text-red-700{color:var(--color-red-700)}.text-red-800{color:var(--color-red-800)}.text-slate-100{color:var(--color-slate-100)}.text-slate-400{color:var(--color-slate-400)}.text-slate-500{color:var(--color-slate-500)}.text-slate-600{color:var(--color-slate-600)}.text-slate-700{color:var(--color-slate-700)}.text-slate-800{color:var(--color-slate-800)}.text-slate-950{color:var(--color-slate-950)}.text-violet-800{color:var(--color-violet-800)}.text-white{color:var(--color-white)}.capitalize{text-transform:capitalize}.lowercase{text-transform:lowercase}.uppercase{text-transform:uppercase}.italic{font-style:italic}.underline{text-decoration-line:underline}.decoration-slate-400\/60{text-decoration-color:#9b928299}@supports (color:color-mix(in lab, red, red)){.decoration-slate-400\/60{-webkit-text-decoration-color:color-mix(in oklab, var(--color-slate-400) 60%, transparent);-webkit-text-decoration-color:color-mix(in oklab, var(--color-slate-400) 60%, transparent);text-decoration-color:color-mix(in oklab, var(--color-slate-400) 60%, transparent)}}.underline-offset-4{text-underline-offset:4px}.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.\[color-scheme\:light\]{color-scheme:light}.shadow-2xl{--tw-shadow:0 25px 50px -12px var(--tw-shadow-color,#00000040);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-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)}.shadow-xl{--tw-shadow:0 20px 25px -5px var(--tw-shadow-color,#0000001a), 0 8px 10px -6px 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-2{--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)}.ring-4{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(4px + 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-blue-200{--tw-ring-color:var(--color-blue-200)}.ring-stone-200{--tw-ring-color:var(--color-stone-200)}.blur{--tw-blur:blur(8px);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,)}.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,)}.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}@media (hover:hover){.group-hover\:border-factorize-500:is(:where(.group):hover *){border-color:var(--color-factorize-500)}.group-hover\:text-slate-950:is(:where(.group):hover *){color:var(--color-slate-950)}}.backdrop\:bg-slate-950\/50::backdrop{background-color:#15141080}@supports (color:color-mix(in lab, red, red)){.backdrop\:bg-slate-950\/50::backdrop{background-color:color-mix(in oklab, var(--color-slate-950) 50%, transparent)}}.backdrop\:bg-slate-950\/60::backdrop{background-color:#15141099}@supports (color:color-mix(in lab, red, red)){.backdrop\:bg-slate-950\/60::backdrop{background-color:color-mix(in oklab, var(--color-slate-950) 60%, transparent)}}@media (hover:hover){.hover\:-translate-y-0\.5:hover{--tw-translate-y:calc(var(--spacing) * -.5);translate:var(--tw-translate-x) var(--tw-translate-y)}.hover\:border-stone-300:hover{border-color:var(--color-stone-300)}.hover\:bg-red-50:hover{background-color:var(--color-red-50)}.hover\:bg-slate-800:hover{background-color:var(--color-slate-800)}.hover\:bg-stone-50:hover{background-color:var(--color-stone-50)}.hover\:bg-stone-100:hover{background-color:var(--color-stone-100)}.hover\:text-factorize-700:hover{color:var(--color-factorize-700)}.hover\:text-red-700:hover{color:var(--color-red-700)}.hover\:text-slate-700:hover{color:var(--color-slate-700)}.hover\:text-slate-950:hover{color:var(--color-slate-950)}.hover\:shadow-md:hover{--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)}}.focus\:ring-factorize-600:focus{--tw-ring-color:var(--color-factorize-600)}.focus-visible\:ring-2:focus-visible{--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-visible\:ring-factorize-500:focus-visible{--tw-ring-color:var(--color-factorize-500)}.focus-visible\:ring-factorize-600:focus-visible{--tw-ring-color:var(--color-factorize-600)}.focus-visible\:ring-red-500:focus-visible{--tw-ring-color:var(--color-red-500)}.focus-visible\:ring-offset-2:focus-visible{--tw-ring-offset-width:2px;--tw-ring-offset-shadow:var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color)}.focus-visible\:outline-none:focus-visible{--tw-outline-style:none;outline-style:none}.focus-visible\:ring-inset:focus-visible{--tw-ring-inset:inset}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:cursor-wait:disabled{cursor:wait}.disabled\:opacity-50:disabled{opacity:.5}.disabled\:opacity-60:disabled{opacity:.6}.aria-\[current\=page\]\:bg-stone-100[aria-current=page]{background-color:var(--color-stone-100)}.aria-\[current\=page\]\:font-semibold[aria-current=page]{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.aria-\[current\=page\]\:text-slate-950[aria-current=page]{color:var(--color-slate-950)}.aria-\[current\=page\]\:underline[aria-current=page]{text-decoration-line:underline}.aria-\[current\=page\]\:underline-offset-8[aria-current=page]{text-underline-offset:8px}@media (min-width:40rem){.sm\:col-span-2{grid-column:span 2/span 2}.sm\:mt-2{margin-top:calc(var(--spacing) * 2)}.sm\:mt-5{margin-top:calc(var(--spacing) * 5)}.sm\:mt-8{margin-top:calc(var(--spacing) * 8)}.sm\:inline{display:inline}.sm\:w-56{width:calc(var(--spacing) * 56)}.sm\:w-auto{width:auto}.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.sm\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.sm\:grid-cols-\[8rem_minmax\(0\,1fr\)\]{grid-template-columns:8rem minmax(0,1fr)}.sm\:grid-cols-\[minmax\(0\,1fr\)_auto\]{grid-template-columns:minmax(0,1fr) auto}.sm\:grid-cols-\[minmax\(0\,1fr\)_minmax\(0\,1\.4fr\)_auto\]{grid-template-columns:minmax(0,1fr) minmax(0,1.4fr) auto}.sm\:flex-row{flex-direction:row}.sm\:items-end{align-items:flex-end}.sm\:items-start{align-items:flex-start}.sm\:justify-between{justify-content:space-between}.sm\:justify-end{justify-content:flex-end}.sm\:gap-4{gap:calc(var(--spacing) * 4)}.sm\:p-6{padding:calc(var(--spacing) * 6)}.sm\:p-8{padding:calc(var(--spacing) * 8)}.sm\:p-10{padding:calc(var(--spacing) * 10)}.sm\:px-5{padding-inline:calc(var(--spacing) * 5)}.sm\:py-3{padding-block:calc(var(--spacing) * 3)}.sm\:py-12{padding-block:calc(var(--spacing) * 12)}.sm\:py-28{padding-block:calc(var(--spacing) * 28)}.sm\:text-4xl{font-size:var(--text-4xl);line-height:var(--tw-leading,var(--text-4xl--line-height))}.sm\:text-7xl{font-size:var(--text-7xl);line-height:var(--tw-leading,var(--text-7xl--line-height))}.sm\:text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}}@media (min-width:48rem){.md\:mb-1{margin-bottom:var(--spacing)}.md\:block{display:block}.md\:grid-cols-\[13rem_minmax\(0\,1fr\)\]{grid-template-columns:13rem minmax(0,1fr)}.md\:gap-10{gap:calc(var(--spacing) * 10)}.md\:border-b-0{border-bottom-style:var(--tw-border-style);border-bottom-width:0}.md\:pb-0{padding-bottom:0}}@media (min-width:64rem){.lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.lg\:px-8{padding-inline:calc(var(--spacing) * 8)}}:where(.dark\:divide-slate-800:where(.dark,.dark *)>:not(:last-child)){border-color:var(--color-slate-800)}.dark\:border-amber-700:where(.dark,.dark *){border-color:var(--color-amber-700)}.dark\:border-amber-800:where(.dark,.dark *){border-color:var(--color-amber-800)}.dark\:border-red-900:where(.dark,.dark *){border-color:var(--color-red-900)}.dark\:border-slate-700:where(.dark,.dark *){border-color:var(--color-slate-700)}.dark\:border-slate-800:where(.dark,.dark *){border-color:var(--color-slate-800)}.dark\:bg-amber-950:where(.dark,.dark *){background-color:var(--color-amber-950)}.dark\:bg-amber-950\/30:where(.dark,.dark *){background-color:#4619014d}@supports (color:color-mix(in lab, red, red)){.dark\:bg-amber-950\/30:where(.dark,.dark *){background-color:color-mix(in oklab, var(--color-amber-950) 30%, transparent)}}.dark\:bg-blue-950:where(.dark,.dark *){background-color:var(--color-blue-950)}.dark\:bg-factorize-500\/20:where(.dark,.dark *){background-color:#fdc90133}@supports (color:color-mix(in lab, red, red)){.dark\:bg-factorize-500\/20:where(.dark,.dark *){background-color:color-mix(in oklab, var(--color-factorize-500) 20%, transparent)}}.dark\:bg-factorize-500\/50:where(.dark,.dark *){background-color:#fdc90180}@supports (color:color-mix(in lab, red, red)){.dark\:bg-factorize-500\/50:where(.dark,.dark *){background-color:color-mix(in oklab, var(--color-factorize-500) 50%, transparent)}}.dark\:bg-green-950:where(.dark,.dark *){background-color:var(--color-green-950)}.dark\:bg-orange-950:where(.dark,.dark *){background-color:var(--color-orange-950)}.dark\:bg-red-950:where(.dark,.dark *){background-color:var(--color-red-950)}.dark\:bg-red-950\/40:where(.dark,.dark *){background-color:#46080966}@supports (color:color-mix(in lab, red, red)){.dark\:bg-red-950\/40:where(.dark,.dark *){background-color:color-mix(in oklab, var(--color-red-950) 40%, transparent)}}.dark\:bg-slate-600:where(.dark,.dark *){background-color:var(--color-slate-600)}.dark\:bg-slate-700:where(.dark,.dark *){background-color:var(--color-slate-700)}.dark\:bg-slate-800:where(.dark,.dark *){background-color:var(--color-slate-800)}.dark\:bg-slate-900:where(.dark,.dark *){background-color:var(--color-slate-900)}.dark\:bg-slate-950:where(.dark,.dark *){background-color:var(--color-slate-950)}.dark\:bg-violet-950:where(.dark,.dark *){background-color:var(--color-violet-950)}.dark\:bg-white:where(.dark,.dark *){background-color:var(--color-white)}.dark\:text-amber-100:where(.dark,.dark *){color:var(--color-amber-100)}.dark\:text-amber-200:where(.dark,.dark *){color:var(--color-amber-200)}.dark\:text-amber-300:where(.dark,.dark *){color:var(--color-amber-300)}.dark\:text-blue-200:where(.dark,.dark *){color:var(--color-blue-200)}.dark\:text-factorize-100:where(.dark,.dark *){color:var(--color-factorize-100)}.dark\:text-green-200:where(.dark,.dark *){color:var(--color-green-200)}.dark\:text-orange-200:where(.dark,.dark *){color:var(--color-orange-200)}.dark\:text-red-200:where(.dark,.dark *){color:var(--color-red-200)}.dark\:text-red-300:where(.dark,.dark *){color:var(--color-red-300)}.dark\:text-slate-100:where(.dark,.dark *){color:var(--color-slate-100)}.dark\:text-slate-200:where(.dark,.dark *){color:var(--color-slate-200)}.dark\:text-slate-300:where(.dark,.dark *){color:var(--color-slate-300)}.dark\:text-slate-400:where(.dark,.dark *){color:var(--color-slate-400)}.dark\:text-slate-500:where(.dark,.dark *){color:var(--color-slate-500)}.dark\:text-slate-950:where(.dark,.dark *){color:var(--color-slate-950)}.dark\:text-violet-200:where(.dark,.dark *){color:var(--color-violet-200)}.dark\:text-white:where(.dark,.dark *){color:var(--color-white)}.dark\:decoration-slate-500\/60:where(.dark,.dark *){text-decoration-color:#71695e99}@supports (color:color-mix(in lab, red, red)){.dark\:decoration-slate-500\/60:where(.dark,.dark *){-webkit-text-decoration-color:color-mix(in oklab, var(--color-slate-500) 60%, transparent);-webkit-text-decoration-color:color-mix(in oklab, var(--color-slate-500) 60%, transparent);text-decoration-color:color-mix(in oklab, var(--color-slate-500) 60%, transparent)}}.dark\:\[color-scheme\:dark\]:where(.dark,.dark *){color-scheme:dark}.dark\:ring-blue-900:where(.dark,.dark *){--tw-ring-color:var(--color-blue-900)}.dark\:ring-slate-800:where(.dark,.dark *){--tw-ring-color:var(--color-slate-800)}@media (hover:hover){.dark\:hover\:border-slate-700:where(.dark,.dark *):hover{border-color:var(--color-slate-700)}.dark\:hover\:bg-red-950\/50:where(.dark,.dark *):hover{background-color:#46080980}@supports (color:color-mix(in lab, red, red)){.dark\:hover\:bg-red-950\/50:where(.dark,.dark *):hover{background-color:color-mix(in oklab, var(--color-red-950) 50%, transparent)}}.dark\:hover\:bg-slate-200:where(.dark,.dark *):hover{background-color:var(--color-slate-200)}.dark\:hover\:bg-slate-800:where(.dark,.dark *):hover{background-color:var(--color-slate-800)}.dark\:hover\:text-red-300:where(.dark,.dark *):hover{color:var(--color-red-300)}.dark\:hover\:text-slate-200:where(.dark,.dark *):hover{color:var(--color-slate-200)}.dark\:hover\:text-white:where(.dark,.dark *):hover{color:var(--color-white)}}.dark\:focus-visible\:ring-offset-slate-900:where(.dark,.dark *):focus-visible{--tw-ring-offset-color:var(--color-slate-900)}.dark\:focus-visible\:ring-offset-slate-950:where(.dark,.dark *):focus-visible{--tw-ring-offset-color:var(--color-slate-950)}.dark\:aria-\[current\=page\]\:bg-slate-800:where(.dark,.dark *)[aria-current=page]{background-color:var(--color-slate-800)}.dark\:aria-\[current\=page\]\:text-white:where(.dark,.dark *)[aria-current=page]{color:var(--color-white)}.\[\&\:\:-webkit-details-marker\]\:hidden::-webkit-details-marker{display:none}.\[\&\>a\]\:w-full>a,.\[\&\>button\]\:w-full>button{width:100%}#job-detail>div.mt-6>div:last-child>:is(button,a){border-radius:.5rem;min-height:2.5rem;padding:.5rem .75rem}}@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-tracking{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:"";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:"";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:"";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-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:"";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@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} \ No newline at end of file +@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-space-y-reverse:0;--tw-divide-y-reverse:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking: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-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-translate-x:0;--tw-translate-y:0;--tw-translate-z:0}}}@layer theme{:root,:host{--font-sans:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, 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-red-50:oklch(97.1% .013 17.38);--color-red-100:oklch(93.6% .032 17.717);--color-red-200:oklch(88.5% .062 18.334);--color-red-300:oklch(80.8% .114 19.571);--color-red-500:oklch(63.7% .237 25.331);--color-red-700:oklch(50.5% .213 27.518);--color-red-800:oklch(44.4% .177 26.899);--color-red-900:oklch(39.6% .141 25.723);--color-red-950:oklch(25.8% .092 26.042);--color-orange-100:oklch(95.4% .038 75.164);--color-orange-200:oklch(90.1% .076 70.697);--color-orange-800:oklch(47% .157 37.304);--color-orange-950:oklch(26.6% .079 36.259);--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-300:oklch(87.9% .169 91.605);--color-amber-400:oklch(82.8% .189 84.429);--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-amber-950:oklch(27.9% .077 45.635);--color-green-100:oklch(96.2% .044 156.743);--color-green-200:oklch(92.5% .084 155.995);--color-green-300:oklch(87.1% .15 154.449);--color-green-700:oklch(52.7% .154 150.069);--color-green-800:oklch(44.8% .119 151.328);--color-green-950:oklch(26.6% .065 152.934);--color-blue-100:oklch(93.2% .032 255.585);--color-blue-200:oklch(88.2% .059 254.128);--color-blue-500:oklch(62.3% .214 259.815);--color-blue-800:oklch(42.4% .199 265.638);--color-blue-900:oklch(37.9% .146 265.522);--color-blue-950:oklch(28.2% .091 267.935);--color-slate-100:#f5f1e8;--color-slate-200:#e7e1d4;--color-slate-300:#cec5b4;--color-slate-400:#9b9282;--color-slate-500:#71695e;--color-slate-600:#575047;--color-slate-700:#403b34;--color-slate-800:#2c2924;--color-slate-900:#201e1a;--color-slate-950:#151410;--color-stone-50:#fcfbf6;--color-stone-100:#f6f3e9;--color-stone-200:#e6e0d1;--color-stone-300:#d4cbb9;--color-white:#fff;--spacing:.25rem;--container-xs:20rem;--container-md:28rem;--container-2xl:42rem;--container-3xl:48rem;--container-4xl:56rem;--container-5xl:64rem;--container-6xl:72rem;--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);--text-xl:1.25rem;--text-xl--line-height:calc(1.75 / 1.25);--text-2xl:1.5rem;--text-2xl--line-height:calc(2 / 1.5);--text-3xl:1.875rem;--text-3xl--line-height:calc(2.25 / 1.875);--text-4xl:2.25rem;--text-4xl--line-height:calc(2.5 / 2.25);--text-5xl:3rem;--text-5xl--line-height:1;--text-7xl:4.5rem;--text-7xl--line-height:1;--font-weight-normal:400;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--tracking-tight:-.025em;--tracking-wide:.025em;--radius-md:.375rem;--radius-lg:.5rem;--radius-xl:.75rem;--radius-2xl:1rem;--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);--color-factorize-50:#fff9e6;--color-factorize-100:#fff0b8;--color-factorize-500:#fdc901;--color-factorize-600:#896300;--color-factorize-700:#705000}}@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,-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, 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:where(:not(iframe)){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}html{scrollbar-gutter:stable}body>main{flex:1;width:100%;min-width:0}body>footer{padding-bottom:calc(1.5rem + env(safe-area-inset-bottom))}}@layer components{.field{margin-top:calc(var(--spacing) * 1.5);border-radius:var(--radius-lg);border-style:var(--tw-border-style);border-width:1px;border-color:var(--color-slate-300);background-color:var(--color-white);width:100%;min-width:0;max-width:100%;padding-inline:calc(var(--spacing) * 3);padding-block:calc(var(--spacing) * 2.5);color:var(--color-slate-950);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));--tw-outline-style:none;outline-style:none}.field::placeholder{color:var(--color-slate-400)}.field:focus{border-color:var(--color-factorize-500);--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(3px + 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);--tw-ring-color:#fdc90126}@supports (color:color-mix(in lab, red, red)){.field:focus{--tw-ring-color:color-mix(in oklab, var(--color-factorize-500) 15%, transparent)}}.field:where(.dark,.dark *){border-color:var(--color-slate-700);background-color:var(--color-slate-950);color:var(--color-white)}.field:where(.dark,.dark *)::placeholder{color:var(--color-slate-500)}select.field:not([multiple]){appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%23575047' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5'%3E%3Cpath d='m6 8 4 4 4-4'/%3E%3C/svg%3E");background-position:right .75rem center;background-repeat:no-repeat;background-size:1.25rem 1.25rem;padding-right:2.75rem}.dark select.field:not([multiple]){background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%23cec5b4' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5'%3E%3Cpath d='m6 8 4 4 4-4'/%3E%3C/svg%3E")}.label{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height));--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold);color:var(--color-slate-700);display:block}.label:where(.dark,.dark *){color:var(--color-slate-300)}.template-editor{min-width:0;max-width:100%;position:relative}.template-editor textarea,.template-editor pre{scrollbar-gutter:stable;white-space:pre-wrap;overflow-wrap:break-word;min-height:11rem;font-family:var(--font-mono);font-size:var(--text-sm);tab-size:4;margin:0;padding:.625rem .75rem;line-height:1.25rem;overflow:auto}.template-editor pre{pointer-events:none;color:var(--color-slate-950);border:1px solid #0000;position:absolute;inset:0}.template-editor textarea{resize:vertical;color:#0000;caret-color:var(--color-slate-950);-webkit-text-fill-color:transparent;background-color:#0000;position:relative}.template-editor textarea::placeholder{color:var(--color-slate-400);-webkit-text-fill-color:var(--color-slate-400)}.template-delimiter{color:var(--color-factorize-600);font-weight:700}.template-expression{color:#2563eb}.dark .template-editor pre{color:var(--color-slate-100)}.dark .template-editor textarea{caret-color:var(--color-slate-100)}.dark .template-delimiter{color:var(--color-factorize-500)}.dark .template-expression{color:#93c5fd}.navbar-bee{transition:filter .15s}.dark .navbar-bee{filter:invert()}.landing-honeycomb{background-color:var(--color-stone-50);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='720' height='520' viewBox='0 0 720 520'%3E%3Cg transform='rotate(-7 360 260)' fill='none' stroke='%23705000' stroke-opacity='.07' stroke-width='1.5'%3E%3Cpath d='M25 140 87.5 31.75h125L275 140l-62.5 108.25h-125zM385 380l62.5-108.25h125L635 380l-62.5 108.25h-125z'/%3E%3C/g%3E%3C/svg%3E");background-position:top;background-size:720px 520px}.dark .landing-honeycomb{background-color:var(--color-slate-950);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='720' height='520' viewBox='0 0 720 520'%3E%3Cg transform='rotate(-7 360 260)' fill='none' stroke='%23fdc901' stroke-opacity='.05' stroke-width='1.5'%3E%3Cpath d='M25 140 87.5 31.75h125L275 140l-62.5 108.25h-125zM385 380l62.5-108.25h125L635 380l-62.5 108.25h-125z'/%3E%3C/g%3E%3C/svg%3E")}dialog[id$=-setup]{max-height:calc(100dvh - 2rem);margin:auto;overflow-y:auto}#trigger-dialog{width:min(44rem,100vw - 2rem);max-width:calc(100vw - 2rem)}#trigger-dialog>form,#trigger-dialog>form>div{min-width:0;max-width:100%}#trigger-rows td{overflow-wrap:anywhere}@media (min-width:40rem){div:has(>label>select[name=agentKind]){grid-template-columns:max-content minmax(0,1fr)}div:has(>label>select[name=agentKind])>label:first-child{width:11rem}}.trace-list{--trace-surface:#f6f3e9;--trace-border:#e6e0d1;--trace-muted:#71695e;--trace-accent:#705000;--trace-code:#fcfbf6;color:#201e1a}.dark .trace-list{--trace-surface:#2c2924;--trace-border:#403b34;--trace-muted:#b2a897;--trace-accent:#f4d36c;--trace-code:#151410;color:#f5f1e8}.trace-list>*+*{margin-top:1rem}.trace-message{min-width:0;padding:1rem 0}.trace-message h3{color:var(--trace-accent);letter-spacing:.08em;text-transform:uppercase;margin-bottom:.65rem;font-size:.7rem;font-weight:700}.trace-user_message{border-left:3px solid var(--trace-accent);background:var(--trace-surface);border-radius:0 .6rem .6rem 0;padding:1rem 1.25rem}.trace-prose{overflow-wrap:anywhere;font-size:.875rem;line-height:1.75}.trace-line{white-space:pre-wrap}.trace-prose h4{margin:.75rem 0 .25rem;font-weight:700}.trace-prose code{background:var(--trace-surface);border-radius:.25rem;padding:.1rem .3rem;font-size:.85em}.trace-bullet{padding-left:1.25rem;position:relative}.trace-bullet:before{content:"•";color:var(--trace-muted);position:absolute;left:.25rem}.trace-event,.trace-structured{border:1px solid var(--trace-border);border-radius:.6rem;min-width:0;overflow:hidden}.trace-event summary,.trace-structured summary{cursor:pointer;overflow-wrap:anywhere;padding:.75rem 1rem;font-size:.8rem}.trace-event summary:focus-visible,.trace-structured summary:focus-visible{outline:2px solid var(--trace-accent);outline-offset:-2px}.trace-event summary{background:var(--trace-surface)}.trace-event-kind{color:var(--trace-muted);text-transform:uppercase;letter-spacing:.04em;margin-right:.75rem;font-size:.65rem;display:inline-block}.trace-meta{border-style:dashed}.trace-error{border-color:#dc2626}.trace-warning{border-color:#b7791f}.trace-structured{margin:.75rem 0}.trace-structured>div{padding:0 1rem 1rem}.trace-code{background:var(--trace-code);min-width:0}.trace-prose .trace-code{border:1px solid var(--trace-border);border-radius:.5rem;margin:.75rem 0;overflow:hidden}.trace-code-label{border-bottom:1px solid var(--trace-border);color:var(--trace-muted);font:600 .65rem var(--font-mono);padding:.4rem 1rem}.trace-code pre{white-space:pre;max-height:24rem;font:.75rem/1.7 var(--font-mono);tab-size:2;margin:0;padding:1rem;overflow:auto}.trace-code code{font-size:inherit;background:0 0;padding:0}.trace-token-keyword{color:#7e22ce}.trace-token-string{color:#166534}.trace-token-comment{color:#71695e;font-style:italic}.trace-token-number,.trace-token-variable{color:#075985}.dark .trace-token-keyword{color:#d8b4fe}.dark .trace-token-string{color:#86efac}.dark .trace-token-comment{color:#b2a897}.dark .trace-token-number,.dark .trace-token-variable{color:#7dd3fc}.trace-thinking{color:var(--trace-muted);align-items:center;gap:.5rem;padding:.25rem 0;font-size:.8rem;display:flex}.trace-spinner{border:2px solid var(--trace-border);border-top-color:var(--trace-accent);border-radius:50%;width:.8rem;height:.8rem}.trace-thinking-live{display:none}.trace-running .trace-at-end>.trace-thinking:last-child .trace-spinner{animation:1s linear infinite trace-spin}.trace-running .trace-at-end>.trace-thinking:last-child .trace-thinking-live{display:inline}.trace-running .trace-at-end>.trace-thinking:last-child .trace-thinking-past{display:none}@keyframes trace-spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){.trace-running .trace-at-end>.trace-thinking:last-child .trace-spinner{animation:none}}}@layer utilities{.invisible{visibility:hidden}.visible{visibility:visible}.sr-only{clip-path:inset(50%);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.static{position:static}.inset-y-0{inset-block:0}.top-2\.5{top:calc(var(--spacing) * 2.5)}.top-5{top:calc(var(--spacing) * 5)}.right-0{right:0}.right-2\.5{right:calc(var(--spacing) * 2.5)}.right-3{right:calc(var(--spacing) * 3)}.right-5{right:calc(var(--spacing) * 5)}.z-20{z-index:20}.m-auto{margin:auto}.mx-auto{margin-inline:auto}.mt-0{margin-top:0}.mt-0\.5{margin-top:calc(var(--spacing) * .5)}.mt-1{margin-top:var(--spacing)}.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)}.mt-4{margin-top:calc(var(--spacing) * 4)}.mt-5{margin-top:calc(var(--spacing) * 5)}.mt-6{margin-top:calc(var(--spacing) * 6)}.mt-8{margin-top:calc(var(--spacing) * 8)}.mt-9{margin-top:calc(var(--spacing) * 9)}.mt-10{margin-top:calc(var(--spacing) * 10)}.mt-12{margin-top:calc(var(--spacing) * 12)}.mt-24{margin-top:calc(var(--spacing) * 24)}.ml-1{margin-left:var(--spacing)}.ml-2{margin-left:calc(var(--spacing) * 2)}.block{display:block}.contents{display:contents}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline-flex{display:inline-flex}.size-4{width:calc(var(--spacing) * 4);height:calc(var(--spacing) * 4)}.size-9{width:calc(var(--spacing) * 9);height:calc(var(--spacing) * 9)}.h-3{height:calc(var(--spacing) * 3)}.h-3\.5{height:calc(var(--spacing) * 3.5)}.h-4{height:calc(var(--spacing) * 4)}.h-5{height:calc(var(--spacing) * 5)}.h-6{height:calc(var(--spacing) * 6)}.h-7{height:calc(var(--spacing) * 7)}.h-8{height:calc(var(--spacing) * 8)}.h-9{height:calc(var(--spacing) * 9)}.h-10{height:calc(var(--spacing) * 10)}.h-11{height:calc(var(--spacing) * 11)}.h-16{height:calc(var(--spacing) * 16)}.max-h-56{max-height:calc(var(--spacing) * 56)}.max-h-\[70vh\]{max-height:70vh}.max-h-\[min\(60vh\,32rem\)\]{max-height:min(60vh,32rem)}.min-h-9{min-height:calc(var(--spacing) * 9)}.min-h-11{min-height:calc(var(--spacing) * 11)}.min-h-12{min-height:calc(var(--spacing) * 12)}.min-h-24{min-height:calc(var(--spacing) * 24)}.min-h-32{min-height:calc(var(--spacing) * 32)}.min-h-36{min-height:calc(var(--spacing) * 36)}.min-h-44{min-height:calc(var(--spacing) * 44)}.min-h-\[100dvh\]{min-height:100dvh}.w-3{width:calc(var(--spacing) * 3)}.w-3\.5{width:calc(var(--spacing) * 3.5)}.w-4{width:calc(var(--spacing) * 4)}.w-5{width:calc(var(--spacing) * 5)}.w-6{width:calc(var(--spacing) * 6)}.w-7{width:calc(var(--spacing) * 7)}.w-8{width:calc(var(--spacing) * 8)}.w-9{width:calc(var(--spacing) * 9)}.w-10{width:calc(var(--spacing) * 10)}.w-11{width:calc(var(--spacing) * 11)}.w-56{width:calc(var(--spacing) * 56)}.w-\[min\(32rem\,calc\(100vw-4rem\)\)\]{width:min(32rem,100vw - 4rem)}.w-\[min\(34rem\,calc\(100\%-2rem\)\)\]{width:min(34rem,100% - 2rem)}.w-\[min\(42rem\,calc\(100\%-2rem\)\)\]{width:min(42rem,100% - 2rem)}.w-\[min\(42rem\,calc\(100vw-2rem\)\)\]{width:min(42rem,100vw - 2rem)}.w-\[min\(44rem\,calc\(100\%-2rem\)\)\]{width:min(44rem,100% - 2rem)}.w-fit{width:fit-content}.w-full{width:100%}.max-w-2xl{max-width:var(--container-2xl)}.max-w-3xl{max-width:var(--container-3xl)}.max-w-4xl{max-width:var(--container-4xl)}.max-w-5xl{max-width:var(--container-5xl)}.max-w-6xl{max-width:var(--container-6xl)}.max-w-full{max-width:100%}.max-w-md{max-width:var(--container-md)}.max-w-none{max-width:none}.max-w-xs{max-width:var(--container-xs)}.min-w-0{min-width:0}.min-w-36{min-width:calc(var(--spacing) * 36)}.min-w-\[48rem\]{min-width:48rem}.flex-1{flex:1}.shrink-0{flex-shrink:0}.cursor-pointer{cursor:pointer}.resize-y{resize:vertical}.list-none{list-style-type:none}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.place-items-center{place-items:center}.items-center{align-items:center}.items-end{align-items:flex-end}.items-start{align-items:flex-start}.items-stretch{align-items:stretch}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.gap-1{gap:var(--spacing)}.gap-1\.5{gap:calc(var(--spacing) * 1.5)}.gap-2{gap:calc(var(--spacing) * 2)}.gap-2\.5{gap:calc(var(--spacing) * 2.5)}.gap-3{gap:calc(var(--spacing) * 3)}.gap-4{gap:calc(var(--spacing) * 4)}.gap-5{gap:calc(var(--spacing) * 5)}.gap-8{gap:calc(var(--spacing) * 8)}: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(.space-y-4>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-6>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)))}.gap-x-2{column-gap:calc(var(--spacing) * 2)}.gap-x-6{column-gap:calc(var(--spacing) * 6)}.gap-y-1{row-gap:var(--spacing)}.gap-y-2{row-gap:calc(var(--spacing) * 2)}: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-stone-200>:not(:last-child)){border-color:var(--color-stone-200)}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.overflow-y-auto{overflow-y:auto}.rounded{border-radius:.25rem}.rounded-2xl{border-radius:var(--radius-2xl)}.rounded-full{border-radius:3.40282e38px}.rounded-lg{border-radius:var(--radius-lg)}.rounded-md{border-radius:var(--radius-md)}.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-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-amber-300{border-color:var(--color-amber-300)}.border-amber-400{border-color:var(--color-amber-400)}.border-red-200{border-color:var(--color-red-200)}.border-stone-200{border-color:var(--color-stone-200)}.border-stone-300{border-color:var(--color-stone-300)}.bg-amber-50{background-color:var(--color-amber-50)}.bg-amber-100{background-color:var(--color-amber-100)}.bg-blue-100{background-color:var(--color-blue-100)}.bg-blue-500{background-color:var(--color-blue-500)}.bg-factorize-50{background-color:var(--color-factorize-50)}.bg-factorize-100{background-color:var(--color-factorize-100)}.bg-factorize-500{background-color:var(--color-factorize-500)}.bg-green-100{background-color:var(--color-green-100)}.bg-orange-100{background-color:var(--color-orange-100)}.bg-red-50{background-color:var(--color-red-50)}.bg-red-100{background-color:var(--color-red-100)}.bg-slate-900{background-color:var(--color-slate-900)}.bg-slate-950{background-color:var(--color-slate-950)}.bg-stone-50{background-color:var(--color-stone-50)}.bg-stone-100{background-color:var(--color-stone-100)}.bg-stone-200{background-color:var(--color-stone-200)}.bg-stone-300{background-color:var(--color-stone-300)}.bg-white{background-color:var(--color-white)}.object-contain{object-fit:contain}.p-0{padding:0}.p-1\.5{padding:calc(var(--spacing) * 1.5)}.p-2{padding:calc(var(--spacing) * 2)}.p-3{padding:calc(var(--spacing) * 3)}.p-4{padding:calc(var(--spacing) * 4)}.p-5{padding:calc(var(--spacing) * 5)}.p-6{padding:calc(var(--spacing) * 6)}.p-8{padding:calc(var(--spacing) * 8)}.px-1\.5{padding-inline:calc(var(--spacing) * 1.5)}.px-2{padding-inline:calc(var(--spacing) * 2)}.px-2\.5{padding-inline:calc(var(--spacing) * 2.5)}.px-3{padding-inline:calc(var(--spacing) * 3)}.px-4{padding-inline:calc(var(--spacing) * 4)}.px-5{padding-inline:calc(var(--spacing) * 5)}.px-6{padding-inline:calc(var(--spacing) * 6)}.py-0\.5{padding-block:calc(var(--spacing) * .5)}.py-1{padding-block:var(--spacing)}.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-3\.5{padding-block:calc(var(--spacing) * 3.5)}.py-4{padding-block:calc(var(--spacing) * 4)}.py-6{padding-block:calc(var(--spacing) * 6)}.py-8{padding-block:calc(var(--spacing) * 8)}.py-16{padding-block:calc(var(--spacing) * 16)}.py-20{padding-block:calc(var(--spacing) * 20)}.pt-1{padding-top:var(--spacing)}.pt-5{padding-top:calc(var(--spacing) * 5)}.pr-28{padding-right:calc(var(--spacing) * 28)}.pb-3{padding-bottom:calc(var(--spacing) * 3)}.pb-5{padding-bottom:calc(var(--spacing) * 5)}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.font-mono{font-family:var(--font-mono)}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.text-3xl{font-size:var(--text-3xl);line-height:var(--tw-leading,var(--text-3xl--line-height))}.text-5xl{font-size:var(--text-5xl);line-height:var(--tw-leading,var(--text-5xl--line-height))}.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-xl{font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.text-\[10px\]{font-size:10px}.leading-5{--tw-leading:calc(var(--spacing) * 5);line-height:calc(var(--spacing) * 5)}.leading-7{--tw-leading:calc(var(--spacing) * 7);line-height:calc(var(--spacing) * 7)}.leading-8{--tw-leading:calc(var(--spacing) * 8);line-height:calc(var(--spacing) * 8)}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-normal{--tw-font-weight:var(--font-weight-normal);font-weight:var(--font-weight-normal)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-\[\.18em\]{--tw-tracking:.18em;letter-spacing:.18em}.tracking-tight{--tw-tracking:var(--tracking-tight);letter-spacing:var(--tracking-tight)}.tracking-wide{--tw-tracking:var(--tracking-wide);letter-spacing:var(--tracking-wide)}.break-words{overflow-wrap:break-word}.break-all{word-break:break-all}.whitespace-pre-wrap{white-space:pre-wrap}.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-amber-950{color:var(--color-amber-950)}.text-blue-800{color:var(--color-blue-800)}.text-factorize-600{color:var(--color-factorize-600)}.text-factorize-700{color:var(--color-factorize-700)}.text-green-700{color:var(--color-green-700)}.text-green-800{color:var(--color-green-800)}.text-orange-800{color:var(--color-orange-800)}.text-red-700{color:var(--color-red-700)}.text-red-800{color:var(--color-red-800)}.text-slate-100{color:var(--color-slate-100)}.text-slate-400{color:var(--color-slate-400)}.text-slate-500{color:var(--color-slate-500)}.text-slate-600{color:var(--color-slate-600)}.text-slate-700{color:var(--color-slate-700)}.text-slate-800{color:var(--color-slate-800)}.text-slate-950{color:var(--color-slate-950)}.text-white{color:var(--color-white)}.capitalize{text-transform:capitalize}.uppercase{text-transform:uppercase}.italic{font-style:italic}.underline{text-decoration-line:underline}.decoration-slate-400\/60{text-decoration-color:#9b928299}@supports (color:color-mix(in lab, red, red)){.decoration-slate-400\/60{-webkit-text-decoration-color:color-mix(in oklab, var(--color-slate-400) 60%, transparent);-webkit-text-decoration-color:color-mix(in oklab, var(--color-slate-400) 60%, transparent);text-decoration-color:color-mix(in oklab, var(--color-slate-400) 60%, transparent)}}.underline-offset-4{text-underline-offset:4px}.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.\[color-scheme\:light\]{color-scheme:light}.shadow-2xl{--tw-shadow:0 25px 50px -12px var(--tw-shadow-color,#00000040);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-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)}.shadow-xl{--tw-shadow:0 20px 25px -5px var(--tw-shadow-color,#0000001a), 0 8px 10px -6px 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-2{--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)}.ring-4{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(4px + 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-blue-200{--tw-ring-color:var(--color-blue-200)}.ring-stone-200{--tw-ring-color:var(--color-stone-200)}.blur{--tw-blur:blur(8px);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,)}.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,)}.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}@media (hover:hover){.group-hover\:border-factorize-500:is(:where(.group):hover *){border-color:var(--color-factorize-500)}.group-hover\:text-slate-950:is(:where(.group):hover *){color:var(--color-slate-950)}}.backdrop\:bg-slate-950\/50::backdrop{background-color:#15141080}@supports (color:color-mix(in lab, red, red)){.backdrop\:bg-slate-950\/50::backdrop{background-color:color-mix(in oklab, var(--color-slate-950) 50%, transparent)}}.backdrop\:bg-slate-950\/60::backdrop{background-color:#15141099}@supports (color:color-mix(in lab, red, red)){.backdrop\:bg-slate-950\/60::backdrop{background-color:color-mix(in oklab, var(--color-slate-950) 60%, transparent)}}@media (hover:hover){.hover\:-translate-y-0\.5:hover{--tw-translate-y:calc(var(--spacing) * -.5);translate:var(--tw-translate-x) var(--tw-translate-y)}.hover\:border-stone-300:hover{border-color:var(--color-stone-300)}.hover\:bg-red-50:hover{background-color:var(--color-red-50)}.hover\:bg-slate-800:hover{background-color:var(--color-slate-800)}.hover\:bg-stone-50:hover{background-color:var(--color-stone-50)}.hover\:bg-stone-100:hover{background-color:var(--color-stone-100)}.hover\:text-factorize-700:hover{color:var(--color-factorize-700)}.hover\:text-red-700:hover{color:var(--color-red-700)}.hover\:text-slate-500:hover{color:var(--color-slate-500)}.hover\:text-slate-700:hover{color:var(--color-slate-700)}.hover\:text-slate-950:hover{color:var(--color-slate-950)}.hover\:shadow-md:hover{--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)}}.focus\:ring-factorize-600:focus{--tw-ring-color:var(--color-factorize-600)}.focus-visible\:ring-2:focus-visible{--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-visible\:ring-factorize-500:focus-visible{--tw-ring-color:var(--color-factorize-500)}.focus-visible\:ring-factorize-600:focus-visible{--tw-ring-color:var(--color-factorize-600)}.focus-visible\:ring-red-500:focus-visible{--tw-ring-color:var(--color-red-500)}.focus-visible\:ring-offset-2:focus-visible{--tw-ring-offset-width:2px;--tw-ring-offset-shadow:var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color)}.focus-visible\:outline-none:focus-visible{--tw-outline-style:none;outline-style:none}.focus-visible\:ring-inset:focus-visible{--tw-ring-inset:inset}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:cursor-wait:disabled{cursor:wait}.disabled\:opacity-50:disabled{opacity:.5}.disabled\:opacity-60:disabled{opacity:.6}.aria-\[current\=page\]\:bg-stone-100[aria-current=page]{background-color:var(--color-stone-100)}.aria-\[current\=page\]\:font-semibold[aria-current=page]{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.aria-\[current\=page\]\:text-slate-950[aria-current=page]{color:var(--color-slate-950)}.aria-\[current\=page\]\:underline[aria-current=page]{text-decoration-line:underline}.aria-\[current\=page\]\:underline-offset-8[aria-current=page]{text-underline-offset:8px}@media (min-width:40rem){.sm\:col-span-2{grid-column:span 2/span 2}.sm\:mt-2{margin-top:calc(var(--spacing) * 2)}.sm\:mt-5{margin-top:calc(var(--spacing) * 5)}.sm\:mt-8{margin-top:calc(var(--spacing) * 8)}.sm\:inline{display:inline}.sm\:w-56{width:calc(var(--spacing) * 56)}.sm\:w-auto{width:auto}.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.sm\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.sm\:grid-cols-\[8rem_minmax\(0\,1fr\)\]{grid-template-columns:8rem minmax(0,1fr)}.sm\:grid-cols-\[minmax\(0\,1fr\)_auto\]{grid-template-columns:minmax(0,1fr) auto}.sm\:grid-cols-\[minmax\(0\,1fr\)_minmax\(0\,1\.4fr\)_auto\]{grid-template-columns:minmax(0,1fr) minmax(0,1.4fr) auto}.sm\:flex-row{flex-direction:row}.sm\:items-end{align-items:flex-end}.sm\:items-start{align-items:flex-start}.sm\:justify-between{justify-content:space-between}.sm\:justify-end{justify-content:flex-end}.sm\:gap-4{gap:calc(var(--spacing) * 4)}.sm\:p-6{padding:calc(var(--spacing) * 6)}.sm\:p-8{padding:calc(var(--spacing) * 8)}.sm\:p-10{padding:calc(var(--spacing) * 10)}.sm\:px-5{padding-inline:calc(var(--spacing) * 5)}.sm\:py-3{padding-block:calc(var(--spacing) * 3)}.sm\:py-12{padding-block:calc(var(--spacing) * 12)}.sm\:py-28{padding-block:calc(var(--spacing) * 28)}.sm\:text-4xl{font-size:var(--text-4xl);line-height:var(--tw-leading,var(--text-4xl--line-height))}.sm\:text-7xl{font-size:var(--text-7xl);line-height:var(--tw-leading,var(--text-7xl--line-height))}.sm\:text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}}@media (min-width:48rem){.md\:mb-1{margin-bottom:var(--spacing)}.md\:block{display:block}.md\:grid-cols-\[13rem_minmax\(0\,1fr\)\]{grid-template-columns:13rem minmax(0,1fr)}.md\:gap-10{gap:calc(var(--spacing) * 10)}.md\:border-b-0{border-bottom-style:var(--tw-border-style);border-bottom-width:0}.md\:pb-0{padding-bottom:0}}@media (min-width:64rem){.lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.lg\:px-8{padding-inline:calc(var(--spacing) * 8)}}:where(.dark\:divide-slate-800:where(.dark,.dark *)>:not(:last-child)){border-color:var(--color-slate-800)}.dark\:border-amber-700:where(.dark,.dark *){border-color:var(--color-amber-700)}.dark\:border-amber-800:where(.dark,.dark *){border-color:var(--color-amber-800)}.dark\:border-red-900:where(.dark,.dark *){border-color:var(--color-red-900)}.dark\:border-slate-700:where(.dark,.dark *){border-color:var(--color-slate-700)}.dark\:border-slate-800:where(.dark,.dark *){border-color:var(--color-slate-800)}.dark\:bg-amber-950:where(.dark,.dark *){background-color:var(--color-amber-950)}.dark\:bg-amber-950\/30:where(.dark,.dark *){background-color:#4619014d}@supports (color:color-mix(in lab, red, red)){.dark\:bg-amber-950\/30:where(.dark,.dark *){background-color:color-mix(in oklab, var(--color-amber-950) 30%, transparent)}}.dark\:bg-blue-950:where(.dark,.dark *){background-color:var(--color-blue-950)}.dark\:bg-factorize-500\/20:where(.dark,.dark *){background-color:#fdc90133}@supports (color:color-mix(in lab, red, red)){.dark\:bg-factorize-500\/20:where(.dark,.dark *){background-color:color-mix(in oklab, var(--color-factorize-500) 20%, transparent)}}.dark\:bg-factorize-500\/50:where(.dark,.dark *){background-color:#fdc90180}@supports (color:color-mix(in lab, red, red)){.dark\:bg-factorize-500\/50:where(.dark,.dark *){background-color:color-mix(in oklab, var(--color-factorize-500) 50%, transparent)}}.dark\:bg-green-950:where(.dark,.dark *){background-color:var(--color-green-950)}.dark\:bg-orange-950:where(.dark,.dark *){background-color:var(--color-orange-950)}.dark\:bg-red-950:where(.dark,.dark *){background-color:var(--color-red-950)}.dark\:bg-red-950\/40:where(.dark,.dark *){background-color:#46080966}@supports (color:color-mix(in lab, red, red)){.dark\:bg-red-950\/40:where(.dark,.dark *){background-color:color-mix(in oklab, var(--color-red-950) 40%, transparent)}}.dark\:bg-slate-600:where(.dark,.dark *){background-color:var(--color-slate-600)}.dark\:bg-slate-700:where(.dark,.dark *){background-color:var(--color-slate-700)}.dark\:bg-slate-800:where(.dark,.dark *){background-color:var(--color-slate-800)}.dark\:bg-slate-900:where(.dark,.dark *){background-color:var(--color-slate-900)}.dark\:bg-slate-950:where(.dark,.dark *){background-color:var(--color-slate-950)}.dark\:bg-white:where(.dark,.dark *){background-color:var(--color-white)}.dark\:text-amber-100:where(.dark,.dark *){color:var(--color-amber-100)}.dark\:text-amber-200:where(.dark,.dark *){color:var(--color-amber-200)}.dark\:text-amber-300:where(.dark,.dark *){color:var(--color-amber-300)}.dark\:text-blue-200:where(.dark,.dark *){color:var(--color-blue-200)}.dark\:text-factorize-100:where(.dark,.dark *){color:var(--color-factorize-100)}.dark\:text-green-200:where(.dark,.dark *){color:var(--color-green-200)}.dark\:text-green-300:where(.dark,.dark *){color:var(--color-green-300)}.dark\:text-orange-200:where(.dark,.dark *){color:var(--color-orange-200)}.dark\:text-red-200:where(.dark,.dark *){color:var(--color-red-200)}.dark\:text-red-300:where(.dark,.dark *){color:var(--color-red-300)}.dark\:text-slate-100:where(.dark,.dark *){color:var(--color-slate-100)}.dark\:text-slate-200:where(.dark,.dark *){color:var(--color-slate-200)}.dark\:text-slate-300:where(.dark,.dark *){color:var(--color-slate-300)}.dark\:text-slate-400:where(.dark,.dark *){color:var(--color-slate-400)}.dark\:text-slate-500:where(.dark,.dark *){color:var(--color-slate-500)}.dark\:text-slate-950:where(.dark,.dark *){color:var(--color-slate-950)}.dark\:text-white:where(.dark,.dark *){color:var(--color-white)}.dark\:decoration-slate-500\/60:where(.dark,.dark *){text-decoration-color:#71695e99}@supports (color:color-mix(in lab, red, red)){.dark\:decoration-slate-500\/60:where(.dark,.dark *){-webkit-text-decoration-color:color-mix(in oklab, var(--color-slate-500) 60%, transparent);-webkit-text-decoration-color:color-mix(in oklab, var(--color-slate-500) 60%, transparent);text-decoration-color:color-mix(in oklab, var(--color-slate-500) 60%, transparent)}}.dark\:\[color-scheme\:dark\]:where(.dark,.dark *){color-scheme:dark}.dark\:ring-blue-900:where(.dark,.dark *){--tw-ring-color:var(--color-blue-900)}.dark\:ring-slate-800:where(.dark,.dark *){--tw-ring-color:var(--color-slate-800)}@media (hover:hover){.dark\:hover\:border-slate-700:where(.dark,.dark *):hover{border-color:var(--color-slate-700)}.dark\:hover\:bg-red-950\/50:where(.dark,.dark *):hover{background-color:#46080980}@supports (color:color-mix(in lab, red, red)){.dark\:hover\:bg-red-950\/50:where(.dark,.dark *):hover{background-color:color-mix(in oklab, var(--color-red-950) 50%, transparent)}}.dark\:hover\:bg-slate-200:where(.dark,.dark *):hover{background-color:var(--color-slate-200)}.dark\:hover\:bg-slate-800:where(.dark,.dark *):hover{background-color:var(--color-slate-800)}.dark\:hover\:text-red-300:where(.dark,.dark *):hover{color:var(--color-red-300)}.dark\:hover\:text-slate-200:where(.dark,.dark *):hover{color:var(--color-slate-200)}.dark\:hover\:text-white:where(.dark,.dark *):hover{color:var(--color-white)}}.dark\:focus-visible\:ring-offset-slate-900:where(.dark,.dark *):focus-visible{--tw-ring-offset-color:var(--color-slate-900)}.dark\:focus-visible\:ring-offset-slate-950:where(.dark,.dark *):focus-visible{--tw-ring-offset-color:var(--color-slate-950)}.dark\:aria-\[current\=page\]\:bg-slate-800:where(.dark,.dark *)[aria-current=page]{background-color:var(--color-slate-800)}.dark\:aria-\[current\=page\]\:text-white:where(.dark,.dark *)[aria-current=page]{color:var(--color-white)}.\[\&\:\:-webkit-details-marker\]\:hidden::-webkit-details-marker{display:none}.\[\&\>a\]\:w-full>a,.\[\&\>button\]\:w-full>button{width:100%}#job-detail>div.mt-6>div:last-child>:is(button,a){border-radius:.5rem;min-height:2.5rem;padding:.5rem .75rem}}@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-tracking{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:"";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:"";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:"";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-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:"";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@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} \ No newline at end of file diff --git a/packages/app/src/tailwind.css b/packages/app/src/tailwind.css index 4b75666..25e353e 100644 --- a/packages/app/src/tailwind.css +++ b/packages/app/src/tailwind.css @@ -147,3 +147,50 @@ } } } + +/* Trace surfaces and token colors follow the existing theme toggle. */ +@layer components { + .trace-list { --trace-surface: #f6f3e9; --trace-border: #e6e0d1; --trace-muted: #71695e; --trace-accent: #705000; --trace-code: #fcfbf6; color: #201e1a; } + .dark .trace-list { --trace-surface: #2c2924; --trace-border: #403b34; --trace-muted: #b2a897; --trace-accent: #f4d36c; --trace-code: #151410; color: #f5f1e8; } + .trace-list > * + * { margin-top: 1rem; } + .trace-message { min-width: 0; padding: 1rem 0; } + .trace-message h3 { color: var(--trace-accent); font-size: .7rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; margin-bottom: .65rem; } + .trace-user_message { border-left: 3px solid var(--trace-accent); background: var(--trace-surface); padding: 1rem 1.25rem; border-radius: 0 .6rem .6rem 0; } + .trace-prose { font-size: .875rem; line-height: 1.75; overflow-wrap: anywhere; } + .trace-line { white-space: pre-wrap; } + .trace-prose h4 { font-weight: 700; margin: .75rem 0 .25rem; } + .trace-prose code { background: var(--trace-surface); padding: .1rem .3rem; border-radius: .25rem; font-size: .85em; } + .trace-bullet { padding-left: 1.25rem; position: relative; } + .trace-bullet::before { content: '•'; position: absolute; left: .25rem; color: var(--trace-muted); } + .trace-event, .trace-structured { min-width: 0; border: 1px solid var(--trace-border); border-radius: .6rem; overflow: hidden; } + .trace-event summary, .trace-structured summary { cursor: pointer; padding: .75rem 1rem; font-size: .8rem; overflow-wrap: anywhere; } + .trace-event summary:focus-visible, .trace-structured summary:focus-visible { outline: 2px solid var(--trace-accent); outline-offset: -2px; } + .trace-event summary { background: var(--trace-surface); } + .trace-event-kind { display: inline-block; color: var(--trace-muted); font-size: .65rem; text-transform: uppercase; letter-spacing: .04em; margin-right: .75rem; } + .trace-meta { border-style: dashed; } + .trace-error { border-color: #dc2626; } + .trace-warning { border-color: #b7791f; } + .trace-structured { margin: .75rem 0; } + .trace-structured > div { padding: 0 1rem 1rem; } + .trace-code { min-width: 0; background: var(--trace-code); } + .trace-prose .trace-code { margin: .75rem 0; border: 1px solid var(--trace-border); border-radius: .5rem; overflow: hidden; } + .trace-code-label { padding: .4rem 1rem; border-bottom: 1px solid var(--trace-border); color: var(--trace-muted); font: 600 .65rem var(--font-mono); } + .trace-code pre { margin: 0; padding: 1rem; max-height: 24rem; overflow: auto; white-space: pre; font: .75rem/1.7 var(--font-mono); tab-size: 2; } + .trace-code code { background: none; padding: 0; font-size: inherit; } + .trace-token-keyword { color: #7e22ce; } + .trace-token-string { color: #166534; } + .trace-token-comment { color: #71695e; font-style: italic; } + .trace-token-number, .trace-token-variable { color: #075985; } + .dark .trace-token-keyword { color: #d8b4fe; } + .dark .trace-token-string { color: #86efac; } + .dark .trace-token-comment { color: #b2a897; } + .dark .trace-token-number, .dark .trace-token-variable { color: #7dd3fc; } + .trace-thinking { display: flex; align-items: center; gap: .5rem; color: var(--trace-muted); font-size: .8rem; padding: .25rem 0; } + .trace-spinner { width: .8rem; height: .8rem; border: 2px solid var(--trace-border); border-top-color: var(--trace-accent); border-radius: 50%; } + .trace-thinking-live { display: none; } + .trace-running .trace-at-end > .trace-thinking:last-child .trace-spinner { animation: trace-spin 1s linear infinite; } + .trace-running .trace-at-end > .trace-thinking:last-child .trace-thinking-live { display: inline; } + .trace-running .trace-at-end > .trace-thinking:last-child .trace-thinking-past { display: none; } + @keyframes trace-spin { to { transform: rotate(360deg); } } + @media (prefers-reduced-motion: reduce) { .trace-running .trace-at-end > .trace-thinking:last-child .trace-spinner { animation: none; } } +} diff --git a/packages/app/src/trace-presentation.ts b/packages/app/src/trace-presentation.ts new file mode 100644 index 0000000..142d2d8 --- /dev/null +++ b/packages/app/src/trace-presentation.ts @@ -0,0 +1,49 @@ +/** Browser-only presentation, shared verbatim with tests. No runtime dependencies. + * Each bounded preview is scanned once; previously appended events are never re-rendered. + * This deliberately supports a small Markdown/XML subset, never arbitrary HTML. + */ +export const tracePresentationBrowserSource = String.raw` +const traceEscape=value=>String(value??'').replace(/[&<>"']/g,c=>({'&':'&','<':'<','>':'>','"':'"',"'":'''}[c])); +const traceHighlight=(source,language='')=>{ + const text=String(source),shell=/^(sh|bash|shell|zsh|console)$/.test(language),supported=shell||/^(js|javascript|ts|typescript|jsx|tsx|json|python|py|sql|css)$/.test(language); + if(!supported)return traceEscape(text); + const tokens=/"(?:[^"\\]|\\[\s\S])*(?:"|$)|'(?:[^'\\]|\\[\s\S])*(?:'|$)|#[^\n]*|\/\/[^\n]*|\$[A-Za-z_][A-Za-z_0-9]*|\b\d+(?:\.\d+)?\b|[A-Za-z_][A-Za-z_0-9]*|[^\w"'#$/]+|[\s\S]/g; + const keywords=new Set((shell?'if then else elif fi for in do done case esac function export local cd echo printf cat rg git npm curl sudo set exit': 'const let var function return async await import export from class new if else for while try catch throw true false null undefined def in and or not None True False select from where insert into values').split(' ')); + return Array.from(text.matchAll(tokens),match=>{const token=match[0],kind=/^["']/.test(token)?'string':(shell?token[0]==='#':token.startsWith('//')||((language==='py'||language==='python')&&token[0]==='#'))?'comment':token[0]==='$'?'variable':/^\d/.test(token)?'number':keywords.has(token)?'keyword':'';return kind?''+traceEscape(token)+'':traceEscape(token)}).join(''); +}; +const traceCode=(text,language='')=>'
'+(language?'
'+traceEscape(language)+'
':'')+'
'+traceHighlight(text,language)+'
'; +const traceInline=text=>{ + const parts=text.split(/(\x60|\*\*)/),out=[];let code=false,bold=false; + const counts=parts.reduce((counts,part)=>{if(part==='\x60'||part==='**')counts[part]++;return counts},{'\x60':0,'**':0}); + for(const part of parts){if(part==='\x60'){counts[part]--;if(code||counts[part]>0){out.push(code?'':'');code=!code}else out.push(part)}else if(part==='**'&&!code){counts[part]--;if(bold||counts[part]>0){out.push(bold?'':'');bold=!bold}else out.push(part)}else out.push(traceEscape(part))} + if(code)out.push('');if(bold)out.push('');return out.join(''); +}; +const traceContent=input=>{ + const lines=String(input).split(/\r?\n/),out=[];let fence='',language='',code=[],structured=''; + const labels={task:'Task',instructions:'Instructions',environment_context:'Environment',system_reminder:'System reminder','system-reminder':'System reminder',INSTRUCTIONS:'Instructions',context:'Context'}; + for(const line of lines){ + const marker=line.match(/^\s*(\x60{3,}|~{3,})([^\s]*)\s*$/); + if(fence){if(marker&&marker[1][0]===fence[0]&&marker[1].length>=fence.length&&!marker[2]){out.push(traceCode(code.join('\n'),language));fence='';code=[]}else code.push(line);continue} + if(marker){fence=marker[1];language=marker[2].toLowerCase();continue} + const tag=line.trim().match(/^<(\/?)([\w-]+)>$/); + if(tag&&Object.hasOwn(labels,tag[2])){if(!structured&&!tag[1]){structured=tag[2];out.push('
'+labels[structured]+'
');continue}if(structured===tag[2]&&tag[1]){out.push('
');structured='';continue}} + const heading=line.match(/^#{1,6} (.*)$/),bullet=line.match(/^(?:[-*] |\d+\. )(.*)$/); + out.push(heading?'

'+traceInline(heading[1])+'

':bullet?'
'+traceInline(bullet[1])+'
':'
'+(traceInline(line)||'
')+'
'); + } + if(fence)out.push(traceCode(code.join('\n'),language));if(structured)out.push('');return out.join(''); +}; +const traceCard=e=>{ + const type=e.type,title=traceEscape(e.title),preview=String(e.preview||'').slice(0,32768); + if(type==='reasoning')return '
Thinking…Thought
'; + if(type==='user_message'||type==='assistant_message')return '

'+ (type==='user_message'?'You':'Assistant')+'

'+traceContent(preview)+'
'; + const tool=['tool_call','tool_result','command','file_change'].includes(type); + let content=traceCode(preview); + if(type==='tool_call'){ + let args;try{args=JSON.parse(preview)}catch{} + if(args&&typeof args==='object'&&!Array.isArray(args)){const command=args.command??args.cmd;content=typeof command==='string'?traceCode(command,'sh')+(Object.keys(args).length>1?traceCode(JSON.stringify(args,null,2),'json'):''):traceCode(JSON.stringify(args,null,2),'json')}else content=traceCode(preview,'json'); + } + if(type==='command')content=traceCode(e.title,'sh')+traceCode(preview); + const kind=tool?'tool':type==='error'?'error':type==='warning'?'warning':'meta'; + return '
'+traceEscape(type.replaceAll('_',' '))+''+title+''+content+'
'; +}; +`; diff --git a/packages/app/src/ui.ts b/packages/app/src/ui.ts index 735bb13..f407e74 100644 --- a/packages/app/src/ui.ts +++ b/packages/app/src/ui.ts @@ -1,6 +1,7 @@ /** Framework-light pages; Tailwind is compiled locally into public/styles.css. */ import { triggerContextCatalog } from "./trigger-context"; import { ansiToHtmlBrowserSource } from "./ansi"; +import { tracePresentationBrowserSource } from "./trace-presentation"; type Viewer = { email: string } | null; const escapeHtml = (value: string) => value.replace(/[&<>"']/g, (char) => ({ "&": "&", "<": "<", ">": ">", '"': """, "'": "'" })[char]!); @@ -182,14 +183,13 @@ async function load(){clearInterval(elapsedTimer);const [j,runs]=await Promise.a export const jobRunPage = (viewer: { email: string }, runId: string) => shell("Run — Factorize", viewer, `

Loading run…

`, `${uiHelpers} const root=$('#run-detail'),id=root.dataset.id,activeStates=['queued','starting','running','blocked','stopping'];let refreshTimer,elapsedTimer,traceCursor=0,traceDone=false; -const traceStyle={user_message:'border-amber-300 bg-amber-50 dark:border-amber-900 dark:bg-amber-950/30',assistant_message:'border-emerald-300 bg-emerald-50 dark:border-emerald-900 dark:bg-emerald-950/30',reasoning:'border-violet-300 bg-violet-50 dark:border-violet-900 dark:bg-violet-950/30',tool_call:'border-sky-300 bg-sky-50 dark:border-sky-900 dark:bg-sky-950/30',tool_result:'border-cyan-300 bg-cyan-50 dark:border-cyan-900 dark:bg-cyan-950/30',command:'border-slate-400 bg-slate-950 text-slate-100',error:'border-red-400 bg-red-50 dark:bg-red-950/30',warning:'border-orange-300 bg-orange-50 dark:bg-orange-950/30'}; -function traceCard(e){return '

'+esc(e.title)+'

'+esc(e.type.replaceAll('_',' '))+'
'+esc(e.preview||'')+'
'} -async function loadTrace(reset=false){if(reset){traceCursor=0;traceDone=false;const list=$('[data-run-trace]');if(list)list.innerHTML=''}if(traceDone)return;const page=await request('/api/v1/runs/'+encodeURIComponent(id)+'/trace?after='+traceCursor+'&limit=100'),list=$('[data-run-trace]');if(!list)return;list.insertAdjacentHTML('beforeend',page.items.map(traceCard).join(''));if(page.items.length)traceCursor=page.items.at(-1).sequence;traceDone=!page.nextCursor;const more=$('[data-trace-more]');if(more)more.classList.toggle('hidden',traceDone);const empty=$('[data-trace-empty]');if(empty)empty.classList.toggle('hidden',Boolean(list.children.length))} +${tracePresentationBrowserSource} +async function loadTrace(reset=false){if(reset){traceCursor=0;traceDone=false;const list=$('[data-run-trace]');if(list)list.innerHTML=''}if(traceDone)return;const page=await request('/api/v1/runs/'+encodeURIComponent(id)+'/trace?after='+traceCursor+'&limit=100'),list=$('[data-run-trace]');if(!list)return;list.insertAdjacentHTML('beforeend',page.items.map(traceCard).join(''));list.classList.toggle('trace-at-end',!page.nextCursor);if(page.items.length)traceCursor=page.items.at(-1).sequence;traceDone=!page.nextCursor;const more=$('[data-trace-more]');if(more)more.classList.toggle('hidden',traceDone);const empty=$('[data-trace-empty]');if(empty)empty.classList.toggle('hidden',Boolean(list.children.length))} function elapsed(r){const start=new Date(r.created_at).getTime(),end=activeStates.includes(r.state)?Date.now():new Date(r.updated_at||r.created_at).getTime(),seconds=Math.max(0,Math.floor((end-start)/1000)),hours=Math.floor(seconds/3600),minutes=Math.floor(seconds%3600/60),remainder=seconds%60;return(hours?hours+'h ':'')+(minutes||hours?minutes+'m ':'')+remainder+'s elapsed'} function updateElapsed(r){const label=$('[data-run-elapsed]');if(label)label.textContent=elapsed(r);clearInterval(elapsedTimer);if(activeStates.includes(r.state))elapsedTimer=setInterval(()=>{const current=$('[data-run-elapsed]');if(current)current.textContent=elapsed(r)},1000)} -function scheduleRefresh(r){clearTimeout(refreshTimer);if(activeStates.includes(r.state))refreshTimer=setTimeout(refreshOutput,3000)} +function scheduleRefresh(r){root.classList.toggle('trace-running',r.state==='running');clearTimeout(refreshTimer);if(activeStates.includes(r.state))refreshTimer=setTimeout(refreshOutput,3000)} async function refreshOutput(){try{const r=await request('/api/v1/runs/'+encodeURIComponent(id)),state=$('[data-run-state]');if(state)state.innerHTML=stateBadge(r.state);traceDone=false;await loadTrace();updateElapsed(r);scheduleRefresh(r)}catch{refreshTimer=setTimeout(refreshOutput,5000)}} -request('/api/v1/runs/'+encodeURIComponent(id)).then(async r=>({r,j:await request('/api/v1/jobs/'+encodeURIComponent(r.job_id))})).then(async({r,j})=>{const canKill=!['done','failed','stopped','succeeded'].includes(r.state),runLabel='Run '+r.id.slice(0,8);root.innerHTML='

'+esc(runLabel)+'

'+elapsed(r)+'

'+stateBadge(r.state)+''+(canKill?'':'')+'
Prompt
'+esc(r.prompt||'Prompt is not available for this run.')+'

Trace

Native '+esc(r.agent_kind||'agent')+' session · '+esc(r.artifact_state||'pending')+'

'+(activeStates.includes(r.state)?'Live · refreshes automatically':'')+'

Trace events are not available yet.

';if(canKill)$('#kill-run').onclick=async()=>{if(!confirm('Kill this run and release its concurrency slot?'))return;await request('/api/v1/runs/'+encodeURIComponent(id)+'/kill',{method:'POST'});location.reload()};$('[data-trace-more]').onclick=()=>{traceDone=false;loadTrace()};await loadTrace();updateElapsed(r);scheduleRefresh(r)}).catch(e=>root.innerHTML='

'+esc(e.message)+'

');`); +request('/api/v1/runs/'+encodeURIComponent(id)).then(async r=>({r,j:await request('/api/v1/jobs/'+encodeURIComponent(r.job_id))})).then(async({r,j})=>{const canKill=!['done','failed','stopped','succeeded'].includes(r.state),runLabel='Run '+r.id.slice(0,8);root.innerHTML='

'+esc(runLabel)+'

'+elapsed(r)+'

'+stateBadge(r.state)+''+(canKill?'':'')+'
Prompt
'+esc(r.prompt||'Prompt is not available for this run.')+'

Trace

Native '+esc(r.agent_kind||'agent')+' session · '+esc(r.artifact_state||'pending')+'

'+(activeStates.includes(r.state)?'Live · refreshes automatically':'')+'

Trace events are not available yet.

';if(canKill)$('#kill-run').onclick=async()=>{if(!confirm('Kill this run and release its concurrency slot?'))return;await request('/api/v1/runs/'+encodeURIComponent(id)+'/kill',{method:'POST'});location.reload()};$('[data-trace-more]').onclick=()=>{traceDone=false;loadTrace()};await loadTrace();updateElapsed(r);scheduleRefresh(r)}).catch(e=>root.innerHTML='

'+esc(e.message)+'

');`); const settingsLayout = (active: "integrations" | "api-keys", content: string) => `