.wx_btn{right:20px;top:40%}.wx_btn,.wx_close{position:fixed;z-index:999}.wx_close{bottom:20%;right:50%}.wx_image{height:100%;margin:0 auto;width:100%}.quaver_body{position:fixed;left:0;right:0;background-color:rgba(255,107,0,.1);background-size:800% 800%;-webkit-animation:gradientAnimation 10s ease infinite;animation:gradientAnimation 10s ease infinite;overflow-y:scroll}@-webkit-keyframes gradientAnimation{0%{background-position:0 50%}50%{background-position:100% 50%}to{background-position:0 50%}}@keyframes gradientAnimation{0%{background-position:0 50%}50%{background-position:100% 50%}to{background-position:0 50%}}.navbar{height:48px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:distribute;justify-content:space-around;-webkit-box-shadow:2px 4px 12px rgb(0 0 0/8%);box-shadow:2px 4px 12px rgb(0 0 0/8%);line-height:60px}.shadow-box{border-radius:18px;-webkit-box-shadow:4px 8px 12px rgb(0 0 0/8%);box-shadow:4px 8px 12px rgb(0 0 0/8%)}.height-100{min-height:100vh}.bg-cyan{background-color:#1cbbb4;color:var(--white)}.text-cyan{color:#1cbbb4}.text-white{color:#fff}.text-gray{color:#6b6b6b}.bg-orange{color:#f35600}.text-primary{color:#6b6b6b}.text-secondary{color:#f5f5f5}.active-item{border-bottom:2px solid #f35600}.wx_dialog{position:fixed;z-index:999;top:0;left:0;right:0;height:100vh;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.qrcode-container{text-align:center}.wx_image{max-width:60%;max-height:60%;margin-bottom:20px}.qrcode-text{font-size:20px;color:#6b6b6b}.tabbar{-ms-flex-pack:distribute;justify-content:space-around;position:fixed;bottom:0;left:0;right:0;height:60px;background-color:#f7f7f7;-webkit-box-shadow:0 -2px 5px rgba(0,0,0,.1);box-shadow:0 -2px 5px rgba(0,0,0,.1)}.tabbar,.tabbar-item{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.tabbar-item{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;text-decoration:none}.tabbar-icon{width:24px;height:24px;background-size:cover}.home-icon{background-image:url(https://qiniu.lesstk.com/quaver/images/home.png)}.training-icon{background-image:url(https://qiniu.lesstk.com/quaver/images/plan.png)}.profile-icon{background-image:url(https://qiniu.lesstk.com/quaver/images/user.png)}.tabbar-label{font-size:12px;color:#666;margin-top:4px}*{margin:0;padding:0;-webkit-box-sizing:border-box;box-sizing:border-box}.quaver_body{width:100%;height:100vh;background:#000;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Helvetica Neue,Arial,sans-serif;overflow:hidden}.back-blur{width:100%;height:100%;background:radial-gradient(ellipse at center top,rgba(255,107,0,.1) 0,transparent 50%),radial-gradient(ellipse at center bottom,rgba(255,107,0,.05) 0,transparent 50%),-webkit-gradient(linear,left top,left bottom,from(#0a0a0a),to(#111));background:radial-gradient(ellipse at center top,rgba(255,107,0,.1) 0,transparent 50%),radial-gradient(ellipse at center bottom,rgba(255,107,0,.05) 0,transparent 50%),linear-gradient(180deg,#0a0a0a,#111);position:relative}.align-center,.height-100{height:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.align-center{-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.tuner-container{width:100%;max-width:800px;padding:20px}.tips{font-size:32px}svg{-webkit-filter:drop-shadow(0 10px 40px rgba(255,107,0,.1));filter:drop-shadow(0 10px 40px rgba(255,107,0,.1))}svg text{-webkit-transition:all .3s cubic-bezier(.4,0,.2,1);transition:all .3s cubic-bezier(.4,0,.2,1)}svg text.target{-webkit-filter:drop-shadow(0 0 20px rgba(255,107,0,.8));filter:drop-shadow(0 0 20px rgba(255,107,0,.8))}.cu-modal{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.9);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;z-index:9999;opacity:0;visibility:hidden;-webkit-transition:all .3s ease;transition:all .3s ease}.cu-modal.show{opacity:1;visibility:visible}.cu-dialog{background:linear-gradient(135deg,rgba(40,40,40,.95),hsla(0,0%,8%,.95));border:1px solid hsla(0,0%,100%,.1);border-radius:24px;padding:40px;text-align:center;max-width:400px;-webkit-backdrop-filter:blur(40px);backdrop-filter:blur(40px);-webkit-box-shadow:0 30px 100px rgba(0,0,0,.5),inset 0 0 60px rgba(255,107,0,.05);box-shadow:0 30px 100px rgba(0,0,0,.5),inset 0 0 60px rgba(255,107,0,.05);-webkit-transform:scale(.9);transform:scale(.9);-webkit-transition:-webkit-transform .3s cubic-bezier(.4,0,.2,1);transition:-webkit-transform .3s cubic-bezier(.4,0,.2,1);transition:transform .3s cubic-bezier(.4,0,.2,1);transition:transform .3s cubic-bezier(.4,0,.2,1),-webkit-transform .3s cubic-bezier(.4,0,.2,1)}.cu-modal.show .cu-dialog{-webkit-transform:scale(1);transform:scale(1)}.confirm-body{color:#fff}.confirm-body>div:first-child{font-size:20px;font-weight:500;margin-bottom:8px}.confirm-body>div:nth-child(2){font-size:16px;color:hsla(0,0%,100%,.7);margin-bottom:30px}.confirm-btn{background:linear-gradient(135deg,#ff6b00,#ff8c00);border:none;border-radius:14px;padding:14px 40px;color:#fff;font-size:16px;font-weight:500;cursor:pointer;-webkit-transition:all .3s ease;transition:all .3s ease;-webkit-box-shadow:0 8px 32px rgba(255,107,0,.3);box-shadow:0 8px 32px rgba(255,107,0,.3)}.confirm-btn:hover{-webkit-transform:translateY(-2px);transform:translateY(-2px);-webkit-box-shadow:0 12px 40px rgba(255,107,0,.4);box-shadow:0 12px 40px rgba(255,107,0,.4)}.confirm-btn:active{-webkit-transform:translateY(0);transform:translateY(0)}@media (max-width:768px){.tuner-container{padding:15px}.tuner-display{padding:25px;border-radius:20px}.tips{font-size:24px}svg{width:80%!important}.cu-dialog{padding:30px;margin:20px}}@-webkit-keyframes pulse{0%{-webkit-transform:scale(1);transform:scale(1);opacity:1}50%{-webkit-transform:scale(1.05);transform:scale(1.05);opacity:.8}to{-webkit-transform:scale(1);transform:scale(1);opacity:1}}.note.active{-webkit-animation:pulse 2s ease-in-out infinite;animation:pulse 2s ease-in-out infinite}@-webkit-keyframes glow{0%{-webkit-box-shadow:0 0 20px rgba(255,107,0,.5);box-shadow:0 0 20px rgba(255,107,0,.5)}50%{-webkit-box-shadow:0 0 40px rgba(255,107,0,.8);box-shadow:0 0 40px rgba(255,107,0,.8)}to{-webkit-box-shadow:0 0 20px rgba(255,107,0,.5);box-shadow:0 0 20px rgba(255,107,0,.5)}}@keyframes glow{0%{-webkit-box-shadow:0 0 20px rgba(255,107,0,.5);box-shadow:0 0 20px rgba(255,107,0,.5)}50%{-webkit-box-shadow:0 0 40px rgba(255,107,0,.8);box-shadow:0 0 40px rgba(255,107,0,.8)}to{-webkit-box-shadow:0 0 20px rgba(255,107,0,.5);box-shadow:0 0 20px rgba(255,107,0,.5)}}.meter-mid-line{-webkit-animation:glow 2s ease-in-out infinite;animation:glow 2s ease-in-out infinite}@-webkit-keyframes fadeIn{0%{opacity:0;-webkit-transform:translateY(20px);transform:translateY(20px)}to{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0;-webkit-transform:translateY(20px);transform:translateY(20px)}to{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}.tuner-display{-webkit-animation:fadeIn .6s ease-out;animation:fadeIn .6s ease-out;background:hsla(0,0%,100%,.03);border:1px solid hsla(0,0%,100%,.08);border-radius:24px;padding:40px;-webkit-backdrop-filter:blur(40px);backdrop-filter:blur(40px);-webkit-box-shadow:0 20px 80px rgba(0,0,0,.3),inset 0 0 100px rgba(255,107,0,.03);box-shadow:0 20px 80px rgba(0,0,0,.3),inset 0 0 100px rgba(255,107,0,.03)}.main-note-display{width:100%;height:200px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;margin-bottom:30px;position:relative;background:radial-gradient(ellipse at center,rgba(255,107,0,.1) 0,transparent 70%)}.current-note-large{font-size:120px;font-weight:700;color:#fff;position:relative;display:inline-block;text-shadow:0 0 40px rgba(255,107,0,.6);-webkit-transition:all .3s cubic-bezier(.4,0,.2,1);transition:all .3s cubic-bezier(.4,0,.2,1);-webkit-animation:pulse 2s ease-in-out infinite;animation:pulse 2s ease-in-out infinite}.current-note-large.in-tune{color:#0f8;text-shadow:0 0 40px rgba(0,255,136,.6)}.current-note-large.sharp{color:#ff6b00;text-shadow:0 0 40px rgba(255,107,0,.8)}.current-note-large.flat{color:#00b4ff;text-shadow:0 0 40px rgba(0,180,255,.6)}.note-sharp-large{font-size:60px;position:absolute;top:10px;right:-40px}.note-octave-large{font-size:40px;position:absolute;bottom:20px;right:-40px;opacity:.8}.frequency-display{font-size:48px;font-weight:200;background:-webkit-gradient(linear,left top,right top,from(#ff6b00),to(#ff8c00));background:linear-gradient(90deg,#ff6b00,#ff8c00);-webkit-background-clip:text;-webkit-text-fill-color:transparent;letter-spacing:2px}.divider{height:1px;background:-webkit-gradient(linear,left top,right top,from(transparent),color-stop(hsla(0,0%,100%,.1)),to(transparent));background:linear-gradient(90deg,transparent,hsla(0,0%,100%,.1),transparent);margin:20px 0}.tips{text-align:center;font-size:28px;font-weight:300;margin:20px 0;letter-spacing:1px;-webkit-transition:all .3s ease;transition:all .3s ease}.line-wrapper{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;gap:6px;padding:30px 0;position:relative}.meter-line{width:4px;height:24px;background:hsla(0,0%,100%,.1);border-radius:2px;-webkit-transition:all .3s ease;transition:all .3s ease}.meter-long-line{height:40px;background:hsla(0,0%,100%,.2)}.meter-mid-line{width:6px;height:48px;background:rgba(0,255,136,.8);-webkit-box-shadow:0 0 20px rgba(0,255,136,.5);box-shadow:0 0 20px rgba(0,255,136,.5)}.active-line{background:#ff6b00;-webkit-box-shadow:0 0 20px rgba(255,107,0,.6);box-shadow:0 0 20px rgba(255,107,0,.6);-webkit-transform:scaleY(1.2);transform:scaleY(1.2)}@keyframes pulse{0%,to{-webkit-transform:scale(1);transform:scale(1);opacity:1}50%{-webkit-transform:scale(1.02);transform:scale(1.02);opacity:.9}}@media (max-width:768px){.main-note-display{height:150px}.current-note-large{font-size:80px}.note-sharp-large{font-size:40px;right:-30px}.note-octave-large{font-size:30px;right:-30px}.frequency-display{font-size:36px}}.instrument-dropdown-container{position:relative;margin-bottom:40px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.instrument-dropdown{background:hsla(0,0%,100%,.05);border:1px solid hsla(0,0%,100%,.1);border-radius:16px;padding:16px 24px;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:12px;cursor:pointer;-webkit-transition:all .3s cubic-bezier(.4,0,.2,1);transition:all .3s cubic-bezier(.4,0,.2,1);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);min-width:160px;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.instrument-dropdown:hover{background:hsla(0,0%,100%,.08);border-color:rgba(255,107,0,.3);-webkit-transform:translateY(-2px);transform:translateY(-2px);-webkit-box-shadow:0 8px 32px rgba(255,107,0,.1);box-shadow:0 8px 32px rgba(255,107,0,.1)}.instrument-dropdown.active{background:hsla(0,0%,100%,.1);border-color:rgba(255,107,0,.5);-webkit-box-shadow:0 8px 32px rgba(255,107,0,.2);box-shadow:0 8px 32px rgba(255,107,0,.2)}.selected-value{color:#fff;font-size:18px;font-weight:500;letter-spacing:.5px}.dropdown-arrow{-webkit-transition:-webkit-transform .3s ease;transition:-webkit-transform .3s ease;transition:transform .3s ease;transition:transform .3s ease,-webkit-transform .3s ease;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.instrument-dropdown.active .dropdown-arrow{-webkit-transform:rotate(180deg);transform:rotate(180deg)}.dropdown-options{position:absolute;top:calc(100% + 8px);left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%);background:hsla(0,0%,8%,.98);-webkit-backdrop-filter:blur(30px);backdrop-filter:blur(30px);border:1px solid hsla(0,0%,100%,.1);border-radius:16px;padding:8px;min-width:160px;-webkit-box-shadow:0 20px 60px rgba(0,0,0,.5);box-shadow:0 20px 60px rgba(0,0,0,.5);z-index:1000;max-height:300px;overflow-y:auto}.dropdown-option{padding:14px 20px;border-radius:12px;color:hsla(0,0%,100%,.8);font-size:16px;cursor:pointer;-webkit-transition:all .2s ease;transition:all .2s ease;margin:2px 0}.dropdown-option:hover{background:rgba(255,107,0,.15);color:#fff;-webkit-transform:translateX(4px);transform:translateX(4px)}.dropdown-option.selected{background:rgba(255,107,0,.25);color:#ff6b00;font-weight:500}.tuning-dropdown-container{position:relative;margin-bottom:40px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.tuning-dropdown{border:1px solid hsla(0,0%,100%,.1);padding:16px 24px;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:12px;cursor:pointer;-webkit-transition:all .3s cubic-bezier(.4,0,.2,1);transition:all .3s cubic-bezier(.4,0,.2,1);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);min-width:160px;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.pitch-list,.tuning-dropdown{background:hsla(0,0%,100%,.05);border-radius:16px}.pitch-list{-ms-flex-pack:distribute;justify-content:space-around;border:1px solid hsla(0,0%,100%,.1);margin-bottom:20px}.pitch-item,.pitch-list{display:-webkit-box;display:-ms-flexbox;display:flex}.pitch-item{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding:10px;border-radius:8px;-webkit-transition:all .3s ease;transition:all .3s ease;width:50px}.pitch-item-note{font-size:16px;font-weight:700;color:hsla(0,0%,100%,.8);margin-bottom:5px}.pitch-item-string{font-size:12px;color:hsla(0,0%,100%,.5)}.pitch-item.target{background:rgba(255,107,0,.25);-webkit-transform:scale(1.05);transform:scale(1.05)}.pitch-item.target .pitch-item-note{color:#ff6b00;font-weight:600}.pitch-item.target .pitch-item-string{color:rgba(255,107,0,.7)}@media (max-width:480px){.instrument-selector{width:100vw;max-width:100%;margin:0 -20px;display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-pack:distribute;justify-content:space-around;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}.dropdown-options{width:calc(100% - 40px);left:20px;-webkit-transform:none;transform:none}}