* { box-sizing: border-box; margin: 0; padding: 0; }
body {
  font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  background: #0f1115; color: #e6e8eb; line-height: 1.65; -webkit-font-smoothing: antialiased;
}
a { color: #7aa2ff; text-decoration: none; }
a:hover { text-decoration: underline; }
.wrap { max-width: 760px; margin: 0 auto; padding: 64px 24px 48px; }
.muted { color: #9aa0a8; }
code { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .92em; background: #1b1f27; padding: .1em .35em; border-radius: 4px; }
pre { overflow-x: auto; }
pre code { display: block; padding: 14px; line-height: 1.5; }

h1 { font-size: 2.1rem; margin-bottom: 6px; letter-spacing: -.02em; }
.sub { color: #9aa0a8; margin-bottom: 30px; }
h2 { font-size: 1.25rem; margin: 42px 0 14px; padding-bottom: 8px; border-bottom: 1px solid #23272f; }
h3 { font-size: 1.05rem; margin: 22px 0 8px; }

nav a { margin-right: 18px; font-size: .95rem; }
.card { background: #171a21; border: 1px solid #23272f; border-radius: 10px; padding: 14px 18px; margin: 10px 0; display: block; transition: border-color .15s; }
.card:hover { border-color: #3a4254; text-decoration: none; }
.card .t { font-weight: 600; color: #e6e8eb; }
.card .d { color: #9aa0a8; font-size: .93rem; margin-top: 3px; }
.tag { display: inline-block; font-size: .72rem; color: #7aa2ff; background: #1a2338; border-radius: 4px; padding: 2px 7px; margin-right: 6px; }
.meta { color: #9aa0a8; font-size: .85rem; }
.footer { margin-top: 56px; padding-top: 20px; border-top: 1px solid #23272f; color: #9aa0a8; font-size: .85rem; }
.btn { display: inline-block; margin-top: 8px; font-size: .9rem; }
.list-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 12px; }
.post-body p { margin: 12px 0; }
.post-body li { margin: 6px 0 6px 20px; }
.post-body ul, .post-body ol { margin: 12px 0; }