/* rail carousel (tabs/buttons) */
.railHead{display:flex;align-items:center;gap:10px;flex:0 0 auto}
.railTabs{display:flex;gap:8px;align-items:center;margin:0 auto}
.railTabs .tab{
  display:inline-flex;align-items:center;justify-content:center;
  width:34px;height:24px;border-radius:7px;
  border:1px solid rgba(255,255,255,.10);
  background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(0,0,0,0));
  color:#b9c6d6;filter:grayscale(100%);opacity:.9
}
.railTabs .tab.active{color:#fff;opacity:1;border-color:rgba(255,255,255,.18)}
.carBtn{
  width:34px;height:30px;border-radius:8px;border:1px solid rgba(255,255,255,.10);
  background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(0,0,0,0));
  color:#d6dde6;cursor:pointer;filter:grayscale(100%);user-select:none
}
.carBtn:hover{border-color:rgba(79,211,255,.22);box-shadow:0 0 18px rgba(79,211,255,.14);color:#fff}

/* carousel: center + side peek (cropped by .car) */
.car{overflow:hidden;flex:0 0 auto;position:relative}
.carTrack{
  display:flex;gap:12px;
  overflow-x:auto;overflow-y:hidden;
  scroll-snap-type:x mandatory;
  scroll-behavior:smooth;
  padding:6px 18px;
  -ms-overflow-style:none;scrollbar-width:none
}
.carTrack::-webkit-scrollbar{width:0;height:0}

/* card */
.card{
  flex:0 0 calc(100% - 64px);
  max-width:320px;
  scroll-snap-align:center;
  display:block;text-decoration:none;user-select:none;
  border-radius:12px;
  padding:12px;
  border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(0,0,0,0) 40%),linear-gradient(180deg,#151c26,#0b0f15);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 10px 24px rgba(0,0,0,.45);
  transform:scale(.94);
  opacity:.78;
  transition:transform .22s ease,opacity .22s ease,border-color .22s ease,box-shadow .22s ease;
}
.card:hover{border-color:rgba(79,211,255,.22);box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 10px 24px rgba(0,0,0,.45),0 0 22px rgba(79,211,255,.16)}
.card.isActive{
  transform:scale(1);
  opacity:1;
  border-color:rgba(79,211,255,.18);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 10px 24px rgba(0,0,0,.45),0 0 20px rgba(79,211,255,.10);
}

/* layout: big icon + 2 lines */
.cardTop{display:flex;align-items:center;gap:12px;margin:0}
.cardIco{
  width:44px;height:44px;flex:0 0 auto;overflow:hidden;
  border:1px solid rgba(255,255,255,.12);
  border-radius:12px;
  background:rgba(0,0,0,.15);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
}
.cardIco img{width:100%;height:100%;display:block;object-fit:cover;opacity:.92}

.cardTop h3{
  margin:0;
  font-size:16px;color:#e9f1fb;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  min-width:0;
}
.card p{
  margin:6px 0 0;
  color:#a8b6c7;
  font-size:13px;
  line-height:1.35;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.card p .marq{display:inline-block;will-change:transform}
@media (max-width: 900px){
  .sidebar .picks{display:none}
}
