:root{
  --bg:#f6f9f2;
  --surface:#ffffff;
  --ink:#141a1f;
  --ink2:#56606b;
  --ink3:#8a929c;
  --line:rgba(20,40,30,.08);
  --g50:#eef7e8;
  --g100:#dff1d4;
  --g200:#c9eab6;
  --g300:#addf93;
  --g600:#3c8a4f;
  --g800:#184d2a;
  --g900:#0e3a1e;
  --l100:#ece8ff;
  --l200:#dcd5ff;
  --l600:#7262e0;
  --p100:#ffece1;
  --p200:#ffdcc7;
  --p600:#d2703a;
  --blue:#1f66ff;
  --blue2:#1757e6;
  --sans:-apple-system,BlinkMacSystemFont,"SF Pro Display","PingFang SC","Hiragino Sans GB","Noto Sans SC","Microsoft YaHei",sans-serif;
  --ease:cubic-bezier(.2,0,0,1);
  --ease-out:cubic-bezier(.05,.7,.1,1);
  --ease-io:cubic-bezier(.65,0,.25,1);
  --spring:cubic-bezier(.34,1.56,.64,1);
  color-scheme:light;
}
@property --hz{syntax:"<integer>";inherits:true;initial-value:60}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
html.motion{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.6 var(--sans);-webkit-font-smoothing:antialiased;overflow-x:hidden;overflow-x:clip}
a{color:inherit}
img,svg{display:block}
main{overflow-x:clip}
.sprite{position:absolute;width:0;height:0;overflow:hidden}
.wrap{width:100%;max-width:1280px;margin:0 auto;padding:0 40px}
section{scroll-margin-top:72px}

.dev{position:relative;width:100%;aspect-ratio:674/1436;isolation:isolate}
.dev::before{content:"";position:absolute;inset:2% 4%;border-radius:14%/6.6%;box-shadow:0 46px 70px -34px rgba(16,34,26,.5),0 18px 34px -20px rgba(16,34,26,.32);z-index:-1}
.dev .scr{position:absolute;left:3.3%;top:1.45%;width:92.4%;height:97.1%;object-fit:cover;border-radius:9.4%/4.3%;background:#0b0d10}
.dev .shell{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;-webkit-user-select:none;user-select:none}
.dev::after{content:"";position:absolute;left:49.6%;top:2.6%;width:3.3%;aspect-ratio:1;translate:-50% 0;border-radius:50%;background:#06080a;box-shadow:inset 0 0 0 1px rgba(255,255,255,.07);z-index:2}

.top{position:sticky;top:0;z-index:50;background:rgba(246,249,242,.78);backdrop-filter:saturate(1.4) blur(16px);-webkit-backdrop-filter:saturate(1.4) blur(16px);transition:box-shadow .3s var(--ease),background .3s}
.top.scrolled{box-shadow:0 1px 0 var(--line),0 10px 30px -22px rgba(20,40,30,.35);background:rgba(246,249,242,.9)}
.top-in{height:72px;display:flex;align-items:center;gap:40px}
.top-prog{position:absolute;left:0;bottom:0;width:100%;height:2px;background:linear-gradient(90deg,var(--g600),var(--blue));transform-origin:0 50%;transform:scaleX(var(--sp,0))}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;font-weight:800;font-size:20px;letter-spacing:-.01em}
.links{display:flex;gap:30px;font-size:15px;color:var(--ink2)}
.links a{position:relative;text-decoration:none;white-space:nowrap;transition:color .2s}
.links a::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;border-radius:2px;background:var(--g600);transform:scaleX(0);transition:transform .35s var(--ease)}
.links a:hover{color:var(--ink)}
.links a:hover::after,.links a.cur::after{transform:scaleX(1)}
.links a.cur{color:var(--ink)}
.links .nav-cloud{display:inline-flex;align-items:center;gap:7px}
.nav-cloud img{width:20px;height:20px;border-radius:6px}
.links .menu-close,.links .m-only{display:none}
.top-r{margin-left:auto;display:flex;align-items:center;gap:10px}
.top-r>*{flex-shrink:0;white-space:nowrap}
@media (min-width:1181px){html[lang="en"] .links{gap:22px}}
[data-site="cn"]{display:none!important}
.soc{display:flex;align-items:center;gap:2px;padding-right:8px;margin-right:2px;border-right:1px solid var(--line)}
.soc-a{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;color:var(--ink2);transition:background .2s,color .2s}
.soc-a:hover{background:rgba(20,40,30,.06);color:var(--ink)}
.soc-a:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
.soc-a svg{width:20px;height:20px}
.snd{display:grid;place-items:center;width:38px;height:38px;padding:0;border:0;border-radius:50%;background:none;color:var(--ink2);cursor:pointer;transition:background .2s,color .2s}
.snd:hover{background:rgba(20,40,30,.06);color:var(--ink)}
.snd:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
.snd svg{width:21px;height:21px}
.snd .snd-off,.snd.off .snd-on{display:none}
.snd.off .snd-off{display:block}
.snd[hidden]{display:none}
.lang{font-size:14px;font-weight:600;text-decoration:none;color:var(--ink2);padding:8px 12px;border-radius:999px;transition:background .2s}
.lang:hover{background:var(--g100)}
.btn-top{position:relative;overflow:hidden;display:inline-flex;align-items:center;gap:8px;height:42px;padding:0 20px;border-radius:999px;background:var(--blue);color:#fff;font-size:15px;font-weight:700;text-decoration:none;box-shadow:0 10px 22px -12px rgba(31,102,255,.9);transition:background .2s,translate .25s var(--ease),scale .15s var(--ease)}
.btn-top svg{width:18px;height:18px}
.btn-top:hover{background:var(--blue2);translate:0 -1px}
.btn-top:active{scale:.96}
.menu-btn{display:none}

.rip{position:absolute;border-radius:50%;background:currentColor;opacity:.28;pointer-events:none;translate:-50% -50%;scale:0;animation:rip .65s var(--ease-out) forwards}
@keyframes rip{to{scale:1;opacity:0}}

.hero{position:relative;overflow:hidden;padding:28px 0 96px}
.hero-bg{position:absolute;inset:0;pointer-events:none}
.sh{position:absolute;translate:calc(var(--mx,0) * var(--d) * 1px) calc(var(--my,0) * var(--d) * 1px);transition:translate .9s var(--ease-out)}
.sh1{width:560px;height:560px;right:-120px;top:-150px;fill:var(--g100);animation:drift 22s ease-in-out infinite alternate}
.sh2{width:420px;height:420px;right:-90px;bottom:30px;fill:var(--l100);animation:drift 26s ease-in-out infinite alternate-reverse}
.sh3{width:300px;height:300px;left:-120px;bottom:40px;fill:var(--p100);rotate:20deg;animation:drift 30s ease-in-out infinite alternate}
@keyframes drift{to{rotate:40deg;scale:1.06}}

.hero-in{position:relative;display:grid;grid-template-columns:minmax(0,640px) minmax(0,1fr);grid-template-areas:"copy art" "dl art";column-gap:48px;align-items:start}
.copy{grid-area:copy;padding-top:52px}
.art{grid-area:art;align-self:center}
.dl{grid-area:dl;margin-top:40px}

.chip{display:inline-flex;align-items:center;gap:10px;height:40px;padding:0 14px 0 12px;border-radius:999px;background:var(--g100);color:var(--g800);font-size:15px;font-weight:600;text-decoration:none;transition:background .2s,translate .25s var(--ease)}
.chip:hover{background:var(--g200);translate:2px 0}
.chip svg{width:26px;height:16px;color:var(--g800);--bot-eye:var(--g100)}
.chip .chev{width:16px;height:16px}
h1{margin:26px 0 22px;font-size:80px;line-height:1.1;font-weight:800;letter-spacing:-.035em}
h1 .ln{display:block;overflow:hidden;padding-bottom:.08em;margin-bottom:-.08em}
h1 .ln span{display:inline-block}
.hl{position:relative;isolation:isolate}
.hl-ink{position:absolute;left:2%;bottom:-.02em;width:102%;height:.28em;z-index:-1;overflow:visible}
.hl-ink path{fill:none;stroke:#a6dc8c;stroke-width:7;stroke-linecap:round;stroke-dasharray:320;stroke-dashoffset:0}
.lead{margin:0;max-width:520px;font-size:18px;line-height:1.75;color:var(--ink2)}

.cta{display:flex;flex-wrap:wrap;gap:12px}
.btn-fill,.btn-tonal{position:relative;overflow:hidden;isolation:isolate;display:inline-flex;align-items:center;gap:12px;min-height:66px;border-radius:999px;text-decoration:none;transition:translate .3s var(--ease),scale .15s var(--ease),box-shadow .3s,background .2s}
.btn-fill span,.btn-tonal span{display:flex;flex-direction:column;line-height:1.3}
.btn-fill b,.btn-tonal b{font-size:17px;font-weight:700}
.btn-fill small,.btn-tonal small{font-size:12.5px}
.btn-fill{padding:0 30px 0 22px;background:var(--blue);color:#fff;box-shadow:0 16px 30px -16px rgba(31,102,255,.9)}
.btn-fill svg{width:24px;height:24px;transition:translate .3s var(--spring)}
.btn-fill small{color:rgba(255,255,255,.86)}
.btn-fill:hover{background:var(--blue2);translate:0 -3px;box-shadow:0 22px 34px -16px rgba(31,102,255,.95)}
.btn-fill:hover svg{translate:0 3px}
.btn-tonal{padding:0 26px 0 12px;background:var(--g100);color:var(--g900)}
.btn-tonal img{width:42px;height:42px;border-radius:12px;transition:rotate .4s var(--spring)}
.btn-tonal small{color:var(--g800);opacity:.8}
.btn-tonal:hover{background:var(--g200);translate:0 -3px}
.btn-tonal:hover img{rotate:-8deg}
.btn-fill:active,.btn-tonal:active{scale:.97}
.btn-fill:focus-visible,.btn-tonal:focus-visible{outline:3px solid var(--blue);outline-offset:3px}
.shine::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,.38) 48%,transparent 66%);translate:-120% 0;animation:shine 4.5s var(--ease-io) 1.5s infinite}
@keyframes shine{0%,70%{translate:-120% 0}100%{translate:120% 0}}
.assist{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}

