.fde-otp{width:100%;max-width:384px;position:relative}.fde-otp-native{z-index:1;color:#0000;caret-color:#0000;-webkit-text-fill-color:transparent;cursor:text;background:0 0;border:0;outline:none;width:100%;height:100%;padding:0;font-size:16px;position:absolute;inset:0}.fde-otp-native::selection{color:#0000;background:0 0}.fde-otp-slots{pointer-events:none;grid-template-columns:repeat(6,minmax(0,1fr));gap:clamp(6px,2vw,10px);display:grid}.fde-otp-slot{border:1px solid var(--fde-line);background:var(--fde-bg-raise);min-width:0;height:clamp(52px,14vw,64px);color:var(--fde-fg);font-variant-numeric:tabular-nums;border-radius:10px;justify-content:center;align-items:center;font-size:clamp(24px,6vw,30px);font-weight:500;transition:border-color .16s ease-out,background-color .16s ease-out,box-shadow .16s ease-out;display:flex}.fde-otp-slot[data-active=true]{border-color:var(--fde-fg);box-shadow:0 0 0 3px color-mix(in srgb, var(--fde-fg) 12%, transparent)}.fde-otp-slot[data-selected=true]{background:color-mix(in srgb, var(--fde-fg) 12%, var(--fde-bg-raise))}.fde-otp[data-invalid=true] .fde-otp-slot{border-color:var(--fde-accent)}.fde-otp[data-busy=true] .fde-otp-slot{color:var(--fde-fg-soft)}.fde-otp-dot{background:var(--fde-line);border-radius:50%;width:4px;height:4px}.fde-otp-caret{background:var(--fde-fg);width:2px;height:26px;animation:1s step-end infinite fde-otp-blink}.fde-otp-resend{min-height:44px;color:var(--fde-fg-soft);cursor:pointer;border-radius:6px;align-items:center;gap:6px;padding-inline:8px;font-size:12px;transition:color .16s ease-out,background-color .16s ease-out;display:inline-flex}.fde-otp-resend:hover:not(:disabled){color:var(--fde-fg);background:var(--fde-bg-raise)}.fde-otp-resend:focus-visible{outline:2px solid var(--fde-fg);outline-offset:2px}.fde-otp-resend:disabled{color:var(--fde-mute);cursor:default}@keyframes fde-otp-blink{50%{opacity:0}}@media (prefers-reduced-motion:reduce){.fde-otp-slot,.fde-otp-resend{transition:none}.fde-otp-caret{animation:none}}@media (forced-colors:active){.fde-otp-slot[data-active=true]{outline:2px solid highlight}.fde-otp-caret{background:canvastext}}