.otp{--otp-green:#16a34a;--otp-red:#dc2626;position:relative;width:100%;max-width:360px;margin:0 auto}:root[data-theme=dark] .otp{--otp-green:#22c55e;--otp-red:#f87171}.otp-input{position:absolute;inset:0;z-index:2;width:100%;height:100%;border:none;outline:none;background:transparent;padding:0;margin:0;color:transparent;caret-color:transparent;font-size:16px;letter-spacing:2em;text-indent:-9999px;cursor:text;-webkit-tap-highlight-color:transparent}.otp-input::selection{background:transparent}.otp-input:disabled{cursor:not-allowed}.otp-boxes{display:grid;grid-template-columns:repeat(6,1fr);grid-gap:8px;gap:8px}.otp-box{height:56px;border-radius:12px;border:1.5px solid var(--border);background:var(--card);display:flex;align-items:center;justify-content:center;font:700 24px/1 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--text);transition:border-color .15s,box-shadow .15s,background .15s,transform .15s}.otp-box.is-filled{border-color:color-mix(in srgb,var(--text) 35%,var(--border))}.otp-box.is-active{border-color:#1faa53;box-shadow:0 0 0 3px rgba(31,170,83,.18)}.otp-box.is-active:after{content:"";width:2px;height:24px;border-radius:1px;background:#1faa53;animation:otp-caret 1s steps(1) infinite}@keyframes otp-caret{50%{opacity:0}}.otp--verifying .otp-box{border-color:#1faa53;background:rgba(31,170,83,.06);animation:otp-wave 1s ease-in-out infinite}.otp--verifying .otp-box:nth-child(2){animation-delay:.08s}.otp--verifying .otp-box:nth-child(3){animation-delay:.16s}.otp--verifying .otp-box:nth-child(4){animation-delay:.24s}.otp--verifying .otp-box:nth-child(5){animation-delay:.32s}.otp--verifying .otp-box:nth-child(6){animation-delay:.4s}@keyframes otp-wave{50%{transform:translateY(-3px)}}.otp--error .otp-boxes{animation:otp-shake .4s}.otp--error .otp-box{border-color:var(--otp-red);color:var(--otp-red);background:rgba(220,38,38,.05)}@keyframes otp-shake{20%,60%{transform:translateX(-6px)}40%,80%{transform:translateX(6px)}}.otp--success .otp-box{border-color:var(--otp-green);color:var(--otp-green);background:rgba(22,163,74,.08)}.otp.is-disabled .otp-box{opacity:.5}@media (max-width:360px){.otp-boxes{gap:6px}.otp-box{height:50px;font-size:22px}}@media (prefers-reduced-motion:reduce){.otp--error .otp-boxes,.otp--verifying .otp-box,.otp-box.is-active:after{animation:none}}.wa-otp{gap:12px}.wa-sentto{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:4px 8px;text-align:center}.wa-edit{border:none;background:none;padding:2px 4px;color:#15803d;font-size:13.5px;font-weight:700;cursor:pointer;font-family:inherit;text-decoration:underline;text-underline-offset:2px}:root[data-theme=dark] .wa-edit{color:#4ade80}.wa-state{min-height:22px;display:flex;justify-content:center;text-align:center;font-size:13.5px;font-weight:600;line-height:1.4}.wa-state-busy{display:inline-flex;align-items:center;gap:8px;color:var(--text2)}.wa-state-busy .spinner{width:16px;height:16px;border-width:2px;border-color:#1faa53 rgba(31,170,83,.25) rgba(31,170,83,.25)}.wa-state-ok{color:#16a34a}:root[data-theme=dark] .wa-state-ok{color:#22c55e}.wa-state-note{color:#15803d}:root[data-theme=dark] .wa-state-note{color:#4ade80}.wa-state-err{color:#dc2626}:root[data-theme=dark] .wa-state-err{color:#f87171}.wa-tools{display:flex;justify-content:center;gap:8px;flex-wrap:wrap}.wa-tool{display:inline-flex;align-items:center;gap:7px;height:40px;padding:0 14px;border-radius:999px;border:1.5px solid var(--border);background:var(--card);color:var(--text);font-size:13.5px;font-weight:700;cursor:pointer;font-family:inherit}.wa-tool:hover{border-color:#1faa53}.wa-tool svg{color:#1faa53}.wa-tip{text-align:center;font-size:12.5px;color:var(--text2);line-height:1.45}.wa-tip b{color:var(--text)}.wa-otp .wa-row{justify-content:center;gap:8px;margin-top:2px}.wa-row-label{font-size:13.5px;color:var(--text2)}.wa-resend-strong{font-weight:800}