
.directory-filters{display:flex;align-items:center;gap:12px;padding:16px 0 20px;border-bottom:1px solid #e4e9f2;margin-bottom:8px;flex-wrap:wrap}.directory-filters>div{display:flex;align-items:center;gap:8px}.directory-filters label{white-space:nowrap;color:#64748b;font-size:13px}.directory-filters select{font:inherit;font-size:14px;color:#334155;background:#fff;border:1px solid #dbe2ed;border-radius:8px;min-width:150px;max-width:240px;padding:8px 34px 8px 12px;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='none' stroke='%2364748b' stroke-width='1.6'%3E%3Cpath d='m3 5 4 4 4-4'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center}.directory-filters select:focus-visible{outline:2px solid #2563eb;outline-offset:2px}.directory-filters .btn{font-size:14px;padding:8px 18px;border-radius:8px}.filter-reset{font-size:13px;color:#64748b;text-decoration:none}.filter-reset:hover{color:#2563eb}.tool-card-visual{position:relative}.tool-pin{position:absolute;top:10px;left:10px;background:#fff;color:#1d4ed8;border:1px solid #dbeafe;font-size:11px;font-weight:600;line-height:20px;border-radius:5px;padding:1px 7px;pointer-events:none}.tool-favorite-form{margin:0}.tool-favorite{display:inline-flex;gap:7px;align-items:center;justify-content:center;width:34px;height:34px;background:rgba(255,255,255,.95);color:#475569;border:1px solid #e2e8f0;border-radius:50%;text-decoration:none;cursor:pointer;transition:background .15s,color .15s}.tool-favorite svg,.tool-counts svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}.tool-favorite:hover{color:#1d4ed8;background:#eff6ff}.tool-favorite:focus-visible{outline:2px solid #2563eb;outline-offset:3px}.tool-favorite.is-saved{background:#eff6ff;color:#2563eb}.tool-favorite.is-saved svg{fill:#dbeafe}.tool-favorite-corner{position:absolute;right:10px;top:10px}.tool-favorite:disabled{cursor:wait}.tool-counts{display:inline-flex;align-items:center;gap:12px;color:#64748b;font-size:12px;font-variant-numeric:tabular-nums;white-space:nowrap}.tool-counts>span{display:inline-flex;align-items:center;gap:4px}.tool-counts svg{width:15px;height:15px}.tool-card-meta .tool-counts{display:inline-flex}.detail-engagement{display:flex;gap:18px;align-items:center;flex-wrap:wrap;margin:16px 0}.tool-favorite-detail .tool-favorite,.tool-favorite.tool-favorite-detail{width:auto;height:38px;padding:0 13px;border-radius:8px;background:#fff;font-size:13px}.favorite-total{font-size:14px;color:#64748b;font-weight:400;margin-left:8px}.favorite-feedback{position:fixed;bottom:26px;left:50%;transform:translateX(-50%);padding:10px 18px;background:#172033;color:#fff;border-radius:10px;box-shadow:0 4px 18px #0f172a26;z-index:1100;font-size:14px;max-width:90vw;text-align:center}.tool-card .tool-card-meta{gap:8px}.tool-card-meta .tool-counts>span{display:inline-flex}
@media(max-width:640px){.directory-filters{gap:10px;padding:12px 0 16px}.directory-filters>div{flex:1;min-width:0;gap:6px}.directory-filters label{font-size:12px}.directory-filters select{min-width:0;width:100%;max-width:none;font-size:13px;padding-left:9px}.directory-filters .btn{padding:7px 13px;font-size:13px}.tool-counts{gap:8px;font-size:11px}.card-detail-label{display:none}.tool-pin{top:8px;left:8px}.tool-favorite-corner{right:8px;top:8px}.tool-favorite{width:31px;height:31px}.tool-card-meta .tool-counts{gap:8px}.detail-engagement .tool-counts{font-size:13px}}
@media(prefers-reduced-motion:reduce){.tool-favorite{transition:none}}

.tool-card-rating{display:flex;align-items:center;gap:5px}.tool-card-rating>span:last-child{font-size:12px;color:#748095}
