*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
	background: #000;
	color: #fafafa;
	font-family: "Geist", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
	font-size: 16px;
	line-height: 1.65;
	-webkit-font-smoothing: antialiased;
}
a { color: #fafafa; text-decoration: underline; text-decoration-color: rgba(255,255,255,0.25); text-underline-offset: 3px; }
a:hover { text-decoration-color: rgba(255,255,255,0.85); }
.topbar {
	display: flex; align-items: center; justify-content: space-between; gap: 1rem;
	padding: 1rem 1.25rem;
	border-bottom: 1px solid rgba(255,255,255,0.06);
	font-family: "Geist Mono", ui-monospace, monospace;
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: 0.22em;
}
.topbar .brand { text-decoration: none; font-weight: 600; }
.topbar nav { display: flex; gap: 1.25rem; }
.topbar nav a { text-decoration: none; color: rgba(250,250,250,0.6); }
.topbar nav a:hover, .topbar nav a[aria-current="page"] { color: #fafafa; }
main { max-width: 720px; margin: 0 auto; padding: 3rem 1.25rem 6rem; }
.kicker { font-family: "Geist Mono", ui-monospace, monospace; font-size: 11px; text-transform: uppercase; letter-spacing: 0.24em; color: rgba(250,250,250,0.45); margin: 0 0 1.5rem; }
article h1, .page-head h1 {
	font-family: "Space Grotesk", "Geist", sans-serif;
	font-weight: 300;
	font-size: clamp(2rem, 4.5vw, 3rem);
	line-height: 1.05;
	letter-spacing: -0.02em;
	margin: 0 0 1rem;
}
article .lead, .page-head .lead { font-size: 1.0625rem; color: rgba(250,250,250,0.78); margin: 0 0 2.25rem; max-width: 60ch; }
article h2 { font-family: "Space Grotesk", sans-serif; font-weight: 400; font-size: 1.5rem; letter-spacing: -0.01em; margin: 2.5rem 0 0.75rem; }
article p, article ul, article ol { margin: 0 0 1.25rem; color: rgba(250,250,250,0.85); max-width: 64ch; }
article ul { padding-left: 1.25rem; }
article li { margin-bottom: 0.4rem; }
article hr { border: 0; border-top: 1px solid rgba(255,255,255,0.08); margin: 3rem 0 1.5rem; }
article .cta { font-family: "Geist Mono", ui-monospace, monospace; font-size: 11px; text-transform: uppercase; letter-spacing: 0.18em; color: rgba(250,250,250,0.55); }
code {
	font-family: "Geist Mono", ui-monospace, monospace;
	font-size: 0.85em;
	background: rgba(255,255,255,0.05);
	padding: 0.1rem 0.35rem;
	border-radius: 3px;
	color: rgba(250,250,250,0.95);
}
pre {
	background: #050505;
	border: 1px solid rgba(255,255,255,0.06);
	padding: 1rem 1.1rem;
	overflow-x: auto;
	margin: 0 0 1.5rem;
}
pre code { background: transparent; padding: 0; font-size: 12.5px; line-height: 1.7; }
.post-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 0.5rem; }
.post-list .post a {
	display: block; text-decoration: none;
	padding: 1.25rem 1.25rem; margin: 0;
	border: 1px solid rgba(255,255,255,0.06);
	transition: border-color 120ms ease, background 120ms ease;
}
.post-list .post a:hover { border-color: rgba(255,255,255,0.22); background: rgba(255,255,255,0.015); }
.post-list .post h2 { margin: 0 0 0.35rem; font-family: "Space Grotesk", sans-serif; font-weight: 400; font-size: 1.25rem; letter-spacing: -0.005em; color: #fafafa; }
.post-list .post p { margin: 0 0 0.75rem; color: rgba(250,250,250,0.7); font-size: 0.9375rem; line-height: 1.55; max-width: 64ch; }
.post-list .post .meta { font-family: "Geist Mono", monospace; font-size: 10px; text-transform: uppercase; letter-spacing: 0.22em; color: rgba(250,250,250,0.4); }
.page-head { margin-bottom: 3rem; }
@media (max-width: 600px) {
	.topbar nav { gap: 0.75rem; font-size: 10px; }
	main { padding: 2rem 1rem 4rem; }
}