@import"https://fonts.googleapis.com/css2?family=Jersey+25&family=Josefin+Sans:ital,wght@0,100..700;1,100..700&family=Monoton&display=swap";:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;align-items:center;justify-content:start;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}.card{padding:2em}#app{width:100%;display:flex;flex-direction:column;justify-content:start;min-height:100vh;align-items:center;text-align:center}@media (prefers-color-scheme: light){:root{color:#fff;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}@font-face{font-family:Molle;src:local("Molle-Italic"),url(/assets/Molle-Italic-CQgI5YLh.ttf)}@font-face{font-family:Monoton;src:local("Monoton-Regular"),url(/assets/Monoton-Regular-BVVyvoNF.ttf)}@font-face{font-family:Josefin Sans;src:local("Josefin-Sans"),url(/assets/JosefinSans-VariableFont_wght-4CYtYlBz.ttf)}.jersey-25-regular{font-family:"Jersey 25",sans-serif;font-weight:400;font-style:normal}h1{color:#fff;font-family:Molle}h2{color:#fff;font-family:Molle,cursive;font-weight:400;font-style:italic;font-size:2.5rem}.background-container[data-v-a7c858d7]{height:100%;width:100%;overflow:hidden}.background[data-v-a7c858d7]{position:fixed;z-index:-10;top:0;left:0;background-color:#342165;height:100vh}.square[data-v-a7c858d7]{background-color:#3d2975;width:8rem;height:8rem;position:absolute;box-shadow:3rem 1rem #0000003f}#headerImage[data-v-30a50b2d]{width:100%;height:15rem;position:absolute;top:0;left:0;z-index:-1}.logoText[data-v-30a50b2d]{font-size:4rem;font-family:Monoton;color:#fff;text-shadow:5px 5px #d400ff;filter:drop-shadow(0px 0px 4rem #d400ff)}.logoText[data-v-30a50b2d]:hover{color:#dd449d;filter:drop-shadow(0px 0px 4rem #dd444c)}.headerTextContainer[data-v-30a50b2d]{width:100%;height:10rem;display:flex;justify-content:space-around;align-items:center}.flexOne[data-v-30a50b2d]{flex-basis:0;flex-grow:1}section[data-v-30a50b2d]{width:100%;height:15rem}#taskSelection[data-v-5729e738]{min-width:2rem;min-height:2rem;max-width:20rem;background-color:#fff0;display:flex;flex-wrap:wrap;justify-content:center}.taskButton[data-v-5729e738]{display:flex;align-items:center;width:2rem;height:2rem}.taskSvg[data-v-5729e738]{width:1.5rem;height:1.5rem}.taskSelect[data-v-5729e738]:hover{fill:#ffae00;stroke:#ffae00}.active[data-v-5729e738]{fill:#fff}#octaveSvg[data-v-a8fa4249]{-webkit-user-select:none;user-select:none}.white[data-v-a8fa4249]{fill:#fff;-webkit-user-select:none;user-select:none}.black[data-v-a8fa4249]{fill:#000;-webkit-user-select:none;user-select:none}.white[data-v-a8fa4249]:hover,.black[data-v-a8fa4249]:hover{fill:#ffae00}.red[data-v-a8fa4249],.red[data-v-a8fa4249]:hover{fill:red}#soundwavesImage{width:100%}#chromaticScaleImage{width:35%}#completedText[data-v-97c2aacd]{color:#ffea00;font-family:Josefin Sans}#continueButton[data-v-97c2aacd]{color:#ffea00;font-family:Josefin Sans;cursor:pointer}#continueButton[data-v-97c2aacd]:hover{color:#fff}#loadingBar[data-v-97c2aacd]{background-color:#fb0;border-radius:1rem;overflow:hidden;display:flex;align-items:start;width:30rem;height:1rem}#loadingProgress[data-v-97c2aacd]{background-color:#ffea00;width:100%;height:1rem}#indicatorSection[data-v-97c2aacd]{height:10rem;margin-bottom:2rem}#noteIndicator[data-v-97c2aacd]{background-color:#fff;height:8rem;width:8rem;border-radius:2rem}#start[data-v-97c2aacd]{background-color:#fff;width:20rem;height:7rem;cursor:pointer;filter:drop-shadow(20px 20px rgba(0,0,0,.377));border-radius:2rem}#start[data-v-97c2aacd]:hover{background-color:#ffea00}#startText[data-v-97c2aacd]{color:#000;font-family:"Jersey 25",sans-serif;font-size:5rem;position:relative;top:1rem;margin:0}#noteTextBigger[data-v-97c2aacd],#noteTextSmaller[data-v-97c2aacd]{font-size:5rem}.noteText[data-v-97c2aacd]{font-family:Josefin Sans;color:#000;margin:0;position:relative;top:2rem}section[data-v-97c2aacd]{display:flex;flex-direction:column;align-items:center;justify-content:center}.main[data-v-075c408d]{width:100%;max-width:80rem;min-height:20rem;background-color:#0000;position:relative;z-index:0;display:flex;align-items:center;flex-direction:column;overflow-y:scroll}.taskContainer[data-v-075c408d]{min-height:35rem}.nodeContainer[data-v-24f62e42]{width:15rem;height:15rem;position:absolute}.circle[data-v-24f62e42]{background-color:#931eaa;border:.2rem dashed .2rem white;border-radius:10rem;position:absolute;top:.25rem;left:0;right:0;margin:0 auto;width:7.75rem;height:7.75rem}.circle[data-v-24f62e42]:hover{background-color:#c9a3d0;filter:drop-shadow(0px 0px 1rem #ffffff);cursor:pointer}.circleBorder[data-v-24f62e42]{position:absolute;top:0;left:0;right:0;margin:0 auto;width:8rem;height:8rem;pointer-events:none}.white[data-v-24f62e42]{background-color:#fff}.starContainer[data-v-24f62e42]{width:2.5rem;height:2.5rem;position:absolute;border-radius:2.5rem;background-color:#0000}.starSvg[data-v-24f62e42]{width:100%;height:100%}#star1[data-v-24f62e42]{left:1rem;top:6rem}#star2[data-v-24f62e42]{left:3.25rem;top:8rem}#star3[data-v-24f62e42]{left:0;right:0;margin:0 auto;top:8.5rem}#star4[data-v-24f62e42]{right:3.25rem;top:8rem}#star5[data-v-24f62e42]{right:1rem;top:6rem}.note[data-v-60f2e517]{position:absolute}#note1[data-v-60f2e517],#note2[data-v-60f2e517],#note3[data-v-60f2e517],#note4[data-v-60f2e517]{top:0;left:5rem;transform:rotate(0)}.main[data-v-60f2e517]{width:100%;max-width:80rem;min-height:20rem;background-color:#00000038;position:relative;z-index:0}#node1[data-v-60f2e517]{left:12rem;top:5rem}#text1[data-v-60f2e517]{position:absolute;left:25rem;top:0}#path1[data-v-60f2e517]{z-index:-1;position:absolute;left:19.5rem;top:9rem;width:38rem;height:5rem;pointer-events:none;overflow:visible}#node2[data-v-60f2e517]{left:50rem;top:10rem}#text2[data-v-60f2e517]{position:absolute;left:40rem;top:5rem}#node3[data-v-60f2e517]{left:55rem;top:30rem}#text3[data-v-60f2e517]{position:absolute;left:67.5rem;top:25rem}#node4[data-v-60f2e517]{left:35rem;top:35rem}#text4[data-v-60f2e517]{position:absolute;left:20rem;top:35rem}#node5[data-v-60f2e517]{left:7rem;top:25rem}#text5[data-v-60f2e517]{position:absolute;left:20rem;top:25rem}.logo[data-v-6fdaf629]{height:6em;padding:1.5em;will-change:filter;transition:filter .3s}.logo[data-v-6fdaf629]:hover{filter:drop-shadow(0 0 2em #646cffaa)}z .logo.vue[data-v-6fdaf629]:hover{filter:drop-shadow(0 0 2em #42b883aa)}