@import"https://fonts.googleapis.com/css2?family=Noto+Music&family=Ubuntu&display=swap";a[data-v-d57662a2]{padding:8px 16px;display:inline-block;text-decoration:none;color:#bec4c9;fill:#bec4c9;color:#9ca1a6;fill:#9ca1a6;transition:.2s;position:relative}a[data-v-d57662a2]:after{content:"";opacity:.5;left:0;right:0;display:block;border-style:solid;border-color:transparent;border-width:0;position:absolute;bottom:-1px;transition:.2s}a[data-v-d57662a2]:hover{color:#9ca1a6;fill:#9ca1a6}a.router-link-active[data-v-d57662a2]{color:#252527;fill:var(--theme-color)}a.router-link-active[data-v-d57662a2]:after{border-bottom-width:1px;border-color:var(--theme-color)}a>*[data-v-d57662a2]{vertical-align:text-top}a>.icon[data-v-d57662a2]{margin-right:4px;opacity:.5}a>.icon[data-v-d57662a2] path{fill:inherit}.navigator[data-v-d57662a2]{border-bottom:1px solid #e9ebee;margin-bottom:12px;transition:.2s;text-align:center}@media screen and (max-width: 414px){.navigator[data-v-d57662a2]{background:var(--theme-color);height:100%;box-sizing:border-box;transform:translate(-100%);transition:.2s;min-width:200px}.navigator[data-v-d57662a2]:after{content:"";background:var(--theme-color);position:absolute;z-index:-1;top:0;right:1px;bottom:0;left:0;filter:saturate(25%)}.navigator[data-v-d57662a2]:before{content:"";background:none;top:0;bottom:0;left:100%;position:fixed;z-index:-1;width:0}.navigator>*[data-v-d57662a2]{text-align:left}.navigator>a[data-v-d57662a2]{display:block;color:#fff;fill:#fff;opacity:.5;padding:12px 20px;font-size:16px}.navigator>a[data-v-d57662a2]:after{width:1px;height:100%;right:0;left:auto;bottom:0;top:0}}@media screen and (max-width: 414px) and (max-width: 414px){.navigator>a[data-v-d57662a2]:after{border-right:4px solid white;border-top:4px solid transparent;border-bottom:4px solid transparent;height:0;width:0;top:calc(50% - 4px);opacity:0}}@media screen and (max-width: 414px){.navigator>a.router-link-active[data-v-d57662a2]{opacity:1}.navigator>a.router-link-active[data-v-d57662a2]:after{opacity:1}}@media screen and (max-width: 414px) and (min-width: 415px){.navigator>a.router-link-active[data-v-d57662a2]:after{border-bottom-width:0px;border-right-width:1px}}@media screen and (max-width: 414px){.navigator.open[data-v-d57662a2]{transform:translate(0);z-index:100}.navigator.open[data-v-d57662a2]:before{width:100vw;background:rgba(246,247,249,.5)}}.navigator__toggle[data-v-d57662a2]{padding:20px;position:absolute;left:100%;top:0;font-size:18px;border:0;background:none;line-height:0;cursor:pointer;color:var(--theme-color);fill:var(--theme-color)}@media screen and (min-width: 415px){.navigator__toggle[data-v-d57662a2]{display:none}}@media screen and (max-width: 414px){.navigator[data-v-d57662a2]{position:fixed;z-index:10;top:0;padding-top:16px;padding-bottom:16px}}.preference[data-v-5985f247]{box-sizing:border-box;position:fixed;z-index:9;bottom:0;flex-wrap:wrap;align-items:flex-end}@media screen and (max-width: 768px){.preference[data-v-5985f247]{background:var(--theme-color);height:100%;box-sizing:border-box;transform:translate(-100%);transition:.2s;min-width:200px}.preference[data-v-5985f247]:after{content:"";background:var(--theme-color);position:absolute;z-index:-1;top:0;right:1px;bottom:0;left:0;filter:saturate(25%)}.preference[data-v-5985f247]:before{content:"";background:none;top:0;bottom:0;left:100%;position:fixed;z-index:-1;width:0}.preference>*[data-v-5985f247]{text-align:left}.preference>a[data-v-5985f247]{display:block;color:#fff;fill:#fff;opacity:.5;padding:12px 20px;font-size:16px}.preference>a[data-v-5985f247]:after{width:1px;height:100%;right:0;left:auto;bottom:0;top:0}}@media screen and (max-width: 768px) and (max-width: 768px){.preference>a[data-v-5985f247]:after{border-right:4px solid white;border-top:4px solid transparent;border-bottom:4px solid transparent;height:0;width:0;top:calc(50% - 4px);opacity:0}}@media screen and (max-width: 768px){.preference>a.router-link-active[data-v-5985f247]{opacity:1}.preference>a.router-link-active[data-v-5985f247]:after{opacity:1}}@media screen and (max-width: 768px) and (min-width: 769px){.preference>a.router-link-active[data-v-5985f247]:after{border-bottom-width:0px;border-right-width:1px}}@media screen and (max-width: 768px){.preference.open[data-v-5985f247]{transform:translate(0);z-index:100}.preference.open[data-v-5985f247]:before{width:100vw;background:rgba(246,247,249,.5)}}.preference__toggle[data-v-5985f247]{padding:20px;position:absolute;left:100%;top:0;font-size:18px;border:0;background:none;line-height:0;cursor:pointer;color:var(--theme-color);fill:var(--theme-color)}@media screen and (min-width: 769px){.preference__toggle[data-v-5985f247]{display:none}}@media screen and (min-width: 769px){.preference[data-v-5985f247]{display:flex;font-size:.85rem;pointer-events:none}.preference .preference__toggle[data-v-5985f247],.preference .preference__context>*[data-v-5985f247]{pointer-events:all}}@media screen and (max-width: 768px){.preference[data-v-5985f247]{top:0;width:300px}.preference .btn-outline[data-v-5985f247]{border-color:transparent}}.preference__context[data-v-5985f247]{overflow:auto;height:100%;box-sizing:border-box;padding:16px;position:relative;z-index:1}@media screen and (min-width: 769px){.preference__context[data-v-5985f247]{display:flex;align-items:flex-end}}@media screen and (max-width: 768px){.preference__context[data-v-5985f247]{padding-left:0;padding-right:0}}.preference__toggle[data-v-5985f247]{bottom:0;top:auto;margin:0}.hz-selector[data-v-5985f247]{padding:.6rem 1.2rem;filter:saturate(50%);display:inline-block;cursor:pointer;border:2px solid #e9ebee;border-radius:.25rem;width:100%;position:relative;box-sizing:border-box;transition:.2s;white-space:nowrap;vertical-align:middle;font-size:12px;padding-left:12px;padding-right:12px;background-color:#fff}.hz-selector[data-v-5985f247]:hover{border-color:#bec4c9}.hz-selector input[type=range][data-v-5985f247]{display:block;width:100%}.hz-selector__text[class][data-v-5985f247]{color:#9ca1a6;font-size:12px}@media screen and (min-width: 769px){.hz-selector__text[class][data-v-5985f247]{position:absolute;background:white;width:auto;top:-.75rem;left:1rem;padding-left:.5em;padding-right:.5em}}@media screen and (max-width: 768px){.hz-selector__text[class][data-v-5985f247]{width:4em;padding-left:4px;padding-right:4px;background:var(--theme-color);border-radius:2px;color:#fff;margin-left:8px;line-height:1.7;opacity:.5}}@media screen and (max-width: 768px){.hz-selector[data-v-5985f247]{border-color:transparent}.hz-selector[class][data-v-5985f247]{display:flex}.hz-selector input[type=range][data-v-5985f247]{max-width:none;flex:1 1 1%}}html{height:100%}@media screen and (max-width: 991px){html{font-size:14px}}@media screen and (max-width: 768px){html{font-size:12px}}body,*{font-family:Ubuntu,sans-serif;letter-spacing:.025em;line-height:1.5;touch-action:pan-x pan-y}body{margin:0;padding:0;height:100%}*,*:before,*:after{border-color:inherit;color:inherit}svg{width:1em}:root{--theme-color: #60007a}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}body:before,body:after{content:"";pointer-events:none;opacity:0;z-index:-1;transition:.2s}body:after{content:"";position:fixed;top:50%;left:50%;border:2px solid var(--theme-color);border-top-color:transparent;border-radius:50%;width:4em;height:4em;animation:rotate .5s infinite linear}body:before{content:"";position:fixed;top:0;bottom:0;left:0;right:0;background:rgba(255,255,255,.75);filter:blur(5px)}body.loading:before,body.loading:after{z-index:100;opacity:1}body.loading{pointer-events:none}body.loading .page{filter:blur(5px)}#app{height:100%;max-width:1200px;margin:0 auto}@media screen and (max-width: 414px){.navigator.open~.navpage{filter:blur(5px)}}.preference .input,.preference .checkbox,.preference select{box-sizing:border-box}@media screen and (min-width: 769px){.preference .input,.preference .checkbox,.preference select{margin:8px}}@media screen and (max-width: 768px){.preference .input,.preference .checkbox,.preference select{margin:12px;background-color:#fff;min-height:36px;width:calc(100% - 24px);height:auto}.preference .input,.preference .input:hover,.preference .checkbox,.preference .checkbox:hover,.preference select,.preference select:hover{border-color:transparent}}@media screen and (max-width: 768px){.preference .input>label,.preference .input>label:hover,.preference .checkbox>label,.preference .checkbox>label:hover,.preference select>label,.preference select>label:hover{border-color:transparent}}.preference .btn-group{padding:12px;display:flex;align-items:flex-end;margin-top:auto}.preference .btn-group>button{display:inline-block;vertical-align:middle;font-size:inherit;min-width:2em;height:2em;background:none;border:2px solid;border-radius:2em;align-self:center;cursor:pointer;transition:.2s;padding:0 1em;background:white;position:relative;color:var(--theme-color);fill:var(--theme-color)}.preference .btn-group>button:hover{box-shadow:0 0 0 2px #fff,0 0 0 3px #e9ebee}.preference .btn-group>button>svg{font-size:1.2em;position:absolute;top:50%;left:50%;margin-left:1px;transform:translate(-50%,-50%)}.preference .btn-group>button>svg{position:relative;bottom:auto;left:-2px;top:.3em;font-size:1em;margin-top:-1px;vertical-align:top;transform:none}@media screen and (max-width: 768px){.preference .color-picker{min-height:0}}.preference>select{font-size:1rem}@media screen and (max-width: 414px){.preference .input{margin-top:0}}@media screen and (max-width: 768px){.preference select{width:calc(100% - 24px);box-sizing:border-box;margin-top:0}}@media screen and (max-width: 768px){.preference.open~.navpage{filter:blur(5px)}}.navpage{display:flex;flex-direction:column;min-height:calc(100vh - 58px);background:white;position:relative;z-index:0;color:var(--theme-color);fill:var(--theme-color)}.navpage__page{transition:.2s;flex:1 1 1%}.navpage__nav{position:sticky;flex:0 0 auto;z-index:100;left:0;bottom:0;padding:1em;display:flex;align-items:flex-end;justify-content:space-between;pointer-events:none}.navpage__nav>*{pointer-events:all}.navpage__nav .preference{left:.5em;top:.5em;transition:.2s;padding:0;display:flex;flex-wrap:wrap}.navpage__nav .control{margin-left:auto;position:relative}.navpage__nav .control>button{display:inline-block;vertical-align:middle;font-size:inherit;min-width:2em;height:2em;background:none;border:2px solid;border-radius:2em;align-self:center;cursor:pointer;transition:.2s;padding:0 1em;background:white;position:relative}.navpage__nav .control>button:hover{box-shadow:0 0 0 2px #fff,0 0 0 3px #e9ebee}.navpage__nav .control>button>svg{font-size:1.2em;position:absolute;top:50%;left:50%;margin-left:1px;transform:translate(-50%,-50%)}.navpage__nav .control>button[disabled]{background:#f6f7f9;pointer-events:none;color:#bec4c9;fill:#bec4c9}.navpage__nav .control>*,.navpage__nav .control>button{min-width:3.5em;height:3.5em;padding:.5em 1em;position:relative;box-sizing:border-box;vertical-align:middle}@media screen and (max-width: 414px){.navpage__nav .control>*,.navpage__nav .control>button{display:block;margin-top:1em}}.section{width:100%}.section>*{padding:12px}.section__head{font-size:1.5rem;text-align:center;font-weight:700}.section__foot{text-align:center}.section__foot button{padding:8px 16px;background:var(--theme-color);border-radius:3em;border:0;color:#fff;cursor:pointer;opacity:.85;filter:saturate(85%);transition:.2s;margin:4px}.section__foot button[disabled]{background:#e9ebee;border-color:#bec4c9;color:#9ca1a6;fill:#9ca1a6;pointer-events:none}.section__foot button:hover{opacity:1;filter:saturate(100%)}.section__foot .btn-outline{background:none;color:var(--theme-color);border:2px solid var(--theme-color)}select{padding:.6rem 1.2rem;filter:saturate(50%);display:inline-block;border:2px solid #e9ebee;width:100%;position:relative;white-space:nowrap;height:100%;color:inherit;background:none;cursor:pointer;border-radius:.25rem;box-sizing:border-box;font-size:inherit;transition:.2s;-webkit-appearance:none;appearance:none;padding-right:2em;color:var(--theme-color);background:url(/s/caret-down.18ff34d0.svg) no-repeat calc(100% - 1em) center;background-color:#fff}select:hover{border-color:#bec4c9}select,select:focus,select:active,select:focus:active{outline:none}.input>label>select{padding-left:8px;padding-right:8px;min-height:0;width:auto;margin:0 0 0 4px}.color-picker,.input,.checkbox{border-radius:.25rem;color:var(--theme-color);fill:var(--theme-color);background:white}.color-picker-backup{align-self:stretch}.color-picker-backup>input{opacity:0;height:0;width:0;pointer-events:none;position:fixed}.color-picker-backup>label{width:2em;transition:.2s;height:100%;border:2px solid #e9ebee;box-sizing:border-box;box-shadow:inset 0 0 0 2px #fff,inset 0 0 0 10rem;display:block;border-radius:.25rem;cursor:pointer;position:relative;z-index:0}@media screen and (max-width: 768px){.color-picker-backup>label .color-picker>label{min-height:2em;width:100%;box-sizing:border-box;border:2px solid white}}@media screen and (max-width: 768px){.color-picker{background:none!important;position:absolute;right:16px;z-index:0}}.color-picker>input{opacity:0;height:0;width:0;pointer-events:none;position:fixed}.color-picker>label{font-size:2rem;cursor:pointer;transition:.2s;line-height:1;padding:12px}@media screen and (min-width: 769px){.color-picker>label svg{display:inline-block;position:relative;top:2px}}@media screen and (max-width: 768px){.color-picker>label{background:white!important;display:inline-flex;justify-content:center;align-items:center;padding:4px;font-size:1rem;border-radius:50%;width:1.5em;height:1.5em}}.checkbox{white-space:nowrap}.checkbox>input{pointer-events:none;position:absolute;opacity:0}.checkbox>input:checked+label:before{right:1.2em}@media screen and (min-width: 769px){.checkbox>input:checked+label:before{right:1.425em}}.checkbox>input:checked+label:after{box-shadow:inset 0 0 0 10rem,0 0 0 2px}.checkbox>label{padding:.6rem 1.2rem;filter:saturate(50%);display:inline-block;cursor:pointer;border:2px solid #e9ebee;border-radius:.25rem;width:100%;position:relative;box-sizing:border-box;transition:.2s;white-space:nowrap;display:flex;justify-content:space-between;align-items:center}.checkbox>label:hover{border-color:#bec4c9}.checkbox>label:before{content:"";display:inline-block;width:1em;height:1em;margin-left:1em;position:absolute;background:white;border-radius:50%;right:2.2em;top:.85em;transition:.2s}@media screen and (min-width: 769px){.checkbox>label:before{top:.955em;right:2.4em}}.checkbox>label:after{content:"";display:inline-block;vertical-align:text-top;width:2em;height:1em;border-radius:3em;margin-left:1em;background:#bec4c9;box-shadow:inset 0 0 0 10rem #bec4c9,0 0 0 2px #bec4c9}.input{display:inline-flex}.input>label{padding:.6rem 1.2rem;filter:saturate(50%);display:inline-block;cursor:pointer;border:2px solid #e9ebee;border-radius:.25rem;width:100%;position:relative;box-sizing:border-box;transition:.2s;white-space:nowrap;display:inline-flex}.input>label:hover{border-color:#bec4c9}.input input{text-align:right}.input input,.input select{transition:.2s;min-width:0;font-size:inherit;border:0;padding:0;margin-left:.5em;outline:none;border-radius:.125rem;flex:1 1 1%;background-color:#f6f7f9}.input input:focus,.input select:focus{box-shadow:0 0 0 2px #e9ebee;background-color:#e9ebee}.input select{background-size:.6em 1em}.input select:focus{background-color:#fff}@media screen and (min-width: 769px){.formfield{margin-bottom:-.25rem}}.formfield>*{display:block}.formfield__label,.formfield__field[class]{padding:0 12px 12px}.formfield__label{font-size:1.5rem;color:#bec4c9;letter-spacing:0}.formfield__field[class]>*{margin:0;display:block;width:100%}.formfield__field[class]>*:not(:first-child){margin-top:12px}.formfield__field[class]>*:not(:last-child){margin-bottom:12px}.formfield__field[class]>*,.formfield__field[class]>*>label{margin-left:0;margin-right:0}.formfield__field[class]>*:first-child,.formfield__field[class]>*>label:first-child{margin-top:0}[hint]{position:relative}[hint]:before{filter:saturate(50%);content:attr(hint);position:absolute;left:50%;top:0;transform:translate(-50%);opacity:0;transition:.2s}[hint]:hover:before{opacity:.5}.text-info{color:#252527}.text-info:before{content:"i";font-size:1em;transform:scale(.75);transform-origin:bottom left;font-weight:700;display:inline-block;color:var(--theme-color);padding:2px;border:2px solid;border-radius:50%;width:1em;height:1em;line-height:1;vertical-align:text-bottom;opacity:.75}.number{filter:saturate(50%)}.note:empty:not(.rest)+span:empty:not(.rest)+span:not(:empty):after:not(:last-child),.note:empty:not(.rest)+span:empty:not(.rest)+span:last-child:after:not(:last-child),.arrow:empty:not(.rest)+span:empty:not(.rest)+span:not(:empty):after:not(:last-child),.arrow:empty:not(.rest)+span:empty:not(.rest)+span:last-child:after:not(:last-child){left:auto;right:.25rem}.bar{display:flex;flex-wrap:wrap;justify-content:center;padding:2rem}@media screen and (orientation: landscape){.bar{padding-left:0;padding-right:0}}@media screen and (max-width: 480px){.bar{flex-direction:column}}.beat{transition:.2s;min-width:8rem;text-align:center;display:flex;flex-direction:column;align-items:center;padding:2rem;border-radius:8px}@media screen and (max-width: 768px){.beat{padding:2rem 1rem}}@media screen and (min-width: 1025px){.beat:not(.disabled):hover{box-shadow:0 0 0 2px #eee}}.beat:active{opacity:.75}.beat .control{margin:0}@media screen and (max-width: 768px){.beat .control{margin-bottom:1em;background:#e9ebee;border-radius:3em;padding:.25em;position:relative}.beat .control:after{content:"";border-top:4px solid #e9ebee;border-left:4px solid transparent;border-right:4px solid transparent;position:absolute;top:100%;left:calc(50% - 2px)}}@media screen and (min-width: 1025px){.beat .control{transition:.2s;opacity:0;pointer-events:none;margin:0}}.beat .control button{font-size:12px;font-weight:400;opacity:.5;width:3em;height:3em;padding:.5em;line-height:1}.beat .control button svg{position:relative;fill:#666;top:1px}.beat .control button:hover{opacity:1}.beat .control button.btn-carousel{background:none;margin:0;border:0;width:auto;height:auto;min-width:0}.beat .control button.btn-carousel:before{content:"";border-top:4px solid transparent;border-bottom:4px solid transparent;height:0;display:block}.beat .control button.btn-carousel:first-child:before{border-left:0;border-right:4px solid var(--theme-color)}.beat .control button.btn-carousel:last-child:before{border-right:0;border-left:4px solid var(--theme-color)}.beat .control button.btn-carousel,.beat .control button.btn-carousel:hover{box-shadow:none}@media screen and (max-width: 768px){.beat .control button{opacity:1;margin:0;padding:0;border-color:transparent;box-shadow:0 2px 5px #00000014,0 8px 16px -8px #0000000d}.beat .control button:not(:first-child){margin-left:.5em}.beat .control button.btn-carousel{display:none}.beat .control button.btn-carousel:first-child+button{margin-left:0}}.beat:hover .control{opacity:1;pointer-events:all}.note,.arrow{border-left:.25rem solid;height:2rem;line-height:1;display:inline-block;vertical-align:middle;text-align:center;margin:0 1rem;font-size:0;position:relative}.note:before,.note:after,.arrow:before,.arrow:after{content:"";display:block;position:absolute}.note:before,.arrow:before{width:1rem;height:1rem;box-shadow:inset 0 0 0 5rem currentColor;border-radius:50% 0 50% 50%;top:100%;right:0}.note:after,.arrow:after{width:1rem;border-top:.25rem solid;top:.5rem}.note:first-child:after,.arrow:first-child:after{right:.25rem}.note:not(:empty)+*:empty:not(.rest):last-child:after,.arrow:not(:empty)+*:empty:not(.rest):last-child:after{width:2.25rem}.note:not(:empty)+*:empty:not(.rest)+:not(:empty):last-child:after,.arrow:not(:empty)+*:empty:not(.rest)+:not(:empty):last-child:after{box-shadow:0 -.5rem currentColor,1rem -.5rem currentColor}.note:not(:empty)+*:not(:empty)+:not(:empty):after,.arrow:not(:empty)+*:not(:empty)+:not(:empty):after{width:2.25rem}.note:empty:not(.rest):not(:last-child),.arrow:empty:not(.rest):not(:last-child){display:none}.note:empty:not(.rest)+span:not(:empty):after,.note:empty:not(.rest)+span:not(:empty):last-child:after,.arrow:empty:not(.rest)+span:not(:empty):after,.arrow:empty:not(.rest)+span:not(:empty):last-child:after{border-color:transparent;box-shadow:0 -.5rem currentColor,-1rem -.5rem currentColor,1.25rem -.5rem currentColor}.note:empty:not(.rest)+span:not(:empty):nth-child(2):after,.arrow:empty:not(.rest)+span:not(:empty):nth-child(2):after{box-shadow:0 -.5rem currentColor,-1rem -.5rem currentColor}.note:empty:not(.rest)+span:not(:empty):last-child:after,.arrow:empty:not(.rest)+span:not(:empty):last-child:after{box-shadow:0 -.5rem currentColor}.note:empty:not(.rest)+span:not(:empty):not(:last-child):after,.arrow:empty:not(.rest)+span:not(:empty):not(:last-child):after{left:auto;right:.25rem}.note:empty:not(.rest)+span:not(:empty):not(:last-child).afterRest:after,.arrow:empty:not(.rest)+span:not(:empty):not(:last-child).afterRest:after{left:0;right:auto;box-shadow:0 -.5rem currentColor}.note:empty:not(.rest)+span:not(:empty)+*:last-child:after,.arrow:empty:not(.rest)+span:not(:empty)+*:last-child:after{width:1rem}.note:empty:not(.rest)+span:not(:empty)+*:not(:empty):not(:last-child):not(.afterRest):after,.arrow:empty:not(.rest)+span:not(:empty)+*:not(:empty):not(:last-child):not(.afterRest):after{left:auto;right:.25rem}.note:empty:not(.rest)+span:empty:not(.rest):after,.arrow:empty:not(.rest)+span:empty:not(.rest):after{border-color:transparent;box-shadow:0 -.5rem currentColor,1rem -.5rem currentColor}.note:empty:not(.rest)+span:empty:not(.rest)+span:not(:empty):last-child:after,.arrow:empty:not(.rest)+span:empty:not(.rest)+span:not(:empty):last-child:after{box-shadow:0 -.5rem currentColor}.note:empty:not(.rest)+span:empty:not(.rest)+span:not(:empty):not(.rest):before,.note:empty:not(.rest)+span:empty:not(.rest)+span:last-child:not(.rest):before,.arrow:empty:not(.rest)+span:empty:not(.rest)+span:not(:empty):not(.rest):before,.arrow:empty:not(.rest)+span:empty:not(.rest)+span:last-child:not(.rest):before{box-shadow:inset 0 0 0 3rem currentColor,1rem -.5rem 0 -.3rem currentColor}.note:empty:not(.rest)+span:empty:not(.rest)+span:not(:empty):after,.note:empty:not(.rest)+span:empty:not(.rest)+span:last-child:after,.arrow:empty:not(.rest)+span:empty:not(.rest)+span:not(:empty):after,.arrow:empty:not(.rest)+span:empty:not(.rest)+span:last-child:after{border-color:transparent}.note:empty:not(.rest)+span:empty:not(.rest)+span:not(:empty):nth-child(3):after,.note:empty:not(.rest)+span:empty:not(.rest)+span:last-child:nth-child(3):after,.arrow:empty:not(.rest)+span:empty:not(.rest)+span:not(:empty):nth-child(3):after,.arrow:empty:not(.rest)+span:empty:not(.rest)+span:last-child:nth-child(3):after{box-shadow:0 -.5rem currentColor}.note:empty:not(.rest)+span:empty:not(.rest)+span:empty:not(.rest)+span:before,.arrow:empty:not(.rest)+span:empty:not(.rest)+span:empty:not(.rest)+span:before{box-shadow:inset 0 0 0 3rem currentColor}.note:empty:not(.rest)+span:empty:not(.rest)+span:empty:not(.rest)+span:after,.arrow:empty:not(.rest)+span:empty:not(.rest)+span:empty:not(.rest)+span:after{box-shadow:none}.note:empty:not(.rest):first-child:not(:empty)+span+span:not(:empty):not(:last-child):after,.note:empty:not(.rest):not(:first-child):not(:last-child):not(:empty)+span:not(:empty):not(:last-child):after,.arrow:empty:not(.rest):first-child:not(:empty)+span+span:not(:empty):not(:last-child):after,.arrow:empty:not(.rest):not(:first-child):not(:last-child):not(:empty)+span:not(:empty):not(:last-child):after{box-shadow:-.25rem -.5rem currentColor,1.5rem -.5rem currentColor,2.25rem -.5rem currentColor}.note__wrapper,.arrow__wrapper{display:inline-flex;flex-direction:row-reverse;justify-content:flex-end;margin:1rem;position:relative}@media screen and (orientation: landscape){.note__wrapper,.arrow__wrapper{margin:1rem}}.note__wrapper:before,.note__wrapper:after,.arrow__wrapper:before,.arrow__wrapper:after{content:"";display:block;position:absolute}.note__wrapper:before,.arrow__wrapper:before{left:1rem;right:1rem;border-top:.25rem solid}.note__wrapper.quarter:before,.note__wrapper.fullrest:before,.arrow__wrapper.quarter:before,.arrow__wrapper.fullrest:before{border-color:transparent}.note__wrapper.tie:after,.arrow__wrapper.tie:after{width:1rem;height:.5rem;border:.25rem solid;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent;border-radius:50%;left:-.1rem;top:-.2rem}.note__wrapper:before{border-color:transparent}.note__wrapper.tie:after{top:auto;left:-1.2rem;bottom:-1rem;border-bottom-color:inherit;border-top-color:transparent}.note.rest{border:0;margin:0;width:3rem;text-align:center}.note.rest:before{content:"\1d13f";font-family:Noto Music,sans-serif;font-weight:700;top:0;left:-1.5rem;box-shadow:none;font-size:3rem;text-indent:-.25em;line-height:.75em;position:static;width:auto;height:auto}.note.rest:after{display:none}.note.rest:only-child:before{content:"\1d13d"}.note.rest.afterRest{display:none}.note.rest+.note:not(.rest):not(:last-child):after{left:auto;right:.25rem}.note.rest+span:empty:not(.rest)+*:not(.rest):after{box-shadow:0 -.5rem currentColor}.note.afterRest:not(.rest)[class][class]:after{left:0;right:auto}.note:after{box-shadow:0 -.5rem currentColor}.note:empty+.rest:before{content:"\1d13e"}.note:empty:first-child+.afterRest:not(:empty)[class]:after{left:auto;right:auto;box-shadow:0 -.5rem currentColor}.note:empty+span:empty+.rest:before{content:"\1d13e\1d16d"}.note:first-child.afterRest:after{left:0;right:auto}.arrow{height:.25rem;margin-top:1.75rem;box-shadow:0 -.25rem currentColor,0 -.5rem currentColor,0 -.75rem currentColor,0 -1rem currentColor,0 -1.25rem currentColor}.arrow__wrapper:before{left:.25rem;right:.25rem}.arrow:before{box-shadow:none;border-left:.25rem solid;border-top:.25rem solid;border-radius:0;bottom:auto;top:-1.5rem;height:.5rem;width:.5rem;right:-.625rem;transform:rotate(45deg);transform-origin:top left}.arrow:after{bottom:-1rem;top:auto;transform-origin:left bottom;transform:translate(-1rem);width:1.75rem}.arrow:first-child:after{right:auto}.arrow:nth-child(1):before,.arrow:nth-child(3):before{transform:translateY(100%) rotate(-135deg);top:auto;bottom:-.125rem}.arrow:empty:not(.rest)+span:not(:empty):not(:last-child):after{right:auto}.arrow:empty:not(.rest)+span:not(:empty)+*:last-child:after{width:1.75rem}.arrow:empty:not(.rest)+span:not(:empty)+*:not(:empty):not(:last-child):not(.afterRest):after{right:auto}.arrow:empty:not(.rest)+span:empty:not(.rest)+span:not(:empty),.arrow:empty:not(.rest)+span:empty:not(.rest)+span:last-child{box-shadow:0 -.25rem currentColor,0 -.5rem currentColor,0 -.75rem currentColor,0 -1rem currentColor,0 -1.25rem currentColor,1rem 0 0 .05rem currentColor}.arrow:empty:not(.rest)+span:empty:not(.rest)+span:not(:empty).rest,.arrow:empty:not(.rest)+span:empty:not(.rest)+span:last-child.rest{box-shadow:1rem 0 0 .05rem currentColor}.arrow:empty:not(.rest)+span:empty:not(.rest)+span:not(:empty):not(.rest):before,.arrow:empty:not(.rest)+span:empty:not(.rest)+span:last-child:not(.rest):before{box-shadow:none}.arrow:empty:not(.rest)+span:empty:not(.rest)+span:not(:empty):before,.arrow:empty:not(.rest)+span:empty:not(.rest)+span:last-child:before{box-shadow:none}.arrow:empty:not(.rest)+span:empty:not(.rest)+span:empty:not(.rest)+span{box-shadow:0 -.25rem currentColor,0 -.5rem currentColor,0 -.75rem currentColor,0 -1rem currentColor,0 -1.25rem currentColor}.arrow:empty:not(.rest)+span:empty:not(.rest)+span:empty:not(.rest)+span:before{box-shadow:none}.arrow:not(:empty)+.arrow:not(:empty):not(:nth-child(3)):after{width:2.25rem}.arrow.rest,.arrow.rest:before{border-color:transparent;box-shadow:none}.arrow.rest:before{content:"0";font-size:2rem;top:0;transform:translate(-.75rem,-2rem)}.arrow.rest:only-child:after{display:none}.arrow.rest.afterRest{display:none}.arrow.rest+.rest:after{display:none}.arrow.rest+.rest+.rest{box-shadow:1rem 0 0 .05rem currentColor}.beat8 .arrow:not(.rest):nth-child(2):before{transform:translateY(100%) rotate(-135deg);top:auto;bottom:-.125rem}.arrow__wrapper{margin-top:2em;opacity:.5}.arrow__wrapper:before{top:auto;bottom:-.5rem}.number{width:1em;text-align:center;font-size:1.2rem}.number:empty:before{content:"-"}.number:last-child{margin-right:.5rem}.number.rest:before{content:"0";font-size:inherit}.number.rest+.rest:before{content:"-"}.number__wrapper{display:flex;justify-content:center;padding:1rem 0}.number__wrapper+.arrow__wrapper{margin-top:0}.control{text-align:center}.control button{display:inline-block;vertical-align:middle;position:relative;font-size:inherit;min-width:2em;height:2em;background:none;border:2px solid;border-radius:2em;align-self:center;cursor:pointer;transition:.2s;padding:0 1em;background:white;margin:.5em;border-width:1px}.control button:hover{box-shadow:0 0 0 2px #fff,0 0 0 3px #e9ebee}.btn-delete{color:#b22222}.btn-delete svg path{fill:#b22222}.modal-wrapper{position:fixed;z-index:11;transition:.2s;top:0;bottom:0;left:0;right:0;padding:10vh 5vw;overflow:auto;pointer-events:none;text-align:center}.modal-wrapper:before{content:"";height:100%;position:absolute;top:0;right:0;left:0;bottom:0;z-index:-1}.modal-wrapper:not(:empty){pointer-events:all;background:rgba(37,37,39,.95)}.modal-wrapper:not(:empty)~*{filter:blur(5px)}.modal{width:800px;max-width:80vw;margin:12vh auto;background:white;box-shadow:0 3px 5px #0000001a,0 8px 16px -8px #0000001a,0 30px 50px -30px #00000080;border-radius:12px;position:relative}.modal__bgclose{position:fixed;z-index:-1;top:0;left:0;right:0;bottom:0}.modal>*{padding:12px 16px}.modal>*:not(:first-child){border-top:1px solid #ccc}.modal__dismiss{border-radius:3em;border:0;color:#fff;cursor:pointer;opacity:.85;filter:saturate(85%);transition:.2s;opacity:1;padding:0;font-size:1em;background:var(--theme-color);width:2.5em;height:2.5em;border:2px solid white;filter:brightness(1)}.modal__dismiss[disabled]{background:#e9ebee;border-color:#bec4c9;color:#9ca1a6;fill:#9ca1a6;pointer-events:none}.modal__dismiss:hover{opacity:1;filter:saturate(100%)}.modal__dismiss:hover{filter:brightness(1.2)}.modal__dismiss svg{vertical-align:text-bottom;fill:#fff}.modal__head{display:flex;position:relative;font-size:1.2em;letter-spacing:0}.modal__head .modal__dismiss{position:absolute;top:0;right:0;transform:translate(35%,-35%);font-size:1rem}.modal__foot:empty{display:none}.modal__foot__actions{display:flex;justify-content:flex-end;margin:-4px;font-size:14px}.modal__foot__actions button{display:inline-block;vertical-align:middle;position:relative;font-size:inherit;min-width:2em;height:2em;background:none;border:2px solid;border-radius:2em;align-self:center;cursor:pointer;transition:.2s;padding:0 1em;background:white;margin:4px;color:var(--theme-color)}.modal__foot__actions button:hover{box-shadow:0 0 0 2px #fff,0 0 0 3px #e9ebee}.modal__foot__actions button:last-child{background:var(--theme-color);border-color:var(--theme-color);color:#fff}.list-enter,.list-leave-to{opacity:0;transform:translateY(10px)}.list-leave-active{position:absolute}.fade-enter-active,.fade-leave-active{transition:opacity .2s ease}.fade-enter-from,.fade-leave-to{opacity:0}.fade-leave-active{position:absolute;left:50%;transform:translate(-50%)}