.keyboard[data-v-51f166fd]{width:100%;max-height:60vh;display:block;overflow:visible}.keyboard.interactive[data-v-51f166fd]{touch-action:none}.key rect[data-v-51f166fd]{fill:var(--key-white);stroke:var(--key-edge);stroke-width:1px;transition:fill 80ms}.key.black rect[data-v-51f166fd]{fill:var(--key-black);stroke:var(--key-black)}.key.hl rect[data-v-51f166fd]{fill:var(--key-highlight)}.key.pressed rect[data-v-51f166fd]{fill:var(--key-pressed)}.key text[data-v-51f166fd]{fill:var(--key-white-ink);font-family:var(--font-sans);pointer-events:none;-webkit-user-select:none;user-select:none;font-size:11px;font-weight:700}.key.black text[data-v-51f166fd]{fill:var(--key-black-ink);font-size:8px}.key.hl text[data-v-51f166fd]{fill:var(--key-highlight-ink)}.interactive .key[data-v-51f166fd]{cursor:pointer;outline:none}.interactive .key:focus-visible rect[data-v-51f166fd]{stroke:var(--trim);stroke-width:2px}