:root { --ink:#11120f; --paper:#f3f1e9; --lime:#a8e600; --line:#d5d2c6; --muted:#6e7069; }
* { box-sizing:border-box; }
body { margin:0; min-height:100vh; color:var(--ink); background:var(--paper); font-family:Inter,"Microsoft YaHei",system-ui,sans-serif; }
body::before { content:""; position:fixed; inset:0; pointer-events:none; opacity:.24; background-image:radial-gradient(#11120f 0.55px,transparent 0.55px); background-size:5px 5px; }
.login-shell { position:relative; min-height:100vh; display:grid; grid-template-columns:minmax(320px,1.08fr) minmax(360px,.92fr); }
.intro { padding:clamp(34px,7vw,96px); display:flex; flex-direction:column; justify-content:center; border-right:1px solid var(--line); }
.brand { position:absolute; top:30px; left:clamp(34px,7vw,96px); display:flex; align-items:center; gap:12px; color:inherit; text-decoration:none; font-weight:850; letter-spacing:-.04em; font-size:20px; }
.mark { display:flex; gap:3px; align-items:flex-end; height:19px; }
.mark i { width:5px; background:var(--ink); display:block; transform:skew(-12deg); }
.mark i:nth-child(1){height:10px}.mark i:nth-child(2){height:18px;background:var(--lime)}.mark i:nth-child(3){height:14px}
.number { color:#78a600; font-weight:800; letter-spacing:.14em; font-size:12px; }
h1 { margin:22px 0 20px; font-size:clamp(48px,7vw,94px); line-height:.9; letter-spacing:-.07em; }
h1 em { font-family:Georgia,"Songti SC",serif; font-weight:400; }
.intro>p { max-width:520px; color:var(--muted); line-height:1.8; font-size:16px; }
.privacy { margin-top:44px; display:flex; gap:10px; align-items:center; font-size:13px; font-weight:700; }
.privacy span { width:9px; height:9px; border-radius:50%; background:var(--lime); box-shadow:0 0 0 5px rgba(168,230,0,.15); }
.login-card { padding:clamp(32px,8vw,120px); display:flex; flex-direction:column; justify-content:center; background:rgba(255,255,255,.34); }
.card-head>span { color:#78a600; font-size:12px; font-weight:850; letter-spacing:.14em; }
.card-head h2 { margin:12px 0 8px; font-size:38px; letter-spacing:-.045em; }
.card-head p { margin:0 0 32px; color:var(--muted); }
form { display:grid; gap:19px; max-width:460px; }
label>span { display:block; margin-bottom:8px; font-size:13px; font-weight:800; }
input[type=text],input:not([type]) ,input[type=password] { width:100%; border:1px solid var(--line); border-radius:0; background:#fff; padding:15px 16px; font:inherit; outline:none; }
input:focus { border-color:#7fae00; box-shadow:0 0 0 3px rgba(168,230,0,.16); }
.show-password { display:flex; align-items:center; gap:8px; color:var(--muted); font-size:13px; }
button { border:0; background:var(--ink); color:#fff; padding:16px 20px; font:inherit; font-weight:850; cursor:pointer; }
button:hover { background:#272923; }
button:disabled { opacity:.55; cursor:wait; }
.error { min-height:22px; margin:0; color:#c83525; font-size:13px; }
@media (max-width:760px) { .login-shell{grid-template-columns:1fr}.intro{min-height:46vh;border-right:0;border-bottom:1px solid var(--line)}.brand{position:static;margin-bottom:70px}.login-card{padding-top:54px;padding-bottom:70px}h1{font-size:54px} }