.blog-index{max-width:720px;margin:0 auto}.blog-header{margin-bottom:4rem}.blog-empty{color:var(--text-muted);text-align:center;padding:4rem 0;font-size:1rem}.blog-list{flex-direction:column;gap:1px;display:flex}.blog-card{border-bottom:1px solid var(--border)}.blog-card:first-child{border-top:1px solid var(--border)}.blog-card-link{color:inherit;padding:1.75rem 0;text-decoration:none;transition:opacity .2s;display:block}.blog-card-link:hover{opacity:.8}.blog-card-meta{font-size:.8rem;font-family:var(--mono);color:var(--text-dim);align-items:center;gap:.75rem;margin-bottom:.5rem;display:flex}.blog-card-tags{gap:.4rem;display:flex}.blog-tag{font-size:.7rem;font-family:var(--mono);color:var(--accent);background:var(--accent-glow-sm);border:1px solid #6366f133;border-radius:.25rem;padding:.15rem .45rem}.blog-card-title{letter-spacing:-.02em;margin-bottom:.4rem;font-size:1.25rem;font-weight:600;line-height:1.3}.blog-card-excerpt{color:var(--text-muted);font-size:.92rem;line-height:1.6}.blog-card-author{color:var(--text-dim);margin-top:.5rem;font-size:.78rem;display:block}.blog-card-cover{aspect-ratio:16/9;object-fit:cover;border-radius:var(--radius);border:1px solid var(--border);width:100%;margin-top:.75rem}.blog-post{max-width:720px;margin:0 auto}.blog-back{font-size:.82rem;font-family:var(--mono);color:var(--text-dim);margin-bottom:2rem;text-decoration:none;transition:color .2s;display:inline-block}.blog-back:hover{color:var(--text-muted)}.blog-post-header{margin-bottom:3rem}.blog-post-meta{font-size:.82rem;font-family:var(--mono);color:var(--text-dim);margin-bottom:1rem}.blog-post-author{color:var(--text-muted)}.blog-post-title{letter-spacing:-.03em;margin-bottom:1rem;font-size:clamp(1.75rem,4vw,2.5rem);font-weight:700;line-height:1.2}.blog-post-tags{flex-wrap:wrap;gap:.4rem;display:flex}.blog-post-cover{border-radius:var(--radius);border:1px solid var(--border);width:100%;margin-top:1.5rem}.blog-content{color:var(--text);font-size:1.05rem;line-height:1.8}.blog-content p{margin-bottom:1.5rem}.blog-content h2{letter-spacing:-.02em;margin-top:3rem;margin-bottom:1rem;font-size:1.5rem;font-weight:700}.blog-content h3{letter-spacing:-.01em;margin-top:2.5rem;margin-bottom:.75rem;font-size:1.2rem;font-weight:600}.blog-content h4{margin-top:2rem;margin-bottom:.5rem;font-size:1.05rem;font-weight:600}.blog-content a{color:var(--accent);text-underline-offset:2px;text-decoration:underline}.blog-content a:hover{opacity:.8}.blog-content ul,.blog-content ol{margin-bottom:1.5rem;padding-left:1.5rem}.blog-content li{margin-bottom:.4rem}.blog-content blockquote{border-left:3px solid var(--accent);color:var(--text-muted);margin:1.5rem 0;padding-left:1.25rem;font-style:italic}.blog-content hr{border:none;border-top:1px solid var(--border);margin:2.5rem 0}.blog-content .inline-code{font-family:var(--mono);background:var(--bg-raised);border:1px solid var(--border);border-radius:.25rem;padding:.15em .4em;font-size:.88em}.blog-content .code-block{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);font-family:var(--mono);margin:1.5rem 0;padding:1.25rem;font-size:.85rem;line-height:1.6;overflow-x:auto}.blog-content .code-block .code-lang{color:var(--text-dim);text-transform:uppercase;letter-spacing:.05em;margin-bottom:.75rem;font-size:.7rem}.blog-content .blog-image{margin:2rem 0}.blog-content .blog-image img{border-radius:var(--radius);border:1px solid var(--border);width:100%}.blog-content .blog-image figcaption{color:var(--text-dim);text-align:center;margin-top:.5rem;font-size:.82rem}.blog-content .callout{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);gap:.75rem;margin:1.5rem 0;padding:1rem 1.25rem;display:flex}.blog-content .callout-icon{flex-shrink:0;font-size:1.2rem}.blog-content .bookmark-link{font-family:var(--mono);color:var(--accent);background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);text-overflow:ellipsis;white-space:nowrap;margin:1rem 0;padding:.75rem 1rem;font-size:.85rem;text-decoration:none;display:block;overflow:hidden}.blog-content .bookmark-link:hover{border-color:var(--border-hi)}.blog-content details{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);margin:1rem 0;padding:.75rem 1rem}.blog-content details summary{cursor:pointer;font-weight:500}
