/* GoldGram auth — subset for login/install */
/* ===================== GoldGram — Telegram-style (light) ===================== */
:root{
  --bg-primary:#F5F7FA;--bg-secondary:#EFF2F5;--bg-white:#FFFFFF;
  --text-primary:#0B1419;--text-secondary:#667781;--text-muted:#8E9AA4;
  --accent:#3390EC;--accent-hover:#2A7AD1;--accent-light:#EBF4FF;
  --border:#E9EDF2;--border-input:#D1D9E2;
  --message-self:#E7F3FF;--message-other:#FFFFFF;
  --online:#25D366;--offline:#8E9AA4;--error:#FF3B30;--warning:#FF9F0A;--success:#34C759;
  --shadow-sm:0 1px 4px rgba(0,0,0,.04);--shadow-md:0 4px 16px rgba(0,0,0,.06);
  --shadow-lg:0 8px 32px rgba(0,0,0,.10);
}
html[data-theme="dark"]{
  --bg-primary:#17212B;--bg-secondary:#232E3C;--bg-white:#1E2A36;
  --text-primary:#F5F7FA;--text-secondary:#AEBAC9;--text-muted:#6D7F8F;
  --accent:#56A3EC;--accent-hover:#6FB2F0;--accent-light:#1f3346;
  --border:#2B3744;--border-input:#36444F;
  --message-self:#2B5278;--message-other:#1E2A36;
  --shadow-sm:0 1px 4px rgba(0,0,0,.3);--shadow-md:0 4px 16px rgba(0,0,0,.4);
  --shadow-lg:0 8px 32px rgba(0,0,0,.5);
}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html,body{height:100%}
body{
  font:15px/1.45 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Inter,Helvetica,Arial,sans-serif;
  color:var(--text-primary);background:var(--bg-white);-webkit-font-smoothing:antialiased;
}
button,input,textarea{font-family:inherit;color:inherit}
button{cursor:pointer;border:0;background:none}
::-webkit-scrollbar{width:8px;height:8px}
::-webkit-scrollbar-thumb{background:var(--border-input);border-radius:4px}
::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}
.modal-overlay{position:fixed;inset:0;z-index:150;background:rgba(11,20,25,0);display:grid;place-items:center;padding:16px;opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s ease,background .3s ease}
.modal-overlay.modal-open{background:rgba(11,20,25,.48);opacity:1;visibility:visible}
.modal-overlay[hidden]{display:none!important}
.modal-overlay.modal-closing{pointer-events:none}
.modal-card,.confirm-card,.pm-card,.qr-card,.pin-scope-card{will-change:transform,opacity}
.modal-in,.confirm-card.modal-in,.pm-card.modal-in{animation:modalIn .34s cubic-bezier(.22,1,.36,1) both}
.modal-out,.confirm-card.modal-out,.pm-card.modal-out{animation:modalOut .26s cubic-bezier(.4,0,.2,1) both}
@keyframes modalIn{from{opacity:0;transform:scale(.9) translateY(18px)}to{opacity:1;transform:none}}
@keyframes modalOut{from{opacity:1;transform:none}to{opacity:0;transform:scale(.94) translateY(12px)}}
.pm-pane-enter{animation:pmPaneIn .32s cubic-bezier(.22,1,.36,1) both}
.pm-pane-enter-back{animation:pmPaneBack .32s cubic-bezier(.22,1,.36,1) both}
.pm-pane-leave{animation:pmPaneOut .2s ease both}
@keyframes pmPaneIn{from{opacity:0;transform:translateX(20px)}to{opacity:1;transform:none}}
@keyframes pmPaneBack{from{opacity:0;transform:translateX(-20px)}to{opacity:1;transform:none}}
@keyframes pmPaneOut{from{opacity:1;transform:none}to{opacity:0;transform:translateX(-14px)}}
.confetti-canvas{position:fixed;inset:0;z-index:9999;pointer-events:none}

.app-layout{animation:appIn .42s cubic-bezier(.22,1,.36,1) both}
@keyframes appIn{from{opacity:0;transform:scale(.985)}to{opacity:1;transform:none}}

