.blog-post{max-width:900px;margin:0 auto;padding:0 20px}.blog-post .breadcrumb{display:flex;align-items:center;flex-wrap:wrap;gap:6px;margin:24px 0;font-size:14px;color:var(--text-muted)}.blog-post .breadcrumb a{color:var(--text-muted);text-decoration:none;transition:color .3s ease}.blog-post .breadcrumb a:hover{color:var(--accent)}.blog-post .breadcrumb .separator{color:var(--text-muted);opacity:.5}.blog-post .breadcrumb .current{color:var(--text-primary);font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:300px}.back-button{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);color:var(--text-secondary);font-size:14px;font-weight:500;cursor:pointer;transition:all .3s ease;margin-bottom:32px}.back-button:hover{border-color:var(--accent);color:var(--accent);transform:translate(-2px)}.back-icon{width:16px;height:16px}.blog-article{margin-bottom:60px}.article-header{margin-bottom:40px}.article-category{display:inline-flex;align-items:center;gap:6px;background:var(--accent);color:var(--bg-primary);padding:6px 14px;border-radius:20px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;margin-bottom:20px}.category-icon{width:14px;height:14px}.article-title{font-family:var(--font-display);font-size:2.5rem;font-weight:700;color:var(--text-primary);line-height:1.2;margin-bottom:16px}.article-description{font-size:1.15rem;color:var(--text-secondary);line-height:1.6;margin-bottom:24px}.article-meta{display:flex;flex-wrap:wrap;gap:20px;margin-bottom:20px;padding-bottom:20px;border-bottom:1px solid var(--border)}.article-meta .meta-item{display:flex;align-items:center;gap:6px;color:var(--text-muted);font-size:14px}.article-meta .meta-icon{width:16px;height:16px;color:var(--accent)}.article-tags{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:32px}.article-tags .tag{background:var(--bg-secondary);color:var(--text-muted);border:1px solid var(--border);padding:5px 12px;border-radius:20px;font-size:13px}.featured-image{width:100%;border-radius:var(--radius-2xl);overflow:hidden;aspect-ratio:16/9;background:var(--bg-secondary);box-shadow:var(--shadow-card)}.featured-image img{width:100%;height:100%;object-fit:cover}.article-content-wrapper{display:flex;gap:48px;align-items:flex-start}.table-of-contents{position:sticky;top:24px;flex:0 0 240px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:20px;max-height:calc(100vh - 48px);overflow-y:auto}.table-of-contents h3{font-size:.95rem;color:var(--text-primary);margin-bottom:14px;font-family:var(--font-display)}.table-of-contents ul{list-style:none;margin:0;padding:0;position:relative}.table-of-contents li{margin-bottom:4px}.table-of-contents .toc-indicator{position:absolute;left:-20px;width:3px;background:var(--accent);border-radius:3px;transition:transform .25s ease,height .25s ease,opacity .25s ease;list-style:none}.table-of-contents a{display:block;padding:6px 0;color:var(--text-muted);text-decoration:none;font-size:.875rem;line-height:1.4;transition:color .3s ease}.table-of-contents a:hover{color:var(--text-primary)}.table-of-contents a.active{color:var(--accent);font-weight:600}.table-of-contents li.level-2 a{padding-left:12px;font-size:.825rem}.table-of-contents li.level-3 a{padding-left:24px;font-size:.8rem}.article-content{flex:1;min-width:0;color:var(--text-secondary);font-size:1.05rem;line-height:1.8}.article-content h1,.article-content h2,.article-content h3{font-family:var(--font-display);color:var(--text-primary);font-weight:700;margin:40px 0 16px;scroll-margin-top:24px}.article-content h1{font-size:1.9rem}.article-content h2{font-size:1.6rem}.article-content h3{font-size:1.3rem}.article-content p{margin-bottom:20px;color:var(--text-secondary)}.article-content a{color:var(--accent);text-decoration:underline;text-underline-offset:3px}.article-content a:hover{color:var(--accent-alt)}.article-content strong{color:var(--text-primary);font-weight:700}.article-content code{background:var(--bg-secondary);border:1px solid var(--border);border-radius:4px;padding:2px 6px;font-family:var(--font-mono);font-size:.9em;color:var(--accent)}.article-content pre{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-lg);padding:16px;overflow-x:auto;margin-bottom:20px}.article-content pre code{background:none;border:none;padding:0;color:var(--text-primary)}.article-content ul,.article-content ol{margin:0 0 20px 24px;color:var(--text-secondary)}.article-content li{margin-bottom:8px}.article-footer{margin-top:48px;padding-top:32px;border-top:1px solid var(--border)}.article-actions{margin-bottom:32px}.action-buttons{display:flex;flex-wrap:wrap;gap:12px}.action-btn{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);color:var(--text-secondary);font-size:14px;font-weight:500;cursor:pointer;transition:all .3s ease}.action-btn:hover{border-color:var(--accent);color:var(--accent)}.action-btn.liked{border-color:var(--accent);color:var(--accent);background:var(--glass)}.action-icon{width:16px;height:16px}.action-icon.filled{fill:currentColor}.share-buttons{display:flex;gap:12px;flex-wrap:wrap}.author-bio{display:flex;flex-direction:column;gap:10px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:24px}.author-bio-label{font-size:13px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em}.author-info{display:flex;gap:16px;align-items:flex-start}.author-avatar{width:56px;height:56px;border-radius:50%;overflow:hidden;flex-shrink:0;background:var(--bg-secondary)}.author-avatar img{width:100%;height:100%;object-fit:cover}.author-details h3{color:var(--text-primary);font-size:1.05rem;margin-bottom:2px}.author-role{display:block;color:var(--accent);font-size:.8rem;font-weight:600;margin-bottom:8px}.author-details p{color:var(--text-muted);font-size:.9rem;line-height:1.6;margin:0}.related-posts{margin-bottom:60px}.related-posts h2{font-family:var(--font-display);color:var(--text-primary);font-size:1.6rem;margin-bottom:24px}.related-posts-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:24px}.related-post-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;transition:all .3s ease}.related-post-card:hover{transform:translateY(-4px);border-color:var(--accent);box-shadow:var(--shadow-card)}.related-post-image{aspect-ratio:16/9;overflow:hidden;background:var(--bg-secondary)}.related-post-image img{width:100%;height:100%;object-fit:cover}.related-post-content{padding:18px}.related-post-content h3{font-size:1rem;margin-bottom:8px}.related-post-content h3 a{color:var(--text-primary);text-decoration:none;transition:color .3s ease}.related-post-content h3 a:hover{color:var(--accent)}.related-post-content p{color:var(--text-muted);font-size:.875rem;line-height:1.5;margin-bottom:14px;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.related-post-meta{display:flex;gap:14px;flex-wrap:wrap}.related-post-meta .meta-item{display:flex;align-items:center;gap:5px;color:var(--text-muted);font-size:12px}.related-post-meta .meta-icon{width:14px;height:14px}.comments-section{margin-bottom:60px}.comments-section h2{font-family:var(--font-display);color:var(--text-primary);font-size:1.6rem;margin-bottom:24px}.comments-placeholder{display:flex;flex-direction:column;align-items:center;gap:16px;text-align:center;padding:48px 24px;background:var(--bg-card);border:1px dashed var(--border);border-radius:var(--radius-lg)}.comments-icon{width:40px;height:40px;color:var(--text-muted)}.comments-placeholder p{color:var(--text-muted);max-width:400px;margin:0}@media(max-width:900px){.article-content-wrapper{flex-direction:column}.table-of-contents{position:static;width:100%;flex:none;max-height:none}.table-of-contents .toc-indicator{display:none}}@media(max-width:768px){.blog-post{padding:0 16px}.article-title{font-size:1.8rem}.article-description,.article-content{font-size:1rem}.related-posts-grid{grid-template-columns:1fr}}@media(max-width:480px){.article-title{font-size:1.5rem}.author-info{flex-direction:column;align-items:center;text-align:center}}