/* Mobile-only canvas override. Loaded last so theme layers cannot restore the
   former ambient gradients, grid or grain. */
@media (max-width:900px) {
  html:has(body.home-page),
  html body.home-page,
  html body.home-page > main#main-content,
  html.auth-hint-member body.home-page > main#main-content,
  html body.home-page:is(.auth-member,.auth-has-access) > main#main-content {
    background-color:#fff !important;
    background-image:none !important;
  }

  html body.home-page::before {
    background:#fff !important;
  }

  html body.home-page > :is(.bg-glow,.grain) {
    display:none !important;
  }

  html body.home-page > .bg-lines {
    display:block !important;
    opacity:1 !important;
    filter:none !important;
  }

  html body.home-page .hero {
    min-height:350px !important;
  }

  html body.home-page .hero__copy {
    padding-top:108px !important;
    padding-bottom:24px !important;
  }

  html body.home-page .gallery {
    margin-top:18px !important;
  }

  html body.home-page .gallery .gallery-toolbar {
    display:grid !important;
    grid-template-columns:minmax(0,1fr) 74px !important;
    align-items:center !important;
    gap:8px !important;
    overflow:visible !important;
  }

  html body.home-page .gallery .gallery-filter-scroll {
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
  }

  html body.home-page .gallery .gallery-filter-tags {
    gap:5px !important;
  }

  html body.home-page .gallery .gallery-filter-tag {
    --type-mobile-body:10px;
    min-height:22px !important;
    padding-inline:9px !important;
    font-size:10px !important;
    font-weight:400 !important;
    letter-spacing:-.01em !important;
  }

  html body.home-page .gallery .gallery-sort[data-project-sort] {
    position:relative !important;
    top:0 !important;
    right:auto !important;
    grid-column:2 !important;
    justify-self:end !important;
    width:74px !important;
    height:22px !important;
    flex-basis:74px !important;
  }

  html body.home-page .gallery .gallery-sort[data-project-sort] > summary {
    --type-mobile-body:10px;
    width:74px !important;
    min-width:74px !important;
    height:22px !important;
    min-height:22px !important;
    box-sizing:border-box !important;
    padding:0 8px 0 10px !important;
    gap:5px !important;
    border-color:rgba(29,29,31,.12) !important;
    border-width:1px !important;
    border-radius:999px !important;
    color:#5f5f63 !important;
    box-shadow:none !important;
    font-family:inherit !important;
    font-size:10px !important;
    font-weight:400 !important;
    line-height:1 !important;
    letter-spacing:-.01em !important;
    overflow:hidden !important;
  }

  html body.home-page .gallery .gallery-sort[data-project-sort] > summary > span {
    min-width:0 !important;
    font-family:inherit !important;
    font-size:inherit !important;
    font-weight:inherit !important;
    line-height:1 !important;
  }

  html body.home-page .gallery .gallery-sort[data-project-sort] > summary svg {
    width:9px !important;
    min-width:9px !important;
    max-width:9px !important;
    height:9px !important;
    min-height:9px !important;
    max-height:9px !important;
    flex:0 0 9px !important;
    stroke-width:1.35 !important;
  }

  html body.home-page .gallery .showcase-card__meta {
    min-height:32px !important;
    padding:7px 1px 0 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:12px !important;
  }

  html body.home-page .gallery .showcase-card__heading {
    min-width:0 !important;
    width:auto !important;
    flex:1 1 auto !important;
  }

  html body.home-page .gallery .showcase-card__meta > .card-likes,
  html body.home-page .gallery .showcase-card__meta > .card-likes:is(:hover,:active,:focus) {
    position:static !important;
    inset:auto !important;
    z-index:auto !important;
    width:26px !important;
    min-width:26px !important;
    max-width:26px !important;
    height:26px !important;
    min-height:26px !important;
    margin:0 !important;
    padding:0 !important;
    flex:0 0 26px !important;
    display:grid !important;
    place-items:center !important;
    visibility:visible !important;
    opacity:1 !important;
    pointer-events:auto !important;
    color:#28282a !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    filter:none !important;
    transform:none !important;
  }

  html body.home-page .gallery .showcase-card__meta > .card-likes > b {
    display:none !important;
  }

  html body.home-page .gallery .showcase-card__meta > .card-likes:is(.is-liked,[aria-pressed="true"]) {
    color:#d93451 !important;
  }
}
