/* landing-voting.css */
:root{--af:#9333ea;--at:#7c3aed}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent;-webkit-font-smoothing:antialiased}
html,body{height:100%;overflow-x:hidden}
body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,sans-serif;background:#0f0a1a;color:#E2E8F0;min-height:100dvh}
#bg{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.bg-photo-layer{position:absolute;left:-14%;top:-14%;width:128%;height:128%;object-fit:cover;object-position:center;filter:blur(var(--blur,24px));opacity:.54;transform:scale(1.04);pointer-events:none}
.bg-photo-layer.no-photo-blur{filter:none}
#bg::before{content:'';position:absolute;width:700px;height:700px;top:-200px;left:50%;transform:translateX(-50%);background:radial-gradient(circle,rgba(147,51,234,.18) 0%,transparent 65%)}
#bg::after{content:'';position:absolute;width:500px;height:500px;bottom:-150px;right:-100px;background:radial-gradient(circle,rgba(124,58,237,.13) 0%,transparent 65%)}
#app{position:relative;z-index:1;min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px 16px}
@supports(padding:env(safe-area-inset-bottom)){
#app{padding-top:max(24px,calc(16px + env(safe-area-inset-top)));padding-bottom:max(24px,calc(16px + env(safe-area-inset-bottom)))}
}
@media(max-height:640px){
#app{justify-content:flex-start;padding-top:12px}
}

.scr{width:100%;max-width:420px;display:none;flex-direction:column;animation:scrEnter .42s cubic-bezier(.34,1.15,.56,1) both}
.scr.on{display:flex}
@keyframes scrEnter{from{opacity:0;transform:translateY(16px) scale(.985)}to{opacity:1;transform:none}}

.card{background:rgba(10,13,32,.92);border:1px solid rgba(147,51,234,.12);border-radius:20px;padding:22px 20px;backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);box-shadow:0 20px 50px rgba(0,0,0,.62),0 0 0 1px rgba(255,255,255,.035) inset}
.scr.on .card{animation:cardPop .5s cubic-bezier(.34,1.15,.56,1) .06s both}
@keyframes cardPop{from{opacity:0;transform:translateY(8px) scale(.992)}to{opacity:1;transform:none}}

