@charset "UTF-8";.board__DUNJ{display:flex;outline:none}.board__DUNJ .strings__hYAE{display:flex;justify-content:center;align-items:center;flex-direction:row;margin:0%;padding:0%;width:-moz-fit-content;width:fit-content}.board__DUNJ .board-view__haVl{display:flex;flex-direction:row}.board__DUNJ .board-view__haVl .frets-zero__hZfC .point__wEcK{width:40px!important;width:var(--btn-size)!important}@media (any-hover: hover){.board__DUNJ .board-view__haVl .frets-zero__hZfC .point__wEcK:hover{background:rgb(123,141,151)!important}}.board__DUNJ .board-view__haVl .frets__P0Zm{display:flex;flex-direction:column;position:relative;margin:0%;padding:0%;height:-moz-fit-content;height:fit-content}.board__DUNJ .board-view__haVl .frets__P0Zm .frets-dot__KCDT{font-size:30px;height:20px;height:calc(var(--btn-size) / 2);width:64px;width:calc(var(--btn-size) * 1.6);background:rgba(94,101,105,.6);line-height:100%;position:relative;display:flex;justify-content:center;align-items:center;flex-direction:column}.board__DUNJ .board-view__haVl .frets__P0Zm .frets-dot__KCDT:hover{background:rgb(94,101,105)}.board__DUNJ .board-view__haVl .frets__P0Zm .frets-dot__KCDT:hover .frets-dot-text__PhhM{opacity:.6;transform:translate(-50%)}.board__DUNJ .board-view__haVl .frets__P0Zm .frets-dot__KCDT:hover .frets-dot-num__Kt9F{opacity:.8;transform:scale(1.15)}.board__DUNJ .board-view__haVl .frets__P0Zm .frets-dot__KCDT .frets-dot-text__PhhM{opacity:0;font-size:12px;font-size:var(--font-12);font-weight:700;right:4px;right:calc(var(--btn-margin) * 2);position:absolute;transition:all .15s ease-in-out}.board__DUNJ .board-view__haVl .frets__P0Zm .frets-dot__KCDT .frets-dot-num__Kt9F{opacity:.6;font-size:16px;font-size:var(--font-16);font-weight:700;transition:all .15s ease-in-out}.board__DUNJ .board-view__haVl .frets__P0Zm .frets-hidden__-rJ9{height:0px;margin:0;opacity:0}.point__wEcK{list-style-type:none;width:64px!important;width:calc(var(--btn-size) * 1.6)!important;display:flex;justify-content:center;align-items:center;flex-direction:row}@media (any-hover: hover){.point__wEcK:hover{font-size:18px;font-size:var(--font-18)}}.point__wEcK .note__8mDf{font-size:16px;font-size:var(--font-16);pointer-events:none}.point__wEcK .interval__pXq-{opacity:.6;font-size:12px;font-size:var(--font-12);line-height:12px;line-height:var(--font-12);transform:translateY(1px);margin-left:2px;pointer-events:none}.point__wEcK.empty-point__GWOI{background:rgba(94,101,105,.6)!important;cursor:auto}.point__wEcK.empty-point__GWOI .note__8mDf,.point__wEcK.empty-point__GWOI .interval__pXq-{opacity:0}.point__wEcK.empty-point__GWOI:hover .note__8mDf,.point__wEcK.empty-point__GWOI:hover .interval__pXq-,.point__wEcK.empty-point__GWOI:active .note__8mDf,.point__wEcK.empty-point__GWOI:active .interval__pXq-{opacity:.4}.point__wEcK.fixed-point__t5ms{background:rgb(199,156,15)!important}.point__wEcK.tapped-point__n-A6{background:rgb(62,148,202)!important}.point__wEcK.emphasised-point__QRBl,.point__wEcK:active{background:rgb(57,167,150)!important}.point__wEcK.high-fixed-point__pJBF{background:rgb(48,148,133)!important}.board__-1dI{border-radius:6px;border-radius:calc(var(--btn-margin) * 3);overflow:hidden;margin:2px;margin:var(--btn-margin)}.point__ZtT3{z-index:1;position:relative;width:60px!important;width:calc(var(--btn-size) * 1.5)!important;height:32px!important;height:calc(var(--btn-size) * .8)!important;border-radius:16px!important;border-radius:calc(var(--btn-size) * .4)!important;border-bottom:4px solid rgba(49,53,54,.8);border-bottom:calc(var(--btn-margin) * 2) solid rgba(49,53,54,.8)}.point__ZtT3.empty-point__dK09{opacity:0}.point__ZtT3.empty-point__dK09:hover,.point__ZtT3.empty-point__dK09:active{opacity:.4}.fret-point__k8uy{position:relative;list-style-type:none;width:80px;width:calc(var(--btn-size) * 2);height:40px;height:calc(var(--btn-size));background:rgba(94,101,105,.4);border-right:3.2px solid rgb(168,131,7);border-right:calc(var(--btn-margin) * 1.6) solid rgb(168,131,7)}.fret-point__k8uy .point-string__chrX{z-index:0;position:absolute;height:3.2px;height:calc(var(--btn-margin) * 1.6);width:100%;background:rgba(123,141,151,.6);top:calc(50% - 1.6px);top:calc(50% - var(--btn-margin) * .8);pointer-events:none;border-bottom:2px solid rgba(23,25,26,.6);border-bottom:var(--btn-margin) solid rgba(23,25,26,.6)}.fret-dots__6inz{position:absolute;height:calc(100% - 22px);height:calc(100% - var(--btn-size) * .5 - var(--btn-margin))}.fret-dots__6inz .fret-dots-item__iHii{height:12.8px;height:calc(var(--btn-size) * .32);width:12.8px;width:calc(var(--btn-size) * .32);border-radius:6.4px;border-radius:calc(var(--btn-size) * .16);background:rgba(232,230,227,.5);margin:2px;margin:calc(var(--btn-margin));opacity:1;transition:all .15s ease-in-out}.vex-chord__aOTi{min-width:200px;min-width:calc(var(--btn-size) * 5);width:200px!important;width:calc(var(--btn-size) * 5)!important;height:auto!important;margin:2px!important;margin:var(--btn-margin)!important}.selector__TXHM{display:flex;flex-wrap:wrap;max-height:160px;max-height:calc(var(--btn-size) * 4)}.selector__TXHM .selector-item__epK4{width:auto;flex-direction:row;padding:8px 16px;padding:calc(var(--btn-margin) * 4) calc(var(--btn-margin) * 8);font-size:14px;font-size:var(--font-14)}.selector__TXHM .selector-item__epK4 svg{margin-right:4px;margin-right:calc(var(--btn-margin) * 2)}.selector__TXHM .selector-item__checked__wuyl{background:rgb(199,156,15)}@media (any-hover: hover){.selector__TXHM .selector-item__checked__wuyl:hover{background:rgb(168,131,7)}}.type-item__144I{display:flex;justify-content:center;align-items:center;flex-direction:column;width:80px!important;width:calc(var(--btn-size) * 2)!important}.type-item__144I>svg{opacity:.8}.type-input__c-Cg{display:flex;justify-content:center;align-items:center;flex-direction:column;font-size:16px;font-size:var(--font-16);color:#e8e6e3;border:0px;outline:0px;background:none;min-width:80px;min-width:calc(var(--btn-size) * 2);width:50%!important;padding:0 10px}.type-input__c-Cg:focus{width:80%!important;min-width:120px!important;min-width:calc(var(--btn-size) * 3)!important}.type-input__c-Cg::-moz-placeholder{color:#b2b2b2e8;font-size:14px;font-size:var(--font-14)}.type-input__c-Cg::placeholder{color:#b2b2b2e8;font-size:14px;font-size:var(--font-14)}.type-input-controller__vdhB{display:flex}.type-input-controller__vdhB .type-input-item__-pK4{display:flex;justify-content:center;align-items:center;flex-direction:column;width:38px;width:calc(var(--btn-size) - var(--btn-margin));opacity:.8}.menu-container__Fpxx{position:relative;display:inline-flex}.menu-portal__vfub{position:absolute;opacity:0;display:none;transform:translateY(20px);transition:.3s;z-index:400}.show__8-uI{display:block;animation:show__8-uI .25s forwards}.hide__5zGO{opacity:1;transform:translateY(0);animation:hide__5zGO .25s forwards}@keyframes show__8-uI{to{display:block;opacity:1;transform:translateY(0)}}@keyframes hide__5zGO{to{display:none;opacity:0;transform:translateY(20px)}}.popover__tAjK{z-index:400}.modal-container__qa9O{max-width:600px;width:92vw;max-height:92vh;overflow-y:scroll;background:rgb(63,67,69);padding:4px;padding:calc(var(--btn-margin) * 2);border-radius:8px;border-radius:calc(var(--btn-margin) * 4);box-sizing:border-box}.modal-container__qa9O .modal-options__BTtC{display:flex;justify-content:flex-end;font-size:18px;font-size:var(--font-18)}.modal-container__qa9O .modal-options__BTtC .primary-button{height:40px;height:calc(var(--btn-size));flex:1;border-radius:6px;border-radius:calc(var(--btn-margin) * 3)}.modal-container__qa9O .modal-title__jswX{font-size:20px;font-size:var(--font-20);font-weight:700;opacity:.8;margin:8px 4px;margin:calc(var(--btn-margin) * 4) calc(var(--btn-margin) * 2)}.modal-overlay__dmjq{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background-color:#00000080}.container__jaqE{display:flex}.container__jaqE .chord-card__zVtl{width:200px;width:calc(var(--btn-size) * 5);height:200px;height:calc(var(--btn-size) * 5);position:relative;display:flex;justify-content:center;align-items:center;flex-direction:row}.container__jaqE .chord-card-dot__G0-m{width:10px;width:calc(var(--btn-size) * .25);height:10px;height:calc(var(--btn-size) * .25);border-radius:10px;background-color:#fff;position:absolute;right:10px;right:calc(var(--btn-size) * .25);top:10px;top:calc(var(--btn-size) * .25);opacity:.7}.container__jaqE .chord-card__zVtl:hover .chord-card-icons__m7T-{opacity:1}.container__jaqE .chord-card__zVtl .chord-card-icons__m7T-{opacity:0;position:absolute;right:8px;bottom:15px;display:flex;flex-direction:column}.container__jaqE .chord-card__zVtl .chord-card-icons__m7T- .chord-card-sounds__HC1f{display:flex;justify-content:center;align-items:center;flex-direction:column;height:20px;width:20px;margin-top:4px;border-radius:4px;transition:all .15s linear;background-color:#eee2}.container__jaqE .chord-card__zVtl .chord-card-icons__m7T- .chord-card-sounds__HC1f:hover{transform:scale(1.2)}.container__jaqE .chord-card-hidden__2VuV{width:0!important;height:0!important;margin:0!important}.detail-card__dTuo .detail-view__Bvo0{width:-moz-fit-content;width:fit-content;height:-moz-max-content;height:max-content;padding:10px;display:flex;align-items:center}.detail-card__dTuo .detail-view__Bvo0 .detail-title__M8U8{font-size:24px;font-weight:600;opacity:.8;margin:0 8px 0 4px}.detail-card__dTuo .detail-view__Bvo0 .detail-name__Zsuq{text-transform:capitalize;white-space:nowrap}.detail-card__dTuo .detail-view__Bvo0 .detail-name__Zsuq .detail-subname__gFMF{margin-top:5px;font-size:12px;opacity:.8}.detail-card__dTuo .detail-chord__JIfr{display:flex}.detail-card__dTuo .detail-chord-note__XLCs{width:48px;width:calc(var(--btn-size) * 1.2);height:48px;height:calc(var(--btn-size) * 1.2);padding:2px;position:relative}.detail-card__dTuo .detail-chord-title__-rwE{font-size:20px;font-size:var(--font-20);font-weight:700;opacity:.8;text-align:center;transform:scale(1.2)}.detail-card__dTuo .detail-chord-tag__6mWk{position:absolute;left:2px;top:2px;font-size:10px;font-size:var(--font-10);opacity:.6}.detail-card__dTuo .detail-chord-tag__end__4F1R{top:auto;top:initial;bottom:2px}.collection-type__oCM9{width:100%}.collection-type__oCM9 .buttons__YeLI{display:flex}.collection-type__oCM9 .confirm__AGNE{width:38px;width:calc(var(--btn-size) - var(--btn-margin));display:flex;justify-content:center;align-items:center;flex-direction:column}.collection-type__oCM9 .confirm__AGNE>svg{opacity:.8}.download-container__B-R1{display:flex;justify-content:space-between}.download-container__B-R1 .download-option-switch__fpLk{width:120px!important;width:calc(var(--btn-size) * 3)!important}.download-container__B-R1 .download-option-item__gf72{flex:1;height:32px!important;height:calc(var(--btn-size) * .8)!important;background-color:#5e6569}.download-container__B-R1 .download-preview__egKz{flex:1;margin:2px 40px;margin:var(--btn-margin) var(--btn-size)}.download-container__B-R1 .download-desc__Ge6a{margin:2px;margin:var(--btn-margin);padding:0 8px;padding:0 calc(var(--btn-size) * .2);height:32px!important;height:calc(var(--btn-size) * .8)!important;border-radius:2px;border-radius:var(--btn-margin);font-size:12px;font-size:var(--font-12);display:flex;justify-content:center;align-items:center;flex-direction:column}.arc__QCUU{transition:stroke-dasharray .25s;stroke:#5e6569}@media (any-hover: hover){.arc__QCUU:hover{stroke:#c79c0f}}.arc-checked__kImN{stroke:#c79c0f}.fifth-circle__1CCF{min-width:280px;min-width:calc(var(--btn-size) * 7);height:280px!important;height:calc(var(--btn-size) * 7)!important;background:rgba(94,101,105,.6)!important}.switch__1kzn{width:36px;height:20px;border-radius:20px;background:rgb(63,67,69);transition:all .15s linear}@media (any-hover: hover){.switch__1kzn:hover{background:rgb(123,141,151)}}.switch__1kzn .circle__n-Ea{width:18px;height:18px;border-radius:18px;margin:1px;background-color:#e8e6e3;transition:all .15s linear}.switch-on__us-x{background:rgb(199,156,15)}@media (any-hover: hover){.switch-on__us-x:hover{background:rgb(168,131,7)}}.switch-on__us-x .circle__n-Ea{transform:translate(16px)}.tab-switch__UdZN{display:flex;position:relative;width:128px;width:calc(var(--btn-size) * 3.2);height:32px;height:calc(var(--btn-size) * .8);border-radius:4px;margin:2px;background:rgba(94,101,105,.6);cursor:pointer}@media (any-hover: hover){.tab-switch__UdZN:hover{background:rgb(94,101,105)}}.tab-switch-item__CBZ8{flex:1;font-size:12px;z-index:1;transition:all .15s linear;display:flex;justify-content:center;align-items:center;flex-direction:column}.tab-switch-item__active__xPQT{color:#313536;font-size:14px;font-weight:700}.tab-switch-item__cursor__7fSD{position:absolute;background-color:#cac9c7e8;height:calc(100% - 4px);margin:2px;border-radius:3px;transition:all .15s linear}.range-input__nO3t{position:relative;pointer-events:none}.range-input__nO3t ::-webkit-slider-thumb{pointer-events:auto}.range-input__nO3t .input-hidden__-yhi{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none!important;position:absolute;left:0;top:0}.range-slider__dbig{height:32px;height:calc(var(--btn-size) * .8);margin:2px;margin:var(--btn-margin)}.range-slider__dbig .primary-range{margin:0;width:160px;width:calc(var(--btn-size) * 4);border-radius:2px;height:inherit}.range-slider__dbig .primary-range::-webkit-slider-thumb{height:32px;height:calc(var(--btn-size) * .8);width:var(--thumb-width);background:var(--thumb-color);opacity:.4;border-radius:2px}.range-slider__dbig .primary-range:active::-webkit-slider-thumb{width:var(--thumb-width);transform:scaleY(1.1);height:32px;height:calc(var(--btn-size) * .8);opacity:1}.radio-selector__iO80{display:flex;justify-content:space-between;align-items:center;width:160px;width:calc(var(--btn-size) * 4)}.radio-selector__iO80 .selector-content__H3f6{flex:1;height:40px;height:var(--btn-size);margin:2px;margin:var(--btn-margin);border:2px;border:var(--btn-margin);background-color:#5e656999;font-weight:700;display:flex;justify-content:center;align-items:center;flex-direction:column}.radio-selector__iO80 .selector-btn__XKUQ{display:flex;justify-content:center;align-items:center;flex-direction:column}.radio-selector__iO80 .selector-btn__rotate__BRiZ{transform:rotate(180deg)}.radio-selector__iO80 .selector-btn__disabled__L2yh{opacity:.6;pointer-events:none;cursor:not-allowed}.board-controller__9rmy .controller-extend__mqG6,.board-controller__9rmy .controller-checked__-eLb{margin:2px!important;margin:var(--btn-margin) var(--btn-margin)!important}.board-controller__9rmy .controller-extend__small__nLku.controller-extend__mqG6,.board-controller__9rmy .controller-extend__small__nLku.controller-checked__-eLb{width:72px;width:calc(var(--btn-size) * 1.8);height:56px;height:calc(var(--btn-size) * 1.4)}.board-controller__9rmy .controller-extend__medium__4QHy.controller-extend__mqG6,.board-controller__9rmy .controller-extend__medium__4QHy.controller-checked__-eLb{width:80px;width:calc(var(--btn-size) * 2);height:80px;height:calc(var(--btn-size) * 2)}.board-controller__9rmy .controller-extend__large__NrVX.controller-extend__mqG6,.board-controller__9rmy .controller-extend__large__NrVX.controller-checked__-eLb{width:104px;width:calc(var(--btn-size) * 2.6);height:104px;height:calc(var(--btn-size) * 2.6)}.board-controller__9rmy .controller-not-extend__THFx{width:0px;height:auto;height:initial;margin:2px 0;margin:var(--btn-margin) 0px}.board-controller__9rmy{display:flex;flex-direction:row;width:-moz-fit-content;width:fit-content}.board-controller__9rmy.board-controller__wrap__B4db{flex-wrap:wrap}.board-controller__9rmy .controller__2Wpq{position:relative}@media (any-hover: hover){.board-controller__9rmy .controller__2Wpq:hover{opacity:.8;background:rgb(94,101,105)}}.board-controller__9rmy .controller-checked__-eLb{background:rgb(199,156,15)!important}.board-controller__9rmy .controller-extend__mqG6{width:80px;width:calc(var(--btn-size) * 2);height:80px;height:calc(var(--btn-size) * 2)}.board-controller__9rmy .controller-trigger__EBZ-{width:calc(40px / 3)!important;width:calc(var(--btn-size) / 3)!important}.board-controller__9rmy .controller-trigger__EBZ->svg{opacity:.4;transition:all .15s ease-in-out}.board-controller__9rmy .controller-trigger__EBZ-.controller-trigger__extend__-dBi{width:calc(40px / 3 + 4px)!important;width:calc(var(--btn-size) / 3 + 4px)!important}.board-controller__9rmy .controller-trigger__EBZ-.controller-trigger__extend__-dBi>svg{opacity:.6;transform:rotate(90deg)}@media (any-hover: hover){.board-controller__9rmy:hover .controller-not-extend__THFx{margin:2px!important;margin:var(--btn-margin) var(--btn-margin)!important}.board-controller__9rmy:hover .controller-not-extend__THFx.controller-extend__small__nLku{width:72px;width:calc(var(--btn-size) * 1.8);height:56px;height:calc(var(--btn-size) * 1.4)}.board-controller__9rmy:hover .controller-not-extend__THFx.controller-extend__medium__4QHy{width:80px;width:calc(var(--btn-size) * 2);height:80px;height:calc(var(--btn-size) * 2)}.board-controller__9rmy:hover .controller-not-extend__THFx.controller-extend__large__NrVX{width:104px;width:calc(var(--btn-size) * 2.6);height:104px;height:calc(var(--btn-size) * 2.6)}}.container__Vzz3 .scale-item__JFWQ,.container__Vzz3 .mode-item__yCT1{height:100%;display:flex;justify-content:center;align-items:center;flex-direction:column}.container__Vzz3{display:flex}@media (max-width: 499px){.container__Vzz3{flex-direction:column;width:calc(100vw - 20px)}.container__Vzz3 .chord-controllers__GBqU{width:auto!important}}.container__Vzz3 .fifth-circle__Q-MJ{height:248px!important;height:calc(var(--btn-size) * 6 + var(--btn-margin) * 4)!important;min-width:248px!important;min-width:calc(var(--btn-size) * 6 + var(--btn-margin) * 4)!important}.container__Vzz3 .chord-controllers__GBqU{width:0;flex:1}.container__Vzz3 .mode-item__yCT1{font-size:24px;text-transform:capitalize}.container__Vzz3 .mode-item__yCT1:first-letter{font-size:32px}.container__Vzz3 .scale-item__JFWQ{font-size:36px}.container__Vzz3 .scale-item__JFWQ .scale-item-mode__en-3{font-size:12px;opacity:.8;text-transform:capitalize}.chord-switch__b5r8{display:flex;align-items:center}.chord-switch__b5r8 .chord-switch-item__rPCh{height:32px;height:calc(var(--btn-size) * .8);width:80px;width:calc(var(--btn-size) * 2);border-radius:4px;border-radius:calc(var(--btn-margin) * 2);font-size:12px;font-size:var(--font-12);font-weight:700;opacity:.8;display:flex;justify-content:center;align-items:center;flex-direction:column}.chord-item__Gibv{padding:2px;white-space:nowrap}.chord-item-grade__Tbro{opacity:.8;font-size:12px;font-size:var(--font-12);font-weight:500;margin:0 2px;margin:0 var(--btn-margin)}.chord-item-note__xRGI{font-size:26.4px;font-size:calc(var(--font-22) * 1.2);font-weight:700}.chord-item-tag__Ht8w{font-size:18px;font-size:var(--font-18);font-weight:700}.chord-item-scale__ON6A{opacity:.8;font-size:10px;font-size:var(--font-10);white-space:nowrap}.chord-tab__McKR{width:240px;width:calc(var(--btn-size) * 6)}.chord-type__f8Bm{display:flex;flex-wrap:wrap;max-height:240px;max-height:calc(var(--btn-size) * 6)}.chord-type__f8Bm .tags-item__kpWl{display:flex;justify-content:center;align-items:center;flex-direction:column;width:64px;width:calc(var(--btn-size) * 1.6);height:32px;height:calc(var(--btn-size) * .8);font-size:12px;font-size:var(--font-12);font-weight:500;color:#cac9c7e8}.chord-type-tabs__ptLe{width:98%}.container__wpWD{padding-top:80px;padding-bottom:120px;padding-right:100px}@media (max-width: 499px){.container__wpWD{padding-top:0;padding-right:20px}}.container__wpWD .title__RoTr{font-size:80px;opacity:.9;margin-bottom:0;margin-top:20px}.container__wpWD .subtitle__BuKB{font-size:40px;opacity:.7;margin-top:0}.container__wpWD .links__hG52{display:flex}.container__wpWD .links__hG52 .links-button__HwR1{font-weight:300;font-size:18px;font-size:var(--font-18);width:200px;width:calc(var(--btn-size) * 5);height:60px;height:calc(var(--btn-size) * 1.5);-webkit-text-decoration:none;text-decoration:none;color:#e8e6e3;display:flex;justify-content:center;align-items:center;flex-direction:column}.container__wpWD .links__hG52 .links-button__HwR1:hover{background-color:#c79c0f}.container__wpWD .intro__Mvon{font-size:18px;font-size:var(--font-18);font-weight:300;letter-spacing:.5px;opacity:.8}.container__wpWD .intro__Mvon span{display:block}.container__wpWD .more__Im6M{margin:20px 0;display:flex;flex-direction:row;align-items:center}.container__wpWD .more__Im6M>svg{fill:#e8e6e3;opacity:.8;margin:4px}.container__wpWD .example__VGPz{font-size:18px;font-weight:300;letter-spacing:.5px;margin-top:120px;margin-bottom:20px;opacity:.7}.menu-container__4Mem{display:flex;flex-wrap:wrap;font-weight:300}.menu-container__4Mem a:active{background-color:#c79c0f}.menu-container__4Mem .main-route__iIlZ{width:128px;width:calc(var(--btn-size) * 3.2);height:128px;height:calc(var(--btn-size) * 3.2)}.menu-container__4Mem .main-route-title__If8P{font-size:14px;font-size:var(--font-14);margin-top:10px;margin-top:var(--space-10)}.menu-container__4Mem .sub-route-wrap__Q7Ri{width:128px;width:calc(var(--btn-size) * 3.2);height:128px;height:calc(var(--btn-size) * 3.2);margin:2px;margin:var(--btn-margin);display:flex;flex-wrap:wrap;justify-content:space-between}.menu-container__4Mem .sub-route__S7ws{font-size:10px;font-size:var(--font-10);width:62px;width:calc(var(--btn-size) * 3.2 / 2 - var(--btn-margin));height:62px;height:calc(var(--btn-size) * 3.2 / 2 - var(--btn-margin));margin:0 0 4px!important;margin:0 0 calc(var(--btn-margin) * 2)!important;padding:4px;padding:var(--space-4);box-sizing:border-box;text-align:center}.taped-container__WnJ-{display:flex}@media (max-width: 499px){.taped-container__WnJ-{flex-wrap:wrap}}.taped-container__WnJ- .svg-chord__-kV1{width:200px!important;width:calc(var(--btn-size) * 5)!important;height:200px!important;height:calc(var(--btn-size) * 5)!important;margin:2px!important;margin:var(--btn-margin)!important}.taped-container__WnJ- .fifth-circle__FIY-{min-width:200px;min-width:calc(var(--btn-size) * 5);height:200px;height:calc(var(--btn-size) * 5);background:rgba(94,101,105,.6)!important}.taped-container__WnJ- .type-list__zPMi{display:flex;flex-direction:column}.type-item__Qv9-{display:flex;justify-content:center;align-items:center;flex-direction:column;width:80px!important;width:calc(var(--btn-size) * 2)!important}.piano__5-4X{display:flex;width:-moz-max-content;width:max-content;outline:none}.piano__5-4X .key__rxsD{width:40px;width:var(--btn-size);border-radius:0 0 2px 2px;border-radius:0 0 var(--btn-margin) var(--btn-margin);margin:2px;margin:var(--btn-margin);transition:all .1s linear;display:flex;justify-content:center;align-items:flex-end;font-size:14px;line-height:24px}.piano__5-4X .key__rxsD:hover{box-shadow:inset 0 -3px 10px #2224}.piano__5-4X .flat__y0vr{height:160px;height:calc(var(--btn-size) * 4);background:rgb(232,230,227);color:#4446}.piano__5-4X .flat__y0vr.touched__q30Z{background:rgb(199,156,15)!important}.piano__5-4X .flat__y0vr.checked__9tn9{background:rgb(62,148,202)}.piano__5-4X .sharp__3MrO{height:120px;height:calc(var(--btn-size) * 3);background:#444;margin-top:0;margin-left:-20px;margin-left:calc(var(--btn-size) / -2);margin-right:-20px;margin-right:calc(var(--btn-size) / -2);z-index:1;color:#fff6;font-size:12px;font-weight:300}.piano__5-4X .sharp__3MrO.touched__q30Z{background:rgb(199,156,15)!important}.piano__5-4X .sharp__3MrO.checked__9tn9{background:rgb(62,148,202)}.fingering-tab__WDTZ{width:320px;width:calc(var(--btn-size) * 8)}.fingering-tab-wrap__JY8c{display:flex}.fingering-tab-wrap__JY8c .fingering-lock__UK6i{height:32px;height:calc(var(--btn-size) * .8);width:32px;width:calc(var(--btn-size) * .8);border-radius:4px;border-radius:calc(var(--btn-margin) * 2);opacity:.4;display:flex;justify-content:center;align-items:center;flex-direction:column}.fingering-tab-wrap__JY8c .fingering-locked__2ZrZ{opacity:1}.fingering-chord-wrap__qGu1{display:flex}.fingering-chord-wrap__qGu1 .fingering-chord-title__DH9f{height:auto;font-size:12px;font-size:var(--font-12);min-width:80px;min-width:calc(var(--btn-size) * 2);display:flex;justify-content:center;align-items:center;flex-direction:column}.fingering-chord-wrap__qGu1 .fingering-chord-list__rfNh,.fingering-list-options__UqsV{display:flex}.fingering-list-options__UqsV .fingering-options-mode__aheQ{display:flex;justify-content:center;align-items:center;flex-direction:column;font-size:20px;position:relative;width:80px;width:calc(var(--btn-size) * 2)}.fingering-list-options__UqsV .fingering-options-mode-tag__hY1E{font-size:10px;position:absolute;left:0;top:0;opacity:.6;transform:scale(.6)}.fingering-list-options__UqsV .fingering-options-range__l0Ro{display:flex;justify-content:center;align-items:center;flex-direction:column;font-size:12px;position:relative;width:160px;width:calc(var(--btn-size) * 4)}.fingering-list-options__UqsV .fingering-options-button__T90G{display:flex;justify-content:center;align-items:center;flex-direction:column;font-size:20px}.fingering-list-options__UqsV .fingering-options-button__active__uWNX{background:rgb(199,156,15);opacity:1}.fingering-list__Cdzx{display:flex;flex-direction:row;flex-wrap:wrap}.fingering-list__edit__ykzO{flex-direction:column}.fingering-list-item__aINA{margin-bottom:8px;margin-bottom:calc(var(--btn-size) * .2);margin-right:8px;margin-right:calc(var(--btn-size) * .2)}.fingering-list-button__M-H5{display:flex;justify-content:center;align-items:center;flex-direction:column;font-size:20px;width:60px!important;width:calc(var(--btn-size) * 1.5)!important;height:60px!important;height:calc(var(--btn-size) * 1.5)!important;margin-top:4px!important;margin-top:calc(var(--btn-size) * .1)!important}.guitar-size-slider__1Jj2{height:32px!important;height:calc(var(--btn-size) * .8)!important;width:240px!important;width:calc(var(--btn-size) * 6)!important;padding:0 12px;font-size:10px;display:flex;justify-content:center;align-items:center;flex-direction:column;flex-direction:row}.guitar-size-slider__1Jj2 .primary-range{margin-left:12px}.guitar-range-slider__Dtly{width:264px!important;width:calc(var(--btn-size) * 6 + 24px)!important;margin-bottom:4px;margin-bottom:calc(var(--btn-margin) * 2)}.guitar-range-slider__Dtly .primary-range{width:inherit}.icon-right__DVa0{font-size:14px;position:absolute;right:4px;right:calc(var(--btn-margin) * 2);opacity:.4;transition:transform .15s ease-in-out}.icon-right__DVa0.icon-right__extend__G1Wt{opacity:.8;transform:rotate(90deg)}.sound__C4Yv .sound-head__XozT{display:flex;justify-content:center;align-items:center;flex-direction:column;font-size:12px;font-weight:700;opacity:.8;letter-spacing:1.5px;float:left}.sound__C4Yv .sound-list__ZgOl{display:flex;position:relative;overflow:hidden}.sound__C4Yv .sound-item__oT4L{height:30px;margin:1px!important}.sound__C4Yv .sound-item-active__Vtc2{position:absolute;transition:none}.sound__C4Yv .sound-item-handler__ejXF{position:absolute;height:15px;width:14px;height:100%;right:0;opacity:.6;cursor:ew-resize;display:flex;justify-content:center;align-items:center;flex-direction:column}.sound__C4Yv .sound-item-handler-view__XcQ6{pointer-events:none;width:3px;height:18px;border-radius:2px;background-color:#e8e6e3;opacity:.6}.sound__C4Yv .sound-item-ghost__lYWX{position:absolute;background:#aaa;pointer-events:none}.sound-container__qgZ0{position:relative}.sound-container__qgZ0 .sound-line__x07E{position:absolute;height:100%;width:2px;top:0;z-index:-1;background:rgb(23,25,26)}.sound-container__qgZ0 .sound-time-line__tTM6{position:absolute;height:100%;left:42px;width:2px;top:0;z-index:1;background:rgba(238,238,238,.5333333333);visibility:hidden}.sound-container__qgZ0 .sound-time-line__tTM6.sound-time-visible__ggqt{visibility:visible}.player-controller__CLc-{display:flex;flex-direction:row}.player-controller__CLc- .player-icon__EWSX{margin:1px;width:48px!important;width:calc(var(--btn-size) * 1.2)!important;display:flex;justify-content:center;align-items:center;flex-direction:row}.player-controller__CLc- .player-icon__EWSX :first-child{opacity:.8}.player-controller__CLc- .player-range__e4UX{display:flex;justify-content:center;align-items:center;flex-direction:row;margin:1px;padding:0 8px;justify-content:flex-start;width:-moz-fit-content;width:fit-content}.player-controller__CLc- .player-range__e4UX .player-range-text__FIbZ{font-size:14px;font-size:var(--font-14);font-weight:600;text-wrap:nowrap;opacity:.8;letter-spacing:.5px;margin-right:4px}.player-controller__CLc- .player-range__e4UX .player-range-bpm__m51q{font-size:16px;font-size:var(--font-16)}.player-controller__CLc- .player-m__sEih{font-size:18px;font-size:var(--font-18);font-weight:700;opacity:.8}.draggable-style{background:rgb(232,230,227)!important}.overed-activity-style{opacity:.1}.taps-viewer__QOHJ{display:flex;flex-wrap:wrap}.list__GViO .title-view__kT-l{position:relative;display:flex}.list__GViO .title-view__kT-l .title-text__ggPM{padding:0 16px;padding:0 calc(var(--btn-size) * .4);font-weight:700;white-space:nowrap;width:auto;min-width:20vw;display:flex;justify-content:center;align-items:center;flex-direction:column}.list__GViO .title-view__kT-l .title-btn__Y5MH{min-width:40px;min-width:calc(var(--btn-size));margin-left:2px;margin-left:var(--btn-margin);display:flex;justify-content:center;align-items:center;flex-direction:column}.list__GViO .title-view__kT-l .title-sub-text__4YHT{margin-left:8px;margin-left:calc(var(--btn-size) * .2);font-weight:300;font-size:14px;font-size:var(--font-14);white-space:nowrap;flex:1;display:flex;align-items:flex-end;justify-content:flex-start}.data-list__1miz{display:flex;width:-moz-fit-content;width:fit-content}.caged-range__-QAq{display:flex}.caged-range__-QAq .caged-range-slider__XrBZ{margin-bottom:4px;margin-bottom:calc(var(--btn-margin) * 2)}.caged-range__-QAq .caged-range-slider__XrBZ .primary-range{width:80vw!important}.caged-range__-QAq .caged-range-title__hum2{flex:1;height:auto!important;font-size:12px;font-size:var(--font-12);font-weight:700;opacity:.8}.caged-list__wQ4y{display:flex}.caged-list__wQ4y .caged-title__Tc6P{height:auto}.caged-list__wQ4y .caged-title__Tc6P .touch-yellow{height:inherit;width:40px;width:calc(var(--btn-size));font-size:44px;font-size:calc(var(--font-22) * 2)}.my-collections-link__fBQ4{text-align:right;display:block;font-size:16px;font-size:var(--font-16);font-weight:700;opacity:.8;margin:20px}.picker__KO5K{display:flex;flex-wrap:wrap}.picker__KO5K>div{height:30px}.picker__KO5K svg{opacity:.7}.picker__KO5K .instrument-item__tNxM{display:flex;align-items:center;justify-content:space-between;width:80px;font-size:14px;padding:0 4px;opacity:.8;white-space:nowrap}.picker__KO5K .instrument-item__tNxM.instrument-item-hidden__H-1-{width:0px;padding:0;margin:2px 0}.picker__KO5K .options-item__fhYa{display:flex;align-items:center;justify-content:center;width:-moz-max-content;width:max-content;min-width:30px}.picker__KO5K .options-item__fhYa:hover .options-item-span__MF5f{width:24px}.picker__KO5K .options-item__fhYa .options-item-icon__YejA{padding:0 10px}.picker__KO5K .options-item__fhYa .options-item-icon__YejA:hover{opacity:.9}.picker__KO5K .options-item__fhYa .options-item-span__MF5f{transition:all .15s ease-in-out;font-size:12px;font-weight:600;width:0px;opacity:.7;overflow:hidden}.picker__KO5K .options-item__fhYa .options-item-input__t0NZ{width:140px;margin-right:10px}.add__wOnr{display:flex;justify-content:center;align-items:center;flex-direction:column}.add__wOnr>svg{opacity:.6}.route-item__4OTy{width:-moz-fit-content;width:fit-content;height:100%;color:#e8e6e3;-webkit-text-decoration:none;text-decoration:none;padding:4px 6px;padding:calc(var(--btn-margin) * 2) calc(var(--btn-margin) * 3);display:block}.intro-title__JcXk{font-size:40px;font-weight:700;opacity:.8;margin-bottom:24px}.fifth-tool__-m8y{display:flex;flex-direction:column;justify-content:center}.fifth-tool__-m8y .fifth-tool__circle__14Dd{width:360px!important;width:calc(var(--btn-size) * 9)!important;height:360px!important;height:calc(var(--btn-size) * 9)!important}.metronome-wrap__zRRw{display:flex;justify-content:space-between;align-items:flex-end;width:auto;max-width:600px;margin-right:20px;margin-right:calc(var(--btn-size) * .5)}.metronome-wrap__zRRw .metronome-item__uX-w{flex:1;height:160px;height:calc(var(--btn-size) * 4)}.metronome-wrap__zRRw .metronome-item__up__Bl5J{height:240px;height:calc(var(--btn-size) * 6)}.metronome-option__f-pP{display:flex}.metronome-option__f-pP .metronome-option-item__WLdQ{min-width:80px;min-width:calc(var(--btn-size) * 2);font-weight:700;font-size:14px;font-size:var(--font-14);display:flex;justify-content:center;align-items:center;flex-direction:column}.metronome-option__f-pP .metronome-option__slider__MbwW{height:40px;height:var(--btn-size)}.metronome-option__f-pP .metronome-option__slider__MbwW ::-webkit-slider-thumb{height:40px;height:calc(var(--btn-size) * 1)}.metronome-option__f-pP .metronome-option__slider__MbwW :active::-webkit-slider-thumb{height:40px;height:calc(var(--btn-size) * 1)}.metronome-info__u-iL{display:flex;width:320px;width:calc(var(--btn-size) * 8)}.metronome-info__u-iL .metronome-info-item__fBEK{flex:1;font-weight:700;font-size:22px;font-size:var(--font-22);height:80px;height:calc(var(--btn-size) * 2);display:flex;justify-content:center;align-items:center;flex-direction:column}.metronome-btn__ey1x{width:160px!important;width:calc(var(--btn-size) * 4)!important;height:80px!important;height:calc(var(--btn-size) * 2)!important;display:flex;justify-content:center;align-items:center;flex-direction:column}.metronome-btn__ey1x>svg{font-size:40px}.board-settings__qV7v{flex-direction:column}.chord-taps__hVpn{width:-moz-fit-content;width:fit-content}.degree-controller__KWXz{display:flex;flex-wrap:wrap}.degree-expand__lXQE{min-width:16px;min-width:calc(var(--btn-size) * .4);width:16px;width:calc(var(--btn-size) * .4);height:64px;height:calc(var(--btn-size) * 1.6);display:flex;justify-content:center;align-items:center;flex-direction:column}.degree-btn__vHIf{width:64px;width:calc(var(--btn-size) * 1.6);height:64px;height:calc(var(--btn-size) * 1.6);min-width:64px!important;min-width:calc(var(--btn-size) * 1.6)!important;min-height:64px!important;min-height:calc(var(--btn-size) * 1.6)!important;display:flex;justify-content:center;align-items:center;flex-direction:column}.degree-btn__vHIf .icon-back{transform:rotate(-90deg);transition:transform .3s ease-in-out}.degree-btn__vHIf.icon-expand__EAoo .icon-back{transform:rotate(90deg)}.degree-btn__vHIf .icon{font-size:22px;font-size:var(--font-22);opacity:.4}@media (any-hover: hover){.degree-btn__vHIf:hover .icon{opacity:.6}}.degree-container__Nrbb{width:100%;max-height:60vh;overflow-y:scroll}.degree-container__Nrbb .degree-view__BDSo{opacity:0;display:flex;animation:show__JScu .5s forwards}.degree-container__Nrbb .degree-view__BDSo .degree-item__s8vW{position:relative;width:64px;width:calc(var(--btn-size) * 1.6);min-width:64px;min-width:calc(var(--btn-size) * 1.6);height:64px;height:calc(var(--btn-size) * 1.6);font-size:24px;white-space:nowrap;display:flex;justify-content:center;align-items:center;flex-direction:row}.degree-container__Nrbb .degree-view__BDSo .degree-item__s8vW:hover .degree-item-remove__i3Kz{opacity:.8;pointer-events:all}.degree-container__Nrbb .degree-view__BDSo .degree-item__s8vW .degree-item-tag__ykb9{margin:6px 0 0 3px;font-size:14px;opacity:.8}.degree-container__Nrbb .degree-view__BDSo .degree-item__s8vW .degree-item-remove__i3Kz{pointer-events:none;transition:all .15s ease-in-out;opacity:0;position:absolute;right:4px;top:4px}.degree-container__Nrbb .degree-view__BDSo .degree-item-second__OqP2{width:80px;width:calc(var(--btn-size) * 2);height:40px;height:var(--btn-size)}.degree-container__Nrbb .degree-view__BDSo .degree-item-second__OqP2:hover{background:rgb(199,156,15)}@media (any-hover: hover){.degree-container__Nrbb .degree-view__BDSo .degree-item-second__OqP2:hover:hover{background:rgb(168,131,7)}}.degree-container__Nrbb .degree-view__BDSo .degree-remove__Eq8C{width:0px;margin:2px 0}.degree-container__Nrbb .degree-view__BDSo .degree-remove__Eq8C:hover{background:rgb(209,91,47)}@media (any-hover: hover){.degree-container__Nrbb .degree-view__BDSo .degree-remove__Eq8C:hover:hover{background:rgb(189,80,41)}}.degree-container__Nrbb .degree-view__BDSo:hover .degree-remove__Eq8C{display:flex;width:64px;width:calc(var(--btn-size) * 1.6);min-width:64px;min-width:calc(var(--btn-size) * 1.6);margin:2px}@media (max-width: 499px){.degree-container__Nrbb .degree-view__BDSo .degree-remove__Eq8C{display:flex;width:64px;width:calc(var(--btn-size) * 1.6);min-width:64px;min-width:calc(var(--btn-size) * 1.6);margin:2px}}@keyframes show__JScu{to{opacity:1;transform:translateY(0)}}.degree-container__Nrbb .tags-view__bTKI{flex-wrap:wrap}.degree-container__Nrbb .tags-view__bTKI .tags-item__oJH8{width:80px;width:calc(var(--btn-size) * 2);font-size:14px;opacity:.8;display:flex;justify-content:center;align-items:center;flex-direction:column}.degree-container__Nrbb .tags-view__bTKI .tags-item__oJH8:hover{background:rgb(199,156,15)}@media (any-hover: hover){.degree-container__Nrbb .tags-view__bTKI .tags-item__oJH8:hover:hover{background:rgb(168,131,7)}}.degree-container__Nrbb .degree-view-checked__V3Kw .degree-item__s8vW{background:rgb(199,156,15)}@media (any-hover: hover){.degree-container__Nrbb .degree-view-checked__V3Kw .degree-item__s8vW:hover{background:rgb(168,131,7)}}.degree-container__Nrbb .degree-input__RH8h{width:80%;font-size:22px;font-size:var(--font-22)}.degree-container__Nrbb .degree-input__RH8h:focus{width:100%}.chord-list__Pau5{flex-wrap:wrap;align-content:flex-start}.chord-item__99V8{display:flex;flex-direction:column;height:100%;padding:4px}.chord-item-grade__DjnY{font-size:12px;font-size:var(--font-12)}.chord-item-note__8cr5{font-size:24px;line-height:calc(12px * 2.8);line-height:calc(var(--font-12) * 2.8)}.chord-item-tag__ne1z{font-size:14px;font-size:var(--font-14);opacity:.8}.chord-item-name__YWYv{opacity:.8;font-size:12px;font-size:var(--font-12)}.container__mk-k{display:flex}@media (max-width: 499px){.container__mk-k{flex-direction:column}}.controller-inner__Yo-M{white-space:nowrap;display:flex;flex-direction:column;padding:2px 6px;font-size:14px;font-size:var(--font-14)}.controller-inner__Yo-M.controller-inner__small__v-TD{font-size:12px;font-size:var(--font-12)}.controller-inner__Yo-M.controller-inner__large__lipF{font-size:18px;font-size:var(--font-18);font-weight:700}.controller-inner__Yo-M :last-child{margin-top:6px;margin-top:var(--space-6)}.controller-inner-option__bBOf .controller-inner-unchecked__bBXA{margin-top:0;font-weight:300;transition:opacity .15s linear;opacity:0}.controller-inner-option__bBOf:hover .controller-inner-unchecked__bBXA{opacity:.8}.controller-inner-option__bBOf .controller-inner-intro__Om0p{font-size:12px;font-size:var(--font-12);margin-top:4px}@media (max-width: 499px){.controller-inner-option__bBOf .controller-inner-unchecked__bBXA{opacity:.8}}.mode-container__uVGW{flex-direction:row!important}.mode-container__uVGW .primary-button{width:144px!important;width:calc(var(--btn-size) * 3.6)!important}.drum-wrap__jx2K{display:flex;flex-wrap:wrap;max-width:600px;outline:none}.drum-wrap__jx2K .drum-item__P2fA{flex:1;height:80px;height:calc(var(--btn-size) * 2);min-width:24%;transition:all .05s linear}.drum-wrap__jx2K .drum-item__active__BHUj{background-color:#c79c0f!important}.pages-intro__UAay{padding-right:10%;opacity:.7;margin-bottom:5vh}.pages-intro__UAay h2{letter-spacing:.5px;font-weight:500;font-size:32px}.pages-intro__UAay p{margin:10px 0;font-weight:300;font-size:18px}.page-header__T4P3{display:flex;align-items:center;cursor:pointer;opacity:.8}.page-header__T4P3>h2{margin:16px 10px;margin:var(--font-16) var(--font-10);font-size:20px;font-size:var(--font-20)}.slide-menu__rDj-{display:flex;transition:all .2s ease;margin-left:-240px;width:300px;min-width:300px;background:rgb(49,53,54)}.slide-menu__rDj-.slide-menu__extend__2tXR{margin-left:0}.slide-menu__rDj-.slide-menu__extend__2tXR .slide-menu-nav-item-name__dKN0{display:block}.slide-menu-nav__o2G6{position:fixed;top:0;width:inherit;height:100vh;overflow:hidden;white-space:nowrap;background:rgb(49,53,54)}.slide-menu-nav-title__nl-v{font-size:40px!important;line-height:60px;-webkit-text-decoration:none;text-decoration:none;color:#e8e6e3;opacity:.8;font-weight:bolder;padding:0 20px}.slide-menu-nav-item__kgAu{color:#e8e6e3;font-size:18px;font-size:var(--font-18);height:42px;font-weight:300;padding:8px 20px;-webkit-text-decoration:none;text-decoration:none;display:flex;justify-content:flex-end;align-items:center;transition:all .15s ease;cursor:pointer}@media (any-hover: hover){.slide-menu-nav-item__kgAu:hover{font-weight:400;padding-left:24px}}.slide-menu-nav-item-name__dKN0{margin-left:12px;flex:1;display:none}.slide-menu-nav-item-checked__rJdJ{background-color:#3f4345;font-weight:400}.slide-menu-nav-footer__MhL3{position:absolute;bottom:0;width:100%}.slide-menu-trigger__YfIw{position:absolute;top:0;right:0}.slide-menu-trigger-icon__jjDt{margin:14px 17px}@media (max-width: 499px){.slide-menu__rDj-{width:100vw;height:60px;margin:0;position:fixed;bottom:0;z-index:99;padding-bottom:env(safe-area-inset-bottom)}.slide-menu__rDj-.slide-menu__extend__2tXR{height:180px}.slide-menu-nav__o2G6{position:relative;height:inherit;width:inherit;display:flex;justify-content:flex-start;flex-wrap:wrap}.slide-menu-nav-item__kgAu{width:20%;height:60px;flex-direction:column;align-items:center;justify-content:center;padding:0}.slide-menu-nav-item__kgAu:hover{padding-left:0;padding-left:initial}.slide-menu-nav-item-name__dKN0{font-size:10px;font-size:var(--font-10);margin:4px 0 0;flex:initial;display:block}.slide-menu-nav-item-checked__rJdJ{background-color:transparent;background-color:initial;color:#c79c0f}.slide-menu-tab-trigger__FdkB{display:flex;justify-content:center;z-index:1;width:80px;background-color:#313536;border-radius:10px 10px 0 0;position:absolute;top:-10px;height:20px;left:50%;transform:translate(-50%);padding-top:2px}.slide-menu-tab-trigger-icon__9V-B{transition:all .15s ease;opacity:.6}}.audio-btn__zWHi{width:32px;height:32px;cursor:pointer;background:none;border:none;color:inherit;display:flex;justify-content:center;align-items:center;flex-direction:column}.audio-btn__hidden__Le5P{transition-delay:3s;transition:all 2s ease-in-out!important;opacity:0;pointer-events:none}.setting-wrap__-3Ry{width:252px;width:calc((var(--btn-size) * 2 + var(--btn-margin) * 2) * 3);height:auto;flex-wrap:wrap;background-color:#313536;margin-bottom:4px;margin-right:4px;padding:2px;padding:calc(var(--btn-margin));border-radius:4px;border-radius:calc(var(--btn-margin) * 2)}.pages-intro__sWSg{opacity:.7;padding:16px;padding:var(--space-16);max-height:64vh;overflow-y:scroll}.pages-intro__sWSg h2{letter-spacing:.5px;font-weight:500;font-size:32px;margin:0 0 16px;margin:0 0 var(--space-16)}.pages-intro__sWSg p{margin:10px 0;font-weight:300;font-size:18px;text-align:justify}.btn-group__WSCI{position:fixed;right:20px;bottom:100px;z-index:1}.btn__OvoQ{width:40px;width:var(--btn-size);height:40px;height:var(--btn-size);cursor:pointer;margin:6px;margin:var(--space-6);background:rgb(49,53,54);border-radius:50%;border:none;color:inherit;opacity:.8;display:flex;justify-content:center;align-items:center;flex-direction:column}@media (any-hover: hover){.btn__OvoQ:hover{background:rgb(46,49,51);opacity:1}}.btn__OvoQ:active{background:rgb(199,156,15)}body{background:rgb(63,67,69);color:#e8e6e3;margin:0;font-family:Futura PT,Helvetica Neue,Helvetica,Arial,sans-serif;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;-webkit-user-drag:none;-webkit-tap-highlight-color:transparent;scrollbar-width:none;-ms-overflow-style:none}body::-webkit-scrollbar{display:none}#app{display:flex;justify-content:space-between;min-width:100vw}#app #board{box-sizing:border-box;width:100%;height:100%;overflow-x:hidden;padding-left:10vw}@media only screen and (min-width: 499px){#app{min-height:100vh}}@media (max-width: 499px){#app{flex-direction:column}#app #board{padding-left:20px;padding-bottom:calc(env(safe-area-inset-bottom) + 80px)}}@media print{header,footer,nav button,main section{display:none}nav,#audio-btn{visibility:hidden}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.fade-in{animation:fadeIn .2s ease-in-out}@keyframes slideRightIn{0%{transform:translate(30px);opacity:0}to{transform:translate(0);opacity:1}}.slide-right-in{animation:slideRightIn .2s ease-in-out}a{-webkit-text-decoration:none;text-decoration:none;color:inherit;-webkit-tap-highlight-color:unset;-webkit-touch-callout:none}.scroll-without-bar{overflow:scroll;scrollbar-width:none;-ms-overflow-style:none}.scroll-without-bar::-webkit-scrollbar{display:none}.primary-button{margin:2px;margin:var(--btn-margin);border-radius:2px;border-radius:var(--btn-margin);width:40px;width:var(--btn-size);height:40px;height:var(--btn-size);transition:all .15s linear;overflow:hidden;cursor:pointer;background:rgb(94,101,105)}@media (any-hover: hover){.primary-button:hover{background:rgba(94,101,105,.6)}}.primary-range{-webkit-appearance:none;-moz-appearance:none;appearance:none;flex:1;width:240px;width:calc(var(--btn-size) * 6);height:4px;border-radius:2px;outline:none;background:rgba(238,238,238,.2666666667)}.primary-range::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:12px;background:#ccc;border-radius:50%;-webkit-transition:.2s;transition:.2s}.primary-range:active::-webkit-slider-thumb{width:16px;height:16px}@media (max-width: 499px){.primary-range{width:160px;width:calc(var(--btn-size) * 4)}}.hidden{display:none}.none-height{height:0!important;overflow:hidden}.icon{width:1em;height:1em;vertical-align:-.15em;fill:currentColor;overflow:hidden}.touch-yellow{background:rgb(199,156,15)}@media (any-hover: hover){.touch-yellow:hover{background:rgb(168,131,7)}}.touch-primary{background:rgb(94,101,105)}@media (any-hover: hover){.touch-primary:hover{background:rgba(94,101,105,.6)}}.touch-blue{background:rgb(62,148,202)}@media (any-hover: hover){.touch-blue:hover{background:rgb(47,120,165)}}.touch-green{background:rgb(57,167,150)}@media (any-hover: hover){.touch-green:hover{background:rgb(48,148,133)}}.touch-cyan{background:rgb(168,168,18)}@media (any-hover: hover){.touch-cyan:hover{background:rgb(145,145,14)}}.touch-purple{background:rgb(209,91,47)}@media (any-hover: hover){.touch-purple:hover{background:rgb(189,80,41)}}.flex-center{display:flex;justify-content:center;align-items:center;flex-direction:column;height:100%;width:100%}.flex{display:flex}.overlay{position:fixed;top:0;left:0;width:100%;height:100%;min-width:100vw;min-height:100vh;z-index:300}.toast{position:fixed;bottom:20%;left:50%;transform:translate(-50%);z-index:500;background-color:#2e3133cc;padding:10px 20px;padding:calc(var(--btn-margin) * 5) calc(var(--btn-margin) * 10);border-radius:4px;border-radius:calc(var(--btn-margin) * 2);pointer-events:none;font-size:14px;font-size:var(--font-14)}.text-input{display:flex;justify-content:center;align-items:center;flex-direction:column;font-size:14px;font-size:var(--font-14);color:#e8e6e3;border:0px;outline:0px;background:rgb(63,67,69);min-width:80px;min-width:calc(var(--btn-size) * 2);padding:0 10px}.color-input{display:flex;justify-content:center;align-items:center;flex-direction:column;border:0px;outline:0px;min-width:80px;min-width:calc(var(--btn-size) * 2);padding:0;height:32px;height:calc(var(--btn-size) * .8);border-radius:2px;border-radius:var(--btn-margin)}.color-input::-webkit-color-swatch-wrapper{padding:0}.color-input::-webkit-color-swatch{border:none}:root{--space-4: 4px;--space-6: 6px;--space-8: 8px;--space-10: 10px;--space-12: 12px;--space-16: 16px;--space-20: 20px;--space-24: 24px;--btn-size: 40px;--btn-radius: 2px;--btn-margin: 2px;--font-10: 10px;--font-12: 12px;--font-14: 14px;--font-16: 16px;--font-18: 18px;--font-20: 20px;--font-22: 22px}@media (max-width: 499px){:root{--space-4: 2px;--space-6: 4px;--space-8: 6px;--space-10: 8px;--space-12: 10px;--space-16: 12px;--space-20: 14px;--space-24: 16px;--btn-size: 32px;--btn-radius: 2px;--btn-margin: 1.6px;--font-10: 10px;--font-12: 11px;--font-14: 12px;--font-16: 14px;--font-18: 16px;--font-20: 17px;--font-22: 18px}}:export{gray_primary:rgb(94,101,105);gray_second:rgba(94,101,105,.6);yellow_primary:rgb(199,156,15);btn_size:40px;btn_size:var(--btn-size);btn_margin:2px;btn_margin:var(--btn-margin)}.vf-stavebarline{fill:#e8e6e3}.vf-clef,.vf-stavenote{fill:#fff;stroke:#e8e6e3}