:root { --cobalt: #0a29ff; --lime: #c6ff00; --pine: #073b2e; --offwhite: #f4f2ec; --ink: #10140f; --muted: #6b726d; --line: #e2dfd6; --bad: #b42318; }
* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; }
body { font: 15px/1.5 -apple-system, BlinkMacSystemFont, "Inter", "Segoe UI", sans-serif; background: var(--pine); color: var(--ink); display: grid; place-items: center; min-height: 100vh; padding: 16px; }
form { background: #fff; border-radius: 18px; padding: 28px; width: min(380px, 100%); box-shadow: 0 20px 60px rgba(0,0,0,.25); }
h1 { font-size: 18px; margin: 0 0 18px; }
h1 b { color: var(--cobalt); }
label { display: block; font-size: 13px; color: var(--muted); margin: 14px 0 6px; }
input { width: 100%; font: inherit; padding: 11px 12px; border: 1px solid var(--line); border-radius: 10px; }
input:focus { outline: 2px solid var(--cobalt); border-color: transparent; }
button { margin-top: 20px; width: 100%; font: inherit; font-weight: 600; padding: 12px; border: 0; border-radius: 12px; background: var(--cobalt); color: #fff; cursor: pointer; }
button:disabled { opacity: .5; }
#err { color: var(--bad); font-size: 14px; min-height: 20px; margin: 12px 0 0; }