/* Flow badge */
.flow-banner{margin-bottom:18px}
.flow-badge{display:inline-flex;align-items:center;gap:8px;background:rgba(147,51,234,.11);border:1px solid rgba(167,139,250,.22);border-radius:999px;padding:7px 14px 7px 10px;margin-bottom:8px;position:relative;overflow:hidden}
.flow-badge-warm{background:rgba(251,191,36,.08);border-color:rgba(251,191,36,.28)}
.fb-glow{width:8px;height:8px;border-radius:50%;background:linear-gradient(135deg,var(--af),var(--at));box-shadow:0 0 10px rgba(147,51,234,.65);flex-shrink:0;animation:fbPulse 2s ease-in-out infinite}
.flow-badge-warm .fb-glow{background:linear-gradient(135deg,#fbbf24,#f97316);box-shadow:0 0 10px rgba(251,191,36,.55)}
@keyframes fbPulse{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.12);opacity:.82}}
.fb-label{font-size:13px;font-weight:650;color:#e2e8f0;letter-spacing:.02em}
.flow-tagline{margin:0;font-size:13px;line-height:1.55;color:rgba(148,163,184,.82)}

/* Journey dots */
.journey{display:flex;align-items:center;justify-content:center;gap:7px;margin-top:12px;margin-bottom:2px}
.j-dot{width:8px;height:8px;border-radius:50%;background:rgba(147,51,234,.22);border:1px solid rgba(147,51,234,.2);transition:transform .25s,background .25s,box-shadow .25s}
.j-dot.on{background:linear-gradient(135deg,var(--af),var(--at));border-color:transparent;box-shadow:0 0 12px rgba(147,51,234,.45);transform:scale(1.15)}
.j-dot.done{background:rgba(52,211,153,.35);border-color:rgba(52,211,153,.45);box-shadow:0 0 8px rgba(52,211,153,.25)}

/* Trust strip */
.trust-strip{display:flex;align-items:flex-start;gap:10px;margin-top:18px;padding:12px 14px;background:rgba(147,51,234,.06);border:1px solid rgba(147,51,234,.14);border-radius:14px;font-size:12.5px;line-height:1.55;color:rgba(186,200,252,.88)}
.trust-strip svg{flex-shrink:0;margin-top:2px;opacity:.85}
.phone-meter{margin-top:10px;font-size:13px;font-weight:600;color:rgba(167,139,250,.88);text-align:center;min-height:1.35em;transition:opacity .15s}
.code-meter{font-size:13px;font-weight:600;color:rgba(148,163,184,.9);text-align:center;margin:4px 0 12px;min-height:1.4em}

/* CTA shimmer */
.btn-shimmer{position:relative;overflow:hidden}
.btn-shimmer::before{content:'';position:absolute;top:0;left:-40%;width:45%;height:100%;background:linear-gradient(105deg,transparent,rgba(255,255,255,.22),transparent);animation:btnSheen 3.2s ease-in-out infinite}
@keyframes btnSheen{0%,70%{transform:translateX(0);opacity:0}75%{opacity:1}100%{transform:translateX(380%);opacity:0}}

@media (prefers-reduced-motion:reduce){
.scr,.scr.on .card,.toast,.help-sheet,.btn-shimmer::before,.j-dot,.fb-glow,.cd-box.active{animation:none!important;transition:none!important}
.btn-shimmer::before{display:none}
}

/* Header badge */
.badge{display:inline-flex;align-items:center;gap:6px;background:rgba(147,51,234,.1);border:1px solid rgba(147,51,234,.2);border-radius:100px;padding:5px 12px 5px 8px;margin-bottom:18px}
.badge-dot{width:7px;height:7px;border-radius:50%;background:linear-gradient(135deg,var(--af),var(--at));box-shadow:0 0 6px var(--af)}
.badge-txt{font-size:11px;font-weight:600;color:rgba(167,139,250,.9);letter-spacing:.04em;text-transform:uppercase}

/* Intro */
.intro-kicker{text-align:center;font-size:13px;font-weight:600;letter-spacing:.07em;color:rgba(167,139,250,.78);margin-bottom:14px;text-transform:uppercase}
.ico-wrap{margin-bottom:16px}
.ico-photo-wrap.ico-wrap{width:100%;margin-bottom:16px;display:flex;justify-content:center;align-items:center}
.ico-photo-full{max-width:100%;max-height:clamp(104px,min(224px,36vh));width:auto;height:auto;object-fit:contain;border-radius:16px;display:block;vertical-align:middle}
.ico-box{width:58px;height:58px;border-radius:16px;display:flex;align-items:center;justify-content:center;background:linear-gradient(145deg,var(--af),var(--at));box-shadow:0 6px 22px rgba(147,51,234,.38),0 0 0 1px rgba(255,255,255,.09) inset;overflow:hidden;flex-shrink:0}
.ico-emoji{font-size:clamp(30px,9vw,40px);line-height:1;display:block;text-align:center}

/* Typography */
.ttl{font-size:22px;font-weight:750;letter-spacing:-.45px;line-height:1.25;margin-bottom:8px;color:#F8FAFC;text-shadow:0 1px 18px rgba(147,51,234,.12)}
.sub{font-size:13.5px;color:rgba(148,163,184,.75);line-height:1.65;margin-bottom:6px}

/* Back */
.back{display:inline-flex;align-items:center;gap:5px;background:none;border:none;cursor:pointer;padding:0;font-family:inherit;font-size:13px;font-weight:500;color:rgba(148,163,184,.45);transition:color .15s;margin-bottom:16px}
.back:hover{color:rgba(148,163,184,.85)}

/* Phone field */
.pf{display:flex;align-items:center;background:rgba(255,255,255,.04);border:1.5px solid rgba(147,51,234,.18);border-radius:14px;height:54px;overflow:visible;transition:border-color .18s,box-shadow .18s;margin-top:14px;position:relative;z-index:100}
.pf:focus-within{border-color:rgba(147,51,234,.65);box-shadow:0 0 0 3.5px rgba(147,51,234,.12)}
.pf.err{border-color:rgba(239,68,68,.55)!important;box-shadow:0 0 0 3px rgba(239,68,68,.1)!important;animation:shake .32s}
.pf-pre{display:flex;align-items:center;gap:6px;padding:0 8px 0 13px;border-right:1px solid rgba(147,51,234,.14);height:100%;flex-shrink:0;cursor:pointer;background:none;border-top:none;border-bottom:none;border-left:none;user-select:none;-webkit-user-select:none;transition:background .13s}
.pf-pre:hover{background:rgba(147,51,234,.06)}
.pf-pre:active{background:rgba(147,51,234,.1)}
.pf-code{font-size:15px;font-weight:600;color:rgba(226,232,240,.9)}
.pf-code-inp{width:30px;background:transparent;border:none;outline:none;font-family:inherit;font-size:15px;font-weight:600;color:rgba(226,232,240,.9);text-align:center;-webkit-appearance:none;padding:0}
.pf-code-inp::placeholder{color:rgba(148,163,184,.35)}
.pf-inp{flex:1;min-width:0;height:100%;background:transparent;border:none;outline:none;padding:0 13px;font-family:inherit;font-size:16px;color:#E2E8F0;-webkit-appearance:none}
.pf-inp::placeholder{color:rgba(100,116,139,.6)}
.pf-clear{width:36px;height:100%;flex-shrink:0;background:none;border:none;cursor:pointer;display:none;align-items:center;justify-content:center;color:rgba(100,116,139,.6);transition:color .12s}
.pf-clear:hover{color:rgba(148,163,184,.9)}
.pf-clear.vis{display:flex}

/* Password field + visibility toggle */
.pw-row{display:flex;align-items:stretch;background:rgba(255,255,255,.04);border:1.5px solid rgba(147,51,234,.18);border-radius:14px;min-height:54px;overflow:hidden;transition:border-color .18s,box-shadow .18s}
.pw-row:focus-within{border-color:rgba(147,51,234,.65);box-shadow:0 0 0 3.5px rgba(147,51,234,.12)}
.pw-row.err{border-color:rgba(239,68,68,.55)!important;box-shadow:0 0 0 3px rgba(239,68,68,.1)!important}
.pw-inp{flex:1;min-width:0;height:54px;background:transparent;border:none;outline:none;padding:0 14px;font-family:inherit;font-size:16px;color:#E2E8F0;-webkit-appearance:none}
.pw-inp::placeholder{color:rgba(100,116,139,.6)}
.pw-toggle{width:50px;flex-shrink:0;background:none;border:none;border-left:1px solid rgba(147,51,234,.14);cursor:pointer;display:flex;align-items:center;justify-content:center;color:rgba(148,163,184,.75);transition:color .15s,background .15s;padding:0}
.pw-toggle:hover{color:rgba(226,232,240,.95);background:rgba(147,51,234,.06)}
.pw-toggle:active{background:rgba(147,51,234,.1)}
.pw-toggle svg{display:block}

/* Messages */
.msg{border-radius:11px;font-size:12.5px;font-weight:500;padding:9px 13px;display:none;line-height:1.5;margin-top:8px}
.msg.show{display:block}
.msg.e{background:rgba(239,68,68,.08);color:#FDA4A4;border:1px solid rgba(239,68,68,.18)}
.msg.s{background:rgba(34,197,94,.08);color:#86EFAC;border:1px solid rgba(34,197,94,.18)}

/* Code intro line */
.code-intro{font-size:14px;color:rgba(148,163,184,.88);margin:12px 0 14px;line-height:1.55}
.code-intro strong{color:rgba(186,200,252,.95);font-weight:650}

/* Code display boxes */
.code-disp{display:flex;justify-content:center;gap:8px;margin:6px 0 4px}
.cd-box{width:44px;height:54px;display:flex;align-items:center;justify-content:center;font-size:26px;font-weight:700;color:rgba(100,116,139,.35);background:rgba(15,18,40,.8);border:1.5px solid rgba(147,51,234,.18);border-radius:14px;transition:color .14s,border-color .14s,background .14s,box-shadow .14s,transform .12s}
.cd-box.filled{transform:scale(1.02)}
.cd-box.filled{color:#E2E8F0;border-color:rgba(147,51,234,.6);background:rgba(147,51,234,.09)}
.cd-box.active{border-color:rgba(147,51,234,.95);background:rgba(147,51,234,.09);box-shadow:0 0 0 3px rgba(147,51,234,.18);animation:caretGlow 1.15s ease-in-out infinite}
@keyframes caretGlow{0%,100%{box-shadow:0 0 0 3px rgba(147,51,234,.18)}50%{box-shadow:0 0 0 5px rgba(147,51,234,.28)}}
.code-disp.shake{animation:shake .35s}
.code-disp.err .cd-box{border-color:rgba(239,68,68,.65)!important;background:rgba(239,68,68,.07)!important;color:rgba(252,165,165,.9)!important;animation:none;box-shadow:none!important}
.code-disp.loading .cd-box{opacity:.45;animation:boxPulse 1s ease-in-out infinite}
.code-disp.loading .cd-box:nth-child(2){animation-delay:.15s}
.code-disp.loading .cd-box:nth-child(3){animation-delay:.3s}
.code-disp.loading .cd-box:nth-child(4){animation-delay:.45s}
.code-disp.loading .cd-box:nth-child(5){animation-delay:.6s}
.code-disp.loading .cd-box:nth-child(6){animation-delay:.75s}
@keyframes boxPulse{0%,100%{opacity:.3}50%{opacity:.8}}
.btn-help{width:100%;min-height:48px;margin-top:8px;margin-bottom:2px;display:flex;align-items:center;justify-content:center;gap:10px;font-family:inherit;font-size:14px;font-weight:650;color:#c7d2fe;background:rgba(147,51,234,.12);border:1.5px solid rgba(167,139,250,.35);border-radius:16px;cursor:pointer;transition:background .18s,border-color .18s,transform .14s}
.btn-help:hover{background:rgba(147,51,234,.2);border-color:rgba(167,139,250,.55)}
.btn-help:active{transform:scale(.982)}
.btn-help svg{flex-shrink:0;opacity:.88}

/* Toast */
.toast-stack{position:fixed;top:0;left:0;right:0;z-index:900;display:flex;flex-direction:column;align-items:center;gap:8px;padding:calc(12px + env(safe-area-inset-top)) 14px 0;pointer-events:none}
.toast{width:100%;max-width:380px;pointer-events:none;display:flex;align-items:flex-start;gap:12px;padding:14px 16px;background:rgba(18,22,48,.94);border:1px solid rgba(167,139,250,.35);border-radius:18px;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:0 16px 40px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.05) inset,0 0 48px rgba(147,51,234,.15);animation:toastSlide .45s cubic-bezier(.34,1.18,.56,1) both}
@keyframes toastSlide{from{opacity:0;transform:translateY(-120%) scale(.94)}to{opacity:1;transform:none}}
.toast-icon{width:38px;height:38px;border-radius:13px;display:flex;align-items:center;justify-content:center;flex-shrink:0;background:linear-gradient(145deg,var(--af),var(--at));box-shadow:0 6px 18px rgba(147,51,234,.45)}
.toast-spin{width:20px;height:20px;border-radius:50%;border:2.5px solid rgba(255,255,255,.2);border-top-color:#fff;animation:spin .62s linear infinite}
.toast-core{flex:1;min-width:0;padding-top:1px}
.toast-title{font-size:15px;font-weight:750;color:#f8fafc;letter-spacing:-.2px;line-height:1.35}
.toast-sub{font-size:12.5px;color:rgba(148,163,184,.92);line-height:1.55;margin-top:3px}
.toast-sub .toast-accent{display:block;margin-top:4px;font-size:12px;font-weight:600;color:rgba(167,139,250,.95)}
.toast.hide{animation:toastOut .28s ease forwards}
@keyframes toastOut{to{opacity:0;transform:translateY(-18px) scale(.96)}}

/* Help modal */
.help-overlay{position:fixed;inset:0;z-index:920;background:rgba(6,8,20,.72);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);display:none;align-items:flex-end;justify-content:center;padding:0;animation:fadeIn .22s ease}
.help-overlay.on{display:flex}
.help-sheet{width:100%;max-width:440px;background:linear-gradient(180deg,rgba(22,26,52,.98),rgba(14,16,34,.99));border:1px solid rgba(147,51,234,.22);border-radius:22px 22px 0 0;padding:10px 20px calc(22px + env(safe-area-inset-bottom));max-height:min(78vh,560px);overflow:auto;animation:sheetUp .34s cubic-bezier(.34,1.12,.56,1) both;box-shadow:0 -12px 48px rgba(0,0,0,.55)}
@keyframes sheetUp{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:none}}
.help-grabber{width:38px;height:4px;background:rgba(147,51,234,.35);border-radius:2px;margin:4px auto 14px}
.help-title{font-size:18px;font-weight:750;color:#f1f5f9;margin-bottom:14px;letter-spacing:-.35px}
.help-step{display:flex;gap:12px;margin-bottom:14px}
.help-num{width:28px;height:28px;border-radius:10px;background:rgba(147,51,234,.22);border:1px solid rgba(167,139,250,.35);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:750;color:#c7d2fe;flex-shrink:0}
.help-step p{margin:0;font-size:14px;line-height:1.62;color:rgba(203,213,245,.88)}
.help-close{width:100%;margin-top:8px;height:52px}

/* Resend */
.resend-row{display:flex;align-items:center;justify-content:space-between;min-height:22px;margin-top:14px;margin-bottom:2px;padding-top:12px;border-top:1px solid rgba(147,51,234,.1)}
.timer{font-size:12px;color:rgba(100,116,139,.7)}
.timer b{color:rgba(167,139,250,.9)}
.resend-btn{font-family:inherit;font-size:12px;font-weight:600;color:rgba(167,139,250,.9);background:none;border:none;cursor:pointer;transition:color .13s;padding:0}
.resend-btn:hover{color:#A5B4FC}
.resend-btn:disabled{opacity:.3;cursor:not-allowed}

/* Numpad */
.numpad{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:6px}
.np{height:50px;background:rgba(15,18,40,.8);border:1.5px solid rgba(147,51,234,.14);border-radius:14px;color:#E2E8F0;font-family:inherit;font-size:21px;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .1s,transform .08s,border-color .12s;-webkit-user-select:none;user-select:none}
.np:hover{background:rgba(147,51,234,.1);border-color:rgba(147,51,234,.28)}
.np:active{background:rgba(147,51,234,.2);border-color:rgba(147,51,234,.55);transform:scale(.92)}

/* Button */
.btn{width:100%;height:52px;color:#fff;font-family:inherit;font-size:15px;font-weight:700;border:none;border-radius:100px;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;letter-spacing:.01em;position:relative;overflow:hidden;user-select:none;transition:transform .12s,box-shadow .15s,opacity .15s}
.btn::after{content:'';position:absolute;inset:0;border-radius:inherit;background:linear-gradient(180deg,rgba(255,255,255,.12) 0%,transparent 60%);pointer-events:none}
.btn:hover:not(:disabled){transform:translateY(-1px);opacity:.92}
.btn:active:not(:disabled){transform:scale(.975)}
.btn:disabled{opacity:.32;cursor:not-allowed;transform:none}
.btn.btn-busy{opacity:.92;cursor:wait;pointer-events:none}
.btn-a{background:linear-gradient(130deg,var(--af) 0%,var(--at) 100%);box-shadow:0 6px 26px rgba(147,51,234,.42),0 1px 0 rgba(255,255,255,.16) inset}
.btn-a:hover:not(:disabled){box-shadow:0 10px 36px rgba(147,51,234,.52),0 1px 0 rgba(255,255,255,.16) inset}
.btn-lg{min-height:54px;font-size:15.5px}

/* Telegram Mini App: share phone */
.tg-contact-block{display:none;margin-top:14px}
.tg-contact-block.vis{display:block}
.tg-contact-btns{display:flex;flex-direction:column;gap:10px}
.tg-manual-link{font-family:inherit;font-size:13px;font-weight:600;color:rgba(167,139,250,.82);background:none;border:none;cursor:pointer;padding:8px;text-align:center;transition:color .13s;text-decoration:underline;text-underline-offset:3px}
.tg-manual-link:hover{color:#A5B4FC}

/* Loading screen */
.ld-wrap{text-align:center;padding:8px 0 4px}
.ld-ring{width:76px;height:76px;position:relative;margin:0 auto 22px}
.ld-ring-track{position:absolute;inset:0;border-radius:50%;border:3px solid rgba(147,51,234,.1)}
.ld-ring-spin{position:absolute;inset:0;border-radius:50%;border:3px solid transparent;border-top-color:var(--af);border-right-color:var(--at);animation:spin 1s cubic-bezier(.4,0,.2,1) infinite}
.ld-ring-glow{position:absolute;inset:6px;border-radius:50%;background:radial-gradient(circle,rgba(147,51,234,.1) 0%,transparent 70%);animation:pulse 2s ease-in-out infinite}
.ld-title{font-size:20px;font-weight:700;color:#F1F5F9;margin-bottom:10px;letter-spacing:-.3px}
.ld-sub{font-size:14px;color:rgba(100,116,139,.8);line-height:1.65}
.ld-dots{display:flex;justify-content:center;gap:6px;margin-top:18px}
.ld-dots span{width:7px;height:7px;border-radius:50%;background:rgba(147,51,234,.5);animation:dotPulse 1.4s ease-in-out infinite}
.ld-dots span:nth-child(2){animation-delay:.22s;background:rgba(167,139,250,.5)}
.ld-dots span:nth-child(3){animation-delay:.44s;background:rgba(196,181,253,.5)}
.vs-wrap{text-align:center;padding:12px 0 4px}
.vs-check-ring{width:80px;height:80px;position:relative;margin:0 auto 24px}
.vs-check-svg{display:block}
.vs-circle{stroke-dasharray:188.5;stroke-dashoffset:188.5;animation:vsCircle .7s .2s ease forwards}
.vs-tick{stroke-dasharray:42;stroke-dashoffset:42;animation:vsTick .4s .7s ease forwards}
.vs-glow{position:absolute;inset:-8px;border-radius:50%;background:radial-gradient(circle,rgba(147,51,234,.18) 0%,transparent 70%);animation:vsGlow 2s 1s ease-in-out infinite}
@keyframes vsCircle{to{stroke-dashoffset:0}}
@keyframes vsTick{to{stroke-dashoffset:0}}
@keyframes vsGlow{0%,100%{opacity:.4;transform:scale(1)}50%{opacity:1;transform:scale(1.08)}}
.vs-title{font-size:22px;font-weight:700;color:#F1F5F9;margin-bottom:10px;letter-spacing:-.3px;animation:vsFadeUp .5s .4s ease both}
.vs-sub{font-size:13.5px;color:rgba(148,163,184,.75);line-height:1.7;animation:vsFadeUp .5s .55s ease both}
.vs-divider{width:48px;height:2px;border-radius:1px;background:linear-gradient(90deg,transparent,rgba(147,51,234,.3),transparent);margin:20px auto}
.vs-stats{display:flex;justify-content:center;gap:32px;animation:vsFadeUp .5s .7s ease both}
.vs-stat{text-align:center}
.vs-stat-num{font-size:20px;font-weight:700;color:#a78bfa;letter-spacing:-.3px}
.vs-stat-label{font-size:11.5px;color:rgba(148,163,184,.55);margin-top:3px;text-transform:uppercase;letter-spacing:.5px}
.vs-note{display:flex;align-items:center;justify-content:center;gap:6px;margin-top:20px;font-size:12px;color:rgba(148,163,184,.5);animation:vsFadeUp .5s .85s ease both}
@keyframes vsFadeUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}

/* Spinner inside buttons */
.sp{width:17px;height:17px;flex-shrink:0;border:2.5px solid rgba(255,255,255,.2);border-top-color:#fff;border-radius:50%;animation:spin .55s linear infinite;display:inline-block}

/* Country selector */
.country-wrap{position:relative;display:flex;align-items:center;flex-shrink:0}
.country-btn{display:flex;align-items:center;gap:6px;border:none;background:transparent;cursor:pointer;padding:0 10px 0 12px;font-size:15px;font-family:inherit;color:#E2E8F0}
.country-btn .c-flag{font-size:20px;line-height:1}
.country-btn .c-code{font-weight:700}
.country-btn::after{content:"\25BE";font-size:10px;margin-left:2px;opacity:.5}
.country-drop{display:none;position:absolute;left:0;top:calc(100% + 8px);min-width:230px;padding:6px;border-radius:14px;border:1px solid rgba(147,51,234,.18);background:rgba(14,16,34,.98);box-shadow:0 12px 32px rgba(0,0,0,.5);z-index:999}
.country-drop.open{display:block}
.country-opt{width:100%;border:none;background:transparent;display:flex;align-items:center;gap:8px;padding:10px;border-radius:10px;cursor:pointer;font-size:13px;font-weight:600;font-family:inherit;text-align:left;color:#E2E8F0}
.country-opt:hover,.country-opt.active{background:rgba(147,51,234,.12)}
.country-opt .c-cd{margin-left:auto;opacity:.5;font-weight:700}

@keyframes spin{to{transform:rotate(360deg)}}
@keyframes shake{0%,100%{transform:translateX(0)}20%{transform:translateX(-5px)}40%{transform:translateX(5px)}60%{transform:translateX(-3px)}80%{transform:translateX(3px)}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes pulse{0%,100%{opacity:.6;transform:scale(1)}50%{opacity:1;transform:scale(1.06)}}
@keyframes dotPulse{0%,80%,100%{transform:scale(.75);opacity:.4}40%{transform:scale(1.1);opacity:1}}
@media(max-width:360px){.card{padding:20px 16px}.cd-dot{width:31px;font-size:23px}.btn{height:48px;font-size:14px}.np{height:46px;font-size:19px}}

/* ── Vote landing ── */
.vote-header{text-align:center;margin-bottom:18px}
.vote-logo{font-size:15px;font-weight:700;color:rgba(167,139,250,.9);letter-spacing:.03em;margin-bottom:6px}
.vote-title{font-size:20px;font-weight:800;letter-spacing:-.3px;line-height:1.3;color:#f8fafc;margin-bottom:6px}
.vote-subtitle{font-size:13px;color:rgba(148,163,184,.7);line-height:1.5}
.vote-nav{display:flex;justify-content:center;gap:16px;margin-bottom:16px}
.vote-nav a{font-size:12.5px;font-weight:600;color:rgba(167,139,250,.7);text-decoration:none;transition:color .15s}
.vote-nav a:hover{color:#a78bfa}
.vote-entries{display:flex;flex-direction:column;gap:12px;margin-bottom:18px}
.vote-entry{display:flex;align-items:center;gap:12px;background:rgba(147,51,234,.06);border:1px solid rgba(147,51,234,.14);border-radius:16px;padding:12px;transition:border-color .15s}
.vote-avatar{width:52px;height:52px;border-radius:50%;object-fit:cover;flex-shrink:0;border:2px solid rgba(147,51,234,.25)}
.vote-info{flex:1;min-width:0}
.vote-name{font-size:14px;font-weight:700;color:#f1f5f9;margin-bottom:2px}
.vote-count{font-size:12px;color:rgba(148,163,184,.7)}
.vote-btn{flex-shrink:0;padding:8px 14px;font-family:inherit;font-size:12.5px;font-weight:700;color:#fff;background:linear-gradient(130deg,#9333ea,#7c3aed);border:none;border-radius:100px;cursor:pointer;transition:transform .12s,box-shadow .15s;box-shadow:0 3px 12px rgba(147,51,234,.3)}
.vote-btn:hover{transform:translateY(-1px);box-shadow:0 5px 18px rgba(147,51,234,.4)}
.vote-btn:active{transform:scale(.96)}
.vote-stats{display:flex;justify-content:center;gap:20px;margin-bottom:14px;padding:12px 0;border-top:1px solid rgba(147,51,234,.1);border-bottom:1px solid rgba(147,51,234,.1)}
.vote-stat{text-align:center}
.vote-stat-num{font-size:16px;font-weight:800;color:#a78bfa;letter-spacing:-.3px}
.vote-stat-label{font-size:10.5px;color:rgba(148,163,184,.6);text-transform:uppercase;letter-spacing:.04em;font-weight:600}

/* ── OmniX auth views (landing-auth.js) ── */
.view { display: none !important; }
.view.active { display: block !important; }
html.land-brawl .view.active { display: flex !important; flex-direction: column; }
html.land-brawl-game .view.active,
html.land-voting .view.active,
html.land-voting-v2 .view.active { display: flex !important; flex-direction: column; }

#otpGrid,
.otp-grid,
.sms-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 8px;
  margin-bottom: 14px;
}

.tg-contact-block {
  display: none;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 12px;
}

.tg-contact-block.vis { display: flex; }

.btn-main.loading,
.btn-submit.loading,
.submit-btn.loading {
  opacity: 0.7;
  pointer-events: none;
}

.otp-input {
  height: 54px;
  width: 100%;
  min-width: 0;
  border-radius: 12px;
  text-align: center;
  font-size: 22px;
  font-weight: 700;
  outline: none;
  font-family: inherit;
}

html.land-channel18 .otp-input {
  background: var(--field-bg);
  border: 1px solid var(--field-border);
  color: #fff;
}

html.land-svo .otp-input {
  background: rgba(0, 0, 0, 0.35);
  border: 1px solid rgba(255, 255, 255, 0.12);
  color: #fff;
}

html.land-brawl .otp-input {
  background: rgba(15, 23, 42, 0.72);
  border: 1px solid rgba(99, 102, 241, 0.22);
  color: #f8fafc;
}

html.land-brawl-game .otp-input,
html.land-voting .otp-input,
html.land-voting-v2 .otp-input,
html.land-discount .otp-input {
  background: rgba(15, 23, 42, 0.72);
  border: 1px solid rgba(99, 102, 241, 0.22);
  color: #f8fafc;
}

html.land-channel18 .country-drop.open,
html.land-svo .country-drop.open,
html.land-svo .country-list.open,
html.land-brawl .country-drop.open,
html.land-brawl-game .country-drop.open,
html.land-voting .country-drop.open,
html.land-discount .country-drop.open {
  display: block;
}