/* blog-critical.css — inlined, above-the-fold only */
*,*::before,*::after{box-sizing:border-box}
head,meta,title,link,style,script,noscript{display:none!important}
html,body{margin:0;padding:0}
html{overflow-x:hidden;width:100%;scroll-behavior:smooth}
body{font-family:'Inter',system-ui,-apple-system,BlinkMacSystemFont,sans-serif;background:var(--bg);color:var(--text-primary);line-height:1.5}
a{color:inherit;text-decoration:none}
.blog-main{padding:0 0 72px}
.blog-outer{max-width:1160px;margin:0 auto;padding:0 20px;display:grid;grid-template-columns:1fr 280px;gap:32px;align-items:start}
.blog-content{min-width:0}
.blog-title{font-size:36px;font-weight:800;line-height:1.2;color:var(--text-primary);margin:0 0 16px;letter-spacing:-.4px}
.blog-meta{display:flex;align-items:center;flex-wrap:wrap;gap:6px 8px;font-size:13px;font-weight:500;color:var(--text-muted);margin-bottom:28px;padding-bottom:22px;border-bottom:1px solid var(--border-subtle)}
.blog-meta-author{font-weight:700;color:var(--accent)}
.blog-meta-divider{opacity:.35}
.blog-meta-updated{display:flex;align-items:center;gap:7px;margin-left:auto}
.blog-meta-dot{width:8px;height:8px;border-radius:50%;background:#e53e3e;flex-shrink:0;box-shadow:0 0 0 2px rgba(229,62,62,.25),0 0 8px 2px rgba(229,62,62,.4)}
.blog-intro p{font-size:17px;line-height:1.8;color:var(--text-secondary);margin:0 0 18px}
/* Breadcrumbs */
.breadcrumbs{font-size:.9rem;margin:18px 0 24px;color:var(--text-muted);font-weight:600}
.breadcrumbs ol{margin:0 auto;padding:0;list-style:none;display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.breadcrumbs li{display:flex;align-items:center}
.breadcrumbs li::after{content:"›";margin-left:6px;color:var(--text-muted);pointer-events:none}
.breadcrumbs li:last-child::after{content:""}
.breadcrumbs a{color:var(--accent);text-decoration:none;white-space:nowrap;transition:color .35s ease}
.breadcrumbs a:hover{color:var(--accent-yellow)}
/* Quick picks box visible above fold */
.blog-tldr{background:var(--bg-elevated);border:1px solid var(--border-subtle);border-left:4px solid var(--accent);border-radius:var(--radius-md);padding:24px 28px;margin-bottom:48px}
.blog-section-title{font-size:21px;font-weight:800;color:var(--text-primary);margin:0 0 20px;display:flex;align-items:center;gap:10px;letter-spacing:-.2px}
.blog-section-title::after{content:"";flex:1;height:2px;background:var(--border-subtle);border-radius:2px}
.blog-tldr .blog-section-title::after{display:none}