:root{color-scheme:light;--ink:#10182b;--muted:#69738a;--line:#dbe1ed;--brand:#6d4aff;--cyan:#1bbbd2;--signal:#b5f044;--danger:#d84f60;--success:#1ca879;font-family:"Noto Sans SC","Microsoft YaHei UI","PingFang SC",system-ui,sans-serif}
*{box-sizing:border-box}
html,body{min-width:320px;min-height:100%;margin:0}
body{min-height:100vh;color:var(--ink);background:radial-gradient(circle at 8% 8%,rgba(109,74,255,.13),transparent 30%),radial-gradient(circle at 91% 84%,rgba(27,187,210,.11),transparent 25%),#f1f4fa}
body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.48;background-image:linear-gradient(rgba(16,24,43,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(16,24,43,.035) 1px,transparent 1px);background-size:34px 34px;mask-image:linear-gradient(135deg,#000,transparent 76%)}
.login-shell{position:relative;width:min(1120px,calc(100% - 40px));min-height:680px;margin:clamp(30px,6vh,72px) auto;display:grid;grid-template-columns:1.08fr .92fr;overflow:hidden;border:1px solid rgba(255,255,255,.75);border-radius:34px;background:#fff;box-shadow:0 38px 110px rgba(28,35,64,.17)}
.intro-panel{position:relative;isolation:isolate;overflow:hidden;padding:46px;display:flex;flex-direction:column;color:#fff;background:radial-gradient(circle at 80% 8%,rgba(181,240,68,.18),transparent 22%),radial-gradient(circle at 16% 90%,rgba(27,187,210,.25),transparent 34%),linear-gradient(135deg,#11172b,#1c1c49 52%,#432692)}
.intro-panel:before{content:"";position:absolute;z-index:-1;inset:0;opacity:.13;background-image:linear-gradient(rgba(255,255,255,.2) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.2) 1px,transparent 1px);background-size:42px 42px;mask-image:linear-gradient(90deg,transparent,#000)}
.brand{display:flex;align-items:center;gap:13px;width:max-content;color:inherit;text-decoration:none}
.brand-mark{position:relative;width:46px;height:46px;display:grid;place-items:center;overflow:hidden;border-radius:14px;background:linear-gradient(145deg,#876cff,#5b3be3 58%,#35208a);box-shadow:0 13px 32px rgba(0,0,0,.22);font-size:20px;font-weight:800}
.brand-mark:after{content:"";position:absolute;width:31px;height:31px;right:-15px;bottom:-15px;border:7px solid rgba(181,240,68,.9);border-radius:50%}
.brand-mark i{position:absolute;width:7px;height:7px;right:8px;top:8px;border-radius:50%;background:var(--signal);box-shadow:0 0 13px var(--signal)}
.brand b{display:block;font-size:18px;letter-spacing:.04em}.brand small{display:block;margin-top:3px;color:#aeb5d6;font-size:9px;font-weight:800;letter-spacing:.17em}
.intro-copy{margin:auto 0;position:relative;z-index:2}.eyebrow{display:flex;align-items:center;gap:10px;color:#baafff;font-size:10px;font-weight:800;letter-spacing:.16em}.eyebrow span{padding:5px 8px;border:1px solid rgba(181,240,68,.45);border-radius:999px;color:var(--signal);letter-spacing:.08em}
.intro-copy h1{max-width:480px;margin:20px 0 17px;font-size:clamp(45px,5vw,68px);line-height:1;letter-spacing:-.055em}.intro-copy h1 em{display:block;color:var(--signal);font-style:normal}.intro-copy p{max-width:430px;margin:0;color:rgba(235,238,255,.67);font-size:14px;line-height:1.8}
.signal-row{position:relative;z-index:2;display:flex;flex-wrap:wrap;gap:9px}.signal-row span{padding:8px 11px;border:1px solid rgba(255,255,255,.13);border-radius:999px;background:rgba(255,255,255,.06);color:#dce0f6;font-size:10px;font-weight:700}.signal-row i{display:inline-block;width:6px;height:6px;margin-right:7px;border-radius:50%;background:var(--signal);box-shadow:0 0 8px var(--signal)}
.orbit{position:absolute;right:-92px;bottom:80px;width:310px;height:310px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.13);border-radius:50%;box-shadow:0 0 0 42px rgba(255,255,255,.025),0 0 0 84px rgba(255,255,255,.018)}.orbit:before{content:"";position:absolute;inset:39px;border:1px dashed rgba(181,240,68,.26);border-radius:50%;animation:spin 18s linear infinite}.orbit span{width:104px;height:104px;border-radius:50%;background:radial-gradient(circle at 35% 28%,#8d78fa,#452caa);box-shadow:0 20px 50px rgba(0,0,0,.27)}.orbit b{position:absolute;font:800 28px ui-monospace,monospace}.orbit i{position:absolute;top:35px;width:10px;height:10px;border-radius:50%;background:var(--signal);box-shadow:0 0 17px var(--signal)}
.form-panel{min-width:0;padding:54px 54px 35px;display:flex;flex-direction:column;background:linear-gradient(150deg,#fff,#fafbfe)}
.form-wrap{width:100%;max-width:380px;margin:auto}.form-heading{display:flex;align-items:center;gap:14px}.step{width:39px;height:39px;display:grid;place-items:center;border:1px solid rgba(109,74,255,.25);border-radius:12px;background:rgba(109,74,255,.07);color:var(--brand);font:800 11px ui-monospace,monospace}.form-heading small{color:#929bb0;font-size:9px;font-weight:800;letter-spacing:.15em}.form-heading h2{margin:3px 0 0;font-size:30px;letter-spacing:-.035em}.form-note{margin:16px 0 32px;color:var(--muted);font-size:12px}
.field{display:block;margin-bottom:20px}.field>span{display:block;margin-bottom:8px;font-size:12px;font-weight:800}.input-wrap{position:relative}.input-wrap>i{position:absolute;left:15px;top:50%;transform:translateY(-50%);width:20px;color:#929bb0;font:800 11px ui-monospace,monospace;text-align:center}.input-wrap input{width:100%;height:52px;padding:0 68px 0 47px;border:1px solid var(--line);border-radius:14px;outline:0;background:#f7f9fc;color:var(--ink);font:inherit;transition:.18s}.input-wrap input:hover{border-color:#c6cedd}.input-wrap input:focus{border-color:rgba(109,74,255,.72);background:#fff;box-shadow:0 0 0 4px rgba(109,74,255,.1)}.input-wrap input::placeholder{color:#a1a9b8}.input-wrap button{position:absolute;right:7px;top:7px;height:38px;padding:0 10px;border:0;border-radius:9px;background:transparent;color:var(--brand);font-size:10px;font-weight:800;cursor:pointer}.input-wrap button:hover{background:rgba(109,74,255,.07)}
.message{min-height:20px;margin:-4px 0 8px;font-size:11px;line-height:1.6}.message.error{color:var(--danger)}.message.success{color:var(--success)}
.submit-button{width:100%;height:54px;padding:0 19px;border:0;border-radius:15px;display:flex;align-items:center;justify-content:space-between;color:#fff;background:linear-gradient(115deg,var(--brand),#5433cc 62%,#382080);box-shadow:0 15px 32px rgba(109,74,255,.25);font:800 13px inherit;cursor:pointer;transition:.18s}.submit-button:hover{transform:translateY(-2px);box-shadow:0 20px 40px rgba(109,74,255,.32)}.submit-button:disabled{cursor:wait;opacity:.72;transform:none}.submit-button i{font-size:19px}.submit-button.loading i{animation:pulse 1s ease-in-out infinite}
.security-note{display:flex;align-items:flex-start;gap:10px;margin-top:27px;padding-top:21px;border-top:1px dashed var(--line);color:var(--muted);font-size:10px;line-height:1.7}.security-note i{flex:none;width:8px;height:8px;margin-top:4px;border-radius:50%;background:var(--success);box-shadow:0 0 0 5px rgba(28,168,121,.1)}
.form-panel footer{display:flex;justify-content:space-between;gap:15px;color:#9aa3b4;font-size:8px;font-weight:800;letter-spacing:.1em}.form-panel footer span{color:var(--brand)}
@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{50%{opacity:.25;transform:translateX(5px)}}
@media(max-width:820px){.login-shell{width:min(620px,calc(100% - 28px));min-height:0;grid-template-columns:1fr;margin:24px auto}.intro-panel{min-height:300px;padding:31px}.intro-copy{margin:55px 0 22px}.intro-copy h1{font-size:45px}.intro-copy p{font-size:12px}.orbit{right:-115px;bottom:-55px}.form-panel{padding:42px 30px 28px}.form-wrap{margin:0 auto 42px}}
@media(max-width:480px){.login-shell{width:calc(100% - 20px);margin:10px;border-radius:24px}.intro-panel{min-height:270px;padding:24px}.intro-copy{margin:40px 0 18px}.intro-copy h1{font-size:38px;margin:15px 0 12px}.signal-row span:nth-child(3){display:none}.orbit{display:none}.form-panel{padding:34px 22px 24px}.form-heading h2{font-size:26px}.form-note{margin-bottom:27px}.form-panel footer{flex-direction:column}}
@media(prefers-color-scheme:dark){body{background:radial-gradient(circle at 8% 8%,rgba(109,74,255,.18),transparent 30%),radial-gradient(circle at 91% 84%,rgba(27,187,210,.12),transparent 25%),#070b14}.login-shell{border-color:#263249;background:#101827;box-shadow:0 38px 110px rgba(0,0,0,.4)}.form-panel{background:linear-gradient(150deg,#111a29,#0d1522);color:#edf1fb}.input-wrap input{border-color:#29364c;background:#0c1421;color:#edf1fb}.input-wrap input:hover{border-color:#3b4b64}.input-wrap input:focus{background:#101a29}.security-note{border-color:#29364c}.form-panel footer{color:#718099}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}