.blog-post{display:grid;gap:var(--size10);grid-template-areas:"byline header" "byline post";justify-content:space-between;margin:0 auto;max-width:var(--page-width);padding-inline:var(--page-width-padding-inline);padding-top:var(--size12);row-gap:0}.blog-post>header{grid-area:header}.blog-post>article{grid-area:post;max-width:50rem}.blog-post article h2{font-weight:700;margin:var(--size15) 0 var(--size7)}.blog-post article h3{color:var(--color-eggplant);font-size:var(--font-xl)}.blog-post article li,.blog-post article p{font-size:var(--font-md);font-weight:400}.blog-post article img{max-width:100%}.blog-post article pre{background:var(--color-surface);border:1px solid var(--color-border);font-family:var(--font-family-code);line-height:1.2;margin-bottom:var(--size3);margin-top:calc(var(--size3) * -1);max-height:24rem;max-width:calc(100vw - var(--page-width-padding-inline) * 2);overflow:auto;padding:var(--size1) var(--size2)}.blog-post article pre.wrap{white-space:pre-wrap}.blog-post article pre code{font-size:var(--font-xs)}.blog-post article li pre{margin-top:var(--size2)}.blog-post .byline{color:var(--color-text);display:flex;font-size:var(--font-sm);gap:var(--size2);grid-area:byline;margin:var(--size2) 0}.blog-post .author a{color:inherit;text-decoration:none}.blog-post .author a:hover{text-decoration:underline}.blog-post .author .photo{background-color:var(--color-border);border-radius:var(--radius-round);height:var(--size13);width:var(--size13)}.blog-post figure{margin:var(--size4) 0 var(--size8)}.blog-post figcaption{margin-top:var(--size3)}.blog-post .image-group{display:flex;gap:var(--size8)}.blog-post .image-group img{width:50%}.blog-post .image-frame{align-items:center;background-color:var(--color-surface);border-radius:var(--radius-md);box-shadow:var(--elevation-chart-tile);display:flex;flex-wrap:wrap;justify-content:center;margin-bottom:var(--size2);padding:var(--size4)}.blog-post .image-frame img{max-width:100%}.blog-post .image-frame p{color:var(--color-text4);font-size:var(--font-sm);font-style:italic;line-height:1;margin:0;padding-top:var(--size1);text-align:center}.blog-post .image-frame.nopadding{overflow:hidden;padding:0}.blog-post .image-frame.nopadding img{border-radius:var(--radius-md);width:100%}.blog-post .image-frame:has(iframe){padding:var(--size2)}.blog-post .image-frame iframe,.blog-post .image-frame figure.video{aspect-ratio:16 / 9;height:100%;overflow:hidden;width:100%}.blog-post .image-frame figure.video{margin:0}.blog-post .image-frame.v16-8 iframe{aspect-ratio:16 / 8.25}.blog-post blockquote.pull{background:var(--color-surface);border:var(--border);font-size:var(--font-xxl);line-height:1.5;padding:var(--size6) var(--size8);text-align:center;text-wrap:pretty}@media screen and (width <= 37.5rem){.blog-post blockquote.pull{margin-inline:0}}.blog-post blockquote.pull.medium{font-size:var(--font-xl);padding:var(--size4) var(--size6);text-align:left}.blog-post blockquote.pull.medium:not(:has(cite)){font-size:var(--font-xxl);text-align:center;text-wrap:pretty}.blog-post blockquote.pull.small{font-size:var(--font-md);padding:var(--size4) var(--size6);text-align:left}.blog-post blockquote.pull.small cite{font-size:var(--font-sm)}.blog-post blockquote.pull cite{color:var(--color-text4);display:block;font-size:var(--font-lg);font-style:normal;padding-top:var(--size2);text-align:right}.blog-post blockquote.pull cite:before{content:"– "}.blog-post .recommendation{background:var(--color-surface);border:var(--border);font-size:var(--font-xxl);line-height:1.5;padding:var(--size6) var(--size8);text-align:center}.blog-post .recommendation h4{margin-top:0;text-align:center}.blog-post .recommendation p{margin:0;text-wrap:pretty}.blog-post .recommendation p.note{font-size:var(--font-sm);margin-top:var(--size4);text-align:left;text-wrap:unset}.blog-post h2+h3{margin-top:0}.blog-post .check{color:var(--color);margin-right:var(--size3);padding-right:var(--size3);width:var(--size12)}.blog-post code{color:var(--color-blueberry);font-size:smaller;font-weight:500}.blog-post a.anchor{color:inherit;font-size:smaller;font-weight:400;opacity:.33;scroll-margin-top:5rem;text-decoration:none}.blog-post a.anchor:hover{opacity:.87}.blog-post table{border-collapse:collapse;font-size:var(--font-sm);margin-bottom:var(--size4);table-layout:fixed;width:100%}.blog-post table.copy,.blog-post table.result{border:1px solid var(--color-border)}.blog-post table.copy td,.blog-post table.copy th,.blog-post table.result td,.blog-post table.result th{border-bottom:1px solid var(--color-border);font-size:var(--font-sm);padding:var(--size2);vertical-align:top}.blog-post table.copy th+th,.blog-post table.copy td+td,.blog-post table.result th+th,.blog-post table.result td+td{border-left:1px solid var(--color-border)}.blog-post table.copy th,.blog-post table.result th{font-weight:700}.blog-post td,.blog-post th{border:1px solid rgb(174 193 204);border-collapse:collapse;min-width:48px;padding:10px 12px;position:relative;vertical-align:top}.blog-post tr{border:1px solid rgb(174 193 204)}.blog-post thead th{border-bottom:var(--border)}.blog-post div.image-frame+table{margin-top:2.5rem}.blog-post .image-frame+.image-frame{margin-top:var(--size6)}.blog-post table.copy td:has(ul){padding:var(--size1)}.blog-post table.copy li{font-size:var(--font-sm)}.blog-post table.result td,.blog-post table.result th{font-family:var(--font-family-code);font-size:var(--font-sm)}.blog-post table.result td{word-break:break-word}.blog-post table.checklist td{font-size:var(--font-lg);font-weight:300;line-height:1.5;padding:var(--size2) 0;text-wrap:pretty;vertical-align:top}.blog-post .table-overflow{background:var(--color-surface);border-right:1px solid var(--color-border);margin-bottom:var(--size4);max-width:calc(100vw - var(--page-width-padding-inline) * 2);overflow:auto}.blog-post .table-overflow table{margin-bottom:0}.blog-post table.nowrap td,.blog-post table.nowrap th{font-family:var(--font-family-code);font-size:var(--font-sm);white-space:nowrap}.blog-post pre.sql{color:var(--color-sage-dark);font-size:var(--font-sm);font-weight:500;line-height:1.25}.blog-post .admonition{border:1px solid var(--color-border);font-size:var(--font-sm);margin-block:var(--size4);padding:var(--size3)}.image-centered{display:flex;margin-bottom:1em;place-content:center}@media screen and (width < 900px){.blog-post{grid-template-areas:"header" "byline" "post"}}
