:root { --bg:#fcfbf7; --text:#22201c; --muted:#6f6a60; --accent:#c48a12; --line:#e9e4d8; --card:#ffffff; }
@media (prefers-color-scheme: dark) { :root { --bg:#16140f; --text:#ebe6da; --muted:#a59e8e; --accent:#e0aa3e; --line:#302b22; --card:#1f1c16; } }
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin:0; background:var(--bg); color:var(--text); font:16.5px/1.65 system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; }
a { color:var(--accent); text-underline-offset:3px; }
.wrap { max-width:780px; margin:0 auto; padding:0 20px; }
header.site { padding:26px 0 18px; border-bottom:6px solid var(--accent); }
header.site .wrap { display:flex; flex-wrap:wrap; gap:10px 24px; align-items:baseline; justify-content:space-between; }
.brand { font:800 25px/1.2 system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; color:var(--text); text-decoration:none; letter-spacing:0;  }
.brand b { color:var(--accent); font-weight:inherit; }
.tag { display:block; font:14px/1.4 system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; color:var(--muted); margin-top:4px; letter-spacing:0; text-transform:none; }
nav a { margin-right:18px; font:15px system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; color:var(--muted); text-decoration:none;  }
nav a:hover, nav a[aria-current="page"] { color:var(--accent); }
main { padding:34px 0 54px; }
h1, h2, h3 { font-family:system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; line-height:1.25; }
.meta { font:13.5px ui-monospace, "SFMono-Regular", Consolas, "Liberation Mono", monospace; color:var(--muted); }
article h1 { font-size:32px; margin:6px 0 22px; }
article h2 { font-size:23px; margin:34px 0 10px; }
article p, article li { margin:0 0 15px; }
article ul, article ol { padding-left:24px; }
.box { background:var(--card); border:1px solid var(--line); border-radius:4px; padding:16px 20px; margin:22px 0; }
.box h3 { margin:0 0 8px; font-size:18px; }
.box ul { margin:0; } .box li { margin-bottom:5px; }
blockquote { margin:22px 0; padding:2px 0 2px 16px; border-left:3px solid var(--accent); color:var(--muted); }
.back { display:inline-block; margin-top:26px; font:15px system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; }
footer.site { border-top:1px solid var(--line); padding:20px 0 32px; color:var(--muted); font:13.5px/1.6 system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; }
.intro { color:var(--muted); margin:0 0 30px; }

.posts { list-style:none; margin:0; padding:0; }
.posts li { display:grid; grid-template-columns: 120px 1fr; gap:16px; padding:14px 0; border-top:1px solid var(--line); }
@media (max-width: 520px) { .posts li { grid-template-columns: 1fr; gap:2px; } }
.posts h2 { margin:0 0 4px; font-size:19px; }
.posts h2 a { color:var(--text); text-decoration:none; } .posts h2 a:hover { color:var(--accent); }
.posts p { margin:0; color:var(--muted); font-size:15px; }

@media (max-width: 520px) { body { font-size: 16.5px; } article h1 { font-size: 27px; } nav a { margin-right: 14px; } }