.key{-webkit-user-select:none;user-select:none;cursor:pointer;flex-direction:column;justify-content:center;align-items:center;transition:all 80ms;display:flex;position:relative;box-shadow:0 4px #0000004d}.key:active,.key.active{filter:brightness(.9);transform:translateY(4px)!important;box-shadow:0 0 #0000!important}.svg-finger.svelte-1jlvu65{transition:fill .15s}.finger-lp{color:#881337;background-color:#fecdd3;border:1px solid #fda4af;box-shadow:0 4px #e11d48}.finger-lp.active{box-shadow:0 0 #e11d48}.finger-lr{color:#7c2d12;background-color:#fed7aa;border:1px solid #fdba74;box-shadow:0 4px #ea580c}.finger-lr.active{box-shadow:0 0 #ea580c}.finger-lm{color:#713f12;background-color:#fde047;border:1px solid #facc15;box-shadow:0 4px #ca8a04}.finger-lm.active{box-shadow:0 0 #ca8a04}.finger-li{color:#365314;background-color:#d9f99d;border:1px solid #bef264;box-shadow:0 4px #65a30d}.finger-li.active{box-shadow:0 0 #65a30d}.finger-ri{color:#064e3b;background-color:#a7f3d0;border:1px solid #6ee7b7;box-shadow:0 4px #059669}.finger-ri.active{box-shadow:0 0 #059669}.finger-rm{color:#0c4a6e;background-color:#bae6fd;border:1px solid #7dd3fc;box-shadow:0 4px #0284c7}.finger-rm.active{box-shadow:0 0 #0284c7}.finger-rr{color:#312e81;background-color:#c7d2fe;border:1px solid #a5b4fc;box-shadow:0 4px #4f46e5}.finger-rr.active{box-shadow:0 0 #4f46e5}.finger-rp{color:#581c87;background-color:#e9d5ff;border:1px solid #d8b4fe;box-shadow:0 4px #9333ea}.finger-rp.active{box-shadow:0 0 #9333ea}.finger-t{color:#0f172a;background-color:#e2e8f0;border:1px solid #cbd5e1;box-shadow:0 4px #64748b}.finger-t.active{box-shadow:0 0 #64748b}.key-target{outline-offset:2px;animation:1.5s infinite alternate svelte-1jlvu65-pulse-glow;outline:3px solid #22d3ee!important}@keyframes svelte-1jlvu65-pulse-glow{0%{box-shadow:0 4px #0000004d,0 0 6px #22d3ee66}to{box-shadow:0 4px #0000004d,0 0 20px #22d3eed9}}