/* Book rack with real covers: same frontal rack and ledge as the adopted design, the cover image fills the book. */
.shelf-book-cover.is-real{background:#fffdf3}
.shelf-book-cover.is-real>img,.shelf-rack .shelf-book-cover.is-real>img,.shelf-preview-grid .shelf-book-cover.is-real>img{height:100%;width:100%;object-fit:cover;border:0}
.shelf-rack .shelf-book-cover.is-real{min-height:0}
.shelf-book-caption{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;font-size:13px!important;line-height:1.6!important;margin-bottom:0}
.shelf-chapter{font-size:12px!important}
.shelf-detail-button{font-size:12px!important}
.shelf-heading p{font-size:14px!important}
.shelf-demo-badge{font-size:11px!important}
.shelf-disclosure{font-size:12px!important}
.shelf-sort{display:flex;justify-content:center;gap:8px;margin:-12px 0 28px}
.shelf-sort button{min-height:40px;padding:8px 18px;border:2px solid #171a17;background:#fffdf3;font-size:14px;font-weight:800;color:#171a17}
.shelf-sort button[aria-pressed="true"]{background:#171a17;color:#fffdf3}
#shelf-preview{width:min(860px,calc(100% - 24px))}
.shelf-preview-grid .shelf-book-cover.is-real{aspect-ratio:.7}
.shelf-intro>p{font-size:15px!important;line-height:1.9}
.shelf-basics{background:#fffdf3;border:1px solid #c9c0a4;padding:12px 16px;margin:0 0 16px}
.shelf-basics-title{font-weight:800;font-size:13px!important;margin:0 0 6px!important}
.shelf-basics ul{margin:0;padding-left:1.2em;font-size:13px;line-height:1.8}
.shelf-reads-title{font-weight:800;font-size:13px!important;margin:0 0 6px!important}
.shelf-article-link{display:block;font-size:14px;font-weight:700;line-height:1.6;color:#171a17;text-decoration:underline;text-underline-offset:4px;margin:0 0 8px}
.shelf-items{margin-top:26px;border-top:2px solid #171a17;padding-top:18px}
.shelf-items h3{font-size:18px;font-weight:900;margin:0 0 4px}
.shelf-items-ad{font-size:12px;color:#6b6656;margin:0 0 14px}
.shelf-items ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px}
.shelf-item{display:flex;gap:12px;align-items:flex-start;background:#fff;border:1px solid #d8d2bf;padding:12px}
.shelf-item img{width:72px;height:auto;aspect-ratio:.7;object-fit:cover;border:1px solid #d8d2bf;display:block}
.shelf-item-title{font-size:14px;font-weight:800;line-height:1.5;margin:0 0 4px}
.shelf-item-credit{font-size:12px;color:#6b6656;margin:0 0 8px}
.shelf-item-buy{display:inline-block;background:#ff9900;color:#171a17;font-weight:800;font-size:13px;padding:6px 12px;text-decoration:none}
@media(max-width:650px){.shelf-rack .shelf-book-cover.is-real{min-height:0}.shelf-sort{margin:0 0 22px}.shelf-book-caption{font-size:11px!important}.shelf-chapter{font-size:10px!important}.shelf-items ul{grid-template-columns:1fr}}

/* Hand-written POP cards above each book, like a bookshop's staff picks. With frame images (pop/ folder, drawn without text)
   the text sits on the image; without them a CSS sticky note is used. Colours and tilt alternate along the rack. */
.shelf-pop{position:relative;display:flex;align-items:center;justify-content:center;height:128px;margin:0 2px 18px;padding:16px 12px 12px;text-align:center;background:#fff6a8;border:1.5px solid #3b3424;box-shadow:2px 3px 0 #3b342433;transform:rotate(-2deg);font-family:"Yomogi","Zen Kurenaido","Klee One",cursive;color:#2b2416}
.shelf-pop::before{content:"";position:absolute;top:-9px;left:50%;width:46px;height:16px;margin-left:-23px;background:#e9dcb4cc;border:1px solid #c9b98c;transform:rotate(3deg)}
.shelf-slot:nth-child(4n+2) .shelf-pop{background:#ffd6dc;transform:rotate(2deg)}
.shelf-slot:nth-child(4n+3) .shelf-pop{background:#d4f1df;transform:rotate(-1deg)}
.shelf-slot:nth-child(4n+4) .shelf-pop{background:#fffdf3;transform:rotate(1.5deg)}
.shelf-pop{--pop-h:128px}
.shelf-pop.has-frame,.shelf-slot .shelf-pop.has-frame{background:var(--pop-frame) center/100% 100% no-repeat;border:0;box-shadow:none;padding:calc(var(--pop-h)*var(--pt)) calc(100%*var(--pr)) calc(var(--pop-h)*var(--pb)) calc(100%*var(--pl))}
.shelf-pop.has-frame p{display:block;-webkit-line-clamp:unset;overflow:visible;font-size:14px;line-height:1.45}
.shelf-pop.is-dark p,.shelf-comment.is-dark p{color:#f7f3e6}
.shelf-comment.is-dark .shelf-comment-title{color:#ffd76a}
.shelf-pop.has-frame::before{display:none}
.shelf-pop p{margin:0;font-size:15px;line-height:1.5;font-weight:400;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;overflow:hidden}
.shelf-book-button{position:relative}
.shelf-tag{position:absolute;z-index:3;top:-9px;right:-6px;padding:2px 8px;font-size:11px;font-weight:800;line-height:1.5;color:#fff;background:#c8281e;border:1.5px solid #171a17;transform:rotate(4deg);box-shadow:1px 2px 0 #171a1740;letter-spacing:.04em}
.shelf-tag.is-new{background:#1d5cc2}
.shelf-tag.is-hot{background:#c8281e}
.shelf-tag.is-pick{background:#e8a317;color:#171a17}
.shelf-comment{position:relative;margin:0 0 18px;padding:16px 18px 14px;background:#fff6a8;border:1.5px solid #3b3424;box-shadow:2px 3px 0 #3b342433;transform:rotate(-.6deg);font-family:"Yomogi","Zen Kurenaido","Klee One",cursive;color:#2b2416}
.shelf-comment.has-frame{background:var(--pop-frame) center/100% 100% no-repeat;border:0;box-shadow:none;min-height:150px;padding:max(16px,calc(170px*var(--pt))) max(18px,calc(100%*var(--pr))) max(14px,calc(170px*var(--pb))) max(18px,calc(100%*var(--pl)))}
.shelf-comment p{margin:0!important;font-size:16px!important;line-height:1.75!important}
.shelf-comment .shelf-comment-title{font-size:13px!important;font-weight:700;color:#c8281e;margin:0 0 4px!important}
.shelf-rack{row-gap:34px}
@media(max-width:900px){.shelf-pop p,.shelf-pop.has-frame p{font-size:13px}}
@media(max-width:650px){.shelf-pop{--pop-h:112px;height:112px;padding:12px 6px 8px;margin-inline:0}.shelf-pop::before{width:32px;margin-left:-16px}.shelf-pop p,.shelf-pop.has-frame p{font-size:11.5px;line-height:1.4;-webkit-line-clamp:5}.shelf-tag{font-size:9px;padding:1px 5px;right:-3px}.shelf-comment p{font-size:15px!important}}
@media(prefers-reduced-motion:reduce){.shelf-pop,.shelf-comment,.shelf-tag{transform:none!important}}
/* v0.7.6: on PC the work's introduction opens larger, with bigger type. */
@media(min-width:1000px){
  #shelf-preview{width:min(1180px,calc(100% - 48px));max-height:calc(100vh - 40px);padding:36px 56px 44px}
  #shelf-preview h2{font-size:32px!important;line-height:1.4}
  #shelf-preview .eyebrow{font-size:12px!important}
  #shelf-preview .shelf-preview-grid{grid-template-columns:minmax(0,300px) 1fr;gap:40px}
  #shelf-preview .shelf-intro>p{font-size:18px!important;line-height:1.9}
  #shelf-preview .shelf-comment{min-height:170px}
  #shelf-preview .shelf-comment p{font-size:19px!important;line-height:1.8!important}
  #shelf-preview .shelf-comment .shelf-comment-title{font-size:15px!important}
  #shelf-preview .shelf-basics-title{font-size:15px!important}
  #shelf-preview .shelf-basics ul{font-size:16px;line-height:1.85}
  #shelf-preview .shelf-intro h3,#shelf-preview .shelf-intro strong{font-size:16px}
  #shelf-preview .shelf-intro a{font-size:16px}
  #shelf-preview .shelf-items h3{font-size:22px}
  #shelf-preview .shelf-items-ad{font-size:13px}
  #shelf-preview .shelf-items ul{grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:16px}
  #shelf-preview .shelf-items li{font-size:16px}
  #shelf-preview .shelf-preview-close{font-size:14px;padding:12px 18px}
}
/* Latest volumes in the work's introduction. */
.shelf-series-title{font-size:15px;font-weight:900;margin:22px 0 10px;padding-top:14px;border-top:1px dashed #a7ae98}
.shelf-items ul.shelf-series{grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}
.shelf-item-nocover{display:grid;place-items:center;width:64px;aspect-ratio:.7;background:#e8e4d7;border:1px solid #c9c0a4;font-size:9px;line-height:1.3;padding:4px;text-align:center;color:#4e5545;overflow:hidden}
@media(min-width:1000px){#shelf-preview .shelf-series-title{font-size:18px}#shelf-preview .shelf-items ul.shelf-series{grid-template-columns:repeat(auto-fill,minmax(230px,1fr))}}