.code-input{position:relative;display:inline-flex;gap:var(--space-2);direction:ltr;cursor:text}.code-input-cell{display:inline-flex;align-items:center;justify-content:center;width:44px;height:52px;border:1px solid var(--line-strong);border-radius:var(--radius-control);background:var(--surface-1);color:var(--fg);font-family:var(--font-mono);font-size:20px;font-weight:600;font-variant-numeric:tabular-nums;transition:border-color .12s,box-shadow .12s}.code-input-cell:nth-child(4){margin-left:var(--space-2)}.code-input:focus-within .code-input-cell[data-active=true]{border-color:var(--fg-muted);box-shadow:0 0 0 3px var(--ring)}.code-input[data-invalid=true] .code-input-cell{border-color:var(--danger)}.code-input[data-busy=true]{opacity:.5}.code-input-field{position:absolute;inset:0;width:100%;height:100%;padding:0;border:0;opacity:.011;color:transparent;caret-color:transparent;background:transparent;font-size:16px;outline:none}.code-input[data-shake=true]{animation:code-input-shake .2s ease-in-out}@keyframes code-input-shake{25%{transform:translate(4px)}50%{transform:translate(-4px)}75%{transform:translate(4px)}}@media(prefers-reduced-motion:reduce){.code-input[data-shake=true]{animation:none}}@media(min-width:720px){.code-input-cell{width:40px;height:48px;font-size:16px}}.code-input[data-accepted=true] .code-input-cell{border-color:var(--success, var(--fg-muted));color:var(--success, var(--fg));transition:border-color .16s ease-out,color .16s ease-out}.code-input[data-accepted=true] .code-input-cell:nth-child(2){transition-delay:16ms}.code-input[data-accepted=true] .code-input-cell:nth-child(3){transition-delay:32ms}.code-input[data-accepted=true] .code-input-cell:nth-child(4){transition-delay:48ms}.code-input[data-accepted=true] .code-input-cell:nth-child(5){transition-delay:64ms}.code-input[data-accepted=true] .code-input-cell:nth-child(6){transition-delay:80ms}@media(prefers-reduced-motion:reduce){.code-input[data-accepted=true] .code-input-cell{transition:none}}