.reading-progress-bar{position:fixed;top:0;left:0;height:2px;background:var(--accent);z-index:200}.article-container{max-width:760px}.article-header{margin-bottom:2.5rem;padding-bottom:1.75rem;border-bottom:1px solid var(--border)}.article-title{font-size:clamp(2rem,5vw,2.75rem);letter-spacing:-.03em;line-height:1.15}.article-meta{display:flex;flex-wrap:wrap;gap:.4rem .6rem;margin-top:1rem;font-size:.9375rem;color:var(--text-muted)}.article-meta a{color:var(--text-2);font-weight:500}.article-content{font-size:1.0625rem;line-height:1.8;color:var(--text-2)}.article-content>*+*{margin-top:1.25rem}.article-content h2,.article-content h3,.article-content h4{color:var(--text);letter-spacing:-.02em;line-height:1.3;margin-top:2.5rem}.article-content h2{font-size:1.625rem}.article-content h3{font-size:1.375rem}.article-content h4{font-size:1.125rem}.article-content strong{color:var(--text);font-weight:600}.article-content ul,.article-content ol{padding-left:1.4rem}.article-content ul li{list-style:disc}.article-content ol li{list-style:decimal}.article-content li+li{margin-top:.4rem}.article-content li::marker{color:var(--text-muted)}.article-content a{color:var(--accent);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}.article-content blockquote{padding:.25rem 0 .25rem 1.25rem;border-left:3px solid var(--border-strong);color:var(--text)}.article-content img{border-radius:var(--radius);border:1px solid var(--border)}.inline-code{font-family:var(--font-mono);font-size:.875em;padding:.12em .4em;border-radius:5px;background:var(--bg-subtle);border:1px solid var(--border);color:var(--text);overflow-wrap:anywhere}.code-wrapper{position:relative;border-radius:var(--radius);overflow:hidden;background:#0f1117;border:1px solid #1f2430}.article-content>.code-wrapper{margin-top:1.5rem;margin-bottom:.25rem}.code-wrapper pre{margin:0;padding:1.25rem 1.35rem;overflow-x:auto;font-family:var(--font-mono);font-size:.875rem;line-height:1.7;color:#e6e9ef}.code-copy-btn{position:absolute;top:.6rem;right:.6rem;height:28px;padding:0 .65rem;border-radius:var(--radius-sm);background:#ffffff14;border:1px solid rgba(255,255,255,.14);color:#e6e9ef;font-size:.75rem;font-weight:500;opacity:0;transition:opacity var(--transition),background var(--transition)}.code-wrapper:hover .code-copy-btn,.code-copy-btn:focus-visible{opacity:1}.code-copy-btn:hover{background:#ffffff29}@media(hover:none){.code-copy-btn{opacity:1}}.token-keyword{color:#fc5fa3;font-weight:600}.token-type{color:#5dd8f6}.token-attribute{color:#e5c07b}.token-string{color:#fc6a5d}.token-number{color:#d0bf82}.token-comment{color:#7f8c98;font-style:italic}.token-function{color:#a9dc76}.faq-accordion-item{display:flex;flex-wrap:wrap;align-items:flex-start;gap:.75rem;padding:1rem 1.15rem;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);transition:border-color var(--transition)}.article-content>.faq-accordion-item+.faq-accordion-item{margin-top:.6rem}.faq-accordion-item:hover,.faq-accordion-item.active-faq{border-color:var(--border-strong)}.faq-indicator{width:1rem;font-family:var(--font-mono);font-weight:600;line-height:1.8;color:var(--text-muted)}.faq-question{flex:1;color:var(--text);font-weight:600}.faq-question strong{font-weight:600}.faq-answer{display:none;width:100%;padding-left:1.75rem;color:var(--text-2)}.article-author{display:flex;align-items:center;gap:1.1rem;margin-top:3.5rem;padding:1.35rem;border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--bg-subtle)}.article-author-image{width:64px;height:64px;flex-shrink:0;border-radius:var(--radius-full);object-fit:cover;background:var(--border)}.article-author-name{font-weight:600;color:var(--text)}.article-author-name a{color:inherit}.article-author-bio{margin-top:.2rem;font-size:.9375rem;color:var(--text-2)}.article-back{margin-top:2rem}@media(max-width:640px){.article-content{font-size:1rem;line-height:1.75}.code-wrapper pre{padding:1rem;font-size:.8125rem}.article-author{align-items:flex-start}}.article-content .short-answer{padding:1rem 1.25rem;border:1px solid var(--border);border-left:3px solid var(--accent);border-radius:var(--radius);background:var(--bg-subtle);color:var(--text)}
