:root {
  --bg: #0a0a0b; --surface: #0f0f11; --surface-2: #17171b;
  --line: rgba(255,255,255,0.10); --line-strong: rgba(255,255,255,0.20);
  --ink: #ededea; --dim: #8b8b85; --faint: #5c5c57;
  --signal: #ff4d1c; --signal-dim: rgba(255,77,28,0.14); --ok: #7bd88f;
  --mono: 'SF Mono', ui-monospace, 'JetBrains Mono', Menlo, monospace;
  --display: 'Space Grotesk', -apple-system, system-ui, sans-serif;
  --sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
  --r: 3px;
}
* { box-sizing: border-box; }
body {
  margin: 0; font-family: var(--sans); background: var(--bg); color: var(--ink);
  line-height: 1.65; -webkit-font-smoothing: antialiased;
}
.wrap { max-width: 720px; margin: 0 auto; padding: 3rem 1.25rem 5rem; }
a { color: var(--signal); text-decoration: none; }
a:hover { text-decoration: underline; }
.top { display: flex; justify-content: space-between; align-items: center;
  border-bottom: 1px solid var(--line); padding-bottom: 1rem; margin-bottom: 2.5rem;
  font-family: var(--mono); font-size: .8rem; letter-spacing: .02em; }
.top .brand { color: var(--ink); font-family: var(--display); font-weight: 600; }
h1 { font-family: var(--display); font-weight: 700; font-size: clamp(1.8rem, 1.2rem + 3vw, 2.6rem);
  line-height: 1.12; letter-spacing: -0.02em; margin: 0 0 .75rem; }
h2 { font-family: var(--display); font-weight: 600; font-size: 1.4rem; margin: 2.5rem 0 .75rem;
  letter-spacing: -0.01em; }
.meta { color: var(--faint); font-family: var(--mono); font-size: .78rem;
  margin-bottom: 2.5rem; }
p, li { color: #cfcfca; }
code { font-family: var(--mono); font-size: .88em; background: var(--surface-2);
  border: 1px solid var(--line); border-radius: var(--r); padding: .1em .4em; color: var(--ink); }
pre { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r);
  padding: 1rem 1.15rem; overflow-x: auto; margin: 1.25rem 0; }
pre code { background: none; border: 0; padding: 0; font-size: .82rem; line-height: 1.6; color: #d6d6d1; }
.cta { display: block; border: 1px solid var(--line-strong); border-left: 3px solid var(--signal);
  background: var(--signal-dim); border-radius: var(--r); padding: 1.1rem 1.25rem; margin: 2.5rem 0;
  color: var(--ink); }
.cta:hover { text-decoration: none; border-color: var(--signal); }
.cta b { font-family: var(--display); }
.postlist { list-style: none; padding: 0; }
.postlist li { border-bottom: 1px solid var(--line); padding: 1.15rem 0; }
.postlist a { font-family: var(--display); font-weight: 600; font-size: 1.12rem; color: var(--ink); }
.postlist a:hover { color: var(--signal); text-decoration: none; }
.postlist .d { display: block; color: var(--dim); font-size: .92rem; margin-top: .3rem; font-family: var(--sans); }
footer { border-top: 1px solid var(--line); margin-top: 4rem; padding-top: 1.5rem;
  color: var(--faint); font-family: var(--mono); font-size: .78rem; }