.blog-detail-page{position:relative}.blog-progress{position:fixed;top:0;left:0;right:0;height:3px;z-index:9999;pointer-events:none;background:transparent}.blog-progress-fill{height:100%;background:linear-gradient(90deg,var(--accent-purple),var(--accent-cyan));transform-origin:left;transform:scaleX(0);will-change:transform}.blog-detail-hero{position:relative;padding:calc(var(--navbar-height) + var(--space-10)) 0 var(--space-12);overflow:hidden}.blog-detail-hero-bg{position:absolute;inset:0;pointer-events:none;z-index:0}.blog-detail-glow{position:absolute;border-radius:50%;filter:blur(120px);opacity:.5}.blog-detail-glow--primary{width:450px;height:450px;top:-80px;right:15%;background:var(--glow-primary)}.blog-detail-glow--secondary{width:350px;height:350px;bottom:-60px;left:10%;background:var(--glow-secondary)}.blog-detail-back{position:relative;z-index:1;margin-bottom:var(--space-8)}.blog-detail-back-link{display:inline-flex;align-items:center;gap:var(--space-2);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--text-tertiary);text-decoration:none;transition:color var(--transition-fast)}.blog-detail-back-link:hover{color:var(--text-primary)}.blog-detail-back-link:focus-visible{outline:2px solid var(--accent-purple);outline-offset:4px;border-radius:var(--radius-4)}.blog-detail-header{position:relative;z-index:1;max-width:720px}.blog-detail-meta{display:flex;align-items:center;flex-wrap:wrap;gap:var(--space-3);margin-bottom:var(--space-6)}.blog-detail-meta-sep{width:4px;height:4px;border-radius:50%;background:var(--text-quaternary);flex-shrink:0}.blog-detail-meta time,.blog-detail-reading-time{font-size:var(--font-size-sm);color:var(--text-tertiary)}.blog-detail-title{font-size:var(--font-size-5xl);font-weight:var(--font-weight-bold);color:var(--text-primary);letter-spacing:var(--letter-spacing-tight);line-height:var(--line-height-tight);margin-bottom:var(--space-5)}.blog-detail-teaser{font-size:var(--font-size-xl);color:var(--text-secondary);line-height:var(--line-height-relaxed);max-width:600px;margin-bottom:var(--space-8)}.blog-detail-publisher{display:flex;align-items:center;gap:var(--space-3)}.blog-detail-publisher-avatar{width:28px;height:28px;border-radius:var(--radius-full);border:1px solid var(--border-primary);object-fit:contain;background:var(--bg-card)}.blog-detail-publisher-name{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--text-secondary)}.blog-detail-image-wrap{margin-bottom:var(--space-12)}.blog-detail-hero-image{margin:0;border-radius:var(--radius-24);overflow:hidden;border:1px solid var(--border-primary)}.blog-detail-hero-image img{width:100%;height:auto;display:block}.blog-detail-content-section{position:relative;padding-bottom:var(--space-16)}.blog-detail-layout{display:grid;grid-template-columns:minmax(0,720px);gap:var(--space-16)}@media(min-width:1100px){.blog-detail-layout.has-toc{grid-template-columns:minmax(0,720px) 220px}}.blog-toc{display:none}@media(min-width:1100px){.blog-toc{display:block}}.blog-toc-sticky{position:sticky;top:calc(var(--navbar-height) + var(--space-8));max-height:calc(100vh - var(--navbar-height) - var(--space-16));overflow-y:auto;padding-right:var(--space-2);scrollbar-width:thin;scrollbar-color:var(--scrollbar-thumb) transparent}.blog-toc-label{font-size:11px;font-weight:var(--font-weight-semibold);color:var(--text-quaternary);letter-spacing:var(--letter-spacing-wide);text-transform:uppercase;margin-bottom:var(--space-4)}.blog-toc-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:2px;border-left:1px solid var(--border-primary)}.blog-toc-item--h3{padding-left:var(--space-3)}.blog-toc-link{display:block;padding:var(--space-1) var(--space-4);font-size:var(--font-size-xs);line-height:var(--line-height-normal);color:var(--text-quaternary);text-decoration:none;border-left:2px solid transparent;margin-left:-1px;transition:color var(--transition-fast),border-color var(--transition-fast)}.blog-toc-link:hover{color:var(--text-secondary)}.blog-toc-link.is-active{color:var(--text-primary);border-left-color:var(--accent-purple)}.blog-toc-link:focus-visible{outline:2px solid var(--accent-purple);outline-offset:2px;border-radius:var(--radius-4)}.blog-detail-body{max-width:min(720px,65ch);min-width:0}.blog-detail-body h2[id],.blog-detail-body h3[id]{scroll-margin-top:calc(var(--navbar-height) + var(--space-6))}.blog-detail-body h2{font-size:var(--font-size-2xl);font-weight:var(--font-weight-semibold);color:var(--text-primary);letter-spacing:var(--letter-spacing-tight);margin-top:var(--space-12);margin-bottom:var(--space-4)}.blog-detail-body h3{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--text-primary);margin-top:var(--space-10);margin-bottom:var(--space-3)}.blog-detail-body h4{font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);color:var(--text-primary);margin-top:var(--space-8);margin-bottom:var(--space-3)}.blog-detail-body p{font-size:var(--font-size-base);color:var(--text-secondary);line-height:var(--line-height-relaxed);margin-bottom:var(--space-5)}.blog-detail-body ul,.blog-detail-body ol{font-size:var(--font-size-base);color:var(--text-secondary);line-height:var(--line-height-relaxed);padding-left:var(--space-6);margin-bottom:var(--space-5);display:flex;flex-direction:column;gap:var(--space-2)}.blog-detail-body ul{list-style-type:disc}.blog-detail-body ol{list-style-type:decimal}.blog-detail-body ul ul{list-style-type:circle}.blog-detail-body ul ul ul{list-style-type:square}.blog-detail-body li::marker{color:var(--text-quaternary)}.blog-detail-body a{color:var(--link-primary);text-decoration:underline;text-decoration-color:color-mix(in srgb,var(--link-primary) 30%,transparent);text-underline-offset:3px;transition:text-decoration-color var(--transition-fast)}.blog-detail-body a:hover{text-decoration-color:var(--link-primary)}.blog-detail-body a:focus-visible{outline:2px solid var(--accent-purple);outline-offset:2px}.blog-detail-body strong{color:var(--text-primary);font-weight:var(--font-weight-semibold)}.blog-detail-body blockquote{margin:var(--space-10) 0;padding:var(--space-6) var(--space-8);background:var(--bg-glass);border:1px solid var(--bg-glass-border);border-left:3px solid var(--accent-purple);border-radius:var(--radius-12);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);font-style:italic;color:var(--text-secondary)}.blog-detail-body blockquote p:last-child{margin-bottom:0}.blog-detail-body hr{border:none;border-top:1px solid var(--bg-glass-border);margin:var(--space-10) 0}.blog-detail-body code{font-size:.9em;padding:2px 6px;background:var(--bg-tertiary);border:1px solid var(--border-primary);border-radius:var(--radius-6);color:var(--text-primary)}.blog-detail-body pre{margin:var(--space-6) 0;padding:var(--space-5) var(--space-6);background:var(--bg-tertiary);border:1px solid var(--border-primary);border-radius:var(--radius-12);overflow-x:auto}.blog-detail-body pre code{padding:0;background:none;border:none;border-radius:0;font-size:var(--font-size-sm);line-height:var(--line-height-relaxed)}.rich-text-figure{margin:var(--space-10) 0;border-radius:var(--radius-16);overflow:hidden;border:1px solid var(--border-primary)}.rich-text-figure img{width:100%;height:auto;display:block}.rich-text-figure figcaption{font-size:var(--font-size-sm);color:var(--text-tertiary);padding:var(--space-3) var(--space-4);text-align:center;border-top:1px solid var(--border-primary);background:var(--bg-card)}.blog-detail-footer{max-width:720px;margin-top:var(--space-16);padding-top:var(--space-8);border-top:1px solid var(--bg-glass-border)}.blog-detail-footer-link{display:inline-flex;align-items:center;gap:var(--space-2);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--text-tertiary);text-decoration:none;transition:color var(--transition-fast)}.blog-detail-footer-link:hover{color:var(--text-primary)}.blog-detail-footer-link:focus-visible{outline:2px solid var(--accent-purple);outline-offset:4px;border-radius:var(--radius-4)}@media(max-width:768px){.blog-detail-hero{padding-top:calc(var(--navbar-height) + var(--space-6));padding-bottom:var(--space-8)}.blog-detail-title{font-size:var(--font-size-3xl)}.blog-detail-teaser{font-size:var(--font-size-base);margin-bottom:var(--space-6)}.blog-detail-hero-image{border-radius:var(--radius-16)}.blog-detail-image-wrap{margin-bottom:var(--space-8)}.blog-detail-back{margin-bottom:var(--space-6)}}@media(max-width:480px){.blog-detail-title{font-size:var(--font-size-2xl)}}@media(prefers-reduced-motion:reduce){.blog-progress-fill{transition:none}}