* { box-sizing: border-box; }
:root { --bg:#0b0f17; --card:#141b27; --fg:#e6edf3; --muted:#8b98a9; --accent:#4f8cff; --ok:#3ecf8e; --border:#263042; }
html, body { margin:0; padding:0; }
body { font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "PingFang SC", "Microsoft YaHei", sans-serif; background:var(--bg); color:var(--fg); line-height:1.8; }
a { color:var(--accent); text-decoration:none; }
a:hover { text-decoration:underline; }
.wrap { max-width:780px; margin:0 auto; padding:28px 20px 80px; }
header.top { border-bottom:1px solid var(--border); padding:18px 20px; }
header.top a.brand { font-weight:700; color:var(--fg); font-size:1.05rem; }
header.top .sub { color:var(--muted); font-size:.82rem; margin-left:10px; }
h1 { font-size:1.7rem; line-height:1.35; margin:26px 0 6px; }
.meta { color:var(--muted); font-size:.84rem; margin-bottom:22px; }
h2 { font-size:1.22rem; margin:30px 0 10px; border-left:3px solid var(--accent); padding-left:10px; }
h3 { font-size:1.02rem; margin:20px 0 8px; }
p { margin:12px 0; }
ul, ol { padding-left:22px; }
li { margin:7px 0; }
strong { color:#fff; }
code { background:#0d131d; border:1px solid var(--border); border-radius:5px; padding:1px 6px; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size:.88em; }
pre { background:#0d131d; border:1px solid var(--border); border-radius:10px; padding:14px; overflow:auto; font-size:.85rem; }
.card { background:var(--card); border:1px solid var(--border); border-radius:12px; padding:16px 18px; margin:16px 0; }
.cta { background:linear-gradient(135deg,#15233f,#132033); border:1px solid var(--border); border-radius:14px; padding:20px; margin:30px 0; text-align:center; }
.cta a.btn { display:inline-block; background:var(--accent); color:#fff; border-radius:9px; padding:11px 20px; font-weight:600; margin-top:8px; }
.cta a.btn:hover { text-decoration:none; opacity:.92; }
footer.foot { text-align:center; color:var(--muted); font-size:.8rem; padding:30px 20px; border-top:1px solid var(--border); }
.related { margin-top:30px; }
.related ul { list-style:none; padding:0; }
.related li { padding:9px 0; border-bottom:1px solid var(--border); }
.grid-posts { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:20px; }
.grid-posts a { display:block; background:var(--card); border:1px solid var(--border); border-radius:12px; padding:14px 16px; }
.grid-posts a:hover { border-color:var(--accent); text-decoration:none; }
.grid-posts .t { font-weight:600; color:var(--fg); }
.grid-posts .d { color:var(--muted); font-size:.82rem; margin-top:4px; }
@media (max-width:680px){ .grid-posts{ grid-template-columns:1fr; } }