/* Owner-approved option A. Scoped to the home catalog; ranking stays separate. */
/* Double the approved inter-category spacing: 36–56px becomes 72–112px. */
.catalog .shelf { padding-bottom: clamp(72px, 16vw, 112px); }
.catalog .shelf > .container { container-type: inline-size; }
.catalog .shelf__head { align-items: center; }
.catalog .shelf__title { scroll-margin-top: 108px; }
.catalog .shelf__tools, .catalog .shelf__nav { display: flex; align-items: center; flex: 0 0 auto; }
.catalog .shelf__tools { gap: 12px; }
.catalog .shelf__nav { gap: 6px; }
.catalog .shelf__nav[hidden] { display: none; }
.catalog .shelf__arrow { display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 12px; color: var(--text); background: var(--surface); cursor: pointer; }
.catalog .shelf__arrow svg { width: 18px; height: 18px; }
.catalog .shelf__arrow:disabled { opacity: .3; cursor: default; }
.catalog .shelf__arrow:hover:enabled { background: var(--surface-2); }
.catalog .shelf__arrow:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
/* Covers: 357 opaque pixels across a 394px canvas, rendered at 92% of the card.
   Reduce the complete visible gap by 30%, including both transparent margins.
   0.04991878 = .30 * (1 - .92 * 357 / 394). Keep card/watch dimensions unchanged. */
.catalog .shelf__rail { --track-insets: 32px; --track-count: 2.25; --rail-overhang: var(--gutter);
  --track-width: calc((100cqw + var(--rail-overhang) - var(--track-insets)) / var(--track-count));
  gap: max(0px, calc(11.2px - var(--track-width) * 0.04991878)); margin: 0 calc(var(--gutter) * -1) 0 0; padding: 0 0 4px; cursor: grab; user-select: none; }
.catalog .shelf__rail.is-dragging { cursor: grabbing; scroll-snap-type: none; }
.catalog .shelf__item { flex: 0 0 calc((100% - 32px) / 2.25); width: auto; max-width: none; }
.catalog .face-card { background: transparent; border-radius: 0; box-shadow: none; overflow: visible; contain: none; }
.catalog .face-card__image { flex: none; padding: 0; aspect-ratio: 1 / 1.150558; }
.catalog .face-card__screen { width: 92%; max-width: none; pointer-events: none; }
.catalog .face-card__content { background: transparent; padding: 8px 0 0; }
.catalog .face-card__name { margin: 0; font-size: 17px; line-height: 1.35; font-weight: 600; text-transform: none; text-align: center; overflow-wrap: anywhere; }
@container (min-width: 560px) {
  .catalog .shelf__rail { --track-insets: 48px; --track-count: 3.35; }
  .catalog .shelf__item { flex-basis: calc((100% - 48px) / 3.35); }
}
@container (min-width: 850px) {
  .catalog .shelf__rail { --track-insets: 64px; --track-count: 4.35; }
  .catalog .shelf__item { flex-basis: calc((100% - 64px) / 4.35); }
}
@container (min-width: 1050px) {
  .catalog .shelf__rail { --track-insets: 80px; --track-count: 5.35; }
  .catalog .shelf__item { flex-basis: calc((100% - 80px) / 5.35); }
}
@media (max-width: 599px) {
  .catalog .shelf__tools { gap: 6px; }
  .catalog .shelf__tools .shelf__count { display: none; }
}
