.article-grid{gap:var(--s6);grid-template-columns:repeat(3,1fr);display:grid}.article-card{gap:var(--s4);flex-direction:column;display:flex}.article-card__img{aspect-ratio:16/9;object-fit:cover;border-radius:var(--r-md);width:100%;transition:transform .6s var(--ease-smooth)}.article-card:hover .article-card__img{transform:scale(1.03)}.reading-progress{background:var(--accent);z-index:200;transform-origin:0;height:2px;position:fixed;top:0;left:0}.article-hero{padding-top:calc(var(--nav-top) + var(--s16));padding-bottom:var(--s12);border-bottom:1px solid var(--border);background:radial-gradient(ellipse 80% 60% at 20% 50%,#00e5ff52,transparent 60%),radial-gradient(ellipse 60% 80% at 80% 30%,#ff3d0033,transparent 60%),var(--bg);position:relative;overflow:hidden}.article-hero--with-image{min-height:clamp(520px,65vh,740px);padding-top:var(--s16);padding-bottom:var(--s16);background:0 0;align-items:flex-end;display:flex}.article-hero__overlay{z-index:1;background:linear-gradient(#00000040 0%,#0000008c 55%,#000000eb 100%);position:absolute;inset:0}.article-hero--with-image .article-hero__title{color:#fff}.article-hero--with-image .article-hero__desc{color:#ffffffbf}.article-hero--with-image .article-hero__meta{color:#fff9}.article-hero--with-image .article-hero__author-avatar{color:#fffc;background:#ffffff1f;border-color:#fff3}.article-hero--with-image .breadcrumb a,.article-hero--with-image .breadcrumb__sep{color:#ffffff80}.article-hero__inner{max-width:800px}.article-hero__title{font-family:var(--font-display);font-weight:800;font-size:var(--text-4xl);letter-spacing:-.04em;color:var(--text);margin-top:var(--s2);margin-bottom:var(--s6);line-height:1.05}.article-hero__desc{font-size:var(--text-lg);color:var(--text-muted);max-width:640px;margin-bottom:var(--s8);line-height:1.7}.article-hero__meta{align-items:center;gap:var(--s3);font-family:var(--font-mono);font-size:var(--text-label);letter-spacing:.08em;color:var(--text-muted);flex-wrap:wrap;display:flex}.article-hero__meta-sep{opacity:.4}.article-hero__author-avatar{background:var(--bg-surface-2);border:1px solid var(--border);width:28px;height:28px;font-family:var(--font-display);color:var(--text-muted);text-transform:uppercase;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:11px;font-weight:700;display:flex}.article-cover{aspect-ratio:16/9;border-radius:var(--r-lg);margin-top:var(--s10);background:var(--bg-surface);position:relative;overflow:hidden}.article-body-layout{gap:var(--s16);padding-block:var(--s16);grid-template-columns:minmax(0,72ch) 260px;align-items:start;display:grid}.prose{color:var(--text-muted);font-family:var(--font-body);font-size:var(--text-lg);min-width:0;line-height:1.85}.prose>*+*{margin-top:1.5em}.prose h2,.prose h3,.prose h4{font-family:var(--font-display);letter-spacing:-.03em;color:var(--text);margin-top:2.5em;margin-bottom:.6em;font-weight:700;line-height:1.2}.prose h2{font-size:var(--text-2xl)}.prose h3{font-size:var(--text-xl);padding-left:var(--s4);border-left:3px solid var(--accent)}.prose h4{font-size:var(--text-lg);color:var(--text-muted)}.prose p{margin-bottom:1.6em}.prose a{color:var(--accent);text-underline-offset:4px;text-decoration:underline}.prose a:hover{opacity:.75}.prose strong{color:var(--text);font-weight:700}.prose blockquote{border-left:3px solid var(--accent);padding:var(--s4)var(--s8);margin:var(--s10)0;background:var(--bg-surface);border-radius:0 var(--r-md)var(--r-md)0;font-size:var(--text-xl);color:var(--text-muted);font-style:italic;line-height:1.6}.prose ul,.prose ol{margin-bottom:1.5em;padding-left:1.5em}.prose li{margin-bottom:.5em}.prose ul li::marker{color:var(--accent)}.prose ol li::marker{color:var(--accent);font-family:var(--font-mono);font-size:.875em}.prose code{font-family:var(--font-mono);background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--r-sm);color:var(--accent);padding:.15em .45em;font-size:.85em}.prose pre{background:var(--bg-surface);border:1px solid var(--border);border-radius:var(--r-md);padding:var(--s6);margin:var(--s8)0;overflow-x:auto}.prose pre code{color:var(--text);font-size:var(--text-sm);background:0 0;border:none;padding:0}.prose img{border-radius:var(--r-md);width:100%;margin:var(--s8)0}.prose hr{border:none;border-top:1px solid var(--border);margin:var(--s12)0}.prose table{border-collapse:collapse;width:100%;font-size:var(--text-sm);margin-bottom:1.5em}.prose th,.prose td{padding:var(--s3)var(--s4);border:1px solid var(--border);text-align:left}.prose th{background:var(--bg-surface);font-family:var(--font-display);color:var(--text);font-weight:700}.article-sidebar{top:calc(var(--nav-top) + var(--s8));gap:var(--s6);flex-direction:column;display:flex;position:sticky}.article-sidebar__label{font-family:var(--font-mono);font-size:var(--text-label);letter-spacing:.1em;text-transform:uppercase;color:var(--text-dim)}.article-sidebar__divider{background:var(--border);height:1px}.toc-link{padding-block:var(--s2);font-size:var(--text-sm);color:var(--text-dim);transition:color var(--dur-fast)var(--ease-snap);line-height:1.4;text-decoration:none;display:block}.toc-link:hover{color:var(--text-muted)}.toc-link--active{color:var(--accent)}.toc-link--sub{padding-left:var(--s4);border-left:1px solid var(--border);font-size:var(--text-xs)}.toc-link--sub.toc-link--active{border-left-color:var(--accent)}.sidebar-author{align-items:flex-start;gap:var(--s3);margin-top:var(--s3);display:flex}.sidebar-author__avatar{background:var(--bg-surface-2);border:1px solid var(--border);width:36px;height:36px;font-family:var(--font-display);color:var(--text-muted);text-transform:uppercase;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:13px;font-weight:700;display:flex}.sidebar-author__name{font-family:var(--font-display);font-weight:700;font-size:var(--text-sm);color:var(--text);line-height:1.3}.sidebar-author__role{font-size:var(--text-xs);color:var(--text-dim);margin-top:2px;line-height:1.4}.sidebar-author__link{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--accent);letter-spacing:.06em;margin-top:var(--s2);transition:opacity var(--dur-fast)var(--ease-snap);text-decoration:none;display:inline-block}.sidebar-author__link:hover{opacity:.7}.sidebar-back-link{align-items:center;gap:var(--s2);font-family:var(--font-mono);font-size:var(--text-label);letter-spacing:.08em;text-transform:uppercase;color:var(--text-dim);transition:color var(--dur-fast)var(--ease-snap);text-decoration:none;display:inline-flex}.sidebar-back-link:hover{color:var(--text-muted)}.article-tag{font-family:var(--font-mono);font-size:var(--text-label);letter-spacing:.1em;text-transform:uppercase;color:var(--text-dim);border:1px solid var(--border);padding:var(--s1)var(--s3);border-radius:var(--r-pill);transition:color var(--dur-fast)var(--ease-snap),border-color var(--dur-fast)var(--ease-snap);text-decoration:none}.article-tag:hover{color:var(--accent);border-color:#00e5ff4d}.share-btn{align-items:center;gap:var(--s2);padding:var(--s2)var(--s4);border-radius:var(--r-pill);border:1px solid var(--border);color:var(--text-muted);font-family:var(--font-mono);font-size:var(--text-label);letter-spacing:.08em;text-transform:uppercase;cursor:none;transition:border-color var(--dur-fast)var(--ease-snap),color var(--dur-fast)var(--ease-snap);background:0 0;text-decoration:none;display:inline-flex}.share-btn:hover{border-color:var(--border-hover);color:var(--text)}@media (max-width:1024px){.article-grid{grid-template-columns:repeat(2,1fr)}.article-body-layout{grid-template-columns:1fr}.article-sidebar{gap:var(--s6);padding-top:var(--s8);border-top:1px solid var(--border);flex-flow:wrap;position:static}.article-sidebar>*{flex:200px}.article-sidebar__divider{display:none}}@media (max-width:768px){.article-grid{grid-template-columns:1fr}.article-hero__title{font-size:var(--text-3xl)}.article-cover{aspect-ratio:16/9;border-radius:var(--r-md)}.article-sidebar{flex-direction:column}}
