.otp-field{max-width:360px;margin-bottom:20px;display:block}.otp-field--wide{max-width:none}.otp-label{margin-bottom:8px;font-size:13px;font-weight:650;display:block}.otp-control{position:relative}.otp-boxes{grid-template-columns:repeat(var(--otp-length,6), minmax(0, 1fr));gap:8px;display:none}[data-otp-ready] .otp-boxes{display:grid}.otp-box{min-height:56px;color:var(--ink,#102d4a);font-variant-numeric:tabular-nums;background:#fff;border:1px solid #94a7b1;border-radius:8px;place-items:center;font-size:24px;font-weight:600;transition:border-color .14s,box-shadow .14s;display:grid}[data-otp-ready] .otp-input{color:#0000;caret-color:#0000;opacity:0;cursor:text;background:0 0;border:0;border-radius:8px;width:100%;height:100%;margin:0;padding:0;position:absolute;inset:0}.otp-field:focus-within .otp-box[data-active]{border-color:var(--teal,#007f7d);box-shadow:0 0 0 3px #007f7d24}.otp-field:focus-within .otp-box[data-active]:not([data-filled]):after{content:"";background:var(--teal,#007f7d);width:2px;height:26px;animation:1.1s step-end infinite otp-caret}.otp-field.is-invalid .otp-box,.otp-field.is-invalid .otp-input{border-color:#bd4242}.otp-field.is-invalid .otp-box{background:#fff6f4}.otp-field:not([data-otp-ready]) .otp-input{text-align:center;font-variant-numeric:tabular-nums;letter-spacing:.35em;width:100%;max-width:320px;min-height:56px;font-size:24px}.otp-hint{color:var(--muted,#5b6d7b);margin-top:7px;font-size:12px;line-height:1.5;display:block}.otp-error{color:#a12622;margin:7px 0 0;font-size:12px;line-height:1.5}@keyframes otp-caret{0%,49%{opacity:1}50%,to{opacity:0}}@media (width<=420px){.otp-boxes{gap:6px}.otp-box{min-height:52px;font-size:22px}.otp-field:focus-within .otp-box[data-active]:not([data-filled]):after{height:22px}}@media (prefers-reduced-motion:reduce){.otp-box{transition:none}.otp-field:focus-within .otp-box[data-active]:not([data-filled]):after{animation:none}}