:root{
  --bg:#FBF7F1; --surface:#FFFFFF; --surface-2:#F5EFE5;
  --ink:#2A2320; --muted:#867a6f; --line:#ECE3D5;
  --accent:#B5552D; --accent-2:#8a3f1f; --accent-soft:#F4E3D5;
  --radius:16px; --maxw:720px;
}
@media (prefers-color-scheme: dark){
  :root{
    --bg:#141110; --surface:#1E1A17; --surface-2:#26211C;
    --ink:#EFE7DC; --muted:#A2968A; --line:#332C26;
    --accent:#E29A60; --accent-2:#C77A3E; --accent-soft:#2A211A;
  }
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  line-height:1.65;color:var(--ink);background:var(--bg);margin:0;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 18px 72px}
.brand{display:flex;align-items:center;gap:12px;padding:22px 0 18px;
  border-bottom:1px solid var(--line);margin-bottom:26px}
.brand .mark{width:42px;height:42px;border-radius:12px;flex:0 0 auto;
  background:linear-gradient(135deg,var(--accent),var(--accent-2));
  color:#fff;font-weight:800;font-size:21px;display:flex;align-items:center;
  justify-content:center;box-shadow:0 5px 16px rgba(181,85,45,.30)}
.brand .name{font-weight:750;font-size:1.06rem;letter-spacing:.2px}
.brand .sub{color:var(--muted);font-size:.82rem;margin-top:1px}
h1{font-size:1.72rem;line-height:1.22;margin:8px 0 8px;letter-spacing:-.012em}
h2{font-size:1.12rem;margin:32px 0 8px;letter-spacing:-.006em}
.updated{display:inline-block;color:var(--muted);font-size:.78rem;
  background:var(--surface-2);border:1px solid var(--line);
  padding:4px 11px;border-radius:999px;margin-bottom:8px}
p{margin:11px 0}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
ul,ol{padding-left:22px;margin:10px 0}
li{margin:7px 0}
strong{font-weight:650}
code{background:var(--surface-2);border:1px solid var(--line);
  padding:1px 6px;border-radius:6px;font-size:.86em}
.card{background:var(--surface);border:1px solid var(--line);
  border-radius:var(--radius);padding:16px 20px;margin:14px 0;
  box-shadow:0 1px 2px rgba(0,0,0,.04),0 10px 26px rgba(0,0,0,.05)}
.card.step{border-left:3px solid var(--accent)}
.card ol,.card ul{margin:4px 0}
.intro{color:var(--ink);font-size:1.02rem}
.foot{margin-top:46px;padding-top:20px;border-top:1px solid var(--line);
  color:var(--muted);font-size:.84rem}
.foot .links{display:flex;flex-wrap:wrap;gap:8px 16px;margin-bottom:11px}
.foot .links a{color:var(--muted);font-weight:550}
.foot .links a:hover{color:var(--accent)}
