:root { --primary:#8E54E9; --text:#2B2730; --sub:#6F6C73; --bg:#FFFFFF; --fill:#F6F3FB; --line:#ECE8F2; --todo:#FFF6D6; --todoLine:#F0D77A; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --text:#EEEAF3; --sub:#ABA7B1; --bg:#141218; --fill:#1C1922; --line:#2C2834; --todo:#3A3216; --todoLine:#7A6A2A; } }
:root[data-theme="dark"] { --text:#EEEAF3; --sub:#ABA7B1; --bg:#141218; --fill:#1C1922; --line:#2C2834; --todo:#3A3216; --todoLine:#7A6A2A; }
* { box-sizing: border-box; }
body { margin:0; background:var(--bg); color:var(--text); line-height:1.8; }
a { color:var(--primary); }
.top { border-bottom:1px solid var(--line); }
.top .in, main, footer .in { max-width:820px; margin:0 auto; padding:0 16px; }
.top .in { display:flex; align-items:center; gap:12px; height:60px; }
.brand { display:flex; align-items:center; gap:8px; font-weight:800; color:var(--text); text-decoration:none; }
.brand img { width:28px; height:28px; border-radius:8px; }
.langs { margin-left:auto; display:flex; flex-wrap:wrap; gap:4px 10px; font-size:var(--fs-xs); }
.langs a { color:var(--sub); text-decoration:none; }
.langs a[aria-current] { color:var(--primary); font-weight:700; }
main { padding-top:36px; padding-bottom:64px; }
h1 { font-size:var(--fs-2xl); line-height:1.35; margin:0 0 6px; }
.meta { color:var(--sub); font-size:var(--fs-sm); margin:0 0 28px; }
h2 { font-size:var(--fs-xl); margin:36px 0 10px; padding-top:8px; }
h3 { font-size:var(--fs-body); margin:20px 0 6px; }
p, li { margin:6px 0; }
ul, ol { padding-left:22px; }
.lead { background:var(--fill); border-radius:12px; padding:14px 16px; }
.tw { overflow-x:auto; margin:10px 0; }
table { width:100%; border-collapse:collapse; font-size:var(--fs-body); }
th, td { border:1px solid var(--line); padding:8px 10px; text-align:left; vertical-align:top; }
th { background:var(--fill); font-weight:700; }
.toc { columns:2; font-size:var(--fs-sm); padding-left:20px; }
.todo { background:var(--todo); border:1px dashed var(--todoLine); border-radius:8px; padding:2px 6px; }
div.todo { padding:10px 14px; margin:12px 0; font-size:var(--fs-sm); }
footer { border-top:1px solid var(--line); padding:28px 0 40px; color:var(--sub); font-size:var(--fs-sm); }
@media (max-width:560px) { .toc { columns:1; } }