.blog-site{min-height:100vh}.blog-index,.blog-article-wrap{width:min(1200px,88%);margin:0 auto;padding:64px 0 80px}.blog-site main :where(h1,h2,h3,h4,p,a,li){letter-spacing:0;overflow-wrap:anywhere}.blog-site main a{color:var(--teal-soft);text-underline-offset:4px}.blog-site main a:focus-visible,.blog-site summary:focus-visible{outline:2px solid var(--teal);outline-offset:5px}.blog-heading{border-bottom:1px solid var(--border);justify-content:space-between;align-items:end;gap:24px;margin-bottom:36px;padding-bottom:36px;display:flex}.blog-label{font:12px var(--mono);color:var(--teal);margin-bottom:16px}.blog-heading h1{font:600 40px/1.2 var(--display);margin-bottom:18px}.blog-heading p:not(.blog-label){color:var(--text-dim);font-size:17px;line-height:1.6}.blog-feed{font:13px var(--mono);flex-shrink:0;padding:10px 0}.blog-grid{grid-template-columns:minmax(0,1fr);display:grid}.blog-card{border-bottom:1px solid var(--border);grid-template-columns:minmax(0,1fr);align-items:start;gap:0 36px;min-width:0;padding:28px 0;display:grid}.blog-card:first-child{padding-top:0}.blog-card:has(.blog-card-image){grid-template-columns:minmax(0,1fr) 260px}.blog-card>:not(.blog-card-image){grid-column:1}.blog-card-image{aspect-ratio:16/9;background:var(--bg-1);border-radius:6px;grid-area:1/2/5;width:100%;overflow:hidden}.blog-card-image img{object-fit:cover;width:100%;height:100%;transition:transform .2s;display:block}.blog-card-image:hover img{transform:scale(1.025)}.blog-card time,.blog-byline{font:12px/1.6 var(--mono);color:var(--text-dim)}.blog-card h2{font:500 19px/1.5 var(--display);margin:12px 0}.blog-card h2 a{color:var(--text);text-decoration:none}.blog-card h2 a:hover{color:var(--teal)}.blog-card p{max-width:760px;color:var(--text-dim);padding-bottom:16px;font-size:15px;line-height:1.75}.blog-read{justify-self:start;font-size:14px;text-decoration:none}.blog-read span{margin-left:8px}.blog-empty{color:var(--text-dim);padding:36px 0 100px}.blog-pagination,.blog-post-navigation{border:0;border-top:1px solid var(--border);grid-template-columns:1fr auto 1fr;align-items:start;gap:20px;margin-top:40px;padding:24px 0;font-size:14px;display:grid}.blog-pagination>:last-child{text-align:right}.blog-pagination>span{color:var(--text-dim)}.blog-article-wrap{max-width:1100px}.blog-back{margin-bottom:40px;font-size:14px;display:inline-block}.blog-article-heading{max-width:880px;margin-bottom:36px}.blog-article-heading h1{font:600 36px/1.35 var(--display);margin-bottom:24px}.blog-byline{flex-wrap:wrap;gap:12px 24px;display:flex}.blog-hero-image{aspect-ratio:16/9;background:var(--bg-1);border-radius:6px;width:100%;margin-bottom:40px;overflow:hidden}.blog-hero-image img{object-fit:cover;width:100%;height:100%;display:block}.blog-reading-layout{align-items:start;gap:48px;display:flex}.blog-toc{border-left:1px solid var(--border);flex:0 0 220px;max-height:calc(100vh - 140px);padding-left:20px;font-size:13px;line-height:1.7;position:sticky;top:110px;overflow-y:auto}.blog-toc summary{font:12px var(--mono);color:var(--text-dim);cursor:pointer;margin-bottom:14px}.blog-toc ul{list-style:none}.blog-toc li+li{margin-top:10px}.blog-toc a{text-decoration:none}.blog-prose{min-width:0;max-width:760px;color:var(--text);flex:1;font-size:17px;line-height:1.85}.blog-prose :where(h1,h2,h3,h4){font-family:var(--display);margin:32px 0 16px;scroll-margin-top:160px;font-weight:500;line-height:1.5}.blog-prose :where(h1,h2){font-size:25px}.blog-prose h3{font-size:20px}.blog-prose h4{font-size:18px}.blog-prose>:first-child{margin-top:0}.blog-prose :where(p,ul,ol,pre,blockquote,figure,table){margin-bottom:24px}.blog-prose :where(ul,ol){padding-left:24px}.blog-prose li+li{margin-top:8px}.blog-prose li::marker{color:var(--teal)}.blog-prose :where(img,video){border-radius:4px;max-width:100%;height:auto}.blog-prose figcaption{color:var(--text-dim);font-size:13px}.blog-prose code{font:.85em var(--mono);background:var(--bg-1);border-radius:3px;padding:2px 5px}.blog-prose pre{background:var(--bg-1);border:1px solid var(--border);border-radius:6px;max-width:100%;padding:20px;line-height:1.7;overflow:auto}.blog-prose pre code{padding:0}.blog-prose blockquote{border-left:3px solid var(--teal);color:var(--text-dim);padding:4px 0 4px 24px}.blog-prose blockquote p:last-child{margin-bottom:0}.blog-prose table{border-collapse:collapse;max-width:100%;font-size:14px;display:block;overflow-x:auto}.blog-prose :where(th,td){border:1px solid var(--border);text-align:left;padding:12px 16px}.blog-prose hr{border:0;border-top:1px solid var(--border);margin:32px 0}.blog-post-navigation{grid-template-columns:repeat(2,minmax(0,1fr))}.blog-post-navigation a{line-height:1.6;text-decoration:none;display:block}.blog-post-navigation span{font:12px var(--mono);color:var(--text-dim);margin-bottom:10px;display:block}.blog-post-navigation>:last-child{text-align:right}.blog-error h1{font:500 28px/1.5 var(--display)}.blog-error p{color:var(--text-dim);margin:20px 0 28px}@media (max-width:1000px){.blog-card:has(.blog-card-image){grid-template-columns:minmax(0,1fr) 200px;gap:0 24px}.blog-reading-layout{flex-direction:column;gap:28px}.blog-toc{flex-basis:auto;width:100%;max-height:none;position:static}.blog-prose{max-width:100%}}@media (max-width:600px){.blog-index,.blog-article-wrap{padding:36px 0 48px}.blog-heading{flex-direction:column;align-items:start;gap:14px;margin-bottom:28px;padding-bottom:24px}.blog-heading h1{font-size:28px}:is(.blog-card,.blog-card:has(.blog-card-image)){grid-template-columns:minmax(0,1fr)}.blog-card-image{grid-area:auto/1;margin-bottom:20px}.blog-card h2{font-size:18px}.blog-article-heading h1{font-size:26px}.blog-back{margin-bottom:28px}.blog-prose{font-size:16px}.blog-prose :where(h1,h2){font-size:22px}.blog-pagination{grid-template-columns:1fr 1fr;gap:16px}.blog-pagination>span:nth-child(2){grid-area:1/1/auto/-1}.blog-post-navigation{gap:20px}}@media (prefers-reduced-motion:reduce){.blog-card-image img{transition:none}}
