.toc{background-color:var(--color-bg-muted);border-radius:var(--border-radius-lg);padding:var(--space-lg);margin-top:var(--space-md);margin-bottom:var(--space-xl);box-shadow:var(--shadow-sm)}.toc-header{margin-bottom:var(--space-sm)}.toc-title{font-size:var(--font-size-sm);font-weight:600;margin:0;color:var(--color-text-muted)}.toc-list-wrap{position:relative;padding-bottom:1.1rem}.toc.expanded .toc-list-wrap{padding-bottom:0}.toc-list{list-style:none;padding:0;margin:0;transition:max-height .3s ease-out,opacity .3s ease-out}.toc-list-wrap.is-truncated .toc-list{max-height:var(--toc-max-height);overflow:hidden;-webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 30%,transparent 100%);mask-image:linear-gradient(to bottom,#000 0%,#000 30%,transparent 100%);transition:max-height .3s ease-out,-webkit-mask-image .3s ease-out,mask-image .3s ease-out}.toc.expanded .toc-list{max-height:2000px;overflow:visible;-webkit-mask-image:none;mask-image:none}.toc-item{margin-bottom:var(--space-sm);line-height:1.4;font-size:var(--font-size-sm)}.toc-item a{color:var(--color-text-muted);text-decoration:none;transition:color .2s,transform .2s;display:inline-block}.toc-item a:hover{color:var(--color-link);text-decoration:underline;transform:translate(3px);opacity:1}.depth-2{margin-left:0}.depth-3{margin-left:var(--space-lg)}.depth-4{margin-left:var(--space-2xl)}.depth-5{margin-left:calc(var(--space-2xl) + var(--space-lg))}.depth-6{margin-left:calc(var(--space-3xl) + var(--space-xl))}.toc-hidden{display:none}.toc-show-more-wrapper{position:absolute;left:0;right:0;bottom:-.1rem;display:flex;justify-content:center;z-index:2;opacity:1;transition:opacity .3s ease-out}.toc-show-more-wrapper.hiding{opacity:0;pointer-events:none}.toc-show-more{background:none;border:none;color:var(--color-text-muted);cursor:pointer;font-size:var(--font-size-sm);padding:var(--space-xs) var(--space-sm);opacity:.65;transition:opacity .2s,color .2s;line-height:1}.toc-show-more-icon{display:block}.toc-show-more:hover{opacity:1;color:var(--color-link)}.author-bio{display:flex;align-items:center;padding:var(--space-lg);margin:var(--space-2xl) 0 var(--space-xl) 0;background-color:var(--color-bg-muted);border-radius:var(--border-radius-lg)}.author-image{margin-right:var(--space-lg);flex-shrink:0}.author-image img{width:80px;height:80px;border-radius:50%;object-fit:cover}.author-info{flex:1;display:flex;flex-direction:column;justify-content:center}.author-name{margin:0 0 var(--space-sm) 0;font-size:var(--font-size-xl);font-weight:600;color:var(--color-text)}.author-description{margin:0;font-size:var(--font-size-sm);line-height:1.5;color:var(--color-text-muted)}.author-full-bio{margin-top:var(--space-md);font-size:var(--font-size-sm);line-height:1.6;color:var(--color-text-muted)}.author-full-bio p{margin:.5rem 0}.article-cta{margin-top:var(--space-2xl);padding:var(--space-xl);background:var(--color-bg-code);border-radius:var(--border-radius-lg);text-align:center}.cta-heading{font-size:var(--font-size-base);font-weight:600;margin:0 0 var(--space-sm) 0;color:var(--color-text-dark)}.cta-description{font-size:var(--font-size-base);color:var(--color-text-muted);margin:0 0 var(--space-20px) 0;line-height:var(--line-height-normal)}.cta-button{display:inline-block;background:#2d2a67;color:#fff;padding:calc(var(--space-sm) + var(--space-xs)) calc(var(--space-md) + var(--space-sm));border-radius:var(--border-radius-sm);text-decoration:none;font-size:var(--font-size-base);font-weight:500;transition:background .2s ease}.cta-button:hover{background:#1e1b4b;opacity:1}.article-content{max-width:680px;margin:0 auto;font-size:var(--font-size-base);line-height:var(--line-height-relaxed)}.article-content h2{font-size:var(--font-size-2xl);margin:var(--space-4xl) 0 var(--space-xl) 0}.article-content .table-of-contents h2{margin-top:0;font-size:var(--font-size-base)}.article-content h3{font-size:var(--font-size-xl);margin:var(--space-xl) 0 var(--space-lg) 0;color:var(--color-text)}.article-content ul,.article-content ol{margin-bottom:var(--space-lg);padding-left:var(--space-xl)}.article-content .table-of-contents ul,.article-content .table-of-contents ol{margin-bottom:0;padding-left:0}.article-content li{margin-bottom:0;line-height:var(--line-height-relaxed);color:var(--color-text-muted)}.article-content blockquote{border-left:4px solid var(--color-link);padding-left:var(--space-md);margin:var(--space-lg) 0;font-style:italic;color:var(--color-text-muted)}.article-content code{background-color:var(--color-bg-inline-code);padding:.2rem .4rem;border-radius:var(--border-radius-sm);font-family:var(--font-family-mono);font-size:.9em}.article-content pre{background-color:var(--color-bg-code);padding:var(--space-md);border-radius:var(--border-radius-md);overflow-x:auto;margin:var(--space-lg) 0}.article-content pre code{background-color:transparent;padding:0}.article-content img{max-width:100%;height:auto;border-radius:var(--border-radius-md);margin:var(--space-lg) 0}.article-content .two-col-images{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-md);margin:var(--space-lg) 0}.article-content .two-col-images p{display:contents}.article-content .two-col-images img{margin:0;width:100%}.article-content .full-width{width:100vw;max-width:none;margin-left:calc(-50vw + 50%);margin-right:calc(-50vw + 50%)}.article-content .full-width img{width:100%;max-width:980px;margin:var(--space-2xl) auto;display:block;border-radius:0}.article-content .full-width p{display:contents}@media (max-width: 720px){.article-content{padding:0 var(--space-md)}}.article-content .faq-block{margin:var(--space-2xl) 0;padding:0;background:transparent;border:none;display:flex;flex-direction:column;gap:var(--space-lg)}.article-content .faq-item{background:var(--color-bg-code);padding:var(--space-20px);border-radius:var(--border-radius-sm)}.article-content .faq-question{margin-bottom:var(--space-sm)}.article-content .faq-question p{margin:0;display:flex;align-items:baseline;color:var(--color-text);font-weight:700;line-height:var(--line-height-normal);font-size:var(--font-size-base)}.article-content .faq-question strong{display:inline-block;min-width:2rem;color:var(--color-text-lighter);font-weight:700;font-size:1.8rem;margin-right:var(--space-sm);flex-shrink:0;line-height:1}.article-content .faq-item>:not(.faq-question){margin-left:calc(var(--space-xl) + var(--space-xs));margin-bottom:var(--space-md);color:var(--color-text-muted);line-height:var(--line-height-normal);font-size:var(--font-size-base);display:block}.article-content .faq-item>:last-child{margin-bottom:0}.article-content .faq-item>ul,.article-content .faq-item>ol{margin-top:var(--space-sm);margin-bottom:var(--space-sm)}.article-content .faq-item>li{margin-bottom:var(--space-xs)}@media (max-width: 720px){.article-content .faq-item{padding:var(--space-md)}.article-content .faq-item>:not(.faq-question){margin-left:var(--space-lg);font-size:var(--font-size-sm)}}.body-article{background-color:var(--color-bg-card);padding:0 0 var(--space-xl) 0;border-radius:var(--border-radius-lg);box-shadow:var(--shadow-lg)}.hero{margin-bottom:var(--space-2xl)}.hero img{width:100%;aspect-ratio:1.91 / 1;object-fit:cover;border-radius:var(--border-radius-lg);margin-bottom:var(--space-lg)}.hero-intro .meta{display:flex;align-items:center;gap:var(--space-md);margin-bottom:var(--space-md);font-size:var(--font-size-sm);color:var(--color-text-muted)}.hero-intro .updated{font-style:italic}.hero-intro h1{font-size:var(--font-size-4xl);font-weight:700;line-height:var(--line-height-tight);margin-bottom:var(--space-xl);color:var(--color-text)}.hero-intro .description{font-size:var(--font-size-sm);color:var(--color-text-muted);line-height:1.6}.related-posts,.latest-posts{margin-top:var(--space-3xl);padding-top:var(--space-xl);border-top:1px solid var(--color-border)}.related-posts h2,.latest-posts h2{font-size:var(--font-size-3xl);margin-bottom:var(--space-xl);color:var(--color-text);text-align:center}.post-tags{display:flex;flex-wrap:wrap;gap:var(--space-sm);margin:var(--space-xl) 0;justify-content:flex-start}.tag-link{display:inline-block;padding:.2rem .5rem;background-color:var(--color-border-light);color:var(--color-text-muted);text-decoration:none;border-radius:4px;font-size:var(--font-size-sm);transition:all .3s ease;border:1px solid var(--color-border-dark)}.tag-link:hover{background-color:var(--color-link);color:#fff;border-color:var(--color-link);transform:translateY(-1px);box-shadow:var(--shadow-sm);opacity:1}@media (max-width: 720px){.hero-intro{padding:var(--space-md)}.hero-intro h1{font-size:var(--font-size-2xl)}.hero-intro .meta{flex-direction:column;align-items:flex-start;gap:var(--space-sm)}}