:root { --bg:#0a0b0e; --panel:#1e2330; --border:#3b4459; --text:#f1f5f9; --muted:#a7b2c3; --accent:#38bdf8; }
* { box-sizing:border-box; }
body { margin:0; min-width:320px; background:var(--bg); color:var(--text); font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; font-size:17px; line-height:1.85; }
main { width:min(900px,calc(100% - 32px)); margin:32px auto; padding:clamp(26px,5vw,56px); background:var(--panel); border:1px solid var(--border); border-radius:16px; box-shadow:0 24px 54px rgba(0,0,0,.35); }
nav { display:flex; justify-content:space-between; gap:16px; font-size:15px; }
a { color:var(--accent); text-decoration:none; }
a:hover { text-decoration:underline; }
h1 { margin:44px 0 12px; font-size:clamp(30px,5vw,44px); line-height:1.25; }
h2 { margin:52px 0 20px; padding-bottom:10px; border-bottom:1px solid var(--border); font-size:24px; }
h3 { margin:30px 0 10px; font-size:18px; color:var(--accent); }
p, li { color:var(--muted); }
p { margin:0 0 18px; }
strong { color:var(--text); }
ul, ol { margin:0; padding-left:1.45em; }
li + li { margin-top:14px; }
.lead { margin:0; font-size:18px; }
.steps { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:26px; }
.card { padding:20px; border:1px solid var(--border); border-radius:10px; background:#181c26; }
.card strong { display:block; margin-bottom:7px; color:var(--accent); }
.note { margin-top:22px; padding:18px 20px; border-left:3px solid var(--accent); background:#181c26; border-radius:0 8px 8px 0; }
footer { display:flex; flex-wrap:wrap; justify-content:space-between; gap:14px; margin-top:56px; padding-top:24px; border-top:1px solid var(--border); color:var(--muted); font-size:14px; }
@media (max-width:640px) { main { margin:16px auto; } .steps { grid-template-columns:1fr; } }