:root { --bg:#f6f7f9; --card:#fff; --text:#1d2330; --muted:#667085; --accent:#2563eb; --err:#b42318; --border:#d0d5dd; }
* { box-sizing: border-box; }
body { margin:0; padding:16px; background:var(--bg); color:var(--text); font:15px/1.4 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; }
.card { max-width:480px; margin:0 auto; background:var(--card); border:1px solid var(--border); border-radius:10px; padding:20px; }
h1 { margin:0 0 16px; font-size:20px; }
label { display:block; margin-bottom:6px; color:var(--muted); font-size:13px; }
.row { display:flex; gap:8px; }
input { flex:1; min-width:0; padding:9px 12px; border:1px solid var(--border); border-radius:8px; font:inherit; }
input:focus { outline:2px solid var(--accent); outline-offset:-1px; border-color:transparent; }
button { padding:9px 16px; border:0; border-radius:8px; background:var(--accent); color:#fff; font:inherit; font-weight:600; cursor:pointer; }
button:disabled, input:disabled { opacity:.55; cursor:not-allowed; }
.status { margin:12px 0 0; min-height:1.4em; color:var(--muted); font-size:13px; }
.status.error { color:var(--err); }