:root{--bg:#fafaf7;--fg:#1c2230;--muted:#525b6b;--accent:#1d5fd1;--accent-d:#164aa3;--line:#dcdfe6;--card:#fff;--warn:#fff4d6}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--fg);font:16px/1.6 system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
.wrap{max-width:820px;margin:0 auto;padding:0 16px}
header.top{border-bottom:1px solid var(--line);padding:14px 0}
header.top .wrap{display:flex;justify-content:space-between;gap:12px;align-items:center;flex-wrap:wrap}
.brand{font-weight:700;color:var(--fg);text-decoration:none}
h1{font-size:clamp(1.9rem,6vw,2.7rem);line-height:1.15;margin:40px 0 12px}
h2{font-size:1.5rem;margin:48px 0 12px}
h3{font-size:1.05rem;margin:0 0 4px}
p{margin:0 0 12px}
a{color:var(--accent)}
.lead{font-size:1.15rem;color:var(--muted)}
.btns{display:flex;gap:12px;flex-wrap:wrap;margin:20px 0 8px}
.btn{display:inline-block;padding:12px 20px;border-radius:8px;font-weight:600;text-decoration:none;border:2px solid var(--accent)}
.btn.p{background:var(--accent);color:#fff}.btn.p:hover{background:var(--accent-d)}
.btn.s{color:var(--accent);background:transparent}
.small{font-size:.9rem;color:var(--muted)}
.steps{display:grid;gap:12px;padding:0;list-style:none;counter-reset:s}
.steps li{counter-increment:s;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:14px 16px 14px 56px;position:relative}
.steps li:before{content:counter(s);position:absolute;left:16px;top:14px;width:28px;height:28px;border-radius:50%;background:var(--accent);color:#fff;text-align:center;line-height:28px;font-weight:700}
ul.ck{padding-left:20px}ul.ck li{margin-bottom:8px}
.note{background:var(--warn);border-radius:8px;padding:10px 14px;font-size:.95rem}
.tw{overflow-x:auto;border:1px solid var(--line);border-radius:8px;background:var(--card);margin:8px 0 16px}
table{border-collapse:collapse;width:100%;font-size:.85rem;white-space:nowrap}
th,td{padding:6px 10px;border-bottom:1px solid var(--line);text-align:left}
th{background:#eef1f6}
tr.bad td{background:#fff4d6}
details{background:var(--card);border:1px solid var(--line);border-radius:8px;padding:12px 16px;margin-bottom:8px}
summary{font-weight:600;cursor:pointer}
details p{margin:8px 0 0}
footer{border-top:1px solid var(--line);margin-top:56px;padding:24px 0 40px;color:var(--muted);font-size:.95rem}
footer a{margin-right:12px}
a:focus-visible,summary:focus-visible{outline:3px solid #f5a623;outline-offset:2px}