:root{--bg:#fff;--ink:#0b0b0a;--muted:#6c685f;--line:#e7e2d5;--soft:#faf8f3;--accent:#c8362a}
@media(prefers-color-scheme:dark){:root{--bg:#070707;--ink:#f2f0ea;--muted:#a6a39a;--line:#242422;--soft:#101010;--accent:#ff6a5c}}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font:17px/1.8 "Helvetica Neue",Arial,sans-serif;-webkit-font-smoothing:antialiased}
a{color:var(--accent)}img{max-width:100%;height:auto}
.bh{display:flex;justify-content:space-between;align-items:center;gap:16px;max-width:980px;margin:0 auto;padding:18px 22px}
.bh-brand{font-weight:800;letter-spacing:-.03em;color:var(--ink);text-decoration:none;font-size:18px}
.bh nav{display:flex;gap:18px;flex-wrap:wrap}.bh nav a{font-size:13px;font-weight:700;color:var(--ink);text-decoration:none}.bh nav a:hover{color:var(--accent)}
main{max-width:720px;margin:0 auto;padding:24px 22px 72px}
h1{font-size:clamp(32px,6vw,54px);line-height:1.04;letter-spacing:-.04em;margin:14px 0 12px}
.crumbs{font-size:12px;color:var(--muted)}.crumbs a{color:var(--muted)}
.meta{color:var(--muted);font-size:14px;margin:0 0 22px}.meta a{color:var(--muted)}
.lead{color:var(--muted);font-size:18px;margin:0 0 32px}
.hero{margin:0 0 28px}.hero img{border-radius:16px;display:block;width:100%}
.prose h2{font-size:26px;line-height:1.2;letter-spacing:-.03em;margin:42px 0 10px}.prose h3{font-size:20px;margin:30px 0 8px}
.prose p,.prose li{color:var(--ink)}.prose ul,.prose ol{padding-left:22px}
.prose blockquote{margin:24px 0;padding:6px 0 6px 18px;border-left:3px solid var(--accent);color:var(--muted);font-style:italic}
.prose pre{background:var(--soft);border:1px solid var(--line);border-radius:12px;padding:16px;overflow:auto;font-size:14px;line-height:1.6}
.prose code{background:var(--soft);padding:2px 6px;border-radius:6px;font-size:.9em}.prose pre code{padding:0;background:none}
.prose table{border-collapse:collapse;width:100%;display:block;overflow:auto}.prose th,.prose td{border:1px solid var(--line);padding:8px 12px;text-align:left}
.tags{display:flex;flex-wrap:wrap;gap:8px;margin:34px 0 0}.tag{font-size:12px;font-weight:700;padding:5px 12px;border:1px solid var(--line);border-radius:999px;color:var(--muted)}
.author{margin-top:36px;padding:18px 20px;border:1px solid var(--line);border-radius:14px;background:var(--soft);display:grid;gap:4px;font-size:14px}.author span{color:var(--muted)}
.more{margin-top:48px}.more h2{font-size:18px}.more ul{list-style:none;padding:0;margin:0}.more li{padding:12px 0;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}.more small{color:var(--muted)}
.list{list-style:none;padding:0;margin:0;display:grid;gap:14px}
.card a{display:block;padding:22px;border:1px solid var(--line);border-radius:16px;color:var(--ink);text-decoration:none;transition:transform .25s,box-shadow .25s,border-color .25s}
.card a:hover{transform:translateY(-4px);border-color:var(--accent);box-shadow:0 18px 40px -22px rgba(0,0,0,.4)}
.card time{font-size:12px;color:var(--muted)}.card h2{font-size:24px;line-height:1.15;letter-spacing:-.03em;margin:6px 0 8px}.card p{margin:0 0 10px;color:var(--muted);font-size:15px}.read{font-size:13px;font-weight:700;color:var(--accent)}
.empty{padding:26px;border:1px dashed var(--line);border-radius:14px;color:var(--muted)}
.bf{max-width:980px;margin:0 auto;padding:28px 22px;border-top:1px solid var(--line);font-size:13px;color:var(--muted)}.bf a{color:var(--muted)}
@media(max-width:560px){body{font-size:16px}.bh{padding:14px 16px}main{padding:16px 16px 56px}}