
:root{
  --bg:#0e1423;
  --panel:#151c2d;
  --line:#293249;
  --text:#f5f7fb;
  --muted:#98a2b5;
  --purple:#7b43ff;
  --blue:#3f83ff;
  --light:#f7f8fc;
  --dark:#121827;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body.authx-body{
  min-height:100vh;
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  background:#f6f7fb;
  color:#172033;
}
.authx-top{
  height:78px;background:#fff;border-bottom:1px solid #e6e9ef;
}
.authx-top-inner{
  width:min(1200px,calc(100% - 40px));height:78px;margin:auto;
  display:flex;align-items:center;justify-content:space-between;gap:20px;
}
.authx-logo img{height:42px;display:block}
.authx-top-link{font-size:13px;font-weight:800;color:#5b45f5;text-decoration:none}
.authx-shell{
  width:min(1200px,calc(100% - 40px));margin:48px auto 70px;
  display:grid;grid-template-columns:1fr 1.02fr;
  min-height:690px;border-radius:28px;overflow:hidden;
  box-shadow:0 30px 90px rgba(28,34,63,.16);
  border:1px solid #e3e7ee;background:#fff;
}
.authx-side{
  position:relative;overflow:hidden;padding:56px 52px;
  background:
    radial-gradient(circle at 20% 10%,rgba(123,67,255,.32),transparent 28%),
    radial-gradient(circle at 80% 85%,rgba(63,131,255,.18),transparent 30%),
    linear-gradient(160deg,#0c1321 0%,#11192a 52%,#12162d 100%);
  color:#fff;
}
.authx-side:after{
  content:"";position:absolute;inset:auto -100px -140px auto;width:320px;height:320px;border-radius:50%;
  background:rgba(91,72,255,.14);filter:blur(4px)
}
.authx-eyebrow{
  display:inline-flex;padding:7px 10px;border-radius:999px;
  background:rgba(123,67,255,.14);border:1px solid rgba(123,67,255,.35);
  color:#a98bff;font-size:10px;font-weight:900;letter-spacing:1.4px
}
.authx-side h1{font-size:52px;line-height:1.03;letter-spacing:-2.6px;margin:22px 0 16px}
.authx-side h1 span{background:linear-gradient(90deg,#9d4cff,#4f86ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.authx-side>p{max-width:520px;color:#b5becf;font-size:17px;line-height:1.65}
.authx-feature-list{display:grid;gap:17px;margin-top:34px}
.authx-feature{display:flex;gap:14px;align-items:flex-start}
.authx-feature i{
  width:38px;height:38px;border-radius:12px;background:rgba(123,67,255,.14);border:1px solid rgba(123,67,255,.3);
  display:grid;place-items:center;font-style:normal;font-size:18px
}
.authx-feature span{display:grid}
.authx-feature strong{font-size:14px}
.authx-feature small{font-size:11px;color:#99a4b7;margin-top:2px}
.authx-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:40px}
.authx-stats div{border-top:1px solid rgba(255,255,255,.1);padding-top:14px}
.authx-stats strong{display:block;font-size:22px}
.authx-stats span{font-size:10px;color:#98a3b7}
.authx-formwrap{
  background:#fff;padding:48px 50px;display:flex;align-items:center;justify-content:center
}
.authx-card{width:min(520px,100%)}
.authx-card-head{text-align:center;margin-bottom:28px}
.authx-card-head h2{font-size:31px;letter-spacing:-1px;margin:0 0 7px}
.authx-card-head p{margin:0;color:#7e8797;font-size:13px}
.authx-form{display:grid;gap:15px}
.authx-form label{display:grid;gap:7px;font-size:11px;font-weight:800;color:#394255}
.authx-form input,.authx-form select{
  width:100%;border:1px solid #dce2ea;border-radius:11px;padding:13px 14px;
  font:inherit;color:#202838;background:#fff;transition:.15s
}
.authx-form input:focus,.authx-form select:focus{outline:0;border-color:#6a50ff;box-shadow:0 0 0 3px rgba(106,80,255,.12)}
.authx-two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.password-wrap{position:relative}
.password-wrap input{padding-right:66px}
.password-toggle{
  position:absolute;right:7px;top:50%;transform:translateY(-50%);
  border:0;background:#f0f2f7;border-radius:8px;padding:6px 8px;font-size:9px;font-weight:900;color:#566173;cursor:pointer
}
.authx-row{display:flex;align-items:center;justify-content:space-between;gap:12px}
.authx-row a{font-size:10px;font-weight:850;color:#6549ff;text-decoration:none}
.check{display:flex!important;grid-template-columns:auto 1fr!important;align-items:center!important;gap:8px!important;font-weight:650!important}
.check input{width:auto!important}
.authx-btn{
  width:100%;min-height:50px;border:0;border-radius:11px;
  background:linear-gradient(90deg,#8c39ff,#4e81ff);color:#fff;font-weight:900;cursor:pointer;
  box-shadow:0 12px 28px rgba(101,75,255,.24)
}
.authx-divider{display:flex;align-items:center;gap:10px;margin:22px 0;color:#9ba3b0;font-size:8px;font-weight:900;letter-spacing:1px}
.authx-divider:before,.authx-divider:after{content:"";height:1px;background:#e6e9ef;flex:1}
.authx-secondary{
  width:100%;display:flex;align-items:center;justify-content:center;min-height:48px;border:1px solid #dde2ea;
  border-radius:11px;text-decoration:none;color:#2d3647;font-weight:850;font-size:12px;background:#fff
}
.authx-alert{background:#fff0f0;border:1px solid #ffd7db;color:#c8424d;border-radius:10px;padding:11px 12px;font-size:11px;font-weight:750;margin-bottom:15px}
.authx-note{text-align:center;color:#9aa2af;font-size:9px;margin-top:15px}
.authx-brand-mini{display:flex;gap:8px;flex-wrap:wrap;margin-top:28px}
.authx-brand-mini span{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:10px;padding:8px 10px;font-size:9px;color:#b9c1d0}
.authx-register-side{
  background:
    radial-gradient(circle at 65% 15%,rgba(112,72,255,.42),transparent 28%),
    radial-gradient(circle at 25% 75%,rgba(65,130,255,.22),transparent 26%),
    linear-gradient(160deg,#121629 0%,#171138 52%,#3b2bb9 100%)
}
.authx-register-side .authx-quote{
  margin-top:42px;padding:20px;border-left:3px solid #9b63ff;background:rgba(255,255,255,.05);
  border-radius:0 12px 12px 0;color:#d5d9e4;font-size:14px;line-height:1.6
}
.authx-register-side .authx-quote b{display:block;color:#fff;margin-top:8px}
.authx-terms{margin-top:2px}
@media(max-width:960px){
  .authx-shell{grid-template-columns:1fr}
  .authx-side{padding:42px 34px}
  .authx-side h1{font-size:43px}
  .authx-formwrap{padding:38px 28px}
}
@media(max-width:600px){
  .authx-top-inner,.authx-shell{width:min(100% - 24px,1200px)}
  .authx-top{height:70px}.authx-top-inner{height:70px}
  .authx-logo img{height:34px}
  .authx-shell{margin:20px auto 34px;border-radius:18px}
  .authx-side{padding:32px 24px}
  .authx-side h1{font-size:36px;letter-spacing:-1.8px}
  .authx-stats{grid-template-columns:1fr 1fr 1fr}
  .authx-formwrap{padding:28px 18px}
  .authx-two{grid-template-columns:1fr}
}
