* { margin: 0; padding: 0; box-sizing: border-box; }
body {
  font-family: 'Geist', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  background: #08080a;
  color: #e6e6ea;
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background-image: radial-gradient(circle at 50% 0%, rgba(99,102,241,0.12), transparent 60%);
}
.login-wrap { width: 100%; max-width: 400px; padding: 24px; }
.login-card {
  background: #0f0f14;
  border: 1px solid #1e1e26;
  border-radius: 16px;
  padding: 40px 32px;
  box-shadow: 0 20px 60px rgba(0,0,0,0.5);
}
.brand { text-align: center; margin-bottom: 28px; }
.logo { font-size: 40px; margin-bottom: 8px; }
.brand h1 { font-size: 22px; font-weight: 600; letter-spacing: -0.02em; }
.brand .sub { color: #8a8a99; font-size: 13.5px; margin-top: 4px; }
form { display: flex; flex-direction: column; gap: 6px; }
label { font-size: 12.5px; color: #8a8a99; margin-top: 12px; font-weight: 500; }
input {
  background: #15151c;
  border: 1px solid #262630;
  border-radius: 10px;
  padding: 12px 14px;
  color: #e6e6ea;
  font-size: 14.5px;
  outline: none;
  transition: border-color .15s;
}
input:focus { border-color: #6366f1; }
button {
  margin-top: 22px;
  background: #6366f1;
  color: #fff;
  border: none;
  border-radius: 10px;
  padding: 13px;
  font-size: 14.5px;
  font-weight: 600;
  cursor: pointer;
  transition: background .15s;
}
button:hover { background: #4f46e5; }
button:disabled { opacity: .6; cursor: not-allowed; }
.err { color: #f87171; font-size: 13px; margin-top: 14px; min-height: 18px; text-align: center; }