.page-head{padding:150px 0 0}.page-head h1{letter-spacing:-.045em;max-width:14ch;font-size:clamp(44px,7vw,100px);line-height:.98}.page-head h1 em{color:var(--accent)}.feature{grid-template-columns:minmax(0,6fr) minmax(0,5fr);align-items:center;gap:56px;margin-top:clamp(56px,7vw,88px);display:grid}.feature-cover{aspect-ratio:16/10;background:var(--line);border-radius:8px;display:block;position:relative;overflow:hidden}.js .reveal .feature-cover img,.js .reveal .card-cover img{transform:scale(1.06)}.feature-cover img,.card-cover img{object-fit:cover;filter:grayscale()contrast(1.04);width:100%;height:100%;transition:transform 1.2s var(--ease), filter .7s var(--ease)}.js .reveal.in .feature-cover img,.js .reveal.in .card-cover img{transform:none}.feature:hover .feature-cover img,.card:hover .card-cover img{filter:grayscale(0);transform:scale(1.04)}.feature-body h2{letter-spacing:-.035em;font-size:clamp(30px,3.6vw,50px);transition:color .3s}.feature-body a:hover h2{color:var(--accent)}.feature-body p{max-width:48ch;color:var(--muted);margin:18px 0 0}.feature-more{border-bottom:1px solid var(--faint);align-items:center;gap:10px;margin-top:28px;padding-bottom:3px;font-size:15px;font-weight:500;transition:border-color .3s;display:inline-flex}.feature-more:hover{border-color:var(--ink)}.feature-more .arrow{transition:transform .4s var(--ease)}.feature-more:hover .arrow{transform:translate(4px)}.post-meta{font-family:var(--mono);text-transform:uppercase;letter-spacing:.07em;color:var(--muted);flex-wrap:wrap;align-items:center;gap:10px;margin:0 0 16px;font-size:12px;display:flex}.post-meta .dot{background:var(--faint);border-radius:50%;width:3px;height:3px}.posts{padding-bottom:40px}main>.posts:first-child{padding-top:150px}.post-grid{border-top:1px solid var(--ink);grid-template-columns:repeat(3,minmax(0,1fr));gap:8px 32px;margin:clamp(56px,7vw,88px) 0 0;padding:0;list-style:none;display:grid}.card{border-bottom:1px solid var(--line);flex-direction:column;padding:32px 0;display:flex}.card-cover{aspect-ratio:16/10;background:var(--line);border-radius:6px;margin-bottom:22px;display:block;overflow:hidden}.card-cover.is-blank,.feature-cover.is-blank{background:var(--surface);border:1px solid var(--line);color:var(--faint);place-items:center;display:grid}.card-cover.is-blank{font-size:30px}.feature-cover.is-blank{font-size:52px}.card h2{letter-spacing:-.025em;font-size:clamp(21px,1.9vw,26px);line-height:1.2;transition:color .3s}.card a:hover h2{color:var(--accent)}.card p{color:var(--muted);margin:12px 0 0;font-size:15.5px;line-height:1.6}.card .tags{margin-top:20px;padding-top:0}.card .tags li{padding:4px 11px;font-size:12.5px}.card-spacer{flex:1}.pager{justify-content:space-between;align-items:center;gap:24px;margin-top:clamp(48px,6vw,72px);display:flex}.pager-pages{flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none;display:flex}.pager-pages a,.pager-pages span{border:1px solid var(--line);min-width:40px;height:40px;font-family:var(--mono);color:var(--muted);border-radius:999px;place-items:center;padding:0 12px;font-size:13px;transition:border-color .3s,background .3s,color .3s;display:grid}.pager-pages a:hover{border-color:var(--ink);color:var(--ink)}.pager-pages [aria-current=page]{background:var(--ink);border-color:var(--ink);color:var(--bg)}.pager-pages .gap{border-color:#0000}.pager .btn-line[aria-disabled=true]{opacity:.35;pointer-events:none}.pager [rel=prev]:hover .arrow{transform:translate(-4px)}.empty{border:1px dashed var(--faint);text-align:center;color:var(--muted);border-radius:8px;margin:clamp(56px,7vw,88px) 0 0;padding:64px 32px}.empty strong{font-family:var(--serif);color:var(--ink);margin-bottom:8px;font-size:28px;font-style:italic;font-weight:400;display:block}.article{padding:132px 0 clamp(56px,7vw,80px)}.article-head{max-width:820px;margin:0 auto}.back{font-family:var(--mono);text-transform:uppercase;letter-spacing:.08em;color:var(--muted);align-items:center;gap:8px;margin-bottom:36px;font-size:12px;transition:color .3s;display:inline-flex}.back:hover{color:var(--ink)}.back span{transition:transform .4s var(--ease)}.back:hover span{transform:translate(-4px)}.article-head h1{letter-spacing:-.04em;font-size:clamp(36px,5.4vw,66px);line-height:1.04}.article-lead{color:var(--ink-soft);margin:24px 0 0;font-size:clamp(19px,2vw,23px);line-height:1.5}.article-head .tags{margin-top:28px}.article-cover{border:1px solid var(--line);background:var(--surface);border-radius:8px;place-items:center;max-width:1060px;margin:clamp(48px,6vw,72px) auto 0;padding:0;display:grid;overflow:hidden}.js .article-cover{clip-path:inset(100% 0 0)}.js .loaded .article-cover{clip-path:inset(0);transition:clip-path 1.2s var(--ease-in-out) .15s}.article-cover img{object-fit:contain;width:auto;max-width:100%;max-height:min(60vh,540px)}.prose{max-width:720px;color:var(--ink-soft);overflow-wrap:break-word;margin:clamp(52px,6vw,76px) auto 0;font-size:19px;line-height:1.75}.prose :where(p,ul,ol,pre,blockquote,figure,aside,h2,h3,h4){margin:0}.prose>*+*{margin-top:1.5em}.prose h2,.prose h3,.prose h4{color:var(--ink);scroll-margin-top:100px;line-height:1.15}.prose h2{font-family:var(--serif);letter-spacing:-.02em;margin-top:1.7em;font-size:2.05em;font-weight:400}.prose h3{font-family:var(--serif);letter-spacing:-.015em;margin-top:1.55em;font-size:1.6em;font-weight:400}.prose h4{letter-spacing:-.01em;margin-top:1.4em;font-size:1.15em;font-weight:600}.prose>:first-child{margin-top:0}.prose strong{color:var(--ink);font-weight:600}.prose em{font-family:inherit;font-style:italic;font-weight:inherit;letter-spacing:inherit}.prose a{color:var(--accent);text-underline-offset:3px;text-decoration:underline 1px;transition:opacity .2s}.prose a:hover{opacity:.7}.prose mark{color:inherit;background:#ffd54a8c;border-radius:3px;padding:.05em .15em}.prose code{background:var(--surface);border:1px solid var(--line);font-family:var(--mono);color:var(--accent);border-radius:5px;padding:.15em .4em;font-size:.82em}.prose ul,.prose ol{padding-left:1.4em}.prose li+li{margin-top:.35em}.prose li::marker{color:var(--faint)}.prose blockquote{border-left:3px solid var(--accent);font-family:var(--serif);color:var(--ink);margin-left:0;margin-right:0;padding:.1em 0 .1em 1.1em;font-size:1.3em;font-style:italic;line-height:1.45}.prose hr{text-align:center;border:0;margin:2.6em 0}.prose hr:after{content:"✦   ✦   ✦";color:var(--faint);letter-spacing:.3em}.prose img{border-radius:10px;width:auto;max-width:100%;height:auto;max-height:min(70vh,620px);margin-inline:auto}.prose div[data-youtube-video] iframe{aspect-ratio:16/9;background:#000;border:0;border-radius:12px;width:100%;height:auto;display:block}.prose ul[data-type=taskList]{padding-left:.2em;list-style:none}.prose ul[data-type=taskList] li{align-items:flex-start;gap:.6em;display:flex}.prose ul[data-type=taskList] li>label{flex-shrink:0;margin-top:.32em}.prose ul[data-type=taskList] input[type=checkbox]{width:1.05em;height:1.05em;accent-color:var(--accent);margin:0}.prose ul[data-type=taskList] li[data-checked=true]>div{color:var(--faint);text-decoration:line-through}.prose .callout{--callout:#3b82f6;border:1px solid color-mix(in srgb, var(--callout) 30%, transparent);background:color-mix(in srgb, var(--callout) 9%, transparent);border-radius:12px;padding:1em 1.2em 1em 3.1em;font-size:.95em;position:relative}.prose .callout:before{content:"ℹ️";font-size:1.05em;line-height:1.6;position:absolute;top:.95em;left:1.1em}.prose .callout[data-variant=tip]{--callout:#22a06b}.prose .callout[data-variant=tip]:before{content:"💡"}.prose .callout[data-variant=warning]{--callout:#e2a300}.prose .callout[data-variant=warning]:before{content:"⚠️"}.prose .callout p+p{margin-top:.6em}.prose .code-block{position:relative}.prose .code-block pre{color:#e9e5dc;font-family:var(--mono);tab-size:2;background:#1b1a17;border-radius:12px;margin:0;padding:1.2em 1.3em;font-size:.78em;line-height:1.65;overflow-x:auto}.prose .code-block code{color:inherit;font-size:inherit;background:0 0;border:0;padding:0}.code-lang{font-family:var(--mono);letter-spacing:.04em;color:#6f6b62;pointer-events:none;font-size:11px;position:absolute;top:10px;right:12px}.hljs-comment,.hljs-quote{color:#7b776d;font-style:italic}.hljs-keyword,.hljs-selector-tag,.hljs-built_in,.hljs-literal{color:#f07b56}.hljs-string,.hljs-attr,.hljs-template-tag,.hljs-addition{color:#b5cf7a}.hljs-number,.hljs-symbol,.hljs-bullet{color:#e7b965}.hljs-title,.hljs-section,.hljs-title.function_{color:#7fb8e8}.hljs-type,.hljs-class .hljs-title,.hljs-title.class_{color:#d7a6f2}.hljs-variable,.hljs-params,.hljs-property{color:#e9e5dc}.hljs-meta,.hljs-tag,.hljs-name{color:#8fd1c7}.hljs-deletion{color:#ef6b58}.article-end{border-top:1px solid var(--line);max-width:720px;margin:clamp(64px,8vw,96px) auto 0;padding-top:32px}.share{flex-wrap:wrap;align-items:center;gap:12px 18px;display:flex}.share-label{font-family:var(--mono);text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-size:12px}.share ul{flex-wrap:wrap;gap:10px;margin:0;padding:0;list-style:none;display:flex}.share a{border:1px solid var(--line);width:38px;height:38px;color:var(--ink-soft);transition:background .3s, border-color .3s, color .3s, transform .4s var(--ease);border-radius:50%;place-items:center;display:grid}.share a svg{fill:currentColor;width:17px;height:17px}.share a:hover{background:var(--ink);border-color:var(--ink);color:var(--bg);transform:translateY(-2px)}.share-dock{display:none}.js .share-dock{z-index:60;transition:opacity .35s var(--ease), transform .45s var(--ease);flex-direction:column;align-items:flex-end;gap:12px;display:flex;position:fixed;bottom:24px;right:24px}.share-dock.tucked{opacity:0;pointer-events:none;transform:translateY(16px)scale(.9)}.share-fab{background:var(--ink);width:54px;height:54px;color:var(--bg);cursor:pointer;transition:background .3s, transform .4s var(--ease);border:0;border-radius:50%;place-items:center;display:grid;box-shadow:0 10px 28px -10px #00000080}.share-fab svg{fill:currentColor;width:20px;height:20px;transition:transform .4s var(--ease)}.share-fab:hover,.share-dock.open .share-fab{background:var(--accent)}.share-dock.open .share-fab svg{transform:rotate(90deg)}.share-panel{border:1px solid var(--line);background:var(--surface);transform-origin:100% 100%;width:214px;transition:opacity .22s var(--ease), transform .28s var(--ease);border-radius:14px;padding:8px;box-shadow:0 18px 44px -16px #00000059}.share-panel[hidden]{display:none}.js .share-dock:not(.open) .share-panel{opacity:0;pointer-events:none;transform:translateY(8px)scale(.96)}.share-panel-head{font-family:var(--mono);text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin:0;padding:8px 10px 10px;font-size:11px}.share-panel ul{margin:0;padding:0;list-style:none}.share-panel a,.share-panel button{width:100%;font:inherit;color:var(--ink-soft);text-align:left;cursor:pointer;background:0 0;border:0;border-radius:9px;align-items:center;gap:12px;padding:9px 10px;font-size:14.5px;transition:background .2s,color .2s;display:flex}.share-panel a svg,.share-panel button svg{fill:currentColor;flex-shrink:0;width:17px;height:17px}.share-panel a:hover,.share-panel button:hover{background:var(--bg);color:var(--ink)}.share-panel [data-share-copy] .icon-done{display:none}.share-panel [data-share-copy].copied{color:#2f9e44}.share-panel [data-share-copy].copied .icon-idle{display:none}.share-panel [data-share-copy].copied .icon-done{display:block}.adjacent{background:var(--line);border-block:1px solid var(--line);grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;margin-top:clamp(56px,7vw,80px);display:grid}.adjacent a{background:var(--bg);padding:32px 28px;transition:background .35s;display:block}.adjacent a:hover{background:var(--surface)}.adjacent .dir{font-family:var(--mono);text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin-bottom:12px;font-size:12px;display:block}.adjacent strong{letter-spacing:-.02em;font-size:clamp(19px,2vw,24px);font-weight:500;line-height:1.25;transition:color .3s;display:block}.adjacent a:hover strong{color:var(--accent)}.adjacent .next{text-align:right}@media (width<=1024px){.post-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.feature{grid-template-columns:minmax(0,1fr);gap:32px}}@media (width<=720px){.page-head,main>.posts:first-child{padding-top:120px}.article{padding-top:108px}.post-grid{grid-template-columns:minmax(0,1fr);gap:0}.prose{font-size:17.5px}.pager{flex-direction:column;align-items:stretch}.pager-pages{order:-1;justify-content:center}.pager .btn-line{justify-content:center}.adjacent{grid-template-columns:minmax(0,1fr)}.adjacent .next{text-align:left}.share-dock{bottom:16px;right:16px}.share-fab{width:50px;height:50px}}
