.fit.svelte-1lsokxf{width:100%;container-type:inline-size}.keyboard.svelte-1lsokxf{--u:min(2.85rem, (100cqw - 4px) / 16.4);--gap:calc(var(--u) * .11);gap:var(--gap);padding:calc(var(--u) * .3);border-radius:calc(var(--u) * .4);background:var(--surface-2);-webkit-user-select:none;user-select:none;flex-direction:column;width:max-content;margin:0 auto;display:flex}.keyboard.small.svelte-1lsokxf{--u:min(2.1rem, (100cqw - 4px) / 16.4)}.row.svelte-1lsokxf{gap:var(--gap);display:flex}.key.svelte-1lsokxf{width:calc(var(--u) * var(--w) + var(--gap) * (var(--w) - 1));height:var(--u);border-radius:calc(var(--u) * .22);background:var(--f);place-items:center;transition:opacity .5s,transform .12s,box-shadow .2s;display:grid;position:relative;box-shadow:inset 0 -3px #00000014}.label.svelte-1lsokxf{font-weight:700;font-size:calc(var(--u) * .37);color:var(--f-ink)}.wide.svelte-1lsokxf .label:where(.svelte-1lsokxf){font-size:calc(var(--u) * .25);letter-spacing:.02em;font-weight:600}.key.locked.svelte-1lsokxf{background:var(--surface);box-shadow:inset 0 0 0 1px var(--line)}.key.locked.svelte-1lsokxf .label:where(.svelte-1lsokxf){color:var(--muted);opacity:.55;font-weight:500}.key.target.svelte-1lsokxf{box-shadow:0 0 0 3px var(--surface), 0 0 0 6px var(--f-ink), 0 10px 20px -6px var(--f-ink);z-index:1;animation:1.4s ease-in-out infinite svelte-1lsokxf-breathe;transform:translateY(-2px)}@keyframes svelte-1lsokxf-breathe{50%{box-shadow:0 0 0 3px var(--surface), 0 0 0 7px var(--f-ink), 0 12px 24px -6px var(--f-ink)}}.bump.svelte-1lsokxf{background:var(--f-ink);opacity:.55;border-radius:2px;width:26%;height:3px;position:absolute;bottom:22%}.key.heat.svelte-1lsokxf{box-shadow:inset 0 0 0 1px #0000000f}.key.noted.svelte-1lsokxf .label:where(.svelte-1lsokxf){transform:translateY(calc(var(--u) * -.13))}.key.heat.svelte-1lsokxf .label:where(.svelte-1lsokxf){color:var(--heat-ink,var(--ink))}.note.svelte-1lsokxf{font-size:calc(var(--u) * .2);font-family:var(--mono);color:var(--heat-ink,var(--ink-2));opacity:.85;position:absolute;bottom:2px}.ping.svelte-1lsokxf{border-radius:inherit;background:var(--f-ink);opacity:0;pointer-events:none;animation:.35s ease-out svelte-1lsokxf-ping;position:absolute;inset:0}.ping.bad.svelte-1lsokxf{background:var(--bad);animation:.4s ease-out svelte-1lsokxf-ping-bad}@keyframes svelte-1lsokxf-ping{0%{opacity:.45}to{opacity:0}}@keyframes svelte-1lsokxf-ping-bad{0%{opacity:.7}to{opacity:0}}@media (prefers-reduced-motion:reduce){.key.target.svelte-1lsokxf{animation:none}}