#app{height:100%;font-family:Avenir,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}html{height:100%}body{margin:0;height:100%;position:relative}svg{width:100%;height:100%}@font-face{font-family:CHWJP4C;src:url(/assets/CHWJP4C-c6d2724d.ttf) format("truetype");font-display:block;font-weight:400;font-style:normal}@font-face{font-family:Bravura Text;src:url(/assets/BravuraText-a16b6710.woff2) format("woff2")}.cursor{cursor:pointer}ul{padding-left:0;margin:0}li{list-style:none}a{color:#000;text-decoration:none}.control-group .control-item{height:30px;background-color:#36383d;margin-left:1px;display:flex;justify-content:center;align-items:center;color:#c8c8c8;cursor:default;font-size:16px;cursor:pointer}.control-group .control-item span{font-size:12px}.control-group .control-item.magic{padding:0 10px;font-size:12px}.control-group .control-item:hover{background-color:#2d2e32}.control-group .control-item.active{background-color:#2759fd}.control-group .control-item.active-save{background-color:#ca7979;color:#000}.control-group .control-item.disabled{cursor:not-allowed}.control-group .control-item.rect{width:30px}.control-group .control-item:first-child{margin-left:0}.control-group{display:flex;margin-right:5px}.community a{color:#dd461d}.community a:hover{text-decoration:underline;text-decoration-color:#dd461d}.btns{margin-bottom:20px;display:flex;justify-content:space-between}.btns button{margin:0 5px}.ad-banner{background:linear-gradient(135deg,#e74c3c 0%,#c0392b 50%,#a93226 100%);padding:0;text-align:center;position:relative;overflow:hidden;box-shadow:0 4px 15px #e74c3c4d;border-bottom:3px solid #922b21}.ad-banner:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);animation:shimmer 3s infinite}.ad-link{display:flex;align-items:center;justify-content:center;gap:15px;padding:12px 20px;text-decoration:none;color:#fff;font-weight:600;transition:all .3s ease;position:relative;z-index:1}.ad-link:hover{background-color:#ffffff1f;transform:scale(1.02);box-shadow:inset 0 0 25px #ffffff14}.ad-icon{font-size:20px;animation:bounce 2s infinite;filter:drop-shadow(0 2px 4px rgba(0,0,0,.4));text-shadow:0 0 8px rgba(255,255,255,.6)}.ad-text{font-size:16px;font-weight:700;text-shadow:0 2px 6px rgba(0,0,0,.4);letter-spacing:.5px}.ad-badge{background:linear-gradient(135deg,#f39c12 0%,#e67e22 100%);color:#fff;padding:4px 12px;border-radius:20px;font-size:12px;font-weight:800;text-transform:uppercase;box-shadow:0 2px 8px #f39c1266;animation:pulse 2s infinite;border:2px solid rgba(255,255,255,.9)}@keyframes shimmer{0%{left:-100%}to{left:100%}}@keyframes bounce{0%,20%,50%,80%,to{transform:translateY(0)}40%{transform:translateY(-8px)}60%{transform:translateY(-4px)}}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.1)}to{transform:scale(1)}}@media (max-width: 768px){.ad-link{gap:10px;padding:10px 15px}.ad-icon{font-size:18px}.ad-text{font-size:14px}.ad-badge{font-size:10px;padding:3px 8px}}header{z-index:99;width:100%;background-color:#4c41cc;height:60px;line-height:60px;color:#fff}.wrap{width:1280px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;column-gap:20px;justify-items:center}.logo{cursor:pointer;font-weight:700;font-size:22px;margin-right:20px}header.mini{padding-top:0;background-color:#fff}header .search-wrap{width:350px}@media (max-width: 767px){header{height:40px;line-height:40px;display:flex;flex-direction:column;align-items:center;column-gap:0px}header.mini{height:30px;line-height:30px}}.PeopleSharp{padding:0 5px;cursor:pointer;color:#fff}.PeopleSharp:hover{color:#fff}.headerPaletteLeft{display:flex;justify-self:start;margin-left:20px}.headerPaletteRight{display:flex;justify-content:end;margin-right:20px;width:100%}.headerPaletteRight button{color:#fff}.headerPaletteRight button:hover span{color:#a9a9a9}.headerPaletteRight button:active{color:#fff}.n-button:not(.n-button--disabled):active{color:#fff}.n-button:not(.n-button--disabled):focus{color:#fff}.headerPaletteRight button:active span{color:#fff}.headerPaletteRight div{margin:0 3px}.router-link-exact-active{color:#fff}.qr-code-container{padding:20px}.qr-code-container h3{margin-bottom:20px;color:#333;font-size:18px;font-weight:500}.qr-code-image{width:200px;height:200px;border:1px solid #e1e5e9;border-radius:8px;margin:0 auto 15px;display:block}.qr-code-tip{color:#666;font-size:14px;margin-bottom:20px}.loading-container,.error-container{padding:40px 20px}.error-container p{color:#e74c3c;margin-bottom:20px}footer{background:rgb(30,32,33);background-color:#27272b;text-align:center;padding:30px 0}footer a{color:#787979;color:#2f3446;font-size:12px}footer .top{display:flex;justify-content:center;padding-bottom:20px}footer .top h5{color:#fff;font-size:15px}footer .top div{width:250px;margin:0 10px;padding-bottom:10px;text-align:left}footer .top .qrcode img{width:100px}footer .top ul li{margin:5px 0}footer .top ul li a{color:#fff;opacity:.6;font-size:12px}footer .top ul li a:hover{opacity:1;color:#2272ff;font-weight:500}.bottom a{color:#fff;opacity:.6}.xhs{background-color:#27272b;height:210px;border-radius:20px;padding:0 30px;margin-bottom:30px;font-size:30px;font-weight:700}.xhs p{width:60%;float:left}.xhs div{float:right;font-size:20px;margin-top:5px}.xhs img{width:150px;height:150px;display:block;float:right;margin-top:20px;margin-left:10px}.hero-wrapper{background-color:#5a4edf;padding-top:30px;color:#fff;padding-bottom:100px}.container{padding-right:1.5rem;padding-left:1.5rem;margin-right:auto;margin-left:auto}.hero-inner{display:flex;position:relative;flex-direction:row;padding-top:80px}.hero-inner h6{margin-top:30px;font-size:14px;font-weight:600;opacity:.6}.hero-inner .hero-inner-content,.hero-inner .hero-inner-image{flex:1}.hero-inner .hero-inner-image img{width:100%;border-radius:10px}@media screen and (min-width: 1280px){.container{max-width:1280px}}@media screen and (min-width: 768px){.h1{font-size:72px;line-height:80px}}@media (max-width: 767px){.edu-index .hero-inner,.homepage .hero-inner,.hero-inner{flex-direction:column}}.unicode{font-family:Bravura Text}.ke{width:30%;padding:30px;background-color:#91322c73;margin-left:10px;color:#fff;border-radius:20px}.ke .title{font-size:22px;font-weight:700}.ke .description{font-size:15px;opacity:.6}.ke a{color:#fff}.ke:hover{background-color:#3981ff}.ke:hover a{color:#fff}.fankui{background-color:#249f9f2f;margin-top:30px}.h1{font-size:64px;margin-top:0}.free{background-color:#3981ff;display:inline-block;border-radius:9999px;margin:2rem 0 0}.free a{color:#5a4edf;background:white;border-radius:9999px;text-decoration:none;font-weight:700;font-size:1.2rem;border:2px solid transparent;transition:border-color .2s ease,background .2s ease,color .2s ease;box-shadow:0 1rem 7rem #0000004f;cursor:pointer;padding:.8rem 2rem}.free a:hover{background-color:#5a4edf;color:#fff;border:2px solid #ffffff}#features{background:hsl(245deg 5% 16%);background-color:#27272b;color:#fff}#sponsor{background-color:#1f1f23;color:#fff}#sponsor img{width:250px;margin-right:10px}#sponsor h3{font-size:1.5rem}.content{width:1280px;margin:0 auto;padding:5rem 0}.pricing[data-v-93ea9dff]{display:flex;width:960px;margin:0 auto;min-height:600px}@media (max-width: 767px){.pricing[data-v-93ea9dff]{flex-direction:column;width:100%}}.pricing div[data-v-93ea9dff]{flex:1;background-color:#fafafb;margin:20px;padding:20px}.pricing div h2[data-v-93ea9dff]{text-align:center;color:#2f3446}.users[data-v-f3c3c3a3]{min-height:800px;margin-top:56px;padding:20px}.user .user-scores[data-v-f3c3c3a3]{width:1174px;margin:30px auto}.user .users-header .user-avatar[data-v-f3c3c3a3]{width:67px;height:67px;margin:0 auto;border-radius:67px;border:4px solid #fff;overflow:hidden}.user .users-header .user-avatar img[data-v-f3c3c3a3]{width:100%}.user .users-header[data-v-f3c3c3a3]{height:300px;background:linear-gradient(135deg,#d046bf 0,#743683 100%);text-align:center;padding-top:30px}.control-bar .control-bar-left[data-v-142758cb]{display:flex;align-items:center}.control-bar .control-bar-right[data-v-142758cb]{display:flex;align-items:center;width:100%;justify-content:space-between}.control-bar .control-bar-right .right[data-v-142758cb]{display:flex;align-items:center}.control-bar[data-v-142758cb]{-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none;user-select:none;background-color:#36383d;border-bottom:1px solid #1d1d1d;display:flex;align-items:center;justify-content:space-between;height:50px}@media (max-width: 767px){.control-bar[data-v-142758cb]{flex-direction:column}}.noteinfo-jianpu[data-v-95c298b5]{display:flex}.virtual-guitar-wrap[data-v-45e5ab9b]{width:20px;overflow:hidden}.virtual-guitar[data-v-45e5ab9b]{background-color:#4d4d4d;font-size:13px;position:relative}.virtual-guitar .wrap[data-v-45e5ab9b]{width:100%;height:60px}.virtual-guitar .pos[data-v-45e5ab9b]{border-left:2px solid #c5c5c5;display:flex;width:800px;flex-wrap:wrap}.virtual-guitar .pos>div[data-v-45e5ab9b]{border-right:1px solid #c5c5c5;cursor:pointer;z-index:96;width:30px;height:10px}.virtual-guitar .pos>div[data-v-45e5ab9b]:nth-child(25){border:none;background-color:#00000014}.virtual-guitar .pos>div[data-v-45e5ab9b]:nth-child(50){border:none;background-color:#00000014}.virtual-guitar .pos>div[data-v-45e5ab9b]:nth-child(75){border:none;background-color:#00000014}.virtual-guitar .pos>div[data-v-45e5ab9b]:nth-child(100){border:none;background-color:#00000014}.virtual-guitar .pos>div[data-v-45e5ab9b]:nth-child(125){border:none;background-color:#00000014}.virtual-guitar .pos>div[data-v-45e5ab9b]:nth-child(150){border:none;background-color:#00000014}.virtual-guitar .pos>div[data-v-45e5ab9b]:hover{background-color:#faebd7}.virtual-guitar .string[data-v-45e5ab9b]{width:100%;height:1px;background-color:#cacaca;position:absolute;left:0}.virtual-guitar .string1[data-v-45e5ab9b]{top:5px}.virtual-guitar .string2[data-v-45e5ab9b]{top:15px}.virtual-guitar .string3[data-v-45e5ab9b]{top:25px}.virtual-guitar .string4[data-v-45e5ab9b]{top:35px}.virtual-guitar .string5[data-v-45e5ab9b]{top:45px}.virtual-guitar .string6[data-v-45e5ab9b]{top:55px}.virtual-guitar .circle[data-v-45e5ab9b]{width:6.666px;height:6.666px;border-radius:6.666px;background-color:#d3dce2;position:absolute}.virtual-guitar .circle1[data-v-45e5ab9b]{left:74px;top:27px}.virtual-guitar .circle2[data-v-45e5ab9b]{left:135px;top:27px}.virtual-guitar .circle3[data-v-45e5ab9b]{left:196px;top:27px}.virtual-guitar .circle4[data-v-45e5ab9b]{left:257px;top:27px}.virtual-guitar .circle5[data-v-45e5ab9b]{left:349px;top:7px}.virtual-guitar .circle6[data-v-45e5ab9b]{left:349px;top:47px}.virtual-guitar .circle7[data-v-45e5ab9b]{left:440px;top:27px}.virtual-guitar .circle8[data-v-45e5ab9b]{left:500px;top:27px}.virtual-guitar .circle9[data-v-45e5ab9b]{left:562px;top:27px}.virtual-guitar .circle10[data-v-45e5ab9b]{left:623px;top:27px}.virtual-guitar .circle11[data-v-45e5ab9b]{left:719px;top:7px}.virtual-guitar .circle12[data-v-45e5ab9b]{left:719px;top:47px}.status-bar[data-v-1084c4c8]{-o-user-select:none;-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none;-khtml-user-select:none;user-select:none;background-color:#323232;background-color:#36383d;color:#fff;display:flex;flex-direction:column;padding:5px}.status-bar .top[data-v-1084c4c8]{display:flex}.status-bar .bottom[data-v-1084c4c8]{margin-top:5px}.noteinfo-tab[data-v-1084c4c8]{display:flex;flex-direction:column}.chords[data-v-1084c4c8]{display:flex;color:#c8c8c8;align-items:center;justify-content:center}.noteinfo-tab-bottom[data-v-1084c4c8]{display:flex;margin-top:5px}.recthover[data-v-0887601d]{fill:#0000;cursor:pointer;transition:.2s}.recthover[data-v-0887601d]:hover{fill:#0000001a;stroke:#000;stroke-width:2}.rectactive[data-v-0887601d]{fill:#faebd7;cursor:pointer;transition:.2s;opacity:.4;stroke:#000;stroke-width:2}.rectactiveselect[data-v-0887601d]{fill:#be2b2b;cursor:pointer;transition:.2s;opacity:.4;stroke:#000;stroke-width:2}.recthover[data-v-e4099ab9]{fill:#0000;cursor:pointer;transition:.2s}.recthover[data-v-e4099ab9]:hover{fill:#0000001a}.rectactive[data-v-e4099ab9]{fill:#faebd7;cursor:pointer;transition:.2s;opacity:.4;stroke:#000;stroke-width:2}.rectactiveselect[data-v-e4099ab9]{fill:#be2b2b;cursor:pointer;transition:.2s;opacity:.4;stroke:#000;stroke-width:2}.score-wrap[data-v-91ec46e9]{flex:1;overflow:auto;-o-user-select:none;-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none;-khtml-user-select:none;user-select:none}.score-wrap .score[data-v-91ec46e9]{display:block;margin:0 auto}.magicbar[data-v-900e59f2]{overflow:hidden;background:#ffffff;transition:height .1s ease-in-out;font-size:13px}.magicbar .magicbar-wrap .mMeasure[data-v-900e59f2]{padding:5px 0}.magicbar .magicbar-wrap .mMeasure1[data-v-900e59f2]{padding:0 0 5px}.magicbar .magicbar-wrap .title[data-v-900e59f2]{width:140px;display:inline-block}.magicbar .magicbar-wrap .content[data-v-900e59f2]{width:400px;display:inline-block}.magicbar .magicbar-wrap .right[data-v-900e59f2]{width:50px;display:inline-block}.magicbar .magicbar-wrap .beat[data-v-900e59f2]{padding:5px 0 0}.magicbar .magicbar-wrap .beat img[data-v-900e59f2]{width:60px;border:1px solid #000;margin:0 5px}.magicbar .magicbar-wrap[data-v-900e59f2]{padding:5px}.magicbar select[data-v-900e59f2]{background:#4975cd;border:0;color:#fff;outline:none}.magicbar button[data-v-900e59f2]{border:0;background:#545454;color:#c8c8c8}.dialog-wrap[data-v-15b32dac]{position:fixed;top:0;right:0;bottom:0;left:0;z-index:99;height:100%;overflow:auto;align-items:center;display:flex;flex-direction:column;justify-content:center}.dialog-wrap .bg[data-v-15b32dac]{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;height:100%;background-color:#00000080;overflow:auto;align-items:center;display:flex;flex-direction:column;justify-content:center}.dialog[data-v-15b32dac]{z-index:101;position:relative;margin:0 auto 50px;background:#fff;border-radius:2px;box-shadow:0 1px 3px #0000004d;padding:20px}.pop-help[data-v-0057b537]{width:1200px;height:600px;overflow-y:scroll}.popinfo .popinfo-title[data-v-0057b537]{padding-bottom:30px;font-size:28px}.popinfo .popinfo-bottom[data-v-0057b537]{padding-top:20px;display:flex;justify-content:flex-end}.popinfo .popinfo-bottom button[data-v-0057b537]{margin-left:10px;background-color:#373737;color:#fff;border:none;padding:10px 20px}.score-info p.lable[data-v-0057b537]{width:80px;font-size:16px;padding:0;float:left;margin:0}.score-info input[data-v-0057b537]{background:#fff;border:1px solid #999;height:30px;width:400px}.score-info[data-v-0057b537]{width:600px}.score-info .form-item[data-v-0057b537]{margin:5px 0}.drag[data-v-61c7b57e]{position:fixed;top:500px;left:500px;background:rgb(35,35,35);cursor:pointer}.drag .close[data-v-61c7b57e]{border:0;border-radius:20px;background:rgb(223,95,88);padding:0;width:16px;height:16px;margin-bottom:10px;margin-top:10px;margin-left:10px}.drag .close[data-v-61c7b57e]:focus{outline:0}.lyric-wrap[data-v-c73fe09e]{background-color:#4d4d4d;width:300px;height:300px;color:#fff;padding:10px}.lyric-wrap textarea[data-v-c73fe09e]{border:0;resize:none;width:280px;height:100%;padding:10px}.lyric-wrap textarea[data-v-c73fe09e]:focus{outline:0}.area-wrap[data-v-c73fe09e]{width:300px;height:200px}.active[data-v-c73fe09e]{background-color:#3152a9;color:#fff}.chord-wrap[data-v-48d3ead0]{background-color:#4d4d4d;color:#fff;width:500px;height:500px;padding:10px;position:relative}.top[data-v-48d3ead0]{display:flex}.left[data-v-48d3ead0]{margin-right:20px}.bottom[data-v-48d3ead0]{text-align:right}.chordku[data-v-48d3ead0]{height:300px;overflow-x:scroll}.chordkusvgchord[data-v-48d3ead0]{height:300px}.track-wrap[data-v-20d9eceb]{background-color:#4d4d4d;color:#fff;width:550px;height:500px;padding:10px;position:relative}.left[data-v-20d9eceb]{margin-right:20px}.bottom[data-v-20d9eceb]{position:absolute;bottom:10px;right:10px}.active[data-v-20d9eceb]{color:red}.virtual-guitar-wrap[data-v-4d84cd56]{width:920px}.virtual-guitar[data-v-4d84cd56]{background-color:#4d4d4d;font-size:13px;position:relative}.virtual-guitar .pos[data-v-4d84cd56]{border-left:2px solid #c5c5c5;display:flex;width:800px;flex-wrap:wrap}.virtual-guitar .pos>div[data-v-4d84cd56]{border-right:1px solid #c5c5c5;cursor:pointer;z-index:96;width:30px;height:20px}.virtual-guitar .pos>div[data-v-4d84cd56]:nth-child(25){border:none;background-color:#00000014}.virtual-guitar .pos>div[data-v-4d84cd56]:nth-child(50){border:none;background-color:#00000014}.virtual-guitar .pos>div[data-v-4d84cd56]:nth-child(75){border:none;background-color:#00000014}.virtual-guitar .pos>div[data-v-4d84cd56]:nth-child(100){border:none;background-color:#00000014}.virtual-guitar .pos>div[data-v-4d84cd56]:nth-child(125){border:none;background-color:#00000014}.virtual-guitar .pos>div[data-v-4d84cd56]:nth-child(150){border:none;background-color:#00000014}.virtual-guitar .pos>div[data-v-4d84cd56]:hover{background-color:#faebd7}.virtual-guitar .string[data-v-4d84cd56]{width:100%;height:1px;background-color:#cacaca;position:absolute;left:0}.virtual-guitar .string1[data-v-4d84cd56]{top:10px}.virtual-guitar .string2[data-v-4d84cd56]{top:30px}.virtual-guitar .string3[data-v-4d84cd56]{top:50px}.virtual-guitar .string4[data-v-4d84cd56]{top:70px}.virtual-guitar .string5[data-v-4d84cd56]{top:90px}.virtual-guitar .string6[data-v-4d84cd56]{top:110px}.virtual-guitar .circle[data-v-4d84cd56]{width:12px;height:12px;border-radius:12px;background-color:#d3dce2;position:absolute}.virtual-guitar .circle1[data-v-4d84cd56]{left:74px;top:54px}.virtual-guitar .circle2[data-v-4d84cd56]{left:135px;top:54px}.virtual-guitar .circle3[data-v-4d84cd56]{left:196px;top:54px}.virtual-guitar .circle4[data-v-4d84cd56]{left:257px;top:54px}.virtual-guitar .circle5[data-v-4d84cd56]{left:349px;top:14px}.virtual-guitar .circle6[data-v-4d84cd56]{left:349px;top:94px}.virtual-guitar .circle7[data-v-4d84cd56]{left:440px;top:54px}.virtual-guitar .circle8[data-v-4d84cd56]{left:500px;top:54px}.virtual-guitar .circle9[data-v-4d84cd56]{left:562px;top:54px}.virtual-guitar .circle10[data-v-4d84cd56]{left:623px;top:54px}.virtual-guitar .circle11[data-v-4d84cd56]{left:719px;top:14px}.virtual-guitar .circle12[data-v-4d84cd56]{left:719px;top:94px}.virtual-piano-wrap[data-v-dc40bae5]{width:920px}.virtual-piano[data-v-dc40bae5]{-moz-user-select:none;-o-user-select:none;-khtml-user-select:none;-webkit-user-select:none;-ms-user-select:none;user-select:none;background-color:#4d4d4d;display:flex}.virtual-piano>div[data-v-dc40bae5]{position:relative;cursor:pointer}.virtual-piano>div div[data-v-dc40bae5]{position:absolute;left:0;right:0;bottom:11px;text-align:center;color:#7e8999}.virtual-piano-white[data-v-dc40bae5]{height:120px;width:16px;background-color:#f7f7f7;margin-right:1px}.virtual-piano-black[data-v-dc40bae5]{height:80px;width:11px;background-color:#282c32;margin-left:-5.5px;margin-right:-5.5px;z-index:1;position:relative}.muse[data-v-2b291066]{display:flex;flex-direction:column;height:100%;background-color:#222326}.score[data-v-762505d3]{background-color:#fafafb;padding:100px 0;text-align:center}@font-face{font-family:v-sans;font-weight:400;src:url(/assets/LatoLatin-Regular-ddd4ef7f.woff2)}@font-face{font-family:v-sans;font-weight:600;src:url(/assets/LatoLatin-Semibold-267eef30.woff2)}