:root{color-scheme:dark;--bg:#09131b;--panel:#101f2a;--line:#293f4d;--text:#edf4f3;--muted:#8ba5b5;--cyan:#74deeb;--amber:#efbd80;--green:#c1e6a1;--purple:#b6a4f3;font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}*{box-sizing:border-box}body{margin:0;color:var(--text);background:radial-gradient(ellipse at 80% 0,#163044,transparent 55%),var(--bg);font-size:14px;line-height:1.5}button,input{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{opacity:.55;cursor:default}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--cyan);outline-offset:4px}.shell{max-width:1120px;margin:auto;padding:0 30px}.site-header{height:76px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{font-size:34px;font-weight:750;letter-spacing:-1.8px}.brand span{font:9px monospace;letter-spacing:1.8px;color:#aec0cb;margin-left:16px}.sandbox-label{font:10px monospace;letter-spacing:1px;color:var(--amber)}.intro{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:26px 0 21px}.intro h1{font-size:30px;line-height:1.2;letter-spacing:-1.05px;margin:0 0 9px}.intro p{font-size:13px;color:#a3bac8;margin:0}.primary{background:var(--cyan);color:#092c36;border:0;border-radius:7px;padding:13px 22px;font-size:13px;font-weight:650;white-space:nowrap}.demo-panel{border:1px solid #355060;border-radius:14px;overflow:hidden;background:var(--panel)}.route-rail{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));list-style:none;margin:0;padding:0;border-bottom:1px solid var(--line)}.route-rail li{display:flex;gap:12px;align-items:center;padding:17px 23px;position:relative;transition:background .3s}.route-rail li+li{border-left:1px solid var(--line)}.route-number{font:12px monospace;color:#678a9d;flex-shrink:0}.route-rail strong{display:block;font-size:12px;font-weight:550}.route-rail small{display:block;font-size:10px;color:var(--muted);margin-top:4px}.route-rail .active{background:#213b47}.route-rail .active:after{content:'';height:2px;background:var(--cyan);position:absolute;bottom:0;left:0;right:0}.route-rail .done .route-number{color:var(--green)}.route-rail .declined .route-number,.route-rail .declined small{color:var(--amber)}.stage-toolbar{display:flex;justify-content:space-between;align-items:center;padding:12px 20px;font:10px monospace;letter-spacing:.5px;border-bottom:1px solid var(--line)}#stage-badge{color:var(--cyan)}.stage-toolbar>div{display:flex;align-items:center;gap:20px;color:var(--muted)}#fullscreen{font:10px monospace;border:0;background:transparent;color:#a9c1ce;padding:0}.demo-stage{height:clamp(390px,59vh,640px);position:relative;overflow:hidden;background:#0c1923}.demo-stage:fullscreen{height:100vh;width:100vw}.demo-stage iframe{position:absolute;inset:0;border:0;width:100%;height:100%;background:#fff;pointer-events:none}.api-scene{height:100%;padding:32px 40px 28px;display:flex;flex-direction:column;justify-content:center;gap:30px;background:radial-gradient(ellipse at 50% 45%,#17384955,transparent 70%)}.api-title{text-align:center}.api-title>p:first-child{font:10px monospace;letter-spacing:2px;color:var(--amber);margin:0 0 12px}.api-title h2{font-size:clamp(23px,3vw,34px);letter-spacing:-.8px;line-height:1.2;margin:0 0 10px}.api-title>p:last-child{font-size:13px;color:#a0b9c7;margin:0}.flow-nodes{display:grid;grid-template-columns:1fr 65px 1fr 65px 1fr;align-items:center}.flow-node{border:1px solid #2e4a5b;border-radius:12px;background:#122633;min-height:132px;padding:19px 14px;text-align:center;transition:border-color .3s,box-shadow .3s,transform .3s}.node-icon{display:block;font:25px monospace;color:var(--cyan);margin-bottom:13px}.flow-node strong{display:block;font-size:13px}.flow-node small{display:block;font-size:10px;color:var(--muted);margin-top:5px}.flow-node.active{border-color:var(--cyan);box-shadow:0 0 24px #74deeb15;transform:translateY(-3px)}.wire{height:2px;background:#335265;position:relative}.wire>span{position:absolute;bottom:15px;width:100%;text-align:center;font:8px monospace;color:#87aabd}.wire i{position:absolute;left:0;top:-4px;width:10px;height:10px;border-radius:3px;background:var(--cyan);opacity:0}.wire.moving i{animation:packet-forward 1.2s ease-in-out infinite;box-shadow:0 0 18px #74deeb88}.wire.reverse i{animation-direction:reverse;background:var(--amber)}.api-scene[data-phase=provider] #to-node .node-icon{animation:node-pulse 1.1s ease-in-out infinite}.api-scene[data-phase=response] #to-node{border-color:var(--amber)}.api-scene[data-live=true] .api-title>p:first-child{color:var(--cyan)}.api-scene[data-live=true] .wire.reverse i{background:var(--cyan)}.api-scene[data-live=true][data-phase=response] #to-node{border-color:var(--cyan)}.request-card{border:1px solid #2b4454;border-radius:8px;background:#091923;padding:16px 19px;display:grid;grid-template-columns:auto 1fr auto;gap:18px;align-items:center}.request-card>span:first-child{font:9px monospace;letter-spacing:1px;color:#85a8bc}.request-card code{font:12px monospace;color:#ccdde7;white-space:pre-wrap}.request-card>span:last-child{font:11px monospace;color:var(--amber);text-align:right}.result-scene{height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:30px;text-align:center}.result-scene>span{width:75px;height:75px;display:grid;place-items:center;border:1px solid #628853;border-radius:50%;background:#263c24;font-size:34px;color:var(--green)}.result-scene h2{font-size:38px;line-height:1.15;margin:23px 0 12px;letter-spacing:-1px}.result-scene p{font-size:14px;color:#a6becc;margin:0 0 26px}.result-scene.stopped>span{background:#3b3022;border-color:#917245;color:var(--amber)}.caption-bar{display:flex;align-items:center;gap:12px;min-height:63px;padding:15px 20px;border-top:1px solid var(--line)}#caption-dot{width:7px;height:7px;flex-shrink:0;background:var(--cyan);border-radius:50%}.caption-bar p{font-size:13px;color:#c5d8e2;margin:0;flex:1}#elapsed{font:10px monospace;color:var(--muted);white-space:nowrap}.launch-status{font-size:12px;color:var(--amber);margin:10px 0 0}.launch-status:empty{display:none}.disclosure{font-size:10px;color:#809bab;margin:13px 0 25px;text-align:center}.skip-link{position:absolute;left:20px;top:-100px;padding:10px;background:var(--panel);z-index:100}.skip-link:focus{top:12px}[hidden]{display:none!important}@keyframes packet-forward{0%{left:0;opacity:0}15%,80%{opacity:1}100%{left:calc(100% - 10px);opacity:0}}@keyframes node-pulse{50%{opacity:.35;transform:scale(.9)}}@media(max-width:700px){.shell{padding-left:16px;padding-right:16px}.site-header{height:63px}.brand{font-size:29px}.brand span{font-size:7px;letter-spacing:1px;margin-left:8px}.sandbox-label{font-size:7px;letter-spacing:.3px}.intro{margin:21px 0 17px;align-items:start}.intro h1{font-size:22px;letter-spacing:-.7px;max-width:240px}.intro p{font-size:11px;max-width:220px}.intro .primary{font-size:11px;padding:11px 12px}.route-rail{grid-template-columns:repeat(2,minmax(0,1fr))}.route-rail li{gap:7px;padding:10px}.route-rail li:nth-child(3){border-left:0}.route-rail li:nth-child(n+3){border-top:1px solid var(--line)}.route-number{font-size:9px}.route-rail strong{font-size:10px}.route-rail small{font-size:8px}.stage-toolbar{padding:11px 13px;font-size:8px}.stage-toolbar>div{gap:10px}#fullscreen{font-size:8px}.demo-stage{height:430px}.api-scene{padding:25px 14px;gap:30px}.api-title h2{font-size:25px}.api-title>p:last-child{font-size:11px;max-width:300px;margin:auto}.api-title>p:first-child{font-size:8px}.flow-nodes{grid-template-columns:1fr 22px 1fr 22px 1fr}.flow-node{min-height:119px;padding:16px 6px;border-radius:8px}.node-icon{font-size:20px}.flow-node strong{font-size:10px;line-height:1.3}.flow-node small{font-size:8px;line-height:1.5}.wire>span{display:none}.wire i{width:7px;height:7px;top:-3px}.request-card{grid-template-columns:1fr auto;gap:9px;padding:12px}.request-card>span:first-child{grid-column:1/-1;font-size:8px}.request-card code{font-size:10px}.request-card>span:last-child{font-size:9px}.caption-bar{padding:13px;gap:9px;min-height:65px}.caption-bar p{font-size:11px}.disclosure{font-size:8px;line-height:1.7}.result-scene h2{font-size:31px}.result-scene p{font-size:12px}.demo-stage[data-scene=browser]{height:430px}.demo-stage iframe{height:100%;width:100%}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}.wire.moving i{animation:none;left:50%;opacity:1}.api-scene[data-phase=provider] #to-node .node-icon{animation:none}.flow-node{transition:none}}