.key.svelte-1mjyx87{box-sizing:border-box;z-index:2;cursor:pointer;border:2px solid #000;border-radius:.5rem;transition:all 70ms;display:block;position:relative;box-shadow:0 0 10px #00000080}.key.svelte-1mjyx87:not(.sharp){float:left;background:#fff;width:10%;height:100%}.key.svelte-1mjyx87:not(.sharp):hover{background-image:linear-gradient(#fff,#eee)}.key.svelte-1mjyx87:not(.sharp).keydown{background-image:linear-gradient(#fff,#ccc)}.key.svelte-1mjyx87.sharp{color:#eee;z-index:3;background:#000;width:6%;height:60%;position:absolute;top:0}.key.svelte-1mjyx87.sharp:hover{background-image:linear-gradient(#000,#222)}.key.svelte-1mjyx87.sharp.keydown{background-image:linear-gradient(#000,#444)}.hint.svelte-1mjyx87{text-align:center;-webkit-user-select:none;user-select:none;width:100%;font-size:20px;transition:opacity .3s ease-out;position:absolute;bottom:7px}.hover.svelte-1mjyx87{display:none}.key.svelte-1mjyx87:hover .hover:where(.svelte-1mjyx87){display:inline-block}.keys.svelte-1wtq9tr{width:100%;height:350px;position:relative}.container.svelte-1wtq9tr{z-index:1051;max-width:880px;margin:auto;position:relative}.backdrop.svelte-1wtq9tr{z-index:1050;background:#0000004d;position:fixed;inset:0}