.auth-body:not(.auth-ready) .auth-topbar,.auth-body:not(.auth-ready) .auth-card,.auth-body:not(.auth-ready) .auth-foot{opacity:0}
.auth-body.auth-ready .auth-topbar{animation:authFadeDown .55s cubic-bezier(.22,1,.36,1) .05s both}
.auth-body.auth-ready .auth-card:not(.auth-card-settled){animation:authCardIn .6s cubic-bezier(.22,1,.36,1) .1s both}
.auth-body.auth-ready .auth-card.shake{animation:authShake .42s cubic-bezier(.36,.07,.19,.97) both}
.auth-body.auth-ready .auth-foot{animation:authFadeUp .55s cubic-bezier(.22,1,.36,1) .18s both}
.auth-form.active{animation:authFormIn .35s cubic-bezier(.22,1,.36,1) both}
.auth-form.auth-form-in{animation:authFormIn .35s cubic-bezier(.22,1,.36,1) both}
.auth-card.auth-success{animation:authSuccess .55s cubic-bezier(.22,1,.36,1) both}
@keyframes authFadeDown{from{opacity:0;transform:translateY(-16px)}to{opacity:1;transform:none}}
@keyframes authFadeUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes authCardIn{from{opacity:0;transform:translateY(32px) scale(.94)}to{opacity:1;transform:none}}
@keyframes authFormIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes authSuccess{0%{transform:scale(1)}40%{transform:scale(1.03)}100%{transform:scale(1);opacity:1}}

