.sbx{--sbc:var(--brand-orange);display:flex;flex-direction:column;gap:22px}.sbx-rail{display:flex;gap:6px;flex-wrap:wrap}.sbx-step{display:flex;align-items:center;gap:9px;padding:9px 14px 9px 11px;border:1px solid var(--paper-line-soft);background:var(--paper-surface);border-radius:999px;font:600 13px var(--font-sans);color:var(--paper-ink-3);cursor:pointer}.sbx-step i{font-style:normal;font-size:9.5px}.sbx-step:hover{color:var(--paper-ink-1);border-color:var(--paper-line)}.sbx-step.done{color:var(--paper-ink-2)}.sbx-step.on{color:var(--paper-ink-1);border-color:var(--sbc);background:color-mix(in oklab,var(--sbc) 9%,var(--paper-surface))}.sbx-step.on i{color:var(--sbc)}.sbx-body{display:grid;grid-template-columns:minmax(320px,1fr) 1.25fr;gap:22px;align-items:start}.sbx-left{display:flex;flex-direction:column;gap:20px;min-width:0}.sbx-left .chat{height:420px}.sbx-copy h3{margin-top:14px;font-size:26px}.sbx-copy>p{margin-top:12px;font-size:15px;line-height:1.5;color:var(--paper-ink-2)}.sbx-eyebrow{display:flex;align-items:center;gap:10px}.sbx-eyebrow .mono{color:var(--paper-ink-3)}.sbx-core{width:20px;height:20px;border-radius:50%;background:var(--brand-orange)}.sbx-tag{display:inline-block;margin-top:16px;font:500 10px var(--font-mono);text-transform:uppercase;padding:6px 11px;border-radius:999px;background:color-mix(in oklab,var(--tag-color) 14%,transparent);color:var(--tag-color)}.sbx-canvas{display:grid;grid-template-columns:1fr 1fr;gap:14px}.sbx-slot{position:relative;transition:opacity .4s var(--ease)}.sbx-slot.pending{opacity:0;pointer-events:none}.sbx-canvas>.sbx-slot:first-child{grid-column:1/-1}.sbx-carrier{position:absolute;left:10px;top:16px;z-index:5;display:flex;align-items:center;gap:9px;animation:sbCarry 1.6s var(--ease) both}.sbx-carrier .carrier-card{animation:ghostOut 1.6s linear both}.sbx-send{position:absolute;right:16px;bottom:56px;z-index:6;animation:sbSend 1.5s var(--ease) both}.sbx-left .chat{position:relative}.sbx-send-tap{position:absolute;left:50%;top:56%;width:34px;height:34px;margin:-17px;border-radius:50%;border:1.5px solid var(--agent-chat);animation:sbTap 1.5s linear both}.sbx-compact .sbx-body{grid-template-columns:minmax(300px,.9fr) 1.1fr}.sbx-compact .sbx-left .chat{height:340px}.sbx-compact .sbx-canvas{grid-template-columns:1fr}.sbx-compact .sbx-canvas>.sbx-slot:first-child{grid-column:1}@keyframes sbCarry{0%{transform:translate3d(260px,-170px,0) scale(.82);opacity:0}12%{opacity:1}42%{transform:translateZ(0)}50%{transform:translate3d(0,6px,0) scale(.96)}60%{transform:none;opacity:1}to{transform:translate3d(230px,-160px,0) scale(.86);opacity:0}}@keyframes ghostOut{0%,46%{opacity:1}56%,to{opacity:0;transform:scale(.9)}}@keyframes sbSend{0%{transform:translate3d(120px,-56px,0) scale(.8);opacity:0}14%{opacity:1}36%{transform:none}46%{transform:translateY(6px) scale(.95)}56%{transform:none;opacity:1}to{transform:translate3d(130px,-48px,0) scale(.84);opacity:0}}@keyframes sbTap{0%,42%{opacity:0;transform:scale(.35)}52%{opacity:.85;transform:scale(.85)}70%,to{opacity:0;transform:scale(1.5)}}@media(max-width:1040px){.sbx-body{grid-template-columns:1fr}.sbx-canvas{grid-template-columns:1fr 1fr}.sbx-slot.pending{display:none}.sbx-left .chat{height:380px}}@media(max-width:640px){.sbx-canvas{grid-template-columns:1fr}.sbx-canvas>.sbx-slot:first-child{grid-column:1}.sbx-step span{display:none}.sbx-step.on span{display:inline}}@media(prefers-reduced-motion:reduce){.sbx-carrier,.sbx-send{display:none}.sbx-slot,.sbx-slot.pending{opacity:1;transition:none}}.chat-take{position:relative}.chat-take.aiming{color:var(--paper-ink-1)}.sbx-cursor{position:absolute;right:-4px;bottom:-16px;width:15px;height:20px;pointer-events:none;background:var(--paper-ink-1);clip-path:polygon(0 0,0 16px,4px 12px,7px 19px,10px 18px,7px 11px,12px 11px);animation:sbCursorIn .5s var(--ease) both}.chat-take.clicked{color:var(--ok-text)}.chat-take.clicked:after{content:"";position:absolute;right:-10px;bottom:-22px;width:30px;height:30px;border-radius:50%;border:1.5px solid var(--ok-text);animation:sbCursorTap .6s ease-out both}@keyframes sbCursorIn{0%{opacity:0;transform:translate3d(26px,20px,0)}to{opacity:1;transform:none}}@keyframes sbCursorTap{0%{opacity:0;transform:scale(.3)}40%{opacity:.9;transform:scale(.8)}to{opacity:0;transform:scale(1.5)}}@media(prefers-reduced-motion:reduce){.sbx-cursor,.chat-take.clicked:after{display:none}}