:root { --ink:#17221d; --muted:#7b847f; --paper:#f4f3ee; --green:#1f5a43; --gold:#aa8351; --line:#d9ded9; --danger:#a33a2f; }
* { box-sizing: border-box; }
body { margin:0; min-height:100vh; color:var(--ink); background:linear-gradient(135deg,#14231d 0 46%,#f4f3ee 46% 100%); font-family:Inter,"PingFang SC","Microsoft YaHei",system-ui,sans-serif; }
.auth-shell { min-height:100vh; max-width:1100px; margin:0 auto; padding:clamp(24px,6vw,74px); display:grid; grid-template-columns:1fr minmax(360px,440px); gap:clamp(50px,9vw,120px); align-items:center; }
.intro { color:#fff; }
.mark { width:50px; height:48px; display:grid; gap:4px; grid-template-columns:repeat(3,1fr); transform:skewY(-8deg); margin-bottom:28px; }
.mark span { background:#2b8060; border-radius:2px; }
.mark span:nth-child(2) { background:var(--gold); transform:translateY(6px); }
.eyebrow { margin:0 0 12px; color:#c5a57b; font-size:12px; font-weight:800; letter-spacing:.16em; }
h1 { margin:0; font:700 clamp(40px,6vw,68px)/1.1 "Songti SC","SimSun",serif; letter-spacing:.04em; }
.intro-copy { max-width:420px; margin:26px 0 28px; color:#c9d1cc; font-size:15px; line-height:1.8; }
.feature-row { display:flex; flex-wrap:wrap; gap:9px; }
.feature-row span { border:1px solid rgba(255,255,255,.18); border-radius:99px; padding:7px 11px; color:#dbe2de; font-size:10px; letter-spacing:.12em; }
.auth-card { background:rgba(255,255,255,.96); border:1px solid rgba(23,34,29,.08); border-radius:20px; padding:clamp(28px,5vw,44px); box-shadow:0 28px 70px rgba(0,0,0,.2); }
.lock { display:inline-block; margin-bottom:25px; padding:6px 9px; border-radius:99px; background:#e9f1ec; color:var(--green); font-size:11px; font-weight:800; }
h2 { margin:0 0 8px; font-size:26px; }
#formHint { margin:0 0 26px; color:var(--muted); font-size:13px; }
label { display:block; margin-bottom:16px; }
label span { display:block; margin-bottom:7px; font-size:12px; font-weight:750; }
input { width:100%; border:1px solid var(--line); border-radius:10px; padding:13px 14px; outline:none; background:#fbfcfa; color:var(--ink); transition:.18s ease; }
input:focus { border-color:var(--green); box-shadow:0 0 0 3px rgba(31,90,67,.1); background:#fff; }
.message { margin:0 0 15px; border-radius:9px; padding:10px 12px; background:#fff1ee; color:var(--danger); font-size:12px; line-height:1.6; }
button { width:100%; border:0; border-radius:10px; padding:13px 15px; background:var(--green); color:white; font:750 14px inherit; cursor:pointer; }
button:disabled { opacity:.55; cursor:wait; }
button span { margin-left:10px; }
.back { margin-top:9px; padding:9px; background:transparent; color:var(--green); font-size:12px; }
.footnote { margin:24px 0 0; padding-top:18px; border-top:1px solid #edf0ed; color:#939b96; text-align:center; font-size:11px; }
@media (max-width:760px) {
  body { background:linear-gradient(180deg,#14231d 0 34%,#f4f3ee 34% 100%); }
  .auth-shell { grid-template-columns:1fr; gap:30px; padding:32px 18px; align-content:center; }
  .intro-copy { display:none; }
  .mark { width:38px; height:36px; margin-bottom:18px; }
  h1 { font-size:38px; }
  .feature-row { margin-top:18px; }
  .auth-card { padding:28px 22px; }
}