.blog-page{padding-top:7rem;padding-bottom:5rem}.blog-breadcrumbs{color:rgb(var(--color-text-secondary));margin-bottom:2rem;font-size:.875rem}.blog-breadcrumbs ol{flex-wrap:wrap;gap:.5rem;display:flex}.blog-breadcrumbs li+li:before{content:"/";margin-right:.5rem}.blog-breadcrumbs a:hover,.blog-languages a:hover{text-decoration:underline}.blog-masthead{grid-template-columns:1fr 1.1fr;align-items:center;gap:3rem;margin-bottom:5rem;display:grid}.blog-masthead h1,.blog-article-head h1{color:rgb(var(--color-primary));letter-spacing:-.04em;text-wrap:balance;font-size:clamp(2.25rem,4.6vw,3.8rem);font-weight:600;line-height:1.12}.blog-masthead p,.blog-deck{color:rgb(var(--color-text-primary));margin-top:1.5rem;font-size:1.15rem;line-height:1.8}.blog-masthead figure img{aspect-ratio:4/3;-o-object-fit:cover;object-fit:cover;border-radius:1rem;width:100%}.blog-credit{color:rgb(var(--color-text-secondary));margin-top:.5rem;font-size:.8125rem;line-height:1.6}.blog-credit a{text-underline-offset:3px;text-decoration:underline}.blog-languages{flex-wrap:wrap;gap:.5rem 1rem;margin-top:1.5rem;font-size:.875rem;display:flex}.blog-languages span{color:rgb(var(--color-text-secondary))}.blog-languages a{padding-bottom:.25rem}.blog-languages [aria-current]{color:rgb(var(--color-primary));text-underline-offset:5px;font-weight:600;text-decoration:underline}.blog-stories{gap:3.5rem;display:grid}.blog-story{grid-template-columns:.8fr 1.2fr;align-items:center;gap:3rem;display:grid}.blog-story img{aspect-ratio:3/2;-o-object-fit:cover;object-fit:cover;border-radius:1rem;width:100%}.blog-meta{color:rgb(var(--color-text-secondary));font-size:.875rem;line-height:1.9}.blog-story h2{color:rgb(var(--color-primary));letter-spacing:-.025em;margin:.5rem 0 1rem;font-size:clamp(1.5rem,3vw,2rem);font-weight:600;line-height:1.25}.blog-story h2 a:hover,.blog-related a:hover h3{text-underline-offset:4px;text-decoration:underline}.blog-story p:not(.blog-meta){color:rgb(var(--color-text-primary));margin-bottom:1rem;line-height:1.8}.blog-read{color:rgb(var(--color-ocean));align-items:center;gap:1rem;min-height:44px;margin-top:1rem;font-weight:600;display:inline-flex}.blog-article-head{max-width:50rem;margin:0 auto 2.5rem}.blog-article-head h1{margin:.75rem 0}.blog-article-head .blog-meta{margin-top:1.25rem}.blog-cover{margin-bottom:3.5rem}.blog-cover img{-o-object-fit:cover;object-fit:cover;border-radius:1rem;width:100%;max-height:30rem}.blog-reading-grid{grid-template-columns:260px minmax(0,1fr);align-items:start;gap:3.5rem;display:grid}.blog-reading-grid>aside{position:sticky;top:6rem}.blog-toc{overscroll-behavior:contain;background:rgb(var(--color-secondary));border-radius:1rem;max-height:calc(100dvh - 8rem);padding:1.5rem;overflow-y:auto}.blog-toc h2{font-size:1rem;font-weight:600}.blog-toc ul{margin-top:.75rem}.blog-toc a{color:rgb(var(--color-text-secondary));padding:.5rem 0;font-size:.875rem;line-height:1.6;display:block}.blog-toc a:hover{color:rgb(var(--color-primary));text-decoration:underline}.blog-body{overflow-wrap:anywhere;width:100%;min-width:0;max-width:46rem;font-size:1.0625rem;line-height:1.9}.blog-body h2,.blog-related>h2{letter-spacing:-.025em;color:rgb(var(--color-primary));margin:3rem 0 1rem;scroll-margin-top:6rem;font-size:clamp(1.5rem,3vw,2rem);font-weight:600;line-height:1.3}.blog-body>h2:first-child{margin-top:0}.blog-body p,.blog-body ul,.blog-body ol{margin:1rem 0}.blog-body ul{padding-left:1.5rem;list-style:outside}.blog-body ol{padding-left:1.5rem;list-style:decimal}.blog-body a{color:rgb(var(--color-ocean));text-underline-offset:4px;text-decoration:underline}.blog-table{margin:1.5rem 0;overflow-x:auto}.blog-table table{table-layout:fixed;text-align:start;width:100%;font-size:1rem;line-height:1.65}.blog-table th,.blog-table td{vertical-align:top;padding:1rem}.blog-table th{background:rgb(var(--color-secondary))}.blog-table tbody tr:nth-child(2n){background:rgb(var(--color-secondary) / .5)}.blog-body details{background:rgb(var(--color-secondary));border-radius:.75rem;margin:.75rem 0;padding:1rem 1.25rem}.blog-body summary{cursor:pointer;font-weight:600}.blog-body section{scroll-margin-top:6rem}.blog-examples{gap:1.5rem;margin-top:1.5rem;display:grid}.blog-examples img{-o-object-fit:cover;object-fit:cover;border-radius:.75rem;width:100%;max-height:25rem}.blog-related{margin-top:4rem}.blog-related>div{grid-template-columns:1fr 1fr;gap:2rem;margin-top:1.5rem;display:grid}.blog-related a{background:rgb(var(--color-secondary));border-radius:1rem;padding:2rem}.blog-related span{color:rgb(var(--color-text-secondary));font-size:.875rem}.blog-related h3{color:rgb(var(--color-primary));margin:.75rem 0 1.5rem;font-size:1.5rem;font-weight:600;line-height:1.4}.blog-play{background:rgb(var(--color-primary));color:rgb(var(--color-surface));border-radius:1rem;justify-content:space-between;align-items:center;gap:2rem;margin-top:5rem;padding:2.5rem;display:flex}.blog-play h2{font-size:2rem;font-weight:600;line-height:1.25}.blog-play p{max-width:36rem;margin-top:.75rem;line-height:1.7}.blog-play a{background:rgb(var(--color-surface));color:rgb(var(--color-primary));border-radius:.75rem;flex-shrink:0;padding:.875rem 1.25rem;font-weight:600}@media (max-width:900px){.blog-reading-grid{grid-template-columns:210px minmax(0,1fr);gap:2rem}.blog-masthead,.blog-story{gap:2rem}}@media (max-width:700px){.blog-page{padding-top:6rem;padding-bottom:3rem}.blog-masthead,.blog-story,.blog-reading-grid,.blog-related>div{grid-template-columns:minmax(0,1fr);gap:1.5rem}.blog-masthead{margin-bottom:3rem}.blog-masthead figure{margin-top:.5rem}.blog-story{gap:1rem}.blog-stories{gap:3rem}.blog-reading-grid>aside{position:static}.blog-toc{max-height:none;overflow:visible}.blog-toc ul{-moz-columns:2;columns:2;-moz-column-gap:1.5rem;column-gap:1.5rem}.blog-toc li{-moz-column-break-inside:avoid;break-inside:avoid}.blog-cover{margin-bottom:2rem}.blog-cover img{aspect-ratio:4/3}.blog-body h2{margin-top:2.5rem}.blog-play{flex-direction:column;align-items:flex-start;margin-top:3rem;padding:1.5rem}.blog-play h2{font-size:1.75rem}.blog-related a{padding:1.5rem}}@media (prefers-reduced-motion:no-preference){.blog-masthead h1,.blog-masthead p,.blog-masthead .blog-languages,.blog-masthead figure,.blog-story figure,.blog-story h2,.blog-story p,.blog-story .blog-read,.blog-article-head h1,.blog-article-head p,.blog-article-head nav,.blog-cover{animation:.7s ease-out both blog-arrive}.blog-masthead p,.blog-story p{animation-delay:80ms}.blog-masthead figure,.blog-story figure{animation-delay:.14s}.blog-read,.blog-play a{transition:transform .18s}.blog-read:hover,.blog-play a:hover{transform:translateY(-2px)}.blog-read:active,.blog-play a:active{transform:translateY(1px)}}@keyframes blog-arrive{0%{opacity:.8;transform:translateY(16px)}to{opacity:1;transform:none}}.blog-page picture{display:block}.blog-inline-image{margin:2rem 0}.blog-inline-image img{-o-object-fit:contain;object-fit:contain;border-radius:.75rem;width:100%;height:auto;max-height:34rem}.blog-caption{color:rgb(var(--color-text-primary));margin-top:.75rem;font-size:1rem;line-height:1.7}@media (prefers-reduced-motion:no-preference){@supports (animation-timeline:view()){.blog-body>h2,.blog-inline-image{animation:linear both blog-arrive;animation-timeline:view();animation-range:entry entry 35%}}}
