@charset "utf-8";

.postLists.poster .home-center-content{
  --poster-theme: var(--accent-color, #ff6b6b);
  --poster-bg: rgba(255,255,255,.78);
  --poster-bd: rgba(255,255,255,.55);
  --poster-shadow: 0 18px 46px rgba(2,6,23,.16);
  width:100%;
  display:flex;
  background: linear-gradient(135deg, #1a3157, #cf2b2b);
  border: 1px solid rgba(0,0,0,.08);
  border-radius:12px;
  overflow:hidden;
  box-shadow: 0 6px 6px #8492a6, 0 10px 10px #34425a, 0 -1px 2px #d8e0ea inset;
  height:340px;
}

body.night .postLists.poster .home-center-content{
  --poster-bg: rgba(26,32,44,.70);
  --poster-bd: rgba(255,255,255,.10);
  --poster-shadow: 0 22px 70px rgba(0,0,0,.55);
  background: linear-gradient(135deg, rgba(26,32,44,.78), rgba(17,23,33,.72));
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: var(--poster-shadow), inset 0 1px 0 rgba(255,255,255,.08), inset 0 -14px 22px rgba(0,0,0,.25);
}

.postLists.poster .home-center-left{
  flex:1;
  position:relative;
  height:100%;
  overflow:hidden;
}

.postLists.poster .home-center-title{
  position:absolute;
  bottom:32px;
  left:32px;
  z-index:10;
  text-align:left;
  width:80%;
  max-width:80%;
}

.postLists.poster .home-center-title a{
  color:#fff;
  font-size:28px;
  font-weight:700;
  line-height:1.4;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  text-decoration:none;
}

.postLists.poster .home-center-title-tag{
  color:#fff;
  font-size:12px;
  opacity:.85;
  margin-top:2px;
  text-shadow:0 2px 20px rgb(0 0 0 / 15%);
  display:flex;
  align-items:center;
  gap:4px;
}

.postLists.poster .home-center-title a:hover{
  color:#fff;
}

.postLists.poster .home-center-banner{
  position:relative;
  width:100%;
  height:100%;
  overflow:hidden;
}

.postLists.poster .home-center-banner-item{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  opacity:0;
  visibility:hidden;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  padding:0;
  background-color: transparent;
  cursor:pointer;
  transition: opacity .35s ease, visibility .35s ease;
}

.postLists.poster .home-center-banner-item.active{
  opacity:1;
  visibility:visible;
  z-index:1;
}

.postLists.poster .home-center-cover{
  width:100%;
  max-width:100%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  background: transparent;
}

.postLists.poster .home-center-cover-img{
  width:100%!important;
  height:100%!important;
  max-width:100%;
  max-height:100%;
  display:block;
  object-fit:cover!important;
  object-position:center;
  filter: saturate(1.05) contrast(1.02);
  transform: scale(1.01);
}

.postLists.poster .home-center-mask{
  position:absolute;
  bottom:0;
  left:0;
  width:100%;
  height:150px;
  background: linear-gradient(to top, rgba(2,6,23,.78) 0, rgba(2,6,23,.15) 55%, transparent 100%);
  z-index:2;
  pointer-events:none;
}

.postLists.poster .home-center-right{
  width:30%;
  flex-shrink:0;
  display:flex;
  flex-direction:column;
  background: linear-gradient(135deg, rgba(2,6,23,.92) 0, rgba(2,6,23,.62) 100%);
  height:100%;
  position:relative;
}

.postLists.poster .home-center-right::before{
  content:"";
  position:absolute;
  inset:0;
  background: radial-gradient(420px 220px at 30% 0%, rgba(255,255,255,.12), transparent 60%),
              radial-gradient(520px 320px at 70% 40%, rgba(255,255,255,.08), transparent 65%);
  opacity:.9;
  pointer-events:none;
}

body.night .postLists.poster .home-center-right{
  background: linear-gradient(135deg, rgba(0,0,0,.55) 0, rgba(26,32,44,.72) 100%);
}

.postLists.poster .home-center-list{
  display:flex;
  flex-direction:column;
  flex:1;
  position:relative;
  z-index:1;
}

.postLists.poster .home-center-item{
  display:flex;
  align-items:center;
  gap:.75rem;
  padding:16px;
  transition:all .2s;
  cursor:pointer;
  background: rgba(255,255,255,.06);
  text-decoration:none;
  flex: 1 1 0;
  min-height: 0;
  border-top: 1px solid rgba(255,255,255,.08);
}

.postLists.poster .home-center-item:hover{
  background: rgba(255,255,255,.10);
}

.postLists.poster .home-center-item.active{
  background: linear-gradient(90deg, rgba(255,255,255,.16), rgba(255,255,255,.10));
  border-left: 3px solid var(--poster-theme);
}

body.night .postLists.poster .home-center-item{
  border-top: 1px solid rgba(255,255,255,.08);
}

.postLists.poster .home-center-item-icon{
  width:36px;
  height:36px;
  min-width:36px;
  border-radius:8px;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
  background: rgba(255,255,255,.92);
  flex-shrink:0;
  position:relative;
  box-shadow: 0 8px 18px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.7);
}

.postLists.poster .home-center-item-icon::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:8px;
  pointer-events:none;
  border: 1px solid rgba(255,255,255,.35);
  opacity:.35;
  box-sizing:border-box;
  z-index:1;
}

.postLists.poster .home-center-item-icon img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.postLists.poster .home-center-item-title{
  flex:1;
  overflow:hidden;
  color:#fff;
  font-size:16px;
  line-height:1.5;
  opacity:.9;
  white-space:nowrap;
  text-overflow:ellipsis;
}

.postLists.poster .home-center-item-title .tx{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

@media (max-width:900px){
  .postLists.poster .home-center-content{
    height:auto;
    flex-direction:column;
  }
  .postLists.poster .home-center-left{
    height:320px;
  }
  .postLists.poster .home-center-right{
    width:100%;
  }
  .postLists.poster .home-center-item{
    flex: unset;
    min-height: 52px;
  }
}