.article-index{padding:var(--space-2xl) 0 var(--space-3xl)}.article-index-head{max-width:720px;margin-bottom:var(--space-xl)}.article-index-head .tag{color:var(--accent-ink);font-size:.8rem;font-weight:700}.article-index-head h1{margin:var(--space-sm) 0 var(--space-md);overflow-wrap:anywhere;min-width:0;font-family:var(--font-display);letter-spacing:-.035em;font-size:clamp(1.85rem,1.2rem + 2.5vw,3rem);line-height:1.2}.article-index-head p{max-width:560px;color:var(--muted);margin:0}.article-filters{gap:var(--space-xs);margin-bottom:var(--space-xl);flex-wrap:wrap;display:flex}.article-filters[hidden],.article-card[hidden]{display:none}.article-filters button{min-height:44px;padding:var(--space-xs) var(--space-md);border:1px solid var(--line);background:var(--ground);color:var(--muted);font:inherit;white-space:nowrap;cursor:pointer;transition:background-color var(--dur-micro) var(--ease-out), color var(--dur-micro) var(--ease-out);border-radius:999px;font-size:.88rem;font-weight:600}.article-filters button[aria-pressed=true]{border-color:var(--accent-line);background:var(--accent-soft);color:var(--accent-ink)}.article-filters button:focus-visible,.article-card-link:focus-visible,.article-guide a:focus-visible{outline:2px solid var(--accent-ink);outline-offset:4px}.article-results{padding:0}.article-results-head{align-items:baseline;gap:var(--space-sm);margin-bottom:var(--space-lg);display:flex}.article-results-head h2{font-family:var(--font-display);letter-spacing:-.02em;margin:0;font-size:1.1rem}.article-results-count{color:var(--muted);margin:0;font-size:.8rem}.article-results-count [data-result-count]{font-family:var(--font-data);font-variant-numeric:tabular-nums}.article-count-label{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;padding:0;position:absolute;overflow:hidden}.article-grid{column-gap:var(--space-lg);row-gap:var(--space-xl);grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.article-card{min-width:0}.article-card-link{height:100%;color:var(--text);flex-direction:column;text-decoration:none;display:flex}.article-thumb-wrap{border:1px solid var(--line);border-radius:var(--radius);background:var(--raised);min-width:0;overflow:hidden}.article-thumb{aspect-ratio:16/9;object-fit:cover;width:100%;display:block}.article-thumb-generated{padding:var(--space-lg);place-items:center;display:grid}.article-thumb-generated svg{width:auto;height:26px}.article-card-body{min-width:0;padding-top:var(--space-md);flex-direction:column;flex:1;display:flex}.article-card-category{color:var(--accent-ink);font-size:.75rem;font-weight:600}.article-card-body h3{margin:var(--space-xs) 0;font-family:var(--font-display);letter-spacing:-.02em;overflow-wrap:anywhere;font-size:1.12rem;line-height:1.45}.article-card-description{margin:0 0 var(--space-md);color:var(--muted);font-size:.9rem;line-height:1.65}.article-card-meta{justify-content:space-between;align-items:center;gap:var(--space-xs);flex-wrap:wrap;margin-top:auto;display:flex}.article-card-meta time{color:var(--muted);font-family:var(--font-data);font-variant-numeric:tabular-nums;font-size:.7rem}.article-card-more{color:var(--muted);white-space:nowrap;font-size:.8rem}.article-card--featured{margin-bottom:var(--space-xl)}.article-card--featured .article-card-link{gap:var(--space-xl);padding:var(--space-lg);border:1px solid var(--line);border-radius:var(--radius);background:var(--raised);grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);align-items:center;display:grid}.article-card--featured .article-thumb-wrap{border:0}.article-card--featured .article-card-body{padding:var(--space-xs) 0}.article-card--featured h3{max-width:24ch;font-size:clamp(1.3rem,1rem + 1vw,1.8rem);line-height:1.35}.article-card--featured .article-card-description{margin-bottom:var(--space-lg)}.article-card--featured .article-card-more{color:var(--accent-ink);font-weight:600}.article-empty{color:var(--muted)}.article-guide{justify-content:space-between;align-items:center;gap:var(--space-lg);margin-top:var(--space-2xl);padding-top:var(--space-xl);border-top:1px solid var(--line);display:flex}.article-guide h2{margin:0 0 var(--space-xs);letter-spacing:-.02em;font-size:1.1rem}.article-guide p{color:var(--muted);margin:0;font-size:.9rem}.article-guide a{align-items:center;gap:var(--space-sm);min-height:44px;color:var(--accent-ink);white-space:nowrap;font-size:.9rem;font-weight:600;text-decoration:none;display:inline-flex}@media (hover:hover) and (pointer:fine){.article-card-link:hover h3{text-underline-offset:4px;text-decoration:underline 1px}.article-filters button:hover{color:var(--text)}.article-guide a:hover{text-underline-offset:4px;text-decoration:underline}}@media (width<=60rem){.article-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.article-card--featured .article-card-link{gap:var(--space-lg)}}@media (width<=40rem){.article-index{padding:var(--space-xl) 0 var(--space-2xl)}.article-index .wrap{padding-inline:var(--space-md)}.article-index-head{margin-bottom:var(--space-lg)}.article-index-head p{font-size:.92rem}.article-filters{gap:var(--space-xs);margin-bottom:var(--space-lg)}.article-filters button{padding-inline:var(--space-sm);font-size:.8rem}.article-grid{gap:var(--space-md);margin-top:var(--space-md);grid-template-columns:minmax(0,1fr)}.article-grid .article-card{padding-block:var(--space-lg);border:0}.article-grid .article-card-link{align-items:start;gap:var(--space-md);grid-template-columns:minmax(0,1fr) 88px;display:grid}.article-grid .article-thumb-wrap{border-radius:var(--space-xs);grid-area:1/2}.article-grid .article-thumb{aspect-ratio:1}.article-grid .article-card-body{grid-area:1/1;padding:0}.article-card-body h3{font-size:1rem}.article-card-description{margin-bottom:var(--space-sm);font-size:.85rem}.article-grid .article-card-more{display:none}.article-card--featured{margin-bottom:0}.article-card--featured .article-card-link{gap:var(--space-md);padding:var(--space-md);grid-template-columns:minmax(0,1fr)}.article-card--featured .article-thumb{aspect-ratio:16/8}.article-card--featured h3{max-width:none;font-size:1.3rem}.article-card--featured .article-card-description{margin-bottom:var(--space-md)}.article-guide{align-items:flex-start;gap:var(--space-sm);flex-direction:column}}@media (prefers-reduced-motion:reduce){.article-filters button{transition:none}}
