.otp-track{--otp-mint:#00ff7f;--otp-pink:#f72585;position:relative;width:100%}.otp-cells{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:.65rem}@media (min-width:640px){.otp-cells{gap:.75rem}}.otp-cell{position:relative;display:flex;aspect-ratio:.78;min-height:3.65rem;align-items:center;justify-content:center;overflow:hidden;border-radius:1.05rem;border:1.5px solid rgba(255,255,255,.12);background:rgba(8,12,18,.55);box-shadow:inset 0 1px 0 rgba(255,255,255,.04);isolation:isolate;transition:border-color .22s ease,background-color .22s ease,box-shadow .22s ease,transform .22s ease}@media (min-width:640px){.otp-cell{min-height:4rem}}.otp-cell__ink{left:-8%;right:-8%;bottom:-12%;height:118%;z-index:0;border-radius:48% 48% 18% 18%/28% 28% 12% 12%;background:radial-gradient(95% 78% at 50% 108%,rgba(0,255,127,.78) 0,rgba(0,210,130,.42) 32%,rgba(247,37,133,.48) 62%,rgba(247,37,133,.12) 82%,transparent 100%),linear-gradient(188deg,rgba(247,37,133,.12),rgba(0,255,127,.38) 48%,rgba(0,170,110,.62));transform:translateY(92%) scale(.86,.4);filter:blur(.2px);transition:transform .52s cubic-bezier(.2,.85,.25,1),opacity .3s ease,border-radius .52s cubic-bezier(.2,.85,.25,1)}.otp-cell__ink,.otp-cell__mist{position:absolute;pointer-events:none;opacity:0}.otp-cell__mist{inset:-10% -15% 5%;z-index:1;background:radial-gradient(ellipse 85% 70% at 50% 72%,rgba(247,37,133,.22) 0,rgba(0,255,127,.16) 40%,transparent 70%);transform:scale(.25);transition:transform .56s cubic-bezier(.18,.9,.28,1),opacity .36s ease}.otp-cell__sheen{position:absolute;inset:-50% -70%;z-index:2;pointer-events:none;opacity:0;background:linear-gradient(118deg,transparent 38%,rgba(255,255,255,.14) 46%,rgba(0,255,127,.28) 52%,rgba(247,37,133,.18) 58%,transparent 66%)}.otp-cell__pip{position:absolute;z-index:2;width:.35rem;height:.35rem;border-radius:999px;background:rgba(255,255,255,.22);box-shadow:0 0 0 3px rgba(247,37,133,.08);transition:opacity .18s ease,transform .18s ease,background .18s ease}.otp-cell__digit{position:relative;z-index:3;font-size:1.4rem;font-weight:700;letter-spacing:.04em;color:#fff;text-shadow:0 1px 8px rgba(0,0,0,.35);transform:translateY(6px) scale(.86);opacity:0;transition:opacity .24s ease,transform .38s cubic-bezier(.2,.9,.28,1),color .18s ease}@media (min-width:640px){.otp-cell__digit{font-size:1.6rem}}.otp-cell--filled{border-color:rgba(0,255,127,.42);background:rgba(0,255,127,.06);box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 0 0 1px rgba(0,255,127,.06)}.otp-cell--filled .otp-cell__ink{transform:translateY(0) scale(1);opacity:1;border-radius:42% 42% 22% 22%/22% 22% 18% 18%}.otp-cell--filled .otp-cell__mist{transform:scale(1);opacity:1}.otp-cell--filled .otp-cell__digit{opacity:1;transform:translateY(0) scale(1)}.otp-cell--active:not(.otp-cell--filled){border-color:rgba(247,37,133,.55);background:rgba(247,37,133,.07);box-shadow:0 0 0 3px rgba(247,37,133,.1)}.otp-cell--active:not(.otp-cell--filled) .otp-cell__pip{background:rgba(247,37,133,.85);box-shadow:0 0 0 4px rgba(247,37,133,.12);animation:otp-pip-breathe 1.15s ease-in-out infinite}.otp-cell--bloom .otp-cell__ink{animation:otp-ink-rise .56s cubic-bezier(.2,.85,.25,1)}.otp-cell--bloom .otp-cell__mist{animation:otp-mist-bloom .56s cubic-bezier(.18,.9,.28,1)}.otp-track--verifying .otp-cell--filled .otp-cell__sheen{opacity:1;animation:otp-ink-sheen 1.25s ease-in-out infinite;animation-delay:calc(var(--otp-i, 0) * 85ms)}.otp-track--verifying .otp-cell--filled .otp-cell__ink{animation:otp-ink-breathe 1.25s ease-in-out infinite;animation-delay:calc(var(--otp-i, 0) * 85ms)}.otp-track--verifying .otp-cell--filled{animation:otp-verify-lift 1.25s ease-in-out infinite;animation-delay:calc(var(--otp-i, 0) * 85ms)}.otp-track--success .otp-cell{border-color:rgba(0,255,127,.62);animation:otp-success-settle .48s cubic-bezier(.2,.9,.28,1) both;animation-delay:calc(var(--otp-i, 0) * 40ms)}.otp-track--success .otp-cell__ink{background:radial-gradient(90% 70% at 50% 100%,rgba(0,255,127,.82) 0,rgba(0,255,127,.35) 55%,transparent 100%),linear-gradient(185deg,rgba(0,255,127,.12),rgba(0,255,127,.48))}.otp-track--success .otp-cell__mist{background:radial-gradient(circle at 50% 55%,rgba(0,255,127,.5) 0,transparent 65%)}.otp-track--success .otp-cell__digit{color:#eafff3}.otp-track--error{animation:otp-error-shake .4s ease}.otp-track--error .otp-cell{border-color:rgba(247,37,133,.65);background:rgba(247,37,133,.08)}.otp-track--error .otp-cell__ink{background:radial-gradient(90% 70% at 50% 100%,rgba(247,37,133,.7) 0,rgba(247,37,133,.28) 58%,transparent 100%),linear-gradient(185deg,rgba(247,37,133,.08),rgba(247,37,133,.4))}.otp-track__input{position:absolute;inset:0;z-index:4;width:100%;height:100%;margin:0;padding:0;border:0;opacity:.01;color:transparent;caret-color:transparent;background:transparent;font-size:1.25rem;letter-spacing:1.6em;outline:none;cursor:text}.otp-track__input:disabled{cursor:not-allowed}.otp-track[data-disabled=true] .otp-cell{opacity:.72}@keyframes otp-ink-rise{0%{transform:translateY(96%) scale(.72,.28);opacity:.4;border-radius:55% 55% 20% 20%/40% 40% 10% 10%;filter:blur(1.5px)}58%{transform:translateY(-3%) scale(1.04);opacity:1;border-radius:40% 40% 24% 24%/20% 20% 20% 20%;filter:blur(0)}to{transform:translateY(0) scale(1);opacity:1;border-radius:42% 42% 22% 22%/22% 22% 18% 18%;filter:blur(0)}}@keyframes otp-mist-bloom{0%{transform:scale(.15);opacity:0}45%{transform:scale(1.15);opacity:.95}to{transform:scale(1);opacity:1}}@keyframes otp-pip-breathe{0%,to{transform:scale(.9);opacity:.55}50%{transform:scale(1.15);opacity:1}}@keyframes otp-ink-sheen{0%{transform:translateX(-40%) skewX(-10deg)}to{transform:translateX(40%) skewX(-10deg)}}@keyframes otp-ink-breathe{0%,to{transform:translateY(0) scale(1)}50%{transform:translateY(-2%) scale(1.02,1.04)}}@keyframes otp-verify-lift{0%,to{transform:translateY(0)}50%{transform:translateY(-2px)}}@keyframes otp-success-settle{0%{transform:scale(1)}35%{transform:scale(1.055)}70%{transform:scale(.98)}to{transform:scale(1)}}@keyframes otp-error-shake{0%,to{transform:translateX(0)}20%{transform:translateX(-5px)}40%{transform:translateX(5px)}60%{transform:translateX(-3px)}80%{transform:translateX(3px)}}@media (prefers-reduced-motion:reduce){.otp-cell,.otp-cell__digit,.otp-cell__ink,.otp-cell__mist,.otp-cell__pip,.otp-track--error{transition:none!important;animation:none!important}.otp-cell--active:not(.otp-cell--filled) .otp-cell__pip,.otp-cell--bloom .otp-cell__ink,.otp-cell--bloom .otp-cell__mist,.otp-track--success .otp-cell,.otp-track--verifying .otp-cell--filled,.otp-track--verifying .otp-cell--filled .otp-cell__ink,.otp-track--verifying .otp-cell--filled .otp-cell__sheen{animation:none!important}.otp-cell--filled .otp-cell__digit,.otp-cell--filled .otp-cell__ink,.otp-cell--filled .otp-cell__mist{transform:none;opacity:1;filter:none}}