.tr-block{border:1px solid #eee;border-radius:14px;padding:16px;margin:12px 0;background:#fff;box-shadow:0 2px 10px rgba(0,0,0,.04)}
.tr-head{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.tr-star{color:#ccc;opacity:0.4}
.tr-star-full{color:#f5b301 !important;opacity:1}
.tr-titles h3{margin:0;font-size:1.1rem}
.tr-sub{margin:2px 0 0 0;color:#555;font-size:.9rem}

.tr-carousel-wrapper{position:relative;overflow:hidden}
.tr-carousel{display:flex;transition:transform 0.6s ease;will-change:transform}
.tr-card{flex:0 0 100%;max-width:100%;box-sizing:border-box;padding:12px;margin-right:12px;border:1px solid #f0f0f0;border-radius:12px;background:#fff}

.tr-card-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.tr-badge{font-size:.75rem;padding:4px 8px;border-radius:999px;background:#e6f4ea;color:#19643b;border:1px solid #cfe9d8}
.tr-text{font-size:.95rem;color:#222;margin:6px 0;min-height:54px}
.tr-meta{color:#666;font-size:.85rem}
.tr-dot{margin:0 6px;color:#aaa}

.tr-nav{position:absolute;top:50%;transform:translateY(-50%);background:#fff;border:1px solid #ddd;border-radius:50%;width:40px;height:40px;font-size:20px;line-height:38px;text-align:center;cursor:pointer;box-shadow:0 2px 6px rgba(0,0,0,0.12);z-index:10}
.tr-prev{left:8px}
.tr-next{right:8px}

@media (min-width:768px){
  .tr-card{flex:0 0 50%;max-width:50%}
}
@media (min-width:1200px){
  .tr-card{flex:0 0 33.33%;max-width:33.33%}
}
@media (max-width:767px){
  .tr-nav{display:none !important;}
}