*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--bg:#0a0a0f;--surface:#13131a;--border:#2a2a3a;--accent:#6c63ff;--accent2:#ff6584;--text:#e8e8f0;--muted:#6b6b80;--radius:12px}html,body,#root{background:var(--bg);width:100%;height:100%;color:var(--text);-webkit-font-smoothing:antialiased;font-family:Inter,system-ui,-apple-system,sans-serif;overflow:hidden}button{cursor:pointer;border:none;outline:none;font-family:inherit}input{outline:none;font-family:inherit}.page{flex-direction:column;justify-content:center;align-items:center;gap:16px;height:100%;padding:24px;display:flex}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);width:100%;max-width:420px;padding:32px}.card h1{letter-spacing:-.03em;margin-bottom:8px;font-size:1.8rem;font-weight:700}.card p{color:var(--muted);margin-bottom:24px;font-size:.95rem}.input{background:var(--bg);border:1px solid var(--border);width:100%;color:var(--text);border-radius:8px;margin-bottom:12px;padding:12px 16px;font-size:1rem;transition:border-color .15s}.input:focus{border-color:var(--accent)}.btn{border-radius:8px;width:100%;padding:13px 20px;font-size:1rem;font-weight:600;transition:opacity .15s,transform .1s}.btn:active{transform:scale(.98)}.btn-primary{background:var(--accent);color:#fff}.btn-primary:hover{opacity:.88}.btn-secondary{border:1px solid var(--border);color:var(--text);background:0 0;margin-top:8px}.btn-secondary:hover{border-color:var(--accent);color:var(--accent)}.btn-danger{color:#fff;background:#c34}.code-display{letter-spacing:.18em;color:var(--accent);text-align:center;margin:12px 0;font-size:2.8rem;font-weight:800}.label{text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin-bottom:6px;font-size:.78rem;font-weight:600}.error-msg{color:var(--accent2);margin-top:8px;font-size:.85rem}