/* =============================================
   Ver.1391 - Mobile home work thumbnails match PC home trim contract
   - Home latest/recommended uses representative images in a fixed 147/200 output box.
   - Mobile carousel now keeps that same box and allows wd_smart_matte_trim.js to
     remove only near-white outer matte from the displayed image.
   - The original image file/DB value is not changed.
   - References: MDN aspect-ratio, object-fit/object-position, HTMLElement dataset.
   ============================================= */
@media (max-width:720px){
  html body.page-home .home .home-workgrid > .home-worktile > .home-worktile__img,
  html body.page-home .home .home-workgrid > .home-worktile > .home-worktile__img.is-wd-matte-trimmed,
  html body.page-home .home .home-workgrid > .home-worktile > .home-worktile__img[data-wd-smart-trim-mode],
  html body.public-dark.page-home .home .home-workgrid > .home-worktile > .home-worktile__img,
  html body.public-dark.page-home .home .home-workgrid > .home-worktile > .home-worktile__img.is-wd-matte-trimmed,
  html body.public-dark.page-home .home .home-workgrid > .home-worktile > .home-worktile__img[data-wd-smart-trim-mode]{
    position:relative !important;
    display:block !important;
    width:100% !important;
    inline-size:100% !important;
    height:auto !important;
    block-size:auto !important;
    aspect-ratio:var(--javyun-rep-output-ratio, 147 / 200) !important;
    min-height:0 !important;
    max-height:none !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    background-color:transparent !important;
    box-shadow:none !important;
    overflow:hidden !important;
    line-height:0 !important;
  }

  html body.page-home .home .home-workgrid > .home-worktile > .home-worktile__img > img,
  html body.public-dark.page-home .home .home-workgrid > .home-worktile > .home-worktile__img > img{
    display:block !important;
    position:static !important;
    inset:auto !important;
    width:100% !important;
    inline-size:100% !important;
    height:100% !important;
    block-size:100% !important;
    max-width:100% !important;
    max-height:100% !important;
    min-width:0 !important;
    min-height:0 !important;
    aspect-ratio:auto !important;
    object-fit:cover !important;
    object-position:center top !important;
    transform:none !important;
    background:transparent !important;
    background-color:transparent !important;
    border:0 !important;
    border-radius:inherit !important;
    box-shadow:none !important;
  }

  html body.page-home .home .home-workgrid > .home-worktile > .home-worktile__img[data-wd-smart-trim-mode="fixed-contain"] > img.is-wd-matte-trimmed-img,
  html body.public-dark.page-home .home .home-workgrid > .home-worktile > .home-worktile__img[data-wd-smart-trim-mode="fixed-contain"] > img.is-wd-matte-trimmed-img{
    display:block !important;
    position:absolute !important;
    left:var(--wd-smart-trim-left, 0%) !important;
    top:var(--wd-smart-trim-top, 0%) !important;
    z-index:1 !important;
    width:var(--wd-smart-trim-width, 100%) !important;
    inline-size:var(--wd-smart-trim-width, 100%) !important;
    height:var(--wd-smart-trim-height, auto) !important;
    block-size:var(--wd-smart-trim-height, auto) !important;
    max-width:none !important;
    max-height:none !important;
    min-width:0 !important;
    min-height:0 !important;
    aspect-ratio:auto !important;
    object-fit:contain !important;
    object-position:center center !important;
    transform:none !important;
    transform-origin:0 0 !important;
    background:transparent !important;
    background-color:transparent !important;
    border:0 !important;
    border-radius:0 !important;
    box-shadow:none !important;
  }

  html body.page-home .home .home-worktile__img.is-wd-matte-trimmed :is(.home-worktile__tag, .home-worktile__subtitle),
  html body.public-dark.page-home .home .home-worktile__img.is-wd-matte-trimmed :is(.home-worktile__tag, .home-worktile__subtitle){
    z-index:4 !important;
  }
}
