html[data-v='f'] .vx.desktop-design{visibility:visible}
/* Blog pages (/blog, /blog/page/N, /blog/<slug>, the 404). Loaded after styles.css, which supplies
   the header, footer and mobile menu. Generated markup uses only bl-*, vx-*, hljs* and language-*
   classes, so none of the phone rules styles.css applies to .section/.text/.frame/.button reach it. */

/* Fallback faces matched to the web fonts' metrics so the swap does not move text.
   Method: size-adjust = the font's average advance width of a-z and space (weighted by English
   letter frequency, as capsize does) over Arial's; ascent/descent/line-gap overrides = the hhea
   values / unitsPerEm / size-adjust. Read once from public/site/assets/fonts/*.ttf (hhea, hmtx, cmap)
   and Arial's own tables: Arial avg 0.4505 em, Space Grotesk avg 0.4997 em, asc 984, desc 292, upm 1000. */
@font-face{font-family:'Inter Fallback';src:local('Arial');size-adjust:107.12%;ascent-override:90.44%;descent-override:22.52%;line-gap-override:0%}
@font-face{font-family:'Space Grotesk Fallback';src:local('Arial');size-adjust:110.91%;ascent-override:88.72%;descent-override:26.33%;line-gap-override:0%}

.bl{--vx:#f5a623;--vx-deep:#8b5f19;--vx-ink:#f4f2eb;--vx-muted:#a1a7a2;--vx-line:#303431;--bl-sans:Inter,'Inter Fallback',sans-serif;--bl-display:'Space Grotesk','Space Grotesk Fallback',sans-serif;--bl-mono:'IBM Plex Mono',ui-monospace,monospace}
body[data-page='blog']{--motion-accent:#f5a623}
.bl{display:block;width:100%;max-width:1440px;background-color:var(--bg,#0c0d0d);overflow-x:clip}

/* ---- borrowed from streams.html (.vx section → .bl-band) ---- */
.bl .vx-dark{background:#0c0d0d;color:var(--vx-ink)}
.bl .vx-paper{background:#eeede6;color:#162016;--vx-muted:#5c625d;--vx-line:rgba(22,32,22,.16)}
.bl .vx-nav{box-sizing:border-box;width:100%;display:flex;align-items:center;justify-content:space-between;gap:32px;flex-wrap:wrap;background:#0c0d0d;color:var(--vx-muted);padding-block:20px;padding-inline:max(calc(72 * var(--unit)),calc((100% - 1296px)/2));border-bottom:1px solid var(--vx-line)}
.bl .vx-crumb{margin:0;font-family:var(--bl-mono);font-size:11px;letter-spacing:1.4px;color:var(--vx)}
.bl .vx-eyebrow{margin:0 0 18px;font-family:var(--bl-mono);font-size:12px;letter-spacing:1.2px;text-transform:uppercase;color:var(--vx-muted)}
.bl .vx-h1{margin:0;font-family:var(--bl-display);font-weight:400;font-size:64px;line-height:1.02;letter-spacing:-2.4px;white-space:pre-line}
.bl .vx-h2{margin:0;font-family:var(--bl-display);font-weight:400;font-size:40px;line-height:1.08;letter-spacing:-1.4px;white-space:pre-line}
.bl .vx-lead{margin:20px 0 0;font-family:var(--bl-sans);font-size:19px;line-height:1.55;color:var(--vx-muted);max-width:60ch}
.bl .vx-pill{display:inline-flex;align-items:center;gap:10px;height:52px;padding:0 26px;border-radius:100px;background:var(--vx);color:#101510;font-family:var(--bl-sans);font-size:16px;font-weight:600;text-decoration:none}
.bl .vx-pill:hover{background:color-mix(in srgb,var(--vx) 80%,#fff)}
.bl .vx-link{font-family:var(--bl-sans);font-size:16px;font-weight:500;color:inherit;text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:2px}
.bl .vx-table-wrap{margin:28px 0;max-width:100%;overflow-x:auto;overscroll-behavior-inline:contain;-webkit-overflow-scrolling:touch}
.bl .vx-table-wrap:focus-visible{outline:2px solid var(--vx-deep);outline-offset:2px}
.bl .vx-table{width:100%;border-collapse:collapse;border-spacing:0;font-family:var(--bl-sans);font-size:15px;line-height:1.5;text-align:left;color:inherit}
.bl .vx-table th,.bl .vx-table td{padding:14px 24px 14px 0;border-top:1px solid var(--vx-line);vertical-align:top;text-align:left}
.bl .vx-table tbody tr:last-child>*{border-bottom:1px solid var(--vx-line)}
.bl .vx-table thead th{padding-block:0 12px;border-top:0;font-family:var(--bl-mono);font-size:11.5px;font-weight:400;letter-spacing:.8px;text-transform:uppercase;color:var(--vx-muted);white-space:nowrap}
.bl .vx-table td{color:var(--vx-muted)}
.bl .vx-table td strong{font-weight:600;color:#162016}
.bl .vx-table code{font-family:var(--bl-mono);font-size:13.5px}
.bl .vx-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ---- bands ---- */
.bl-band{box-sizing:border-box;display:block;width:100%;padding-block:88px;padding-inline:max(calc(72 * var(--unit)),calc((100% - 1296px)/2))}
.bl-title{overflow-wrap:break-word}
.bl a:focus-visible{outline:2px solid var(--vx);outline-offset:3px;border-radius:2px}
.bl .vx-paper a:focus-visible,.bl .bl-cta a:focus-visible{outline-color:#101510}

/* breadcrumbs */
.bl-crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:6px 0;min-width:0;max-width:100%;margin:0;padding:0;list-style:none;font-family:var(--bl-mono);font-size:11px;letter-spacing:1.2px;text-transform:uppercase;color:var(--vx-muted)}
.bl-crumbs li{min-width:0}
.bl-crumbs li+li::before{content:'/';margin:0 10px;color:var(--vx-line)}
.bl-crumbs a{color:var(--vx-muted);text-decoration:none}
.bl-crumbs a:hover{color:var(--vx-ink)}
.bl-crumbs [aria-current]{color:var(--vx)}

/* preview/dev banners */
.bl-banner{box-sizing:border-box;margin:0;padding:12px max(calc(72 * var(--unit)),calc((100% - 1296px)/2));font:600 14px/1.5 var(--bl-sans);color:#101510;background:#f5a623}
.bl-banner-scheduled{background:#ffd166}
.bl-warnings{box-sizing:border-box;padding:12px max(calc(72 * var(--unit)),calc((100% - 1296px)/2));background:#161a16;color:var(--vx-ink);font:14px/1.5 var(--bl-sans);border-bottom:1px solid var(--vx-line)}
.bl-warnings summary{cursor:pointer;color:#ffd166}
.bl-warnings ul{margin:10px 0 0;padding-left:18px}
.bl-warnings code{font-family:var(--bl-mono);font-size:12px;color:var(--vx-muted);margin-right:6px}
.bl-badge{display:inline-block;margin:0 0 10px;padding:3px 10px;border-radius:100px;font:600 11px/1.5 var(--bl-mono);letter-spacing:.6px;text-transform:uppercase;background:#f5a623;color:#101510}
.bl-badge-scheduled{background:#ffd166}

/* ---- heroes ---- */
.bl-hero{padding-block:88px 72px}
.bl-hero-copy{max-width:920px}
.bl-hero .vx-lead{max-width:62ch}
.bl-index-hero{padding-block:96px 72px}
.bl-meta{margin:24px 0 0;font-family:var(--bl-mono);font-size:12.5px;line-height:1.7;letter-spacing:.4px;color:var(--vx-muted)}
.bl-meta a{color:inherit;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.bl-hero .bl-meta a:hover{color:var(--vx-ink)}
.bl-feed{margin:28px 0 0}
.bl-cover{margin:48px 0 0;max-width:1040px}
.bl-cover img{display:block;width:100%;height:auto;border-radius:8px;background:#161a16}

/* ---- article body ---- */
.bl-body{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:64px;align-items:start}
.bl-body-notoc{grid-template-columns:minmax(0,1fr)}
.bl-main{grid-column:1;grid-row:1;min-width:0}
.bl-toc{grid-column:2;grid-row:1;position:sticky;top:24px;font-family:var(--bl-sans);font-size:14px;line-height:1.5}
.bl-toc summary{cursor:pointer;margin-bottom:12px;font-family:var(--bl-mono);font-size:11.5px;letter-spacing:1.2px;text-transform:uppercase;color:var(--vx-muted)}
.bl-toc ol{list-style:none;margin:0;padding:0}
.bl-toc li{margin:0}
.bl-toc ol ol{padding-left:14px}
.bl-toc a{display:block;padding:5px 0 5px 12px;border-left:1px solid var(--vx-line);color:#3c443c;text-decoration:none}
.bl-toc a:hover{color:#162016;border-left-color:var(--vx-deep)}

.bl-prose{max-width:72ch;font-family:var(--bl-sans);font-size:18px;line-height:1.7;color:#162016;overflow-wrap:break-word}
.bl-prose>:first-child{margin-top:0}
.bl-prose p,.bl-prose ul,.bl-prose ol,.bl-prose dl,.bl-prose blockquote,.bl-prose details{margin:0 0 1.15em}
.bl-prose h2,.bl-prose h3,.bl-prose h4{font-family:var(--bl-display);font-weight:500;color:#101510;scroll-margin-top:24px}
.bl-prose h2{margin:2em 0 .6em;font-size:32px;line-height:1.15;letter-spacing:-.8px}
.bl-prose h3{margin:1.7em 0 .5em;font-size:24px;line-height:1.25;letter-spacing:-.4px}
.bl-prose h4{margin:1.5em 0 .4em;font-size:19px;line-height:1.35}
.bl-prose a{color:#162016;text-decoration:underline;text-decoration-color:var(--vx-deep);text-decoration-thickness:1px;text-underline-offset:3px}
.bl-prose a:hover{color:var(--vx-deep)}
.bl-prose strong{font-weight:600}
.bl-prose ul,.bl-prose ol{padding-left:1.4em}
.bl-prose li+li{margin-top:.35em}
.bl-prose li>p{margin-bottom:.5em}
.bl-prose blockquote{padding:2px 0 2px 22px;border-left:3px solid var(--vx-deep);color:#3c443c}
.bl-prose blockquote>:last-child{margin-bottom:0}
.bl-prose hr{margin:2.4em 0;border:0;border-top:1px solid var(--vx-line)}
.bl-prose code{font-family:var(--bl-mono);font-size:.86em;padding:.12em .36em;border-radius:4px;background:rgba(22,32,22,.07);overflow-wrap:anywhere}
.bl-prose kbd{font-family:var(--bl-mono);font-size:.82em;padding:.1em .4em;border:1px solid var(--vx-line);border-bottom-width:2px;border-radius:4px;background:#f7f6f1}
.bl-prose mark{background:#ffe3a3;color:inherit;padding:0 .15em}
.bl-prose img{max-width:100%;height:auto;vertical-align:middle}
.bl-prose details{padding:12px 16px;border:1px solid var(--vx-line);border-radius:6px}
.bl-prose summary{cursor:pointer;font-weight:600}
.bl-prose input[type='checkbox']{margin:0 .4em 0 0;accent-color:var(--vx-deep)}
.bl-figure{margin:2em 0}
.bl-figure img{display:block;max-width:100%;height:auto;border-radius:6px}
.bl-figure figcaption{margin-top:10px;font-family:var(--bl-mono);font-size:12px;line-height:1.6;letter-spacing:.3px;color:#5c625d}
.bl-anchor{margin-left:.3em;color:var(--vx-deep);text-decoration:none!important;opacity:0;transition:opacity .15s}
.bl-anchor::before{content:'#'}
.bl-prose :is(h2,h3):hover .bl-anchor,.bl-prose :is(h2,h3):focus-within .bl-anchor{opacity:1}
.bl-prose .bl-table{min-width:0}
.bl-prose .vx-table td,.bl-prose .vx-table th{font-size:15px}

/* code: the .vx-editor look */
.bl-code{margin:1.6em 0;padding:20px 22px;background:#0b0d0b;border:1px solid #23271f;border-radius:8px;overflow-x:auto;color:#d7dbd4;font:13px/1.75 var(--bl-mono);tab-size:4}
.bl-prose .bl-code code{display:block;padding:0;background:none;border-radius:0;font:inherit;color:inherit;white-space:pre;overflow-wrap:normal}
.hljs-comment,.hljs-quote{color:#6b7266;font-style:italic}
.hljs-keyword,.hljs-built_in,.hljs-selector-tag{color:#e8eee0}
.hljs-string,.hljs-regexp{color:var(--vx)}
.hljs-number,.hljs-literal{color:#d3b98a}
.hljs-title,.hljs-title.function_{color:#cfd6c8}
.hljs-type,.hljs-title.class_,.hljs-attr,.hljs-property{color:#a9c3d6}
.hljs-meta{color:#767c72}
.hljs-addition{color:#9fd49a}
.hljs-deletion{color:#e8a0a0}

/* article footer, author */
.bl-post-foot{max-width:72ch;margin-top:56px;padding-top:28px;border-top:1px solid var(--vx-line);font-family:var(--bl-sans);font-size:15px;color:#3c443c}
.bl-tags{margin:0 0 24px;font-family:var(--bl-mono);font-size:12px;letter-spacing:.4px;text-transform:uppercase}
.bl-tag{display:inline-block;margin:0 6px 6px 0;padding:3px 10px;border:1px solid var(--vx-line);border-radius:100px;text-transform:none;letter-spacing:.2px}
.bl-author{margin:0 0 28px;padding:22px 24px;background:rgba(22,32,22,.05);border-radius:8px}
.bl-author-h{margin:0 0 8px;font-family:var(--bl-mono);font-size:11.5px;font-weight:400;letter-spacing:1.2px;text-transform:uppercase;color:#5c625d}
.bl-author-name{margin:0;font-family:var(--bl-display);font-size:20px;font-weight:500;color:#162016}
.bl-author-name a{color:inherit;text-decoration:underline;text-decoration-color:var(--vx-deep);text-underline-offset:3px}
.bl-author-job{display:block;margin-top:2px;font-family:var(--bl-sans);font-size:14px;font-weight:400;color:#5c625d}
.bl-author-bio{margin:10px 0 0;line-height:1.6}
.bl-back{margin:0}

/* CTA and related */
.bl-cta{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:28px;padding-block:72px;background:linear-gradient(90deg,#f5a623,#ffd166);color:#101510}
.bl-cta .vx-h2{color:#101510}
.bl-cta-copy p{margin:14px 0 0;font-family:var(--bl-sans);font-size:17px;line-height:1.55}
.bl-actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px}
.bl-cta .vx-pill{background:#101510;color:#fdf4e1}
.bl-cta .vx-pill:hover{background:#2a2414}
.bl-related .vx-h2{margin-bottom:48px}

/* ---- index ---- */
.bl-cards{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:56px 40px}
.bl-card{display:flex;flex-direction:column;gap:18px;height:100%}
.bl-card-cover{display:block}
.bl-card-cover img{display:block;width:100%;height:auto;aspect-ratio:1.91/1;object-fit:cover;border-radius:6px;background:rgba(22,32,22,.08)}
.bl-card-title{margin:0;font-family:var(--bl-display);font-size:24px;font-weight:500;line-height:1.2;letter-spacing:-.5px;overflow-wrap:break-word}
.bl-card-title a{color:inherit;text-decoration:none}
.bl-card-title a:hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}
.bl-card .bl-meta{margin:10px 0 0;font-size:12px}
.bl-card-desc{margin:12px 0 0;font-family:var(--bl-sans);font-size:16px;line-height:1.6;color:var(--vx-muted)}
.vx-paper .bl-card-desc{color:#3c443c}
.vx-paper .bl-card .bl-meta{color:#5c625d}
.bl-pager{display:flex;flex-wrap:wrap;align-items:center;gap:12px 24px;margin-top:72px;padding-top:28px;border-top:1px solid var(--vx-line);font-family:var(--bl-mono);font-size:13px}
.bl-pager ol{display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none}
.bl-pager a{display:inline-block;min-width:24px;padding:8px 10px;text-align:center;color:#162016;text-decoration:none;border-radius:4px}
.bl-pager a:hover{background:rgba(22,32,22,.07)}
.bl-pager a[aria-current]{background:#162016;color:#eeede6}
.bl-pager-step{border:1px solid var(--vx-line)}
.bl-pager-gap{padding:8px 4px;color:#5c625d}
.bl-empty-text{margin:0 0 20px;max-width:60ch;font-family:var(--bl-sans);font-size:19px;line-height:1.55}
.bl-links{margin:0 0 32px;padding:0;list-style:none;font-family:var(--bl-sans);font-size:17px;line-height:1.5}
.bl-links li{padding:14px 0;border-top:1px solid var(--vx-line)}
.bl-links li:last-child{border-bottom:1px solid var(--vx-line)}
.bl-links a{color:#162016;text-decoration:underline;text-decoration-color:var(--vx-deep);text-underline-offset:3px}
.bl-errors{margin:0 0 28px;padding-left:20px;font-family:var(--bl-sans);font-size:16px;line-height:1.6}
.bl-errors li+li{margin-top:10px}
.bl-errors code{font-family:var(--bl-mono);font-size:13px;color:#8b1919}

@media (max-width:1100px){
  .bl .vx-h1{font-size:52px;letter-spacing:-1.8px}
  .bl-body{grid-template-columns:minmax(0,1fr);gap:32px}
  .bl-toc,.bl-main{grid-column:auto;grid-row:auto}
  .bl-toc{position:static;padding:16px 18px;border:1px solid var(--vx-line);border-radius:8px}
  .bl-toc summary{margin-bottom:0}
  .bl-toc details[open] summary{margin-bottom:12px}
  .bl-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:899px){
  .bl .vx-nav{padding-inline:24px}
  .bl-band{padding:56px 24px}
  .bl-hero,.bl-index-hero{padding-block:56px 48px}
  .bl-banner,.bl-warnings{padding-inline:24px}
  .bl .vx-h1{font-size:40px;letter-spacing:-1.4px}
  .bl .vx-h2{font-size:30px;letter-spacing:-1px}
  .bl .vx-lead{font-size:17px}
  .bl-crumbs{flex-wrap:nowrap}
  .bl-crumbs li{flex:none}
  .bl-crumbs li[aria-current]{flex:0 1 auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .bl-cover{margin-top:32px}
  .bl-prose{font-size:17px}
  .bl-prose h2{font-size:26px}
  .bl-prose h3{font-size:21px}
  .bl-code{margin-inline:-24px;border-radius:0;border-inline:0;padding:16px 24px;font-size:12px}
  .bl .vx-table-wrap{margin-inline:-24px;padding-inline:24px}
  .bl-cta{padding-block:48px}
  .bl-pager{margin-top:48px}
}
@media (max-width:699px){
  .bl-cards{grid-template-columns:minmax(0,1fr);gap:44px}
}
@media (prefers-reduced-motion:reduce){
  .bl-anchor{transition:none}
}