.waterfall-item .card{border-radius: 12px;overflow: hidden;transition: transform 0.3s ease, box-shadow 0.3s ease;border: 1px solid var(--gray-border);height: 100%}.waterfall-item .card:hover{transform: translateY(-4px);box-shadow: 0 8px 30px var(--shadow-color)}.card-img-top-wrapper{position: relative;width: 100%;padding-top: 70%;background: var(--light-color);overflow: hidden}.card-img-top-wrapper .card-img-top{position: absolute;top: 0;left: 0;width: 100%;height: 100%;object-fit: cover}.card-img-placeholder{position: absolute;top: 0;left: 0;width: 100%;height: 100%;display: flex;flex-direction: column;align-items: center;justify-content: center;background: var(--light-color);color: var(--gray)}.card-img-placeholder i{font-size: 48px;margin-bottom: 8px}.card-img-placeholder span{font-size: 14px}.card-tags{position: absolute;top: 10px;left: 10px;display: flex;flex-wrap: wrap;gap: 6px;z-index: 2}.tag-badge{display: inline-block;padding: 2px 10px;border-radius: 4px;font-size: 11px;font-weight: 600;color: var(--white-color);letter-spacing: 0.5px}.tag-top{background: var(--danger-color);}.tag-essence{background: var(--orange-color);}.tag-hot{background: var(--blue-color);}.card-body{padding: 12px 15px;flex: 1}.card-title{font-size: 16px;line-height: 1.5;color: var(--dark-color);display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;text-decoration: none;margin-bottom: 6px}.card-title:hover{color: var(--blue-color)}.card-text{font-size: 14px;color: var(--gray);display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;line-height: 1.6;margin-bottom: 0}.card-meta{border-top: 1px solid var(--gray-lighter);padding-top: 10px;margin-top: auto}.meta-left{font-size: 13px;color: var(--gray)}.meta-left span{margin-right: 12px}.meta-left span i{margin-right: 3px}.meta-right{font-size: 12px;color: var(--gray)}.filter-bar{background: var(--light-color);border-radius: 8px;padding: 16px;margin: 12px 16px 0}.filter-group{margin-bottom: 12px}.filter-group:last-child{margin-bottom: 0}.filter-group-label{font-size: 14px;font-weight: 600;color: var(--dark-color);margin-bottom: 8px;display: block}.filter-values{display: flex;flex-wrap: wrap;gap: 8px}.filter-value{display: inline-block;padding: 4px 14px;border-radius: 20px;font-size: 13px;cursor: pointer;border: 1px solid var(--gray-border);background: var(--white-color);color: var(--gray);transition: all 0.2s;text-decoration: none;white-space: nowrap}.filter-value:hover{border-color: var(--blue-color);color: var(--blue-color);background: var(--blue-light)}.filter-value.active{background: var(--blue-color);color: var(--white-color);border-color: var(--blue-color)}.filter-reset{display: inline-block;padding: 4px 14px;border-radius: 20px;font-size: 13px;border: 1px dashed var(--danger-color);background: var(--white-color);color: var(--danger-color);text-decoration: none;transition: all 0.2s;margin-top: 12px}.filter-reset:hover{background: var(--danger-color);color: var(--white-color)}