.pin-code-input.svelte-i7upei{position:relative;width:100%;max-width:21rem;min-width:0;margin-inline:auto}.pin-code-input__native.svelte-i7upei{position:absolute;z-index:1;inset:0;width:100%;height:100%;margin:0;padding:0;border:0;border-radius:var(--input-radius, var(--radius-md));background:transparent;color:transparent;-webkit-text-fill-color:transparent;caret-color:transparent;font-size:16px;cursor:text;opacity:.01}.pin-code-input__native.svelte-i7upei:focus{outline:none}.pin-code-input__cells.svelte-i7upei{display:grid;grid-template-columns:repeat(var(--pin-code-length),minmax(0,1fr));gap:clamp(.25rem,2vw,.5rem);width:100%}.pin-code-input__cell.svelte-i7upei{display:grid;width:100%;height:var(--auth-pin-cell-height, clamp(3rem, 14vw, 3.5rem));min-width:0;padding:0;font-size:var(--auth-pin-cell-font-size, 1.25rem);place-items:center}.pin-code-input.svelte-i7upei:focus-within .pin-code-input__cell.is-active:where(.svelte-i7upei){border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-light)}.pin-code-input.is-disabled.svelte-i7upei .pin-code-input__cell:where(.svelte-i7upei){opacity:.5}@media(max-width:420px){.pin-code-input__cell.svelte-i7upei{font-size:var(--auth-pin-cell-font-size, 1.125rem)}}