.art{position:relative;width:100%;max-width:660px;justify-self:end;aspect-ratio:660/720;container-type:inline-size}
.art>*{translate:calc(var(--mx,0) * var(--d,0) * 1px) calc(var(--my,0) * var(--d,0) * 1px);transition:translate .9s var(--ease-out)}
.a15{position:absolute;left:0;top:16cqi;width:54cqi;aspect-ratio:1;container-type:inline-size}
.a15-shape{position:absolute;inset:0;width:100%;height:100%;fill:var(--g200);animation:spin 90s linear infinite}
.a15 .ring{position:absolute;inset:14%;border-radius:50%;border:2px solid var(--g600);opacity:0;pointer-events:none}
.a15-in{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--g900);padding-bottom:4cqi}
.a15-bot{width:34cqi;height:20cqi;color:var(--g800);--bot-eye:var(--g200)}
.a15-word{margin-top:3.5cqi;font-size:9.4cqi;font-weight:800;letter-spacing:.24em;padding-left:.24em;line-height:1}
.a15-num{display:block;height:.86em;overflow:hidden;font-size:52cqi;font-weight:900;letter-spacing:-.06em;line-height:.86;margin-top:1cqi}
.a15-roll{display:flex;flex-direction:column;align-items:center;translate:0 -6.88em}
.a15-roll b{display:block;height:.86em;font-weight:900}
.hero-dev{position:absolute;right:1cqi;top:0;width:47cqi}
.dlt{position:relative;overflow:hidden;isolation:isolate;flex:1;display:flex;align-items:center;gap:14px;min-height:72px;padding:10px 18px 10px 12px;border-radius:22px;text-decoration:none;transition:translate .3s var(--ease),scale .15s var(--ease),box-shadow .3s,background .25s}
.dlt-ic{flex:0 0 auto;width:50px;height:50px;border-radius:15px;display:grid;place-items:center;overflow:hidden}
.dlt-ic img{width:100%;height:100%;object-fit:contain}
.dlt-tx{flex:1;display:flex;flex-direction:column;line-height:1.3;min-width:0}
.dlt-tx b{font-size:17px;font-weight:800;letter-spacing:-.01em}
.dlt-tx small{font-size:12.5px;opacity:.85}
.dlt-go{flex:0 0 auto;width:22px;height:22px;transition:translate .3s var(--spring)}
.dlt:hover{translate:0 -2px}
.dlt:hover .dlt-go{translate:0 3px}
.dlt:active{scale:.98}
.dlt:focus-visible{outline:3px solid var(--blue);outline-offset:3px}
.dlt-plus{background:var(--blue);color:#fff;box-shadow:0 16px 28px -16px rgba(31,102,255,.9)}
.dlt-plus:hover{background:var(--blue2)}
.dlt-plus .dlt-ic{background:#fff;padding:7px}
.dlt-qq,.dlt-ast,.dlt-soc{background:#fff;color:var(--ink);box-shadow:0 12px 26px -22px rgba(20,40,30,.5),inset 0 0 0 1px var(--line)}
.dlt-qq:hover,.dlt-ast:hover{background:#f7faf5}
.dlt-qq small,.dlt-ast small,.dlt-soc small{color:var(--ink2);opacity:1}
.dlt-qq .dlt-ic img{border-radius:50%}
.dlt-qq small{font-variant-numeric:tabular-nums}
.dlt-qq .dlt-go{width:18px;height:18px;color:var(--ink3)}
.dlt-qq:hover .dlt-go{translate:3px 0}
.qq-hd{display:flex;align-items:center;gap:9px;align-self:stretch}
.qq-hd img{width:36px;height:36px;border-radius:50%}
.qq-hd span{display:flex;flex-direction:column;line-height:1.25}
.qq-hd b{font-size:14.5px}
.qq-hd em{font-style:normal;font-size:12.5px;color:var(--ink2);font-variant-numeric:tabular-nums}
.qq-qr{width:118px;height:118px;border-radius:10px;transition:scale .35s var(--spring)}
.get-qq:hover .qq-qr{scale:1.04}
.qq-go{display:inline-flex;align-items:center;gap:3px;font-size:12.5px;font-weight:700;color:#0b8ad8}
.qq-go svg{width:14px;height:14px;transition:translate .25s var(--spring)}
.get-qq:hover .qq-go svg{translate:3px 0}
.dlq{position:relative;display:inline-flex}
.qrp{position:absolute;left:50%;bottom:calc(100% + 14px);z-index:30;width:164px;padding:12px 12px 10px;border-radius:20px;background:#fff;box-shadow:0 26px 44px -20px rgba(20,40,30,.5),0 0 0 1px var(--line);display:flex;flex-direction:column;align-items:center;gap:6px;opacity:0;translate:-50% 10px;scale:.9;transform-origin:50% 100%;pointer-events:none;transition:opacity .2s var(--ease),translate .3s var(--spring),scale .3s var(--spring)}
.qrp::after{content:"";position:absolute;left:50%;bottom:-7px;width:14px;height:14px;margin-left:-7px;rotate:45deg;background:#fff;box-shadow:1px 1px 0 var(--line)}
.qrp img{width:140px;height:140px;border-radius:8px}
.qrp em{font-style:normal;font-size:12.5px;font-weight:600;color:var(--ink2)}
@media (hover:hover) and (pointer:fine){.dlq:hover .qrp,.dlq:focus-within .qrp{opacity:1;translate:-50% 0;scale:1}}
.dlg{display:grid;grid-template-columns:minmax(0,1fr) 156px;gap:12px;max-width:640px}
.dlr{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.dlr .dlq:first-child{grid-column:1/-1}
.dl .dl-qq{justify-content:center;gap:7px;padding:11px 10px 10px;border-radius:24px}
.dl .dl-qq .qq-hd{align-self:stretch}
.dl .dl-qq .qq-qr{width:86px;height:86px}
.dl .dl-qq .qq-hd{gap:7px}
.dl .dl-qq .qq-hd img{width:28px;height:28px}
.dl .dl-qq .qq-hd b{font-size:13.5px;white-space:nowrap}
.dl .dl-qq .qq-hd em{font-size:11.5px}
.dl .dl-qq .qq-go{font-size:12px}
.dlr .dlq{display:flex}
.dlr .dlt{min-height:66px;padding:8px 12px 8px 8px;gap:9px;border-radius:20px}
.dlr{grid-template-rows:1.15fr 1fr}
.dlr .dlt-plus{padding:10px 16px 10px 10px;gap:14px;border-radius:24px;background:#1f5cf0;box-shadow:0 22px 36px -20px rgba(31,92,240,.85)}
.dlr .dlt-plus:hover{background:#1a52db}
.dlt-deco{position:absolute;inset:0;z-index:-1;pointer-events:none}
.dlt-deco svg{position:absolute}
.dlt-deco .dd1{right:-34px;top:-54px;width:190px;height:190px;fill:#3c78ff;animation:spin 40s linear infinite}
.dlt-deco .dd2{right:118px;bottom:-62px;width:118px;height:118px;fill:#2f6bfa;animation:spin 30s linear infinite reverse}
.dlt-deco .dd3{right:96px;top:50%;width:62px;height:39px;margin-top:-20px;color:rgba(255,255,255,.2);--bot-eye:#3c78ff}
.dlr .dlt-plus .dlt-go{box-sizing:border-box;width:40px;height:40px;padding:10px;border-radius:50%;background:rgba(255,255,255,.2)}
.dlr .dlt-ic{width:44px;height:44px;border-radius:13px}
.dlr .dlt-plus .dlt-ic{width:50px;height:50px;border-radius:15px}
.dlr .dlt-plus .dlt-tx b{font-size:18px}
.dlr .dlt-tx b{font-size:15.5px;white-space:nowrap}
.dlr .dlt-plus .dlt-tx small{white-space:nowrap}
.dlr .dlt-go{width:18px;height:18px}

.dlt-ast .dlt-ic{background:#eaf2ff;padding:5px}
.dlt-ast .dlt-go{width:18px;height:18px;color:var(--ink3)}
.dlt-ast:hover .dlt-go{translate:3px 0}
.dlt-soc{cursor:default}
.dlt-soc:hover,.dlt-soc:active{translate:none;scale:none}
.dlr .dlt-soc{padding-left:16px}
.dlt-socs{flex:0 0 auto;display:flex;gap:4px}
.dlt-soc .soc-a{width:40px;height:40px;color:var(--ink);background:rgba(20,40,30,.05)}
.dlt-soc .soc-a:hover{background:rgba(20,40,30,.1)}
.dlt-soc .soc-a svg{width:22px;height:22px}

.pxl{position:absolute;left:3.3%;top:1.45%;width:92.4%;height:97.1%;border-radius:9.4%/4.3%;overflow:hidden;opacity:0;transition:opacity .375s var(--ease);background:#000}
.pxl.on{opacity:1}
.pxl iframe{position:absolute;left:0;top:0;border:0;transform-origin:0 0;background:#000}
.pxl-tip{position:absolute;left:50%;top:calc(100% + 12px);translate:-50% 0;margin:0;display:flex;flex-direction:column;align-items:center;gap:3px;white-space:nowrap;text-align:center}
.pxl-tip b{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:700;color:var(--l600)}
.pxl-tip small{font-size:12px;color:var(--ink3)}
.pxl-tip svg{width:18px;height:18px;animation:nudge 1.6s var(--ease-io) infinite}
.motion .hero-dev :is(.pxl-tip,.pxl-open){animation:tipIn .5s var(--ease-out) .5s both}
@keyframes tipIn{from{opacity:0}to{opacity:1}}
@media not all and (min-width:961px) and (pointer:fine){
  .hero-dev .pxl-open{display:flex}
  .hero-dev.open .pxl-open{display:none}
  .hero-dev.open .pxl-close{display:flex}
  .hero-dev:not(.open) .pxl-tip b{display:none}
  .hero-dev:not(.open) .dev{cursor:pointer}
  .hero-dev:not(.open) .pxl{pointer-events:none}
}
.pxl-open,.pxl-close{display:none;align-items:center;justify-content:center;gap:6px;white-space:nowrap;border:0;font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}
.pxl-open{position:absolute;left:50%;bottom:16%;z-index:3;translate:-50% 0;height:48px;padding:0 22px 0 18px;border-radius:999px;background:var(--ink);color:#fff;font-size:15px;font-weight:700;box-shadow:0 16px 30px -14px rgba(20,26,31,.7)}
.pxl-open svg{width:20px;height:20px;animation:nudge 1.6s var(--ease-io) infinite}
.pxl-close{position:absolute;right:-6px;top:-16px;z-index:4;height:34px;padding:0 14px;border-radius:999px;background:#fff;color:var(--ink);font-size:13.5px;font-weight:700;box-shadow:0 10px 22px -14px rgba(20,40,30,.55),0 0 0 1px var(--line)}
.scroll-cue{position:absolute;left:50%;bottom:22px;translate:-50% 0;width:26px;height:42px;border-radius:14px;border:2px solid rgba(20,40,30,.22)}
.scroll-cue i{position:absolute;left:50%;top:8px;width:4px;height:8px;margin-left:-2px;border-radius:2px;background:var(--g600);animation:cue 1.8s var(--ease-io) infinite}
@keyframes cue{0%{translate:0 0;opacity:0}30%{opacity:1}80%{translate:0 12px;opacity:0}100%{opacity:0}}

@keyframes spin{to{transform:rotate(360deg)}}
@keyframes rise{from{opacity:0;translate:0 26px}to{opacity:1;translate:0 0}}
@keyframes maskUp{from{translate:0 105%}to{translate:0 0}}
@keyframes ink{from{stroke-dashoffset:320}to{stroke-dashoffset:0}}
@keyframes shapeIn{from{scale:.5;opacity:0}to{scale:1;opacity:1}}
@keyframes roll{0%{translate:0 0;filter:blur(0)}60%{filter:blur(1.2px)}100%{translate:0 -6.88em;filter:blur(0)}}
@keyframes slam{0%{scale:1}1%{scale:1.32}100%{scale:1}}
@keyframes ring{0%{opacity:.7;scale:.55}100%{opacity:0;scale:1.7}}
@keyframes shake{0%,100%{transform:none}20%{transform:translate(-5px,3px)}40%{transform:translate(4px,-3px)}60%{transform:translate(-3px,2px)}80%{transform:translate(2px,-1px)}}
@keyframes phoneIn{from{opacity:0;translate:0 70px;rotate:5deg}to{opacity:1;translate:0 0;rotate:0deg}}
@keyframes scrOn{from{filter:brightness(0)}to{filter:brightness(1)}}
@keyframes pop{from{opacity:0;scale:.8}to{opacity:1;scale:1}}

.motion .h-in{animation:rise .525s var(--ease-out) calc(.038s + var(--i,0) * .041s) both}
.motion h1 .ln .h-in{animation-name:maskUp}
.motion .hl-ink path{animation:ink .45s var(--ease-io) .338s both}
.motion .hl-ink path+path{animation-delay:.413s}
.motion .a15-shape{animation:shapeIn .6s var(--spring) .038s both,spin 90s linear infinite}
.motion .a15-roll{animation:roll .525s cubic-bezier(.6,0,.85,.35) .188s both}
.motion .a15-num{animation:slam .375s cubic-bezier(.2,1.5,.4,1) .712s both}
.motion .a15 .ring{animation:ring .675s cubic-bezier(.1,.6,.3,1) .712s both}
.motion .a15 .ring.r2{animation-delay:.788s}
.motion .a15-in{animation:shake .3s ease-out .712s both}
.motion .hero-dev .dev{animation:phoneIn .675s var(--ease-out) .075s both}
.motion .hero-dev .scr{animation:scrOn .525s ease .338s both}
.motion .h-pop{animation:pop .45s var(--spring) .488s both}

.motion .rv:not(.in){opacity:0}
.motion .rv.in{animation:rise .413s var(--ease-out) calc(var(--i,0) * .03s) both}

.sec{position:relative;padding:120px 0}
.sec-tint{background:#fff}
.sec-head{max-width:760px;margin:0 auto 56px;text-align:center}
.sec-head.left{margin:0;text-align:left}
.sec-head h2,.stage-head h2,.v-copy h2{margin:18px 0 16px;font-size:52px;line-height:1.14;font-weight:800;letter-spacing:-.03em}
.sec-head p,.v-copy p{margin:0;font-size:18px;line-height:1.75;color:var(--ink2)}
.sec-head p a{color:var(--blue);text-decoration:none;font-weight:600}
.label{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 14px 0 10px;border-radius:999px;font-size:14.5px;font-weight:700}
.label svg{flex:0 0 auto;width:22px;height:22px}
.l-g{background:var(--g100);color:var(--g800);--bot-eye:var(--g100)}
.l-l{background:var(--l100);color:var(--l600)}
.l-p{background:var(--p100);color:var(--p600)}
.l-w{background:rgba(255,255,255,.8);color:var(--g800)}

.pin{position:relative}
.stage{position:relative}
.motion .pin .stage{height:100vh;height:100svh;min-height:600px;max-height:940px;overflow:hidden}
.motion .pin-a15 .stage{height:84vh;height:84svh;min-height:560px;max-height:780px}

.pin-multi{background:linear-gradient(#f6f9f2,#eef5ea)}
.pin-multi .stage{display:flex;flex-direction:column;padding:100px 0 34px}
.stage-head{text-align:center;position:relative;z-index:3}
.stage-head h2{margin:14px 0 6px}
.mc-sub{margin:0;display:inline-flex;align-items:baseline;flex-wrap:wrap;justify-content:center;gap:4px 14px;font-size:17px;color:var(--ink2)}
.mc-sub b{font-size:24px;font-weight:800;color:var(--g800);letter-spacing:-.01em}
.mc-field{position:relative;flex:1;--W:clamp(110px,min(15vw,25.5vh),250px);--H:calc(var(--W) * 2.131)}
.mc-host,.mc-vm{position:absolute;left:50%;top:50%;width:var(--W);margin:calc(var(--H) / -2) 0 0 calc(var(--W) / -2)}
.mc-host{z-index:4}
.mc-vm{--tt:var(--t,1);--es:.92;z-index:2;translate:calc(var(--W) * (var(--sx) + (var(--ex) - var(--sx)) * var(--tt))) calc(var(--H) * (var(--sy) + (var(--ey) - var(--sy)) * var(--tt)));scale:calc(.4 + (var(--es) - .4) * var(--tt));rotate:calc(var(--er) * var(--tt) * 1deg);opacity:clamp(0,calc(var(--tt) * 5),1);will-change:translate,scale}
.mc-vm:nth-of-type(1){--ex:-2.25;--ey:.1;--er:-7;--sx:-.25;--sy:-.17}
.mc-vm:nth-of-type(2){--ex:-1.15;--ey:.02;--er:-3.5;--sx:.25;--sy:-.17;z-index:3}
.mc-vm:nth-of-type(3){--ex:1.15;--ey:.02;--er:3.5;--sx:-.25;--sy:.25;z-index:3}
.mc-vm:nth-of-type(4){--ex:2.25;--ey:.1;--er:7;--sx:.25;--sy:.25}
.mc-tag{position:absolute;left:50%;top:calc(100% + 12px);translate:-50% 0;display:inline-flex;align-items:center;gap:7px;white-space:nowrap;height:32px;padding:0 13px;border-radius:999px;background:#fff;font-size:13.5px;font-weight:700;color:var(--ink);box-shadow:0 10px 22px -14px rgba(20,40,30,.55),0 0 0 1px var(--line)}
.mc-tag i{width:7px;height:7px;border-radius:50%;background:#0a9a63;box-shadow:0 0 0 4px rgba(10,154,99,.15)}
.mc-vm .mc-tag{scale:calc(1 / (.4 + (var(--es) - .4) * var(--tt)));rotate:calc(var(--er) * var(--tt) * -1deg);transform-origin:50% 0;opacity:clamp(0,calc((var(--tt) - .85) * 7),1)}
.mc-tag-host{background:var(--ink);color:#fff;box-shadow:0 10px 22px -12px rgba(20,26,31,.6)}
.mc-halo{position:absolute;left:50%;top:50%;width:calc(var(--W) * 3.4);aspect-ratio:1;translate:-50% -50%;border-radius:50%;background:radial-gradient(closest-side,rgba(173,223,147,.55),rgba(173,223,147,.16) 55%,transparent 72%);scale:calc(.6 + var(--p,1) * .7);opacity:calc(.5 + var(--p,1) * .5);pointer-events:none}
.mc-halo::before,.mc-halo::after{content:"";position:absolute;inset:18%;border-radius:50%;border:1.5px dashed rgba(60,138,79,.28);animation:spin 40s linear infinite}
.mc-halo::after{inset:2%;border-style:solid;border-color:rgba(60,138,79,.12);animation-duration:70s;animation-direction:reverse}
.mc-vm.landed .dev{animation:land .525s var(--spring)}
@keyframes land{0%{translate:0 -8px}100%{translate:0 0}}
.mc-pts{list-style:none;margin:0 auto;padding:0;display:flex;justify-content:center;flex-wrap:wrap;gap:12px 26px;position:relative;z-index:3;font-size:15.5px;font-weight:600;color:var(--g800);opacity:clamp(0,calc((var(--p,1) - .78) * 6),1);translate:0 calc((1 - clamp(0,calc((var(--p,1) - .78) * 6),1)) * 18px)}
.mc-pts li{display:inline-flex;align-items:center;gap:8px}
.mc-pts svg,.fl-pts svg,.ft-count svg{width:20px;height:20px;padding:3px;border-radius:50%;background:var(--g600);color:#fff}

.pin-a15{background:#fff}
.pin-a15 .stage{display:grid;place-items:center;padding:40px 0}
.v-emb{position:absolute;left:50%;top:50%;width:min(58vh,56vw,520px);aspect-ratio:1;translate:calc(-50% + var(--bx,0px) * var(--q,0)) calc(-50% + var(--by,0px) * var(--q,0));scale:calc(1 - (1 - var(--bs,1)) * var(--q,0));container-type:inline-size;z-index:2;will-change:translate,scale}
.v-cookie{position:absolute;inset:0;rotate:calc(var(--p,0) * 140deg)}
.v-cookie svg{width:100%;height:100%;fill:var(--g100)}
.v-ring{position:absolute;inset:18%;border-radius:50%;border:2.5px solid var(--g600);opacity:0;pointer-events:none}
.v-badge{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--g900);padding-bottom:5cqi}
.v-bot{width:24cqi;height:14cqi;color:var(--g800);--bot-eye:var(--g100)}
.v-word{margin-top:2.6cqi;font-size:7cqi;font-weight:800;letter-spacing:.26em;padding-left:.26em;line-height:1}
.v-num{display:block;height:.84em;overflow:hidden;font-size:40cqi;font-weight:900;letter-spacing:-.06em;line-height:.84;margin-top:1.5cqi}
.v-roll{display:flex;flex-direction:column;align-items:center;translate:0 calc(var(--v,8) * -.84em)}
.v-roll b{display:block;height:.84em;font-weight:900}
.v-ticks{position:absolute;left:50%;bottom:14px;translate:-50% 0;list-style:none;margin:0;padding:0;display:flex;gap:clamp(6px,1.6vw,24px);font-size:clamp(12px,1vw,15px);font-weight:700;color:var(--ink3);font-variant-numeric:tabular-nums;opacity:calc(1 - var(--q,0) * 2.4);z-index:3}
.v-ticks li{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;transition:color .3s}
.v-ticks img{width:clamp(30px,4.4vw,58px);height:clamp(30px,4.4vw,58px);object-fit:contain;filter:grayscale(1) opacity(.35);scale:.86;transition:filter .225s,scale .338s var(--spring)}
.v-ticks li.on img{filter:none;scale:1}
.v-ticks li.cur img{scale:1.28}
.v-ticks li.on{color:var(--g800)}
.v-ticks .v-fill{display:none}
.v-kicker{position:absolute;left:0;right:0;top:18px;margin:0;text-align:center;font-size:20px;font-weight:700;color:var(--g800);letter-spacing:.06em;opacity:calc(1 - var(--q,0) * 2.4);z-index:3}
.v-end{position:relative;z-index:3;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;align-items:center}
.v-spot{width:clamp(130px,15vw,210px);aspect-ratio:1;margin-bottom:6px}
.v-copy .label{margin-top:4px}
.v-duo{position:relative;height:min(62vh,540px);--W:calc(min(62vh,540px) * .43)}
.v-duo figure{position:absolute;margin:0;width:var(--W);display:flex;flex-direction:column;align-items:center;gap:12px}
.v-duo figcaption{display:flex;gap:8px;align-items:baseline;font-size:14px;color:var(--ink2);white-space:nowrap}
.v-duo figcaption b{font-size:16px;color:var(--ink)}
.v-a7{left:6%;top:9%;scale:.86;transform-origin:50% 0}
.v-a15{right:6%;top:0}
.motion .pin-a15 .v-end{position:absolute;inset:0;width:auto;margin:auto;max-width:1280px;opacity:var(--q,0);translate:0 calc((1 - var(--q,0)) * 50px);pointer-events:none}
.motion .pin-a15.ended .v-end{pointer-events:auto}
.motion .pin-a15 :is(.v-emb,.v-spot){cursor:pointer;-webkit-tap-highlight-color:transparent}
.v-emb:focus-visible{outline:3px solid var(--blue);outline-offset:6px;border-radius:50%}
.motion .v-a7{translate:calc((1 - var(--q,0)) * -60px) 0;rotate:calc((1 - var(--q,0)) * -6deg)}
.motion .v-a15{translate:calc((1 - var(--q,0)) * 80px) calc((1 - var(--q,0)) * 40px);rotate:calc((1 - var(--q,0)) * 6deg)}
.pin-a15.slam .v-num{animation:slam .45s cubic-bezier(.2,1.5,.4,1) both}
.pin-a15.slam .v-ring{animation:ring .9s cubic-bezier(.1,.6,.3,1) both}
.pin-a15.slam .v-ring.r2{animation-delay:.09s}
.pin-a15.slam .v-ring.r3{animation-delay:.18s}
.pin-a15.slam .v-badge{animation:shake .375s ease-out both}
.pin-a15:not(.motion *) .v-emb{position:relative;left:auto;top:auto;translate:none;width:min(420px,80vw);margin:0 auto}
.pin-a15:not(.motion *) .v-ticks,.pin-a15:not(.motion *) .v-kicker,.pin-a15:not(.motion *) .v-spot{display:none}

.feats-sec{padding:64px 0 40px;background:#fff}
.feat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.feat{position:relative;overflow:hidden;min-height:200px;padding:28px;border-radius:32px;display:flex;flex-direction:column;justify-content:flex-end;transition:transform .4s var(--ease),box-shadow .4s}
.feat:hover{transform:translateY(-6px);box-shadow:0 26px 40px -30px rgba(20,40,30,.4)}
.feat .fs{position:absolute;right:-30px;top:-30px;width:150px;height:150px;opacity:.9;transition:rotate .9s var(--ease),scale .6s var(--ease)}
.feat:hover .fs{rotate:60deg;scale:1.1}
.feat{justify-content:space-between}
.ft-ic{position:relative;display:flex;align-items:center;gap:8px;height:56px;margin-bottom:22px;transition:translate .4s var(--spring)}
.feat:hover .ft-ic{translate:0 -3px}
.ft-ic img{width:56px;height:56px;border-radius:16px}
.ft-two img{width:48px;height:48px;border-radius:14px;box-shadow:0 8px 16px -10px rgba(20,40,30,.5)}
.ft-w{display:grid;place-items:center;width:48px;height:48px;border-radius:14px;background:#fff;box-shadow:0 8px 16px -10px rgba(20,40,30,.5)}
.ft-two .ft-w img{width:34px;height:34px;border-radius:0;box-shadow:none}
.ft-two .ft-w:nth-child(2){margin-left:-14px}
.ft-three>:not(:first-child){margin-left:-14px}
.ft-ar{width:20px;height:20px;color:#2f4f99}
.ft-hz{width:56px;height:56px;justify-content:center;border-radius:16px;background:#fff;color:var(--p600);box-shadow:0 8px 16px -10px rgba(20,40,30,.5)}
.ft-hz svg{width:36px;height:36px}
.ft-hz svg path:nth-child(2){transform-origin:24px 32px;animation:needle 2.4s var(--ease-io) infinite alternate}
@keyframes needle{from{rotate:-70deg}to{rotate:10deg}}
.feat-grid .feat{min-height:230px}
.feat b{position:relative;font-size:21px;font-weight:800;letter-spacing:-.01em;margin-top:auto;text-wrap:balance}
.feat>span:last-child{position:relative;margin-top:6px;font-size:15px;line-height:1.6}
.f-g{background:var(--g100);color:var(--g900)}.f-g .fs{fill:var(--g200)}.f-g span{color:var(--g800)}
.f-l{background:var(--l100);color:#2f2575}.f-l .fs{fill:var(--l200)}.f-l span{color:#4d4399}
.f-p{background:var(--p100);color:#6a2d0c}.f-p .fs{fill:var(--p200)}.f-p span{color:#8a4a24}
.f-b{background:#e4ecff;color:#0f2d73}.f-b .fs{fill:#cfdcff}.f-b span{color:#2f4f99}

.ft{position:relative;display:flex;flex-direction:column;align-items:center}
.ft-r,.mo-r,.hz-r{position:absolute;opacity:0;pointer-events:none}
.seg2,.seg3{position:relative;display:inline-grid;grid-auto-flow:column;grid-auto-columns:1fr;padding:4px;border-radius:999px;background:#eef2ec;isolation:isolate}
.seg2 label,.seg3 label{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;height:40px;padding:0 18px;border-radius:999px;font-size:14.5px;font-weight:700;color:var(--ink2);cursor:pointer;white-space:nowrap;transition:color .3s}
.seg2-thumb,.seg3-thumb{position:absolute;z-index:0;top:4px;bottom:4px;left:4px;border-radius:999px;background:#fff;box-shadow:0 4px 12px -6px rgba(20,40,30,.4),0 0 0 1px rgba(20,40,30,.05);transition:translate .375s var(--spring)}
.seg2-thumb{width:calc(50% - 4px)}
.seg3-thumb{width:calc(33.333% - 2.667px)}
.ft:has(.ft-in:checked) .seg2 label[for$="in"],.ft:has(.ft-out:checked) .seg2 label[for$="out"]{color:var(--ink)}
.ft:has(.ft-out:checked) .seg2-thumb{translate:100% 0}
.ft:has(.ft-r:focus-visible) .seg2,.bx:has(input:focus-visible) .seg3,.bx:has(.hz-r:focus-visible) .hz-pick{outline:3px solid var(--blue);outline-offset:3px}
.ft-stage{position:relative;width:100%;max-width:980px;margin-top:40px;display:grid;grid-template-columns:minmax(0,25%) minmax(0,1fr) minmax(0,25%);align-items:center;container-type:inline-size}
.ft-dev{margin:0;display:flex;flex-direction:column;align-items:center;gap:14px}
.ft-dev figcaption{height:32px;padding:0 14px;border-radius:999px;background:var(--bg);display:inline-flex;align-items:center;font-size:14px;font-weight:700;color:var(--ink2);transition:background .3s,color .3s}
.ft-dev .dev{transition:scale .3s var(--ease)}
.ft-dev.ping .dev{animation:ping .413s var(--spring)}
@keyframes ping{0%{scale:1}35%{scale:1.035}100%{scale:1}}
.ft:has(.ft-in:checked) .ft-vm figcaption,.ft:has(.ft-out:checked) .ft-host figcaption{background:var(--l100);color:var(--l600)}
.ft-lane{position:relative;align-self:stretch;container-type:inline-size;margin:0 -2cqi}
.ft-arc{position:absolute;left:5%;right:5%;top:30%;width:90%;height:20%;overflow:visible}
.ft-arc path{fill:none;stroke:rgba(114,98,224,.4);stroke-width:2;stroke-dasharray:1.4 2.6;vector-effect:non-scaling-stroke;animation:flow .9s linear infinite}
.ft:has(.ft-out:checked) .ft-arc path{animation-direction:reverse}
@keyframes flow{to{stroke-dashoffset:-8}}
.tok{position:absolute;left:5%;top:50%;width:clamp(34px,13cqi,58px);aspect-ratio:1;margin-top:clamp(-29px,-6.5cqi,-17px);opacity:0;animation:tokX 1.8s var(--ease-io) calc(var(--n) * .36s) infinite;animation-play-state:paused}
.tok-y{display:block;width:100%;height:100%;animation:tokY 1.8s linear calc(var(--n) * .36s) infinite;animation-play-state:paused}
.tok-y i{display:grid;place-items:center;width:100%;height:100%;border-radius:28%;font-style:normal;font-size:clamp(9px,3.4cqi,14px);font-weight:900;letter-spacing:.02em;color:#fff;box-shadow:0 12px 20px -10px rgba(20,30,40,.5),inset 0 -3px 0 rgba(0,0,0,.12)}
.t-jpg{background:#2bb3c9}.t-pdf{background:#e5484d}.t-apk{background:#2bb673}.t-mp4{background:#7a5cf0}.t-zip{background:#f08a24}
@keyframes tokX{0%{translate:0 0;opacity:0}8%{opacity:1}88%{opacity:1}100%{translate:calc(90cqi - 100%) 0;opacity:0}}
@keyframes tokY{0%{translate:0 0;scale:.6;rotate:-10deg;animation-timing-function:cubic-bezier(.2,.7,.4,1)}50%{translate:0 -24cqi;scale:1.12;rotate:0deg;animation-timing-function:cubic-bezier(.6,0,.8,.3)}100%{translate:0 0;scale:.55;rotate:10deg}}
.ft:has(.ft-out:checked) .tok,.ft:has(.ft-out:checked) .tok-y{animation-direction:reverse}
#files.play .tok,#files.play .tok-y{animation-play-state:running}
.ft-count{margin:30px 0 0;display:inline-flex;align-items:center;gap:10px;font-size:15px;font-weight:600;color:var(--ink2)}
.ft-count b{display:inline-block;min-width:2ch;font-size:22px;color:var(--ink);font-variant-numeric:tabular-nums}

.acc{position:relative;display:flex;justify-content:center;align-items:flex-start;gap:clamp(14px,3vw,48px);padding-top:20px}
.acc-dev{position:relative;margin:0;width:clamp(150px,21vw,270px);display:flex;flex-direction:column;align-items:center;gap:16px;container-type:inline-size;transition:filter .338s var(--ease),scale .375s var(--ease),transform .375s var(--ease)}
.acc-dev:nth-child(2){margin-top:44px}
.acc:has(.acc-dev:hover) .acc-dev:not(:hover){filter:opacity(.5) saturate(.7);scale:.96}
.acc .acc-dev:hover{transform:translateY(-10px)}
.acc-pill{display:inline-flex;align-items:center;gap:8px;height:34px;padding:0 14px;border-radius:999px;background:#fff;box-shadow:0 0 0 1px var(--line),0 8px 18px -12px rgba(20,40,30,.4);font-size:14px;font-weight:700;color:var(--c);white-space:nowrap}
.acc-pill i{position:relative;width:8px;height:8px;border-radius:50%;background:#14b06b}
.acc-pill i::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:2px solid #14b06b;opacity:0;animation:live 1.8s var(--ease-out) infinite}
@keyframes live{0%{opacity:.8;scale:.5}100%{opacity:0;scale:1.6}}
.toast{position:absolute;left:7%;right:7%;top:6.4%;z-index:3;display:flex;flex-direction:column;gap:1px;padding:3.6cqi 4.6cqi 3.6cqi 15cqi;border-radius:6cqi;background:rgba(255,255,255,.96);box-shadow:0 14px 26px -12px rgba(20,30,40,.45),0 0 0 1px rgba(20,30,40,.05);font-size:4.6cqi;line-height:1.35;color:var(--ink2);opacity:0;translate:0 -40%;pointer-events:none}
.toast::before{content:"";position:absolute;left:4.2cqi;top:50%;width:7.6cqi;aspect-ratio:1;margin-top:-3.8cqi;border-radius:30%;background:#22b35e url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20 12a7.5 7.5 0 0 1-7.5 7.5H8l-3.5 2.5v-4A7.5 7.5 0 1 1 20 12Z' fill='%23fff'/%3E%3C/svg%3E") center/62% no-repeat}
.toast b{font-size:4.9cqi;color:var(--ink)}
.play .toast{animation:toast 2.7s var(--ease) calc(var(--t) * 1.35s + .15s) infinite}
@keyframes toast{0%{opacity:0;translate:0 -40%;scale:.94}5%{opacity:1;translate:0 0;scale:1}38%{opacity:1;translate:0 0;scale:1}44%{opacity:0;translate:0 -30%;scale:.96}100%{opacity:0;translate:0 -30%}}

.plug{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,560px);gap:72px;align-items:center}
.steps{list-style:none;margin:36px 0 0;padding:0;display:grid;gap:14px}
.steps li{display:flex;gap:14px;align-items:center}
.steps i{flex:0 0 auto;width:40px;height:40px;border-radius:14px;display:grid;place-items:center;font-style:normal;font-weight:800;background:var(--l100);color:var(--l600)}
.steps span{display:flex;flex-direction:column;font-size:14.5px;color:var(--ink2)}
.steps b{font-size:16.5px;color:var(--ink)}
.plist{background:var(--bg);border-radius:32px;padding:14px;box-shadow:0 0 0 1px var(--line)}
.plist-hd{display:flex;justify-content:space-between;align-items:baseline;padding:10px 14px 14px}
.plist-hd b{font-size:20px}
.plist-hd span{font-size:13.5px;color:var(--ink3)}
.prow{position:relative;overflow:hidden;display:flex;align-items:center;gap:16px;padding:18px 16px;border-radius:24px;background:#fff;cursor:pointer;transition:box-shadow .3s,translate .3s var(--ease)}
.prow:hover{box-shadow:0 14px 26px -20px rgba(20,40,30,.5);translate:0 -2px}
.prow+.prow{margin-top:8px}
.plogo{position:relative;flex:0 0 auto;width:52px;height:52px;border-radius:15px;display:grid;place-items:center}
.plogo img{width:100%;height:100%;border-radius:15px}
.plogo-w{background:#fff;box-shadow:inset 0 0 0 1px rgba(20,40,30,.12)}
.plogo-w img{width:44px;height:44px;border-radius:0}
.plogo::after{content:"";position:absolute;inset:-2px;border-radius:18px;border:2px solid var(--g600);opacity:0;pointer-events:none}
.pt{flex:1;display:flex;flex-direction:column;min-width:0}
.pt b{font-size:17.5px}
.pt small{font-size:13.5px;color:var(--ink2)}
.pst{display:grid;align-items:center;justify-items:start;height:24px;margin-top:8px}
.pst>*{grid-area:1/1}
.pt .sys{font-style:normal;font-size:12px;font-weight:700;color:var(--g800);background:var(--g100);border-radius:999px;padding:3px 10px;transition:opacity .2s,translate .3s var(--ease)}
.st-run,.st-on{font-size:12.5px;font-weight:700;opacity:0;translate:-6px 0}
.st-run{color:var(--l600)}
.st-on{color:var(--g600)}
.st-on::before{content:"✓ "}
.sw{position:absolute;opacity:0;pointer-events:none}
.swv{flex:0 0 auto;position:relative;width:52px;height:32px;border-radius:999px;background:#e3e7e0;box-shadow:inset 0 0 0 2px #7b8578;transition:background .25s,box-shadow .25s}
.swv::after{content:"";position:absolute;left:8px;top:8px;width:16px;height:16px;border-radius:50%;background:#7b8578;transition:translate .35s var(--spring),width .3s,height .3s,background .25s,top .3s,left .3s}
.prow:active .swv::after{width:28px;height:28px;top:2px;left:2px}
.sw:checked+.swv{background:var(--g600);box-shadow:none}
.sw:checked+.swv::after{left:24px;top:4px;width:24px;height:24px;background:#fff center/14px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5' fill='none' stroke='%233c8a4f' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.sw:focus-visible+.swv{outline:3px solid var(--blue);outline-offset:3px}
.pbar{position:absolute;left:0;bottom:0;height:3px;width:100%;background:linear-gradient(90deg,var(--l600),var(--g600));transform-origin:0 50%;transform:scaleX(0);opacity:0}
.prow:has(.sw:checked) .pst .sys{opacity:0;translate:6px 0}
.prow:has(.sw:checked) .st-run{animation:stRun .562s var(--ease) both}
.prow:has(.sw:checked) .st-on{animation:stOn .225s var(--spring) .525s both}
.prow:has(.sw:checked) .pbar{animation:pfill .562s var(--ease-io) both}
.prow:has(.sw:checked) .plogo::after{animation:burst .45s var(--ease-out) .525s both}
@keyframes stRun{0%{opacity:0;translate:-6px 0}12%,85%{opacity:1;translate:0 0}100%{opacity:0;translate:6px 0}}
@keyframes stOn{from{opacity:0;translate:-6px 0}to{opacity:1;translate:0 0}}
@keyframes pfill{0%{transform:scaleX(0);opacity:1}92%{transform:scaleX(1);opacity:1}100%{transform:scaleX(1);opacity:0}}
@keyframes burst{0%{opacity:.9;scale:.9}100%{opacity:0;scale:1.35;visibility:hidden}}
.plist-ft{margin:14px 14px 6px;font-size:13.5px;color:var(--ink3)}

.bento{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:20px}
.bx{position:relative;overflow:hidden;border-radius:32px;background:#fff;box-shadow:0 0 0 1px var(--line);padding:28px 30px 30px;display:flex;flex-direction:column}
.bx-hd{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.bx h3{margin:0;font-size:22px;font-weight:800;letter-spacing:-.01em}
.mo-stage{position:relative;height:440px;margin-top:22px;display:grid;place-items:center;container-type:size;--dw:38cqh;--dh:84cqh;--rad:6.2cqh;--rim:.9cqh;--bz:1.1cqh}
.bx-morph:has(#mo-tab:checked) .mo-stage{--dw:min(94cqw,128cqh);--dh:calc(min(94cqw,128cqh) * .62);--rad:3.4cqh;--bz:2.4cqh}
.bx-morph:has(#mo-fold:checked) .mo-stage{--dw:78cqh;--dh:76cqh;--rad:3.6cqh;--bz:1.2cqh}
.mo-dev{position:relative;z-index:1;width:var(--dw);height:var(--dh);border-radius:var(--rad);padding:var(--rim);background:linear-gradient(140deg,#f2efeb,#cbc6c0 32%,#f6f3ef 52%,#b9b3ac 78%,#e7e3de);box-shadow:inset 0 0 0 1px rgba(0,0,0,.1);transition:width .45s var(--ease-io),height .45s var(--ease-io),border-radius .45s var(--ease-io)}
.mo-bz{width:100%;height:100%;padding:var(--bz);border-radius:calc(var(--rad) - var(--rim));background:#07080a;transition:padding .45s var(--ease-io),border-radius .45s var(--ease-io)}
.mo-scr{position:relative;width:100%;height:100%;overflow:hidden;border-radius:calc(var(--rad) - var(--rim) - var(--bz));background:#000;transition:border-radius .45s var(--ease-io)}
.mo-scr img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;scale:1.08;filter:blur(6px);transition:opacity .262s var(--ease),scale .45s var(--ease-out),filter .262s}
.bx-morph:has(#mo-phone:checked) .m-phone,.bx-morph:has(#mo-tab:checked) .m-tab,.bx-morph:has(#mo-fold:checked) .m-fold{opacity:1;scale:1;filter:blur(0);transition-delay:.135s}
.mo-hinge{position:absolute;left:50%;top:0;bottom:0;width:7%;translate:-50% 0;background:linear-gradient(90deg,transparent,rgba(0,0,0,.08) 45%,rgba(255,255,255,.18) 50%,rgba(0,0,0,.08) 55%,transparent);opacity:0;transition:opacity .4s}
.bx-morph:has(#mo-fold:checked) .mo-hinge{opacity:1;transition-delay:.45s}
.mo-shadow{position:absolute;left:50%;bottom:2cqh;width:calc(var(--dw) * .9);height:5cqh;translate:-50% 0;border-radius:50%;background:radial-gradient(closest-side,rgba(20,40,30,.28),transparent);transition:width .45s var(--ease-io)}
.bx-morph:has(#mo-phone:checked) label[for="mo-phone"],.bx-morph:has(#mo-tab:checked) label[for="mo-tab"],.bx-morph:has(#mo-fold:checked) label[for="mo-fold"]{color:var(--ink)}
.bx-morph:has(#mo-tab:checked) .seg3-thumb{translate:100% 0}
.bx-morph:has(#mo-fold:checked) .seg3-thumb{translate:200% 0}
.mo-cap{position:relative;height:22px;margin:16px 0 0;text-align:center;font-size:14.5px;font-weight:600;color:var(--ink2)}
.mo-cap span{position:absolute;inset:0;opacity:0;translate:0 8px;transition:opacity .262s,translate .338s var(--ease-out)}
.bx-morph:has(#mo-phone:checked) .c-phone,.bx-morph:has(#mo-tab:checked) .c-tab,.bx-morph:has(#mo-fold:checked) .c-fold{opacity:1;translate:0 0;transition-delay:.188s}

.bx-hz{background:linear-gradient(160deg,#fff,#f7f5ff)}
.hz-stage{position:relative;flex:1;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:6px;margin:30px 0 24px}
.dial{--hz:60;position:relative;justify-self:center;width:min(100%,190px);aspect-ratio:1;display:flex;flex-direction:column;align-items:center;justify-content:center;transition:--hz .413s var(--ease)}
.d-vm{transition-delay:.24s}
.bx-hz:has(#hz90:checked) .dial{--hz:90}
.bx-hz:has(#hz120:checked) .dial{--hz:120}
.dial svg{position:absolute;inset:0;width:100%;height:100%;rotate:-90deg}
.dial circle{fill:none;stroke-width:8;stroke-linecap:round}
.d-bg{stroke:#ece9f7}
.d-fg{stroke:var(--l600);stroke-dasharray:100 100;stroke-dashoffset:calc(100 - var(--hz) * 100 / 120)}
.d-host .d-fg{stroke:var(--g600)}
.d-val{counter-reset:hz var(--hz);font-size:46px;font-weight:900;line-height:1;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.d-val::before{content:counter(hz)}
.d-val::after{content:" Hz";font-size:16px;font-weight:700;letter-spacing:0;color:var(--ink3)}
.dial span{margin-top:6px;font-size:13.5px;font-weight:700;color:var(--ink2)}
.dial::after{content:"";position:absolute;inset:4%;border-radius:50%;border:2px solid var(--l600);opacity:0;pointer-events:none}
.bx-hz:has(#hz60:checked) .d-vm::after{animation:dpA .45s var(--ease-out) .262s}
.bx-hz:has(#hz90:checked) .d-vm::after{animation:dpB .45s var(--ease-out) .262s}
.bx-hz:has(#hz120:checked) .d-vm::after{animation:dpC .45s var(--ease-out) .262s}
@keyframes dpA{0%{opacity:.8;scale:.9}100%{opacity:0;scale:1.25}}
@keyframes dpB{0%{opacity:.8;scale:.9}100%{opacity:0;scale:1.25}}
@keyframes dpC{0%{opacity:.8;scale:.9}100%{opacity:0;scale:1.25}}
.hz-link{position:relative;width:clamp(40px,7vw,90px);height:2px;background:repeating-linear-gradient(90deg,rgba(114,98,224,.4) 0 6px,transparent 6px 11px)}
.hz-dot{position:absolute;left:0;top:50%;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:var(--l600);box-shadow:0 0 0 5px rgba(114,98,224,.18),0 0 18px 4px rgba(114,98,224,.45);opacity:0}
.bx-hz:has(#hz60:checked) .hz-dot{animation:hdA .38s var(--ease-io)}
.bx-hz:has(#hz90:checked) .hz-dot{animation:hdB .38s var(--ease-io)}
.bx-hz:has(#hz120:checked) .hz-dot{animation:hdC .38s var(--ease-io)}
@keyframes hdA{0%{left:0;opacity:0}15%,85%{opacity:1}100%{left:100%;opacity:0}}
@keyframes hdB{0%{left:0;opacity:0}15%,85%{opacity:1}100%{left:100%;opacity:0}}
@keyframes hdC{0%{left:0;opacity:0}15%,85%{opacity:1}100%{left:100%;opacity:0}}
.hz-pick{display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;border-radius:999px}
.hz-pick span{font-size:13.5px;font-weight:700;color:var(--ink3);margin-right:4px}
.hz-pick label{height:38px;padding:0 16px;border-radius:999px;display:inline-flex;align-items:center;font-size:14.5px;font-weight:700;color:var(--ink2);background:#fff;box-shadow:0 0 0 1px var(--line);cursor:pointer;transition:background .25s,color .25s,box-shadow .25s,scale .15s var(--ease)}
.hz-pick label:active{scale:.94}
.bx-hz:has(#hz60:checked) label[for="hz60"],.bx-hz:has(#hz90:checked) label[for="hz90"],.bx-hz:has(#hz120:checked) label[for="hz120"]{background:var(--g600);color:#fff;box-shadow:0 8px 16px -10px rgba(60,138,79,.9)}
.hz-cap{margin:16px 0 0;text-align:center;font-size:15px;font-weight:600;color:var(--ink2)}

.fl{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:72px;align-items:center}
.fl-pts{list-style:none;margin:30px 0 0;padding:0;display:grid;gap:12px;font-size:16px;font-weight:600;color:var(--ink)}
.fl-pts li{display:flex;align-items:center;gap:10px}
.fl-stage{display:flex;flex-direction:column;align-items:center;gap:22px}
.fl-dev{width:clamp(220px,25vw,310px)}
.fl-area{position:absolute;left:3.3%;top:1.45%;width:92.4%;height:97.1%;border-radius:9.4%/4.3%;overflow:hidden;z-index:3;container-type:inline-size}
.fl-win{position:absolute;left:0;top:0;width:66%;transform-origin:0 0;padding:1.3cqi;border-radius:4.4cqi;background:#111418;box-shadow:0 22px 36px -14px rgba(0,0,0,.6),0 0 0 1px rgba(255,255,255,.08);translate:var(--fx,31cqi) var(--fy,150cqi);cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none;transition:translate .45s cubic-bezier(.34,1.3,.64,1),box-shadow .225s,scale .225s var(--ease)}
.fl-game{position:relative;aspect-ratio:19.5/9;overflow:hidden;border-radius:3.3cqi;background:#83d3fd;container-type:inline-size;pointer-events:none}
.fl-game img{position:absolute;display:block;pointer-events:none}
.fg-bg{inset:-2% -3%;width:106%;height:104%;object-fit:cover;animation:fgDrift 14s ease-in-out infinite alternate}
.fl-game>:is(.fg-hero,.fg-sa,.fg-sb){position:absolute;display:block}
.fl-game>span>img{position:relative;width:100%;height:auto}
.fg-hero{left:15%;top:15%;width:26%}
.fg-hero img{transform-origin:40% 85%;animation:fgLunge 2.4s var(--ease-io) infinite}
.fg-sa{left:47%;top:35%;width:15%}
.fg-sa img{transform-origin:50% 85%;animation:fgHit 2.4s ease-out infinite}
.fg-sb{left:63.5%;top:35.4%;width:15%}
.fg-sb img{transform-origin:50% 85%;animation:fgBob 1.2s ease-in-out infinite}
.fg-hp{position:absolute;left:24%;top:10%;width:52%;height:2.2cqi;border-radius:2cqi;background:rgba(20,40,60,.25);overflow:hidden;box-shadow:0 0 0 .35cqi rgba(255,255,255,.75)}
.fg-hero .fg-hp{left:26%;top:6%;width:40%}
.fg-hp::before,.fg-hp b{content:"";position:absolute;inset:0;border-radius:inherit;background:#ff6b6b}
.fg-hero .fg-hp::before{background:#5ad27a}
.fg-sa .fg-hp::before{display:none}
.fg-hp b{animation:fgHp 2.4s steps(1,end) infinite}
.fg-slash{position:absolute;left:37%;top:20%;width:15%;aspect-ratio:1;border-radius:50%;border-top:1.4cqi solid rgba(255,255,255,.95);border-right:.6cqi solid rgba(255,255,255,.5);opacity:0;animation:fgSlash 2.4s ease-out infinite}
.fg-dmg{position:absolute;left:51%;top:19%;font-size:5cqi;font-weight:900;color:#fff;letter-spacing:-.02em;font-variant-numeric:tabular-nums;text-shadow:0 .4cqi 0 #e0566a,0 0 1cqi rgba(160,40,60,.45);opacity:0}
.fg-d1{animation:fgDmg 2.4s ease-out infinite}
.fg-d2{left:56%;top:23%;font-size:4.2cqi;animation:fgDmg 2.4s ease-out 1.2s infinite}
.fg-lv{position:absolute;left:30%;right:30%;top:5%;display:flex;align-items:center;justify-content:space-between;height:2.4cqi}
.fg-lv::before{content:"";position:absolute;left:0;right:6cqi;top:50%;height:.4cqi;margin-top:-.2cqi;background:rgba(255,255,255,.8)}
.fg-lv i{position:relative;width:1.8cqi;height:1.8cqi;border-radius:50%;background:#fff;box-shadow:0 0 0 .35cqi rgba(255,255,255,.6)}
.fg-lv i:nth-child(-n+2){background:#5ad27a}
.fg-lv b{position:relative;font-size:3.6cqi;font-weight:800;color:#fff;text-shadow:0 .2cqi .6cqi rgba(30,70,110,.4)}
.fg-coin{position:absolute;right:3%;top:4%;display:flex;align-items:center;gap:1cqi;font-size:3.6cqi;font-weight:800;color:#fff;text-shadow:0 .2cqi .6cqi rgba(30,70,110,.45)}
.fg-coin i{width:3.4cqi;height:3.4cqi;border-radius:50%;background:#ffcb3d;box-shadow:inset 0 0 0 .6cqi #f5a524}
.fg-coin b{font-variant-numeric:tabular-nums}
.fg-coin.pop b{animation:pop .45s var(--spring)}
.fg-sk{position:absolute;left:50%;bottom:5%;translate:-50% 0;display:flex;align-items:center;gap:2.2cqi}
.fg-sk i{width:7cqi;height:7cqi;border-radius:50%;border:.45cqi solid rgba(255,255,255,.9);background:rgba(255,255,255,.18)}
.fg-sk i:nth-child(1){animation:fgSkill 2.4s ease-out infinite}
.fg-sk em{width:4.4cqi;height:4.4cqi;margin-left:1cqi;border-radius:50%;border:.45cqi solid rgba(255,255,255,.9);border-left-color:transparent;animation:spin 2.4s linear infinite}
.fl-game *{animation-play-state:paused}
.play .fl-game *{animation-play-state:running}
@keyframes fgDrift{to{translate:-2% 0}}
@keyframes fgLunge{0%,4%,24%,54%,74%,100%{translate:0 0;rotate:0deg}12%,62%{translate:18% -3%;rotate:5deg}}
@keyframes fgHit{0%,11%,26%,61%,76%,100%{translate:0 0;scale:1 1;filter:none}14%,64%{translate:12% 0;scale:1.1 .84;filter:brightness(1.9)}19%,69%{translate:4% 0;scale:.96 1.06;filter:none}}
@keyframes fgBob{0%,100%{scale:1 1}50%{scale:1.05 .93}}
@keyframes fgHp{0%{inset:0 0 0 0}14%{inset:0 30% 0 0}64%{inset:0 65% 0 0}96%{inset:0 100% 0 0}}
@keyframes fgSlash{0%,10%,50%,60%{opacity:0;rotate:-60deg;scale:.6}13%,63%{opacity:1;rotate:-10deg;scale:1}22%,72%{opacity:0;rotate:30deg;scale:1.15}}
@keyframes fgDmg{0%,12%{opacity:0;translate:0 30%;scale:.5}16%{opacity:1;translate:0 0;scale:1.25}22%{scale:1}40%{opacity:1;translate:0 -70%}48%,100%{opacity:0;translate:0 -100%}}
@keyframes fgSkill{0%,10%,30%,100%{background:rgba(255,255,255,.18)}13%{background:rgba(255,255,255,.75)}}
.fl-grip{position:absolute;left:50%;top:-.2cqi;width:13cqi;height:1.2cqi;translate:-50% 0;border-radius:2cqi;background:rgba(255,255,255,.55)}
.fl-win.drag{cursor:grabbing;transition:box-shadow .3s,scale .3s var(--ease);scale:1.04;box-shadow:0 30px 50px -16px rgba(0,0,0,.65),0 0 0 2px rgba(255,255,255,.5)}
.fl-win:focus-visible{outline:3px solid var(--blue);outline-offset:3px}
.seen .fl-win{animation:flIntro .6s var(--ease-io) .075s both}
@keyframes flIntro{0%,30%{transform:translate(calc(-1 * var(--fx,31cqi)),calc(70cqi - var(--fy,150cqi))) scale(1.515)}100%{transform:translate(0,0) scale(1)}}
.fl-hint{margin:0;display:inline-flex;align-items:center;gap:8px;font-size:14.5px;font-weight:700;color:var(--l600)}
.fl-hint svg{width:22px;height:22px;animation:nudge 1.6s var(--ease-io) infinite}
@keyframes nudge{0%,100%{translate:0 0}50%{translate:6px -4px}}
.touched .fl-hint{opacity:0;transition:opacity .4s}

.scene-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.scene{position:relative;overflow:hidden;border-radius:32px;padding:28px 26px 0;display:flex;flex-direction:column;height:560px;transition:transform .338s var(--ease),box-shadow .338s}
.scene:hover{transform:translateY(-6px);box-shadow:0 30px 50px -34px rgba(20,40,30,.45)}
.sc-tx h3{margin:0 0 8px;font-size:22px;font-weight:800;letter-spacing:-.01em}
.sc-tx p{margin:0;font-size:14.5px;line-height:1.7}
.sc-g{background:var(--g100)}.sc-g p{color:var(--g800)}
.sc-l{background:var(--l100)}.sc-l p{color:#4d4399}
.sc-p{background:var(--p100)}.sc-p p{color:#8a4a24}
.sc-b{background:#e4ecff}.sc-b p{color:#2f4f99}
.sc-ph{position:relative;display:flex;justify-content:center;padding-top:24px;flex:1}
.sc-ph .dev{width:78%;max-width:240px;transition:translate .45s var(--ease)}
.scene:hover .sc-ph .dev{translate:0 -16px}
.sc-tag{position:absolute;left:50%;top:44%;translate:-50% 0;display:inline-flex;align-items:center;gap:6px;white-space:nowrap;height:34px;padding:0 14px;border-radius:999px;background:rgba(255,255,255,.95);font-size:13px;font-weight:700;color:var(--ink);box-shadow:0 10px 24px -14px rgba(20,40,30,.5);z-index:3;transition:scale .3s var(--spring),translate .45s var(--ease)}
.sc-tag b{font-variant-numeric:tabular-nums;font-weight:800}
.scene:hover .sc-tag{scale:1.08;translate:-50% -16px}
.live{position:relative;width:7px;height:7px;border-radius:50%;background:#14b06b}
.live::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:2px solid #14b06b;opacity:0;animation:live 1.8s var(--ease-out) infinite}

.promise{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.pm{padding:34px 30px;border-radius:32px;background:var(--bg);box-shadow:0 0 0 1px var(--line);transition:transform .4s var(--ease)}
.pm:hover{transform:translateY(-5px)}
.pm-s{width:56px;height:56px;transition:rotate .9s var(--ease)}
.pm:hover .pm-s{rotate:90deg}
.pm-g{fill:var(--g300)}.pm-l{fill:var(--l200)}.pm-p{fill:var(--p200)}
.pm h3{margin:22px 0 8px;font-size:22px;font-weight:800}
.pm p{margin:0;font-size:15px;line-height:1.7;color:var(--ink2)}

.get{position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:56px;align-items:center;padding:64px;border-radius:40px;background:linear-gradient(135deg,#e6f5dc,#f3faee 55%,#eef4ff)}
.get-s1{position:absolute;right:250px;bottom:-150px;width:340px;height:340px;fill:rgba(173,223,147,.35);animation:spin 80s linear infinite}
.get-s2{position:absolute;left:44%;top:-110px;width:220px;height:220px;fill:rgba(220,213,255,.55);animation:spin 60s linear infinite reverse}
.get-l{position:relative}
.get h2{margin:18px 0 14px;font-size:50px;line-height:1.12;font-weight:800;letter-spacing:-.03em}
.get-l>p{margin:0;max-width:560px;font-size:17.5px;line-height:1.75;color:var(--g800)}
.get-tiles{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;margin-top:34px;max-width:303px}
.get-tiles .dlq{display:flex}
.get-tiles .dlt{min-height:84px;border-radius:24px}
.get .tip{margin:22px 0 0;font-size:13.5px;color:var(--g800);opacity:.85}
.get-qq{position:relative;display:flex;flex-direction:column;align-items:center;gap:12px;padding:22px 22px 18px;border-radius:30px;background:#fff;text-decoration:none;color:var(--ink);box-shadow:0 30px 60px -36px rgba(20,40,30,.5),0 0 0 1px var(--line);transition:translate .35s var(--ease)}
.get-qq:hover{translate:0 -4px}
.get-qq .qq-hd img{width:44px;height:44px}
.get-qq .qq-hd b{font-size:17px}
.get-qq .qq-hd em{font-size:14px}
.get-qq .qq-qr{width:200px;height:200px}
.get-qq .qq-go{font-size:14px}
.assist-tool{margin-top:20px;padding:44px;border-radius:40px;background:linear-gradient(150deg,#fff,#f2f8fd);box-shadow:0 0 0 1px var(--line)}
.at-hd{max-width:760px}
.at-hd h3{margin:16px 0 10px;font-size:32px;line-height:1.18;font-weight:800;letter-spacing:-.02em}
.at-hd p{margin:0;font-size:16px;line-height:1.75;color:var(--ink2)}
.at-cards{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.9fr);gap:18px;margin-top:28px}
.at-card{display:flex;flex-direction:column;padding:22px;border-radius:28px;background:#fff;box-shadow:0 24px 48px -40px rgba(30,70,110,.45),0 0 0 1px var(--line)}
.at-ct{display:flex;flex-direction:column;gap:6px}
.at-ct b{display:flex;align-items:center;gap:8px;font-size:16px}
.at-ct b svg{flex:0 0 auto;width:20px;height:20px}
.at-c-ph .at-ct b svg{color:var(--g600)}
.at-c-pc .at-ct b svg{color:var(--p600)}
.at-ct small{font-size:13.5px;line-height:1.6;color:var(--ink2)}
.at-ph{width:min(100%,226px);margin:auto;padding-top:18px}
.at-app{container-type:inline-size;margin-top:18px}
.at-foot{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin-top:16px}
.at-c-pc .lk{margin-left:auto}
.dev .bgw{overflow:hidden;background:#fff}
.bgx{position:absolute;left:0;top:0;width:358px;height:802px;transform-origin:0 0;display:flex;flex-direction:column;background:#f4f6fb;color:#10182b;font-size:14px;line-height:1.4;font-family:var(--sans);text-align:left;-webkit-user-select:none;user-select:none}
.bgx-sb{display:flex;justify-content:space-between;align-items:center;flex:0 0 auto;padding:12px 22px 0;background:#3d6bff;color:#fff;font-size:12.5px;font-weight:600}
.bgx-g2{display:flex;align-items:center;gap:6px}
.bgx-sig{display:flex;align-items:flex-end;gap:1.5px;height:10px}
.bgx-sig i{width:3px;border-radius:1px;background:#fff}
.bgx-sig i:nth-child(1){height:4px}.bgx-sig i:nth-child(2){height:6px}.bgx-sig i:nth-child(3){height:8px}.bgx-sig i:nth-child(4){height:10px}
.bgx-bat{display:block;width:21px;height:11px;padding:1.5px;border:1px solid #fff;border-radius:3px}
.bgx-bat i{display:block;width:70%;height:100%;border-radius:1px;background:#fff}
.bgx-tb{display:flex;align-items:center;gap:12px;flex:0 0 auto;padding:12px 16px 12px;background:#3d6bff;color:#fff}
.bgx-tb b{font-size:16.5px;font-weight:700}
.bgx-bk{width:20px;height:20px;rotate:180deg;color:rgba(255,255,255,.9)}
.bgx-sc{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:none}
.bgx-sc::-webkit-scrollbar{display:none}
.bgx-tabs{display:flex;gap:4px;padding:3px;background:#e9edf5}
.bgx-tabs span{flex:1;display:grid;place-items:center;height:30px;border-radius:7px;font-size:12px;font-weight:600;color:#78808f;white-space:nowrap;cursor:pointer;transition:background .2s,color .2s}
.bgx[data-tab="8"] .bgx-tabs span[data-t="8"],.bgx[data-tab="11"] .bgx-tabs span[data-t="11"],.bgx[data-tab="14"] .bgx-tabs span[data-t="14"],.bgx[data-tab="o"] .bgx-tabs span[data-t="o"]{background:#fff;color:#10182b}
.bgx-band{margin-top:10px;background:#fff;border-top:1px solid #e3e7ef;border-bottom:1px solid #e3e7ef}
.bgx-st{position:relative;border-bottom:1px solid #edf0f5}
.bgx-st:last-child{border-bottom:0}
.bgx-st.open::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:#3d6bff;z-index:1}
.bgx-row{display:flex;align-items:flex-start;gap:12px;padding:13px 16px;cursor:pointer}
.bgx-no{flex:0 0 auto;display:grid;place-items:center;width:24px;height:24px;margin-top:1px;border-radius:50%;background:#3d6bff;color:#fff;font-size:12px;font-weight:700;transition:background .25s}
.bgx-bd{flex:1;min-width:0;display:flex;flex-direction:column;padding-top:1px}
.bgx-bd b{font-size:14.5px;font-weight:600;line-height:1.35}
.bgx-bd small{display:none;margin-top:2px;font-size:11.5px;line-height:1.5;color:#768297}
.bgx-st:not(:first-child) .bgx-bd small,.bgx[data-tab="8"] .bgx-bd .t8,.bgx[data-tab="11"] .bgx-bd .t11,.bgx[data-tab="14"] .bgx-bd .t14,.bgx[data-tab="o"] .bgx-bd .to{display:block}
.bgx-chip{flex:0 0 auto;font-size:11px;font-weight:700}
.bgx-chip s,.bgx-chip u{text-decoration:none;padding:4px 9px;border-radius:7px}
.bgx-chip s{display:inline-block;background:#e9edf5;color:#78808f}
.bgx-chip u{display:none;background:#e2f4e7;color:#1f7a45}
.bgx-chev{flex:0 0 auto;width:16px;height:16px;margin-top:4px;color:#c3c9d4;transition:rotate .25s}
.bgx-st.open .bgx-chev{rotate:90deg}
.bgx-st.ok .bgx-no{background:#2e9a5a}
.bgx-st.ok .bgx-chip s{display:none}
.bgx-st.ok .bgx-chip u{display:inline-block;animation:ping .413s var(--spring)}
.bgx-ex{display:none;padding:9px 16px 15px;background:#eef1fa}
.bgx-st.open .bgx-ex{display:block;animation:vaIn .32s var(--ease-out) both}
.bgx-n{display:flex;align-items:baseline;gap:8px;padding:2px 0 6px}
.bgx-n i{flex:0 0 auto;display:grid;place-items:center;width:18px;height:18px;border-radius:50%;background:#fff;border:1px solid #3d6bff;color:#3d6bff;font-style:normal;font-size:10.5px;font-weight:700;align-self:center}
.bgx-n b{font-size:13.5px;font-weight:700}
.bgx-n small{font-size:11.5px;color:#768297}
.bgx-mock{margin:2px 0 10px;border:1px dashed #e3e6ed;border-radius:8px;background:#fff;overflow:hidden}
.bgx-mh{display:flex;align-items:center;justify-content:space-between;padding:12px;background:#f5f6f8;border-bottom:1px solid #e9ebef}
.bgx-mh b{font-size:14px;font-weight:700}
.bgx-mh em{font-style:normal;font-size:11px;color:#5b6475;background:#e9ebf0;padding:3px 9px;border-radius:9px}
.bgx-mb{padding:8px 12px}
.bgx-mb>div{display:flex;justify-content:space-between;align-items:center;padding:9px 12px;font-size:13.5px}
.bgx-mb small{font-size:11.5px;color:#768297}
.bgx-mb .bgx-mt{flex-direction:column;align-items:flex-start;gap:2px;margin-top:4px;border-radius:8px;background:#eaf0ff}
.bgx-mn{padding:0 12px 10px;font-size:11.5px;color:#768297}
.bgx-btns{display:flex;gap:8px;margin:0 0 10px}
.bgx-btns:last-child{margin-bottom:0}
.bgx-btn{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 16px;border-radius:9px;background:#3d6bff;color:#fff;font-size:12.5px;font-weight:600;cursor:pointer;transition:scale .15s var(--ease),background .2s}
.bgx-btn svg{width:15px;height:15px}
.bgx-btn.g{background:#fff;color:#3d6bff;box-shadow:inset 0 0 0 1px #c4d2ff}
.bgx-btn:hover{background:#2f5ef2}
.bgx-btn.g:hover{background:#f4f7ff}
.bgx-btn.press,.bgx-btn:active{scale:.94}
.bgx-h{margin:0 0 10px;font-size:11.5px;line-height:1.5;color:#768297}
.bgx-ex>:is(.bx-t8,.bx-t11,.bx-t14,.bx-to){display:none}
.bgx[data-tab="8"] .bx-t8,.bgx[data-tab="11"] .bx-t11,.bgx[data-tab="14"] .bx-t14,.bgx[data-tab="o"] .bx-to{display:block}
.bgx-chip .na{display:none}
.bgx[data-tab="8"] .bgx-st:first-child .bgx-chip :is(s,u){display:none}
.bgx[data-tab="8"] .bgx-st:first-child .bgx-chip .na{display:inline-block}
.bgx[data-tab="8"] .bgx-st:first-child .bgx-no{background:#2e9a5a}
.bx-t8 .bgx-h{margin:2px 0 0}
.bgx-code{display:flex;gap:6px;margin:2px 0 10px 26px}
.bgx-code i{flex:1;display:grid;place-items:center;height:36px;border-radius:8px;background:#fff;box-shadow:inset 0 0 0 1px #d4dbea;font-style:normal;font-size:16px;font-weight:700;font-variant-numeric:tabular-nums;color:#10182b}
.bgx-gst{position:absolute;left:50%;bottom:7px;width:110px;height:4px;margin-left:-55px;border-radius:2px;background:#c5cbd6}
.lk{display:inline-flex;align-items:center;gap:6px;font-weight:700;color:var(--blue);text-decoration:none}
.lk svg{width:18px;height:18px;transition:translate .3s var(--spring)}
.lk:hover svg{translate:4px 0}
.at-os{display:flex;flex-wrap:wrap;gap:8px}
.os{display:inline-flex;align-items:center;gap:8px;height:44px;padding:0 14px 0 12px;border-radius:14px;background:#fff;text-decoration:none;color:var(--ink);box-shadow:0 0 0 1px rgba(20,40,30,.1);transition:translate .3s var(--ease),box-shadow .3s}
.os:hover{translate:0 -3px;box-shadow:0 18px 30px -22px rgba(22,135,207,.6),0 0 0 1px rgba(22,135,207,.35)}
.os-ic{width:20px;height:20px;color:#283f51}
.os b{font-size:14.5px}
.os small{display:none}
.os-go{display:inline-flex;align-items:center;gap:2px;margin-left:2px;font-size:12.5px;font-weight:700;color:#1687cf}
.os-go svg{width:14px;height:14px;transition:translate .25s var(--spring)}
.os:hover .os-go svg{translate:3px 0}
.va{--vb:#1687cf;--vi:#283f51;--vm:#738999;font-size:clamp(7px,1.5cqi,12px);line-height:1.6;color:var(--vi);text-align:left;border-radius:1.3em;background:#fff;overflow:hidden;box-shadow:0 40px 70px -36px rgba(30,70,110,.5),0 0 0 1px rgba(30,60,90,.12);font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif}
:where(.va) p{margin:0}
:where(.va) ol{list-style:none;margin:0;padding:0}
.va svg{width:1.43em;height:1.43em;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}
.va-chrome{position:relative;display:flex;align-items:center;gap:.55em;height:2.4em;padding:0 1em;background:#f2f4f6;border-bottom:1px solid #e3e8ec}
.va-chrome i{width:.85em;height:.85em;border-radius:50%;background:#ed6a5e}
.va-chrome i:nth-child(2){background:#f5bf4f}
.va-chrome i:nth-child(3){background:#62c554}
.va-chrome span{position:absolute;left:0;right:0;text-align:center;font-weight:600;color:#5d6f7c;pointer-events:none}
.va-hd{display:flex;align-items:center;justify-content:space-between;gap:1em;height:4.3em;padding:0 2em;border-bottom:1px solid #e9eef2;white-space:nowrap}
.va-brand{display:flex;align-items:center;gap:.86em}
.va-brand img{width:2.6em;height:2.6em}
.va-brand b{font-size:1.43em;font-weight:700;letter-spacing:-.025em}
.va-brand em{font-style:normal;font-size:.79em;background:#f0f4f7;color:#728694;padding:.18em .73em;border-radius:.36em}
.va-links{display:flex;align-items:center;gap:1.85em;font-size:.93em;color:#227fb5}
.va-lang{display:inline-flex;gap:.15em;padding:.15em;border:1px solid #d4e4ef;border-radius:.7em;background:#f5f9fc}
.va-lang i{font-style:normal;font-size:.92em;padding:.42em .75em;border-radius:.5em;color:#5a7182;line-height:1.3}
.va-lang i.on{background:#fff;color:#087ac0;box-shadow:0 1px 3px rgba(22,62,87,.11)}
.va-help{display:inline-flex;align-items:center;gap:.54em;color:#607a8d}
.va-help i{display:grid;place-items:center;width:1.4em;height:1.4em;border:1px solid #8196a5;border-radius:50%;font-style:normal;font-size:.85em;line-height:1}
.va-step{display:flex;justify-content:center;padding:1.15em 0}
.va-step li{display:flex;align-items:center;font-weight:500;color:#8495a3;white-space:nowrap;transition:color .3s}
.va-step li:not(:last-child)::after{content:"";width:5em;height:1px;background:#e4ebf1;margin:0 2em}
.va-step li span{display:grid;place-items:center;width:2.08em;height:2.08em;border-radius:50%;background:#f0f4f7;margin-right:.77em;font-size:.93em;transition:background .3s,color .3s}
.va-step li span b{font-weight:inherit}
.va-step li:first-child,.va:not([data-step="1"]) .va-step li{color:#187fbb}
.va[data-step="1"] .va-step li:first-child span,.va:not([data-step="1"]) .va-step li:last-child span{background:var(--vb);color:#fff}
.va:not([data-step="1"]) .va-step li:first-child span{background:#e4f3fd;color:var(--vb)}
.va:not([data-step="1"]) .va-step li:first-child span b{display:none}
.va:not([data-step="1"]) .va-step li:first-child span::before{content:"✓"}
.va-h{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:1.1em;padding:0 2em;margin-bottom:1.15em}
.va-h>.va-seg,.va-h>.va-chg{grid-area:1/2;justify-self:end}
.va-t{display:grid}
.va-t>b{grid-area:1/1;font-size:1.71em;font-weight:650;letter-spacing:-.025em;line-height:1.4}
.va-t>small{grid-area:2/1;font-size:.93em;color:var(--vm);margin-top:.5em}
.va-seg{display:flex;padding:.29em;border-radius:.72em;background:#f0f4f7}
.va-seg i{display:flex;align-items:center;gap:.6em;font-style:normal;font-size:.93em;padding:.6em 1em;border:1px solid transparent;border-radius:.54em;color:#617d90;white-space:nowrap}
.va-seg i.on{background:#fff;border-color:#e1eaf1;color:#177fbd;box-shadow:0 1px 3px rgba(43,106,150,.06)}
.va-seg svg{width:1.3em;height:1.3em}
.va-chg{font-size:.93em;color:#227fb5}
.va-t>*,.va-h>.va-seg,.va-h>.va-chg{visibility:hidden}
.va[data-step="1"] :is(.va-t,.va-h)>.v1,.va:not([data-step="1"]) :is(.va-t,.va-h)>.v2{visibility:visible;animation:vaIn .32s var(--ease-out) both}
.va-ws{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.5fr);gap:1.15em;height:39em;padding:0 2em .86em}
.va-l,.va-r{display:flex;flex-direction:column;min-height:0;overflow:hidden;border-radius:.93em;padding:1.43em}
.va-l{background:linear-gradient(#f0f9ff,#f8fbfd);border:1px solid #dfeef8}
.va-r{border:1px solid #e0e9f0}
.va-l>*,.va-r>*{display:none;flex:1 1 auto;flex-direction:column;min-height:0}
.va[data-step="1"] :is(.va-l,.va-r)>.v1,.va:not([data-step="1"]) :is(.va-l,.va-r)>.v2{display:flex;animation:vaIn .32s var(--ease-out) both}
.va-usb>*,.va-devc>*,.va-con>*{flex-shrink:0}
.va-h2{display:block;font-size:1.5em;font-weight:600;line-height:1.45}
.va-l .va-h2{color:#315267}
.va-p{color:var(--vm)}
.va-tb{font-size:.93em;color:#227fb5;padding:.46em 0}
.va-sec{display:inline-flex;align-items:center;justify-content:center;padding:.86em;border-radius:.57em;background:#eff4f7;color:#547083}
.va-usb .va-h2{margin-bottom:.38em}
.va-lb{margin:1.38em 0 .62em;font-size:.93em;font-weight:500;color:#57768d}
.va-sel{display:flex;align-items:center;justify-content:space-between;gap:.86em;padding:.79em .93em;border:1px solid #d9e4ed;border-radius:.57em;background:#fff;color:#34566f;margin-bottom:.57em}
.va-sel svg{width:1.14em;height:1.14em;color:#6e899d}
.va-us{margin-bottom:1em}
.va-us li{display:flex;align-items:center;gap:.71em;padding:.5em .71em;border-radius:.36em;color:#617c8f}
.va-us li i{display:grid;place-items:center;flex:0 0 auto;width:1.64em;height:1.64em;border:1px solid #cedde7;border-radius:50%;font-style:normal}
.va-us li.on{background:#e5f2fb;color:#126aa6;font-weight:600}
.va-us li.on i{background:#1674b4;border-color:#1674b4;color:#fff}
.va-ud{padding:1em;background:#fff;border:1px solid #dce8f0;border-radius:.57em}
.va-ud p,.va-ut p{font-size:.93em;margin-top:.5em;color:#526f83}
.va-un{display:flex;align-items:center;justify-content:space-between;margin-top:.86em}
.va-un .va-tb{opacity:.48}
.va-ut{padding:1em 0}
.va-con .va-p,.va-devc .va-p{font-size:.93em;margin-top:.5em}
.va-lh{display:flex;align-items:center;justify-content:space-between;margin:2.57em 0 .86em}
.va-lh b{font-weight:600}
.va-dev{display:flex;align-items:center;gap:.86em;margin:.71em 0;padding:1.07em;border:1px solid #e2eaf1;border-radius:.71em;background:#f7fafc;color:#416780;transition:background .2s,border-color .2s,scale .15s var(--ease)}
.va-dev:hover{background:#eaf5fd;border-color:#9fcbea}
.va-dev>span:first-of-type{flex:1;min-width:0;display:flex;flex-direction:column}
.va-dev>span:first-of-type b{font-weight:700}
.va-dev small{font-size:.86em;color:#748b9b}
.va-dst{display:flex;flex-direction:column;align-items:flex-end;font-size:.79em;line-height:1.5;text-align:right}
.va-dst small{font-size:.91em;color:#2583bb}
.va-con .va-tb{align-self:flex-start}
.va-con .va-pl{align-self:flex-end;margin-top:auto;font-size:.79em}
.va-devc{align-items:flex-start}
.va-eb{font-size:.86em;font-weight:600;letter-spacing:.03em;color:#3c91c0;margin-bottom:.57em}
.va-big{display:grid;place-items:center;width:3.43em;height:3.43em;border-radius:1.43em;background:#e0f1fc;color:#4ba2d7;margin:.57em 0}
.va-big svg{width:2em;height:2em}
.va-ok{margin-top:1em;padding:.27em .82em;border-radius:.9em;background:#e0f2ed;color:#3e8d77;font-size:.79em}
.va-devc dl{display:grid;grid-template-columns:6.9em minmax(0,1fr);gap:.77em .62em;width:100%;margin:.92em 0;font-size:.93em}
.va-devc dt{font-size:.85em;color:#899eac;line-height:1.7}
.va-devc dd{margin:0;color:#46687e;overflow-wrap:anywhere}
.va dd .s1,.va-items p .s1,.va-mx .s1,.va-ss>span{display:none}
.va:not([data-done="0"]) dd .s0{display:none}
.va:not([data-done="0"]) dd .s1{display:inline}
.va-sc{position:relative;flex:1;min-height:0;overflow:hidden}
.va-sum{display:flex;justify-content:space-between;align-items:flex-start;gap:1.14em;margin-bottom:.86em}
.va-sum p{color:var(--vm)}
.va-sum strong{white-space:nowrap;color:#1674b4;font-size:.93em;font-weight:700}
.va-sum strong b{font-weight:inherit}
.va-items>li{display:flex;gap:1em;padding:.86em 0;border-top:1px solid #e4edf3}
.va-items>li>div{flex:1;min-width:0}
.va-no{flex:0 0 1.88em;height:1.88em;display:grid;place-items:center;border-radius:50%;background:#edf4fa;color:#34678b;font-style:normal;font-size:1.14em;font-weight:600;transition:background .3s,color .3s}
.va-ih{display:flex;align-items:center;justify-content:space-between;gap:.71em;margin-bottom:.36em}
.va-ih>b{font-size:1.14em;font-weight:600}
.va-ss{flex:0 0 auto;font-size:.86em;padding:.17em .58em;border-radius:.33em;white-space:nowrap;background:#fff2d9;color:#825b12;transition:background .3s,color .3s}
.va-ss>.s0,.va-man .va-ss>span{display:inline}
.va-items p{font-size:.93em;color:var(--vm);overflow-wrap:anywhere}
.va-items>li.run .va-no{background:#1674b4;color:#fff}
.va-items>li.run .va-ss>.s0,.va-items>li.ok .va-ss>.s0,.va-items>li.ok p .s0{display:none}
.va-items>li.run .va-ss>.sr,.va-items>li.ok .va-ss>.s1,.va-items>li.ok p .s1{display:inline}
.va-items>li.ok .va-no{background:#e5f5eb;color:#25834e}
.va-items>li.ok .va-ss{background:#e5f5eb;color:#227447}
.va-rs{display:none}
.va-items>li.ok .va-rs{display:inline-block}
.va-mx{display:inline-block}
.va-mx .s0{display:inline}
.va-mg{display:none;margin-top:.71em;padding-left:.93em;border-left:3px solid #d1e6f3}
.va-mg .va-sec{margin-top:.86em}
.va-mk{margin:1.4em 0}
.va-msg{display:none;margin-bottom:1.29em;padding:.92em 1.23em;border-radius:.62em;background:#edf7fd;color:#387aa4;font-size:.93em}
.va-next{margin:1.38em 0;padding:1.23em;border-radius:.69em;background:#f5f9fc;font-size:.93em}
.va-next p{margin-top:.62em;line-height:1.8;color:var(--vm)}
.va:is([data-step="3"],[data-step="4"]) :is(.va-mx .s0,.va-cs){display:none}
.va:is([data-step="3"],[data-step="4"]) .va-mx .s1{display:inline}
.va:is([data-step="3"],[data-step="4"]) :is(.va-mg,.va-msg){display:block}
.va-act{flex-shrink:0;display:flex;flex-wrap:wrap;align-items:center;gap:.86em;margin-top:1.14em;padding-top:.86em;border-top:1px solid #e4edf3}
.va-ck{display:flex;align-items:flex-start;gap:.83em;font-size:.86em;font-weight:500;color:#57768d}
.va-cs{flex-basis:100%}
.va-ck i{position:relative;flex:0 0 auto;width:1.33em;height:1.33em;margin-top:.17em;border-radius:.25em;background:#fff;box-shadow:inset 0 0 0 1px #767676;transition:background .2s}
.va-ck.on i{background:var(--vb);box-shadow:none}
.va-ck.on i::after{content:"";position:absolute;left:.45em;top:.17em;width:.33em;height:.67em;border:solid #fff;border-width:0 .14em .14em 0;rotate:40deg}
.va-btn{flex:1;display:flex;align-items:center;justify-content:center;min-height:3.43em;padding:.5em 1.29em;border-radius:.64em;background:var(--vb);color:#fff;font-weight:600;text-align:center;transition:opacity .2s,scale .15s var(--ease)}
.va-btn>span{display:none;font-size:1.07em}
.va-btn>.b0{display:inline}
.va[data-run] .va-btn>.b0,.va:is([data-step="3"],[data-step="4"]) .va-btn>.b0{display:none}
.va[data-run="1"] .va-btn>.b1,.va[data-run="2"] .va-btn>.b2,.va[data-run="3"] .va-btn>.b3,.va:is([data-step="3"],[data-step="4"]) .va-btn>.b4{display:inline}
.va-btn.dis,.va[data-run] :is(.va-btn,.va-act .va-sec,.va-chg){opacity:.48}
.va[data-run] .va-cs i{background:#c4ccd2}
.va-act .va-sec{min-height:3.43em}
.va-ft{display:flex;align-items:center;gap:2em;padding:.73em 2.55em;border-top:1px solid #e7edf2;color:#8b9da9;font-size:.79em;white-space:nowrap}
.va-ft>span:first-child{display:flex;align-items:center;gap:.73em;margin-right:auto}
.va-ft svg{width:1.36em;height:1.36em}
.va-ft i{font-style:normal;margin:0 .45em}
.va-ft>span:nth-child(2),.va-ft>span:nth-child(3){color:#8297a6}
html[lang="en"] .va-ih{align-items:flex-start}
html[lang="en"] .va-ih>b{font-size:1em}
html[lang="en"] .va-ws{height:41.5em}
.va-usb,.va-devc,.va-sc{-webkit-mask-image:linear-gradient(#000 calc(100% - 1.6em),transparent);mask-image:linear-gradient(#000 calc(100% - 1.6em),transparent)}
.va-step li,.va-dev,.va-btn,.va-chg,.va-ck,.va-sec{cursor:pointer}
.va-btn.press,.va-btn:active,.va-dev.press,.va-sec.press{scale:.97}
@keyframes vaIn{from{opacity:0;translate:0 .6em}to{opacity:1;translate:0 0}}

.faq{display:grid;grid-template-columns:minmax(0,420px) minmax(0,1fr);gap:72px;align-items:start}
.qa{display:grid;gap:10px}
.qa details{border-radius:24px;background:var(--bg);box-shadow:0 0 0 1px var(--line);interpolate-size:allow-keywords;transition:background .3s,box-shadow .3s}
.qa details[open]{background:#fff;box-shadow:0 0 0 1px rgba(60,138,79,.25),0 16px 30px -24px rgba(20,40,30,.5)}
.qa summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:22px 26px;font-size:17.5px;font-weight:700;cursor:pointer}
.qa summary::-webkit-details-marker{display:none}
.qa summary::after{content:"";flex:0 0 auto;width:32px;height:32px;border-radius:50%;background:#fff center/16px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 5v14M5 12h14' fill='none' stroke='%23184d2a' stroke-width='2.4' stroke-linecap='round'/%3E%3C/svg%3E");box-shadow:0 0 0 1px var(--line);transition:rotate .4s var(--spring),background-color .3s}
.qa details[open] summary::after{rotate:135deg;background-color:var(--g100)}
.qa details p{margin:0;padding:0 26px 24px;font-size:15.5px;line-height:1.75;color:var(--ink2)}
.qa details::details-content{block-size:0;overflow:hidden;transition:block-size .4s var(--ease),content-visibility .4s allow-discrete}
.qa details[open]::details-content{block-size:auto}

.foot{padding:72px 0 40px;background:#fff;border-top:1px solid var(--line)}
.foot-in{display:grid;grid-template-columns:2fr 1fr 1fr 1fr 1fr;gap:40px}
.foot-brand p{margin:14px 0 0;max-width:300px;font-size:14.5px;color:var(--ink2)}
.foot-brand .foot-mail{margin-top:6px}
.foot-mail a{color:var(--ink);text-decoration:none}
.foot-mail a:hover{text-decoration:underline}
.foot-col{display:flex;flex-direction:column;gap:10px;font-size:14.5px}
.foot-col b{font-size:14px;color:var(--ink);margin-bottom:4px}
.foot-col a{color:var(--ink2);text-decoration:none}
.foot-col a:hover{color:var(--ink)}
.foot-bt{display:flex;justify-content:space-between;margin-top:48px;padding-top:24px;border-top:1px solid var(--line);font-size:13px;color:var(--ink3)}
.foot-bt a{color:var(--ink3);text-decoration:none}

.pin-multi:not(.motion *) .stage{padding:80px 0}
.pin-multi:not(.motion *) .mc-field{min-height:clamp(380px,48vw,620px)}

@media (max-width:1180px){
  h1{font-size:68px}
  .top-in{gap:24px}
  .links{gap:20px}
}
@media (max-width:1280px){
  .soc{display:none}
  html[lang="en"] .links .nav-cloud{font-size:0;gap:0}
}
@media (max-width:1100px){
  .links{gap:14px}
  .top-in{gap:18px}
}
@media (max-width:1180px){
  .hero-in{grid-template-columns:minmax(0,540px) minmax(0,1fr);column-gap:32px}
  .dlr{grid-template-columns:1fr;grid-template-rows:none}
  .dlt-socs{gap:10px}
  .dlt-soc .soc-a{width:48px;height:48px}
  .dlt-soc .soc-a svg{width:24px;height:24px}
  .sec-head h2,.stage-head h2,.v-copy h2{font-size:44px}
  .feat-grid{grid-template-columns:1fr 1fr}
  .plug,.fl{grid-template-columns:1fr;gap:48px}
  .fl .sec-head{text-align:center;margin:0 auto}
  .fl-pts{justify-items:center}
  .scene-grid{grid-template-columns:1fr 1fr}
  .faq{grid-template-columns:1fr;gap:32px}
  .get{grid-template-columns:1fr}
  .get-qq{max-width:320px}
  .bento{grid-template-columns:1fr}
}
@media (max-width:960px){
  .wrap{padding:0 24px}
  .links{position:fixed;inset:0 0 auto 0;top:0;flex-direction:column;gap:0;padding:84px 24px 24px;background:rgba(246,249,242,.97);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);transform:translateY(-102%);transition:transform .338s var(--ease);font-size:18px;color:var(--ink);box-shadow:0 20px 40px -24px rgba(20,40,30,.35);z-index:60}
  .links a{padding:14px 4px;border-bottom:1px solid var(--line)}
  .links a::after{display:none}
  .links:target{transform:none}
  .links .menu-close{display:block;border-bottom:0;color:var(--ink3);font-size:15px}
  .links .m-only{display:block}
  .soc{display:none}
  .menu-btn{display:grid;gap:5px;place-content:center;width:42px;height:42px;border-radius:999px;background:var(--g100)}
  .menu-btn i{display:block;width:18px;height:2px;border-radius:2px;background:var(--ink)}
  .btn-top{display:none}
  .hero{padding:8px 0 80px}
  .hero-in{grid-template-columns:1fr;grid-template-areas:"copy" "art" "dl";row-gap:8px}
  .copy{padding-top:24px}
  h1{font-size:clamp(44px,11vw,64px);margin:20px 0 16px}
  .lead{font-size:16.5px}
  .art{justify-self:stretch;max-width:none;margin-top:16px;aspect-ratio:auto;display:flex;justify-content:center;padding:22px 0 70px}
  .art>*{translate:none}
  .a15{left:max(-3vw,-20px);top:14%;width:min(34vw,210px)}
  .hero-dev{position:relative;right:auto;top:auto;z-index:1;width:min(56vw,calc(56vh * 674 / 1436),320px);width:min(56vw,calc(56svh * 674 / 1436),320px);transition:width .35s var(--ease)}
  .hero-dev.open{width:min(78vw,calc(78vh * 674 / 1436),430px);width:min(78vw,calc(78svh * 674 / 1436),430px)}
  .dl{margin-top:8px}
  .sh1{width:360px;height:360px;right:-140px;top:-120px}
  .scroll-cue{display:none}
  .sec{padding:88px 0}
  .feats-sec{padding:48px 0 88px}
  .sec-head{margin-bottom:40px}
  .promise{grid-template-columns:1fr}
  .assist-tool{grid-template-columns:1fr;padding:32px 24px;gap:32px}
  .at-hd h3{font-size:30px}
  .at-cards{grid-template-columns:1fr}
  .get{padding:44px 32px}
  .get h2{font-size:38px}
  .foot-in{grid-template-columns:1fr 1fr}
  .foot-brand{grid-column:1/-1}
  .v-end{grid-template-columns:1fr;gap:20px;text-align:center}
  .v-copy p{font-size:15.5px}
  .v-spot{width:clamp(110px,30vw,150px);margin:0 auto 4px}
  .v-duo{height:min(38vh,330px);--W:calc(min(38vh,330px) * .43);width:min(100%,calc(min(38vh,330px) * 1.1));margin:0 auto}
  .v-duo figcaption{font-size:12.5px}
  .v-duo figcaption b{font-size:14px}
  .motion .pin-a15 .v-end{inset:20px 24px 0;align-content:start}
  .v-kicker{top:14px;font-size:16px}
  .mc-field{--W:clamp(96px,min(28vw,22vh),170px)}
  .mc-vm{--es:.6}
  .mc-vm:nth-of-type(1){--ex:-1.13;--ey:-.27;--er:-3}
  .mc-vm:nth-of-type(2){--ex:1.13;--ey:-.27;--er:3}
  .mc-vm:nth-of-type(3){--ex:-1.13;--ey:.27;--er:3}
  .mc-vm:nth-of-type(4){--ex:1.13;--ey:.27;--er:-3}
  .mc-tag{height:28px;font-size:12px;padding:0 10px}
  .mc-vm:nth-of-type(1) .mc-tag,.mc-vm:nth-of-type(2) .mc-tag{top:auto;bottom:calc(100% + 10px);transform-origin:50% 100%}
}
@media (max-width:640px){
  .a15{display:none}
  .top-in{gap:16px;height:64px}
  .brand{font-size:18px}
  .dlq,.btn-fill,.btn-tonal{width:100%}
  .dlg{grid-template-columns:1fr;gap:10px}
  .dlr{grid-template-columns:1fr;gap:10px}
  .dl .dl-qq{max-width:none;flex-direction:row;justify-content:space-between;padding:12px 18px}
  .dl .dl-qq .qq-hd{align-self:auto}
  .dl .dl-qq .qq-qr{display:none}
  .dlr .dlt{min-height:68px;border-radius:20px}
  .sec-head h2,.stage-head h2,.v-copy h2{font-size:32px}
  .sec-head p{font-size:16px}
  .mc-sub{font-size:14.5px}
  .mc-sub b{font-size:19px}
  .mc-pts{font-size:13.5px;gap:8px 16px}
  .feat-grid{grid-template-columns:1fr}
  .feat{min-height:170px}
  .ft-stage{grid-template-columns:minmax(0,30%) minmax(0,1fr) minmax(0,30%)}
  .seg2 label,.seg3 label{padding:0 12px;font-size:13.5px}
  .acc{gap:10px}
  .acc-dev{width:30vw}
  .acc-dev:nth-child(2){margin-top:28px}
  .acc-pill{height:28px;padding:0 9px;font-size:11.5px;gap:6px}
  .acc-pill i{width:6px;height:6px}
  .bx{padding:22px 18px 24px;border-radius:26px}
  .bx-hd{justify-content:center;text-align:center}
  .mo-stage{height:330px}
  .hz-stage{margin:22px 0 18px}
  .d-val{font-size:32px}
  .d-val::after{font-size:12px}
  .scene-grid{grid-template-columns:1fr}
  .scene{height:520px}
  .sc-ph .dev{width:62%}
  .at-os{grid-template-columns:1fr}
  .va{font-size:clamp(4px,2.8cqi,10.5px)}
  .va-l,.va-links,.va-seg,.va-chg,.va-ft>span:not(:first-child){display:none!important}
  .va-hd{height:4em;padding:0 1.4em}
  .va-step li:not(:last-child)::after{width:1.6em;margin:0 .7em}
  .va-h{padding:0 1.4em;margin-bottom:1em}
  .va-ws{grid-template-columns:minmax(0,1fr);height:42em;padding:0 1.4em 1em}
  html[lang="en"] .va-ws{height:46em}
  .va-r{padding:1.2em}
  .va-sum{flex-wrap:wrap;gap:.3em 1em}
  .va-ft{padding:.73em 1.8em;white-space:normal}
  .va-ft>span:first-child{display:block}
  .va-ft svg{display:inline-block;vertical-align:-.35em;margin-right:.5em}
  .get{padding:40px 24px;gap:28px}
  .get h2{font-size:34px}
  .get-tiles{max-width:none}
  .foot-bt{flex-direction:column;gap:6px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
}