.demo.svelte-1ii13yv{border-block-start:1.5px dashed var(--border);margin-block-start:1.6rem;padding-block-start:1.1rem}h2.svelte-1ii13yv{font-family:var(--font-mono);font-size:var(--fs-xs);letter-spacing:.1em;text-transform:uppercase;color:var(--text-muted);margin:0 0 .2rem;font-weight:500}:lang(ar) h2.svelte-1ii13yv{font-family:var(--font-sans);letter-spacing:0;text-transform:none}p.svelte-1ii13yv{font-size:var(--fs-sm);color:var(--text-muted);max-inline-size:44ch;margin:0 0 .9rem}.ring.svelte-1ii13yv{gap:.55rem;padding-inline-start:1.6rem;display:grid;position:relative}.loop.svelte-1ii13yv{border:2.5px solid var(--text-faint);border-radius:1rem;inline-size:1.15rem;position:absolute;inset-block:-.2rem;inset-inline-start:.1rem}.key.svelte-1ii13yv{text-align:start;border:var(--line) solid var(--edge);background:var(--card);min-block-size:3rem;color:var(--text);font:inherit;cursor:pointer;border-inline-start:7px solid var(--tone);border-radius:999px 6px 6px 999px;align-items:center;gap:.7rem;padding:.55rem .8rem .55rem .5rem;transition:transform .1s,box-shadow .1s;display:flex;position:relative}[dir=rtl] .key.svelte-1ii13yv{border-radius:6px 999px 999px 6px}.key.svelte-1ii13yv:hover{box-shadow:3px 3px 0 var(--edge);transform:translate(-2px,-2px)}.key.svelte-1ii13yv:active{box-shadow:none;transform:none}.key.svelte-1ii13yv:focus-visible{outline:2px solid var(--majorelle);outline-offset:3px}.hole.svelte-1ii13yv{background:var(--bg-page);border:var(--line) solid var(--edge);block-size:.8rem;inline-size:.8rem;box-shadow:inset 1px 1px 0 var(--edge);border-radius:50%;flex:none;margin-inline:-.9rem .05rem}.txt.svelte-1ii13yv{flex:1;min-inline-size:0;display:grid}.txt.svelte-1ii13yv strong:where(.svelte-1ii13yv){font-weight:600;font-size:var(--fs-sm)}.txt.svelte-1ii13yv span:where(.svelte-1ii13yv){font-family:var(--font-mono);color:var(--text-muted);overflow-wrap:anywhere;font-size:.72rem}.teeth.svelte-1ii13yv{inline-size:1.6rem;color:var(--text-faint);flex:none}[dir=rtl] .teeth.svelte-1ii13yv{transform:scaleX(-1)}.f.svelte-1x05zx6{flex-direction:column;gap:1rem;display:flex}.f.svelte-1x05zx6 .btn{min-block-size:2.75rem;inline-size:100%}.banner.svelte-1x05zx6{border:var(--line) solid var(--danger);background:var(--danger-bg,#dc26261a);color:var(--danger);font-size:var(--fs-sm);border-radius:4px;margin:0;padding:.6rem .8rem}