.article-index{--article-surface:#fcfdfd;--article-title:#192d37;--article-muted:#556871;--article-line:#d4dee2;--article-accent:#086c57;flex-direction:column;min-height:100dvh;display:flex;position:relative}.dark .article-index{--article-surface:#0e1c27;--article-title:#e8f1f4;--article-muted:#a0b4bf;--article-line:#2b3f4a;--article-accent:#87e5bf}.article-index .hero-background{background:radial-gradient(circle at 70% -12%,#0ea5e91f,#0000 30rem),radial-gradient(circle at 10% 18%,#3b82f60f,#0000 24rem),linear-gradient(#f8fafc 0%,#f1f5f9 56%,#e2e8f0 100%);position:absolute;inset:0;overflow:hidden}.article-index .hero-background:after{content:"";pointer-events:none;z-index:1;background:linear-gradient(#0000,#e2e8f0);height:28%;position:absolute;inset:auto 0 0}.dark .article-index .hero-background{background:radial-gradient(circle at 62% -10%,#0ea5e91f,#0000 30rem),radial-gradient(circle at 18% 12%,#3b82f60f,#0000 28rem),linear-gradient(#0f172a 0%,#0b1220 58%,#080d1b 100%)}.dark .article-index .hero-background:after{background:linear-gradient(#0000,#080d1b)}.article-index .hero-grid{opacity:.1;position:absolute;inset:0;mask-image:linear-gradient(#000 0% 62%,#0000 100%)}.article-index-nav{z-index:50;width:min(100% - 3rem,56rem);margin-inline:auto;padding-top:1.5rem;position:relative}.article-index-home{min-width:2.75rem;min-height:2.75rem;color:var(--article-title);text-underline-offset:.2em;justify-content:center;align-items:center;gap:.5rem;font-size:.8rem;text-decoration:none;display:inline-flex}.article-index-home:hover{text-decoration:underline}.article-index-home svg{width:1.1rem;height:1.1rem}.article-index-main{z-index:50;flex:1;padding:clamp(2rem,5vw,3.5rem) 1.5rem 4rem;position:relative}.article-index-shell{max-width:56rem;color:var(--article-title);margin-inline:auto;animation:.4s ease-out both article-index-in}@keyframes article-index-in{0%{opacity:0;transform:translateY(.5rem)}to{opacity:1;transform:none}}.article-index-list{gap:1rem;margin:0;padding:0;list-style:none;display:grid}.article-index .article-node{border:1px solid var(--article-line);background:var(--article-surface);color:var(--article-title);cursor:pointer;border-radius:.875rem;grid-template-columns:minmax(0,1fr) 2.75rem;align-items:start;gap:.9375rem;padding:clamp(1rem,3vw,1.5rem);text-decoration:none;display:grid}.article-index-content{min-width:0}.article-index-content time{color:var(--article-muted);font:.7rem/1.6 var(--font-mono);margin-bottom:.6rem;display:block}.article-index-title{letter-spacing:-.035em;overflow-wrap:anywhere;margin:0;font-size:clamp(1.2rem,2.4vw,1.5rem);font-weight:600;line-height:1.35}.article-index-description{color:var(--article-muted);overflow-wrap:anywhere;margin:.75rem 0 0;font-size:.8rem;line-height:1.7}.article-index-action{color:var(--article-accent);font:.65rem/1.6 var(--font-mono);justify-content:flex-end;align-items:center;gap:.3rem;margin-top:1.65rem;display:flex}.article-index-action>span{opacity:0;transition:opacity .18s}.article-index-action svg{flex:none;width:1.25rem;height:1.25rem;transition:transform .2s}.article-node:hover .article-index-action>span,.article-node:focus-visible .article-index-action>span{opacity:1}.article-node:hover .article-index-action svg,.article-node:focus-visible .article-index-action svg{transform:translate(2px)}.article-index-home:focus-visible,.article-index .article-node:focus-visible{outline:2px solid var(--article-accent);outline-offset:5px}.article-index-empty>p{color:var(--article-muted);font-size:.85rem;line-height:1.7}@media (width<=640px){.article-index-home>span{display:none}.article-index .article-node{grid-template-columns:minmax(0,1fr) 1.25rem;gap:.625rem}.article-index-action>span{display:none}}@media (prefers-reduced-motion:reduce){.article-index-shell{animation:none}.article-index-action>span,.article-index-action svg{transition:none}}
