@charset "utf-8";

.lt-section-box{
  background:
    radial-gradient(1100px 340px at 18% -10%, rgba(255,61,154,.14), transparent 62%),
    radial-gradient(1000px 340px at 92% 10%, rgba(0,215,255,.10), transparent 64%),
    radial-gradient(900px 360px at 50% 120%, rgba(109,91,255,.10), transparent 62%),
    linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.018));
  padding:18px 18px 22px;
  margin-bottom:60px;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.10);
  box-shadow:0 26px 78px rgba(0,0,0,.74);
  backdrop-filter: blur(18px) saturate(130%);
  -webkit-backdrop-filter: blur(18px) saturate(130%);
  position:relative;
  overflow:hidden;
}

.lt-section-box::before{
  content:"";
  position:absolute;
  inset:-2px;
  background:conic-gradient(from 180deg, rgba(255,61,154,.0), rgba(255,61,154,.18), rgba(109,91,255,.14), rgba(0,215,255,.12), rgba(255,61,154,.0));
  filter:blur(18px);
  opacity:.55;
  pointer-events:none;
}

.lt-title{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:6px 4px 16px;
  margin-bottom:10px;
  font-size:16.5px;
  font-weight:950;
  letter-spacing:-.02em;
  color:rgba(255,255,255,.95);
  position:relative;
  z-index:1;
}

.lt-title a{
  color:rgba(255,255,255,.95);
  text-decoration:none;
  transition:color .16s cubic-bezier(.2,.8,.2,1), transform .16s cubic-bezier(.2,.8,.2,1), filter .16s cubic-bezier(.2,.8,.2,1);
}

.lt-title a:hover{
  color:rgba(255,61,154,.95);
  filter:drop-shadow(0 10px 22px rgba(0,0,0,.55));
}

.lt-more-btn{
  font-size:13.5px;
  font-weight:900;
  color:rgba(255,255,255,.58) !important;
  transition:color .16s cubic-bezier(.2,.8,.2,1), transform .16s cubic-bezier(.2,.8,.2,1), opacity .16s cubic-bezier(.2,.8,.2,1);
}

.lt-more-btn:hover{
  color:rgba(0,215,255,.92) !important;
  transform:translateX(3px);
  opacity:1;
}

.lt-list{
  display:flex;
  flex-wrap:wrap;
  gap:18px;
  padding:0;
  margin:0;
  position:relative;
  z-index:1;
}

.lt-item{
  list-style:none;
  width:calc(25% - 18px);
  background:
    radial-gradient(520px 220px at 18% 0%, rgba(255,61,154,.14), transparent 62%),
    radial-gradient(520px 220px at 92% 12%, rgba(0,215,255,.10), transparent 62%),
    linear-gradient(180deg, rgba(255,255,255,.070), rgba(255,255,255,.020));
  border:1px solid rgba(255,255,255,.12);
  border-radius:20px;
  padding:10px;
  box-shadow:0 18px 58px rgba(0,0,0,.70);
  backdrop-filter: blur(16px) saturate(130%);
  -webkit-backdrop-filter: blur(16px) saturate(130%);
  transition:transform .18s cubic-bezier(.2,.8,.2,1), box-shadow .18s cubic-bezier(.2,.8,.2,1), border-color .18s cubic-bezier(.2,.8,.2,1), filter .18s cubic-bezier(.2,.8,.2,1);
  overflow:hidden;
  position:relative;
}

.lt-item::before{
  content:"";
  position:absolute;
  inset:-1px;
  border-radius:20px;
  padding:1px;
  background:linear-gradient(90deg, rgba(255,61,154,.34), rgba(109,91,255,.26), rgba(0,215,255,.22));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
  mask-composite:exclude;
  opacity:.55;
  pointer-events:none;
}

.lt-item:hover{
  transform:translateY(-5px);
  border-color:rgba(255,61,154,.28);
  box-shadow:0 26px 78px rgba(0,0,0,.78), 0 0 22px rgba(255,61,154,.10);
  filter:brightness(1.02) saturate(1.03);
}

@media (max-width:768px){
  .lt-item{width:calc(50% - 9px);}
}

.thumb-box{
  position:relative;
  width:100%;
  height:0;
  padding-bottom:60%;
  overflow:hidden;
  border-radius:16px;
  background:#000;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.08);
}

.thumb-box img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .28s cubic-bezier(.2,.8,.2,1), filter .28s cubic-bezier(.2,.8,.2,1);
  transform:scale(1.01);
}

.lt-item:hover .thumb-box img{
  transform:scale(1.08);
  filter:brightness(1.06) contrast(1.03);
}

.thumb-box::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(420px 220px at 20% 10%, rgba(255,61,154,.12), transparent 60%),
    linear-gradient(180deg, rgba(0,0,0,0) 40%, rgba(0,0,0,.46) 76%, rgba(0,0,0,.82) 100%);
  pointer-events:none;
}

.icon-new,
.icon-hot{
  position:absolute;
  top:10px;
  left:10px;
  padding:4px 9px;
  border-radius:999px;
  font-size:11px;
  font-weight:950;
  letter-spacing:.02em;
  color:#07070b;
  z-index:2;
  box-shadow:0 16px 44px rgba(0,0,0,.55);
}

.icon-new{
  background:linear-gradient(90deg, rgba(0,215,255,1), rgba(109,91,255,1));
  box-shadow:0 16px 44px rgba(0,0,0,.55), 0 0 18px rgba(109,91,255,.22);
}

.icon-hot{
  background:linear-gradient(90deg, rgba(255,61,154,1), rgba(255,122,0,1));
  box-shadow:0 16px 44px rgba(0,0,0,.55), 0 0 18px rgba(255,61,154,.22);
}

.thumb-label{
  position:absolute;
  bottom:10px;
  left:10px;
  padding:4px 10px;
  border-radius:999px;
  font-size:12px;
  font-weight:900;
  color:rgba(255,255,255,.92);
  background:rgba(0,0,0,.46);
  border:1px solid rgba(255,255,255,.16);
  backdrop-filter: blur(10px) saturate(120%);
  -webkit-backdrop-filter: blur(10px) saturate(120%);
  z-index:2;
}

.lt-subject{
  display:block;
  margin-top:12px;
  font-size:14px;
  font-weight:900;
  line-height:1.35;
  color:rgba(255,255,255,.92);
  text-decoration:none;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  transition:color .16s cubic-bezier(.2,.8,.2,1), transform .16s cubic-bezier(.2,.8,.2,1), opacity .16s cubic-bezier(.2,.8,.2,1);
}

.lt-subject:hover{
  color:rgba(255,61,154,.95);
  transform:translateX(1px);
}

.lt-hit{
  margin-top:6px;
  font-size:12px;
  font-weight:800;
  color:rgba(255,255,255,.58);
}

.empty{
  padding:30px 10px;
  text-align:center;
  font-size:14px;
  color:rgba(255,255,255,.52);
}