body.ecosystem-login{
  min-height:100vh;
  background:
    radial-gradient(circle at 8% 2%,rgba(8,120,255,.10),transparent 28rem),
    radial-gradient(circle at 92% 7%,rgba(213,167,51,.13),transparent 25rem),
    #f7faff;
}
.login-main{
  width:min(1160px,calc(100% - 32px));
  min-height:calc(100vh - 92px);
  margin:0 auto;
  padding:34px 0 64px;
  display:grid;
  align-items:center;
}
.login-shell{
  width:100%;
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr);
  gap:clamp(28px,5vw,70px);
  align-items:center;
}
.login-brand-panel{
  min-width:0;
  padding:clamp(12px,2.5vw,34px);
  display:flex;
  flex-direction:column;
  justify-content:center;
  background:transparent;
  border:0;
  border-radius:0;
  box-shadow:none;
  backdrop-filter:none;
}
.login-logo-window{
  width:100%;
  min-height:0;
  margin:0 0 clamp(18px,2.4vw,28px);
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:visible;
  background:transparent;
  border:0;
  border-radius:0;
}
.login-logo-window img{
  width:min(100%,520px);
  height:auto;
  display:block;
  mix-blend-mode:multiply;
  filter:drop-shadow(0 18px 30px rgba(35,82,139,.10));
}
.login-kicker{
  font-size:.72rem;
  font-weight:900;
  letter-spacing:.12em;
  color:#2a69a9;
}
.login-brand-panel h1{
  max-width:700px;
  margin:12px 0 13px;
  color:#102747;
  font-size:clamp(2.25rem,4.5vw,4.45rem);
  line-height:1.08;
  letter-spacing:-.045em;
}
.login-brand-panel p{
  max-width:680px;
  margin:0;
  color:#68798f;
  line-height:1.95;
  font-size:.98rem;
}
.account-principles{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:0;
  margin-top:25px;
  border-block:1px solid rgba(27,94,160,.10);
}
.account-principles span{
  min-width:0;
  padding:13px 12px;
  display:grid;
  gap:3px;
  background:transparent;
}
.account-principles span+span{
  border-inline-start:1px solid rgba(27,94,160,.10);
}
.account-principles b{
  color:#c28c19;
  font-size:.68rem;
}
.account-principles em{
  color:#536a83;
  font-size:.76rem;
  font-style:normal;
  font-weight:800;
}
.login-card{
  width:min(100%,470px);
  justify-self:center;
  padding:28px;
  border:1px solid rgba(255,255,255,.96);
  border-radius:28px;
  background:rgba(255,255,255,.84);
  box-shadow:0 22px 65px rgba(46,86,135,.12);
  backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);
}
.login-tabs{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:6px;
  padding:5px;
  border-radius:14px;
  background:#eef4fb;
}
.login-tab{
  min-height:43px;
  border:0;
  border-radius:11px;
  background:transparent;
  color:#6b798b;
  font-weight:900;
}
.login-tab[aria-selected="true"]{
  background:#fff;
  color:#0b5fc4;
  box-shadow:0 7px 18px rgba(29,74,126,.08);
}
.login-card-head{padding:24px 2px 14px}
.login-card-head h2{
  margin:9px 0;
  font-size:clamp(1.7rem,3vw,2.55rem);
  line-height:1.18;
}
.login-card-head p{
  margin:0;
  color:#748297;
  line-height:1.8;
}
.login-card form{display:grid;gap:12px}
.login-submit{
  width:100%;
  min-height:49px;
  margin-top:4px;
}
.login-back{
  display:inline-block;
  margin-top:18px;
  color:#2d67a3;
  text-decoration:none;
  font-size:.85rem;
  font-weight:800;
}
.login-card .form-message{min-height:1.2rem}
.signup-confirmation-note{
  margin:8px 0 0;
  color:#748297;
  font-size:.72rem;
  line-height:1.65;
  text-align:center;
}

html[data-theme="dark"] body.ecosystem-login{
  background:
    radial-gradient(circle at 8% 2%,rgba(8,120,255,.13),transparent 28rem),
    radial-gradient(circle at 92% 7%,rgba(213,167,51,.09),transparent 25rem),
    #081221;
}
html[data-theme="dark"] .login-brand-panel h1,
html[data-theme="dark"] .login-card-head h2{color:#f2f7ff}
html[data-theme="dark"] .login-brand-panel p,
html[data-theme="dark"] .login-card-head p{color:#9faec1}
html[data-theme="dark"] .login-logo-window img{
  mix-blend-mode:multiply;
  opacity:.98;
  filter:brightness(1.45) saturate(1.12) drop-shadow(0 18px 30px rgba(0,0,0,.18));
}
html[data-theme="dark"] .account-principles{
  border-color:rgba(255,255,255,.10);
}
html[data-theme="dark"] .account-principles span+span{
  border-color:rgba(255,255,255,.10);
}
html[data-theme="dark"] .account-principles em{color:#c6d3e2}
html[data-theme="dark"] .login-card{
  background:rgba(14,28,47,.88);
  border-color:rgba(255,255,255,.08);
}
html[data-theme="dark"] .login-tabs{background:#0c1727}
html[data-theme="dark"] .login-tab{color:#9eacc1}
html[data-theme="dark"] .login-tab[aria-selected="true"]{
  background:#17263d;
  color:#fff;
}
html[data-theme="dark"] .signup-confirmation-note{color:#9faec1}

@media(max-width:860px){
  .login-main{
    width:min(100% - 24px,720px);
    min-height:0;
    padding:26px 0 52px;
  }
  .login-shell{
    grid-template-columns:1fr;
    gap:22px;
  }
  .login-brand-panel{
    width:min(100%,640px);
    margin:0 auto;
    padding:10px 16px 4px;
    text-align:center;
    align-items:center;
  }
  .login-logo-window{margin-bottom:14px}
  .login-logo-window img{width:min(86%,420px)}
  .login-brand-panel h1{
    max-width:620px;
    font-size:clamp(2rem,8vw,3.35rem);
  }
  .login-brand-panel p{max-width:610px}
  .account-principles{
    width:100%;
    max-width:610px;
  }
  .login-card{
    width:min(100%,520px);
    padding:21px;
    border-radius:24px;
  }
  .login-card-head{padding-top:20px}
}
@media(max-width:520px){
  .login-main{
    width:calc(100% - 16px);
    padding-top:18px;
  }
  .login-brand-panel{padding:4px 8px 0}
  .login-logo-window img{width:min(94%,340px)}
  .login-brand-panel h1{
    margin-top:9px;
    font-size:clamp(1.8rem,10vw,2.7rem);
  }
  .login-brand-panel p{
    font-size:.88rem;
    line-height:1.8;
  }
  .account-principles{
    margin-top:18px;
    grid-template-columns:1fr;
    border-block:1px solid rgba(27,94,160,.10);
  }
  .account-principles span{
    grid-template-columns:auto 1fr;
    align-items:center;
    gap:10px;
    padding:9px 4px;
  }
  .account-principles span+span{
    border-inline-start:0;
    border-top:1px solid rgba(27,94,160,.10);
  }
  .login-card{
    padding:16px;
    border-radius:22px;
  }
  .login-tabs{
    position:static;
  }
  .login-card .field input{min-height:48px}
  .login-submit{min-height:52px}
}
