/* ══ 登录 / 注册 页样式 ══ */

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family:"PingFang SC","Microsoft YaHei","Hiragino Sans GB",system-ui,-apple-system,"Segoe UI",sans-serif;
  color:#1b2434;
  background:#eef2f9;
  background-image:
    radial-gradient(900px 520px at 12% -8%, #dce8ff 0%, rgba(220,232,255,0) 62%),
    radial-gradient(760px 460px at 92% 6%, #e3f2ff 0%, rgba(227,242,255,0) 60%),
    radial-gradient(700px 500px at 50% 110%, #e8eefb 0%, rgba(232,238,251,0) 60%),
    linear-gradient(180deg,#f5f8fd 0%,#e9eff9 100%);
  min-height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:32px 18px;
}

.shell{
  width:100%;
  max-width:960px;
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:38px;
  align-items:center;
}

/* ── 左侧品牌区 ── */
.brandside{padding:6px 4px}
.logo{
  display:inline-flex;align-items:center;gap:10px;
  font-size:13px;font-weight:600;letter-spacing:.14em;color:#2559e0;
  text-transform:uppercase;
  margin-bottom:22px;
}
.logo i{
  width:26px;height:26px;border-radius:8px;display:inline-block;
  background:linear-gradient(135deg,#2559e0,#5f9bff);
  box-shadow:0 6px 16px rgba(37,89,224,.32);
  position:relative;
}
.logo i::after{
  content:"";position:absolute;inset:7px;border-radius:3px;
  border:2px solid rgba(255,255,255,.92);border-top-color:transparent;border-right-color:transparent;
  transform:rotate(-45deg);
}
.brandside h1{
  margin:0 0 14px;
  font-size:34px;
  line-height:1.28;
  font-weight:700;
  letter-spacing:.5px;
  color:#12203a;
}
.brandside h1 em{
  font-style:normal;
  background:linear-gradient(92deg,#2559e0 10%,#3f8bff 90%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.brandside p{
  margin:0 0 22px;color:#5b6a83;font-size:14px;line-height:1.85;max-width:380px;
}
.feats{display:flex;flex-direction:column;gap:9px;margin:0;padding:0;list-style:none}
.feats li{
  display:flex;align-items:center;gap:9px;color:#42536e;font-size:13.2px;
}
.feats li b{
  width:6px;height:6px;border-radius:50%;background:#2f74ff;flex:none;
  box-shadow:0 0 0 3px rgba(47,116,255,.14);
}

/* ── 右侧卡片 ── */
.card{
  background:rgba(255,255,255,.92);
  border:1px solid rgba(209,222,242,.9);
  border-radius:20px;
  box-shadow:0 26px 60px -22px rgba(28,56,110,.30),0 2px 8px rgba(28,56,110,.05);
  padding:34px 32px 28px;
  backdrop-filter:blur(6px);
}
.card h2{margin:0 0 6px;font-size:20px;font-weight:600;letter-spacing:.3px}
.card .tip{margin:0 0 22px;color:#8494ab;font-size:12.8px}

.field{margin-bottom:15px}
.field label{
  display:block;font-size:12.6px;color:#5b6a83;margin-bottom:7px;font-weight:500;
}
.field input{
  width:100%;
  height:44px;
  padding:0 13px;
  border:1px solid #d8e2f1;
  border-radius:11px;
  background:#fbfdff;
  font-size:14px;
  color:#16233a;
  outline:none;
  transition:border-color .15s,box-shadow .15s,background .15s;
  font-family:inherit;
}
.field input::placeholder{color:#b3c0d2}
.field input:focus{
  border-color:#4d86ff;
  background:#fff;
  box-shadow:0 0 0 3.5px rgba(77,134,255,.14);
}

.err{
  display:flex;align-items:flex-start;gap:7px;
  background:#fff1f2;border:1px solid #fbd0d4;color:#c22b31;
  border-radius:10px;padding:9px 12px;font-size:12.8px;line-height:1.6;margin-bottom:15px;
}
.err span:first-child{font-weight:700}

.btn-main{
  width:100%;height:46px;border:0;border-radius:11px;cursor:pointer;
  background:linear-gradient(180deg,#3068ef,#2452d8);
  color:#fff;font-size:14.6px;font-weight:600;letter-spacing:2px;
  box-shadow:0 12px 24px -12px rgba(37,89,224,.75);
  transition:transform .12s,box-shadow .2s,filter .2s;
  font-family:inherit;
  margin-top:4px;
}
.btn-main:hover{filter:brightness(1.05);box-shadow:0 14px 28px -12px rgba(37,89,224,.85)}
.btn-main:active{transform:translateY(1px)}
.btn-main:disabled{filter:grayscale(.35);cursor:not-allowed}

.alt{
  margin-top:18px;text-align:center;font-size:12.9px;color:#8494ab;
}
.alt a{color:#2559e0;text-decoration:none;font-weight:600;margin-left:4px}
.alt a:hover{text-decoration:underline}

.foot{
  margin-top:22px;padding-top:16px;border-top:1px solid #edf1f8;
  text-align:center;font-size:11.8px;color:#a9b5c7;line-height:1.7;
}

@media (max-width:780px){
  .shell{grid-template-columns:1fr;gap:22px;max-width:440px}
  .brandside{padding:0;text-align:center}
  .brandside h1{font-size:25px}
  .brandside p{margin-left:auto;margin-right:auto;font-size:13px}
  .feats{display:none}
  .logo{justify-content:center;margin-bottom:14px}
  .card{padding:26px 22px 22px;border-radius:16px}
}