@import "https://fonts.googleapis.com/css2?family=MedievalSharp&family=Uncial+Antiqua&display=swap";
.styles-module__GF4Eka__container{cursor:default;background:linear-gradient(135deg,#3a2f1f 0%,#2a1f15 100%);flex-direction:column;justify-content:center;align-items:center;min-height:100vh;padding:2rem;font-family:MedievalSharp,Uncial Antiqua,serif;display:flex;position:relative}.styles-module__GF4Eka__buttonContainer{z-index:1000;position:fixed;top:1rem;left:1rem}.styles-module__GF4Eka__backButton{color:#000;cursor:pointer;background:#fff;border:2px outset silver;justify-content:center;align-items:center;width:40px;height:40px;font-size:1.5rem;font-weight:700;text-decoration:none;display:flex;box-shadow:inset 1px 1px #fffc,inset -1px -1px #0003}.styles-module__GF4Eka__backButton:active{border-style:inset;box-shadow:inset 1px 1px #0003,inset -1px -1px #fffc}.styles-module__GF4Eka__window{background-color:#4a3828;background-image:repeating-linear-gradient(90deg,#0000,#0000 6px,#00000026 6px 12px),linear-gradient(#4a3828f2 0%,#3a2b1efa 50%,#4a3828f2 100%);background-position:0 0;background-repeat:repeat;background-size:12px 100%,100% 100%;background-attachment:scroll;background-origin:padding-box;background-clip:border-box;border:4px solid #3a2f1f;border-radius:4px;width:100%;max-width:1000px;padding:0;position:relative;box-shadow:0 4px 12px #0009,inset 0 2px 4px #0006,0 0 0 2px #3a2f1fcc}.styles-module__GF4Eka__windowTitle{color:#fff;text-align:center;background:#000;border-bottom:2px solid #000;padding:.5rem;font-size:1rem;font-weight:700}.styles-module__GF4Eka__windowContent{background:0 0;flex-direction:column;align-items:center;gap:1.5rem;padding:2rem;display:flex}.styles-module__GF4Eka__controls{flex-wrap:wrap;justify-content:center;gap:1rem;width:100%;display:flex}.styles-module__GF4Eka__controlGroup{align-items:center;gap:.75rem;display:flex}.styles-module__GF4Eka__label{color:#f5f5e6;text-shadow:1px 1px 2px #00000080;font-size:1rem;font-weight:700}.styles-module__GF4Eka__buttonGroup{align-items:center;gap:.5rem;display:flex}.styles-module__GF4Eka__button{color:#000;cursor:pointer;background:#fff;border:2px outset silver;width:32px;height:24px;font-size:1rem;font-weight:700;box-shadow:inset 1px 1px #fffc,inset -1px -1px #0003}.styles-module__GF4Eka__button:active:not(:disabled){border-style:inset;box-shadow:inset 1px 1px #0003,inset -1px -1px #fffc}.styles-module__GF4Eka__button:disabled{opacity:.5;cursor:not-allowed}.styles-module__GF4Eka__settingsButton{color:#000;cursor:pointer;text-align:center;background:#fff;border:2px outset silver;justify-content:center;align-items:center;width:auto;min-width:120px;height:24px;padding:.25rem 1rem;font-size:1rem;font-weight:700;display:flex;box-shadow:inset 1px 1px #fffc,inset -1px -1px #0003}.styles-module__GF4Eka__settingsButton:active{border-style:inset;box-shadow:inset 1px 1px #0003,inset -1px -1px #fffc}.styles-module__GF4Eka__octaveDisplay{text-align:center;color:#f5f5e6;text-shadow:1px 1px 2px #00000080;min-width:30px;font-size:1rem;font-weight:700}.styles-module__GF4Eka__visualizer{background:#2a1f15;border:2px solid #3a2f1f;border-radius:4px;width:100%;height:120px;margin-bottom:1rem;padding:.75rem;position:relative;overflow:hidden;box-shadow:inset 0 2px 4px #0009,0 2px 8px #00000080}.styles-module__GF4Eka__waveformBackground{pointer-events:none;z-index:0;width:100%;height:100%;position:absolute;top:0;left:0}.styles-module__GF4Eka__waveformPath{filter:drop-shadow(0 0 2px #8b6f4780);transition:opacity .3s}.styles-module__GF4Eka__visualizerBars{z-index:1;justify-content:center;align-items:flex-end;gap:2px;width:100%;height:100%;padding:.5rem 0;display:flex;position:relative}.styles-module__GF4Eka__visualizerBar{background:linear-gradient(#f5f5e6e6,#8b6f47cc);border-radius:2px 2px 0 0;flex:1;min-width:4px;max-width:20px;transition:height .1s ease-out;animation:.5s ease-in-out styles-module__GF4Eka__visualizerPulse;box-shadow:0 0 8px #f5f5e680,inset 0 1px #ffffff4d}@keyframes styles-module__GF4Eka__visualizerPulse{0%,to{opacity:.8;transform:scaleY(1)}50%{opacity:1;transform:scaleY(1.05)}}.styles-module__GF4Eka__visualizerEmpty{color:#8b6f47;text-shadow:1px 1px 2px #000c;opacity:.6;pointer-events:none;font-size:.9rem;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.styles-module__GF4Eka__pianoContainer{flex-direction:column;align-items:center;gap:.5rem;width:100%;padding:1rem 0;display:flex}.styles-module__GF4Eka__couplers{background-color:#4a3828;background-image:repeating-linear-gradient(90deg,#0000,#0000 3px,#00000026 3px 6px),linear-gradient(#4a3828e6 0%,#3a2b1ef2 50%,#4a3828e6 100%);background-position:0 0;background-repeat:repeat;background-size:8px 100%,100% 100%;background-attachment:scroll;background-origin:padding-box;background-clip:border-box;border-radius:4px 4px 0 0;justify-content:center;align-items:flex-end;gap:.5rem;width:calc(100% - 2rem);max-width:calc(840px + 2rem);padding:.5rem .5rem 0;display:flex;position:relative;box-shadow:inset 0 2px 4px #0006,0 2px 8px #00000080}.styles-module__GF4Eka__couplerTopBar{background:#1a237e;border-radius:4px 4px 0 0;height:4px;position:absolute;top:0;left:0;right:0}.styles-module__GF4Eka__coupler{color:#000;cursor:pointer;z-index:1;background:#f5f5e6;border:1px solid #d4c5a9;border-top:none;border-radius:0 0 8px 8px;flex-direction:column;justify-content:space-between;align-items:center;width:60px;height:120px;padding:.25rem .25rem .5rem;font-size:.65rem;font-weight:700;transition:all .1s;display:flex;position:relative;box-shadow:0 2px 4px #00000040,inset 0 1px #fff9,inset 0 -1px #0000001a}.styles-module__GF4Eka__couplerYellow{background:gold;border-color:#ca0}.styles-module__GF4Eka__couplerBlack{color:#fff;background:#1a1a1a;border-color:#000}.styles-module__GF4Eka__couplerRed{color:#fff;background:#c33;border-color:#900}.styles-module__GF4Eka__couplerCream{color:#000;background:#f5f5e6;border-color:#d4c5a9}.styles-module__GF4Eka__coupler:active{animation:.15s ease-out styles-module__GF4Eka__couplerClick;transform:translateY(1px)scale(.96);box-shadow:inset 0 2px 4px #0000004d,inset 0 1px #ffffff4d}.styles-module__GF4Eka__couplerActive{animation:2s ease-in-out infinite styles-module__GF4Eka__couplerActiveGlow;transform:translateY(2px);box-shadow:inset 0 2px 4px #0006,inset 0 1px #fff3,0 0 6px #f5f5e666}.styles-module__GF4Eka__couplerActive.styles-module__GF4Eka__couplerYellow{animation:2s ease-in-out infinite styles-module__GF4Eka__couplerYellowGlow}.styles-module__GF4Eka__couplerActive.styles-module__GF4Eka__couplerRed{animation:2s ease-in-out infinite styles-module__GF4Eka__couplerRedGlow}.styles-module__GF4Eka__couplerActive.styles-module__GF4Eka__couplerBlack{animation:2s ease-in-out infinite styles-module__GF4Eka__couplerBlackGlow}.styles-module__GF4Eka__couplerActive:active{animation:.15s ease-out styles-module__GF4Eka__couplerClick;transform:translateY(3px)scale(.96)}.styles-module__GF4Eka__couplerNumber{font-size:.7rem;font-weight:700;line-height:1}.styles-module__GF4Eka__couplerLabel{text-align:center;flex:1;justify-content:center;align-items:center;padding:.25rem 0;font-size:.6rem;font-weight:700;line-height:1.1;display:flex}.styles-module__GF4Eka__couplerFootage{font-size:.6rem;font-weight:700;line-height:1}.styles-module__GF4Eka__speakerGrille{background:#a0a0a0 repeating-linear-gradient(90deg,#0000,#0000 3px,#0000004d 3px 6px) 0 0/6px 100%;border:2px inset #8b6f47;border-radius:8px 8px 0 0;width:calc(100% - 2rem);max-width:calc(840px + 2rem);height:40px;position:relative;box-shadow:inset 1px 1px #0000004d,inset -1px -1px #fff3}.styles-module__GF4Eka__speakerGrille:before{content:"";pointer-events:none;background:linear-gradient(#0000 0%,#0000001a 20%,#00000026 50%,#0000001a 80%,#0000 100%);width:90%;height:80%;position:absolute;top:10%;left:5%}.styles-module__GF4Eka__piano{background-color:#8b6f47;background-image:repeating-linear-gradient(90deg,#0000,#0000 4px,#00000014 4px 8px),repeating-linear-gradient(0deg,#0000,#0000 8px,#0000000d 8px 16px),linear-gradient(#8b6f47f2 0%,#6b5737fa 50%,#8b6f47f2 100%);background-position:0 0;background-repeat:repeat;background-size:8px 100%,100% 16px,100% 100%;background-attachment:scroll;background-origin:padding-box;background-clip:border-box;border:3px solid #6b5737;border-radius:8px;padding:1.5rem;display:flex;position:relative;box-shadow:inset 0 2px 6px #0000004d,inset 0 -2px 6px #0003,0 6px 12px #0006,0 0 0 1px #8b6f4799}.styles-module__GF4Eka__whiteKey{cursor:pointer;z-index:1;background:#f5f5e6;border:1px solid #d4c5a9;border-radius:8px;justify-content:center;align-items:flex-end;width:60px;height:200px;padding-bottom:.5rem;transition:all .1s;display:flex;position:relative;box-shadow:0 3px 6px #00000040,inset 0 1px #fffc,inset 0 -1px #0000001a}.styles-module__GF4Eka__whiteKey:first-child{border-top-left-radius:8px;border-bottom-left-radius:8px}.styles-module__GF4Eka__whiteKey:last-child{border-top-right-radius:8px;border-bottom-right-radius:8px}.styles-module__GF4Eka__whiteKey.styles-module__GF4Eka__keyPressed{background:#e8e8d8;border-color:#c4b59a;animation:.3s ease-out styles-module__GF4Eka__whiteKeyGlow;transform:translateY(2px)scale(.97);box-shadow:inset 0 3px 6px #0006,inset 0 1px #fff6,0 0 12px #e8e8d866}.styles-module__GF4Eka__blackKey{cursor:pointer;z-index:2;background:#1a1a1a;border:1px solid #000;border-radius:8px;justify-content:center;align-items:flex-end;width:36px;height:120px;padding-bottom:.5rem;transition:all .1s;display:flex;position:absolute;box-shadow:0 4px 8px #0009,inset 0 1px #ffffff26,inset 0 -1px #00000080}.styles-module__GF4Eka__blackKey.styles-module__GF4Eka__keyPressed{background:#4a4a4a;animation:.3s ease-out styles-module__GF4Eka__blackKeyGlow;transform:translateY(2px)scale(.97);box-shadow:inset 0 3px 6px #000000b3,inset 0 1px #ffffff1a,0 0 10px #4a4a4a80}.styles-module__GF4Eka__keyLabel{color:#666;-webkit-user-select:none;user-select:none;pointer-events:none;font-size:.75rem;font-weight:700}.styles-module__GF4Eka__blackKey .styles-module__GF4Eka__keyLabel{color:#666}.styles-module__GF4Eka__instructions{text-align:center;color:#d4c5a9;text-shadow:1px 1px 2px #00000080;margin-top:.5rem;font-size:.9rem;font-style:italic}.styles-module__GF4Eka__instructions p{margin:0}.styles-module__GF4Eka__oscillatorSelect{color:#000;cursor:pointer;appearance:none;background-color:#fff;background-image:linear-gradient(45deg,#0000 50%,#000 50%),linear-gradient(135deg,#000 50%,#0000 50%);background-position:calc(100% - .75rem) calc(.5rem + 2px),calc(100% - .5rem) calc(.5rem + 2px);background-repeat:no-repeat;background-size:.25rem .25rem,.25rem .25rem;background-attachment:scroll;background-origin:padding-box;background-clip:border-box;border:2px outset silver;border-radius:0;min-width:120px;padding:.25rem 2rem .25rem .5rem;font-family:inherit;font-size:.9rem;font-weight:700;box-shadow:inset 1px 1px #fffc,inset -1px -1px #0003}.styles-module__GF4Eka__oscillatorSelect:hover{background-color:#f5f5f5;background-image:linear-gradient(45deg,#0000 50%,#000 50%),linear-gradient(135deg,#000 50%,#0000 50%);background-position:calc(100% - .75rem) calc(.5rem + 2px),calc(100% - .5rem) calc(.5rem + 2px);background-repeat:no-repeat;background-size:.25rem .25rem,.25rem .25rem}.styles-module__GF4Eka__oscillatorSelect:focus{border-style:inset;outline:none;box-shadow:inset 1px 1px #0003,inset -1px -1px #fffc}.styles-module__GF4Eka__oscillatorSelect option{color:#000;background:#fff;padding:.25rem}.styles-module__GF4Eka__songSelect{color:#000;cursor:pointer;appearance:none;background-color:#fff;background-image:linear-gradient(45deg,#0000 50%,#000 50%),linear-gradient(135deg,#000 50%,#0000 50%);background-position:calc(100% - .75rem) calc(.5rem + 2px),calc(100% - .5rem) calc(.5rem + 2px);background-repeat:no-repeat;background-size:.25rem .25rem,.25rem .25rem;background-attachment:scroll;background-origin:padding-box;background-clip:border-box;border:2px outset silver;border-radius:0;min-width:200px;padding:.25rem 2rem .25rem .5rem;font-family:inherit;font-size:.9rem;font-weight:700;box-shadow:inset 1px 1px #fffc,inset -1px -1px #0003}.styles-module__GF4Eka__songSelect:hover:not(:disabled){background-color:#f5f5f5;background-image:linear-gradient(45deg,#0000 50%,#000 50%),linear-gradient(135deg,#000 50%,#0000 50%);background-position:calc(100% - .75rem) calc(.5rem + 2px),calc(100% - .5rem) calc(.5rem + 2px);background-repeat:no-repeat;background-size:.25rem .25rem,.25rem .25rem}.styles-module__GF4Eka__songSelect:focus{border-style:inset;outline:none;box-shadow:inset 1px 1px #0003,inset -1px -1px #fffc}.styles-module__GF4Eka__songSelect:disabled{opacity:.6;cursor:not-allowed}.styles-module__GF4Eka__songSelect option{color:#000;background:#fff;padding:.25rem}.styles-module__GF4Eka__settingsPanel{background-color:#5a4a32;background-image:repeating-linear-gradient(90deg,#0000,#0000 3px,#00000026 3px 6px),linear-gradient(#5a4a32e6 0%,#4a3a28f2 50%,#5a4a32e6 100%);background-position:0 0;background-repeat:repeat;background-size:8px 100%,100% 100%;background-attachment:scroll;background-origin:padding-box;background-clip:border-box;border:2px solid #3a2f1f;border-radius:4px;width:100%;margin-top:1rem;padding:1rem;box-shadow:inset 0 2px 4px #0006,0 2px 8px #00000080}.styles-module__GF4Eka__settingsTitle{color:#f5f5e6;text-shadow:1px 1px 2px #00000080;text-align:center;margin:0 0 1rem;font-size:1rem;font-weight:700}.styles-module__GF4Eka__settingsGrid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem;display:grid}.styles-module__GF4Eka__settingItem{flex-direction:column;gap:.5rem;display:flex}.styles-module__GF4Eka__settingLabel{color:#f5f5e6;text-shadow:1px 1px 2px #00000080;font-size:.85rem;font-weight:700}.styles-module__GF4Eka__slider{cursor:pointer;appearance:none;background:#3a2f1f;border:1px solid #2a1f15;border-radius:3px;outline:none;width:100%;height:6px;box-shadow:inset 0 1px 2px #00000080,0 1px #ffffff1a}.styles-module__GF4Eka__slider::-webkit-slider-thumb{appearance:none;cursor:pointer;background:#f5f5e6;border:1px solid #d4c5a9;border-radius:2px;width:16px;height:16px;transition:all .1s;box-shadow:0 2px 4px #0006,inset 0 1px #fff9,inset 0 -1px #0003}.styles-module__GF4Eka__slider::-webkit-slider-thumb:hover{background:#fff;box-shadow:0 2px 6px #00000080,inset 0 1px #fffc,inset 0 -1px #0003}.styles-module__GF4Eka__slider::-webkit-slider-thumb:active{transform:scale(.95);box-shadow:inset 0 1px 2px #0006,inset 0 -1px #ffffff4d}.styles-module__GF4Eka__slider::-moz-range-thumb{cursor:pointer;background:#f5f5e6;border:1px solid #d4c5a9;border-radius:2px;width:16px;height:16px;transition:all .1s;box-shadow:0 2px 4px #0006,inset 0 1px #fff9,inset 0 -1px #0003}.styles-module__GF4Eka__slider::-moz-range-thumb:hover{background:#fff;box-shadow:0 2px 6px #00000080,inset 0 1px #fffc,inset 0 -1px #0003}.styles-module__GF4Eka__slider::-moz-range-thumb:active{transform:scale(.95);box-shadow:inset 0 1px 2px #0006,inset 0 -1px #ffffff4d}@keyframes styles-module__GF4Eka__keyPress{0%{transform:translateY(0)scale(1)}50%{transform:translateY(2px)scale(.98)}to{transform:translateY(2px)scale(.97)}}@keyframes styles-module__GF4Eka__keyPulse{0%,to{box-shadow:0 3px 6px #00000040,inset 0 1px #fffc,inset 0 -1px #0000001a}50%{box-shadow:0 3px 6px #00000059,0 0 12px #8b6f4766,inset 0 1px #fffc,inset 0 -1px #0000001a}}@keyframes styles-module__GF4Eka__whiteKeyGlow{0%{box-shadow:inset 0 3px 6px #0006,inset 0 1px #fff6,0 0 8px #e8e8d84d}to{box-shadow:inset 0 3px 6px #0006,inset 0 1px #fff6,0 0 16px #e8e8d880}}@keyframes styles-module__GF4Eka__blackKeyGlow{0%{box-shadow:inset 0 3px 6px #000000b3,inset 0 1px #ffffff1a,0 0 6px #4a4a4a66}to{box-shadow:inset 0 3px 6px #000000b3,inset 0 1px #ffffff1a,0 0 12px #4a4a4a99}}@keyframes styles-module__GF4Eka__couplerClick{0%{transform:translateY(0)scale(1)}50%{transform:translateY(1px)scale(.96)}to{transform:translateY(2px)scale(1)}}@keyframes styles-module__GF4Eka__couplerActiveGlow{0%,to{box-shadow:inset 0 2px 4px #0006,inset 0 1px #fff3,0 0 4px #f5f5e64d}50%{box-shadow:inset 0 2px 4px #0006,inset 0 1px #fff3,0 0 8px #f5f5e680}}@keyframes styles-module__GF4Eka__couplerYellowGlow{0%,to{box-shadow:inset 0 2px 4px #0006,inset 0 1px #fff3,0 0 4px #ffd70066}50%{box-shadow:inset 0 2px 4px #0006,inset 0 1px #fff3,0 0 8px #ffd70099}}@keyframes styles-module__GF4Eka__couplerRedGlow{0%,to{box-shadow:inset 0 2px 4px #0006,inset 0 1px #fff3,0 0 4px #c336}50%{box-shadow:inset 0 2px 4px #0006,inset 0 1px #fff3,0 0 8px #c339}}@keyframes styles-module__GF4Eka__couplerBlackGlow{0%,to{box-shadow:inset 0 2px 4px #0006,inset 0 1px #fff3,0 0 4px #fff3}50%{box-shadow:inset 0 2px 4px #0006,inset 0 1px #fff3,0 0 8px #ffffff4d}}