.category-filter{gap:var(--space-sm);padding:var(--space-xl) 0;flex-wrap:wrap;justify-content:center;display:flex}.category-pill{padding:var(--space-sm) var(--space-md);color:var(--color-text-muted);background:var(--color-bg);border:1px solid var(--color-border);border-radius:999px;align-items:center;gap:6px;font-size:.875rem;font-weight:500;transition:all .15s;display:inline-flex}.category-pill:hover{color:var(--color-accent);border-color:var(--color-accent)}.category-pill.active{color:var(--color-bg);background:var(--color-accent);border-color:var(--color-accent)}.hero{text-align:center;padding:var(--space-3xl) 0 var(--space-xl);align-items:center;gap:var(--space-md);flex-direction:column;display:flex}.hero h1{color:var(--color-midnight)}.hero-subtitle{color:var(--color-text-muted);max-width:680px;font-size:clamp(1rem,2vw,1.125rem);line-height:1.6}.hero-stats{align-items:center;gap:var(--space-lg);margin-top:var(--space-md);padding:var(--space-md) var(--space-xl);background:var(--color-surface);border-radius:var(--radius-lg);display:flex}.hero-stat{flex-direction:column;align-items:center;gap:2px;display:flex}.hero-stat-value{color:var(--color-accent);font-variant-numeric:tabular-nums;font-size:1.5rem;font-weight:700}.hero-stat-label{color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.04em;font-size:.8125rem}.hero-stat-divider{background:var(--color-border);width:1px;height:32px}.badge-row{gap:var(--space-sm);flex-wrap:wrap;align-items:center;display:flex}.badge-pill{font-family:var(--font-mono);white-space:nowrap;letter-spacing:.03em;text-transform:uppercase;border-radius:2px;align-items:center;padding:2px 6px;font-size:.625rem;font-weight:600;line-height:1;display:inline-flex}.badge-ecosystem-npm{color:var(--color-npm);border:1px solid oklch(55% .15 145/.3)}.badge-ecosystem-crate{color:var(--color-rust);border:1px solid oklch(60% .15 50/.3)}.badge-ecosystem-app{color:var(--color-app);border:1px solid oklch(55% .12 280/.3)}.badge-license{color:var(--color-text-muted);border:1px solid var(--color-border)}.badge-row img{opacity:.7;height:16px}.project-card{gap:var(--space-sm);padding:var(--space-lg) 0;border-bottom:1px solid var(--color-border);color:inherit;flex-direction:column;text-decoration:none;transition:background .15s;display:flex}.project-card:hover{background:var(--color-surface);margin-inline:calc(-1 * var(--space-md));padding-inline:var(--space-md)}.project-card-header{justify-content:space-between;align-items:center;gap:var(--space-sm);display:flex}.project-card-title{align-items:center;gap:var(--space-sm);font-family:var(--font-mono);display:flex}.project-card-title h3{font-family:var(--font-mono);letter-spacing:-.01em;font-size:.9375rem}.project-card-icon{color:var(--color-accent);flex-shrink:0}.project-card-github{color:var(--color-text-muted);opacity:.3;flex-shrink:0;transition:opacity .15s}.project-card:hover .project-card-github{opacity:1}.project-card-tagline{color:var(--color-text-muted);font-size:.8125rem;line-height:1.4}.project-card-highlight{font-family:var(--font-mono);color:var(--color-highlight);padding:1px var(--space-sm);white-space:nowrap;letter-spacing:.02em;text-transform:uppercase;border:1px solid oklch(70% .14 218/.25);border-radius:2px;align-self:flex-start;font-size:.6875rem;font-weight:600}.project-card-detail{color:var(--color-text);flex:1;font-size:.875rem;line-height:1.55}.project-card-footer{padding-top:var(--space-xs)}.project-grid-wrapper{gap:var(--space-3xl);padding-bottom:var(--space-3xl);flex-direction:column;display:flex}.category-section{flex-direction:column;display:flex}.category-heading{align-items:center;gap:var(--space-sm);color:var(--color-midnight);font-family:var(--font-mono);letter-spacing:.06em;text-transform:uppercase;padding-bottom:var(--space-md);border-bottom:2px solid var(--color-midnight);font-size:.75rem;font-weight:600;display:flex}.category-heading-icon{color:var(--color-accent)}.category-count{color:var(--color-text-muted);margin-left:var(--space-xs);font-size:.6875rem;font-weight:500}.category-count:before{content:"["}.category-count:after{content:"]"}.project-grid{gap:0 var(--space-xl);grid-template-columns:repeat(auto-fill,minmax(340px,1fr));display:grid}
