/* Mobile enhancement for portal list pages + homepage
   Pure media query: PC layout and URL stay untouched.
   Loaded only when viewport <= 820px. */

@media (max-width: 820px) {

  /* =========================================================
     Channel list page
     ========================================================= */

  #pt {
    background: #f6f8fb;
    padding: 10px 0 !important;
    margin: 0 !important;
    font-size: 12px !important;
    line-height: 1.6 !important;
    color: #98a2b3 !important;
  }
  #pt .z { float: none !important; width: 100% !important; }
  #pt .nvhm { display: none !important; }
  #pt em { color: #c3cbd8; }

  .ct2.container-v2 { padding: 0 !important; }
  body .ct2 .mn { width: 100% !important; float: none !important; }
  .ct2 .sd { display: none !important; }
  .ct2 .bm { border: 0 !important; background: transparent !important; }
  .ct2 .bm_h { display: none !important; }

  /* sub categories / intro row */
  .ct2 .bm_c.bbda {
    padding: 10px 16px !important;
    margin: 0 !important;
    background: #f6f8fb;
    border: 0 !important;
    font-size: 13px !important;
    line-height: 1.7 !important;
    color: #8b94a6 !important;
  }
  .ct2 .bm_c.bbda a {
    display: inline-block;
    margin: 2px 6px 2px 0;
    padding: 2px 10px;
    border-radius: 999px;
    background: #eef2f9;
    color: #365598 !important;
    font-size: 12px !important;
    text-decoration: none;
  }

  /* article rows */
  .bm_c.xld { padding: 0 !important; background: #fff; }
  .bm_c.xld > dl {
    margin: 0 !important;
    padding: 16px !important;
    border-bottom: 1px solid #f1f3f7 !important;
    background: #fff;
  }
  .bm_c.xld > dl:active { background: #fafbfd; }
  .bm_c.xld > dl > dt {
    font-size: 17px !important;
    line-height: 1.5 !important;
    font-weight: 700 !important;
    color: #141922 !important;
    text-align: left !important;
  }
  .bm_c.xld > dl > dt a {
    display: block;
    color: #141922 !important;
    font-weight: 700 !important;
    line-height: 1.5 !important;
    text-decoration: none;
  }
  .bm_c.xld > dl > dt font { font-weight: 700 !important; }
  .bm_c.xld > dl > dd.xs2 > div {
    margin-top: 8px;
    font-size: 14px !important;
    line-height: 1.7 !important;
    color: #6b7484 !important;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .bm_c.xld > dl > dd.xs2 > div:empty { display: none; }
  .bm_c.xld > dl > dd:last-child {
    margin-top: 10px;
    font-size: 12px !important;
    line-height: 1.6 !important;
    color: #9aa3b2 !important;
  }
  .bm_c.xld > dl > dd:last-child label a {
    display: inline-block;
    padding: 2px 9px;
    border-radius: 999px;
    background: #eef2f9;
    color: #365598 !important;
    font-size: 12px !important;
    text-decoration: none;
  }
  .bm_c.xld > dl > dd:last-child .xg1 { color: #a2aab8 !important; }

  /* pagination */
  .pgs { padding: 18px 16px 26px !important; text-align: center; }
  .pgs .pg {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 8px;
    font-size: 14px !important;
  }
  .pgs .pg a,
  .pgs .pg strong {
    display: inline-block;
    min-width: 34px;
    height: 34px;
    line-height: 34px;
    padding: 0 8px;
    border-radius: 8px;
    background: #f2f5fa;
    color: #5b6474 !important;
    font-size: 14px !important;
    text-decoration: none;
  }
  .pgs .pg strong {
    background: #365598;
    color: #fff !important;
    font-weight: 700;
  }
  .pgs .pg a.nxt { padding: 0 14px; color: #365598 !important; }
  .pgs .pg label { display: none !important; }

  /* =========================================================
     Homepage
     ========================================================= */

  .bigtitle {
    padding: 14px 16px 0 !important;
    margin: 0 !important;
    font-size: 21px !important;
    line-height: 1.5 !important;
    text-align: left !important;
    font-weight: 800 !important;
  }
  .bigtitle a,
  .bigtitle font { color: #141922 !important; }

  #wp .fline { display: none !important; }

  /* top banner ads */
  #wp .ad {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 16px;
    box-sizing: border-box;
    margin: 10px 0 0 !important;
  }
  #wp .ad .z,
  #wp .ad .y {
    float: none !important;
    width: 100% !important;
  }
  #wp .ad img {
    max-width: 100% !important;
    width: auto !important;
    height: auto !important;
    margin: 0 auto 8px !important;
    display: block;
  }

  /* headline + 要闻 */
  .ywclass {
    display: block !important;
    padding: 12px 16px 0 !important;
  }
  .ywclass .slide {
    width: 100% !important;
    height: auto !important;
  }
  .ywclass .slide img {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 16 / 10;
    object-fit: cover;
    border-radius: 10px;
  }
  .ywclass .slide .title {
    font-size: 15px !important;
    line-height: 1.45 !important;
  }
  .ywclass .yaowen {
    width: 100% !important;
    margin-top: 6px;
  }
  .ywclass .yaowen > dd { display: none !important; }
  .ywclass .yaowen .content li {
    padding: 12px 0 !important;
    font-size: 16px !important;
    line-height: 1.6 !important;
    border-bottom: 1px solid #f1f3f7 !important;
  }
  .ywclass .yaowen .content li a { color: #232a35; }

  /* rolling topic banner */
  .gdzt {
    height: auto !important;
    margin: 14px 16px !important;
    padding: 0 !important;
  }
  .gdzt .swiper-slide img {
    width: 100% !important;
    height: auto !important;
    border-radius: 8px;
  }

  /* section titles */
  .news-center-title {
    padding: 18px 16px 2px !important;
    margin: 0 !important;
  }
  .news-center-title span {
    font-size: 19px !important;
    padding-left: 12px !important;
    border-left-width: 4px !important;
  }
  .news-center-title small { display: none !important; }
  .news-center-title .img { display: none !important; }

  /* news center grid */
  .news-center-margin {
    display: block !important;
    padding: 0 16px !important;
  }
  .news-center-margin .newslist,
  .news-center-margin .gygg {
    width: 100% !important;
  }
  .news-center {
    display: block !important;
    padding: 0 !important;
  }
  .news-center .news-block {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    font-size: 15px !important;
  }
  .news-center .news-block .title {
    height: auto !important;
    border-bottom: 0 !important;
    margin: 16px 0 2px !important;
  }
  .news-center .news-block .title span {
    width: auto !important;
    line-height: 1.5 !important;
    border-bottom: 0 !important;
    font-size: 17px !important;
    color: #141922 !important;
    display: inline-block !important;
  }
  .news-center .news-block .title a { color: #141922 !important; }
  .news-center .news-block .content {
    padding: 4px 0 8px !important;
  }
  .news-center .news-block .content li {
    font-size: 15.5px !important;
    line-height: 1.6 !important;
    padding: 10px 0 !important;
    border-bottom: 1px solid #f4f6f9;
  }
  .news-center .news-block .content li:last-child { border-bottom: 0; }

  /* public-service ad carousel */
  .news-center-margin .gygg {
    margin-top: 10px;
  }
  .news-center-margin .gygg img {
    width: 100% !important;
    height: auto !important;
    border-radius: 10px;
  }

  /* video center: two per row */
  .news-center.video-center {
    display: flex !important;
    flex-wrap: wrap;
    gap: 10px;
    padding: 4px 16px 8px !important;
  }
  .video-center .news-block {
    width: calc(50% - 5px) !important;
    margin: 0 !important;
  }
  .video-center .news-block i { margin-bottom: 6px !important; }
  .video-center .news-block i img {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    border-radius: 8px;
  }
  .video-center .news-block span {
    font-size: 13px !important;
    line-height: 1.45 !important;
    color: #39465d;
  }
  .video-center .news-block .vlogo {
    width: 26px !important;
    height: auto !important;
    left: 6px !important;
    bottom: 42px !important;
  }

  /* friend links */
  .link {
    padding: 8px 16px 24px !important;
  }
  .link p {
    font-size: 12px !important;
    line-height: 2 !important;
    color: #9aa3b2 !important;
  }
  .link p a {
    display: inline-block;
    margin-right: 10px;
    font-size: 12px !important;
    color: #6b7484 !important;
  }
}