/* =========================================================
   DANANG2NITE — PHASE 79
   EN PC MAGAZINE LIST + VIEW FINAL POLISH
   - LIST: every real article = equal 3-column 16:9 card
   - LIST: hide generated uploading placeholders
   - VIEW: restore true viewport sticky Article Index
   - VIEW: slightly tighten article-end/footer handoff
   Loaded last, EN desktop only.
   ========================================================= */

@media (min-width:821px){
  /* -------------------------------------------------------
     MAGAZINE LIST — UNIFORM 3-COLUMN EDITORIAL GRID
     ------------------------------------------------------- */
  html[lang="en"] body.page-magazine-list .d2n-index-grid{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:16px!important;
    align-items:stretch!important;
    grid-auto-flow:row!important;
  }

  html[lang="en"] body.page-magazine-list .d2n-index-card,
  html[lang="en"] body.page-magazine-list .d2n-index-card:first-child,
  html[lang="en"] body.page-magazine-list .d2n-index-card:not(:first-child){
    grid-column:auto!important;
    grid-row:auto!important;
    position:relative!important;
    display:flex!important;
    flex-direction:column!important;
    min-width:0!important;
    min-height:0!important;
    overflow:hidden!important;
    border-radius:20px!important;
  }

  html[lang="en"] body.page-magazine-list .d2n-index-card__media,
  html[lang="en"] body.page-magazine-list .d2n-index-card:first-child .d2n-index-card__media,
  html[lang="en"] body.page-magazine-list .d2n-index-card:not(:first-child) .d2n-index-card__media{
    position:relative!important;
    inset:auto!important;
    width:100%!important;
    min-height:0!important;
    aspect-ratio:16/9!important;
    flex:0 0 auto!important;
    overflow:hidden!important;
    background:#09090b!important;
  }

  html[lang="en"] body.page-magazine-list .d2n-index-card__media img,
  html[lang="en"] body.page-magazine-list .d2n-index-card:first-child .d2n-index-card__media img{
    width:100%!important;
    height:100%!important;
    display:block!important;
    object-fit:contain!important;
    object-position:center!important;
    background:#09090b!important;
  }

  html[lang="en"] body.page-magazine-list .d2n-index-card__number,
  html[lang="en"] body.page-magazine-list .d2n-index-card:first-child .d2n-index-card__number{
    top:14px!important;
    right:14px!important;
    bottom:auto!important;
    width:38px!important;
    height:38px!important;
    font-size:10px!important;
  }

  html[lang="en"] body.page-magazine-list .d2n-index-card__body,
  html[lang="en"] body.page-magazine-list .d2n-index-card:first-child .d2n-index-card__body,
  html[lang="en"] body.page-magazine-list .d2n-index-card:not(:first-child) .d2n-index-card__body{
    position:relative!important;
    inset:auto!important;
    width:100%!important;
    min-height:196px!important;
    padding:19px 19px 17px!important;
    display:flex!important;
    flex:1 1 auto!important;
    flex-direction:column!important;
  }

  html[lang="en"] body.page-magazine-list .d2n-index-card h2,
  html[lang="en"] body.page-magazine-list .d2n-index-card:first-child h2,
  html[lang="en"] body.page-magazine-list .d2n-index-card:not(:first-child) h2{
    max-width:100%!important;
    margin-top:9px!important;
    font-size:23px!important;
    line-height:1.09!important;
    letter-spacing:-.5px!important;
    text-shadow:none!important;
    display:-webkit-box!important;
    -webkit-box-orient:vertical!important;
    -webkit-line-clamp:2!important;
    overflow:hidden!important;
  }

  html[lang="en"] body.page-magazine-list .d2n-index-card p,
  html[lang="en"] body.page-magazine-list .d2n-index-card:first-child p,
  html[lang="en"] body.page-magazine-list .d2n-index-card:not(:first-child) p{
    max-width:100%!important;
    margin-top:10px!important;
    font-size:13px!important;
    line-height:1.48!important;
    -webkit-line-clamp:2!important;
  }

  html[lang="en"] body.page-magazine-list .d2n-index-card__foot{
    margin-top:auto!important;
    padding-top:11px!important;
  }

  /* Uploading slots are layout fillers, not public editorial cards. */
  html[lang="en"] body.page-magazine-list .d2n-index-card.is-placeholder{
    display:none!important;
  }

  /* -------------------------------------------------------
     MAGAZINE VIEW — TRUE STICKY ARTICLE INDEX
     site-main overflow:hidden was creating the sticky scroll
     container, so the rail stopped tracking the viewport.
     ------------------------------------------------------- */
  html[lang="en"] body.page-magazine-view .site-main{
    overflow:visible!important;
  }

  html[lang="en"] body.page-magazine-view .magazine-reading{
    align-items:start!important;
  }

  html[lang="en"] body.page-magazine-view .magazine-reading__rail{
    position:sticky!important;
    top:118px!important;
    align-self:start!important;
    height:max-content!important;
    z-index:4!important;
  }

  html[lang="en"] body.page-magazine-view .magazine-toc{
    max-height:calc(100vh - 260px)!important;
    overscroll-behavior:contain;
  }

  /* Slightly reduce the empty handoff before the global footer. */
  html[lang="en"] body.page-magazine-view .magazine-article-end{
    margin-top:52px!important;
    padding-top:22px!important;
    padding-bottom:46px!important;
  }
}