@media (prefers-reduced-motion:reduce){
  .modal-in,.modal-out,.pm-pane-enter,.pm-pane-enter-back,.pm-pane-leave,
  .auth-body.auth-ready .auth-topbar,.auth-body.auth-ready .auth-card,.auth-body.auth-ready .auth-foot,
  .auth-form.active,.auth-form.auth-form-in,.auth-card.auth-success,.app-layout,.toast{animation:none!important}
  .modal-overlay{transition:none!important;opacity:1!important;visibility:visible!important;background:rgba(11,20,25,.48)!important}
  .auth-body:not(.auth-ready) .auth-topbar,.auth-body:not(.auth-ready) .auth-card,.auth-body:not(.auth-ready) .auth-foot{opacity:1}
}
.modal-card{width:100%;max-width:420px;background:var(--bg-white);border-radius:20px;box-shadow:var(--shadow-lg);overflow:hidden;display:flex;flex-direction:column;max-height:86vh}
#admin-msgs-modal .modal-card{width:100%;max-width:none;height:100dvh;max-height:100dvh;border-radius:0;box-shadow:none}
#gift-modal .modal-card.gift-modal-card{max-width:560px;width:min(560px,calc(100vw - 32px));max-height:min(88dvh,820px);margin:0 auto}
@media(min-width:681px){
  #gift-modal .modal-card.gift-modal-card--admin-grant,
  #gift-modal .modal-card.gift-modal-card--admin-grant-send{max-width:680px;width:min(680px,calc(100vw - 32px));max-height:min(88dvh,820px);height:auto;border-radius:24px;box-shadow:0 28px 80px rgba(255,107,53,.18),0 12px 40px rgba(20,30,60,.14);display:flex;flex-direction:column;margin:0 auto}
  html[data-theme="dark"] #gift-modal .modal-card.gift-modal-card--admin-grant,
  html[data-theme="dark"] #gift-modal .modal-card.gift-modal-card--admin-grant-send{box-shadow:0 28px 80px rgba(0,0,0,.55)}
}
.modal-head{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;border-bottom:1px solid var(--border)}
.modal-head h3{font-size:17px;font-weight:700}
.modal-body{padding:16px 18px;overflow-y:auto}
.modal-input{width:100%;height:46px;background:var(--bg-secondary);border:1.5px solid transparent;border-radius:12px;padding:0 14px;font-size:15px;color:var(--text-primary)}
.modal-input::placeholder{color:var(--text-muted);opacity:1}
.modal-input:focus{outline:none;background:#fff;border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-light)}
html[data-theme="dark"] .modal-input:focus{background:var(--bg-white);border-color:var(--accent)}
html[data-theme="dark"] .modal-input{border-color:rgba(255,255,255,.08)}
/* ===================== AUTH (VK-style, light) ===================== */
.auth-body{
  min-height:100dvh;display:flex;flex-direction:column;position:relative;overflow-x:clip;
  background-color:var(--bg-secondary);
  background-image:
    radial-gradient(900px 500px at 88% 6%,rgba(51,144,236,.16),transparent 68%),
    radial-gradient(760px 480px at 8% 94%,rgba(255,184,0,.11),transparent 62%),
    linear-gradient(165deg,var(--bg-secondary) 0%,#e8edf4 48%,var(--bg-secondary) 100%)}
html[data-theme="dark"] .auth-body{
  background-color:#141d27;
  background-image:
    radial-gradient(900px 500px at 88% 6%,rgba(86,163,236,.14),transparent 68%),
    radial-gradient(760px 480px at 8% 94%,rgba(255,184,0,.06),transparent 62%),
    linear-gradient(165deg,#141d27 0%,#1a2633 48%,#141d27 100%)}
.auth-rings{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.auth-rings::before,.auth-rings::after{content:"";position:absolute;border-radius:50%;opacity:1}
.auth-rings::before{width:130vw;height:130vw;right:-42vw;top:-28vw;border:1px solid rgba(51,144,236,.22)}
.auth-rings::after{width:105vw;height:105vw;left:-38vw;bottom:-32vw;border:1px solid rgba(255,160,0,.18)}
html[data-theme="dark"] .auth-rings::before{border-color:rgba(86,163,236,.14);opacity:.75}
html[data-theme="dark"] .auth-rings::after{border-color:rgba(255,184,0,.08);opacity:.75}
.auth-topbar{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;padding:18px 26px;gap:12px;background:transparent}
.auth-search-slot{position:relative;flex:1;min-width:0;max-width:420px}
.auth-search{display:flex;align-items:center;gap:8px;height:40px;background:var(--bg-primary);border:1px solid var(--border);border-radius:10px;padding:0 10px 0 0;color:var(--text-muted);font-size:14px;min-width:240px;overflow:hidden;transition:border-color .2s,box-shadow .2s}
.auth-search:focus-within{border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-light)}
.auth-search-hit{display:flex;width:40px;height:40px;flex-shrink:0;align-items:center;justify-content:center;color:var(--text-muted);font-size:14px;border:none;background:none;padding:0 0 0 14px;cursor:default;transition:color .15s}
.auth-search-hit:hover{color:var(--accent)}
.auth-search input{flex:1;min-width:0;background:transparent;border:none;outline:none;font-size:14px;color:var(--text-primary)}
.auth-search-close{display:none;width:32px;height:32px;border-radius:8px;color:var(--text-muted);font-size:14px;align-items:center;justify-content:center;flex-shrink:0;margin-right:4px;transition:background .12s,color .12s,opacity .18s ease,width .32s cubic-bezier(.22,1,.36,1)}
.auth-search-close:hover{background:var(--bg-secondary);color:var(--text-primary)}
.auth-search-res{position:absolute;top:calc(100% + 8px);left:0;right:0;min-width:280px;background:var(--bg-primary);border:1px solid var(--border);border-radius:14px;box-shadow:0 12px 40px rgba(20,30,60,.16);padding:6px;display:none;z-index:20;max-height:340px;overflow-y:auto}
.auth-search-res.show{display:block}
.asr-row{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:10px;text-decoration:none;color:var(--text-primary);cursor:pointer;transition:.12s}
.asr-row:hover{background:var(--bg-secondary)}
.asr-av{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;font-weight:700;color:#fff;background:linear-gradient(135deg,#FFB800,#FF8C00);flex-shrink:0}
.asr-name{font-size:14px;font-weight:600}
.asr-sub{font-size:12px;color:var(--text-muted)}
.asr-empty{padding:14px;text-align:center;color:var(--text-muted);font-size:13px}
.group-name-wrap{position:relative;display:flex;align-items:center;margin-bottom:10px}
.group-name-wrap .modal-input{flex:1;padding-right:44px}
#group-desc{height:auto;min-height:64px;resize:vertical;padding-top:10px}
.group-emoji-btn{position:absolute;right:8px;width:30px;height:30px;border-radius:8px;font-size:18px;background:transparent;transition:.12s}
.group-emoji-btn:hover{background:var(--bg-secondary)}
.group-emoji-pop{position:absolute;top:calc(100% + 6px);right:0;z-index:30;background:var(--bg-primary);border:1px solid var(--border);border-radius:14px;box-shadow:0 12px 40px rgba(20,30,60,.16);padding:8px;display:grid;grid-template-columns:repeat(6,1fr);gap:2px;width:248px}
.group-emoji-pop[hidden]{display:none}
.group-emoji-pop button{width:36px;height:36px;border-radius:8px;font-size:20px;transition:.1s}
.group-emoji-pop button:hover{background:var(--bg-secondary)}
.group-link-row{display:flex;flex-direction:column;margin-top:4px}
.group-link-row[hidden]{display:none!important}
.group-private-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:10px;padding:12px 14px;background:var(--bg-secondary);border:1px solid var(--border);border-radius:12px;cursor:pointer;user-select:none}
.group-private-text{flex:1;min-width:0;text-align:left}
.group-private-title{display:block;font-size:14px;font-weight:600;color:var(--text-primary)}
.group-private-text small{display:block;margin-top:3px;font-size:12px;color:var(--text-muted);line-height:1.35}
.group-private-row input{width:20px;height:20px;flex-shrink:0;accent-color:var(--accent);cursor:pointer;margin:0}
.auth-cta{background:var(--bg-primary);border:1px solid var(--border-input);border-radius:10px;padding:9px 16px;font-size:14px;font-weight:500;color:var(--text-primary);transition:.15s;flex-shrink:0;white-space:nowrap}
.auth-cta:hover{border-color:var(--accent);color:var(--accent)}
@media(max-width:680px){
  .auth-topbar{padding:10px 12px;justify-content:flex-start}
  .auth-cta{display:none}
  .auth-main{padding:14px 14px 18px}
  .auth-card{box-shadow:0 10px 40px rgba(20,30,60,.12),0 2px 8px rgba(20,30,60,.06)}
  html[data-theme="dark"] .auth-card{box-shadow:0 10px 40px rgba(0,0,0,.45),0 2px 8px rgba(0,0,0,.25)}
  .auth-search-slot{flex:0 0 40px;width:40px;max-width:calc(100vw - 24px);transition:width .36s cubic-bezier(.22,1,.36,1),flex .36s cubic-bezier(.22,1,.36,1)}
  .auth-search-slot.open{flex:1 1 auto;width:calc(100vw - 24px)}
  .auth-search{min-width:0;width:100%;padding:0;gap:0;background:var(--bg-primary);box-shadow:var(--shadow-sm)}
  .auth-search-hit{padding-left:0;color:var(--text-secondary);font-size:16px;cursor:pointer}
  .auth-search-slot.open .auth-search-hit{width:38px;padding-left:12px;font-size:14px;color:var(--text-muted);pointer-events:none}
  .auth-search-slot:not(.open) .auth-search input{flex:0 0 0;width:0;min-width:0;opacity:0;padding:0;margin:0;pointer-events:none}
  .auth-search-slot.open .auth-search input{flex:1 1 auto;opacity:1;padding:0 4px 0 0;pointer-events:auto;transition:opacity .24s ease .12s}
  .auth-search-slot.open .auth-search-close{display:flex;width:32px;opacity:1}
  .auth-search-slot:not(.open) .auth-search-close{display:none;width:0;opacity:0;overflow:hidden;margin:0;padding:0}
  .auth-search-res{min-width:0}
}
.auth-main{flex:1;position:relative;z-index:1;display:flex;overflow-y:auto;padding:20px;background:transparent}
.auth-card{width:100%;max-width:380px;margin:auto;background:var(--bg-primary);border:1px solid var(--border);border-radius:24px;box-shadow:0 12px 48px rgba(20,30,60,.10);padding:34px 30px 30px;text-align:center}
.auth-logo{width:72px;height:72px;border-radius:22%;margin:0 auto 16px;display:grid;place-items:center;overflow:hidden;background:#fff;border:1px solid var(--border);box-shadow:0 8px 22px rgba(15,23,42,.08)}
.auth-logo img{width:100%;height:100%;display:block;object-fit:cover;border-radius:22%}
.auth-card h1{font-size:23px;font-weight:700;margin-bottom:4px}
.auth-card .auth-sub{color:var(--text-secondary);font-size:14px;margin-bottom:22px}
.auth-tabs{display:flex;gap:6px;background:var(--bg-secondary);padding:4px;border-radius:12px;margin-bottom:18px;border:1px solid var(--border)}
.auth-tab{flex:1;padding:9px;border-radius:9px;color:var(--text-secondary);font-size:14px;font-weight:500;transition:.15s;border:1px solid transparent}
.auth-tab.active{background:var(--bg-primary);color:var(--text-primary);box-shadow:var(--shadow-sm);border-color:var(--border)}
.auth-form{display:none;flex-direction:column;gap:12px}
.auth-form.active{display:flex}
#login-credentials{display:flex;flex-direction:column;gap:12px}
.auth-form input{width:100%;height:48px;background:var(--bg-secondary);border:1.5px solid transparent;border-radius:12px;padding:0 16px;font-size:15px;transition:border-color .2s,background .2s,box-shadow .2s;text-align:left}
.auth-form input::placeholder{color:var(--text-muted);opacity:1}
.auth-form input:focus{outline:none;background:var(--bg-primary);border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-light)}
.auth-form input:focus::placeholder{color:var(--text-muted);opacity:.65}
.auth-form input.auth-miss:not(.auth-miss-out),.auth-phone.auth-miss:not(.auth-miss-out){border-color:rgba(255,59,48,.52)!important;background:var(--bg-secondary)!important;box-shadow:0 0 0 3px rgba(255,59,48,.1)!important;animation:authMissIn .45s cubic-bezier(.22,1,.36,1) both;transition:border-color .85s ease,box-shadow .85s ease}
.auth-form input.auth-miss:not(.auth-miss-out):focus,.auth-phone.auth-miss:not(.auth-miss-out):focus-within{border-color:rgba(255,59,48,.62)!important;background:var(--bg-primary)!important;box-shadow:0 0 0 4px rgba(255,59,48,.12)!important}
.auth-form input.auth-miss-out,.auth-phone.auth-miss-out{border-color:transparent!important;box-shadow:0 0 0 0 rgba(255,59,48,0)!important;animation:none!important;transition:border-color .85s ease,box-shadow .85s ease}
.auth-form input.auth-miss-out:focus,.auth-phone.auth-miss-out:focus-within{background:var(--bg-primary)!important}
.auth-phone.auth-miss input,.auth-phone.auth-miss-out input{background:transparent!important;border:none!important;box-shadow:none!important}
@keyframes authMissIn{from{border-color:rgba(255,59,48,.1);box-shadow:0 0 0 0 rgba(255,59,48,0)}to{border-color:rgba(255,59,48,.52);box-shadow:0 0 0 3px rgba(255,59,48,.1)}}
.auth-form input[type=date]:required:invalid{color:var(--text-muted)}
.auth-form input[type=date]:required:invalid::-webkit-datetime-edit{opacity:.55}
.auth-submit{height:48px;background:var(--accent);color:#fff;border:1px solid rgba(18,52,96,.18);border-radius:12px;font-size:15px;font-weight:600;transition:.15s;margin-top:4px;box-shadow:inset 0 1px 0 rgba(255,255,255,.22)}
.auth-submit:hover{background:var(--accent-hover);border-color:rgba(18,52,96,.26)}
html[data-theme="dark"] .auth-submit{border-color:rgba(255,255,255,.16);box-shadow:inset 0 1px 0 rgba(255,255,255,.12)}
html[data-theme="dark"] .auth-submit:hover{border-color:rgba(255,255,255,.24)}
.auth-alt{height:46px;background:var(--bg-primary);border:1px solid var(--border-input);border-radius:12px;font-size:14px;font-weight:500;color:var(--text-primary);transition:.15s;margin-top:6px}
.auth-alt:hover{border-color:var(--accent);color:var(--accent)}
.auth-err{color:var(--error);font-size:13px;min-height:18px;margin-top:10px;word-break:break-word;transition:opacity .85s ease,transform .85s ease}
.auth-err:not(:empty){background:rgba(255,59,48,.08);border:1px solid rgba(255,59,48,.2);border-radius:10px;padding:8px 12px;display:flex;align-items:center;gap:6px;animation:authErrIn .4s cubic-bezier(.22,1,.36,1) both}
.auth-err:not(:empty)::before{content:"⚠";font-size:14px}
.auth-err.auth-err-hide{opacity:0;transform:translateY(-6px)}
@keyframes authErrIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes authShake{0%,100%{transform:translateX(0)}12%{transform:translateX(-9px)}24%{transform:translateX(8px)}36%{transform:translateX(-7px)}48%{transform:translateX(6px)}60%{transform:translateX(-4px)}72%{transform:translateX(3px)}}
.auth-card{position:relative}
.auth-theme{position:absolute;top:16px;left:16px;width:38px;height:38px;border-radius:50%;background:var(--bg-secondary);border:1px solid var(--border);color:var(--text-secondary);display:grid;place-items:center;font-size:17px;transition:.15s;cursor:pointer}
.auth-theme:hover{color:var(--accent);border-color:var(--accent)}
.auth-theme::before{content:"🌙";font-size:18px;line-height:1;display:block}
html[data-theme="dark"] .auth-theme::before{content:"☀️"}
.auth-ic{display:inline-flex;align-items:center;justify-content:center;line-height:1;flex-shrink:0}
.auth-ic svg{display:block;flex-shrink:0}
.auth-search-hit .auth-ic-search{color:var(--text-muted);width:18px;height:18px}
.auth-search-hit:hover .auth-ic-search{color:var(--accent)}
.auth-search-close .auth-ic{font-size:14px;font-weight:700}
.login-2fa-badge .auth-ic{font-size:22px}
.auth-success-icon .auth-ic{font-size:30px;font-weight:800}
.ban-auth-icon .auth-ic{font-size:30px}
.auth-row{display:flex;gap:10px}
.auth-row input{flex:1;min-width:0}
.auth-flabel{text-align:left;font-size:12px;color:var(--text-muted);margin:2px 0 -6px 2px;display:flex;align-items:center;gap:6px}
.auth-gender{display:flex;gap:8px}
.auth-gender button{flex:1;height:44px;border-radius:11px;background:var(--bg-secondary);border:1px solid var(--border);color:var(--text-secondary);font-size:13px;font-weight:500;transition:.15s;display:flex;align-items:center;justify-content:center;gap:6px}
.auth-gender button.active{background:var(--accent-light);border-color:var(--accent);color:var(--accent)}
.auth-gender-ic{font-size:20px;line-height:1;flex-shrink:0}
.auth-gender button.active .auth-gender-ic{filter:none}
.auth-contact-tabs{display:flex;gap:6px;background:var(--bg-secondary);padding:4px;border-radius:11px;border:1px solid var(--border)}
.auth-contact-tabs button{flex:1;padding:8px;border-radius:8px;color:var(--text-secondary);font-size:13px;font-weight:500;transition:.15s;border:1px solid transparent}
.auth-contact-tabs button.active{background:var(--bg-primary);color:var(--text-primary);box-shadow:var(--shadow-sm);border-color:var(--border)}
.auth-phone{display:flex;align-items:center;gap:8px;width:100%;background:var(--bg-secondary);border:1.5px solid transparent;border-radius:12px;padding:0 12px;transition:border-color .2s,background .2s,box-shadow .2s}
.auth-phone:focus-within{background:var(--bg-primary);border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-light)}
.auth-flag{font-size:22px;line-height:1;flex-shrink:0;width:28px;text-align:center;display:flex;align-items:center;justify-content:center}
.auth-flag-inner{display:inline-flex;align-items:center;justify-content:center;width:28px;height:20px;flex-shrink:0}
.auth-flag-img{display:block;width:24px;height:18px;object-fit:cover;border-radius:3px;box-shadow:0 0 0 1px rgba(0,0,0,.06)}
.auth-flag-emoji{display:none;font-size:22px;line-height:1}
.auth-flag-inner.is-emoji .auth-flag-img{display:none}
.auth-flag-inner.is-emoji .auth-flag-emoji{display:block}
.auth-phone.auth-phone-empty .auth-flag{display:none}
.auth-phone.auth-phone-empty{gap:0}
.login-2fa-step{text-align:center;margin-bottom:4px}
.login-2fa-badge{width:52px;height:52px;margin:0 auto 12px;border-radius:16px;display:grid;place-items:center;font-size:22px;color:#fff;background:linear-gradient(135deg,#34C759,#3390EC);box-shadow:0 8px 22px rgba(52,199,89,.22)}
.login-2fa-lead{margin:0 0 12px;font-size:13.5px;line-height:1.45;color:var(--text-secondary)}
.login-2fa-code{text-align:center;letter-spacing:5px;font-size:20px;font-weight:700;margin-bottom:10px}
.login-2fa-back{width:100%;margin-top:0}
#login-2fa-step[hidden]+#login-submit,#login-credentials:not([hidden])~#login-submit{margin-top:4px}
.auth-phone input{flex:1;height:46px;background:transparent!important;border:none!important;box-shadow:none!important;padding:0}
.auth-foot{position:relative;z-index:1;text-align:center;padding:18px;color:var(--text-muted);font-size:13px;background:transparent}
.auth-foot a{color:var(--text-muted);text-decoration:none;margin:0 8px}
.auth-foot a:hover{color:var(--accent)}

.auth-success-card{position:relative;overflow:visible;max-width:360px;width:100%;background:var(--bg-primary);border:1px solid var(--border);border-radius:24px;padding:34px 28px 28px;text-align:center;box-shadow:0 16px 56px rgba(20,30,60,.16)}
html[data-theme="dark"] .auth-success-card{box-shadow:0 16px 56px rgba(0,0,0,.45)}
.auth-success-icon{width:68px;height:68px;border-radius:50%;background:linear-gradient(135deg,rgba(52,199,89,.2),rgba(52,199,89,.08));color:#34C759;display:grid;place-items:center;font-size:30px;margin:0 auto 18px;animation:authSuccessPop .7s cubic-bezier(.22,1,.36,1) .42s both}
.auth-success-card h2{font-size:21px;font-weight:700;margin-bottom:8px;line-height:1.3}
.auth-success-card p{color:var(--text-secondary);font-size:14px;line-height:1.5;margin-bottom:22px}
.auth-success-card .auth-submit{width:100%;margin-top:0}
@keyframes authSuccessPop{from{opacity:0;transform:scale(.55)}to{opacity:1;transform:none}}
.reg-success-stage{position:relative;display:grid;place-items:center}
.reg-success-stage .auth-success-card{position:relative;z-index:2}
.reg-success-confetti{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:0;pointer-events:none;overflow:visible}
.auth-success-card .auth-success-icon,
.auth-success-card h2,
.auth-success-card p,
.auth-success-card .auth-submit{position:relative;z-index:2}
#reg-success-modal.modal-overlay{z-index:400}

/* Install reuse */
.install-fieldset{text-align:left;border:1px solid var(--border);border-radius:14px;padding:14px 16px;margin-bottom:14px}
.install-fieldset legend{padding:0 6px;color:var(--text-muted);font-size:12px;text-transform:uppercase;letter-spacing:.08em}
.install-fieldset label{display:block;margin:8px 0;font-size:13px;color:var(--text-secondary)}
.install-fieldset input{margin-top:4px}

/* ===================== AUTH BAN MODAL ===================== */
.ban-auth-card{max-width:380px;width:100%;background:var(--bg-primary);border:1px solid rgba(229,57,53,.22);border-radius:24px;padding:32px 26px 26px;text-align:center;box-shadow:0 18px 60px rgba(229,57,53,.14),0 8px 28px rgba(20,30,60,.1)}
html[data-theme="dark"] .ban-auth-card{box-shadow:0 18px 60px rgba(229,57,53,.22),0 8px 28px rgba(0,0,0,.45)}
.ban-auth-icon{width:72px;height:72px;border-radius:50%;background:linear-gradient(135deg,rgba(229,57,53,.22),rgba(255,107,53,.1));color:#E53935;display:grid;place-items:center;font-size:30px;margin:0 auto 16px;box-shadow:0 0 0 8px rgba(229,57,53,.08);animation:authSuccessPop .5s cubic-bezier(.22,1,.36,1) .08s both}
.ban-auth-card h2{font-size:21px;font-weight:800;margin-bottom:6px;color:var(--text-primary)}
.ban-auth-lead{color:var(--text-secondary);font-size:14px;line-height:1.45;margin-bottom:16px}
.ban-auth-box{text-align:left;background:var(--bg-secondary);border:1.5px solid var(--border);border-radius:16px;overflow:hidden;margin-bottom:20px}
.ban-auth-row{display:flex;gap:10px;padding:12px 14px;border-bottom:1px solid var(--border);font-size:14px;line-height:1.35}
.ban-auth-row:last-child{border-bottom:none}
.ban-auth-row .k{color:var(--text-muted);min-width:72px;flex-shrink:0}
.ban-auth-row .v{font-weight:700;color:var(--text-primary);word-break:break-word}
.ban-auth-ok{background:linear-gradient(135deg,#FF6B35,#E53935)!important;margin-top:0!important;width:100%}
#ban-modal-auth.modal-overlay{z-index:410}