figure.svelte-o4rk4b{margin:14px 0 0}.stage.svelte-o4rk4b{--key:40px;--gap:6px;border-radius:var(--radius);background:var(--surface);border:1px solid var(--line);width:max-content;padding:10px 12px 12px;position:relative}.typed.svelte-o4rk4b{height:30px;margin-bottom:calc(var(--key) + 12px);align-items:center;gap:2px;font-size:22px;font-weight:600;display:flex}.result.svelte-o4rk4b{opacity:0;animation:4s infinite svelte-o4rk4b-result}.caret.svelte-o4rk4b{background:var(--brand);width:2px;height:22px}.popup.svelte-o4rk4b{gap:var(--gap);background:var(--surface-alt);border:1px solid var(--line);opacity:0;border-radius:12px;margin:-4px;padding:4px;animation:4s infinite svelte-o4rk4b-popup;display:flex;position:absolute;top:46px;left:12px}.option.svelte-o4rk4b,.key.svelte-o4rk4b{width:var(--key);height:var(--key);border-radius:9px;place-items:center;font-size:18px;font-weight:500;display:grid}.option.pick.svelte-o4rk4b{animation:4s infinite svelte-o4rk4b-pick}.row.svelte-o4rk4b{gap:var(--gap);display:flex}.key.svelte-o4rk4b{background:var(--surface-alt);border:1px solid var(--line)}.key.base.svelte-o4rk4b{animation:4s infinite svelte-o4rk4b-press}.finger.svelte-o4rk4b{left:calc(12px + var(--key) / 2 - 13px);top:calc(10px + 30px + var(--key) + 12px + var(--key) / 2 - 13px);background:var(--brand);opacity:0;border-radius:50%;width:26px;height:26px;animation:4s infinite svelte-o4rk4b-finger;position:absolute}@keyframes svelte-o4rk4b-finger{0%,8%{opacity:0;transform:translate(0)scale(1.3)}14%,38%{opacity:.35;transform:translate(0)scale(1)}58%,70%{opacity:.35;transform:translate(calc(var(--pick) * (var(--key) + var(--gap))), calc(-1 * var(--key) - 12px)) scale(1)}76%,to{opacity:0;transform:translate(calc(var(--pick) * (var(--key) + var(--gap))), calc(-1 * var(--key) - 12px)) scale(1.3)}}@keyframes svelte-o4rk4b-press{0%,12%,76%,to{background:var(--surface-alt)}16%,70%{background:var(--line)}}@keyframes svelte-o4rk4b-popup{0%,30%,76%,to{opacity:0}36%,70%{opacity:1}}@keyframes svelte-o4rk4b-pick{0%,54%,76%,to{color:inherit;background:0 0}58%,70%{background:var(--brand);color:var(--on-brand)}}@keyframes svelte-o4rk4b-result{0%,70%{opacity:0}74%,96%{opacity:1}to{opacity:0}}figcaption.svelte-o4rk4b{margin-top:8px}@media (prefers-reduced-motion:reduce){.result.svelte-o4rk4b,.popup.svelte-o4rk4b{opacity:1;animation:none}.option.pick.svelte-o4rk4b{background:var(--brand);color:var(--on-brand);animation:none}.finger.svelte-o4rk4b,.key.base.svelte-o4rk4b{animation:none}}h1.svelte-1i19ct2{letter-spacing:-.02em;margin:20px 0;font-size:28px}.card.svelte-1i19ct2{margin-bottom:12px;padding:16px}.title.svelte-1i19ct2{font-weight:600;display:block}.toggle.svelte-1i19ct2{justify-content:space-between;align-items:flex-start;gap:16px;display:flex}.help.svelte-1i19ct2{margin-top:2px;display:block}select.svelte-1i19ct2{border:1px solid var(--line);background:var(--surface);min-height:40px;color:var(--ink);font:inherit;border-radius:10px;flex:none;padding:0 12px}input[type=checkbox].svelte-1i19ct2{appearance:none;background:var(--line);cursor:pointer;border-radius:16px;flex:none;width:52px;height:32px;margin:0;transition:background-color .15s;position:relative}input[type=checkbox].svelte-1i19ct2:after{content:"";background:#fff;border-radius:50%;width:26px;height:26px;transition:transform .15s;position:absolute;top:3px;left:3px}input[type=checkbox].svelte-1i19ct2:checked{background:var(--brand)}input[type=checkbox].svelte-1i19ct2:checked:after{transform:translate(20px)}fieldset.svelte-1i19ct2{border:0;margin:0;padding:0}legend.svelte-1i19ct2{margin-bottom:10px;padding:0}.segments.svelte-1i19ct2{grid-template-columns:repeat(3,1fr);gap:6px;display:grid}.segments.svelte-1i19ct2 label:where(.svelte-1i19ct2){border:1px solid var(--line);background:var(--surface);cursor:pointer;border-radius:12px;place-items:center;min-height:44px;display:grid}.segments.svelte-1i19ct2 label.selected:where(.svelte-1i19ct2){border-color:var(--brand);background:var(--brand-tint);font-weight:600}.segments.svelte-1i19ct2 input:where(.svelte-1i19ct2){opacity:0;pointer-events:none;position:absolute}.segments.svelte-1i19ct2 label:where(.svelte-1i19ct2):has(:where(.svelte-1i19ct2):focus-visible){outline:2px solid var(--brand);outline-offset:2px}