/* Local to the DBP component. Match these variables to your theme. */
.dbp-books {
  --dbp-ink: #20352e; --dbp-muted: #66746b; --dbp-accent: #2d624d;
  --dbp-paper: #fcfbf7; --dbp-border: #dce2d9;
  --dbp-book-width: clamp(150px, 22cqw, 218px);
  --dbp-book-height: calc(var(--dbp-book-width) * 1.44);
  color: var(--dbp-ink); background: var(--dbp-paper); border: 1px solid var(--dbp-border);
  border-radius: 24px; padding: 30px clamp(16px, 3vw, 36px) 22px; margin: 24px 0;
  font: 16px/1.55 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  container: dbp-shelf / inline-size; isolation: isolate; text-align: left;
}
.dbp-books *, .dbp-books *::before, .dbp-books *::after { box-sizing: border-box; }
/* Opt-in homepage band. JavaScript measures the viewport without its scrollbar. */
.dbp-books[data-dbp-width="full"] {
  box-sizing: border-box; min-width: 0; max-width: none !important;
  width: var(--dbp-full-width, 100%) !important;
  margin-left: var(--dbp-full-shift, 0px) !important; margin-right: 0 !important;
  padding: 40px clamp(16px, 5vw, 96px) 26px;
  border-left: 0; border-right: 0; border-radius: 0;
}
.dbp-books[data-dbp-width="full"] .dbp-heading,
.dbp-books[data-dbp-width="full"] .dbp-shelf-footer { max-width: 1400px; margin-left: auto; margin-right: auto; }
.dbp-books [hidden] { display: none !important; }
.dbp-books .dbp-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; position: relative; z-index: 2; }
.dbp-books .dbp-heading-copy { min-width: 0; }
.dbp-books h2.dbp-title { margin: 0; color: var(--dbp-ink); font: 500 clamp(26px, 3.3cqw, 36px)/1.18 Georgia, "Times New Roman", serif; letter-spacing: -.025em; text-transform: none; }
.dbp-books p.dbp-subtitle { color: var(--dbp-muted); margin: 8px 0 0; font-size: 14px; }
.dbp-books .dbp-heading-actions { flex-shrink: 0; padding-top: 6px; }
.dbp-books a.dbp-view-all { color: var(--dbp-accent); text-decoration: none; font-size: 13px; font-weight: 600; white-space: nowrap; }
.dbp-books a.dbp-view-all:hover { text-decoration: underline; }
/* A normal scrollable list is the fallback without JavaScript. */
.dbp-books .dbp-track { display: grid; grid-auto-flow: column; grid-auto-columns: 83%; gap: 22px; list-style: none; margin: 0; padding: 24px 3px; overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior-x: contain; scrollbar-width: thin; }
.dbp-books .dbp-card { display: flex; flex-direction: column; list-style: none; min-width: 0; margin: 0; padding: 0; border: 1px solid var(--dbp-border); border-radius: 12px; background: #fff; scroll-snap-align: start; }
.dbp-books .dbp-cover { display: flex; align-items: center; justify-content: center; flex-shrink: 0; height: 270px; padding: 18px; text-decoration: none; background: #f0eee6; }
.dbp-books .dbp-cover img { display: block; height: 100%; width: 100%; object-fit: contain; margin: 0; padding: 0; border: 0; border-radius: 2px; }
.dbp-books .dbp-cover-placeholder { display: grid; place-items: center; width: 100%; height: 100%; padding: 16px; color: var(--dbp-ink); background: #e4e7db; text-align: center; font: 24px/1.3 Georgia, serif; }
.dbp-books .dbp-card-body { display: flex; flex: 1; flex-direction: column; align-items: flex-start; padding: 20px; }
.dbp-books p.dbp-badge { margin: 0 0 7px; color: var(--dbp-accent); font-size: 11px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.dbp-books h3.dbp-book-title { margin: 0; color: var(--dbp-ink); font: 600 18px/1.3 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; text-transform: none; letter-spacing: -.015em; overflow-wrap: anywhere; }
.dbp-books p.dbp-description { margin: 9px 0 18px; color: var(--dbp-muted); font-size: 14px; overflow-wrap: anywhere; }
.dbp-books a.dbp-amazon { display: inline-flex; justify-content: center; align-items: center; gap: 24px; min-height: 46px; margin-top: auto; padding: 12px 22px; border-radius: 8px; color: #fff; background: var(--dbp-accent); text-decoration: none; font-size: 13px; font-weight: 600; }
.dbp-books a.dbp-amazon:hover { color: #fff; background: var(--dbp-ink); }
.dbp-books .dbp-book-shadow { display: none; }
/* Covers orbit in 3D. The front book's text stays flat and readable. */
.dbp-orbit .dbp-stage { position: relative; overflow: hidden; margin: 0 -16px; }
.dbp-orbit .dbp-stage::after { content: ""; position: absolute; left: 15%; bottom: 26px; width: 70%; height: 68px; background: radial-gradient(ellipse, #b2bd9b23 0%, transparent 68%); pointer-events: none; }
.dbp-orbit .dbp-track { position: relative; display: block; height: calc(var(--dbp-book-height) + 112px); padding: 0; margin: 0; overflow: visible; perspective: 1100px; perspective-origin: 50% 45%; touch-action: pan-y pinch-zoom; cursor: grab; scroll-snap-type: none; user-select: none; -webkit-user-select: none; }
.dbp-orbit .dbp-card { position: absolute; display: block; top: 48px; left: 50%; width: var(--dbp-book-width); height: var(--dbp-book-height); border: 0; border-radius: 0; background: transparent; opacity: var(--dbp-opacity, 1); z-index: var(--dbp-layer, 1); transform: translateX(-50%) translate3d(var(--dbp-x, 0px), var(--dbp-y, 0px), var(--dbp-z, 0px)) rotateY(var(--dbp-angle, 0deg)) scale(var(--dbp-scale, 1)); transform-origin: 50% 50%; transition: transform 850ms cubic-bezier(.22,.75,.2,1), opacity 650ms ease, visibility 0s; }
.dbp-orbit .dbp-card[data-dbp-away="true"] { visibility: hidden; opacity: 0; pointer-events: none; transition: transform 850ms cubic-bezier(.22,.75,.2,1), opacity 650ms ease, visibility 0s 850ms; }
.dbp-orbit .dbp-cover { position: relative; width: 100%; height: 100%; padding: 0; background: transparent; filter: blur(var(--dbp-blur, 0px)); transition: filter 750ms ease; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.dbp-orbit .dbp-cover img { width: auto; max-width: 100%; height: 100%; max-height: 100%; object-fit: contain; box-shadow: 3px 6px 10px #1e302b1f; -webkit-user-drag: none; }
.dbp-orbit .dbp-card[data-dbp-active="true"] .dbp-cover { animation: dbp-float 4.8s ease-in-out infinite; }
.dbp-orbit .dbp-book-shadow { position: absolute; display: block; left: 8%; bottom: -32px; width: 84%; height: 23px; border-radius: 50%; background: #233e3152; filter: blur(11px); transform: scale(.88); pointer-events: none; }
.dbp-orbit .dbp-card[data-dbp-active="true"] .dbp-book-shadow { animation: dbp-shadow 4.8s ease-in-out infinite; }
.dbp-orbit[data-dbp-running="false"] .dbp-cover, .dbp-orbit[data-dbp-running="false"] .dbp-book-shadow { animation-play-state: paused; }
.dbp-orbit[data-dbp-dragging="true"] .dbp-track { cursor: grabbing; }
.dbp-orbit[data-dbp-dragging="true"] .dbp-card, .dbp-orbit[data-dbp-dragging="true"] .dbp-cover { transition: none; }
.dbp-orbit .dbp-card .dbp-card-body { display: none; }
.dbp-orbit .dbp-details { min-height: 184px; max-width: 540px; margin: -5px auto 0; }
.dbp-orbit .dbp-details .dbp-card-body { align-items: center; padding: 0 10px; text-align: center; animation: dbp-detail-in 400ms ease both; }
.dbp-orbit .dbp-details h3.dbp-book-title { font: 500 clamp(24px, 2.7cqw, 30px)/1.2 Georgia, "Times New Roman", serif; }
.dbp-orbit .dbp-details p.dbp-description { max-width: 450px; margin: 9px auto 17px; font-size: 14px; }
.dbp-orbit .dbp-details a.dbp-amazon { min-width: 190px; }
.dbp-books .dbp-navigation { display: flex; justify-content: center; gap: 10px; margin: 12px 0 25px; }
.dbp-books button.dbp-arrow { appearance: none; display: inline-grid; place-items: center; width: 48px; min-width: 48px; height: 48px; min-height: 48px; margin: 0; padding: 0; border: 1px solid var(--dbp-border); border-radius: 50%; background: transparent; color: var(--dbp-ink); font: 22px/1 sans-serif; cursor: pointer; box-shadow: none; text-transform: none; }
.dbp-books button.dbp-arrow:hover { color: #fff; background: var(--dbp-accent); border-color: var(--dbp-accent); }
.dbp-books button.dbp-toggle { width: 40px; min-width: 40px; height: 40px; min-height: 40px; align-self: center; font-size: 15px; background: #eaf0e7; border-color: transparent; }
.dbp-books button.dbp-toggle:hover { background: var(--dbp-accent); }
.dbp-books .dbp-shelf-footer { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 15px; padding-top: 16px; border-top: 1px solid var(--dbp-border); font-size: 12px; color: var(--dbp-muted); }
.dbp-books .dbp-position { display: grid; gap: 7px; }
.dbp-books .dbp-progress { display: block; height: 2px; width: 104px; background: #d9e1d3; overflow: hidden; }
.dbp-books .dbp-progress > span { display: block; height: 100%; width: 0; background: var(--dbp-accent); transition: width 600ms ease; }
.dbp-books .dbp-swipe { display: flex; align-items: center; gap: 9px; }
.dbp-books .dbp-jump { max-width: 240px; margin: 0; }
.dbp-books .dbp-jump select { display: block; max-width: 100%; min-height: 44px; padding: 8px 28px 8px 11px; border: 1px solid var(--dbp-border); border-radius: 7px; color: var(--dbp-ink); background: var(--dbp-paper); font: 13px/1.4 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; text-transform: none; }
.dbp-books .dbp-sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.dbp-books :focus-visible { outline: 3px solid #a86121; outline-offset: 4px; }
.dbp-orbit .dbp-track:focus-visible { outline-offset: -5px; border-radius: 12px; }
.dbp-orbit .dbp-cover:focus-visible { outline-offset: 5px; }
@keyframes dbp-float { 0%, 100% { transform: translateY(-4px); } 50% { transform: translateY(-12px); } }
@keyframes dbp-shadow { 0%, 100% { transform: scale(.9); opacity: .85; } 50% { transform: scale(.76); opacity: .6; } }
@keyframes dbp-detail-in { from { opacity: .2; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } }
@container dbp-shelf (min-width: 400px) { .dbp-books:not(.dbp-orbit) .dbp-track { grid-auto-columns: calc((100% - 22px) / 2); } }
@container dbp-shelf (min-width: 800px) { .dbp-books:not(.dbp-orbit) .dbp-track { grid-auto-columns: calc((100% - 66px) / 4); } }
/* A wide carousel gets larger covers; narrow layouts keep their existing size. */
@container dbp-shelf (min-width: 700px) {
  .dbp-orbit .dbp-track {
    --dbp-book-width: clamp(218px, 28cqw, 300px);
    --dbp-book-height: calc(var(--dbp-book-width) * 1.44);
  }
  .dbp-orbit[data-dbp-width="full"] .dbp-track {
    --dbp-book-width: clamp(218px, 24cqw, 340px);
    --dbp-book-height: calc(var(--dbp-book-width) * 1.44);
  }
}
@container dbp-shelf (max-width: 540px) {
  .dbp-books .dbp-heading { flex-direction: column; gap: 12px; }
  .dbp-books .dbp-heading-actions { padding: 0; }
  .dbp-orbit .dbp-stage { margin: 0 -16px; }
  .dbp-orbit .dbp-track { perspective: 850px; height: calc(var(--dbp-book-height) + 107px); }
  .dbp-orbit .dbp-card { top: 45px; }
  .dbp-orbit .dbp-details { min-height: 195px; }
  .dbp-books .dbp-jump { max-width: none; flex-basis: 100%; }
  .dbp-books .dbp-jump select { width: 100%; font-size: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .dbp-orbit .dbp-card, .dbp-orbit .dbp-cover, .dbp-books .dbp-progress > span { transition: none; }
  .dbp-orbit .dbp-card[data-dbp-active="true"] .dbp-cover,
  .dbp-orbit .dbp-card[data-dbp-active="true"] .dbp-book-shadow,
  .dbp-orbit .dbp-details .dbp-card-body { animation: none; }
}
