:root { --bg:#0a0e14; --panel:#0f1419; --line:#1f2937; --text:#e4e7eb;
          --muted:#7c8794; --blue:#3b82f6; --red:#ef4444; }
  * { box-sizing: border-box; }
  body { margin:0; min-height:100vh; background:var(--bg); color:var(--text);
         font:14px -apple-system,Segoe UI,Roboto,sans-serif;
         display:flex; align-items:center; justify-content:center; }
  .card { background:var(--panel); border:1px solid var(--line); border-radius:12px;
          padding:36px 40px; width:360px; box-shadow:0 12px 40px rgba(0,0,0,0.4); }
  h1 { margin:0 0 4px; font-size:20px; letter-spacing:.5px; }
  .sub { color:var(--muted); font-size:12px; margin-bottom:24px; }
  label { display:block; font-size:11px; color:var(--muted); margin:14px 0 6px;
          text-transform:uppercase; letter-spacing:.5px; }
  input { width:100%; padding:10px 12px; background:#0a0e14; color:var(--text);
          border:1px solid var(--line); border-radius:6px; font-size:14px; }
  input:focus { outline:none; border-color:var(--blue); }
  button { width:100%; margin-top:20px; padding:11px; background:var(--blue);
           color:white; border:0; border-radius:6px; font-size:14px;
           font-weight:600; cursor:pointer; }
  button:hover { background:#2563eb; }
  button:disabled { opacity:.5; cursor:not-allowed; }
  .err { color:var(--red); font-size:12px; margin-top:14px; min-height:16px; }