.blog-progress-bar{position:fixed;top:0;left:0;width:0%;height:4px;background:var(--gradient-primary);z-index:100;transition:width .1s ease-out}.blog-hero{position:relative;overflow:hidden;padding:8rem 0 4rem;background:var(--gradient-bg)}.blog-hero:before{content:"";position:absolute;top:-20%;right:-10%;width:400px;height:400px;background:hsl(var(--primary) / .1);filter:blur(80px);border-radius:50%;z-index:0}.blog-hero:after{content:"";position:absolute;bottom:-10%;left:-5%;width:300px;height:300px;background:hsl(var(--accent) / .05);filter:blur(60px);border-radius:50%;z-index:0}.blog-hero-content{position:relative;z-index:1}.blog-category-badge{display:inline-flex;align-items:center;padding:.25rem 1rem;border-radius:2rem;font-size:.875rem;font-weight:600;background:hsl(var(--primary) / .1);color:hsl(var(--primary));border:1px solid hsl(var(--primary) / .2);margin-bottom:1.5rem}.blog-toc{position:sticky;top:6rem;max-height:calc(100vh - 8rem);overflow-y:auto}.blog-toc-item{display:block;font-size:.875rem;color:var(--muted-foreground);transition:all .2s;border-left:2px solid transparent;padding:.5rem 0 .5rem 1rem}.blog-toc-item:hover{color:hsl(var(--primary));border-left-color:hsl(var(--primary) / .3)}.blog-toc-item.active{color:hsl(var(--primary));font-weight:600;border-left-color:hsl(var(--primary))}.prose h2{scroll-margin-top:6rem;position:relative;display:inline-block}.prose h2:after{content:"";position:absolute;bottom:-4px;left:0;width:40px;height:3px;background:var(--gradient-primary);border-radius:2px}.blog-share-button{width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:var(--card);border:1px solid var(--border);color:var(--muted-foreground);transition:all .2s}.blog-share-button:hover{background:hsl(var(--primary) / .1);color:hsl(var(--primary));border-color:hsl(var(--primary) / .3);transform:translateY(-2px)}