:root {font-family:Inter,"Segoe UI","Microsoft YaHei",system-ui,sans-serif;color:#261e42;background:#33245a;font-synthesis:none}
* {box-sizing:border-box}
html,body {margin:0;min-height:100%}
button,input {font:inherit}
.login-view {position:relative;display:flex;flex-direction:column;min-height:100vh;min-height:100dvh;overflow:hidden;isolation:isolate;color:#fff;background:radial-gradient(circle at 75% 30%,#9b70c9 0,#7750b4 20%,transparent 49%),radial-gradient(circle at 7% 96%,#714994 0,transparent 42%),linear-gradient(120deg,#291d52 4%,#573793 47%,#7048b5 100%)}
.login-view::before {content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(145deg,#ffffff09 1px,transparent 1px),linear-gradient(55deg,#ffffff08 1px,transparent 1px);background-size:85px 85px,105px 105px;mask-image:linear-gradient(90deg,transparent,#0009,transparent)}
.login-view::after {content:"";position:absolute;width:520px;height:520px;left:-210px;bottom:-300px;border:1px solid #ffffff15;border-radius:50%;box-shadow:0 0 0 75px #ffffff06,0 0 0 150px #ffffff04;pointer-events:none}
.login-topbar {display:flex;align-items:center;justify-content:space-between;width:min(1400px,calc(100% - 84px));height:90px;flex:none;margin:0 auto}
.brand {display:flex;align-items:center;gap:11px}
.brand-mark {display:block;width:40px;height:40px;flex:none;border-radius:12px;background:#fff;box-shadow:0 5px 16px #140b4255;object-fit:contain}
.brand-name strong,.brand-name small {display:block}
.brand-name strong {font-size:17px;line-height:1.1}
.brand-name small {margin-top:4px;color:#f2e8ff;font-size:10px;font-weight:600;letter-spacing:.16em}
.topbar-pill {display:flex;align-items:center;gap:8px;padding:9px 14px;border:1px solid #ffffff39;border-radius:30px;background:#ffffff12;color:#f6e9ff;font-size:12px;font-weight:600}
.status-dot {width:7px;height:7px;border-radius:50%;background:#78e6bc;box-shadow:0 0 0 4px #78e6bc22}
.login-backdrop {position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.login-backdrop span {position:absolute;color:#ffffff0e;font-size:clamp(110px,18vw,350px);font-weight:800;letter-spacing:-.09em;transform:rotate(-14deg)}
.login-backdrop span:first-child {left:-4%;top:38%}
.login-backdrop span:last-child {right:-8%;top:50%}
.login-center {display:grid;grid-template-columns:minmax(350px,1.2fr) minmax(410px,.85fr);align-items:center;gap:clamp(80px,11vw,210px);width:min(1190px,calc(100% - 84px));flex:1;margin:0 auto 40px}
.login-intro {padding-bottom:35px}
.eyebrow {display:block;color:#f5d590;font-size:11px;font-weight:800;letter-spacing:.23em}
.login-intro h1 {margin:22px 0 20px;font-size:clamp(42px,4.4vw,68px);line-height:1.2;letter-spacing:-.055em}
.login-intro h1 em {color:#ffd58a;font-style:normal}
.login-intro p {max-width:500px;margin:0;color:#e1d6f4;font-size:16px;line-height:1.95}
.intro-chips {display:flex;flex-wrap:wrap;gap:9px;margin-top:28px}
.intro-chips span {padding:8px 12px;border:1px solid #ffffff30;border-radius:50px;background:#ffffff12;color:#f4eafd;font-size:12px;font-weight:600}
.login-card-wrap {width:100%}
.login-card {padding:42px 40px 31px;border:1px solid #ffffff70;border-radius:25px;background:linear-gradient(150deg,#ffffffef,#f7f1fff0);box-shadow:0 22px 70px #21103f53,0 1px 0 #fff inset;color:#281f46}
.login-icon {display:block;width:54px;height:54px;margin-bottom:25px;border:1px solid #f0cf88;border-radius:17px;background:#fff;box-shadow:0 8px 20px #eab04e28;object-fit:contain}
.card-kicker {margin:0 0 8px;color:#8c6bb4;font-size:10px;font-weight:800;letter-spacing:.2em}
.login-card h2 {margin:0;font-size:26px;letter-spacing:-.03em}
.card-subtitle {margin:8px 0 27px;color:#827895;font-size:13px}
.login-card form {display:flex;flex-direction:column}
.login-card label {margin-bottom:8px;color:#554968;font-size:12px;font-weight:700}
.login-card input {height:47px;margin-bottom:17px;padding:0 14px;border:1px solid #e0daeb;border-radius:10px;outline:none;background:#fff;color:#332748}
.login-card input::placeholder {color:#a7a0b7}
.login-card input:focus-visible {border-color:#8865bc;box-shadow:0 0 0 3px #8c6bb424}
.primary {display:flex;justify-content:space-between;align-items:center;height:49px;margin-top:7px;padding:0 18px;border:0;border-radius:10px;background:linear-gradient(105deg,#f7cc73,#f5aa35);box-shadow:0 9px 18px #edaa4660;color:#503216;font-size:14px;font-weight:800;cursor:pointer}
.primary:disabled {opacity:.76;cursor:wait}
.primary span {font-size:20px}
.status {min-height:32px;margin:15px 0 0;padding:9px 11px;border-radius:8px;background:#f3eff9;color:#75688a;font-size:11px;line-height:1.5}
.status:empty {visibility:hidden}
.login-security {margin:15px 0 0;color:#e4d9f4;font-size:11px;line-height:1.6;text-align:center}
.login-footer {padding:0 20px 26px;color:#d9c7ef;font-size:11px;letter-spacing:.03em;text-align:center}
.login-footer span {padding:0 7px;color:#efcd8c}
@media (max-width:1050px) {.login-center {grid-template-columns:minmax(280px,1fr) minmax(350px,430px);gap:50px}.login-intro h1 {font-size:45px}}
@media (max-width:760px) {.login-topbar {width:calc(100% - 36px);height:72px}.login-center {display:block;width:min(460px,calc(100% - 36px));margin:16px auto 36px}.login-intro {padding:0 0 25px}.login-intro h1 {margin:11px 0;font-size:clamp(30px,8vw,40px)}.login-intro p {font-size:12px;line-height:1.7}.intro-chips {margin-top:15px}.login-card {padding:28px 24px 22px}.login-icon {width:46px;height:46px;margin-bottom:18px}.login-footer {padding-bottom:max(18px,env(safe-area-inset-bottom))}}
@media (max-width:380px) {.intro-chips {display:none}.login-card {padding:24px 20px 18px}.login-card h2 {font-size:22px}.topbar-pill {padding:8px 10px}}
