.blog-article{flex:1;width:100%;background:var(--fl-bg);color:var(--fl-text-muted);line-height:1.78;font-size:16px}.blog-article a{color:var(--fl-link);text-decoration:none}.blog-article a:hover{text-decoration:underline}.blog-article code{font-family:ui-monospace,Consolas,monospace;font-size:.88em;background:var(--fl-surface-muted);padding:2px 7px;border-radius:6px;color:var(--fl-text-strong)}.blog-article pre{background:#0f172a;color:#e2e8f0;padding:1.25rem 1.4rem;border-radius:14px;overflow-x:auto;font-size:.85em;margin:1.25rem 0}.blog-article pre code{background:none;padding:0;color:inherit}.blog-article-hero{background:linear-gradient(165deg,#eff6ff 0%,var(--fl-bg) 55%);border-bottom:1px solid var(--fl-border-soft);padding:2.5rem 1.25rem 2rem}html.theme-dark-active .blog-article-hero{background:linear-gradient(165deg,#0f172a 0%,var(--fl-bg) 70%)}.blog-article-hero__inner{max-width:var(--site-shell-max, 72rem);margin:0 auto;max-width:820px}.blog-article-breadcrumb{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem;font-size:.8125rem;color:var(--fl-text-soft);margin-bottom:1rem}.blog-article-breadcrumb a{color:var(--fl-link)}.blog-article-meta{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;margin-bottom:1rem}.blog-article-meta .meta-item{font-size:.8125rem;color:var(--fl-text-soft)}.blog-article-tag{display:inline-flex;padding:.3rem .7rem;border-radius:999px;font-size:.6875rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase}.blog-article-tag--security{background:#fef2f2;color:#991b1b;border:1px solid #fecaca}.blog-article-tag--guide{background:var(--fl-accent-soft);color:var(--fl-link-hover);border:1px solid color-mix(in srgb,var(--fl-link) 25%,transparent)}.blog-article-tag--tool{background:#ecfdf5;color:#047857;border:1px solid #bbf7d0}.blog-article-tag--adtech{background:#fff7ed;color:#9a3412;border:1px solid #fed7aa}.blog-article-tag--openrtb,.blog-article-tag--html{background:var(--fl-accent-soft);color:var(--fl-link-hover);border:1px solid color-mix(in srgb,var(--fl-link) 25%,transparent)}.blog-article-tag--css{background:#ecfdf5;color:#047857;border:1px solid #bbf7d0}.blog-article-tag--js{background:#fff7ed;color:#9a3412;border:1px solid #fed7aa}.blog-article-hero h1{font-size:clamp(1.75rem,5vw,2.75rem);line-height:1.08;margin:0 0 1rem;letter-spacing:-.045em;font-weight:900;color:var(--fl-text-strong)}.blog-article-lead{font-size:1.05rem;color:var(--fl-text-muted);line-height:1.65;margin:0;max-width:42rem}.blog-article-hero-cta{margin-top:1.5rem;display:flex;flex-wrap:wrap;gap:.75rem}.blog-article-btn{display:inline-flex;align-items:center;gap:.4rem;padding:.65rem 1.15rem;border-radius:999px;font-weight:800;font-size:.875rem;text-decoration:none}.blog-article-btn--primary{background:var(--fl-link);color:#fff}.blog-article-btn--primary:hover{background:var(--fl-link-hover);color:#fff;text-decoration:none}.blog-article-btn--ghost{border:1px solid var(--fl-border-soft);color:var(--fl-text-strong);background:var(--fl-surface)}.blog-article-btn--ghost:hover{background:var(--fl-accent-soft);text-decoration:none}.blog-article-layout{max-width:var(--site-shell-max, 72rem);margin:0 auto;padding:2.5rem 1.25rem 3.5rem;display:grid;grid-template-columns:1fr 280px;gap:2.5rem;align-items:start}.blog-article-body{min-width:0}.blog-article-body h2{font-size:1.75rem;font-weight:900;letter-spacing:-.04em;margin:3rem 0 1rem;padding-top:3rem;border-top:1px solid var(--fl-border-soft);color:var(--fl-text-strong)}.blog-article-body h2:first-of-type{margin-top:0;padding-top:0;border-top:none}.blog-article-body h3{font-size:1.15rem;font-weight:800;margin:1.75rem 0 .75rem;color:var(--fl-text-strong)}.blog-article-body p,.blog-article-body li{color:var(--fl-text-muted)}.blog-article-body ul,.blog-article-body ol{margin:.5rem 0 1.1rem;padding-left:1.35rem}.blog-article-body li{margin-bottom:.45rem}.blog-article-body strong{color:var(--fl-text-strong)}.blog-article .callout{border-radius:12px;padding:1rem 1.25rem;margin:1.25rem 0;font-size:.95rem}.blog-article .callout-title,.blog-article .callout strong:first-child{font-weight:800;display:block;margin-bottom:.35rem}.blog-article .callout.blue{background:var(--fl-accent-soft);border:1px solid color-mix(in srgb,var(--fl-link) 25%,transparent);color:var(--fl-link-hover)}.blog-article .callout.green{background:#ecfdf5;border:1px solid #bbf7d0;color:#064e3b}.blog-article .callout.orange{background:#fff7ed;border:1px solid #fed7aa;color:#7c2d12}.blog-article .callout.red{background:#fef2f2;border:1px solid #fecaca;color:#991b1b}.blog-article .callout.purple{background:#f5f3ff;border:1px solid #ddd6fe;color:#4c1d95}.blog-article .table-wrap{overflow-x:auto;margin:1.25rem 0;border-radius:12px;border:1px solid var(--fl-border-soft);box-shadow:0 4px 18px #0f172a0f}.blog-article table{width:100%;border-collapse:collapse;font-size:.875rem;background:var(--fl-surface)}.blog-article thead{background:var(--fl-surface-muted)}.blog-article th{padding:.75rem 1rem;text-align:left;font-weight:800;font-size:.75rem;text-transform:uppercase;letter-spacing:.05em;border-bottom:1px solid var(--fl-border-soft)}.blog-article td{padding:.75rem 1rem;border-bottom:1px solid var(--fl-border-soft);vertical-align:top}.blog-article tr:last-child td{border-bottom:none}.blog-article .td-hl{font-weight:700;color:var(--fl-text-strong)}.blog-article .td-ok{color:#059669;font-weight:700}.blog-article .td-bad{color:#dc2626;font-weight:700}.blog-article .td-med{color:#d97706;font-weight:700}.blog-article .td-req{color:#dc2626;font-weight:700}.blog-article .json-block{background:#0f172a;border-radius:14px;overflow:hidden;margin:1.25rem 0;font-size:.8125rem}.blog-article .json-bar{padding:.5rem 1.1rem;background:#1e293b;font-size:.6875rem;font-weight:700;color:#94a3b8;letter-spacing:.05em;text-transform:uppercase;display:flex;justify-content:space-between;gap:.75rem}.blog-article .json-body{padding:1.1rem 1.25rem;overflow-x:auto}.blog-article .json-body pre{margin:0;padding:0;background:none;font-size:.8125rem;line-height:1.7}.blog-article .jk{color:#a5b4fc}.blog-article .jstr{color:#86efac}.blog-article .jnum{color:#fbbf24}.blog-article .jbool{color:#f9a8d4}.blog-article .jcmt{color:#475569;font-style:italic}.blog-article .compare{display:grid;grid-template-columns:1fr 1fr;gap:.75rem;margin:1.25rem 0}.blog-article .compare-pane{border-radius:12px;overflow:hidden;border:1px solid var(--fl-border-soft)}.blog-article .compare-label{padding:.5rem .875rem;font-size:.6875rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--fl-text-soft);background:var(--fl-surface-muted);border-bottom:1px solid var(--fl-border-soft)}.blog-article .compare-pane pre{margin:0;border-radius:0;font-size:.72rem;padding:.875rem}.blog-article .code-block{border-radius:12px;overflow:hidden;margin:1.25rem 0}.blog-article .code-bar{padding:.5rem 1rem;background:#1e293b;font-size:.6875rem;font-weight:700;color:#94a3b8;letter-spacing:.04em;text-transform:uppercase}.blog-article .code-body{background:#0f172a;padding:1rem 1.1rem;overflow-x:auto}.blog-article .code-body pre{margin:0;padding:0;background:none;font-size:.75rem;line-height:1.7}.blog-article .hk{color:#7dd3fc}.blog-article .hv{color:#86efac}.blog-article .hcmt{color:#475569;font-style:italic}@media (max-width: 860px){.blog-article .compare{grid-template-columns:1fr}}.blog-article .steps{display:flex;flex-direction:column;gap:1rem;margin:1.25rem 0}.blog-article .step{display:flex;gap:1rem;align-items:flex-start}.blog-article .step-num{width:2rem;height:2rem;border-radius:50%;background:var(--fl-link);color:#fff;font-weight:900;font-size:.875rem;display:flex;align-items:center;justify-content:center;flex-shrink:0}.blog-article .step-body strong{display:block;margin-bottom:.25rem}.blog-article .step-body p{margin:0;font-size:.875rem}.blog-article .warning-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.875rem;margin:1.25rem 0}.blog-article .warning-card{border-radius:12px;padding:1rem 1.1rem;font-size:.875rem}.blog-article .warning-card.bad{background:#fef2f2;border:1px solid #fecaca}.blog-article .warning-card.good{background:#ecfdf5;border:1px solid #bbf7d0}.blog-article .warning-card strong{display:block;font-size:.75rem;text-transform:uppercase;letter-spacing:.04em;margin-bottom:.4rem}.blog-article .warning-card.bad strong{color:#dc2626}.blog-article .warning-card.good strong{color:#059669}.blog-article .warning-card p{margin:0;line-height:1.55}.blog-article .email-preview{background:var(--fl-surface);border:1px solid var(--fl-border-soft);border-radius:14px;overflow:hidden;margin:1.25rem 0}.blog-article .email-header-bar{background:var(--fl-surface-muted);padding:.875rem 1.1rem;border-bottom:1px solid var(--fl-border-soft);font-size:.8125rem}.blog-article .email-field{display:flex;gap:.5rem;margin-bottom:.25rem}.blog-article .email-label{color:var(--fl-text-soft);font-weight:700;min-width:3.5rem}.blog-article .email-flag{display:inline-block;background:#fef2f2;color:#991b1b;border:1px solid #fecaca;font-size:.6875rem;font-weight:700;padding:0 .5rem;border-radius:999px;margin-left:.35rem}.blog-article .email-body-area{padding:1.1rem;font-size:.875rem;line-height:1.7}.blog-article .email-highlight{background:#fef9c3;border-bottom:2px solid #f59e0b}.blog-article .annotation{font-size:.75rem;background:#1e293b;color:#e2e8f0;padding:.3rem .6rem;border-radius:8px;display:inline-block;margin:.25rem 0 .25rem .5rem}.blog-article .checklist{display:flex;flex-direction:column;gap:.5rem;margin:1rem 0}.blog-article .check-item{display:flex;align-items:flex-start;gap:.65rem;padding:.65rem .875rem;background:var(--fl-surface);border:1px solid var(--fl-border-soft);border-radius:10px;font-size:.875rem}.blog-article .ck{flex-shrink:0;width:1.25rem;height:1.25rem;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.6875rem;font-weight:800;margin-top:.1rem}.blog-article .ck-bad{background:#fef2f2;color:#dc2626;border:1px solid #fecaca}.blog-article .cta-banner{background:linear-gradient(135deg,#1e3a8a,#4338ca);border-radius:16px;padding:1.75rem 2rem;margin:2rem 0;color:#fff;display:flex;align-items:center;justify-content:space-between;gap:1.25rem;flex-wrap:wrap}.blog-article .cta-banner h3{font-size:1.25rem;font-weight:900;margin:0 0 .35rem;color:#fff}.blog-article .cta-banner p{margin:0;font-size:.9375rem;color:#c7d2fe}.blog-article .cta-banner a{display:inline-flex;padding:.65rem 1.25rem;background:#fff;color:#1d4ed8;border-radius:999px;font-weight:800;font-size:.875rem;white-space:nowrap;text-decoration:none}.blog-article .cta-banner a:hover{background:#eff6ff}.blog-article .faq-list{background:var(--fl-surface);border:1px solid var(--fl-border-soft);border-radius:14px;padding:.25rem 1.5rem;box-shadow:0 4px 18px #0f172a0f}.blog-article details{border-top:1px solid var(--fl-border-soft)}.blog-article details:first-of-type{border-top:none}.blog-article summary{font-weight:800;cursor:pointer;padding:1rem 0;list-style:none;display:flex;justify-content:space-between;color:var(--fl-text-strong)}.blog-article summary::-webkit-details-marker{display:none}.blog-article summary:after{content:"+";color:var(--fl-text-soft);margin-left:1rem}.blog-article details[open] summary:after{content:"−"}.blog-article .article-footer{margin-top:3rem;padding-top:1.75rem;border-top:1px solid var(--fl-border-soft)}.blog-article .article-footer h3{font-size:1.1rem;font-weight:800;margin-bottom:.875rem;color:var(--fl-text-strong)}.blog-article .related-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.875rem}.blog-article .related-card{background:var(--fl-surface);border:1px solid var(--fl-border-soft);border-radius:14px;padding:1.1rem;text-decoration:none;display:block;transition:box-shadow .18s,transform .18s}.blog-article .related-card:hover{box-shadow:0 12px 32px #0f172a14;transform:translateY(-2px);text-decoration:none}.blog-article .rc-tag{font-size:.6875rem;font-weight:800;color:var(--fl-text-soft);text-transform:uppercase;letter-spacing:.04em;margin-bottom:.35rem;display:block}.blog-article .rc-title{font-size:.9375rem;font-weight:700;color:var(--fl-text-strong);line-height:1.35}.blog-article-sidebar{position:sticky;top:4.5rem}.blog-article-toc{background:var(--fl-surface);border:1px solid var(--fl-border-soft);border-radius:14px;padding:1.25rem;margin-bottom:1rem;box-shadow:0 4px 18px #0f172a0f}.blog-article-toc__title{font-size:.8125rem;font-weight:800;color:var(--fl-text-soft);text-transform:uppercase;letter-spacing:.05em;margin-bottom:.875rem}.blog-article-toc ul{list-style:none;padding:0;margin:0}.blog-article-toc a{display:block;padding:.35rem .65rem;border-radius:8px;font-size:.8125rem;font-weight:600;color:var(--fl-text-muted)}.blog-article-toc a:hover{background:var(--fl-accent-soft);color:var(--fl-link);text-decoration:none}.blog-article-toc .sub{padding-left:1.25rem;font-size:.75rem;font-weight:500}.blog-article-promo{background:linear-gradient(135deg,#1e3a8a,#4338ca);border-radius:14px;padding:1.25rem;color:#fff;text-align:center}.blog-article-promo h3{font-size:1rem;font-weight:800;margin:0 0 .5rem;color:#fff}.blog-article-promo p{font-size:.8125rem;color:#c7d2fe;margin:0 0 1rem;line-height:1.5}.blog-article-promo a{display:block;padding:.65rem 1rem;background:#fff;color:#1d4ed8;border-radius:10px;font-weight:800;font-size:.8125rem;text-decoration:none}.blog-article-promo a:hover{background:#eff6ff}.blog-article-promo-stats{display:grid;grid-template-columns:1fr 1fr;gap:.5rem;margin-bottom:.875rem}.blog-article-stat-mini{background:#ffffff1a;border-radius:10px;padding:.5rem;text-align:left}.blog-article-stat-mini strong{font-size:1.1rem;font-weight:900;color:#fff;display:block}.blog-article-stat-mini span{font-size:.6875rem;color:#a5b4fc;line-height:1.3}@media (max-width: 900px){.blog-article-layout{grid-template-columns:1fr}.blog-article-sidebar{position:static;order:-1}.blog-article .warning-grid,.blog-article .related-grid{grid-template-columns:1fr}.blog-article .cta-banner{flex-direction:column;text-align:center}}
