/* #487: exact DX Best reference declarations; selectors retargeted to Lotte only. */

@media (min-width:500px){
  html body.lotte-dx-best-page #checklist{max-width:none!important;padding-left:clamp(20px,2.5vw,48px)!important;padding-right:clamp(20px,2.5vw,48px)!important;}
  html body.lotte-dx-best-page #checklist > .sets-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important;}
}
@media (min-width:901px){html body.lotte-dx-best-page #checklist > .sets-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important;}}
@media (min-width:1301px){html body.lotte-dx-best-page #checklist > .sets-grid{grid-template-columns:repeat(6,minmax(0,1fr))!important;}}


/* The uploader credit never sits ON the photo. The full-width credit rule
   above also caught the copy nested inside the photo wells, which painted
   the handle across the image. Slot-nested credits return to the site
   default: the small caption right under the photo. */
body.lotte-dx-best-page .sets-grid > .set-tile:not(.pack-art-tile):not(.tcg-set-tile):not(.fp3):not(.fp4):has(> .ph-f) .ph-f > .ht-credit,
body.lotte-dx-best-page .sets-grid > .set-tile:not(.pack-art-tile):not(.tcg-set-tile):not(.fp3):not(.fp4):has(> .ph-f) .ph-b > .ht-credit{
  position:absolute !important; top:calc(100% + 2px) !important;
  left:0 !important; right:0 !important; width:auto !important;
  max-width:100% !important; margin:0 !important; padding:0 2px !important;
  grid-column:auto !important;
}
/* the well must not clip the caption hanging under it */
body.lotte-dx-best-page .sets-grid > .set-tile:not(.pack-art-tile):not(.tcg-set-tile):not(.fp3):not(.fp4):has(> .ph-f) .ph-f:has(> .ht-credit),
body.lotte-dx-best-page .sets-grid > .set-tile:not(.pack-art-tile):not(.tcg-set-tile):not(.fp3):not(.fp4):has(> .ph-f) .ph-b:has(> .ht-credit){ overflow:hidden !important; }


/* #398: fluid mobile photo pairs on this checklist only. */
@layer ht-ensky-dx-mobile-photos-398 {
  @media (max-width: 600px) {
    html:has(link[rel="canonical"][href^="https://www.hiddentemplecollectibles.com/pages/pokemon-lotte-wafer-"]) body .sets-wrap > .sets-grid {
      grid-template-columns: minmax(0, 1fr) !important;
    }
    html:has(link[rel="canonical"][href^="https://www.hiddentemplecollectibles.com/pages/pokemon-lotte-wafer-"]) body .sets-wrap > .sets-grid > .set-tile:not(.pack-art-tile):has(> .ph-f) {
      grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
    html:has(link[rel="canonical"][href^="https://www.hiddentemplecollectibles.com/pages/pokemon-lotte-wafer-"]) body .sets-wrap > .sets-grid > .set-tile:not(.pack-art-tile) > :is(.ph-f, .ph-b) {
      width: 100% !important;
      min-width: 0 !important;
      max-width: none !important;
      height: auto !important;
      aspect-ratio: 1 / 1 !important;
    }
  }
}
/* At the existing 600px zoom transition, keep mobile controls usable. */
@layer ht-catalog-mobile-targets {
  @media (min-width: 600px) and (max-width: 600px) {
    html:has(link[rel="canonical"][href^="https://www.hiddentemplecollectibles.com/pages/pokemon-lotte-wafer-"]) body .sets-wrap .ht-addphoto {
      min-height: 52px !important;
      font-size: 16px !important;
      line-height: 1.2 !important;
    }
  }
}

/* #400: readable contributor captions below unchanged DX Best photos. */
@layer ht-ensky-dx-credits-400 {
  html:has(link[rel="canonical"][href^="https://www.hiddentemplecollectibles.com/pages/pokemon-lotte-wafer-"]) body .sets-grid {
    align-items: stretch !important;
  }
  html:has(link[rel="canonical"][href^="https://www.hiddentemplecollectibles.com/pages/pokemon-lotte-wafer-"]) body .set-tile :is(.ph-f, .ph-b).has-img:has(> .ht-credit) {
    overflow: visible !important;
    margin-bottom: 60px !important;
  }
  html:has(link[rel="canonical"][href^="https://www.hiddentemplecollectibles.com/pages/pokemon-lotte-wafer-"]) body .set-tile :is(.ph-f, .ph-b) > .ht-credit {
    top: calc(100% + 4px) !important;
    bottom: auto !important;
    height: auto !important;
    max-height: none !important;
    min-height: 44px !important;
    min-width: 44px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 2px 4px !important;
    font-size: 13px !important;
    line-height: 1.3 !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    word-break: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    -webkit-line-clamp: unset !important;
    background: transparent !important;
  }
  @media (min-width: 600px) {
    html:has(link[rel="canonical"][href^="https://www.hiddentemplecollectibles.com/pages/pokemon-lotte-wafer-"]) body .set-tile :is(.ph-f, .ph-b).has-img:has(> .ht-credit) {
      margin-bottom: 72px !important;
    }
    html:has(link[rel="canonical"][href^="https://www.hiddentemplecollectibles.com/pages/pokemon-lotte-wafer-"]) body .set-tile :is(.ph-f, .ph-b) > .ht-credit {
      font-size: 16px !important;
      min-height: 52px !important;
      min-width: 52px !important;
    }
  }
  @media (min-width: 1300px) {
    html:has(link[rel="canonical"][href^="https://www.hiddentemplecollectibles.com/pages/pokemon-lotte-wafer-"]) body .set-tile :is(.ph-f, .ph-b) > .ht-credit {
      font-size: 16.25px !important;
      min-height: 55px !important;
      min-width: 55px !important;
    }
  }
}
/* Compensate the existing desktop body zoom in its control layer. */
@layer ht-catalog-mobile-targets {
  @media (min-width: 600px) {
    html:has(link[rel="canonical"][href^="https://www.hiddentemplecollectibles.com/pages/pokemon-lotte-wafer-"]) body :is(.sets-wrap .ht-addphoto, .htc-orow button) {
      min-height: 52px !important;
      min-width: 52px !important;
      font-size: 16px !important;
      line-height: 1.2 !important;
    }
    html:has(link[rel="canonical"][href^="https://www.hiddentemplecollectibles.com/pages/pokemon-lotte-wafer-"]) body .htc-orow button .htbtn-lbl {
      font-size: 16px !important;
      line-height: 1.2 !important;
    }
  }
  @media (min-width: 1300px) {
    html:has(link[rel="canonical"][href^="https://www.hiddentemplecollectibles.com/pages/pokemon-lotte-wafer-"]) body :is(.sets-wrap .ht-addphoto, .htc-orow button) {
      min-height: 55px !important;
      min-width: 55px !important;
      font-size: 16.25px !important;
    }
    html:has(link[rel="canonical"][href^="https://www.hiddentemplecollectibles.com/pages/pokemon-lotte-wafer-"]) body .htc-orow button .htbtn-lbl {
      font-size: 16.25px !important;
    }
  }
}

/* Retain the already-published Lotte About readability floor; no reference defect copied. */
@layer ht-catalog-mobile-targets {
  html body.lotte-dx-best-page { --lotte-ui-scale:1; }
  html body.lotte-dx-best-page .set-desc :is(.b,p,li) { font-size:calc(16px * var(--lotte-ui-scale))!important; line-height:1.5!important; }
  @media(min-width:600px) { html body.lotte-dx-best-page { --lotte-ui-scale:1.176471; } }
  @media(min-width:1300px) { html body.lotte-dx-best-page { --lotte-ui-scale:1.25; } }
}