.prp-books-carousel { position: relative; padding-inline: 48px; min-width: 0; }
#books-slider, #books-archive { display: flex; flex-wrap: nowrap; gap: 32px; overflow-x: auto; padding: 8px 0 12px; scroll-snap-type: x mandatory; scrollbar-width: none; touch-action: pan-x pan-y pinch-zoom; align-items: flex-start; }
#books-slider::-webkit-scrollbar, #books-archive::-webkit-scrollbar { display: none; }
#books-slider > [data-carousel-item] { flex: 0 0 calc((100% - 64px) / 3); width: auto; min-width: 0; height: auto; scroll-snap-align: start; }
#books-archive > div { flex: 0 0 calc((100% - 96px) / 4); width: auto; min-width: 0; scroll-snap-align: start; scroll-margin-top: 160px; }
#books-slider > div > a.relative, #books-archive > div > a.relative { display: block; max-width: 100%; flex-shrink: 0; }
.prp-book-arrow { position: absolute; top: var(--book-arrow-top, 180px); transform: translateY(-50%); z-index: 20; display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 9999px; border: 1px solid #334155; background: rgba(15,23,42,.92); color: #fff; box-shadow: 0 4px 12px #0003; cursor: pointer; }
.prp-book-arrow:disabled { opacity: .3; cursor: default; }
.prp-book-arrow:focus-visible { outline: 2px solid #c6a34b; outline-offset: 3px; }
.prp-prev { left: 0; } .prp-next { right: 0; }
@media (min-width: 768px) and (max-width: 1023px) {
  #books-slider > [data-carousel-item], #books-archive > div { flex-basis: calc((100% - 32px) / 2); }
}
@media (max-width: 767px) {
  .prp-books-carousel { padding-inline: 40px; }
  #books-slider, #books-archive { gap: 16px; }
  #books-slider > [data-carousel-item], #books-archive > div { flex: 0 0 100%; width: 100%; }
  .prp-book-arrow { width: 32px; height: 40px; }
  #books-slider > div > a.relative, #books-archive > div > a.relative { width: 256px; }
}