.article-hero{background:linear-gradient(135deg,#6366f1 0,#4f46e5 100%);color:#fff;padding:4rem 0 3rem;margin-bottom:2rem}.article-hero h1{font-size:2.5rem;margin-bottom:1rem;color:#fff;line-height:1.3;max-width:860px}.article-meta{display:flex;align-items:center;gap:2rem;flex-wrap:wrap;margin-top:1.5rem}.article-meta-item{display:flex;align-items:center;gap:.5rem;font-size:.95rem;opacity:.95}.article-category{background:rgba(255,255,255,.2);padding:.3rem 1rem;border-radius:20px;font-size:.85rem}.breadcrumb{padding:1rem 0;font-size:.9rem}.breadcrumb a{color:rgba(255,255,255,.85);text-decoration:none}.breadcrumb a:hover{color:#fff;text-decoration:underline}.breadcrumb span{margin:0 .5rem}.article-container{display:grid;grid-template-columns:1fr 300px;gap:3rem;max-width:1200px;margin:0 auto;padding:0 1rem}.article-content{max-width:100%;min-width:0}.article-content h2{font-size:1.8rem;color:var(--accent-primary);margin:2.5rem 0 1rem;padding-bottom:.5rem;border-bottom:2px solid var(--border-color);scroll-margin-top:90px}.article-content h3{font-size:1.35rem;color:var(--text-primary);margin:2rem 0 1rem;scroll-margin-top:90px}.article-content h4{font-size:1.1rem;color:var(--text-primary);margin:1.5rem 0 .75rem}.article-content p{font-size:1.08rem;line-height:1.8;color:var(--text-secondary);margin-bottom:1.5rem}.article-content ol,.article-content ul{margin:1rem 0 1.5rem 1.5rem;line-height:1.8;color:var(--text-secondary)}.article-content li{margin-bottom:.75rem;font-size:1.03rem}.article-content strong{color:var(--text-primary)}.article-content a{color:var(--accent-primary)}.article-lead{font-size:1.2rem!important;line-height:1.75!important;color:var(--text-primary)!important}.article-content blockquote{margin:2rem 0;padding:.5rem 0 .5rem 1.5rem;border-left:4px solid var(--accent-primary);font-style:italic;color:var(--text-secondary)}.code-block{background:#1e1e1e;color:#d4d4d4;padding:1.5rem;border-radius:8px;overflow-x:auto;margin:1.5rem 0;font-family:Consolas,Monaco,'Courier New',monospace;font-size:.92rem;line-height:1.6;white-space:pre;tab-size:4}.code-block .string{color:#ce9178}.code-block .number{color:#b5cea8}.code-block .boolean{color:#569cd6}.code-block .null{color:#569cd6}.code-block .key{color:#9cdcfe}.code-block .bracket{color:gold}.code-block .comment{color:#6a9955}.code-block .keyword{color:#c586c0}.code-block .function{color:#dcdcaa}.code-block .variable{color:#4fc1ff}.code-block .ok{color:#4ec9b0}.code-block .bad{color:#f48771}.code-inline{background:var(--bg-tertiary);color:var(--text-primary);padding:.15rem .45rem;border-radius:4px;border:1px solid var(--border-light);font-family:Consolas,Monaco,'Courier New',monospace;font-size:.88em;white-space:nowrap}.info-box{background:#f0f9ff;border-left:4px solid #2563eb;padding:1.5rem;margin:2rem 0;border-radius:0 8px 8px 0}.info-box.warning{background:#fef3c7;border-left-color:#f59e0b}.info-box.success{background:#d1fae5;border-left-color:#10b981}.info-box.danger{background:#fee2e2;border-left-color:#ef4444}.info-box h3{margin:0 0 .75rem;font-size:1.1rem;color:#1e40af}.info-box.warning h3{color:#92400e}.info-box.success h3{color:#065f46}.info-box.danger h3{color:#991b1b}.info-box li,.info-box ol,.info-box p,.info-box ul{color:#1f2937}.info-box ol:last-child,.info-box p:last-child,.info-box ul:last-child{margin-bottom:0}[data-theme=dark] .info-box{background:rgba(59,130,246,.12);border-left-color:#3b82f6}[data-theme=dark] .info-box.warning{background:rgba(245,158,11,.12);border-left-color:#f59e0b}[data-theme=dark] .info-box.success{background:rgba(16,185,129,.12);border-left-color:#10b981}[data-theme=dark] .info-box.danger{background:rgba(239,68,68,.12);border-left-color:#ef4444}[data-theme=dark] .info-box h3{color:#93c5fd}[data-theme=dark] .info-box.warning h3{color:#fcd34d}[data-theme=dark] .info-box.success h3{color:#6ee7b7}[data-theme=dark] .info-box.danger h3{color:#fca5a5}[data-theme=dark] .info-box li,[data-theme=dark] .info-box ol,[data-theme=dark] .info-box p,[data-theme=dark] .info-box ul{color:var(--text-secondary)}[data-theme=dark] .info-box strong{color:var(--text-primary)}.table-scroll{overflow-x:auto;margin:2rem 0;-webkit-overflow-scrolling:touch}.table-scroll .comparison-table{margin:0}.comparison-table{width:100%;border-collapse:collapse;margin:2rem 0;font-size:.98rem;color:var(--text-secondary)}.comparison-table td,.comparison-table th{padding:.85rem 1rem;text-align:left;border-bottom:1px solid var(--border-color);vertical-align:top}.comparison-table th{background:var(--bg-tertiary);color:var(--text-primary);font-weight:600;white-space:nowrap}.comparison-table tbody tr:hover{background:var(--bg-tertiary)}.comparison-table strong{color:var(--text-primary)}.comparison-table .code-inline,.comparison-table code{white-space:nowrap}.swatch{display:inline-block;width:40px;height:22px;border-radius:4px;border:1px solid var(--border-color);vertical-align:middle}.comparison-table.dense td,.comparison-table.dense th{padding:.5rem .75rem;font-size:.92rem}.use-case-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1.5rem;margin:2rem 0}.use-case{background:var(--bg-tertiary);border:1px solid var(--border-light);padding:1.5rem;border-radius:10px}.use-case h3{margin:0 0 .75rem;font-size:1.1rem;display:flex;align-items:center;gap:.5rem;color:var(--text-primary)}.use-case p{font-size:1rem;margin-bottom:0;color:var(--text-secondary)}.answer-box{background:var(--bg-tertiary);border:1px solid var(--border-light);border-top:4px solid var(--accent-primary);padding:1.5rem 1.75rem;border-radius:10px;margin:0 0 2.5rem}.answer-box h2{font-size:1.15rem!important;margin:0 0 .75rem!important;padding:0!important;border:none!important;color:var(--text-primary)!important;text-transform:uppercase;letter-spacing:.04em}.answer-box p{margin-bottom:0;font-size:1.08rem;color:var(--text-primary)}.cta-box{background:linear-gradient(135deg,#6366f1 0,#4f46e5 100%);color:#fff;padding:2rem;border-radius:12px;text-align:center;margin:2.5rem 0}.cta-box h3{color:#fff;margin-top:0}.cta-box p{color:rgba(255,255,255,.95);margin-bottom:1.5rem}.cta-button{display:inline-block;background:#fff;color:#4f46e5;padding:.75rem 2rem;border-radius:8px;text-decoration:none;font-weight:600;transition:all .3s ease}.cta-button:hover{transform:translateY(-2px);box-shadow:0 4px 15px rgba(0,0,0,.2)}.article-sidebar{position:sticky;top:2rem;height:fit-content;max-height:calc(100vh - 4rem);overflow-y:auto}.sidebar-section{background:var(--card-bg);border:1px solid var(--border-color);border-radius:12px;padding:1.5rem;margin-bottom:1.5rem}.sidebar-section h3{font-size:1.05rem;margin-top:0;margin-bottom:1rem;color:var(--text-primary)}.toc-list{list-style:none;padding:0;margin:0}.toc-list li{margin-bottom:.55rem}.toc-list a{color:var(--text-secondary);text-decoration:none;font-size:.9rem;line-height:1.45;display:block}.toc-list a:hover{color:var(--accent-primary)}.author-bio{background:var(--bg-tertiary);border:1px solid var(--border-light);padding:2rem;border-radius:12px;margin-top:3rem;display:flex;gap:1.5rem;align-items:center}.author-bio-avatar{width:80px;height:80px;background:linear-gradient(135deg,#6366f1 0,#4f46e5 100%);border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:2rem;flex-shrink:0}.author-bio h4{margin:0 0 .5rem 0;color:var(--text-primary)}.author-bio p{margin:0;font-size:.95rem;color:var(--text-secondary)}.faq-item{border-bottom:1px solid var(--border-color);padding:1.25rem 0}.faq-item:last-child{border-bottom:none}.faq-item h3{margin:0 0 .6rem;font-size:1.1rem;color:var(--text-primary)}.faq-item p{margin-bottom:0;font-size:1.03rem}@media (max-width:968px){.article-container{grid-template-columns:1fr}.article-sidebar{position:static;max-height:none;overflow:visible}.article-hero{padding:2.5rem 0 2rem}.article-hero h1{font-size:1.8rem}.article-meta{gap:1rem}}@media (max-width:600px){.article-content h2{font-size:1.45rem}.article-content h3{font-size:1.2rem}.code-block{padding:1rem;font-size:.82rem}.author-bio{flex-direction:column;text-align:center}}@media print{.article-sidebar,.cta-box,.footer,.header{display:none!important}.article-container{grid-template-columns:1fr}.article-hero{background:0 0;color:#000}.article-hero h1{color:#000}}