html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:"";content:none}table{border-collapse:collapse;border-spacing:0}html,body{padding:0;margin:0;width:100%;min-width:1000px;min-height:750px}html{overflow:auto}body{overflow:visible}body,input,textarea,button{font-family:"Poppins","Microsoft YaHei","Noto Sans SC",sans-serif;font-size:19px}body{background:#313390}h1{font-size:25px;font-weight:bold;line-height:1.5;margin-bottom:1rem}p{line-height:1.4}a{color:#ff8976}a:hover{background:rgb(36.0518134715,37.5233160622,105.9481865285);text-decoration:none}button,.button{display:inline-block;text-decoration:none;border:0;-webkit-appearance:none;background:#ff8976;color:#fff;cursor:pointer;padding:.3rem 1rem;border-radius:6px;font-weight:bold;text-transform:uppercase;color:#313390;transform:translateY(0);transition:transform .3s,box-shadow .3s}button:focus,.button:focus{outline:0}.button-large{font-size:1.4rem;padding:.6rem 1.5rem}button:disabled{color:#fff}button:not([disabled]):hover{transform:translateY(-2px);box-shadow:0px 10px 20px rgba(0,0,0,.2)}.progress{background:none;border:6px solid #ff8976}.page-start{display:flex;min-height:100vh;flex-direction:column}.start-content{text-align:center;display:flex;flex-direction:column;justify-content:center;flex:1}.start-logo-image{max-width:500px}.start-subtitle{margin-top:-50px;margin-bottom:52px;color:#fff;font-size:19px;font-weight:bold;text-transform:uppercase;color:hsla(0,0%,100%,.7)}.start-footer{display:flex;align-items:left}.start-footer-text{margin-left:20px;margin-bottom:15px;color:hsla(0,0%,100%,.7);font-size:15px}.page-tutorial{min-height:100vh}.tutorial-part{display:none;min-height:100vh;flex-direction:column;align-items:center;justify-content:center;line-height:1.8rem;color:#313390}.tutorial-part-content{display:flex;flex-direction:column;justify-content:space-between;text-align:center;background:#fff;width:600px;height:400px;padding:30px;border-radius:30px;box-shadow:0 0 60px rgba(0,0,0,.7)}.tutorial-image img{height:200px}.page-main{min-height:100vh;display:none;flex-direction:column;justify-content:flex-start}.main-topbar{display:flex;flex-direction:row;justify-content:space-between;width:100%;padding:0 20px;box-sizing:border-box}.main-topbar-buttons{padding:13px 0;margin-right:15px}.main-topbar-buttons button{margin-right:10px}.button-restart img{width:16px}.button-info img{width:10px}.main-topbar-logo{width:250px}.video-outer{display:flex;flex:1;flex-direction:column;align-items:center;justify-content:center}.video-border{position:relative;border-radius:50px;overflow:hidden;border:10px solid #ff8976;box-shadow:0px 10px 20px rgba(0,0,0,.2);min-width:600px;min-height:500px;transition:border-color 1.5s ease-in-out,box-shadow 1.5s ease-in-out}.video-container{min-width:600px;min-height:500px;transform:scale(1);transition:transform 1.5s ease-in-out}.calibration-overlay{position:absolute;min-width:600px;width:600px;height:500px;min-height:500px;background:rgba(255,0,0,.3);display:flex;align-items:flex-end;justify-content:center}.calibration-overlay img{width:500px}.calibration-overlay.success{background:rgba(0,128,0,.3)}.conducting-overlay{display:none;position:absolute;min-width:600px;width:600px;height:500px;min-height:500px;background:rgba(27,25,111,.33);z-index:1;pointer-events:none}.instrument-zones{display:flex;width:100%;height:100%}.instrument-zone{display:flex;justify-content:center;align-items:center;box-sizing:border-box;border-right:3px dashed hsla(0,0%,100%,.35);background:hsla(0,0%,100%,.03)}.instrument-zone:nth-child(even){background:rgba(255,137,118,.08)}.instrument-zone:last-child{border-right:0}.instrument-zone-label{writing-mode:vertical-rl;text-orientation:mixed;color:hsla(0,0%,100%,.78);background:rgba(27,25,111,.62);border-radius:22px;padding:18px 12px;font-size:38px;font-weight:bold;line-height:1.15;letter-spacing:4px}.video-container canvas{position:relative;z-index:2;margin-bottom:-3px}.instructions{color:#fff;margin-top:25px;opacity:1;transition:opacity 1.5s ease-in-out}.orchestra-container{position:relative;max-height:0;height:0;min-height:0;overflow:hidden;opacity:0;pointer-events:none;transition:height 1.5s ease-in-out,max-height 1.5s ease-in-out,opacity 1.5s ease-in-out}.countdown-overlay{display:flex;align-items:center;justify-content:center;width:600px;height:500px;position:absolute;opacity:0;transition:opacity 1.5s ease-in-out}.countdown-overlay p{font-size:400px;color:#fff;text-shadow:0 5px 30px rgba(0,0,0,.3)}.timebar{display:flex;height:64px;align-items:center;padding-left:95px;opacity:0;transition:opacity 2.5s ease-in-out}.video-label{position:absolute;color:hsla(0,0%,100%,.5);font-weight:bold;font-size:58px;width:600px;text-align:center;opacity:0;transition:opacity 2.5s ease-in-out;transition-delay:2.5s}.video-label.top{top:-80px}.video-label.bottom{bottom:-80px}.tempo-icon-container{position:absolute;bottom:30px;display:flex;align-items:center;justify-content:center;width:290px;color:#fff;z-index:300}.tempo-icon img{height:40px;margin-bottom:4px}.tempo-icon{opacity:.6;display:flex;flex-direction:column;align-items:center;font-weight:bold;justify-content:center}.tempo-icon-label{font-size:14px;color:hsla(0,0%,100%,.6)}.song-progress{width:300px;border-radius:20px;height:25px;text-align:center;color:#fff;font-weight:bold;font-size:14px;line-height:25px}.orchestra{margin-bottom:-170px;width:1000px;margin:0 auto}.tempo-meter-container{position:absolute;padding-top:272px;min-width:1000px;width:100%;display:flex;justify-content:center}.tempo-meter-container-inner{width:290px;height:145px}.tempo-meter-clipping-box{width:290px;height:145px;overflow:hidden;transform:scaleY(0.8)}.tempo-meter{position:relative;width:290px;height:145px;z-index:150;border-bottom:10px solid #4058d3;border-radius:145px 145px 0 0;transform-origin:bottom center;transform:rotateZ(-178deg);transition:border-color .5s}.tempo-meter-background{position:absolute;top:0;width:290px;height:145px;z-index:100;background:#2b2984;border-radius:145px 145px 0 0}.tempo-meter.stopped{border-color:#4c4aa0}.tempo-meter.fast{border-color:#a20258}.conducting-mode .timebar{opacity:1}.conducting-mode .countdown-overlay{opacity:1}.conducting-mode .video-outer{flex:0 0 auto;justify-content:flex-start;margin-top:10px}.conducting-mode .video-container{transform:scale(0.4);transform-origin:top center;margin-bottom:-300px}.conducting-mode .video-label{opacity:1}.conducting-mode .video-border{border-color:rgba(255,137,118,0);box-shadow:0px 10px 20px rgba(0,0,0,0)}.conducting-mode .orchestra-container{height:440px;max-height:440px;min-height:440px;overflow:visible;opacity:1;pointer-events:auto}.conducting-mode .instructions{opacity:0}.page-info{display:none;position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(49,51,144,.9);z-index:1000;flex-direction:column;justify-content:space-between;align-items:center;padding:50px;box-sizing:border-box;overflow-y:scroll}.info-buttons{width:100%}.info-content-outer{height:100%;width:100%;display:flex;align-items:center;justify-content:center}.info-content{color:#fff;text-align:center;width:60%;max-width:600px}.info-content p{font-size:16px;padding-bottom:20px}.button-info-close{margin-top:30px}.page-finish{display:none;position:fixed;left:0;right:0;top:0;bottom:0;z-index:1000;background:rgba(49,51,144,.9);opacity:0;transition:opacity .7s ease-in-out}.finish-content-outer{display:flex;position:fixed;z-index:1100;left:0;right:0;top:0;bottom:0;align-items:center;justify-content:center}.finish-content{display:flex;flex-direction:column;justify-content:space-around;transform:scale(0.8);transition:transform .7s ease-in-out}.finish-text{color:#fff;font-size:80px;text-align:center;margin-bottom:30px}.page-finish.fade-in{opacity:1}.page-finish.fade-in .finish-content{transform:scale(1)}.roses-container{position:fixed;top:0;left:0;bottom:0;right:0;z-index:1100}.rose{position:absolute;top:-60px;width:200px}.rose img{width:200px}.page-error{position:fixed;bottom:0;top:0;left:0;right:0;background:#313390;z-index:200;color:#fff;display:none;align-items:center;justify-content:center;box-sizing:border-box;padding:30px}.error-container{text-align:center;max-width:570px}.error-container p{font-size:16px;margin-bottom:20px}.error-container img{width:160px;margin-bottom:50px}.error-title{font-weight:bold;font-size:30px;padding-bottom:20px}.dot-bg{width:100%;height:100%;position:fixed;z-index:-1}.start-bg{background-image:url("../assets/dot-bg.svg");background-repeat:repeat;position:absolute;top:0;left:0;right:0;height:30%;z-index:0}.start-bg-fade{position:absolute;top:0;left:0;right:0;height:30%;z-index:1;background:linear-gradient(rgba(0, 0, 0, 0), #313390)}.is-mobile{min-width:0;min-height:0}