/* ==========================================================================
   trailer-select.css — dải chọn 2 trailer (MC + Su Wanning) cho /rakuben
   Thiết kế khớp hệ dark-fantasy/gold sẵn có (--gold #d4af37, --jpserif).
   🔴 Chỉ là DẢI CHỌN mảnh nằm DƯỚI poster — không đổi layout shatter hiện tại.
   ========================================================================== */

.rb-trailers{
  position:absolute;left:0;right:0;bottom:0;z-index:4;
  display:flex;justify-content:center;align-items:flex-end;gap:14px;
  padding:0 16px 34px;pointer-events:none;
}
.rb-tr{
  pointer-events:auto;cursor:pointer;
  display:flex;align-items:center;gap:11px;
  padding:10px 18px 10px 13px;
  border:1px solid rgba(212,175,55,.42);
  background:rgba(5,5,7,.72);backdrop-filter:blur(6px);
  transition:border-color .4s var(--ease),background .4s var(--ease),transform .4s var(--ease);
}
.rb-tr:hover{border-color:rgba(212,175,55,.9);background:rgba(12,12,15,.86);transform:translateY(-2px)}
.rb-tr.is-active{
  border-color:#d4af37;background:rgba(212,175,55,.14);
  box-shadow:0 0 0 1px rgba(212,175,55,.5) inset,0 6px 22px rgba(0,0,0,.55);
}
/* vạch đỏ dọc bên trái — đồng bộ thanh accent cạnh RAKUBEN */
.rb-tr__bar{width:3px;height:28px;background:#8a0303;flex:0 0 auto}
.rb-tr__txt{display:flex;flex-direction:column;line-height:1.3}
.rb-tr__name{
  font-family:var(--lat),serif;font-weight:700;font-size:14px;
  letter-spacing:.07em;color:rgba(240,236,228,.96);
}
.rb-tr.is-active .rb-tr__name{color:#d4af37}
.rb-tr__sub{
  font-family:var(--lat),serif;font-size:11px;
  letter-spacing:.04em;color:rgba(186,180,168,.92);
}

@media (max-width:640px){
  .rb-trailers{gap:8px;padding:0 8px 16px;flex-wrap:wrap}
  .rb-tr{padding:7px 14px 7px 11px}
  .rb-tr__name{font-size:12px}
  .rb-tr__sub{font-size:9.5px}
  .rb-tr__bar{height:23px}
}