.otp-stage{justify-content:center;align-items:center;gap:10px;min-height:56px;margin-bottom:40px;display:flex;position:relative}.otp-cell{background-color:var(--border);will-change:transform, opacity, box-shadow;border-radius:14px;flex-shrink:0;width:48px;height:56px;transition:transform .2s cubic-bezier(.34,1.56,.64,1),box-shadow .2s;position:relative;overflow:hidden}.otp-cell:focus-within{background-color:var(--primary);box-shadow:0 8px 24px color-mix(in oklab, var(--primary) 32%, transparent);z-index:10;transform:scale(1.08)}.otp-cell:before{content:"";pointer-events:none;z-index:0;opacity:0;background:0 0;width:300%;height:300%;position:absolute;top:-100%;left:-100%}.is-complete .otp-cell:before{opacity:1;background:conic-gradient(from 0deg, transparent 0%, transparent 55%, color-mix(in oklab, var(--primary) 18%, transparent) 70%, var(--primary) 92%, color-mix(in oklab, var(--primary) 45%, white) 100%);animation:1.25s linear 2 otp-rotate-gradient,.5s ease-in-out 2.5s forwards otp-morph-green}@keyframes otp-rotate-gradient{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes otp-morph-green{0%,32%{background:conic-gradient(from 0deg, var(--primary) 0%, color-mix(in oklab, var(--primary) 60%, white) 50%, var(--primary) 100%)}33%,to{background:conic-gradient(from 0deg, var(--success) 0%, color-mix(in oklab, var(--success) 75%, black) 50%, var(--success) 100%)}}.otp-field{background-color:var(--card);width:calc(100% - 5px);height:calc(100% - 5px);color:var(--foreground);text-align:center;z-index:1;border:none;border-radius:12px;outline:none;font-size:24px;font-weight:600;transition:background-color .4s,color .2s;position:absolute;top:2.5px;left:2.5px}.otp-field-error{color:var(--destructive)}.is-complete .otp-cell:first-child{z-index:4;animation:1.5s 3s infinite alternate otp-glow-green}@keyframes otp-glow-green{0%{box-shadow:0 0 8px color-mix(in oklab, var(--success) 40%, transparent)}to{box-shadow:0 0 24px var(--success)}}.otp-cell:after{content:"";background:linear-gradient(to right, transparent 0%, color-mix(in oklab, var(--card) 70%, transparent) 50%, transparent 100%);z-index:5;pointer-events:none;width:50%;height:100%;position:absolute;top:0;left:-150%;transform:skew(-25deg)}.is-complete .otp-cell:first-child:after{animation:3s cubic-bezier(.4,0,.2,1) 3.5s infinite otp-sweep}@keyframes otp-sweep{0%{left:-150%}25%{left:200%}to{left:200%}}.otp-final-tick{opacity:0;z-index:10;pointer-events:none;width:28px;height:28px;position:absolute;top:50%;left:50%}.otp-shell{position:relative;overflow:hidden}.otp-shell:before{content:"";background:radial-gradient(circle, color-mix(in oklab, var(--success) 22%, transparent) 0%, transparent 60%);opacity:0;z-index:0;pointer-events:none;width:150%;height:150%;transition:opacity 1s ease-in-out 2.5s;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.otp-shell.is-complete:before{opacity:1}