.article-card { background: var(--bg-card); border: 1px solid var(--border); padding: 16px 20px; margin-bottom: 8px; border-radius: 4px; transition: border-color 0.2s; }
.article-card:hover { border-color: var(--primary); }
.article-card h2 { font-size: 14px; font-weight: 600; margin-bottom: 4px; }
.article-card h2 a { color: var(--text); }
.article-card h2 a:hover { color: var(--primary); text-decoration: none; }
.article-card .meta { font-size: 10px; color: var(--text-muted); display: flex; gap: 12px; }
.article-card .excerpt { font-size: 11px; color: var(--text-muted); margin-top: 6px; line-height: 1.6; }
.search-wrap { display: flex; gap: 8px; margin-bottom: 16px; }
.search-wrap input { flex: 1; padding: 8px 12px; background: var(--bg); border: 1px solid var(--border); color: var(--text); font-family: var(--font-mono); font-size: 12px; border-radius: 4px; outline: none; }
.search-wrap input:focus { border-color: var(--primary); }
.search-wrap input::placeholder { color: var(--text-muted); }
.search-wrap select { padding: 8px 12px; background: var(--bg); border: 1px solid var(--border); color: var(--text); font-family: var(--font-mono); font-size: 12px; border-radius: 4px; outline: none; cursor: pointer; }