/* M1 Latest–Popular + Kartu Terkini shared mobile authority.
 * Mobile only (<=480px). Home and Category consume the exact same card design.
 * Desktop is OWNER LOCKED and this file intentionally contains no desktop rules.
 * Data, ranking, ads, loaders and Popular internals remain unchanged. */
@media (max-width:480px){
  /* Shared module order: Terkini first, Terpopuler below. */
  .pe-latest-popular-layout,
  .pe-latest-popular-layout.pe-m1-has-rail{
    display:flex!important;
    flex-direction:column!important;
    width:100%!important;
  }
  .pe-latest-popular-main,.pe-m1-main{
    order:1!important;
    width:100%!important;
  }
  .pe-latest-popular-rail,.pe-m1-rail{
    order:2!important;
    width:100%!important;
    margin:32px 0 0!important;
  }

  /* One mobile stream rhythm: Lead -> Row, Row -> Row, Row -> Ad, Ad -> Row. */
  .pe-latest-card-stream .pe-latest-list{
    display:flex!important;
    flex-direction:column!important;
    gap:20px!important;
  }
  .pe-latest-card-stream .pe-latest-list>.pmb-card-latest,
  .pe-latest-card-stream .pe-latest-list>.pe-latest-inline-ad{
    margin:0!important;
  }

  /* Canonical mobile Kartu Terkini geometry shared by Home + Category. */
  .pe-latest-card-stream .pmb-card-latest{
    display:grid!important;
    align-items:center!important;
    border-bottom:0!important;
  }
  .pe-latest-card-stream .pmb-card-latest.is-lead{
    grid-template-columns:minmax(0,1fr) minmax(140px,45%)!important;
    gap:12px!important;
    padding:14px!important;
  }
  .pe-latest-card-stream .pmb-card-latest.is-lead .pmb-card-latest-media{
    grid-column:2!important;
    grid-row:1!important;
    width:100%!important;
    height:124px!important;
  }
  .pe-latest-card-stream .pmb-card-latest.is-lead .pmb-card-latest-copy{
    grid-column:1!important;
    grid-row:1!important;
  }
  .pe-latest-card-stream .pmb-card-latest.is-row{
    grid-template-columns:108px minmax(0,1fr)!important;
    gap:12px!important;
    padding:0!important;
  }
  .pe-latest-card-stream .pmb-card-latest.is-row .pmb-card-latest-media{
    width:108px!important;
    height:92px!important;
  }

  /* Mobile content hierarchy: Title -> Relative Time. Category is hidden. */
  .pe-latest-card-stream .pmb-card-latest-copy{
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    min-width:0!important;
  }
  .pe-latest-card-stream .pmb-card-latest-meta,
  .pe-latest-card-stream .pmb-card-latest-category,
  .pe-latest-card-stream .pmb-card-latest-dot{
    display:none!important;
  }
  .pe-latest-card-stream .pmb-card-latest-title{
    order:1!important;
    margin:0 0 6px!important;
    min-width:0!important;
  }
  .pe-latest-card-stream .pmb-card-latest-time{
    order:2!important;
    display:block!important;
    margin:0!important;
    min-width:0!important;
  }

  /* Owner-locked mobile clamp: Lead and Row both max 3 lines. */
  .pe-latest-card-stream .pmb-card-latest.is-lead .pmb-card-latest-title a,
  .pe-latest-card-stream .pmb-card-latest.is-row .pmb-card-latest-title a{
    display:-webkit-box!important;
    -webkit-box-orient:vertical!important;
    -webkit-line-clamp:3!important;
    line-clamp:3!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
}

@media (max-width:360px){
  .pe-latest-card-stream .pmb-card-latest.is-lead{
    grid-template-columns:minmax(0,1fr) minmax(126px,43%)!important;
    gap:10px!important;
    padding:12px!important;
  }
  .pe-latest-card-stream .pmb-card-latest.is-lead .pmb-card-latest-media{
    height:110px!important;
  }
}