:root{color-scheme:dark;--bg:#101213;--panel:#191c1e;--line:#373d40;--muted:#929b9d;--white:#edf1ec;--lime:#d3f78b;--orange:#f79971;--mono:ui-monospace,SFMono-Regular,Consolas,'Liberation Mono',monospace}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--white);font-family:Arial,Helvetica,sans-serif}button{font:inherit}header,main,footer{width:min(1440px,100%);margin:auto}header{padding:30px 5%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff10}.brand{font-size:22px;font-weight:750;letter-spacing:-1px;display:flex;align-items:center;gap:12px}.brand svg{width:27px;height:27px;color:var(--lime)}.meta,.eyebrow,.tag,footer,.canvas-head,.canvas-foot{font:11px var(--mono);letter-spacing:.07em}.meta{color:var(--muted);display:flex;align-items:center;gap:10px}.dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--lime);box-shadow:0 0 12px #d3f73535}.intro{padding:64px 5% 42px;display:flex;justify-content:space-between;align-items:end;gap:32px}.eyebrow{color:var(--lime);text-transform:uppercase;margin:0 0 22px}.eyebrow span{color:#67706f;margin-right:14px}h1{font-size:clamp(42px,5.1vw,72px);line-height:1.06;letter-spacing:-.055em;font-weight:500;margin:0}h1 em{font-style:normal;color:var(--lime)}.intro aside{max-width:260px;padding-bottom:4px}.intro aside p{font-size:14px;line-height:1.75;color:var(--muted);margin:0 0 20px}.tag{display:inline-block;border:1px solid #3b4240;border-radius:5px;padding:7px 10px;color:#c0c8bd;font-size:10px}.workspace{margin:0 5%;border:1px solid #363d3c;border-radius:12px;overflow:hidden;background:#131617;box-shadow:0 20px 60px #0002}.canvas-head{height:51px;display:flex;align-items:center;justify-content:space-between;padding:0 23px;border-bottom:1px solid #ffffff0c;background:#191c1d;color:var(--muted)}.canvas-head strong{color:var(--white);font-weight:400}.canvas-head .divider{margin:0 14px;color:#525b57}.canvas-scroll{overflow-x:auto;scrollbar-color:#48533e #171a18}.canvas{position:relative;height:366px;min-width:1070px;background-image:radial-gradient(#48514c 0.65px,transparent .8px);background-size:19px 19px}.connections{position:absolute;inset:0;width:100%;height:100%}.wire{fill:none;stroke:#68736b;stroke-width:1.5}.dashed{stroke:#465449;stroke-dasharray:4 6}.flow{position:absolute;left:3%;right:3%;top:114px;display:grid;grid-template-columns:repeat(6,1fr);align-items:start}.node{text-align:center;position:relative}.box{width:90px;height:90px;background:#202527;border:1px solid #59625d;border-radius:16px;display:flex;justify-content:center;align-items:center;margin:auto;position:relative;box-shadow:0 7px 20px #0002;transition:border-color .3s,box-shadow .3s}.box:before,.box:after{content:'';position:absolute;top:39px;width:9px;height:9px;background:#9da89c;border:3px solid #202527;border-radius:50%;box-sizing:content-box}.box:before{left:-8px}.box:after{right:-8px}.node:first-child .box:before,.node:last-child .box:after{display:none}.box svg{width:38px;height:38px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.node:not(:last-child):after{content:"";position:absolute;top:44px;left:calc(50% + 51px);width:calc(100% - 102px);height:1px;background:#68736b}.node:not(:first-child):before{content:"";position:absolute;top:41px;left:calc(50% - 55px);border-left:5px solid #86917f;border-top:3px solid transparent;border-bottom:3px solid transparent}.node h2{font-size:13px;font-weight:500;letter-spacing:-.02em;margin:17px 0 7px}.node p{font:10px var(--mono);color:var(--muted);margin:0}.num{position:absolute;top:-25px;left:calc(50% - 43px);font:9px var(--mono);color:#6f7e72}.start{color:var(--orange);border-radius:27px 14px 14px 27px}.nothing{border-style:dashed;color:#667169}.nothing span{font:26px var(--mono)}.automation{color:var(--lime)}.pipeline{color:#bfa5ef}.linux{color:#8eb9d9}.end{color:var(--lime);background:#273024;border-color:#899b6c;box-shadow:0 0 28px #d3f78b08}.end span{font:bold 29px var(--mono);letter-spacing:-4px;padding-right:4px}.note{position:absolute;font:10px var(--mono);color:#778675;top:38px;left:22%;transform:rotate(-3deg)}.loop-label{position:absolute;top:307px;left:48%;font:10px var(--mono);color:#73816e;background:#131617;padding:0 10px}.canvas-foot{min-height:56px;padding:14px 22px;display:flex;align-items:center;justify-content:space-between;gap:16px;border-top:1px solid #ffffff0c;color:var(--muted);background:#191c1d}.status{font-size:10px;display:flex;gap:10px;align-items:center}button{border:1px solid #718353;border-radius:5px;background:var(--lime);color:#233017;padding:10px 15px;font:11px var(--mono);cursor:pointer;transition:background .2s}button:hover{background:#e3ffb1}button:focus-visible{outline:2px solid white;outline-offset:4px}button:disabled{cursor:wait;opacity:.7}.below{padding:30px 5% 58px;display:flex;align-items:start;justify-content:space-between;gap:25px}.below p{margin:0;color:var(--muted);font-size:13px;line-height:1.8}.below p strong{font-weight:400;color:var(--white)}.terminal{font:11px/1.8 var(--mono)!important;color:#7d8c78!important}.terminal span{color:var(--lime)}footer{padding:23px 5% 28px;border-top:1px solid #ffffff10;display:flex;justify-content:space-between;gap:20px;color:#707b74;font-size:10px}.active .box{border-color:var(--lime);box-shadow:0 0 25px #d3f78b28}.active .automation svg{animation:spin 2s linear infinite}.complete .box{border-color:#8da668}.tiny{color:var(--lime)}@keyframes spin{to{transform:rotate(360deg)}}@media(min-width:1500px){.intro{padding-top:85px}}@media(max-width:700px){header{padding:23px 6%}.meta{font-size:9px}.intro{display:block;padding:43px 6% 30px}.intro aside{max-width:100%;margin-top:24px}.intro aside p{margin-bottom:12px}.intro h1{font-size:48px}.workspace{margin:0 6%}.canvas-head{padding:0 14px;font-size:9px}.canvas-head .divider{margin:0 7px}.canvas-foot{align-items:start;flex-direction:column;padding:15px}.below{padding:25px 6% 35px;flex-direction:column;gap:16px}footer{padding:22px 6%;font-size:9px}.tag{font-size:9px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
