.c420-catgrid__title{font-size:20px;font-weight:700;color:#1a3a2e;margin:0 0 20px 0;line-height:1.2}.c420-catgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.c420-catcard{display:flex;flex-direction:row;align-items:center;gap:12px;padding:12px 16px 12px 12px;background:#fff;border:1px solid #f0f0f0;border-radius:12px;text-decoration:none;color:inherit;transition:transform 0.22s ease,box-shadow 0.22s ease,background 0.22s ease;cursor:pointer;overflow:hidden}.c420-catcard.c420-hover-lift:hover{transform:translateY(-3px);box-shadow:0 8px 24px rgb(0 0 0 / .1)}.c420-catcard.c420-hover-darken:hover{background:#f5f5f5}.c420-catcard.c420-hover-outline:hover{border-color:#2A7F62!important;box-shadow:0 0 0 2px rgb(42 127 98 / .2)}.c420-catcard__thumb{width:80px;height:80px;flex:0 0 80px;border-radius:12px;overflow:hidden;display:flex;align-items:center;justify-content:center;background:#FEF9EC;flex-shrink:0;transition:transform 0.28s ease}.c420-catcard:hover .c420-catcard__thumb{transform:scale(1.04)}.c420-catcard__img{width:100%;height:100%;object-fit:contain;object-position:center;display:block;padding:8px}.c420-catcard__no-img{font-size:28px;font-weight:800;color:#aaa;line-height:1;text-transform:uppercase;user-select:none}.c420-catcard__text{display:flex;flex-direction:column;gap:3px;min-width:0}.c420-catcard__name{font-size:15px;font-weight:600;color:#1a1a1a;line-height:1.3;transition:color 0.2s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.c420-catcard:hover .c420-catcard__name{color:#2A7F62}.c420-catcard__count{font-size:12px;color:#888;font-weight:400}@media (max-width:1024px){.c420-catgrid{grid-template-columns:repeat(2,1fr)}}@media (max-width:767px){.c420-catgrid{grid-template-columns:repeat(2,1fr);gap:8px}.c420-catcard{padding:10px 12px 10px 10px;gap:10px}.c420-catcard__thumb{width:60px;height:60px;flex:0 0 60px;border-radius:10px}.c420-catcard__name{font-size:13px}}@media (max-width:420px){.c420-catgrid{grid-template-columns:1fr}}