@import url(https://fonts.googleapis.com/css?family=Lexend+Deca&display=swap);.keys-panel__key-container{border-radius:200px}.fade-quick-enter-active{-webkit-animation:fade-in .1s forwards;animation:fade-in .1s forwards}.fade-quick-leave-active{-webkit-animation:fade-out .1s forwards;animation:fade-out .1s forwards}.fade-page-quick-enter-active{position:fixed;width:100%;height:100%;z-index:999999;-webkit-animation:fade-in .1s forwards;animation:fade-in .1s forwards}.fade-page-quick-leave-active{position:fixed;width:100%;height:100%;z-index:-1}.fade-slow-enter-active,.fade-slow-leave-active{-webkit-transition:opacity .5s;transition:opacity .5s}.fade-slow-enter,.fade-slow-leave-to{opacity:0}.swipe-up-leave-active{pointer-events:none;-webkit-animation:swipe-up-and-fade 3s;animation:swipe-up-and-fade 3s;position:fixed}.swipe-up-leave-active>*{-webkit-transition:opacity 3s;transition:opacity 3s}.swipe-up-leave-to,.swipe-up-leave-to>*{opacity:0}.swipe-down-enter-active{-webkit-animation:fade-and-swipe-down 1s;animation:fade-and-swipe-down 1s;overflow:hidden;position:fixed;top:0}.swipe-down-enter{max-height:100vh;opacity:1}@-webkit-keyframes swipe-up-and-fade{0%{-webkit-transform:translateY(0);transform:translateY(0);opacity:1}33%{-webkit-transform:translateY(-100%);transform:translateY(-100%);opacity:1}to{-webkit-transform:translateY(-100%);transform:translateY(-100%);opacity:0}}@keyframes swipe-up-and-fade{0%{-webkit-transform:translateY(0);transform:translateY(0);opacity:1}33%{-webkit-transform:translateY(-100%);transform:translateY(-100%);opacity:1}to{-webkit-transform:translateY(-100%);transform:translateY(-100%);opacity:0}}@-webkit-keyframes fade-and-swipe-down{0%{-webkit-transform:translateY(-100%);transform:translateY(-100%);opacity:0}33%{-webkit-transform:translateY(-100%);transform:translateY(-100%);opacity:1}to{-webkit-transform:translateY(0);transform:translateY(0);opacity:1}}@keyframes fade-and-swipe-down{0%{-webkit-transform:translateY(-100%);transform:translateY(-100%);opacity:0}33%{-webkit-transform:translateY(-100%);transform:translateY(-100%);opacity:1}to{-webkit-transform:translateY(0);transform:translateY(0);opacity:1}}@-webkit-keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@-webkit-keyframes fade-in-up{0%{opacity:0;-webkit-transform:translateY(10px);transform:translateY(10px)}to{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes fade-in-up{0%{opacity:0;-webkit-transform:translateY(10px);transform:translateY(10px)}to{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@-webkit-keyframes fade-in-down{0%{opacity:0;-webkit-transform:translateY(-10px);transform:translateY(-10px)}to{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes fade-in-down{0%{opacity:0;-webkit-transform:translateY(-10px);transform:translateY(-10px)}to{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@-webkit-keyframes fade-out{0%{opacity:1}to{opacity:0}}@keyframes fade-out{0%{opacity:1}to{opacity:0}}@-webkit-keyframes fade-out-down{0%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}to{opacity:0;-webkit-transform:translateY(10px);transform:translateY(10px)}}@keyframes fade-out-down{0%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}to{opacity:0;-webkit-transform:translateY(10px);transform:translateY(10px)}}@-webkit-keyframes wobble{0%{-webkit-transform:translateX(0);transform:translateX(0)}20%{-webkit-transform:translateX(-5%);transform:translateX(-5%)}40%{-webkit-transform:translateX(5%);transform:translateX(5%)}60%{-webkit-transform:translateX(-5%);transform:translateX(-5%)}80%{-webkit-transform:translateX(5%);transform:translateX(5%)}to{-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes wobble{0%{-webkit-transform:translateX(0);transform:translateX(0)}20%{-webkit-transform:translateX(-5%);transform:translateX(-5%)}40%{-webkit-transform:translateX(5%);transform:translateX(5%)}60%{-webkit-transform:translateX(-5%);transform:translateX(-5%)}80%{-webkit-transform:translateX(5%);transform:translateX(5%)}to{-webkit-transform:translateX(0);transform:translateX(0)}}.keys-panel__key-container{font-size:16px;font-family:Monaco,monospace;padding:8px 16px;background:var(--color-grey-lightest,#e9eff2);text-align:center;margin:24px auto}.keys-panel__key-part{font-weight:100;color:var(--color-grey-darkest,#262e3a)}.keys-panel__key-sep{color:var(--color-grey-base,#8795a1);margin:4px}.theme-dark .keys-panel__key-container{background:var(--color-black,#1c2129)}.theme-dark .keys-panel__key-part{color:var(--color-grey-lightest,#e9eff2)}