body.gx-auth{
  min-height:100svh;
  display:flex;
  flex-direction:column;
  overflow-x:clip;
  background:
    radial-gradient(90rem 42rem at 50% -20rem,rgba(200,255,0,.09),transparent 58%),
    radial-gradient(48rem 26rem at 100% 100%,rgba(118,118,255,.045),transparent 66%),
    #0a0a0b;
  font-family:Geist,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
body.gx-auth::before{
  background:
    radial-gradient(40rem 26rem at 50% 0,rgba(255,255,255,.035),transparent 70%),
    linear-gradient(180deg,rgba(255,255,255,.018),transparent 19rem);
  mask:none;
  -webkit-mask-image:none;
}
body.gx-auth nav{
  position:relative;
  z-index:1;
  min-height:64px;
  padding:0 clamp(20px,4vw,52px);
  background:rgba(10,10,11,.78);
  border-bottom:1px solid rgba(255,255,255,.07);
  backdrop-filter:blur(20px) saturate(120%);
  -webkit-backdrop-filter:blur(20px) saturate(120%);
}
body.gx-auth .nav-brand{gap:10px}
body.gx-auth .nav-brand svg{width:24px;height:24px}
body.gx-auth .nav-word{
  font-family:Geist,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-size:15px;
  font-weight:700;
  letter-spacing:-.025em;
}
body.gx-auth .nav-back{
  font-family:Geist,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-size:13px;
  font-weight:500;
  letter-spacing:0;
  text-transform:none;
  color:var(--text-dim);
  transition:color .12s ease;
}
body.gx-auth .nav-back:hover{color:var(--text)}
body.gx-auth .wrap{
  position:relative;
  z-index:1;
  flex:1;
  width:min(100%,520px);
  margin:0 auto;
  padding:clamp(64px,10vh,112px) 24px 48px;
}
body.gx-auth.gx-auth-signup .wrap{width:min(100%,652px);padding-top:clamp(52px,8vh,88px)}
body.gx-auth .head{margin-bottom:32px}
body.gx-auth .head h1{
  max-width:9ch;
  margin:0 auto 12px;
  font-size:clamp(40px,5vw,58px);
  font-weight:650;
  letter-spacing:-.055em;
  line-height:1.02;
}
body.gx-auth .head h1 em{color:var(--text);font-family:inherit;font-style:normal;font-weight:inherit}
body.gx-auth .head p{
  max-width:36rem;
  margin:0 auto;
  font-family:inherit;
  font-size:15px;
  letter-spacing:0;
  line-height:1.5;
  color:var(--text-dim);
}
body.gx-auth .card{
  background:linear-gradient(145deg,rgba(29,29,34,.88),rgba(16,16,19,.88));
  border:1px solid rgba(255,255,255,.1);
  border-radius:18px;
  box-shadow:0 24px 56px rgba(0,0,0,.26),inset 0 1px 0 rgba(255,255,255,.035);
  backdrop-filter:blur(18px) saturate(115%);
  -webkit-backdrop-filter:blur(18px) saturate(115%);
}
body.gx-auth .card-body{padding:clamp(24px,4vw,34px)}
body.gx-auth .field{gap:7px;margin-bottom:17px}
body.gx-auth .field label{
  font-family:inherit;
  font-size:13px;
  font-weight:550;
  letter-spacing:0;
  text-transform:none;
  color:var(--text-dim);
}
body.gx-auth .field input,
body.gx-auth .field select{
  min-height:50px;
  padding:12px 14px;
  border:1px solid rgba(255,255,255,.13);
  border-radius:11px;
  background:rgba(6,6,8,.58);
  color:var(--text);
  font-family:inherit;
  font-size:15px;
  line-height:1.3;
  transition:border-color .12s ease,background .12s ease,box-shadow .12s ease;
}
body.gx-auth .field input:hover,
body.gx-auth .field select:hover{border-color:rgba(255,255,255,.23);background:rgba(6,6,8,.74)}
body.gx-auth .field input:focus,
body.gx-auth .field select:focus{
  border-color:rgba(200,255,0,.72);
  box-shadow:0 0 0 4px rgba(200,255,0,.1);
}
body.gx-auth .field input::placeholder{color:#777781}
body.gx-auth .pwd-wrap input{padding-right:70px}
body.gx-auth .pwd-toggle{
  right:12px;
  border-radius:7px;
  color:var(--text-dim);
  font-family:inherit;
  font-size:12px;
  font-weight:600;
  letter-spacing:0;
  text-transform:none;
}
body.gx-auth .pwd-toggle:hover{color:var(--text);background:rgba(255,255,255,.06)}
body.gx-auth .btn{
  min-height:50px;
  margin-top:8px;
  border-radius:11px;
  padding:12px 18px;
  color:#10110b;
  font-family:inherit;
  font-size:15px;
  font-weight:650;
  letter-spacing:-.01em;
  text-transform:none;
  transition:background .12s ease,opacity .12s ease,box-shadow .12s ease;
}
body.gx-auth .btn:hover:not(:disabled){
  transform:none;
  background:#d4ff2b;
  box-shadow:0 8px 24px rgba(200,255,0,.14);
}
body.gx-auth .err{font-family:inherit;font-size:13px;line-height:1.45}
body.gx-auth .alt{
  margin-top:22px;
  font-family:inherit;
  font-size:13px;
  letter-spacing:0;
  color:var(--text-dim);
}
body.gx-auth .alt a{color:var(--text);font-weight:600}
body.gx-auth .alt a:hover{color:var(--accent)}
body.gx-auth .pull{
  margin:0 0 24px;
  padding:11px 13px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:10px;
  background:rgba(255,255,255,.025);
  color:var(--text-dim);
  font-family:inherit;
  font-size:13px;
  font-style:normal;
  line-height:1.5;
}
body.gx-auth footer{
  position:relative;
  z-index:1;
  padding:24px 28px 30px;
  border:0;
  color:var(--text-faint);
  font-family:inherit;
  font-size:12px;
  letter-spacing:0;
}
body.gx-auth footer a{color:var(--text-dim)}
body.gx-auth footer a:hover{color:var(--text)}
body.gx-auth :focus-visible{outline:2px solid rgba(200,255,0,.76);outline-offset:3px}

@media (max-width:720px){
  body.gx-auth nav{min-height:58px;padding:0 20px}
  body.gx-auth .wrap{padding:52px 18px 34px}
  body.gx-auth.gx-auth-signup .wrap{padding-top:36px}
  body.gx-auth .head{margin-bottom:26px}
  body.gx-auth .head h1{font-size:42px}
  body.gx-auth .field-row{gap:0}
}

@media (prefers-reduced-motion:reduce){
  body.gx-auth *,body.gx-auth *::before,body.gx-auth *::after{transition:none!important;animation:none!important}
}
