@font-face{font-family:Glueprint Mobile Sans;src:url(/_astro/DMSans.OkNhvBry.ttf) format("truetype");font-weight:100 900;font-style:normal;font-display:swap}@font-face{font-family:Glueprint Mobile Mono;src:url(/_astro/FiraCode.5S4LYTvM.ttf) format("truetype");font-weight:300 700;font-style:normal;font-display:swap}.surface-composition{--hero-preview-scale: 1;--hero-preview-height: 801px;position:relative;isolation:isolate;height:var(--hero-preview-height);margin-top:72px}.surface-composition__canvas{position:absolute;inset:0 auto auto 0;width:1240px;height:801px;padding-bottom:26px;transform:scale(var(--hero-preview-scale));transform-origin:left top}.portal-browser{position:absolute;z-index:0;inset:-34px 17px 12px;overflow:hidden;border:1px solid var(--line-strong);border-radius:14px;background:var(--surface);box-shadow:0 24px 70px var(--shadow)}.portal-browser__bar{height:39px;padding:0 13px;display:flex;align-items:center;gap:12px}.portal-browser__traffic{display:flex;gap:5px}.portal-browser__traffic i{width:7px;height:7px;border-radius:50%;background:var(--dim);opacity:.5}.portal-browser__address{width:340px;height:23px;display:flex;align-items:center;justify-content:center;gap:6px;margin:auto;border:1px solid var(--line);border-radius:5px;color:var(--muted);font-size:10px}.portal-browser__address .icon{width:10px;height:10px}.portal-browser__surface{display:flex;align-items:center;gap:5px;font-size:10px;color:var(--muted)}.portal-browser__surface i{width:5px;height:5px;border-radius:50%;background:var(--accent)}.product-window{position:relative;z-index:2;aspect-ratio:8 / 5;overflow:hidden;border:1px solid var(--line-strong);border-radius:12px;box-shadow:0 24px 70px var(--shadow)}.mobile-companion{position:absolute;right:-40px;bottom:10px;width:256px;aspect-ratio:402 / 874;filter:drop-shadow(0 12px 24px var(--shadow))}.mobile-device{position:absolute;inset:0;padding:1px;border:1px solid #464a50;border-radius:34px;background:#111315;box-shadow:0 0 0 5px #25282d,0 0 0 6px #555b64}.mobile-screen{position:relative;width:100%;height:100%;overflow:hidden;border-radius:32px}.demo-screen{background:var(--page)}.demo-screen>img{display:block;width:100%;height:100%;object-fit:contain}.demo-screen>[hidden]{display:none}[data-active-chapter] [data-demo-playback-surface]{cursor:pointer;touch-action:manipulation}.demo-playback-controls{--demo-control-shadow: 0 calc(2px / var(--hero-preview-scale)) calc(10px / var(--hero-preview-scale)) var(--shadow);position:absolute;z-index:5;inset:0 0 26px;display:flex;align-items:center;justify-content:center;gap:calc(8px / var(--hero-preview-scale));pointer-events:none}.demo-playback-toggle,.demo-playback-step{display:grid;place-items:center;flex:none;padding:0;border:0;border-radius:50%;background:transparent;color:var(--text);cursor:pointer;touch-action:manipulation;pointer-events:auto}.demo-playback-toggle{width:calc(48px / var(--hero-preview-scale));height:calc(48px / var(--hero-preview-scale))}.demo-playback-step{width:calc(44px / var(--hero-preview-scale));height:calc(44px / var(--hero-preview-scale))}.demo-playback-replay{position:absolute;top:calc(50% + 32px / var(--hero-preview-scale));left:50%;transform:translate(-50%)}.demo-playback-speed{position:absolute;bottom:calc(50% + 32px / var(--hero-preview-scale));left:50%;transform:translate(-50%);display:flex;align-items:center;gap:calc(8px / var(--hero-preview-scale));width:max-content;height:calc(44px / var(--hero-preview-scale));padding:0 calc(10px / var(--hero-preview-scale)) 0 calc(12px / var(--hero-preview-scale));border-radius:calc(22px / var(--hero-preview-scale));color:var(--text);font-size:calc(12px / var(--hero-preview-scale));font-weight:500;white-space:nowrap;cursor:pointer;pointer-events:auto}.demo-playback-speed:before{content:"";position:absolute;z-index:-1;inset:calc(4px / var(--hero-preview-scale)) 0;border:calc(1px / var(--hero-preview-scale)) solid var(--line-strong);border-radius:calc(18px / var(--hero-preview-scale));background:var(--surface);box-shadow:var(--demo-control-shadow)}.demo-playback-speed__label{color:var(--muted);font-size:calc(11px / var(--hero-preview-scale));font-weight:400}.demo-playback-speed__value{font-weight:600}.demo-playback-speed select{position:absolute;inset:0;appearance:none;width:100%;height:100%;padding:0;border:0;border-radius:inherit;opacity:0;font:inherit;cursor:pointer;touch-action:manipulation}.demo-playback-speed:hover:before{border-color:var(--accent)}.demo-playback-speed select:focus-visible{outline:none}.demo-playback-speed:has(select:focus-visible):before{outline:calc(2px / var(--hero-preview-scale)) solid var(--accent);outline-offset:calc(3px / var(--hero-preview-scale))}.demo-playback-speed option{background:var(--surface);color:var(--text)}.demo-playback-speed__arrow{width:calc(12px / var(--hero-preview-scale));height:calc(12px / var(--hero-preview-scale));color:var(--muted);pointer-events:none}.demo-playback-controls>[hidden]{display:none}.demo-playback-controls>button:focus-visible{outline:none}.demo-playback-controls>button:focus-visible>span[aria-hidden]{outline:calc(2px / var(--hero-preview-scale)) solid var(--accent);outline-offset:calc(3px / var(--hero-preview-scale))}.demo-playback-toggle__hint,.demo-playback-step__hint{display:grid;place-items:center;width:calc(48px / var(--hero-preview-scale));height:calc(48px / var(--hero-preview-scale));border:calc(1px / var(--hero-preview-scale)) solid var(--line-strong);border-radius:50%;background:var(--surface);box-shadow:var(--demo-control-shadow)}.demo-playback-toggle__hint .icon{width:calc(22px / var(--hero-preview-scale));height:calc(22px / var(--hero-preview-scale))}.demo-playback-step__hint{width:calc(36px / var(--hero-preview-scale));height:calc(36px / var(--hero-preview-scale))}.demo-playback-step__hint .icon{width:calc(18px / var(--hero-preview-scale));height:calc(18px / var(--hero-preview-scale))}.demo-playback-toggle[aria-label="Pause walkthrough"] .demo-playback-toggle__hint{visibility:hidden}.demo-playback-step:hover:not(:disabled) .demo-playback-step__hint{border-color:var(--accent);color:var(--accent)}.demo-playback-toggle:hover .demo-playback-toggle__hint{border-color:var(--accent);color:var(--accent)}.demo-playback-step:disabled{cursor:default}.demo-playback-step:disabled .demo-playback-step__hint{opacity:.4}.demo-playback-controls:has(.demo-playback-toggle[aria-label="Pause walkthrough"]) .demo-playback-step:not(:focus-visible),.demo-playback-controls:has(.demo-playback-toggle[aria-label="Pause walkthrough"]) .demo-playback-speed:not(:focus-within){opacity:0;pointer-events:none}.mobile-chapter-jump{position:absolute;z-index:2;inset:-6px;padding:0;border:0;border-radius:40px;background:transparent;cursor:pointer;touch-action:manipulation}.mobile-chapter-jump[hidden]{display:none}.mobile-chapter-jump:focus-visible{outline:3px solid var(--accent);outline-offset:4px}@supports (width: calc(1px*tan(atan2(1px,1px)))){.surface-composition{--preview-budget: min(100vw - 47px, 50vw + 604.5px);--hero-preview-scale: min(1, tan(atan2(var(--preview-budget), 1280px)));--hero-preview-height: min(801px, calc(var(--preview-budget) * .62578125))}@media(max-width:760px){.surface-composition{--preview-budget: calc(100vw - 38px) }}}.demo-screen>iframe{position:absolute;inset:0;border:0;width:1440px;height:900px;transform:scale(.8597222222);transform-origin:top left;pointer-events:none}.phone-app{position:relative;display:flex;flex-direction:column;width:402px;height:874px;transform:scale(.62686567);transform-origin:top left;background:var(--phone-bg);color:var(--phone-text);font:15px/1.5 Glueprint Mobile Sans,sans-serif;letter-spacing:0;text-align:left}.phone-app [hidden]{display:none!important}.phone-app .phone-status{height:62px;flex:0 0 62px;padding:19px 30px 0 39px;display:flex;justify-content:space-between;color:var(--phone-text);background:var(--phone-bg);font:600 17px/1.5 -apple-system,sans-serif}.phone-app .phone-island{position:absolute;width:126px;height:37px;left:138px;top:14px;border-radius:28px;background:#000}.phone-app .phone-status__icons{display:flex;align-items:flex-start;padding-top:4px;gap:6px;font-size:8px}.phone-app .phone-status__icons svg{width:19px;height:16px}.phone-app .phone-battery{width:23px;height:12px;border:1px solid var(--phone-muted);border-radius:4px;padding:2px}.phone-app .phone-battery:after{content:"";display:block;height:100%;border-radius:1px;background:var(--phone-text)}.phone-app .phone-header{min-height:66px;flex:0 0 66px;display:flex;align-items:center;gap:10px;padding:10px 14px;border-bottom:1px solid var(--phone-line)}.phone-app .phone-back{font-size:26px;line-height:1}.phone-app .phone-header__text{flex:1;min-width:0}.phone-app .phone-title{display:flex;align-items:center;gap:8px;font-size:16px;font-weight:600;white-space:nowrap}.phone-app .phone-title>span{overflow:hidden;text-overflow:ellipsis}.phone-app .phone-title i{width:9px;height:9px;flex:none;border-radius:50%;background:var(--accent)}.phone-app[data-stage=waiting] .phone-title i{background:var(--phone-waiting)}.phone-app .phone-subtitle{display:flex;align-items:center;gap:6px;color:var(--phone-dim);font-size:11px;margin-top:3px;white-space:nowrap}.phone-app .phone-subtitle>span:last-child{overflow:hidden;text-overflow:ellipsis}.phone-app .phone-subtitle b{display:grid;place-items:center;width:15px;height:15px;flex:none;border-radius:4px;background:#ee4d9a;color:#fff;font:600 9px/1 sans-serif}.phone-app .phone-agent,.phone-app .phone-agent svg{width:16px;height:16px;flex:none}.phone-app .phone-agent--claude{color:#e3915f}.phone-app .phone-branch-icon{width:20px;height:24px;fill:none;stroke:var(--phone-muted);stroke-width:1.7}.phone-app .phone-dots{font-size:24px}.phone-app .phone-conversation{flex:1;min-height:0;overflow:auto;scrollbar-width:none;padding:12px 16px 18px;overscroll-behavior:contain}.phone-app .phone-user-meta{text-align:right;font-size:11px;color:var(--phone-dim);margin:0 2px 5px}.phone-app .phone-user{margin-left:42px;padding:10px 13px;border:1px solid var(--phone-line);border-radius:10px;color:var(--phone-text);background:var(--phone-bg2);line-height:1.5}.phone-app .phone-reply{display:flex;gap:12px;margin:22px 3px 0;position:relative}.phone-app .phone-reply>i{flex:none;width:8px;height:8px;border:2px solid var(--phone-dim);border-radius:50%;margin-top:8px}.phone-app .phone-reply p{margin:0;font-size:15px;line-height:1.55;color:var(--phone-text)}.phone-app .phone-tool{padding-left:25px;margin:20px 4px 10px;color:var(--phone-muted)}.phone-app .phone-tool>span{display:block;font-size:12px;font-weight:600;margin-bottom:6px}.phone-app .phone-tool code{display:block;padding:8px 10px;border:1px solid var(--phone-line);border-radius:9px;background:var(--phone-bg3);font:13px/1.5 Glueprint Mobile Mono,monospace}.phone-app .phone-working{display:flex;gap:9px;align-items:center;margin:22px 0;color:var(--phone-muted);font-size:12px;font-weight:600}.phone-app .phone-working>i{display:flex;justify-content:center;gap:2px;align-items:center;width:26px;height:26px;border:1px solid var(--accent);border-radius:50%}.phone-app .phone-working b{width:2px;height:9px;background:var(--accent);border-radius:2px;animation:phone-working 1s ease-in-out infinite alternate}.phone-app .phone-working b:nth-child(2){animation-delay:-.3s;height:13px}.phone-app .phone-working b:nth-child(3){animation-delay:-.6s}.phone-app .phone-working code{color:var(--phone-dim);font-size:11px}.phone-app .phone-question{flex:0 0 auto;margin:0 12px 18px;border:1px solid color-mix(in srgb,var(--phone-waiting) 32%,transparent);border-radius:18px;padding:13px 14px 12px;background:var(--phone-question-bg)}.phone-app .phone-question__kicker{display:flex;align-items:center;gap:7px;color:var(--phone-waiting);font-size:12px;letter-spacing:0;font-weight:600}.phone-app .phone-question__kicker>i{width:14px;height:14px;border:1.5px solid currentColor;border-radius:50%;font:10px/12px sans-serif;text-align:center}.phone-app .phone-question__kicker>span{margin-left:auto;color:var(--phone-muted)}.phone-app .phone-question h3{font-size:14px;font-weight:500;line-height:1.45;margin:10px 0 9px}.phone-app .phone-question__option{position:relative;display:flex;align-items:flex-start;gap:11px;margin-top:7px;padding:11px 12px;border:1px solid var(--phone-line2);border-radius:12px;background:var(--phone-bg)}.phone-app .phone-question__option>b{display:grid;place-items:center;width:22px;height:22px;flex:none;background:var(--phone-bg3);color:var(--phone-waiting);border-radius:7px;font:600 12px/1 Glueprint Mobile Mono,monospace}.phone-app .phone-question__option>span:not(.phone-touch){flex:1;font-size:13.5px;font-weight:500;line-height:1.3}.phone-app .phone-question__option small{display:block;margin-top:2px;color:var(--phone-muted);font-size:11.5px;font-weight:400}.phone-app .phone-question__option>i{color:var(--phone-muted);font:20px/1 sans-serif}.phone-app .phone-question__option.is-selected{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 8%,var(--phone-bg))}.phone-app .phone-question__custom{display:flex;gap:11px;align-items:center;margin-top:7px;padding:11px 12px;border:1px solid var(--phone-line2);border-radius:12px;color:var(--phone-dim);font-size:13px}.phone-app .phone-question__custom>i{width:22px;text-align:center;font-style:normal}.phone-app .phone-touch{position:absolute;left:calc(50% - 21px);top:calc(50% - 21px);width:42px;height:42px;color:var(--phone-text);border:1px solid color-mix(in srgb,currentColor 32%,transparent);border-radius:50%;background:color-mix(in srgb,currentColor 15%,transparent);box-shadow:0 0 18px color-mix(in srgb,currentColor 21%,transparent),inset 0 0 8px color-mix(in srgb,currentColor 13%,transparent)}.phone-app .phone-touch:after{content:"";position:absolute;left:50%;top:50%;width:16px;height:16px;transform:translate(-50%,-50%);border-radius:50%;background:currentColor;box-shadow:0 0 5px color-mix(in srgb,currentColor 60%,transparent)}.phone-app .phone-composer{flex:0 0 auto;height:103px;margin:5px 12px 18px;padding:13px 15px 11px;border:1px solid var(--phone-line2);border-radius:12px;background:var(--phone-bg2)}.phone-app .phone-composer>span{display:block;color:var(--phone-dim);font-size:15px}.phone-app .phone-composer>div{display:flex;align-items:center;gap:9px;margin-top:11px;font-size:11.5px;color:var(--phone-muted)}.phone-app .phone-composer b{font-size:22px;line-height:1}.phone-app .phone-composer>div>span{padding:6px 10px;white-space:nowrap}.phone-app .phone-composer i{width:38px;height:38px;display:grid;place-items:center;margin-left:auto;border-radius:7px;background:var(--phone-waiting);color:var(--phone-stop-ink);font:19px/1 sans-serif}.phone-app[data-stage=complete] .phone-composer i{background:color-mix(in srgb,var(--accent) 30%,var(--phone-bg));color:var(--phone-text)}@keyframes phone-working{to{transform:scaleY(.45)}}.product-demo[data-paused=true] .phone-app *{animation-play-state:paused!important}@media(prefers-reduced-motion:reduce){.phone-app *{animation-play-state:paused!important}}.mobile-companion{z-index:1;transform:translateY(-116px);transform-origin:bottom right}.product-demo:not([data-phone-front=true]) .mobile-device{border-color:var(--line-strong);background:var(--surface);box-shadow:0 0 0 5px var(--surface),0 0 0 6px var(--line-strong)}[data-active-chapter] .mobile-companion{transition:transform .45s ease}[data-active-chapter] .surface-composition{transition:height .45s ease}.product-demo[data-phone-front=true] .surface-composition{height:max(var(--hero-preview-height),var(--hero-phone-stage-height))}.product-demo[data-phone-front=true] .mobile-companion{z-index:4;transform:translateY(var(--hero-phone-offset)) scale(var(--hero-phone-scale))}.phone-app .phone-user--followup{margin-top:18px;font-size:14px}@media(prefers-reduced-motion:reduce){.product-demo .mobile-companion,.product-demo .surface-composition{transition:none}}.phone-app .phone-send{position:relative}.phone-app .phone-composer>.is-typing{color:var(--phone-text);font-size:12px;line-height:1.35}.phone-app .phone-home-indicator{flex:0 0 34px;position:relative}.phone-app .phone-home-indicator:after{content:"";position:absolute;left:50%;bottom:8px;width:114px;height:4px;transform:translate(-50%);border-radius:4px;background:var(--phone-text)}.phone-app .phone-subtitle [data-phone-branch],.phone-app .phone-working code{font-family:Glueprint Mobile Mono,monospace}.adoption-stage-preview{display:flex;align-items:center;gap:14px;color:var(--text);border-radius:10px;text-decoration:none}.adoption-stage-preview:hover .adoption-stage-preview__title{color:var(--accent);text-decoration:underline;text-underline-offset:3px}.adoption-stage-preview:focus-visible,.stage-demo :is(button,a,select,input):focus-visible{outline:2px solid var(--accent);outline-offset:5px}.adoption-stage-preview__image{width:116px;flex-shrink:0;aspect-ratio:8 / 5;position:relative;border-radius:7px;overflow:hidden;border:1px solid var(--line-strong);background:var(--surface)}.adoption-stage-preview__image img{width:100%;height:100%;object-fit:cover}.adoption-stage-preview__play{position:absolute;inset:0;margin:auto;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--surface);color:var(--text);box-shadow:0 1px 8px #0004;font-size:12px}.adoption-stage-preview__title{display:block;font-size:15px;line-height:1.45;font-weight:600}.adoption-stage-preview__duration{display:block;margin-top:5px;color:var(--muted);font-size:12px}.stage-demo{box-sizing:border-box;margin:auto;width:min(1160px,calc(100vw - 40px));max-width:none;max-height:calc(100dvh - 32px);padding:22px;border:1px solid var(--line-strong);border-radius:16px;color:var(--text);background:var(--surface);overflow:auto;box-shadow:0 24px 100px #0007}.stage-demo::backdrop{background:#060a14bb;backdrop-filter:blur(5px)}.stage-demo__header{display:flex;align-items:flex-start;justify-content:space-between;gap:20px}.stage-demo__header .eyebrow{font-size:10px;margin-bottom:6px}.stage-demo__header h2{font-size:clamp(21px,2.6vw,29px);letter-spacing:-.035em;line-height:1.2;margin:0}.stage-demo button,.stage-demo select{font:inherit;color:var(--text);background:var(--surface);border:1px solid var(--line-strong);border-radius:6px;cursor:pointer}.stage-demo button{min-height:40px;padding:8px 13px}.stage-demo button:disabled{opacity:.4;cursor:default}.stage-demo__close{flex-shrink:0}.stage-demo__note{margin:10px 0 16px;font-size:13px;color:var(--muted);line-height:1.5}.stage-demo__visual{position:relative;height:min(62vh,680px);min-height:240px;overflow:hidden;border:1px solid var(--line);border-radius:9px;background:var(--section-alt)}.stage-demo__desktop{position:absolute;width:1440px;height:900px;transform-origin:0 0}.stage-demo__desktop img,.stage-demo__desktop iframe{position:absolute;inset:0;width:1440px;height:900px;border:0}.stage-demo__phone{position:absolute;inset:12px 0}.stage-demo__phone .mobile-companion{position:relative;top:0;right:auto;bottom:auto;width:256px;margin:auto;transform-origin:top center;transform:scale(var(--stage-phone-scale,1));filter:none}.stage-demo[data-phone=true] .stage-demo__desktop{opacity:.3}.stage-demo__loading{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);margin:0;padding:12px 18px;border-radius:8px;color:var(--text);background:var(--surface);box-shadow:0 4px 24px #0003}.stage-demo__ended{position:absolute;inset:0;z-index:3;display:grid;place-items:center;background:#060a1459}.stage-demo .stage-demo__restart{display:inline-flex;align-items:center;gap:10px;min-height:56px;padding:14px 24px;border-color:var(--accent);border-radius:10px;background:var(--accent);color:var(--accent-ink);font-size:17px;font-weight:600;box-shadow:0 8px 32px #0005}.stage-demo .stage-demo__restart:hover{background:var(--accent-hover);border-color:var(--accent-hover)}.stage-demo__seek{display:block;width:100%;height:24px;margin:4px 0 0;padding:0;border:0;appearance:none;-webkit-appearance:none;background:transparent;cursor:pointer;--progress:0%}.stage-demo__seek::-webkit-slider-runnable-track{height:2px;border-radius:2px;background:linear-gradient(to right,var(--accent) var(--progress),var(--line-strong) var(--progress))}.stage-demo__seek::-moz-range-track{height:2px;border-radius:2px;background:linear-gradient(to right,var(--accent) var(--progress),var(--line-strong) var(--progress))}.stage-demo__seek::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:10px;height:10px;margin-top:-4px;border-radius:50%;background:var(--accent);opacity:0}.stage-demo__seek::-moz-range-thumb{width:10px;height:10px;border:0;border-radius:50%;background:var(--accent);opacity:0}.stage-demo__seek:hover::-webkit-slider-thumb,.stage-demo__seek:focus-visible::-webkit-slider-thumb{opacity:1}.stage-demo__seek:hover::-moz-range-thumb,.stage-demo__seek:focus-visible::-moz-range-thumb{opacity:1}.stage-demo__seek:disabled{cursor:default;opacity:.4}.stage-demo__caption{margin:4px 0 16px;min-height:2.8em;font-size:16px;font-weight:500;line-height:1.4}.stage-demo__controls{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:13px}.stage-demo__transport{display:flex;align-items:center;gap:8px}.stage-demo__zoom{display:none}.stage-demo__controls label{display:flex;gap:6px;align-items:center;margin-left:auto;color:var(--muted)}.stage-demo__controls select{min-height:40px;padding:5px}.stage-demo__time{min-width:85px;text-align:right;font:12px var(--font-mono);color:var(--muted)}.stage-demo__fallback{border-top:1px solid var(--line);margin-top:16px;font-size:14px}.stage-demo__fallback a{color:var(--accent);margin-left:16px}.stage-demo [hidden]{display:none!important}@media(max-width:600px){.stage-demo{width:calc(100vw - 16px);max-height:calc(100dvh - 16px);padding:14px}.stage-demo__header{gap:8px}.stage-demo__close{font-size:12px!important;padding:6px 9px!important}.stage-demo__visual{height:auto;min-height:0;aspect-ratio:8 / 5}.stage-demo[data-detail=true]:not([data-phone=true]) .stage-demo__visual{aspect-ratio:4 / 3}.stage-demo[data-phone=true] .stage-demo__visual{height:min(50dvh,480px);aspect-ratio:auto}.stage-demo__controls{gap:6px}.stage-demo__transport{flex-basis:100%;display:grid;grid-template-columns:44px minmax(0,1fr) 44px auto;gap:6px}.stage-demo__controls button{min-height:44px;padding:8px 10px}.stage-demo:not([data-phone=true]) .stage-demo__zoom{display:block}.stage-demo__controls label{margin-left:0}.stage-demo__time{margin-left:auto;min-width:0;font-size:11px}.stage-demo__caption{font-size:14px;min-height:2.8em;margin:4px 0 12px}.adoption-stage-preview__image{width:108px}}
