* { box-sizing:border-box; }
body { display:grid; min-height:100vh; min-height:100dvh; place-items:center; margin:0; padding:24px; background:radial-gradient(ellipse at 15% 8%,#fff1f3 0,transparent 42%),radial-gradient(ellipse at 90% 88%,#edf5f4 0,transparent 40%),#f5f7fb; color:#202d43; font-family:ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
.login-card { width:min(100%,420px); padding:38px; border:1px solid #e7eaf1; border-radius:24px; background:#fff; box-shadow:0 24px 70px #23344d12; }
.login-mark { display:block; width:48px; height:48px; margin-bottom:24px; border-radius:15px; }
.login-eyebrow { margin:0 0 8px; color:#cc5a70; font-size:10px; font-weight:800; letter-spacing:.17em; }
h1 { margin:0; color:#1e2c42; font-size:26px; font-weight:760; letter-spacing:-.03em; }
.login-description { margin:9px 0 25px; color:#7a8699; font-size:13px; line-height:1.6; }
form { display:grid; gap:9px; }
label { margin-top:7px; color:#4e5d74; font-size:12px; font-weight:700; }
input { width:100%; height:46px; padding:0 13px; border:1px solid #e0e5ee; border-radius:11px; outline:none; background:#fbfcfe; color:#27364d; font:inherit; font-size:14px; }
input:focus { border-color:#e98da3; box-shadow:0 0 0 4px #e98da31a; }
.login-error { min-height:18px; margin:2px 0 0; color:#c83c53; font-size:12px; line-height:1.5; }
button { display:flex; width:100%; min-height:46px; align-items:center; justify-content:space-between; margin-top:3px; padding:0 16px; border:0; border-radius:11px; background:linear-gradient(110deg,#e84b67,#f17459); box-shadow:0 8px 18px #e84b6728; color:#fff; font:inherit; font-size:13px; font-weight:720; cursor:pointer; }
button:hover:not(:disabled) { filter:brightness(.97); transform:translateY(-1px); }
button:disabled { opacity:.65; cursor:wait; }
button:focus-visible { outline:3px solid #e84b6755; outline-offset:3px; }
@media(max-width:480px) { .login-card { padding:28px 23px; border-radius:20px; } }