/* NineConnect Web v47 — full image left, one login frame right */
#authGate{
  overflow:auto!important;
  background:#020814!important;
}
.login-shell{
  min-height:100vh!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(560px,1fr)!important;
  overflow:hidden!important;
  background:
    radial-gradient(circle at 12% 58%,rgba(0,157,255,.12),transparent 30%),
    radial-gradient(circle at 88% 12%,rgba(0,99,220,.14),transparent 32%),
    linear-gradient(135deg,#020813 0%,#06182c 55%,#020813 100%)!important;
}

/* LEFT: never crop the vehicle image */
.login-visual{
  display:block!important;
  position:relative!important;
  width:auto!important;
  min-width:0!important;
  height:100vh!important;
  min-height:100vh!important;
  overflow:hidden!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  background:
    radial-gradient(circle at 50% 58%,rgba(0,145,255,.13),transparent 40%),
    linear-gradient(180deg,#020915 0%,#041426 19%,#03101e 100%)!important;
  isolation:isolate!important;
}
.login-visual::before{
  content:""!important;
  display:block!important;
  position:absolute!important;
  left:0!important;
  right:0!important;
  bottom:0!important;
  height:82%!important;
  background:url('assets/hero-clean-v45.png') center bottom / 100% auto no-repeat!important;
  filter:saturate(1.12) contrast(1.04)!important;
  z-index:0!important;
}
.login-visual::after{
  content:""!important;
  display:block!important;
  position:absolute!important;
  inset:0!important;
  background:
    linear-gradient(180deg,rgba(2,8,18,.04) 0%,rgba(2,8,18,.08) 28%,rgba(2,8,18,.12) 65%,rgba(2,8,18,.25) 100%),
    radial-gradient(circle at 50% 45%,transparent 0%,rgba(0,8,20,.10) 65%,rgba(0,5,14,.30) 100%)!important;
  z-index:1!important;
  pointer-events:none!important;
}
.login-scene-overlay,.login-glow{display:none!important}

.login-logo-v40{
  display:block!important;
  position:absolute!important;
  left:50%!important;
  top:42px!important;
  transform:translateX(-50%)!important;
  width:min(560px,72%)!important;
  margin:0!important;
  z-index:4!important;
  filter:drop-shadow(0 10px 30px rgba(0,0,0,.35))!important;
}
.login-logo-v40 img{
  display:block!important;
  width:100%!important;
  border-radius:22px!important;
  mix-blend-mode:screen!important;
}

.login-copy{
  display:block!important;
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  transform:translate(-50%,-5%)!important;
  width:86%!important;
  max-width:760px!important;
  margin:0!important;
  text-align:center!important;
  z-index:4!important;
}
.login-kicker{display:none!important}
.login-copy h1{
  margin:0!important;
  font-size:clamp(3rem,5.2vw,5.5rem)!important;
  line-height:.96!important;
  letter-spacing:-.055em!important;
  text-shadow:0 10px 35px rgba(0,0,0,.48)!important;
}
.login-copy h1 em{
  font-style:normal!important;
  background:linear-gradient(90deg,#eaf8ff 0%,#22d3f4 45%,#1681ff 100%)!important;
  -webkit-background-clip:text!important;
  background-clip:text!important;
  color:transparent!important;
}

/* RIGHT: only one real frame */
.login-panel{
  display:grid!important;
  place-items:center!important;
  position:relative!important;
  width:auto!important;
  min-width:0!important;
  height:100vh!important;
  min-height:100vh!important;
  padding:24px clamp(24px,3vw,62px)!important;
  margin:0!important;
  background:linear-gradient(180deg,rgba(2,12,25,.20),rgba(1,8,18,.55))!important;
  transform:none!important;
  left:auto!important;
  right:auto!important;
  top:auto!important;
  z-index:3!important;
}
.login-panel::before,.login-panel::after{display:none!important;content:none!important}
.login-mobile-brand{display:none!important}
.login-form-wrap{
  width:min(720px,100%)!important;
  max-height:94vh!important;
  overflow:auto!important;
  margin:0!important;
  padding:28px 34px 22px!important;
  box-sizing:border-box!important;
  border:1px solid rgba(30,184,255,.58)!important;
  outline:0!important;
  border-radius:34px!important;
  background:linear-gradient(180deg,rgba(4,18,37,.92),rgba(2,11,24,.96))!important;
  box-shadow:0 28px 75px rgba(0,0,0,.42),inset 0 0 42px rgba(0,96,180,.055)!important;
  backdrop-filter:blur(14px)!important;
  scrollbar-width:thin!important;
}
.login-form-wrap::before,.login-form-wrap::after{display:none!important;content:none!important}

.auth-tabs{
  max-width:none!important;
  margin:0 0 30px!important;
  padding:7px!important;
  border-radius:20px!important;
  background:rgba(0,10,23,.76)!important;
  border:1px solid rgba(255,255,255,.045)!important;
}
.auth-tabs button{padding:14px 16px!important;border-radius:15px!important;font-size:15px!important}
.auth-heading{text-align:center!important;margin-bottom:14px!important}
.auth-heading>span{font-size:.74rem!important;letter-spacing:.18em!important;color:#18d8ff!important}
.auth-heading h2{font-size:clamp(2.2rem,2.8vw,3.05rem)!important;margin:14px 0 10px!important}
.auth-heading p{max-width:92%!important;margin:0 auto!important;font-size:1rem!important;line-height:1.5!important;color:#9ab0c4!important}
.auth-field{margin:16px 0!important;text-align:left!important}
.auth-field>span{font-size:.9rem!important;color:#d4e5f4!important;margin-bottom:9px!important}
.auth-field input{min-height:60px!important;border-radius:18px!important;font-size:1rem!important;background:rgba(1,12,25,.78)!important;border:1px solid rgba(22,174,255,.46)!important}
.auth-field-hint{margin:8px 3px 0!important;font-size:12px!important;color:#8da5bb!important}
.auth-submit{min-height:64px!important;margin-top:20px!important;border-radius:19px!important;font-size:1.08rem!important}
.auth-switch-line{justify-content:center!important;margin-top:20px!important}
.auth-cross-device{margin-top:16px!important;border-radius:18px!important;padding:15px 17px!important}
.auth-cross-device.auth-privacy{display:none!important}
.first-admin-note{margin-top:14px!important}

/* Registration must remain fully usable */
.registration-vehicle-setup,.vehicle-config-card,.vehicle-config-ebike,.register-section-title,.registration-two-col,.mode-editor-head,.register-mode-list{text-align:left!important}
.vehicle-choice-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:10px!important}
.vehicle-choice{min-height:86px!important}

@media (max-width:1250px){
  .login-shell{grid-template-columns:minmax(0,.92fr) minmax(520px,1.08fr)!important}
  .login-logo-v40{width:min(480px,72%)!important}
  .login-copy h1{font-size:clamp(2.7rem,5vw,4.7rem)!important}
  .login-form-wrap{padding:24px 28px 18px!important}
}

@media (max-width:930px){
  .login-shell{display:block!important;overflow:auto!important}
  .login-visual{height:440px!important;min-height:440px!important}
  .login-visual::before{height:88%!important;background-size:auto 100%!important;background-position:center bottom!important}
  .login-logo-v40{top:22px!important;width:min(360px,78vw)!important}
  .login-copy{top:56%!important;width:90%!important;transform:translate(-50%,0)!important}
  .login-copy h1{font-size:clamp(2.4rem,8vw,4rem)!important}
  .login-panel{height:auto!important;min-height:0!important;padding:18px 16px 30px!important}
  .login-form-wrap{max-height:none!important;overflow:visible!important;width:min(680px,96vw)!important}
}

@media (max-width:620px){
  .login-visual{height:360px!important;min-height:360px!important}
  .login-logo-v40{width:min(310px,82vw)!important}
  .login-copy{top:55%!important}
  .login-copy h1{font-size:2.55rem!important}
  .login-form-wrap{padding:21px 17px 17px!important;border-radius:25px!important}
  .auth-heading h2{font-size:2rem!important}
  .auth-heading p{max-width:100%!important;font-size:.92rem!important}
  .auth-field input{min-height:54px!important}
  .vehicle-choice-grid{grid-template-columns:1fr!important}
}