/* ==========================================================
   登录 / 注册页
   ========================================================== */
.auth-body{
  min-height:100vh;display:flex;margin:0;background:#e9eef4;font-family:var(--font);
}
.auth-wrap{
  flex:1;display:grid;grid-template-columns:1.08fr .92fr;min-height:100vh;
}

/* ---- 左侧品牌区 ---- */
.auth-brand{
  position:relative;overflow:hidden;color:#dceaf2;
  background:
    radial-gradient(900px 520px at 12% 4%, rgba(18,176,196,.26), transparent 60%),
    radial-gradient(700px 460px at 92% 96%, rgba(217,138,34,.22), transparent 62%),
    linear-gradient(158deg,#0d2135 0%,#081827 52%,#050d17 100%);
  display:flex;flex-direction:column;padding:46px 50px;
}
.auth-brand::before{
  content:"";position:absolute;inset:0;opacity:.55;
  background-image:
    linear-gradient(rgba(127,223,233,.06) 1px,transparent 1px),
    linear-gradient(90deg,rgba(127,223,233,.06) 1px,transparent 1px);
  background-size:30px 30px;
}
.auth-brand::after{
  content:"";position:absolute;right:-140px;bottom:-140px;width:460px;height:460px;border-radius:50%;
  border:1px solid rgba(127,223,233,.16);
  box-shadow:0 0 0 60px rgba(127,223,233,.035), 0 0 0 130px rgba(127,223,233,.022);
}
.ab-top{position:relative;z-index:2;display:flex;align-items:center;gap:13px}
.ab-top .mark{
  width:52px;height:52px;border-radius:15px;flex:none;display:grid;place-items:center;
  background:linear-gradient(140deg,var(--cyan-400),var(--cyan-600) 58%,#0a6f80);
  box-shadow:0 10px 28px rgba(18,176,196,.44), inset 0 1px 0 rgba(255,255,255,.38);
  color:#04222a;
}
.ab-top .mark .icon{width:27px;height:27px;stroke-width:2}
.ab-top .txt h1{font-size:16.5px;font-weight:800;color:#f0f8fb;letter-spacing:.6px}
.ab-top .txt span{font-size:10px;color:var(--cyan-300);letter-spacing:2.6px;text-transform:uppercase;opacity:.8}

.ab-main{position:relative;z-index:2;flex:1;display:flex;flex-direction:column;justify-content:center;padding:40px 0}
.ab-main h2{
  font-size:34px;font-weight:800;line-height:1.34;letter-spacing:.6px;color:#f4fafc;
  margin-bottom:16px;
}
.ab-main h2 em{
  font-style:normal;position:relative;color:var(--cyan-300);
}
.ab-main h2 em::after{
  content:"";position:absolute;left:0;right:0;bottom:2px;height:8px;border-radius:4px;
  background:linear-gradient(90deg,rgba(217,138,34,.42),transparent);z-index:-1;
}
.ab-main > p{font-size:13.4px;color:#9fb8c9;line-height:1.95;max-width:520px}
.ab-feats{display:grid;grid-template-columns:1fr 1fr;gap:13px;margin-top:30px;max-width:560px}
.ab-feat{
  display:flex;align-items:center;gap:11px;padding:13px 15px;border-radius:13px;
  background:rgba(127,223,233,.055);border:1px solid rgba(127,223,233,.15);
  backdrop-filter:blur(6px);transition:all .24s;
}
.ab-feat:hover{background:rgba(127,223,233,.11);border-color:rgba(127,223,233,.3);transform:translateY(-3px)}
.ab-feat .ic{
  width:36px;height:36px;flex:none;border-radius:10px;display:grid;place-items:center;
  background:rgba(18,176,196,.16);border:1px solid rgba(127,223,233,.24);color:var(--cyan-300);
}
.ab-feat b{display:block;font-size:12.6px;color:#eaf4f8;font-weight:700}
.ab-feat span{font-size:10.6px;color:#8ba6ba}

.ab-stats{
  position:relative;z-index:2;display:flex;gap:30px;flex-wrap:wrap;
  padding-top:22px;border-top:1px solid rgba(127,223,233,.14);
}
.ab-stats div b{
  display:block;font-family:var(--font-num);font-size:25px;font-weight:800;
  background:linear-gradient(120deg,#8fe3ee,#eda63f);-webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;letter-spacing:-.5px;
}
.ab-stats div span{font-size:11px;color:#88a3b8;letter-spacing:.6px}

/* ---- 右侧表单区 ---- */
.auth-form-side{
  display:flex;align-items:center;justify-content:center;padding:36px 34px;
  background:
    radial-gradient(700px 400px at 100% 0%, rgba(18,176,196,.09), transparent 58%),
    linear-gradient(180deg,#f6f9fc,#eaeff5);
  position:relative;
}
.auth-form-side::before{
  content:"";position:absolute;inset:0;opacity:.5;pointer-events:none;
  background-image:
    linear-gradient(rgba(22,48,74,.03) 1px,transparent 1px),
    linear-gradient(90deg,rgba(22,48,74,.03) 1px,transparent 1px);
  background-size:26px 26px;
}
.auth-card{
  position:relative;z-index:2;width:100%;max-width:408px;
  background:#fff;border-radius:20px;padding:34px 32px 30px;
  box-shadow:0 10px 34px rgba(16,38,60,.10), 0 42px 90px rgba(16,38,60,.12);
  border:1px solid rgba(255,255,255,.8);
}
.auth-card::before,.auth-card::after{
  content:"";position:absolute;width:16px;height:16px;pointer-events:none;
}
.auth-card::before{top:-1px;left:-1px;border-top:2.5px solid var(--cyan-500);border-left:2.5px solid var(--cyan-500);border-top-left-radius:10px}
.auth-card::after{bottom:-1px;right:-1px;border-bottom:2.5px solid var(--copper-500);border-right:2.5px solid var(--copper-500);border-bottom-right-radius:10px}

.ac-hd{margin-bottom:24px}
.ac-hd .ac-tag{
  display:inline-flex;align-items:center;gap:6px;height:23px;padding:0 10px;border-radius:20px;
  background:var(--cyan-050);color:var(--cyan-600);font-size:10.8px;font-weight:700;
  border:1px solid #cdeef1;margin-bottom:13px;letter-spacing:.3px;
}
.ac-hd h2{font-size:22px;font-weight:800;color:var(--ink-800);letter-spacing:.3px}
.ac-hd p{font-size:12.2px;color:var(--text-3);margin-top:6px}

.ac-field{margin-bottom:15px}
.ac-field label{
  display:block;font-size:11.8px;font-weight:700;color:var(--text-2);margin-bottom:7px;
}
.ac-input{
  position:relative;display:flex;align-items:center;
}
.ac-input > .icon{position:absolute;left:13px;color:var(--text-3);width:16px;height:16px;pointer-events:none;z-index:2}
.ac-input input{
  width:100%;height:46px;padding:0 42px 0 40px;border-radius:12px;
  border:1.5px solid var(--line);background:#f8fafc;font-size:13.4px;
  transition:all .2s;
}
.ac-input input:hover{border-color:#c6d3df;background:#fff}
.ac-input input:focus{
  border-color:var(--cyan-500);background:#fff;box-shadow:0 0 0 4px rgba(18,176,196,.12);
}
.ac-input .eye{
  position:absolute;right:9px;width:28px;height:28px;border-radius:8px;border:0;background:none;
  color:var(--text-3);cursor:pointer;display:grid;place-items:center;transition:all .16s;
}
.ac-input .eye:hover{background:var(--cyan-050);color:var(--cyan-600)}

.ac-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px;flex-wrap:wrap}
.ac-check{display:flex;align-items:center;gap:7px;font-size:12.2px;color:var(--text-2);cursor:pointer}
.ac-check input{width:15px;height:15px;accent-color:var(--cyan-600);cursor:pointer}
.ac-link{font-size:12.2px;color:var(--cyan-600);cursor:pointer;font-weight:600}
.ac-link:hover{text-decoration:underline}

.ac-btn{
  width:100%;height:48px;border:0;border-radius:12px;cursor:pointer;
  background:linear-gradient(135deg,var(--cyan-500),var(--cyan-600) 58%,#076e7d);
  color:#fff;font-size:14.4px;font-weight:800;letter-spacing:1.6px;
  box-shadow:0 8px 24px rgba(18,176,196,.36);transition:all .22s;position:relative;overflow:hidden;
  display:flex;align-items:center;justify-content:center;gap:9px;
}
.ac-btn:hover{transform:translateY(-2px);box-shadow:0 14px 34px rgba(18,176,196,.46)}
.ac-btn:active{transform:translateY(0)}
.ac-btn::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(120deg,transparent 32%,rgba(255,255,255,.3) 50%,transparent 68%);
  transform:translateX(-130%);transition:transform .7s;
}
.ac-btn:hover::after{transform:translateX(130%)}
.ac-btn[disabled]{opacity:.7;cursor:wait;transform:none}

.ac-msg{
  margin-top:14px;padding:10px 13px;border-radius:10px;font-size:12.2px;
  display:none;align-items:flex-start;gap:8px;line-height:1.6;
}
.ac-msg.show{display:flex;animation:pageIn .25s both}
.ac-msg.err{background:var(--danger-050);color:var(--danger-600);border:1px solid #f7d2cd}
.ac-msg.ok{background:var(--ok-050);color:var(--ok-600);border:1px solid #c9ead9}

.ac-ft{
  margin-top:22px;padding-top:18px;border-top:1px dashed var(--line);
  display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
}
.ac-ft .ac-tip{font-size:11.6px;color:var(--text-3)}
.ac-ft .ac-link{font-size:12.4px}

.ac-demo{
  margin-top:16px;padding:11px 13px;border-radius:11px;background:#f5f9fc;
  border:1px dashed var(--line);font-size:11.4px;color:var(--text-2);line-height:1.85;
}
.ac-demo b{color:var(--ink-700);font-family:var(--font-num);font-weight:800}
.ac-demo .ac-demo-hd{
  display:flex;align-items:center;gap:6px;font-weight:700;color:var(--cyan-600);
  margin-bottom:5px;font-size:11.6px;
}
.ac-copy{
  border:0;background:none;color:var(--cyan-600);cursor:pointer;font-size:11px;
  font-weight:700;padding:0 4px;
}

.ac-copyright{
  position:absolute;bottom:16px;left:0;right:0;text-align:center;
  font-size:10.8px;color:var(--text-3);z-index:2;line-height:1.7;
}

@media (max-width:920px){
  .auth-wrap{grid-template-columns:1fr}
  .auth-brand{display:none}
  .auth-form-side{padding:26px 18px}
}