:root{--page-bg: #1b1c2a;--panel-bg: #101120}*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{overscroll-behavior:none;background:#1b1c2a;background:var(--page-bg)}body{margin:0;font-family:sans-serif,PingFang SC,-apple-system,Hiragino Sans GB,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial;-webkit-user-select:none;-moz-user-select:none;user-select:none}img{pointer-events:none;-moz-user-select:none;user-select:none;-webkit-user-select:none}img:not([src]),img[src=""]{opacity:0}a{-webkit-text-decoration:none;text-decoration:none}ul,ol,li{list-style:none}.ellipsis{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.nav{position:fixed;z-index:2;left:0;right:0;padding:25px 48px}.nav .header-bg{position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;background:rgba(255,255,255,0);transition:all .25s ease}.nav.header-fixed .header-bg{background:rgba(27,28,42,.72);backdrop-filter:blur(32px);-webkit-backdrop-filter:blur(32px)}.nav .nav-inner{position:relative;z-index:2;display:flex;align-items:center}.nav .nav-inner .logo{display:flex;align-items:center;margin-right:58px}.nav .nav-inner .logo .logo-img{display:block;width:auto;height:44px}.home{position:relative;z-index:0;background:#1b1c2a;background:var(--page-bg);min-width:768px}.wrapper{width:100%;height:100vh;position:relative}.heybox-workshop{width:100%;height:100%;min-width:1280px;position:relative;z-index:2;transition:transform .25s ease}.bg-slider-wrapper{width:100%;height:100%;overflow:hidden}.bg-slider-box{width:100%;height:100%;position:relative}.bg-slider-item{width:100%;height:100%;position:absolute;top:0;left:0;opacity:0}.bg-slider-item.current{z-index:1;opacity:1}.bg-slider-item img{display:block;width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.left-box{position:absolute;top:calc(50% - 40px);left:136px;z-index:99;width:520px;transform:translateY(-50%)}.download-text{width:402px;height:152px;margin-bottom:48px}.brand{display:flex;align-items:center;height:28px;margin-left:-.5px}.brand-name{font-weight:700;font-size:29px;line-height:28px;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.25)}.brand-badge{width:16px;height:18px;margin-left:13px}.brand-tip{margin-left:7px;font-size:13px;line-height:18px;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.25)}.main-title{height:64px;margin-top:17px;margin-left:-9px;font-weight:800;font-size:62px;line-height:64px;letter-spacing:.5px;white-space:nowrap;color:#fff;-webkit-text-stroke:1px #fff;text-shadow:0 2px 4px rgba(0,0,0,.3)}.tags{display:flex;flex-wrap:nowrap;align-items:center;height:20px;margin-top:23px;font-size:16px;line-height:20px;white-space:nowrap;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.25)}.tags .tag-free{display:inline-flex;align-items:center;justify-content:center;height:20px;padding:0 5px;line-height:1;border:1px solid #fff;border-radius:3px}.tags .slash{margin:0 7px;font-style:italic;opacity:.85}.btn{display:flex;align-items:center;justify-content:center;width:216px;height:54px;background:#fff;border-radius:4px;box-shadow:0 2px 4px rgba(0,0,0,.2);transition:transform .2s ease,box-shadow .2s ease;border:0;cursor:pointer;font-family:inherit}.btn:disabled{opacity:.65;cursor:wait}.btn.focus-visible.js-focus-visible,.js-focus-visible .btn.focus-visible,.slider-doc.js-focus-visible button.focus-visible,.js-focus-visible .slider-doc button.focus-visible{outline:2px solid #e2c685;outline-offset:4px}.btn:focus-visible,.slider-doc button:focus-visible{outline:2px solid #e2c685;outline-offset:4px}.download-action{position:relative;width:216px}.download-action__status{position:absolute;top:calc(100% + 8px);left:0;width:100%;font-size:14px;font-weight:400;line-height:20px;color:#fff;text-align:center;white-space:nowrap}.download-action__status:empty{display:none}.download-action--source2 .download-action__status{position:static;display:block;width:280px;margin-top:8px;text-align:left;white-space:normal}.download-action__copy-label{font-size:18px;font-weight:700;line-height:24px;color:#000;white-space:nowrap}.download-action__manual-url{display:block;width:280px;height:34px;margin-top:8px;padding:0 8px;border:1px solid rgba(255,255,255,.7);border-radius:4px;background:rgba(0,0,0,.45);color:#fff;font-size:14px;font-weight:400;line-height:20px;-webkit-user-select:text;-moz-user-select:text;user-select:text}.btn:hover{transform:translateY(-1px);box-shadow:0 6px 14px rgba(0,0,0,.28)}.btn img{width:32px;height:32px;margin-right:12px}.btn .text{height:-moz-fit-content;height:fit-content}.btn .text .text-1{display:flex;align-items:center;justify-content:center;width:36px;height:12px;margin-bottom:2px}.btn .text .text-1 span{display:inline-block;white-space:nowrap;font-weight:700;font-size:18px;line-height:24px;color:#000;transform:scale(.5);transform-origin:center top}.btn .text .text-2{font-weight:700;font-size:14px;line-height:18px;color:#000}.right-box{position:absolute;top:calc(50% - 40px);right:8%;z-index:98;width:895px;height:582px;transform:translateY(-50%)}.right-box .workshop-slider{position:relative;width:100%;height:100%}.right-box .workshop-slider .bg{position:absolute;top:0;left:0;width:100%;height:100%;clip-path:url(#workshop-texture);backdrop-filter:blur(32px);-webkit-backdrop-filter:blur(32px)}.right-box .workshop-slider .bg img{width:100%;height:100%}.right-box .swiper-container{width:879px;height:566px;margin:0 auto 0 0;border-radius:14px;overflow:hidden;opacity:0}.right-box .swiper-container.show{animation:fadeIn .5s ease both}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.right-box .swiper-wrapper{display:flex;width:100%;height:100%;will-change:transform;transition:transform .3s ease}.right-box .swiper-slide{flex:0 0 100%;width:879px;height:566px;background-color:rgba(255,255,255,.1)}.right-box .swiper-slide img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.right-box .workshop-slider .slider-doc{position:absolute;top:calc(100% + 16px);left:50%;display:flex;height:16px;transform:translate(-50%)}.right-box .workshop-slider .slider-doc li{width:24px;height:16px;cursor:pointer}.right-box .workshop-slider .slider-doc li button{display:block;width:8px;height:8px;margin:4px;padding:0;background-color:#99aeff;opacity:.4;border-radius:4px;border:0;cursor:pointer;transition:all .3s linear}.right-box .workshop-slider .slider-doc li.on button{opacity:1}.logo-tips{position:absolute;z-index:10;left:140px;bottom:40px;display:flex;align-items:center}.logo-tips .img{display:flex;align-items:center;justify-content:center;width:17px;height:21px;margin-right:8px}.logo-tips .img img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.logo-tips .text{font-size:14px;line-height:20px;color:rgba(255,255,255,.5)}.bg-cover{position:absolute;z-index:2;left:0;bottom:0;width:100%;height:155px;background:linear-gradient(180deg,rgba(27,28,42,0),#1b1c2a);background:linear-gradient(180deg,rgba(27,28,42,0),var(--page-bg))}.card{padding:32px 140px 166px}.card .section-1{width:100%;height:416px}.card .section-1 .container{position:relative;height:100%;border-radius:10px;overflow:hidden;background:#0d0e1a}.card .section-1 .container .wrapper{position:absolute;left:0;top:0;width:100%;height:100%;z-index:2}.card .section-1 .container .bottom-img{position:absolute;left:0;top:0;width:100%;height:100%;z-index:1;background:url(https://static.max-c.com/static/heybox/webapp/assets/v1/releases/heybox-spa/dota/3f88ef729a5f4ce0352a4bc39ed1978fb9a5cf64/app/sec1-art-rO0MffMP.jpg) 26% 40% / cover no-repeat;animation:artDrift 26s ease-in-out infinite alternate}@keyframes artDrift{0%{background-position:22% 34%;transform:scale(1)}to{background-position:38% 56%;transform:scale(1.05)}}.card .section-1 .container .cover-box{position:absolute;right:0;z-index:2;display:flex;flex-direction:column;justify-content:center;width:calc(50% - 17px);height:100%;padding-left:86px;border-radius:20px 0 0 20px;background-color:#101120;background-color:var(--panel-bg);background-image:linear-gradient(90deg,rgba(16,17,32,.96),rgba(16,17,32,.84) 46%,rgba(16,17,32,.28)),url(https://static.max-c.com/static/heybox/webapp/assets/v1/releases/heybox-spa/dota/3f88ef729a5f4ce0352a4bc39ed1978fb9a5cf64/app/sec1-cover-vQjfkWRb.jpg);background-repeat:no-repeat;background-position:0 0,100% 45%;background-size:cover,cover}.card .section-1 .container .cover-box .title{margin-bottom:32px;font-weight:700;font-size:36px;line-height:48px;color:#fff}.card .section-1 .container .cover-box .text{margin-bottom:24px;font-size:16px;line-height:24px;color:rgba(255,255,255,.7)}.card .section-1 .container .cover-box .text:last-child{margin-bottom:0}.card .section-2{width:100%;height:416px;margin-top:32px}.card .section-2 .container{position:relative;height:100%;border-radius:10px;overflow:hidden;background:linear-gradient(180deg,#3c3880,#433f85)}.card .section-2 .container .wrapper{position:absolute;left:0;top:0;width:100%;height:100%;z-index:2}.card .section-2 .container .info-box{position:absolute;top:0;right:0;display:flex;flex-direction:column;justify-content:center;width:48.88%;height:100%;padding-left:86px}.card .section-2 .container .info-box .info-title{margin-bottom:32px;font-weight:700;font-size:36px;line-height:48px;color:#fff}.card .section-2 .container .info-box .info-text{margin-bottom:24px;font-size:16px;line-height:24px;color:rgba(255,255,255,.7)}.card .section-2 .container .info-box .info-text:last-child{margin-bottom:0}.card .section-2 .container .charge-wrapper{position:absolute;top:69px;left:5.69%;width:686px;height:347px;overflow:hidden;border-top-right-radius:20px;border-top-left-radius:20px;filter:drop-shadow(0 0 36px #343079)}.card .section-2 .container .charge-wrapper .wrapper-inner{display:flex;align-items:center;justify-content:center;width:100%;height:100%;background-color:rgba(255,255,255,.1)}.card .section-2 .container .charge-wrapper .wrapper-inner img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.card .section-2 .container .bg-img{position:absolute;right:0;bottom:0;width:189px;height:227px;opacity:.5}.card .section-2 .container .bg-img img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.card .section-3{width:100%;height:416px;margin-top:32px}.card .section-3 .container{position:relative;display:flex;height:100%;overflow:hidden}.card .section-3 .container .left-block,.card .section-3 .container .right-block{position:relative;display:flex;align-items:center;width:calc(50% - 16px);height:100%;overflow:hidden;border-radius:10px}.card .section-3 .container .left-block{margin-right:32px;background:#579ad9}.card .section-3 .container .right-block{background:#4f6fd5}.card .section-3 .container .left-block .wrapper,.card .section-3 .container .right-block .wrapper{position:absolute;left:0;top:0;width:100%;height:100%;z-index:2}.card .section-3 .container .left-block .img,.card .section-3 .container .right-block .img{position:relative;width:318px;height:268px;margin-right:58px;background-color:rgba(255,255,255,.1);border-top-right-radius:10px;border-bottom-right-radius:10px;overflow:hidden}.card .section-3 .container .left-block .img{filter:drop-shadow(0 0 26px #0472d9)}.card .section-3 .container .right-block .img{filter:drop-shadow(0 0 26px #365eed)}.card .section-3 .container .left-block .img img,.card .section-3 .container .right-block .img img{position:absolute;right:0;top:0;width:auto;height:100%}.card .section-3 .container .left-block .desc,.card .section-3 .container .right-block .desc{width:calc(100% - 408px)}.card .section-3 .container .left-block .desc .title,.card .section-3 .container .right-block .desc .title{margin-bottom:24px;font-weight:700;font-size:30px;line-height:46px;color:#fff}.card .section-3 .container .left-block .desc .text,.card .section-3 .container .right-block .desc .text{margin-bottom:20px;font-size:16px;line-height:24px;color:rgba(255,255,255,.7)}.card .section-3 .container .left-block .desc .text:last-child,.card .section-3 .container .right-block .desc .text:last-child{margin-bottom:0}.card .section-4{width:100%;height:562px;margin-top:32px}.card .section-4 .container{position:relative;height:100%;border-radius:10px;overflow:hidden;background:linear-gradient(180deg,#754bcc,#d47ba0)}.card .section-4 .container .wrapper{position:absolute;left:0;top:0;width:100%;height:100%;z-index:2}.card .section-4 .container .info-box{position:absolute;z-index:2;left:50%;top:64px;display:flex;flex-direction:column;justify-content:center;width:100%;transform:translate(-50%)}.card .section-4 .container .info-box .info-title{margin-bottom:24px;font-weight:700;font-size:36px;line-height:48px;color:#fff;text-align:center}.card .section-4 .container .info-box .info-text{margin-bottom:28px;font-size:16px;line-height:24px;color:rgba(255,255,255,.7);text-align:center}.card .section-4 .container .info-box .download-action{margin:0 auto}.card .section-4 .container .info-box .download-action--source2 .download-action__status{position:relative;left:50%;transform:translate(-50%);text-align:center}.card .section-4 .container .info-box .download-action--source2 .download-action__manual-url{position:relative;left:50%;transform:translate(-50%)}.card .section-4 .container .charge-wrapper{position:absolute;z-index:2;top:274px;left:50%;width:686px;height:288px;overflow:hidden;border-top-right-radius:20px;border-top-left-radius:20px;filter:drop-shadow(0 0 36px #915d8f);transform:translate(-50%)}.card .section-4 .container .charge-wrapper .wrapper-inner{display:flex;align-items:center;justify-content:center;width:100%;height:100%;background:rgba(255,255,255,.1)}.card .section-4 .container .charge-wrapper .wrapper-inner img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.card .section-4 .container .bg-img{position:absolute;z-index:1}.card .section-4 .container .bg-img img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.card .section-4 .container .bg-img.cloud0{top:46px;left:65px;width:200px;height:178px}.card .section-4 .container .bg-img.cloud1{bottom:-62px;left:204px;width:352px;height:313px}.card .section-4 .container .bg-img.cloud2{right:81px;bottom:44px;width:352px;height:313px}.card .section-4 .container .bg-img.cloud3{right:-67px;top:-18px;width:200px;height:178px}.footer-wrapper{position:absolute;top:100%;left:0;display:flex;width:100%;min-height:280px;padding:60px 48px;background-color:#000;transition:transform .25s ease}.left-wrap{display:flex;flex:1;width:0}.left-wrap .logo{width:101px;height:36px;margin-right:72px}.left-wrap .logo svg{display:block;width:100%;height:100%}.left-wrap .link-group{display:flex;flex-direction:column;margin-right:72px;color:#fff;font-size:16px}.left-wrap .link-group p{height:16px;margin-top:20px;line-height:16px;color:rgba(255,255,255,.28)}.left-wrap .link-group p:first-of-type{margin-top:0}.left-wrap .link-group .group{opacity:.5}.left-wrap .link-group .link a{font-size:16px;line-height:16px;color:rgba(255,255,255,.5)}.left-wrap .link-group .link a:hover{color:#fff}.right-wrap{position:relative;display:flex;flex-direction:column;justify-content:center;align-items:flex-end;width:600px}.right-wrap:before,.right-wrap:after{content:"";position:absolute;right:0;width:582px;height:1px;background-image:linear-gradient(270deg,rgba(238,238,238,.2),rgba(216,216,216,0))}.right-wrap:before{top:0}.right-wrap:after{bottom:0}.right-wrap p{margin:6px 0;font-size:12px;line-height:12px;white-space:nowrap;color:rgba(255,255,255,.28)}.right-wrap p a{color:rgba(255,255,255,.28)}.right-wrap p a:hover{color:rgba(255,255,255,.6)}@media(min-width:768px)and (max-width:1440px){.card{padding:32px 40px 166px}}@media(min-width:1440px)and (max-width:2047px){.card{padding:32px 140px 166px}}@media(min-width:2048px){.card{padding:32px 200px 166px}}@media screen and (max-width:1550px){.left-box{left:72px}.logo-tips{left:76px}.main-title{font-size:52px;margin-left:-7.5px}.tags{font-size:15px}.right-box{right:3%}}
