:root{
  --bg:#07090a; --card:#0e1315; --fg:#e6eceb; --dim:#7d8f8c;
  --mint:#5ac8a8; --line:#182022;
}
@font-face{
  font-family:"Mono"; src:url("/fonts/PlexMono-400.woff2") format("woff2");
  font-weight:400; font-display:swap;
}
*{box-sizing:border-box}
body{
  margin:0; background:var(--bg); color:var(--fg);
  font:400 15.5px/1.75 "PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans SC",system-ui,sans-serif;
}
a{color:var(--mint); text-decoration:none}
a:hover{text-decoration:underline; text-underline-offset:3px}
.wrap{max-width:900px; margin:0 auto; padding:0 24px}
header{border-bottom:1px solid var(--line)}
header .wrap{display:flex; align-items:baseline; gap:16px; height:70px}
.logo{font-family:"Mono",monospace; font-size:15px; color:var(--mint); letter-spacing:.02em}
.sub{font-size:12px; color:var(--dim)}
header nav{margin-left:auto; display:flex; gap:20px}
header nav a{color:var(--dim); font-size:13px}
header nav a:hover{color:var(--mint)}
main{padding:54px 0 70px}
h1{font-size:27px; font-weight:600; margin:0 0 8px; letter-spacing:-.01em}
.lead{color:var(--dim); font-size:14.5px; margin:0 0 40px}
.grid{display:grid; grid-template-columns:repeat(2,1fr); gap:16px}
.card{background:var(--card); border:1px solid var(--line); padding:22px 22px 20px; display:flex; flex-direction:column; transition:border-color .15s}
.card:hover{border-color:#2c3a3c}
.card .k{font-family:"Mono",monospace; font-size:11.5px; color:var(--mint); letter-spacing:.05em; margin-bottom:12px}
.card h2{font-size:16px; font-weight:600; margin:0 0 8px; line-height:1.5}
.card h2 a{color:var(--fg)}
.card h2 a:hover{color:var(--mint); text-decoration:none}
.card p{margin:0; color:var(--dim); font-size:13.5px; line-height:1.7}
.card .more{margin-top:14px; font-family:"Mono",monospace; font-size:11px; color:var(--dim)}
article h1{margin-bottom:6px}
article .k{font-family:"Mono",monospace; font-size:12px; color:var(--mint); display:block; margin-bottom:26px}
article p{margin:0 0 20px}
article h2{font-size:17px; font-weight:600; margin:34px 0 12px}
pre{background:var(--card); border:1px solid var(--line); padding:14px 16px; overflow:auto; font-size:12.5px}
code{font-family:"Mono",monospace; font-size:.9em; color:var(--mint)}
footer{border-top:1px solid var(--line); margin-top:20px}
footer .wrap{padding:22px 24px; font-family:"Mono",monospace; font-size:11.5px; color:var(--dim); display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px}
.nf{font-family:"Mono",monospace}
.nf h1{color:var(--mint); font-size:46px; margin-bottom:8px}
@media(max-width:700px){ .grid{grid-template-columns:1fr} main{padding:36px 0 52px} }