/* Auth: animated backdrop, glass card, tabs, forms, success overlay + Forgot-password */
#auth-modal-wrapper { position:fixed; top:0; left:0; width:100%; height:100%; z-index:6000; display:flex; flex-direction:column; justify-content:center; align-items:center; padding:25px; overflow:hidden;
  background:radial-gradient(900px 520px at 15% 10%,rgba(79,70,229,.55),transparent 60%), radial-gradient(800px 520px at 90% 95%,rgba(244,63,94,.45),transparent 60%), #0b1020;
  opacity:0; pointer-events:none; visibility:hidden; transition:opacity .4s ease, visibility .4s; backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); }
#auth-modal-wrapper.active { opacity:1; pointer-events:all; visibility:visible; }

/* floating orbs */
.auth-orb { position:absolute; border-radius:50%; filter:blur(58px); opacity:.5; pointer-events:none; animation: auth-orb 14s ease-in-out infinite; }
.auth-orb.orb1 { width:260px; height:260px; background:#6366f1; top:8%; left:-70px; }
.auth-orb.orb2 { width:220px; height:220px; background:#f43f5e; bottom:6%; right:-50px; animation-duration:17s; animation-direction:reverse; }
.auth-orb.orb3 { width:160px; height:160px; background:#22d3ee; top:48%; left:55%; opacity:.28; animation-duration:20s; }
#auth-modal-wrapper:not(.active) .auth-orb { animation-play-state:paused; }
@keyframes auth-orb { 0%,100%{transform:translate(0,0) scale(1)} 33%{transform:translate(40px,-30px) scale(1.12)} 66%{transform:translate(-30px,35px) scale(.92)} }

/* card */
.auth-card { position:relative; width:100%; max-width:400px; padding:32px 26px 26px; border-radius:28px; text-align:center; overflow:hidden;
  background:rgba(255,255,255,.96); box-shadow:0 30px 70px rgba(0,0,0,.45), 0 0 0 1px rgba(255,255,255,.5) inset;
  transform:translateY(70px) scale(.92); opacity:0; transition:transform .65s cubic-bezier(.34,1.56,.64,1), opacity .4s ease; }
#auth-modal-wrapper.active .auth-card { transform:none; opacity:1; }
.auth-card::before { content:''; position:absolute; top:0; left:0; right:0; height:4px; background:linear-gradient(90deg,var(--primary),var(--accent),var(--primary)); background-size:200% 100%; animation: auth-bar 3s linear infinite; }
@keyframes auth-bar { to{ background-position:-200% 0 } }
.auth-card.shake { animation: fx-shake .45s ease; }

/* staggered entrance of card content */
#auth-modal-wrapper.active .auth-card > .app-logo-icon { animation: fx-pop .7s cubic-bezier(.34,1.56,.64,1) .12s backwards; }
#auth-modal-wrapper.active .auth-card > .app-title     { animation: fx-fade-up .55s cubic-bezier(.22,1,.36,1) .2s backwards; }
#auth-modal-wrapper.active .auth-card > .auth-sub      { animation: fx-fade-up .55s cubic-bezier(.22,1,.36,1) .26s backwards; }
#auth-modal-wrapper.active .auth-card > .auth-tabs     { animation: fx-fade-up .55s cubic-bezier(.22,1,.36,1) .32s backwards; }
#auth-modal-wrapper.active .auth-card > .auth-forms    { animation: fx-fade-up .55s cubic-bezier(.22,1,.36,1) .38s backwards; }

.app-logo-icon { position:relative; width:72px; height:72px; background:linear-gradient(135deg,var(--primary),var(--accent)); color:#fff; border-radius:22px; display:inline-flex; align-items:center; justify-content:center; font-size:2rem; margin-bottom:14px; box-shadow:0 14px 30px rgba(79,70,229,.4); }
.app-logo-icon > i { animation: fx-float 3s ease-in-out infinite; }
.logo-ring { position:absolute; inset:-6px; border-radius:28px; border:2px solid var(--primary); opacity:0; animation: auth-ring 2.4s ease-out infinite; pointer-events:none; }
@keyframes auth-ring { 0%{transform:scale(.92); opacity:.55} 100%{transform:scale(1.25); opacity:0} }
.app-title { font-size:1.8rem; font-weight:900; margin-bottom:4px; background:linear-gradient(90deg,var(--primary),var(--accent),var(--primary)); background-size:200% auto; -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; animation: auth-text 5s linear infinite; }
@keyframes auth-text { to{ background-position:200% center } }
.auth-sub { color:var(--text-muted); margin:0 0 18px; font-size:.92rem; transition:opacity .16s, transform .16s; }
.auth-sub.swap { opacity:0; transform:translateY(-6px); }
.auth-close { position:absolute; top:16px; right:16px; width:34px; height:34px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:1.2rem; color:var(--text-muted); cursor:pointer; background:var(--bg-input); z-index:3; transition:transform .3s cubic-bezier(.34,1.56,.64,1), background .2s; }
.auth-close:hover { transform:rotate(90deg); }
.auth-close:active { transform:scale(.88) rotate(90deg); }

/* login / sign-up tabs with sliding pill */
.auth-tabs { position:relative; display:grid; grid-template-columns:1fr 1fr; background:var(--bg-input); border-radius:15px; padding:4px; margin:0 0 20px; }
.auth-tab-pill { position:absolute; top:4px; bottom:4px; left:4px; width:calc(50% - 4px); border-radius:12px; background:#fff; box-shadow:0 5px 14px rgba(79,70,229,.22); transition:transform .5s cubic-bezier(.34,1.56,.64,1); }
.auth-tabs[data-active="register"] .auth-tab-pill { transform:translateX(100%); }
.auth-tab { position:relative; z-index:1; background:none; border:0; padding:11px 8px; font:inherit; font-weight:700; font-size:.92rem; color:var(--text-muted); cursor:pointer; transition:color .3s; }
.auth-tab.active { color:var(--primary); }

/* forms + slide switch */
.auth-forms { position:relative; transition:height .45s cubic-bezier(.22,1,.36,1); }
.auth-forms.animating { overflow:hidden; }
.auth-form .input-group { margin-bottom:14px; text-align:left; }
.auth-form .input-group > i { z-index:2; transition:color .25s, transform .35s cubic-bezier(.34,1.56,.64,1); }
.auth-form .input-group:focus-within > i { color:var(--primary); transform:translateY(-50%) scale(1.2); }
.auth-form .input-box { transition:border-color .25s, box-shadow .25s, background .25s, transform .25s; }
.auth-form .input-box:focus { transform:translateY(-1px); }
.auth-form .input-box.invalid { border-color:var(--danger) !important; background:#fef2f2; animation: fx-shake .38s ease; }
.auth-out    { animation: auth-out .17s ease forwards; }
.auth-in-r   { animation: auth-in-r .46s cubic-bezier(.22,1,.36,1) backwards; }
.auth-in-l   { animation: auth-in-l .46s cubic-bezier(.22,1,.36,1) backwards; }
@keyframes auth-out  { to{ opacity:0; transform:scale(.97) translateY(4px) } }
@keyframes auth-in-r { from{ opacity:0; transform:translateX(34px) } to{ opacity:1; transform:none } }
@keyframes auth-in-l { from{ opacity:0; transform:translateX(-34px) } to{ opacity:1; transform:none } }
.auth-form.auth-in-r .input-group, .auth-form.auth-in-l .input-group { animation: fx-fade-up .5s cubic-bezier(.22,1,.36,1) backwards; }
.auth-form.auth-in-r .input-group:nth-child(2), .auth-form.auth-in-l .input-group:nth-child(2) { animation-delay:.05s; }
.auth-form.auth-in-r .input-group:nth-child(3) { animation-delay:.10s; }
.auth-form.auth-in-r .input-group:nth-child(4) { animation-delay:.15s; }

/* password eye */
.input-group.has-eye .input-box { padding-right:46px !important; }
.input-group .pw-eye { position:absolute; right:7px; top:50%; transform:translateY(-50%); width:36px; height:36px; border-radius:50%; border:0; background:none; color:var(--text-muted); cursor:pointer; display:flex; align-items:center; justify-content:center; z-index:3; }
.input-group .pw-eye i { position:static; transform:none; font-size:1rem; color:inherit; }
.auth-form .input-group:focus-within .pw-eye i { transform:none; color:inherit; }
.pw-eye.pop i { animation: fx-pop .35s cubic-bezier(.34,1.56,.64,1); }

/* password strength */
.pw-meter { height:5px; border-radius:5px; background:var(--border); overflow:hidden; margin:-4px 0 4px; }
.pw-meter span { display:block; height:100%; width:0; border-radius:5px; transition:width .45s cubic-bezier(.22,1,.36,1), background .3s; }
.pw-lbl { font-size:.72rem; font-weight:700; text-align:left; min-height:16px; margin-bottom:8px; transition:color .3s; }

/* button states */
.auth-form .btn-main.loading { pointer-events:none; opacity:.92; }
.auth-form .btn-main.loading::after { display:none; }

/* success overlay */
.auth-done { position:absolute; inset:0; z-index:6; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; color:#fff;
  background:linear-gradient(160deg,#10b981,#059669); opacity:0; pointer-events:none; clip-path:circle(0% at 50% 62%); transition:clip-path .7s cubic-bezier(.22,1,.36,1), opacity .2s; }
.auth-card.is-done .auth-done { opacity:1; pointer-events:all; clip-path:circle(150% at 50% 62%); }
.auth-done svg { width:96px; height:96px; filter:drop-shadow(0 8px 16px rgba(0,0,0,.18)); }
.ad-circle { stroke-dasharray:170; stroke-dashoffset:170; }
.ad-check  { stroke-dasharray:50;  stroke-dashoffset:50; }
.auth-card.is-done .ad-circle { animation: auth-draw .6s ease .15s forwards; }
.auth-card.is-done .ad-check  { animation: auth-draw .4s ease .62s forwards; }
.auth-card.is-done .auth-done h3, .auth-card.is-done .auth-done p { animation: fx-fade-up .5s cubic-bezier(.22,1,.36,1) .7s backwards; }
.auth-done h3 { font-size:1.5rem; font-weight:800; margin:6px 0 0; }
.auth-done p { opacity:.9; margin:0; font-size:.95rem; }
@keyframes auth-draw { to{ stroke-dashoffset:0 } }

/* dark */
body.dark .auth-tab-pill { background:#475569; box-shadow:0 5px 14px rgba(0,0,0,.35); }
body.dark .auth-tab.active { color:#c7d2fe; }
body.dark .auth-card { background:rgba(30,41,59,.97); }
body.dark .auth-form .input-box.invalid { background:#3f1d24; }

/* Google login */
.auth-or { display:flex; align-items:center; gap:10px; margin:14px 0 12px; color:var(--text-muted); font-size:.72rem; font-weight:700; letter-spacing:1px; }
.auth-or::before, .auth-or::after { content:''; flex:1; height:1px; background:var(--border); }
.btn-google { width:100%; padding:12px; display:flex; align-items:center; justify-content:center; gap:10px; background:#fff; color:#3c4043; border:1px solid #dadce0; border-radius:12px; font-weight:600; font-size:.95rem; cursor:pointer; transition:transform .15s, box-shadow .2s; }
.btn-google:active { transform:scale(.97); }
.btn-google:disabled { opacity:.6; pointer-events:none; }

/* Email verification screen */
.auth-verify { position:absolute; inset:0; z-index:7; background:var(--bg-card); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; padding:28px 24px; text-align:center;
  transform:translateX(105%); transition:transform .55s cubic-bezier(.22,1,.36,1); pointer-events:none; }
.auth-card.is-verify .auth-verify { transform:none; pointer-events:all; }
.auth-card.is-verify .auth-verify > * { animation:fx-fade-up .5s cubic-bezier(.22,1,.36,1) .25s backwards; }
.av-ico { position:relative; width:84px; height:84px; border-radius:26px; display:flex; align-items:center; justify-content:center; font-size:2.2rem; color:#fff; background:linear-gradient(135deg,var(--primary),var(--accent)); box-shadow:0 12px 26px rgba(79,70,229,.35); transition:background .4s; }
.av-ico i { animation:fx-float 2.6s ease-in-out infinite; }
.av-ring { position:absolute; inset:-7px; border-radius:32px; border:2px solid var(--primary); opacity:0; animation:auth-ring 2.2s ease-out infinite; }
.auth-verify h3 { font-size:1.45rem; font-weight:800; margin:6px 0 0; color:var(--text-main); }
.av-text { color:var(--text-muted); font-size:.92rem; line-height:1.5; margin:0; max-width:310px; }
.av-text b { color:var(--text-main); word-break:break-all; }
.av-timer { width:100%; max-width:300px; }
.av-bar { height:8px; border-radius:10px; background:var(--bg-input); overflow:hidden; }
.av-bar span { display:block; height:100%; width:100%; border-radius:10px; background:linear-gradient(90deg,var(--primary),var(--accent)); transition:width 1s linear, background .3s; }
.av-time { margin-top:8px; font-size:.8rem; font-weight:700; color:var(--text-muted); font-variant-numeric:tabular-nums; }
.av-time.low { color:var(--danger); animation:fx-pulse-dot 1s ease-in-out infinite; }
.av-mail { display:inline-flex; align-items:center; gap:8px; padding:9px 18px; border-radius:30px; background:var(--bg-input); color:var(--text-main); font-weight:700; font-size:.85rem; text-decoration:none; transition:transform .2s; }
.av-mail:active { transform:scale(.95); }
#av-btn { margin-top:4px; }
.auth-verify[data-vs="wait"] #av-btn { background:var(--bg-input); color:var(--text-muted); box-shadow:none; }
.auth-verify[data-vs="wait"] #av-btn::after { display:none; }
.auth-verify[data-vs="ok"] .av-ico { background:linear-gradient(135deg,#10b981,#059669); box-shadow:0 12px 26px rgba(16,185,129,.35); }
.auth-verify[data-vs="ok"] .av-ring { border-color:#10b981; }
.auth-verify[data-vs="expired"] .av-ico { background:linear-gradient(135deg,#ef4444,#b91c1c); box-shadow:0 12px 26px rgba(239,68,68,.35); }
.auth-verify[data-vs="expired"] .av-ring { border-color:#ef4444; }
.auth-verify:not([data-vs="wait"]) .av-timer, .auth-verify:not([data-vs="wait"]) .av-mail { display:none; }

.spam-tip { display:flex; gap:8px; align-items:flex-start; text-align:left; margin-top:12px; padding:9px 12px; border-radius:12px; background:#fffbeb; border:1px solid #fde68a; color:#92400e; font-size:.78rem; line-height:1.4; }
.spam-tip i { margin-top:2px; }
body.dark .spam-tip { background:rgba(245,158,11,.14); border-color:rgba(251,191,36,.35); color:#fde68a; }

/* ===== Forgot / Reset password (fp-*) ===== */
#fp-wrapper { position:fixed; inset:0; z-index:6500; display:flex; justify-content:center; align-items:center; padding:22px; overflow-y:auto; overflow-x:hidden;
  background:radial-gradient(900px 520px at 15% 10%,rgba(79,70,229,.55),transparent 60%), radial-gradient(800px 520px at 90% 95%,rgba(244,63,94,.45),transparent 60%), #0b1020;
  opacity:0; visibility:hidden; pointer-events:none; transition:opacity .4s ease, visibility .4s; }
#fp-wrapper.active { opacity:1; visibility:visible; pointer-events:all; }
#fp-wrapper:not(.active) .auth-orb { animation-play-state:paused; }
.fp-box { position:relative; width:100%; max-width:400px; margin:auto; border-radius:28px; background:rgba(255,255,255,.97); box-shadow:0 30px 70px rgba(0,0,0,.45); overflow:hidden;
  transform:translateY(60px) scale(.94); opacity:0; transition:transform .65s cubic-bezier(.34,1.56,.64,1), opacity .4s; }
#fp-wrapper.active .fp-box { transform:none; opacity:1; }
.fp-box::before { content:''; position:absolute; top:0; left:0; right:0; height:4px; background:linear-gradient(90deg,var(--primary),var(--accent),var(--primary)); background-size:200% 100%; animation:auth-bar 3s linear infinite; }
.fp-box.shake { animation:fx-shake .45s ease; }
.fp-x { position:absolute; top:14px; right:14px; z-index:3; width:34px; height:34px; border-radius:50%; border:0; background:var(--bg-input); color:var(--text-muted); cursor:pointer; display:flex; align-items:center; justify-content:center; transition:transform .3s cubic-bezier(.34,1.56,.64,1); }
.fp-x:hover { transform:rotate(90deg); } .fp-x:active { transform:scale(.88) rotate(90deg); }
.fp-steps { position:relative; transition:height .45s cubic-bezier(.22,1,.36,1); overflow:hidden; }
.fp-step { padding:34px 24px 24px; text-align:center; }
.fp-step.hidden { display:none; }
.fp-step.fp-in { animation:fp-step-in .5s cubic-bezier(.22,1,.36,1) backwards; }
.fp-step.fp-in > * { animation:fx-fade-up .5s cubic-bezier(.22,1,.36,1) backwards; }
.fp-step.fp-in > *:nth-child(2) { animation-delay:.05s; } .fp-step.fp-in > *:nth-child(3) { animation-delay:.1s; } .fp-step.fp-in > *:nth-child(4) { animation-delay:.15s; }
.fp-step.fp-in > *:nth-child(5) { animation-delay:.2s; } .fp-step.fp-in > *:nth-child(n+6) { animation-delay:.25s; }
@keyframes fp-step-in { from{opacity:0; transform:translateX(30px)} to{opacity:1; transform:none} }
.fp-step h2 { margin:0 0 6px; font-size:1.45rem; font-weight:900; color:var(--text-main); }
.fp-sub { margin:0 0 18px; color:var(--text-muted); font-size:.9rem; line-height:1.55; }
.fp-mail { color:var(--primary); word-break:break-all; font-size:.95rem; }

.fp-ico { position:relative; width:84px; height:84px; margin:0 auto 16px; border-radius:26px; display:flex; align-items:center; justify-content:center; font-size:2.1rem; color:#fff; background:linear-gradient(135deg,var(--primary),var(--accent)); box-shadow:0 14px 30px rgba(79,70,229,.38); }
.fp-ico > i { animation:fx-float 2.6s ease-in-out infinite; }
.fp-ico.shield { background:linear-gradient(135deg,#4f46e5,#06b6d4); box-shadow:0 14px 30px rgba(6,182,212,.35); }
.fp-ico.bad { background:linear-gradient(135deg,#ef4444,#b91c1c); box-shadow:0 14px 30px rgba(239,68,68,.35); }
.fp-ico.sent { background:linear-gradient(135deg,#10b981,#4f46e5); box-shadow:0 14px 30px rgba(16,185,129,.35); }
.fp-ring { position:absolute; inset:-7px; border-radius:32px; border:2px solid var(--primary); opacity:0; animation:auth-ring 2.2s ease-out infinite; pointer-events:none; }
.fp-ring.r2 { animation-delay:1.1s; }
.fp-ico.sent .fp-ring { border-color:#10b981; } .fp-ico.bad .fp-ring { border-color:#ef4444; }
.fp-plane { position:absolute; top:-6px; right:-8px; width:30px; height:30px; border-radius:50%; background:#fff; color:var(--primary); font-size:.8rem; display:flex; align-items:center; justify-content:center; box-shadow:0 6px 14px rgba(0,0,0,.22); animation:fp-fly 2.8s ease-in-out infinite; }
.fp-plane i { animation:none !important; }
@keyframes fp-fly { 0%,100%{transform:translate(0,0) rotate(0)} 50%{transform:translate(5px,-7px) rotate(12deg)} }

.fp-field { text-align:left; margin-bottom:14px; }
.fp-field > i { z-index:2; transition:color .25s, transform .35s cubic-bezier(.34,1.56,.64,1); }
.fp-field:focus-within > i { color:var(--primary); transform:translateY(-50%) scale(1.2); }
.fp-field:focus-within .pw-eye i { transform:none; color:inherit; }
.fp-field .input-box.invalid { border-color:var(--danger) !important; background:#fef2f2; animation:fx-shake .38s ease; }
.fp-btn { display:flex; align-items:center; justify-content:center; gap:9px; border-radius:14px; }
.fp-btn:active { transform:scale(.98); }
.fp-link { display:inline-flex; align-items:center; gap:7px; margin-top:12px; background:none; border:0; font:inherit; font-size:.84rem; font-weight:700; color:var(--text-muted); cursor:pointer; padding:6px 10px; border-radius:10px; }
.fp-link:hover { color:var(--primary); }
.fp-link.strong { color:var(--primary); margin-top:8px; }
.fp-link:disabled { color:var(--text-muted); cursor:default; opacity:.85; font-variant-numeric:tabular-nums; }

.fp-tip { display:flex; gap:9px; align-items:flex-start; text-align:left; margin-top:14px; padding:10px 12px; border-radius:12px; background:var(--bg-input); color:var(--text-muted); font-size:.78rem; line-height:1.45; }
.fp-tip i { color:var(--primary); margin-top:2px; } .fp-tip b { color:var(--text-main); }

/* waiting page */
.fp-how { list-style:none; margin:0 0 14px; padding:0; text-align:left; display:grid; gap:8px; }
.fp-how li { display:flex; align-items:center; gap:11px; padding:10px 12px; border-radius:12px; background:var(--bg-input); font-size:.86rem; font-weight:600; color:var(--text-main); }
.fp-how li span { flex:none; width:24px; height:24px; border-radius:50%; background:var(--primary); color:#fff; font-size:.75rem; font-weight:800; display:flex; align-items:center; justify-content:center; }
.fp-step.fp-in .fp-how li { animation:fx-slide-r .5s cubic-bezier(.22,1,.36,1) backwards; }
.fp-step.fp-in .fp-how li:nth-child(1) { animation-delay:.25s; } .fp-step.fp-in .fp-how li:nth-child(2) { animation-delay:.35s; } .fp-step.fp-in .fp-how li:nth-child(3) { animation-delay:.45s; }
.fp-spam { display:flex; gap:12px; align-items:flex-start; text-align:left; padding:12px; border-radius:14px; background:#fffbeb; border:1.5px solid #fcd34d; color:#92400e; margin-bottom:14px; position:relative; overflow:hidden; }
.fp-spam::after { content:''; position:absolute; top:0; left:0; width:35%; height:100%; background:linear-gradient(90deg,transparent,rgba(255,255,255,.65),transparent); animation:fx-shine 3.4s ease-in-out 1s infinite; pointer-events:none; }
.fp-spam-ico { flex:none; width:34px; height:34px; border-radius:11px; background:#f59e0b; color:#fff; display:flex; align-items:center; justify-content:center; animation:fx-pulse-dot 2s ease-in-out infinite; }
.fp-spam b { display:block; font-size:.86rem; margin-bottom:2px; } .fp-spam span { font-size:.78rem; line-height:1.45; display:block; }
.fp-spam span b { display:inline; font-size:inherit; }
.fp-gmail { display:inline-flex; align-items:center; gap:8px; padding:10px 20px; margin-bottom:12px; border-radius:30px; background:var(--bg-input); color:var(--text-main); font-weight:700; font-size:.86rem; text-decoration:none; transition:transform .2s; }
.fp-gmail:active { transform:scale(.95); } .fp-gmail.hidden { display:none; }
.fp-resend { max-width:300px; margin:0 auto; }
.fp-bar { height:6px; border-radius:10px; background:var(--bg-input); overflow:hidden; }
.fp-bar span { display:block; height:100%; width:100%; border-radius:10px; background:linear-gradient(90deg,var(--primary),var(--accent)); transition:width 1s linear; }

/* set new password */
.fp-step[data-s="reset"] .pw-meter { margin:-4px 0 4px; } .fp-step[data-s="reset"] .pw-lbl { margin-bottom:6px; }
.fp-rules { list-style:none; margin:2px 0 16px; padding:11px 13px; text-align:left; border-radius:12px; background:var(--bg-input); display:grid; gap:6px; font-size:.78rem; font-weight:600; color:var(--text-muted); }
.fp-rules li { display:flex; align-items:center; gap:8px; transition:color .25s; } .fp-rules li i { font-size:.7rem; width:14px; text-align:center; transition:color .25s; } .fp-rules em { font-style:normal; opacity:.7; font-weight:500; }
.fp-rules li.ok { color:#059669; } .fp-rules li.ok i { color:#10b981; font-size:.85rem; animation:fx-pop .4s cubic-bezier(.34,1.56,.64,1); }

/* success */
.fp-check { width:96px; height:96px; margin:0 auto 16px; border-radius:50%; background:linear-gradient(135deg,#10b981,#059669); display:flex; align-items:center; justify-content:center; box-shadow:0 14px 30px rgba(16,185,129,.4); animation:fx-pop .6s cubic-bezier(.34,1.56,.64,1) backwards; position:relative; }
.fp-check::after { content:''; position:absolute; inset:-8px; border-radius:50%; border:2px solid #10b981; opacity:0; animation:auth-ring 2s ease-out .5s 2; }
.fp-check svg { width:60px; height:60px; }
.fp-step.fp-in .fp-check .ad-circle { animation:auth-draw .6s ease .15s forwards; }
.fp-step.fp-in .fp-check .ad-check { animation:auth-draw .4s ease .62s forwards; }

body.dark .fp-box { background:rgba(30,41,59,.97); }
body.dark .fp-spam { background:rgba(245,158,11,.13); border-color:rgba(251,191,36,.4); color:#fde68a; }
body.dark .fp-field .input-box.invalid { background:#3f1d24; }
body.dark .fp-rules li.ok { color:#6ee7b7; }
@media (max-width:380px){ .fp-step { padding:30px 16px 20px; } }
@media (prefers-reduced-motion:reduce){ .fp-ring, .fp-plane, .fp-spam::after, .fp-spam-ico, .fp-ico > i { animation:none !important; } }