.register-fields{display:none}
.login-fields{display:block}
.modal.register .login-fields{display:none}
.login-banner{height:175px;margin:-33px -33px 28px;position:relative;overflow:hidden;border-radius:21px 21px 0 0;background:linear-gradient(135deg,#07182e,#164873);display:flex;align-items:center;justify-content:center;gap:17px;border-bottom:1px solid rgba(245,195,91,.4)}
.modal.register .login-banner{display:none}
.login-banner::before{content:"";position:absolute;inset:0;background:url("assets/hero.webp") center 35%/cover;opacity:.28}
.login-banner-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(2,12,28,.82),rgba(6,29,54,.45),rgba(2,12,28,.82))}
.login-banner img{width:72px;height:72px;object-fit:cover;border-radius:22px;border:1px solid var(--gold);position:relative;box-shadow:0 12px 30px rgba(0,0,0,.35)}
.login-banner div:last-child{position:relative}.login-banner b,.login-banner span{display:block}.login-banner b{font-size:26px;color:#fff;letter-spacing:2px}.login-banner span{font-size:10px;color:var(--gold);letter-spacing:2.5px;margin-top:6px}
.modal:not(.register){width:min(100%,560px);background:#0a1423}
.modal:not(.register) .modal-brand{display:none}.modal:not(.register) #modalKicker{display:block;text-align:center}.modal:not(.register) #modalTitle,.modal:not(.register)>p{text-align:center}
.modal.register{width:min(100%,570px);max-height:calc(100vh - 34px);overflow:auto}
.modal.register .register-fields{display:block}
.modal.register .name-field{display:none!important}
.uid-label>small{display:block;margin-top:7px;color:#8f9db1;font-size:11px;line-height:1.5}
.uid-label a{color:var(--gold);text-decoration:none}
.uid-label a:hover{text-decoration:underline}
.uid-row{display:grid;grid-template-columns:1fr 92px;gap:9px;align-items:end}
.uid-row input{min-width:0}
.uid-row button{height:47px;border:1px solid rgba(245,195,91,.45);border-radius:10px;background:rgba(245,195,91,.18);color:var(--gold);font-weight:800}
.uid-row button.checked{background:var(--gold);color:#15100a}
.uid-status{display:block;min-height:15px;margin-top:5px;font-size:10px;color:#62d7a6}
.password-wrap{display:block;position:relative}
.password-wrap input{padding-right:48px}
.password-toggle{position:absolute;right:4px;top:11px;width:40px;height:40px;border:0;background:transparent;color:#6f8098;display:grid;place-items:center;padding:0}
.password-toggle svg{width:27px;height:27px;display:block;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.password-toggle .eye-open{display:none}
.password-toggle .eye-closed{display:block}
.password-toggle.showing .eye-open{display:block}
.password-toggle.showing .eye-closed{display:none}
.auth-switch{width:100%;border:0;background:none;color:#8898ac;margin:17px 0 0;font-size:12px}
.auth-switch b{color:var(--gold)}
.forgot-password{display:block;margin:-4px 0 4px auto;border:0;background:none;color:var(--gold);font-size:12px;font-weight:700}
.field-error{display:block;min-height:17px;margin-top:7px;padding-left:2px;color:#ff646d;font-size:12px;font-weight:600;line-height:1.35;letter-spacing:.1px}
.field-error:not(:empty)::before{content:"!";display:inline-grid;place-items:center;width:15px;height:15px;margin-right:6px;border-radius:50%;background:#ff525d;color:#fff;font-size:10px;font-weight:900;vertical-align:1px}
.modal input.invalid{border-color:#ff5964;box-shadow:0 0 0 3px rgba(255,71,82,.11)}
@media(max-width:600px){.modal.register{max-height:calc(100vh - 18px)}.uid-row{grid-template-columns:1fr 74px}.login-banner{height:145px;margin:-25px -20px 24px}.login-banner img{width:58px;height:58px}.login-banner b{font-size:21px}}

/* Full-page login and registration */
body.auth-open{overflow-x:hidden;overflow-y:auto}
body.auth-open .app-shell main{display:none}
body.auth-open .bottom-nav{display:grid!important}
body.auth-open .floating-chat{display:none!important}
body.auth-open::before{
  content:"";
  position:fixed;
  z-index:19;
  inset:0;
  background:#141414;
  pointer-events:none;
}
#authModal{
  position:absolute;
  top:86px;
  bottom:auto;
  left:50%;
  right:auto;
  width:min(100%,810px);
  height:calc(100vh - 86px);
  min-height:0;
  padding:0;
  transform:translateX(-50%);
  background:#141414;
  backdrop-filter:none;
  overflow:visible;
  place-items:start stretch;
  z-index:25;
}
#authModal.open{display:grid}
#authModal .modal,
#authModal .modal.register,
#authModal .modal:not(.register){
  width:100%;
  min-height:100%;
  max-height:none;
  margin:0;
  padding:48px 42px 145px;
  overflow:visible;
  border:0;
  border-radius:0;
  background:#141414;
  box-shadow:none;
}
#authModal .login-banner,
#authModal .modal-brand,
#authModal #modalKicker,
#authModal #modalSubtitle,
#authModal .legal,
#authModal .modal-close{display:none!important}
#authModal #modalTitle{
  margin:0 0 30px;
  color:#f2bd50;
  font-size:36px;
  line-height:1.15;
  text-align:center;
  letter-spacing:-.5px;
}
#authModal form{width:100%}
#authModal .modal label{
  margin:18px 0;
  color:#fff;
  font-size:20px;
}
#authModal .modal input{
  min-height:67px;
  margin-top:11px;
  padding:17px 21px;
  border:1px solid #4b5a70;
  border-radius:10px;
  background:#202b3b;
  color:#fff;
  font-size:22px;
}
#authModal .modal input::placeholder{color:#a9b2c1}
#authModal .uid-label>small{
  margin-top:9px;
  font-size:19px;
  line-height:1.5;
}
#authModal .uid-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) 78px;
  gap:10px;
}
#authModal #checkUid{
  display:block;
  align-self:end;
  min-width:78px;
  padding:0 14px;
  border:1px solid #efbd42;
  background:#efbd42;
  color:#fff!important;
  font-family:inherit!important;
  font-weight:400!important;
  box-shadow:none;
}
#authModal .uid-row,
#authModal .contact-method-field{
  position:relative;
}
#authModal #uidInput,
#authModal #emailInput{
  padding-right:58px!important;
}
#authModal .uid-row::after,
#authModal .contact-method-field::after{
  content:"\2713";
  position:absolute;
  z-index:3;
  right:104px;
  display:grid;
  place-items:center;
  width:28px;
  height:28px;
  border:1px solid rgba(168,255,216,.72);
  border-radius:50%;
  background:linear-gradient(145deg,#38db99,#159762);
  color:#fff;
  font-size:18px;
  font-weight:900;
  line-height:1;
  box-shadow:0 0 0 3px rgba(42,206,137,.12),0 0 14px rgba(42,225,151,.45);
  opacity:0;
  transform:scale(.72);
  transition:opacity .18s ease,transform .18s ease;
  pointer-events:none;
}
#authModal .uid-row[data-state="missing"]::after,
#authModal .uid-row[data-state="support"]::after,
#authModal .uid-row[data-state="registered"]::after{
  content:"\00d7";
  border-color:#ff5964;
  background:#202b3b;
  color:#ff5964;
  font-size:22px;
  font-weight:400;
  box-shadow:0 0 0 3px rgba(255,82,93,.10),0 0 14px rgba(255,82,93,.28);
  opacity:1;
  transform:scale(1);
}
#authModal .uid-row[data-state="registered"]::after{
  content:"!";
  font-size:17px;
}
#authModal .uid-row[data-state="success"]::after{
  opacity:1;
  transform:scale(1);
}
#authModal .uid-row[data-state="missing"] #uidInput,
#authModal .uid-row[data-state="support"] #uidInput,
#authModal .uid-row[data-state="registered"] #uidInput{
  border-color:#ff5964!important;
  box-shadow:inset 0 0 0 1px rgba(255,82,93,.10),0 0 14px rgba(255,82,93,.08);
}
#authModal .verification-locked input[readonly]{
  cursor:not-allowed;
  border-color:rgba(72,222,154,.72);
  box-shadow:inset 0 0 0 1px rgba(72,222,154,.08),0 0 15px rgba(42,206,137,.08);
}
#authModal .verification-locked .contact-method-tabs button{
  cursor:not-allowed;
}
#authModal .uid-row::after{
  top:50%;
  margin-top:-14px;
}
#authModal .contact-method-field::after{
  bottom:20px;
}
#authModal #authForm:has(#checkUid.checked) .contact-method-field::after{
  opacity:1;
  transform:scale(1);
}
#authModal .uid-row button{
  height:67px;
  border-radius:10px;
  font-size:20px;
}
#authModal .uid-row button:disabled{
  cursor:not-allowed;
  opacity:.72;
}
#authModal .password-toggle{
  top:18px;
  right:10px;
}
#authModal .gold-btn.wide{
  min-height:58px;
  margin-top:22px;
  font-size:22px;
}
#authModal #submitAuth,
#authModal #checkUid{
  color:#fff!important;
  font-family:inherit!important;
  font-style:normal!important;
  font-weight:400!important;
  letter-spacing:.2px;
}
#authModal .auth-switch{margin-top:18px;font-size:22px}
#authModal .forgot-password{font-size:18px}
#authModal .field-error:empty,
#authModal .uid-status:empty{display:none}
#authModal .field-error,
#authModal .uid-status{
  font-size:16px;
  line-height:1.45;
}
#authModal .field-error:not(:empty)::before{
  width:17px;
  height:17px;
  font-size:11px;
}
#authModal .uid-row[data-state="missing"] + .uid-status:not(:empty),
#authModal .uid-row[data-state="registered"] + .uid-status:not(:empty){
  padding-left:2px;
  color:#ff646d!important;
  font-weight:600;
  letter-spacing:.1px;
}
#authModal .uid-row[data-state="success"] + .uid-status:not(:empty){
  color:#62d7a6!important;
  font-weight:400;
}
#authModal .uid-row[data-state="support"] + .uid-status:not(:empty){
  padding-left:2px;
  color:#fff!important;
  font-weight:400;
  letter-spacing:.1px;
}

