PageSourceSearch

https://promptql.io/_next/static/chunks/pages/why-promptql-works.e8654221d75072c0.1790305017545.js

js promptql.io collected 2026-09-25 14:02:39 UTC 81,380 bytes, 1 lines download raw bytes

1(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[9901],{14501:function(e,r,t){(window.__NEXT_P=window.__NEXT_P||[]).push(["/why-promptql-works",function(){return t(23853)}])},41766:function(e,r,t){"use strict";t.d(r,{Z:function(){return v}});var n=t(85893),i=t(65500),a=t.n(i);t(67294);var s=t(78710),o=t(36013),l=t(41664),c=t.n(l),d=t(50756),p=t(67363);function x(e){let{title:r,description:t,cta:i,secondaryCta:a}=e;return(0,n.jsx)("div",{className:"px-6 py-10 md:py-20",children:(0,n.jsx)("div",{className:"max-w-[1060px] mx-auto",children:(0,n.jsxs)("div",{className:"w-full z-0 relative h-[388px] rounded-lg bg-[#1F212B] overflow-hidden",children:[(0,n.jsx)("img",{className:"absolute right-0 bottom-0 z-[0] hidden md:block max-w-[450px] md:max-w-[470px] lg:max-w-[620px]",src:"https://res.cloudinary.com/dh8fp23nd/image/upload/v1770653807/promptql-website/pre-footer-bg_omahz9.png",alt:"Pre Footer"}),(0,n.jsx)("img",{className:"absolute right-0 top-0 z-[0] md:hidden w-[400px]",src:"https://res.cloudinary.com/dh8fp23nd/image/upload/v1770658408/promptql-website/pre-footer-bg-mobile_b0ij1o.png",alt:"Pre Footer"}),(0,n.jsx)("div",{className:"flex items-end md:items-center h-full relative z-[1]",children:(0,n.jsxs)("div",{className:"py-8 md:py-12 lg:py-16 px-6 md:px-12 lg:px-16 gap-6 md:gap-6",children:[(0,n.jsxs)("div",{children:[(0,n.jsx)(p.Z,{textStyle:"h3",as:"h2",className:"text-white text-pretty !text-[32px] sm:!text-[40px] !leading-[36px] sm:!leading-[44px] !tracking-[-0.64px] sm:!tracking-[-0.8px] ".concat(t?"md:max-w-[422px]":"md:max-w-[392px]"),children:r}),t&&(0,n.jsx)(p.Z,{textStyle:"body1",as:"p",className:"max-w-[392px] text-[#F9FAFB] pt-2",children:t})]}),(0,n.jsxs)("div",{className:"flex items-center flex-wrap gap-4 sm:gap-6 pt-6 md:pt-6",children:[(0,n.jsx)(c(),{href:i.href,children:(0,n.jsx)(d.z,{variant:"primary-dark",className:"min-w-[175px] sm:min-w-[auto]",children:i.text})}),a&&(0,n.jsx)(c(),{href:a.href,children:(0,n.jsx)(d.z,{showIcon:!0,variant:"dark-bg-secondary-dark",className:"min-w-[175px] sm:min-w-[auto]",children:a.text})})]})]})})]})})})}var h=t(18191);function m(e){return(0,n.jsx)("div",{className:"px-6 pb-16 md:pb-20 overflow-hidden ".concat(e.bgClass?e.bgClass:""),children:(0,n.jsx)("div",{className:"max-w-[1060px] mx-auto",children:(0,n.jsxs)("div",{className:e.removeTrustedBrandsTopBorder?"w-full lg:pt-6":"w-full border-t border-[#E5E5E5] pt-16 md:pt-20",children:[(0,n.jsx)(p.Z,{textStyle:"eyebrow1",className:"text-[#6B7280] text-center",children:e.title}),e.brandLogos&&(0,n.jsx)("div",{className:"hidden md:flex items-center justify-between gap-6 sm:gap-8 pt-6 sm:pt-8 mx-auto ".concat(e.maxWidth?e.maxWidth:""),children:e.brandLogos.map((e,r)=>(0,n.jsx)("div",{className:"sm:flex-shrink-0",children:(0,n.jsx)("img",{src:e.imgSrc,alt:e.imgAlt})},r))}),(0,n.jsxs)("div",{className:"md:hidden -mx-6 relative pt-6",children:[(0,n.jsx)(h.Z,{logos:e.brandLogos,containerWidth:708}),(0,n.jsx)("div",{className:"pointer-events-none absolute inset-y-0 left-0 w-[10%] md:w-[15%] lg:w-1/4 bg-gradient-to-r"}),(0,n.jsx)("div",{className:"pointer-events-none absolute inset-y-0 right-0 w-[10%] md:w-[15%] lg:w-1/4 bg-gradient-to-l"})]})]})})})}var u=t(11163);function g(){let e=(0,u.useRouter)(),r="/"===e.pathname?"home":e.pathname.replace(/^\/([^/]+)\/(.+)$/,"/$1-$2").replace(/^\/+/,"").replace(/\//g,"-");return(0,n.jsx)("div",{className:"px-6 py-10 md:py-20",children:(0,n.jsx)("div",{className:"max-w-[1060px] mx-auto",children:(0,n.jsx)("div",{className:"w-full z-0 relative rounded-[12px] bg-[#1F212B] overflow-hidden",children:(0,n.jsx)("div",{className:"relative z-[1] py-12 md:py-16 lg:py-16 px-6 md:px-12 lg:px-16",children:(0,n.jsxs)("div",{className:"flex flex-col items-center text-center",children:[(0,n.jsx)("img",{src:"https://res.cloudinary.com/dh8fp23nd/image/upload/v1771343064/promptql-logo-neon_gyfmct.svg",alt:"PromptQL",className:"h-7 md:h-8 mb-4"}),(0,n.jsx)("p",{className:"text-[#9CA3AF] text-pretty text-base md:text-lg leading-relaxed max-w-[520px]",children:"AI Analyst for teams with shared context."}),(0,n.jsx)("div",{className:"mt-6 flex flex-col items-center gap-2",children:(0,n.jsx)(c(),{href:"https://prompt.ql.app/login?pg=".concat(r,"&cta=footer"),target:"_blank",rel:"noopener noreferrer",children:(0,n.jsx)(d.z,{variant:"primary-dark",className:"!rounded-[24px] px-6 py-3 whitespace-nowrap font-medium h-auto",children:"Get started"})})}),(0,n.jsxs)("p",{className:"text-[#6B7280] text-sm mt-6",children:["Prefer a guided walkthrough?"," ",(0,n.jsx)("br",{}),(0,n.jsx)(c(),{href:"/book-demo",className:"text-[#6CAF8C] underline underline-offset-4 hover:text-[#b6fc34] transition-colors",children:"Schedule a demo"})]})]})})})})})}let f={title:"See PromptQL in action on your data.",cta:{text:"Request demo",href:"/book-demo"},secondaryCta:{text:"Try playground",href:"/playground"}},b={title:"Trusted By",maxWidth:"sm:max-w-[780px]",brandLogos:[{imgSrc:"https://res.cloudinary.com/dh8fp23nd/image/upload/v1764173821/promptql-website/homepage/cisco_eocq69.svg",imgAlt:"Cisco",imgWidth:42},{imgSrc:"https://res.cloudinary.com/dh8fp23nd/image/upload/v1764173821/promptql-website/homepage/mcd_qulh5v.svg",imgAlt:"McD",imgWidth:28},{imgSrc:"https://res.cloudinary.com/dh8fp23nd/image/upload/v1764173821/promptql-website/homepage/instacart_akkage.svg",imgAlt:"Instacart",imgWidth:90},{imgSrc:"https://res.cloudinary.com/dh8fp23nd/image/upload/v1764173821/promptql-website/homepage/swiggy_qelros.svg",imgAlt:"Swiggy",imgWidth:100},{imgSrc:"https://res.cloudinary.com/dh8fp23nd/image/upload/v1764173821/promptql-website/homepage/lightspeed_py9ctb.svg",imgAlt:"Lightspeed",imgWidth:101}]};function v(e){let r=e.preFooterData||f;return(0,n.jsxs)("div",{className:"".concat(a().className," editorial-site"),children:[(0,n.jsx)("script",{dangerouslySetInnerHTML:{__html:"\n            document.documentElement.classList.remove('no-js');\n          "}}),(0,n.jsxs)("div",{className:"bg-paper text-ink",children:[(0,n.jsx)(s.Z,{isWithoutAnnouncementBanner:null==e?void 0:e.isWithoutAnnouncementBanner,btnBlack:e.btnBlack,dark:!1}),(0,n.jsx)("main",{children:e.children}),(0,n.jsx)("div",{className:"bg-paper",children:!e.removeFooter&&(0,n.jsxs)("footer",{children:[!e.removeTrustedBrands&&(0,n.jsx)(m,{...b,removeTrustedBrandsTopBorder:e.removeTrustedBrandsTopBorder}),e.addBorder&&e.isHomepagePreFooter?(0,n.jsxs)(n.Fragment,{children:[(0,n.jsx)(g,{...r}),(0,n.jsx)("div",{className:"border-t-[.75px] border-[#A3A3A3]",children:(0,n.jsx)("div",{className:"max-w-[1150px] mx-auto border-[#A3A3A3]",children:(0,n.jsx)(o.Z,{dark:!1})})}),(0,n.jsx)("div",{className:"border-t-[.75px] border-[#A3A3A3]"})]}):(0,n.jsxs)(n.Fragment,{children:[(null==e?void 0:e.isHomepagePreFooter)?(0,n.jsx)(g,{...r}):(0,n.jsx)(n.Fragment,{children:!e.removePrefooter&&(0,n.jsx)(x,{...r})}),(0,n.jsx)(o.Z,{dark:!1})]})]})})]})]})}},18191:function(e,r,t){"use strict";t.d(r,{Z:function(){return i}});var n=t(85893);function i(e){let r=3*e.containerWidth;return(0,n.jsxs)("div",{style:{width:r},className:"flex animate-marquee-fast",children:[(0,n.jsx)("div",{className:"flex justify-around items-center w-1/3",children:e.logos.map((e,r)=>(0,n.jsx)("div",{className:"px-6",children:(0,n.jsx)("img",{src:e.imgSrc,alt:e.imgAlt,className:"min-h-[40px] lg:min-h-[54px]"})},r))}),(0,n.jsx)("div",{className:"flex justify-around items-center w-1/3",children:e.logos.map((e,r)=>(0,n.jsx)("div",{className:"px-6",children:(0,n.jsx)("img",{src:e.imgSrc,alt:e.imgAlt,className:"min-h-[40px] lg:min-h-[54px]"})},r))}),(0,n.jsx)("div",{className:"flex justify-around items-center w-1/3",children:e.logos.map((e,r)=>(0,n.jsx)("div",{className:"px-6",children:(0,n.jsx)("img",{src:e.imgSrc,alt:e.imgAlt,className:"min-h-[40px] lg:min-h-[54px]"})},r))})]})}},97229:function(e,r,t){"use strict";t.d(r,{Z:function(){return a}});var n=t(85893),i=t(67363);function a(e){return(0,n.jsx)("div",{className:"px-6 pb-16 md:pb-16 lg:pb-24 ".concat(e.bgClass?e.bgClass:""),children:(0,n.jsx)("div",{className:"max-w-[1060px] mx-auto z-[1] relative",children:(0,n.jsxs)("div",{className:"w-full pt-16 md:pt-16 lg:pt-24",children:[e.tag&&(0,n.jsx)(i.Z,{textStyle:"eyebrow1",className:"text-[#6B7280] pb-2 md:pb-3",children:e.tag}),e.title&&(0,n.jsx)(i.Z,{textStyle:"section-title",as:"h2",className:"text-[#030712] pb-4",children:e.title}),e.description&&(0,n.jsx)(i.Z,{textStyle:"body1",as:"div",className:"text-[#374151] md:max-w-[620px]",children:e.description}),e.trustedIntelligenceArr&&(0,n.jsx)("div",{className:"grid grid-cols-1 md:grid-cols-3 gap-8 md:gap-6 lg:gap-8 pt-10 md:pt-12",children:e.trustedIntelligenceArr.map((e,r)=>(0,n.jsxs)("div",{className:"w-full",children:[(0,n.jsx)(i.Z,{textStyle:"eyebrow2",className:"pb-3 md:pb-4 text-[#6B7280]",children:e.tag}),e.imgSrc&&(0,n.jsx)("div",{className:"w-full",children:(0,n.jsx)("img",{src:e.imgSrc,alt:e.tag?e.tag:"image"})}),(0,n.jsx)(i.Z,{textStyle:"body2",as:"div",className:"whitespace-pre-line pt-4 md:pt-6 text-[#4B5563]",children:e.description})]},r))})]})})})}},23853:function(e,r,t){"use strict";t.r(r),t.d(r,{default:function(){return y}});var n=t(85893),i=t(2593),a=t(41766),s=t(67363),o=t(67294);function l(e){return(0,n.jsx)("div",{className:"px-6 bg-surface",children:(0,n.jsx)("div",{className:"max-w-[1150px] mx-auto",children:(0,n.jsx)("div",{className:"max-w-[1060px] mx-auto ".concat(e.addBorderTop?"border-t border-[#
1E5E5E5] pt-16 md:pt-24":"pt-16 md:pt-24"," ").concat(e.addBorderBottom?"border-b border-[#E5E5E5] pb-16 md:pb-24":"pb-16 md:pb-24"),children:(0,n.jsxs)("div",{className:"w-full",children:[e.tag&&(0,n.jsx)(s.Z,{textStyle:"eyebrow1",className:"text-[#6B7280] pb-2 md:pb-3",children:e.tag}),(0,n.jsx)(s.Z,{as:"h2",textStyle:"h4",className:"text-[#030712] mb-3 max-w-[800px]",children:e.title}),(0,n.jsx)(s.Z,{textStyle:"body1",className:"text-[#374151] ".concat(e.descriptionClass?e.descriptionClass:""),children:e.description}),e.featureList&&(0,n.jsx)("div",{className:"grid grid-cols-1 lg:grid-cols-3 bg-[#FFF] border border-[#E5E5E5] shadow-sm rounded-[12px] mt-12",children:e.featureList.map((e,r)=>(0,n.jsxs)("div",{className:"p-6 last:border-b-0 border-[#D5DADA]\n										".concat(e.borderBottom?"border-b lg:border-b":"border-b lg:border-b-0"," \n										").concat(e.borderRight?"lg:border-r":""),children:[(0,n.jsx)("div",{className:"mb-3",children:e.svgIcon}),(0,n.jsx)(s.Z,{textStyle:"body1",className:"text-[#030712] !font-medium mb-3",children:e.title}),(0,n.jsx)(s.Z,{textStyle:"body2",className:"text-[#3A3F50] leading-relaxed",children:e.description})]},r))})]})})})})}var c=t(97229);let d='SLA reviews should exclude shipments officially coded as "weather delay" to reflect controllable delivery performance.';function p(){let e=(0,o.useRef)(null),r=(0,o.useRef)(null),t=(0,o.useRef)(null),i=(0,o.useRef)(null),a=(0,o.useRef)(null),s=(0,o.useRef)(null),l=(0,o.useRef)(null),c=(0,o.useRef)(null),p=(0,o.useRef)(null),x=(0,o.useRef)(null),h=(0,o.useRef)(null),m=(0,o.useRef)(null),u=(0,o.useRef)(null),g=(0,o.useRef)(null),f=(0,o.useRef)(null),b=(0,o.useRef)(null),v=(0,o.useRef)(null),y=(0,o.useRef)(null),w=(0,o.useRef)(null),j=(0,o.useRef)(null),k=(0,o.useRef)(null),N=(0,o.useRef)(null),L=(0,o.useRef)(null),C=(0,o.useRef)(null),F=(0,o.useRef)(null),A=(0,o.useRef)(null),z=(0,o.useRef)(null),B=(0,o.useRef)(!1),S=(0,o.useRef)([]),E=(0,o.useCallback)(()=>{S.current.forEach(clearTimeout),S.current=[]},[]),_=(0,o.useCallback)((e,r)=>{let t=setTimeout(e,r);return S.current.push(t),t},[]),D=(0,o.useCallback)(r=>{let t=r.getBoundingClientRect(),n=e.current.getBoundingClientRect(),i=n.width/700;return{x:(t.left-n.left)/i+t.width/2/i,y:(t.top-n.top)/i+t.height/2/i}},[]),R=(0,o.useCallback)((e,r,t,n,i)=>{e.style.transition="left ".concat(n,"s cubic-bezier(0.25,0.1,0.25,1), top ").concat(n,"s cubic-bezier(0.25,0.1,0.25,1)"),requestAnimationFrame(()=>{e.style.left="".concat(r,"px"),e.style.top="".concat(t,"px")}),i&&_(i,1e3*n+50)},[_]),M=(0,o.useCallback)((e,r)=>{e.classList.add("clicking"),_(()=>{e.classList.remove("clicking"),null==r||r()},150)},[_]),P=(0,o.useCallback)((e,r,t,n)=>{B.current||(t<r.length?(e.value+=r.charAt(t),e.scrollTop=e.scrollHeight,_(()=>P(e,r,t+1,n),30+20*Math.random())):null==n||n())},[_]),W=(0,o.useCallback)(()=>{t.current.className="learn-card",r.current.className="chat-container",s.current.className="learn-wiki-page",p.current.textContent="PromptQL wants to learn",x.current.style.display="",c.current.classList.remove("active"),l.current.classList.remove("visible","clicking"),l.current.style.transition="none",i.current.style.transform="",i.current.querySelectorAll(".ripple").forEach(e=>e.remove()),m.current.classList.remove("visible","clicking"),u.current.classList.add("active"),g.current.classList.remove("active"),f.current.classList.remove("hidden"),b.current.classList.add("hidden"),v.current.style.display="",v.current.innerHTML=d,y.current.classList.add("hidden"),w.current.value=d,k.current.classList.remove("active"),k.current.style.display="none",N.current.classList.add("active"),C.current.classList.remove("show-tooltip"),F.current.classList.remove("show-tooltip"),A.current.classList.remove("show-tooltip"),z.current.classList.remove("visible")},[]),T=(0,o.useCallback)(()=>{if(B.current)return;W();let e=l.current,n=m.current;_(()=>{if(B.current)return;let{x:o,y:l}=D(i.current);e.style.transition="none",e.style.left="".concat(o+100,"px"),e.style.top="".concat(l+80,"px"),e.classList.add("visible"),R(e,o,l,1,()=>{B.current||M(e,()=>{if(B.current)return;let o=document.createElement("span");o.className="ripple",o.style.cssText="left:50%;
1top:50%;width:30px;height:30px;margin-left:-15px;margin-top:-15px;",i.current.appendChild(o),c.current.classList.add("active"),_(()=>{B.current||(t.current.classList.add("state-2"),p.current.textContent="Omar H. taught PromptQL",x.current.style.display="none",e.classList.remove("visible"),c.current.classList.remove("active"),c.current.offsetWidth,c.current.classList.add("active"),_(()=>{if(B.current)return;let{x:t,y:i}=D(a.current);e.style.transition="none",e.style.left="".concat(t+60,"px"),e.style.top="".concat(i+50,"px"),e.classList.add("visible"),R(e,t,i,.9),_(()=>{B.current||R(e,t,i,.1,()=>{B.current||M(e,()=>{B.current||(e.classList.remove("visible"),r.current.classList.add("hidden-chat"),s.current.classList.add("visible"),_(()=>{if(B.current)return;let{x:e,y:r}=D(g.current);n.style.transition="none",n.style.left="".concat(e+80,"px"),n.style.top="".concat(r+60,"px"),n.classList.add("visible"),R(n,e,r,.8,()=>{B.current||M(n,()=>{B.current||(u.current.classList.remove("active"),g.current.classList.add("active"),f.current.classList.add("hidden"),b.current.classList.remove("hidden"),_(()=>{if(B.current)return;let{x:e,y:r}=D(v.current);R(n,e,r,.7,()=>{B.current||M(n,()=>{B.current||(v.current.style.display="none",y.current.classList.remove("hidden"),n.classList.remove("visible"),_(()=>{B.current||P(w.current,"\n\nNote: Use delay_code = 'WEATHER' in the shipments.delay_reason column to filter weather-related delays.",0,()=>{B.current||_(()=>{if(B.current)return;let{x:e,y:r}=D(j.current);n.style.transition="none",n.style.left="".concat(e+40,"px"),n.style.top="".concat(r+30,"px"),n.classList.add("visible"),R(n,e,r,.5,()=>{B.current||M(n,()=>{B.current||(y.current.classList.add("hidden"),v.current.innerHTML='SLA reviews should exclude shipments officially coded as "weather delay" to reflect controllable delivery performance.<br><br><span class="wiki-diff-add">Note: Use delay_code = \'WEATHER\' in the shipments.delay_reason column to filter weather-related delays.</span>',v.current.style.display="",k.current.style.display="",k.current.classList.add("active"),N.current.classList.remove("active"),_(()=>{if(B.current)return;let{x:e,y:r}=D(C.current);R(n,e,r,.6,()=>{B.current||(C.current.classList.add("show-tooltip"),_(()=>{if(B.current)return;C.current.classList.remove("show-tooltip");let{x:e,y:r}=D(F.current);R(n,e,r,.5,()=>{B.current||(F.current.classList.add("show-tooltip"),_(()=>{if(B.current)return;F.current.classList.remove("show-tooltip");let{x:e,y:r}=D(A.current);R(n,e,r,.5,()=>{B.current||(A.current.classList.add("show-tooltip"),_(()=>{B.current||(A.current.classList.remove("show-tooltip"),n.classList.remove("visible"),s.current.classList.add("zooming-out"),_(()=>{B.current||(s.current.classList.remove("visible","zooming-out"),_(()=>{B.current||(z.current.classList.add("visible"),_(()=>{B.current||(z.current.classList.remove("visible"),_(()=>{B.current||T()},800))},4e3))},100))},500))},1200))})},1200))})},1200))})},600))})})},500)})},400))})})},800))})})},1500))})})},1e3)},1400))},550)})})},1100)},[W,_,D,R,M,P]);(0,o.useEffect)(()=>(T(),()=>E()),[T,E]);let I=(0,o.useCallback)(()=>{B.current=!B.current,h.current.classList.toggle("paused",B.current),B.current?E():T()},[T,E]);return(0,n.jsxs)(n.Fragment,{children:[(0,n.jsx)("style",{children:"\n        :root {\n          --color-surface-core-primary: #F6F6F6;\n          --color-surface-component-primary-default: #FFFFFF;\n          --color-surface-component-primary-hover: #F6F6F6;\n          --color-surface-component-base-default: #F6F6F6;\n          --color-surface-component-base-hover: #F0F0F0;\n          --color-surface-component-base-subtle-default: #E6E6E6;\n          --color-surface-component-contrast-strong-default: #242424;\n          --color-surface-accent-violet-strong-default: #7B51E4;\n          --color-surface-accent-violet-subtle-default: #E3DFF7;\n          --color-surface-semantic-success-outline-default: #FAFDF6;\n          --color-surface-semantic-success-strong-default: #439008;\n          --color-surface-semantic-info-outline-default: #F9FBFF;\n          --color-surface-semantic-info-outline-hover: #F4F7FE;\n          --color-surface-semantic-info-subtle-default: #DDE5F5;\n          --color-surface-semantic-info-subtle-hover: #C5D4F4;\n          --color-surface-semantic-warning-outline-default: #FCFBF1;\n\n          --color-text-hierarchy-title: #242424;\n          --color-text-hierarchy-body: #424242;\n          --color-text-hierarchy-support_text: #717171;\n          --color-text-hierarchy-contrast: #FFFFFF;\n          --color-text-hierarchy-link-default-default: #606060;\n          --color-text-hierarchy-link-default-hover: #242424;\n          --color-text-semantic-info-body: #3773EA;\n          --color-text-semantic-info-link-default: #3773EA;\n          --color-text-semantic-info-link-hover: #19459D;\n          --color-text-semantic-success-body: #439008;\n\n          --color-border-core-primary: #E6E6E6;\n          --color-border-component-primary-default: #E6E6E6;\n          --color-border-component-primary-hover: #D4D4D4;\n          --color-border-component-base-default: #E6E6E6;\n          --color-border-semantic-info-regular-default: #DDE5F5;\n          --color-border-semantic-info-regular-hover: #C5D4F4;\n          --color-border-semantic-info-strong-default: #3773EA;\n          --color-border-semantic-success-regular-default: #D8F3BF;\n          --color-border-semantic-brand-default: #D8F3BF;\n        }\n\n        /* ── Viewport container ── */\n        .wla-viewport-container {\n          width: 700px;\n          height: 700px;\n          padding: 10px;\n          background: #F6F6F6;\n          border-radius: 12px;\n          position: relative;\n          overflow: hidden;\n        }\n        .wla-viewport-inner {\n          width: 100%;\n          height: 680px;\n          border-radius: 8px;\n          overflow: hidden;\n          position: relative;\n        }\n        .wla-scale-wrapper {\n          position: absolute;\n          top: 0; left: 0;\n          width: 700px;\n          height: 1600px;\n          transform-origin: top left;\n          transform: scale(0.97);\n        }\n				@media (max-width: 640px) {\n					.wla-scale-wrapper {\n						width: 100%;\n					}\n				}\n        /* ── Chat container ── */\n        .chat-container {\n          max-width: 660px;\n          margin: 10px auto;\n          padding: 0 10px;\n          display: flex;\n          flex-direction: column;\n          gap: 24px;\n          transition: opacity 0.9s cubic-bezier(0.4,0,0.2,1);\n          transform-origin: center center;\n          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;\n          font-size: 14px;\n          color: var(--color-text-hierarchy-body);\n          background: var(--color-surface-core-primary);\n          padding-top: 32px;\n          padding-bottom: 32px;\n        }\n        .chat-container.hidden-chat {\n          opacity: 0;\n          pointer-events: none;\n          position: absolute;\n          top: 0; left: 0; right: 0;\n        }\n\n        /* ── Message ── */\n        .message-row { display: flex; gap: 12px; align-items: flex-start; }\n        .avatar {\n          width: 36px; height: 36px;\n          border-radius: 50%;\n          flex-shrink: 0;\n          overflow: hidden;\n          background: var(--color-surface-component-base-subtle-default);\n          object-fit: cover;\n          border: 1px solid var(--color-border-component-base-default);\n        }\n        .avatar.promptql {\n          border-radius: 8px;\n          border-color: var(--color-border-semantic-brand-default);\n          background: #242424;\n          padding: 8px;\n          object-fit: contain;\n        }\n        .message-content { flex: 1; min-width: 0; }\n        .message-header { display: flex; align-items: baseline; gap: 8px; margin-bottom: 4px; }\n        .sender-name { font-weight: 600; font-size: 14px; color: var(--color-text-hierarchy-title); }\n        .you-label { font-weight: 400; color: var(--color-text-hierarchy-support_text); font-size: 13px; }\n        .bubble {\n          background: var(--color-surface-component-base-default);\n          border-radius: 6px;\n          padding: 10px 14px;\n          font-size: 14px;\n          display: inline-block;\n          max-width: 100%;\n          color: var(--color-text-hierarchy-body);\n          line-height: 1.5;\n          border: 1px solid var(--color-border-component-base-default);\n        }\n        .mention {\n          padding: 1px 6px;\n          border-radius: 4px;\n          font-size: 13px;\n          font-weight: 600;\n          background: var(--color-surface-component-base-subtle-default);\n          color: var(--color-text-hierarchy-title);\n        }\n\n        /* ── PromptQL card ── */\n        .promptql-card {\n          background: var(--color-surface-component-primary-default);\n          border: 1px solid var(--color-border-component-primary-default);\n          border-radius: 8px;\n          padding: 16px 20px;\n          margin-top: 4px;\n        }\n        details.progress-steps > summary {\n          list-style: none;\n          display: flex;\n          align-items: center;\n          gap: 6px;\n          cursor: pointer;\n          font-size: 13px;\n          font-weight: 500;\n          color: var(--color-text-hierarchy-support_text);\n          padding: 2px 0;\n        }\n        details.progress-steps > summary::-webkit-details-marker { display: none; }\n        .progress-steps-toggle { transition: transform 0.15s ease; font-size: 11px; }\n        details.progress-steps[open] > summary .progress-steps-toggle { transform: rotate(90deg); }\n        .progress-steps-content { padding-left: 18px; padding-top: 4px; font-size: 13px; color: var(--color-text-hierarchy-support_text); line-height: 1.5; }\n        .step-item { padding: 2px 0; font-style: italic; }\n        .result-text { margin-top: 14px; font-size: 14px; line-height: 1.6; color: var(--color-text-hierarchy-body); }\n        .result-text strong { font-weight: 700; color: var(--color-text-hierarchy-title); }\n        .actions {\n          margin-top: 12px;\n          display: flex;\n          gap: 2px;\n          flex-wrap: wrap;\n          border-top: 1px solid var(--color-border-component-primary-default);\n          padding-top: 10px;\n        }\n        .action-btn {\n          display: inline-flex;\n          align-items: center;\n          gap: 6px;\n          padding: 6px 12px;\n          border: none;\n          background: none;\n          font-size: 13px;\n          font-weight: 500;\n          color: var(--color-text-hierarchy-link-default-default);\n          cursor: pointer;\n          border-radius: 6px;\n          transition: background 0.15s, color 0.15s;\n          font-family: inherit;\n        }\n        .action-btn:hover {\n          background: var(--color-surface-component-base-hover);\n          color: var(--color-text-hierarchy-link-default-hover);\n        }\n        .action-btn svg { width: 16px; height: 16px; flex-shrink: 0; }\n\n        /* ── Wiki animation container ── */\n        .wiki-animation-container {\n          width: 100%;\n          position: relative;\n          overflow: hidden;\n          border-radius: 8px;\n          margin-top: 8px;\n        }\n\n        /* ── Learn card ── */\n        .learn-card {\n          background: var(--color-surface-component-primary-default);\n          border: 1px solid var(--color-border-component-primary-default);\n          border-radius: 8px;\n          padding: 20px;\n          position: relative;\n          box-shadow: 0 1px 3px rgba(0,0,0,0.04);\n          transition: opacity 0.9s cubic-bezier(0.4,0,0.2,1);\n        }\n        .learn-card.hidden-card { opacity: 0; pointer-events: none; }\n        .learn-card-header { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; }\n        .learn-sparkle-icon { width: 28px; height: 28px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; }\n        .learn-sparkle-icon svg { width: 22px; height: 22px; }\n        .learn-header-text { flex: 1; min-width: 0; }\n        .learn-header-title {\n          font-size: 14px; font-weight: 600;\n          color: var(--color-text-hierarchy-title);\n          line-height: 1.3;\n          display: flex; align-items: center; gap: 6px;\n        }\n        .learn-check-badge { width: 18px; height: 18px; flex-shrink: 0; display: none; }\n        .learn-card.state-2 .learn-check-badge { display: inline-flex; }\n        .learn-spinner {\n          display: none;\n          width: 16px; height: 16px;\n          border: 2px solid var(--color-border-component-primary-default);\n          border-top-color: var(--color-surface-accent-violet-strong-default);\n          border-radius: 50%;\n          animation: learn-spin 0.8s linear infinite;\n          flex-shrink: 0;\n        }\n        .learn-card.state-loading .learn-sparkle-icon,\n        .learn-card.state-2 .learn-sparkle-icon { display: none; }\n        .learn-card.state-loading .learn-spinner { display: inline-block; }\n        @keyframes learn-spin { to { transform: rotate(360deg); } }\n        .learn-header-subtitle { font-size: 12px; color: var(--color-text-hierarchy-support_text); margin-top: 2px; line-height: 1.4; }\n        .learn-chevron-btn { background: none; border: none; cursor: pointer; padding: 4px; color: var(--color-text-hierarchy-support_text); flex-shrink: 0; }\n        .learn-chevron-btn svg { width: 16px; height: 16px; }\n\n        /* Content box */\n        .learn-content-box {\n          background: var(--color-surface-component-base-default);\n          border: 1px solid var(--color-border-component-base-default);\n          border-radius: 6px;\n          padding: 14px 16px;\n          margin-bottom: 14px;\n          transition: all 0.4s ease;\n        }\n        .learn-card.state-2 .learn-content-box,\n        .learn-card.state-loading .learn-content-box {\n          background: transparent; border: none; padding: 0 4px; margin-bottom: 6px;\n        }\n        .learn-bullet-text {\n          font-size: 13px; color: var(--color-text-hierarchy-body); line-height: 1.6;\n          padding-left: 16px; position: relative;\n        }\n        .learn-bullet-text::before {\n          content: '•'; position: absolute; left: 0; top: 0;\n          font-size: 14px; color: var(--color-text-hierarchy-body);\n        }\n\n        /* Actions */\n        .learn-actions { display: flex; align-items: center; gap: 12px; transition: opacity 0.3s ease; }\n        .learn-card.state-2 .learn-actions,\n        .learn-card.state-loading .learn-actions { opacity: 0; height: 0; overflow: hidden; margin: 0; }\n\n        .btn-add-wiki {\n          display: inline-flex; align-items: center; gap: 6px;\n          background: var(--color-surface-accent-violet-strong-default);\n          color: #fff; border: none; border-radius: 6px;\n          padding: 8px 14px; font-size: 13px; font-weight: 600;\n          font-family: inherit; cursor: pointer;\n          transition: background 0.2s ease, transform 0.15s ease;\n          position: relative; z-index: 2;\n        }\n        .btn-add-wiki:hover { background: var(--color-surface-accent-violet-subtle-default); color: #fff; }\n        .btn-add-wiki:active { transform: scale(0.97); }\n        .btn-add-wiki svg { width: 14px; height: 14px; }\n        .btn-add-wiki .ripple {\n          position: absolute; border-radius: 50%;\n          background: rgba(255,255,255,0.35);\n          transform: scale(0);\n          animation: learn-ripple-anim 0.5s ease-out;\n          pointer-events: none;\n        }\n        @keyframes learn-ripple-anim { to { transform: scale(3); opacity: 0; } }\n\n        .btn-tag {\n          display: inline-flex; align-items: center; gap: 6px;\n          background: transparent; color: var(--color-text-hierarchy-support_text);\n          border: 1px solid var(--color-border-component-primary-default);\n          border-radius: 16px; padding: 7px 14px; font-size: 12px;\n          font-family: inherit; cursor: pointer;\n          transition: border-color 0.2s ease;\n        }\n        .btn-tag:hover { border-color: var(--color-border-component-primary-hover)
1; }\n        .btn-tag svg { width: 14px; height: 14px; }\n\n        /* View changes */\n        .learn-view-changes { opacity: 0; height: 0; overflow: hidden; transition: opacity 0.4s ease; }\n        .learn-card.state-2 .learn-view-changes { opacity: 1; height: auto; overflow: visible; }\n        .learn-view-changes-toggle {\n          display: flex; align-items: center; gap: 5px;\n          font-size: 12px; color: var(--color-text-hierarchy-support_text);\n          cursor: pointer; background: none; border: none;\n          font-family: inherit; padding: 0; margin-bottom: 10px;\n        }\n        .learn-view-changes-toggle svg { width: 12px; height: 12px; }\n        .learn-change-item { display: flex; align-items: center; padding: 5px 6px; gap: 8px; }\n        .learn-change-plus { color: var(--color-surface-accent-violet-strong-default); font-size: 14px; font-weight: 500; width: 14px; text-align: center; }\n        .learn-change-name { font-size: 13px; font-weight: 500; color: var(--color-text-hierarchy-title); }\n        .learn-change-badge {\n          display: inline-block;\n          background: var(--color-surface-semantic-success-subtle-default, #D8F3BF);\n          color: var(--color-text-semantic-success-body);\n          font-size: 10px; font-weight: 600;\n          padding: 2px 8px; border-radius: 4px; margin-left: 4px;\n        }\n        .learn-change-view {\n          margin-left: auto; color: var(--color-surface-accent-violet-strong-default);\n          font-size: 12px; font-weight: 500; text-decoration: none;\n          cursor: pointer; background: none; border: none; font-family: inherit;\n        }\n\n        /* Flash overlay */\n        .learn-flash-overlay {\n          position: absolute; inset: 0;\n          background: rgba(123,81,228,0.06);\n          border-radius: 8px; opacity: 0; pointer-events: none; z-index: 5;\n        }\n        .learn-flash-overlay.active { animation: learn-flash 0.6s ease-out; }\n        @keyframes learn-flash { 0% { opacity: 1; } 100% { opacity: 0; } }\n\n        /* ── Wiki page ── */\n        .learn-wiki-page {\n          background: var(--color-surface-component-primary-default);\n          border: 1px solid var(--color-border-component-primary-default);\n          border-radius: 8px;\n          box-shadow: 0 4px 20px rgba(0,0,0,0.08);\n          pointer-events: none;\n          position: absolute;\n          top: 10px; left: 50%;\n          width: 98%; max-width: 680px; max-height: 660px;\n          overflow-y: auto;\n          transform: translateX(-50%) translateX(1200px);\n          opacity: 0;\n          transition: transform 0.9s cubic-bezier(0.4,0,0.2,1), opacity 0.4s ease;\n          z-index: 50;\n        }\n        .learn-wiki-page.visible { transform: translateX(-50%) translateX(0); opacity: 1; pointer-events: auto; }\n        .learn-wiki-page.zooming-out {\n          transform: translate(-50%,-50%) scale(0.5); opacity: 0;\n          transition: transform 0.6s cubic-bezier(0.4,0,0.2,1), opacity 0.4s ease;\n        }\n\n        /* Wiki header */\n        .wiki-header { border-bottom: 1px solid var(--color-border-component-primary-default); }\n        .wiki-header-top { display: flex; justify-content: space-between; align-items: center; padding: 12px 20px; }\n				@media (max-width: 640px) {\n					.wiki-header-top { flex-direction: column; gap: 10px; }\n				}\n        .wiki-created-modified { font-size: 12px; color: var(--color-text-hierarchy-support_text); }\n        .wiki-author-link {\n          color: var(--color-text-hierarchy-body);\n          text-decoration: underline; text-decoration-style: dotted;\n          text-underline-offset: 2px; cursor: pointer;\n        }\n        .wiki-header-actions { display: flex; align-items: center; gap: 8px; }\n        .wiki-edit-btn {\n          padding: 6px 16px; font-size: 13px; font-weight: 500;\n          color: var(--color-text-hierarchy-body);\n          background: var(--color-surface-component-primary-default);\n          border: 1px solid var(--color-border-component-primary-default);\n          border-radius: 4px; cursor: pointer; font-family: inherit;\n        }\n        .wiki-edit-btn:hover { background: var(--color-surface-component-primary-hover); }\n        .wiki-more-btn {\n          width: 28px; height: 28px;\n          display: flex; align-items: center; justify-content: center;\n          background: none; border: none; cursor: pointer;\n          color: var(--color-text-hierarchy-support_text); border-radius: 4px;\n        }\n        .wiki-more-btn:hover { background: var(--color-surface-component-primary-hover); }\n        .wiki-more-btn svg { width: 16px; height: 16px; }\n\n        .wiki-tabs { display: flex; padding: 0 20px; }\n        .wiki-tab {\n          padding: 10px 16px; font-size: 13px; font-weight: 500;\n          color: var(--color-text-hierarchy-support_text);\n          background: none; border: none;\n          border-bottom: 2px solid transparent;\n          cursor: pointer; font-family: inherit; margin-bottom: -1px;\n        }\n        .wiki-tab:hover { color: var(--color-text-hierarchy-body); }\n        .wiki-tab.active { color: var(--color-text-hierarchy-title); border-bottom-color: var(--color-text-hierarchy-title); }\n\n        .wiki-article-view { padding: 24px; }\n        .wiki-article-view.hidden { display: none; }\n        .wiki-article-title { font-size: 24px; font-weight: 700; color: var(--color-text-hierarchy-title); margin-bottom: 16px; line-height: 1.3; }\n        .wiki-article-tags { display: flex; gap: 8px; margin-bottom: 20px; flex-wrap: wrap; }\n        .wiki-article-tag {\n          font-size: 12px; font-weight: 500; padding: 4px 12px;\n          border-radius: 14px; border: 1px solid;\n        }\n        .wiki-article-tag.blue { color: var(--color-text-semantic-info-body); border-color: var(--color-border-semantic-info-regular-default); background: var(--color-surface-semantic-info-outline-default); }\n        .wiki-article-tag.green { color: var(--color-text-semantic-success-body); border-color: var(--color-border-semantic-success-regular-default, #D8F3BF); background: var(--color-surface-semantic-success-outline-default); }\n        .wiki-article-tag.orange { color: var(--color-text-semantic-warning-body, #BF7514); border-color: var(--color-border-component-primary-default); background: var(--color-surface-semantic-warning-outline-default); }\n        .wiki-article-body p { font-size: 14px; color: var(--color-text-hierarchy-body); line-height: 1.7; margin-bottom: 16px; }\n        .wiki-article-body h2 { font-size: 18px; font-weight: 700; color: var(--color-text-hierarchy-title); margin-top: 28px; margin-bottom: 12px; }\n        .wiki-formula-box {\n          background: var(--color-surface-component-base-default);\n          border: 1px solid var(--color-border-component-base-default);\n          border-radius: 6px; padding: 14px 18px;\n          font-family: 'JetBrains Mono', ui-monospace, monospace;\n          font-size: 12px; color: var(--color-text-hierarchy-body);\n          line-height: 1.7; margin-bottom: 16px; white-space: pre; overflow-x: auto;\n        }\n        .wiki-article-list { margin: 12px 0 16px 0; padding-left: 24px; }\n        .wiki-article-list li { font-size: 14px; color: var(--color-text-hierarchy-body); line-height: 1.7; margin-bottom: 8px; }\n\n        /* History view */\n        .wiki-history-view { padding: 20px; }\n        .wiki-history-view.hidden { display: none; }\n        .wiki-history-layout { display: flex; gap: 24px; }\n				@media (max-width: 640px) {\n					.wiki-history-layout { flex-direction: column; }\n				}\n        .wiki-history-main { flex: 1; min-width: 0; }\n        .wiki-current-version-badge {\n          display: inline-flex; align-items: center; gap: 6px;\n          padding: 8px 14px;\n          background: var(--color-surface-semantic-success-outline-default);\n          border-radius: 4px; font-size: 12px; font-weight: 500;\n          color: var(--color-text-hierarchy-body); margin-bottom: 16px;\n        }\n        .wiki-history-title { font-size: 22px; font-weight: 700; color: var(--color-text-hierarchy-title); margin-bottom: 12px; line-height: 1.3; }\n        .wiki-history-desc { font-size: 14px; color: var(--color-text-hierarchy-body); line-height: 1.6; margin-bottom: 16px; }\n        .wiki-history-section { font-size: 14px; font-weight: 600; color: var(--color-text-hierarchy-title); margin-top: 20px; margin-bottom: 8px; }\n        .wiki-history-list { margin: 12px 0 16px 0; padding-left: 24px; font-size: 14px; color: var(--color-text-hierarchy-body); line-height: 1.6; }\n        .wiki-history-list li { margin-bottom: 6px; }\n        .wiki-code-block {\n          background: var(--color-surface-component-base-default);\n          border: 1px solid var(--color-border-component-base-default);\n          border-radius: 6px; padding: 14px 16px;\n          font-family: 'JetBrains Mono', ui-monospace, monospace;\n          font-size: 12px; color: var(--color-text-hierarchy-body); line-height: 1.7; overflow-x: auto;\n        }\n        .wiki-diff-add { background: rgba(52,211,153,0.15); color: var(--color-text-hierarchy-body); display: inline; }\n        .wiki-diff-remove { background: rgba(248,113,113,0.15); color: var(--color-text-hierarchy-body); text-decoration: line-through; display: inline; }\n\n        /* Revisions sidebar */\n        .wiki-revisions-sidebar { width: 200px; flex-shrink: 0; }\n        .wiki-revisions-title {\n          font-size: 14px; font-weight: 600; color: var(--color-text-hierarchy-title);\n          margin-bottom: 12px; padding: 8px 12px;\n          background: var(--color-surface-component-base-default); border-radius: 4px;\n        }\n        .wiki-revision-item { padding: 10px 12px; border-left: 3px solid transparent; cursor: pointer; transition: background 0.15s; }\n        .wiki-revision-item:hover { background: var(--color-surface-component-base-default); }\n        .wiki-revision-item.active { background: var(--color-surface-semantic-success-outline-default); border-left-color: var(--color-surface-semantic-success-strong-default); }\n        .wiki-revision-date { font-size: 12px; font-weight: 500; color: var(--color-text-hierarchy-title); margin-bottom: 2px; }\n        .wiki-revision-author {\n          font-size: 12px; color: var(--color-text-semantic-info-link-default);\n          text-decoration: underline; text-decoration-style: dotted;\n          text-underline-offset: 2px; position: relative; display: inline-block;\n        }\n        .wiki-revision-tooltip {\n          position: absolute; bottom: 100%; left: 0;\n          background: var(--color-surface-component-contrast-strong-default);\n          color: var(--color-text-hierarchy-contrast);\n          padding: 6px 10px; border-radius: 4px; font-size: 11px; font-weight: 500;\n          white-space: nowrap; opacity: 0; visibility: hidden;\n          transition: opacity 0.2s, visibility 0.2s; margin-bottom: 4px; z-index: 100;\n        }\n        .wiki-revision-author.show-tooltip .wiki-revision-tooltip { opacity: 1; visibility: visible; }\n\n        /* Edit box */\n        .wiki-edit-box {\n          background: var(--color-surface-component-primary-default);\n          border: 1px solid var(--color-border-semantic-info-strong-default);\n          border-radius: 6px; padding: 12px; margin-top: 8px;\n        }\n        .wiki-edit-box.hidden { display: none; }\n        .wiki-edit-textarea {\n          width: 100%; min-height: 120px; padding: 10px 12px;\n          font-size: 13px; font-family: inherit; line-height: 1.6;\n          color: var(--color-text-hierarchy-body);\n          background: var(--color-surface-component-base-default);\n          border: 1px solid var(--color-border-component-base-default);\n          border-radius: 4px; resize: vertical;\n        }\n        .wiki-edit-textarea:focus { outline: none; border-color: var(--color-border-semantic-info-strong-default); }\n        .wiki-edit-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 10px; }\n        .wiki-cancel-btn {\n          padding: 6px 14px; font-size: 13px; font-weight: 500;\n          color: var(--color-text-hierarchy-body);\n          background: var(--color-surface-component-primary-default);\n          border: 1px solid var(--color-border-component-primary-default);\n          border-radius: 4px; cursor: pointer; font-family: inherit;\n        }\n        .wiki-cancel-btn:hover { background: var(--color-surface-component-primary-hover); }\n        .wiki-save-btn {\n          padding: 6px 14px; font-size: 13px; font-weight: 500;\n          color: #fff; background: var(--color-surface-semantic-success-strong-default);\n          border: none; border-radius: 4px; cursor: pointer; font-family: inherit;\n        }\n        .wiki-save-btn:hover { opacity: 0.9; }\n\n        /* ── Knowledge graph ── */\n        .knowledge-graph-view {\n          position: absolute; top: 10px; left: 50%;\n          transform: translateX(-50%) scale(0.3);\n          width: 98%; max-width: 680px; height: 660px;\n          background: var(--color-surface-component-primary-default);\n          border-radius: 12px; box-shadow: 0 25px 80px rgba(0,0,0,0.3);\n          z-index: 500; opacity: 0; visibility: hidden;\n          transition: opacity 0.8s ease, transform 0.8s ease, visibility 0.8s ease;\n          display: flex; flex-direction: column; overflow: hidden;\n        }\n        .knowledge-graph-view.visible { opacity: 1; visibility: visible; transform: translateX(-50%) scale(1); }\n        .graph-header {\n          display: flex; justify-content: space-between; align-items: center;\n          padding: 16px 20px; border-bottom: 1px solid var(--color-border-component-primary-default); flex-shrink: 0;\n        }\n        .graph-search {\n          display: flex; align-items: center; gap: 10px;\n          padding: 10px 16px;\n          background: var(--color-surface-component-base-default);\n          border: 1px solid var(--color-border-component-base-default);\n          border-radius: 8px; min-width: 280px;\n          color: var(--color-text-hierarchy-support_text); font-size: 14px;\n        }\n				@media (max-width: 640px) {\n					.graph-header {\n						flex-direction: column; gap: 10px;\n						align-items: flex-start;\n					}\n				}\n        .graph-controls { display: flex; align-items: center; gap: 8px; }\n        .graph-view-btn {\n          padding: 8px 16px; font-size: 13px; font-weight: 500;\n          color: var(--color-text-hierarchy-support_text);\n          background: none; border: none; cursor: pointer; font-family: inherit; border-radius: 4px;\n        }\n        .graph-view-btn:hover { background: var(--color-surface-component-base-default); }\n        .graph-view-btn.active { color: var(--color-text-hierarchy-title); background: var(--color-surface-component-base-default); }\n        .graph-container { flex: 1; padding: 20px; overflow: hidden; }\n        .graph-svg { width: 100%; height: 100%; }\n        .graph-edge { stroke: var(--color-border-component-base-default); stroke-width: 1; }\n        .node-circle { fill: #6b9dad; transition: fill 0.2s ease; }\n        .graph-node.highlighted .node-circle { fill: #4a8a9c; stroke: var(--color-border-semantic-info-strong-default); stroke-width: 3; }\n        .node-label { font-size: 10px; fill: var(--color-text-hierarchy-body); text-anchor: middle; font-family: inherit; }\n        .graph-node.highlighted .node-label { font-weight: 600; fill: var(--color-text-hierarchy-title); }\n\n        /* ── Cursors ── */\n        .learn-fake-cursor, .wiki-cursor {\n          position: absolute; width: 22px; height: 36px;\n          pointer-events: none; z-index: 1000; opacity: 0;\n          transition: opacity 0.3s ease;\n          filter: drop-shadow(1px 2px 3px rgba(0,0,0,0.3));\n        }\n        .learn-fake-cursor.visible, .wiki-cursor.visible { opacity: 1; }\n        .learn-fake-cursor.clicking, .wiki-cursor.clicking { transform: scale(0.9); }\n\n        /* ── Play/pause ── */\n        .learn-play-pause-btn {\n          position: absolute; bottom: 20px; right: 20px;\n          width: 28px; height: 28px; border-radius: 50%;\n          background: var(--color-surface-component-primary-default);\n          border: 1p
1x solid var(--color-border-component-primary-default);\n          cursor: pointer; display: flex; align-items: center; justify-content: center;\n          z-index: 100; transition: background 0.2s, transform 0.15s;\n          box-shadow: 0 2px 6px rgba(0,0,0,0.08); padding: 0;\n        }\n        .learn-play-pause-btn:hover { background: var(--color-surface-component-primary-hover); transform: scale(1.08); }\n        .learn-play-pause-btn svg { width: 12px; height: 12px; color: var(--color-text-hierarchy-body); }\n        .learn-play-pause-btn .icon-play { display: none; }\n        .learn-play-pause-btn .icon-pause { display: block; }\n        .learn-play-pause-btn.paused .icon-play { display: block; }\n        .learn-play-pause-btn.paused .icon-pause { display: none; }\n      "}),(0,n.jsx)("div",{style:{display:"flex",alignItems:"center",justifyContent:"center",width:"100%",height:"100%"},children:(0,n.jsx)("div",{className:"wla-viewport-container",children:(0,n.jsx)("div",{className:"wla-viewport-inner",children:(0,n.jsxs)("div",{className:"wla-scale-wrapper",ref:e,children:[(0,n.jsxs)("div",{className:"chat-container",ref:r,children:[(0,n.jsxs)("div",{className:"message-row",children:[(0,n.jsx)("img",{className:"avatar",src:"https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?w=88&h=88&fit=crop&crop=face",alt:"Omar H."}),(0,n.jsxs)("div",{className:"message-content",children:[(0,n.jsx)("div",{className:"message-header",children:(0,n.jsxs)("span",{className:"sender-name",children:["Omar H. ",(0,n.jsx)("span",{className:"you-label",children:"(Logistics Lead)"})]})}),(0,n.jsxs)("div",{className:"bubble",children:[(0,n.jsx)("span",{className:"mention",children:"@PromptQL"}),'\xa0 check on-time delivery excluding shipments flagged "weather delay."']})]})]}),(0,n.jsxs)("div",{className:"message-row",children:[(0,n.jsx)("img",{className:"avatar promptql",src:"https://promptql.io/brand-assets/promptql-icon-neon.svg",alt:"PromptQL"}),(0,n.jsxs)("div",{className:"message-content",children:[(0,n.jsx)("div",{className:"message-header",children:(0,n.jsx)("span",{className:"sender-name",children:"PromptQL"})}),(0,n.jsxs)("div",{className:"promptql-card",children:[(0,n.jsxs)("details",{className:"progress-steps",children:[(0,n.jsxs)("summary",{children:[(0,n.jsx)("span",{className:"progress-steps-toggle","aria-hidden":"true",children:"▸"}),"Completed 2 steps"]}),(0,n.jsxs)("div",{className:"progress-steps-content",children:[(0,n.jsx)("div",{className:"step-item",children:"Filtering shipments flagged as weather delay"}),(0,n.jsx)("div",{className:"step-item",children:"Recomputing with calendar-window normalization"})]})]}),(0,n.jsxs)("div",{className:"result-text",children:["Reported OTD: ",(0,n.jsx)("strong",{children:"89%"})," vs. OTD (excluding weather delays): ",(0,n.jsx)("strong",{children:"94%"}),(0,n.jsx)("br",{}),"Majority of variance tied to 3 storm-impacted regions."]}),(0,n.jsxs)("div",{className:"actions",children:[(0,n.jsxs)("button",{className:"action-btn",type:"button",children:[(0,n.jsxs)("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"1.8",strokeLinecap:"round",strokeLinejoin:"round",children:[(0,n.jsx)("path",{d:"M4 7l2 2 4-4"}),(0,n.jsx)("path",{d:"M4 17l2 2 4-4"}),(0,n.jsx)("path",{d:"M14 6h6"}),(0,n.jsx)("path",{d:"M14 12h6"}),(0,n.jsx)("path",{d:"M14 18h6"})]}),"Confidence Analysis"]}),(0,n.jsxs)("button",{className:"action-btn",type:"button",children:[(0,n.jsxs)("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"1.8",strokeLinecap:"round",strokeLinejoin:"round",children:[(0,n.jsx)("path",{d:"M7 22H4a2 2 0 01-2-2v-7a2 2 0 012-2h3"}),(0,n.jsx)("path",{d:"M7 22V11l3.5-7a1.5 1.5 0 013 0V9h5.09a2 2 0 012 2.34l-1.34 8A2 2 0 0117.27 21H7z"})]}),"Approve"]}),(0,n.jsxs)("button",{className:"action-btn",type:"button",children:[(0,n.jsxs)("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"1.8",strokeLinecap:"round",strokeLinejoin:"round",children:[(0,n.jsx)("path",{d:"M17 2H20a2 2 0 012 2v7a2 2 0 01-2 2h-3"}),(0,n.jsx)("path",{d:"M17 2v11l-3.5 7a1.5 1.5 0 01-3 0V15H5.41a2 2 0 01-2-2.34l1.34-8A2 2 0 016.73 3H17z"})]}),"Inaccurate"]})]})]})]})]}),(0,n.jsxs)("div",{className:"message-row",children:[(0,n.jsx)("img",{className:"avatar",src:"https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?w=88&h=88&fit=crop&crop=face",alt:"Omar H."}),(0,n.jsxs)("div",{className:"message-content",children:[(0,n.jsx)("div",{className:"message-header",children:(0,n.jsxs)("span",{className:"sender-name",children:["Omar H. ",(0,n.jsx)("span",{className:"you-label",children:"(Logistics Lead)"})]})}),(0,n.jsxs)("div",{className:"bubble",children:[(0,n.jsx)("span",{className:"mention",children:"@PromptQL"}),"\xa0 SLA reviews should always exclude shipments officially coded as weather delays."]})]})]}),(0,n.jsxs)("div",{className:"message-row",children:[(0,n.jsx)("img",{className:"avatar promptql",src:"https://promptql.io/brand-assets/promptql-icon-neon.svg",alt:"PromptQL"}),(0,n.jsxs)("div",{className:"message-content",children:[(0,n.jsx)("div",{className:"message-header",children:(0,n.jsx)("span",{className:"sender-name",children:"PromptQL"})}),(0,n.jsx)("div",{className:"wiki-animation-container",children:(0,n.jsxs)("div",{className:"learn-card",ref:t,children:[(0,n.jsx)("div",{className:"learn-flash-overlay",ref:c}),(0,n.jsxs)("div",{className:"learn-card-header",children:[(0,n.jsx)("div",{className:"learn-sparkle-icon",children:(0,n.jsxs)("svg",{viewBox:"0 0 24 24",fill:"none",children:[(0,n.jsx)("path",{d:"M12 2L13.5 8.5L20 10L13.5 11.5L12 18L10.5 11.5L4 10L10.5 8.5L12 2Z",fill:"var(--color-surface-accent-violet-strong-default)",opacity:"0.7"}),(0,n.jsx)("path",{d:"M18 14L19 17L22 18L19 19L18 22L17 19L14 18L17 17L18 14Z",fill:"var(--color-surface-accent-violet-strong-default)",opacity:"0.5"}),(0,n.jsx)("path",{d:"M6 14L6.7 16.3L9 17L6.7 17.7L6 20L5.3 17.7L3 17L5.3 16.3L6 14Z",fill:"var(--color-surface-accent-violet-strong-default)",opacity:"0.35"})]})}),(0,n.jsxs)("div",{className:"learn-header-text",children:[(0,n.jsxs)("div",{className:"learn-header-title",children:[(0,n.jsx)("div",{className:"learn-spinner"}),(0,n.jsxs)("svg",{className:"learn-check-badge",viewBox:"0 0 24 24",fill:"none",children:[(0,n.jsx)("circle",{cx:"12",cy:"12",r:"11",fill:"var(--color-surface-semantic-success-strong-default)"}),(0,n.jsx)("path",{d:"M7 12.5L10.5 16L17 9",stroke:"white",strokeWidth:"2.2",strokeLinecap:"round",strokeLinejoin:"round"})]}),(0,n.jsx)("span",{ref:p,children:"PromptQL wants to learn"})]}),(0,n.jsx)("div",{className:"learn-header-subtitle",ref:x,children:'Review and edit if needed, then click "Add to wiki"'})]}),(0,n.jsx)("button",{className:"learn-chevron-btn",children:(0,n.jsx)("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:(0,n.jsx)("polyline",{points:"18 15 12 9 6 15"})})})]}),(0,n.jsx)("div",{className:"learn-content-box",children:(0,n.jsx)("div",{className:"learn-bullet-text",children:'SLA reviews should exclude shipments officially coded as "weather delay" to reflect controllable delivery performance.'})}),(0,n.jsxs)("div",{className:"learn-actions",children:[(0,n.jsxs)("button",{className:"btn-add-wiki",ref:i,children:[(0,n.jsxs)("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[(0,n.jsx)("rect",{x:"3",y:"3",width:"18",height:"18",rx:"3"}),(0,n.jsx)("line",{x1:"8",y1:"9",x2:"16",y2:"9"}),(0,n.jsx)("line",{x1:"8",y1:"13",x2:"14",y2:"13"})]}),"Add to wiki"]}),(0,n.jsxs)("button",{className:"btn-tag",children:[(0,n.jsxs)("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:[(0,n.jsx)("circle",{cx:"12",cy:"12",r:"9"}),(0,n.jsx)("path",{d:"M8 12h8"})]}),"Not sure? Tag someone..."]})]}),(0,n.jsxs)("div",{className:"learn-view-changes",children:[(0,n.jsxs)("button",{className:"learn-view-changes-toggle",children:["View changes ",(0,n.jsx)("span",{children:"(1 page)"}),(0,n.jsx)("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",children:(0,n.jsx)("polyline",{points:"18 15 12 9 6 15"})})]}),(0,n.jsxs)("div",{className:"learn-change-item",children:[(0,n.jsx)("span",{className:"learn-change-plus",children:"+"}),(0,n.jsx)("span",{className:"learn-change-name",children:"Weather Delay SLA Rule"}),(0,n.jsx)("span",{className:"learn-change-badge",children:"Added"}),(0,n.jsx)("button",{className:"learn-change-view",ref:a,children:"View"})]})]})]})})]})]})]}),(0,n.jsxs)("div",{className:"learn-wiki-page",ref:s,children:[(0,n.jsxs)("div",{className:"wiki-header",children:[(0,n.jsxs)("div",{className:"wiki-header-top",children:[(0,n.jsxs)("div",{className:"wiki-created-modified",children:["Created by ",(0,n.jsx)("span",{className:"wiki-author-link",children:"Sarah Chen"})," \xb7 Jan 12, 2026 \xa0|\xa0 Last modified by ",(0,n.jsx)("span",{className:"wiki-author-link",children:"Omar H."})," \xb7 Feb 16, 2026"]}),(0,n.jsxs)("div",{className:"wiki-header-actions",children:[(0,n.jsx)("button",{className:"wiki-edit-btn",children:"Edit"}),(0,n.jsx)("button",{className:"wiki-more-btn",children:(0,n.jsxs)("svg",{viewBox:"0 0 24 24",fill:"
1currentColor",width:"16",height:"16",children:[(0,n.jsx)("circle",{cx:"12",cy:"5",r:"2"}),(0,n.jsx)("circle",{cx:"12",cy:"12",r:"2"}),(0,n.jsx)("circle",{cx:"12",cy:"19",r:"2"})]})})]})]}),(0,n.jsxs)("div",{className:"wiki-tabs",children:[(0,n.jsx)("button",{className:"wiki-tab active",ref:u,children:"Article"}),(0,n.jsx)("button",{className:"wiki-tab",children:"Talk"}),(0,n.jsx)("button",{className:"wiki-tab",ref:g,children:"History"})]})]}),(0,n.jsxs)("div",{className:"wiki-article-view",ref:f,children:[(0,n.jsx)("h2",{className:"wiki-article-title",children:"On-Time Delivery (OTD) Metrics"}),(0,n.jsxs)("div",{className:"wiki-article-tags",children:[(0,n.jsx)("span",{className:"wiki-article-tag blue",children:"SLA Policy"}),(0,n.jsx)("span",{className:"wiki-article-tag green",children:"delivery metrics"}),(0,n.jsx)("span",{className:"wiki-article-tag orange",children:"performance tracking"})]}),(0,n.jsxs)("div",{className:"wiki-article-body",children:[(0,n.jsxs)("p",{children:["On-Time Delivery (OTD) measures the percentage of shipments delivered within the committed timeframe. Our company target is ",(0,n.jsx)("strong",{children:"95% OTD"})," across all regions."]}),(0,n.jsx)("h2",{children:"Standard Formula"}),(0,n.jsx)("div",{className:"wiki-formula-box",children:"otd_rate = (on_time_deliveries / total_deliveries) \xd7 100"}),(0,n.jsx)("h2",{children:"Weather Delay Exclusions"}),(0,n.jsx)("p",{children:'SLA reviews should exclude shipments officially coded as "weather delay" to reflect controllable delivery performance.'}),(0,n.jsx)("h2",{children:"Delay Categories"}),(0,n.jsx)("p",{children:"Shipments may be flagged with the following delay codes:"}),(0,n.jsxs)("ul",{className:"wiki-article-list",children:[(0,n.jsxs)("li",{children:[(0,n.jsx)("strong",{children:"Weather Delay:"})," Storm, flooding, or severe weather conditions"]}),(0,n.jsxs)("li",{children:[(0,n.jsx)("strong",{children:"Carrier Delay:"})," Capacity or operational issues with shipping partner"]}),(0,n.jsxs)("li",{children:[(0,n.jsx)("strong",{children:"Customs Delay:"})," International shipments held at border"]}),(0,n.jsxs)("li",{children:[(0,n.jsx)("strong",{children:"Customer Delay:"})," Recipient unavailable or address issues"]})]}),(0,n.jsx)("h2",{children:"Regional Targets"}),(0,n.jsx)("p",{children:"While the company-wide target is 95%, regional targets may vary based on logistics infrastructure and historical performance patterns."})]})]}),(0,n.jsx)("div",{className:"wiki-history-view hidden",ref:b,children:(0,n.jsxs)("div",{className:"wiki-history-layout",children:[(0,n.jsxs)("div",{className:"wiki-history-main",children:[(0,n.jsxs)("div",{className:"wiki-current-version-badge",children:[(0,n.jsxs)("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",width:"16",height:"16",children:[(0,n.jsx)("circle",{cx:"12",cy:"12",r:"10"}),(0,n.jsx)("polyline",{points:"12 6 12 12 16 14"})]}),"Current version"]}),(0,n.jsx)("h2",{className:"wiki-history-title",children:"On-Time Delivery (OTD) Metrics"}),(0,n.jsxs)("p",{className:"wiki-history-desc",children:["On-Time Delivery (OTD) measures the percentage of shipments delivered within the committed timeframe. Our company target is ",(0,n.jsx)("strong",{children:"95% OTD"})," across all regions."]}),(0,n.jsx)("h2",{className:"wiki-history-section",children:"Standard Formula"}),(0,n.jsx)("div",{className:"wiki-code-block",children:"otd_rate = (on_time_deliveries / total_deliveries) \xd7 100"}),(0,n.jsx)("h2",{className:"wiki-history-section",children:(0,n.jsx)("span",{className:"wiki-diff-add",children:"Weather Delay Exclusions"})}),(0,n.jsx)("p",{className:"wiki-history-desc",ref:v,children:(0,n.jsx)("span",{className:"wiki-diff-add",children:'SLA reviews should exclude shipments officially coded as "weather delay" to reflect controllable delivery performance.'})}),(0,n.jsxs)("div",{className:"wiki-edit-box hidden",ref:y,children:[(0,n.jsx)("textarea",{className:"wiki-edit-textarea",ref:w,defaultValue:d}),(0,n.jsxs)("div",{className:"wiki-edit-actions",children:[(0,n.jsx)("button",{className:"wiki-cancel-btn",children:"Cancel"}),(0,n.jsx)("button",{className:"wiki-save-btn",ref:j,children:"Save"})]})]}),(0,n.jsx)("h2",{className:"wiki-history-section",children:"Delay Categories"}),(0,n.jsx)("p",{className:"wiki-history-desc",children:"Shipments may be flagged with the following delay codes:"}),(0,n.jsxs)("ul",{className:"wiki-history-list",children:[(0,n.jsxs)("li",{children:[(0,n.jsx)("strong",{children:"Weather Delay:"})," Storm, flooding, or severe weather conditions"]}),(0,n.jsxs)("li",{children:[(0,n.jsx)("strong",{children:"Carrier Delay:"})," Capacity or operational issues with shipping partner"]}),(0,n.jsxs)("li",{children:[(0,n.jsx)("strong",{children:"Customs Delay:"})," International shipments held at border"]}),(0,n.jsxs)("li",{children:[(0,n.jsx)("strong",{children:"Customer Delay:"})," Recipient unavailable or address issues"]})]}),(0,n.jsx)("h2",{className:"wiki-history-section",children:"Regional Targets"}),(0,n.jsx)("p",{className:"wiki-history-desc",children:"While the company-wide target is 95%, regional targets may vary based on logistics infrastru
1cture and historical performance patterns."})]}),(0,n.jsxs)("div",{className:"wiki-revisions-sidebar",children:[(0,n.jsx)("h3",{className:"wiki-revisions-title",children:"Revisions"}),(0,n.jsxs)("div",{className:"wiki-revision-item",ref:k,style:{display:"none"},children:[(0,n.jsx)("div",{className:"wiki-revision-date",children:"Feb 16, 2026, 9:15 PM"}),(0,n.jsxs)("div",{className:"wiki-revision-author",ref:C,children:["Sarah Chen",(0,n.jsx)("span",{className:"wiki-revision-tooltip",children:"Data Platform Engineer"})]})]}),(0,n.jsxs)("div",{className:"wiki-revision-item active",ref:N,children:[(0,n.jsx)("div",{className:"wiki-revision-date",children:"Feb 16, 2026, 9:03 PM"}),(0,n.jsxs)("div",{className:"wiki-revision-author",ref:F,children:["Omar H.",(0,n.jsx)("span",{className:"wiki-revision-tooltip",children:"Logistics Lead"})]})]}),(0,n.jsxs)("div",{className:"wiki-revision-item",children:[(0,n.jsx)("div",{className:"wiki-revision-date",children:"Feb 10, 2026, 11:22 AM"}),(0,n.jsxs)("div",{className:"wiki-revision-author",children:["Sarah Chen",(0,n.jsx)("span",{className:"wiki-revision-tooltip",children:"Data Platform Engineer"})]})]}),(0,n.jsxs)("div",{className:"wiki-revision-item",children:[(0,n.jsx)("div",{className:"wiki-revision-date",children:"Jan 28, 2026, 2:15 PM"}),(0,n.jsxs)("div",{className:"wiki-revision-author",children:["Sarah Chen",(0,n.jsx)("span",{className:"wiki-revision-tooltip",children:"Data Platform Engineer"})]})]}),(0,n.jsxs)("div",{className:"wiki-revision-item",ref:L,children:[(0,n.jsx)("div",{className:"wiki-revision-date",children:"Jan 20, 2026, 9:45 AM"}),(0,n.jsxs)("div",{className:"wiki-revision-author",ref:A,children:["Mike Johnson",(0,n.jsx)("span",{className:"wiki-revision-tooltip",children:"Supply Chain Analyst"})]})]}),(0,n.jsxs)("div",{className:"wiki-revision-item",children:[(0,n.jsx)("div",{className:"wiki-revision-date",children:"Jan 15, 2026, 3:30 PM"}),(0,n.jsxs)("div",{className:"wiki-revision-author",children:["Sarah Chen",(0,n.jsx)("span",{className:"wiki-revision-tooltip",children:"Data Platform Engineer"})]})]}),(0,n.jsxs)("div",{className:"wiki-revision-item",children:[(0,n.jsx)("div",{className:"wiki-revision-date",children:"Jan 12, 2026, 10:30 AM"}),(0,n.jsxs)("div",{className:"wiki-revision-author",children:["Sarah Chen",(0,n.jsx)("span",{className:"wiki-revision-tooltip",children:"Data Platform Engineer"})]})]}),(0,n.jsxs)("div",{className:"wiki-revision-item",children:[(0,n.jsx)("div",{className:"wiki-revision-date",children:"Jan 5, 2026, 4:45 PM"}),(0,n.jsxs)("div",{className:"wiki-revision-author",children:["Mike Johnson",(0,n.jsx)("span",{className:"wiki-revision-tooltip",children:"Supply Chain Analyst"})]})]})]})]})})]}),(0,n.jsxs)("div",{className:"knowledge-graph-view",ref:z,children:[(0,n.jsxs)("div",{className:"graph-header",children:[(0,n.jsxs)("div",{className:"graph-search",children:[(0,n.jsxs)("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"2",width:"18",height:"18",children:[(0,n.jsx)("circle",{cx:"11",cy:"11",r:"8"}),(0,n.jsx)("path",{d:"M21 21l-4.35-4.35"})]}),(0,n.jsx)("span",{children:"Search wiki pages..."})]}),(0,n.jsxs)("div",{className:"graph-controls",children:[(0,n.jsx)("button",{className:"graph-view-btn",children:"Grid"}),(0,n.jsx)("button",{className:"graph-view-btn active",children:"Graph"})]})]}),(0,n.jsx)("div",{className:"graph-container",children:(0,n.jsxs)("svg",{className:"graph-svg",viewBox:"0 0 1000 700",children:[(0,n.jsx)("g",{className:"graph-edges",children:[[500,350,380,280],[500,350,620,280],[500,350,400,450],[500,350,600,450],[500,350,350,380],[500,350,650,380],[380,280,620,280],[380,280,350,380],[620,280,650,380],[400,450,350,380],[600,450,650,380],[400,450,600,450],[380,280,280,220],[380,280,320,340],[380,280,450,200],[280,220,320,340],[620,280,720,220],[620,280,680,340],[620,280,550,200],[720,220,680,340],[550,200,450,200],[400,450,300,500],[400,450,450,530],[300,500,450,530],[600,450,700,500],[600,450,550,530],[700,500,550,530],[550,530,450,530],[350,380,250,420],[350,380,280,320],[250,420,280,320],[280,320,320,340],[650,380,750,420],[650,380,720,320],[750,420,720,320],[720,320,680,340],[280,220,180,180],[280,220,220,280],[180,180,220,280],[720,220,820,180],[720,220,780,280],[820,180,780,280],[300,500,200,550],[700,500,800,550],[250,420,150,460],[750,420,850,460],[450,200,550,200],[320,340,280,320],[680,340,720,320],[220,280,280,320],[780,280,720,320],[200,550,150,460],[800,550,850,460],[180,180,120,130],[820,180,880,130],[450,200,420,130],[550,200,580,130],[450,530,400,600],[550,530,600,600],[420,130,580,130],[400,600,600,600],[120,130,180,180],[880,130,820,180]].map((e,r)=>{let[t,i,a,s]=e;return(0,n.jsx)("line",{x1:t,y1:i,x2:a,y2:s,className:"graph-edge"},r)})}),(0,n.jsx)("g",{className:"graph-nodes",children:[{x:500,y:350,label:"OTD Metrics",highlight:!0}
1,{x:380,y:280,label:"Shipments"},{x:620,y:280,label:"Carriers"},{x:400,y:450,label:"SLA Policies"},{x:600,y:450,label:"Regional Targets"},{x:350,y:380,label:"Delay Codes"},{x:650,y:380,label:"Warehouse Ops"},{x:280,y:220,label:"Order Fulfillment"},{x:320,y:340,label:"Tracking Events"},{x:450,y:200,label:"Ship Dates"},{x:720,y:220,label:"Carrier Performance"},{x:680,y:340,label:"Route Optimization"},{x:550,y:200,label:"Transit Times"},{x:300,y:500,label:"Contract Terms"},{x:450,y:530,label:"Penalty Clauses"},{x:700,y:500,label:"Distribution Centers"},{x:550,y:530,label:"Zone Mapping"},{x:250,y:420,label:"Weather Events"},{x:280,y:320,label:"Exception Handling"},{x:750,y:420,label:"Pick & Pack"},{x:720,y:320,label:"Inventory Levels"},{x:180,y:180,label:"Customer Orders"},{x:220,y:280,label:"Returns"},{x:820,y:180,label:"Freight Costs"},{x:780,y:280,label:"Last Mile"},{x:200,y:550,label:"Vendor Agreements"},{x:800,y:550,label:"Capacity Planning"},{x:150,y:460,label:"Storm Alerts"},{x:850,y:460,label:"Dock Scheduling"},{x:120,y:130,label:"E-commerce"},{x:880,y:130,label:"Rate Cards"},{x:420,y:130,label:"Cutoff Times"},{x:580,y:130,label:"Delivery Windows"},{x:400,y:600,label:"Credit Memos"},{x:600,y:600,label:"Service Levels"}].map(e=>{let{x:r,y:t,label:i,highlight:a}=e;return(0,n.jsxs)("g",{className:"graph-node".concat(a?" highlighted":""),transform:"translate(".concat(r,",").concat(t,")"),children:[(0,n.jsx)("circle",{r:"12",className:"node-circle"}),(0,n.jsx)("text",{className:"node-label",dy:"26",children:i})]},i)})})]})})]}),(0,n.jsx)("svg",{className:"wiki-cursor",ref:m,viewBox:"0 0 20 28",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:(0,n.jsx)("path",{d:"M2 1L2 24L8 17L16 17Z",fill:"var(--color-text-hierarchy-title)",stroke:"var(--color-surface-component-primary-default)",strokeWidth:"0.8",strokeLinejoin:"round"})}),(0,n.jsx)("svg",{className:"learn-fake-cursor",ref:l,viewBox:"0 0 20 28",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:(0,n.jsx)("path",{d:"M2 1L2 24L8 17L16 17Z",fill:"var(--color-text-hierarchy-title)",stroke:"var(--color-surface-component-primary-default)",strokeWidth:"0.8",strokeLinejoin:"round"})}),(0,n.jsxs)("button",{className:"learn-play-pause-btn",ref:h,title:"Pause/Play",onClick:I,children:[(0,n.jsxs)("svg",{className:"icon-pause",viewBox:"0 0 24 24",fill:"currentColor",children:[(0,n.jsx)("rect",{x:"6",y:"4",width:"4",height:"16",rx:"1"}),(0,n.jsx)("rect",{x:"14",y:"4",width:"4",height:"16",rx:"1"})]}),(0,n.jsx)("svg",{className:"icon-play",viewBox:"0 0 24 24",fill:"currentColor",children:(0,n.jsx)("polygon",{points:"6,4 20,12 6,20"})})]})]})})})})]})}let x=[{title:"Connected to execution",content:"Anyone can create and update context in the flow of work, not as a separate documentation step via a gatekeeping team."},{title:"Open contribution",content:"Experts across the organization can contribute directly, with quality improving through usage, feedback, and iteration."},{title:"Flexible expression",content:"Capture metrics, definitions, operational logic, nuance and exceptions, to represent how the business actually works."},{title:"Accessible across skill levels",content:"Both technical and business users can understand and contribute—so context isn't lost in translation or locked behind specialists."},{title:"Scalable governance",content:"Wikipedia-like governance ensures oversight without bottlenecks. Every change is versioned, attributed, auditable, and reversible."},{title:"AI-native",content:"AI flags gaps, suggests improvements, and helps generate context—all in the flow of work, reducing the burden of contribution. User guides, AI writes."}],h=e=>{let{className:r}=e;return(0,n.jsx)("svg",{className:"".concat(r),width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:(0,n.jsx)("path",{d:"M7 14.7002V8.40039H0.700195C0.313596 8.40039 0 8.08679 0 7.7002C0 7.3136 0.313596 7 0.700195 7H7V0.700195C7 0.313596 7.3136 0 7.7002 0C8.08679 0 8.40039 0.313596 8.40039 0.700195V7H14.7002L14.8408 7.01465C15.16 7.07977 15.4004 7.36178 15.4004 7.7002C15.4004 8.03861 15.16 8.32062 14.8408 8.38574L14.7002 8.40039H8.40039V14.7002C8.40039 15.0868 8.08679 15.4004 7.7002 15.4004C7.3136 15.4004 7 15.0868 7 14.7002Z",fill:"black"})})};function m(e){let[r,t]=(0,o.useState)(0);return(0,n.jsx)("div",{className:"px-6 py-16 lg:py-24 bg-[#FFF]",children:(0,n.jsx)("div",{className:"max-w-[1060px] mx-auto",children:(0,n.jsxs)("div",{className:"w-full",children:[(0,n.jsx)(s.Z,{textStyle:"eyebrow1",className:"text-[#6B7280] pb-2 md:pb-3",children:"PILLAR 1"}),(0,n.jsx)(s.Z,{textStyle:"section-title",as:"h2",className:"pb-1 text-[#030712]",children:"A wikipedia-style OS for shared context"}),(0,n.jsx)(s.Z,{textStyle:"body1",className:"text-[#374151] max-w-[700px]",children:"Build shared context like Wiki
1pedia—a living system where knowledge is created, refined, and validated through use. Context grows as your team works, becoming more accurate over time."}),(0,n.jsxs)("div",{className:"grid grid-cols-1 lg:grid-cols-[0.7fr_1.3fr] justify-between gap-12 lg:gap-16 items-start pt-12",children:[(0,n.jsx)("div",{className:"flex flex-col min-w-[320px] lg:sticky lg:top-24",children:x.map((e,i)=>(0,n.jsxs)("div",{className:"border-b border-[#E5E5E5] overflow-hidden ".concat(0===i?"border-t border-[#E5E5E5]":""),children:[(0,n.jsxs)("button",{onClick:()=>t(i),className:"flex items-center justify-between py-5 cursor-pointer transition-all duration-200 gap-4 w-full text-left",children:[(0,n.jsx)(s.Z,{as:"p",textStyle:"link",className:"flex items-center text-[#030712] ".concat(r===i?"text-[#030712]":"text-[#4B5563] hover:text-[#030712]"),children:e.title}),(0,n.jsx)("div",{className:"w-7 h-7 flex items-center justify-center shrink-0 rounded-full transition-all duration-250 ".concat(r===i?"bg-[#6CAF8C]/10":"bg-transparent"),children:(0,n.jsx)(h,{className:"w-3.5 h-3.5 transition-all duration-300 ".concat(r===i?"rotate-45 stroke-[#6CAF8C]":"stroke-[#a3a3a3]")})})]}),(0,n.jsx)("div",{className:"overflow-hidden transition-[max-height] duration-350",style:{maxHeight:r===i?"180px":"0px",transitionTimingFunction:"cubic-bezier(0.16, 1, 0.3, 1)"},children:(0,n.jsx)("p",{className:"text-[0.9375rem] leading-[1.7] text-[#525252] pb-5 pr-11 lg:pr-11",children:e.content})})]},e.title))}),(0,n.jsx)("div",{children:(0,n.jsx)(p,{})})]})]})})})}let u={meta_title:"Why PromptQL works",meta_description:"PromptQL is trusted by platform and AI transformation teams responsible because it eliminates the three main bottlenecks that prevent AI from working at scale.",canonical_url:"https://promptql.io/why-promptql-works",meta_image:{data:{attributes:{url:"https://promptql.io/og/product.png"}}}},g=e=>{let{className:r}=e;return(0,n.jsxs)("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:2,strokeLinecap:"round",className:r,children:[(0,n.jsx)("line",{x1:"12",y1:"5",x2:"12",y2:"19"}),(0,n.jsx)("line",{x1:"5",y1:"12",x2:"19",y2:"12"})]})},f=[{label:"Context engineering",text:"Existing approaches like semantic layers and knowledge graphs don't scale. They rely on centralized ownership, upfront modeling, and can't keep up with evolving business logic."},{label:"Security",text:"AI introduces a new data access surface that's much harder to secure. It is difficult to enforce existing rules, and expanding access exposes systems not designed for broad use."},{label:"Cost",text:"In most AI systems, cost is hard to control. You see token usage, but have few levers to reduce it in a targeted way without impacting quality."}],b={tag:"PILLAR 2",addBorderTop:!0,addBorderBottom:!0,title:"Easy access permission and audit",description:"PromptQL simplifies data access control for AI across the board as you onboard new data sources and users. You can either pass through existing controls or have PromptQL suggest and implement permissions based on user roles and data sensitivity.",descriptionClass:"lg:max-w-[750px]",featureList:[{title:"Easy authorization",description:"Define and manage access with simple, intuitive controls, or inherit and enforce policies from existing systems like SSO and IAM.",borderRight:!0,borderBottom:!0,svgIcon:(0,n.jsxs)("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"#009FB7",strokeWidth:2,strokeLinecap:"round",className:"w-5 h-5",children:[(0,n.jsx)("rect",{x:"3",y:"11",width:"18",height:"11",rx:"2",ry:"2"}),(0,n.jsx)("path",{d:"M7 11V7a5 5 0 0 1 10 0v4"})]})},{title:"AI-guided access control",description:"PromptQL suggests what access should be granted based on roles and resource type, making it easy to onboard new users and sources.",borderRight:!0,borderBottom:!0,svgIcon:(0,n.jsxs)("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"#009FB7",strokeWidth:2,strokeLinecap:"round",className:"w-5 h-5",children:[(0,n.jsx)("path",{d:"M12 2L2 7l10 5 10-5-10-5z"}),(0,n.jsx)("path",{d:"M2 17l10 5 10-5M2 12l10 5 10-5"})]})},{title:"Permission-aware execution",description:"Every request is evaluated in real time against permissions. Queries only return what the requester is allowed to see, no matter how they are generated.",borderBottom:!0,svgIcon:(0,n.jsxs)("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"#009FB7",strokeWidth:2,strokeLinecap:"round",className:"w-5 h-5",children:[(0,n.jsx)("path",{d:"M22 11.08V12a10 10 0 1 1-5.93-9.14"}),(0,n.jsx)("polyline",{points:"22 4 12 14.01 9 11.01"})]})},{title:"Central user and agent directory",description:"Manage identities for both humans and AI agents in one place, with consistent policies applied across all interactions.",borderRight:!0,svgIcon:(0,n.jsxs)("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"#009FB7",strokeWidth:2,strokeLinecap:"round",className:"w-5 h-5",children:[(0,n.jsx)("path",{d:"M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"}),(0,n.jsx)("circle",{cx:"9",cy:"7",r:"4"}),(0,n.jsx)("path",{d:"M23 21v-2a4 4 0 0 0-3-3.87M16 3.13a4 4 0 0 1 0 7.75"})]})},{title:"Full auditability",description:"Every action is logged, traceable, and explainable. See who accessed what, ensuring accountability and simplifying compliance.",borderRight:!0,svgIcon:(0,n.jsxs)("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"#009FB7",strokeWidth:2,strokeLinecap:"round",className:"w-5 h-5",children:[(0,n.jsx)("path",{d:"M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"}),(0,n.jsx)("polyline",{points:"14 2 14 8 20 8"}),(0,n.jsx)("line",{x1:"16",y1:"13",x2:"8",y2:"13"}),(0,n.jsx)("line",{x1:"16",y1:"17",x2:"8",y2:"17"})]})},{title:"Scalable access governance",description:"Easily extend access policies as you add new data sources, users, and AI agents, without rewriting rules or introducing risk.",svgIcon:(0,n.jsxs)("svg",{viewBox:"0 0 24 24",fill:"none",stroke:"#009FB7",strokeWidth:2,strokeLinecap:"round",className:"w-5 h-5",children:[(0,n.jsx)("circle",{cx:"12",cy:"12",r:"3"}),(0,n.jsx)("path",{d:"M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 
10 0 1 0-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z"})]})}]},v={tag:"PILLAR 3",bgClass:"bg-surface",title:"Cost budgeting and optimization",description:"PromptQL gives you full visibility into AI spend across context exploration, query planning, and execution, with recommendations and controls to optimize each layer independently.",trustedIntelligenceArr:[{tag:"Context design",description:"PromptQL suggests context that should be persisted in the wiki or restructured to reduce token usage on context search and exploration.",imgSrc:"https://res.cloudinary.com/dh8fp23nd/image/upload/v1774361570/promptql-website/why-promptql-works/context-persistence-tip_jzuf3y.png"},{tag:"Reusable programs",description:"Convert repeated workflows into reusable programs, eliminating the need to regenerate plans on each request and reducing token consumption.",imgSrc:"https://res.cloudinary.com/dh8fp23nd/image/upload/v1774337692/promptql-website/why-promptql-works/saved-programs-tip_mosjpi.png"},{tag:"Granular usage controls",description:"Get fine-grained visibility into usage and enforce limits to control spend, prevent overuse, and enable chargeback.",imgSrc:"https://res.cloudinary.com/dh8fp23nd/image/upload/v1774337692/promptql-website/why-promptql-works/usage-visibility-tip_xgijmf.png"}]};function y(){let[e,r]=(0,o.useState)(!1);return(0,n.jsxs)(a.Z,{footerBgClass:"bg-surface",isHomepagePreFooter:!0,headerBtnBgClass:"bg-[#B6FC34]",headerNavBgClass:"hover:bg-[#D4D4D4]/40",removeTrustedBrands:!0,children:[(0,n.jsx)(i.T,{...u}
1),(0,n.jsx)("div",{className:"-mt-[125px] pt-[168px] relative bg-surface overflow-hidden",children:(0,n.jsx)("div",{className:"relative z-[1]",children:(0,n.jsx)("div",{className:"px-6 max-w-[1150px] mx-auto",children:(0,n.jsx)("div",{className:"max-w-[1060px] mx-auto",children:(0,n.jsx)("div",{className:"relative py-16 md:py-16 lg:py-24 border-b border-[#dededb] flex items-center",children:(0,n.jsxs)("div",{className:"z-[1] relative w-full",children:[(0,n.jsx)(s.Z,{textStyle:"h1",as:"h1",className:"w-full pb-4 text-[#030712] text-left lg:max-w-[717px]",children:"Why PromptQL works"}),(0,n.jsx)(s.Z,{textStyle:"caption",as:"p",className:"text-[#1F2937] text-left lg:max-w-[680px]",children:"PromptQL is trusted by platform and AI transformation teams responsible because it eliminates the three main bottlenecks that prevent AI from working at scale."}),(0,n.jsxs)("button",{onClick:()=>r(e=>!e),className:"flex items-center gap-2.5 mt-12 mb-6 cursor-pointer group",children:[(0,n.jsx)("span",{className:"w-[18px] h-[18px] border-[1.5px] rounded-[4px] flex items-center justify-center transition-colors ".concat(e?"border-neutral-500":"border-neutral-400 group-hover:border-neutral-500"),children:(0,n.jsx)(g,{className:"w-2.5 h-2.5 text-neutral-400 group-hover:text-neutral-500 transition-transform duration-300 ".concat(e?"rotate-45":"")})}),(0,n.jsx)(s.Z,{textStyle:"eyebrow1",className:"font-erode text-[0.75rem] font-medium tracking-[0.1em] uppercase text-neutral-400 group-hover:text-neutral-500 transition-colors",children:"Key blockers to scaling AI in the enterprise"})]}),(0,n.jsx)("div",{className:"grid grid-cols-1 md:grid-cols-3 gap-5 overflow-hidden transition-all duration-400 ease-out ".concat(e?"max-h-[800px] opacity-100":"max-h-0 opacity-0"),children:f.map(e=>(0,n.jsxs)("div",{className:"bg-[#FFF] border border-[#E5E5E5] rounded-2xl p-6 md:p-8 h-full",children:[(0,n.jsx)(s.Z,{as:"h3",textStyle:"captionMedium",className:"text-[#030712] mb-3",children:e.label}),(0,n.jsx)(s.Z,{textStyle:"body2",className:"text-[#374151]",children:e.text})]},e.label))})]})})})})})}),(0,n.jsx)(m,{}),(0,n.jsx)(l,{...b}),(0,n.jsx)(c.Z,{...v})]})}},65500:function(e){e.exports={style:{fontFamily:"'__Inter_f367f3', '__Inter_Fallback_f367f3'",fontStyle:"normal"},className:"__className_f367f3"}}},function(e){e.O(0,[9560,2714,5276,9555,2888,9774,179],function(){return e(e.s=14501)}),_N_E=e.O()}]);

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.