:root{
  --bg:#0E0E0E; --panel:#141414; --border:#2A2A2A;
  --text:#E6E6E6; --dim:#9C9C9C; --faint:#787878; --accent:#D8FA00;
  --title-font:"Bahnschrift","Arial Black","Microsoft YaHei",sans-serif;
  --body-font:"Microsoft YaHei","Segoe UI",sans-serif;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--body-font);font-size:15px}
a{color:var(--accent)}
header.nav{position:sticky;top:0;z-index:5;display:flex;align-items:center;justify-content:space-between;
  padding:14px 6vw;background:rgba(14,14,14,.92);border-bottom:1px solid var(--border)}
.nav-logo{font-family:var(--title-font);font-style:italic;font-weight:900;font-size:26px;color:var(--text);text-decoration:none}
.nav-logo .accent{color:var(--accent)}
.nav-links a{color:var(--dim);font-size:12px;letter-spacing:2px;text-decoration:none;margin-left:22px}
.nav-links a:hover{color:var(--accent)}
.wrap{max-width:860px;margin:0 auto;padding:56px 6vw 80px}
.b-head{margin-bottom:34px}
.b-title{font-family:var(--title-font);font-style:italic;font-weight:900;font-size:clamp(36px,6vw,58px);line-height:1.05}
.b-title span{color:var(--accent)}
.tagline{color:var(--dim);margin-top:12px;font-size:14px;line-height:1.8}
.post-item{display:block;text-decoration:none;color:var(--text);border:1px solid var(--border);background:var(--panel);
  padding:20px 22px;margin-bottom:14px;transition:border-color .15s,transform .15s}
.post-item:hover{border-color:var(--accent);transform:translateX(4px)}
.post-item h3{font-family:var(--title-font);font-style:italic;font-size:19px;letter-spacing:.5px;margin:0}
.post-item .meta{color:var(--faint);font-size:12px;margin-top:6px;letter-spacing:1px}
.post-item p{color:var(--dim);line-height:1.8;margin:10px 0 0}
.article h1{font-family:var(--title-font);font-style:italic;font-weight:900;font-size:clamp(28px,5vw,44px);margin:18px 0 6px;line-height:1.15}
.article .meta{color:var(--faint);font-size:12px;letter-spacing:1px;margin-bottom:28px}
.article .body{line-height:2;color:var(--text);font-size:15px;word-break:break-word}
.article .body p{margin:0 0 1.2em}
.article .body img.hero{width:100%;border:1px solid var(--border);margin-bottom:26px}
.back{color:var(--accent);text-decoration:none;font-size:13px;letter-spacing:2px}
.srcs{margin-top:40px;border-top:1px solid var(--border);padding-top:22px}
.srcs h3{font-family:var(--title-font);font-style:italic;letter-spacing:1px;color:var(--accent);font-size:16px;margin:0 0 6px}
.srcs ul{list-style:none;padding:0;margin:8px 0}
.srcs li{margin-bottom:10px;line-height:1.7;color:var(--dim)}
.srcs a{font-size:13.5px}
footer{max-width:860px;margin:0 auto;padding:0 6vw 50px;color:var(--faint);font-size:12.5px;letter-spacing:1px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}
.grid .post-item{margin-bottom:0}