._piano-keyboard_92nbj_1{--keyboard-height: calc(3 * var(--scale));--white-key-width: var(--scale);--black-key-width: calc((2 / 3) * var(--scale))}._keyboard-octave_92nbj_7{position:relative;display:inline-block}._white-key_92nbj_12{display:inline-block;background:#fff;width:var(--white-key-width);height:var(--keyboard-height);border:1px solid rgba(0,0,0,.5);border-bottom-left-radius:2px;border-bottom-right-radius:2px;transition:all .1s}._piano-keyboard_92nbj_1:not(._frozen_92nbj_22) ._white-key_92nbj_12:hover:not(._correct_92nbj_22):not(._incorrect_92nbj_22){background:var(--color-brand-blue);border-color:var(--color-brand-blue)}._piano-keyboard_92nbj_1:not(._frozen_92nbj_22) ._black-key_92nbj_26:hover:not(._correct_92nbj_22):not(._incorrect_92nbj_22){background:var(--color-brand-blue)}._black-key_92nbj_26{height:calc((2 / 3) * var(--keyboard-height));width:var(--black-key-width);background:#000;position:absolute;top:0;border-bottom-left-radius:4px;border-bottom-right-radius:4px}._black-key_92nbj_26._C\#_92nbj_40{left:calc((2 / 3) * var(--white-key-width))}._black-key_92nbj_26._D\#_92nbj_43{left:calc(var(--white-key-width) + ((2 / 3) * var(--white-key-width)))}._black-key_92nbj_26._A\#_92nbj_47{right:calc((2 / 3) * var(--white-key-width))}._black-key_92nbj_26._G\#_92nbj_50{right:calc(var(--white-key-width) + ((2 / 3) * var(--white-key-width)))}._black-key_92nbj_26._F\#_92nbj_53{right:calc((2 * var(--white-key-width)) + ((2 / 3) * var(--white-key-width)))}._correct_92nbj_22{background:var(--color-success);animation:var(--animate-blink)}._incorrect_92nbj_22{background:var(--color-destructive);animation:var(--animate-shake)}