/* Clean post list with multi-color diagonal labels. */
.app-post-list,
.app-post-list *,
.app-post-list *::before,
.app-post-list *::after{
    box-sizing:border-box!important;
}
.app-post-list{
    width:100%!important;
    display:flex!important;
    flex-direction:column!important;
    gap:4px!important;
    margin:0!important;
    padding:3px!important;
    background:#edf3f8!important;
}
.app-post-card{
    position:relative!important;
    width:100%!important;
    min-height:82px!important;
    display:block!important;
    margin:0!important;
    padding:12px 10px 10px 66px!important;
    overflow:hidden!important;
    border:1px solid #d3dee8!important;
    border-radius:0!important;
    background:linear-gradient(180deg,#fff 0%,#fbfdff 100%)!important;
    color:#152437!important;
    text-decoration:none!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.92),0 1px 2px rgba(25,42,60,.04)!important;
}
.app-post-card:hover,
.app-post-card:active{
    border-color:#c4d1dc!important;
    background:#fff!important;
    color:#152437!important;
    text-decoration:none!important;
}
.app-post-card::before{
    content:""!important;
    position:absolute!important;
    top:0!important;
    left:0!important;
    width:54px!important;
    height:54px!important;
    background:linear-gradient(135deg,rgba(255,255,255,.4) 0%,rgba(255,255,255,.12) 43%,rgba(57,89,122,.1) 50%,transparent 51%)!important;
    pointer-events:none!important;
    z-index:3!important;
}
.app-post-ribbon{
    position:absolute!important;
    top:9px!important;
    left:-22px!important;
    z-index:4!important;
    width:82px!important;
    height:22px!important;
    max-width:none!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    transform:rotate(-45deg)!important;
    transform-origin:center!important;
    border:0!important;
    border-radius:0!important;
    background:linear-gradient(180deg,#20c8ff 0%,#006cff 100%)!important;
    color:#fff!important;
    box-shadow:0 1px 2px rgba(35,58,80,.16),inset 0 1px 0 rgba(255,255,255,.32)!important;
    text-shadow:0 1px 1px rgba(20,45,70,.25)!important;
    font-size:11px!important;
    line-height:22px!important;
    font-weight:950!important;
    white-space:nowrap!important;
    pointer-events:none!important;
}
.app-post-ribbon::before{
    content:""!important;
    position:absolute!important;
    top:-12px!important;
    left:-36px!important;
    width:24px!important;
    height:48px!important;
    display:block!important;
    background:linear-gradient(90deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.92) 50%,rgba(255,255,255,0) 100%)!important;
    opacity:.85!important;
    transform:skewX(-22deg)!important;
    animation:appRibbonShine 2.2s ease-in-out infinite!important;
}
.app-post-ribbon::after{
    content:""!important;
    position:absolute!important;
    left:0!important;
    right:0!important;
    bottom:0!important;
    height:1px!important;
    display:block!important;
    background:rgba(0,0,0,.14)!important;
}
.app-post-ribbon > span{
    position:relative!important;
    z-index:2!important;
    width:66px!important;
    display:block!important;
    overflow:hidden!important;
    color:#fff!important;
    font-size:11px!important;
    line-height:22px!important;
    font-weight:950!important;
    text-align:center!important;
    white-space:nowrap!important;
}
.ribbon-level-6 .app-post-ribbon,
.ribbon-level-5 .app-post-ribbon{
    background:linear-gradient(180deg,#ff5c78 0%,#e72f4d 100%)!important;
}
.ribbon-level-4 .app-post-ribbon{
    background:linear-gradient(180deg,#c05cff 0%,#7b2cff 100%)!important;
}
.ribbon-level-3 .app-post-ribbon{
    background:linear-gradient(180deg,#ff9b36 0%,#e66b08 100%)!important;
}
.ribbon-level-2 .app-post-ribbon{
    background:linear-gradient(180deg,#00efc3 0%,#00a47f 100%)!important;
}
.ribbon-level-1 .app-post-ribbon{
    background:linear-gradient(180deg,#a6ff2e 0%,#27c700 100%)!important;
}
.ribbon-level-0 .app-post-ribbon{
    background:linear-gradient(180deg,#24e1ff 0%,#3457ff 100%)!important;
}
@keyframes appRibbonShine{
    0%{left:-42px!important;opacity:0!important}
    18%{opacity:.9!important}
    48%{left:96px!important;opacity:.55!important}
    100%{left:96px!important;opacity:0!important}
}
@media(prefers-reduced-motion:reduce){
    .app-post-ribbon::before{
        animation:none!important;
        opacity:.2!important;
    }
}
.app-post-main{
    position:relative!important;
    z-index:2!important;
    min-width:0!important;
    min-height:58px!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:space-between!important;
    gap:9px!important;
}
.app-post-title{
    min-width:0!important;
    min-height:23px!important;
    max-height:46px!important;
    display:block!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    color:#132338!important;
    font-size:16px!important;
    line-height:1.38!important;
    font-weight:950!important;
    letter-spacing:0!important;
    word-break:break-word!important;
}
.app-post-foot{
    width:100%!important;
    min-width:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:8px!important;
    margin:0!important;
    padding:0!important;
}
.app-post-price{
    flex:0 0 auto!important;
    display:inline-flex!important;
    align-items:center!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    background:transparent!important;
    color:#0aa875!important;
    font-size:13px!important;
    line-height:1!important;
    font-weight:950!important;
    white-space:nowrap!important;
}
.app-post-price.is-sell{
    color:#ef334d!important;
}
.app-post-stats{
    min-width:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:7px!important;
    overflow:hidden!important;
    color:#5a6d80!important;
    font-size:12px!important;
    line-height:1!important;
    font-weight:900!important;
    white-space:nowrap!important;
}
.app-post-stats span{
    flex:0 0 auto!important;
    min-width:0!important;
}
.app-post-empty,
.app-post-pages{
    margin:0!important;
    padding:12px!important;
    border:1px solid #d3dee8!important;
    border-radius:0!important;
    background:#fff!important;
    color:#5a6d80!important;
    text-align:center!important;
    font-weight:900!important;
}
@media(max-width:600px){
    .app-post-card{
        min-height:78px!important;
        padding:11px 8px 9px 62px!important;
    }
    .app-post-ribbon{
        top:8px!important;
        left:-23px!important;
        width:82px!important;
        height:21px!important;
        font-size:10px!important;
        line-height:21px!important;
    }
    .app-post-ribbon > span{
        font-size:10px!important;
        line-height:21px!important;
    }
    .app-post-title{
        font-size:15px!important;
        line-height:1.36!important;
    }
    .app-post-main{
        min-height:56px!important;
        gap:8px!important;
    }
    .app-post-foot{
        gap:6px!important;
    }
    .app-post-stats{
        gap:6px!important;
        font-size:12px!important;
    }
}
