:root { --bg:#0b0f1a; --fg:#f5f7fa; --muted:#9aa4b2; --accent:#5b8cff; --card:#141b2d; }
* { box-sizing: border-box; }
body { margin:0; font-family: system-ui, sans-serif; background:var(--bg); color:var(--fg); }
.hero { min-height:100vh; display:grid; place-content:center; text-align:center; gap:1rem; padding:2rem; }
.btn { display:inline-block; background:var(--accent); color:#fff; padding:.7rem 1.4rem; border-radius:8px; text-decoration:none; border:0; cursor:pointer; font-size:1rem; }
.wrap { max-width:900px; margin:0 auto; padding:2rem; }
.card { background:var(--card); border:1px solid #223; border-radius:12px; padding:1.2rem; margin:1rem 0; }
.row { display:flex; justify-content:space-between; align-items:center; gap:1rem; padding:.6rem 0; border-bottom:1px solid #223; }
input { width:100%; padding:.6rem; border-radius:8px; border:1px solid #334; background:#0e1424; color:var(--fg); margin:.3rem 0 .8rem; }
.muted { color:var(--muted); font-size:.9rem; }
progress { width:100%; }
.err { color:#ff6b6b; }