.sf{width:100%;max-width:400px;margin:0 auto}.sf-icon{background:linear-gradient(135deg, var(--primary,#6366f1), var(--secondary,#ec4899));color:#fff;border-radius:16px;place-items:center;width:52px;height:52px;margin:0 auto 1.1rem;display:none;box-shadow:0 10px 24px -10px #6366f199}.sf-icon svg{width:26px;height:26px}@media (width<=960px){.sf-icon{display:grid}.sf-head{text-align:center}.sf-steps{justify-content:center}}.sf-head{margin-bottom:1.15rem}.sf-head h1{letter-spacing:-.03em;color:var(--text-primary,#1e293b);margin:0 0 .35rem;font-size:1.75rem;font-weight:800}.sf-head p{color:var(--text-muted,#64748b);margin:0;font-size:.93rem;line-height:1.55}.sf-head strong{color:var(--text-primary,#1e293b);word-break:break-all}.sf-steps{color:var(--text-muted,#64748b);flex-wrap:wrap;gap:6px 12px;margin:0 0 1.6rem;padding:0;font-size:.78rem;font-weight:600;list-style:none;display:flex}.sf-steps li{align-items:center;gap:7px;display:inline-flex}.sf-steps li+li:before{content:"";background:#cbd5e1;width:16px;height:1px;margin-right:5px}.sf-steps span{color:#475569;background:#e2e8f0;border-radius:6px;place-items:center;width:20px;height:20px;font-size:.7rem;font-weight:800;display:inline-grid}.sf-steps .is-done span{color:#15803d;background:#dcfce7}.sf-steps .is-current{color:var(--text-primary,#1e293b)}.sf-steps .is-current span{background:var(--primary,#6366f1);color:#fff}.sf .alert{border-radius:12px;align-items:flex-start;gap:10px;margin-bottom:1.2rem;padding:12px 14px;font-size:.88rem;line-height:1.45;display:none}.sf .alert.show{animation:.25s ease-out sf-in;display:flex}.sf .alert svg{flex-shrink:0;width:20px;height:20px}.sf .error-alert{color:#991b1b;background:#fef2f2;border:1px solid #fecaca}.sf .success-alert{color:#166534;background:#f0fdf4;border:1px solid #bbf7d0}@keyframes sf-in{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}.sf .form-group{margin-bottom:1.1rem}.sf label{color:var(--text-secondary,#475569);margin-bottom:.4rem;font-size:.84rem;font-weight:600;display:block}.sf .input-wrapper{position:relative}.sf .input-icon{z-index:1;color:#94a3b8;pointer-events:none;transition:color .2s;position:absolute;top:50%;left:15px;transform:translateY(-50%)}.sf .input-wrapper:focus-within .input-icon{color:var(--primary,#6366f1)}.sf .input-icon svg{width:19px;height:19px}.sf input[type=email],.sf input[type=password],.sf input[type=text]:not(.otp-input){width:100%;height:48px;color:var(--text-primary,#1e293b);font:inherit;background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:0 16px 0 46px;font-size:.95rem;transition:border-color .2s,box-shadow .2s}.sf .input-wrapper:has(.toggle-password) input{padding-right:50px}.sf input::placeholder{color:#a3aec0}.sf input:hover:not(:focus){border-color:#cbd5e1}.sf input:focus{border-color:var(--primary,#6366f1);outline:none;box-shadow:0 0 0 4px #6366f11f}.sf .toggle-password{color:#94a3b8;cursor:pointer;background:0 0;border:0;border-radius:9px;place-items:center;width:36px;height:36px;transition:color .2s,background .2s;display:grid;position:absolute;top:50%;right:6px;transform:translateY(-50%)}.sf .toggle-password:hover{color:var(--primary,#6366f1);background:#6366f114}.sf .toggle-password svg{width:18px;height:18px}.sf .password-strength{margin-top:.55rem}.sf .strength-bar{background:#e2e8f0;border-radius:999px;height:5px;overflow:hidden}.sf .strength-fill{border-radius:999px;width:0;height:100%;transition:width .3s,background .3s}.sf .strength-fill.weak{background:#ef4444;width:33%}.sf .strength-fill.medium{background:#f59e0b;width:66%}.sf .strength-fill.strong{background:#10b981;width:100%}.sf .strength-text{color:var(--text-muted,#64748b);margin:.35rem 0 0;font-size:.76rem;font-weight:600}.sf .strength-text.weak{color:#dc2626}.sf .strength-text.medium{color:#b45309}.sf .strength-text.strong{color:#047857}.sf .match-indicator{margin:.4rem 0 0;font-size:.78rem;font-weight:600;display:none}.sf .match-indicator.show{display:block}.sf .match-indicator.match{color:#047857}.sf .match-indicator.no-match{color:#dc2626}.sf .otp-container{grid-template-columns:repeat(8,minmax(0,1fr));gap:6px;margin-bottom:1.1rem;display:grid}.sf .otp-input{width:100%;min-width:0;height:54px;color:var(--text-primary,#1e293b);font:inherit;text-align:center;font-variant-numeric:tabular-nums;background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:0;font-size:1.35rem;font-weight:800;transition:border-color .2s,box-shadow .2s,background .2s}.sf .otp-input:focus{border-color:var(--primary,#6366f1);outline:none;box-shadow:0 0 0 4px #6366f11f}.sf .otp-input:not(:placeholder-shown),.sf .otp-input:valid{border-color:color-mix(in srgb, var(--primary,#6366f1) 45%, #e2e8f0);background:color-mix(in srgb, var(--primary,#6366f1) 5%, #fff)}.sf .otp-group-gap{margin-left:6px}.sf .submit-btn{background:var(--primary,#6366f1);color:#fff;width:100%;height:48px;font:inherit;cursor:pointer;border:0;border-radius:12px;place-items:center;margin-top:.3rem;font-size:.98rem;font-weight:700;transition:transform .15s,background .2s;display:grid;box-shadow:0 8px 20px -6px #6366f18c}.sf .submit-btn:hover:not(:disabled){background:#4f46e5;transform:translateY(-1px)}.sf .submit-btn:disabled{opacity:.7;cursor:not-allowed;box-shadow:none}.sf .btn-content{justify-content:center;align-items:center;gap:8px;display:flex}.sf .btn-content svg{width:18px;height:18px}.sf .spinner{border:3px solid #ffffff4d;border-top-color:#fff;border-radius:50%;width:20px;height:20px;animation:.8s linear infinite sf-spin;display:none}.sf .submit-btn.loading .spinner{display:block}.sf .submit-btn.loading .btn-content{display:none}@keyframes sf-spin{to{transform:rotate(360deg)}}.sf-note{color:var(--text-muted,#64748b);background:#f8fafc;border:1px solid #e2e8f0;border-radius:12px;gap:10px;margin:1.1rem 0 0;padding:12px 14px;font-size:.8rem;line-height:1.5;display:flex}.sf-note svg{width:17px;height:17px;color:var(--primary,#6366f1);flex:none;margin-top:1px}.sf-note b{color:var(--text-primary,#1e293b)}.sf-divider{color:var(--text-muted,#64748b);align-items:center;gap:12px;margin:1.6rem 0 1rem;font-size:.8rem;display:flex}.sf-divider:before,.sf-divider:after{content:"";background:#e2e8f0;flex:1;height:1px}.sf-secondary{height:44px;color:var(--text-primary,#1e293b);background:#fff;border:1px solid #e2e8f0;border-radius:12px;place-items:center;font-size:.9rem;font-weight:600;text-decoration:none;transition:border-color .2s,color .2s;display:grid}.sf-secondary:hover{border-color:var(--primary,#6366f1);color:var(--primary,#6366f1)}.sf .toggle-password:focus-visible,.sf .submit-btn:focus-visible,.sf-secondary:focus-visible,.sf a:focus-visible,.sf .trust-device:focus-within{outline:2px solid var(--primary,#6366f1);outline-offset:2px}@media (width<=640px){.sf-head h1{font-size:1.5rem}.sf input[type=email],.sf input[type=password],.sf input[type=text]:not(.otp-input){font-size:16px}.sf .otp-container{gap:4px}.sf .otp-input{border-radius:10px;height:48px;font-size:1.15rem}.sf .otp-group-gap{margin-left:3px}}@media (prefers-reduced-motion:reduce){.sf .alert.show{animation:none}}