.hero-robot{--eye:#5ef08f;--scale:.86;width:calc(420px * var(--scale));height:calc(480px * var(--scale));position:relative}.hero-robot *{box-sizing:border-box}.hero-robot .stage{width:420px;height:480px;transform:scale(var(--scale));transform-origin:0 0;cursor:pointer;-webkit-user-select:none;user-select:none;perspective:1000px;position:absolute;top:0;left:0}.hero-robot .robot{--s:330px;width:var(--s);height:calc(var(--s)*1.18);transform-style:preserve-3d;animation:4.5s ease-in-out infinite hrBob;position:absolute;top:54%;left:50%;transform:translate(-50%,-50%)}@keyframes hrBob{0%,to{transform:translate(-50%,-50%)translateY(0)}50%{transform:translate(-50%,-50%)translateY(-14px)}}.hero-robot .spinner{width:100%;height:100%;transform-style:preserve-3d;transform-origin:50% 60%;position:relative}.hero-robot .shadow{filter:blur(7px);background:#0000002e;border-radius:50%;width:42%;height:5%;animation:4.5s ease-in-out infinite hrShadow;position:absolute;bottom:4%;left:50%;transform:translate(-50%)}@keyframes hrShadow{0%,to{opacity:.55;transform:translate(-50%)scale(1)}50%{opacity:.3;transform:translate(-50%)scale(.8)}}.hero-robot .body{background:linear-gradient(160deg,#fff 0%,#f1f1f4 50%,#dadae0 100%);border-radius:50%/34% 34% 78% 78%;width:48%;height:56%;position:absolute;top:44%;left:50%;transform:translate(-50%);box-shadow:inset -10px -12px 24px #0000001a,inset 8px 8px 16px #fff9,0 18px 34px -16px #0006}.hero-robot .arm{transform-origin:top;z-index:4;background:linear-gradient(160deg,#fff,#e2e2e8);border-radius:46% 46% 50% 50%;width:13%;height:30%;transition:none;position:absolute;top:48%;box-shadow:inset -4px -5px 10px #0000001a,0 8px 16px -8px #00000059}.hero-robot .arm.l{z-index:6;left:18%;transform:rotate(24deg)}.hero-robot .arm.r{right:18%;transform:rotate(-24deg)}.hero-robot .neck{z-index:3;background:#1f1f24;border-radius:8px;width:22%;height:5%;position:absolute;top:42%;left:50%;transform:translate(-50%)}.hero-robot .head{z-index:5;transform-origin:50% 90%;background:linear-gradient(165deg,#fff 0%,#f0f0f3 55%,#d7d7dd 100%);border-radius:48% 48% 46% 46%/54% 54% 46% 46%;justify-content:center;align-items:center;width:74%;height:44%;display:flex;position:absolute;top:2%;left:50%;transform:translate(-50%);box-shadow:inset -12px -14px 26px #0000001a,inset 10px 10px 20px #ffffffb3,0 20px 40px -18px #00000073}.hero-robot .screen{background:radial-gradient(120% 120% at 50% 40%,#2c2c33,#101013 80%);border-radius:42% 42% 44% 44%/46% 46% 44% 44%;justify-content:center;align-items:center;gap:14%;width:78%;height:74%;display:flex;position:relative;overflow:hidden;box-shadow:inset 0 4px 10px #0009}.hero-robot .screen:before{content:"";background:linear-gradient(#ffffff24,#0000);border-radius:50%;width:55%;height:30%;position:absolute;top:8%;left:10%;transform:rotate(-8deg)}.hero-robot .eye{background:var(--eye);width:17%;height:42%;box-shadow:0 0 16px var(--eye),0 0 30px #5ef08f99;border-radius:50%;animation:5s infinite hrBlink}@keyframes hrBlink{0%,93%,to{transform:scaleY(1)}96%{transform:scaleY(.08)}}.hero-robot .shades{opacity:0;z-index:7;width:72%;height:26%;transition:opacity .4s,transform .5s cubic-bezier(.2,1.4,.4,1);position:absolute;top:33%;left:50%;transform:translate(-50%)translateY(-14px)}.hero-robot .shades .lens{aspect-ratio:1;background:radial-gradient(circle at 38% 30%,#ffce6e73,#c68a2e80 70%,#aa701e8c);border:2px solid #96681eb3;border-radius:50%;width:42%;position:absolute;top:50%;transform:translateY(-50%);box-shadow:inset 0 2px 8px #ffffff59,0 3px 7px #0003}.hero-robot .shades .lens.l{left:1%}.hero-robot .shades .lens.r{right:1%}.hero-robot .shades .bridge{z-index:1;background:#96681ed9;border-radius:3px;width:12%;height:7%;position:absolute;top:46%;left:44%}.hero-robot .think{opacity:0;z-index:8;gap:5px;display:flex;position:absolute;top:-6%;right:6%}.hero-robot .think i{background:#fff;border-radius:50%;width:9px;height:9px;box-shadow:0 2px 6px #0003}.hero-robot .think i:first-child{width:6px;height:6px}.hero-robot .think i:nth-child(2){width:8px;height:8px}.hero-robot .laptop{opacity:0;z-index:5;width:46%;height:20%;transition:opacity .4s,transform .4s;position:absolute;top:62%;left:50%;transform:translate(-50%,40px)scale(.4)}.hero-robot .laptop .lid{background:linear-gradient(160deg,#23232b,#15151b);border:2px solid #4a4a55;border-radius:7px 7px 2px 2px;width:84%;height:80%;padding:7%;position:absolute;bottom:60%;left:8%;overflow:hidden;box-shadow:inset 0 0 8px #0009}.hero-robot .laptop .code{flex-direction:column;justify-content:center;gap:9%;height:100%;display:flex}.hero-robot .laptop .code span{border-radius:2px;width:0;height:11%;animation:4s step-end infinite hrTypeline;display:block}.hero-robot .laptop .code span:first-child{background:#5ef08f}.hero-robot .laptop .code span:nth-child(2){background:#6fb6ff}.hero-robot .laptop .code span:nth-child(3){background:#ffd166}.hero-robot .laptop .code span:nth-child(4){background:#ff7eb6}.hero-robot .laptop .code span:nth-child(2){animation-delay:.5s}.hero-robot .laptop .code span:nth-child(3){animation-delay:1s}.hero-robot .laptop .code span:nth-child(4){animation-delay:1.5s}@keyframes hrTypeline{0%{width:0}12%{width:90%}50%{width:90%}62%{width:40%}to{width:40%}}.hero-robot .laptop .base{transform-origin:top;background:linear-gradient(#e6e6ec,#c7c7cf);border-radius:3px 3px 5px 5px;width:100%;height:14%;position:absolute;bottom:36%;left:0;transform:perspective(120px)rotateX(48deg)}.hero-robot .butterfly{opacity:0;z-index:15;pointer-events:none;width:38px;height:32px;position:absolute;top:30%;left:50%}.hero-robot .butterfly .wing{background:linear-gradient(135deg,#ff8fb1,#c8447f 60%,#6d5b9e);border-radius:60% 70% 40% 80%;width:18px;height:32px;position:absolute;top:0;box-shadow:0 2px 6px #0003}.hero-robot .butterfly .wing.l{transform-origin:100%;animation:.18s ease-in-out infinite alternate hrFlap;left:0}.hero-robot .butterfly .wing.r{transform-origin:0;animation:.18s ease-in-out infinite alternate hrFlapR;right:0;transform:scaleX(-1)}.hero-robot .butterfly .bf-body{z-index:2;background:#3a3340;border-radius:3px;width:4px;height:28px;position:absolute;top:2px;left:50%;transform:translate(-50%)}@keyframes hrFlap{0%{transform:scaleX(1)}to{transform:scaleX(.35)}}@keyframes hrFlapR{0%{transform:scaleX(-1)}to{transform:scaleX(-.35)}}.hero-robot .net{opacity:0;z-index:7;transform-origin:bottom;width:16px;height:130px;position:absolute;top:42%;right:2%}.hero-robot .net .handle{background:linear-gradient(#caa46b,#8a6d3f);border-radius:5px;width:8px;height:86px;position:absolute;bottom:0;left:50%;transform:translate(-50%)}.hero-robot .net .hoop{border:5px solid #b98c4f;border-radius:50%;width:60px;height:60px;position:absolute;top:-4px;left:50%;transform:translate(-50%)}.hero-robot .net .mesh{background:radial-gradient(circle at 50% 35%,#ffffff80,#ffffff1f 70%);border:1px solid #fff6;border-radius:50%;width:52px;height:58px;position:absolute;top:-1px;left:50%;transform:translate(-50%);-webkit-mask:radial-gradient(circle,#0000 1.6px,#000 1.7px) 0 0/8px 8px;mask:radial-gradient(circle,#0000 1.6px,#000 1.7px) 0 0/8px 8px}.hero-robot .raincoat{opacity:0;z-index:4;background:linear-gradient(160deg,#ffd93b 0%,#f6c01e 55%,#e8a90f 100%);border-radius:50%/30% 30% 80% 80%;width:60%;height:60%;transition:opacity .4s;position:absolute;top:43%;left:50%;transform:translate(-50%);box-shadow:inset -9px -11px 22px #0000001f,inset 7px 7px 14px #ffffff73,0 14px 28px -14px #0006}.hero-robot .raincoat:after{content:"";background:#0000001f;border-radius:3px;width:5%;height:64%;position:absolute;top:14%;left:50%;transform:translate(-50%)}.hero-robot .rainhood{opacity:0;z-index:6;background:linear-gradient(160deg,#ffd93b 0%,#f6c01e 70%,#e8a90f 100%);border-radius:50% 50% 42% 42%/72% 72% 28% 28%;width:90%;height:34%;transition:opacity .4s;position:absolute;top:-3%;left:50%;transform:translate(-50%);box-shadow:inset -6px -7px 15px #0000001f,inset 5px 5px 10px #ffffff73}.hero-robot .rain{opacity:0;z-index:1;pointer-events:none;transition:opacity .4s;position:absolute;inset:0;overflow:hidden}.hero-robot .drop{background:linear-gradient(#b4d2ff1a,#b4d2ffcc);border-radius:2px;width:2px;height:16px;animation:linear infinite hrFall;position:absolute;top:-10%}@keyframes hrFall{0%{transform:translateY(-40px)}to{transform:translateY(520px)}}.hero-robot .robot2{opacity:0;z-index:8;width:120px;height:150px;transition:opacity .5s,transform .6s cubic-bezier(.2,1.3,.4,1);position:absolute;top:30%;right:-4%;transform:translate(40px)}.hero-robot .robot2 .head2{background:linear-gradient(165deg,#fff,#dcdce2);border-radius:48% 48% 46% 46%/54% 54% 46% 46%;justify-content:center;align-items:center;width:84px;height:74px;display:flex;position:absolute;top:0;left:50%;transform:translate(-50%);box-shadow:inset -8px -8px 16px #0000001a,0 12px 24px -12px #0006}.hero-robot .robot2 .scr2{background:radial-gradient(120% 120% at 50% 40%,#2c2c33,#101013 80%);border-radius:44%;justify-content:center;align-items:center;gap:16%;width:74%;height:70%;display:flex}.hero-robot .robot2 .e2{background:#ff8fb1;border-radius:50%;width:16%;height:38%;box-shadow:0 0 10px #ff8fb1}.hero-robot .robot2 .body2{background:linear-gradient(160deg,#fff,#dadae0);border-radius:50%/34% 34% 78% 78%;width:54px;height:70px;position:absolute;top:64px;left:50%;transform:translate(-50%)}.hero-robot .hearts{opacity:0;z-index:16;pointer-events:none;width:120px;height:200px;position:absolute;top:18%;right:8%}.hero-robot .heart{opacity:0;width:18px;height:18px;position:absolute}.hero-robot .heart:before,.hero-robot .heart:after{content:"";background:#ff5d8f;border-radius:9px 9px 0 0;width:9px;height:14px;position:absolute;top:0}.hero-robot .heart:before{transform-origin:0 100%;left:9px;transform:rotate(-45deg)}.hero-robot .heart:after{transform-origin:100% 100%;left:0;transform:rotate(45deg)}.hero-robot .stage.intro .arm.l{animation:8s ease-in-out forwards hrIntroArmL}.hero-robot .stage.intro .arm.r{animation:8s ease-in-out forwards hrIntroArmR}.hero-robot .stage.intro .head{animation:8s ease-in-out forwards hrIntroHead}.hero-robot .stage.intro .spinner{animation:8s ease-in-out forwards hrIntroSpin}.hero-robot .stage.intro .eye{animation:5s infinite hrBlink,8s ease-in-out forwards hrIntroEye}@keyframes hrIntroArmL{0%{transform:rotate(24deg)}6%{transform:rotate(150deg)translate(-6px,-34px)}12%{transform:rotate(124deg)translate(-4px,-30px)}18%{transform:rotate(150deg)translate(-6px,-34px)}24%{transform:rotate(124deg)translate(-4px,-30px)}30%{transform:rotate(150deg)translate(-6px,-34px)}36%{transform:rotate(24deg)}66%{transform:rotate(24deg)}72%{transform:rotate(150deg)translate(-6px,-40px)}78%{transform:rotate(150deg)translate(-6px,-46px)}84%{transform:rotate(150deg)translate(-6px,-40px)}90%{transform:rotate(24deg)}to{transform:rotate(24deg)}}@keyframes hrIntroArmR{0%,to{transform:rotate(-24deg)}}@keyframes hrIntroHead{0%{transform:translate(-50%)rotate(0)}12%{transform:translate(-50%)rotate(-6deg)}24%{transform:translate(-50%)rotate(-3deg)}30%{transform:translate(-50%)rotate(0)}72%{transform:translate(-50%)rotate(8deg)}78%{transform:translate(-50%)rotate(-8deg)}84%{transform:translate(-50%)rotate(6deg)}90%{transform:translate(-50%)rotate(0)}to{transform:translate(-50%)rotate(0)}}@keyframes hrIntroSpin{0%,45%{transform:rotateY(0)translateY(0)}52%{transform:rotateY(180deg)translateY(-6px)}60%{transform:rotateY(360deg)translateY(0)}72%{transform:rotateY(360deg)translateY(-8px)}78%{transform:rotateY(360deg)translateY(0)}84%{transform:rotateY(360deg)translateY(-6px)}to{transform:rotateY(360deg)translateY(0)}}@keyframes hrIntroEye{0%,65%{}72%,88%{height:26%}to{}}.hero-robot .stage.s-laptop .laptop{opacity:1;transform:translate(-50%)scale(1)}.hero-robot .stage.s-laptop .arm.l{animation:6s ease-in-out infinite hrWorkArmL}.hero-robot .stage.s-laptop .arm.r{animation:6s ease-in-out infinite hrWorkArmR}.hero-robot .stage.s-laptop .head{animation:6s ease-in-out infinite hrLookDown}@keyframes hrWorkArmL{0%,to{transform:rotate(70deg)translate(6px,-6px)}50%{transform:rotate(64deg)translate(6px,-9px)}}@keyframes hrWorkArmR{0%,to{transform:rotate(-70deg)translate(-6px,-6px)}50%{transform:rotate(-64deg)translate(-6px,-9px)}}@keyframes hrLookDown{0%,to{transform:translate(-50%)rotate(3deg)}50%{transform:translate(-50%)rotate(5deg)}}.hero-robot .stage.s-butterfly .butterfly{animation:6s ease-in-out infinite hrFlyPath}.hero-robot .stage.s-butterfly .net{animation:6s ease-in-out infinite hrNetSwing}.hero-robot .stage.s-butterfly .arm.r{animation:6s ease-in-out infinite hrNetArm}.hero-robot .stage.s-butterfly .head{animation:6s ease-in-out infinite hrFollowBf}.hero-robot .stage.s-butterfly .eye{animation:5s infinite hrBlink,6s ease-in-out infinite hrWideEye}@keyframes hrFlyPath{0%{opacity:0;transform:translate(-50%)scale(.6)}6%{opacity:1;transform:translate(30px,-50px)scale(1)}20%{opacity:1;transform:translate(-60px,-110px)}34%{opacity:1;transform:translate(70px,-70px)}48%{opacity:1;transform:translate(-40px,-130px)}62%{opacity:1;transform:translate(90px,-90px)}76%{opacity:1;transform:translate(-20px,-60px)}90%{opacity:1;transform:translate(110px,-40px)}96%{opacity:0;transform:translate(150px,-30px)scale(.7)}to{opacity:0}}@keyframes hrNetSwing{0%{opacity:0;transform:rotate(0)translateY(20px)}8%{opacity:1;transform:rotate(-30deg)translateY(-30px)}30%{opacity:1;transform:rotate(-55deg)translateY(-50px)}50%{opacity:1;transform:rotate(-12deg)translateY(-22px)}70%{opacity:1;transform:rotate(-50deg)translateY(-46px)}90%{opacity:1;transform:rotate(-28deg)translateY(-30px)}96%{opacity:0;transform:rotate(0)translateY(20px)}to{opacity:0}}@keyframes hrNetArm{0%{transform:rotate(-24deg)}8%{transform:rotate(-120deg)translate(6px,-30px)}30%{transform:rotate(-150deg)translate(10px,-44px)}50%{transform:rotate(-95deg)translate(2px,-20px)}70%{transform:rotate(-140deg)translate(8px,-40px)}90%{transform:rotate(-110deg)translate(4px,-26px)}to{transform:rotate(-24deg)}}@keyframes hrFollowBf{0%,to{transform:translate(-50%)rotate(0)}25%{transform:translate(-50%)rotate(-10deg)}50%{transform:translate(-50%)rotate(12deg)}75%{transform:translate(-50%)rotate(-8deg)}}@keyframes hrWideEye{0%,to{}20%,90%{height:48%}}.hero-robot .stage.s-rain .rain,.hero-robot .stage.s-rain .raincoat,.hero-robot .stage.s-rain .rainhood{opacity:1}.hero-robot .stage.s-sun .shades{opacity:1;transform:translate(-50%)translateY(0)}.hero-robot .stage.s-sun .sun{opacity:1;transform:scale(1)rotate(360deg)}.hero-robot .stage.s-sun .arm.l{animation:6s ease-in-out infinite hrCoolArm}@keyframes hrCoolArm{0%{transform:rotate(24deg)}12%{transform:rotate(-60deg)translate(-10px,-40px)}24%{transform:rotate(24deg)}to{transform:rotate(24deg)}}.hero-robot .sun{opacity:0;z-index:1;background:radial-gradient(circle,#ffe27a,#ffb938);border-radius:50%;width:70px;height:70px;transition:opacity .5s,transform 1s;position:absolute;top:6%;left:8%;transform:scale(.4)rotate(0);box-shadow:0 0 40px #ffc850cc}.hero-robot .sun:before{content:"";background:repeating-conic-gradient(#ffd25ab3 0 8deg,transparent 8deg 22deg);z-index:-1;border-radius:50%;position:absolute;inset:-14px}.hero-robot .stage.s-love .robot2{opacity:1;transform:translate(0)}.hero-robot .stage.s-love .hearts{opacity:1}.hero-robot .stage.s-love .head{animation:6s ease-in-out infinite hrLoveLook}.hero-robot .stage.s-love .eye{animation:5s infinite hrBlink,6s ease-in-out infinite hrLoveEye}.hero-robot .stage.s-love .arm.r{animation:6s ease-in-out infinite hrWave2}@keyframes hrLoveLook{0%,to{transform:translate(-50%)rotate(0)}50%{transform:translate(-50%)rotate(10deg)}}@keyframes hrLoveEye{0%,to{}30%,70%{height:30%}}@keyframes hrWave2{0%{transform:rotate(-24deg)}20%,60%{transform:rotate(-150deg)translate(8px,-40px)}40%{transform:rotate(-120deg)translate(6px,-34px)}to{transform:rotate(-24deg)}}.hero-robot .stage.s-love .heart{animation:2.2s ease-in infinite hrFloatHeart}.hero-robot .stage.s-love .heart:first-child{animation-delay:0s;left:10px}.hero-robot .stage.s-love .heart:nth-child(2){animation-delay:.5s;left:46px}.hero-robot .stage.s-love .heart:nth-child(3){animation-delay:1s;left:78px}.hero-robot .stage.s-love .heart:nth-child(4){animation-delay:1.5s;left:30px}.hero-robot .stage.s-love .heart:nth-child(5){animation-delay:2s;left:62px}@keyframes hrFloatHeart{0%{opacity:0;transform:translateY(120px)scale(.5)}20%{opacity:1}80%{opacity:1}to{opacity:0;transform:translateY(-10px)scale(1.1)}}.hero-robot .bubble{transform-origin:bottom;color:#1c1a22;opacity:0;pointer-events:none;text-align:center;z-index:30;background:#fff;border-radius:20px;max-width:300px;padding:16px 20px;font-size:1rem;font-weight:500;line-height:1.45;transition:opacity .25s,transform .25s cubic-bezier(.2,1.4,.4,1);position:absolute;top:-4%;left:50%;transform:translate(-50%)scale(.6);box-shadow:0 18px 40px -16px #00000073}.hero-robot .bubble.show{opacity:1;transform:translate(-50%)scale(1)}.hero-robot .bubble:after{content:"";border:11px solid #0000;border-top-color:#fff;border-bottom:none;position:absolute;bottom:-12px;left:50%;transform:translate(-50%)}.hero-robot .hint{color:#ffffffd9;white-space:nowrap;font-size:.82rem;animation:2.4s ease-in-out infinite hrHintPulse;position:absolute;bottom:1%;left:50%;transform:translate(-50%)}@keyframes hrHintPulse{0%,to{opacity:.5}50%{opacity:.95}}@media (prefers-reduced-motion:reduce){.hero-robot *{animation:none!important}}
