:root{--whitish:#ede5d8;--hint-main:#949494;--red:#f24b5b;--red-color:#ede5d8;--red-bg:#c1515c;--green:#358a55;--orange:#dd8d46;--text-dark:#151414;--text-light:#d7d5d1}@font-face{font-family:Bonobo;src:url(/_next/static/media/BonoboBold.37b99d16.ttf);font-display:swap}@font-face{font-family:RobotoSerif;src:url(/_next/static/media/RobotoSerif-Medium.1a41fe4a.ttf);font-display:swap}p{font-family:RobotoSerif,serif;opacity:.9}.loading{color:var(--background-text);font-size:2rem;grid-row:1;grid-column:2/-1}body,html{width:100%;height:100%;min-height:100vh;margin:0;padding:0;overscroll-behavior-y:contain;touch-action:pan-x pan-y}body{position:absolute;-webkit-text-size-adjust:none;background-color:var(--html-background);color:var(--background-text)}.keyboard-key{padding:.2rem .4rem;border-radius:.2rem;min-width:2rem;text-align:center;margin-bottom:.1rem;border:.1rem solid var(--primary);background:var(--secondary);color:var(--secondary-text);width:10rem;display:inline-block}.keys-table :nth-child(2){width:100%}input{accent-color:var(--accent);cursor:pointer}input[type=number],input[type=text]{cursor:text}:not(input){-webkit-user-select:none;user-select:none;box-sizing:border-box;font-family:Bonobo,Arial;outline:none;-webkit-tap-highlight-color:transparent}.disabled{filter:brightness(.7)}.keyboard-wrapper{display:flex;flex-direction:column;align-items:center;flex:1 1}#__next{min-height:100%}#__next,.app,.app-content{width:100%;display:flex;justify-content:center}.app,.app-content{flex-direction:row;height:100%;overflow:hidden}.app-content{z-index:2}.app-button{background-color:var(--primary);color:var(--primary-text);border-radius:.2rem;padding:.5rem 1rem;border:none;height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;cursor:pointer;min-width:5rem;transition:background-color .2s,color .2s,filter .2s}.icon-app-button{width:unset;min-width:unset;padding:0}.link{color:var(--background-text)}.app-button::placeholder{color:var(--primary-text)}.app-button:hover{filter:brightness(1.1)}.app-button.active{background-color:var(--accent)!important;color:var(--accent-text)!important}.app-button:disabled{opacity:.8;cursor:not-allowed}.selected{transition:all .3s;background-color:var(--accent);color:var(--accent-text)}.right-panel{flex:1 1;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:space-between}.hidden{display:none!important}.hidden-opacity{opacity:0;pointer-events:none}.red{background-color:red}.floating-prompt{position:absolute;margin-right:auto;margin-left:auto;top:1rem;display:flex;flex-direction:column;left:0;right:0;width:30vw;max-width:24rem;padding:.6rem;background-color:var(--primary);color:var(--primary-text);border:2px solid var(--secondary);border-radius:.5rem;z-index:1000;word-break:break-word;transition:all .3s;opacity:1;transform:translateY(0);animation:prompt-show .3s,delayBackdrop .3s forwards}@keyframes prompt-show{0%{opacity:0;transform:translateY(-20%)}to{opacity:1;transform:translateY(0)}}.floating-prompt-hidden{opacity:0;transform:translateY(-20%);pointer-events:none}.prompt-button{background-color:var(--primary);color:var(--primary-text);border:none;padding:.5rem 2rem;border-radius:.3rem;cursor:pointer}.prompt-input{margin-top:.5rem;border-radius:.3rem;border:none;cursor:text;padding:.3rem}.prompt-overlay{width:100%;height:100%;background-color:rgba(var(--primary-rgb),.7);position:fixed;top:0;left:0;z-index:1000;transition:all .2s;animation:overlay-show .2s linear}@keyframes overlay-show{0%{opacity:.5}to{opacity:1}}.prompt-overlay-hidden{opacity:0}a{text-decoration:none}.welcome-message{position:absolute;width:60vw;min-height:60vh;max-height:90vh;background-color:var(--primary);z-index:500;border:1px solid var(--secondary);align-self:center;border-radius:.8rem;padding:.8rem;color:var(--primary-text);display:flex;flex-direction:column}.welcome-overflow{overflow-y:auto}.welcome-message-title{font-size:1.5rem;text-align:center;margin-bottom:2rem}.welcome-message-button-wrapper{display:flex;margin-top:auto;justify-content:flex-end}.welcome-message-button{border:none;padding:.4rem 1rem;border-radius:.2rem;background-color:#32cd32;color:#fff;margin-top:.5rem;cursor:pointer}.red-text{color:#ff334a;display:inline-block}.drag-n-drop{background-color:rgba(var(--accent-rgb),.7);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);filter:saturate(.7);color:var(--accent-text);width:100vw;height:100vh;position:fixed;top:0;left:0;justify-content:center;align-items:center;display:flex;z-index:5;animation:drop-pulse 3s infinite,fadeInOpacity .3s;font-size:2rem}@keyframes drop-pulse{0%{background-color:rgba(var(--accent-rgb),.7)}25%{background-color:rgba(var(--primary-rgb),.7)}50%{background-color:rgba(var(--accent-rgb),.7)}}.prompt-row{width:100%;margin-top:.5rem}.prompt-row,.settings-row-wrap{display:flex;justify-content:space-between}.settings-row-wrap{flex-wrap:wrap;gap:.2rem;margin:.4rem 0 .7rem}::-webkit-scrollbar{width:5px}::-webkit-scrollbar-track{background:none}::-webkit-scrollbar-thumb{background:var(--primary);border-radius:2px}::-webkit-scrollbar-thumb:hover{background:#555}.resume-audio-context{position:fixed;z-index:10;color:var(--red-color);background-color:var(--red);bottom:.8rem;right:.8rem}.approaching-accuracy{position:absolute;top:.5rem;margin:0 auto;color:var(--primary-text);padding:.4rem;background-color:var(--primary);font-weight:700;border-radius:.4rem}.approaching-accuracy table{font-size:.8rem;border-collapse:collapse}.bg-image{background-size:cover;background-position:50%;background-repeat:no-repeat}.sc-2{padding-right:.5rem}.sc-1{padding-left:.5rem;min-width:3.5rem;border-left:2px solid var(--secondary)}.default-page{max-height:100%;padding:2rem 20vw;color:var(--background-text)}.default-content,.default-page{display:flex;width:100%;flex-direction:column}.default-content{flex:1 1}.appear-on-mount{animation:appear-default-page .6s}@keyframes appear-default-page{0%{opacity:0}to{opacity:1}}.has-tooltip{position:relative}@media (hover:hover){.has-tooltip:hover:not(:focus){z-index:2}.has-tooltip:hover:not(:focus) .tooltip{display:block;animation:fadeIn .2s forwards;animation-delay:.5s}}@media (hover:none){.has-tooltip:active{z-index:2}.has-tooltip:active .tooltip{display:block;animation:fadeIn .2s forwards;animation-delay:.5s}}.tooltip{display:none;opacity:0;position:absolute;background-color:var(--secondary);color:var(--secondary-text);padding:.3rem .6rem;border-radius:.2rem;max-width:10rem;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;z-index:20;box-shadow:0 4px 6px -1px #00000026,0 2px 4px -2px #00000026;font-size:.8rem;pointer-events:none;z-index:2}.tooltip-bottom{transform:translateY(100%);--existing-transform:translateY(100%);bottom:-.4rem}.tooltip-top{transform:translateY(-100%);--existing-transform:translateY(-100%);top:-.4rem}.tooltip-right{transform:translateX(calc(100% + .4rem));top:0;--existing-transform:translateX(calc(100% + 0.4rem))}.tooltip-left{transform:translateX(calc(-100% - .4rem));top:0;--existing-transform:translateX(calc(-100% - 0.4rem))}.tooltip:before{content:"";transform:translateY(-50%) rotate(45deg);position:absolute;width:.5rem;height:.5rem;background-color:var(--secondary)}.tooltip-bottom:before{right:calc(50% - .25rem);top:0;border-top-right-radius:2px}.tooltip-top:before{bottom:0;right:calc(50% - .25rem);border-bottom-right-radius:2px;transform:translateY(50%) rotate(45deg)}.tooltip-left:before{right:-.25rem;top:50%;border-bottom-left-radius:2px}.tooltip-right:before{left:-.25rem;top:50%;border-bottom-right-radius:2px;transform:translateY(50%) rotate(45deg)}.help-tooltip ul{margin:.2rem;padding-left:.6rem}.help-tooltip li{margin-bottom:.2rem}.help-tooltip-button{display:flex;justify-content:center;align-items:center;background-color:var(--primary);color:var(--primary-text);padding:0;width:1.8rem;height:1.8rem;cursor:pointer;border-radius:50%;border:0;transition:all .2s}.help-tooltip-button:hover{transform:rotate(30deg);filter:brightness(1.1)}.help-tooltip-content{position:absolute;transform:translateY(.4rem);--existing-transform:translateY(0.4rem);display:none;box-shadow:0 10px 15px -3px #00000026,0 4px 6px -4px #00000026;border:2px solid var(--secondary);padding:.3rem .6rem;border-radius:.4rem;font-size:.8rem;z-index:2;pointer-events:none}.help-tooltip-button:focus+.help-tooltip-content{display:flex;background-color:var(--primary);color:var(--primary-text);animation:fadeIn .3s;animation-fill-mode:forwards}.help-tooltip-button:focus{background-color:var(--accent);color:var(--accent-text)}.folder{display:flex;flex-direction:column;border-radius:.4rem;margin:.4rem 0}.folder-header{border-radius:.4rem .4rem 0 0;display:flex;align-items:center;justify-content:space-between;padding-right:.5rem}.folder-header-button{display:flex;align-items:center;flex:1 1;cursor:pointer;padding:.75rem}.folder-header-button input{background-color:initial;color:var(--menu-background-text);border:none;outline:solid 2px var(--secondary);font-family:Bonobo;border-radius:.2rem}.folder-content{padding:0 .5rem .5rem;flex-direction:column;opacity:1;transition:all .2s}.folder-songs-wrapper{display:grid;grid-template-columns:1fr;grid-gap:.3rem;gap:.3rem}.folder-overflow{overflow:hidden}.folder-overflow,.folder-overflow-expandible{transition:all .2s}.folder-expanded .folder-overflow{animation:show-folder .2s;animation-fill-mode:forwards}@keyframes show-folder{99%{overflow:hidden}to{overflow:unset}}.folder-title{margin:0 0 .4rem;font-size:1.1rem}.folder-name{font-size:1.2rem;max-width:20rem;padding:0 0 0 .3rem}@media only screen and (max-width:920px){.folder-content{padding:.4rem}.floating-prompt{width:45vw;padding:.5rem}.default-page{padding:1rem var(--right-mobile-padding,1.4rem) 1rem var(--left-mobile-padding,5rem)}}.home{height:100%;justify-content:space-between;overflow-y:auto;position:fixed;width:100%;background-color:var(--background);color:var(--background-text);z-index:100;transition:all .2s ease-out;animation:home-appear .15s ease-out;opacity:0;transform:scale(.98);will-change:opacity,transform,backdrop-filter}.home-visible{opacity:1;--backdrop-amount:4px;animation:delayBackdrop calc(.2s * 1.2) forwards,home-appear .15s ease-out;transform:scale(1)}.home-padded{padding:1rem 25vw}@keyframes home-appear{0%{opacity:.5;-webkit-backdrop-filter:none;backdrop-filter:none;transform:scale(.98)}to{opacity:1;-webkit-backdrop-filter:none;backdrop-filter:none;transform:scale(1)}}.logger-wrapper{display:grid;grid-template-columns:1fr;grid-gap:.4rem;gap:.4rem;position:fixed;max-height:100vh;overflow-y:scroll;right:0;top:0;padding:.8rem 0;z-index:999}.logger-toast{border-radius:.4rem;border:2px solid var(--secondary);min-width:15rem;background-color:var(--primary);box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a;color:var(--primary-text);padding:.5rem;transition:all .3s;display:flex;flex-direction:column;opacity:1;margin:0 .8rem;transform:scale(1) translateY(0);animation:toastAppear .3s}@keyframes toastAppear{0%{opacity:.3;transform:scale(.8) translateY(calc(-120% - .8rem))}to{opacity:1;transform:scale(1) translateY(0)}}.logger-toast-hidden{transform:scale(.8) translateY(calc(-120% - .8rem))}.logger-toast-hidden,.pill{opacity:0;pointer-events:none}.pill{position:fixed;border-radius:1.5rem;padding:.5rem 1.5rem;transition:all .3s;min-height:2.4rem;background-color:rgba(var(--secondary-rgb),.9);top:.8rem;font-size:.8rem;right:50vw;z-index:998;box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a;color:var(--secondary-text);transform:translateX(50%) translateY(calc(-120% - .8rem))}.pill-visible{opacity:1;transform:translateY(0) translateX(50%);animation:delayBackdrop calc(.2s * 1.2) forwards}.logger-content{display:flex;flex-direction:row;flex:1 1;padding:.1rem;font-size:.9rem}.logger-progress-outer{overflow:hidden;height:5px;margin-top:.6rem;border-radius:.5rem}.logger-progress-bar{height:100%;width:100%;background-color:var(--accent);animation:logger-animation 1s linear forwards}@keyframes logger-animation{0%{transform:translateX(0)}to{transform:translateX(-100%)}}.logger-status{margin-right:.6rem;max-height:1.4rem}.logger-status,.logger-text{display:flex;align-items:center}.logger-text{flex:1 1;white-space:pre-line;font-size:.9rem}.home-spacing{margin-bottom:.3rem}.close-home{position:absolute;top:.5rem;left:.5rem;padding:.5rem;border-radius:.5rem;cursor:pointer}.home-bottom{width:100%;color:var(--background-text);padding:0 .4rem .4rem;display:flex;flex-direction:row;justify-content:space-between;align-items:center;font-size:.8rem}.home-content{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr;grid-gap:1rem;gap:1rem;justify-items:center;width:100%}.home-content-element{width:100%;min-height:10rem;color:var(--primary-text);border-radius:.5rem;position:relative;transition:all .15s ease-out;max-width:20rem;cursor:pointer}.home-content-element:hover{transform:scale(1.02);filter:brightness(1.1)}.home-welcome{font-size:.9rem;background-color:var(--primary-darken-10);padding:.5rem;border-radius:.5rem;margin:.8rem;outline:2px dashed var(--secondary);outline-offset:2px}.home-accept-storage{border:none;padding:.4rem 1rem;border-radius:.2rem;background-color:#32cd32;color:#fff;margin-top:.5rem;cursor:pointer}.home-content-main{padding:.5rem;display:flex;position:absolute;flex-direction:column;align-items:center;border-radius:.5rem;background-color:var(--primary);color:var(--primary-text);width:100%;height:100%;transition:all .2s ease-out}.home-content-element:active{transform:scale(.97);transition:all .1s ease-out}.home-content-element>.home-content-main{background-color:#353a46e6}.home-content-background{position:absolute;height:100%;border-radius:.5rem;width:100%;background-size:cover;overflow:hidden}.home-content-title{display:flex;align-items:center;justify-content:center;border-bottom:1px solid var(--secondary);width:94%;padding-bottom:.3rem;font-size:1.2rem}.home-content-title svg{margin-right:.5rem}.home-content-text{font-size:.8rem;margin-top:.25rem;padding:.25rem;text-align:center;line-height:1rem}.home-content-open{display:flex;justify-content:center;margin-top:auto}.home-app-scaling *,.home-dont-show-again *{white-space:nowrap}.top-right-home-label{background-color:var(--accent);color:var(--accent-text);display:flex;justify-content:center;align-items:flex-end;position:fixed;top:0;padding:0 3rem;height:4rem;font-size:1.5rem;right:0;transform:rotate(45deg) translate(20%,-70%)}.home-app-scaling button{margin-left:.2rem;min-width:unset;padding:0;width:1.5rem;font-size:.6rem;font-weight:700;height:1.5rem}.page-redirect-wrapper{margin-top:.8rem;display:flex;flex-wrap:wrap;width:100%}.page-redirect-wrapper a,.page-redirect-wrapper button{background-color:var(--primary);margin:.2rem;color:var(--primary-text);border-radius:.5rem;border:none;padding:.4rem 1rem;font-size:.9rem;cursor:pointer;transition:all .1s linear}.page-redirect-wrapper a:hover,.page-redirect-wrapper button:hover{filter:brightness(1.1)}.middle-size-pages-wrapper{margin-top:1rem;gap:1rem}.middle-size-page{border-radius:.5rem;display:grid;align-items:center;flex:1 1;max-width:20rem;grid-template-columns:1fr 1fr;grid-gap:1rem;gap:1rem;padding:.6rem 1rem;color:var(--primary-text);text-decoration:unset;background-color:var(--primary);transition:all .2s}.middle-size-page:hover{filter:brightness(1.1);transform:scale(1.02)}.middle-size-page-icon{color:var(--primary-text);font-size:1.6rem}.current-page{outline:var(--accent) solid 2px;filter:none}.home-content-open button{padding:.4rem 1.5rem;background-color:var(--accent);color:var(--accent-text);border-radius:.5rem;font-size:.8rem;border:none;cursor:pointer}.home-top{text-align:center;margin-bottom:1rem}.home-title{font-size:2rem}.home-top-text{font-size:.8rem;color:#b0ada8}.redirect-wrapper{display:flex;flex-wrap:wrap;justify-content:center}.home-separator{border-top:1px solid var(--secondary);margin-top:1rem;font-size:1.1rem;width:100%}.redirect-button{display:flex;flex-direction:column;align-items:center;justify-content:center;margin:1rem 2rem;cursor:pointer}.redirect-icon{width:5rem!important;height:5rem!important;padding:1rem;border-radius:1rem;background-color:#515c6f;margin-bottom:.5rem}@media only screen and (max-width:920px){.home-padded{padding:.6rem 8vw}.home-app-scaling,.home-dont-show-again{font-size:.8rem}.home-separator{margin-top:.6rem}.home-content-element{min-height:8.5rem}.home-content-title{font-size:1.1rem}.page-redirect-wrapper{margin-top:.4rem}.middle-size-pages-wrapper{margin-top:.8rem;gap:.8rem}.home-content{gap:.8rem}.close-home{left:.4rem}.home-top{margin-bottom:0}.home-bottom{font-size:.6rem}.page-redirect-wrapper a,.page-redirect-wrapper button{padding:.4rem .7rem}}.flex,.row{display:flex}.row{flex-direction:row}.row-centered{display:flex;align-items:center}.flex-grow{display:flex;flex:1 1}.space-between{justify-content:space-between}.space-around{justify-content:space-around}.flex-centered{display:flex;justify-content:center}.flex-centered,.items-center{align-items:center}.column{display:flex;flex-direction:column}.text-ellipsis{text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.box-shadow{box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a}.input{font-family:Bonobo;background-color:var(--primary);color:var(--primary-text);border:none;border-radius:.2rem;padding:.3rem}.input::placeholder{color:#b9b9b9}.wrap{flex-wrap:wrap}@keyframes fadeIn{0%{opacity:0;transform:scale(.95) var(--existing-transform, )}to{opacity:1;transform:scale(1) var(--existing-transform, )}}@keyframes fadeInOpacity{0%{opacity:0}to{opacity:1}}@keyframes appearLeft{0%{transform:translateX(-.5rem) var(--existing-transform, );opacity:.6}to{transform:translateX(0) var(--existing-transform, );opacity:1}}@keyframes disappearAbove{0%{transform:translateY(0) var(--existing-transform, );opacity:1}to{transform:translateY(-1rem) var(--existing-transform, );opacity:0}}@keyframes delayBackdrop{0%{-webkit-backdrop-filter:unset;backdrop-filter:unset}80%{-webkit-backdrop-filter:blur(0);backdrop-filter:blur(0)}to{-webkit-backdrop-filter:blur(var(--backdrop-amount,2px));backdrop-filter:blur(var(--backdrop-amount,2px))}}.onprint{display:none}@media print{.noprint{display:none!important}*{color-adjust:exact!important;-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important}.onprint{display:flex}}.keyboard{display:grid;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;margin-top:auto;grid-template-columns:repeat(7,1fr);justify-items:center;align-items:center;margin-bottom:2vh;touch-action:none}.keyboard,.keyboard-5{grid-template-rows:repeat(3,1fr)}.keyboard-5{grid-template-columns:repeat(5,1fr)}.keyboard-7-2{grid-template-columns:repeat(7,1fr)}.keyboard-4,.keyboard-7-2{grid-template-rows:repeat(2,1fr)}.keyboard-4{grid-template-columns:repeat(4,1fr)}.keyboard-3{grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(2,1fr)}.note,.note-composer,.note-composer-sky,.note-sky{background-color:var(--note-background);color:var(--note-background-text);border-radius:50%;width:6vw;height:6vw;border:.5vw solid var(--note-border);color:var(--accent);font-size:1.5rem;font-weight:700;position:relative;display:flex;justify-content:center;align-items:center;transition:transform .1s;cursor:pointer;z-index:10;touch-action:none;will-change:background-color,border-color,transform}.note-composer-sky,.note-sky{border-radius:1.3vw;border:.4vw solid #0000;transform-origin:50% 50%;transition:all .1s;-webkit-user-select:none;user-select:none}.note,.note-composer{border:none}.note-composer,.note-composer-sky{transition:none}.note img,.note svg,.note-composer img,.note-composer svg,.note-composer-sky img,.note-composer-sky svg,.note-sky img,.note-sky svg{width:100%;height:100%;pointer-events:none;fill:var(--accent)}.note img,.note svg,.note-composer img,.note-composer svg{position:absolute;width:80%;height:80%;top:5%}.svg-note{overflow:visible}.note-composer-sky .svg-note,.note-sky .svg-note{width:80%;height:80%}.note-composer .note-name{bottom:14%!important;font-size:.7rem}.genshin-border{top:unset!important;width:100%!important;height:100%!important}.click-event{transform:scale(.9);background-color:var(--clicked-note);border-color:var(--accent)}.click-event .svg-note{fill:#fff!important;stroke:#fff!important}.note-red{background-color:#f06565;border-color:#d75c5c;color:#fff}.note-red .svg-b{stroke:#f06565!important}.note-red .svg-note{fill:#fff!important;stroke:#fff!important}.note-border-click{border-color:var(--accent)}.note-name{font-size:.8rem;bottom:15%;margin-left:auto;margin-right:auto;left:0;right:0}.note-name,.note-name-sky{position:absolute;color:var(--note-background-text)}.note-name-sky{font-size:1rem}.button-hitbox,.button-hitbox-bigger{background-color:initial;border:none;padding:.25rem;display:flex;justify-content:center;align-items:center;position:relative;-webkit-user-select:none;user-select:none}.button-hitbox-bigger{padding:.35rem}.approach-circle,.approach-circle-sky{position:absolute;left:0;right:0;top:0;bottom:0;border:3px solid var(--accent);border-radius:50%;animation:approach 1s linear;transform-origin:50% 50%;pointer-events:none;opacity:0;transform:scale(2.3)}.approach-circle-sky{transform:scale(1.8);border-radius:2vw}@keyframes approach{0%{opacity:0}50%{opacity:.3}99%{transform:scale(.8);opacity:.8}to{opacity:0;transform:scale(.8)}}.note-animation,.note-animation-sky{position:absolute;border:2px solid var(--accent);border-radius:50%;animation:note-animation .5s cubic-bezier(.25,.46,.45,.94);animation-delay:.1s;transform-origin:50% 50%;pointer-events:none;opacity:1;z-index:1;transform:scale(.8);width:6vw;height:6vw}.note-animation-sky{border-radius:1.7vw;animation:note-animation-sky .75s cubic-bezier(.25,.46,.45,.94);animation-delay:.15s}@keyframes note-animation{0%{transform:scale(.8);opacity:1}70%{transform:scale(1.45);opacity:.2}to{transform:scale(1.5);opacity:0}}@keyframes note-animation-sky{0%{transform:scale(.8);opacity:1}70%{transform:scale(1.25);opacity:.1}to{transform:scale(1.3);opacity:0}}.record-btn{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}@media only screen and (max-width:920px){.keyboard-playback .click-event{transform:unset}.note{font-size:1rem;border-width:4px}.note,.note-animation{width:6.7vw;height:6.7vw}.note-animation-sky{border-radius:2.5vw;width:8.5vw;height:8.5vw}.keyboard{margin-bottom:1vh}.note-sky{width:8.5vw;height:8.5vw;border-radius:1.8vw}.note-name-sky{font-size:.8rem}.note-composer .note-name{bottom:10%!important}.note-name{font-size:.6rem;bottom:10%}@keyframes note-animation{0%{transform:scale(.8);opacity:1;border-width:2px}70%{transform:scale(1.45);opacity:.2}to{transform:scale(1.5);opacity:0;border-width:2px}}}.approach-wrong{background-color:#d66969;border-color:#b35555}.approach-correct{background-color:#60ad7e;border-color:#358a55}.approach-correct .svg-note,.approach-wrong .svg-note{fill:#fff!important;stroke:#fff!important}@media only screen and (max-width:800px){.note-animation{border:2px solid var(--accent)}}:root{--menu-size:4rem;--panel-size:40vw}.menu-main-page{opacity:.9}.hamburger,.hamburger-top{position:absolute;bottom:.5rem;left:.5rem;font-size:1.5rem;width:2.5rem;height:2.5rem;max-width:6vw;max-height:6vw;color:var(--icon-color);background-color:var(--primary);border-radius:.3rem;display:flex;justify-content:center;align-items:center;cursor:pointer}.hamburger-top{top:.5rem;bottom:unset}.icon,.rotate-screen{font-size:1.5rem}.rotate-screen{width:100%;height:100%;z-index:1000;position:fixed;display:none;justify-content:center;align-items:center;padding:2rem;flex-direction:column;background-color:rgba(var(--primary-rgb),.85);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.rotate-screen p{text-align:center}.rotate-screen img,.rotate-screen svg{width:60vw;height:60vw;margin-bottom:1rem;background-color:rgba(var(--primary-rgb),1);color:var(--icon-color);filter:brightness(1.1);padding:1.5rem;border-radius:1rem}.library-search-result-text{width:100%;height:100%;justify-content:center;align-items:center;display:flex}.songs-buttons-wrapper{display:flex;width:100%;align-items:center;flex-wrap:wrap;gap:.2rem}.library-search-row{display:flex;width:100%;margin:1rem 0 .2rem}.library-search-input{box-sizing:border-box;padding:0 1rem;outline:none;background-color:#d3bd8e;display:flex;flex:1 1;height:2.2rem;border:none;border-radius:.3rem;cursor:text}.library-search-btn,.library-search-input,.library-search-input::placeholder{color:var(--menu-background-text)}.library-search-btn{background-color:#d3bd8e;height:2.2rem;width:2.2rem;border:none;cursor:pointer;margin-left:.2rem;border-radius:.3rem;font-size:1rem;transition:all .2s;padding:0;display:flex;align-items:center;justify-content:center}.library-search-btn:hover{filter:brightness(1.1)}.library-search-songs-wrapper,.songs-wrapper{border-bottom-left-radius:.3rem;border-bottom-right-radius:.3rem;background-color:#ad9c85;padding:1rem .5rem .5rem;margin:0;display:grid;flex-direction:column;grid-gap:.3rem;gap:.3rem}.library-search-songs-wrapper{border-radius:.3rem;padding-top:.5rem}.tab-selector-wrapper{display:flex;margin-top:1rem;gap:.2rem}.tab-selector{flex:1 1;white-space:nowrap;border:none;border-top-left-radius:.3rem;border-top-right-radius:.3rem;background-color:#d3bd8e;color:var(--menu-background-text);font-size:1rem;padding:.4rem;cursor:pointer;margin:0;transition:all .2s}.tab-selected{background-color:#ad9c85}.inverted{filter:invert(1)}.song-row{flex:1 1;justify-content:space-between;align-items:flex-start;padding:.4rem;transition:all .2s}.song-button,.song-row{display:flex;background-color:var(--primary);border-radius:.3rem;color:var(--primary-text)}.song-button{justify-content:center;align-items:center;height:2rem;width:2rem;font-size:1rem;border:none;margin-right:.4rem;cursor:pointer;padding:0}.floating-dropdown-children{flex-direction:column;box-shadow:0 20px 25px -5px #0003,0 8px 10px -6px #0003;display:none;position:absolute;transform:translateX(calc(-100% + 3rem));transform-origin:top;--existing-transform:translateX(calc(-100% + 3rem));z-index:100;padding:.2rem;background-color:var(--primary);color:var(--primary-text);border:1px solid var(--secondary);border-radius:.4rem}.floating-dropdown{position:relative}.dropdown-select{background-color:var(--primary);padding:.4rem 0;height:100%;flex:1 1;color:var(--primary-text);border:none}.floating-dropdown-text{display:flex;font-size:.8rem;white-space:nowrap}.floating-dropdown-active .floating-dropdown-children{display:flex;animation:fadeIn .2s,delayBackdrop .2s;animation-fill-mode:forwards}.song-name{flex:1 1;word-break:break-word;display:flex;align-items:center;margin-right:.45rem}.song-name,.song-name-input{cursor:pointer;height:100%;font-size:1rem}.song-name-input{background-color:initial;font-family:Bonobo;margin:0;border:none;padding:0 0 0 .3rem}.song-rename{outline:solid 2px var(--secondary);border-radius:.2rem;cursor:text}.song-buttons-wrapper{display:flex;justify-content:center;align-items:center}@media only screen and (max-width:920px){:root{--menu-size:3.6rem}.tab-selector-wrapper{margin-top:.5rem}}@media screen and (orientation:portrait){.rotate-screen{display:flex}}.canvas-wrapper{min-width:78vw;min-height:calc(45vh + 14px);justify-content:space-between;display:flex;border-radius:.4rem;align-items:center;flex-direction:column}.canvas-wrapper-in-preview{min-width:unset;min-height:unset}.canvas-relative{position:relative;display:flex;z-index:0;width:100%;flex:1 1;border-top-left-radius:.4rem;border-top-right-radius:.4rem;overflow:hidden}.canvas-relative canvas{cursor:pointer!important}select{-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24' viewBox='0 0 24 24' width='24' fill='gray'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:100%}.right-panel-composer{flex:1 1;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding-top:.2rem}.note-composer{width:5vw;height:5vw;border-width:.4vw;z-index:2}.note-composer-sky{z-index:2}.composer-grid{display:grid;padding:.2rem;grid-template-columns:-webkit-min-content;grid-template-columns:min-content;grid-gap:.2rem;gap:.2rem;grid-template-areas:"a b b" "a c c"}.song-info{position:absolute;bottom:.5vw;left:calc(4rem + .5vw);color:var(--background-text);display:flex;flex-direction:column;gap:.2rem}.composer-keyboard-wrapper{grid-area:c;display:flex;justify-content:center;padding-bottom:1vh;position:absolute;bottom:0;gap:1.5rem;left:0;width:100%}.composer-keyboard-wrapper .keyboard{margin:unset;z-index:1}.song-info div{max-width:23vw;text-shadow:#333 0 1px 5px}.top-panel-composer{display:flex;flex-direction:row}.tool,.tool-slim{flex:1 1;display:flex;justify-content:center;align-items:center;border:none;border-radius:.3rem;color:var(--icon-color);background-color:var(--primary-darken-10);transition:background-color .2s;cursor:pointer;margin:0}.tool{width:4vw}.tool-icon{width:1rem;height:100%}.tool-slim:hover,.tool:hover{background-color:var(--primary-layer-15)}select{cursor:pointer}.not-saved{background-color:var(--accent)!important;color:var(--accent-text)!important}.timeline-wrapper{display:flex;flex-direction:row;justify-content:space-between;height:100%;margin-top:0;align-items:center}.timeline-wrapper-bg{padding:.2rem 0;border-bottom-left-radius:.4rem;border-bottom-right-radius:.4rem;background-color:var(--primary);width:100%}.timeline-button{height:100%;padding:0;width:2.2rem;margin:.2rem;background-color:var(--primary);border:none;color:var(--icon-color);justify-content:center;align-items:center}.timeline-button,.timeline-scroll{display:flex;border-radius:.3rem;cursor:pointer}.timeline-scroll{width:100%;overflow:hidden;max-height:30px}.timeline-scroll canvas{width:100%!important}.buttons-composer-wrapper,.buttons-composer-wrapper-right{display:grid;grid-template-rows:repeat(3,1fr);grid-template-columns:1fr;grid-gap:.2rem;gap:.2rem;margin-left:.2rem}.buttons-composer-wrapper-right{grid-template-rows:repeat(4,1fr)}.tools-icon{font-size:1.2rem}.tools-button{background-color:var(--primary);color:var(--primary-text);border-radius:.3rem;padding:1.1rem;border:none;font-size:1rem;gap:.5rem;justify-content:flex-start;cursor:pointer}.tools-row{display:flex;flex-direction:row;justify-content:space-between;align-items:center}.tools-button:hover{filter:brightness(1.1)}.tools-button:disabled,.tools-right button:disabled{cursor:not-allowed;opacity:.6;filter:unset}.tools-button-highlighted{background-color:var(--accent)!important;color:var(--accent-text)}.tools-buttons-grid{display:grid;grid-template-areas:"a a b b" "a a c c" "d d e e" "f f g g";flex:1 1;grid-gap:.6rem;gap:.6rem}.floating-tools{position:fixed;bottom:-50vh;max-height:45vh;min-width:36vw;display:flex;margin-right:auto;margin-left:auto;border-radius:.5rem;box-shadow:-2px -1px 27px 4px #00000040;background-color:rgba(var(--menu-background-rgb),.9);z-index:10;opacity:0;border:2px solid var(--secondary);transition:all .4s;transform:scale(.7);padding:.6rem;color:#fff}.floating-tools-content{display:flex;flex:1 1;overflow-y:auto;overflow-x:hidden}.tools-right{margin-left:1rem;padding-left:1rem;border-left:2px solid var(--secondary)}.tools-right .app-button{min-width:unset;display:flex;align-items:center;padding:.5rem .7rem}.tools-visible{bottom:1.4rem;transform:scale(1);opacity:1;--backdrop-amount:3px;animation:delayBackdrop calc(.4s * 1.2) forwards}.tempo-changers-wrapper{position:absolute;color:#fff;right:.2rem;bottom:.2rem;flex-direction:column;width:4rem;gap:.2rem;display:flex}.tempo-changers-wrapper-hidden{display:none}.bottom-right-text{text-align:center;width:100%;color:var(--background-text);text-shadow:#333 0 1px 5px;font-size:.8rem}.note-composer svg{z-index:2}.layer-1{background-color:var(--composer-main-layer)!important;border-color:var(--composer-main-layer-layer-20)!important}.layer-1 .note-name-sky{color:var(--composer-main-layer-text)!important}.layer-2 .svg-b{stroke:var(--composer-secondary-layer)!important}.layer-1 .svg-b{stroke:var(--composer-main-layer)!important}.layer-1 .genshin-border,.layer-1 .svg-note{fill:var(--composer-main-layer-text)!important;stroke:var(--composer-main-layer-text)!important}.layer-1 .note-name{color:var(--composer-main-layer-text)!important}.layer-2,.layer-2 .genshin-border{border-color:var(--composer-secondary-layer)!important;fill:var(--composer-secondary-layer)!important;stroke:var(--composer-secondary-layer)!important}.layer-3-ball,.layer-3-ball-bigger{width:1.5vw;height:1.5vw;border-radius:50%}.layer-3-ball,.layer-3-ball-bigger,.layer-4-line{position:absolute;background-color:var(--composer-secondary-layer);visibility:hidden}.layer-4-line{height:25%;width:100%;border-radius:.2vw}.layer-3 .note-name-sky,.layer-4 .note-name-sky{color:var(--composer-secondary-layer-text)!important}.note-composer.layer-3 .svg-note,.note-composer.layer-4 .svg-note{fill:var(--composer-main-layer-text)!important;stroke:var(--composer-main-layer-text)!important}.layer-3 .layer-3-ball,.layer-3 .layer-3-ball-bigger,.layer-4 .layer-4-line{visibility:visible}.layer-3-ball-bigger{width:2.6vw;height:2.6vw}.note-composer .layer-3-ball-bigger{width:3vw;height:3vw}.tempo-changers-wrapper button{flex:1 1;border-radius:.2rem;border:none;font-size:1rem;color:#fff;padding:.4rem 0;margin:0;filter:brightness(1.1);cursor:pointer}.layer-button:hover,.tempo-changers-wrapper button:hover{filter:brightness(1.1)}.tempo-changers-wrapper button:focus{filter:brightness(1.3)}.layer-buttons-wrapper{display:flex;flex-direction:column;gap:.2rem;margin-right:2vw;justify-content:center}.composer-left-control{grid-area:a;width:6.2rem;height:calc(100vh - 5rem)}.instrument-name-button{padding:0;font-size:.8rem}.instruments-button-wrapper{overflow-y:auto;overflow-x:hidden;background-color:var(--primary-darken-10);border-radius:.3rem;margin-top:.2rem;z-index:2}.new-instrument-button{padding:.4rem;background-color:initial;margin-top:auto;align-items:center}.new-instrument-button:hover{background-color:var(--primary-darken-10)}.instruments-button-wrapper::-webkit-scrollbar-thumb{background:var(--secondary)}.instrument-button{height:3rem;min-height:3rem;position:relative;flex-direction:column;border-radius:.3rem;border-bottom:2px solid var(--secondary);border-radius:0}.instrument-button-selected{height:4.2rem;min-height:4.2rem}.instrument-settings{font-size:.8rem;display:grid;width:100%;grid-template-columns:1fr 1fr}.instrument-settings .app-button{padding:.1rem;background-color:initial;min-width:unset;flex:1 1}.floating-instrument-settings{position:absolute;width:17rem;background-color:var(--menu-background);color:var(--menu-background-text);display:flex;flex-direction:column;padding:.6rem;border-radius:.4rem;border:2px solid var(--secondary);top:3.4rem;margin-left:6.6rem;z-index:10;animation:fadeIn .2s,delayBackdrop .2s forwards}.instrument-settings-button{flex:1 1;margin:.2rem}.floating-midi{position:absolute;margin-left:auto;margin-right:auto;bottom:2rem;max-height:48vh;border-radius:.5rem;background-color:rgba(var(--menu-background-rgb),.9);border:2px solid var(--secondary);color:var(--menu-background-text);max-width:60vw;min-width:45vw;z-index:10;display:flex;flex-direction:column;align-items:flex-start;--backdrop-amount:4px;animation:fadeIn .4s,delayBackdrop calc(.4s * 1.2) forwards}.floating-midi-content{padding:.8rem .5rem .8rem .8rem;width:100%;height:100%;overflow-y:scroll}.floating-midi *{font-size:.9rem}.midi-table{margin-bottom:.1rem}.midi-table-row{width:100%;display:flex;flex-direction:row;justify-content:space-between;align-items:center;margin-bottom:.3rem}.midi-btn,.midi-btn-green,.midi-btn-small{background-color:var(--primary);color:#fff;border-radius:.2rem;padding:.5rem 1rem;border:none;height:-moz-fit-content;height:-webkit-fit-content;height:fit-content;cursor:pointer;min-width:5rem}.midi-btn-green:active{filter:brightness(1.1)}.midi-btn-small{min-width:unset;display:flex;align-items:center;justify-content:center;padding:0;font-weight:700;height:2rem;width:2rem;font-size:1.2rem}.midi-btn-green{background-color:#628c83}.midi-btn-green:disabled{opacity:.8;filter:brightness(.8);cursor:not-allowed}.midi-track-data-row{flex-direction:row;margin-top:.2rem}.midi-track-data-row,.midi-track-wrapper{display:flex;align-items:center;justify-content:space-between}.midi-track-wrapper{width:100%}.midi-track-column{background:var(--primary);padding:.3rem .5rem;border-radius:.2rem;display:flex;flex-direction:column;margin-top:.3rem;width:100%}.midi-track-center{display:flex;gap:.2rem;align-items:center}.midi-track-center :not(:last-child){margin-right:.5rem}.separator-border{margin-bottom:.25rem;padding-bottom:.25rem;border-bottom:2px solid var(--secondary)}.midi-input,.midi-select{width:4rem;border:none;background-color:var(--primary);height:1.9rem;border-radius:.2rem;color:var(--primary-text);text-align:center;outline:none}.midi-select{width:10rem;text-align:left;padding:.2rem .2rem .2rem .5rem}.midi-track-offset::placeholder{font-size:.7rem;color:var(--primary-text)}.canvas-buttons{height:100%;position:absolute;min-width:2.8rem;top:0;background-color:var(--primary);padding:0;display:none;opacity:0;transition:opacity .1s}.canvas-buttons,.keyboard-column-selection-buttons{color:var(--icon-color);align-items:center;cursor:pointer;border:none;font-size:2rem}.keyboard-column-selection-buttons{display:flex;background:#0000;justify-content:center;filter:drop-shadow(0 0 6px rgb(0 0 0/.4));border-radius:.4rem;width:4rem}@media (hover:none) and (pointer:coarse){.canvas-buttons{display:flex}.canvas-buttons-visible{display:flex;opacity:1}}@media only screen and (max-width:920px){.canvas-buttons{display:flex}.canvas-buttons-visible{display:flex;opacity:1}.floating-instrument-settings{top:1.2rem;padding:.5rem}.buttons-composer-wrapper,.buttons-composer-wrapper-right{flex:1 1}.tools-right{padding-left:.6rem;margin-left:.6rem}.floating-tools{max-height:50vh;padding:.4rem}.tools-visible{bottom:.4rem}.tools-icon{font-size:1.1rem}.tools-buttons-grid{gap:.3rem}.tools-button{font-size:.9rem;padding:.55rem .8rem;gap:.4rem}.song-info div{max-width:20vw}.floating-midi{bottom:.8rem;height:50vh;max-height:50vh;max-width:70vw;width:70vw}.floating-midi-content{padding:.4rem .2rem .4rem .4rem}.song-info{font-size:.9rem}.tool{flex:1 1;width:100%;max-width:unset}.button-hitbox{padding:.7vh}.layer-button{font-size:.7rem}.tempo-changers-wrapper button{font-size:.7rem;padding:.5rem}.note-composer{width:5.5vw;height:5.5vw}.keyboard{gap:0;grid-gap:0}.composer-grid{width:100%}.composer-left-control{width:5.4rem}.instrument-button{height:2.6rem;min-height:2.6rem}.instrument-button-selected{height:3.5rem;min-height:3.5rem}.instrument-name-button{align-items:flex-end;padding-bottom:.4rem}.new-instrument-button{padding:0 0 .3rem}.layer-3-ball{width:1.5vw;height:1.5vw}}@media only screen and (max-width:600px){.layer-button,.song-info{font-size:.8rem}.layer-button{padding:unset}.tempo-changers-wrapper{gap:.6vh}.tempo-changers-wrapper button{font-size:.6rem}}.theme-row{margin-top:.5rem;display:flex;width:100%;justify-content:space-between;align-items:center;font-size:1.1rem;min-height:3rem;border-radius:.4rem;padding:0 .6rem;transition:all .1s}.color-preview{border:3px solid;border-radius:.5rem;overflow:hidden;width:5rem;height:3rem;-webkit-appearance:none;display:flex;align-items:center;justify-content:center;font-size:1rem;cursor:pointer}.color-input-wrapper{margin-left:2rem;display:flex;align-items:center;position:relative}.color-input::-webkit-color-swatch-wrapper{padding:0}.color-input::-webkit-color-swatch{border:none}.theme-reset,.theme-save{padding:.4rem .6rem;font-size:.8rem;width:5rem;margin:0 1rem 0 0}.theme-save{animation:pulse 2s infinite}.theme-reset.active{background-color:var(--accent);color:var(--accent-text)}.theme-app-preview{position:relative;margin-top:1.25rem;border:4px dashed var(--accent);border-radius:.4rem;overflow:hidden;height:70vh}.theme-app-preview .keyboard{transform:scale(.8)!important}.color-picker{position:absolute;padding:.3rem;border-radius:.6rem;background-color:#efeff0;z-index:2;right:0;display:flex;justify-content:center;align-items:center;flex-direction:column;box-shadow:1px 1px 5px #45455994;animation:show .2s;width:13.6rem}.color-picker-input{display:flex;align-items:center;margin:0;width:calc(100% - 4.6rem);box-sizing:border-box;border:none;border-radius:.4rem;font-size:1rem;box-shadow:-1px -1px 5px #0003}.color-picker-input *{transform:translateY(.05rem)}.color-picker-input input{padding:.4rem;display:flex;margin:0;width:100%;background-color:initial;box-sizing:border-box;outline:none;border:none}.color-picker-row{display:flex;height:2rem;margin-top:.3rem}.color-picker-check{width:2rem;height:2rem;border-radius:.4rem;border:none;margin:0 0 0 .3rem;padding:0;box-shadow:-1px -1px 5px #0003}.color-picker-check,.new-theme{display:flex;justify-content:center;align-items:center;cursor:pointer}.new-theme{width:100%;height:100%;border-radius:.6rem;flex-direction:column;font-size:1.1rem;border:3px solid var(--accent);background-color:initial;color:var(--accent);min-height:6rem}.react-colorful{border-radius:.5rem!important;width:13rem!important;height:13rem!important;box-shadow:-1px -1px 5px #0003}.react-colorful__pointer{padding:0!important;width:unset!important;height:unset!important;border:.15rem solid #fff!important}.react-colorful__pointer-fill{position:unset!important;width:1.4rem;margin:0!important;height:1.4rem}.theme-preview-wrapper{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-gap:.8rem;gap:.8rem;margin-top:1rem}.theme-preview{display:flex;position:relative;flex-direction:column;width:100%;height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;border-radius:.6rem;transition:filter .2s;cursor:pointer;overflow:hidden;min-height:7rem}.theme-preview-bg{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:contain;background-repeat:no-repeat;background-size:cover}.theme-preview:hover{filter:brightness(1.1)}.theme-input{background-color:var(--primary);color:var(--primary-text);border-radius:.2rem;padding:.5rem 1rem;border:none;height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;cursor:text;min-width:5rem}.theme-input:disabled{filter:brightness(.8);cursor:not-allowed}.theme-input::placeholder{color:var(--primary-text)}.theme-preview-row{display:flex;justify-content:space-between;padding:0 .4rem}.theme-preview-colors{width:100%;display:flex;flex-wrap:wrap;justify-content:center;flex:1 1}.theme-preview-colors div{flex:1 1;font-size:.6rem;display:flex;align-items:center;justify-content:center}@keyframes show{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes pulse{0%{background-color:var(--primary)}50%{background-color:var(--red)}to{background-color:var(--primary)}}@media (max-width:920px){.theme-row{margin-top:.5rem}.theme-app-preview{height:calc(100vh - 3rem)}}.vsrg-page{max-height:100vh;width:100%;height:100%;display:grid;grid-template-areas:"a b" "c c";flex:1 1;grid-template-rows:calc(100% - 2.9rem) -webkit-min-content;grid-template-rows:calc(100% - 2.9rem) min-content;grid-template-columns:1fr -webkit-min-content;grid-template-columns:1fr min-content;grid-gap:.4rem;gap:.4rem;padding:.5rem}.vsrg-top{display:flex;flex:1 1;height:100%;max-height:100%;margin-bottom:.6rem}.vsrg-top-canvas-wrapper{display:flex;flex:1 1;justify-content:center;position:relative;cursor:pointer}.vsrg-top-canvas-wrapper canvas{position:absolute;opacity:.9}.vsrg-top-right{display:flex;grid-area:b;flex-direction:column;width:13.6rem}.vsrg-top-right-disabled .vsrg-track-wrapper{pointer-events:none;opacity:.5}.vsrg-select-song-wrapper{margin-top:.5rem;border:4px dotted var(--accent);padding:0 .4rem;border-radius:.4rem}.vsrg-track{height:3rem;min-height:3rem;transition:background-color .15s;cursor:pointer;overflow:hidden;border-bottom:2px solid var(--secondary)}.vsrg-track-left{width:2rem;font-size:1rem;height:100%;min-width:2rem;padding:0;border-radius:0}.vsrg-floating-settings{position:absolute;right:calc(13.6rem + .8rem);width:18rem;background-color:var(--menu-background);color:var(--menu-background-text);border-radius:.6rem;border:2px solid var(--secondary);top:.5rem;padding:.4rem;animation:fadeIn .15s ease-in-out forwards}.vsrg-track-settings{position:absolute;bottom:.1rem;left:.1rem;padding:0;width:1.2rem;height:1.2rem;background-color:initial;min-width:unset}.vsrg-track-wrapper{min-height:5rem;background-color:var(--primary);margin-bottom:.4rem;border-radius:.6rem;overflow-y:auto}.vsrg-track-wrapper::-webkit-scrollbar-thumb{background:var(--secondary)}.vsrg-keyboard{margin-top:auto;display:grid;grid-gap:.15rem;gap:.15rem}.vsrg-keyboard button{width:100%;transition:all .2s;cursor:pointer;border-radius:.2rem;aspect-ratio:1;min-height:1.4rem;background-color:var(--icon-color);border:none}.vsrg-bottom{grid-area:c;display:flex;justify-content:space-between;align-items:center;margin-left:3.2rem;height:2.5rem}.vsrg-bottom input[type=range]{max-width:30rem}.vsrg-name{text-align:center;margin-left:1rem;max-width:18vw}.multiple-option-slider{display:grid;grid-auto-columns:minmax(0,1fr);grid-auto-flow:column;height:100%;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;border-radius:3rem;position:relative;transition:border .2s;background-color:var(--primary)}.multiple-option-slider button{height:100%;padding:0 1.4rem;color:var(--primary-text);transition:color .2s;z-index:2;cursor:pointer;background-color:initial;border-radius:.4rem;border:none}.decorated-vsrg-canvas{grid-area:a;display:flex;border-radius:.4rem;border:.15rem solid var(--secondary)}.multiple-options-selected{color:var(--accent-text)!important}.multiple-option-slider-overlay{transition:all .15s ease-out;position:absolute;height:calc(100% - .2rem);top:.1rem;border-radius:3rem;background-color:var(--accent)}.vsrg-play-button{color:var(--icon-color);border-radius:.4rem;height:100%;margin-left:.6rem}.track-modifier{padding:.4rem;background-color:var(--menu-background);color:var(--menu-background-text);border-radius:.3rem}.vsrg-track-modifier-button{min-width:unset;padding:.2rem;height:1.6rem;width:2rem;font-size:1rem}.vsrg-composer-selected-song{gap:.4rem;padding:.6rem;border-radius:.4rem;margin-top:.4rem;background-color:var(--primary);color:var(--primary-text)}.vsrg-breakpoints-buttons button{display:flex;min-width:unset;height:2rem;justify-content:center;border-radius:.4rem;align-items:center;flex:1 1;padding:.2rem;margin-left:.2rem}@media only screen and (max-width:1000px){.vsrg-name{display:none}.vsrg-top-right{width:12.6rem}.vsrg-page{grid-template-rows:calc(100% - 2.5rem) -webkit-min-content;grid-template-rows:calc(100% - 2.5rem) min-content}.vsrg-bottom{height:2.2rem;margin-left:2.9rem}.vsrg-keyboard button{aspect-ratio:unset;min-height:1.5rem}.vsrg-hamburger{width:2.2rem;height:2.2rem}.vsrg-track{height:2.4rem;min-height:2.4rem}.multiple-option-slider button{padding:0 1rem}}@media print{body{background-color:#fff!important}}.menu_menu__9t8Wp{width:var(--menu-size);background-color:var(--primary);height:100%;border-right:2px solid var(--secondary);gap:.5rem;border-left:2px solid var(--secondary);align-items:center;flex-direction:column;padding:.4rem 0;max-height:100%;overflow-y:auto;z-index:15;display:flex;margin-left:-4rem;transition:all .3s}.menu_menu-visible__qOFga{margin-left:0}.menu_menu__9t8Wp::-webkit-scrollbar-thumb{background:var(--icon-color);border-radius:2px}.menu_menu__9t8Wp::-webkit-scrollbar{width:3px}.menu_side-menu__pcB3K{width:var(--panel-size);border-radius:.3rem;border-top-left-radius:unset;border-bottom-left-radius:unset;height:100%;background-color:var(--menu-background);color:var(--menu-background-text);transform:scale(.9) translateX(0);transition:all .3s;opacity:0;padding:1rem;display:flex;left:calc(var(--panel-size)*-1);position:fixed}.menu_side-menu-open__8X0ke{transform:scale(1) translateX(calc(var(--panel-size) + var(--menu-size)));opacity:1;--backdrop-amount:4px;animation:menu_delayBackdrop__BXmvL .36s;animation-fill-mode:forwards}.menu_menu-item__srmws{background-color:var(--primary);border:none;width:2.8rem;height:2.8rem;min-height:2.8rem;border-radius:.5rem;cursor:pointer;transition:all .3s}.menu_menu-item__srmws,.menu_menu-item__srmws a{display:flex;justify-content:center;align-items:center;color:var(--icon-color)}.menu_menu-item__srmws a{width:100%;height:100%}.menu_menu-item__srmws:hover{background-color:var(--primary-layer-15)}.menu_menu-item-active__ddcQB{background-color:var(--primary-layer-20)}.menu_menu-panel__52O_y{width:100%;display:none;flex:1 1;flex-direction:column}.menu_menu-panel-visible__vEqiD{display:flex;animation:menu_appearLeft__n64rd .3s}.menu_menu-title__jFnfm{font-size:2rem;width:100%;display:flex;justify-content:center;margin-bottom:1rem}.menu_panel-content-wrapper__b6qUL{display:flex;flex-direction:column;flex:1 1;overflow-y:scroll;overflow-x:hidden;margin-right:-.5rem;padding-right:.5rem}.menu_menu-wrapper__L3HXS{position:fixed;left:0;top:0;height:100%;min-height:100%;display:flex;flex-direction:row;z-index:11}@media only screen and (max-width:920px){.menu_menu__9t8Wp{width:var(--menu-size);gap:.4rem;padding:.3rem 0}.menu_side-menu__pcB3K{padding:.5rem;--panel-size:60vw}.menu_menu-item__srmws{width:2.8rem;height:2.8rem}.menu_menu-title__jFnfm{display:none;font-size:1rem;margin-bottom:.5rem;justify-content:flex-start}.menu_panel-content-wrapper__b6qUL{margin-right:-.3rem;padding-right:.2rem}}@keyframes menu_appearLeft__n64rd{0%{transform:translateX(-.5rem) var(--existing-transform, );opacity:.6}to{transform:translateX(0) var(--existing-transform, );opacity:1}}.i18n_i18n-selector__6POuf{gap:.2rem;display:flex;max-width:8rem;padding:.5rem 1.2rem .5rem .5rem;border-radius:.4rem;min-width:unset;background-color:var(--primary);align-items:center;appearance:none;-webkit-appearance:none;border:none;color:var(--primary-text)}.promotionCard_promotion-card__q3_7R{position:relative;border:.1rem solid var(--secondary);overflow:hidden}.promotionCard_promotion-image__y9DlY{position:absolute;top:0;left:0;object-fit:cover;width:100%;height:100%;filter:blur(.1rem);-webkit-mask:linear-gradient(270deg,#000c,#0000000d 60%);mask:linear-gradient(270deg,#000c,#0000000d 60%)}.promotionCard_promotion-close__gcnLo{position:absolute;padding:.4rem;display:flex;justify-content:center;align-items:center;border:none;font-size:1rem;color:var(--secondary-text);border-bottom-left-radius:.4rem;width:3rem;cursor:pointer;z-index:3;background-color:var(--secondary);top:0;right:0;transition:background-color .2s}.promotionCard_promotion-close__gcnLo:hover{background-color:var(--secondary-layer-10)}.promotionCard_promotion-right-side__WNpYc{background:linear-gradient(270deg,#000000b3 0,#0000000d)}.pageVisit_non-visited__hCywx{position:relative}.pageVisit_non-visited__hCywx:after{content:var(--new-text);position:absolute;top:0;transform:rotate(45deg) translate(20%,-80%);right:0;background-color:var(--accent);color:var(--accent-text);font-size:.7rem;z-index:4;border-radius:.2rem;padding:.1rem .3rem}