.article-card{display:flex;flex-direction:column;background:#141b2da6;border:var(--border-width-thin) solid var(--color-border-subtle);border-radius:var(--radius-lg);overflow:hidden;transition:border-color var(--duration-base) var(--easing-standard),transform var(--duration-base) var(--easing-standard);&:hover,&:focus-within{border-color:var(--color-border-accent);transform:translateY(-2px)}.article-card__link{display:flex;flex-direction:column;height:100%;color:inherit}.article-card__cover{aspect-ratio:16 / 9;background:var(--color-bg-elevated);overflow:hidden;.article-card__cover-image{width:100%;height:100%;object-fit:cover;display:block}}.article-card__body{display:flex;flex-direction:column;gap:var(--space-2);padding:var(--space-4);flex:1}.article-card__meta{display:flex;align-items:center;gap:var(--space-3);font-family:var(--font-family-mono);font-size:var(--font-size-2xs);letter-spacing:var(--letter-spacing-wide);.article-card__date{color:var(--color-text-muted)}.article-card__category{color:var(--color-text-secondary);font-weight:var(--font-weight-medium)}}.article-card__title{margin:0;font-family:var(--font-family-display);font-size:var(--font-size-md);font-weight:var(--font-weight-semibold);line-height:var(--line-height-snug);color:var(--color-text-primary)}.article-card__excerpt{margin:0;font-size:var(--font-size-sm);line-height:var(--line-height-loose);color:var(--color-text-secondary);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}&.article-card--architecture .article-card__category{color:#a870ff}&.article-card--career .article-card__category{color:#2ee08f}&.article-card--css .article-card__category{color:#ff5fa2}&.article-card--ai .article-card__category{color:#3bc7ff}&.article-card--frontend .article-card__category{color:#ff9e5c}&.article-card--other .article-card__category{color:var(--color-accent-primary)}}.articles-list-grid{display:flex;flex-direction:column;gap:var(--space-6);.articles-list-grid__filters{display:flex;flex-direction:column;gap:var(--space-4);@media(min-width:720px){flex-direction:row;align-items:center;justify-content:space-between}}.articles-list-grid__chips{display:flex;flex-wrap:wrap;gap:var(--space-2);margin:0;padding:0;list-style:none}.articles-list-grid__chip{padding:var(--space-1) var(--space-3);background:var(--color-bg-card);border:var(--border-width-thin) solid var(--color-border-subtle);border-radius:var(--radius-pill);color:var(--color-text-secondary);font-family:var(--font-family-mono);font-size:var(--font-size-xs);letter-spacing:var(--letter-spacing-wide);cursor:pointer;transition:border-color var(--duration-fast) var(--easing-standard),background-color var(--duration-fast) var(--easing-standard),color var(--duration-fast) var(--easing-standard);&:hover{border-color:var(--color-border-accent);color:var(--color-text-primary)}}.articles-list-grid__chip--active{background:var(--color-accent-primary);border-color:var(--color-accent-primary);color:var(--color-text-inverse);&:hover{color:var(--color-text-inverse)}}.articles-list-grid__search{display:flex;flex-direction:column;gap:var(--space-1);.articles-list-grid__search-label{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.articles-list-grid__search-input{min-width:240px;padding:var(--space-2) var(--space-3);background:var(--color-bg-card);border:var(--border-width-thin) solid var(--color-border-subtle);border-radius:var(--radius-md);color:var(--color-text-primary);font-family:var(--font-family-sans);font-size:var(--font-size-sm);transition:border-color var(--duration-fast) var(--easing-standard);&:focus{outline:none;border-color:var(--color-accent-primary)}&::placeholder{color:var(--color-text-muted)}}}.articles-list-grid__items{display:grid;gap:var(--space-5);grid-template-columns:1fr;margin:0;padding:0;list-style:none;@media(min-width:640px){grid-template-columns:repeat(2,1fr)}@media(min-width:1024px){grid-template-columns:repeat(3,1fr)}}.articles-list-grid__empty{margin:0;padding:var(--space-6);text-align:center;color:var(--color-text-secondary);font-size:var(--font-size-sm);border:var(--border-width-thin) dashed var(--color-border-subtle);border-radius:var(--radius-lg)}.articles-list-grid__load-more{display:flex;justify-content:center}.articles-list-grid__load-more-button{padding:var(--space-3) var(--space-5);background:var(--color-bg-card);border:var(--border-width-thin) solid var(--color-border-subtle);border-radius:var(--radius-md);color:var(--color-text-primary);font-family:var(--font-family-mono);font-size:var(--font-size-sm);letter-spacing:var(--letter-spacing-wide);cursor:pointer;transition:border-color var(--duration-fast) var(--easing-standard),background-color var(--duration-fast) var(--easing-standard);&:hover{border-color:var(--color-accent-primary);background:var(--color-bg-elevated)}}.articles-list-grid__counter{margin:0;text-align:center;color:var(--color-text-muted);font-family:var(--font-family-mono);font-size:var(--font-size-xs);letter-spacing:var(--letter-spacing-wide)}}.articles-list[data-astro-cid-7ox7xsox]{padding-block:var(--space-9) var(--space-10)}