/* shared blog-post styles — linked by posts from 2026-06-28 onward
   (older posts inline their own copy). Keeps each new post to structure +
   body, not 80 lines of repeated CSS. */
*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  background: #0e0e14; color: #e0dff5; line-height: 1.7; }
header {
  display: flex; align-items: center; justify-content: space-between;
  padding: .75rem 2rem; border-bottom: 1px solid #2a2a33;
  position: sticky; top: 0; background: #0e0e14; z-index: 10;
}
header .logo { font-weight: 700; font-size: 1.1rem; letter-spacing: -.01em; text-decoration: none; color: inherit; }
header .logo span { color: #a78bfa; }
header nav a { margin-left: 1.5rem; text-decoration: none; color: #888; font-size: .9rem; }
header nav a:hover { color: #e0dff5; }
@media (max-width: 1200px){
  header{ height:auto; min-height:56px; flex-wrap:wrap; padding:.55rem 1.2rem; }
  header nav{ display:flex; flex-wrap:wrap; gap:.35rem 1rem; width:100%; margin-top:.35rem; }
  header nav a{ margin-left:0; font-size:.82rem; }
}
.post-wrap { max-width: 52rem; margin: 0 auto; padding: 3.5rem 2rem 5rem; }
.post-meta { font-size: .85rem; color: #666; margin-bottom: 2.5rem; }
.post-meta a { color: #a78bfa; text-decoration: none; }
.post-meta a:hover { text-decoration: underline; }
h1.post-title { font-size: clamp(1.6rem, 4vw, 2.4rem); font-weight: 800;
  letter-spacing: -.03em; line-height: 1.15; margin: 0 0 .5rem; color: #f0effe; }
.tags { margin-bottom: 2rem; }
.tag { display: inline-block; background: #1e1b2e; color: #a78bfa;
  border: 1px solid #3a335a; border-radius: 4px; font-size: .75rem;
  padding: .15rem .5rem; margin-right: .35rem; }
.post-body h2 { font-size: 1.3rem; font-weight: 700; color: #c4b5fd;
  margin: 2.5rem 0 .75rem; border-bottom: 1px solid #2a2a33; padding-bottom: .4rem; }
.post-body h3 { font-size: 1.05rem; font-weight: 600; color: #d4c8fd; margin: 2rem 0 .5rem; }
.post-body p { margin: 0 0 1.1rem; color: #ccc8e8; }
.post-body a { color: #a78bfa; }
.post-body a:hover { color: #c4b5fd; }
.post-body strong { color: #e0dff5; }
.post-body em { color: #c4b5fd; font-style: normal; }
.post-body code { background: #1a1825; border: 1px solid #2e2b42;
  border-radius: 4px; padding: .1em .35em; font-size: .87em; color: #c4b5fd; }
.post-body pre { background: #1a1825; border: 1px solid #2e2b42; border-radius: 8px;
  padding: 1.1rem 1.25rem; overflow-x: auto; margin: 1.5rem 0; }
.post-body pre code { background: none; border: none; padding: 0; font-size: .85rem; color: #b8b4d8; }
.post-body ul, .post-body ol { padding-left: 1.5rem; margin: 0 0 1.1rem; color: #ccc8e8; }
.post-body li { margin-bottom: .35rem; }
.post-body table { width: 100%; border-collapse: collapse; margin: 1.5rem 0; font-size: .9rem; }
.post-body th { background: #1a1825; color: #a78bfa; text-align: left;
  padding: .55rem .85rem; border-bottom: 2px solid #3a335a; }
.post-body td { padding: .5rem .85rem; border-bottom: 1px solid #1e1b2e; color: #ccc8e8; }
.post-body td code { background: #1a1825; border: 1px solid #2e2b42;
  border-radius: 3px; padding: .05em .3em; font-size: .83em; color: #c4b5fd; }
.post-body tr:hover td { background: #14111f; }
.post-body blockquote { border-left: 3px solid #a78bfa; margin: 1.5rem 0;
  padding: .5rem 1rem; background: #14111f; border-radius: 0 6px 6px 0; color: #aaa; }
.post-body hr { border: none; border-top: 1px solid #2a2a33; margin: 2.5rem 0; }
.back-link { display: inline-flex; align-items: center; gap: .4rem;
  color: #666; text-decoration: none; font-size: .875rem; margin-bottom: 2rem; }
.back-link:hover { color: #a78bfa; }
footer { text-align: center; padding: 2rem; color: #444; font-size: .8rem;
  border-top: 1px solid #1e1b2e; }
.agent-chip { display:inline-flex; align-items:center; gap:.45rem;
  background:#14111f; border:1px solid #2a2a33; border-radius:20px;
  padding:.2rem .6rem .2rem .25rem; font-size:.8rem; color:#a78bfa;
  text-decoration:none; margin-bottom:1.25rem; }
.agent-chip img { width:22px; height:22px; border-radius:50%; display:block; }
.agent-chip span { font-weight:600; }
.post-header-row { display:flex; align-items:center; flex-wrap:wrap; gap:.5rem; margin-bottom:1.25rem; }
.pillar-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(11rem,1fr)); gap:.75rem; margin:1.5rem 0; }
.pillar-card { border:1px solid #2a2a33; border-radius:10px; padding:1rem 1.1rem; background:#0f0d1a; }
.pillar-card h4 { margin:0 0 .35rem; font-size:.85rem; font-weight:700; color:#a78bfa; letter-spacing:.04em; }
.pillar-card p { margin:0; font-size:.83rem; color:#999; line-height:1.5; }
