body{margin:0;background:#F2F2F2}
a{color:#1F2937}a:hover{color:#000000}
.pg{container-type:inline-size;container-name:pg}
.card{background:#FFFFFF;transition:transform .2s ease,box-shadow .2s ease}
.card:hover{transform:translateY(-3px);box-shadow:0 12px 26px rgba(0,0,0,0.08)}
.card:focus-visible{outline:3px solid #1F2937;outline-offset:3px}
.mini{transition:transform .25s ease}
.card:hover .mini{transform:rotate(-8deg) scale(1.06)}
.clamp{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
@keyframes rise{from{opacity:0;transform:translateY(14px)}}
.enter{animation:rise .55s cubic-bezier(.2,.7,.2,1) backwards}
@keyframes fadeIn{from{opacity:0;transform:translateY(6px)}}
.fade{animation:fadeIn .35s ease-out both}
.eyes{transform-origin:50px 65px;animation:blinkE 4s infinite}
@keyframes blinkE{0%,93%,100%{transform:scaleY(1)}96%{transform:scaleY(.1)}}
.bob{animation:bob 1.6s ease-in-out infinite}
@keyframes bob{50%{transform:translateY(-5px)}}
.dots{animation:dots 1s steps(1) infinite}
@keyframes dots{50%{opacity:.2}}
.stage{container-type:inline-size;container-name:stage}
.card:hover~.x{}
.hintic{animation:hintP 2.4s ease-in-out infinite}
@keyframes hintP{0%,100%{transform:scale(1)}50%{transform:scale(1.15)}}
.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.psst{transform-origin:22px 100%;animation:psstIn .5s cubic-bezier(.3,1.6,.5,1) 1.2s backwards,psstFloat 2.4s ease-in-out 1.7s infinite}
@keyframes psstIn{from{opacity:0;transform:scale(.4) translateY(10px)}}
@keyframes psstFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
.tap{animation:tapP 1.6s ease-in-out infinite}
@keyframes tapP{0%,100%{transform:scale(1)}50%{transform:scale(.86)}}
.trybtn{position:relative;overflow:hidden;isolation:isolate;transition:transform .2s ease;animation:tryPulse 2s ease-out infinite}
.trybtn::after{content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,0.4),transparent);transform:skewX(-20deg);animation:shine 2.8s ease-in-out infinite;pointer-events:none}
.trybtn:hover{transform:translateY(-1px)}
.trybtn:focus-visible{outline:3px solid #1F2937;outline-offset:3px}
.playic{transition:transform .2s ease}
@keyframes tryPulse{0%{box-shadow:0 0 0 0 rgba(245,196,0,0.75)}70%{box-shadow:0 0 0 14px rgba(245,196,0,0)}100%{box-shadow:0 0 0 0 rgba(245,196,0,0)}}
@keyframes shine{0%,55%{left:-60%}100%{left:130%}}
.livedot{animation:live 1.2s ease-in-out infinite}
@keyframes live{50%{opacity:.25}}
@container pg (max-width: 1120px) and (min-width: 821px){
 .aside{flex-basis:290px!important;padding:56px 28px!important}
 .nm{font-size:32px!important}
 .main{padding:56px 28px 64px 8px!important}
 .card{padding:14px!important;gap:12px!important}
 .mini{width:58px!important;height:58px!important;border-radius:14px!important}
 .mini svg{width:44px;height:48px}
}
@container pg (max-width: 820px){
 .aside{max-width:none!important;padding:36px 20px 8px!important}
 .main{padding:20px 20px 56px!important}
 .grid2{grid-template-columns:minmax(0,1fr)!important}
 .main h2{font-size:13px!important;letter-spacing:0.04em!important}
 .hint{font-size:12px!important}
 .card{padding:14px!important;gap:12px!important;min-height:0!important}
 .mini{width:56px!important;height:56px!important;border-radius:14px!important}
 .mini svg{width:42px;height:46px}

}
@container stage (max-width: 700px){
 .flow{flex-direction:column!important;align-items:stretch!important}
 .panel{flex:0 0 auto!important;height:230px!important}
 .track{flex:0 0 40px!important;width:100%}
 .lineH{display:none}
 .lineV{display:block!important}
 .pk{left:50%!important;margin:0 0 0 -12px!important;width:24px!important;height:24px!important}
 .pk svg{width:12px;height:12px}
 .pin0{animation-name:pin0V!important}.pin1{animation-name:pin1V!important}.pin2{animation-name:pin2V!important}
 .pout0{animation-name:pout0V!important}.pout1{animation-name:pout1V!important}.pout2{animation-name:pout2V!important}
 .pbody{padding:7px!important;gap:5px!important;overflow:hidden}
 .wab{justify-content:flex-end}
 .opt{display:none!important}
 .agentcol{flex:0 0 auto!important;flex-direction:row!important;gap:12px!important;padding:2px 0}
 .agentcol svg{width:58px;height:64px}
 .aginfo{align-items:flex-start!important}
 .agstatus{text-align:left!important}
 .fxp{top:auto!important;bottom:0;right:4px!important}
}
@media (max-width: 700px){
 .ovl{padding:0!important;align-items:stretch!important}
 .dlg{max-height:100%!important;height:100%;border-radius:0!important;padding:12px 12px 20px!important;gap:12px!important}
 .stage{padding:10px!important;background-image:none!important}
 .kpis{gap:14px!important;flex-wrap:nowrap!important;width:100%}
 .kpis>div{flex:1 1 0;min-width:0}
 .trybtn{flex:1 1 100%;justify-content:center;order:-1}
 .kpis span:first-child{font-size:20px!important}
}
@keyframes w2_94{0%,2%{opacity:0;transform:translateY(6px)}4%,94%{opacity:1;transform:none}96%,100%{opacity:0;transform:none}}.w2_94{animation:w2_94 8s ease-out infinite both}
@keyframes w22_94{0%,22%{opacity:0;transform:translateY(6px)}24%,94%{opacity:1;transform:none}96%,100%{opacity:0;transform:none}}.w22_94{animation:w22_94 8s ease-out infinite both}
@keyframes w42_94{0%,42%{opacity:0;transform:translateY(6px)}44%,94%{opacity:1;transform:none}96%,100%{opacity:0;transform:none}}.w42_94{animation:w42_94 8s ease-out infinite both}
@keyframes w35_94{0%,35%{opacity:0;transform:translateY(6px)}37%,94%{opacity:1;transform:none}96%,100%{opacity:0;transform:none}}.w35_94{animation:w35_94 8s ease-out infinite both}
@keyframes w55_94{0%,55%{opacity:0;transform:translateY(6px)}57%,94%{opacity:1;transform:none}96%,100%{opacity:0;transform:none}}.w55_94{animation:w55_94 8s ease-out infinite both}
@keyframes w75_94{0%,75%{opacity:0;transform:translateY(6px)}77%,94%{opacity:1;transform:none}96%,100%{opacity:0;transform:none}}.w75_94{animation:w75_94 8s ease-out infinite both}
@keyframes w80_94{0%,80%{opacity:0;transform:translateY(6px)}82%,94%{opacity:1;transform:none}96%,100%{opacity:0;transform:none}}.w80_94{animation:w80_94 8s ease-out infinite both}
@keyframes h2_16{0%,2%{background-color:transparent}3%,16%{background-color:#DCFCE7}19%,100%{background-color:transparent}}.h2_16{animation:h2_16 8s ease infinite both}
@keyframes h22_36{0%,22%{background-color:transparent}23%,36%{background-color:#DCFCE7}39%,100%{background-color:transparent}}.h22_36{animation:h22_36 8s ease infinite both}
@keyframes h42_56{0%,42%{background-color:transparent}43%,56%{background-color:#DCFCE7}59%,100%{background-color:transparent}}.h42_56{animation:h42_56 8s ease infinite both}
@keyframes w82_94{0%,82%{opacity:0;transform:translateY(6px)}84%,94%{opacity:1;transform:none}96%,100%{opacity:0;transform:none}}.w82_94{animation:w82_94 8s ease-out infinite both}
@keyframes w88_94{0%,88%{opacity:0;transform:translateY(6px)}90%,94%{opacity:1;transform:none}96%,100%{opacity:0;transform:none}}.w88_94{animation:w88_94 8s ease-out infinite both}
@keyframes x1_21{0%,1%{opacity:0}2%,21%{opacity:1}22%,100%{opacity:0}}.x1_21{animation:x1_21 8s ease infinite both}
@keyframes x21_41{0%,21%{opacity:0}22%,41%{opacity:1}42%,100%{opacity:0}}.x21_41{animation:x21_41 8s ease infinite both}
@keyframes x41_94{0%,41%{opacity:0}42%,94%{opacity:1}95%,100%{opacity:0}}.x41_94{animation:x41_94 8s ease infinite both}
@keyframes f2{0%,2%{opacity:0}3%{opacity:.9}7%,100%{opacity:0}}.f2{animation:f2 8s ease-out infinite both}
@keyframes f22{0%,22%{opacity:0}23%{opacity:.9}27%,100%{opacity:0}}.f22{animation:f22 8s ease-out infinite both}
@keyframes f42{0%,42%{opacity:0}43%{opacity:.9}47%,100%{opacity:0}}.f42{animation:f42 8s ease-out infinite both}
@keyframes h17_29{0%,17%{background-color:transparent}18%,29%{background-color:#EDE9FE}32%,100%{background-color:transparent}}.h17_29{animation:h17_29 8s ease infinite both}
@keyframes h37_49{0%,37%{background-color:transparent}38%,49%{background-color:#EDE9FE}52%,100%{background-color:transparent}}.h37_49{animation:h37_49 8s ease infinite both}
@keyframes h57_69{0%,57%{background-color:transparent}58%,69%{background-color:#EDE9FE}72%,100%{background-color:transparent}}.h57_69{animation:h57_69 8s ease infinite both}
@keyframes pin0H{0%,4%{left:0;opacity:0}5%{opacity:1}16%{left:calc(100% - 30px);opacity:1}17%,100%{left:calc(100% - 30px);opacity:0}}
@keyframes pin0V{0%,4%{top:0;opacity:0}5%{opacity:1}16%{top:calc(100% - 24px);opacity:1}17%,100%{top:calc(100% - 24px);opacity:0}}
.pin0{animation:pin0H 8s cubic-bezier(.5,0,.3,1) infinite both}
@keyframes pout0H{0%,21%{left:0;opacity:0}22%{opacity:1}34%{left:calc(100% - 30px);opacity:1}35%,100%{left:calc(100% - 30px);opacity:0}}
@keyframes pout0V{0%,21%{top:0;opacity:0}22%{opacity:1}34%{top:calc(100% - 24px);opacity:1}35%,100%{top:calc(100% - 24px);opacity:0}}
.pout0{animation:pout0H 8s cubic-bezier(.5,0,.3,1) infinite both}
@keyframes pin1H{0%,24%{left:0;opacity:0}25%{opacity:1}36%{left:calc(100% - 30px);opacity:1}37%,100%{left:calc(100% - 30px);opacity:0}}
@keyframes pin1V{0%,24%{top:0;opacity:0}25%{opacity:1}36%{top:calc(100% - 24px);opacity:1}37%,100%{top:calc(100% - 24px);opacity:0}}
.pin1{animation:pin1H 8s cubic-bezier(.5,0,.3,1) infinite both}
@keyframes pout1H{0%,41%{left:0;opacity:0}42%{opacity:1}54%{left:calc(100% - 30px);opacity:1}55%,100%{left:calc(100% - 30px);opacity:0}}
@keyframes pout1V{0%,41%{top:0;opacity:0}42%{opacity:1}54%{top:calc(100% - 24px);opacity:1}55%,100%{top:calc(100% - 24px);opacity:0}}
.pout1{animation:pout1H 8s cubic-bezier(.5,0,.3,1) infinite both}
@keyframes pin2H{0%,44%{left:0;opacity:0}45%{opacity:1}56%{left:calc(100% - 30px);opacity:1}57%,100%{left:calc(100% - 30px);opacity:0}}
@keyframes pin2V{0%,44%{top:0;opacity:0}45%{opacity:1}56%{top:calc(100% - 24px);opacity:1}57%,100%{top:calc(100% - 24px);opacity:0}}
.pin2{animation:pin2H 8s cubic-bezier(.5,0,.3,1) infinite both}
@keyframes pout2H{0%,61%{left:0;opacity:0}62%{opacity:1}74%{left:calc(100% - 30px);opacity:1}75%,100%{left:calc(100% - 30px);opacity:0}}
@keyframes pout2V{0%,61%{top:0;opacity:0}62%{opacity:1}74%{top:calc(100% - 24px);opacity:1}75%,100%{top:calc(100% - 24px);opacity:0}}
.pout2{animation:pout2H 8s cubic-bezier(.5,0,.3,1) infinite both}
@keyframes act{0%,15%{transform:none}17%{transform:scale(1.1) rotate(-5deg)}21%,35%{transform:none}37%{transform:scale(1.1) rotate(-5deg)}41%,55%{transform:none}57%{transform:scale(1.1) rotate(-5deg)}61%,100%{transform:none}}.act{animation:act 8s ease-out infinite both}
@keyframes fxp{0%,15%{opacity:0;transform:scale(.6)}17%{opacity:1;transform:scale(1)}23%,35%{opacity:0;transform:scale(1.3)}37%{opacity:1;transform:scale(1)}43%,55%{opacity:0;transform:scale(1.3)}57%{opacity:1;transform:scale(1)}63%,100%{opacity:0;transform:scale(1.3)}}.fxp{animation:fxp 8s ease-out infinite both}
@keyframes cov{0%,34%{width:0}37%,54%{width:33%}57%,74%{width:66%}77%,96%{width:100%}100%{width:0}}.cov{animation:cov 8s ease infinite both}
@keyframes truck{0%,82%{left:0;opacity:0}84%{opacity:1;left:0}96%{left:calc(100% - 52px);opacity:1}100%{left:calc(100% - 52px);opacity:0}}.truck{animation:truck 8s ease-in infinite both}
@media (prefers-reduced-motion: reduce){
 .w2_94,.w22_94,.w42_94,.w35_94,.w55_94,.w75_94,.w80_94,.h2_16,.h22_36,.h42_56,.w82_94,.w88_94,.x1_21,.x21_41,.x41_94,.h17_29,.h37_49,.h57_69,.enter,.fade,.eyes,.bob,.act,.dots,.fxp,.cov,.truck{animation:none!important;opacity:1!important;transform:none!important}
 .pk,.fxp,.truck,.f2,.f22,.f42{display:none}
 .cov{width:100%}
 .card,.mini{transition:none}
 .trybtn,.trybtn::after,.livedot,.psst,.hintic{animation:none!important}
}