.agent-connect-page,.agent-landing-page{--agent-red: #f5333a;--agent-ink: var(--color-page-text);--agent-muted: var(--color-page-text-muted);--agent-line: var(--color-page-border);--agent-surface: var(--color-page-surface)}.agent-connect-page{max-width:72rem;margin:0 auto;padding:0 20px 6rem}.agent-demo-frame,.agent-setup-frame,.agent-flow-frame{padding-bottom:44px}.agent-flow-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:0 44px;padding:0;border-top:1px solid var(--agent-line);border-left:1px solid var(--agent-line);list-style:none}.agent-flow-grid li{display:flex;min-height:23rem;flex-direction:column;padding:clamp(1.3rem,3vw,2rem);border-right:1px solid var(--agent-line);border-bottom:1px solid var(--agent-line);background:var(--agent-surface)}.agent-flow-step-head{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;font-family:JetBrains Mono,monospace}.agent-flow-step-head span{color:var(--agent-red);font-size:1.55rem;font-weight:600}.agent-flow-step-head em{color:var(--agent-muted);font-size:.62rem;font-style:normal;font-weight:600;letter-spacing:.08em;text-align:right}.agent-flow-grid h3{margin:2.4rem 0 0;color:var(--agent-ink);font-family:var(--font-display);font-size:clamp(1.45rem,2.4vw,1.9rem);line-height:1.08}.agent-flow-grid p{margin:1rem 0 1.5rem;color:var(--agent-muted);font-size:.88rem;line-height:1.65}.agent-flow-grid a{align-self:flex-start;margin-top:auto;border-bottom:1px solid var(--agent-red);color:var(--agent-ink);font:600 .7rem/1.5 JetBrains Mono,monospace;text-decoration:none}.agent-demo-shell{margin:2.5rem 44px 0;border:1px solid var(--agent-line);background:var(--agent-surface);box-shadow:0 24px 64px color-mix(in srgb,var(--agent-ink) 9%,transparent)}.agent-demo-chrome{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:1rem;padding:.72rem .9rem;border-bottom:1px solid #303030;background:#191919;color:#898989;font:.6rem/1 JetBrains Mono,monospace}.agent-demo-chrome>span{display:flex;gap:.32rem}.agent-demo-chrome i{width:7px;height:7px;border-radius:999px;background:#454545}.agent-demo-chrome i:first-child{background:var(--agent-red)}.agent-demo-chrome strong{color:#bcbcbc;font-weight:500}.agent-demo-chrome em{justify-self:end;font-style:normal}.agent-demo-canvas{max-height:42rem;min-height:34rem;overflow:auto;padding:clamp(1rem,3vw,2rem);background:#101010}.agent-demo-canvas-web{padding:0;background:#f7f7f5}.agent-demo-shell-video{overflow:hidden;background:transparent}.agent-demo-video-wrap{position:relative;background:transparent;margin-top:2.5rem}.agent-demo-video{display:block;width:100%;height:auto;aspect-ratio:29 / 18;background:transparent;object-fit:contain;border:1px solid rgba(255,255,255,.14);border-radius:8px;box-shadow:0 24px 64px color-mix(in srgb,var(--agent-ink) 14%,transparent)}.agent-demo-transcript{border-top:1px solid rgba(255,255,255,.14);background:#111;color:#f5f5f5;font-family:var(--agent-mono);font-size:.78rem;line-height:1.65}.agent-demo-transcript summary{cursor:pointer;padding:14px 18px;color:#d8d8d8;font-weight:700;letter-spacing:.04em;text-transform:uppercase}.agent-demo-transcript ol{margin:0;padding:0 28px 20px 48px}.agent-demo-transcript li+li{margin-top:8px}.agent-demo-transcript li{display:grid;grid-template-columns:3.25rem minmax(0,1fr);gap:.75rem}.agent-demo-transcript time{color:var(--agent-red);font-variant-numeric:tabular-nums;font-weight:700}.agent-demo-credit{margin:14px 44px 0;color:var(--agent-muted);font:.7rem/1.6 JetBrains Mono,monospace}.agent-demo-credit a{color:var(--agent-ink)}.agent-setup-grid{margin:0 44px;border:1px solid var(--agent-line);background:var(--agent-surface)}.agent-setup-actions{display:flex;align-items:flex-start;flex-direction:column;justify-content:center;padding:clamp(1.5rem,4vw,2.5rem)}.agent-setup-actions>span{color:var(--agent-red);font:600 .65rem/1 JetBrains Mono,monospace;letter-spacing:.1em}.agent-setup-actions h3{margin:.8rem 0 0;color:var(--agent-ink);font-family:var(--font-display);font-size:1.75rem;line-height:1.08}.agent-setup-actions p{margin:.9rem 0 1.4rem;color:var(--agent-muted);font-size:.9rem;line-height:1.65}.agent-setup-launch{margin-top:1rem;border-bottom:1px solid var(--agent-red);color:var(--agent-ink);font:600 .72rem/1.4 JetBrains Mono,monospace;text-decoration:none}.agent-openclaw-session{min-height:30rem;border:1px solid #302e2a;background:#171715;color:#ece7dc;font-family:JetBrains Mono,monospace}.agent-openclaw-status{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.9rem 1rem;border-bottom:1px solid #302e2a;color:#77736b;font-size:.65rem}.agent-openclaw-status strong{color:#72aa7b;font-weight:500}.agent-openclaw-body{padding:clamp(1.25rem,4vw,2.5rem)}.agent-openclaw-prompt,.agent-openclaw-answer{max-width:52rem;margin:0 0 1.5rem;font-size:.86rem;line-height:1.7}.agent-openclaw-prompt span{display:block;margin-bottom:.5rem;color:#ff7a80;font-size:.62rem;letter-spacing:.1em}.agent-openclaw-tool{display:flex;flex-wrap:wrap;align-items:center;gap:.7rem;margin-top:.75rem;padding:.75rem .9rem;border:1px solid #302e2a;background:#1f1e1b;font-size:.68rem}.agent-openclaw-tool span{color:#77736b}.agent-openclaw-tool code{background:transparent;color:#ff7a80}.agent-openclaw-tool em{margin-left:auto;color:#8eb392;font-style:normal}.agent-openclaw-answer{margin-top:1.5rem;color:#cfc8bb}.agent-openclaw-approval{max-width:36rem;padding:1rem;border:1px solid #664247;background:#231a1b}.agent-openclaw-approval strong,.agent-openclaw-approval span{display:block}.agent-openclaw-approval strong{color:#ff7a80;font-size:.62rem;letter-spacing:.1em}.agent-openclaw-approval span{margin-top:.55rem;font-size:.75rem;line-height:1.5}.agent-openclaw-approval div{display:flex;gap:.55rem;margin-top:1rem}.agent-openclaw-approval button{padding:.55rem .75rem;border:1px solid #664247;background:#ff7a80;color:#171715;font:600 .65rem/1 JetBrains Mono,monospace}.agent-openclaw-approval button+button{background:transparent;color:#d7d0c4}.agent-connect-hero{position:relative;padding:clamp(5.5rem,11vw,9.5rem) 0 clamp(4.5rem,8vw,7rem);border-left:1px solid var(--agent-line);border-right:1px solid var(--agent-line);text-align:center;overflow:hidden}.agent-connect-hero:before{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(to right,color-mix(in srgb,var(--agent-line) 54%,transparent) 1px,transparent 1px),linear-gradient(to bottom,color-mix(in srgb,var(--agent-line) 54%,transparent) 1px,transparent 1px);background-size:32px 32px;mask-image:linear-gradient(to bottom,black,transparent 78%);opacity:.45}.agent-connect-hero:after{content:"";position:absolute;left:50%;top:18%;width:min(42rem,82vw);height:22rem;transform:translate(-50%);background:radial-gradient(circle,color-mix(in srgb,var(--agent-red) 13%,transparent),transparent 68%);filter:blur(12px);pointer-events:none}.agent-connect-hero>*{position:relative;z-index:1}.agent-connect-kicker,.agent-section-heading p,.agent-relay-intro>p,.agent-final-cta>p{margin:0;font:600 .69rem/1.2 JetBrains Mono,monospace;letter-spacing:.14em;color:var(--agent-red)}.agent-live-dot{display:inline-block;width:7px;height:7px;margin-right:.45rem;border-radius:999px;background:var(--agent-red);box-shadow:0 0 0 5px color-mix(in srgb,var(--agent-red) 12%,transparent)}.agent-connect-hero h1{max-width:58rem;margin:1.35rem auto 0;font-size:clamp(3.5rem,8vw,7.4rem);line-height:.88;letter-spacing:-.055em;color:var(--agent-ink)}.agent-connect-lede{max-width:47rem;margin:2rem auto 0;font-size:clamp(1.05rem,2vw,1.28rem);line-height:1.65;color:var(--agent-muted)}.agent-connect-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:.75rem;margin-top:2rem}.agent-copy,.agent-open-chatgpt{display:inline-flex;align-items:center;justify-content:center;gap:.65rem;min-height:48px;padding:.78rem 1.1rem;border:1px solid var(--agent-red);font:600 .78rem/1 JetBrains Mono,monospace;letter-spacing:.02em;text-decoration:none;transition:transform .16s ease,box-shadow .16s ease,background .16s ease}.agent-copy{background:var(--agent-red);color:#fff}.agent-copy:hover,.agent-open-chatgpt:hover{transform:translateY(-2px);box-shadow:0 9px 24px color-mix(in srgb,var(--agent-red) 18%,transparent)}.agent-open-chatgpt{background:var(--agent-surface);color:var(--agent-ink);border-color:var(--agent-line)}.agent-connect-footnote{margin:1.4rem auto 0;font:.72rem/1.6 JetBrains Mono,monospace;color:var(--agent-muted)}.agent-connect-footnote code{color:var(--agent-ink);background:transparent}.agent-experience-section{padding:clamp(3rem,6vw,5rem);border:1px solid var(--agent-line);border-top:0;background:color-mix(in srgb,var(--agent-red) 2.5%,var(--color-page-bg))}.agent-experience-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:2rem;margin-bottom:2rem}.agent-experience-heading p{margin:0;font:600 .69rem/1.2 JetBrains Mono,monospace;letter-spacing:.14em;color:var(--agent-red)}.agent-experience-heading h2{margin:.65rem 0 0;font-size:clamp(2rem,4.4vw,3.7rem);line-height:.98;letter-spacing:-.035em;color:var(--agent-ink)}.agent-experience-heading>span{max-width:28rem;font-size:.92rem;line-height:1.65;color:var(--agent-muted)}.agent-experience-shell{border:1px solid var(--agent-line);background:var(--agent-surface);box-shadow:0 28px 70px color-mix(in srgb,var(--agent-ink) 10%,transparent)}.agent-experience-tabs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border-bottom:1px solid var(--agent-line)}.agent-experience-tabs button{display:flex;min-width:0;flex-direction:column;gap:.34rem;padding:1rem 1.05rem;border:0;border-right:1px solid var(--agent-line);background:transparent;color:var(--agent-ink);text-align:left;transition:background .15s ease,color .15s ease}.agent-experience-tabs button:last-child{border-right:0}.agent-experience-tabs button:hover{background:color-mix(in srgb,var(--agent-ink) 5%,transparent)}.agent-experience-tabs button.active{background:var(--agent-ink);color:var(--color-page-bg)}.agent-experience-tabs strong{overflow:hidden;font:600 .78rem/1.2 Inter,sans-serif;text-overflow:ellipsis;white-space:nowrap}.agent-experience-tabs small{font:.58rem/1 JetBrains Mono,monospace;letter-spacing:.08em;opacity:.58;text-transform:uppercase}.agent-experience-panel{min-width:0}.agent-experience-chrome{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:1rem;padding:.72rem .9rem;border-bottom:1px solid #303030;background:#191919;color:#898989;font:.6rem/1 JetBrains Mono,monospace}.agent-experience-chrome>span{display:flex;gap:.32rem}.agent-experience-chrome i{width:7px;height:7px;border-radius:999px;background:#454545}.agent-experience-chrome i:first-child{background:var(--agent-red)}.agent-experience-chrome strong{color:#bcbcbc;font-weight:500}.agent-experience-chrome em{justify-self:end;font-style:normal}.agent-experience-canvas{min-height:38rem;padding:clamp(1rem,3vw,2rem);background:#101010;animation:agent-panel-in .22s ease-out}.agent-experience-panel-web-chat .agent-experience-canvas{padding:0;background:#f7f7f5}.agent-experience-credit{margin:1rem 0 0;font:.68rem/1.6 JetBrains Mono,monospace;color:var(--agent-muted)}.agent-experience-credit a{color:var(--agent-ink)}.agent-client-section,.agent-relay-section,.agent-final-cta{border:1px solid var(--agent-line);border-top:0}.agent-client-section,.agent-relay-section{padding:clamp(3rem,6vw,5rem)}.agent-section-heading,.agent-relay-intro{display:flex;align-items:flex-end;justify-content:space-between;gap:2rem;margin-bottom:2rem}.agent-section-heading h2,.agent-relay-intro h2,.agent-final-cta h2{margin:.65rem 0 0;font-size:clamp(2rem,4.4vw,3.7rem);line-height:.98;letter-spacing:-.035em;color:var(--agent-ink)}.agent-section-heading>span,.agent-relay-intro>span{max-width:27rem;font-size:.92rem;line-height:1.65;color:var(--agent-muted)}.agent-client-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));border-top:1px solid var(--agent-line);border-left:1px solid var(--agent-line)}.agent-client-card{grid-column:span 2;display:flex;min-height:19rem;flex-direction:column;padding:1.5rem;border-right:1px solid var(--agent-line);border-bottom:1px solid var(--agent-line);background:var(--agent-surface);transition:transform .18s ease,box-shadow .18s ease}.agent-client-card:last-child{grid-column:span 6;min-height:14rem}.agent-client-card:hover{position:relative;z-index:1;transform:translateY(-3px);box-shadow:0 18px 45px color-mix(in srgb,var(--agent-ink) 9%,transparent)}.agent-client-card-top{display:flex;align-items:center;justify-content:space-between;gap:1rem}.agent-client-mark{display:inline-flex;height:42px;min-width:42px;align-items:center;justify-content:center;padding:0 .55rem;background:var(--agent-ink);color:var(--color-page-bg);font:700 .67rem/1 JetBrains Mono,monospace;letter-spacing:.08em}.agent-client-status{font:600 .6rem/1 JetBrains Mono,monospace;letter-spacing:.11em;color:var(--agent-red)}.agent-client-card h3{margin:2.1rem 0 0;font-size:1.75rem;color:var(--agent-ink)}.agent-client-card p{margin:.85rem 0 1.5rem;font-size:.9rem;line-height:1.65;color:var(--agent-muted)}.agent-client-links{display:flex;flex-wrap:wrap;align-items:center;gap:.65rem 1rem;margin-top:auto}.agent-client-links a,.agent-client-links>button{font:600 .72rem/1.2 JetBrains Mono,monospace}.agent-client-links a{color:var(--agent-ink);text-decoration:none}.agent-client-links a:hover,.agent-client-links .agent-client-launch{color:var(--agent-red)}.agent-copy-compact{min-height:auto;padding:0;border:0;background:transparent;color:var(--agent-red);box-shadow:none}.agent-copy-compact:hover{transform:none;box-shadow:none}.agent-relay-section{background:color-mix(in srgb,var(--agent-ink) 2.5%,var(--color-page-bg))}.agent-relay-shell{display:grid;grid-template-columns:minmax(13rem,.72fr) minmax(0,2.1fr);border:1px solid var(--agent-line);background:var(--agent-surface)}.agent-relay-tabs{display:flex;flex-direction:column;border-right:1px solid var(--agent-line)}.agent-relay-tabs button{display:grid;grid-template-columns:2rem 1fr;grid-template-rows:auto auto;column-gap:.75rem;padding:1.2rem;border:0;border-bottom:1px solid var(--agent-line);background:transparent;color:var(--agent-ink);text-align:left;transition:background .15s ease,color .15s ease}.agent-relay-tabs button:last-child{border-bottom:0}.agent-relay-tabs button:hover,.agent-relay-tabs button.active{background:var(--agent-ink);color:var(--color-page-bg)}.agent-relay-tabs span{grid-row:span 2;font:.68rem/1.25 JetBrains Mono,monospace;color:var(--agent-red)}.agent-relay-tabs strong{font:600 .86rem/1.2 Inter,sans-serif}.agent-relay-tabs small{margin-top:.3rem;font:.64rem/1 JetBrains Mono,monospace;opacity:.62}.agent-relay-terminal{min-width:0;background:#141414;color:#f3eee2}.agent-terminal-bar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:1rem;padding:.8rem 1rem;border-bottom:1px solid #33302b;font:.62rem/1 JetBrains Mono,monospace;color:#8a857b}.agent-terminal-bar>span:last-child{justify-self:end;color:#ff7a80}.agent-terminal-lights{display:flex;gap:.32rem}.agent-terminal-lights i{display:block;width:7px;height:7px;border-radius:999px;background:#45413b}.agent-terminal-lights i:first-child{background:#f5333a}.agent-terminal-body{min-height:23rem;padding:clamp(1.5rem,4vw,3rem);animation:agent-panel-in .22s ease-out}@keyframes agent-panel-in{0%{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}.agent-terminal-label{margin:0;font:600 .65rem/1.2 JetBrains Mono,monospace;letter-spacing:.1em;text-transform:uppercase;color:#ff7a80}.agent-terminal-prompt{margin:2rem 0 0;font:1rem/1.7 JetBrains Mono,monospace;color:#f3eee2}.agent-terminal-prompt span{color:#ff7a80}.agent-terminal-call{display:flex;flex-wrap:wrap;align-items:center;gap:.7rem;margin-top:2rem;padding:.85rem 1rem;border:1px solid #33302b;background:#1e1b17;font:.68rem/1.2 JetBrains Mono,monospace}.agent-terminal-call>span{color:#8a857b}.agent-terminal-call code{color:#ff7a80;background:transparent}.agent-terminal-call em{margin-left:auto;font-style:normal;color:#9dbf98}.agent-terminal-result{max-width:46rem;margin:1.4rem 0 0;font-size:.92rem;line-height:1.7;color:#c9c2b2}.agent-terminal-proof{display:flex;flex-wrap:wrap;gap:.55rem;margin-top:2rem}.agent-terminal-proof span{padding:.38rem .52rem;border:1px solid #33302b;font:.58rem/1 JetBrains Mono,monospace;letter-spacing:.06em;color:#8a857b;text-transform:uppercase}.agent-final-cta{padding:clamp(3.5rem,8vw,7rem) clamp(2rem,8vw,7rem);text-align:center}.agent-final-cta h2{max-width:55rem;margin-left:auto;margin-right:auto}.agent-final-cta>div{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:1rem 1.4rem;margin-top:2rem}.agent-final-cta>div>a:last-child{font:600 .78rem/1 JetBrains Mono,monospace;color:var(--agent-ink);text-decoration:none}@media(max-width:860px){.agent-flow-grid{grid-template-columns:1fr}.agent-flow-grid li{min-height:0}.agent-client-card,.agent-client-card:last-child{grid-column:span 3}.agent-client-card:last-child{grid-column:span 6}.agent-relay-shell{grid-template-columns:1fr}.agent-relay-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-right:0;border-bottom:1px solid var(--agent-line)}.agent-relay-tabs button{display:flex;flex-direction:column;border-right:1px solid var(--agent-line);border-bottom:0}.agent-relay-tabs button:last-child{border-right:0}}@media(max-width:640px){.agent-demo-frame,.agent-setup-frame,.agent-flow-frame{padding-bottom:24px}.agent-demo-shell,.agent-setup-grid,.agent-flow-grid,.agent-demo-credit{margin-right:16px;margin-left:16px}.agent-demo-chrome{grid-template-columns:1fr auto}.agent-demo-chrome em{display:none}.agent-demo-canvas{min-height:30rem;max-height:36rem}.agent-openclaw-status{align-items:flex-start;flex-direction:column}.agent-openclaw-tool em{width:100%;margin-left:0}.agent-connect-page{padding-left:12px;padding-right:12px}.agent-connect-hero{padding-left:1.1rem;padding-right:1.1rem}.agent-connect-hero h1{font-size:clamp(3rem,15vw,4.7rem)}.agent-connect-actions,.agent-connect-actions>*{width:100%}.agent-client-section,.agent-experience-section,.agent-relay-section{padding:2.5rem 1rem}.agent-section-heading,.agent-experience-heading,.agent-relay-intro{align-items:flex-start;flex-direction:column;gap:1rem}.agent-client-card,.agent-client-card:last-child{grid-column:span 6;min-height:16rem}.agent-experience-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}.agent-experience-tabs button{border-bottom:1px solid var(--agent-line)}.agent-experience-tabs button:nth-child(2n){border-right:0}.agent-experience-tabs button:last-child{grid-column:span 2;border-bottom:0}.agent-experience-chrome{grid-template-columns:1fr auto}.agent-experience-chrome>strong{display:none}.agent-experience-canvas{min-height:34rem}.agent-relay-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}.agent-relay-tabs button:nth-child(2){border-right:0}.agent-relay-tabs button:nth-child(-n+2){border-bottom:1px solid var(--agent-line)}.agent-terminal-bar{grid-template-columns:1fr auto}.agent-terminal-bar>span:nth-child(2){display:none}.agent-terminal-call em{width:100%;margin-left:0}}@media(prefers-reduced-motion:reduce){.agent-client-card,.agent-copy,.agent-open-chatgpt,.agent-terminal-body{animation:none;transition:none}}