*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#0a0a0a;
  --bg-card:#111;
  --border:#1a3a1a;
  --border-hover:#2a5a2a;
  --text:#9fcfaf;
  --text-dim:#5a7a5a;
  --text-bright:#d0f0d0;
  --accent:#40c060;
  --accent-dim:#2a8a3a;
  --link:#60d080;
  --link-hover:#a0f0b0;
  --font-mono:'Geist Mono',ui-monospace,SFMono-Regular,'SF Mono',Menlo,Consolas,'Liberation Mono',monospace;
}
html{font-size:16px;scroll-behavior:smooth}
body{
  background:var(--bg);
  color:var(--text);
  font-family:var(--font-mono);
  line-height:1.65;
  min-height:100vh;
  display:flex;
  flex-direction:column;
}
a{color:var(--link);text-decoration:none;transition:color .15s}
a:hover{color:var(--link-hover)}
.site-header{
  border-bottom:1px solid var(--border);
  padding:1.25rem 1.5rem;
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:.75rem;
}
.site-title{
  color:var(--text-bright);
  font-size:1.1rem;
  font-weight:600;
  letter-spacing:-.02em;
}
.site-title a{color:inherit}
nav{display:flex;gap:1.25rem;font-size:.85rem}
nav a{color:var(--text-dim);border-bottom:1px solid transparent;padding-bottom:2px}
nav a:hover,nav a.active{color:var(--accent);border-bottom-color:var(--accent)}
main{flex:1;width:100%;max-width:48rem;margin:0 auto;padding:2rem 1.5rem}
.hero{margin-bottom:2.5rem}
.hero h1{
  font-size:1.6rem;
  color:var(--text-bright);
  margin-bottom:.5rem;
}
.hero .tagline{
  color:var(--text-dim);
  font-size:.9rem;
}
.section-title{
  color:var(--text-bright);
  font-size:1.15rem;
  margin-bottom:1rem;
  padding-bottom:.4rem;
  border-bottom:1px solid var(--border);
}
.capabilities{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
  gap:.75rem;
  margin-bottom:2.5rem;
}
.cap-card{
  background:var(--bg-card);
  border:1px solid var(--border);
  padding:1rem;
  transition:border-color .15s;
}
.cap-card:hover{border-color:var(--border-hover)}
.cap-card h3{
  color:var(--accent);
  font-size:.85rem;
  margin-bottom:.35rem;
}
.cap-card p{
  color:var(--text-dim);
  font-size:.8rem;
  line-height:1.5;
}
.post-list{list-style:none}
.post-list li{
  border:1px solid var(--border);
  margin-bottom:.6rem;
  transition:border-color .15s;
}
.post-list li:hover{border-color:var(--border-hover)}
.post-list a{
  display:block;
  padding:.85rem 1rem;
  color:inherit;
}
.post-list .post-title{
  color:var(--text-bright);
  font-size:.95rem;
}
.post-list .post-meta{
  color:var(--text-dim);
  font-size:.75rem;
  margin-top:.25rem;
}
.post-list .post-summary{
  color:var(--text);
  font-size:.8rem;
  margin-top:.35rem;
}
.til-entry{
  background:var(--bg-card);
  border:1px solid var(--border);
  padding:1rem 1.25rem;
  margin-bottom:.75rem;
}
.til-entry h3{
  color:var(--text-bright);
  font-size:.9rem;
  margin-bottom:.3rem;
}
.til-entry .til-date{
  color:var(--text-dim);
  font-size:.7rem;
  margin-bottom:.5rem;
}
.til-entry .til-body{
  color:var(--text);
  font-size:.82rem;
  line-height:1.6;
}
.til-entry code{
  background:#1a2a1a;
  padding:.1em .35em;
  font-size:.85em;
  color:var(--accent);
}
article.post{margin-bottom:3rem}
article.post h1{
  color:var(--text-bright);
  font-size:1.4rem;
  margin-bottom:.3rem;
}
article.post .post-date{
  color:var(--text-dim);
  font-size:.8rem;
  margin-bottom:1.5rem;
  padding-bottom:.75rem;
  border-bottom:1px solid var(--border);
}
article.post p{
  margin-bottom:1rem;
  font-size:.88rem;
  line-height:1.7;
}
article.post code{
  background:#1a2a1a;
  padding:.1em .35em;
  font-size:.85em;
  color:var(--accent);
}
article.post a{border-bottom:1px solid var(--accent-dim)}
article.post a:hover{border-bottom-color:var(--link-hover)}
.back-link{
  display:inline-block;
  margin-bottom:1.5rem;
  color:var(--text-dim);
  font-size:.85rem;
}
.back-link:hover{color:var(--accent)}
.site-footer{
  border-top:1px solid var(--border);
  padding:1rem 1.5rem;
  text-align:center;
  font-size:.7rem;
  color:var(--text-dim);
}
.quick-links{
  margin-top:1.5rem;
  display:flex;
  gap:1.25rem;
  flex-wrap:wrap;
}
.quick-links a{
  border:1px solid var(--border);
  padding:.6rem 1rem;
  font-size:.85rem;
  color:var(--text-bright);
  transition:border-color .15s,background .15s;
}
.quick-links a:hover{
  border-color:var(--accent);
  background:var(--bg-card);
}
@media(max-width:600px){
  .site-header{flex-direction:column;align-items:flex-start}
  main{padding:1.5rem 1rem}
  .hero h1{font-size:1.3rem}
  .capabilities{grid-template-columns:1fr}
}