:root{
    --bg:#f7f8fb;
    --panel:#ffffff;
    --text:#0f172a;
    --muted:#64748b;
    --soft:#94a3b8;
    --line:#e9eef5;
    --primary:#1d4ed8;
    --primary-dark:#163ba7;
    --shadow:0 12px 36px rgba(15,23,42,.05);
}

body.news-normal-list-page{
    background:
        radial-gradient(circle at top left, rgba(37,99,235,.035), transparent 30%),
        radial-gradient(circle at top right, rgba(15,23,42,.03), transparent 28%),
        var(--bg);
    color:var(--text);
}

.news-list-section{
    padding:30px 0 44px;
}

.main-body-with-sidebar{
    display:flex;
    align-items:flex-start;
    gap:40px;
}

.main-content{
    flex:1;
    min-width:0;
}

.news-sidebar{
    width:320px;
    flex-shrink:0;
}

.news-list-header{
    padding:0 0 22px;
    margin-bottom:10px;
    border-bottom:1px solid var(--line);
}

.news-list-kicker{
    font-size:12px;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.12em;
    color:var(--primary);
    margin-bottom:10px;
}

.news-list-heading{
    margin:0;
    font-size:42px;
    line-height:1.08;
    letter-spacing:-.04em;
    font-weight:900;
    color:var(--text);
}

.news-list-subheading{
    margin:12px 0 0;
    max-width:780px;
    font-size:15px;
    line-height:1.8;
    color:var(--muted);
}

.news-stream{
    display:flex;
    flex-direction:column;
}

.news-item{
    padding:24px 0;
    border-bottom:1px solid var(--line);
}

.news-item:first-child{
    padding-top:22px;
}

.news-item-inner{
    padding-right:6px;
}

.news-item-topline{
    display:flex;
    justify-content:left;
    align-items:center;
    gap:16px;
    margin-bottom:12px;
}

.news-category-row{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:0;
    font-size:12px;
    text-transform:uppercase;
    letter-spacing:.08em;
}

.news-category-row a{
    color:var(--primary-dark);
    font-weight:800;
    text-decoration:none;
}

.news-category-row a:hover{
    color:var(--primary);
}

.cat-divider{
    margin:0 8px;
    color:#c4cfdd;
}

.news-meta-row{
    display:flex;
    align-items:center;
    gap:10px;
    flex-shrink:0;
    font-size:12px;
    color:var(--soft);
    white-space:nowrap;
}

.news-time{
    color:#475569;
    font-weight:600;
}

.news-title{
    margin:0 0 12px;
    font-size:31px;
    line-height:1.24;
    letter-spacing:-.03em;
    font-weight:900;
    max-width:920px;
}

.news-title a{
    color:var(--text);
    text-decoration:none;
    transition:.2s ease;
}

.news-title a:hover{
    color:var(--primary);
}

.news-excerpt p{
    margin:0;
    max-width:860px;
    font-size:16px;
    line-height:1.82;
    color:#475569;
}

.news-bottom-row{
    margin-top:14px;
}

.news-readmore{
    display:inline-flex;
    align-items:center;
    text-decoration:none;
    color:var(--primary);
    font-size:14px;
    font-weight:800;
    letter-spacing:.01em;
    transition:.2s ease;
}

.news-readmore:hover{
    color:var(--primary-dark);
    transform:translateX(2px);
}

.news-pagination{
    margin-top:28px;
}

/* Sidebar */
.sidebar-widget{
    background:rgba(255,255,255,.82);
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
    border:1px solid rgba(233,238,245,.95);
    border-radius:20px;
    box-shadow:var(--shadow);
    overflow:hidden;
    margin-bottom:18px;
}

.widget-title{
    margin:0;
    padding:18px 18px 12px;
    font-size:15px;
    font-weight:800;
    letter-spacing:.01em;
    color:var(--text);
}

.widget-content{
    padding:0 18px 18px;
}

.news-sidebar-list,
.sticky-sidebar-list,
.apps-compact-list{
    list-style:none;
    margin:0;
    padding:0;
}

.news-sidebar-item,
.sticky-sidebar-item,
.apps-compact-item{
    border-bottom:1px solid var(--line);
}

.news-sidebar-item:last-child,
.sticky-sidebar-item:last-child,
.apps-compact-item:last-child{
    border-bottom:none;
}

.news-sidebar-link{
    display:block;
    padding:12px 0;
    text-decoration:none;
}

.news-sidebar-title{
    display:block;
    font-size:14px;
    line-height:1.55;
    color:var(--text);
    font-weight:700;
    margin-bottom:6px;
    transition:.2s ease;
}

.news-sidebar-link:hover .news-sidebar-title{
    color:var(--primary);
}

.news-sidebar-meta{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:10px;
    font-size:12px;
    color:var(--soft);
}

/* Recommended */
.sticky-sidebar-link{
    display:flex;
    align-items:flex-start;
    gap:12px;
    padding:14px 0;
    text-decoration:none;
}

.sticky-index{
    width:28px;
    height:28px;
    border-radius:50%;
    border:1px solid #dbe5f2;
    color:#1e3a8a;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:12px;
    font-weight:800;
    flex-shrink:0;
    margin-top:1px;
    background:#fff;
}

.sticky-info{
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:5px;
}

.sticky-title{
    font-size:14px;
    line-height:1.56;
    color:var(--text);
    font-weight:700;
    transition:.2s ease;
}

.sticky-sidebar-link:hover .sticky-title{
    color:var(--primary);
}

.sticky-views{
    font-size:12px;
    color:var(--soft);
}

/* Hot Apps compact */
.apps-compact-link{
    display:flex;
    align-items:center;
    gap:12px;
    padding:12px 0;
    text-decoration:none;
}

.apps-compact-icon{
    width:40px;
    height:40px;
    flex-shrink:0;
}

.apps-compact-icon img{
    display:block;
    width:40px;
    height:40px;
    border-radius:12px;
    object-fit:cover;
}

.apps-compact-info{
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:4px;
}

.apps-compact-title{
    display:block;
    color:var(--text);
    font-size:14px;
    line-height:1.4;
    font-weight:800;
    transition:.2s ease;
}

.apps-compact-link:hover .apps-compact-title{
    color:var(--primary);
}

.apps-compact-meta{
    display:block;
    color:var(--muted);
    font-size:12px;
    line-height:1.45;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}

@media (max-width: 1100px){
    .main-body-with-sidebar{
        gap:28px;
    }

    .news-sidebar{
        width:300px;
    }

    .news-list-heading{
        font-size:36px;
    }

    .news-title{
        font-size:27px;
    }
}

@media (max-width: 860px){
    .main-body-with-sidebar{
        flex-direction:column;
    }

    .news-sidebar{
        width:100%;
    }

    .news-item-topline{
        flex-direction:column;
        align-items:flex-start;
    }

    .news-list-heading{
        font-size:30px;
    }

    .news-title{
        font-size:24px;
    }
}

@media (max-width: 640px){
    .news-list-section{
        padding:18px 0 30px;
    }

    .news-list-heading{
        font-size:26px;
    }

    .news-list-subheading{
        font-size:14px;
    }

    .news-item{
        padding:18px 0;
    }

    .news-title{
        font-size:21px;
        line-height:1.32;
    }

    .news-excerpt p{
        font-size:14px;
    }
}