:root{
  --accent:#29E389; --warn:#FF9F0A; --danger:#FF5A5F;
  --bg-top:#0B1020; --bg-bottom:#060911;
  --card:rgba(255,255,255,.06); --stroke:rgba(255,255,255,.10);
  --text:#fff; --text2:rgba(255,255,255,.66); --text3:rgba(255,255,255,.42);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  color:var(--text); line-height:1.6;
  background:radial-gradient(900px 500px at 50% -10%, rgba(41,227,137,.14), transparent 60%),
             linear-gradient(180deg,var(--bg-top),var(--bg-bottom) 70%);
  background-attachment:fixed; min-height:100vh;
}
.wrap{max-width:760px; margin:0 auto; padding:28px 20px 80px}
header.site{display:flex; align-items:center; gap:12px; padding:8px 0 28px}
header.site .logo{width:40px;height:40px;border-radius:10px;
  background:linear-gradient(135deg,var(--accent),#0f9b63); display:grid;place-items:center;
  font-weight:800;color:#04140c}
header.site b{font-size:20px}
nav a{color:var(--text2); text-decoration:none; margin-left:18px; font-size:15px}
nav a:hover{color:var(--accent)}
h1{font-size:34px; line-height:1.2; margin:.2em 0 .3em}
h2{font-size:22px; margin:1.8em 0 .5em}
h3{font-size:17px; margin:1.4em 0 .3em; color:var(--text)}
p,li{color:var(--text2)}
.lead{font-size:18px;color:var(--text)}
a{color:var(--accent)}
.card{background:var(--card); border:1px solid var(--stroke); border-radius:16px; padding:18px 20px; margin:14px 0}
.note{border-color:rgba(255,159,10,.4)}
.note b{color:var(--warn)}
.btn{display:inline-block; background:linear-gradient(135deg,var(--accent),rgba(41,227,137,.75));
  color:#04140c; font-weight:700; text-decoration:none; padding:12px 22px; border-radius:14px; margin-top:8px}
.muted{color:var(--text3); font-size:13px}
.sep{height:1px;background:var(--stroke);margin:48px 0}
.lang-tag{display:inline-block;font-size:12px;letter-spacing:.08em;text-transform:uppercase;
  color:var(--accent);border:1px solid rgba(41,227,137,.35);border-radius:999px;padding:3px 10px;margin-bottom:8px}
ul{padding-left:20px}
footer{color:var(--text3);font-size:13px;padding-top:40px;text-align:center}
code{background:rgba(255,255,255,.08);padding:2px 6px;border-radius:6px;font-size:13px}

/* Step-by-step guide */
.crumbs{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:10px 0 4px;font-size:14px}
.crumb{background:rgba(255,255,255,.08);border:1px solid var(--stroke);border-radius:8px;padding:4px 10px;color:var(--text)}
.crumbs .sep{color:var(--text3)}
ol.steps{list-style:none;counter-reset:s;padding:0;margin:14px 0}
ol.steps>li{counter-increment:s;position:relative;padding:2px 0 18px 46px;margin:0;color:var(--text2)}
ol.steps>li::before{content:counter(s);position:absolute;left:0;top:0;width:30px;height:30px;border-radius:50%;
  background:linear-gradient(135deg,var(--accent),#0f9b63);color:#04140c;font-weight:800;display:grid;place-items:center;font-size:15px}
ol.steps>li::after{content:"";position:absolute;left:14px;top:32px;bottom:0;width:2px;background:var(--stroke)}
ol.steps>li:last-child::after{display:none}
ol.steps>li b{color:var(--text)}
.uirow{display:flex;align-items:center;gap:10px;background:var(--card);border:1px solid var(--stroke);
  border-radius:12px;padding:11px 14px;margin:10px 0;max-width:380px}
.uirow .ic{width:26px;height:26px;border-radius:7px;background:linear-gradient(135deg,var(--accent),#0f9b63);
  display:inline-grid;place-items:center;color:#04140c;font-weight:800;font-size:13px}
.uirow .lbl{flex:1;color:var(--text);font-weight:600}
.tgl{width:46px;height:28px;border-radius:999px;background:rgba(255,255,255,.20);position:relative;flex:none}
.tgl::after{content:"";position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:#fff}
.tgl.on{background:var(--accent)}
.tgl.on::after{left:auto;right:3px}
.addrbar{display:flex;align-items:center;gap:8px;background:rgba(255,255,255,.10);border:1px solid var(--stroke);
  border-radius:12px;padding:9px 12px;margin:10px 0;max-width:380px;color:var(--text2);font-size:14px}
.addrbar .aa{font-weight:800;color:var(--text);background:rgba(255,255,255,.14);border-radius:6px;padding:2px 9px}
.addrbar .url{flex:1;text-align:center}
.pillbtn{display:inline-block;background:rgba(41,227,137,.18);border:1px solid rgba(41,227,137,.4);
  color:var(--accent);border-radius:8px;padding:3px 12px;font-size:13px;font-weight:700}