/* Light-theme works layout: edge-to-edge cards with a tighter grid. */
html:not(.theme-dark) #worksView.public-grid-mode #publicWorksPanel #publicWorks.works-list,
html:not(.theme-dark) #worksView.my-grid-mode #myWorksPanel #myWorks.works-list {
  width: 100% !important;
  max-width: 100% !important;
  padding-left: 3px !important;
  padding-right: 3px !important;
  box-sizing: border-box !important;
  gap: 3px !important;
  contain: layout paint !important;
  transform: translateZ(0) !important;
}

html:not(.theme-dark) #worksView.public-grid-mode,
html:not(.theme-dark) #worksView.my-grid-mode {
  width: calc(100% + 20px) !important;
  max-width: calc(100% + 20px) !important;
  margin-left: -10px !important;
  margin-right: -10px !important;
  padding-left: 4px !important;
  padding-right: 4px !important;
  box-sizing: border-box !important;
  overflow-x: hidden !important;
}

html:not(.theme-dark) #worksView.public-grid-mode #publicWorksPanel #publicWorks .work-card,
html:not(.theme-dark) #worksView.my-grid-mode #myWorksPanel #myWorks .work-card {
  padding: 1px !important;
}

html:not(.theme-dark) #worksView.public-grid-mode #publicWorksPanel #publicWorks .video-frame,
html:not(.theme-dark) #worksView.my-grid-mode #myWorksPanel #myWorks .video-frame {
  border-radius: 11px !important;
}

/* Android 9 projector keeps the grid tight without touching other APK devices. */
html.mahua-apk-android9:not(.theme-dark) #worksView.public-grid-mode #publicWorksPanel #publicWorks.works-list,
body.mahua-apk-android9:not(.theme-dark) #worksView.public-grid-mode #publicWorksPanel #publicWorks.works-list,
html.mahua-apk-android9:not(.theme-dark) #worksView.my-grid-mode #myWorksPanel #myWorks.works-list,
body.mahua-apk-android9:not(.theme-dark) #worksView.my-grid-mode #myWorksPanel #myWorks.works-list,
html.mahua-apk-projector-720:not(.theme-dark) #worksView.public-grid-mode #publicWorksPanel #publicWorks.works-list,
body.mahua-apk-projector-720:not(.theme-dark) #worksView.public-grid-mode #publicWorksPanel #publicWorks.works-list,
html.mahua-apk-projector-720:not(.theme-dark) #worksView.my-grid-mode #myWorksPanel #myWorks.works-list,
body.mahua-apk-projector-720:not(.theme-dark) #worksView.my-grid-mode #myWorksPanel #myWorks.works-list {
  gap: 2px !important;
  padding-left: 2px !important;
  padding-right: 2px !important;
}

html.mahua-apk-android9:not(.theme-dark) #worksView.public-grid-mode #publicWorksPanel #publicWorks .work-card,
body.mahua-apk-android9:not(.theme-dark) #worksView.public-grid-mode #publicWorksPanel #publicWorks .work-card,
html.mahua-apk-android9:not(.theme-dark) #worksView.my-grid-mode #myWorksPanel #myWorks .work-card,
body.mahua-apk-android9:not(.theme-dark) #worksView.my-grid-mode #myWorksPanel #myWorks .work-card,
html.mahua-apk-projector-720:not(.theme-dark) #worksView.public-grid-mode #publicWorksPanel #publicWorks .work-card,
body.mahua-apk-projector-720:not(.theme-dark) #worksView.public-grid-mode #publicWorksPanel #publicWorks .work-card,
html.mahua-apk-projector-720:not(.theme-dark) #worksView.my-grid-mode #myWorksPanel #myWorks .work-card,
body.mahua-apk-projector-720:not(.theme-dark) #worksView.my-grid-mode #myWorksPanel #myWorks .work-card {
  padding: 0 !important;
}

/* Final APK grid tightening override. Keep this at the end of this file. */
html.mahua-apk-webview:not(.theme-dark) #worksView.public-grid-mode #publicWorksPanel #publicWorks.works-list,
body.mahua-apk-webview:not(.theme-dark) #worksView.public-grid-mode #publicWorksPanel #publicWorks.works-list,
html.mahua-apk-webview:not(.theme-dark) #worksView.my-grid-mode #myWorksPanel #myWorks.works-list,
body.mahua-apk-webview:not(.theme-dark) #worksView.my-grid-mode #myWorksPanel #myWorks.works-list {
  gap: 2px !important;
  padding-left: 2px !important;
  padding-right: 2px !important;
}

html.mahua-apk-webview:not(.theme-dark) #worksView.public-grid-mode #publicWorksPanel #publicWorks .work-card,
body.mahua-apk-webview:not(.theme-dark) #worksView.public-grid-mode #publicWorksPanel #publicWorks .work-card,
html.mahua-apk-webview:not(.theme-dark) #worksView.my-grid-mode #myWorksPanel #myWorks .work-card,
body.mahua-apk-webview:not(.theme-dark) #worksView.my-grid-mode #myWorksPanel #myWorks .work-card {
  padding: 0 !important;
}

/* APK outer edge override: keep this last so APK/WebView also gets the wider grid body. */
html.mahua-apk-webview:not(.theme-dark) #worksView.public-grid-mode,
body.mahua-apk-webview:not(.theme-dark) #worksView.public-grid-mode,
html.mahua-apk-webview:not(.theme-dark) #worksView.my-grid-mode,
body.mahua-apk-webview:not(.theme-dark) #worksView.my-grid-mode,
html.mahua-apk-android9:not(.theme-dark) #worksView.public-grid-mode,
body.mahua-apk-android9:not(.theme-dark) #worksView.public-grid-mode,
html.mahua-apk-android9:not(.theme-dark) #worksView.my-grid-mode,
body.mahua-apk-android9:not(.theme-dark) #worksView.my-grid-mode,
html.mahua-apk-projector-720:not(.theme-dark) #worksView.public-grid-mode,
body.mahua-apk-projector-720:not(.theme-dark) #worksView.public-grid-mode,
html.mahua-apk-projector-720:not(.theme-dark) #worksView.my-grid-mode,
body.mahua-apk-projector-720:not(.theme-dark) #worksView.my-grid-mode {
  width: calc(100% + 20px) !important;
  max-width: calc(100% + 20px) !important;
  margin-left: -10px !important;
  margin-right: -10px !important;
  padding-left: 4px !important;
  padding-right: 4px !important;
  box-sizing: border-box !important;
  overflow-x: hidden !important;
}

/* Feed body edge expansion: match the wider grid and account pages while
   retaining a small tap-safe gutter and preventing horizontal dragging. */
html:not(.theme-dark) #worksView.public-feed-mode,
html:not(.theme-dark) #worksView.my-feed-mode {
  width: calc(100% + 20px) !important;
  max-width: calc(100% + 20px) !important;
  margin-left: -10px !important;
  margin-right: -10px !important;
  padding-left: 4px !important;
  padding-right: 4px !important;
  box-sizing: border-box !important;
  overflow-x: hidden !important;
}

html:not(.theme-dark) #worksView.public-feed-mode #publicWorksPanel #publicWorks.works-list,
html:not(.theme-dark) #worksView.my-feed-mode #myWorksPanel #myWorks.works-list {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 3px !important;
  padding-right: 3px !important;
  overflow-x: hidden !important;
}