/* Registration now verifies only the Winbox UID. */
#authModal .modal.register .contact-method-field{
  display:none!important;
}

.uid-support-overlay{
  display:none;
  position:fixed;
  z-index:1200;
  inset:0;
  place-items:center;
  padding:22px;
  background:rgba(2,9,18,.78);
  backdrop-filter:blur(11px);
}
.uid-support-overlay.is-open{display:grid}
.uid-support-card{
  position:relative;
  width:min(92vw,460px);
  overflow:hidden;
  padding:34px 30px 28px;
  border:1px solid rgba(232,178,57,.58);
  border-radius:20px;
  background:linear-gradient(155deg,#18263a 0%,#0c1625 58%,#080f1a 100%);
  color:#fff;
  text-align:center;
  box-shadow:0 28px 80px rgba(0,0,0,.58),inset 0 1px 0 rgba(255,255,255,.07),0 0 30px rgba(224,161,36,.13);
}
.uid-support-card::before{
  content:"";
  position:absolute;
  top:0;
  left:12%;
  width:76%;
  height:2px;
  background:linear-gradient(90deg,transparent,#f4c657,transparent);
}
.uid-support-icon{
  display:grid;
  place-items:center;
  width:54px;
  height:54px;
  margin:0 auto 17px;
  border:1px solid #ff5964;
  border-radius:50%;
  background:rgba(255,74,87,.10);
  color:#ff6670;
  font-size:29px;
  font-weight:400;
  box-shadow:0 0 0 7px rgba(255,74,87,.05),0 0 24px rgba(255,74,87,.18);
}
.uid-support-kicker{
  color:#e7b447;
  font-size:11px;
  font-weight:600;
  letter-spacing:2.2px;
}
.uid-support-card h3{
  margin:8px 0 10px;
  color:#fff;
  font-size:25px;
  font-weight:600;
}
.uid-support-card p{
  margin:0;
  color:#b9c3d2;
  font-size:15px;
  line-height:1.75;
}
.uid-support-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:11px;
  margin-top:25px;
}
.uid-support-actions button,
.uid-support-actions a{
  min-height:48px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:11px;
  font-family:inherit;
  font-size:14px;
  font-weight:500;
  text-decoration:none;
}
.uid-support-actions button{
  border:1px solid #42516a;
  background:#192538;
  color:#d8dfeb;
}
.uid-support-actions a{
  border:1px solid #e7b447;
  background:linear-gradient(120deg,#c9891f,#e7b447 50%,#d4992d);
  color:#fff;
  box-shadow:0 8px 20px rgba(210,151,37,.20);
}

@media(max-width:600px){
  body.auth-open{min-height:100dvh!important}
  #authModal{top:72px;bottom:auto;height:calc(100dvh - 72px);min-height:0;overflow:auto}
  #authModal .modal,
  #authModal .modal.register,
  #authModal .modal:not(.register){min-height:0;padding:30px 20px 110px}
  #authModal #modalTitle{margin-bottom:25px;font-size:30px}
  #authModal .modal label{margin:17px 0;font-size:15px}
  #authModal .modal input{min-height:54px;padding:14px 15px;font-size:15px}
  #authModal .uid-label>small{font-size:12px}
  #authModal .uid-row{grid-template-columns:minmax(0,1fr) 68px;gap:8px}
  #authModal .uid-row::after{right:90px}
  #authModal .contact-method-field::after{right:14px;bottom:14px}
  #authModal .uid-row button{height:54px;min-width:68px;padding:0 10px;font-size:13px}
  #authModal .password-toggle{top:11px;right:5px}
  #authModal .gold-btn.wide{font-size:18px}
  #authModal .auth-switch{font-size:15px}
  #authModal .forgot-password{font-size:15px}
  #authModal .field-error,
  #authModal .uid-status{font-size:14px}
  .uid-support-card{padding:30px 21px 22px;border-radius:17px}
  .uid-support-card h3{font-size:22px}
  .uid-support-card p{font-size:14px}
  .uid-support-actions{grid-template-columns:1fr}
}

/* AUTH_BOTTOM_NAV_FINAL_V1 */
body.auth-open .app-shell{min-height:100dvh!important;padding-bottom:118px!important;background:#141414!important}
body.auth-open .bottom-nav{display:grid!important;position:fixed!important;z-index:80!important;left:50%!important;right:auto!important;bottom:0!important;transform:translateX(-50%)!important;width:min(100%,810px)!important;max-width:810px!important;height:118px!important;margin:0!important}
body.auth-open #authModal .modal,body.auth-open #authModal .modal.register,body.auth-open #authModal .modal:not(.register){padding-bottom:145px!important}
@media(max-width:600px){body.auth-open .app-shell{padding-bottom:calc(76px + env(safe-area-inset-bottom))!important}body.auth-open .bottom-nav{left:0!important;right:0!important;transform:none!important;width:100%!important;max-width:none!important;height:calc(76px + env(safe-area-inset-bottom))!important}body.auth-open #authModal .modal,body.auth-open #authModal .modal.register,body.auth-open #authModal .modal:not(.register){padding-bottom:calc(100px + env(safe-area-inset-bottom))!important}}

/* AUTH_BOTTOM_NAV_FINAL_V2 */
body.auth-open .app-shell{display:block!important;min-height:100dvh!important;padding-bottom:118px!important;background:#141414!important}
body.auth-open .bottom-nav{display:grid!important;visibility:visible!important;opacity:1!important;position:fixed!important;z-index:999!important;left:50%!important;right:auto!important;bottom:0!important;top:auto!important;transform:translateX(-50%)!important;width:min(100%,810px)!important;max-width:810px!important;height:118px!important;margin:0!important;background:#071c38!important}
body.auth-open #authModal .modal,body.auth-open #authModal .modal.register,body.auth-open #authModal .modal:not(.register){padding-bottom:145px!important}
@media(max-width:600px){body.auth-open .app-shell{padding-bottom:calc(76px + env(safe-area-inset-bottom))!important}body.auth-open .bottom-nav{left:0!important;right:0!important;transform:none!important;width:100%!important;max-width:none!important;height:calc(76px + env(safe-area-inset-bottom))!important}body.auth-open #authModal .modal,body.auth-open #authModal .modal.register,body.auth-open #authModal .modal:not(.register){padding-bottom:calc(100px + env(safe-area-inset-bottom))!important}}

/* AUTH_BOTTOM_NAV_FINAL_V3 */
html body.auth-open:has(#authModal.open) .app-shell .bottom-nav{display:grid!important;visibility:visible!important;opacity:1!important;position:fixed!important;z-index:999!important;left:50%!important;right:auto!important;bottom:0!important;top:auto!important;transform:translateX(-50%)!important;width:min(100%,810px)!important;max-width:810px!important;height:118px!important;margin:0!important;background:#071c38!important}
@media(max-width:600px){html body.auth-open:has(#authModal.open) .app-shell .bottom-nav{left:0!important;right:0!important;transform:none!important;width:100%!important;max-width:none!important;height:calc(76px + env(safe-area-inset-bottom))!important}}

/* UID_VERIFY_CENTER_ALIGNMENT_V1 */
#authModal #checkUid{
  display:grid!important;
  place-items:center!important;
  box-sizing:border-box!important;
  text-align:center!important;
  line-height:1!important;
}
#authModal .uid-row::after,
#authModal .contact-method-field::after{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  box-sizing:border-box!important;
  padding:0!important;
  text-align:center!important;
  line-height:1!important;
  font-family:Arial,sans-serif!important;
}
