:root{--bg:#0a0a14;--panel:#0e0e1b;--line:#2a2a44;--pink:#e23fc8;--text:#e8e8f0;--dim:#8a8aa8;--red:#ff6b6b;--green:#4ee0a0}
*{box-sizing:border-box}
body{margin:0;min-height:100vh;display:grid;place-items:center;background:var(--bg);color:var(--text);font:14px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;padding:16px}
main{width:100%;max-width:340px;border:2px solid var(--pink);border-radius:6px;padding:24px;background:var(--panel)}
h1{margin:0 0 20px;font-size:13px;font-weight:500;letter-spacing:.1em;color:var(--pink)}
label{display:block;color:var(--dim);margin-bottom:6px}
input{width:100%;font:inherit;background:var(--bg);color:var(--text);border:1px solid var(--line);border-radius:3px;padding:10px}
input:focus-visible,button:focus-visible{outline:2px solid var(--green);outline-offset:2px}
.error{min-height:1.5em;margin:10px 0;color:var(--red)}
button{width:100%;font:inherit;background:transparent;color:var(--green);border:1px solid var(--green);border-radius:3px;padding:10px;cursor:pointer}