.cat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin:1.5rem 0}
.cat-card{border:1px solid #e5e7eb;border-radius:14px;overflow:hidden;background:#fff;transition:transform .15s ease, box-shadow .15s ease}
.cat-card:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(0,0,0,.08)}
.cat-thumb{aspect-ratio:16/9;object-fit:cover;width:100%;display:block;background:#f3f4f6}
.cat-body{padding:12px 14px}
.cat-title{font-weight:700;font-size:1.05rem;line-height:1.4;margin:0}
.cat-meta{color:#6b7280;font-size:.85rem;margin-top:4px}
.cat-desc{color:#4b5563;font-size:.9rem;margin-top:8px}
.cat-posts{border-top:1px solid #f3f4f6;margin-top:10px;padding-top:8px}
.cat-posts ul{margin:0;padding-left:18px}
.cat-posts li{margin:.25rem 0}
.kana-bar{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}
.kana-bar a,.kana-bar span{display:inline-block;padding:.35rem .6rem;border:1px solid #e5e7eb;border-radius:999px;text-decoration:none;font-size:.9rem}
.kana-bar a:hover{background:#f3f4f6}
.kana-active{background:#111;color:#fff;border-color:#111}
@media (max-width:736px){.cat-grid{gap:12px}}