.page{min-height:100vh;padding:120px 0 80px}.page__head{max-width:760px;margin-bottom:clamp(32px,5vw,56px)}.page__head h1{font-size:var(--fs-title);letter-spacing:-.02em;font-weight:500;line-height:1.1}.page__head p{color:var(--ink-mute);font-size:var(--fs-lede);margin-top:14px;line-height:1.55}.posts{grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr));gap:clamp(16px,2.4vw,28px);display:grid}.posts__item{border:1px solid var(--line);border-radius:var(--r-lg);background:var(--bg-raised);transition:border-color var(--t-fast), transform .35s var(--ease-out);display:block;overflow:hidden}.posts__item:hover,.posts__item:focus-visible{border-color:var(--accent-line);transform:translateY(-4px)}.posts__item div{padding:28px 26px 30px}.posts__item h2{font-size:20px;font-weight:500}.posts__item p{color:var(--ink-mute);margin-top:6px;line-height:1.55}.article{max-width:760px;padding-inline:var(--gut);margin:0 auto}.article h1,.article h2{letter-spacing:-.01em;margin:2.2em 0 .6em;font-weight:500;line-height:1.2}.article h1{font-size:clamp(26px,3vw,36px)}.article h2{font-size:clamp(22px,2.4vw,28px)}.article h3{color:var(--accent-hover);font-size:var(--fs-body);margin:1.6em 0 .5em;font-weight:600}.article p,.article li{color:var(--ink-mute);font-size:16px;line-height:1.75}.article p{margin:0 0 1em}.article ul{margin:0 0 1.2em;padding-left:1.3em}.article li{margin-bottom:.4em}.article b,.article strong{color:var(--ink);font-weight:600}.article a{color:var(--accent-hover);text-underline-offset:3px;text-decoration:underline}.article img{border-radius:var(--r-md);height:auto;margin:28px auto}.article code{font-family:ui-monospace,SF Mono,Menlo,Consolas,monospace;font-size:.9em}.article :not(pre)>code{background:var(--accent-soft);color:var(--ink);border-radius:6px;padding:2px 6px}.article pre{border:1px solid var(--line);border-radius:var(--r-md);color:#cfd8ea;background:#0a0f1a;padding:20px 22px;font-size:14px;line-height:1.65;overflow-x:auto}.code-snippet{margin-bottom:1.4em;position:relative}.copy-button{border:1px solid var(--line);border-radius:var(--r-pill);background:var(--glass);color:var(--ink-mute);transition:color var(--t-fast), border-color var(--t-fast);padding:5px 12px;font-size:12px;position:absolute;top:10px;right:10px}.copy-button:hover,.copy-button.is-done{border-color:var(--accent-line);color:var(--ink)}.article__toc{border:1px solid var(--line);border-radius:var(--r-md);margin-bottom:2.4em;padding:20px 24px}.article__toc h1{font-size:var(--fs-body);margin:0 0 .6em}.article__toc ul{margin:0;padding:0;list-style:none}.page__back{color:var(--ink-mute);font-size:var(--fs-small);margin-bottom:28px;display:inline-block}.page__back:hover{color:var(--ink)}.article .page__head h1{margin:0}.article__toc a{text-decoration:none}.article__toc a:hover{text-decoration:underline}