body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;margin:0}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.App{text-align:center}.App-logo{height:40vmin;pointer-events:none}@media (prefers-reduced-motion:no-preference){.App-logo{animation:App-logo-spin 20s linear infinite}}.App-header{align-items:center;background-color:#282c34;color:#fff;display:flex;flex-direction:column;font-size:calc(10px + 2vmin);justify-content:center;min-height:100vh}.App-link{color:#61dafb}@keyframes App-logo-spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.buttons{display:flex;justify-content:center;margin-bottom:8px;margin-top:16px}.btn{background-color:#fff0f6;border:1.5px solid #f9a8d4;border-radius:8px;color:#ff69b4;cursor:pointer;font-size:14px;font-weight:600;outline:0;padding:6px 24px;transition:background .15s ease,color .15s ease}.btn:hover{background:#fce7f3}.sliders{align-items:center;background:#fff0f6;border:1.5px solid #f9a8d4;border-radius:12px;box-sizing:border-box;display:flex;flex-direction:column;gap:10px;margin:12px auto;padding:16px 24px;width:75%}.range__slider{grid-gap:12px;align-items:center;display:grid;gap:12px;grid-template-columns:72px 1fr 40px;width:100%}.range__slider span:first-child{color:#ff69b4;font-size:.8em;font-weight:600;letter-spacing:.06em;text-align:right;text-transform:uppercase}.range__slider span:last-child{color:#aaa;font-size:.8em;text-align:left}.range__slider [type=range]{-webkit-appearance:none;background:#f9a8d4;border-radius:6px;height:6px;margin:0;outline:none;padding:0;width:100%}.range__slider [type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background:#ff69b4;border-radius:50%;cursor:pointer;height:18px;-webkit-transition:background .15s ease-in-out;transition:background .15s ease-in-out;width:18px}.range__slider [type=range]::-webkit-slider-thumb:hover{background:#f472b6}.range__slider [type=range]::-moz-range-thumb{background:#ff69b4;border:0;border-radius:50%;cursor:pointer;height:18px;-moz-transition:background .15s ease-in-out;transition:background .15s ease-in-out;width:18px}.range__slider [type=range]::-moz-range-thumb:hover{background:#f472b6}#myPiano .ReactPiano__Key--active{background:pink;border:1px solid #fff}#myPiano .ReactPiano__Keyboard,.ReactPiano__Keyboard{display:flex;position:relative}.ReactPiano__Key{display:flex}.ReactPiano__Key--accidental{background:#555;border:1px solid #fff;border-radius:0 0 4px 4px;border-top-color:#0000;cursor:pointer;height:66%;position:absolute;top:0;z-index:1}.ReactPiano__Key--natural{background:#f6f5f3;border:1px solid #888;border-radius:0 0 6px 6px;cursor:pointer;flex:1 1;margin-right:1px;z-index:0}.ReactPiano__Key--natural:last-child{margin-right:0}.ReactPiano__Key--active{background:#3ac8da}.ReactPiano__Key--active.ReactPiano__Key--accidental{border:1px solid #fff;border-top-color:#3ac8da;height:65%}.ReactPiano__Key--active.ReactPiano__Key--natural{border:1px solid #3ac8da;height:98%}.ReactPiano__Key--disabled.ReactPiano__Key--accidental{background:#ddd;border:1px solid #999}.ReactPiano__Key--disabled.ReactPiano__Key--natural{background:#eee;border:1px solid #aaa}.ReactPiano__NoteLabelContainer{align-self:flex-end;flex:1 1}.ReactPiano__NoteLabel{font-size:12px;text-align:center;text-transform:capitalize;-webkit-user-select:none;user-select:none}.ReactPiano__NoteLabel--accidental{color:#f8e8d5;margin-bottom:3px}.ReactPiano__NoteLabel--natural{color:#888;margin-bottom:3px}.ReactPiano__NoteLabel--natural.ReactPiano__NoteLabel--active{color:#f8e8d5}#headerLogo{height:35px;padding-right:15px;width:35px}#helpTable{left:50%;margin-left:-439px;margin-top:20px}#helpTable td{text-align:center}#loaded{display:none}#loadingBar{bottom:0;left:0;margin:auto;position:absolute;right:0;text-align:center;top:0}.h-button{height:100%;text-transform:inherit}.h-link-text{color:#fff;display:block;text-decoration:none}.spacer{margin:auto;padding-top:10px;text-align:center}canvas{border:1px solid #000;display:block;margin:auto;padding:0}.PianoDarkTheme .ReactPiano__Key--accidental{background:#025d7d;border:1px solid #888}.PianoDarkTheme .ReactPiano__Key--natural{background:#013243;border:1px solid #888;margin-right:0}.PianoDarkTheme .ReactPiano__Key--active.ReactPiano__Key--accidental,.PianoDarkTheme .ReactPiano__Key--active.ReactPiano__Key--natural{background:#0396ca}.playlist-container{background:#fff0f6;border:1.5px solid #f9a8d4;border-radius:12px;box-sizing:border-box;display:block;margin:20px auto;padding:16px 24px;width:60%}.playlist-title{color:#ff69b4;font-size:1em;font-weight:600;letter-spacing:.08em;margin:0 0 4px;text-transform:uppercase}.playlist-hint{color:#bbb;font-size:.75em;margin:0 0 12px}.playlist-ul{list-style:none;margin:0;padding:0}.song-item{align-items:center;border-radius:8px;color:#555;cursor:pointer;display:flex;font-size:.9em;gap:8px;padding:8px 12px;transition:background .15s ease,color .15s ease}.song-item span{display:inline-block;flex-shrink:0;text-align:center;width:1.2em}.song-item.active,.song-item:hover{background:#fce7f3;color:#ff69b4}.song-item.active{text-shadow:0 0 .5px #ff69b4}
/*# sourceMappingURL=main.634cd466.css.map*/