@layer pages {
/* =========================================================
   Ver.1375 - Public work list mobile one-item layout
   Reference layout: simple hentry-style list, 4 desktop columns,
   thumbnail first, no nested card frame, 320x216 landscape cover. Mobile phone view defaults to one work per row.
   This file is intentionally loaded after public_mobile_media_1329.css
   so earlier contain/smart-trim mobile rules cannot shrink work-list
   thumbnails into a dark inner box.
========================================================= */

:is(.work-list-page, .maker-detail-page) .wl-results-shell{
  padding:14px 0 0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}

:is(.work-list-page, .maker-detail-page) .works-grid.works-category-grid{
  display:grid !important;
  grid-template-columns:repeat(4, minmax(0, 1fr)) !important;
  gap:24px 20px !important;
  align-items:start !important;
  grid-auto-rows:auto !important;
}

:is(.work-list-page, .maker-detail-page) .works-grid.works-category-grid > a.work-card,
:is(.work-list-page, .maker-detail-page) .work-card.work-list-card{
  display:block !important;
  width:100% !important;
  height:auto !important;
  min-width:0 !important;
  max-width:none !important;
  color:inherit !important;
  text-decoration:none !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  overflow:visible !important;
  transform:none !important;
  transition:none !important;
}

:is(.work-list-page, .maker-detail-page) .work-card.work-list-card:hover{
  transform:none !important;
  border-color:transparent !important;
  box-shadow:none !important;
}

:is(.work-list-page, .maker-detail-page) .work-card.work-list-card .work-thumb,
:is(.work-list-page, .maker-detail-page) .works-category-grid .work-thumb,
:is(.work-list-page, .maker-detail-page) .works-category-grid .work-thumb.is-wd-matte-trimmed{
  position:relative !important;
  width:100% !important;
  aspect-ratio:320 / 216 !important;
  height:auto !important;
  min-height:0 !important;
  border-radius:0 !important;
  overflow:hidden !important;
  background:transparent !important;
  flex:0 0 auto !important;
}

:is(.work-list-page, .maker-detail-page) .work-card.work-list-card .work-cover,
:is(.work-list-page, .maker-detail-page) .works-category-grid .work-thumb > img,
:is(.work-list-page, .maker-detail-page) .works-category-grid .work-thumb > .work-cover{
  display:block !important;
  width:100% !important;
  height:100% !important;
  max-width:none !important;
  aspect-ratio:auto !important;
  object-fit:cover !important;
  object-position:center center !important;
  border-radius:0 !important;
  background:transparent !important;
}

:is(.work-list-page, .maker-detail-page) .work-card.work-list-card .work-info{
  padding:8px 0 0 !important;
  background:transparent !important;
}

:is(.work-list-page, .maker-detail-page) .work-card.work-list-card .work-title{
  margin:0 0 7px !important;
  font-size:14px !important;
  font-weight:800 !important;
  line-height:1.34 !important;
  display:-webkit-box !important;
  -webkit-box-orient:vertical !important;
  -webkit-line-clamp:3 !important;
  overflow:hidden !important;
}

:is(.work-list-page, .maker-detail-page) .work-card.work-list-card .work-code{
  margin-right:4px;
}

:is(.work-list-page, .maker-detail-page) .work-card.work-list-card .work-meta-row{
  margin-top:0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:10px !important;
  flex-wrap:wrap !important;
  color:#94a3b8 !important;
  font-size:12px !important;
  line-height:1.25 !important;
}

:is(.work-list-page, .maker-detail-page) .work-card.work-list-card .work-meta-row .meta-right{
  margin-left:0 !important;
  text-align:left !important;
}

@media (max-width:1200px){
  :is(.work-list-page, .maker-detail-page) .works-grid.works-category-grid{
    grid-template-columns:repeat(4, minmax(0, 1fr)) !important;
  }
}

@media (max-width:1080px){
  :is(.work-list-page, .maker-detail-page) .works-grid.works-category-grid{
    grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  }
}

@media (max-width:900px){
  :is(.work-list-page, .maker-detail-page) .works-grid.works-category-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    gap:22px 14px !important;
  }
}

@media (max-width:760px){
  :is(.work-list-page, .maker-detail-page) .works-grid.works-category-grid{
    grid-template-columns:1fr !important;
    gap:20px !important;
  }
}

}