:root{--blog-mono: "STK Bureau Sans Mono", var(--mono);--blog-label: 13px / 20px var(--blog-mono);--blog-code: 13px / 22px var(--blog-mono);--blog-text: 15px / 1.7 var(--blog-mono);--blog-title: 400 clamp(28px, 2.8vw, 36px) / 1.15 var(--blog-mono);--blog-heading: 500 18px / 1.4 var(--blog-mono);--blog-card: 500 16px / 1.4 var(--blog-mono);--blog-block: 20px;--blog-section: 56px}.blog-index .hash,.blog-post .hash{color:var(--faint);font-family:var(--blog-mono);font-weight:400}:is(.blog-head h1,.blog-post main>h1) .hash{font-size:.6em;letter-spacing:0}.blog-index{font-family:var(--blog-mono)}.blog-post main{font:var(--blog-text)}.blog-index [hidden]{display:none}.blog-head{display:flex;flex-wrap:wrap;align-items:end;justify-content:space-between;gap:24px 40px;padding:104px var(--inset) 64px}.blog-head h1{margin:0;color:var(--fg);font:var(--blog-title);letter-spacing:-.02em}.blog-head p{max-width:360px;margin:0;color:var(--soft);font:var(--blog-text)}.blog-index [data-rule]{position:relative}.blog-index [data-rule]:after{content:"";position:absolute;bottom:0;left:calc(50% - 50vw);width:100vw;height:1px;background:var(--rule);pointer-events:none}.blog-filter{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,416px);align-items:center;gap:16px 40px;padding:32px var(--inset);font:var(--blog-label)}#blog-more{grid-column:1 / -1}.blog-tags{display:flex;flex-wrap:wrap;gap:0 16px}.blog-tag{padding:10px 0;background:none;color:var(--muted);transition:transform var(--duration-hover) var(--ease-quart)}.blog-tag:hover,.blog-tag[aria-pressed=true],.blog-tag[aria-expanded=true]{color:var(--fg)}.blog-tag[aria-pressed=true] [aria-hidden]{color:var(--faint)}.blog-tag[aria-pressed=true] span:not([aria-hidden]){text-decoration:underline 1px;text-underline-offset:4px}.blog-tag:active{transform:scale(.98)}.blog-search{display:flex;align-items:center;gap:12px;min-width:0;box-shadow:inset 0 -1px 0 var(--rail);color:var(--muted)}.blog-search:focus-within{box-shadow:inset 0 -1px 0 var(--fg)}.blog-search svg{flex:none;width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round}.blog-search input{flex:1;min-width:0;padding:10px 0;border:0;border-radius:0;background:none;color:var(--fg);font:inherit;outline:none;appearance:none}.blog-search input::placeholder{color:var(--faint)}.blog-search input::-webkit-search-cancel-button,.blog-search input::-webkit-search-decoration{appearance:none}.blog-search button{display:grid;flex:none;place-items:center;width:32px;height:32px;margin-right:-8px;background:none;color:var(--muted);transition:transform var(--duration-hover) var(--ease-quart)}.blog-search button:hover{color:var(--fg)}.blog-search button:active{transform:scale(.98)}:is(.blog-tag,.blog-search button,.blog-empty button):focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:var(--radius-sm)}.blog-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:48px 80px;margin:0;padding:48px var(--inset) 0;list-style:none}.blog-grid>li{position:relative;display:flex;flex-direction:column;gap:10px;min-width:0;min-height:168px}.blog-grid>li:before{content:"";position:absolute;top:0;right:-40px;bottom:0;display:none;width:1px;background:var(--rule);pointer-events:none}.blog-grid>li:not(:nth-child(3n of:not([hidden]))):before{display:block}.blog-grid h2,.blog-grid .excerpt{display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2}.blog-grid h2{margin:0;color:var(--fg);font:var(--blog-card);letter-spacing:-.01em;text-wrap:balance}.blog-grid .excerpt{margin:0;color:var(--soft);font:var(--blog-text);-webkit-line-clamp:3}.blog-grid .meta{margin:auto 0 0;padding-top:16px;color:var(--muted);font:var(--blog-label)}.blog-grid a:after{content:"";position:absolute;inset:0}.blog-grid a:hover h2{text-decoration:underline 1px;text-underline-offset:4px}.blog-grid a:focus-visible{outline:none}.blog-grid a:focus-visible:after{outline:2px solid var(--accent);outline-offset:8px;border-radius:var(--radius-sm)}.blog-empty{padding:48px var(--inset) 0;color:var(--soft);font:var(--blog-label)}.blog-empty p{margin:0 0 16px;overflow-wrap:anywhere}.blog-empty button{padding:0;background:none;color:var(--fg);text-decoration:underline 1px var(--rail);text-underline-offset:4px}.blog-empty button:hover{text-decoration-color:currentColor}.blog-end{display:flex;justify-content:center;padding:80px var(--inset) 120px;color:var(--muted);font:var(--blog-label)}.blog-end p{margin:0;padding:10px 0}.blog-post main>:is(.crumbs,h1,.updated){grid-column:1 / -1;align-self:auto;max-width:none;margin:0}.blog-post main>.crumbs{display:flex;grid-row:1;gap:8px;padding:104px var(--inset) 0;color:var(--muted);font:var(--blog-label)}.blog-post main>h1{grid-row:2;max-width:22em;padding:20px var(--inset) 0;font:var(--blog-title);letter-spacing:-.02em;white-space:normal;text-wrap:balance}.blog-post main>.updated{grid-row:3;padding:16px var(--inset) 64px;font:var(--blog-label)}.blog-post main:after{grid-area:3 / 1 / 4 / -1}@media(min-width:1025px){.blog-post main>.toc,.blog-post main:before{grid-area:4 / 1 / span 300}.blog-post main:not(:has(>.toc)):before{display:none}}:is(.crumbs,.post-foot) :is(a,button){padding:0;background:none;color:var(--soft);text-decoration:none;transition:transform var(--duration-hover) var(--ease-quart)}:is(.crumbs,.post-foot) :is(a,button):hover{color:var(--fg)}:is(.crumbs,.post-foot) :is(a,button):active{transform:scale(.98)}:is(.crumbs,.post-foot) :is(a,button):focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:2px}.blog-post .toc .sub{counter-increment:none}.blog-post .toc .sub a:before{content:""}.blog-post main>:is(p,ul,ol,figure,pre,blockquote,.table){margin-block:0 var(--blog-block)}.blog-post main>.updated+:not(.toc){margin-top:64px}@media(min-width:1025px){.blog-post main>.toc+*{margin-top:64px}}.blog-post main>:is(h1,h2,h3,p,ul,ol,figure,blockquote){overflow-wrap:anywhere}.blog-post main>:is(h2,h3){margin-block:var(--blog-section) var(--blog-block);padding:0;border:0;color:var(--fg);font:var(--blog-heading);letter-spacing:-.01em}.blog-post main>h3{font-size:16px}.blog-post main>ul{padding:0;list-style:none}.blog-post main>ol{padding-left:24px}.blog-post main code{color:var(--fg);font-family:var(--blog-mono);font-size:.875em}.blog-post figure p{margin:0;color:var(--soft)}.blog-post figcaption{margin-top:12px;color:var(--muted)}.blog-post blockquote{color:var(--muted);white-space:pre-wrap}.blog-post pre{max-height:640px;padding-bottom:12px;overflow:auto;color:var(--fg);font:var(--blog-code);scrollbar-width:thin}.blog-post pre code{font-size:inherit}.blog-post .table{overflow-x:auto;scrollbar-width:thin}.blog-post .table table{width:100%;border-collapse:collapse;font-size:14px;line-height:1.5}.blog-post .table th{padding:0 16px 10px 0;box-shadow:inset 0 -1px 0 var(--rule);color:var(--muted);font:var(--blog-label);text-align:left;vertical-align:bottom}.blog-post .table td{padding:12px 16px 12px 0;box-shadow:inset 0 -1px 0 var(--rule);color:var(--soft);vertical-align:top}.blog-post .table td:first-child{color:var(--fg)}.blog-post main>.post-foot{margin-top:var(--blog-section);padding-top:var(--blog-block);border-top:1px solid var(--rule);font:var(--blog-label)}.read-next{margin-bottom:32px}.read-next h2{margin:0 0 8px;padding:0;border:0;color:var(--muted);font:var(--blog-label);letter-spacing:0}.read-next ul{margin:0;padding:0;list-style:none}.read-next li{display:grid;gap:4px;margin:0;padding:14px 0;box-shadow:inset 0 -1px 0 var(--rule)}.read-next a{color:var(--fg);font:var(--blog-card);text-decoration:none}.read-next a:hover{text-decoration:underline 1px var(--rail);text-underline-offset:3px}.read-next span{display:-webkit-box;overflow:hidden;color:var(--soft);font:var(--blog-text);-webkit-box-orient:vertical;-webkit-line-clamp:2}.post-foot p{display:grid;grid-template-columns:64px minmax(0,1fr);gap:12px;margin:0 0 8px}.post-foot p>span:last-child{display:flex;flex-wrap:wrap;gap:4px 12px}.post-foot .label{color:var(--muted)}@media(max-width:1024px){.blog-filter{grid-template-columns:minmax(0,1fr)}.blog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.blog-grid>li:not(:nth-child(3n of:not([hidden]))):before{display:none}.blog-grid>li:not(:nth-child(2n of:not([hidden]))):before{display:block}.blog-post main>.crumbs{padding-top:88px}.blog-post main>.updated+.toc{margin-top:0;border-top:0}}@media(max-width:800px){.blog-head{padding-block:64px 40px}.blog-post main>.crumbs{padding-top:64px}.blog-post main>.updated{padding-bottom:40px}}@media(max-width:640px){.blog-grid{grid-template-columns:minmax(0,1fr);gap:40px}.blog-grid>li{min-height:0}.blog-grid>li:not(:nth-child(2n of:not([hidden]))):before{display:none}}.blog-post main>*{animation:none}@media(prefers-reduced-motion:reduce){.blog-tag,.blog-search button,:is(.crumbs,.post-foot) :is(a,button){transition:none}}
