:root { --bg:#0b0f17; --card:#131a26; --line:#223047; --txt:#e6edf6; --mut:#8a9bb3; --acc:#f0b90b; --ok:#2ecc71; --bad:#ff5c5c; }
* { box-sizing: border-box; }
body { margin:0; font-family: system-ui, -apple-system, Segoe UI, Roboto, sans-serif; background:var(--bg); color:var(--txt); }
header { display:flex; justify-content:space-between; align-items:center; padding:16px 24px; border-bottom:1px solid var(--line); }
header a { color:var(--txt); text-decoration:none; font-weight:700; }
main { max-width:960px; margin:0 auto; padding:32px 16px; }
h1 { font-size:2rem; margin:0 0 8px; }
p.lead { color:var(--mut); font-size:1.1rem; max-width:620px; }
.grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:24px; margin-top:32px; }
.card { background:var(--card); border:1px solid var(--line); border-radius:12px; padding:24px; }
.card h2 { margin-top:0; font-size:1.2rem; }
label { display:block; font-size:.9rem; color:var(--mut); margin:12px 0 4px; }
input { width:100%; padding:10px 12px; border-radius:8px; border:1px solid var(--line); background:#0e1420; color:var(--txt); font-size:1rem; }
button, .btn { display:inline-block; margin-top:16px; padding:10px 18px; border:0; border-radius:8px; background:var(--acc); color:#111; font-weight:700; font-size:1rem; cursor:pointer; text-decoration:none; }
button.sec { background:transparent; color:var(--mut); border:1px solid var(--line); }
button:disabled { opacity:.6; cursor:wait; }
.err { color:var(--bad); min-height:1.2em; font-size:.9rem; margin-top:8px; }
.badge { display:inline-block; padding:2px 10px; border-radius:99px; font-size:.85rem; font-weight:600; }
.badge.ok { background:rgba(46,204,113,.15); color:var(--ok); }
.badge.no { background:rgba(255,92,92,.15); color:var(--bad); }
.price { font-size:2rem; font-weight:800; }
.muted { color:var(--mut); font-size:.9rem; }
ul.feat { color:var(--mut); padding-left:18px; line-height:1.8; }