/* Fit a whole number of category tiles between the navigation arrows. */
@media (max-width: 1100px) {
  html body:not(.admin-body) .celebration-group-panel.active {
    display:grid !important;
    grid-template-columns:24px minmax(0,1fr) 24px !important;
    gap:4px !important;
    align-items:center !important;
    padding:0 !important;
  }
  html body:not(.admin-body) .celebration-track {
    display:flex !important;
    width:100% !important;
    min-width:0 !important;
    gap:10px !important;
    padding:4px 0 6px !important;
    margin:0 !important;
    scroll-snap-type:x mandatory !important;
    scroll-padding:0 !important;
    overflow-x:auto !important;
  }
  html body:not(.admin-body) .celebration-track .celebration-item {
    flex:0 0 calc((100% + 10px) / var(--category-visible-slots, 3) - 10px) !important;
    width:calc((100% + 10px) / var(--category-visible-slots, 3) - 10px) !important;
    min-width:0 !important;
    padding:0 !important;
    scroll-snap-align:start !important;
  }
  html body:not(.admin-body) .celebration-item span {
    width:50px !important;
    height:50px !important;
    max-width:100% !important;
    box-sizing:border-box !important;
  }
  html body:not(.admin-body) .celebration-item img {
    width:100% !important;
    height:100% !important;
    object-fit:contain !important;
  }
  html body:not(.admin-body) .celebration-item strong {
    max-width:100% !important;
    width:100% !important;
  }
  html body:not(.admin-body) .celebration-group-panel > .celebration-arrow {
    position:static !important;
    width:24px !important;
    height:44px !important;
    padding:0 !important;
    transform:none !important;
  }
}