.code-boxes.svelte-14ft4va{position:relative;width:100%;max-width:calc(var(--code-length) * 52px + (var(--code-length) - 1) * 8px)}input.svelte-14ft4va{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;width:100%;height:100%;padding:0;border:0;outline:0;background:transparent;color:transparent;caret-color:transparent;font-size:16px;cursor:text}input.svelte-14ft4va::selection{background:transparent;color:transparent}.code-cells.svelte-14ft4va{display:grid;grid-template-columns:repeat(var(--code-length),minmax(0,1fr));gap:8px}.code-cell.svelte-14ft4va{display:flex;align-items:center;justify-content:center;min-width:0;height:52px;border:1px solid var(--border);border-radius:8px;background:var(--background, transparent);color:var(--foreground, inherit);font-size:22px;font-weight:600;font-variant-numeric:tabular-nums;transition:border-color .15s ease,box-shadow .15s ease,transform .15s ease}.code-cell.filled.svelte-14ft4va{border-color:var(--primary);transform:scale(1.03)}input.svelte-14ft4va:focus-visible+.code-cells:where(.svelte-14ft4va) .code-cell.next:where(.svelte-14ft4va){border-color:var(--primary);box-shadow:0 0 0 3px color-mix(in oklch,var(--primary) 20%,transparent)}.invalid.svelte-14ft4va .code-cell:where(.svelte-14ft4va){border-color:var(--danger, oklch(55% .2 27))}@media(prefers-reduced-motion:reduce){.code-cell.svelte-14ft4va{transition:border-color .15s ease,box-shadow .15s ease}.code-cell.filled.svelte-14ft4va{transform:none}}