/* ============================================================
   聚合双封 · 认证页（登录 / 注册）独立样式
   与前台 site.css 深色体系保持一致，但视觉更完整
   ============================================================ */
:root{
  --a-bg:#070b16; --a-panel:#0f1729; --a-panel2:#141d33;
  --a-line:rgba(255,255,255,.09); --a-txt:#e9eefb; --a-muted:#8b98b9;
  --a-pri:#4f7cff; --a-pri2:#7a5cff; --a-cyan:#27e0c8;
  --a-ok:#36d399; --a-warn:#ffb020; --a-bad:#ff5d6c;
  --a-grad:linear-gradient(135deg,#4f7cff,#7a5cff);
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body.a2{background:var(--a-bg);color:var(--a-txt);
  font-family:-apple-system,"PingFang SC","Microsoft YaHei",Segoe UI,Roboto,sans-serif;
  line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
svg{display:block}
button{font-family:inherit}

.a2-wrap{display:grid;grid-template-columns:1.02fr .98fr;min-height:100vh}

/* ---------------- 左侧品牌面板 ---------------- */
.a2-side{position:relative;overflow:hidden;padding:52px 54px;display:flex;flex-direction:column;
  background:linear-gradient(160deg,#111c37 0%,#0a1130 46%,#080c1c 100%);
  border-right:1px solid var(--a-line)}
.a2-grid{position:absolute;inset:0;z-index:0;
  background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);
  background-size:48px 48px;
  -webkit-mask-image:radial-gradient(760px 540px at 62% 38%,#000,transparent 80%);
  mask-image:radial-gradient(760px 540px at 62% 38%,#000,transparent 80%)}
.a2-orb{position:absolute;border-radius:50%;filter:blur(80px);opacity:.45;z-index:0}
.a2-orb-1{width:360px;height:360px;background:#4f7cff;top:-110px;left:-70px;animation:a2f1 15s ease-in-out infinite}
.a2-orb-2{width:320px;height:320px;background:#7a5cff;bottom:-90px;right:-50px;animation:a2f2 19s ease-in-out infinite}
@keyframes a2f1{0%,100%{transform:translate(0,0)}50%{transform:translate(46px,56px)}}
@keyframes a2f2{0%,100%{transform:translate(0,0)}50%{transform:translate(-54px,-44px)}}

.a2-inner{position:relative;z-index:2;display:flex;flex-direction:column;flex:1;min-height:0}

.a2-brand{display:flex;align-items:center;gap:12px}
.a2-logo{width:42px;height:42px;border-radius:12px;background:var(--a-grad);
  display:grid;place-items:center;font-weight:800;color:#fff;font-size:17px;
  box-shadow:0 10px 26px rgba(79,124,255,.42);flex:0 0 auto}
.a2-logo-img{height:42px;width:auto;border-radius:12px;display:block}
.a2-brand-t{font-weight:700;font-size:19px;line-height:1.15;letter-spacing:.2px}
.a2-brand-t small{display:block;font-size:12px;color:var(--a-muted);font-weight:400;letter-spacing:0}

.a2-hero{padding:52px 0 36px}
.a2-tag{display:inline-flex;align-items:center;gap:8px;padding:6px 14px;border-radius:999px;
  border:1px solid rgba(39,224,200,.28);background:rgba(39,224,200,.08);color:var(--a-cyan);
  font-size:13px;margin-bottom:20px}
.a2-tag i{width:6px;height:6px;border-radius:50%;background:var(--a-cyan);
  box-shadow:0 0 0 4px rgba(39,224,200,.18);animation:a2blink 1.8s infinite}
@keyframes a2blink{0%,100%{opacity:1}50%{opacity:.35}}
.a2-title{font-size:40px;line-height:1.2;letter-spacing:-.8px;font-weight:800}
.a2-title em{font-style:normal;background:var(--a-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.a2-lead{color:var(--a-muted);font-size:15px;margin-top:15px;max-width:430px}

.a2-feats{list-style:none;margin-top:32px;display:flex;flex-direction:column;gap:16px}
.a2-feats li{display:flex;align-items:flex-start;gap:14px}
.a2-fi{width:38px;height:38px;border-radius:11px;flex:0 0 auto;display:grid;place-items:center;
  background:rgba(255,255,255,.05);border:1px solid var(--a-line);color:var(--a-cyan)}
.a2-fi.p{color:var(--a-pri)}.a2-fi.v{color:#a78bfa}
.a2-feats b{display:block;font-size:15px;font-weight:600}
.a2-feats i{font-style:normal;font-size:13px;color:var(--a-muted)}

.a2-side-foot{display:flex;gap:38px;padding-top:26px;border-top:1px solid var(--a-line);margin-top:auto}
.a2-side-foot b{display:block;font-size:23px;font-weight:800;letter-spacing:-.5px}
.a2-side-foot span{font-size:12.5px;color:var(--a-muted)}

/* ---------------- 右侧表单 ---------------- */
.a2-main{display:grid;place-items:center;padding:50px 30px;position:relative}
.a2-main::before{content:"";position:absolute;inset:0;
  background:radial-gradient(560px 380px at 70% 22%,rgba(79,124,255,.12),transparent)}
.a2-card{position:relative;z-index:2;width:100%;max-width:430px;
  background:linear-gradient(180deg,rgba(20,29,51,.92),rgba(15,23,41,.92));
  border:1px solid var(--a-line);border-radius:22px;padding:30px 36px 30px;
  box-shadow:0 34px 90px rgba(0,0,0,.5);backdrop-filter:blur(8px);
  animation:a2up .5s cubic-bezier(.2,.8,.3,1)}
@keyframes a2up{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}

.a2-mobile-brand{display:none}

.a2-tabs{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:4px;margin-bottom:24px;
  background:rgba(0,0,0,.28);border:1px solid var(--a-line);border-radius:13px}
.a2-tabs a{text-align:center;padding:9px 0;border-radius:10px;font-size:14.5px;color:var(--a-muted);transition:.2s}
.a2-tabs a:hover{color:var(--a-txt)}
.a2-tabs a.on{background:var(--a-grad);color:#fff;font-weight:600;box-shadow:0 6px 18px rgba(79,124,255,.36)}

.a2-head{margin-bottom:22px}
.a2-head h2{font-size:25px;letter-spacing:-.4px}
.a2-head p{color:var(--a-muted);font-size:14px;margin-top:7px}

.a2-alert{display:flex;align-items:center;gap:10px;padding:11px 14px;border-radius:11px;font-size:13.5px;
  background:rgba(255,93,108,.1);border:1px solid rgba(255,93,108,.3);color:#ff97a1;margin-bottom:20px;
  animation:a2shake .4s}
.a2-alert.ok{background:rgba(54,211,153,.1);border-color:rgba(54,211,153,.3);color:#5fe3ae}
.a2-alert svg{flex:0 0 auto}
@keyframes a2shake{0%,100%{transform:translateX(0)}20%{transform:translateX(-7px)}40%{transform:translateX(6px)}60%{transform:translateX(-4px)}80%{transform:translateX(3px)}}

.a2-form{display:flex;flex-direction:column;gap:16px}
.a2-field label{display:block;font-size:13px;color:var(--a-muted);margin-bottom:8px;font-weight:500}
.a2-field label em{color:var(--a-bad);font-style:normal;margin-left:3px}
.a2-inp{position:relative;display:flex;align-items:center}
.a2-inp > svg{position:absolute;left:14px;width:18px;height:18px;color:#63719a;pointer-events:none;transition:.2s}
.a2-inp > input{width:100%;padding:13px 14px 13px 42px;border-radius:12px;font-size:15px;
  border:1px solid var(--a-line);background:rgba(0,0,0,.26);color:var(--a-txt);
  font-family:inherit;transition:.2s}
.a2-inp > input::placeholder{color:#5b678a}
.a2-inp > input:focus{outline:none;border-color:var(--a-pri);background:rgba(79,124,255,.07);
  box-shadow:0 0 0 3px rgba(79,124,255,.15)}
.a2-inp:focus-within > svg{color:var(--a-pri)}
.a2-inp.is-ok > input{border-color:rgba(54,211,153,.5)}
.a2-inp.is-bad > input{border-color:rgba(255,93,108,.55)}

.a2-eye{position:absolute;right:9px;width:32px;height:32px;border-radius:9px;border:none;background:transparent;
  color:#63719a;cursor:pointer;display:grid;place-items:center;transition:.2s;padding:0}
.a2-eye:hover{color:var(--a-txt);background:rgba(255,255,255,.06)}

/* 密码强度条 */
.a2-str{display:flex;align-items:center;gap:9px;margin-top:9px}
.a2-bars{display:flex;gap:5px;flex:1}
.a2-bars i{flex:1;height:4px;border-radius:99px;background:rgba(255,255,255,.09);transition:.25s}
.a2-bars.s1 i:nth-child(1){background:var(--a-bad)}
.a2-bars.s2 i:nth-child(-n+2){background:var(--a-warn)}
.a2-bars.s3 i{background:var(--a-ok)}
.a2-str-t{font-size:12px;color:var(--a-muted);min-width:56px;text-align:right}
.a2-tip{font-size:12px;color:var(--a-muted);margin-top:7px}
.a2-tip.err{color:#ff8b96}

.a2-submit{width:100%;margin-top:6px;padding:14px;border:none;border-radius:13px;
  background:var(--a-grad);color:#fff;font-size:15.5px;font-weight:600;cursor:pointer;
  display:flex;align-items:center;justify-content:center;gap:9px;
  box-shadow:0 12px 30px rgba(79,124,255,.36);transition:.22s}
.a2-submit:hover{transform:translateY(-2px);box-shadow:0 18px 40px rgba(79,124,255,.48);filter:brightness(1.06)}
.a2-submit:active{transform:translateY(0)}
.a2-submit svg{transition:transform .22s}
.a2-submit:hover svg{transform:translateX(4px)}

.a2-alt{text-align:center;margin-top:20px;font-size:14px;color:var(--a-muted)}
.a2-alt a{color:var(--a-pri);font-weight:600}
.a2-alt a:hover{text-decoration:underline}

.a2-back{display:block;text-align:center;margin-top:14px;font-size:13px;color:var(--a-muted);transition:.2s}
.a2-back:hover{color:var(--a-txt)}

.a2-safe{display:flex;align-items:center;justify-content:center;gap:7px;margin-top:22px;
  padding-top:18px;border-top:1px solid var(--a-line);font-size:12px;color:#5f6c91}
.a2-safe svg{flex:0 0 auto}

/* ---------------- 响应式 ---------------- */
@media (max-width:980px){
  .a2-wrap{grid-template-columns:1fr}
  .a2-side{display:none}
  .a2-main{padding:26px 18px 44px;align-items:start}
  .a2-mobile-brand{display:flex;align-items:center;gap:10px;margin-bottom:20px;font-weight:700;font-size:17px}
  .a2-card{padding:26px 22px 24px;border-radius:18px;box-shadow:0 20px 54px rgba(0,0,0,.45)}
  .a2-head h2{font-size:22px}
}
@media (max-width:420px){
  .a2-title{font-size:32px}
  .a2-card{padding:22px 18px}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none !important;transition:none !important}
}