.blog-shell{--cal-canvas: #ffffff;--cal-card: #f5f5f5;--cal-ink: #111111;--cal-body: #374151;--cal-muted: #6b7280;--cal-muted-soft: #898989;--cal-hairline: #e5e7eb;--cal-hairline-soft: #f3f4f6;--cal-accent: #367d41;--cal-display: "Cal Sans", "Inter", system-ui, -apple-system, sans-serif;--cal-sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--cal-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, monospace}.blog-shell:has(.article-page){background:var(--cal-canvas);color:var(--cal-body);font-family:var(--cal-sans)}.blog-shell .reading-progress{background:var(--cal-ink);height:2px}.article-breadcrumb{font-family:var(--cal-sans);font-size:13px;font-weight:500;letter-spacing:0;text-transform:none;color:var(--cal-muted);margin-bottom:40px}.breadcrumb-chip{color:var(--cal-muted)}.breadcrumb-chip:hover{color:var(--cal-ink)}.breadcrumb-sep{color:var(--cal-muted-soft)}.article-page .blog-card-category{font-family:var(--cal-sans);font-size:13px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--cal-accent)}.article-title{font-family:var(--cal-display);font-size:clamp(34px,5.2vw,60px);font-weight:600;line-height:1.05;letter-spacing:-.04em;color:var(--cal-ink);margin:0 0 20px;font-variation-settings:normal}.article-subtitle{font-family:var(--cal-sans);font-size:clamp(17px,1.7vw,20px);line-height:1.5;color:var(--cal-muted);font-weight:400;font-style:normal;letter-spacing:0;margin:0 0 28px}.article-meta{font-family:var(--cal-sans);font-size:14px;color:var(--cal-muted);border-top:1px solid var(--cal-hairline);border-bottom:1px solid var(--cal-hairline)}.article-author{color:var(--cal-ink);font-weight:600}.article-author-avatar{width:32px;height:32px}.article-author-avatar--initial{background:var(--cal-card);color:var(--cal-ink);font-family:var(--cal-sans);font-weight:600}.article-meta-sep{color:var(--cal-muted-soft)}.article-ai-banner{background:var(--cal-card);border:1px solid var(--cal-hairline);border-left:3px solid var(--cal-ink);border-radius:0 8px 8px 0;font-family:var(--cal-sans);color:var(--cal-body)}.article-ai-banner strong{color:var(--cal-ink)}.article-ai-banner a{color:var(--cal-ink);font-weight:600;text-decoration:underline;text-underline-offset:2px}.article-cover{border-radius:12px;border:1px solid var(--cal-hairline)}.article-body{font-family:var(--cal-sans);font-size:clamp(17px,1.3vw,18px);line-height:1.7;color:var(--cal-body);font-weight:400;font-variation-settings:normal}.article-body>p:first-of-type:first-letter{font-size:inherit;font-weight:inherit;float:none;line-height:inherit;margin:0;color:inherit;font-family:inherit;font-variation-settings:normal}.article-body h2{font-family:var(--cal-display);font-size:clamp(24px,2.6vw,32px);font-weight:600;line-height:1.15;letter-spacing:-.03em;color:var(--cal-ink);margin:1.8em 0 .5em;font-variation-settings:normal}.article-body h3{font-family:var(--cal-display);font-size:clamp(19px,1.7vw,22px);font-weight:600;letter-spacing:-.02em;text-transform:none;color:var(--cal-ink);margin:1.6em 0 .4em}.article-body strong{font-weight:600;color:var(--cal-ink)}.article-body a{color:var(--cal-ink);text-decoration:underline;text-decoration-color:var(--cal-accent);text-decoration-thickness:1.5px;text-underline-offset:3px}.article-body a:hover{color:var(--cal-accent)}.article-body li::marker{color:var(--cal-muted)}.article-body blockquote{border-left:3px solid var(--cal-ink);color:var(--cal-muted);font-style:normal;padding:4px 0 4px 24px}.article-body code,.article-body .blog-code{font-family:var(--cal-mono);background:var(--cal-hairline-soft);border-radius:6px;color:var(--cal-ink)}.article-body pre,.article-body .blog-code{background:var(--cal-hairline-soft);border:1px solid var(--cal-hairline);border-radius:8px;font-family:var(--cal-mono)}.article-body img,.article-body .blog-img{border-radius:12px;border:1px solid var(--cal-hairline)}.article-tags{border-top:1px solid var(--cal-hairline)}.article-tags-label{font-family:var(--cal-sans);font-size:13px;font-weight:600;letter-spacing:0;text-transform:none;color:var(--cal-muted)}.article-tag{font-family:var(--cal-sans);font-size:13px;color:var(--cal-body);background:var(--cal-card);border:1px solid transparent;border-radius:9999px;padding:5px 12px}.article-tag:hover{border-color:var(--cal-hairline);color:var(--cal-ink)}.article-cta-bottom{border-top:1px solid var(--cal-hairline)}.article-back-btn{font-family:var(--cal-sans);font-size:14px;font-weight:600;color:var(--cal-muted)}.article-back-btn:hover{color:var(--cal-ink)}.article-cta-btn{background:var(--cal-ink);color:#fff;border-radius:8px;font-family:var(--cal-sans);font-size:14px;font-weight:600;padding:12px 20px}.article-cta-btn:hover{background:#242424;transform:none}.article-toc{border-left:1px solid var(--cal-hairline)}.article-toc-label{font-family:var(--cal-sans);font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--cal-muted);border-bottom:1px solid var(--cal-hairline)}.article-toc-link{font-family:var(--cal-sans);font-size:13px;color:var(--cal-muted)}.article-toc-link--sub{color:var(--cal-muted-soft);border-left:1px solid var(--cal-hairline)}.article-toc-link:hover{color:var(--cal-ink)}.article-toc-link.active{color:var(--cal-ink);font-weight:600}.article-toc-top{font-family:var(--cal-sans);font-size:12px;color:var(--cal-muted-soft);border-top:1px solid var(--cal-hairline)}.article-toc-top:hover{color:var(--cal-ink)}.article-related{max-width:720px;margin:64px auto 0;padding-top:40px;border-top:1px solid var(--cal-hairline)}.article-related-label{font-family:var(--cal-sans);font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--cal-muted);margin-bottom:20px}.article-related-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px}.article-related-card{display:block;padding:18px;border:1px solid var(--cal-hairline);border-radius:10px;text-decoration:none;transition:border-color .15s ease}.article-related-card:hover{border-color:var(--cal-ink)}.article-related-category{font-family:var(--cal-sans);font-size:11px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--cal-accent)}.article-related-title{font-family:var(--cal-display);font-size:17px;font-weight:600;line-height:1.3;letter-spacing:-.02em;color:var(--cal-ink);margin:8px 0 10px}.article-related-meta{font-family:var(--cal-sans);font-size:13px;color:var(--cal-muted)}@media (prefers-reduced-motion: reduce){.article-cta-btn,.article-cta-btn:hover{transition:none!important;transform:none!important}}