.otp-row{--otp-accent: #5a4fdc;--otp-surface: #ffffff;--otp-border: #d8d5ef;--otp-ink: #1e293b;--otp-danger: #e11d48;--otp-size: clamp(52px, 15vw, 62px);--otp-gap: clamp(6px, 2.5vw, 9px);--otp-radius: 16px;--otp-font-size: 1.5rem;--otp-ease: cubic-bezier(.22, 1, .36, 1);position:relative;display:flex;gap:var(--otp-gap);justify-content:center;width:100%}.otp-cell{--otp-shift: calc((var(--otp-center) - var(--otp-i)) * (100% + var(--otp-gap)));position:relative;box-sizing:border-box;flex:1 1 0;min-width:0;max-width:60px;height:var(--otp-size);border:1.5px solid var(--otp-border);border-radius:var(--otp-radius);background:var(--otp-surface);transition:border-color .13s var(--otp-ease),box-shadow .13s var(--otp-ease),transform .13s var(--otp-ease)}.otp-cell[data-filled]{border-color:color-mix(in srgb,var(--otp-accent) 42%,var(--otp-border))}.otp-cell:focus-within{border-color:var(--otp-accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--otp-accent) 18%,transparent);transform:scale(1.06)}.otp-input{box-sizing:border-box;width:100%;height:100%;padding:0;border:none;border-radius:inherit;background:transparent;text-align:center;font-family:inherit;font-size:var(--otp-font-size);font-weight:800;color:var(--otp-ink);outline:none;box-shadow:none;transition:opacity .2s var(--otp-ease)}.otp-input:focus{border:none;outline:none;box-shadow:none;--tw-ring-shadow: 0 0 #0000}.otp-input[data-filled]{animation:otp-digit-in .24s var(--otp-ease)}@keyframes otp-digit-in{0%{opacity:0;transform:translateY(.2em) scale(.5)}60%{opacity:1;transform:translateY(0) scale(1.16)}to{opacity:1;transform:none}}.otp-row[data-error] .otp-cell{border-color:var(--otp-danger)}.otp-row[data-shake] .otp-cell{animation:otp-shake .4s var(--otp-ease)}@keyframes otp-shake{0%,to{transform:translate(0)}20%{transform:translate(-.3rem)}40%{transform:translate(.26rem)}60%{transform:translate(-.16rem)}80%{transform:translate(.08rem)}}.otp-row[data-phase=verifying] .otp-cell,.otp-row[data-phase=success] .otp-cell{border-color:var(--otp-accent)}.otp-row[data-phase=verifying] .otp-cell{animation:otp-charge 1s var(--otp-ease) infinite;animation-delay:calc(var(--otp-i) * 90ms)}@keyframes otp-charge{0%,to{box-shadow:0 0 0 0 color-mix(in srgb,var(--otp-accent) 0%,transparent)}45%{box-shadow:0 0 .85rem .05rem color-mix(in srgb,var(--otp-accent) 52%,transparent)}}.otp-row[data-phase=success] .otp-cell{animation:otp-merge .56s cubic-bezier(.62,0,.3,1) forwards}.otp-row[data-phase=success] .otp-input{opacity:0}@keyframes otp-merge{0%{transform:translate(0) scale(1);box-shadow:0 0 0 0 color-mix(in srgb,var(--otp-accent) 0%,transparent);opacity:1}30%{transform:translate(0) scale(1.08);box-shadow:0 0 1.15rem .12rem color-mix(in srgb,var(--otp-accent) 62%,transparent);opacity:1}72%{box-shadow:0 0 1.5rem .18rem color-mix(in srgb,var(--otp-accent) 54%,transparent);opacity:.9}to{transform:translate(var(--otp-shift)) scale(.9);box-shadow:0 0 1.6rem .2rem color-mix(in srgb,var(--otp-accent) 26%,transparent);opacity:0}}.otp-badge{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;box-sizing:border-box;width:var(--otp-size);height:var(--otp-size);margin:auto;border:1.5px solid var(--otp-accent);border-radius:calc(var(--otp-radius) + 2px);background:color-mix(in srgb,var(--otp-accent) 12%,var(--otp-surface));color:var(--otp-accent);animation:otp-badge-in .54s cubic-bezier(.2,.9,.25,1) .32s both}@keyframes otp-badge-in{0%{opacity:0;transform:scale(.5);box-shadow:0 0 0 0 color-mix(in srgb,var(--otp-accent) 45%,transparent)}55%{opacity:1;transform:scale(1.13);box-shadow:0 0 1.7rem .25rem color-mix(in srgb,var(--otp-accent) 45%,transparent)}to{opacity:1;transform:scale(1);box-shadow:0 0 1rem 0 color-mix(in srgb,var(--otp-accent) 26%,transparent)}}.otp-badge path{stroke-dasharray:24;stroke-dashoffset:24;animation:otp-check-draw .36s var(--otp-ease) .62s forwards}@keyframes otp-check-draw{to{stroke-dashoffset:0}}.otp-chrome{transition:opacity .2s var(--otp-ease, cubic-bezier(.22, 1, .36, 1)),transform .2s var(--otp-ease, cubic-bezier(.22, 1, .36, 1))}.otp-chrome[data-hidden]{opacity:0;transform:translateY(.4rem);pointer-events:none}.auth-otp-heading{position:relative}.auth-otp-heading .otp-outcome{position:absolute;top:0;right:0;bottom:0;left:0}.otp-outcome{animation:otp-outcome-in .3s var(--otp-ease, cubic-bezier(.22, 1, .36, 1)) .42s both}@keyframes otp-outcome-in{0%{opacity:0;transform:translateY(.45rem)}to{opacity:1;transform:none}}@media (prefers-reduced-motion: reduce){.otp-cell,.otp-input,.otp-badge,.otp-badge path,.otp-chrome,.otp-outcome{transition:none!important;animation:none!important}.otp-cell:focus-within{transform:none}.otp-badge path{stroke-dashoffset:0}.otp-row[data-phase=success] .otp-cell{opacity:0}}