* { box-sizing:border-box; }
html { color-scheme:dark; }
body { margin:0; min-height:100vh; min-height:100dvh; display:grid; place-items:center; padding:24px; background:radial-gradient(ellipse at 50% 0%,#183754 0%,#0e1c32 40%,#0b1020 75%); font-family:Inter,"PingFang SC","Microsoft YaHei",sans-serif; color:#eaf1fb; -webkit-font-smoothing:antialiased; }
body::before { content:""; position:fixed; inset:0; pointer-events:none; background-image:linear-gradient(#72c8ff03 1px,transparent 1px),linear-gradient(90deg,#72c8ff03 1px,transparent 1px); background-size:64px 64px; }
.box { position:relative; width:min(100%,410px); padding:36px; background:#122039; border:1px solid #2b4568; border-radius:18px; box-shadow:0 24px 90px #0005; }
.mark { display:grid; place-items:center; width:48px; height:48px; color:#72c8ff; font-size:45px; font-weight:800; letter-spacing:-3px; margin-bottom:19px; }
.eyebrow { font-size:12px; letter-spacing:1.2px; color:#89c9f4; margin-bottom:12px; }
.brand { font-size:24px; font-weight:600; letter-spacing:-.5px; }
.sub { font-size:12px; color:#8199b9; margin:10px 0 28px; line-height:1.7; }
.field { margin-top:18px; }
.field label { display:block; font-size:12px; color:#a3b9d4; margin-bottom:8px; }
input { width:100%; padding:14px; border:1px solid #2e4565; background:#0c192d; border-radius:9px; font-size:16px; color:#edf5ff; outline:none; }
input:focus { border-color:#72c8ff; box-shadow:0 0 0 3px #72c8ff12; }
input::placeholder { color:#567496; font-size:13px; }
button { width:100%; background:#72c8ff; border:0; min-height:46px; padding:14px; color:#0c2c47; border-radius:9px; font-size:13px; font-weight:600; margin-top:25px; cursor:pointer; }
button:hover { background:#9bdaff; }
button:focus-visible { outline:2px solid #b3e3ff; outline-offset:4px; }
.err { min-height:18px; color:#ff899b; font-size:12px; margin-top:12px; }
.secure { text-align:center; margin-top:17px; border-top:1px solid #263c59; padding-top:20px; color:#6b88ab; font-size:10px; letter-spacing:.5px; }
@media(max-width:480px) { .box { padding:28px; } .brand { font-size:22px; } }