/* Front-facing picture books, sitting on a bamboo-and-wood shelf. */
dialog.shelf-shell{background:#fff7e5;color:#254c3d;width:min(1080px,96vw)}
.shelf-shell .reader{padding:20px 28px 28px;overflow-x:hidden}
.shelf-intro{text-align:center;margin:8px auto 16px;max-width:620px}
.shelf-eyebrow{font-size:12px;letter-spacing:.14em;font-weight:800;color:#7a633e}
.shelf-intro h2{font-size:clamp(22px,3.2vw,32px);line-height:1.2;margin:10px 0}
.shelf-intro p{font-size:16px;line-height:1.5;margin:0}
.shelf-cabinet{border:10px solid #966135;border-bottom-width:0;border-radius:22px 22px 8px 8px;background:radial-gradient(ellipse at 50% 12%,#eed7a5,#c69a62);box-shadow:inset 0 10px 22px #64401938,0 10px 20px #71461622;overflow:hidden}
.shelf-rail{display:flex;align-items:flex-end;justify-content:safe center;gap:30px;padding:30px 26px 22px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-padding-inline:26px;overscroll-behavior-x:contain;touch-action:pan-x pan-y;scrollbar-width:thin;scrollbar-color:#9a663c #edcf94;border-bottom:20px solid #9c6539;background:linear-gradient(0deg,#c59054 0 7px,#efcb8c 7px 13px,transparent 13px);box-shadow:inset 0 -8px 10px #62452330}
.shelf-book{position:relative;isolation:isolate;flex:0 0 clamp(190px,25vw,260px);width:clamp(190px,25vw,260px);padding:0;border:0;border-radius:6px 14px 14px 6px;background:#174c43;color:#fff3c8;box-shadow:5px 6px 0 #e8d7ae,8px 9px 0 #9c754b,10px 18px 18px #4c2e3955;scroll-snap-align:center;text-align:center;cursor:pointer;transition:transform .26s,box-shadow .26s;transform-origin:50% 100%;-webkit-tap-highlight-color:transparent}
.shelf-book::after{content:'';position:absolute;pointer-events:none;inset:10px 9px 10px 18px;border:1px solid #efd99488;border-radius:2px 7px 7px 2px;z-index:2}
.shelf-berry{background:#754854}
.shelf-binding{position:absolute;inset:0 auto 0 0;width:16px;border-radius:5px 0 0 5px;background:linear-gradient(90deg,#0005,#fff2 35%,#0002 75%,transparent);z-index:3}
.shelf-cover{display:flex;flex-direction:column;align-items:center;min-height:345px;gap:12px;padding:24px 20px 22px 28px;background:repeating-linear-gradient(0deg,transparent,transparent 2px,#fff1 3px,transparent 4px);border-radius:inherit}
.shelf-brand{font-size:11px;letter-spacing:.15em;font-weight:800}
.shelf-cover strong{font-size:clamp(21px,2.2vw,25px);line-height:1.2;min-height:2.4em;display:flex;align-items:center;justify-content:center;overflow-wrap:normal}
.shelf-cover img{display:block;width:100%;aspect-ratio:1.2;object-fit:cover;border:3px solid #e5ce8e;border-radius:50% 50% 7px 7px;box-sizing:border-box}
.shelf-note{font-size:10px;letter-spacing:.045em;line-height:1.5;min-height:1.5em}
.shelf-open{font-size:12px;font-weight:800;margin-top:auto;line-height:1.4}
.shelf-hint{text-align:center;font-size:12px!important;letter-spacing:.045em;line-height:1.5!important;margin:20px 0 0!important;color:#6b6444}
.shelf-book:focus-visible,.shelf-rail:focus-visible{outline:4px solid #e4a32c;outline-offset:6px}
.shelf-book.shelf-chosen{transform:translateY(-16px) rotate(-3deg);box-shadow:5px 6px 0 #e8d7ae,8px 9px 0 #9c754b,12px 28px 25px #4c2e3955}
@media(hover:hover){.shelf-book:hover{transform:translateY(-10px) rotate(-2deg)}}
@media(max-width:650px){.shelf-shell .reader{padding:12px 12px 22px}.shelf-intro{margin:8px 6px 16px}.shelf-cabinet{border-width:6px;border-bottom-width:0}.shelf-rail{gap:22px;padding:25px 18px 22px;scroll-padding-inline:18px}.shelf-book{flex-basis:min(69vw,250px);width:min(69vw,250px)}.shelf-cover{min-height:315px;padding:20px 18px 20px 26px;gap:10px}.shelf-cover strong{font-size:22px}.shelf-intro p{font-size:15px}.shelf-hint{font-size:11px!important}}
@media(prefers-reduced-motion:reduce){.shelf-book{transition:none}.shelf-book:hover,.shelf-book.shelf-chosen{transform:none}}