.rows{border-top:1px solid var(--ink);margin-block:0;padding-block:0;list-style:none}.row{border-bottom:1px solid var(--ink);position:relative}.row__link{color:var(--ink);grid-template-columns:72px minmax(0,1fr) 40px;align-items:start;gap:12px 24px;padding:28px 0;text-decoration:none;transition:color .24s;display:grid;position:relative}.row__ground{inset-block:-1px;background:var(--charcoal);opacity:0;pointer-events:none;width:100vw;transition:opacity .24s;position:absolute;left:50%;transform:translate(-50%)}.row__n,.row__title,.row__description,.row__arrow{z-index:1;position:relative}.row__n{font:500 clamp(18px, 1.6vw, 22px) / 1 var(--font-display);font-variant-numeric:tabular-nums;letter-spacing:-.02em;grid-row:1/3;padding-top:8px}.row__title{transition:translate .24s var(--ease);grid-column:2}.row__title h2{font:500 clamp(32px, 4.5vw, 64px) / 1.05 var(--font-display);letter-spacing:-.035em;margin:0 0 8px}.row__stack{font:400 12px / 1.6 var(--font-mono);color:var(--dim);display:block}.row__description{max-width:58ch;color:var(--dim);grid-area:2/2;margin:0;font-size:16px;line-height:1.5}.row__arrow{font:400 28px / 1 var(--font-display);transition:color .24s ease, translate .24s var(--ease);grid-area:1/3/3;justify-self:end;padding-top:4px}.row__preview{z-index:0;inset-block:0;opacity:0;pointer-events:none;width:100vw;transition:opacity .24s;position:absolute;left:50%;overflow:hidden;transform:translate(-50%)}.row__preview:after{content:"";background:linear-gradient(90deg, var(--charcoal) 0%, transparent 48%), #1616159e;position:absolute;inset:0}.row__system{width:100%;height:100%;position:absolute;inset:0}.row[data-active=true] .row__ground,.row[data-active=true] .row__preview{opacity:1}.row[data-active=true] .row__link{color:var(--paper)}.row[data-active=true] .row__stack,.row[data-active=true] .row__description{color:#c9c9c2}.row[data-active=true] .row__n,.row[data-active=true] .row__arrow{color:var(--yellow)}.row[data-active=true] .row__title{translate:12px}.row[data-active=true] .row__arrow{translate:6px}.row__link:focus-visible{outline:2px solid var(--red);outline-offset:4px}@media (max-width:720px){.row__link{grid-template-columns:36px minmax(0,1fr) 28px;gap:10px 14px;padding-block:24px}.row__n{padding-top:6px;font-size:16px}.row__title h2{font-size:clamp(28px,7vw,40px)}.row__arrow{padding-top:2px;font-size:24px}.row__preview:after{background:#161615cc}}
.index{padding-bottom:80px}.index__controls{gap:20px;margin-bottom:24px;display:grid}.index__search{gap:8px;max-width:560px;display:flex}.index__search input{border:1px solid var(--rule);min-width:0;color:var(--ink);background:#fff;border-radius:0;flex:1;padding:12px 16px;font-size:16px}.index__search button,.index__filters a{border:1px solid var(--rule);min-height:44px;font:400 12px / 1.5 var(--font-mono);color:var(--ink);justify-content:center;align-items:center;padding:8px 16px;text-decoration:none;display:inline-flex}.index__search button,.index__filters a[aria-current=true]{border-color:var(--ink);background:var(--yellow)}.index__search button{cursor:pointer}.index__filters{flex-wrap:wrap;gap:8px;display:flex}.index__filters a:hover{background:var(--yellow)}.index__controls :focus-visible{outline:2px solid var(--red);outline-offset:3px}.index__results{font:400 12px / 1.6 var(--font-mono);color:var(--dim);justify-content:space-between;gap:16px;display:flex}.index__results p{margin:0}.index__results a{text-decoration:underline}.index__empty{padding-block:48px}.index__empty h2{font:500 24px / 1.3 var(--font-display)}.index__empty p{color:var(--dim)}.index__head{grid-template-columns:1fr auto;align-items:end;gap:24px;padding-block:64px 48px;display:grid}.index__eyebrow{font:400 12px / 1.6 var(--font-mono);color:var(--dim);grid-column:1/-1;margin:0}.index__head h1{font:600 clamp(52px, 8vw, 100px) / 1 var(--font-display);letter-spacing:-.045em;margin:0}.index__note{max-width:40ch;color:var(--dim);margin:0;font-size:18px;line-height:1.55}@media (max-width:720px){.index{padding-bottom:48px}.index__head{grid-template-columns:1fr;gap:20px;padding-block:40px 32px}.index__head h1{font-size:clamp(42px,11vw,72px)}.index__note{font-size:16px}}.index__head h1:after{content:"";background:var(--red);width:.18em;height:.18em;animation:dot-in var(--dur-2) var(--ease-out) var(--dur-3) backwards;border-radius:50%;margin-left:.08em;display:inline-block}